# thirdweb

> Frontend, Backend, and Onchain tools to build complete web3 apps — on every EVM chain.

## Batching transactions

Batching transactions allows sending multiple transactions in a single user operation. This can be useful to save on fees, reduce number of user confimations or to ensure that multiple transactions are executed atomically.

A typical example is to do an approval and a transfer in a single userOperation. This way, the transfer will only happen if the approval is successful.

ReactTypeScript

```tsx
import {
  useActiveAccount,
  useSendBatchTransaction,
} from "thirdweb/react";
import { approve, transferFrom } from "thirdweb/extensions/erc20";
 
const smartAccount = useActiveAccount();
const { mutate: sendBatchTransaction } = useSendBatchTransaction();
 
const approveAndTransfer = async () => {
  const transactions = [
    approve({
      contract,
      spender: "0x...",
      value: 100,
    }),
    transferFrom({
      contract,
      from: "0x...",
      to: "0x...",
      amount: 100,
    }),
  ];
  await sendBatchTransaction(transactions);
};
```
## ERC-20 Paymaster

In traditional Ethereum transactions, users pay gas fees in the native cryptocurrency of the network, such as ETH. This requirement can create friction, especially for applications where users interact with smart contracts without holding native tokens. ERC-20 Paymaster enables users pay gas fees using ERC-20 tokens. [Learn more about ERC-20 Paymasters.](https://blog.thirdweb.com/account-abstraction-paymaster-pay-evm-gas-fees-with-usdt-usdc-or-any-other-erc-20-token/)

#### Get Started

Configure the Paymaster In your SDK code, specify the ERC-20 token you wish to use for gas fees.

Currently you may use Lisk LSK, Base USDC or Celo CUSD.

TypeScriptReact.NETUnity

```tsx
import { base, lisk, celo } from "thirdweb/chains";
import { TokenPaymaster, smartWallet } from "thirdweb/wallets";
 
// Have users pay for gas in Base USDC
const usdcWallet = smartWallet({
  chain: base,
  sponsorGas: true,
  overrides: {
    tokenPaymaster: TokenPaymaster.BASE_USDC,
  },
});
 
// Have users pay for gas in Lisk LSK
const lskWallet = smartWallet({
  chain: lisk,
  sponsorGas: true,
  overrides: {
    tokenPaymaster: TokenPaymaster.LISK_LSK,
  },
});
 
// Have users pay for gas in Celo CUSD
const cusdWallet = smartWallet({
  chain: celo,
  sponsorGas: true,
  overrides: {
    tokenPaymaster: TokenPaymaster.CELO_CUSD,
  },
});
```
## Account Factories

By default, the SDK uses a global account factory deployed on most chains:

* [AccountFactory](https://thirdweb.com/thirdweb.eth/AccountFactory) at address [0x85e23b94e7F5E9cC1fF78BCe78cfb15B81f0DF00](https://thirdweb.com/1/0x85e23b94e7F5E9cC1fF78BCe78cfb15B81f0DF00) for Entrypoint v0.6.
* [AccountFactory\_0\_7](https://thirdweb.com/thirdweb.eth/AccountFactory%5F0%5F7) at address [0x4be0ddfebca9a5a4a617dee4dece99e7c862dceb](https://thirdweb.com/1/0x4be0ddfebca9a5a4a617dee4dece99e7c862dceb) for Entrypoint v0.7.

The default account factory deploys standard, immutable accounts with the features listed below. However, you can customize the behavior of your apps smart accounts by deploying your own account factory contracts.

### Deploy your own Account Factory contract

You can deploy your own Account Factory via the [explore page](https://thirdweb.com/explore/smart-wallet) or build your own [ERC 4337](https://eips.ethereum.org/EIPS/eip-4337) compatible factory contract using the [Solidity SDK](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337).

thirdweb offers different kinds of prebuilt account factories:

##### Account Factories comparison

| Factory Type                                                       | Upgradeability                                              | Expected Usage                                                                                                                                                                                 |
| ------------------------------------------------------------------ | ----------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [Standard](https://thirdweb.com/thirdweb.eth/AccountFactory)       | Non-upgradeable                                             | Developer wants to issue simple smart accounts to their users. They do not anticipate that users wallets will need any feature upgrades.                                                       |
| [Managed](https://thirdweb.com/thirdweb.eth/ManagedAccountFactory) | Account upgrades controlled centrally by the app developer. | Developer wants to issue smart accounts to their users. They do anticipate feature upgrades to user wallets, and want to push upgrades to user wallets for seamless/invisible UX for upgrades. |

##### Account comparison

| Simple                                              | Managed                |                                      |
| --------------------------------------------------- | ---------------------- | ------------------------------------ |
| Contracts                                           | AccountFactory Account | ManagedAccountFactory ManagedAccount |
| ERC-4337 Compatible                                 | ✅                      | ✅                                    |
| Can hold native ERC-20, ERC-721 and ERC-1155 Tokens | ✅                      | ✅                                    |
| Multi-signer                                        | ✅                      | ✅                                    |
| Execute transactions in Batches                     | ✅                      | ✅                                    |
| Is the Account Upgradeable                          | ❌                      | ✅                                    |
| Who controls upgrades (?)                           | n/a                    | Admin of the account factory.        |

To learn more about each factory and their respective account implementations, read our [smart contract deep dive](https://blog.thirdweb.com/smart-contract-deep-dive-building-smart-wallets-for-individuals-and-teams/).
## Engine

Learn to setup gasless transactions using TransactionButton and Engine

This guide assumes you have already installed Connect SDK into your application. If you have not, please refer to the [quickstart guide](https://portal.thirdweb.com/connect/quickstart).

* #### Relayer URL  
Obtain the Relayer URL using Engine. For steps on how to obtain the Relayer URL, refer to the [Engine relayer guide](https://portal.thirdweb.com/engine/features/relayers).
* #### Add transaction button  
Add a transaction button for the method you want to sponsor funds for. Pass in the `relayerUrl` and `relayerForwarderAddress`  
```jsx  
function Example() {  
  return (  
    <TransactionButton  
      transaction={() => {  
        // Create a transaction object and return it  
        const tx = prepareContractCall({  
          contract,  
          method: "mint",  
          params: [address, amount],  
        });  
        return tx;  
      }}  
      onTransactionSent={(result) => {  
        console.log("Transaction submitted", result.transactionHash);  
      }}  
      onTransactionConfirmed={(receipt) => {  
        console.log("Transaction confirmed", receipt.transactionHash);  
      }}  
      onError={(error) => {  
        console.error("Transaction error", error);  
      }}  
      gasless={{  
        provider: "engine",  
        relayerUrl: "...",  
        relayerForwarderAddress: "...",  
      }}  
    >  
      Confirm Transaction  
    </TransactionButton>  
  );  
}  
```
## Biconomy

Learn to setup gasless transactions using TransactionButton and Biconomy's gasless relayers.

This guide assumes you have already installed Connect SDK into your application. If you have not, please refer to the [quickstart guide](https://portal.thirdweb.com/connect/quickstart).

* #### API Id & Key  
Obtain an API Id and Key using Biconomy. For steps on how to obtain the API Id and Key, refer to the [Biconomy documentation](https://docs-gasless.biconomy.io/guides/biconomy-dashboard).
* #### Forwarder Address  
Obtain a Forwarder Address using Biconomy for the specified network. The full list of forwarder addresses can be found on [Biconomy documentation](https://docs-gasless.biconomy.io/misc/contract-addresses)
* #### Add transaction button  
Add a transaction button for the method you want to sponsor funds for. Pass in the `apiId` and `apiKey` obtained earlier from Biconomy's dashboard.  
```jsx  
function Example() {  
  return (  
    <TransactionButton  
      transaction={() => {  
        // Create a transaction object and return it  
        const tx = prepareContractCall({  
          contract,  
          method: "mint",  
          params: [address, amount],  
        });  
        return tx;  
      }}  
      onTransactionSent={(result) => {  
        console.log("Transaction submitted", result.transactionHash);  
      }}  
      onTransactionConfirmed={(receipt) => {  
        console.log("Transaction confirmed", receipt.transactionHash);  
      }}  
      onError={(error) => {  
        console.error("Transaction error", error);  
      }}  
      gasless={{  
        provider: "biconomy",  
        relayerForwarderAddress: "...",  
        apiId: "...",  
        apiKey: "...",  
      }}  
    >  
      Confirm Transaction  
    </TransactionButton>  
  );  
}  
```
## OpenZeppelin

Learn to setup gasless transactions using TransactionButton and OpenZeppelin's gasless relayers.

This guide assumes you have already installed Connect SDK into your application. If you have not, please refer to the [quickstart guide](https://portal.thirdweb.com/connect/quickstart).

* #### Relayer URL  
Obtain the Relayer URL using OpenZeppelin. For steps on how to obtain the Relayer URL, refer to the [OpenZeppelin documentation](https://docs.openzeppelin.com/defender/v2/manage.html#relayers).  
* #### Forwarder Address  
Obtain a Forwarder Address using Biconomy for the specified network. Learn how to obtain a forwarder address from [OpenZeppelin documentation](https://docs.openzeppelin.com/contracts/5.x/api/metatx)
* #### Add transaction button  
Add a transaction button for the method you want to sponsor funds for. Pass in the `relayerUrl` and `relayerForwarderAddress`  
```jsx  
function Example() {  
  return (  
    <TransactionButton  
      transaction={() => {  
        // Create a transaction object and return it  
        const tx = prepareContractCall({  
          contract,  
          method: "mint",  
          params: [address, amount],  
        });  
        return tx;  
      }}  
      onTransactionSent={(result) => {  
        console.log("Transaction submitted", result.transactionHash);  
      }}  
      onTransactionConfirmed={(receipt) => {  
        console.log("Transaction confirmed", receipt.transactionHash);  
      }}  
      onError={(error) => {  
        console.error("Transaction error", error);  
      }}  
      gasless={{  
        provider: "openzeppelin",  
        relayerUrl: "...",  
        relayerForwarderAddress: "...",  
      }}  
    >  
      Confirm Transaction  
    </TransactionButton>  
  );  
}  
```
## Getting Started

Getting started to add ERC-4337 compatible smart accounts to your application easily.

Once set, your application will:

* Let users **connect to their smart account** using any personal wallet, including in-app wallets for easy onboarding.
* Automatically **deploy individual account contracts** for your users when they do their first onchain transaction.
* **Handle all transaction gas costs** via the thirdweb paymaster.

* #### Get a free API key  
You will require an API key to use thirdweb's infrastructure services such as the bundler and paymaster.  
Obtain an API key from the [thirdweb dashboard Settings page](https://thirdweb.com/create-api-key).  
The API key lets you access thirdweb's bundler and paymaster infrastructure, which is required for smart accounts to operate and optionally enable [gasless transactions](https://portal.thirdweb.com/glossary/gasless-transactions).  
Learn more about creating an API key and restricting which contracts the smart account can interact with [here](https://portal.thirdweb.com/api-keys).
* #### Connect smart accounts in your application  
Use the following code to integrate account abstraction into your apps.  
#### Sponsored transactions  
To set up sponsored transactions, set the `sponsorGas` option to `true` in the smart account configuration. All transactions performed with the smart account will then be sponsored by your application. Testnet transactions are free, but you need a valid credit card on file for mainnet transactions.  
UI ComponentReact HookTypeScriptUnity  
```tsx  
import { createThirdwebClient } from "thirdweb";  
import { ThirdwebProvider, ConnectButton } from "thirdweb/react";  
   
const client = createThirdwebClient({  
  clientId: "YOUR_CLIENT_ID",  
});  
   
export default function App() {  
  return (  
    <ThirdwebProvider>  
      <ConnectButton  
        client={client}  
        accountAbstraction={{  
          chain: sepolia, // the chain where your smart accounts will be or is deployed  
          sponsorGas: true, // enable or disable sponsored transactions  
        }}  
      />  
    </ThirdwebProvider>  
  );  
}  
```
* #### Executing Transactions with Smart Accounts  
Once setup, you can use the Connect [TypeScript](https://portal.thirdweb.com/typescript/v5), [React](https://portal.thirdweb.com/react/v5) and [Unity SDKs](https://portal.thirdweb.com/unity) to deploy contracts, perform transactions, and manipulate smart accounts like any other wallet.  
UI ComponentReact HookTypeScriptUnity  
```tsx  
import { getContract } from "thirdweb";  
import { useActiveAccount, useSendTransaction } from "thirdweb/react";  
import { mintTo, balanceOf } from "thirdweb/extensions/erc721";  
   
const contract = getContract({ client, chain, address: "0x..." });  
   
// The ThirdwebProvider setup above already handles the connection to the smart account  
// Within the provider, you can use the SDK normally to interact with the blockchain  
export default function MyComponent() {  
  // Get the connected smart account  
  const smartAccount = useActiveAccount();  
  // Example read  
  const { data, isLoading } = useReadContract(  
    balanceOf,  
    {  
      contract,  
      owner: smartAccount.address!,  
    },  
    {  
      enabled: !!smartAccount,  
    },  
  );  
  // Example write  
  const { mutate: sendTransaction, isPending } = useSendTransaction();  
  const mint = () => {  
    sendTransaction({  
      transaction: mintTo({  
        contract,  
        to: smartAccount.address,  
        nft: {  
          name: "My NFT",  
          description: "My NFT description",  
          image: "https://example.com/image.png",  
        },  
      }),  
    });  
  };  
  // Mint a new NFT  
  return <button onClick={mint}>Mint NFT</button>;  
}  
```

#### Demos

Learn by example with these open-source demos:

Account Abstraction Demos

A reference implementation to create and interact with smart accounts.

[GitHubView on GitHub](https://github.com/thirdweb-example/account-abstraction)
## What is a Smart Account?

A Smart account is a smart contract wallet that follows the [ERC-4337 specification](https://eips.ethereum.org/EIPS/eip-4337).

Ethereum has 2 types of accounts to transfer and receive tokens: EOAs (Externally Owned Accounts) and Contract Accounts. A smart account is a wallet managed by a contract account instead of an EOA. A smart account is a wallet type requiring **no private keys or seed phrases**. Smart accounts rely on code instead of private keys to secure and recover wallet information.

**A smart account is a type of Web3 wallet powered by smart contracts.**

This smart account is unlocked by a 'key' - a personal account. This key can be anything from a [MetaMask wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.metamask) or even an [In-App Wallet](https://portal.thirdweb.com/connect/in-app-wallet/overview) and is used as a way to 'sign in' to the wallet.

### Benefits of Smart Accounts

* Optimized transaction efficiency & batch transactions  
   * Combine multiple transactions into a single atomic transaction
* Improved Security Features
* Social & Multi-Sig Recovery  
   * Recover a wallet without seed phrases/passwords  
   * Nominate a trusted person to recover your wallet in the case of an emergency
* Programmability  
   * Smart accounts can be programmed to do anything a smart contract can do  
   * Smart accounts can be upgraded to add new features

### Account Factories

In order to issue smart accounts for users, an account factory contract must be used. This factory contract is responsible for deploying individual user contracts when required. The SDK provides a global factory ready to use, but you can also deploy your own factory.

### Terminology

#### Personal Wallet/Key

This is the default admin on an account or the "key" to an account. It can be any wallet and is used to initialize the account. Only one wallet can only be the "key" to one account per factory contract.

This wallet is the primary way to access and interact with the account.

#### Account

The account is the ERC-4337 compatible smart contract which holds all of the assets.

#### UserOperations

This is the data structure for the "pseudo-transaction" that the user wants to perform. The transaction is pseudo as Smart Accounts cannot initiate transactions on EVM chains as they are not supported natively. It contains the following fields:

* `sender`: The account making the operation.
* `nonce`: Anti-replay parameter; also used as the salt for first-time account creation.
* `initCode`: The initialization code needed to create the account (needed if and only if the account is not yet onchain).
* `callData`: The data to pass to the `sender` during the operation.
* `callGasLimit`: The amount of gas to allocate for the operation.
* `verificationGasLimit`: The amount of gas to allocate for the verification step.
* `preVerificationGas`: The amount of gas to pay to compensate the bundler for pre-verification execution and calldata.
* `maxFeePerGas`: Maximum fee per gas (similar to [EIP-1559](https://eips.ethereum.org/EIPS/eip-1559) `max_fee_per_gas`).
* `maxPriorityFeePerGas`: Maximum priority fee per gas (similar to [EIP-1559](https://eips.ethereum.org/EIPS/eip-1559)).
* `paymasterAndData`: Address of the paymaster sponsoring the transaction, followed by extra data to send to the paymaster (empty for self-sponsored transaction).
* `signature`: Data passed into the account along with the nonce during the verification step. Should depend on the `chainid` and `EntryPoint` address to prevent replay attacks.

#### EntryPoint

The EntryPoint is a singleton contract (a contract that has a predictable address that is the same on every chain). It has two methods that are used as entry points to execute bundles of UserOperations: `handleOps` and `handleAggregatedOps`.

#### Bundler (relayer)

A bundler is a node that monitors the alternative mempool of `UserOperations` and bundles multiple `UserOps` together to forward to the EntryPoint contract as a single transaction. These `UserOps` can be sent from different accounts and are bundled and sent to the `EntryPoint` contract via a `handleOps` call.

The bundler is controlled by its own EOA which initially pays for the gas fees upfront and is then repaid by either the sender or a paymaster if the transaction is sponsored.

The entry point contract then uses the `validateOp` and `executeOp` functions on the smart account contract to verify and execute the `UserOps` on behalf of the users.

It allows you to send transactions with smart accounts.

#### Paymaster

A paymaster is a smart contract that relays transactions. It provides a service that enables a third party to pay the transaction fee on behalf of the user by funding the Paymaster contract in advance. The paymaster acts as a gas reserve which then can be used during the call execution via the `EntryPoint` contract. The thirdweb [Account abstraction](https://portal.thirdweb.com/connect/account-abstraction) paymaster is initially paid for by thirdweb. By using an API key, the usage is tracked and billed. You can easily define [sponsorship rules](https://portal.thirdweb.com/connect/account-abstraction/sponsorship-rules) that determine whether a transaction will be sponsored.
## Using Account abstraction in Typescript

By using the [TypeScript SDK](https://portal.thirdweb.com/typescript/v5), you can use smart accounts in your applications easily.

### Example Use Cases

The wallet SDK with the TypeScript SDK is primarily used when creating a backend for your application or when creating a node script. In this guide, we will be using the wallet SDK to create a Node script but the logic for creating a backend is the same.

If you are working in a React environment, you are recommended to follow [this guide](https://portal.thirdweb.com/connect/account-abstraction/guides/react).

* #### Create an API key  
To use the bundler and paymaster, you must create an API key and a billing account.  
To create an API Key:  
   * Head to the settings page in the dashboard and click the **API Keys** tab.  
   * Click on **Create API Key**.  
   * Follow the steps to create your API key.  
To use account abstraction infrastructure on mainnet you will also need to [create an account and add a payment method](https://thirdweb.com/team/~/~/settings/billing).
* #### Create a Node Script  
To use smart accounts in a node script, simply create a new Node.js project and install the `thirdweb` package.  
```bash  
npm i thirdweb  
```  
Create a `.env` file and add the following:  
```bash  
THIRDWEB_SECRET_KEY=<YOUR_SECRET_KEY>  
PRIVATE_KEY=<A_TEST_WALLET_PRIVATE_KEY>  
```  
Create an `index.ts` file where we'll write our script.
* #### Creating the Personal Wallet Key  
This smart account is unlocked by a 'key' - a personal wallet. This key can be anything from a MetaMask wallet or an In-App Wallet or just a private key and is used as a way to 'sign in' to the smart account.  
To create a personal wallet key, we are going to use the [privateKeyAccount](https://portal.thirdweb.com/references/typescript/v5/privateKeyAccount), which we need to import from the `thirdweb/wallets` package.  
```typescript  
import { createThirdwebClient } from "thirdweb";  
import { privateKeyAccount } from "thirdweb/wallets";  
   
const client = createThirdwebClient({  
  secretKey: process.env.THIRDWEB_SECRET_KEY as string,  
});  
   
const personalAccount = privateKeyAccount({  
  client,  
  privateKey: process.env.PRIVATE_KEY as string,  
});  
console.log("Personal account address:", personalAccount.address);  
```
* #### Creating the Smart account  
Now, let's create a smart account using `smartWallet` from `thirdweb/wallets` package. To do this, we need to pass an object of type [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions) to the function.  
Some of the important properties in this object are:  
   * `chain`: the chain that the smart account will be deployed on.  
   * `sponsorGas`: whether the smart account should have sponsored transactions or not.  
Once we have created the smart wallet interface, we can connect the personal wallet to the smart account using the `connect` method.  
```typescript  
import { smartWallet } from "thirdweb/wallets";  
   
// Configure the smart wallet  
const wallet = smartWallet({  
  chain: sepolia,  
  sponsorGas: true,  
});  
   
// Connect the smart wallet  
const smartAccount = await wallet.connect({  
  client,  
  personalAccount,  
});  
```
* #### Using the Smart Account  
Now that we have created a smart account object and connected it, we can use it to perform onchain actions gaslessly.  
In this example, we will claim a NFT using the `claimTo` method and then send the transaction using the `sendTransaction` method.  
```typescript  
const balance = await getWalletBalance({  
  client,  
  chain,  
  address: smartAccount.address,  
});  
console.log("Smart account balance:", balance.displayValue);  
   
const contract = getContract({  
  client,  
  chain: sepolia,  
  address: "0x...", // deploy a drop contract from thirdweb.com/explore  
});  
   
const transaction = await claimTo({  
  contract,  
  to: smartAccount.address,  
  quantity: 1,  
});  
const { transactionHash } = await sendTransaction({  
  transaction,  
  smartAccount,  
});  
console.log(`Minted NFT with transaction hash: ${transactionHash}`);  
```  
We have also passed our `secretKey` to the SDK so that we can use the bundler and paymaster.  
We have also added some helpful logs to view the smart account address and balance using the associated `balance` and `getAddress` methods.
* #### Run the Script  
To run the script, run the following command:  
```bash  
bun index.ts  
```  
As you can see in the terminal output, upon claiming the token, the smart account is deployed. This is because smart account contracts are deployed when the first transaction is initiated.  
We have successfully deployed a smart account and claimed an ERC20 token!
* #### Conclusion  
In this guide, we have learned how to use the wallet SDK with the TypeScript SDK to create a smart account and claim an NFT.
## Using Account Abstraction in React

By using the [TypeScript SDK](https://portal.thirdweb.com/typescript/v5), you can use smart accounts in your front-end applications easily.

* #### Create an API key  
To use the bundler and paymaster, you must create an API key and a billing account.  
To create an API Key:  
   * Head to the settings page in the dashboard and click the **API Keys** tab.  
   * Click on **Create API Key**.  
   * Follow the steps to create your API key.  
To use account abstraction infrastructure on mainnet you will also need to [create an account and add a payment method](https://thirdweb.com/team/~/~/settings/billing).
* #### Create an App  
To use smart accounts in a React app you can either:  
   * Start from a template like our [Next.js](https://github.com/thirdweb-example/next-starter) or [Vite](https://github.com/thirdweb-example/vite-starter) starter.  
   * Add the dependencies to an existing project using `npm i thirdweb` or your favorite package manager.  
In this guide, we'll use the [Next.js starter template](https://github.com/thirdweb-example/next-starter).  
Clone the repo and follow the instructions in the README to set up the project.
* #### Build your connection UI  
##### Using Connect Wallet (prebuilt UI)  
To use the [Connect Button](https://portal.thirdweb.com/references/typescript/v5/ConnectButton) component to connect your users to your app using smart accounts, we just need to pass the `accountAbstraction` prop.  
You can change the configuration based on your requirements.  
```tsx  
import { ConnectButton } from "thirdweb/react";  
import { sepolia } from "thirdweb/chains";  
   
const client = createThirdwebClient({ clientId: "your-client-id" });  
   
function App() {  
  return (  
    <div className="App">  
      <ConnectButton  
        client={client}  
        accountAbstraction={{  
          chain: sepolia,  
          sponsorGas: true,  
        }}  
      />  
    </div>  
  );  
}  
```  
Clicking on the connect button will show the following Modal which allows you to connect a personal wallet. This is the personal wallet you are using to initialize the smart account.  
After connecting your personal wallet, a smart account is created for you and connected to the application.  
##### Using the `useConnect` hook (custom UI)  
The [useConnect](https://portal.thirdweb.com/references/typescript/v5/useConnect) hook allows you to programmatically connect your application to the wallet. You will need to build your own UI for connecting the wallet.  
```tsx  
import { useConnect } from "thirdweb/react";  
import { inAppWallet } from "thirdweb/wallets";  
import { sepolia } from "thirdweb/chains";  
   
function Example() {  
  // 1. set the `accountAbstraction` configuration  
  const { connect } = useConnect({  
    client,  
    accountAbstraction: {  
      chain: sepolia,  
      sponsorGas: true,  
    },  
  });  
   
  const connectToSmartAccount = async () => {  
    // 2. connect with the admin wallet of the smart account  
    connect(async () => {  
      const wallet = inAppWallet(); // or any other wallet  
      await wallet.connect({  
        client,  
        chain: sepolia,  
        strategy: "google",  
      });  
      return wallet;  
    });  
  };  
   
  return (  
    <button onClick={() => connectToSmartAccount()}>Connect</button>  
  );  
}  
```
* #### Use the Smart account  
Now that you have connected your smart account to your app, you can use it to send transactions and interact with smart contracts.  
Deploy a NFT Drop contract from the [explore page](https://thirdweb.com/explore/nft-drop) or build your own [ERC 721](https://eips.ethereum.org/EIPS/eip-721) compatible contract using the [Solidity SDK](https://portal.thirdweb.com/contracts/build/overview).  
Use the dashboard to upload some NFTs that we will claim with our smart account.  
To claim an NFT, we will use the [TransactionButton](https://portal.thirdweb.com/references/typescript/v5/TransactionButton) component to send the transaction.  
```tsx  
import { getContract } from "thirdweb";  
import { useActiveAccount, TransactionButton } from "thirdweb/react";  
import { claimTo } from "thirdweb/extensions/erc721";  
   
const contract = getContract({ client, chain, address: "0x..." });  
   
// The ThirdwebProvider setup above already handles the connection to the smart account  
// Within the provider, you can use the SDK normally to interact with the blockchain  
export default function MyComponent() {  
  // Get the connected smart account  
  const smartAccount = useActiveAccount();  
  // Fetch owned NFTs  
  const { data, isLoading } = useReadContract(  
    getOwnedNFTs,  
    {  
      contract,  
      address: smartAccount.address!,  
    },  
    {  
      enabled: !!smartAccount,  
    },  
  );  
  // Mint a new NFT  
  return (  
    <TransactionButton  
      transaction={() => {  
        if (!account) return;  
        return claimTo({  
          contract,  
          to: account.address,  
          quantity: 1,  
        });  
      }}  
      onTransactionConfirmed={() => {  
        alert("NFT Minted!");  
      }}  
    >  
      Mint NFT  
    </TransactionButton>  
  );  
}  
```
* #### Conclusion  
In this guide, we learned how to connect users to a React app using two methods:  
   * With the Connect Wallet component.  
   * With a custom UI component via the `useConnect` hook.
## Bundler & Paymaster Infrastructure

The thirdweb SDK handles all the heavy lifting of bundling operations and covering gas fees with a turn-key infrastructure. The thirdweb paymaster and bundler services are **stand alone** and can be used with any smart account contract without using the thirdweb SDKs.

On testnets, the only requirement is to obtain a free client id to get started. Once you're ready to deploy on mainnets, you will require an active [billing account](https://thirdweb.com/team/~/~/settings/billing). You can configure your client ID to restrict interactions only with your own contracts or with any contract.

#### Supported chains

With a thirdweb API key, you get access to bundler and paymaster infrastructure on the following chains:

[View all supported chains with Account Abstraction](https://thirdweb.com/chainlist?service=account-abstraction).

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fsupported-chains.eca8603d.png&w=3840&q=75)

To support a chain not listed, [contact us](https://thirdweb.com/contact-us).

### Using Paymaster & Bundler URL

To use the Paymaster & Bundler URL for thirdweb, you can follow the guide below:

#### URL Pattern

The URL pattern is predictable for all chains and is used for both paymaster and bundler operations:

```

```

Replace `<chain_id>` with the appropriate chain ID and `<thirdweb-client-id>` with your thirdweb client ID.

#### Client ID in Header

You can also pass the client ID via the header:

```

```

#### Frontend Calls

For frontend calls, the calling domain needs to be allowlisted. This can be done from the thirdweb dashboard in the API key settings.

#### Backend Usage

For backend usage, the secret key is required as a header, and the client ID can be omitted:

```

```

Make sure to replace the placeholders with your actual values. This guide will help you set up and use Paymaster & Bundler URLs effectively with thirdweb.

### Using a Custom Bundler

Smart accounts are free to use with your own account abstraction infrastructure. To use your own paymaster & bundler, pass the `bundlerUrl` the `SmartWalletOptions` overrides:

```ts
const config: SmartWalletOptions = {
  chain,
  sponsorGas: true,
  overrides: {
    bundlerUrl: "your-bundler-url",
  },
};
```

### Using a Custom Paymaster

You can also provide an entirely custom paymaster logic by providing a `paymaster` function to the `SmartWalletOptions` overrides.

```ts
const config: SmartWalletOptions = {
  chain,
  sponsorGas: true,
  overrides: {
    paymaster: async (userOp: UserOperation) => {
      // your custom paymaster logic
      return myPaymasterResultLogic(userOp);
    },
  },
};
```

### Pricing & Billing

To use thirdweb's account abstraction infrastructure, you need to set up a billing account on the thirdweb dashboard Settings page.

**Pricing**:

* **Bundler**: Transaction bundle calls (non-sponsored calls) are free to use.
* **Paymaster**: 10% premium on top of network fee based on your usage.

Find more information on the different billing tiers by visiting [thirdweb's pricing page](https://thirdweb.com/pricing).
## Account Abstraction

Everything you need to leverage account abstraction technology to enable seamless user experiences for your users. You get all the tools to integrate account abstraction into your app. This includes:

* Account factory contracts that let you spin up smart accounts for your users
* Bundler, which is the infrastructure needed to process account abstraction transactions (known as User Ops)
* Paymaster, which lets you sponsor transaction fees for your users

### Features

![](/icons/feature-cards/transactions.svg)

##### Execute Transactions

Enable exchange of native currencies and NFTs to smart account

![](/icons/feature-cards/account-factory.svg)

##### Account Factory Contracts

Deploy ERC-4337 through dashboard, CLI, and SDKs

![](/icons/feature-cards/gasless.svg)

##### Sponsor Transaction Fees

Sponsor transaction fees for users using Paymaster services

![](/icons/feature-cards/session-keys.svg)

##### Provision Access

Provide provisioned access with restrictions using session keys

![](/icons/feature-cards/bundler.svg)

##### Bundler

Equipped with transaction processing software

![](/icons/feature-cards/permissions.svg)

##### Enable permissions

Assign signer and admin roles for granular access

![](/icons/feature-cards/composable-api.svg)

##### Composable API

Compatible with external bundler and paymaster services or non-thirdweb ERC-4337 contracts

![](/icons/feature-cards/upgrade.svg)

##### Upgradeable

Managed version of factory contracts to enable future upgrades

### Demos

Learn by example with these open-source demos:

Account Abstraction Demos

A reference implementation to create and interact with smart accounts.

[GitHubView on GitHub](https://github.com/thirdweb-example/account-abstraction)

### References

By using the thirdweb SDKs, you can easily create and manage smart accounts for your users:

[TypeScriptTypeScript](https://portal.thirdweb.com/typescript/v5)[UnityUnity](https://portal.thirdweb.com/unity)
## Account Permissions & Session Keys

All of the account contracts - [Simple](https://thirdweb.com/thirdweb.eth/AccountFactory) and [Managed](https://thirdweb.com/thirdweb.eth/ManagedAccountFactory) \- share the same permission model. In this section, we'll describe this permission model in detail.

An account recognizes only two types of actors: _Session Keys_ and _Admins_.

### 1\. Admins

Admins have **unrestricted access** to the account; call any functions on the contract, use the contract without going through the ERC-4337 infrastructure (bundlers, EntryPoint, etc.), withdraw the account's native token balance, and so on.

#### Assigning Admin Permissions

Existing admins on the account can add new admins, remove existing admins or renounce their own admin status.

ReactTypeScript

```tsx
import { addAdmin } from "thirdweb/extensions/erc4337";
import { useSendTransaction, useActiveAccount } from "thirdweb/react";
import { getContract } from "thirdweb";
 
const { mutate: sendTransaction } = useSendTransaction();
const smartAccount = useActiveAccount();
 
const onClick = () => {
  if (!smartAccount) return;
  const transaction = addAdmin({
    contract: getContract({
      address: smartAccount.address,
      chain,
      client,
    }),
    account: smartAccount,
    adminAddress: "0x...", // the address of the new admin
  });
  sendTransaction(transaction);
};
```

### 2\. Session Keys

Session Keys are additional authorized signers that must go through ERC-4337 infrastructure (bundlers, EntryPoint, etc.) to use an account to execute transactions. Session keys can use an account under certain restrictions.

#### Assigning Session Key Permissions

Each individual session key has its own permissions to use the account. Only admins can set the permissions for session keys.

Session keys can be assigned the following permissions:

* \[Required\] Allow interaction with specific contracts with the account ("\*" for any contracts)
* \[Optional\] Have a maximum amount of native tokens that can be transferred per transaction (defaults to 0 eth, transactions with value will be rejected)
* \[Optional\] Have access to the account only during a specific time window (defaults to 10 years from now)

These restrictions are set in the `SignerPermissionsRequest` struct. To set the permissions for a given signer, the `setPermissionsForSigner` function is called.

ReactTypeScriptUnity

```tsx
import { addSessionKey } from "thirdweb/extensions/erc4337";
import { useSendTransaction, useActiveAccount } from "thirdweb/react";
import { getContract } from "thirdweb";
 
const { mutate: sendTransaction } = useSendTransaction();
const smartAccount = useActiveAccount();
 
const onClick = () => {
  if (!smartAccount) return;
  const transaction = addSessionKey({
    contract: getContract({
      address: smartAccount.address,
      chain,
      client,
    }),
    account: smartAccount,
    sessionKeyAddress: "0x...", // the address of the account allowed to use the session key
    permissions: {
      approvedTargets: "*", // the addresses of allowed contracts, or '*' for any contract
      nativeTokenLimitPerTransaction: 0.1, // the maximum amount of native token (in ETH) that the session key can spend per transaction
      permissionStartTimestamp: new Date(), // the date when the session key becomes active
      permissionEndTimestamp: new Date(
        Date.now() + 24 * 60 * 60 * 1000,
      ), // the date when the session key expires
    },
  });
  sendTransaction(transaction);
};
```
## Sponsorship rules

You can easily define rules around which transactions (User Ops) the paymaster should sponsor. This can be used to prevent abuse, progressively onboard users, and incentivize specific in-app actions.

You can set the following sponsorship rules

* **Global spend limits**: Maximum gas cost (in USD) that you want to sponsor. This applies for the duration of the billing period (monthly).
* **Server verifier**: This is a general-purpose check that can be used to define custom rules. Before a transaction is sent, it checks with an endpoint that you specify whether it should be sponsored or not.
* **Contract address restrictions**: Use this if you want to sponsor transactions sent only to a specific set of contracts. Transactions sent to contracts outside this allowlist will remain unsponsored.
* **Chain restrictions**: Use this if you want to sponsor transactions only on certain chains. If this is not set, transactions on all [supported chains](https://portal.thirdweb.com/wallets/account-abstraction/infrastructure#supported-chains) will be sponsored.
* **User lists**: You can use this define allowlists or blocklists. Allowlists let you restrict sponsored transactions to transactions sent by a specific set of known accounts. Blocklists let you block bad actors from abusing your paymaster.
* **Admin accounts**: These accounts are not subject to any sponsorship rule, all their transactions will be sponsored. Use this only with accounts that you control (eg. for testing purposes).

We highly recommend that you set sponsorship rules before your app goes live to prevent malicious actors from abusing your paymaster, which could lead to unexpectedly large bills.

#### Setting Sponsorship rules

You can easily set sponsorship rules by going to your Team > Project > Connect > Account Abstraction > Sponsorship Policies page.

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fsponsorship-rules.910a5e9b.png&w=3840&q=75)

#### Setting up a server verifier

You can set up a server verifier by providing a URL that the paymaster will call before sponsoring a transaction. This allows for fine grained control over which transactions are sponsored.

The thirdweb infrastructure will send a POST request to the URL you specify with the following JSON payload:

```ts
// thirdweb will call your server with the following JSON body as a POST request
{
	clientId: string; // the clientId that is making the request
	chainId: number; // the chainId of the transaction
	userOp: {
		sender: string; // the address of the sender
  		targets: string[]; // the addresses of the target contracts or wallets
  		gasLimit: string; // the gas limit of the transaction
  		gasPrice: string; // the gas price of the transaction in wei
                data: {
		  targets: string[], // the targets contracts or wallets called in this operation
		  callDatas: string[], // the call data of each transaction
		  values: string[], // the values (in wei) of each transaction
                }
	};
}
```

Your server should respond with a 200 and the following JSON payload:

```ts
// You should respond with the following JSON payload
{
	isAllowed: boolean; // whether the transaction should be sponsored or not
	reason: string?; // optional reason for why the transaction is not allowed
}
```

Note: for performance reasons, your server should respond within 5 seconds. If it takes longer, the transaction will be unsponsored.

#### FAQs

**What happens if a limit is hit? Does the transaction fail or does it go unsponsored?**

If a limit is hit the transaction will go unsponsored. If you are spinning up fresh accounts for users in your app, it is unlikely that the user accounts will hold any funds. You can catch the following out of funds error to gracefully handle this within your app `AA21 didn't pay prefund`.

**What networks are sponsorship rules available in?**

Sponsorship rules apply across all the [networks that we support account abstraction in](https://portal.thirdweb.com/connect/account-abstraction/infrastructure#supported-chains). You don't need to specify different rules for each network or each account factory as long as they use the same client ID. However, you can restrict sponsored transactions to specific networks if you choose to.

**Will sponsorship rules work with third-party paymasters?**

No, sponsorship rules will apply if you are using thirdweb's paymaster.

#### Pricing

Setting a server verifier requires your account to be on the growth plan. The other policies are free to use. There is no usage based pricing for policies.
## Deploying Your App to Production

Before you deploy your app to real users, you'll want to make sure your application is secure and ready to onboard users to your app. This involves separating some operations to the server and others to the client.

The examples in [Getting Started](https://portal.thirdweb.com/connect/auth) do everything on the client. The following examples demonstrate what should be on the server instead to ensure your application is secure.

Some of the code here is left for you to implement. This provides you with flexibility and control over your application's authentication. However, if you'd like specific examples, check out our[templates](https://portal.thirdweb.com/connect/auth#templates) or [framework guides](https://portal.thirdweb.com/connect/auth#frameworks).

ClientServer

At the root of your application:

```tsx
import { ThirdwebProvider } from "thirdweb/react";
 
export default function App() {
  return <ThirdwebProvider>{/* Your app here */}</ThirdwebProvider>;
}
```

In your `components` directory:

```tsx
import { ConnectButton } from "thirdweb/react";
import { createThirdwebClient } from "thirdweb";
 
const client = createThirdwebClient({ clientId });
 
export default function Connect() {
  <ConnectButton
    client={client}
    auth={{
      getLoginPayload: async (params) => {
        const address = params.address;
        // fetch the login payload here using address
      },
      doLogin: async (params) => {
        // send the signed login payload (params) to the server
      },
      isLoggedIn: async () => {
        // fetch the user's login status from the server
      },
      doLogout: async () => {
        // send a logout request to the server
      },
    }}
  />;
}
```
## FAQs

#### Can users have the same smart account contract address on all EVM chains?

Yes, by using our Account factory contracts, it is possible to enable predictable addresses per user across all EVM chains. To do this, ensure that your **account factory** has the same address on every chain. You can accomplish this from the dashboard by enabling "Deterministic address" when deploying the account factory.

#### Can I sign transactions with my smart account?

Smart contract wallets cannot sign transactions themselves, only the 'owners' of the smart account can. The way to achieve this is to follow [EIP-1271](https://eips.ethereum.org/EIPS/eip-1271) which requires to ask the smart contract wallet if the recovered address is indeed an owner.

#### Can I use In-App Wallets with account abstraction?

Yes! In-App Wallets with account abstraction is a powerful combination that allows users to sign in using their email, social media accounts, or custom JWT method (In-App Wallet), and provides a completely gasless user experience.

#### Are smart accounts custodial or non-custodial?

Smart accounts are non-custodial. It uses smart contracts to operate and manage assets via an admin wallet that signs on behalf of the smart account

#### Is setting a trusted forwarder necessary for account abstraction?

No, There is no need to use a trusted forwarder when implementing account abstraction for your contract.
## Blockchain API

Perfomant, reliable and type safe API to read write to any contract on any EVM chain through our [RPC Edge](https://portal.thirdweb.com/infrastructure/rpc-edge/overview) endpoints.
## Overview

Auth allows anyone to integrate passwordless web3-native authentication and authorization into their applications. Users can then **login using any thirdweb wallet** (in-app, browser, or smart wallet).

This allows developers to create a familiar, secure authentication flow that works with traditional backends while leveraging the features of a web3 application.

---

## Get Started

npmyarnpnpmbun

`npm i thirdweb

`

### Get Your Client ID

To use Auth in your app, you'll need a client ID. You can get one for free on [your thirdweb dashboard](https://thirdweb.com/create-api-key).

### Setting Up Auth

ReactTypeScript

```tsx
import { ThirdwebProvider, ConnectButton } from "thirdweb/react";
import { createThirdwebClient } from "thirdweb";
import { createAuth } from "thirdweb/auth";
 
const client = createThirdwebClient({
  clientId: "1234567890", // get yours by creating a project on https://thirdweb.com/create-api-key
});
 
const thirdwebAuth = createAuth({
  domain: "localhost:3000",
  client,
  adminAccount: privateKeyToAccount({ client, privateKey }),
});
 
export default function App() {
  const [loggedIn, setLoggedIn] = useState(false);
  return (
    // The ThirdwebProvider should be at the root of your application, but the ConnectButton can be anywhere
    <ThirdwebProvider>
      <ConnectButton
        client={client}
        auth={{
          getLoginPayload: async (params) => {
            // here you should call your backend, using generatePayload to return
            // a SIWE compliant login payload to the client
            return thirdwebAuth.generatePayload(params);
          },
          doLogin: async (params) => {
            // here you should call your backend to verify the signed payload passed in params
            // this will verify that the signature matches the intended wallet
            const verifiedPayload =
              await thirdwebAuth.verifyPayload(params);
            setLoggedIn(verifiedPayload.valid);
          },
          isLoggedIn: async () => {
            // here you should ask you backend if the user is logged in
            // can use cookies, storage, or your method of choice
            return loggedIn;
          },
          doLogout: async () => {
            // here you should call your backend to logout the user if needed
            // and delete any local auth tokens
            setLoggedIn(false);
          },
        }}
      />
    </ThirdwebProvider>
  );
}
```

#### Deploying to Production

These examples are intended to get up and running quickly, but aren't secure for production. Before deploying your app to real users, checkout out our walkthrough on [Deploying to Production](https://portal.thirdweb.com/connect/auth/deploying-to-production).

#### Auth with Smart Accounts (Account Abstraction)

When using Auth with a smart account, you **must** specify a client (on `createAuth`) and a chain ID (on `generatePayload`). The smart account is deployed on a specific chain and the payload must reflect that, and the client is needed to call the wallet contract to verify the signature.

### Templates

Quickly get started with one of our templates:

Auth + Next.js

A working example of Auth + Next.js

[GitHubView on GitHub](https://github.com/thirdweb-example/thirdweb-auth-next)

Auth + Express

A working example of a React + Express app using Auth

[GitHubView on GitHub](https://github.com/thirdweb-example/thirdweb-auth-express)

### Frameworks

Auth integrates with a variety of server-side and client-side development frameworks. We're always adding support for more frameworks, so if you don't see yours, [let us know](https://thirdweb.com/contact-us).
## React + Express

If you want to interact with a working version of the Auth + React integration that we'll be building in this guide, you can check the following GitHub repository, or clone it with the command below:

```

```

thirdweb-auth-express

React + Express Auth example repository.

[GitHubView on GitHub](https://github.com/thirdweb-example/thirdweb-auth-express)

### Installation & Setup

npmyarnpnpmbun

`npm i thirdweb

`

Create a directory to hold your client and server:

```bash
$ mkdir my-app
$ cd my-app
```

### Client-side Setup

#### Setup Your App

Create a new React app with Vite:

```bash
$ npm create vite@latest client -- --template react-ts
$ cd client
```

Setup your _React app_ `.env` file with the following:

```bash
# Get your client id from the thirdweb dashboard: https://thirdweb.com/create-api-key
THIRDWEB_CLIENT_ID=
# The url of your backend (Express) server for the frontend to interact with
AUTH_API=
```

Wrap the root of your application with a thirdweb provider:

```tsx
// main.tsx
ReactDOM.createRoot(document.getElementById("root")!).render(
  <React.StrictMode>
    <ThirdwebProvider>// Your application layout...</ThirdwebProvider>
  </React.StrictMode>,
);
```

#### Creating a Client

Create and export a thirdweb client somewhere in your application to be used in your components. This client gives you access to thirdweb's RPCs to read and right from the blockchain.

```tsx
// lib/client.ts
import { createThirdwebClient } from "thirdweb";
 
const clientId = process.env.THIRDWEB_CLIENT_ID!;
 
export const client = createThirdwebClient({ clientId });
```

Don't have a secret key? Get one [here](https://thirdweb.com/create-api-key).

#### Adding the Connect Button

Create your `<ConnectButton />` component. **This is where your users will sign in.**

```tsx
// components/ConnectButtonAuth.tsx
import { ConnectButton } from "thirdweb/react";
import { client } from "../lib/client";
import {
  LoginPayload,
  VerifyLoginPayloadParams,
} from "thirdweb/auth";
import { get, post } from "../lib/api";
import { sepolia } from "thirdweb/chains";
 
export default function ConnectButtonAuth() {
  return (
    <ConnectButton
      client={client}
      auth={{
        /**
         * 	`getLoginPayload` should @return {VerifyLoginPayloadParams} object.
         * 	This can be generated on the server with the generatePayload method.
         */
        getLoginPayload: async (params: {
          address: string;
        }): Promise<LoginPayload> => {
          return get({
            url: process.env.AUTH_API + "/login",
            params: {
              address: params.address,
              chainId: sepolia.id.toString(),
            },
          });
        },
        /**
         * 	`doLogin` performs any logic necessary to log the user in using the signed payload.
         * 	In this case, this means sending the payload to the server for it to set a JWT cookie for the user.
         */
        doLogin: async (params: VerifyLoginPayloadParams) => {
          await post({
            url: process.env.AUTH_API + "/login",
            params,
          });
        },
        /**
         * 	`isLoggedIn` returns true or false to signal if the user is logged in.
         * 	Here, this is done by calling the server to check if the user has a valid JWT cookie set.
         */
        isLoggedIn: async () => {
          return await get({
            url: process.env.AUTH_API + "/isLoggedIn",
          });
        },
        /**
         * 	`doLogout` performs any logic necessary to log the user out.
         * 	In this case, this means sending a request to the server to clear the JWT cookie.
         */
        doLogout: async () => {
          await post({
            url: process.env.AUTH_API + "/logout",
          });
        },
      }}
    />
  );
}
```

#### Adding Account Abstraction

To provide your users with a smart wallet so your app can sponsor gas and batch transactions, add the following to your `<ConnectButton />`:

```tsx
<ConnectButton
  // ...
  accountAbstraction={{
    chain: sepolia, // Update this to your chain of choice
    factoryAddress: "0x5cA3b8E5B82D826aF6E8e9BA9E4E8f95cbC177F4", // Set this to your Account Factory. You can deploy one from Team > Project > Connect > Account Abstraction page
    gasless: true, // Sponsor gas for your users
  }}
/>;
```

### Server-side Setup

#### Setup Your Express API

Create a new directory for your backend server:

```bash
$ mkdir server
$ cd server
```

Initialize a new node project:

```bash
$ npm init
```

Accept the defaults for now. Once your project is initialized, install the dependencies:

```bash
$ npm install express cors cookie-parser thirdweb
```

Create a `.env` file with the following:

```bash
# Get your client id from the thirdweb dashboard: https://thirdweb.com/create-api-key
THIRDWEB_SECRET_KEY=
# The domain of your frontend -- include the port when running local but nothing else (remember to update this in production)
CLIENT_DOMAIN=localhost:5173
# An wallet private key to generate the JWT with
AUTH_PRIVATE_KEY=
NODE_ENV=development # Set this to production when you deploy!
```

To keep things simple, we've put all server-side routes in the same file. For a production-grade application you'll likely break them out depending on what works for your use case. Either way, the core logic is the same as you see here.

#### Create a Server-Side Client

Create a server-side client using your secret key:

```ts
// thirdwebClient.js
import { createThirdwebClient } from "thirdweb";
 
const secretKey = process.env.THIRDWEB_SECRET_KEY!;
 
export const thirdwebClient = createThirdwebClient({ secretKey });
```

#### Setup your Express Server

We'll assume you've already setup a basic Express API, but there are a few things you'll need to make sure you've done for authentication to work properly between your frontend and backend.

```js
import cors from "cors";
import express from "express";
import cookieParser from "cookie-parser";
import {
  createAuth,
  type VerifyLoginPayloadParams,
} from "thirdweb/auth";
import { privateKeyToAccount } from "thirdweb/wallets";
import { thirdwebClient } from "./thirdwebClient";
 
const app = express();
app.use(express.json());
app.use(cookieParser());
app.use(
  // This is important for the cookie to be saved properly!!!
  cors({
    origin: `${process.env.NODE_ENV === "development" ? "http" : "https"}://${process.env.CLIENT_DOMAIN}`,
    credentials: true,
  }),
);
 
// ...we'll add routes here next
 
app.listen(3000, () => {
  console.log(`⚡ Auth server listening on port 3000...`);
});
```

Create your thirdweb auth instance

```js
const thirdwebAuth = createAuth({
  domain: process.env.CLIENT_DOMAIN!,
  client: thirdwebClient,
  adminAccount: privateKeyToAccount({
    client: thirdwebClient,
    privateKey: process.env.ADMIN_PRIVATE_KEY!,
  }),
});
```

Setup a `GET` route at `/login` to fetch the login payload:

```js
app.get("/login", async (req, res) => {
  const address = req.query.address;
  const chainId = req.query.chainId;
 
  if (!address) {
    return res.status(400).send("Address is required");
  }
 
  return res.send(
    await thirdwebAuth.generatePayload({
      address,
      chainId: chainId ? parseInt(chainId) : undefined,
    }),
  );
});
```

Here, we get the user's address and chain ID to generate the payload with using thirdweb Auth. This payload will be returned to the client for the user to sign with their wallet. It will then be sent back to the server for verification.

Create a `POST` route also at `/login` for the frontend to submit the signed payload:

```js
app.post("/login", async (req, res) => {
  const payload: VerifyLoginPayloadParams = req.body;
 
  const verifiedPayload = await thirdwebAuth.verifyPayload(payload);
 
  if (verifiedPayload.valid) {
    const jwt = await thirdwebAuth.generateJWT({
      payload: verifiedPayload.payload,
    });
    res.cookie("jwt", jwt);
    return res.status(200).send({ token: jwt });
  }
 
  res.status(400).send("Failed to login");
});
```

We receive the signed payload, verify it via thirdweb Auth, then create a JWT if the signed payload is valid. This JWT is assigned to this domain and allows the client to identify itself to the server as authenticated for future requests (until the token expires).

Now, we create a route to check if the user is currently logged in:

```js
app.get("/isLoggedIn", async (req, res) => {
  const jwt = req.cookies?.jwt;
 
  if (!jwt) {
    return res.send(false);
  }
 
  const authResult = await thirdwebAuth.verifyJWT({ jwt });
 
  if (!authResult.valid) {
    return res.send(false);
  }
 
  return res.send(true);
});
```

If the user doesn't have a token, they're definitely not logged in, so we immediately return false. If they do, we verify it to make sure its both accurate and not yet expired. If both are true, we return true.

Finally, we need a route to log the user out by clearing their token:

```js
app.post("/logout", (req, res) => {
  res.clearCookie("jwt");
  return res.send(true);
});
```

For any routes you add to your server, you can authenticate the user just like we did in `/isLoggedIn`:

```js
app.get("/secure", async (req, res) => {
  const jwt = req.cookies?.jwt;
 
  if (!jwt) {
    return res.status(401).send("Unauthorized");
  }
 
  const authResult = await thirdwebAuth.verifyJWT({ jwt });
 
  if (!authResult.valid) {
    return res.status(401).send("Unauthorized");
  }
 
  // ...your route logic
});
```

Remember your `app.listen` (when you start the server) must come **after** your routes.

That's it! You have a React + Express app fully configured with SIWE. When running your app, be sure to start both the client and the server.

### Support

For help or feedback, please [visit our support site](https://thirdweb.com/support)
## Create a Custom JWT Auth Server

Learn how to integrate your auth backend with our in-app wallets solution so you can onboard your users into web3 seamlessly.

This guide will show you how to create your own Auth Server that is compatible with the JWT auth strategy. By doing so, you can have full control over user authentication and data security. This allows you to ensure that your application meets specific compliance requirements while also providing a customized sign-in experience.

#### Caution

This guide is simplified for demonstration purposes and is not ready for production use. When modifying it for production, secure your endpoints and avoid hard-coding secrets or sensitive information. We recommend using environment variables and secret managers.

* #### Setup  
   * Create a new directory for your project and navigate to it in your CLI  
   ```bash  
   mkdir jwt-auth-server  
   cd jwt-auth-server  
   ```  
   * Initialize a new Node.js application  
   ```bash  
   npm init -y  
   yarn init -y  
   ```  
   * Install the necessary packages  
   ```bash  
   npm install express jsonwebtoken  
   ```
* #### Generate RSA Key Pair  
   * To generate a private and a public key run  
   ```bash  
   ssh-keygen -t rsa -b 2048 -m PEM -f keys/rsa.key  
   ```  
   * To create the output file run  
   ```bash  
   openssl rsa -in keys/rsa.key -pubout -outform PEM -out keys/rsa.key.pub  
   ```
* #### Convert Public Key to JSON Web Key Set (JWKS)  
   * Display the public key:  
   ```bash  
   cat keys/rsa.key.pub  
   ```  
   * Copy the displayed public key.  
   * Convert your public key to a JWK using an online JWK Creator tool. We recommend using [JWK Creator by Russel Davies](https://github.com/russelldavies/jwk-creator).  
         * Paste the public key, set Key ID as `0` (arbitrary string, must match when signing JWT), and then note down the generated JWK.  
   ![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fjwk-creator-tool.22744d13.png&w=2048&q=75)  
   * Create a `jwks.json` in the project root and place the generated JWK in a `keys` array.  
   ```bash  
   {  
     "keys": [  
       {  
          ... JWK ...  
       }  
     ]  
   }  
   ```
* #### Create the Server  
   * In the `jw-auth-server` directory, create a file at the root named `server.js` and paste the following:  
   ```jsx  
   const express = require("express");  
   const fs = require("fs");  
   const jwt = require("jsonwebtoken");  
        
   const app = express();  
   const PORT = process.env.PORT || 3000;  
        
   const PRIVATE_KEY = fs.readFileSync("./keys/rsa.key", "utf8");  
   const jwks = require("./jwks.json");  
        
   const users = [  
     { id: 1, email: "user@example.com", password: "password123" },  
   ];  
        
   app.use(express.json());  
        
   app.post("/login", (req, res) => {  
     const { email, password } = req.body;  
     const user = users.find(  
       (u) => u.email === email && u.password === password,  
     );  
     if (!user)  
       return res.status(401).send({ message: "Invalid credentials" });  
        
     const payload = {  
       iss: "http://your-domain.com",  
       sub: user.id.toString(),  
       aud: "EpicGame",  
       email: user.email,  
       exp: Math.floor(Date.now() / 1000) + 3600,  
     };  
        
     const token = jwt.sign(payload, PRIVATE_KEY, {  
       algorithm: "RS256",  
       keyid: "0",  
     });  
        
     res.send({ token });  
   });  
        
   app.get("/.well-known/jwks.json", (req, res) => {  
     res.json(jwks);  
   });  
        
   app.listen(PORT, () => {  
     console.log(`Server started on port ${PORT}`);  
   });  
   ```  
   * Replace `http://your-domain.com` with the actual domain for the application.
* #### Test Locally  
   * Start the server:  
   ```bash  
   node server.js  
   ```  
   * Test login:  
   ```bash  
   curl -X POST http://localhost:3000/login -H "Content-Type: application/json" -d '{"email": "user@example.com", "password": "password123"}'  
   ```  
   * Test JWKS:  
   ```bash  
   curl http://localhost:3000/.well-known/jwks.json  
   ```
* #### Deploy  
To deploy the server, you can use services such as [Zeet](https://zeet.co/) or [Docker](https://www.docker.com/).  
Once deployed, replace `http://localhost:3000` in the JWT payload with your actual domain
* #### Integrate In-App Wallets  
   * Navigate to Team > Project > Connect > In-App Wallets in [thirdweb dashboard](https://thirdweb.com/team)  
   * Create a new API key by creating a Project if you don't have one or select an existing one to use for this project. [Learn more about API keys.](https://portal.thirdweb.com/api-keys)  
   ![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Few-create-key.651a21bf.png&w=3840&q=75)  
   * Allowlist domain or bundle IDs in Access Restrictions.  
   * Navigate to the Configuration view and enable **Custom JSON Web Token**  
   ![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Few-configuration.31825500.png&w=3840&q=75)  
   * Set the JWKS URI to `your-domain/.well-known/jwks.json`  
   * Set the AUD to `EpicGame` or the value you set as the `aud` in the `server.js` file.  
   ![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Few-configuration-opt.d07c1d61.png&w=3840&q=75)  
   * Copy the client ID.  
   * In your preferred thirdweb client SDK, pass the JWT you retrieved from logging in to the server.

A persistent, cross-platform wallet is now created for your user.
## Overview

In-App wallets already support most popular login methods out of the box, but we also give app developers the flexibility to use in-app wallets with any authentication method. If you have a valid authenticated user, you should be able to easily spin up an in-app wallet for them irrespective of how they got authenticated.

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fspeedracer.1031d6ed.png&w=3840&q=75)

This means that app developers can now

* **Spin up in-app wallets for users using an existing authentication service**. For example, if you have a game where players log in using their username and password, you can now easily create wallets when they sign up.
* **Integrate with any social login provider**. For example, if you have a game where you want to let users login with their Steam or Epic games credentials, you can now use in-app wallets to enable these experiences.
* **Use in-app wallets in non-frontend environments**. For example, you could authenticate users with SSH and use in-app wallets with CLI tools.
* **Build completely custom authentication experiences**. For example, you could ask users to verify their credentials with 2FA or passkey before you consider them authenticated and provision wallets for them.
## Custom Auth Server

Learn how to integrate your auth backend with our in-app wallets solution so you can onboard your users into web3 seamlessly.

This guide will show you how to create your own Auth Server that is compatible with the `auth_endpoint` strategy. By doing so, you can have full control over user authentication and data security. This allows you to ensure that your application meets specific compliance requirements while also providing a customized sign-in experience.

#### Security

This guide is simplified for demonstration purposes and is not ready for production use. When modifying it for production, secure your endpoints and avoid hard-coding secrets or sensitive information. We recommend using environment variables and secret managers.

### 5 minute quickstart

* #### Step 1  
Navigate to Your Team > Project > Connect > In-App Wallets Page from the (dashboard)\[<https://thirdweb.com/team>\]
* #### Step 2  
Create a thirdweb API key if you don't have one or select an existing key to use for this project. [Learn more about API keys.](https://portal.thirdweb.com/api-keys)  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Few-create-key.651a21bf.png&w=3840&q=75)
* #### Step 3  
Allowlist domain or bundle IDs in Access Restrictions.
* #### Step 4  
Navigate to the Configuration view and enable **Custom Auth Endpoint**  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Few-custom-auth-config.657c2ff0.png&w=3840&q=75)
* #### Step 5  
Set the Auth Endpoint URL to`https://embedded-wallet.thirdweb.com/api/2023-11-30/embedded-wallet/auth/test-custom-auth-endpoint`for testing purposes. You will replace this later with your own auth server endpoint to verify the `payload`.
* #### Step 6  
Save the configuration.
* #### Step 7  
Copy the client ID.
* #### Step 8  
In your preferred thirdweb client SDK, pass the payload you retrieved from logging in to the server.

You can now auth into the wallet and use it to sign transactions like so (see [use your own auth for more](https://portal.thirdweb.com/in-app-wallet/custom-auth)):

React & React NativeOther Frameworks

```typescript
import { inAppWallet } from "thirdweb/wallets";
import { useConnect } from "thirdweb/react";
 
const { connect } = useConnect();
 
const handlePostLogin = async (jwt: string) => {
  await connect(() => {
    const wallet = inAppWallet();
    wallet.connect({
      client,
      strategy: "auth_endpoint",
      payload: JSON.stringify({ userId: "ANY_RANDOM_ID_HERE" }),
    });
    return wallet;
  });
};
```

A persistent, cross-platform wallet is now created for your user!

Of course, you would use your own auth server instead of the one we provided. The rest of this guide will show you how to create your own auth server.

#### Setup

The following steps will show you how to create a simple auth server that can be used with the embedded wallet.

At a high level, the auth server will:

* Handle login for the user into your application.
* Have a way to get a public identifier for the user.
* Have an endpoint to verify the public identifier and return some basic information about the user

Steps 1 and 2 are up to you to implement. You can use any auth strategy you want.

The endpoint in step 3 is what you register as your auth endpoint on the thirdweb dashboard.

Here's a high-level diagram:

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Few-custom-auth-flow.53700bb1.png&w=3840&q=75)

* #### Step 1  
Create a new directory for your project and navigate to it in your CLI  
```bash  
mkdir custom-auth-server  
cd custom-auth-server  
```
* #### Step 2  
Initialize a new Node.js application  
```bash  
npm init -y  
```  
OR  
```bash  
yarn init -y  
```

#### **Create the Server:**

In the `custom-auth-server` directory, create a file at the root named `server.js` and paste the following:

```jsx
const express = require("express");
const fs = require("fs");
 
const app = express();
const PORT = process.env.PORT || 3000;
 
const users = [
  { id: 1, email: "user@example.com", password: "password123" },
];
 
app.use(express.json());
 
// This is what your app calls to log in a user and get a public identifier for the user (otherwise known as the payload)
app.post("/login", (req, res) => {
  const { email, password } = req.body;
  const user = users.find(
    (u) => u.email === email && u.password === password,
  );
  if (!user)
    return res.status(401).send({ message: "Invalid credentials" });
 
  res.send({ payload: user.id });
});
 
// This is a sample endpoint that you would register on the thirdweb dashboard for us to verify the payload
app.post("/thirdweb-will-call-this", (req, res) => {
  const { payload } = req.body;
  if (!payload)
    return res.status(401).send({ message: "Invalid credentials" });
 
  // You would write your own logic here to verify the payload here
  const user = users.find((u) => u.id === payload);
  if (!user)
    return res.status(401).send({ message: "Invalid credentials" });
 
  // Once the user is successfully verified, you can return the following field
  return res.send({
    userId: user.id,
    // The last two fields here are optional
    email: user.email,
    exp: Math.floor(Date.now() / 1000) + 60 * 60 * 24 * 30,
  });
});
 
app.listen(PORT, () => {
  console.log(`Server started on port ${PORT}`);
});
```

#### **Test Locally**

* Start the server:  
```bash  
node server.js  
```
* Test login:  
```bash  
curl -X POST http://localhost:3000/login -H "Content-Type: application/json" -d '{"email": "user@example.com", "password": "password123"}'  
```

#### **Deploy**

To deploy the server, you can use services such as [Zeet](https://zeet.co/) or [Docker](https://www.docker.com/).

#### **Integrate In-App Wallets**

Refer top the [quickstart above](#5-minute-quickstart) to integrate the embedded wallet into your application.
## Integrate Firebase Auth

Learn how to obtain a JSON Web Token (JWT) from Firebase using Firebase's email provider and integrate it with In-App Wallet.

#### Info

This article covers the steps of integrating Firebase Auth for a React Native app. Firebase steps and the In-App Wallet code may be replicated for React.

### Prerequisites

* Firebase project
* React App

* #### Create a React Native App  
Create a react native app with the tool of your choice and install the required packages:  
```bash  
npm i thirdweb  
```  
   * Note that we assume this is a simple app with a single screen `App.tsx`.
* #### Set up your Firebase project  
   * Set up a React Native Firebase project by following the [prerequisites in the React Native Firebase documentation](https://rnfirebase.io/#1-install-via-npm). 2\. Navigate to the[Firebase Console](https://console.firebase.google.com/) and create a new project. 3\. Navigate to Authentication > Sign-in method, to enable the[Email/Password provider](https://rnfirebase.io/auth/usage#emailpassword-sign-in)
* #### Set up the custom JSON Web Keys link through dashboard  
   * Navigate to your Team > Project > Connect > In-App Wallets in [thirdweb dashboard](https://thirdweb.com/team)  
   * To use in-app wallets, choose an existing Project or create a new one.  
   ![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Few-create-key.651a21bf.png&w=3840&q=75)  
   * In the configuration view, enable **Custom JSON Web Token.**  
   ![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fconfiguration-view.ac6aa7c2.png&w=3840&q=75)  
   * Set the [JWKS URI from here](https://www.googleapis.com/service%5Faccounts/v1/jwk/securetoken@system.gserviceaccount.com)  
   * Set the AUD Value as the Firebase `projectId`. (Example, `custom-auth-53169`)  
   ![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcustom-json-firebase.61b14529.png&w=3840&q=75)  
   * Select **Save changes**.
* #### Add the Firebase auth dependencies  
Firebase auth depends on the `firebase/app` and `firebase/auth` packages.  
To add the packages, run the following command in the project:  
```bash  
yarn add @react-native-firebase/app @react-native-firebase/auth  
```
* #### Implement Email Authentication  
Add the code snippet below to handle email authentication with Firebase. Note that you need to add UI to allow users to input the email and password fields in your `App.tsx` file:  
To handle email authentication with Firebase  
```jsx  
import auth from "@react-native-firebase/auth";  
   
async function signInWithEmail(email, password) {  
  try {  
    await auth().createUserWithEmailAndPassword(email, password);  
  } catch (error) {  
    console.error(error);  
  }  
}  
   
return (  
  <Button  
    title="Sign In"  
    onPress={() => signInWithEmail(email, password)}  
  />  
);  
```  
Note: You may add a UI to allow users to input email and password fields.
* #### Obtain the JWT  
Once the user is authenticated, you can listen to `AuthStateChanged` [events to get the signed in user](https://rnfirebase.io/auth/usage#listening-to-authentication-state). You can then get the JWT from the User object:  
To receive the signed in user, listen to the `AuthStateChanged` event. You can add this code in your App.tsx file as well:  
```jsx  
const [user, setUser] = useState();  
   
function onAuthStateChanged(user) {  
  setUser(user);  
}  
   
useEffect(() => {  
  // Listens to AuthStateChanged events  
  const subscriber = auth().onAuthStateChanged(onAuthStateChanged);  
  return subscriber;  
}, [onAuthStateChanged]);  
   
async function getFirebaseJWT() {  
  if (user) {  
    return await user.getIdToken();  
  } else {  
    throw new Error("User is not authenticated");  
  }  
}  
```
* #### Pass the JWT to InAppWallet  
Pass the JWT to the In-App Wallet config in your `App.tsx` file:  
```jsx  
import { inAppWallet } from "thirdweb/wallets";  
import { useConnect } from "thirdweb/react";  
   
const { connect } = useConnect();  
   
const connectInApp = async (jwt: string) => {  
	await connect(() => {  
		const wallet = inAppWallet();  
		wallet.connect({  
			client,  
			strategy: "jwt",  
			jwt: await getFirebaseJWT(),  
		});  
		return wallet;  
	});  
};  
```  
After the connectInApp function returns, the ThirdwebProvider will have connected a wallet thereby granting access to all hooks and functionalities.
* #### Access the connected account  
To access the connected account, use the `useActiveAccount()` hook:  
```jsx  
import { useActiveAccount } from "thirdweb/react";  
   
const activeWallet = useActiveAccount();  
```
## Build your own UI

### Low level control to authenticate and connect wallets

You have full control with the connection hooks and functions to build your own UI. To use in-app wallets, you first choose an authentication strategy and then connect.

### Starting from an example

View a fully functioning example of an in-app wallet with a custom UI:

[GitHubIn-App Wallets with Custom UI - Reactv4 SDK](https://github.com/thirdweb-example/embedded-wallet-custom-ui)[GitHubIn-App Wallets with Custom UI - React Nativev4 SDK](https://github.com/thirdweb-example/embedded-wallet-custom-ui-react-native)

### Setup the ThirdwebProvider

**Only needed for React and React native platforms**

This will ensure that the wallet is available to all components in your app, handle connection states and auto-connection on page load.

```jsx
import { ThirdwebProvider } from "thirdweb/react";
 
<ThirdwebProvider>
  <YourApp />
</ThirdwebProvider>;
```

### Authenticate via Google

Note that for Apple and Facebook, you just need to update the strategy to "facebook" or "apple".

ReactTypeScript

In React and React Native, the `useConnect()` hook handles authentication and connection states.

```tsx
import { inAppWallet } from "thirdweb/wallets";
import { useConnect } from "thirdweb/react";
 
const { connect } = useConnect();
 
const handleLogin = async () => {
  await connect(async () => {
    const wallet = inAppWallet();
    await wallet.connect({
      client,
      strategy: "google",
    });
    return wallet;
  });
};
```

### Authenticate via Email verification

ReactTypeScript

```typescript
import {
  inAppWallet,
  preAuthenticate,
} from "thirdweb/wallets/in-app";
 
const { connect } = useConnect();
 
const preLogin = async (email: string) => {
  // send email verification code
  await preAuthenticate({
    client,
    strategy: "email",
    email,
  });
};
 
const handleLogin = (email: string, verificationCode: string) => {
  // verify email and connect
  connect(async () => {
    const wallet = inAppWallet();
    await wallet.connect({
      client,
      strategy: "email",
      email,
      verificationCode,
    });
    return wallet;
  });
};
```

### Authenticate via Passkey

ReactTypeScript

```typescript
import {
  inAppWallet,
  hasStoredPasskey,
} from "thirdweb/wallets/in-app";
 
const { connect } = useConnect();
 
const handleLogin = async () => {
  await connect(async () => {
    const wallet = inAppWallet();
    const hasPasskey = await hasStoredPasskey(client);
    await wallet.connect({
      client,
      strategy: "passkey",
      type: hasPasskey ? "sign-in" : "sign-up",
    });
    return wallet;
  });
};
```
## Connect Users

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fconnect-wallet-hero.8fcc6628.webp&w=3840&q=75)

### Using the Connect UI components

If you're building a [React website](https://portal.thirdweb.com/typescript/react/v5/ConnectButton), [React Native app](https://portal.thirdweb.com/react-native/v5), or [Unity game](https://portal.thirdweb.com/unity/ConnectWallet) you can use the prebuilt connect UI components to authenticate users and connect their wallets.

React

```jsx
import { ThirdwebProvider, ConnectButton } from "thirdweb/react";
import { inAppWallet } from "thirdweb/wallets";
 
const client = createThirdwebClient({ clientId });
const wallets = [inAppWallet()];
 
export default function App() {
  return (
    <ThirdwebProvider>
      <ConnectButton client={client} wallets={wallets} />
    </ThirdwebProvider>
  );
}
```

### Choose authentication methods

By default, the connect UI supports Google, Apple, Facebook and email/password authentication. You can customize which authentication methods to support which will be reflected in the UI.

React 

```tsx
import { ThirdwebProvider, ConnectButton } from "thirdweb/react";
import { inAppWallet } from "thirdweb/wallets";
 
const client = createThirdwebClient({ clientId });
const wallets = [
  inAppWallet({
    providers: [
      "email",
      "facebook",
      "apple",
      "google",
      "phone",
      "passkey",
    ],
  }),
];
 
export default function App() {
  return (
    <ThirdwebProvider>
      <ConnectButton client={client} wallets={wallets} />
    </ThirdwebProvider>
  );
}
```
## Sponsor Transactions

By combining [Account abstraction](https://portal.thirdweb.com/connect/account-abstraction) and [In-App Wallet](https://portal.thirdweb.com/connect/in-app-wallet/overview), you can create a truly seamless user experience:

* Gasless transactions sponsored by your application
* Batched transactions
* Full account recovery the user "account"

### Configure in-app wallet for sponsored transactions

To enable account abstraction in your app, you need to add the `smartAccount` prop with the `inAppWallet` creation.

```jsx
import { ConnectButton } from "thirdweb/react";
import { inAppWallet } from "thirdweb/wallets";
 
const wallets = [
  inAppWallet({
    smartAccount: {
      chain: "sepolia",
      sponsorGas: true,
    },
  }),
];
 
export default function App() {
  return (
    <ThirdwebProvider>
      <ConnectButton client={client} wallets={wallets} />
    </ThirdwebProvider>
  );
}
```

This will create an in-app wallet and a smart account for the user. The smart account will be initialized with the in-app wallet as the owner.

You can sponsor transactions simply by passing `sponsrGas: true` to the `smartAccount` prop. This will allow the smart account to send transactions without the user needing to hold any ETH.
## Interact with the blockchain

Once connected, in-app wallets can be used alongside the [Contract SDK](https://portal.thirdweb.com/contracts) to interact with the blockchain.

### Initialize the SDK With Your Wallet

React & React Native Other Frameworks

The `ThirdwebProvider` handles maintaining the connection state, and allows using all the hooks in the SDK to interact with the blockchain as the connected user.

Here's an example using the `TransactionButton` component to claim an NFT on a smart contract:

```tsx
export default function App() {
  const account = useActiveAccount();
 
  return (
    <div>
      <TransactionButton
        transaction={() => {
          if (!account) {
            return alert("Please connect your wallet");
          }
          return claimTo({
            contract,
            to: account.address,
            quantity: 1,
          });
        }}
      >
        Claim NFT
      </TransactionButton>
    </div>
  );
}
```

### Full Reference

View everything you can do in the Connect SDK once you have connected your wallet:
## Configuration

We offer two options to setup in-app wallets with custom auth, one that is based on the [OIDC (Open ID Connect)](https://openid.net/developers/how-connect-works/) standard, and a generic option that lets you bring your own auth server. You can also use both options together if needed.

### OIDC compatible auth

The OIDC auth set-up is a good option if you use an external auth provider like `Auth0`, `firebase`, `cognito` etc. that publishes the JWK for checking the authenticity of the token.

An OIDC auth system has a public-private keypair, where the private key is used to sign auth tokens.

* The public key is uploaded to a public URL in JWKS format. The standard location is `https://{domain}.com/.well-known/jwks.json`
* When a user logs in, a JWT token called the idToken is generated and signed by the private key. The OIDC spec provides an interface for fields that are used in this token.
* This JWT is then passed to the in-app wallet to generate a wallet for the user.
* We will verify the JWT against the public key to verify that the JWT was signed correctly. Upon successful verification, we will proceed to generate a wallet based on the `sub` (user identifier) value of the idToken.

To setup an OIDC compatible auth, enable the first option in the configuration tab of the in-app wallet dashboard

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcustomauthdb.6bc27bae.png&w=3840&q=75)

You will be asked to enter the following values

* The URL of the JWKS file (public key): This is used to verify the token was signed by you.
* The `aud` value of the idToken: This is used to verify that thirdweb is the intended user of the token

#### Authenticating a user via OIDC-compatible auth

ReactTypeScript

```typescript
import { inAppWallet } from "thirdweb/wallets";
import { useConnect } from "thirdweb/react";
 
const { connect } = useConnect();
 
const handlePostLogin = async (jwt: string) => {
  await connect(() => {
    const wallet = inAppWallet();
    wallet.connect({
      client,
      strategy: "jwt",
      jwt,
    });
    return wallet;
  });
};
```

### Generic auth

Generic auth is a lower-level option that can be used when you have your own auth server that you use to authenticate users.

Generic auth is good for supporting other auth methods that we don't support today, like Discord, Twitter, Github etc., or something completely custom.

High-level flow and requirement for generic auth via endpoint:

* When a user logs in, you are able to generate a public identifier that allows you to identify the user.
* You can pass this identifier to the in-app wallet to generate a wallet for the user.
* When verifying the user, we will hit an endpoint that you provide to verify the user's identity.
* We will then generate a wallet for the user if the provided payload is valid.

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcustomauth.791010a3.png&w=3840&q=75)

To use generic auth, enable the second option in the configuration tab of the in-app wallet dashboard

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcustomauthdb2.5bc009c9.png&w=3840&q=75)

You will be asked to enter an endpoint that we can hit to verify the user's identity. This endpoint should accept a POST request with a JSON body containing the following fields:

* `payload`: This will correspond to the public identifier that was generated for your user. Note that this is passed in from the client side via the SDK. See below for an example of how this is used.

The endpoint should return a JSON body containing the following fields:

* `userId`: A uid for the user. This will be used to identify the user in the wallet if no email is present.
* `email` (optional): If provided, the user will be able to access the same account outside of the platform for things like private key export // using with wallet connect etc.  
   * Note: If two different `userId` values are provided with the same email, both `userId` values will be able to access the same wallet.  
   * Conversely, if the same `userId` is provided with two different emails across different login sessions, the `userId` will have two wallets associated with it. Each wallet will be tied to one of the emails.
* `exp` (optional): An expiration date for the user's wallet session. By default, a session is 7 days long.

You can also pass a list of headers. These headers will be sent with every request to your verification endpoint. You can use these to authenticate the request.

#### Authenticating a user via generic auth

Once you've logged in with your own auth, you can pass the user's JWT to the in-app wallet to authenticate and connect.

ReactTypeScript

```typescript
import { inAppWallet } from "thirdweb/wallets";
import { useConnect } from "thirdweb/react";
 
const { connect } = useConnect();
 
const handlePostLogin = async (jwt: string) => {
  await connect(async () => {
    const wallet = inAppWallet();
    await wallet.connect({
      client,
      strategy: "auth_endpoint",
      // This is the payload that is sent to the auth endpoint
      payload,
    });
    return wallet;
  });
};
```
## Interact with users

Once connected, you can interact with user accounts using the `thirdweb/wallets` specific methods.

### Get the user email

```typescript
import { getUserEmail } from "thirdweb/wallets/in-app";
 
const email = await getUserEmail({ client });
console.log("user email", email);
```

### Get the user's account

ReactTypeScript

```typescript
import { useActiveAccount } from "thirdweb/react";
 
const account = useActiveAccount();
```

### Get the user's wallet address

ReactTypeScript

```typescript
import { useActiveAccount } from "thirdweb/react";
 
const account = useActiveAccount();
console.log("wallet address", account.address);
```

### Get wallet balance

```typescript
await getWalletBalance({
  client,
  chain,
  address: account.address,
});
```

### Sign a message

```typescript
await inAppWallet.sign("Hello World!");
```
## PayEmbed Customization

Learn how to customize the `PayEmbed`. You can find a selection of popular customizations below. For the full list of props, you can [view the full reference](https://portal.thirdweb.com/references/typescript/v5/PayEmbedProps).

---

### Customize Supported Tokens

You can enable users to select your token on a given chain by passing an array of `SupportedTokens`. Note that this array overrides all default tokens listed for that chain.

```tsx
<PayEmbed
  client={client}
  payOptions={{
    supportedTokens: {
      "1": [
        {
          address: "0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48",
          name: "USD Coin",
          symbol: "USDC",
          icon: usdcIcon,
        },
      ],
    },
  }}
/>;
```

---

### Prefill Destination Token

In the case you want your users to purchase your token by default in your application, you can choose to pre-fill the Pay purchase flow with `prefillBuy` .

For example, if you wanted users to only purchase Ethereum on Base network, you could do as follows:

```tsx
import { base } from "thirdweb/chains";
 
<PayEmbed
  client={client}
  payOptions={{
    prefillBuy: {
      token: {
        address: "0x866a087038f7C12cf33EF91aC5b1AcE6Ac1DA788",
        name: "Base ETH",
        symbol: "ETH",
        icon: "...", // optional
      },
      chain: base,
      allowEdits: {
        amount: true, // allow editing buy amount
        token: false, // disable selecting buy token
        chain: false, // disable selecting buy chain
      },
    },
  }}
/>;
```

If you'd like to prefill a purchase with a native token, you can set the chain without passing a token:

```tsx
<PayEmbed
  client={client}
  payOptions={{
    prefillBuy: {
      chain: base,
    },
  }}
/>;
```

---

### Preferred Provider

You can specify which onramp provider to present to your users. By default, we choose a recommended provider based on the location of the user, KYC status, and currency. Please make sure your set provider is [available in your country](../onramp-providers).

```tsx
<PayEmbed
  client={client}
  payOptions={{
    preferredProvider: "STRIPE" | "KADO" | "TRANSAK",
  }}
/>;
```

---

### Disable Payment Methods

In some cases, you may only want to show users fiat or crypto payment options for your onchain goods or services. You can do this by setting either `buyWithCrypto` or `buyWithFiat` to `false`.

##### Disable Buy With Crypto

```tsx
<PayEmbed
  client={client}
  payOptions={{
    buyWithCrypto: false,
  }}
/>;
```

##### Disable Buy With Fiat

```tsx
<PayEmbed
  client={client}
  payOptions={{
    buyWithFiat: false,
  }}
/>;
```

---

### Theme

You can set the theme for the component, which is set to `"dark"` by default. theme can be set to either `"dark"` , `"light"` or a custom theme object.

We have [lightTheme](https://portal.thirdweb.com/references/typescript/v5/lightTheme) or [darkTheme](https://portal.thirdweb.com/references/typescript/v5/darkTheme) providers that you can override to kickstart customization.

You can refer to our [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme) page for a full view of customizable options if you’d prefer to create a custom theme from scratch.

##### Provided Themes

```tsx
<PayEmbed theme='light' />
 
<PayEmbed theme='dark' />
```

##### Custom Theme

```tsx
import { darkTheme } from 'thirdweb/react';
 
// Using custom theme
<PayEmbed theme={darkTheme({ ... })} />
```
## useSendTransaction Customization

Learn how to customize the Universal Bridge interface when executing a transaction with `useSendTransaction`. You can find a selection of popular customizations below. For the full list of props, you can [view the full reference](https://portal.thirdweb.com/references/typescript/v5/SendTransactionConfig).

---

### Customize Supported Tokens

You can enable users to select your token on a given chain by passing an array of `SupportedTokens`. Note that this array overrides all default tokens listed for that chain.

```tsx
const { mutate: sendTransaction } = useSendTransaction({
  payModal: {
    supportedTokens: {
      "1": [
        {
          address: "0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48",
          name: "USD Coin",
          symbol: "USDC",
          icon: usdcIcon,
        },
      ],
    },
  },
});
```

---

### Prefill Destination Token

In the case you want your users to purchase your token by default in your application, you can choose to pre-fill the Pay purchase flow with `prefillBuy` .

For example, if you wanted users to only purchase Ethereum on Base network, you could do as follows:

```tsx
import { base } from "thirdweb/chains";
 
const { mutate: sendTransaction } = useSendTransaction({
  payModal: {
    prefillBuy: {
      token: {
        address: "0x866a087038f7C12cf33EF91aC5b1AcE6Ac1DA788",
        name: "Base ETH",
        symbol: "ETH",
        icon: "...", // optional
      },
      chain: base,
      allowEdits: {
        amount: true, // allow editing buy amount
        token: false, // disable selecting buy token
        chain: false, // disable selecting buy chain
      },
    },
  },
});
```

If you'd like to prefill a purchase with a native token, you can set the chain without passing a token:

```tsx
const { mutate: sendTransaction } = useSendTransaction({
  payModal: {
    prefillBuy: {
      chain: base,
    },
  },
});
```

---

### Preferred Provider

You can specify which onramp provider to present to your users. By default, we choose a recommended provider based on the location of the user, KYC status, and currency. Please make sure your set provider is [available in your country](../onramp-providers).

```tsx
const { mutate: sendTransaction } = useSendTransaction({
  payModal: {
    preferredProvider: "STRIPE" | "KADO" | "TRANSAK",
  },
});
```

---

### Disable Payment Methods

In some cases, you may only want to show users fiat or crypto payment options for your onchain goods or services. You can do this by setting either `buyWithCrypto` or `buyWithFiat` to `false`.

##### Disable Buy With Crypto

```tsx
const { mutate: sendTransaction } = useSendTransaction({
  payModal: {
    buyWithCrypto: false,
  },
});
```

##### Disable Buy With Fiat

```tsx
const { mutate: sendTransaction } = useSendTransaction({
  payModal: {
    buyWithFiat: false,
  },
});
```

---

### Theme

You can set the theme for the component, which is set to `"dark"` by default. theme can be set to either `"dark"` , `"light"` or a custom theme object.

We have [lightTheme](https://portal.thirdweb.com/references/typescript/v5/lightTheme) or [darkTheme](https://portal.thirdweb.com/references/typescript/v5/darkTheme) providers that you can override to kickstart customization.

You can refer to our [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme) page for a full view of customizable options if you’d prefer to create a custom theme from scratch.

##### Provided Themes

```tsx
const { mutate: sendTransaction } = useSendTransaction({
  payModal: {
    theme: "dark", // or "light"
  },
});
```

##### Custom Theme

```tsx
import { darkTheme } from 'thirdweb/react';
 
// Using custom theme
const { mutate: sendTransaction } = useSendTransaction({
	payModal: {
		theme: darkTheme({ ... },
	}}
);
```
## Customize ConnectButton

Learn how to customize Universal Bridge within the `ConnectButton` interface. You can find a selection of popular customizations below. For the full list of props, you can [view the full reference](https://portal.thirdweb.com/references/typescript/v5/ConnectButtonProps).

---

### Customize Supported Tokens

You can enable users to select your token on a given chain by passing an array of `SupportedTokens`. Note that this array overrides all default tokens listed for that chain. Note that this will also show these tokens in the 'Send' screen to transfer tokens.

```tsx
<ConnectButton
  client={client}
  supportedTokens={{
    "1": [
      {
        address: "0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48",
        name: "USD Coin",
        symbol: "USDC",
        icon: usdcIcon,
      },
    ],
  }}
/>;
```

---

### Prefill Destination Token

In the case you want your users to purchase your token by default in your application, you can choose to pre-fill the Universal Bridge purchase flow with `prefillBuy` .

For example, if you wanted users to only purchase Ethereum on Base network, you could do as follows:

```tsx
import { base } from "thirdweb/chains";
 
<ConnectButton
  client={client}
  detailsModal={{
    payOptions: {
      prefillBuy: {
        token: {
          address: "0x866a087038f7C12cf33EF91aC5b1AcE6Ac1DA788",
          name: "Base ETH",
          symbol: "ETH",
          icon: "...", // optional
        },
        chain: base,
        allowEdits: {
          amount: true, // allow editing buy amount
          token: false, // disable selecting buy token
          chain: false, // disable selecting buy chain
        },
      },
    },
  }}
/>;
```

If you'd like to prefill a purchase with a native token, you can set the chain without passing a token:

```tsx
<ConnectButton
  client={client}
  detailsModal={{
    payOptions: {
      prefillBuy: {
        chain: base,
      },
    },
  }}
/>;
```

---

### Preferred Provider

You can specify which onramp provider to present to your users. By default, we choose a recommended provider based on the location of the user, KYC status, and currency. Please make sure your set provider is [available in your country](../onramp-providers).

```tsx
<ConnectButton
  client={client}
  detailsModal={{
    payOptions: {
      preferredProvider: "STRIPE" | "KADO" | "TRANSAK",
    },
  }}
/>;
```

---

### Disable Payment Methods

In some cases, you may only want to show users fiat or crypto payment options for your onchain goods or services. You can do this by setting either `buyWithCrypto` or `buyWithFiat` to `false`.

##### Disable Buy With Crypto

```tsx
<ConnectButton
  client={client}
  detailsModal={{
    payOptions: {
      buyWithCrypto: false,
    },
  }}
/>;
```

##### Disable Buy With Fiat

```tsx
<ConnectButton
  client={client}
  detailsModal={{
    payOptions: {
      buyWithFiat: false,
    },
  }}
/>;
```

---

### Theme

You can set the theme for the Universal Bridge component, which is set to `"dark"` by default. theme can be set to either `"dark"` , `"light"` or a custom theme object.

We have [lightTheme](https://portal.thirdweb.com/references/typescript/v5/lightTheme) or [darkTheme](https://portal.thirdweb.com/references/typescript/v5/darkTheme) providers that you can override to kickstart customization.

You can refer to our [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme) page for a full view of customizable options if you’d prefer to create a custom theme from scratch.

##### Provided Themes

```tsx
<ConnectButton theme='light' />
 
<ConnectButton theme='dark' />
```

##### Custom Theme

```tsx
import { darkTheme } from 'thirdweb/react';
 
// Using custom theme
<ConnectButton theme={darkTheme({ ... })} />
```
## Next.js

If you want to interact with a working version of the Auth + Next integration that we'll be building in this guide, you can check the following GitHub repository, or clone it with the command below:

```

```

thirdweb-auth-next

Auth Next example repository.

[GitHubView on GitHub](https://github.com/thirdweb-example/thirdweb-auth-next)

### Installation & Setup

npmyarnpnpmbun

`npm i thirdweb

`

Setup your `.env` file with the following:

```bash
# the DOMAIN is the domain of the application
NEXT_PUBLIC_THIRDWEB_AUTH_DOMAIN=
# Get your client id from the thirdweb dashboard: https://thirdweb.com/create-api-key
NEXT_PUBLIC_THIRDWEB_CLIENT_ID=
# Get your secret key from the thirdweb dashboard: https://thirdweb.com/create-api-key
THIRDWEB_SECRET_KEY=
# A private key that will be used to sign the JWT for the `jwt-cookie` authentication method
# this does *not* need to hold any funds, can be any valid private key to sign with
AUTH_PRIVATE_KEY=
```

### Client-side Setup

Create a `lib` directory inside `src` and create a `client.ts` file inside it:

```tsx
// lib/client.ts
import { createThirdwebClient } from "thirdweb";
 
const clientId = process.env.NEXT_PUBLIC_THIRDWEB_CLIENT_ID!; // this will be used on the client
const secretKey = process.env.THIRDWEB_SECRET_KEY!; // this will be used on the server-side
 
export const client = createThirdwebClient(
  secretKey ? { secretKey } : { clientId },
);
```

Add the `ThirdwebProvider` in your root layout:

```tsx
// app/layout.tsx
import { ThirdwebProvider } from "thirdweb/react";
 
const Layout = ({ children }: { children: React.ReactNode }) => {
  return <ThirdwebProvider>{children}</ThirdwebProvider>;
};
 
export default Layout;
```

There are two ways to setup Auth on the client-side of a Next.js application, the Connect Button or your own custom component. For both cases, we'll use a JWT in a cookie to store the user's session and authenticate across the app. The connect button will handle a lot of the underlying complexity for you, but if you would like to bring your own components the functions it uses are exposed for your custom use case.

Connect ButtonCustom Component

Wherever you'd like your connect/login button, place the `ConnectButton` component.

```tsx
// app/page.tsx
import type { NextPage } from "next";
import { ConnectButton } from "thirdweb/react";
import { client } from "@/lib/client";
import {
  generatePayload,
  isLoggedIn,
  login,
  logout,
} from "@/actions/login"; // we'll create this file in the next section
 
const Page = () => {
  return (
    <ConnectButton
      client={client}
      auth={{
        isLoggedIn: async (address) => {
          console.log("checking if logged in!", { address });
          return await isLoggedIn();
        },
        doLogin: async (params) => {
          console.log("logging in!");
          await login(params);
        },
        getLoginPayload: async ({ address }) =>
          generatePayload({ address }),
        doLogout: async () => {
          console.log("logging out!");
          await logout();
        },
      }}
    />
  );
};
 
export default Page;
```

Use this component anywhere in your application. To try it out, we'll put it in the root `page.tsx`:

```tsx
// app/page.tsx
import ConnectButton from "@/components/ConnectButton";
 
const Home = () => {
  return <ConnectButton />;
};
 
export default Home;
```

### Server-side Setup

We'll use server functions to keep your login secure and concise.

Create an `actions` directory with a `login.ts` file with the following:

```tsx
"use server";
import { VerifyLoginPayloadParams, createAuth } from "thirdweb/auth";
import { privateKeyToAccount } from "thirdweb/wallets";
import { client } from "@/lib/client";
import { cookies } from "next/headers";
 
const privateKey = process.env.AUTH_PRIVATE_KEY || "";
 
if (!privateKey) {
  throw new Error("Missing AUTH_PRIVATE_KEY in .env file.");
}
 
const thirdwebAuth = createAuth({
  domain: process.env.NEXT_PUBLIC_THIRDWEB_AUTH_DOMAIN || "",
  adminAccount: privateKeyToAccount({ client, privateKey }),
  client: client,
});
 
export const generatePayload = thirdwebAuth.generatePayload;
 
export async function login(payload: VerifyLoginPayloadParams) {
  const verifiedPayload = await thirdwebAuth.verifyPayload(payload);
  if (verifiedPayload.valid) {
    const jwt = await thirdwebAuth.generateJWT({
      payload: verifiedPayload.payload,
    });
    cookies().set("jwt", jwt);
  }
}
 
export async function isLoggedIn() {
  const jwt = cookies().get("jwt");
  if (!jwt?.value) {
    return false;
  }
 
  const authResult = await thirdwebAuth.verifyJWT({ jwt: jwt.value });
  return authResult.valid;
}
 
export async function logout() {
  cookies().delete("jwt");
}
```

You can include custom context in the JWT token with the `context` parameter:

```ts
const jwt = await thirdwebAuth.generateJWT({
  payload: verifiedPayload.payload,
  context: {
    admin: true,
  },
});
```

Now anywhere in your project, you can check a user's authentication status:

```tsx
import { redirect } from "next/navigation";
import { isLoggedIn } from "../actions/login";
 
const AuthenticatedPage = async () => {
  // redirect back if user is not logged in
  if (!(await isLoggedIn())) {
    redirect("/connect-button");
  }
 
  return (
    <div>
      <h1>Logged In Page</h1>
      <p>You are logged in, so you can see this page!</p>
    </div>
  );
};
 
export default AuthenticatedPage;
```

That's it! You now have a working SIWE Next.js app.

### Support

For help or feedback, please [visit our support site](https://thirdweb.com/support)
## Fee Sharing

thirdweb collects a 1% fee per end user transaction. We share 70% of this fee with you.

For example, if a user purchases $100 worth of Polygon through your application, thirdweb charges a total of $1.00\. thirdweb collects $0.30 and sends $0.70 to you.

Plase note that fee sharing only applies to fees collected through swaps and bridges. Fiat purchases do not currently qualify for fee sharing.

To participate in fee sharing, all you need to do is set a recipient address in your dashboard. Your recipient address can be configured in your dashboard by navigating to your Team > Project > Connect > Universal Bridge in [thirdweb dashboard](https://www.thirdweb.com/team).

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fpay-settings.a7e360e8.png&w=3840&q=75)
## FAQs

##### What are the fees for Buy With Fiat?

thirdweb does not charge any fees for buy with fiat. Any fees on onramping are based on the onramp provider.

##### What are the fees for Buy With Crypto?

For buying with crypto, thirdweb charges 0.3% and the application developer may charge up to 0.7% on each transaction

##### How does fee sharing work for Buy With Crypto?

thirdweb shares 70% of all fees collected through Buy With Crypto with our developers. Fee sharing is not currently available for Buy With Fiat transactions.

##### What does the term “network fees” refer to?

Network fees, also referred to as miner fees, are paid to the miner for processing crypto transactions and securing the respective network. These fees do not go to thirdweb.

##### What are your transaction limits for Buy With Fiat?

We currently require a $1 minimum purchase for both stablecoin and non-stablecoin purchases through Buy With Fiat.

Our transaction maximum starts from $1500 per week for new users and can increase over time to $10,000 per week.

##### What countries does Buy With Fiat support?

**Buy With Fiat** is available 130+ countries. The following countries are _UNSUPPORTED_:

* Afghanistan
* Africa (All Countries)
* Belarus
* Bolivia
* China
* Cuba
* Colombia
* Haiti
* Honduras
* Iran
* Iraq
* Latvia
* Lebanon
* Myanmar
* Pakistan
* Qatar
* Russia
* Ukraine
* United Arab Emirates
* Venezuela
* Yemen

All United States are supported, excluding Hawaii.

##### Does thirdweb offer direct onramping to tokens through Buy With Fiat?

We offer direct onramping **internationally** to the following tokens:

* Mainnet (Ethereum)
* Avalanche
* Polygon

We offer direct onramping to the following tokens in the **US only**:

* ETH (Base)\*
* USDC (Ethereum)
* USDC (Polygon)\*
* USDC (Avalanche)\*
* USDC (Base)\*

All other tokens will require an additional Buy With Crypto step.

\* Not available in New York or the EU.

##### How does KYC work with Buy With Fiat

Users will be required to complete KYC verification for their first purchase using 'Buy with Fiat.' After that, no further KYC will be needed for future purchases on the same platform.

##### What cryptocurrencies does Universal Bridge support?

Universal Bridge can support any currency on our [supported chains](https://portal.thirdweb.com/connect/pay/supported-chains).

##### How are cryptocurrency prices set in thirdweb Universal Bridge?

Prices are set depending on the liquidity provider used to route your transaction.

##### Does thirdweb Universal Bridge offer fiat payouts?

Fiat payouts are not currently available.
## Overview

Universal Bridge allows your users to bridge, swap, and purchase cryptocurrencies and execute transactions with any fiat options or tokens via cross-chain routing.

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fpay-overview.ae31105e.png&w=3840&q=75)

### Features

![](/icons/feature-cards/earn-money.svg)

##### Earn money

Receive 70% of fees on each crypto-to-crypto transaction

![](/icons/feature-cards/onboard-users.svg)

##### Onboard users

Fiat on-ramps to enable purchases with traditional payment methods

![](/icons/feature-cards/in-app-purchase.svg)

##### Enable in-app purchases

Purchase crypto without leaving the application

![](/icons/feature-cards/chain-coverage.svg)

##### Chain Coverage

Support purchases on over 20+ widely used EVM chains

![](/icons/feature-cards/liquidity-aggregation.svg)

##### Liquidity Aggregation

Ensure every transaction is possible

![](/icons/feature-cards/global-coverage.svg)

##### Global Coverage

Support for over 130+ countries

![](/icons/feature-cards/integration-options.svg)

##### Integration Options

Use pre-built modals or customize the transaction experience

![](/icons/feature-cards/security.svg)

##### Secure

Strict one-time approvals mean user funds are not at risk of smart contract allowance exploits

### Supported Chains

Universal Bridge is supported on select EVM compatible chains. To view the full list, visit [thirdweb chainlist](https://thirdweb.com/chainlist?service=pay).

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fsupported-chains.eca8603d.png&w=3840&q=75)

### Fee Sharing

Thirdweb collects a 1% fee per end-user transaction and shares 70% of that fee with you. For example, on a $100 Polygon purchase, a $1.00 fee is charged—of which $0.30 is retained by thirdweb and $0.70 is remitted to you.

Note: Fee sharing applies only to fees from swaps and bridges; fiat purchases are excluded.

To enable fee sharing, simply set a recipient address in your dashboard under Team > Project > Connect > Universal Bridge in the thirdweb dashboard.

### Onramp providers

| Provider | Supported Countries                                                                                       |
| -------- | --------------------------------------------------------------------------------------------------------- |
| Transak  | <https://transak.notion.site/On-Ramp-Payment-Methods-Fees-Other-Details-b0761634feed4b338a69f4f186d906a5> |
| Kado     | <https://www.kado.money/supported-countries>                                                              |
| Stripe   | <https://docs.stripe.com/crypto/onramp>                                                                   |

Specify a preferred onramp provider by setting the preferredProvider parameter in ConnectButton, PayEmbed, or Headless Integration. For details, refer to[customization](../pay/customization/connectbutton#preferredProvider) or the [API Reference for preferredProvider](https://portal.thirdweb.com/references/typescript/v5/GetBuyWithFiatQuoteParams).

### Integration Options

| OPTION                                                                                                                         | BEST FOR                                                                                                                                  |
| ------------------------------------------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------------------------- |
| [ConnectButton](https://portal.thirdweb.com/connect/pay/get-started#option-1-connectbutton)                                    | Developers who want out-of-the-box support complete with wallet and social login.                                                         |
| [PayEmbed](https://portal.thirdweb.com/connect/pay/get-started#option-2-embed-pay)                                             | Developers who want onramp and crypto purchase experiences directly in their application.                                                 |
| [Transaction Flow (sendTransaction)](https://portal.thirdweb.com/connect/pay/get-started#option-3-send-a-transaction-with-pay) | Developers who want users to onramp or purchase crypto directly into a transaction. Great for minting and NFT purchase flows.             |
| [Custom Universal Bridge Experience](https://portal.thirdweb.com/connect/pay/build-a-custom-experience)                        | Developers who want full customization over every step of the onramp process, from displaying quotes to polling for transaction statuses. |
## Supported Chains

[View all supported chains with Universal Bridge](https://thirdweb.com/chainlist?service=pay).

If you’d like to suggest a chain for us to support, [contact us](https://thirdweb.com/contact-us).
## Build a Custom Fiat Experience

Learn how to enable your users to purchase your application’s token with any fiat payment method with our headless flow.

In this guide, we'll show you how to purchase 0.01 Base ETH from USD in Typescript.

Our `PayEmbed` component handles the complexity of the process detailed below and can be integrated in minutes. We encourage you to check out the [PayEmbed guide here](https://portal.thirdweb.com/connect/pay/get-started#option-2-embed-pay).

---

* #### Install the Connect SDK  
npmyarnpnpm  
`npm i thirdweb  
`  
* #### Get Your Client ID  
Log in to the [thirdweb dashboard](https://thirdweb.com/team). Click on Create New > Project to get your **Client ID**. You'll need your Client ID to interact with the Connect SDK.
* #### Get a “Buy with Fiat” quote  
Buying with fiat can require one or two steps depending on your destination token:  
If the destination token __can_ be bought directly with fiat, your users can onramp directly to their destination token.  
If the destination token __can not_ be bought directly with fiat, your users will need to onramp to an intermediate token, then convert the onramp token to the destination token.  
For example, when Buying Base ETH:  
   * Users will receive Avalance AVAX ( native token ) in exchange for USD  
   * Users will be prompted to convert Avalanche AVAX to Base ETH  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Favax-to-usd.2d24741f.png&w=3840&q=75)  
This process requires your user's wallet address. Refer to [this guide](https://portal.thirdweb.com/typescript/v5/connecting-wallets) to learn how to connect a wallet.  
```tsx  
import { getBuyWithFiatQuote } from "thirdweb/pay";  
import { NATIVE_TOKEN_ADDRESS } from "thirdweb";  
import { base } from "thirdweb/chains";  
   
// create a thirdweb client  
const client = createThirdwebClient({  
  clientId: "<your_client_id>",  
});  
   
// Get a quote for buying 0.01 Base ETH with USD  
const quote = await getBuyWithFiatQuote({  
  client: client, // thirdweb client  
  fromCurrencySymbol: "USD", // fiat currency symbol  
  toChainId: base.id, // base chain id  
  toAmount: "0.01", // amount of token to buy  
  toTokenAddress: NATIVE_TOKEN_ADDRESS, // native token  
  toAddress: "0x...", // user's wallet address  
});  
   
// display quote information to user  
console.log(quote.fromCurrencyWithFees);  
console.log(quote.processingFees);  
console.log(quote.onRampToken);  
console.log(quote.toToken);  
console.log(quote.estimatedDurationSeconds);  
// etc...  
```  
The `quote` object contains detailed transaction information including the estimated time, processing fees, amount of fiat currency required, and more that you can display in your application.
* #### Check for a Buy With Crypto Step  
The `quote` object contains `quote.onRampToken` and `quote.toToken` objects containing intermediate and detination token information.  
If `quote.onRampToken` is not the same as `quote.toToken`, then your users will need to onramp to intermediary token before arriving at their destination token.  
You can use `isSwapRequiredPostOnramp` to check this  
```tsx  
import { isSwapRequiredPostOnramp } from "thirdweb/pay";  
   
const hasTwoSteps = isSwapRequiredPostOnramp(quote);  
   
if (hasTwoSteps) {  
  // display the two steps to the user  
}  
```
* #### Display the Onramp Experience  
Once you have a `quote` from `getBuyWithFiatQuote`, you can open a new tab with `quote.onRampLink` to show the onramp experience. This onramp experience handles all regulatory requirements, know your customer (KYC) verifications, and sanctions screening.  
After they've KYC'd (if required), customers have the option of saving payment methods, KYC data, and wallet information in the onramp, which makes the returning onramp experience much faster.  
Your users will be able to purchase the `quote.onRampToken` with the specified fiat currency.  
```ts  
window.open(quote.onRampLink, "_blank");  
```
* #### Poll for Transaction Status  
When you open the `quote.onRampLink` in a new tab, you can begin polling for the onramp transaction status in your app by calling `getBuyWithFiatStatus`.  
`getBuyWithFiatStatus` requires an `intentId` which you can get from `quote` object.  
`getBuyWithFiatStatus` requires passing an `intentId` which you can get from `quote` object.  
There are a number of transactions statuses:  
```tsx  
// Keep calling the below code at some regular intervals to poll the status  
   
const fiatStatus = await getBuyWithFiatStatus({  
  client: client, // thirdweb client  
  intentId: quote.intentId, // pass intentId from quote  
});  
   
if (fiatStatus.status === "NOT_FOUND") {  
  // invalid intentId  
  // Show error in your page  
}  
   
if (fiatStatus.status === "NONE") {  
  // No information available yet  
  // Show "loading" status on your page  
  // keep polling  
}  
   
if (fiatStatus.status === "PENDING_PAYMENT") {  
  // Payment is in progress in the on-ramp provider  
  // Show "loading" status on your page  
  // keep polling  
}  
   
if (fiatStatus.status === "PENDING_ON_RAMP_TRANSFER") {  
  // payment is done, on-ramp process has not started  
  // show "loading" status on your page  
  // keep polling  
}  
   
if (fiatStatus.status === "ON_RAMP_TRANSFER_IN_PROGRESS") {  
  // on-ramp provider is doing on-ramp with fiat currency  
  // show "loading" status on your page  
  // keep polling  
}  
   
if (fiatStatus.status === "ON_RAMP_TRANSFER_FAILED") {  
  // on-ramp provider failed to do onramp  
  // show error in your UI  
  // STOP polling  
}  
   
if (fiatStatus.status === "ON_RAMP_TRANSFER_COMPLETED") {  
  // if only on-ramp is required - process is done!  
  if (!hasTwoSteps) {  
    // show "success"  
    // Stop polling  
    // That's it!  
  } else {  
    // Wait for "CRYPTO_SWAP_REQUIRED" state to convert tokens  
    // Show "loading" status on your page  
    // Stop polling  
  }  
}  
   
if (fiatStatus.status === "CRYPTO_SWAP_REQUIRED") {  
  // go to step 5  
  // Show UI for Buy with Crypto quote.onRampToken to quote.toToken  
  // Stop polling  
}  
```
* #### Get a Buy With Crypto Quote (Optional)  
This step is only relevant when a crypto-to-crypto purchase is required after perfmorming an onramp to an intermediary token.  
In this case, you can use `getPostOnRampQuote` to get a quote to convert the intermediary token to the destination token.  
```tsx  
// when fiatStatus.status === "CRYPTO_SWAP_REQUIRED"  
// and hasTwoStep === true  
   
const swapQuote = await getPostOnRampQuote({  
  client: client,  
  buyWithFiatStatus: fiatStatus,  
});  
   
if (!swapQuote) {  
  // invalid fiatStatus status  
} else {  
  // Go to step 6 to kick off the "Swap" flow  
}  
```
* #### Execute Buy With Crypto  
Executing Buy With Crypto may involve either a single step or 2 steps  
If your source token is an ERC-20 token, an approval step is required before executing the Buy With Crypto transaction.  
You can check if approval is required by checking `quote.approval`  
```tsx  
import { sendTransaction, waitForReceipt } from "thirdweb";  
   
const account = wallet.getAccount();  
   
// If approval is required, send the approval transaction  
// show a button to user to request approval and send the transaction on click  
if (quote.approval) {  
  // request spending tokens from wallet  
  const approveTxResult = await sendTransaction({  
    transaction: quote.approval, // approval transaction  
    account: account, // account from user's connected wallet  
  });  
   
  await waitForReceipt(approveTxResult);  
}  
   
// The above step may result in error if user rejects or transaction fails  
// If it results in error, it needs to be done again until its successful  
   
// Once the approval is done, you can send the buyWithCrypto transaction  
// show a button to user to request sending buyWithCrypto transaction and send the transaction on click  
const buyWithCryptoTxResult = await sendTransaction({  
  transaction: quote.transactionRequest,  
  account: account,  
});  
   
await waitForReceipt(buyWithCryptoTxResult);  
   
// Save the buy with crypto transaction hash for polling the status as mentioned in step 7  
const buyWithCryptoTxHash = buyWithCryptoTxResult.transactionHash;  
```
* #### Poll for Buy With Crypto Status  
Once you've initiated your Buy With Crypto transaction, you'll want to track the status. You can notify users throughout this journey by checking for the following statuses:  
```tsx  
import { getBuyWithCryptoStatus } from 'thirdweb/pay'  
   
// Keep calling the below code at regular intervals if the status is in a pending state  
   
const swapStatus = await getBuyWithCryptoStatus({  
   client: client,  
   transactionHash: swapTxHash,  
}});  
   
if (swapStatus.status === "NOT_FOUND") {  
// invalid swap tx  
// Show error in your page  
// Stop polling  
}  
   
if (swapStatus.status === "NONE") {  
// No information available yet  
// show "loading" in UI  
// Keep polling  
}  
   
if (swapStatus.status === "FAILED") {  
// swap failed  
// show "error" in UI - show a retry option in UI  
// Stop polling  
}  
   
if (swapStatus.status === "COMPLETED") {  
// swap completed  
// show "success" in UI  
// Stop polling  
}  
   
if (swapStatus.status === "PENDING") {  
// swap is in progress  
// show "loading" in UI  
// Keep polling  
}  
```

---

#### Build a Custom Experience in React

If you are using React, we provide Hooks for each of the functions mentioned above:

| React Hook           | Typescript           |
| -------------------- | -------------------- |
| useBuyWithFiatQuote  | getBuyWithFiatQuote  |
| usePostOnrampQuote   | getPostOnrampQuote   |
| useBuyWithFiatStatus | getBuyWithFiatStatus |
## Accept Direct Payments with Universal Bridge & Engine

Learn how to accept fiat and crypto from your customers with Universal Bridge and trigger Engine actions, like minting NFTs or transferring tokens to user wallets.

#### Requirements

* [A thirdweb Client ID](https://portal.thirdweb.com/typescript/v5/client)
* [An Engine Instance](https://thirdweb.com/team/~/~/engine)

#### Purchase Flow Overview

Before jumping in, it's important to understand the full system, from initial purchase to the eventual transfer of assets. This is a four step process (with an optional fifth):

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fdirect-payments-flow.3efc9889.png&w=3840&q=75)

* **User Initiates Purchase:** User sends specified funds (ETH, MATIC, USD, etc.) to your wallet via thirdweb Universal Bridge.  
   * Your wallet can be any business wallet you choose or your Engine backend wallet.  
   * Use the `purchaseData` field to pass any item data needed in the webhook. E.g., `{ nftId: 1 }`.
* **Universal Bridge Processes Purchase:** thirdweb Universal Bridge processes the transaction and sends a [Purchase Complete webhook](https://portal.thirdweb.com/connect/pay/webhooks#purchase-complete) to your dapp’s server when the transaction is complete.
* **Your Server Calls Engine:** Your server processes the webhook and sends a contract call to the thirdweb Engine backend wallet to perform the item purchase.
* **Engine Executes the Transaction:** Engine backend wallet executes the transaction needed to deliver the token(s) to the user’s address.
* **(Optional) User Is Notified :** Your server confirms the completed Engine transaction and notifies the user.

Now, let's get started.

* #### Set Up thirdweb Engine  
   * If you haven't already, log in and [deploy an Engine instance](https://thirdweb.com/team/~/~/engine)  
   * Create or import a backend wallet for Engine in [your Engine dashboard](https://thirdweb.com/team/~/~/engine).  
   * Send the required funds to the backend wallet  
         * For example, if purchasing with Arb Nova USDC, then your backend wallet should hold this ERC20 token.  
         * If your backend wallet holds an ERC20 token, ensure to add a native token balance as well to cover gas costs. For example, for a transaction on Arbitrum Nova, your backend wallet should hold both Arb Nova USDC (for payment) and Arb Nova ETH (for gas).  
         * Your backend wallet should hold enough liquidity to handle any anticipated purchasing volume.  
   * Make a plan to monitor and keep the float wallet topped up to avoid any issues with the service.
* #### Integrate thirdweb Universal Bridge (Client)  
   * [Integrate thirdweb Universal Bridge](https://portal.thirdweb.com/connect/pay/build-a-custom-experience) on the client side to enable fiat and crypto payments.  
   * Specify the required parameters for your Universal Bridge transaction.  
   ```ts  
   const quote = await getBuyWithFiatQuote({  
     client: client, // thirdweb client  
     fromCurrencySymbol: "USD", // fiat currency symbol  
     toChainId: arbnova.id, // arbitrum nova chain id  
     toAmount: "100", // amount of token to buy  
     toTokenAddress: USDC_TOKEN_ADDRESS, // address of payment token  
     fromAddress: "<USERS_WALLET_ADDRESS>",  
     toAddress: "<YOUR_WALLET_ADDRESS>",  
     purchaseData: {  
       nftId: 1,  
     },  
   });  
   ```  
   | Parameter          | Type   | Description                                                                                                                                                 |  
   | ------------------ | ------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------- |  
   | fromCurrencySymbol | string | The fiat currency symbol you'd like to accept (currently limited to USD and EUR)                                                                            |  
   | toChainId          | string | [Chain ID](https://thirdweb.com/chainlist) for the destination token.                                                                                       |  
   | toTokenAddress     | string | Address of the destination token.                                                                                                                           |  
   | toAmount           | string | The price of the asset denominated in your desination token.                                                                                                |  
   | fromAddress        | string | The user's wallet address.                                                                                                                                  |  
   | toAddress          | string | The wallet you'd like funds to be sent to. This can be your business wallet or an Engine backend wallet.                                                    |  
   | purchaseData       | Object | Any details you need to pass in order to track your transaction. If this is a secondary sale, you may want to include details like { nftId: 1, orderId: 1 } |
* #### Integrate thirdweb Universal Bridge (Server)  
   * Log in & create a “Purchase Complete” webhook in your Team > Connect > Universal Bridge > Webhooks page.  
   * The [Universal Bridge webhook POST response](https://portal.thirdweb.com/connect/pay/webhooks#purchase-complete) will include the BuyWithCryptoStatus or BuyWithFiatStatus in the body.  
         * This will also include the purchaseData you previously passed (metadata identifying the customer information, etc.).  
         * A request will be sent on every status change.  
   * Listen for [completed purchase statuses](https://portal.thirdweb.com/connect/pay/build-a-custom-experience#Poll%20for%20Transaction%20Status). Note that if this is a two-step BuyWithFiat transaction (onramp, then swap), you should also listen for `CRYPTO_SWAP_COMPLETED`  
   * When a purchase is completed, determine the purchaser, order and validate the amounts.  
         * The fromAddress in the status will show purchasing address  
         * The purchaseData will contain more information you previously for the purchase details  
         * Validate the information. For example, 100 USDC was sent to your wallet.  
   * Send a contract call to Engine for the float wallet to purchase the item  
         * For example, send a transaction to the float wallet for `mintTo(fromAddress)`  
         * For secondary purchases, like a marketplace direct listing, you can use the appropriate Engine endpoint, passing the ultimate recipient of the NFT as the buyer  
   * Confirm the purchase was successful.

Once you've completed all of these steps, you'll be ready to offer a great purchase UX for your users.
## Webhooks

Pay can be configured to send webhook events to notify your application any time an event happens on your transaction. Pay sends a response, via a HTTP request, to any endpoint URLs that you have provided us in your Team > Project > Connect > Pay > Webhooks page in [thirdwe dashboard](https://thirdweb.com/team).

### Events

To listen to events, create a webhook in your Team > Project > Connect > Pay > Webhooks page in [thirdweb dashboard](https://thirdweb.com/team). Webhook URLs must start with `https://`.

| Event              | Description                         |
| ------------------ | ----------------------------------- |
| purchase\_complete | A transaction is confirmed onchain. |

#### Purchase Complete

Triggered when a transaction is confirmed onchain. This event provides information about the new status of the order and its transactionHash, as well as other relevant information.

Example Response:

Fiat PurchaseCrypto Purchase

```json
{
  "data": {
    "buyWithFiatStatus": {
      "intentId": "f4cf8ab7-bb62-4b3b-a180-70fc7d72446c",
      "status": "ON_RAMP_TRANSFER_COMPLETED",
      "toAddress": "0xebfb127320fcbe8e07e5a03a4bfb782219f4735b",
      "quote": {
        "createdAt": "2024-06-18T23:46:46.024Z",
        "fromCurrency": {
          "amountUnits": "279",
          "amount": "2.79",
          "currencySymbol": "USD",
          "decimals": 2,
          "amountUSDCents": 279
        },
        "fromCurrencyWithFees": {
          "amountUnits": "294",
          "amount": "2.94",
          "currencySymbol": "USD",
          "decimals": 2,
          "amountUSDCents": 279
        },
        "onRampToken": {
          "chainId": 137,
          "tokenAddress": "0xeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee",
          "name": "Matic",
          "symbol": "MATIC",
          "decimals": 18,
          "priceUSDCents": 54.797200000000004
        },
        "toToken": {
          "chainId": 137,
          "tokenAddress": "0xeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee",
          "name": "Matic",
          "symbol": "MATIC",
          "decimals": 18,
          "priceUSDCents": 54.797200000000004
        },
        "estimatedOnRampAmountWei": "5000000000000000000",
        "estimatedOnRampAmount": "5",
        "estimatedToTokenAmount": "5",
        "estimatedToTokenAmountWei": "5000000000000000000",
        "estimatedDurationSeconds": 30
      },
      "source": {
        "completedAt": "2024-06-18T23:49:00.347Z",
        "amount": "5",
        "amountWei": "5000000000000000000",
        "token": {
          "chainId": 137,
          "tokenAddress": "0xeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee",
          "name": "Matic",
          "symbol": "MATIC",
          "decimals": 18,
          "priceUSDCents": 54.797200000000004
        },
        "transactionHash": "0x4bb089f6a60b49235a817b52bf39bc078f1246df15731b85837526bb62cf4e70",
        "explorerLink": "https://polygonscan.com/tx/0x4bb089f6a60b49235a817b52bf39bc078f1246df15731b85837526bb62cf4e70",
        "amountUSDCents": 275
      }
    }
  }
}
```

### Webhook Verification (Recommended)

Since any outside origin can call your webhook endpoint, it is recommended to verify the webhook signature to ensure a request comes from your Pay instance.

#### Check the Signature

The payload body is signed with the webhook secret and provided in the X-Pay-Signature request header.

Get the webhook secret for your webhook endpoint from the dashboard.

This code example checks if the signature is valid:

```tsx
const generateSignature = (
  body: string,
  timestamp: string,
  secret: string,
): string => {
  const payload = `${timestamp}.${body}`;
  return crypto
    .createHmac("sha256", secret)
    .update(payload)
    .digest("hex");
};
 
const isValidSignature = (
  body: string,
  timestamp: string,
  signature: string,
  secret: string,
): boolean => {
  const expectedSignature = generateSignature(
    body,
    timestamp,
    secret,
  );
  return crypto.timingSafeEqual(
    Buffer.from(expectedSignature),
    Buffer.from(signature),
  );
};
```

Check the timestamp The event timestamp is provided in the X-Pay-Timestamp request header.

This code example checks if the event exceeds a given expiration duration:

```tsx
export const isExpired = (
  timestamp: string,
  expirationInSeconds: number,
): boolean => {
  const currentTime = Math.floor(Date.now() / 1000);
  return currentTime - parseInt(timestamp) > expirationInSeconds;
};
```

#### Example webhook endpoint

This NodeJS code example listens for event notifications on the /webhook endpoint:

```tsx
import express from "express";
import bodyParser from "body-parser";
import { isValidSignature, isExpired } from "./webhookHelper";
 
const app = express();
const port = 3000;
 
const WEBHOOK_SECRET = "<your_webhook_auth_secret>";
 
app.use(bodyParser.text());
 
app.post("/webhook", (req, res) => {
  const signatureFromHeader = req.header("X-Pay-Signature");
  const timestampFromHeader = req.header("X-Pay-Timestamp");
 
  if (!signatureFromHeader || !timestampFromHeader) {
    return res
      .status(401)
      .send("Missing signature or timestamp header");
  }
 
  if (
    !isValidSignature(
      req.body,
      timestampFromHeader,
      signatureFromHeader,
      WEBHOOK_SECRET,
    )
  ) {
    return res.status(401).send("Invalid signature");
  }
 
  if (isExpired(timestampFromHeader, 300)) {
    // Assuming expiration time is 5 minutes (300 seconds)
    return res.status(401).send("Request has expired");
  }
 
  // Process the request
  res.status(200).send("Webhook received!");
});
 
app.listen(port, () => {
  console.log(`Server started on http://localhost:${port}`);
});
```
## Quickstart

Learn how to add Connect SDK to your application, log in your users, and allow them to interact with your application.

The following guide is in Typescript. You can also learn how to integrate Connect with our [Unity SDK](https://portal.thirdweb.com/unity).

* #### Install the Connect SDK  
```bash  
npm i thirdweb  
```
* #### Get Your Client ID  
Log in to the [thirdweb dashboard](https://thirdweb.com/team). Create a new project to get your **Client ID**.
* #### Set up the Client, Provider and ConnectButton  
   * Pass your clientId to `createThirdwebClient`  
   * Wrap your application with a `ThirdwebProvider`  
   * Add a `ConnectButton` to your application  
```tsx  
import { createThirdwebClient } from "thirdweb";  
import { ThirdwebProvider, ConnectButton } from "thirdweb/react";  
   
export const client = createThirdwebClient({ clientId: <your_client_id> });  
   
export default function App() {  
  return (  
    <ThirdwebProvider>  
      <ConnectButton client={client} />  
    </ThirdwebProvider>  
  );  
}  
```
* #### Interact With A Wallet  
Once your user has logged in by clicking the `ConnectButton`, you can interact with their wallet.  
Here's how to:  
   * Get the wallet address using `useActiveAccount`  
   * Read the wallet balance using `useWalletBalance`  
```tsx  
import { useActiveAccount, useWalletBalance } from "thirdweb/react";  
   
export default function MyComponent() {  
  // 1. get wallet address  
  const account = useActiveAccount();  
  console.log("wallet address", account?.address);  
   
  // 2. get wallet balance  
  const { data: balance, isLoading } = useWalletBalance({  
    client,  
    chain,  
    address: account?.address,  
  });  
  console.log(  
    "wallet balance",  
    balance?.displayValue,  
    balance?.symbol,  
  );  
}  
```
* #### Send a Transaction  
[Extensions](https://portal.thirdweb.com/typescript/v5/extensions/use) are the easiest way to prepare transactions.  
   * Import the Extension you want to use  
   * Define your contract with `getContract` on your target chains  
   * Call the `useSendTransaction` mutation hook  
   * Execute the transaction using the mutate function  
```tsx  
import { getContract } from "thirdweb";  
import { sepolia } from "thirdweb/chains";  
import { useSendTransaction } from "thirdweb/react";  
// 1. import the extension you want to use  
import { transfer } from "thirdweb/extensions/erc20";  
   
// 2. define the target contract  
const USDC = getContract({  
  client,  
  address: USDC_ADDRESS,  
  chain: sepolia,  
});  
   
export default function MyComponent() {  
  // 3. call the useSendTransaction hook  
  const { mutate: sendTransaction, isPending } = useSendTransaction();  
   
  const onClick = () => {  
    // 4. execute the transaction (send 15 USDC to the target address)  
    const transaction = transfer({  
      contract: USDC,  
      amount: 15,  
      to: "0x...",  
    });  
    sendTransaction(transaction);  
  };  
}  
```
* #### You're Ready to build  
Congratulations, you've connected a wallet and sent a transaction from your application! You can now explore all the other accessible features in [the full React documentation.](https://portal.thirdweb.com/react/v5)
## Customization Options

Our ConnectButton and ConnectEmbed components are highly customizable. You can find a selection of popular customizations below. For the full list of props, you can [view the full reference](https://portal.thirdweb.com/references/typescript/v5/ConnectButtonProps).

### Logo

You can customize the logo shown on the Connect modal by adding it to the `appMetadata` prop:

```tsx
import { ConnectButton } from "thirdweb/react";
 
function Example() {
  return (
    <div>
      <ConnectButton
        appMetadata={{
          logoUrl: "https://path/to/my-app/logo.svg",
        }}
      />
    </div>
  );
}
```

---

### Compact Modal

The Connect modal is set to `"wide"` by default. You can set it to `"compact"` by adding it to the `connectModal` prop:

```tsx
import { ConnectButton } from "thirdweb/react";
 
function Example() {
  return (
    <div>
      <ConnectButton connectModal={{ size: "compact" }} />
    </div>
  );
}
```

---

### Theming

You can set the theme for the [ConnectButton](https://www.notion.so/ConnectButton-51113a400e614dfe93a598e9e1b8ef63?pvs=21) component, which is set to `"dark"` by default. theme can be set to either `"dark"` , `"light"` or a custom theme object.

We have **`[lightTheme](https://portal.thirdweb.com/references/typescript/v5/lightTheme)`** or **`[darkTheme](https://portal.thirdweb.com/references/typescript/v5/darkTheme)`** providers that you can override to kickstart customization.

You can refer to our `Theme` page for a full view of customizable options if you’d prefer to create a custom theme from scratch.

```tsx
import { ConnectButton } from "thirdweb/react";
 
function Example() {
  return (
    <div>
      <ConnectButton theme={yourThemeConfig} />
    </div>
  );
}
```

---

### Localization

By default, our ConnectButton uses the `en-US` locale. You can customize the language by setting the `locale` prop. You can refer to the **`[LocaleId](https://portal.thirdweb.com/references/typescript/v5/LocaleId)`** type for supported locales.

```tsx
import { ConnectButton } from "thirdweb/react";
 
function Example() {
  return (
    <div>
      <ConnectButton locale={"en_US"} />
    </div>
  );
}
```

thirdweb currently supports the following locales:

| Locale                  | Code   |
| ----------------------- | ------ |
| English (United States) | en\_US |
| Spanish (Spain)         | es\_ES |
| German (Germany)        | de\_DE |
| Japanese (Japan)        | ja\_JP |
| Tagalog (Philippines)   | tl\_PH |
| Vietnamese (Vietnam)    | vi\_VN |
| French                  | fr\_FR |
| Korean                  | ko\_KR |
## Enable Test Mode

Developers can turn on Test Mode to test both fiat-to-crypto transactions and crypto-to-crypto transactions on supported testnet chains. It is possible to test both at the same time or separately.

### Buy With Fiat

By setting `testMode` to `true` for Buy With Fiat, you can enable test experiences for our underlying providers (Stripe, Kado, and Transak).

ConnectButtonPayEmbedsendTransaction

```tsx
<ConnectButton
  client={client}
  detailsModal={{
    payOptions: {
      buyWithFiat: {
        testMode: true, // defaults to false
      },
    },
  }}
/>;
```

For Coinbase onramp, you can turn on "Mocked mode" when launching the Onramp experience.

At the bottom of the Onramp modal where it says "Secured by Coinbase", click 10 times on the word "Secured." This will navigate you to Onramp's Debug Menu. There, navigate to the Actions tab click on the toggle for "Enable Mocked Buy and Send." You can now exit the Debug Menu and proceed with mock buys and sends. Remember to click on the "Enable Mocked Buy and Send" toggle once you are done to enable actual buys and sends.

For other providers, you can use the following information when using any provider in test mode:

| Provider | Card Type    | Name        | Number              | Expiration Date | CVV          | Other Info                                                         |
| -------- | ------------ | ----------- | ------------------- | --------------- | ------------ | ------------------------------------------------------------------ |
| Kado     | Credit Card  | Test Credit | 4242 4242 4242 4242 | 01/25           | 123          | Test Phone Number: (234) 567-8909                                  |
| Kado     | Debit Card   | Test Debit  | 4659 1055 6905 1157 | 01/25           | 123          | Test Phone Number: (234) 567-8909                                  |
| Stripe   | Visa         | Any Name    | 4242 4242 4242 4242 | Any Future Date | Any 3 Digits | SSN: 000000000, Address line 1: address\_full\_match, OTP : 000000 |
| Stripe   | Visa (Debit) | Any Name    | 4000 0566 5566 5556 | Any Future Date | Any 3 Digits | SSN: 000000000, Address line 1: address\_full\_match, OTP : 000000 |
| Transak  | Visa         | Any Name    | 4111 1111 1111 1111 | 10/33           | 123          | Payment Authorization 3Ds screen password: **Checkout1!**          |

For Stripe testing, you can view more test cards [here](https://docs.stripe.com/testing).

For Transak testing, you can view detailed information [here](https://docs.transak.com/docs/test-credentials#card-payments).

For Kado testing, you can view detailed information [here](https://docs.kado.money/integrations/integrate-kado/sandbox).

### Buy With Crypto

Buy With Crypto test mode will show only Testnets and native test currencies. If you have a custom that you would like supported in test mode, [please reach out to us](https://thirdweb.com/contact-us). You can see a list of supported testnets on the [thirdweb Chainlist page](https://thirdweb.com/chainlist?service=pay&type=testnet).

ConnectButtonPayEmbedsendTransaction

```tsx
<ConnectButton
  client={client}
  detailsModal={{
    payOptions: {
      buyWithCrypto: {
        testMode: true, // defaults to false
      },
    },
  }}
/>;
```
## Ecosystem Wallet Explorer Page

Every Ecosystem Wallet deployment will also create a wallet management page that you can share with your partners and users. End users can visit this page to view tokens and assets in the in-app wallets they’ve created across your ecosystem.

Once you deploy, we will automatically generate and host this page for you. We will provide you with a URL that you can share with your ecosystem partners and end users. You'll be able to find your explorer URL in the Wallet Explorer tab of the [Ecosystem Wallet dashboard](https://thirdweb.com/team/~/~/ecosystem).

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fwallet-explorer.af9c9650.png&w=3840&q=75)
## Integrating with Partners

One of the key features of ecosystem wallets is the ability to enable other developers to spin up in-app wallets on your behalf. All partners that spin up in-app wallets using your ecosystem wallet will access the same account for your end users. You can create partners in the [Ecosystem Wallets dashboard](https://thirdweb.com/team/~/~/ecosystem).

Adding a new partner will create their unique Partner ID. They can use this Partner ID to integrate your wallet in a number of different ways:

#### thirdweb SDK

Partners can install thirdweb SDK and use the Partner ID you created for them to display your branded sign in flow. All login options in this sign in flow will create an in-app wallet that works across the ecosystem.

##### Sign In UI

The Sign In UI provides a complete flow with email, phone, passkey, and social sign in options. Available social login options are determined by the ecosystem creator. Any options displayed in the sign in flow will create an in-app wallet within the specified ecosystem.

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Ffull-login-system.88affd9f.png&w=3840&q=75)

* #### Create a Wallet  
Partners can instantiate your ecosystem wallet by using your **Ecosystem ID**.  
```ts  
import { ecosystemWallet } from "thirdweb/wallets";  
   
// Create a wallet for a non-gated "Anyone" ecosystem  
const wallet = ecosystemWallet("ecosystem.your-ecosystem-id");  
```  
If you set your ecosystem wallet to Allowlist, your partners will also need to specify their unique **Partner ID** (available on the Ecosystem Wallet dashboard).  
```ts  
import { ecosystemWallet } from "thirdweb/wallets";  
   
// Create a wallet for "Allowlist" ecosystems restricted to partners  
const wallet = ecosystemWallet("ecosystem.your-ecosystem-id", {  
  partnerId: "...",  
});  
```
* #### Add Ecosystem Wallet to Sign In  
Once a partner has instantiated your ecosystem wallet, they can add it to their Sign In UI.  
```tsx  
import { ConnectButton } from "thirdweb/react";  
   
<ConnectButton  
  client={THIRDWEB_CLIENT}  
  wallets={[wallet]} // Pass a non-gated or restricted wallet to the ConnectButton  
  {...props}  
/>;  
```

##### Branded Wallet Connector

Partners that want to utilize your Ecosystem Wallet as an option to their existing sign in flow can integrate your wallet separately. In this case, only sign ins through your `ecosystem.your-ecosystem-id` will create in-app wallets within your ecosystem:

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fsingle-login-option.aec3d0c2.png&w=3840&q=75)

```tsx
import { createWallet } from "thirdweb/wallets";
 
<ConnectButton
  client={THIRDWEB_CLIENT}
  wallets={[
    createWallet("ecosystem.your-ecosystem-id", {
      partnerId: "...", // Pass an optional partner ID for restricted ecosystems
    }),
    createWallet("io.metamask"),
  ]}
  {...props}
/>;
```
## Managing Ecosystem Permissions

There are two permission options depending on whether you’d like an open or exclusive ecosystem wallet. You can manage these permissions from the Permissions page in your Ecosystem Wallet Dashboard.

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fecosystem-wallet-permissions.b396fdb3.png&w=3840&q=75)

#### Anyone

If you want to allow anyone to integrate your ecosystem wallet, no other changes are required. You can protect your ecosystem against malicious actors by adding unwanted domains to your blocklist.

#### Allowlist

If you’re looking to create an ecosystem wallet for select partners, you can head to the Ecosystem Wallet dashboard, navigate to Permissions, and select “Allowlist”.

**Add Applications to Your Allowlist**

For each application on your allowlist, you'll need to specify a name, a list of allowed domains, and an optional bundle ID (for mobile applications). The list of domains will determine where a partner will be able to display your ecosystem as a login option. Once a partner is added, a **Partner ID** will be generated.

#### Adding Your Own App as a Partner

You'll need to add your own domains and bundle IDs to your allowlist in order to login through your ecosystem wallet in your app.

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fadd-partner.5716cec9.png&w=1920&q=75)
## How to Register Your thirdweb Ecosystem Wallet with WalletConnect (now Reown)

**Note:** WalletConnect Inc. is now Reown. [Read more here](https://reown.com/blog/walletconnect-is-now-reown).

Registering your Ecosystem Wallet with Reown allows it to appear in the WalletConnect Explorer for seamless integration with platforms like OpenSea and other third-party applications.

* #### Create a New Project in Reown  
Visit the [Reown Dashboard](https://reown.com/) and select **"Create Project"**  
   * Enter your [Ecosystem Wallet's Explorer](https://thirdweb.com/team/~/~/ecosystem/) page URL as the **Homepage URL** and proceed.  
   * Choose **Wallet** as the project type and select **"Create"**

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fwalletconnect-create.a8e73cbc.png&w=3840&q=75)

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fwalletconnect-url.1de26c3c.png&w=3840&q=75)

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fwalletconnect-wallet.0f8085a5.png&w=3840&q=75)

* #### Complete Your Project Details  
Navigate to the **WalletGuide** tab and fill out the following form:  
   * **Wallet Name:** Provide your wallet's name.  
   * **Wallet Category:** Select **"Web App Wallets"**  
   * **Web App URL:** Use your Ecosystem Wallet's Explorer page URL.  
   * **Supported Chains:** Choose Ethereum and any other chains your wallet supports.  
   * **Logo:** Upload your wallet’s logo (this will appear on the WalletConnect Explorer).  
   * **Testing Instructions:** Provide clear testing instructions for the Reown team. For example: _"Log in via the specified URL and select an authentication method."_

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fwalletconnect-guide.6d329a7f.png&w=3840&q=75)

* #### Submit for Review  
Once you've completed the form, click **"Submit Review"**  
   * After approval, your wallet will appear live on the WalletConnect Explorer.
* #### Verify Your Integration  
Visit a platform like OpenSea and use WalletConnect to log in.  
   * Select your registered wallet from the list and authenticate.  
   * Your wallet should now seamlessly connect, allowing you to interact with the platform.

By following these steps, your branded Ecosystem Wallet will be accessible across all WalletConnect-enabled (Reown) applications.
## General FAQs

#### Which blockchains are supported?

Our thirdweb In-App Wallet is fully EVM compatible and supports all EVM chains.

#### Do I need to build separate flows for in-app wallets and external wallets (e.g. MetaMask)?

No! Since our SDK provides the wallet `signer`, you can build a unified experience with the same code to handle how all your users' wallets interact with signatures and smart contracts.

However, you will need to provide a separate flow to create in-app wallets as you would with any wallet provider (WalletConnect, Coinbase Wallet, etc.).

#### How do I troubleshoot unexpected console error messages?

Make sure that you are developing on a [secure origin](https://www.chromium.org/Home/chromium-security/prefer-secure-origins-for-powerful-new-features/), which includes `localhost` and any site on `https://`. thirdweb uses cryptography libraries that are unsupported on `http://`.

If you continue to run into a console error, please contact us with more details.

#### What is thirdweb's ability to scale?

thirdweb can create up to 300 wallets/second by default and can support higher limits (up to 3,000 wallets/second) upon request.

#### What login options does thirdweb support?

We support a lot of authentication options out of the box. For a full list, check out the [playground](https://playground.thirdweb.com/connect/sign-in/button). We also support custom authentication if you want to integrate thirdweb into your own auth system.

#### Do you support gasless transactions?

Yes, you can easily use account abstraction with in-app wallets to enable sponsored (gasless) transactions.

#### Does thirdweb Wallets product use smart contract wallets?

Thirdweb wallets can be used as a signer to a smart contract account (account abstraction), but it can also be used as a standalone EOA.

#### Is there a way to display the logged-in email address in the Connect component, similar to the wallet address?

Yes, we show the email by default in the details modal after you connect. To display the email anywhere else using React or React Native, [check out the code snippets for all platforms](https://portal.thirdweb.com/connect/in-app-wallet/how-to/interact-with-wallets#get-the-user-email).

#### What happens if thirdweb ceases to exist? Will my users be able to access their wallets?

In the event that thirdweb ceases to exist, we have committed to keeping our in-app wallet service running for a period of at least 12 months after the shutdown announcement. During this time users will be able to access their wallet and transfer their assets out, or export their private key which they can then import into a different client.

#### How will my users recover their accounts in case they lose access to their auth?

Currently, users will rely on the built-in recovery of their auth method. Refer to the [How to recover your Google Account or Gmail](https://support.google.com/accounts/answer/7682439?hl=en) article as an example for social and email auths.

Users can also link their account to a different auth method (e.g. email, phone, or social). All linked methods will be able to be used to access their accounts, providing an alternate recovery method in the case where one is lost.

## In App Wallet FAQs

#### How do users connect to their in-app wallet in a third-party app?

Users can access it by doing a manual connection via wallet connect. They will then have to use the connect button or embed and select manage wallet -> connect an App.

#### How is pricing calculated for in-app wallets?

In-app wallets are billed based on "monthly active wallets". An active wallet is defined as a wallet where a user logs in during the billing period. In-app wallets are completely free up to 1,000 monthly active wallets, and $0.02 per wallet after that.

## Ecosystem Wallet FAQs

#### What is an Ecosystem Wallet?

An ecosystem wallet is a managed in-app wallet service that allows you to create a branded wallet and login system, manage your partners, and allow any number of partners to spin up in-app wallets. End users that create in-app wallets through your partner applications (either with email, phone number, passkey, or socials) will receive **one account and wallet address** that they can access across the entire ecosystem.

#### How do Ecosystem Wallets work?

Ecosystem Wallets are a fully managed and containerized in-app wallet backend service that is white labeled to your application. By giving you access to this backend service, you can power any application with in-app wallets just like thirdweb does for over 70,000 developers.

#### What is an Ecosystem Partner?

Ecosystem partners are games or applications that you have permissioned to spin up in-app wallets underneath your brand. They will have access to the same account (funds, assets, etc.) for any end users that 1) use your branded login system or 2) log in with your wallet.

You can manage ecosystem partners in the Permissions tab of your Ecosystem Wallet dashboard.

#### Which login providers can display my Ecosystem Wallet?

thirdweb Connect, with WalletConnect and any wagmi- or viem-based login providers coming soon.

#### How can Partners integrate my Ecosystem Wallet?

Partners can integrate your Ecosystem Wallet in three different ways:

**Login System**

Partners can install thirdweb SDK and use the Partner ID you created for them to display your branded sign in flow. All login options in this sign in flow will create an in-app wallet.

**Branded Wallet Connector**

Partners can add your wallet as a wallet connector option in their existing sign in flow on any domains they've whitelisted by calling the follow endpoint from their application.

**WalletConnect (Coming Soon)**

Partners using WalletConnect will automatically display your wallet as a WalletConnect option on any domains they've whitelisted.

#### What is the difference between Anyone and Allowlist scopes for Ecosystem Wallet?

The **Anyone** scope allows any developer to integrate your ecosystem wallet, even if you have not given them permission. Any developer with thirdweb Connect, for example, would now display your wallet as a login option.

The **Allowlist** scope allows developers that you have explicitly added to your list of Partners to display your wallet as a login option.

You can manage scope in the Permissions tab of your Ecosystem Wallet dashboard.

#### How does billing work for Ecosystem Wallets?

As the ecosystem admin, you will be billed $250 monthly for your Ecosystem Wallet. This allows any application or game in your ecosystem generate in-app wallets. Each month, we allow you and your ecosystem partners to generate 30,000 wallets for free. Once you’ve generated 30,000 wallets, you will be charged $0.02 per in-app wallet. At the end of each month, we will provide you with an invoice with a usage breakdown across all partners.

## Security FAQs

#### How is the private key managed?

You can learn more about the architecture of how thirdweb wallets are created and stored [here](https://portal.thirdweb.com/connect/wallet/security)

#### What happens if thirdweb or my database gets breached?

Using enclave, your customers' assets are safe even if thirdweb or you are compromised. This is because the attacker will only be able to access the encrypted keys, and that is not enough to reconstruct the private key.
## Get Started

Learn how to spin up your first ecosystem wallet, brand your wallet, and integrate your first ecosystem partner.

* #### Get your Client ID  
On the thirdweb dashboard, navigate to settings to create an API Key to obtain a Client ID.
* #### Deploy Your Instance  
Visit the [Ecosystem Wallets dashboard](https://thirdweb.com/team/~/~/ecosystem/create) and enter the name of your ecosystem and choose your logo.  
#### Ecosystem name is Immutable  
Your ecosystem name is immutable and will appear wherever your wallet is available, so choose carefully.  
When your ecosystem wallet is deployed, you'll receive an **Ecosystem ID** derived from your ecosystem name. You will use this ID to specify your wallet during integration (see Step 4 below).  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fecosystem-info.521b488c.png&w=3840&q=75)
* #### Set Ecosystem Permissions  
There are two permission options depending on whether you’d like an open or exclusive ecosystem wallet.  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fecosystem-wallet-permissions.b396fdb3.png&w=3840&q=75)  
##### Option 1: Anyone Permissions  
If you want to allow anyone to integrate your ecosystem wallet, no other changes are required. You can protect your ecosystem against malicious actors by adding unwanted domains to your blocklist.  
##### Option 2: Allowlist Permissions  
If you’re looking to create an ecosystem wallet for select partners, you can head to the Ecosystem Wallet dashboard, navigate to Permissions, and select “Allowlist”. All apps and games, added to your ecosystem, including your own app, will receive a unique Partner ID.  
**Add Applications to Your Allowlist**  
For each application on your allowlist, you'll need to specify a name, a list of allowed domains, wallet signing settings, and an optional bundle ID (for mobile applications). The list of domains will determine where a partner will be able to display your ecosystem as a login option. Once a partner is added, a **Partner ID** will be generated.  
#### Adding Your Own App as a Partner  
You'll need to add your own domains and bundle IDs to your allowlist in order to login through your ecosystem wallet in your app.  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fadd-partner.823b4346.png&w=3840&q=75)
* #### Integrating Your Ecosystem Wallet  
Once you've set up your ecosystem wallet, you can specify it using your **Ecosystem ID**.  
```ts  
import { ecosystemWallet } from "thirdweb/wallets";  
   
// Create a wallet for a non-gated "Anyone" ecosystem  
const wallet = ecosystemWallet("ecosystem.your-ecosystem-id");  
```  
If you set your ecosystem wallet to Allowlist, you'll also need to specify your **Partner ID**.  
```ts  
import { ecosystemWallet } from "thirdweb/wallets";  
   
// Create a wallet for "Allowlist" ecosystems restricted to partners  
const wallet = ecosystemWallet("ecosystem.your-ecosystem-id", {  
  partnerId: "...",  
});  
```  
Once you've instantiated your ecosystem wallet, you can add it to your Sign In flow.  
```tsx  
<ConnectButton  
  client={THIRDWEB_CLIENT}  
  wallets={[wallet]} // Pass a non-gated or restricted wallet to the ConnectButton  
  {...props}  
/>;  
```  
You and your partners can integrate your ecosystem wallet either as a full login system or as a single login option. You can read more in our [integrating partners guide](https://portal.thirdweb.com/connect/ecosystems/integrating-partners).
## Get Users

Once you have users connecting to your app through in-app wallets, you can fetch all users through our REST API:

```

```

### Headers

You need to include the following headers:

* `Content-Type`: Must be set to `application/json`
* `x-secret-key`: Your secret key for authentication
* `x-ecosystem-id` (optional): Your ecosystem ID
* `x-ecosystem-partner-id` (optional): Your ecosystem partner ID

### Example curl Command

Here's an example curl command to pregenerate a thirdweb wallet for the user `user@example.com`:

```bash
curl -X POST 'https://in-app-wallet.thirdweb.com/api/v1/users?offset=200&limit=100' \
  -H 'x-secret-key: YOUR_SECRET_KEY' \
  -H 'Content-Type: application/json'
```

Limit defaults to 100 users per request.

#### Getting ecosystem users

For ecosystem wallets, the secret key have to be from the same account as the ecosystem owner.

### Response Format

A successful API call returns an array of user objects in the following format:

```json
[
  {
    "userId": "9841a5de-b4a6-44b3-ad14-c4b8745782ca",
    "walletAddress": "0x933F5BC72634c55b3643A6Aa0cD5b65ca4915d39",
    "createdAt": "2024-11-05T00:55:25.142Z",
    "authProvider": "google",
    "authDetails": {
        "id": "107302390467834615186",
        "name": "Richard Hendricks",
        "type": "google",
        "email": "richard@piedpiper.com",
        "picture": "https://lh3.googleusercontent.com/a/ACg8ocKC1D6ezzzaZxxUk4qtK_HCwVwpNamVopazXwklGBwuuHeSf_c=s96-c",
        "givenName": "Richard",
        "emailVerified": true
    },
    "email": "richard@piedpiper.com",
  }
]
```
## Migration Guide

Migrating from another embedded wallet provider is possible even if your users have assets and funds on their existing wallets.

If you are thinking of migrating your users off another embedded wallet provider to thirdweb, please [reach out to us](https://thirdweb.com/contact-us) and we will consult and assist with the process.

#### Learn more

Learn more about Migration from our [GitHub repository](https://github.com/thirdweb-example/migrate)

If you’d prefer to use your existing solutions for now and take advantage of thirdweb for other parts of your application, we recommend using the [Connect SDK adapters](https://portal.thirdweb.com/typescript/v5/adapters).
## Get Started

Learn how to add onramps and crypto purchases to your application. To see which integration is right for you, refer to our [integrations overview](https://portal.thirdweb.com/connect/pay/overview#integration-options).

The following guide uses our React SDK. You can also learn how to integrate Universal Bridge with our [Unity SDK](https://portal.thirdweb.com/unity/pay/getbuywithcryptoquote).

---

### Installation

* #### Install the Connect SDK  
npmyarnpnpm  
`npm i thirdweb  
`
* #### Get Your Client ID  
Log in to [the thirdweb dashboard](https://thirdweb.com/team). Navigate to the **Settings** page and create an API key to get your **Client ID**. You'll need your Client ID to interact with the Connect SDK.

---

### Option 1: ConnectButton

Pay is available by default with our `ConnectButton` component. When users log in with Connect, they'll be able to onramp and purchase crypto directly from the logged in Connect interface. You can read more about `ConnectButton` [in this guide](https://portal.thirdweb.com/connect/sign-in/ConnectButton).

```tsx
import { ThirdwebProvider, ConnectButton } from "thirdweb/react";
 
const client = createThirdwebClient({ clientId: your_client_id });
 
export default function App() {
  return (
    <ThirdwebProvider>
      <ConnectButton client={client} />
    </ThirdwebProvider>
  );
}
```

Our `ConnectButton` has a number of [customization options](https://portal.thirdweb.com/connect/pay/customization/connectbutton) so you can tailor it to your experience.

---

### Option 2: Embed

The `PayEmbed` allows users to onramp and purchase crypto directly from your application interface.

```tsx
import { ThirdwebProvider, PayEmbed } from "thirdweb/react";
 
const client = createThirdwebClient({ clientId: your_client_id });
 
export default function App() {
  return (
    <ThirdwebProvider>
      <PayEmbed client={client} />
    </ThirdwebProvider>
  );
}
```

The embedded component will be displayed like so in your application interface:

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fget-started-embed.4fc4eeb7.png&w=3840&q=75)

And voila! Your users can now onramp and convert crypto directly from your application.

Our `PayEmbed` has a number of [customization options](https://portal.thirdweb.com/connect/pay/customization/payembed) so you can tailor it to your experience.

---

### Option 3: Send a Transaction with Pay

Universal Bridge is enabled by default for any contract call sent with `sendTransaction`. It will automatically be invoked when a user does not have enough funds to complete the transaction.

ℹ️ `sendTransaction` is available in [Connect SDK v5](https://portal.thirdweb.com/typescript/v5) or above.

```tsx
import { useSendTransaction } from "thirdweb/react";
import { mintTo } from "thirdweb/extensions/erc721";
 
const { mutate: sendTx, data: transactionResult } =
  useSendTransaction();
 
const onClick = () => {
  const transaction = mintTo({
    contract,
    to: "0x...",
    nft: {
      name: "NFT Name",
      description: "NFT Description",
      image: "https://example.com/image.png",
    },
  });
  sendTx(transaction);
};
```

When a user clicks this button, Universal Bridge will perform gas estimation to determine if the user has a sufficient balance. If their balance is sufficient, the transaction will execute normally. If their balance is not sufficient, the following modal will pop up asking them to either onramp funds or convert crypto to the required amount:

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fget-started-send.20b169d0.png&w=3840&q=75)

Once a user onramps or converts their funds to the required token, the user will be prompted once more to confirm the transaction. The transaction will then execute as expected.

For deeper customization of the Universal Bridge transaction modal, you can refer to our [sendTransaction customization guide](https://portal.thirdweb.com/connect/pay/customization/send-transaction).
## Onramp Providers

thirdweb Universal Bridge integrates with Stripe, Kado and Transak to power our onramp. By default, we choose a recommended provider based on the location of the user, KYC status, and currency.

| Provider | Supported Countries                                                                                       |
| -------- | --------------------------------------------------------------------------------------------------------- |
| Transak  | <https://transak.notion.site/On-Ramp-Payment-Methods-Fees-Other-Details-b0761634feed4b338a69f4f186d906a5> |
| Kado     | <https://www.kado.money/supported-countries>                                                              |
| Stripe   | <https://docs.stripe.com/crypto/onramp>                                                                   |

### Choosing a Preferred Provider

It is possible to specify a preferred onramp provider by setting the `preferredProvider` parameter in the ConnectButton, PayEmbed, or Headless Integration. Go to [customizations](../pay/customization/connectbutton#preferredProvider) for more detail, or checkout the [API Reference for preferredProvider](https://portal.thirdweb.com/references/typescript/v5/GetBuyWithFiatQuoteParams).
## Get Started

thirdweb offers multiple ways to add wallets to your application. Choose the method that best suits your needs:

* **External Wallets** \- Connect to existing wallets like MetaMask, Coinbase Wallet, etc.
* **In-App Wallets** \- Create wallets with social/email login.
* **Ecosystem Wallets** \- Create wallets with social/email login that is shareable across various aplications.

These methods can be used independently or together in the same application to provide the best experience for your users.

### Live Playground

Check out the playground that lets you see all the various capabilities of Connect.

### Get your client ID

To use in-app wallets in your applications, you will need a client ID. You can get one for free on [your thirdweb dashboard](https://thirdweb.com/create-api-key).

### Pick your language

Start with Connect in your preferred language.

[TypeScriptTypeScript](https://portal.thirdweb.com/typescript/v5/getting-started)[ReactReact](https://portal.thirdweb.com/react/v5/getting-started)[ReactReact Native](https://portal.thirdweb.com/react-native/v5/getting-started)[.NETDotNet](https://portal.thirdweb.com/dotnet/getting-started)[UnityUnity](https://portal.thirdweb.com/unity/v5/getting-started)[Unreal EngineUnreal Engine](https://portal.thirdweb.com/unreal-engine/getting-started)
## How it works

### Wallet creation

When a user signs into an application using their email or social logins for the first time, a wallet is generated on the user's device. The corresponding wallet key for this wallet is securely split into three shards using [Shamir's Secret Sharing](https://en.wikipedia.org/wiki/Shamir%27s%5Fsecret%5Fsharing) algorithm.

* **Shard A** is stored securely on the user's device. For web applications, this is stored on the browser, or for mobile apps, it is in a secure enclave.
* **Shard B** is encrypted and stored in [Amazon KMS](https://aws.amazon.com/kms/) using a key known to thirdweb. This process uses [hardware security modules](https://en.wikipedia.org/wiki/Hardware%5Fsecurity%5Fmodule) (HSMs) to protect the confidentiality and integrity of keys. The encrypted string is stored in thirdweb's database.
* **Shard C** is encrypted by user authentication and stored in Amazon's KMS using hardware security modules (HSMs) to protect the confidentiality and integrity of keys. Despite the key stored on thirdweb's servers, thirdweb has no way of decrypting and accessing the key.

![](/_next/static/media/embed-creation.a9f4c7bd.svg)

### Recoverability

In-App Wallets are non-custodial, and users can export their private key anytime. Users may recover their wallet from any device by authenticating or signing into an application to receive access to their wallet. Threshold secret-sharing cryptography is used to recreate the private key; two of three shards are required. If a user loses access to their authentication method (email, social login, or custom authentication), they cannot recover their wallet.

thirdweb does not have the ability to access user accounts or reconstruct private keys.

### In-App Wallet Scope

In-App Wallets are scoped to applications per API key. If users use the same email to sign in to a different application using In-App Wallets, the application will manage an entirely different wallet.

#### Benefits of single application scoped wallets

* Each application has limited access only to wallets created through their application. It cannot manage wallets from other applications.
* Users may only view tokens sent or purchased from your application.
* To improve user experience, saved payment methods and KYC verification are only provided to thirdweb; applications cannot view this information.

Users may view all their application-scoped In-App Wallets in a single view using the [My Wallets](https://ews.thirdweb.com/wallet) dashboard. Learn more about My Wallets.

![](/_next/static/media/app-scoped.ae3e26d9.svg)

#### Scalability

We support up to 100 wallets generated/second by default and can support higher limits (up to 3,000 wallets generated/second) upon request. [Contact Sales](https://thirdweb.com/contact-us) for more information.

#### Security & privacy

##### TLS Encryption

To increase security and privacy, private keys or wallet "seed phrases" are never stored or sent over a network. TLS encryption is used in transit for internal and external communications with thirdweb's back-end and databases. TLS encryption is also required for third-party vendors.

##### AES-256

Data backups and storage are encrypted with AES-256.

##### Threshold secret sharing

Using threshold secret sharing, thirdweb cannot reconstruct a user's private key, thereby providing a non-custodial wallet. Additionally, a customer's assets are safe even if thirdweb or the application developer (you) is compromised. In a compromised situation, an attacker may only be able to access one of three shards, which is inadequate to reconstruct the wallet's private key.

##### GDPR & CCPA

thirdweb complies to GDPR and CCPA compliance frameworks and deletes customer data per request within the required timeframe of each standard (30 days for GDPR and 45 for CCPA).

##### Audit and Bounty Program

HackerOne has audited our in-app wallet private key security architecture, and there is an ongoing bounty program to ensure vulnerabilities are caught. [View the Letter of Attestation.](https://portal.thirdweb.com/pdfs/thirdweb%5Fcode%5Fsecurity%5Faudit.pdf)
## Pregenerate Wallets

### What is Wallet Pregeneration?

Wallet pregeneration is a technique where you create wallets for users before they actually sign up or authenticate. This allows you to:

* Pre assign wallets to users before they sign up
* Reduce the time users spend waiting during the onboarding process
* Pre-fund wallets with tokens or NFTs before users claim them
* Create smoother user experiences for gaming and other applications

### Why Use Wallet Pregeneration?

#### Pre-funding Capability

You can distribute assets to wallets before users claim them, enabling:

* Pre-loaded game assets
* Welcome bonus tokens
* Promotional NFTs
* Airdrops

#### Better User Experience

* Users don't have to wait for wallet to be created during signup
* Reduced failed wallet creation due to network issues

To pregenerate an in-app or ecosystem wallet wallet, you can make a `POST` request to the following endpoint:

```

```

### Request Body

The request body should be a JSON object with the following parameters:

* `strategy`: The strategy for wallet generation
* `email` or `phone` or `userId`: The user identifier associated with the wallet to be generated

#### Email based wallets

```

```

When the user logs in with any method associated with that email (including google, facebook, discord auth), they will get access to the same pregenerated wallet.

#### Phone based wallets

```

```

#### Custom user id based wallets

```

```

Use this when [bringing your own authentication method](https://portal.thirdweb.com/connect/in-app-wallet/custom-auth/configuration). When the user logs in, if the user ids you provide from the auth endpoint match, they will get access to the same pregenerated wallet.

### Headers

You need to include the following headers:

* `Content-Type`: Must be set to `application/json`
* `x-secret-key`: Your secret key for authentication
* `x-ecosystem-id` (optional): Your ecosystem ID
* `x-ecosystem-partner-id` (optional): Your ecosystem partner ID

### Example curl Command

Here's an example curl command to pregenerate a thirdweb wallet for the user `user@example.com`:

```bash
curl -X POST 'https://in-app-wallet.thirdweb.com/api/v1/pregenerate' \
  -H 'x-ecosystem-id: ecosystem.example-eco-123' \
  -H 'x-ecosystem-partner-id: 1415d24e-c7b0-4fce-846e-740841ef2c32' \
  -H 'x-secret-key: 9f8e7d6c5b4a3f2e1d0c9b8a7ffge434b2a1f0e9d8c7b6a5f4e3d2c1b0a9f8e7' \
  -H 'Content-Type: application/json' \
  -d '{
    "strategy": "email",
    "email": "user@example.com"
  }'
```

Replace the header values with your actual client ID, ecosystem ID, and secret key.

#### Pregeneration for ecosystems

For ecosystem wallets, the secret key have to be from the same account as the ecosystem owner. If this is an issue, please reach out to us.

### Response Format

A successful API call returns a JSON object in the following format:

```json
{
  "wallet": {
      "address": "string",
      "createdAt": "string",
  }
}
```

#### Smart Wallet Address

Use [predictSmartAccountAddress](https://portal.thirdweb.com/references/typescript/v5/predictSmartAccountAddress) to generate the corresponding smart wallet address. The `address` field always corresponds to the EOA address that has been pregenerated.

### What's Next

Pre-generating is independent and doesn't change the user's experience.

Your users can continue to login as per usual. When they do, they will be assigned the pregenerated wallet.

For more information on signing in, see [Sign In](https://portal.thirdweb.com/connect/wallet/sign-in-methods/configure).
## Overview

A flexible sign-up flow that accommodates different preferences is critical when onboarding users. thirdweb offers multiple wallet solutions to meet various integration needs:

* **External Wallets** \- Traditional wallet connection with 500+ providers
* **In-App Wallet** \- Seamless onboarding with email, social, and passkey options
* **Ecosystem Wallet** \- Branded wallet service for cross-application authentication

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fecosystem-wallet.ce6b8784.png&w=3840&q=75)

#### Features

![](/icons/feature-cards/wallet.svg)

##### Wallet Support

500+ wallet providers supported

![](/icons/feature-cards/fiat-ramp.svg)

##### Fiat On-Ramp

Enable purchase options directly in modal

![](/icons/feature-cards/fingerprint.svg)

##### Seamless onboarding

Email, phone, social, and passkey options

![](/icons/feature-cards/customize.svg)

##### Customizable

Match your applications branding

![](/icons/feature-cards/gasless.svg)

##### Gasless

Enable free transactions with smart accounts

![](/icons/feature-cards/localization.svg)

##### Localization

Support for multiple languages

![](/icons/feature-cards/compatibility.svg)

##### Cross-Chain Support

Enable end users to view assets, balances, and activities for apps and games across any EVM-compatible chain

![](/icons/feature-cards/compatibility.svg)

##### User Attribution & Analytics

Unlock analytics for developers and end user activity across your ecosystem

#### Solutions

| SOLUTION         | BEST FOR                                                | PRICING                                                              |
| ---------------- | ------------------------------------------------------- | -------------------------------------------------------------------- |
| External Wallets | Applications needing traditional EOA wallet integration | Free                                                                 |
| In-App Wallet    | Mainstream applications requiring seamless onboarding   | [Free up to 1,000 MAW, then $0.02/MAW](https://thirdweb.com/pricing) |
| Ecosystem Wallet | Organizations building branded wallet networks          | [$250/mo](https://thirdweb.com/pricing)                              |

#### Use Cases

* **Gaming & Entertainment** \- Cross-game accounts and gasless transactions
* **Enterprise & Loyalty** \- Custom authentication and user attribution
* **DeFi & NFT** \- Traditional wallet connection and fiat on-ramps
* **Chain Ecosystems** \- Unified accounts across chain applications

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcustom-modals.e5c90c5d.png&w=3840&q=75)
## thirdweb Wallet Security

If you are looking for the previous security documentation around the shamir secret sharing model, please refer to the [In-App Wallet Security](https://portal.thirdweb.com/connect/wallet/security/legacy) page.

### Wallet Creation

When a user signs into an application using their email or social logins for the first time, a wallet is generated within a secure enclave on the server after verifying the user's legitimacy. The enclave provides a trusted execution environment, ensuring the wallet creation process is isolated and protected from external interference.

* The wallet and its corresponding private key are generated entirely within the enclave, never leaving its secure confines.
* User authentication data is verified within the enclave, ensuring that only legitimate, authenticated users can initiate wallet creation.

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fenclave-wallet-creation.161eda7c.png&w=1920&q=75)

### Security Measures

* The enclave's cryptographic properties ensure that even the server operators cannot access the contents or operations within the enclave.
* The enclave provides a verifiable hash of the image of the code that is being run on the device, allowing anyone to verify the contents of the code.
* The wallet's private key never exists in an unencrypted form outside of the enclave.
* All sensitive operations, such as transaction signing, occur within the enclave, ensuring the wallet's security.

### Wallet Usage

#### General Usage

* When users interact with their wallet via the the enclave, all communications are encrypted and only the legitimate user can access their wallet.
* All traffic is encrypted with TLS and HSTS. Services are run in private VPCs on AWS and accessible only from a single entry point via our Cloudflare DNS.
* Applications can [link multiple authentication methods](https://portal.thirdweb.com/connect/in-app-wallet/guides/link-multiple-profiles) to the same wallet. Any of these methods can be used to authenticate into the users wallet.

#### Ecosystem Usage

Ecosystem wallets are controlled by the ecosystem owner. Ecosystem owners are able to specify usage policies for their partners and developers which restricts what they can do with the wallet. Unlike the shamir secret sharing model, the enclave wallet model ensures that the private key is never reconstructed on the client. This ensures no-one can extract the private key from the client, including other developers in the ecosystem. Moreover, it also means that partners and developers must submit the request to the enclave which would be able to verify the request and block requests that are out of scope or denied by the ecosystem owner.

### Scopes

#### In App Wallets

In-App Wallets are scoped to applications per Client ID. If users use the same email to sign in to a different application using In-App Wallets, the application will manage an entirely different wallet.

##### Benefits of single application scoped wallets

* Each application has limited access only to wallets created through their application. It cannot manage wallets from other applications.
* Users may only view tokens sent or purchased from your application.
* To improve user experience, saved payment methods and KYC verification are only provided to thirdweb; applications cannot view this information.

![](/_next/static/media/app-scoped.ae3e26d9.svg)

#### Ecosystem Wallets

Ecosystem Wallets are scoped to the ecosystem. If users use the same email to sign in to a different application using the same ecosystem, they will get the same wallet.

##### Benefits of ecosystem scoped wallets

* Applications can now share assets across various applications. This is useful if you're a brand powering multiple application and want your partners to take advantage of network effects.
* Application owner has full control over what happens within each application. This is useful if you're a brand that wants to ensure that all applications in your ecosystem are following the same rules.

![](/_next/static/media/ecosystem-scoped.194666c3.svg)

### Recoverability

* Users can export their private key at any time.
* Users may recover their wallet from any device by authenticating or signing into an application to receive access to their wallet.
* Thirdweb wallets support four categories of authentication: socials, custom authentication, external wallets, and email / phone authentication. If a user ever loses access to their authentication method:  
   * **For socials and email / phone authentication,** users can utilize the recovery flow of their providers to regain access to their account.  
   * **In the case of custom authentication,** the developer managing their authentication flow will be able to re-instate the users account upon successful verification.  
   * Application providers **do not have direct access** to user accounts or private keys, as these remain secured within the enclave. The enclave's design ensures that only verified user requests can trigger wallet operations.
* Users are able to link their authentication methods which will provide them multiple ways to access their account if they ever lose access to any one of their authentication method.

### Security & privacy

#### TLS Encryption

To increase security and privacy, private keys or wallet "seed phrases" are never stored or sent over a network. TLS encryption is used in transit for internal and external communications with thirdweb's back-end and databases. TLS encryption is also required for third-party vendors.

#### AES-256

Data backups and storage are encrypted with AES-256.

#### GDPR & CCPA

thirdweb complies to GDPR and CCPA compliance frameworks and deletes customer data per request within the required timeframe of each standard (30 days for GDPR and 45 for CCPA).

#### Audit and Bounty Program

Halborn has audited our enclave wallet security architecture which we'll be releasing shortly, and there is an ongoing bounty program to ensure vulnerabilities are caught. [View the Letter of Attestation.](https://portal.thirdweb.com/pdfs/thirdweb%5Fcode%5Fsecurity%5Faudit.pdf)
## Export Private Key

Learn how to export the private key for a thirdweb wallet using the Connect modal.

#### Headless private key export

Note that we don't allow exporting private key headlessly today. This is to ensure the security of the users assets.

* #### Login  
Login to your wallet on the application.
* #### Manage  
Select "Manage Wallet".  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fmanage-wallet.c0f64900.png&w=1920&q=75)
* #### Export  
Choose "Export Private Key" and confirm the action to reveal the private key.  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fexport-key.92a825c7.png&w=1920&q=75)
* #### Confirm  
Confirm you want to reveal your private key.  
#### Secure Private Keys  
Revealing private keys can compromise your assets and security. Keep them safe and confidential at all times.  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fconfirm-reveal.b058edda.png&w=1920&q=75)
* #### Reveal  
Copy the exported private key directly from the modal.  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fexported-key.fb9b0156.png&w=1920&q=75)

#### Advanced Configuration

As an advanced option, to hide the export private key option from the modal, set the `hidePrivateKeyOption` to `true` when initializing the typescript or react SDK.
## Sign-In Methods

thirdweb supports a bunch of various traditional authentication methods.

From social logins via the [OAuth 2.0 Protocol](https://oauth.net/2/), to email and SMS, to passkeys.

For all login methods, thirdweb generates a non-custodial [wallet](https://portal.thirdweb.com/connect/wallet/security) behind the scenes. Thirdweb wallets enable your users to interact with your application, as well as store tokens and assets they receive while interacting with your application.

### Supported Methods

* Email
* Phone
* Passkey
* Guest
* Wallet
* Google
* Apple
* Facebook
* X
* Discord
* Telegram
* Twitch
* Farcaster
* Github
* Line
* Coinbase
* Steam
* Backend

### Enable Sign-In options

#### In-App Wallets

To enable a given sign-in method for the thirdweb wallet, refer to the following guides:

#### Ecosystem Wallets

In order to configure sign-in options for all apps within your ecosystem, first configure the allowed sign-in methods on [your dashboard](https://thirdweb.com/team/~/~/ecosystem).

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fsocial-config.74389cb5.png&w=3840&q=75)

Once configured, refer to the following guides to use the various login options within your ecosystem:

#### Using disabled auth strategies

Note that while you're allowed to pass any auth strategy today, we recommend only passing the strategies that are enabled on your dashboard. We might enforce this in the future.

### Other Sign-In options

Most authentication option are that straight forward. However, some options require additional setup or nuances. See below for more information on these options:

### Interacting with your App

Once a user signed in and their wallet is generated, you can use the **[Wallet Connection functions](https://portal.thirdweb.com/typescript/v5/wallets)** to get information about the connected wallet like getting the address, account, and more.
## Guest Mode

Sometimes users want to get started using your app without signing in. You can now give users an in-memory "guest account" that can then be converted into a standard account by linking another auth method. An example is if you want to wait til a user tries to make a transaction before forcing them to onboard. A guest mode account is not persisted durably and only exists in memory until linked to an Auth method.

### Logging in with Guest Mode

In general, logging in with guest mode is the same as configuring any other login method in the platform of your choice. See the [login methods overview](https://portal.thirdweb.com/connect/wallet/sign-in-methods/configure) for more information on configuring your login options.

#### In App Wallet

#### Ecosystem Wallet

### Making the Guest Wallet Permanent

When your user is ready, link any other auth method so they can access their account in the future.

#### In App Wallet

Below are the guides for linking a new identity for in-app wallet on the various platforms:

#### Ecosystem Wallet

Below are the guides for linking a new identity for ecosystem wallet on the various platforms:

### Wrapping Up

Your user can now access this same wallet with their Google account.

While it is not linked to any other identity, the lifetime of the guest wallet for any given user will last until they clear their browser storage.

You can try out Guest Mode [on our playground.](https://playground.thirdweb.com/connect/sign-in/button)
## External wallets

thirdweb natively supports 500+ first-party wallets and all wallets that implement EIP-6963 (Multi-injected Provider Discovery). For the full list, please consult [this list](https://portal.thirdweb.com/typescript/v5/supported-wallets).

You can use an external wallet in many ways. We've outlined these different use cases below:

| USAGE                                                            | BEST FOR                                                                                         |
| ---------------------------------------------------------------- | ------------------------------------------------------------------------------------------------ |
| Connect to site                                                  | Applications simply needing web3 wallet connectivity                                             |
| Authenticate into your site                                      | Applications requiring authentication with existing web3 users                                   |
| Authenticate into a thirdweb wallet (either in-app or ecosystem) | Applications looking to provide a seamless web3 application with minimal disruptions and prompts |

The good news is that thirdweb cover each and every one of this use case!

Read on to find out how it's done:

### Connecting External Wallets

External wallets are perfect for applications that want to integrate with existing web3 users. These users typically already have wallets like MetaMask, Coinbase Wallet, or Rainbow installed and are familiar with web3 concepts.

#### Limitations

Your backend will not know about the user's wallet. This is fine if the user's wallet is used to sign transactions and interact with the blockchain directly.

If you need your backend to be aware of the user's wallet, see [SIWE](#authenticating-with-external-wallets).

#### Implementation

We have code snippets and guide for various wallet connecting options below:

### Authenticating with External Wallets

Authentication with external wallets using Sign-In with Ethereum (SIWE) enables your backend to securely verify user wallet ownership. This is essential for applications requiring user-specific data or authenticated actions.

#### Key Difference

Unlike simple wallet connections, SIWE authentication creates a session between your backend and the user's wallet, enabling secure, authenticated API calls.

However, users will still require to sign prompts when interacting with the blockchain via their wallets. If you want an invisible web3 experience, consider using [thirdweb wallets](#authenticating-with-external-wallets-into-thirdweb-wallets).

#### Implementation

### Authenticating with External Wallets into thirdweb Wallets

thirdweb wallets provide a seamless web3 experience with minimal prompts and disruptions. This will provide you, the developer with full control of how the user interacts with your application.

Note, however, that the wallet interacting with your application will be a thirdweb wallet, not the user's external wallet. While we provide methods to export keys and see how the external wallet and thirdweb wallet are linked, if your app requires the user's external wallet, you should use [SIWE](#authenticating-with-external-wallets) instead.

##### Authenticate to an In App Wallet with SIWE

##### Authenticate to an Ecosystem Wallet with SIWE
## Getting User Profiles

Once authenticated, you can retrieve the user profiles linked to a wallet. This allows you to access additional information about the user, such as their email address or phone number.

### List of Strategies

Regardless of platform, the response will have a json object in the following shape as some level:

```json
{
	"strategy": "email",
	"details": {
		"email": "user@example.com"
	},
}
```

Note that the `email` field above will differ based on the profile type. We list the expected field below in our list of strategies.

| Strategy      | Type             | details Field |
| ------------- | ---------------- | ------------- |
| Email         | "email"          | email         |
| Google        | "google"         | email         |
| Discord       | "discord"        | email         |
| Apple         | "apple"          | email         |
| Facebook      | "facebook"       | email         |
| Phone         | "phone"          | phone         |
| Guest         | "guest"          | id            |
| Passkey       | "passkey"        | id            |
| Telegram      | "telegram"       | id            |
| Farcaster     | "farcaster"      | id            |
| Line          | "line"           | id            |
| JWT           | "jwt"            | id            |
| Auth Endpoint | "auth\_endpoint" | id            |
| Wallet        | "wallet"         | address       |

### Frontend

For frontend, we provide methods to get information around the currently logged in user.

#### In App Wallet

#### Ecosystem Wallet

### Backend

From the backend, you are able to get the details of any user within your in app or ecosystem wallet.

To get the user details, you can make a `GET` request to the following endpoint:

```

```

#### Query Parameters

You can specify the query parameter `queryBy` to query by different user identifiers:

* `queryBy`: The parameter to query by. Can be one of `walletAddress`, `email`, `phone`, `externalWalletAddress`, or `id`.

You can then specify the value to query by, matching the queryBy parameter:

* `walletAddress`: The user's wallet address that thirdweb has generated for them
* `email`: The user's email address
* `phone`: The user's phone number
* `externalWalletAddress`: The user's wallet address that used to login via SIWE
* `id`: The user's ID (for custom auth)

#### Authentication

You need to include your ThirdWeb Client Secret in the Authorization header.

If you are an ecosystem owner, you have to include the `x-ecosystem-id` header and optionally the `x-ecosystem-partner-id` header if the ecosystem is set to partners only.

#### Example curl Command

Here's an example curl command to fetch user details by email:

```bash
curl -X GET 'https://in-app-wallet.thirdweb.com/api/2023-11-30/embedded-wallet/user-details?queryBy=email&email=user@example.com' \
  -H 'x-secret-key: YOUR_THIRD_WEB_CLIENT_SECRET'
```

Here's an example curl command to fetch user details by address:

```bash
curl -X GET 'https://in-app-wallet.thirdweb.com/api/2023-11-30/embedded-wallet/user-details?queryBy=walletAddress&walletAddress=0x123456789abcdef' \
  -H 'x-secret-key: YOUR_THIRD_WEB_CLIENT_SECRET'
```

Here's an example curl command to fetch the user details for an ecosystem owner:

```bash
curl -X GET 'https://in-app-wallet.thirdweb.com/api/2023-11-30/embedded-wallet/user-details?queryBy=walletAddress&walletAddress=0x123456789abcdef' \
  -H 'x-secret-key: YOUR_THIRD_WEB_CLIENT_SECRET' \
  -H 'x-ecosystem-id: ecosystem.YOUR_ECOSYSTEM_ID' \
  -H 'x-ecosystem-partner-id: YOUR_PARTNER_ID'
```

In both examples, replace `YOUR_THIRD_WEB_CLIENT_SECRET` with your actual ThirdWeb Client Secret.

Replace `YOUR_ECOSYSTEM_ID` and `YOUR_PARTNER_ID` with your actual ecosystem ID and partner ID respectively. The partner ID can be one you set up for yourself as the ecosystem owner.

#### Response Format

The API returns a JSON array with the following structure for each user:

```json
[
  {
    "userId": "string",
    "walletAddress": "string",
    "email": "string (optional)",
    "phone": "string (optional)",
    "createdAt": "string",
    "linkedAccounts": [
      {
        "type": "string",
        "details": {
          "phone": "string",
          // or
          "email": "string",
          // or
          "address": "string",
          // or
          "id": "string",
          // Additional key-value pairs may be present
        }
      }
    ]
  }
]
```

Note: The `details` object in `linkedAccounts` will contain different fields based on the account type. See the [list of Strategies](#list-of-strategies) above for more information.

Remember to handle the response appropriately in your chosen programming language, including error cases and parsing the JSON response.

#### Convenience Methods

If you are using the thirdweb SDK, you can use the `getUser` method to retrieve user details.

### Linking Additional Identities

If you want to link additional identities to a wallet, see [Linking Multiple Identities](https://portal.thirdweb.com/connect/wallet/user-management/link-multiple-identity).
## Web3 Onboard

thirdweb acquired Web3Onboard by Blocknative on 1/13/2025\. We will be quickly migrating the documentation over to thirdweb in the coming weeks. For now, please refer to [Web3 Onboard's documentation](https://onboard.blocknative.com/docs/overview/introduction)

If you have any questions on how to migrate over to thirdweb's SDK, please review our docs or [visit our support site](https://thirdweb.com/support).
## What is Connect?

Connect is the complete toolkit for connecting every user to your application. It features customizable onboarding flows, self-custodial in-app wallets, account abstraction, onramps, and a performant API to interact with the blockchain.

### Live Playground

You can interact with the React SDK in the [Live Playground](https://playground.thirdweb.com/).

### Quick starts

Get started with Connect in your preferred language.

[TypeScriptTypeScript](https://portal.thirdweb.com/typescript/v5/getting-started)[ReactReact](https://portal.thirdweb.com/react/v5/getting-started)[ReactReact Native](https://portal.thirdweb.com/react-native/v5/getting-started)[.NETDotNet](https://portal.thirdweb.com/dotnet/getting-started)[UnityUnity](https://portal.thirdweb.com/unity/v5/getting-started)[Unreal EngineUnreal Engine](https://portal.thirdweb.com/unreal-engine/getting-started)

### With Connect, you can

* **Connect to 500+ different wallet providers** with support for every EVM network
* **Log in and authenticate your users** with customizable and secure [email, phone, passkeys and social login](https://portal.thirdweb.com/connect/in-app-wallet/overview) flows.
* **Sponsor transactions** to seamlessly onboard non-native or new crypto users with [Account Abstraction](https://portal.thirdweb.com/connect/account-abstraction/overview).
* **Perform wallet actions** like connecting and disconnecting wallets, viewing balance, displaying ENS names, and execute transactions with our [perfomant, reliable and type safe API](https://portal.thirdweb.com/connect/blockchain-api)
* **Easily integrate with thirdweb's contracts** to enable users to interact with your application.
* **Facilitate payments** by letting user top up their wallets or do onchain purchases with a credit card with [Pay](https://portal.thirdweb.com/connect/pay/overview).

#### Have you generated a client ID?

You'll need a client ID to access Connect's free blockchain APIs, storage, and more.

[ Generate ](https://thirdweb.com/create-api-key)

### Supported Chains

Connect is supported on every EVM compatible chain. To view the full list, visit [thirdweb chainlist](https://thirdweb.com/chainlist).

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fsupported-chains.eca8603d.png&w=3840&q=75)

### Starter Kits & demos

View all available starter kits, demos and templates on Github.

[GitHubView all templates](https://github.com/thirdweb-example)
## Why thirdweb?

The thirdweb SDK comes with all the features you need to build production-grade client-side applications. Here's a comparison with other popular libraries.

#### Feature Comparison

| thirdweb                                  | Wagmi + Viem | Ethers@6           |   |
| ----------------------------------------- | ------------ | ------------------ | - |
| Type safe contract API                    | ✅            | ✅                  | ✅ |
| Type safe wallet API                      | ✅            | ✅                  | ✅ |
| EVM utils                                 | ✅            | ✅                  | ✅ |
| RPC for any EVM                           | ✅            | ⚠️ public RPC only | ❌ |
| Automatic ABI Resolution                  | ✅            | ❌                  | ❌ |
| IPFS Upload/Download                      | ✅            | ❌                  | ❌ |
| In-app wallet (email/ social login)       | ✅            | ⚠️ via 3rd party   | ❌ |
| Account abstraction (ERC4337) support     | ✅            | ⚠️ via 3rd party   | ❌ |
| Web3 wallet connectors                    | ✅            | ✅                  | ❌ |
| Local wallet creation                     | ✅            | ✅                  | ✅ |
| Auth (SIWE)                               | ✅            | ✅                  | ❌ |
| Extensions functions for common standards | ✅            | ✅                  | ❌ |
| React Hooks                               | ✅            | ✅                  | ❌ |
| React UI components                       | ✅            | ❌                  | ❌ |
| React Native Hooks                        | ✅            | ✅                  | ❌ |
| React Native UI Components                | ✅            | ❌                  | ❌ |
| CLI (codegen)                             | ✅            | ✅                  | ❌ |

#### Bundle Size

The thirdweb SDK is designed to be as small as possible leveraging tree shaking. Here's a comparison of the bundle size to perform a simple RPC call on mainnet with other popular libraries:

![bundle size table](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fbundlesize-transparent.7ec9bd84.png&w=3840&q=75)

#### Performance Benchmarks

Performance is the biggest focus of the thirdweb SDK. Here are some runtime benchmarks for encoding, RPC calls, reading contract state and sending a transaction:

![performance table](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fperformance-transparent.ed90271d.png&w=3840&q=75)

To run your own benchmarks or see results in detail, [check out our instructions to run them.](https://github.com/thirdweb-dev/js/tree/main/packages/thirdweb/benchmarks)

_Last updated: March 14, 2024_
## ERC1155DelayedReveal

```solidity
import "@thirdweb-dev/contracts/base/ERC1155DelayedReveal.sol";
```

`ERC1155DelayedReveal` adds the [Delayed Reveal](https://portal.thirdweb.com/glossary/delayed-reveal) feature to the[ERC1155LazyMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/lazy-mint) base contract.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/base/ERC1155DelayedReveal.sol) 

### Usage

Import the contract and inherit from it.

```solidity
// SPDX-License-Identifier: Apache-2.0
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/base/ERC1155DelayedReveal.sol";
 
contract MyNFT is ERC1155DelayedReveal {
    constructor(
        address _defaultAdmin,
        string memory _name,
        string memory _symbol,
        address _royaltyRecipient,
        uint128 _royaltyBps
    ) ERC1155DelayedReveal(_defaultAdmin, _name, _symbol, _royaltyRecipient, _royaltyBps) {}
}
```

### Detected Extensions

Once deployed, you can use the features made available by these extensions on the SDK and dashboard:

Click on each feature to learn more about what functions are available.

* [ERC1155](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155)
* [ERC1155LazyMintableV2](https://portal.thirdweb.com/contracts/build/extensions/general/LazyMint)
* [ERC1155Burnable](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Burnable)
* [ERC1155Enumerable](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Enumerable)
* [ERC1155ClaimCustom](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155ClaimCustom)
* [Royalty](https://portal.thirdweb.com/contracts/build/extensions/general/Royalty)
* [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)
* [Ownable](https://portal.thirdweb.com/contracts/build/extensions/general/Ownable)

### Functions to Override

The following functions have been implemented on this contract & are available to be overridden to add custom logic:

##### uri

```solidity
/**
    *  @notice         Returns the metadata URI for an NFT.
    *  @dev            See `BatchMintMetadata` for handling of metadata in this contract.
    *
    *  @param _tokenId The tokenId of an NFT.
    */
function uri(uint256 _tokenId) public view override returns (string memory) {
    (uint256 batchId, ) = _getBatchId(_tokenId);
    string memory batchUri = _getBaseURI(_tokenId);
 
    if (isEncryptedBatch(batchId)) {
        return string(abi.encodePacked(batchUri, "0"));
    } else {
        return string(abi.encodePacked(batchUri, _tokenId.toString()));
    }
}
```

##### lazyMint

```solidity
/**
    *  @notice                  Lets an authorized address lazy mint a given amount of NFTs.
    *
    *  @param _amount           The number of NFTs to lazy mint.
    *  @param _baseURIForTokens The placeholder base URI for the 'n' number of NFTs being lazy minted, where the
    *                           metadata for each of those NFTs is `${baseURIForTokens}/${tokenId}`.
    *  @param _data             The encrypted base URI + provenance hash for the batch of NFTs being lazy minted.
    *  @return batchId          A unique integer identifier for the batch of NFTs lazy minted together.
    */
function lazyMint(
    uint256 _amount,
    string calldata _baseURIForTokens,
    bytes calldata _data
) public virtual override returns (uint256 batchId) {
    if (_data.length > 0) {
        (bytes memory encryptedURI, bytes32 provenanceHash) = abi.decode(_data, (bytes, bytes32));
        if (encryptedURI.length != 0 && provenanceHash != "") {
            _setEncryptedData(nextTokenIdToLazyMint + _amount, _data);
        }
    }
 
    return super.lazyMint(_amount, _baseURIForTokens, _data);
}
```

##### reveal

```solidity
/**
    *  @notice       Lets an authorized address reveal a batch of delayed reveal NFTs.
    *
    *  @param _index The ID for the batch of delayed-reveal NFTs to reveal.
    *  @param _key   The key with which the base URI for the relevant batch of NFTs was encrypted.
    */
function reveal(uint256 _index, bytes calldata _key) external virtual override returns (string memory revealedURI) {
    require(_canReveal(), "Not authorized");
 
    uint256 batchId = getBatchIdAtIndex(_index);
    revealedURI = getRevealURI(batchId, _key);
 
    _setEncryptedData(batchId, "");
    _setBaseURI(batchId, revealedURI);
 
    emit TokenURIRevealed(_index, revealedURI);
}
 
/// @dev Checks whether NFTs can be revealed in the given execution context.
function _canReveal() internal view virtual returns (bool) {
    return msg.sender == owner();
}
```
## ERC1155Drop

```solidity
import "@thirdweb-dev/contracts/base/ERC1155Drop.sol";
```

The `ERC1155Drop` base contract is the foundation for an Edition (ERC1155) NFT Drop that other wallets can claim.

It implements the [ERC1155 standard](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155) with [Lazy Mint](https://portal.thirdweb.com/contracts/build/extensions/general/LazyMint),[Delayed Reveal](https://portal.thirdweb.com/contracts/build/extensions/general/DelayedReveal) and [Drop](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155DropSinglePhase) extensions; allowing you to batch lazy-mint NFTs, and allow other wallets to claim them under the criteria of claim conditions, with an optional delayed reveal.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/base/ERC1155Drop.sol) 

### Usage

Import the contract and inherit from it.

```solidity
// SPDX-License-Identifier: Apache-2.0
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/base/ERC1155Drop.sol";
 
contract MyNFT is ERC1155Drop {
    constructor(
        address _defaultAdmin,
        string memory _name,
        string memory _symbol,
        address _royaltyRecipient,
        uint128 _royaltyBps,
        address _primarySaleRecipient
    )
        ERC1155Drop(
            _defaultAdmin,
            _name,
            _symbol,
            _royaltyRecipient,
            _royaltyBps,
            _primarySaleRecipient
        )
    {}
}
```

### Detected Extensions

Once deployed, you can use the features made available by these extensions on the SDK and dashboard:

Click on each feature to learn more about what functions are available.

* [ERC1155](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155)
* [ERC1155LazyMintableV2](https://portal.thirdweb.com/contracts/build/extensions/general/LazyMint)
* [ERC1155Burnable](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Burnable)
* [ERC1155Enumerable](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Enumerable)
* [ERC1155ClaimConditionsV2](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155ClaimConditions)
* [PrimarySale](https://portal.thirdweb.com/contracts/build/extensions/general/PrimarySale)
* [Royalty](https://portal.thirdweb.com/contracts/build/extensions/general/Royalty)
* [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)
* [Ownable](https://portal.thirdweb.com/contracts/build/extensions/general/Ownable)

### Functions to Override

The following functions have been implemented on this contract & are available to be overridden to add custom logic:

##### burn

```solidity
/**
*  @notice         Lets an owner or approved operator burn NFTs of the given tokenId.
*
*  @param _owner   The owner of the NFT to burn.
*  @param _tokenId The tokenId of the NFT to burn.
*  @param _amount  The amount of the NFT to burn.
*/
function burn(
    address _owner,
    uint256 _tokenId,
    uint256 _amount
) external virtual {
    address caller = msg.sender;
 
    require(caller == _owner || isApprovedForAll[_owner][caller], "Unapproved caller");
    require(balanceOf[_owner][_tokenId] >= _amount, "Not enough tokens owned");
 
    _burn(_owner, _tokenId, _amount);
}
```

##### burnBatch

```solidity
/**
*  @notice         Lets an owner or approved operator burn NFTs of the given tokenIds.
*
*  @param _owner    The owner of the NFTs to burn.
*  @param _tokenIds The tokenIds of the NFTs to burn.
*  @param _amounts  The amounts of the NFTs to burn.
*/
function burnBatch(
    address _owner,
    uint256[] memory _tokenIds,
    uint256[] memory _amounts
) external virtual {
    address caller = msg.sender;
 
    require(caller == _owner || isApprovedForAll[_owner][caller], "Unapproved caller");
    require(_tokenIds.length == _amounts.length, "Length mismatch");
 
    for (uint256 i = 0; i < _tokenIds.length; i += 1) {
        require(balanceOf[_owner][_tokenIds[i]] >= _amounts[i], "Not enough tokens owned");
    }
 
    _burnBatch(_owner, _tokenIds, _amounts);
}
```

##### uri

```solidity
/**
*  @notice         Returns the metadata URI for an NFT.
*  @dev            See `BatchMintMetadata` for handling of metadata in this contract.
*
*  @param _tokenId The tokenId of an NFT.
*/
function uri(uint256 _tokenId) public view virtual override returns (string memory) {
    (uint256 batchId, ) = _getBatchId(_tokenId);
    string memory batchUri = _getBaseURI(_tokenId);
 
    if (isEncryptedBatch(batchId)) {
        return string(abi.encodePacked(batchUri, "0"));
    } else {
        return string(abi.encodePacked(batchUri, _tokenId.toString()));
    }
}
```

##### reveal

```solidity
/**
*  @notice       Lets an authorized address reveal a batch of delayed reveal NFTs.
*
*  @param _index The ID for the batch of delayed-reveal NFTs to reveal.
*  @param _key   The key with which the base URI for the relevant batch of NFTs was encrypted.
*/
function reveal(uint256 _index, bytes calldata _key) public virtual override returns (string memory revealedURI) {
    require(_canReveal(), "Not authorized");
 
    uint256 batchId = getBatchIdAtIndex(_index);
    revealedURI = getRevealURI(batchId, _key);
 
    _setEncryptedData(batchId, "");
    _setBaseURI(batchId, revealedURI);
 
    emit TokenURIRevealed(_index, revealedURI);
}
```

##### lazyMint

```solidity
/**
*  @notice                  Lets an authorized address lazy mint a given amount of NFTs.
*
*  @param _amount           The number of NFTs to lazy mint.
*  @param _baseURIForTokens The placeholder base URI for the 'n' number of NFTs being lazy minted, where the
*                           metadata for each of those NFTs is `${baseURIForTokens}/${tokenId}`.
*  @param _data             The encrypted base URI + provenance hash for the batch of NFTs being lazy minted.
*  @return batchId          A unique integer identifier for the batch of NFTs lazy minted together.
*/
function lazyMint(
    uint256 _amount,
    string calldata _baseURIForTokens,
    bytes calldata _data
) public virtual override returns (uint256 batchId) {
    if (_data.length > 0) {
        (bytes memory encryptedURI, bytes32 provenanceHash) = abi.decode(_data, (bytes, bytes32));
        if (encryptedURI.length != 0 && provenanceHash != "") {
            _setEncryptedData(nextTokenIdToLazyMint + _amount, _data);
        }
    }
 
    return LazyMint.lazyMint(_amount, _baseURIForTokens, _data);
}
```

##### \_beforeClaim

```solidity
/// @dev Runs before every `claim` function call.
function _beforeClaim(
    uint256 _tokenId,
    address,
    uint256,
    address,
    uint256,
    AllowlistProof calldata,
    bytes memory
) internal view virtual override {
    if (_tokenId >= nextTokenIdToLazyMint) {
        revert("Not enough minted tokens");
    }
}
```

##### \_collectPriceOnClaim

```solidity
/// @dev Collects and distributes the primary sale value of NFTs being claimed.
function _collectPriceOnClaim(
    address _primarySaleRecipient,
    uint256 _quantityToClaim,
    address _currency,
    uint256 _pricePerToken
) internal virtual override {
    if (_pricePerToken == 0) {
        return;
    }
 
    uint256 totalPrice = _quantityToClaim * _pricePerToken;
 
    if (_currency == CurrencyTransferLib.NATIVE_TOKEN) {
        if (msg.value != totalPrice) {
            revert("Must send total price.");
        }
    }
 
    address saleRecipient = _primarySaleRecipient == address(0) ? primarySaleRecipient() : _primarySaleRecipient;
    CurrencyTransferLib.transferCurrency(_currency, msg.sender, saleRecipient, totalPrice);
}
```

##### \_transferTokensOnClaim

```solidity
/// @dev Transfers the NFTs being claimed.
function _transferTokensOnClaim(
    address _to,
    uint256 _tokenId,
    uint256 _quantityBeingClaimed
) internal virtual override {
    _mint(_to, _tokenId, _quantityBeingClaimed, "");
}
```

##### \_beforeTokenTransfer

```solidity
/// @dev Runs before every token transfer / mint / burn.
function _beforeTokenTransfer(
    address operator,
    address from,
    address to,
    uint256[] memory ids,
    uint256[] memory amounts,
    bytes memory data
) internal virtual override {
    super._beforeTokenTransfer(operator, from, to, ids, amounts, data);
 
    if (from == address(0)) {
        for (uint256 i = 0; i < ids.length; ++i) {
            totalSupply[ids[i]] += amounts[i];
        }
    }
 
    if (to == address(0)) {
        for (uint256 i = 0; i < ids.length; ++i) {
            totalSupply[ids[i]] -= amounts[i];
        }
    }
}
```
## ERC1155Base

```solidity
import "@thirdweb-dev/contracts/base/ERC1155Base.sol";
```

The `ERC1155Base` smart contract implements the [ERC1155](https://eips.ethereum.org/EIPS/eip-1155) NFT standard. It allows for minting NFTs to yourself (or to someone else) and selling those NFTs on a marketplace.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/base/ERC1155Base.sol) 

### Usage

Import the contract and inherit from it.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/base/ERC1155Base.sol";
 
contract MyNFT is ERC1155Base {
	  constructor(
        address _defaultAdmin,
        string memory _name,
        string memory _symbol,
        address _royaltyRecipient,
        uint128 _royaltyBps
    )
        ERC1155Base(
            _defaultAdmin,
            _name,
            _symbol,
            _royaltyRecipient,
            _royaltyBps
        )
    {}
}
```

### Detected Extensions

Once deployed, you can use the features made available by these extensions on the SDK and dashboard:

Click on each feature to learn more about what functions are available.

* [ERC1155](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155)
* [ERC1155Mintable](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Mintable)
* [ERC1155BatchMintable](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155BatchMintable)
* [ERC1155Burnable](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Burnable)
* [ERC1155Enumerable](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Enumerable)
* [Royalty](https://portal.thirdweb.com/contracts/build/extensions/general/Royalty)
* [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)
* [Ownable](https://portal.thirdweb.com/contracts/build/extensions/general/Ownable)

### Functions to Override

The following functions have been implemented on this contract & are available to be overridden to add custom logic:

##### uri

```solidity
/// @notice Returns the metadata URI for the given tokenId.
function uri(uint256 _tokenId) public view virtual override returns (string memory) {
    string memory uriForToken = _uri[_tokenId];
    if (bytes(uriForToken).length > 0) {
        return uriForToken;
    }
 
    string memory batchUri = _getBaseURI(_tokenId);
    return string(abi.encodePacked(batchUri, _tokenId.toString()));
}
```

##### mintTo

```solidity
/**
    *  @notice          Lets an authorized address mint NFTs to a recipient.
    *  @dev             - The logic in the `_canMint` function determines whether the caller is authorized to mint NFTs.
    *                   - If `_tokenId == type(uint256).max` a new NFT at tokenId `nextTokenIdToMint` is minted. If the given
    *                     `tokenId < nextTokenIdToMint`, then additional supply of an existing NFT is being minted.
    *
    *  @param _to       The recipient of the NFTs to mint.
    *  @param _tokenId  The tokenId of the NFT to mint.
    *  @param _tokenURI The full metadata URI for the NFTs minted (if a new NFT is being minted).
    *  @param _amount   The amount of the same NFT to mint.
    */
function mintTo(
    address _to,
    uint256 _tokenId,
    string memory _tokenURI,
    uint256 _amount
) public virtual {
    require(_canMint(), "Not authorized to mint.");
 
    uint256 tokenIdToMint;
    uint256 nextIdToMint = nextTokenIdToMint();
 
    if (_tokenId == type(uint256).max) {
        tokenIdToMint = nextIdToMint;
        nextTokenIdToMint_ += 1;
        _setTokenURI(nextIdToMint, _tokenURI);
    } else {
        require(_tokenId < nextIdToMint, "invalid id");
        tokenIdToMint = _tokenId;
    }
 
    _mint(_to, tokenIdToMint, _amount, "");
}
```

##### batchMintTo

```solidity
/**
    *  @notice          Lets an authorized address mint multiple NEW NFTs at once to a recipient.
    *  @dev             The logic in the `_canMint` function determines whether the caller is authorized to mint NFTs.
    *                   If `_tokenIds[i] == type(uint256).max` a new NFT at tokenId `nextTokenIdToMint` is minted. If the given
    *                   `tokenIds[i] < nextTokenIdToMint`, then additional supply of an existing NFT is minted.
    *                   The metadata for each new NFT is stored at `baseURI/{tokenID of NFT}`
    *
    *  @param _to       The recipient of the NFT to mint.
    *  @param _tokenIds The tokenIds of the NFTs to mint.
    *  @param _amounts  The amounts of each NFT to mint.
    *  @param _baseURI  The baseURI for the `n` number of NFTs minted. The metadata for each NFT is `baseURI/tokenId`
    */
function batchMintTo(
    address _to,
    uint256[] memory _tokenIds,
    uint256[] memory _amounts,
    string memory _baseURI
) public virtual {
    require(_canMint(), "Not authorized to mint.");
    require(_amounts.length > 0, "Minting zero tokens.");
    require(_tokenIds.length == _amounts.length, "Length mismatch.");
 
    uint256 nextIdToMint = nextTokenIdToMint();
    uint256 startNextIdToMint = nextIdToMint;
 
    uint256 numOfNewNFTs;
 
    for (uint256 i = 0; i < _tokenIds.length; i += 1) {
        if (_tokenIds[i] == type(uint256).max) {
            _tokenIds[i] = nextIdToMint;
 
            nextIdToMint += 1;
            numOfNewNFTs += 1;
        } else {
            require(_tokenIds[i] < nextIdToMint, "invalid id");
        }
    }
 
    if (numOfNewNFTs > 0) {
        _batchMintMetadata(startNextIdToMint, numOfNewNFTs, _baseURI);
    }
 
    nextTokenIdToMint_ = nextIdToMint;
    _mintBatch(_to, _tokenIds, _amounts, "");
 
}
```

##### burn

```solidity
/**
    *  @notice         Lets an owner or approved operator burn NFTs of the given tokenId.
    *
    *  @param _owner   The owner of the NFT to burn.
    *  @param _tokenId The tokenId of the NFT to burn.
    *  @param _amount  The amount of the NFT to burn.
    */
function burn(
    address _owner,
    uint256 _tokenId,
    uint256 _amount
) external virtual {
    address caller = msg.sender;
 
    require(caller == _owner || isApprovedForAll[_owner][caller], "Unapproved caller");
    require(balanceOf[_owner][_tokenId] >= _amount, "Not enough tokens owned");
 
    _burn(_owner, _tokenId, _amount);
}
```

##### burnBatch

```solidity
/**
    *  @notice         Lets an owner or approved operator burn NFTs of the given tokenIds.
    *
    *  @param _owner    The owner of the NFTs to burn.
    *  @param _tokenIds The tokenIds of the NFTs to burn.
    *  @param _amounts  The amounts of the NFTs to burn.
    */
function burnBatch(
    address _owner,
    uint256[] memory _tokenIds,
    uint256[] memory _amounts
) external virtual {
    address caller = msg.sender;
 
    require(caller == _owner || isApprovedForAll[_owner][caller], "Unapproved caller");
    require(_tokenIds.length == _amounts.length, "Length mismatch");
 
    for (uint256 i = 0; i < _tokenIds.length; i += 1) {
        require(balanceOf[_owner][_tokenIds[i]] >= _amounts[i], "Not enough tokens owned");
    }
 
    _burnBatch(_owner, _tokenIds, _amounts);
}
```

##### \_beforeTokenTransfer

```solidity
/// @dev Runs before every token transfer / mint / burn.
function _beforeTokenTransfer(
    address operator,
    address from,
    address to,
    uint256[] memory ids,
    uint256[] memory amounts,
    bytes memory data
) internal virtual override {
    super._beforeTokenTransfer(operator, from, to, ids, amounts, data);
 
    if (from == address(0)) {
        for (uint256 i = 0; i < ids.length; ++i) {
            totalSupply[ids[i]] += amounts[i];
        }
    }
 
    if (to == address(0)) {
        for (uint256 i = 0; i < ids.length; ++i) {
            totalSupply[ids[i]] -= amounts[i];
        }
    }
}
```
## ERC20Base

The `ERC20Base` smart contract implements the [ERC-20](https://eips.ethereum.org/EIPS/eip-20) standard. Additionally, it supports [EIP-2612](https://eips.ethereum.org/EIPS/eip-2612), allowing approvals to be made via signatures.

```solidity
import "@thirdweb-dev/contracts/base/ERC20Base.sol";
```

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/base/ERC20Base.sol) 

### Usage

Import the contract and inherit from it.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/base/ERC20Base.sol";
 
contract MyToken is ERC20Base {
	  constructor(
        address _defaultAdmin,
        string memory _name,
        string memory _symbol
    )
        ERC20Base(
            _defaultAdmin,
            _name,
            _symbol
        )
    {}
}
```

### Detected Extensions

Once deployed, you can use the features made available by these extensions on the SDK and dashboard:

* [ERC20](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20)
* [ERC20Mintable](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20BatchMintable)
* [ERC20Permit](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20Permit)
* [ERC20BatchMintable](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20BatchMintable)
* [Ownable](https://portal.thirdweb.com/contracts/build/extensions/general/Ownable)
* [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)

#### Functions to Override

The following functions have been implemented on this contract & are available to be overridden to add custom logic:

##### mintTo

```solidity
/**
 *  @notice          Lets an authorized address mint tokens to a recipient.
 *  @dev             The logic in the `_canMint` function determines whether the caller is authorized to mint tokens.
 *
 *  @param _to       The recipient of the tokens to mint.
 *  @param _amount   Quantity of tokens to mint.
 */
function mintTo(address _to, uint256 _amount) public virtual {
    require(_canMint(), "Not authorized to mint.");
    require(_amount != 0, "Minting zero tokens.");
 
    _mint(_to, _amount);
}
```

##### burn

```solidity
/**
 *  @notice          Lets an owner a given amount of their tokens.
 *  @dev             Caller should own the `_amount` of tokens.
 *
 *  @param _amount   The number of tokens to burn.
 */
function burn(uint256 _amount) external virtual {
    require(balanceOf(msg.sender) >= _amount, "not enough balance");
    _burn(msg.sender, _amount);
}
```
## ERC1155SignatureMint

```solidity
import "@thirdweb-dev/contracts/base/ERC1155SignatureMint.sol";
```

The `ERC1155SignatureMint` smart contract adds [Signature-Based Minting](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155SignatureMint)extensions to the [ERC1155Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/base) contract.

Signature minting uses the [EIP-712](https://eips.ethereum.org/EIPS/eip-712) standard, and enables a contract admin to authorize an external party's request to mint tokens on the admin's contract. At a high level, this means you can authorize some external party to mint tokens on your contract, and specify what will be minted.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/base/ERC1155SignatureMint.sol) 

### Usage

Import the contract and inherit from it.

```solidity
// SPDX-License-Identifier: Apache-2.0
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/base/ERC1155SignatureMint.sol";
 
contract MyNFT is ERC1155SignatureMint {
    constructor(
        address _defaultAdmin,
        string memory _name,
        string memory _symbol,
        address _royaltyRecipient,
        uint128 _royaltyBps,
        address _primarySaleRecipient
    )
        ERC1155SignatureMint(
            _defaultAdmin,
            _name,
            _symbol,
            _royaltyRecipient,
            _royaltyBps,
            _primarySaleRecipient
        )
    {}
}
```

  
### Detected Extensions

Once deployed, you can use the features made available by these extensions on the SDK and dashboard:

Click on each feature to learn more about what functions are available.

* [ERC1155](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155)
* [ERC1155Mintable](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Mintable)
* [ERC1155BatchMintable](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155BatchMintable)
* [ERC1155Burnable](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Burnable)
* [ERC1155Enumerable](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Enumerable)
* [ERC1155SignatureMintable](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155SignatureMint)
* [Royalty](https://portal.thirdweb.com/contracts/build/extensions/general/Royalty)
* [PrimarySale](https://portal.thirdweb.com/contracts/build/extensions/general/PrimarySale)
* [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)
* [Ownable](https://portal.thirdweb.com/contracts/build/extensions/general/Ownable)
  
### Functions to Override

The following functions have been implemented on this contract & are available to be overridden to add custom logic:

##### mintWithSignature

```solidity
/**
 *  @notice           Mints tokens according to the provided mint request.
 *
 *  @param _req       The payload / mint request.
 *  @param _signature The signature produced by an account signing the mint request.
 */
function mintWithSignature(MintRequest calldata _req, bytes calldata _signature)
    external
    payable
    virtual
    override
    returns (address signer)
{
    require(_req.quantity > 0, "Minting zero tokens.");
 
    uint256 tokenIdToMint;
    uint256 nextIdToMint = nextTokenIdToMint();
 
    if (_req.tokenId == type(uint256).max) {
        tokenIdToMint = nextIdToMint;
        nextTokenIdToMint_ += 1;
    } else {
        require(_req.tokenId < nextIdToMint, "invalid id");
        tokenIdToMint = _req.tokenId;
    }
 
    // Verify and process payload.
    signer = _processRequest(_req, _signature);
 
    address receiver = _req.to;
 
    // Collect price
    _collectPriceOnClaim(_req.primarySaleRecipient, _req.quantity, _req.currency, _req.pricePerToken);
 
    // Set royalties, if applicable.
    if (_req.royaltyRecipient != address(0)) {
        _setupRoyaltyInfoForToken(tokenIdToMint, _req.royaltyRecipient, _req.royaltyBps);
    }
 
    // Set URI
    if (_req.tokenId == type(uint256).max) {
        _setTokenURI(tokenIdToMint, _req.uri);
    }
 
    // Mint tokens.
    _mint(receiver, tokenIdToMint, _req.quantity, "");
 
    emit TokensMintedWithSignature(signer, receiver, tokenIdToMint, _req);
}
```

##### \_collectPriceOnClaim

```solidity
/// @dev Collects and distributes the primary sale value of NFTs being claimed.
function _collectPriceOnClaim(
    address _primarySaleRecipient,
    uint256 _quantityToClaim,
    address _currency,
    uint256 _pricePerToken
) internal virtual {
    if (_pricePerToken == 0) {
        return;
    }
 
    uint256 totalPrice = _quantityToClaim * _pricePerToken;
 
    if (_currency == CurrencyTransferLib.NATIVE_TOKEN) {
        require(msg.value == totalPrice, "Must send total price.");
    }
 
    address saleRecipient = _primarySaleRecipient == address(0) ? primarySaleRecipient() : _primarySaleRecipient;
    CurrencyTransferLib.transferCurrency(_currency, msg.sender, saleRecipient, totalPrice);
}
```
## ERC20DropVote

The `ERC20Drop` base contract adds the [Drop Single Phase](https://portal.thirdweb.com/contracts/build/extensions/general/DropSinglePhase) extension to the [ERC20 base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/base) contract to allow you to distribute your tokens under the criteria of claim conditions. It also implements the [ERC20Votes](https://github.com/OpenZeppelin/openzeppelin-contracts/blob/master/contracts/token/ERC20/extensions/ERC20Votes.sol) contract, which provides voting and delegation functionality, along with delegation by signature.

```solidity
import "@thirdweb-dev/contracts/base/ERC20DropVote.sol";
```

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/base/ERC20DropVote.sol) 

### Usage

Import the contract and inherit from it.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/base/ERC20DropVote.sol";
 
contract MyToken is ERC20DropVote {
	  constructor(
        address _defaultAdmin,
        string memory _name,
        string memory _symbol,
        address _primarySaleRecipient
    )
        ERC20DropVote(
            _defaultAdmin,
            _name,
            _symbol,
            _primarySaleRecipient
        )
    {}
}
```

### Detected Extensions

Once deployed, you can use the features made available by these extensions on the SDK and dashboard:

* [ERC20](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20)
* [ERC20ClaimConditionsV2](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20claimconditions)
* [ERC20Permit](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20Permit)
* [PrimarySale](https://portal.thirdweb.com/contracts/build/extensions/general/PrimarySale)
* [Ownable](https://portal.thirdweb.com/contracts/build/extensions/general/Ownable)
* [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)

#### Functions to Override

The following functions have been implemented on this contract & are available to be overridden to add custom logic:

##### burn

```solidity
/**
 *  @notice          Lets an owner a given amount of their tokens.
 *  @dev             Caller should own the `_amount` of tokens.
 *
 *  @param _amount   The number of tokens to burn.
 */
function burn(uint256 _amount) external virtual {
    require(balanceOf(msg.sender) >= _amount, "not enough balance");
    _burn(msg.sender, _amount);
}
```

##### \_collectPriceOnClaim

```solidity
/// @dev Collects and distributes the primary sale value of tokens being claimed.
function _collectPriceOnClaim(
    address _primarySaleRecipient,
    uint256 _quantityToClaim,
    address _currency,
    uint256 _pricePerToken
) internal virtual override {
    if (_pricePerToken == 0) {
        return;
    }
 
    uint256 totalPrice = (_quantityToClaim * _pricePerToken) / 1 ether;
    require(totalPrice > 0, "quantity too low");
 
    if (_currency == CurrencyTransferLib.NATIVE_TOKEN) {
        require(msg.value == totalPrice, "Must send total price.");
    }
 
    address saleRecipient = _primarySaleRecipient == address(0) ? primarySaleRecipient() : _primarySaleRecipient;
    CurrencyTransferLib.transferCurrency(_currency, msg.sender, saleRecipient, totalPrice);
}
```

##### \_transferTokensOnClaim

```solidity
/// @dev Transfers the tokens being claimed.
function _transferTokensOnClaim(address _to, uint256 _quantityBeingClaimed)
    internal
    virtual
    override
    returns (uint256)
{
    _mint(_to, _quantityBeingClaimed);
    return 0;
}
```
## ERC20Drop

The `ERC20Drop` base contract adds the [Drop Single Phase](https://portal.thirdweb.com/contracts/build/extensions/general/DropSinglePhase) extension contract to the [ERC20 base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/base) contract to allow you to distribute your tokens under the criteria of claim conditions.

```solidity
import "@thirdweb-dev/contracts/base/ERC20Drop.sol";
```

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/base/ERC20Drop.sol) 

### Usage

Import the contract and inherit from it.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/base/ERC20Drop.sol";
 
contract MyToken is ERC20Drop {
	  constructor(
        address _defaultAdmin,
        string memory _name,
        string memory _symbol,
        address _primarySaleRecipient
    )
        ERC20Drop(
            _defaultAdmin,
            _name,
            _symbol,
            _primarySaleRecipient
        )
    {}
}
```

### Detected Extensions

Once deployed, you can use the features made available by these extensions on the SDK and dashboard:

* [ERC20](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20)
* [ERC20ClaimConditionsV2](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20claimconditions)
* [ERC20Permit](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20Permit)
* [PrimarySale](https://portal.thirdweb.com/contracts/build/extensions/general/PrimarySale)
* [Ownable](https://portal.thirdweb.com/contracts/build/extensions/general/Ownable)
* [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)

#### Functions to Override

The following functions have been implemented on this contract & are available to be overridden to add custom logic:

##### burn

```solidity
/**
*  @notice          Lets an owner a given amount of their tokens.
*  @dev             Caller should own the `_amount` of tokens.
*
*  @param _amount   The number of tokens to burn.
*/
function burn(uint256 _amount) external virtual {
    require(balanceOf(msg.sender) >= _amount, "not enough balance");
    _burn(msg.sender, _amount);
}
```

##### \_collectPriceOnClaim

```solidity
/// @dev Collects and distributes the primary sale value of tokens being claimed.
function _collectPriceOnClaim(
    address _primarySaleRecipient,
    uint256 _quantityToClaim,
    address _currency,
    uint256 _pricePerToken
) internal virtual override {
    if (_pricePerToken == 0) {
        return;
    }
 
    uint256 totalPrice = (_quantityToClaim * _pricePerToken) / 1 ether;
    require(totalPrice > 0, "quantity too low");
 
    if (_currency == CurrencyTransferLib.NATIVE_TOKEN) {
        require(msg.value == totalPrice, "Must send total price.");
    }
 
    address saleRecipient = _primarySaleRecipient == address(0) ? primarySaleRecipient() : _primarySaleRecipient;
    CurrencyTransferLib.transferCurrency(_currency, msg.sender, saleRecipient, totalPrice);
}
```

##### \_transferTokensOnClaim

```solidity
/// @dev Transfers the tokens being claimed.
function _transferTokensOnClaim(address _to, uint256 _quantityBeingClaimed)
    internal
    virtual
    override
    returns (uint256)
{
    _mint(_to, _quantityBeingClaimed);
    return 0;
}
```
## ERC1155LazyMint

```solidity
import "@thirdweb-dev/contracts/base/ERC1155LazyMint.sol";
```

`ERC1155LazyMint` allows you to [Lazy Mint](https://portal.thirdweb.com/glossary/lazy-minting) NFTs on your contract. It exposes a `verifyClaim` function that you can override to add your claim-restriction logic.

Lazy minting allows you to define the metadata of NFTs without minting it to an address. As a contract admin, this lets you prepare the metadata for NFTs that will be minted by other wallets, without paying the gas cost for actually minting the NFTs.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/base/ERC1155LazyMint.sol) 

### Usage

Import the contract and inherit from it.

```solidity
// SPDX-License-Identifier: Apache-2.0
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/base/ERC1155LazyMint.sol";
 
contract MyNFT is ERC1155LazyMint {
    constructor(
        address _defaultAdmin,
        string memory _name,
        string memory _symbol,
        address _royaltyRecipient,
        uint128 _royaltyBps
    ) ERC1155LazyMint(_defaultAdmin, _name, _symbol, _royaltyRecipient, _royaltyBps) {}
 
    function verifyClaim(address _claimer, uint256 _tokenId, uint256 _quantity) public view virtual override {
      // Your custom claim restriction logic
    }
}
```

### Detected Extensions

Once deployed, you can use the features made available by these extensions on the SDK and dashboard:

Click on each feature to learn more about what functions are available.

* [ERC1155](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155)
* [ERC1155LazyMintableV2](https://portal.thirdweb.com/contracts/build/extensions/general/LazyMint)
* [ERC1155Burnable](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Burnable)
* [ERC1155Enumerable](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Enumerable)
* [ERC1155ClaimCustom](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155ClaimCustom)
* [Royalty](https://portal.thirdweb.com/contracts/build/extensions/general/Royalty)
* [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)
* [Ownable](https://portal.thirdweb.com/contracts/build/extensions/general/Ownable)

### Functions to Override

The following functions have been implemented on this contract & are available to be overridden to add custom logic:

##### uri

```solidity
/// @notice Returns the metadata URI for the given tokenId.
function uri(uint256 _tokenId) public view virtual override returns (string memory) {
    string memory batchUri = _getBaseURI(_tokenId);
    return string(abi.encodePacked(batchUri, _tokenId.toString()));
}
```

##### claim

```solidity
/**
*  @notice          Lets an address claim multiple lazy minted NFTs at once to a recipient.
*                   This function prevents any reentrant calls, and is not allowed to be overridden.
*
*                   Contract creators should override `verifyClaim` and `transferTokensOnClaim`
*                   functions to create custom logic for verification and claiming,
*                   for e.g. price collection, allowlist, max quantity, etc.
*
*  @dev             The logic in `verifyClaim` determines whether the caller is authorized to mint NFTs.
*                   The logic in `transferTokensOnClaim` does actual minting of tokens,
*                   can also be used to apply other state changes.
*
*  @param _receiver  The recipient of the tokens to mint.
*  @param _tokenId   The tokenId of the lazy minted NFT to mint.
*  @param _quantity  The number of tokens to mint.
*/
function claim(
    address _receiver,
    uint256 _tokenId,
    uint256 _quantity
) public payable nonReentrant {
    require(_tokenId < nextTokenIdToMint(), "invalid id");
    verifyClaim(msg.sender, _tokenId, _quantity); // Add your claim verification logic by overriding this function.
 
    _transferTokensOnClaim(_receiver, _tokenId, _quantity); // Mints tokens. Apply any state updates by overriding this function.
    emit TokensClaimed(msg.sender, _receiver, _tokenId, _quantity);
 
}
```

##### verifyClaim

```solidity
/**
 *  @notice          Override this function to add logic for claim verification, based on conditions
 *                   such as allowlist, price, max quantity etc.
 *
 *  @dev             Checks a request to claim NFTs against a custom condition.
 *
 *  @param _claimer   Caller of the claim function.
 *  @param _tokenId   The tokenId of the lazy minted NFT to mint.
 *  @param _quantity  The number of NFTs being claimed.
 */
function verifyClaim(
    address _claimer,
    uint256 _tokenId,
    uint256 _quantity
) public view virtual {}
```

##### burn

```solidity
/**
 *  @notice         Lets an owner or approved operator burn NFTs of the given tokenId.
 *
 *  @param _owner   The owner of the NFT to burn.
 *  @param _tokenId The tokenId of the NFT to burn.
 *  @param _amount  The amount of the NFT to burn.
 */
function burn(
    address _owner,
    uint256 _tokenId,
    uint256 _amount
) external virtual {
    address caller = msg.sender;
 
    require(caller == _owner || isApprovedForAll[_owner][caller], "Unapproved caller");
    require(balanceOf[_owner][_tokenId] >= _amount, "Not enough tokens owned");
 
    _burn(_owner, _tokenId, _amount);
}
```

##### burnBatch

```solidity
/**
     *  @notice         Lets an owner or approved operator burn NFTs of the given tokenIds.
     *
     *  @param _owner    The owner of the NFTs to burn.
     *  @param _tokenIds The tokenIds of the NFTs to burn.
     *  @param _amounts  The amounts of the NFTs to burn.
     */
    function burnBatch(
        address _owner,
        uint256[] memory _tokenIds,
        uint256[] memory _amounts
    ) external virtual {
        address caller = msg.sender;
 
        require(caller == _owner || isApprovedForAll[_owner][caller], "Unapproved caller");
        require(_tokenIds.length == _amounts.length, "Length mismatch");
 
        for (uint256 i = 0; i < _tokenIds.length; i += 1) {
            require(balanceOf[_owner][_tokenIds[i]] >= _amounts[i], "Not enough tokens owned");
        }
 
        _burnBatch(_owner, _tokenIds, _amounts);
    }
```

##### \_transferTokensOnClaim

```solidity
/**
     *  @notice          Mints tokens to receiver on claim.
     *                   Any state changes related to `claim` must be applied
     *                   here by overriding this function.
     *
     *  @dev             Override this function to add logic for state updation.
     *                   When overriding, apply any state changes before `_mint`.
     */
    function _transferTokensOnClaim(
        address _receiver,
        uint256 _tokenId,
        uint256 _quantity
    ) internal virtual {
        _mint(_receiver, _tokenId, _quantity, "");
    }
```

##### \_beforeTokenTransfer

```solidity
/// @dev Runs before every token transfer / mint / burn.
    function _beforeTokenTransfer(
        address operator,
        address from,
        address to,
        uint256[] memory ids,
        uint256[] memory amounts,
        bytes memory data
    ) internal virtual override {
        super._beforeTokenTransfer(operator, from, to, ids, amounts, data);
 
        if (from == address(0)) {
            for (uint256 i = 0; i < ids.length; ++i) {
                totalSupply[ids[i]] += amounts[i];
            }
        }
 
        if (to == address(0)) {
            for (uint256 i = 0; i < ids.length; ++i) {
                totalSupply[ids[i]] -= amounts[i];
            }
        }
    }
```
## ERC20SignatureMintVote

The `ERC20SignatureMintVote` smart contract adds [signature-based minting](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20signaturemint) extension to the [ERC20Vote](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/base) base contract. It also implements the [ERC20Votes](https://github.com/OpenZeppelin/openzeppelin-contracts/blob/master/contracts/token/ERC20/extensions/ERC20Votes.sol) contract, which provides voting and delegation functionality, along with delegation by signature.[Signature minting](https://portal.thirdweb.com/glossary/signature-based-minting) uses [EIP-712](https://eips.ethereum.org/EIPS/eip-712), which enables the contract admin to authorize an external party's request to mint tokens on the admin's contract. At a high level, this means you can authorize others to mint tokens on your contract, and specify what exactly will be minted by that external party.

```solidity
import "@thirdweb-dev/contracts/base/ERC20SignatureMintVote.sol";
```

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/base/ERC20SignatureMint.sol) 

### Usage

Import the contract and inherit from it.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/base/ERC20SignatureMintVote.sol";
 
contract MyToken is ERC20SignatureMintVote {
	  constructor(
        address _defaultAdmin,
        string memory _name,
        string memory _symbol,
        address _primarySaleRecipient
    )
        ERC20SignatureMintVote(
            _defaultAdmin,
            _name,
            _symbol,
            _primarySaleRecipient
        )
    {}
}
```

### Detected Extensions

Once deployed, you can use the features made available by these extensions on the SDK and dashboard:

* [ERC20](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20)
* [ERC20Mintable](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20BatchMintable)
* [ERC20BatchMintable](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20BatchMintable)
* [ERC20SignatureMintable](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20signaturemint)
* [ERC20Permit](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20Permit)
* [PrimarySale](https://portal.thirdweb.com/contracts/build/extensions/general/PrimarySale)
* [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)
* [Ownable](https://portal.thirdweb.com/contracts/build/extensions/general/Ownable)

### Functions to Override

The following functions have been implemented on this contract & are available to be overridden to add custom logic:

##### mintWithSignature

```solidity
/**
 *  @notice           Mints tokens according to the provided mint request.
 *
 *  @param _req       The payload / mint request.
 *  @param _signature The signature produced by an account signing the mint request.
 */
function mintWithSignature(MintRequest calldata _req, bytes calldata _signature)
    external
    payable
    virtual
    returns (address signer)
{
    require(_req.quantity > 0, "Minting zero tokens.");
 
    // Verify and process payload.
    signer = _processRequest(_req, _signature);
 
    /**
        *  Get receiver of tokens.
        *
        *  Note: If `_req.to == address(0)`, a `mintWithSignature` transaction sitting in the
        *        mempool can be frontrun by copying the input data, since the minted tokens
        *        will be sent to the `_msgSender()` in this case.
        */
    address receiver = _req.to == address(0) ? msg.sender : _req.to;
 
    // Collect price
    _collectPriceOnClaim(_req.primarySaleRecipient, _req.quantity, _req.currency, _req.pricePerToken);
 
    // Mint tokens.
    _mint(receiver, _req.quantity);
 
    emit TokensMintedWithSignature(signer, receiver, _req);
}
```

##### \_collectPriceOnClaim

```solidity
/// @dev Collects and distributes the primary sale value of tokens being claimed.
function _collectPriceOnClaim(
    address _primarySaleRecipient,
    uint256 _quantityToClaim,
    address _currency,
    uint256 _pricePerToken
) internal virtual {
    if (_pricePerToken == 0) {
        return;
    }
 
    uint256 totalPrice = (_quantityToClaim * _pricePerToken) / 1 ether;
    require(totalPrice > 0, "quantity too low");
 
    if (_currency == CurrencyTransferLib.NATIVE_TOKEN) {
        require(msg.value == totalPrice, "Must send total price.");
    }
 
    address saleRecipient = _primarySaleRecipient == address(0) ? primarySaleRecipient() : _primarySaleRecipient;
    CurrencyTransferLib.transferCurrency(_currency, msg.sender, saleRecipient, totalPrice);
}
```
## ERC20SignatureMint

The `ERC20SignatureMint` smart contract adds the [signature-based minting extension](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20signaturemint)functionality to the [ERC20Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/base) contract. [Signature minting](https://portal.thirdweb.com/glossary/signature-based-minting) uses [EIP-712](https://eips.ethereum.org/EIPS/eip-712), which enables the contract admin to authorize an external party's request to mint tokens on the admin's contract. At a high level, this means you can authorize others to mint tokens on your contract, and specify what exactly will be minted by that external party.

```solidity
import "@thirdweb-dev/contracts/base/ERC20SignatureMint.sol";
```

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/base/ERC20SignatureMint.sol) 

### Usage

Import the contract and inherit from it.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/base/ERC20SignatureMint.sol";
 
contract MyToken is ERC20SignatureMint {
	  constructor(
        address _defaultAdmin,
        string memory _name,
        string memory _symbol,
        address _primarySaleRecipient
    )
        ERC20SignatureMint(
            _defaultAdmin,
            _name,
            _symbol,
            _primarySaleRecipient
        )
    {}
}
```

### Detected Extensions

Once deployed, you can use the features made available by these extensions on the SDK and dashboard:

* [ERC20](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20)
* [ERC20Mintable](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20BatchMintable)
* [ERC20BatchMintable](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20BatchMintable)
* [ERC20SignatureMintable](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20signaturemint)
* [ERC20Permit](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20Permit)
* [PrimarySale](https://portal.thirdweb.com/contracts/build/extensions/general/PrimarySale)
* [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)
* [Ownable](https://portal.thirdweb.com/contracts/build/extensions/general/Ownable)

### Functions to Override

The following functions have been implemented on this contract & are available to be overridden to add custom logic:

##### mintWithSignature

```solidity
/**
 *  @notice           Mints tokens according to the provided mint request.
 *
 *  @param _req       The payload / mint request.
 *  @param _signature The signature produced by an account signing the mint request.
 */
function mintWithSignature(MintRequest calldata _req, bytes calldata _signature)
    external
    payable
    virtual
    returns (address signer)
{
    require(_req.quantity > 0, "Minting zero tokens.");
 
    // Verify and process payload.
    signer = _processRequest(_req, _signature);
 
    address receiver = _req.to;
 
    // Collect price
    _collectPriceOnClaim(_req.primarySaleRecipient, _req.quantity, _req.currency, _req.pricePerToken);
 
    // Mint tokens.
    _mint(receiver, _req.quantity);
 
    emit TokensMintedWithSignature(signer, receiver, _req);
}
```

##### \_collectPriceOnClaim

```solidity
/// @dev Collects and distributes the primary sale value of tokens being claimed.
function _collectPriceOnClaim(
    address _primarySaleRecipient,
    uint256 _quantityToClaim,
    address _currency,
    uint256 _pricePerToken
) internal virtual {
    if (_pricePerToken == 0) {
        return;
    }
 
    uint256 totalPrice = (_quantityToClaim * _pricePerToken) / 1 ether;
    require(totalPrice > 0, "quantity too low");
 
    if (_currency == CurrencyTransferLib.NATIVE_TOKEN) {
        require(msg.value == totalPrice, "Must send total price.");
    }
 
    address saleRecipient = _primarySaleRecipient == address(0) ? primarySaleRecipient() : _primarySaleRecipient;
    CurrencyTransferLib.transferCurrency(_currency, msg.sender, saleRecipient, totalPrice);
}
```
## ERC20Vote

The `ERC20Vote` smart contract implements the [ERC20](https://eips.ethereum.org/EIPS/eip-20) standard. It also supports [EIP-2612](https://eips.ethereum.org/EIPS/eip-2612); allowing approvals to be made via signatures, and the[ERC20Votes](https://github.com/OpenZeppelin/openzeppelin-contracts/blob/master/contracts/token/ERC20/extensions/ERC20Votes.sol) contract; which provides voting and delegation functionality, along with delegation by signature.

```solidity
import "@thirdweb-dev/contracts/base/ERC20Vote.sol";
```

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/base/ERC20Vote.sol) 

### Usage

Import the contract and inherit from it.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/base/ERC20Vote.sol";
 
contract MyToken is ERC20Vote {
	  constructor(
        address _defaultAdmin,
        string memory _name,
        string memory _symbol
    )
        ERC20Vote(
            _defaultAdmin,
            _name,
            _symbol
        )
    {}
}
```

### Detected Extensions

Once deployed, you can use the features made available by these extensions on the SDK and dashboard:

Click on each feature to learn more about what functions are available.

* [ERC20](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20)
* [ERC20Mintable](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20BatchMintable)
* [ERC20BatchMintable](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20BatchMintable)
* [ERC20Permit](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20Permit)
* [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)
* [Ownable](https://portal.thirdweb.com/contracts/build/extensions/general/Ownable)

### Functions to Override

The following functions have been implemented on this contract & are available to be overridden to add custom logic:

##### mintTo

```solidity
/**
 *  @notice          Lets an authorized address mint tokens to a recipient.
 *  @dev             The logic in the `_canMint` function determines whether the caller is authorized to mint tokens.
 *
 *  @param _to       The recipient of the tokens to mint.
 *  @param _amount   Quantity of tokens to mint.
 */
function mintTo(address _to, uint256 _amount) public virtual {
    require(_canMint(), "Not authorized to mint.");
    require(_amount != 0, "Minting zero tokens.");
 
    _mint(_to, _amount);
}
```

##### burn

```solidity
/**
 *  @notice          Lets an owner a given amount of their tokens.
 *  @dev             Caller should own the `_amount` of tokens.
 *
 *  @param _amount   The number of tokens to burn.
 */
function burn(uint256 _amount) external virtual {
    require(balanceOf(_msgSender()) >= _amount, "not enough balance");
    _burn(msg.sender, _amount);
}
```
## AccountFactory

```solidity
import "@thirdweb-dev/contracts/prebuilts/account/non-upgradeable/AccountFactory.sol";
```

This contract inherits from the [BaseAccountFactory](https://portal.thirdweb.com/contracts/build/extensions/erc-4337/SmartWalletFactory) contract.

This factory smart contract is intended to be used to distribute ['Accounts\`](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/account) programmatically.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/prebuilts/account/non-upgradeable/AccountFactory.sol)   

#### Modifications

If you modify the [Account](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/account) contract, it is recommended that you write your own factory contract by inheriting from the [BaseAccountFactory](https://portal.thirdweb.com/contracts/build/extensions/erc-4337/SmartWalletFactory) extension.

### Detected Extensions

Once deployed, you can use the features made available by these extensions on the SDK and dashboard:

Click on each feature to learn more about what functions are available.

* [SmartWalletFactory](https://portal.thirdweb.com/contracts/build/extensions/erc-4337/SmartWalletFactory)

### Usage

Use the [CLI](https://portal.thirdweb.com/cli) [create](https://portal.thirdweb.com/cli/create) command to create a `AccountFactory` smart contract:

```bash
npx thirdweb create contract
```

[Deploy](https://portal.thirdweb.com/contracts/deploy/overview) your contract using the deploy cli command:

```bash
npx thirdweb deploy
```

> **Note: secret key required for this command `-k <YOUR_SECRET_KEY>`**

Or import the contract into your existing project and inherit from it.

```solidity
// SPDX-License-Identifier: GPL-3.0
pragma solidity ^0.8.12;
 
import "@thirdweb-dev/contracts/prebuilts/account/non-upgradeable/AccountFactory.sol";
 
contract MyAccountFactory is AccountFactory {
	  constructor(
	address _defaultAdmin,
        IEntryPoint _entrypoint
    )
        AccountFactory(
	    _defaultAdmin,
            _entrypoint
        )
    {}
}
```

### Full Reference

The following functions have been implemented on this contract & are available to be overridden to add custom logic:

##### \_initializeAccount

Called in `createAccount`. Initializes the account contract created in `createAccount`.

```solidity
function _initializeAccount(
    address _account,
    address _admin,
    bytes calldata _data
) internal override {
    Account(payable(_account)).initialize(_admin, _data);
}
```

##### \_account

The address of the smart account smart contract to initialize.

##### \_admin

The address to be set as default admin role for the contract. Must be of type `address`.

##### \_data

If extra storage variables are required in your account contract, abi encode the variables, pass them to this function as the `bytes` argument.

For example:

```solidity
function initializeAccount(
    address _admin,
    bytes calldata _data
) public override initializer {
    Account.initialize(_admin, _data);
}
```
## Managed Account

```solidity
import "@thirdweb-dev/contracts/smart-wallet/managed/ManagedAccount.sol";
```

This contract inherits from the [BaseAccount](https://portal.thirdweb.com/contracts/build/extensions/erc-4337/SmartWallet) contract.

The `ManagedAccount` is an _upgradeable_ smart account contract written in the [dynamic contract pattern](https://github.com/thirdweb-dev/dynamic-contracts).

App developers can issue `ManagedAccount` smart accounts programmatically by deploying a [ManagedAccountFactory](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/managed-account-factory) smart contract.

The admin of the [ManagedAccountFactory](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/managed-account-factory) contract can push upgrades to all `ManagedAccount` contracts that it creates. This admin does not require any permissions on the `ManagedAccount` smart account to do so.

An upgrade to the features of `ManagedAccount` applies to **all** `ManagedAccount` smart accounts created by the factory. This is the right wallet for developers who anticipate **pushing upgrades** to their users’ wallets.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/prebuilts/account/managed/ManagedAccount.sol)   

#### Issue accounts programatically

If you intend to issue accounts programmatically using a custom factory contract, you must do the following:

* Create a new factory contract by extending the [BaseAccountFactory](https://portal.thirdweb.com/contracts/build/extensions/erc-4337/SmartWallet-factory) extension.
* Override the `_initializeAccount` function on the factory to create a new wallet. ([reference](https://github.com/thirdweb-dev/contracts/blob/main/contracts/smart-wallet/non-upgradeable/AccountFactory.sol#L36))

### Detected Extensions

Once deployed, you can use the features made available by these extensions on the SDK and dashboard:

* [SmartWallet](https://portal.thirdweb.com/contracts/build/extensions/erc-4337/SmartWallet)
* [Multicall](https://portal.thirdweb.com/contracts/build/extensions/general/Multicall)

### Usage

Import the contract and inherit from it. This is an example contract demonstrating one way that you could override the functionality to create a token bound account.

```solidity
import "@thirdweb-dev/contracts/smart-wallet/managed/ManagedAccount.sol";
 
contract ManagedTokenBoundAccount is ManagedAccount {
    constructor(
        IEntryPoint _entrypoint
    )
        ManagedAccount(
            _entrypoint
        )
    {}
}
```

### Functions to Override

The following functions have been implemented on this contract & are available to be overridden to add custom logic:

##### initialize

Initializes the smart contract wallet.

```solidity
function initialize(address _defaultAdmin, bytes calldata _data) public virtual initializer {
    factory = msg.sender;
    _setupRole(DEFAULT_ADMIN_ROLE, _defaultAdmin);
}
```

##### \_defaultAdmin

The account admin. Must be of type `address`.

##### \_data

The abi encoded data to initialize the contract with. Must be of type `bytes`.

##### getImplementationForFunction

Returns the extension implementation address, stored in the router, for the given function.

```solidity
function getImplementationForFunction(bytes4 _functionSelector) public view virtual override returns (address) {
    return Router(payable(factory)).getImplementationForFunction(_functionSelector);
}
```

##### \_functionSelector

The function selector to get the extension implementation address. Must be of type `bytes4`.

##### isValidSigner

Returns whether a signer is authorized to perform transactions using the wallet.

```solidity
function isValidSigner(address _signer) public view virtual returns (bool) {
    return _hasRole(SIGNER_ROLE, _signer) || _hasRole(DEFAULT_ADMIN_ROLE, _signer);
}
```

##### \_signer

The signer to check authorization for. Must be of type `address`.

##### entryPoint

Returns the entry point contract address.

```solidity
function entryPoint() public view virtual override returns (IEntryPoint) {
    return entrypointContract;
}
```

##### \_validatesSignature

Validates the signature of a user operation.

```solidity
function _validateSignature(UserOperation calldata userOp, bytes32 userOpHash)
    internal
    virtual
    override
    returns (uint256 validationData)
{
    bytes32 hash = userOpHash.toEthSignedMessageHash();
    address signer = hash.recover(userOp.signature);
 
    if (!isValidSigner(signer)) return SIG_VALIDATION_FAILED;
    return 0;
}
```
## Account

```solidity
import "@thirdweb-dev/contracts/smart-wallet/non-upgradeable/Account.sol";
```

This contract inherits from the [BaseAccount](https://portal.thirdweb.com/contracts/build/extensions/erc-4337/SmartWallet) contract

The Account smart contract is a **non-upgradable**, simple smart account that comes with all the basic benefits of account abstraction, alongside the default features:

* Have multiple owners
* Execute transactions (single and batched).
* Send and receive native tokens.
* Send and receive ERC-721 and ERC-1155 NFTs.
* Multicall-able.
* Store contract metadata.

Developers should use this wallet if they do not anticipate making any future upgrades to their users’ wallets.

App developers can issue `Account` smart accounts programmatically by deploying an [AccountFactory](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/account-factory) smart contract.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/prebuilts/account/non-upgradeable/Account.sol)   

#### Issue accounts programatically

If you intend to issue accounts programmatically using a custom factory contract, you must do the following:

* Create a new factory contract by extending the [BaseAccountFactory](https://portal.thirdweb.com/contracts/build/extensions/erc-4337/SmartWallet-factory) extension.
* Override the `_initializeAccount` function on the factory to create a new wallet. ([reference](https://github.com/thirdweb-dev/contracts/blob/main/contracts/smart-wallet/non-upgradeable/AccountFactory.sol#L36))

### Detected Extensions

Once deployed, you can use the features made available by these extensions on the SDK and dashboard:

Click on each feature to learn more about what functions are available.

* [SmartWallet](https://portal.thirdweb.com/contracts/build/extensions/erc-4337/SmartWallet)
* [Multicall](https://portal.thirdweb.com/contracts/build/extensions/general/Multicall)

### Usage

Import the contract and inherit from it. This is an example contract demonstrating one way that you could override the functionality to create a token bound account.

```solidity
import "@thirdweb-dev/contracts/smart-wallet/non-upgradable/Account.sol";
import "@thirdweb-dev/contracts/eip/interface/IERC721.sol";
 
contract TokenBoundAccount is Account {
    uint256 chainId;
    address tokenContract;
    uint256 tokenId;
 
    constructor(
        IEntryPoint _entrypoint,
        address _factory
    ) Account(_entrypoint, _factory) {
        _disableInitializers();
    }
 
    function isValidSigner(
        address _signer
    ) public view override returns (bool) {
        return (isOwner(_signer));
    }
 
    function isOwner(address _signer) public view returns (bool) {
        if (chainId != block.chainid) {
            revert("Invalid chainId");
        }
        return _signer == IERC721(tokenContract).ownerOf(tokenId);
    }
 
    function initialize(
        address _admin,
        bytes calldata _data
    ) public override initializer {
        super.initialize(_admin);
        (chainId, tokenContract, tokenId) = abi.decode(
            _data,
            (uint256, address, uint256)
        );
    }
}
```

### Functions to Override

The following functions have been implemented on this contract & are available to be overridden to add custom logic:

##### initialize

Initializes the smart contract wallet.

```solidity
function initialize(address _defaultAdmin, bytes calldata _data) public virtual initializer {
    _setupRole(DEFAULT_ADMIN_ROLE, _defaultAdmin);
}
```

##### \_defaultAdmin

The account admin. Must be of type `address`.

##### \_data

The abi encoded data to initialize the contract with. Must be of type `bytes`.

##### getImplementationForFunction

Returns the extension implementation address, stored in router, for the given function.

```solidity
function getImplementationForFunction(bytes4 _functionSelector) public view virtual override returns (address) {
    address impl = getExtensionForFunction(_functionSelector).implementation;
    return impl != address(0) ? impl : defaultExtension;
}
```

##### \_functionSelector

The function selector to get the extension implementation address. Must be of type `bytes4`.

##### isValidSigner

Returns whether a signer is authorized to perform transactions using the wallet.

```solidity
function isValidSigner(address _signer) public view virtual returns (bool) {
    return _hasRole(SIGNER_ROLE, _signer) || _hasRole(DEFAULT_ADMIN_ROLE, _signer);
}
```

##### \_signer

The signer to check authorization for. Must be of type `address`.

##### entryPoint

Returns the entry point contract address.

```solidity
function entryPoint() public view virtual override returns (IEntryPoint) {
    return entrypointContract;
}
```

##### \_canSetExtension

Returns whether an extension can be set in the given execution context.

```solidity
function _canSetExtension() internal view virtual override returns (bool) {
    return _hasRole(EXTENSION_ADMIN_ROLE, msg.sender);
}
```

##### \_validatesSignature

Validates the signature of a user operation.

```solidity
function _validateSignature(UserOperation calldata userOp, bytes32 userOpHash)
    internal
    virtual
    override
    returns (uint256 validationData)
{
    bytes32 hash = userOpHash.toEthSignedMessageHash();
    address signer = hash.recover(userOp.signature);
 
    if (!isValidSigner(signer)) return SIG_VALIDATION_FAILED;
    return 0;
}
```
## Managed Account Factory

```solidity
import "@thirdweb-dev/contracts/smart-wallet/managed/ManagedAccountFactory.sol";
```

This contract inherits from the [BaseAccountFactory](https://portal.thirdweb.com/contracts/build/extensions/erc-4337/SmartWallet-factory) contract.

This factory smart contract is intended to be used to distribute ['ManagedAccounts\`](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/managed-account) programmatically.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/prebuilts/account/managed/ManagedAccountFactory.sol)   

#### Modified Contract

If you modify the [ManagedAccount](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/managed-account) contract, it is recommended that you write your own factory contract by inheriting from the [BaseAccountFactory](https://portal.thirdweb.com/contracts/build/extensions/erc-4337/SmartWallet-factory) extension.

### Detected Extensions

Once deployed, you can use the features made available by these extensions on the SDK and dashboard:

* [SmartWalletFactory](https://portal.thirdweb.com/contracts/build/extensions/erc-4337/SmartWallet-factory)

### Usage

Use the [CLI](https://portal.thirdweb.com/cli) [create](https://portal.thirdweb.com/cli/create) command to create a `ManagedAccountFactory` smart contract:

```bash
npx thirdweb create contract
```

[Deploy](https://portal.thirdweb.com/contracts/deploy/overview) your contract using the deploy cli command:

```bash
npx thirdweb create
```

Or import the contract into your existing project and inherit from it.

```solidity
import "@thirdweb-dev/contracts/smart-wallet/managed/ManagedAccountFactory.sol";
 
contract MyManagedAccountFactory is ManagedAccountFactory {
	  constructor(
        IEntryPoint _entrypoint
    )
        ManagedAccountFactory(
            _entrypoint
        )
    {}
}
```

### Functions to Override

The following functions have been implemented on this contract & are available to be overridden to add custom logic:

##### \_initializeAccount

Called in `createAccount`. Initializes the account contract created in `createAccount`.

```solidity
function _initializeAccount(
    address _account,
    address _admin,
    bytes calldata _data
) internal override {
    ManagedAccount(payable(_account)).initialize(_admin, _data);
}
```

##### \_account

The address of the smart account smart contract to initialize.

##### \_admin

The address to be set as default admin role for the contract. Must be of type `address`.

##### \_data

If extra storage variables are required in your account contract, abi encode the variables, pass them to this function as the `bytes` argument.

For example:

```solidity
function initializeAccount(
    address _admin,
    bytes calldata _data
) public override initializer {
    ManagedAccount.initialize(_admin, _data);
}
```

##### \_canSetExtension

Returns whether an extension can be set in the given execution context.

```solidity
function _canSetExtension() internal view virtual override returns (bool) {
    return hasRole(DEFAULT_ADMIN_ROLE, msg.sender);
}
```
## ERC-4337 Smart Accounts

All of thirdweb's [smart accounts](https://portal.thirdweb.com/connect/account-abstraction) are [EIP-4337](https://eips.ethereum.org/EIPS/eip-4337) smart contract accounts with role-based permission control.

Users can deploy a smart accounts for individual use, and app developers can issue smart accounts to their users programmatically.

thirdweb's smart accounts have the following features by default:

* Have multiple owners
* Execute transactions (single and batched).
* Send and receive native tokens.
* Send and receive ERC-721 and ERC-1155 NFTs.
* Multicall-able.
* Store contract metadata.

thirdweb offers the following three different kinds of account factories:

| [Simple](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/account) | [Managed](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/managed-account)                                           |                                                                                                                                                                                                |
| ------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Upgradeability**                                                                    | Non-upgradeable                                                                                                                          | Account upgrades controlled centrally by the parent account factory admin.                                                                                                                     |
| **User persona**                                                                      | Developer wants to issue simple smart accounts to their users. They do not anticipate that users wallets will need any feature upgrades. | Developer wants to issue smart accounts to their users. They do anticipate feature upgrades to user wallets, and want to push upgrades to user wallets for seamless/invisible UX for upgrades. |

### Simple smart accounts

**[Account.sol](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/account) & [AccountFactory.sol](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/account-factory)**

The `Account` contract is a simple smart account that comes with all the basic benefits of account abstraction, along with the mentioned default features.

App developers can issue [Account](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/account) smart accounts programmatically by deploying an [AccountFactory](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/account-factory) smart contract.

The `Account` smart contract is _non-upgradeable_. Developers should use this wallet if they do not anticipate making any future upgrades to their users’ wallets.

### Managed smart accounts

**[ManagedAccount.sol](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/managed-account) & [ManagedAccountFactory.sol](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/managed-account-factory)**

The `ManagedAccount` smart account is an _upgradeable_ smart contract written in the [dynamic contract pattern](https://github.com/thirdweb-dev/dynamic-contracts).

App developers can issue `ManagedAccount` smart accounts programmatically by deploying a [ManagedAccountFactory](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/managed-account-factory) smart contract.

The admin of the [ManagedAccountFactory](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/managed-account-factory) contract can push upgrades to all `ManagedAccount` that it creates. This admin does not require any permissions on the `ManagedAccount` smart accounts to do so. An upgrade to the features of `ManagedAccount` applies to _all_ `ManagedAccount` smart accounts created by the factory. This is the right wallet for developers who anticipate _pushing upgrades_ to their users’ wallets.

##### Example use case of push upgrades:

An app wants its user wallets to only be able to own NFTs within its ecosystem. This would be an upgrade to the smart account's `onERC721Received` and `onERC1155Received` transfer hooks.

The app can enforce this behaviour by pushing this upgrade to its user wallets.
## ERC721Base

The `ERC721Base` smart contract implements the [ERC721](https://eips.ethereum.org/EIPS/eip-721) NFT standard, along with the [ERC721A](https://www.erc721a.org/) optimization to the standard. It allows you to mint NFTs to yourself (or to someone else) and selling those NFTs on a marketplace.

```solidity
import "@thirdweb-dev/contracts/base/ERC721Base.sol";
```

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/base/ERC721Base.sol) 

### Usage

Import the contract and inherit from it.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/base/ERC721Base.sol";
 
contract MyNFT is ERC721Base {
 
	  constructor(
        address _defaultAdmin,
        string memory _name,
        string memory _symbol,
        address _royaltyRecipient,
        uint128 _royaltyBps
    )
        ERC721Base(
            _defaultAdmin,
            _name,
            _symbol,
            _royaltyRecipient,
            _royaltyBps
        )
    {}
 
}
```

### Detected Extensions

Once deployed, you can use the features made available by these extensions on the SDK and dashboard:

Click on each feature to learn more about what functions are available.

* [ERC721](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721)
* [ERC721Mintable](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Mintable)
* [ERC721Burnable](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Burnable)
* [ERC721BatchMintable](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721BatchMintable)
* [ERC721Supply](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Supply)
* [Royalty](https://portal.thirdweb.com/contracts/build/extensions/general/Royalty)
* [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)
* [Ownable](https://portal.thirdweb.com/contracts/build/extensions/general/Ownable)

### Functions to Override

The following functions have been implemented on this contract & are available to be overridden to add custom logic:

##### tokenURI

```solidity
/**
     *  @notice         Returns the metadata URI for an NFT.
     *  @dev            See `BatchMintMetadata` for handling of metadata in this contract.
     *
     *  @param _tokenId The tokenId of an NFT.
     */
    function tokenURI(uint256 _tokenId) public view virtual override returns (string memory) {
        string memory fullUriForToken = fullURI[_tokenId];
        if (bytes(fullUriForToken).length > 0) {
            return fullUriForToken;
        }
 
        string memory batchUri = _getBaseURI(_tokenId);
        return string(abi.encodePacked(batchUri, _tokenId.toString()));
    }
```

##### mintTo

```solidity
/**
     *  @notice          Lets an authorized address mint an NFT to a recipient.
     *  @dev             The logic in the `_canMint` function determines whether the caller is authorized to mint NFTs.
     *
     *  @param _to       The recipient of the NFT to mint.
     *  @param _tokenURI The full metadata URI for the NFT minted.
     */
    function mintTo(address _to, string memory _tokenURI) public virtual {
        require(_canMint(), "Not authorized to mint.");
        _setTokenURI(nextTokenIdToMint(), _tokenURI);
        _safeMint(_to, 1, "");
    }
```

##### batchMintTo

```solidity
/**
     *  @notice          Lets an authorized address mint multiple NFTs at once to a recipient.
     *  @dev             The logic in the `_canMint` function determines whether the caller is authorized to mint NFTs.
     *
     *  @param _to       The recipient of the NFT to mint.
     *  @param _quantity The number of NFTs to mint.
     *  @param _baseURI  The baseURI for the `n` number of NFTs minted. The metadata for each NFT is `baseURI/tokenId`
     *  @param _data     Additional data to pass along during the minting of the NFT.
     */
    function batchMintTo(
        address _to,
        uint256 _quantity,
        string memory _baseURI,
        bytes memory _data
    ) public virtual {
        require(_canMint(), "Not authorized to mint.");
        _batchMintMetadata(nextTokenIdToMint(), _quantity, _baseURI);
        _safeMint(_to, _quantity, _data);
    }
```

##### burn

```solidity
/**
     *  @notice         Lets an owner or approved operator burn the NFT of the given tokenId.
     *  @dev            ERC721A's `_burn(uint256,bool)` internally checks for token approvals.
     *
     *  @param _tokenId The tokenId of the NFT to burn.
     */
    function burn(uint256 _tokenId) external virtual {
        _burn(_tokenId, true);
    }
 
    /*//////////////////////////////////////////////////////////////
                        Public getters
    //////////////////////////////////////////////////////////////*/
 
    /// @notice The tokenId assigned to the next new NFT to be minted.
    function nextTokenIdToMint() public view virtual returns (uint256) {
        return _currentIndex;
    }
```

##### transferFrom

```solidity
/// @dev See {ERC721-_transferFrom}.
    function transferFrom(
        address from,
        address to,
        uint256 tokenId
    ) public virtual override(ERC721A) onlyAllowedOperator(from) {
        super.transferFrom(from, to, tokenId);
    }
```

##### safeTransferFrom

```solidity
/// @dev See {ERC721-_safeTransferFrom}.
    function safeTransferFrom(
        address from,
        address to,
        uint256 tokenId
    ) public virtual override(ERC721A) onlyAllowedOperator(from) {
        super.safeTransferFrom(from, to, tokenId);
    }
```
## ERC721DelayedReveal

`ERC721DelayedReveal` adds the [Delayed Reveal](https://portal.thirdweb.com/contracts/build/extensions/general/DelayedReveal) feature to the [ERC721LazyMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/lazy-mint) base contract.

```solidity
import "@thirdweb-dev/contracts/base/ERC721DelayedReveal.sol";
```

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/base/ERC721DelayedReveal.sol) 

### Usage

Import the contract and inherit from it.

```solidity
// SPDX-License-Identifier: Apache-2.0
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/base/ERC721DelayedReveal.sol";
 
contract MyNFT is ERC721DelayedReveal {
    constructor(
        address _defaultAdmin,
        string memory _name,
        string memory _symbol,
        address _royaltyRecipient,
        uint128 _royaltyBps
    ) ERC721DelayedReveal(_defaultAdmin, _name, _symbol, _royaltyRecipient, _royaltyBps) {}
 
    function verifyClaim(address _claimer, uint256 _quantity) public view virtual override {
      // Your custom claim restriction logic
    }
}
```

### Detected Extensions

Once deployed, you can use the features made available by these extensions on the SDK and dashboard:

Click on each feature to learn more about what functions are available.

* [ERC721](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721)
* [ERC721Burnable](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Burnable)
* [ERC721Revealable](https://portal.thirdweb.com/contracts/build/extensions/general/DelayedReveal)
* [ERC721Supply](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Supply)
* [ERC721ClaimCustom](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721ClaimCustom)
* [Royalty](https://portal.thirdweb.com/contracts/build/extensions/general/Royalty)
* [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)
* [Ownable](https://portal.thirdweb.com/contracts/build/extensions/general/Ownable)

### Functions to Override

The following functions have been implemented on this contract & are available to be overridden to add custom logic:

##### tokenURI

```solidity
/**
 *  @notice         Returns the metadata URI for an NFT.
 *  @dev            See `BatchMintMetadata` for handling of metadata in this contract.
 *
 *  @param _tokenId The tokenId of an NFT.
 */
function tokenURI(uint256 _tokenId) public view override returns (string memory) {
    (uint256 batchId, ) = _getBatchId(_tokenId);
    string memory batchUri = _getBaseURI(_tokenId);
 
    if (isEncryptedBatch(batchId)) {
        return string(abi.encodePacked(batchUri, "0"));
    } else {
        return string(abi.encodePacked(batchUri, _tokenId.toString()));
    }
}
```

##### lazyMint

```solidity
/**
 *  @notice                  Lets an authorized address lazy mint a given amount of NFTs.
 *
 *  @param _amount           The number of NFTs to lazy mint.
 *  @param _baseURIForTokens The placeholder base URI for the 'n' number of NFTs being lazy minted, where the
 *                           metadata for each of those NFTs is `${baseURIForTokens}/${tokenId}`.
 *  @param _data             The encrypted base URI + provenance hash for the batch of NFTs being lazy minted.
 *  @return batchId          A unique integer identifier for the batch of NFTs lazy minted together.
 */
function lazyMint(
    uint256 _amount,
    string calldata _baseURIForTokens,
    bytes calldata _data
) public override returns (uint256 batchId) {
    if (_data.length > 0) {
        (bytes memory encryptedURI, bytes32 provenanceHash) = abi.decode(_data, (bytes, bytes32));
        if (encryptedURI.length != 0 && provenanceHash != "") {
            _setEncryptedData(nextTokenIdToLazyMint + _amount, _data);
        }
    }
 
    return super.lazyMint(_amount, _baseURIForTokens, _data);
}
```

##### reveal

```solidity
/**
 *  @notice       Lets an authorized address reveal a batch of delayed reveal NFTs.
 *
 *  @param _index The ID for the batch of delayed-reveal NFTs to reveal.
 *  @param _key   The key with which the base URI for the relevant batch of NFTs was encrypted.
 */
function reveal(uint256 _index, bytes calldata _key) external virtual override returns (string memory revealedURI) {
    require(_canReveal(), "Not authorized");
 
    uint256 batchId = getBatchIdAtIndex(_index);
    revealedURI = getRevealURI(batchId, _key);
 
    _setEncryptedData(batchId, "");
    _setBaseURI(batchId, revealedURI);
 
    emit TokenURIRevealed(_index, revealedURI);
}
```
## ERC721Drop

```solidity
import "@thirdweb-dev/contracts/base/ERC721Drop.sol";
```

The `ERC721Drop` base contract allows you to create an NFT Drop that other wallets can claim.

It implements the [ERC721A standard](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721) with the [Lazy Mint](https://portal.thirdweb.com/contracts/build/extensions/general/LazyMint),[Delayed Reveal](https://portal.thirdweb.com/contracts/build/extensions/general/DelayedReveal) and [Drop](https://portal.thirdweb.com/contracts/build/extensions/general/DropSinglePhase) extensions; allowing you to batch lazy-mint NFTs and allow other wallets to claim them under the criteria of claim conditions, with an optional delayed reveal.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/base/ERC721Drop.sol) 

### Usage

Import the contract and inherit from it.

```solidity
// SPDX-License-Identifier: Apache-2.0
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/base/ERC721Drop.sol";
 
contract MyNFT is ERC721Drop {
    constructor(
        address _defaultAdmin,
        string memory _name,
        string memory _symbol,
        address _royaltyRecipient,
        uint128 _royaltyBps,
        address _primarySaleRecipient
    )
        ERC721Drop(
            _defaultAdmin,
            _name,
            _symbol,
            _royaltyRecipient,
            _royaltyBps,
            _primarySaleRecipient
        )
    {}
}
```

### Detected Extensions

Once deployed, you can use the features made available by these extensions on the SDK and dashboard:

Click on each feature to learn more about what functions are available.

* [ERC721](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721)
* [ERC721Burnable](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Burnable)
* [ERC721ClaimConditionsV2](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721ClaimConditions)
* [ERC721Revealable](https://portal.thirdweb.com/contracts/build/extensions/general/DelayedReveal)
* [ERC721Supply](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Supply)
* [Royalty](https://portal.thirdweb.com/contracts/build/extensions/general/Royalty)
* [PrimarySale](https://portal.thirdweb.com/contracts/build/extensions/general/PrimarySale)
* [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)
* [Ownable](https://portal.thirdweb.com/contracts/build/extensions/general/Ownable)

### Functions to Override

The following functions have been implemented on this contract & are available to be overridden to add custom logic:

##### tokenURI

```solidity
/**
*  @notice         Returns the metadata URI for an NFT.
*  @dev            See `BatchMintMetadata` for handling of metadata in this contract.
*
*  @param _tokenId The tokenId of an NFT.
*/
function tokenURI(uint256 _tokenId) public view virtual override returns (string memory) {
    (uint256 batchId, ) = _getBatchId(_tokenId);
    string memory batchUri = _getBaseURI(_tokenId);
 
    if (isEncryptedBatch(batchId)) {
        return string(abi.encodePacked(batchUri, "0"));
    } else {
        return string(abi.encodePacked(batchUri, _tokenId.toString()));
    }
}
```

##### lazyMint

```solidity
/**
*  @notice                  Lets an authorized address lazy mint a given amount of NFTs.
*
*  @param _amount           The number of NFTs to lazy mint.
*  @param _baseURIForTokens The placeholder base URI for the 'n' number of NFTs being lazy minted, where the
*                           metadata for each of those NFTs is `${baseURIForTokens}/${tokenId}`.
*  @param _data             The encrypted base URI + provenance hash for the batch of NFTs being lazy minted.
*  @return batchId          A unique integer identifier for the batch of NFTs lazy minted together.
*/
function lazyMint(
    uint256 _amount,
    string calldata _baseURIForTokens,
    bytes calldata _data
) public override returns (uint256 batchId) {
    if (_data.length > 0) {
        (bytes memory encryptedURI, bytes32 provenanceHash) = abi.decode(_data, (bytes, bytes32));
        if (encryptedURI.length != 0 && provenanceHash != "") {
            _setEncryptedData(nextTokenIdToLazyMint + _amount, _data);
        }
    }
 
    return LazyMint.lazyMint(_amount, _baseURIForTokens, _data);
}
```

##### reveal

```solidity
/**
*  @notice       Lets an authorized address reveal a batch of delayed reveal NFTs.
*
*  @param _index The ID for the batch of delayed-reveal NFTs to reveal.
*  @param _key   The key with which the base URI for the relevant batch of NFTs was encrypted.
*/
function reveal(uint256 _index, bytes calldata _key) public virtual override returns (string memory revealedURI) {
    require(_canReveal(), "Not authorized");
 
    uint256 batchId = getBatchIdAtIndex(_index);
    revealedURI = getRevealURI(batchId, _key);
 
    _setEncryptedData(batchId, "");
    _setBaseURI(batchId, revealedURI);
 
    emit TokenURIRevealed(_index, revealedURI);
}
```

##### burn

```solidity
/**
*  @notice         Lets an owner or approved operator burn the NFT of the given tokenId.
*  @dev            ERC721A's `_burn(uint256,bool)` internally checks for token approvals.
*
*  @param _tokenId The tokenId of the NFT to burn.
*/
function burn(uint256 _tokenId) external virtual {
    _burn(_tokenId, true);
}
```

##### beforeClaim

```solidity
/// @dev Runs before every `claim` function call.
function _beforeClaim(
    address,
    uint256 _quantity,
    address,
    uint256,
    AllowlistProof calldata,
    bytes memory
) internal view virtual override {
    if (_currentIndex + _quantity > nextTokenIdToLazyMint) {
        revert("Not enough minted tokens");
    }
}
```

##### \_collectPriceOnClaim

```solidity
/// @dev Collects and distributes the primary sale value of NFTs being claimed.
function _collectPriceOnClaim(
    address _primarySaleRecipient,
    uint256 _quantityToClaim,
    address _currency,
    uint256 _pricePerToken
) internal virtual override {
    if (_pricePerToken == 0) {
        return;
    }
 
    uint256 totalPrice = _quantityToClaim * _pricePerToken;
 
    if (_currency == CurrencyTransferLib.NATIVE_TOKEN) {
        if (msg.value != totalPrice) {
            revert("Must send total price");
        }
    }
 
    address saleRecipient = _primarySaleRecipient == address(0) ? primarySaleRecipient() : _primarySaleRecipient;
    CurrencyTransferLib.transferCurrency(_currency, msg.sender, saleRecipient, totalPrice);
}
```

##### \_transferTokensOnClaim

```solidity
/// @dev Transfers the NFTs being claimed.
function _transferTokensOnClaim(address _to, uint256 _quantityBeingClaimed)
    internal
    virtual
    override
    returns (uint256 startTokenId)
{
    startTokenId = _currentIndex;
    _safeMint(_to, _quantityBeingClaimed);
}
```
## Base Contracts

#### ERC721

| Name                                                                                                     | Description                                                                                                                                                                                                                                                                                                                                                                                                          |
| -------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [ERC721Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/base)                    | Implementation of the [ERC721A](https://www.erc721a.org/) standard with the capability to mint NFTs.                                                                                                                                                                                                                                                                                                                 |
| [ERC721SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/signature-mint) | Adds [signature-based minting](https://portal.thirdweb.com/glossary/signature-based-minting) capability to the [ERC721Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/base) contract.                                                                                                                                                                                                       |
| [ERC721LazyMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/lazy-mint)           | Adds [lazy minting](https://portal.thirdweb.com/contracts/build/extensions/general/LazyMint) capability to the [ERC721Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/base). Batch lazy-mint NFT metadata and have other wallets claim them under conditions you define in a verifyClaim function.                                                                                          |
| [ERC721DelayedReveal](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/delayed-reveal) | Adds [delayed reveal](https://portal.thirdweb.com/contracts/build/extensions/general/DelayedReveal) to the [ERC721LazyMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/lazy-mint) contract.                                                                                                                                                                                                  |
| [ERC721Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/drop)                    | Adds [delayed reveal](https://portal.thirdweb.com/contracts/build/extensions/general/DelayedReveal) and [claim conditions](https://portal.thirdweb.com/contracts/build/extensions/general/DropSinglePhase) to the [ERC721LazyMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/lazy-mint) contract. Batch lazy-mint NFTs, and set up claim conditions to define how your NFTs can be claimed. |

#### ERC1155

| Name                                                                                                       | Description                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                 |
| ---------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [ERC1155Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/base)                    | Implementation of the [ERC1155](https://eips.ethereum.org/EIPS/eip-1155) standard with the capability to mint and burn NFTs.                                                                                                                                                                                                                                                                                                                                                                                |
| [ERC1155SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/signature-mint) | Adds [signature-based minting](https://portal.thirdweb.com/glossary/signature-based-minting) capability to the [ERC1155Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/base) contract.                                                                                                                                                                                                                                                                                            |
| [ERC1155LazyMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/lazy-mint)           | Adds [lazy minting](https://portal.thirdweb.com/contracts/build/extensions/general/LazyMint) capability to the [ERC1155Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/base) contract. Batch lazy-mint NFT metadata and have other wallets claim them under conditions you define in a verifyClaim function.                                                                                                                                                                      |
| [ERC1155DelayedReveal](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/delayed-reveal) | Adds [delayed reveal](https://portal.thirdweb.com/contracts/build/extensions/general/DelayedReveal) to the [ERC1155Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/base) contract.                                                                                                                                                                                                                                                                                                |
| [ERC1155Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/drop)                    | Adds [delayed reveal](https://portal.thirdweb.com/contracts/build/extensions/general/DelayedReveal) and [claim conditions](https://portal.thirdweb.com/contracts/build/extensions/general/DropSinglePhase1155) to the [ERC1155Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/base) contract. Batch lazy-mint NFTs, and set up [claim conditions](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155DropSinglePhase) to define how your NFTs can be claimed. |

#### ERC20

| Name                                                                                                            | Description                                                                                                                                                                                                                                                                                              |
| --------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [ERC20Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/base)                             | Implementation of the [ERC20](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20) standard with support for the [EIP-2612](https://eips.ethereum.org/EIPS/eip-2612) standard.                                                                                                           |
| [ERC20Vote](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/vote)                             | Add [vote](https://github.com/thirdweb-dev/contracts/blob/main/contracts/openzeppelin-presets/token/ERC20/extensions/ERC20Votes.sol) capability to the [ERC20Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/base) contract.                                                     |
| [ERC20SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/signature-mint)          | Adds [signature-based minting](https://portal.thirdweb.com/glossary/signature-based-minting) capability to the [ERC20Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/base) contract.                                                                                             |
| [ERC20SignatureMintVote](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/signature-mint-vote) | Adds [vote](https://github.com/thirdweb-dev/contracts/blob/main/contracts/openzeppelin-presets/token/ERC20/extensions/ERC20Votes.sol) capability to the [ERC20SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/signature-mint) contract.                                 |
| [ERC20Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/drop)                             | Adds [claim conditions](https://portal.thirdweb.com/contracts/build/extensions/general/DropSinglePhase) capability to the [ERC20Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/base) contract. Distribute your token for a price under the criteria set up in claim conditions. |
| [ERC20DropVote](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/drop-vote)                    | Adds [vote](https://github.com/thirdweb-dev/contracts/blob/main/contracts/openzeppelin-presets/token/ERC20/extensions/ERC20Votes.sol) capability to the [ERC20Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/drop) contract.                                                    |

#### ERC4337

| Name                                                                                                                 | Description                                                                                                                                                                               |
| -------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [Account](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/account)                               | The Account s a non-upgradable, simple smart account that comes with all the basic benefits of account abstraction                                                                        |
| [AccountFactory](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/account-factory)                | This factory smart contract is intended to be used to distribute [Accounts](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/account) programmatically.                |
| [ManagedAccount](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/mananged-account)               | The ManagedAccount is an upgradeable smart contract account written in the [dynamic contract pattern](https://github.com/thirdweb-dev/dynamic-contracts).                                 |
| [ManagedAccountFactory](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/managed-account-factory) | This factory smart contract is intended to be used to distribute [ManagedAccounts](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/managed-account) programmatically. |
## ERC721LazyMint

```solidity
import "@thirdweb-dev/contracts/base/ERC721LazyMint.sol";
```

`ERC721LazyMint` allows you to lazy-mint ERC-721 tokens, which allows any wallet to claim a lazy-minted NFT. It exposes a `verifyClaim` function that you can override to add your claim-restriction logic.

Lazy minting allows you to define the metadata of NFTs without minting it to an address. As a contract admin, this lets you prepare the metadata for NFTs that will be minted by other wallets, without paying the gas cost for actually minting the NFTs.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/base/ERC721LazyMint.sol) 

### Usage

Import the contract and inherit from it.

```solidity
// SPDX-License-Identifier: Apache-2.0
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/base/ERC721LazyMint.sol";
 
contract MyNFT is ERC721LazyMint {
    constructor(
        address _defaultAdmin,
        string memory _name,
        string memory _symbol,
        address _royaltyRecipient,
        uint128 _royaltyBps
    ) ERC721LazyMint(_defaultAdmin, _name, _symbol, _royaltyRecipient, _royaltyBps) {}
 
    function verifyClaim(address _claimer, uint256 _quantity) public view virtual override {
      // Your custom claim restriction logic
    }
}
```

### Detected Extensions

Once deployed, you can use the features made available by these extensions on the SDK and dashboard:

Click on each feature to learn more about what functions are available.

* [ERC721](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721)
* [ERC721Burnable](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Burnable)
* [ERC721ClaimCustom](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721ClaimCustom)
* [ERC721Supply](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Supply)
* [Royalty](https://portal.thirdweb.com/contracts/build/extensions/general/Royalty)
* [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)
* [Ownable](https://portal.thirdweb.com/contracts/build/extensions/general/Ownable)

### Functions to Override

The following functions have been implemented on this contract & are available to be overridden to add custom logic:

##### tokenURI

```solidity
/**
*  @notice         Returns the metadata URI for an NFT.
*  @dev            See `BatchMintMetadata` for handling of metadata in this contract.
*
*  @param _tokenId The tokenId of an NFT.
*/
function tokenURI(uint256 _tokenId) public view virtual override returns (string memory) {
    string memory batchUri = _getBaseURI(_tokenId);
    return string(abi.encodePacked(batchUri, _tokenId.toString()));
}
```

##### claim

```solidity
/**
*  @notice          Lets an address claim multiple lazy minted NFTs at once to a recipient.
*                   This function prevents any reentrant calls, and is not allowed to be overridden.
*
*                   Contract creators should override `verifyClaim` and `transferTokensOnClaim`
*                   functions to create custom logic for verification and claiming,
*                   for e.g. price collection, allowlist, max quantity, etc.
*
*  @dev             The logic in `verifyClaim` determines whether the caller is authorized to mint NFTs.
*                   The logic in `transferTokensOnClaim` does actual minting of tokens,
*                   can also be used to apply other state changes.
*
*  @param _receiver  The recipient of the NFT to mint.
*  @param _quantity  The number of NFTs to mint.
*/
function claim(address _receiver, uint256 _quantity) public payable nonReentrant {
    require(_currentIndex + _quantity <= nextTokenIdToLazyMint, "Not enough lazy minted tokens.");
    verifyClaim(msg.sender, _quantity); // Add your claim verification logic by overriding this function.
 
    uint256 startTokenId = _transferTokensOnClaim(_receiver, _quantity); // Mints tokens. Apply any state updates by overriding this function.
    emit TokensClaimed(msg.sender, _receiver, startTokenId, _quantity);
}
```

##### verifyClaim

```solidity
/**
     *  @notice          Override this function to add logic for claim verification, based on conditions
     *                   such as allowlist, price, max quantity etc.
     *
     *  @dev             Checks a request to claim NFTs against a custom condition.
     *
     *  @param _claimer   Caller of the claim function.
     *  @param _quantity  The number of NFTs being claimed.
     */
    function verifyClaim(address _claimer, uint256 _quantity) public view virtual {}
```

##### burn

```solidity
/**
*  @notice         Lets an owner or approved operator burn the NFT of the given tokenId.
*  @dev            ERC721A's `_burn(uint256,bool)` internally checks for token approvals.
*
*  @param _tokenId The tokenId of the NFT to burn.
*/
function burn(uint256 _tokenId) external virtual {
    _burn(_tokenId, true);
}
```

##### \_transferTokensOnClaim

```solidity
/**
*  @notice          Mints tokens to receiver on claim.
*                   Any state changes related to `claim` must be applied
*                   here by overriding this function.
*
*  @dev             Override this function to add logic for state updation.
*                   When overriding, apply any state changes before `_safeMint`.
*/
function _transferTokensOnClaim(address _receiver, uint256 _quantity)
    internal
    virtual
    returns (uint256 startTokenId)
{
    startTokenId = _currentIndex;
    _safeMint(_receiver, _quantity);
}
```
## ERC721SignatureMint

```solidity
import "@thirdweb-dev/contracts/base/ERC721SignatureMint.sol";
```

The `ERC721SignatureMint` smart contract uses the[ERC721Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/base)base contract along with the [SignatureMintERC721](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721SignatureMint) contract extension.

[Signature minting](https://portal.thirdweb.com/glossary/signature-based-minting) uses the [EIP-712](https://eips.ethereum.org/EIPS/eip-712) standard, enables a contract admin to authorize an external party's request to mint tokens on the admin's contract. At a high level, this means you can authorize another wallet to mint tokens on your contract, and specify what exactly will be minted by that external party.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/base/ERC721SignatureMint.sol) 

### Usage

Import the contract extension and make your contract inherit it.

```solidity
// SPDX-License-Identifier: Apache-2.0
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/base/ERC721SignatureMint.sol";
 
contract MyNFT is ERC721SignatureMint {
    constructor(
        address _defaultAdmin,
        string memory _name,
        string memory _symbol,
        address _royaltyRecipient,
        uint128 _royaltyBps,
        address _primarySaleRecipient
    )
        ERC721SignatureMint(
            _defaultAdmin,
            _name,
            _symbol,
            _royaltyRecipient,
            _royaltyBps,
            _primarySaleRecipient
        )
    {}
}
```

### Detected Extensions

Once deployed, you can use the features made available by these extensions on the SDK and dashboard:

Click on each feature to learn more about what functions are available.

* [ERC721](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721)
* [ERC721Burnable](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Burnable)
* [ERC721Mintable](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Mintable)
* [ERC721BatchMintable](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721BatchMintable)
* [ERC721Supply](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Supply)
* [ERC721SignatureMintV2](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721SignatureMint)
* [PrimarySale](https://portal.thirdweb.com/contracts/build/extensions/general/PrimarySale)
* [Royalty](https://portal.thirdweb.com/contracts/build/extensions/general/Royalty)
* [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)
* [Ownable](https://portal.thirdweb.com/contracts/build/extensions/general/Ownable)

### Functions to Override

The following functions have been implemented on this contract & are available to be overridden to add custom logic:

##### mintWithSignature

```solidity
/**
*  @notice           Mints tokens according to the provided mint request.
*
*  @param _req       The payload / mint request.
*  @param _signature The signature produced by an account signing the mint request.
*/
function mintWithSignature(MintRequest calldata _req, bytes calldata _signature)
    external
    payable
    virtual
    override
    returns (address signer)
{
    require(_req.quantity == 1, "quantity must be 1");
 
    uint256 tokenIdToMint = nextTokenIdToMint();
 
    // Verify and process payload.
    signer = _processRequest(_req, _signature);
 
    address receiver = _req.to;
 
    // Collect price
    _collectPriceOnClaim(_req.primarySaleRecipient, _req.quantity, _req.currency, _req.pricePerToken);
 
    // Set royalties, if applicable.
    if (_req.royaltyRecipient != address(0) && _req.royaltyBps != 0) {
        _setupRoyaltyInfoForToken(tokenIdToMint, _req.royaltyRecipient, _req.royaltyBps);
    }
 
    // Mint tokens.
    _setTokenURI(tokenIdToMint, _req.uri);
    _safeMint(receiver, _req.quantity);
 
    emit TokensMintedWithSignature(signer, receiver, tokenIdToMint, _req);
}
```

##### \_collectPriceOnClaim

```solidity
/// @dev Collects and distributes the primary sale value of NFTs being claimed.
function _collectPriceOnClaim(
    address _primarySaleRecipient,
    uint256 _quantityToClaim,
    address _currency,
    uint256 _pricePerToken
) internal virtual {
    if (_pricePerToken == 0) {
        return;
    }
 
    uint256 totalPrice = _quantityToClaim * _pricePerToken;
 
    if (_currency == CurrencyTransferLib.NATIVE_TOKEN) {
        require(msg.value == totalPrice, "Must send total price.");
    }
 
    address saleRecipient = _primarySaleRecipient == address(0) ? primarySaleRecipient() : _primarySaleRecipient;
    CurrencyTransferLib.transferCurrency(_currency, msg.sender, saleRecipient, totalPrice);
}
```
## ERC1155

```solidity
import "@thirdweb-dev/contracts/eip/ERC1155.sol";
```

ERC1155 is the standard for representing "Edition" NFTs where each NFT in the collection can have more than 1 quantity; also known as "semi-fungible" tokens.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/eip/ERC1155.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/eip/ERC1155.sol";
 
contract Contract is ERC1155 {
    constructor(
        string memory _name,
        string memory _symbol
    )
        ERC1155(
            _name,
            _symbol
        )
    {}
}
```

### Base Contracts Implementing This Extension

* [ERC1155Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/base)
* [ERC1155DelayedReveal](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/delayed-reveal)
* [ERC1155Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/drop)
* [ERC1155LazyMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/lazy-mint)
* [ERC1155SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/signature-mint)
## ERC1155BatchMintable

```solidity
import "@thirdweb-dev/eip/ERC1155.sol"
import "@thirdweb-dev/contracts/extension/multicall.sol";
import "@thirdweb-dev/contracts/extension/interface/IMintableERC1155.sol";
```

Enable minting multiple NFTs at once in a single transaction by Implementing [ERC1155](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155), [IMintableERC1155](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Mintable), and [Multicall](https://portal.thirdweb.com/contracts/build/extensions/general/Multicall) extensions.

This is an extension which is detectable in the dashboard if the smart contract implements the[ERC1155](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155), [Multicall](https://portal.thirdweb.com/contracts/build/extensions/general/Multicall) and [ERC1155Mintable](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Mintable) extensions.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/interface/IMintableERC1155.sol) 

### Usage

This is an example smart contract which will have ERC1155BatchMintable detected on it in the dashboard. It also highlights the functions which can be (optionally) overridden to add custom logic.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/eip/ERC1155.sol";
import "@thirdweb-dev/contracts/extension/interface/IMintableERC1155.sol";
import "@thirdweb-dev/contracts/extension/Multicall.sol";
 
contract Contract is ERC1155, IMintableERC1155, Multicall {
    constructor(
        string memory _name,
        string memory _symbol
    )
        ERC1155(
            _name,
            _symbol
        )
    {}
 
    function mintTo(
        address to,
        uint256 tokenId,
        string calldata uri,
        uint256 amount
    ) external override {
        // Your custom implementation here
    }
}
```

### Base Contracts Implementing This Extension

* [ERC1155Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/base)
* [ERC1155SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/signature-mint)
## ERC1155Burnable

```solidity
import "@thirdweb-dev/contracts/extension/interface/IBurnableERC721.sol";
```

ERC1155Burnable allows the NFTs in the contract to be burned (transferred to a non-recoverable address).

#### info

This extension is an interface and requires all of the functions to be implemented

  
[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/interface/IBurnableERC1155.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/eip/ERC1155.sol";
import "@thirdweb-dev/contracts/extension/interface/IBurnableERC1155.sol";
 
contract Contract is ERC1155, IBurnableERC1155 {
    constructor(
        string memory _name,
        string memory _symbol
    )
        ERC1155(
            _name,
            _symbol
        )
    {}
 
    function burn(address account, uint256 id, uint256 value) external override {
        // Your custom implementation here
    }
 
    function burnBatch(
        address account, uint256[] memory ids, uint256[] memory values) external override {
        // Your custom implementation here
    }
}
```

### Base Contracts Implementing This Extension

* [ERC1155Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/base)
* [ERC1155DelayedReveal](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/delayed-reveal)
* [ERC1155Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/drop)
* [ERC1155LazyMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/lazy-mint)
* [ERC1155SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/signature-mint)
## ERC1155ClaimConditions

```solidity
import "@thirdweb-dev/contracts/eip/ERC1155.sol";
import "@thirdweb-dev/contracts/extension/DropSinglePhase1155.sol";
```

Allow other wallets to claim/mint tokens from the contract under the criteria of claim conditions by implementing [ERC1155](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155) and [DropSinglePhase](https://portal.thirdweb.com/contracts/build/extensions/general/DropSinglePhase) extensions.

This is an extension which is detectable in the dashboard if the smart contract implements the[ERC1155](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155) and [ERC1155DropSinglePhase](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155DropSinglePhase) extensions.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/DropSinglePhase1155.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from the extensions which make up the `ERC1155ClaimConditions` detectable extension. The functions which are available to be (optionally) overridden are also detailed.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/eip/ERC1155A.sol";
import "@thirdweb-dev/contracts/extension/LazyMint.sol";
import "@thirdweb-dev/contracts/extension/DropSinglePhase1155.sol";
 
contract Contract is ERC1155, LazyMint, DropSinglePhase1155 {
    constructor(
        string memory _name,
        string memory _symbol
    )
        ERC1155(
            _name,
            _symbol
        )
    {}
 
    function _canLazyMint() internal view override returns (bool) {
        // Your custom implementation here
    }
 
    /// @dev Runs before every `claim` function call.
    function _beforeClaim(
        uint256 _tokenId,
        address _receiver,
        uint256 _quantity,
        address _currency,
        uint256 _pricePerToken,
        AllowlistProof calldata _allowlistProof,
        bytes memory _data
    ) internal virtual override {
      // Your custom implementation logic here
    }
 
    /// @dev Runs after every `claim` function call.
    function _afterClaim(
        uint256 _tokenId,
        address _receiver,
        uint256 _quantity,
        address _currency,
        uint256 _pricePerToken,
        AllowlistProof calldata _allowlistProof,
        bytes memory _data
    ) internal virtual override {
      // Your custom implementation logic here
    }
 
    function _canSetClaimConditions() internal view override returns (bool) {
        // Your custom implementation here
    }
 
    function _collectPriceOnClaim(
        address _primarySaleRecipient,
        uint256 _quantityToClaim,
        address _currency,
        uint256 _pricePerToken
    ) internal virtual override {
        // Your custom implementation here
    }
 
    function _transferTokensOnClaim(address _to, uint256 _quantityBeingClaimed)
        internal
        virtual
        override
        returns (uint256 startTokenId)
    {
        // Your custom implementation here
    }
}
```

### Base Contracts Implementing This Extension

* [ERC1155Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/drop)
## ERC1155Claimable

```solidity
import "@thirdweb-dev/contracts/extension/interface/IMintableERC721.sol";
```

Allow other wallets to **claim** NFTs that you have lazy-minted.

It is recommended to use this extension alongside the [LazyMint](https://portal.thirdweb.com/contracts/build/extensions/general/LazyMint) extension.

#### info

This extension is an interface and requires all of the functions to be implemented

  
[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/interface/IClaimableERC1155.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/eip/ERC1155.sol";
import "@thirdweb-dev/contracts/extension/LazyMint.sol";
import "@thirdweb-dev/contracts/extension/interface/IClaimableERC1155.sol";
 
contract Contract is ERC1155, LazyMint, IClaimableERC1155 {
    constructor(
        string memory _name,
        string memory _symbol
    )
        ERC1155(
            _name,
            _symbol
        )
    {}
 
    function _canLazyMint() internal view override returns (bool) {
        // Your custom implementation here
    }
 
    function verifyClaim(address _claimer, uint256 _quantity) public view virtual override {
        // Your custom implementation here
    }
 
    function claim(address _receiver, uint256 _quantity) public payable virtual override {
        // Your custom implementation here
    }
 
}
```

### Base Contracts Implementing This Extension

This extension is used as part of the [ERC1155ClaimCustom](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155ClaimCustom) extension. The base contracts which have ERC1155ClaimCustom detected on them will also implement ERC1155Claimable.

* [ERC1155DelayedReveal](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Revealable)
* [ERC1155LazyMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/lazy-mint)
## ERC1155ClaimCustom

```solidity
import "@thirdweb-dev/contracts/eip/ERC1155.sol";
import "@thirdweb-dev/contracts/extension/interface/IClaimableERC1155.sol";
```

Allow other wallets to claim/mint tokens that you have Lazy Minted by implementing [ERC1155](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155) and [ERC1155Claimable](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Claimable) extensions.

This is an extension which is detectable in the dashboard if the smart contract implements the[ERC1155](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155) and [ERC1155Claimable](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Claimable) extensions.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/interface/IClaimableERC1155.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from the extensions which make up the `ERC1155ClaimCustom` detectable extension. The functions which are available to be (optionally) overridden are also detailed.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/eip/ERC1155.sol";
import "@thirdweb-dev/contracts/extension/LazyMint.sol";
import "@thirdweb-dev/contracts/extension/interface/IClaimableERC1155.sol";
 
contract Contract is ERC1155, LazyMint, IClaimableERC1155 {
    constructor(
        string memory _name,
        string memory _symbol
    )
        ERC1155(
            _name,
            _symbol
        )
    {}
 
    function _canLazyMint() internal view override returns (bool) {
        // Your custom implementation here
    }
 
    function _canSetClaimConditions() internal view override returns (bool) {
        // Your custom implementation here
    }
 
    function _collectPriceOnClaim(
        address _primarySaleRecipient,
        uint256 _quantityToClaim,
        address _currency,
        uint256 _pricePerToken
    ) internal virtual override {
        // Your custom implementation here
    }
 
    function _transferTokensOnClaim(address _to, uint256 _quantityBeingClaimed)
        internal
        virtual
        override
        returns (uint256 startTokenId)
    {
        // Your custom implementation here
    }
 
    function claim(address _receiver, uint256 _quantity) external payable override {
        // Your custom implementation here
    }
 
    function verifyClaim(address _claimer, uint256 _quantity) external view override {
        // Your custom implementation here
    }
}
```

### Base Contracts Implementing This Extension

* [ERC1155DelayedReveal](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Revealable)
* [ERC1155LazyMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/lazy-mint)
## ERC1155ClaimPhases

```solidity
import "@thirdweb-dev/contracts/eip/ERC721.sol";
import "@thirdweb-dev/contracts/extension/Drop1155.sol";
```

Allow other wallets to claim/mint tokens from the contract under the criteria of claim conditions by implementing [ERC1155](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155) and [Drop](https://portal.thirdweb.com/contracts/build/extensions/general/Drop).

Unlike [ERC1155ClaimCondition](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155ClaimConditions), this extension allows you to set _multiple_ [claim phases](https://portal.thirdweb.com/glossary/claim-phases).

This is an extension which is detectable in the dashboard if the smart contract implements the[ERC1155](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155) and [Drop](https://portal.thirdweb.com/contracts/build/extensions/general/Drop) extensions.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/Drop1155.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from the extensions which make up the `ERC1155ClaimPhases` detectable extension. The functions which are available to be (optionally) overridden are also detailed.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/eip/ERC1155.sol";
import "@thirdweb-dev/contracts/extension/LazyMint.sol";
import "@thirdweb-dev/contracts/extension/Drop1155.sol";
 
contract Contract is ERC1155, LazyMint, Drop1155 {
    constructor(
        string memory _name,
        string memory _symbol
    )
        ERC1155(
            _name,
            _symbol
        )
    {}
 
    function _canLazyMint() internal view override returns (bool) {
        // Your custom implementation here
    }
 
    /// @dev Runs before every `claim` function call.
    function _beforeClaim(
        uint256 _tokenId,
        address _receiver,
        uint256 _quantity,
        address _currency,
        uint256 _pricePerToken,
        AllowlistProof calldata _allowlistProof,
        bytes memory _data
    ) internal virtual {}
 
    /// @dev Runs after every `claim` function call.
    function _afterClaim(
        uint256 _tokenId,
        address _receiver,
        uint256 _quantity,
        address _currency,
        uint256 _pricePerToken,
        AllowlistProof calldata _allowlistProof,
        bytes memory _data
    ) internal virtual {}
 
    /// @dev Collects and distributes the primary sale value of NFTs being claimed.
    function _collectPriceOnClaim(
        uint256 _tokenId,
        address _primarySaleRecipient,
        uint256 _quantityToClaim,
        address _currency,
        uint256 _pricePerToken
    ) internal virtual override {
        if (_pricePerToken == 0) {
            return;
        }
 
        uint256 totalPrice = _quantityToClaim * _pricePerToken;
 
        if (_currency == CurrencyTransferLib.NATIVE_TOKEN) {
            if (msg.value != totalPrice) {
                revert("Must send total price.");
            }
        }
 
        address saleRecipient = _primarySaleRecipient;
        CurrencyTransferLib.transferCurrency(_currency, msg.sender, saleRecipient, totalPrice);
    }
 
    /// @dev Transfers the tokens being claimed.
    function _transferTokensOnClaim(address _to, uint256 _tokenId, uint256 _quantityBeingClaimed)
        internal
        virtual
        override
    {
        _mint(_to, _tokenId, _quantityBeingClaimed, "");
    }
 
    /// @dev Checks whether platform fee info can be set in the given execution context.
    function _canSetClaimConditions()
        internal
        view
        virtual
        override
        returns (bool)
    {
        return msg.sender == owner();
    }
}
```

### Base Contracts Implementing This Extension

None of the base contracts implement this extension.
## DropSinglePhase (ERC1155)

```solidity
import "@thirdweb-dev/contracts/extension/DropSinglePhase1155.sol";
```

The `DropSinglePhase1155` smart contract is an extension meant for distributing ERC1155 tokens.

This extension implements the ['Drop'](https://portal.thirdweb.com/glossary/drop) distribution mechanism: set restrictions such as a price to charge, an allowlist etc. for the public / allowlisted mint of your tokens.

It is recommended to use this extension alongside the [LazyMint](https://portal.thirdweb.com/contracts/build/extensions/general/LazyMint) extension.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/DropSinglePhase1155.sol) 

### Usage

The `DropSinglePhase1155` extension is an _abstract contract_, and expects you to implement the following functions by yourself:

| Name                    | Type                    | Description                                                                                                                                      |
| ----------------------- | ----------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------ |
| \_afterClaim            | internal _virtual_      | Runs after every claim function call.                                                                                                            |
| \_beforeClaim           | internal _virtual_      | Runs before every claim function call.                                                                                                           |
| \_collectPriceOnClaim   | internal _virtual_      | Collects and distributes the primary sale value of NFTs being claimed.                                                                           |
| \_transferTokensOnClaim | internal _virtual_      | Transfers the NFTs being claimed.                                                                                                                |
| \_canSetClaimConditions | internal view _virtual_ | Runs on every attempt to set the claim condition on the contract. Returns whether the claim condition can be set in the given execution context. |

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: Apache-2.0
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/base/ERC1155Base.sol";
import "@thirdweb-dev/contracts/extension/DropSinglePhase1155.sol";
import "@thirdweb-dev/contracts/lib/CurrencyTransferLib.sol";
 
/// This is an EXAMPLE of usage of `DropSinglePhase1155` for distributing ERC1155 tokens.
 
contract ERC1155Drop is
    ERC1155Base,
    DropSinglePhase1155
{
 
    constructor(
        string memory _name,
        string memory _symbol,
        address _royaltyRecipient,
        uint128 _royaltyBps
    ) ERC1155Base(_name, _symbol, _royaltyRecipient, _royaltyBps) {}
 
    /// @dev Runs before every `claim` function call.
    function _beforeClaim(
        uint256 _tokenId,
        address _receiver,
        uint256 _quantity,
        address _currency,
        uint256 _pricePerToken,
        AllowlistProof calldata _allowlistProof,
        bytes memory _data
    ) internal virtual override {
      // Your custom implementation logic here
    }
 
    /// @dev Runs after every `claim` function call.
    function _afterClaim(
        uint256 _tokenId,
        address _receiver,
        uint256 _quantity,
        address _currency,
        uint256 _pricePerToken,
        AllowlistProof calldata _allowlistProof,
        bytes memory _data
    ) internal virtual override {
      // Your custom implementation logic here
    }
 
    /// @dev Collects and distributes the primary sale value of NFTs being claimed.
    function _collectPriceOnClaim(
        address _primarySaleRecipient,
        uint256 _quantityToClaim,
        address _currency,
        uint256 _pricePerToken
    ) internal virtual override {
        if (_pricePerToken == 0) {
            return;
        }
 
        uint256 totalPrice = _quantityToClaim * _pricePerToken;
 
        if (_currency == CurrencyTransferLib.NATIVE_TOKEN) {
            if (msg.value != totalPrice) {
                revert("Must send total price.");
            }
        }
 
        address saleRecipient = _primarySaleRecipient;
        CurrencyTransferLib.transferCurrency(_currency, msg.sender, saleRecipient, totalPrice);
    }
 
    /// @dev Transfers the NFTs being claimed.
    function _transferTokensOnClaim(
        address _to,
        uint256 _tokenId,
        uint256 _quantityBeingClaimed
    ) internal virtual override {
        _mint(_to, _tokenId, _quantityBeingClaimed, "");
    }
 
    /// @dev Checks whether platform fee info can be set in the given execution context.
    function _canSetClaimConditions() internal view virtual override returns (bool) {
        return msg.sender == owner();
    }
}
```

### Base Contracts Implementing This Extension

* [ERC1155Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/drop)

### Full API reference

##### claim

```solidity
function claim(
    address receiver,
    uint256 tokenId,
    uint256 quantity,
    address currency,
    uint256 pricePerToken,
    AllowlistProof calldata allowlistProof,
    bytes memory data
) external payable;
```

* Lets an account claim a given quantity of tokens.
* Parameter `receiver`: The receiver of the NFTs to claim.
* Parameter `tokenId`: The tokenId of the NFTs to claim.
* Parameter `quantity`: The quantity of NFTs to claim.
* Parameter `currency`: The currency in which to pay for the claim.
* Parameter `pricePerToken`: The price per token to pay for the claim.
* Parameter `allowlistProof`: The proof of the claimer's inclusion in the merkle root allowlist.
* Parameter `data`: Arbitrary bytes data that can be leveraged in the implementation of this interface.

##### setClaimConditions

```solidity
struct ClaimCondition {
    uint256 startTimestamp;
    uint256 maxClaimableSupply;
    uint256 supplyClaimed;
    uint256 quantityLimitPerWallet;
    bytes32 merkleRoot;
    uint256 pricePerToken;
    address currency;
    string metadata;
}
 
function setClaimConditions(
    uint256 tokenId,
    ClaimCondition calldata phase,
    bool resetClaimEligibility
) external;
```

* Lets an authorized wallet set the claim condition for the contract.
* Parameter `tokenId`: The tokenId for which to set the claim condition.
* Parameter `phase`: The set of restrictions that will apply to the minting of tokens on the contract.  
   * `startTimestamp`: The unix timestamp after which the claim condition applies.  
   * `maxClaimableSupply`: The maximum total number of tokens that can be claimed under the claim condition.  
   * `supplyClaimed`: At any given point, the number of tokens that have been claimed under the claim condition.  
   * `quantityLimitPerWallet`: The maximum number of tokens that can be claimed by a wallet.  
   * `merkleRoot`: The allowlist of addresses that can claim tokens under the claim condition.  
   * `pricePerToken`: The price required to pay per token claimed.  
   * `currency`: The currency in which the price must be paid.
* Parameter `resetClaimEligibility`: Whether to carry over the restrictions active for wallets that claimed tokens in the incumbent claim condition (e.g. next valid claim timestamp for a given wallet).
* The `_canSetClaimConditions` function is run on every call to this function. If the return value of `_canSetClaimConditions` is `false`, the `setClaimConditions` call will revert.

##### verifyClaim

```solidity
struct AllowlistProof {
    bytes32[] proof;
    uint256 quantityLimitPerWallet;
    uint256 pricePerToken;
    address currency;
}
 
function verifyClaim(
    uint256 tokenId,
    address claimer,
    uint256 quantity,
    address currency,
    uint256 pricePerToken,
    AllowlistProof calldata allowlistProof
) public view returns (bool isOverride);
```

* Checks a request to claim tokens against the active claim condition's criteria.
* Parameter `tokenId`: The tokenId of the NFTs to claim.
* Parameter `claimer`: The wallet claiming tokens.
* Parameter `quantity`: The quantity of NFTs to claim.
* Parameter `currency`: The currency in which to pay the price for the claim.
* Parameter `pricePerToken`: The price to pay per token claimed.
* Parameter `allowlistProof`: Struct containing below elements:  
   * `proof`: Proof of concerned wallet's inclusion in an allowlist.  
   * `quantityLimitPerWallet`: The total quantity of tokens the allowlisted wallet is eligible to claim over time.  
   * `pricePerToken`: The price per token the allowlisted wallet must pay to claim tokens.  
   * `currency`: The currency in which the allowlisted wallet must pay the price for claiming tokens.

##### getSupplyClaimedByWallet

```solidity
function getSupplyClaimedByWallet(uint256 tokenId, address claimer)
    public
    view
    returns (uint256);
```

* Returns the number of tokens claimed by a wallet under the active condition.
* Parameter `tokenId`: The tokenId of the NFTs to claim.
* Parameter `claimer`: The wallet claiming tokens.

##### \_dropMsgSender

```solidity
function _dropMsgSender() internal virtual returns (address);
```

* Exposes the ability to override the msg sender.

##### \_beforeClaim

```solidity
function _beforeClaim(
    uint256 tokenId,
    address receiver,
    uint256 quantity,
    address currency,
    uint256 pricePerToken,
    AllowlistProof calldata allowlistProof,
    bytes memory data
) internal virtual
```

* Runs before every `claim` function call. Exposes the ability to add custom logic that runs before every claim of tokens.
* Parameter `tokenId`: The tokenId of the NFTs to claim.
* Parameter `receiver`: The receiver of the NFTs to claim.
* Parameter `quantity`: The quantity of NFTs to claim.
* Parameter `currency`: The currency in which to pay for the claim.
* Parameter `pricePerToken`: The price per token to pay for the claim.
* Parameter `allowlistProof`: The proof of the claimer's inclusion in the merkle root allowlist.
* Parameter `data`: Arbitrary bytes data that can be leveraged in the implementation of this interface.

##### \_afterClaim

```solidity
function _afterClaim(
    uint256 tokenId,
    address receiver,
    uint256 quantity,
    address currency,
    uint256 pricePerToken,
    AllowlistProof calldata allowlistProof,
    bytes memory data
) internal virtual
```

* Runs after every `claim` function call. Exposes the ability to add custom logic that runs after every claim of tokens.
* Parameter `tokenId`: The tokenId of the NFTs to claim.
* Parameter `receiver`: The receiver of the NFTs to claim.
* Parameter `quantity`: The quantity of NFTs to claim.
* Parameter `currency`: The currency in which to pay for the claim.
* Parameter `pricePerToken`: The price per token to pay for the claim.
* Parameter `allowlistProof`: The proof of the claimer's inclusion in the merkle root allowlist.
* Parameter `data`: Arbitrary bytes data that can be leveraged in the implementation of this interface.

##### \_collectPriceOnClaim

```solidity
function _collectPriceOnClaim(
    address primarySaleRecipient,
    uint256 quantityToClaim,
    address currency,
    uint256 pricePerToken
) internal virtual;
```

* Collects and distributes the primary sale value of NFTs being claimed.
* Parameter `primarySaleRecipient`: The recipient of the primary sale value generated from a claim.
* Parameter `quantityToClaim`: The quantity of NFTs being claimed.
* Parameter `currency`: The currency used to pay for the claim.
* Parameter `pricePerToken`: The price per token to pay for the claim.

##### \_transferTokensOnClaim

```solidity
function _transferTokensOnClaim(address to, uint256 tokenId, uint256 quantityBeingClaimed)
    internal
    virtual
    returns (uint256 startTokenId);
```

* Transfers the NFTs being claimed to the appropriate recipient.
* Parameter `to`: The recipient of the tokens for a claim.
* Parameter `tokenId`: The tokenId of the NFTs being claimed.
* Parameter `quantityBeingClaimed`: The quantity of NFTs being claimed.

##### \_canSetClaimConditions

```solidity
function _canSetClaimConditions() internal view virtual returns (bool);
```

* Runs on every `setClaimConditions` function call.
* Returns whether the claim condition can be set in the given execution context.
* For example, this function can check whether the wallet calling `setClaimConditions` is the contract owner, and enforce that only the owner should be able to successfully call `setClaimConditions`.
## ERC1155Drop

```solidity
import "@thirdweb-dev/contracts/extension/Drop1155.sol";
```

The `Drop1155` smart contract is an extension meant for distributing [ERC1155](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155) tokens. It allows setting up multiple claim phases unlike [ERC1155DropSinglePhase](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155DropSinglePhase). This series of claim phases is ordered by their respective `startTimestamp`.

This extension implements the ['Drop'](https://portal.thirdweb.com/glossary/drop) distribution mechanism: set multiple claim phases with restrictions such as a price to charge, an allowlist etc. for the public / allowlisted mint of your tokens.

It is recommended to use this extension alongside the [LazyMint](https://portal.thirdweb.com/contracts/build/extensions/general/LazyMint) extension.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/Drop1155.sol) 

### Usage

The `Drop1155` extension is an _abstract contract_, and expects you to implement the following functions by yourself:

| Name                    | Type                    | Description                                                                                                                                      |
| ----------------------- | ----------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------ |
| \_afterClaim            | internal _virtual_      | Runs after every claim function call.                                                                                                            |
| \_beforeClaim           | internal _virtual_      | Runs before every claim function call.                                                                                                           |
| \_collectPriceOnClaim   | internal _virtual_      | Collects and distributes the primary sale value of NFTs being claimed.                                                                           |
| \_transferTokensOnClaim | internal _virtual_      | Transfers the NFTs being claimed.                                                                                                                |
| \_canSetClaimConditions | internal view _virtual_ | Runs on every attempt to set the claim condition on the contract. Returns whether the claim condition can be set in the given execution context. |

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: Apache-2.0
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/extension/Drop1155.sol";
import "@thirdweb-dev/contracts/base/ERC1155Base.sol";
import "@thirdweb-dev/contracts/lib/CurrencyTransferLib.sol";
 
/// This is an EXAMPLE of usage of `Drop1155` for distributing ERC1155 tokens.
 
contract MyContract is ERC1155Base, Drop1155 {
    /*//////////////////////////////////////////////////////////////
                            Constructor
    //////////////////////////////////////////////////////////////*/
 
    constructor(
        string memory _name,
        string memory _symbol,
        address _royaltyRecipient,
        uint128 _royaltyBps
    ) ERC1155Base(_name, _symbol, _royaltyRecipient, _royaltyBps) {}
 
    /*//////////////////////////////////////////////////////////////
                        Internal (overrideable) functions
    //////////////////////////////////////////////////////////////*/
 
    /// @dev Collects and distributes the primary sale value of NFTs being claimed.
    function _collectPriceOnClaim(
        uint256 _tokenId,
        address _primarySaleRecipient,
        uint256 _quantityToClaim,
        address _currency,
        uint256 _pricePerToken
    ) internal virtual override {
        if (_pricePerToken == 0) {
            return;
        }
 
        uint256 totalPrice = _quantityToClaim * _pricePerToken;
 
        if (_currency == CurrencyTransferLib.NATIVE_TOKEN) {
            if (msg.value != totalPrice) {
                revert("Must send total price.");
            }
        }
 
        address saleRecipient = _primarySaleRecipient;
        CurrencyTransferLib.transferCurrency(_currency, msg.sender, saleRecipient, totalPrice);
    }
 
    /// @dev Transfers the tokens being claimed.
    function _transferTokensOnClaim(address _to, uint256 _tokenId, uint256 _quantityBeingClaimed)
        internal
        virtual
        override
    {
        _mint(_to, _tokenId, _quantityBeingClaimed, "");
    }
 
    /// @dev Checks whether platform fee info can be set in the given execution context.
    function _canSetClaimConditions()
        internal
        view
        virtual
        override
        returns (bool)
    {
        return msg.sender == owner();
    }
 
    /// @dev Runs before every `claim` function call.
    function _beforeClaim(
        uint256 _tokenId,
        address _receiver,
        uint256 _quantity,
        address _currency,
        uint256 _pricePerToken,
        AllowlistProof calldata _allowlistProof,
        bytes memory _data
    ) internal virtual {}
 
    /// @dev Runs after every `claim` function call.
    function _afterClaim(
        uint256 _tokenId,
        address _receiver,
        uint256 _quantity,
        address _currency,
        uint256 _pricePerToken,
        AllowlistProof calldata _allowlistProof,
        bytes memory _data
    ) internal virtual {}
}
```

### Base Contracts Implementing This Extension

None of the base contracts implement this extension.

### Full API reference

##### claim

```solidity
function claim(
    address receiver,
    uint256 tokenId,
    uint256 quantity,
    address currency,
    uint256 pricePerToken,
    AllowlistProof calldata allowlistProof,
    bytes memory data
) external payable;
```

* Lets an account claim a given quantity of tokens.
* Parameter `receiver`: The receiver of the tokens to claim.
* Parameter `tokenId`: The tokenId of the NFTs to claim.
* Parameter `quantity`: The quantity of tokens to claim.
* Parameter `currency`: The currency in which to pay for the claim.
* Parameter `pricePerToken`: The price per token to pay for the claim.
* Parameter `allowlistProof`: The proof of the claimer's inclusion in the merkle root allowlist.
* Parameter `data`: Arbitrary bytes data that can be leveraged in the implementation of this interface.

##### setClaimConditions

```solidity
struct ClaimCondition {
    uint256 startTimestamp;
    uint256 maxClaimableSupply;
    uint256 supplyClaimed;
    uint256 quantityLimitPerWallet;
    bytes32 merkleRoot;
    uint256 pricePerToken;
    address currency;
    string metadata;
}
 
function setClaimConditions(uint256 tokenId, ClaimCondition[] calldata phases, bool resetClaimEligibility) external;
```

* Lets an authorized wallet set the claim condition for the contract.
* Parameter `tokenId`: The token ID for which to set claim conditions.
* Parameter `phases`: The array where each `phase` contains a set of restrictions that will apply to the minting of tokens on the contract.  
   * `startTimestamp`: The unix timestamp after which the claim condition applies. The same claim condition applies until the `startTimestamp` of the next claim condition.  
   * `maxClaimableSupply`: The maximum total number of tokens that can be claimed under the claim condition.  
   * `supplyClaimed`: At any given point, the number of tokens that have been claimed under the claim condition.  
   * `quantityLimitPerWallet`: The maximum number of tokens that can be claimed by a wallet.  
   * `merkleRoot`: The allowlist of addresses that can claim tokens under the claim condition.  
   * `pricePerToken`: The price required to pay per token claimed.  
   * `currency`: The currency in which the price must be paid.  
   * `metadata`: Claim condition metadata.
* Parameter `resetClaimEligibility`: Whether to carry over the restrictions active for wallets that claimed tokens in the incumbent claim condition (e.g. next valid claim timestamp for a given wallet).
* The `_canSetClaimConditions` function is run on every call to this function. If the return value of `_canSetClaimConditions` is `false`, the `setClaimConditions` call will revert.

##### verifyClaim

```solidity
struct AllowlistProof {
    bytes32[] proof;
    uint256 quantityLimitPerWallet;
    uint256 pricePerToken;
    address currency;
}
 
function verifyClaim(
    uint256 conditionId,
    address claimer,
    uint256 tokenId,
    uint256 quantity,
    address currency,
    uint256 pricePerToken,
    AllowlistProof calldata allowlistProof
) public view returns (bool isOverride);
```

* Checks a request to claim tokens against the active claim condition's criteria.
* Parameter `conditionId`: Id of the active claim condition.
* Parameter `claimer`: The wallet claiming tokens.
* Parameter `tokenId`: The tokenId of the NFTs to claim.
* Parameter `quantity`: The quantity of tokens to claim.
* Parameter `currency`: The currency in which to pay the price for the claim.
* Parameter `pricePerToken`: The price to pay per token claimed.
* Parameter `allowlistProof`: Struct containing below elements:  
   * `proof`: Proof of concerned wallet's inclusion in an allowlist.  
   * `quantityLimitPerWallet`: The total quantity of tokens the allowlisted wallet is eligible to claim over time.  
   * `pricePerToken`: The price per token the allowlisted wallet must pay to claim tokens.  
   * `currency`: The currency in which the allowlisted wallet must pay the price for claiming tokens.

##### getActiveClaimConditionId

```solidity
function getActiveClaimConditionId(uint256 tokenId) public view returns (uint256);
```

* Returns the Id of currently active claim condition.
* Parameter `tokenId`: The token ID for which to check active claim condition.

##### getClaimConditionById

```solidity
function getClaimConditionById(uint256 tokenId, uint256 conditionId) external view returns (ClaimCondition memory);
```

* Returns the claim condition for a given condition Id.
* Parameter `tokenId`: The token ID for which check claim condition.
* Parameter `conditionId`: Id of the claim condition being viewed.

##### getSupplyClaimedByWallet

```solidity
function getSupplyClaimedByWallet(uint256 tokenId, uint256 conditionId, address claimer) public view returns (uint256);
```

* Returns the number of tokens claimed by a wallet under the given condition.
* Parameter `tokenId`: The token ID for which check claimed supply.
* Parameter `conditionId`: Id of the claim condition under which to check the supply claimed.
* Parameter `claimer`: The wallet claiming tokens.

##### \_dropMsgSender

```solidity
function _dropMsgSender() internal virtual returns (address);
```

* Exposes the ability to override the msg sender.

##### \_beforeClaim

```solidity
function _beforeClaim(
    uint256 tokenId,
    address receiver,
    uint256 quantity,
    address currency,
    uint256 pricePerToken,
    AllowlistProof calldata allowlistProof,
    bytes memory data
) internal virtual
```

* Runs before every `claim` function call. Exposes the ability to add custom logic that runs before every claim of tokens.
* Parameter `tokenId`: The tokenId of the NFTs to claim.
* Parameter `receiver`: The receiver of the tokens to claim.
* Parameter `quantity`: The quantity of tokens to claim.
* Parameter `currency`: The currency in which to pay for the claim.
* Parameter `pricePerToken`: The price per token to pay for the claim.
* Parameter `allowlistProof`: The proof of the claimer's inclusion in the merkle root allowlist.
* Parameter `data`: Arbitrary bytes data that can be leveraged in the implementation of this interface.

##### \_afterClaim

```solidity
function _afterClaim(
    uint256 tokenId,
    address receiver,
    uint256 quantity,
    address currency,
    uint256 pricePerToken,
    AllowlistProof calldata allowlistProof,
    bytes memory data
) internal virtual
```

* Runs after every `claim` function call. Exposes the ability to add custom logic that runs after every claim of tokens.
* Parameter `tokenId`: The tokenId of the NFTs to claim.
* Parameter `receiver`: The receiver of the tokens to claim.
* Parameter `quantity`: The quantity of tokens to claim.
* Parameter `currency`: The currency in which to pay for the claim.
* Parameter `pricePerToken`: The price per token to pay for the claim.
* Parameter `allowlistProof`: The proof of the claimer's inclusion in the merkle root allowlist.
* Parameter `data`: Arbitrary bytes data that can be leveraged in the implementation of this interface.

##### \_collectPriceOnClaim

```solidity
function _collectPriceOnClaim(
    uint256 tokenId,
    address primarySaleRecipient,
    uint256 quantityToClaim,
    address currency,
    uint256 pricePerToken
) internal virtual;
```

* Collects and distributes the primary sale value of tokens being claimed.
* Parameter `tokenId`: The tokenId of the NFTs to claim.
* Parameter `primarySaleRecipient`: The recipient of the primary sale value generated from a claim.
* Parameter `quantityToClaim`: The quantity of tokens being claimed.
* Parameter `currency`: The currency used to pay for the claim.
* Parameter `pricePerToken`: The price per token to pay for the claim.

##### \_transferTokensOnClaim

```solidity
function _transferTokensOnClaim(address to, uint256 tokenId, uint256 quantityBeingClaimed)
    internal
    virtual;
```

* Transfers the tokens being claimed to the appropriate recipient.
* Parameter `to`: The recipient of the tokens for a claim.
* Parameter `tokenId`: The tokenId of the NFTs to claim.
* Parameter `quantityBeingClaimed`: The quantity of tokens being claimed.

##### \_canSetClaimConditions

```solidity
function _canSetClaimConditions() internal view virtual returns (bool);
```

* Runs on every `setClaimConditions` function call.
* Returns whether the claim condition can be set in the given execution context.
* For example, this function can check whether the wallet calling `setClaimConditions` is the contract owner, and enforce that only the owner should be able to successfully call `setClaimConditions`.
## ERC1155Mintable

```solidity
import "@thirdweb-dev/contracts/extension/interface/IMintableERC721.sol";
```

`ERC1155Mintable` allows you to mint new NFTs into your ERC1155 NFT collection contract.

#### info

This extension is an interface and requires all of the functions to be implemented

  
[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/interface/IMintableERC1155.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/eip/ERC1155.sol";
import "@thirdweb-dev/contracts/extension/interface/IMintableERC1155.sol";
 
contract Contract is ERC1155, IMintableERC1155 {
    constructor(
        string memory _name,
        string memory _symbol
    )
        ERC1155(
            _name,
            _symbol
        )
    {}
 
    function mintTo(
        address to,
        uint256 tokenId,
        string calldata uri,
        uint256 amount
    ) external override {
        // Your custom implementation here
    }
}
```

### Base Contracts Implementing This Extension

* [ERC1155Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/base)
* [ERC1155DelayedReveal](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/delayed-reveal)
* [ERC1155Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/drop)
* [ERC1155LazyMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/lazy-mint)
* [ERC1155SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/signature-mint)
## ERC1155Revealable

```solidity
import "@thirdweb-dev/contracts/eip/ERC1155.sol";
import "@thirdweb-dev/contracts/extension/DelayedReveal.sol";
```

Create batches of ['delayed-reveal'](https://portal.thirdweb.com/glossary/delayed-reveal) NFTs that can be revealed at a later date after they have been minted and claimed.

This is an extension which is detectable in the dashboard if the smart contract implements the[ERC1155](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155) and [DelayedReveal](https://portal.thirdweb.com/contracts/build/extensions/general/DelayedReveal) extensions.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/DelayedReveal.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/eip/ERC1155.sol";
import "@thirdweb-dev/contracts/extension/LazyMint.sol";
import "@thirdweb-dev/contracts/extension/DelayedReveal.sol";
 
contract Contract is ERC1155, LazyMint, DelayedReveal {
    constructor(
        string memory _name,
        string memory _symbol
    )
        ERC1155(
            _name,
            _symbol
        )
    {}
 
    function reveal(uint256 _index, bytes calldata _key)
        external
        override
        returns (string memory revealedURI)
    {
      // Your custom implementation here
    }
 
    function _canLazyMint() internal view override returns (bool) {
        // Your custom implementation here
    }
}
```

### Base Contracts Implementing This Extension

* [ERC1155DelayedReveal](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/delayed-reveal)
* [ERC1155Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/drop)
## Linking Multiple Identities

thirdweb Wallets allow users to tie the same wallet address to multiple social identities. Developers can programmatically link additional identities at any point in their user journey.

### Link a new identity

When linking two identities, both identities will now be linked to the same wallet.

#### Linking a pre-existing identity

If the account that is is already linked to this or another wallet, this will throw an error.

#### In App Wallet

#### Ecosystem Wallet

### Retrieve Linked Profiles

Once linked, you can retrieve the user profiles via either identity.

For more information, see [Getting User Profiles](https://portal.thirdweb.com/connect/wallet/user-management/get-user-profiles).
## ERC1155SignatureMint

```solidity
import "@thirdweb-dev/contracts/extension/SignatureMintERC1155.sol";
```

The `SignatureMintERC1155` smart contract is an extension meant for distributing ERC1155 tokens.

The ['signature minting'](https://portal.thirdweb.com/glossary/signature-based-minting) mechanism in the `SignatureMintERC1155` extension uses [EIP-712](https://eips.ethereum.org/EIPS/eip-712), and is a way for a contract admin to authorize an external party's request to mint tokens on the admin's contract. At a high level, this means you can authorize some external party to mint tokens on your contract, and specify what exactly will be minted by that external party.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/SignatureMintERC1155.sol) 

### Usage

The `SignatureMintERC1155` extension is an _abstract contract_, and expects you to implement the following functions by yourself:

| Name                                                                                                         | Type                    | Description                                                                                                                                     |
| ------------------------------------------------------------------------------------------------------------ | ----------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------- |
| [\_canSignMintRequest](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155SignatureMint) | internal view _virtual_ | Runs on every attempt to mint tokens with signature on the contract. Returns whether the signer is authorized to issue a signature for minting. |
| [mintWithSignature](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155SignatureMint)    | external payable        | Mints tokens according to the provided mint request.                                                                                            |

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/base/ERC1155Base.sol";
import "@thirdweb-dev/contracts/extension/SignatureMintERC1155.sol";
import "@thirdweb-dev/contracts/lib/CurrencyTransferLib.sol";
 
contract ERC1155SignatureMint is ERC1155Base, SignatureMintERC1155 {
    constructor(
        string memory _name,
        string memory _symbol,
        address _royaltyRecipient,
        uint128 _royaltyBps
    ) ERC1155Base(_name, _symbol, _royaltyRecipient, _royaltyBps) {}
 
    /// @dev Mints tokens according to the provided mint request.
    function mintWithSignature(
        MintRequest calldata _req,
        bytes calldata _signature
    ) external payable virtual override returns (address signer) {
        require(_req.quantity > 0, "Minting zero tokens.");
 
        uint256 tokenIdToMint;
        uint256 nextIdToMint = nextTokenIdToMint();
 
        if (_req.tokenId == type(uint256).max) {
            tokenIdToMint = nextIdToMint;
            nextTokenIdToMint_ += 1;
        } else {
            require(_req.tokenId < nextIdToMint, "invalid id");
            tokenIdToMint = _req.tokenId;
        }
 
        // Verify and process payload.
        signer = _processRequest(_req, _signature);
 
        address receiver = _req.to;
 
        // Collect price
        _collectPriceOnClaim(
            _req.primarySaleRecipient,
            _req.quantity,
            _req.currency,
            _req.pricePerToken
        );
 
        // Set royalties, if applicable.
        if (_req.royaltyRecipient != address(0)) {
            _setupRoyaltyInfoForToken(
                tokenIdToMint,
                _req.royaltyRecipient,
                _req.royaltyBps
            );
        }
 
        // Set URI
        if (_req.tokenId == type(uint256).max) {
            _setTokenURI(tokenIdToMint, _req.uri);
        }
 
        // Mint tokens.
        _mint(receiver, tokenIdToMint, _req.quantity, "");
 
        emit TokensMintedWithSignature(signer, receiver, tokenIdToMint, _req);
    }
 
    /// @dev Returns whether a given address is authorized to sign mint requests.
    function _canSignMintRequest(address _signer)
        internal
        view
        virtual
        override
        returns (bool)
    {
        return _signer == owner();
    }
 
    /// @dev Collects and distributes the primary sale value of tokens being claimed.
    function _collectPriceOnClaim(
        address _primarySaleRecipient,
        uint256 _quantityToClaim,
        address _currency,
        uint256 _pricePerToken
    ) internal virtual {
        if (_pricePerToken == 0) {
            return;
        }
 
        uint256 totalPrice = (_quantityToClaim * _pricePerToken) / 1 ether;
        require(totalPrice > 0, "quantity too low");
 
        if (_currency == CurrencyTransferLib.NATIVE_TOKEN) {
            require(msg.value == totalPrice, "Must send total price.");
        }
 
        address saleRecipient = _primarySaleRecipient;
        CurrencyTransferLib.transferCurrency(
            _currency,
            msg.sender,
            saleRecipient,
            totalPrice
        );
    }
}
```

### Base Contracts Implementing This Extension

* [ERC1155SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/signature-mint)

### Full API reference

##### verify

```solidity
struct MintRequest {
    address to;
    address royaltyRecipient;
    uint256 royaltyBps;
    address primarySaleRecipient;
    uint256 tokenId;
    string uri;
    uint256 quantity;
    uint256 pricePerToken;
    address currency;
    uint128 validityStartTimestamp;
    uint128 validityEndTimestamp;
    bytes32 uid;
}
 
function verify(MintRequest calldata req, bytes calldata signature)
    public
    view
    returns (bool success, address signer)
```

* Verifies that a mint request is valid and signed by an authorized wallet.
* Parameter `req`: The mint request.  
   * `to`: The recipient of the tokens to mint.  
   * `royaltyRecipient`: The recipient of the minted token's secondary sales royalties.  
   * `royaltyBps`: The percentage of the minted token's secondary sales to take as royalties.  
   * `primarySaleRecipient`: The recipient of the minted token's primary sales proceeds.  
   * `tokenId`: The tokenId of the NFT to mint.  
   * `uri`: The metadata URI of the token to mint.  
   * `quantity`: The quantity of tokens to mint.  
   * `pricePerToken`: The price to pay per quantity of tokens minted.  
   * `currency`: The currency in which to pay the price per token minted.  
   * `validityStartTimestamp`: The unix timestamp after which the payload is valid.  
   * `validityEndTimestamp`: The unix timestamp at which the payload expires.  
   * `uid`: A unique identifier for the payload.
* Parameter `signature`: The signature produced by an authorized wallet signing the mint request.

##### mintWithSignature

```solidity
struct MintRequest {
    address to;
    address royaltyRecipient;
    uint256 royaltyBps;
    address primarySaleRecipient;
    uint256 tokenId;
    string uri;
    uint256 quantity;
    uint256 pricePerToken;
    address currency;
    uint128 validityStartTimestamp;
    uint128 validityEndTimestamp;
    bytes32 uid;
}
 
function mintWithSignature(MintRequest calldata req, bytes calldata signature)
    external
    payable
    returns (address signer)
```

* Mints tokens according to the provided mint request.
* Parameter `req`: The mint request.  
   * `to`: The recipient of the tokens to mint.  
   * `royaltyRecipient`: The recipient of the minted token's secondary sales royalties.  
   * `royaltyBps`: The percentage of the minted token's secondary sales to take as royalties.  
   * `primarySaleRecipient`: The recipient of the minted token's primary sales proceeds.  
   * `tokenId`: The tokenId of the NFT to mint.  
   * `uri`: The metadata URI of the token to mint.  
   * `quantity`: The quantity of tokens to mint.  
   * `pricePerToken`: The price to pay per quantity of tokens minted.  
   * `currency`: The currency in which to pay the price per token minted.  
   * `validityStartTimestamp`: The unix timestamp after which the payload is valid.  
   * `validityEndTimestamp`: The unix timestamp at which the payload expires.  
   * `uid`: A unique identifier for the payload.
* Parameter `signature`: The signature produced by an authorized wallet signing the mint request.

##### \_processRequest

```solidity
struct MintRequest {
    address to;
    address royaltyRecipient;
    uint256 royaltyBps;
    address primarySaleRecipient;
    uint256 tokenId;
    string uri;
    uint256 quantity;
    uint256 pricePerToken;
    address currency;
    uint128 validityStartTimestamp;
    uint128 validityEndTimestamp;
    bytes32 uid;
}
 
function _processRequest(MintRequest calldata req, bytes calldata signature)
    internal
    returns (address signer)
```

* Verifies a mint request and marks the request and signature as used.
* Parameter `req`: The mint request.  
   * `to`: The recipient of the tokens to mint.  
   * `royaltyRecipient`: The recipient of the minted token's secondary sales royalties.  
   * `royaltyBps`: The percentage of the minted token's secondary sales to take as royalties.  
   * `primarySaleRecipient`: The recipient of the minted token's primary sales proceeds.  
   * `tokenId`: The tokenId of the NFT to mint.  
   * `uri`: The metadata URI of the token to mint.  
   * `quantity`: The quantity of tokens to mint.  
   * `pricePerToken`: The price to pay per quantity of tokens minted.  
   * `currency`: The currency in which to pay the price per token minted.  
   * `validityStartTimestamp`: The unix timestamp after which the payload is valid.  
   * `validityEndTimestamp`: The unix timestamp at which the payload expires.  
   * `uid`: A unique identifier for the payload.
* Parameter `signature`: The signature produced by an authorized wallet signing the mint request.

##### \_recoverAddress

```solidity
struct MintRequest {
    address to;
    address royaltyRecipient;
    uint256 royaltyBps;
    address primarySaleRecipient;
    uint256 tokenId;
    string uri;
    uint256 quantity;
    uint256 pricePerToken;
    address currency;
    uint128 validityStartTimestamp;
    uint128 validityEndTimestamp;
    bytes32 uid;
}
 
function _recoverAddress(MintRequest calldata req, bytes calldata signature)
    internal
    view
    returns (address signer)
```

* Returns the address of the signer of the mint request.
* Parameter `req`: The mint request.  
   * `to`: The recipient of the tokens to mint.  
   * `royaltyRecipient`: The recipient of the minted token's secondary sales royalties.  
   * `royaltyBps`: The percentage of the minted token's secondary sales to take as royalties.  
   * `primarySaleRecipient`: The recipient of the minted token's primary sales proceeds.  
   * `tokenId`: The tokenId of the NFT to mint.  
   * `uri`: The metadata URI of the token to mint.  
   * `quantity`: The quantity of tokens to mint.  
   * `pricePerToken`: The price to pay per quantity of tokens minted.  
   * `currency`: The currency in which to pay the price per token minted.  
   * `validityStartTimestamp`: The unix timestamp after which the payload is valid.  
   * `validityEndTimestamp`: The unix timestamp at which the payload expires.  
   * `uid`: A unique identifier for the payload.
* Parameter `signature`: The signature produced by an authorized wallet signing the mint request.

##### \_canSignMintRequest

```solidity
function _canSignMintRequest(address signer) internal view virtual returns (bool);
```

* Returns whether a given address is authorized to sign mint requests.
* Parameter `signer`: the address that the contract checks is eligible to sign mint requests, or not.
## ERC1155Staking

```solidity
import "@thirdweb-dev/contracts/extension/Staking1155.sol";
```

The `Staking1155` smart contract extension implements NFT staking mechanism for ERC1155\. With this extension you can setup a staking contract for NFT holders of your ERC1155 Collection. Users can stake their NFTs and earn ERC20 tokens as rewards.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/Staking1155.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/extension/Staking1155.sol";
import "@thirdweb-dev/contracts/eip/interface/IERC20.sol";
 
contract MyContract is Staking1155 {
    // ERC20 Reward Token address. See {_mintRewards}.
    address public rewardToken;
 
    /**
     *  We store the contract deployer's address only for the purposes of the example
     *  in the code comment below.
     *
     *  Doing this is not necessary to use the `Staking1155` extension.
     */
    address public deployer;
 
    constructor(
        uint256 _defaultTimeUnit,
        uint256 _defaultRewardsPerUnitTime,
        address _stakingToken,
        address _rewardToken
    ) Staking1155(_stakingToken) {
        _setDefaultStakingCondition(_defaultTimeUnit, _defaultRewardsPerUnitTime);
 
        rewardToken = _rewardToken;
        deployer = msg.sender;
    }
 
    /**
     *  @dev    Mint/Transfer ERC20 rewards to the staker. Must override.
     *
     *  @param _staker    Address for sending rewards to.
     *  @param _rewards   Amount of tokens to be given out as reward.
     *
     */
    function _mintRewards(address _staker, uint256 _rewards) internal override {
        IERC20(rewardToken).transfer(_staker, _rewards);
    }
 
    // Returns whether staking restrictions can be set in given execution context.
    function _canSetStakeConditions() internal view override returns (bool) {
        return msg.sender == deployer;
    }
}
```

### Base Contracts Implementing This Extension

* [Staking1155Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/staking)

### Full API Reference

##### stake

```solidity
function stake(uint256 tokenId, uint256 amount) external;
```

* Lets a user stake a number of ERC1155 tokens of a specific token-Id.
* Parameter `tokenId`: ERC1155 token-id to stake.
* Parameter `amount`: Amount to stake.

##### withdraw

```solidity
function stake(uint256 tokenId, uint256 amount) external;
```

* Un-stake and withdraw NFTs from the contract.
* Parameter `tokenId`: ERC1155 token-id to withdraw.
* Parameter `amount`: Amount to withdraw.

##### claimRewards

```solidity
function claimRewards(uint256 tokenId) external;
```

* Claim accumulated rewards. This claim method allows for a pull mechanism where users must initiate claiming of rewards.
* Parameter `tokenId`: ERC1155 token-id to claim rewards for.

##### getStakeInfo

```solidity
function getStakeInfo(address staker) external view returns (uint256[] memory tokensStaked, uint256[] memory tokenAmounts, uint256 totalRewards)
```

* View number of NFTs staked and total rewards available for a user.
* Parameter `staker`: Account address of staker.

##### getStakeInfoForToken

```solidity
function getStakeInfoForToken(uint256 tokenId, address staker) external view returns (uint256 tokensStaked, uint256 rewards)
```

* View number of NFTs staked and total rewards available for a user.
* Parameter `tokenId`: ERC1155 token-id to view rewards for.
* Parameter `staker`: Account address of staker.

##### setRewardsPerUnitTime

```solidity
function setRewardsPerUnitTime(uint256 tokenId, uint256 rewardsPerUnitTime) external;
```

* Allows an authorized account to set rewards per unit of time. Interpreted as x rewards per second/per day/etc based on time-unit.
* Parameter `tokenId`: ERC1155 token-id to set this for.
* Parameter `rewardsPerUnitTime`: New rewards per unit time.

##### setTimeUnit

```solidity
function setTimeUnit(uint256 tokenId, uint256 timeUnit) external;
```

* Allows an authorized account to set time unit as a number of seconds. For e.g. 1 hour can be set as 3600 seconds - setting the reward frequency as _per hour_.
* Parameter `tokenId`: ERC1155 token-id to set this for.
* Parameter `timeUnit`: New time unit.

##### setDefaultRewardsPerUnitTime

```solidity
function setDefaultRewardsPerUnitTime(uint256 defaultRewardsPerUnitTime) external;
```

* Allows an authorized account to set rewards per unit of time applicable for all token-Ids by default.
* Parameter `defaultRewardsPerUnitTime`: New rewards per unit time.

##### setDefaultTimeUnit

```solidity
function setDefaultTimeUnit(uint256 defaultTimeUnit) external;
```

* Allows an authorized account to set time unit applicable for all token-Ids by default.
* Parameter `defaultTimeUnit`: New time unit.
## ERC1155Supply

```solidity
import "@thirdweb-dev/contracts/eip/interface/IERC721Supply.sol"
```

View all of the NFTs on the contract by implementing the `totalSupply` function in your ERC1155 contract.

#### info

This extension is an interface and requires all of the functions to be implemented

  
[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/eip/interface/IERC1155Supply.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

The [ERC1155Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/drop) contract comes with a `totalSupply`function that returns the total number of NFTs that have been minted in the collection (including tokens that have been burned).

This means you can already view the total supply of NFTs in the collection by implementing the `ERC1155Base` contract.

You can optionally override the functionality of this function as outlined below:

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/base-contracts/ERC71155Base.sol";
 
contract Contract is ERC1155Base {
    constructor(
        string memory _name,
        string memory _symbol
    )
        ERC1155Base(
            _name,
            _symbol
        )
    {}
 
    function totalSupply() public view override returns (uint256) {
        // Your custom implementation here (overriding this function is optional)
    }
 
}
```

### Base Contracts Implementing This Extension

* [ERC721Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/base)
* [ERC721DelayedReveal](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/delayed-reveal)
* [ERC721Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/drop)
* [ERC721LazyMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/lazy-mint)
* [ERC721SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/signature-mint)
## ERC20BatchMintable

```solidity
import "@thirdweb-dev/eip/interface/IERC20.sol"
import "@thirdweb-dev/contracts/extension/multicall.sol";
import "@thirdweb-dev/contracts/extension/interface/IMintableERC20.sol";
```

Enable minting multiple NFTs at once in a single transaction by Implementing [ERC20](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20), [IMintableERC20](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20BatchMintable), and [Multicall](https://portal.thirdweb.com/contracts/build/extensions/general/Multicall) extensions.

This is an extension which is detectable in the dashboard if the smart contract implements the[ERC20](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20), [Multicall](https://portal.thirdweb.com/contracts/build/extensions/general/Multicall) and [ERC20Mintable](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20BatchMintable) extensions.

### Usage

This is an example smart contract that will have ERC20BatchMintable detected on it in the dashboard. It also shows the function that is overridable to add custom logic.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/openzeppelin-presets/token/ERC20/ERC20.sol";
import "@thirdweb-dev/contracts/extension/interface/IMintableERC20.sol";
import "@thirdweb-dev/contracts/extension/Multicall.sol";
 
contract Contract is ERC20, IMintableERC20, Multicall {
    constructor(
        string memory _name,
        string memory _symbol
    )
        ERC20(
            _name,
            _symbol
        )
    {}
 
    function mintTo(address to, uint256 amount) external override returns (uint256) {
        // Your custom implementation here
    }
 
}
```

### Base Contracts Implementing This Extension

* [ERC20Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/base)
* [ERC20SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/signature-mint)
* [ERC20SignatureMintVote](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/signature-mint-vote)
* [ERC20Vote](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/base)
## ERC20

```solidity
import "@thirdweb-dev/contracts/eip/interface/IERC20.sol";
```

ERC20 is the standard for representing fungible tokens; where each token is of equal valuable and interchangeable.

#### info

This extension is an interface and requires all of the functions to be implemented

  
[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/eip/interface/IERC20.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/eip/interface/IERC20.sol";
 
contract Contract is IERC20 {
    constructor(
        string memory _name,
        string memory _symbol
    ) {}
 
    function totalSupply() external view returns (uint256) {
      // Your custom implementation here
    }
 
    function balanceOf(address who) external view returns (uint256) {
      // Your custom implementation here
    }
 
    function allowance(address owner, address spender) external view returns (uint256) {
      // Your custom implementation here
    }
 
    function transfer(address to, uint256 value) external returns (bool) {
      // Your custom implementation here
    }
 
    function approve(address spender, uint256 value) external returns (bool) {
      // Your custom implementation here
    }
 
    function transferFrom(
        address from,
        address to,
        uint256 value
    ) external returns (bool); {
      // Your custom implementation here
    }
}
```

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/openzeppelin-presets/token/ERC20/ERC20.sol) 

### Base Contracts Implementing This Extension

* [ERC20Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/base)
* [ERC20Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/drop)
* [ERC20DropVote](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/drop-vote)
* [ERC20SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/signature-mint)
* [ERC20SignatureMintVote](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/signature-mint-vote)
* [ERC20Vote](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/base)
## ERC20ClaimConditions

```solidity
import "@thirdweb-dev/contracts/eip/interface/IERC20.sol";
import "@thirdweb-dev/contracts/extension/DropSinglePhase.sol";
```

Allow other wallets to claim/mint tokens from the contract under the criteria of claim conditions by implementing [ERC20](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20) and [DropSinglePhase](https://portal.thirdweb.com/contracts/build/extensions/general/DropSinglePhase) extensions.

This is an extension which is detectable in the dashboard if the smart contract implements the[ERC20](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20) and [DropSinglePhase](https://portal.thirdweb.com/contracts/build/extensions/general/DropSinglePhase) extensions.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/DropSinglePhase.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from the extensions which make up the `ERC20ClaimConditions` detectable extension. The functions which are available to be (optionally) overridden are detailed.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/openzeppelin-presets/token/ERC20/ERC20.sol";
import "@thirdweb-dev/contracts/extension/DropSinglePhase.sol";
 
contract Contract is ERC20, DropSinglePhase {
    constructor(
        string memory _name,
        string memory _symbol
    )
        ERC20(
            _name,
            _symbol
        )
    {}
 
    function _canSetClaimConditions() internal view override returns (bool) {
        // Your custom implementation here
    }
 
    function _collectPriceOnClaim(
        address _primarySaleRecipient,
        uint256 _quantityToClaim,
        address _currency,
        uint256 _pricePerToken
    ) internal virtual override {
        // Your custom implementation here
    }
 
    function _transferTokensOnClaim(address _to, uint256 _quantityBeingClaimed)
        internal
        virtual
        override
        returns (uint256 startTokenId)
    {
        // Your custom implementation here
    }
}
```

### Base Contracts Implementing This Extension

* [ERC20Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/drop)
* [ERC20DropVote](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/drop-vote)
## ERC20Burnable

```solidity
import "@thirdweb-dev/contracts/extension/interface/IBurnableERC20.sol";
```

Support burning tokens by implementing the `IBurnableERC20` interface.

#### info

This extension is an interface and requires all of the functions to be implemented

  
[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/interface/IBurnableERC20.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/openzeppelin-presets/token/ERC20/ERC20.sol";
import "@thirdweb-dev/contracts/extension/interface/IBurnableERC20.sol";
 
contract Contract is ERC20, IBurnableERC20 {
    constructor(
        string memory _name,
        string memory _symbol
    )
        ERC20(
            _name,
            _symbol
        )
    {}
 
    function burn(uint256 amount) external override {
        // Your custom implementation here
    }
 
    function burnFrom(address account, uint256 amount) external override {
        // Your custom implementation here
    }
 
}
```

### Base Contracts Implementing This Extension

No base contracts implement this functionality by default.
## ERC20Mintable

```solidity
import "@thirdweb-dev/contracts/extension/interface/IMintableERC20.sol";
```

Enable the minting of new tokens by implementing the `IMintableERC20` interface.

#### info

This extension is an interface and requires all of the functions to be implemented

  
[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/interface/IMintableERC20.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/openzeppelin-presets/token/ERC20/ERC20.sol";
import "@thirdweb-dev/contracts/extension/interface/IMintableERC20.sol";
 
contract Contract is ERC20, IMintableERC20 {
    constructor(
        string memory _name,
        string memory _symbol
    )
        ERC20(
            _name,
            _symbol
        )
    {}
 
    function mintTo(address to, uint256 amount) external override {
        // Your custom implementation here
    }
}
```

### Base Contracts Implementing This Extension

* [ERC20Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/base)
* [ERC20SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/signature-mint)
* [ERC20SignatureMintVote](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/signature-mint-vote)
* [ERC20Vote](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/base)
## ERC721Permit

```solidity
import "@thirdweb-dev/contracts/eip/interface/IERC20Permit.sol";
```

Implementing the `ERC20Permit` extensions allows approvals to be made via signatures, as defined in[EIP-2612](https://eips.ethereum.org/EIPS/eip-2612%5BEIP-2612%5D).

The `permit` function can be used to change an account's ERC20 allowance (IERC20-allowance) by presenting a message signed by the account. By not relying on (IERC20-approve), the token holder account doesn't need to send a transaction and thus is not required to hold Ether at all.

#### info

This extension is an interface and requires all of the functions to be implemented

  
[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/eip/interface/IERC20Permit.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

The [ERC721A](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721) contract comes with a `totalPermit`function that returns the total number of NFTs that have been minted in the collection (including tokens that have been burned).

This means you can already view the total Permit of NFTs in the collection by implementing the `ERC721A` contract.

You can optionally override the functionality of this function as outlined below:

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/openzeppelin-presets/token/ERC20/ERC20.sol";
import "@thirdweb-dev/contracts/eip/interface/IERC20Permit.sol";
 
contract Contract is ERC20, IERC20Permit {
    constructor(
        string memory _name,
        string memory _symbol
    )
        ERC20(
            _name,
            _symbol
        )
    {}
 
    /**
     * @dev Sets `value` as the allowance of `spender` over ``owner``'s tokens,
     * given ``owner``'s signed approval.
     *
     * IMPORTANT: The same issues {IERC20-approve} has related to transaction
     * ordering also apply here.
     *
     * Emits an {Approval} event.
     *
     * Requirements:
     *
     * - `spender` cannot be the zero address.
     * - `deadline` must be a timestamp in the future.
     * - `v`, `r` and `s` must be a valid `secp256k1` signature from `owner`
     * over the EIP712-formatted function arguments.
     * - the signature must use ``owner``'s current nonce (see {nonces}).
     *
     * For more information on the signature format, see the
     * https://eips.ethereum.org/EIPS/eip-2612#specification[relevant EIP
     * section].
     */
    function permit(
        address owner,
        address spender,
        uint256 value,
        uint256 deadline,
        uint8 v,
        bytes32 r,
        bytes32 s
    ) external {
        // Your custom implementation here
    }
 
    /**
     * @dev Returns the current nonce for `owner`. This value must be
     * included whenever a signature is generated for {permit}.
     *
     * Every successful call to {permit} increases ``owner``'s nonce by one. This
     * prevents a signature from being used multiple times.
     */
    function nonces(address owner) external view returns (uint256) {
        // Your custom implementation here
    }
 
    /**
     * @dev Returns the domain separator used in the encoding of the signature for {permit}, as defined by {EIP712}.
     */
    // solhint-disable-next-line func-name-mixedcase
    function DOMAIN_SEPARATOR() external view returns (bytes32) {
        // Your custom implementation here
    }
 
}
```

### Base Contracts Implementing This Extension

* [ERC20Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/base)
* [ERC20Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/drop)
* [ERC20DropVote](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/drop-vote)
* [ERC20SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/signature-mint)
* [ERC20SignatureMintVote](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/signature-mint-vote)
* [ERC20Vote](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/base)
## ERC20SignatureMint

```solidity
import "@thirdweb-dev/contracts/extension/SignatureMintERC20.sol";
```

The `SignatureMintERC20` smart contract is an extension meant for distributing ERC20 tokens.

The ['signature minting'](https://portal.thirdweb.com/glossary/signature-based-minting) mechanism in the `SignatureMintERC20` extension uses [EIP-712](https://eips.ethereum.org/EIPS/eip-712), and is a way for a contract admin to authorize an external party's request to mint tokens on the admin's contract. At a high level, this means you can authorize some external party to mint tokens on your contract and specify what exactly will be minted by that external party.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/SignatureMintERC20.sol) 

### Usage

The `SignatureMintERC20` extension is an _abstract contract_, and expects you to implement the following functions by yourself:

| Name                                        | Type                    | Description                                                                                                                                     |
| ------------------------------------------- | ----------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------- |
| [\_canSignMintRequest](#full-api-reference) | internal view _virtual_ | Runs on every attempt to mint tokens with signature on the contract. Returns whether the signer is authorized to issue a signature for minting. |
| [mintWithSignature](#full-api-reference)    | external payable        | Mints tokens according to the provided mint request.                                                                                            |

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/base/ERC20Base.sol";
import "@thirdweb-dev/contracts/extension/SignatureMintERC20.sol";
import "@thirdweb-dev/contracts/lib/CurrencyTransferLib.sol";
 
contract ERC20SignatureMint is ERC20Base, SignatureMintERC20 {
    /*//////////////////////////////////////////////////////////////
                            Constructor
    //////////////////////////////////////////////////////////////*/
 
    constructor(address _defaultAdmin, string memory _name, string memory _symbol)
        ERC20Base(_defaultAdmin, _name, _symbol)
    {}
 
    /// @dev Mints tokens according to the provided mint request.
    function mintWithSignature(
        MintRequest calldata _req,
        bytes calldata _signature
    ) external payable virtual returns (address signer) {
        require(_req.quantity > 0, "Minting zero tokens.");
 
        // Verify and process payload.
        signer = _processRequest(_req, _signature);
 
        address receiver = _req.to;
 
        // Collect price
        _collectPriceOnClaim(
            _req.primarySaleRecipient,
            _req.quantity,
            _req.currency,
            _req.pricePerToken
        );
 
        // Mint tokens.
        _mint(receiver, _req.quantity);
 
        emit TokensMintedWithSignature(signer, receiver, _req);
    }
 
    /// @dev Returns whether a given address is authorized to sign mint requests.
    function _canSignMintRequest(address _signer)
        internal
        view
        virtual
        override
        returns (bool)
    {
        return _signer == owner();
    }
 
    /// @dev Collects and distributes the primary sale value of tokens being claimed.
    function _collectPriceOnClaim(
        address _primarySaleRecipient,
        uint256 _quantityToClaim,
        address _currency,
        uint256 _pricePerToken
    ) internal virtual {
        if (_pricePerToken == 0) {
            return;
        }
 
        uint256 totalPrice = (_quantityToClaim * _pricePerToken) / 1 ether;
        require(totalPrice > 0, "quantity too low");
 
        if (_currency == CurrencyTransferLib.NATIVE_TOKEN) {
            require(msg.value == totalPrice, "Must send total price.");
        }
 
        address saleRecipient = _primarySaleRecipient;
        CurrencyTransferLib.transferCurrency(
            _currency,
            msg.sender,
            saleRecipient,
            totalPrice
        );
    }
}
```

### Base Contracts Implementing This Extension

* [ERC20SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/signature-mint)
* [ERC20SignatureMintVote](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/signature-mint-vote)

### Full API reference

##### verify

```solidity
struct MintRequest {
    address to;
    address primarySaleRecipient;
    uint256 quantity;
    uint256 pricePerToken;
    address currency;
    uint128 validityStartTimestamp;
    uint128 validityEndTimestamp;
    bytes32 uid;
}
 
function verify(MintRequest calldata req, bytes calldata signature)
    public
    view
    returns (bool success, address signer)
```

* Verifies that a mint request is valid and signed by an authorized wallet.
* Parameter `req`: The mint request.  
   * `to`: The recipient of the tokens to mint.  
   * `primarySaleRecipient`: The recipient of the minted token's primary sales proceeds.  
   * `quantity`: The quantity of tokens to mint.  
   * `pricePerToken`: The price to pay per quantity of tokens minted.  
   * `currency`: The currency in which to pay the price per token minted.  
   * `validityStartTimestamp`: The unix timestamp after which the payload is valid.  
   * `validityEndTimestamp`: The unix timestamp at which the payload expires.  
   * `uid`: A unique identifier for the payload.
* Parameter `signature`: The signature produced by an authorized wallet signing the mint request.

##### mintWithSignature

```solidity
struct MintRequest {
    address to;
    address primarySaleRecipient;
    uint256 quantity;
    uint256 pricePerToken;
    address currency;
    uint128 validityStartTimestamp;
    uint128 validityEndTimestamp;
    bytes32 uid;
}
 
function mintWithSignature(MintRequest calldata req, bytes calldata signature)
    external
    payable
    returns (address signer)
```

* Mints tokens according to the provided mint request.
* Parameter `req`: The mint request.  
   * `to`: The recipient of the tokens to mint.  
   * `primarySaleRecipient`: The recipient of the minted token's primary sales proceeds.  
   * `quantity`: The quantity of tokens to mint.  
   * `pricePerToken`: The price to pay per quantity of tokens minted.  
   * `currency`: The currency in which to pay the price per token minted.  
   * `validityStartTimestamp`: The unix timestamp after which the payload is valid.  
   * `validityEndTimestamp`: The unix timestamp at which the payload expires.  
   * `uid`: A unique identifier for the payload.
* Parameter `signature`: The signature produced by an authorized wallet signing the mint request.

##### \_processRequest

```solidity
struct MintRequest {
    address to;
    address primarySaleRecipient;
    uint256 quantity;
    uint256 pricePerToken;
    address currency;
    uint128 validityStartTimestamp;
    uint128 validityEndTimestamp;
    bytes32 uid;
}
 
function _processRequest(MintRequest calldata req, bytes calldata signature)
    internal
    returns (address signer)
```

* Verifies a mint request and marks the request and signature as used.
* Parameter `req`: The mint request.  
   * `to`: The recipient of the tokens to mint.  
   * `primarySaleRecipient`: The recipient of the minted token's primary sales proceeds.  
   * `quantity`: The quantity of tokens to mint.  
   * `pricePerToken`: The price to pay per quantity of tokens minted.  
   * `currency`: The currency in which to pay the price per token minted.  
   * `validityStartTimestamp`: The unix timestamp after which the payload is valid.  
   * `validityEndTimestamp`: The unix timestamp at which the payload expires.  
   * `uid`: A unique identifier for the payload.
* Parameter `signature`: The signature produced by an authorized wallet signing the mint request.

##### \_recoverAddress

```solidity
struct MintRequest {
    address to;
    address primarySaleRecipient;
    uint256 quantity;
    uint256 pricePerToken;
    address currency;
    uint128 validityStartTimestamp;
    uint128 validityEndTimestamp;
    bytes32 uid;
}
 
function _recoverAddress(MintRequest calldata req, bytes calldata signature)
    internal
    view
    returns (address signer)
```

* Returns the address of the signer of the mint request.
* Parameter `req`: The mint request.  
   * `to`: The recipient of the tokens to mint.  
   * `primarySaleRecipient`: The recipient of the minted token's primary sales proceeds.  
   * `quantity`: The quantity of tokens to mint.  
   * `pricePerToken`: The price to pay per quantity of tokens minted.  
   * `currency`: The currency in which to pay the price per token minted.  
   * `validityStartTimestamp`: The unix timestamp after which the payload is valid.  
   * `validityEndTimestamp`: The unix timestamp at which the payload expires.  
   * `uid`: A unique identifier for the payload.
* Parameter `signature`: The signature produced by an authorized wallet signing the mint request.

##### \_canSignMintRequest

```solidity
function _canSignMintRequest(address signer) internal view virtual returns (bool);
```

* Returns whether a given address is authorized to sign mint requests.
* Parameter `signer`: the address that the contract checks is eligible to sign mint requests, or not.
## ERC20Staking

```solidity
import "@thirdweb-dev/contracts/extension/Staking20.sol";
```

The `Staking20` smart contract extension implements ERC20 staking mechanism. With this extension, you can set up a staking contract for holders of your ERC20 tokens. Users can stake their tokens and earn a different set of ERC20 tokens as rewards.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/Staking20.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/extension/Staking20.sol";
import "@thirdweb-dev/contracts/eip/interface/IERC20.sol";
import "@thirdweb-dev/contracts/eip/interface/IERC20Metadata.sol";
 
contract MyContract is Staking20 {
    // ERC20 Reward Token address. See {_mintRewards}.
    address public rewardToken;
 
    /**
     *  We store the contract deployer's address only for the purposes of the example
     *  in the code comment below.
     *
     *  Doing this is not necessary to use the `Staking20` extension.
     */
    address public deployer;
 
    constructor(
        uint256 _timeUnit,
        uint256 _rewardRatioNumerator,
        uint256 _rewardRatioDenominator,
        address _stakingToken,
        address _rewardToken,
        address _nativeTokenWrapper
    ) Staking20(
            _nativeTokenWrapper,
            _stakingToken,
            IERC20Metadata(_stakingToken).decimals(),
            IERC20Metadata(_rewardToken).decimals()
    ) {
        _setStakingCondition(_timeUnit, _rewardRatioNumerator, _rewardRatioDenominator);
 
        rewardToken = _rewardToken;
        deployer = msg.sender;
    }
 
    /**
     *  @dev    Mint/Transfer ERC20 rewards to the staker. Must override.
     *
     *  @param _staker    Address for sending rewards to.
     *  @param _rewards   Amount of tokens to be given out as reward.
     *
     */
    function _mintRewards(address _staker, uint256 _rewards) internal override {
        IERC20(rewardToken).transfer(_staker, _rewards);
    }
 
    // Returns whether staking restrictions can be set in given execution context.
    function _canSetStakeConditions() internal view override returns (bool) {
        return msg.sender == deployer;
    }
}
```

### Base Contracts Implementing This Extension

* [Staking20Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/staking)

### Full API Reference

##### stake

```solidity
function stake(uint256 amount) external;
```

* Lets a user stake a number of ERC20 tokens by passing in amount.
* Parameter `amount`: Amount of tokens to stake.

##### withdraw

```solidity
function withdraw(uint256 amount) external payable;
```

* Un-stake and withdraw tokens from the contract.
* Parameter `amount`: Amount of tokens to withdraw.

##### claimRewards

```solidity
function claimRewards() external;
```

* Claim accumulated rewards. This claim method allows for a pull mechanism where users must initiate claiming of rewards.

##### getStakeInfo

```solidity
function getStakeInfo(address staker) external view returns (uint256 tokensStaked, uint256 rewards);
```

* View number of tokens staked and total rewards available for a user.
* Parameter `staker`: Account address of staker.

##### setRewardRation

```solidity
function setRewardRatio(uint256 numerator, uint256 denominator) external
```

* Allows an authorized account to set reward ratio. Interpreted as (numerator/denominator) rewards per second/per day/etc based on time-unit. For e.g., ratio of 1/20 would mean 1 reward token for every 20 tokens staked.
* Parameter `numerator`: Reward ratio numerator.
* Parameter `denominator`: Reward ratio denominator.

##### setTimeUnit

```solidity
function setTimeUnit(uint256 timeUnit) external;
```

* Allows an authorized account to set time unit as a number of seconds. For e.g. 1 hour can be set as 3600 seconds - setting the reward frequency as _per hour_.
* Parameter `timeUnit`: New time unit.
## BaseAccount

```solidity
import "@thirdweb-dev/contracts/smart-wallet/utils/BaseAccount.sol";
```

The `BaseAccount` smart contract is an extension that is intended to be used when creating your own smart account contract which does not use one of our ready-to-use base-contract account smart contracts.

It is abstract, allowing you to customize the functionality for your use case.

#### info

This smart contract extension conforms to the `IAccount` interface which is detectable on the dashboard as the `SmartWallet` extension.

  
[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/prebuilts/account/utils/BaseAccount.sol) 

### Usage

The `BaseAccount` extension is an _abstract contract_, and expects you to implement the following functions by yourself:

| Name                | Type        | Description                                         |
| ------------------- | ----------- | --------------------------------------------------- |
| entryPoint          | public view | Return the current entryPoint used by this account. |
| \_validateSignature | internal    | Validate the signature is valid for this message.   |
| \_validateNonce     | internal    | Validate the nonce of the UserOperation.            |

This is an example factory smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/smart-wallet/utils/BaseAccountFactory.sol";
 
contract MyAccountFactory is BaseAccountFactory { ... }
```

### SDK Usage

This extension unlocks the use of the [smart account](wallet/smart-wallet) in the wallet SDK.

### Base Contracts Implementing This Extension

* [ManagedAccount](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/managed-account)
* [Account](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/account)

### Full API reference

##### getNonce

This method returns the next sequential nonce.

```solidity
function getNonce() public view virtual returns (uint256) {
    return entryPoint().getNonce(address(this), 0);
}
```

##### entryPoint

Subclass should return the current entryPoint used by this account.

```solidity
function entryPoint() public view virtual returns (IEntryPoint);
```

##### validateUserOp

Validate user's signature and nonce.

Subclass doesn't need to override this method. Instead, it should override the specific internal validation methods.

```solidity
function validateUserOp(
    UserOperation calldata userOp,
    bytes32 userOpHash,
    uint256 missingAccountFunds
) external virtual override returns (uint256 validationData) {
    _requireFromEntryPoint();
    validationData = _validateSignature(userOp, userOpHash);
    _validateNonce(userOp.nonce);
    _payPrefund(missingAccountFunds);
}
```

##### \_requireFromEntryPoint

Ensure the request comes from the known entrypoint.

```solidity
function _requireFromEntryPoint() internal view virtual {
    require(msg.sender == address(entryPoint()), "account: not from EntryPoint");
}
```

##### \_validateSignature

Validate the signature is valid for this message.

```solidity
function _validateSignature(UserOperation calldata userOp, bytes32 userOpHash)
    internal
    virtual
    returns (uint256 validationData);
```

##### userOp

Validate the userOp.signature field

##### userOpHash

the hash of the request, to check the signature against (also hashes the entrypoint and chain id)

#### Return value

signature and time-range of this operation:

* `sigAuthorizer` \- 0 for valid signature, 1 to mark signature failure, otherwise, an address of an "authorizer" contract.
* `validUntil` \- last timestamp this operation is valid. 0 for "indefinite"
* `validAfter` \- first timestamp this operation is valid.

##### \_validateNonce

Validate the nonce of the UserOperation. To limit the nonce to use sequenced UserOps only (no "out of order" UserOps):

* `require(nonce < type(uint64).max)`

For a hypothetical account that _requires_ the nonce to be out-of-order:

* `require(nonce & type(uint64).max == 0)`

The actual nonce uniqueness is managed by the EntryPoint, and thus no other action is needed by the account itself.

```solidity
function _validateNonce(uint256 nonce) internal view virtual {}
```

##### nonce

`uint256` representing the nonce to validate.

##### \_payPrefund

Sends to the entrypoint (msg.sender) the missing funds for this transaction. Subclass MAY override this method for better funds management

For example, send to the entryPoint more than the minimum required, so that in future transactions it will not be required to send again.

```solidity
function _payPrefund(uint256 missingAccountFunds) internal virtual {
    if (missingAccountFunds != 0) {
        (bool success, ) = payable(msg.sender).call{ value: missingAccountFunds, gas: type(uint256).max }("");
        (success);
        //ignore failure (its EntryPoint's job to verify, not account.)
    }
}
```

##### missingAccountFunds

The minimum value this method should send the entrypoint. This value MAY be zero, in case there is enough deposit, or the userOp has a paymaster.
## AccountExtension

```solidity
import "@thirdweb-dev/contracts/smart-wallet/utils/AccountExtension.sol";
```

The `AccountExtension` smart contract is the extension usable with the [Managed](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/managed-account) Account smart contracts. It is the _default extension_ for these base contracts. It includes the default logic for creating a smart account smart contract including the ability to:

* Have multiple owners
* Execute transactions (single and batched).
* Send and receive native tokens.
* Send and receive ERC-721 and ERC-1155 NFTs.
* Multicall-able.
* Store contract metadata.
  
[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/prebuilts/account/utils/AccountExtension.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/smart-wallet/utils/AccountExtension.sol";
 
contract MyManagedAccount is AccountExtension { ... }
```

### Inherited Extensions

This extension inherits from the following extensions:

* [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)
* [PermissionsEnumerable](https://portal.thirdweb.com/contracts/build/extensions/general/Permissions-enumerable)

### Base Contracts Implementing This Extension

* [ManagedAccount](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/managed-account)

### Full API reference

##### execute

Executes a transaction (called directly from an admin, or by entryPoint)

```solidity
function execute(
    address _target,
    uint256 _value,
    bytes calldata _calldata
) external virtual onlyAdminOrEntrypoint {
    _call(_target, _value, _calldata);
}
```

##### \_target

The target contract to call.

##### \_value

The amount of native tokens to send to the target contract.

##### \_calldata

The `bytes` calldata to send to the target contract.

##### executeBatch

Executes a sequence transaction (called directly from an admin, or by entryPoint)

```solidity
function executeBatch(
    address[] calldata _target,
    uint256[] calldata _value,
    bytes[] calldata _calldata
) external virtual onlyAdminOrEntrypoint {
    require(_target.length == _calldata.length && _target.length == _value.length, "Account: wrong array lengths.");
    for (uint256 i = 0; i < _target.length; i++) {
        _call(_target[i], _value[i], _calldata[i]);
    }
}
```

##### \_target

The target contracts to call.

##### \_value

The amounts of native tokens to send to the target contracts.

##### \_calldata

The `bytes` calldata to send to the target contracts.

##### \_call

Calls a target contract and reverts if it fails.

```solidity
function _call(
    address _target,
    uint256 value,
    bytes memory _calldata
) internal {
    (bool success, bytes memory result) = _target.call{ value: value }(_calldata);
    if (!success) {
        assembly {
            revert(add(result, 32), mload(result))
        }
    }
}
```

##### \_target

The target contract to call.

##### \_value

The amount of native tokens to send to the target contract.

##### \_calldata

The `bytes` calldata to send to the target contract.

##### \_canSetContractURI

Returns whether contract metadata can be set in the given execution context.

```solidity
function _canSetContractURI() internal view virtual override returns (bool) {
    return hasRole(DEFAULT_ADMIN_ROLE, msg.sender);
}
```

##### \_setupRole

Registers a signer in the factory.

```solidity
function _setupRole(bytes32 role, address account) internal virtual override {
    super._setupRole(role, account);
    if (role == SIGNER_ROLE && factory.code.length > 0) {
        IAccountFactory(factory).addSigner(account);
    }
}
```

##### role

The role to set up. Must be of type `bytes32`.

##### account

The address of the account to register for the role.

##### \_revokeRole

Un-registers a signer in the factory.

```solidity
function _revokeRole(bytes32 role, address account) internal virtual override {
    super._revokeRole(role, account);
    if (role == SIGNER_ROLE && factory.code.length > 0) {
        IAccountFactory(factory).removeSigner(account);
    }
}
```

##### role

The role to revoke. Must be of type `bytes32`.

##### account

The address of the account to un-register for the role.
## ERC1155Enumerable

```solidity
import "@thirdweb-dev/contracts/eip/interface/IERC1155Enumerable.sol";
```

View all of the NFTs in the collection and all the NFTs owned by a specific wallet address by implementing the `IERC1155Enumerable` interface.

#### info

This extension is an interface and requires all of the functions to be implemented

  
[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/eip/interface/IERC1155Enumerable.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/eip/ERC1155.sol";
import "@thirdweb-dev/contracts/eip/interface/IERC1155Enumerable.sol";
 
contract Contract is ERC1155, IERC1155Enumerable {
    constructor(
        string memory _name,
        string memory _symbol
    )
        ERC1155(
            _name,
            _symbol
        )
    {}
 
    function nextTokenIdToMint() external override view returns (uint256) {
        // Your custom implementation here
    }
}
```

### Base Contracts Implementing This Extension

* [ERC1155Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/base)
* [ERC1155DelayedReveal](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/delayed-reveal)
* [ERC1155Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/drop)
* [ERC1155LazyMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/lazy-mint)
* [ERC1155SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/signature-mint)
## BaseAccountFactory

```solidity
import "@thirdweb-dev/contracts/smart-wallet/utils/BaseAccountFactory.sol";
```

The `BaseAccountFactory` smart contract is an extension usable with the [Managed](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/managed-account) and [Non-Upgradable](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/account-factory) Account smart contracts. When creating your [Smart Account](https://portal.thirdweb.com/glossary/smart-wallet) account factory contract, inherit from this extension to include all of the base logic to create your factory.

#### info

This smart contract extension conforms to the `IAccountFactory` interface which is detectable on the dashboard as the `SmartWalletFactory` extension.

  
[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/prebuilts/account/utils/BaseAccountFactory.sol) 

### Usage

The `BaseAccountFactory` extension is an _abstract contract_, and expects you to implement the following functions by yourself:

| Name                | Type               | Description                                                                         |
| ------------------- | ------------------ | ----------------------------------------------------------------------------------- |
| \_initializeAccount | internal _virtual_ | Called in createAccount. Initializes the account contract created in createAccount. |

This is an example factory smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/smart-wallet/utils/BaseAccountFactory.sol";
 
contract MyAccountFactory is BaseAccountFactory { ... }
```

### SDK Usage

This extension unlocks the use of the [smart wallet](wallet/smart-wallet) in the wallet SDK.

### Base Contracts Implementing This Extension

* [ManagedAccountFactory](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/managed-account-factory)
* [AccountFactory](https://portal.thirdweb.com/contracts/build/base-contracts/erc-4337/account-factory)

### Full API reference

##### createAccount

Deploys a new Account for admin.

```solidity
function createAccount(address _admin, bytes calldata _data) external virtual override returns (address) {
    address impl = accountImplementation;
    bytes32 salt = _generateSalt(_admin, _data);
    address account = Clones.predictDeterministicAddress(impl, salt);
    if (account.code.length > 0) {
        return account;
    }
    account = Clones.cloneDeterministic(impl, salt);
    _initializeAccount(account, _admin, _data);
    emit AccountCreated(account, _admin);
    return account;
}
```

##### \_admin

The address to be set as default admin role for the contract. Must be of type `address`.

##### \_data

If extra storage variables are required in your account contract, override this function, abi encode the variables, pass them to this function as a `bytes` type.

##### addSigner

Callback function for an Account to register its signers.

```solidity
function addSigner(address _signer) external {
    address account = msg.sender;
    bool isAlreadyAccount = accountsOfSigner[_signer].add(account);
    bool isAlreadySigner = signersOfAccount[account].add(_signer);
    if (!isAlreadyAccount || !isAlreadySigner) {
        revert("AccountFactory: signer already added");
    }
    emit SignerAdded(account, _signer);
}
```

##### signer

The address of the signer to add to the account.

##### removeSigner

Callback function for an Account to un-register its signers.

```solidity
function removeSigner(address _signer) external {
    address account = msg.sender;
    bool isAccount = accountsOfSigner[_signer].remove(account);
    bool isSigner = signersOfAccount[account].remove(_signer);
    if (!isAccount || !isSigner) {
        revert("AccountFactory: signer not found");
    }
    emit SignerRemoved(account, _signer);
}
```

##### \_signer

The address of the signer to remove from the account.

##### getAddress

Returns the address of an Account that would be deployed with the given admin signer.

```solidity
function getAddress(address _adminSigner) public view returns (address) {
    bytes32 salt = _generateSalt(_admin, _data);
    return Clones.predictDeterministicAddress(accountImplementation, salt);
}
```

##### \_adminSigner

The admin signer for the account.

##### getSignersOfAccount

Returns all signers of an account.

```solidity
function getSignersOfAccount(address account) external view returns (address[] memory signers) {
    return signersOfAccount[account].values();
}
```

##### account

The address of the account to get the signers of.

##### getAccountsOfSigner

Returns all accounts that the given address is a signer of.

```solidity
function getAccountsOfSigner(address signer) external view returns (address[] memory accounts) {
    return accountsOfSigner[signer].values();
}
```

##### signer

The address of the signer to get the accounts of.

##### \_initializeAccount

Called in `createAccount`. Initializes the account contract created in `createAccount`.

```solidity
function _initializeAccount(
    address _account,
    address _admin,
    bytes calldata _data
) internal virtual;
```

##### \_account

The address of the smart account smart contract to initialize.

##### \_admin

The address to be set as default admin role for the contract. Must be of type `address`.

##### \_data

If extra storage variables are required in your account contract, abi encode the variables, pass them to this function as the `bytes` argument.

For example:

```solidity
function initializeAccount(
    address _admin,
    bytes calldata _data
) public override initializer {
    Account.initialize(_admin, _data);
}
```
## ERC721

```solidity
import "@thirdweb-dev/contracts/eip/ERC721A.sol";
```

ERC721 is the standard for representing NFTs (non-fungible tokens).

We recommend using the optimized [ERC721A](https://www.erc721a.org/) standard for integrating NFT functionality into your smart contract.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/eip/ERC721A.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/eip/ERC721A.sol";
 
contract Contract is ERC721A {
    constructor(
        string memory _name,
        string memory _symbol
    )
        ERC721A(
            _name,
            _symbol
        )
    {}
}
```

### Base Contracts Implementing This Extension

* [ERC721Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/base)
* [ERC721DelayedReveal](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/delayed-reveal)
* [ERC721Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/drop)
* [ERC721LazyMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/lazy-mint)
* [ERC721SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/signature-mint)
## ERC721BatchMintable

```solidity
import "@thirdweb-dev/eip/ERC721.sol"
import "@thirdweb-dev/contracts/extension/multicall.sol";
import "@thirdweb-dev/contracts/extension/interface/IMintableERC721.sol";
```

Enable minting multiple NFTs at once in a single transaction by Implementing [ERC721](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721), [IMintableERC721](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Mintable), and [Multicall](https://portal.thirdweb.com/contracts/build/extensions/general/Multicall) extensions.

This is an extension which is detectable in the dashboard if the smart contract implements the[ERC721](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721), [Multicall](https://portal.thirdweb.com/contracts/build/extensions/general/Multicall) and [ERC721Mintable](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Mintable) extensions.

### Usage

This is an example smart contract which will have ERC721BatchMintable detected on it in the dashboard. It also shows the functions which can be (optionally) overridden to add custom logic.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/eip/ERC721A.sol";
import "@thirdweb-dev/contracts/extension/interface/IMintableERC721.sol";
import "@thirdweb-dev/contracts/extension/Multicall.sol";
 
contract Contract is ERC721A, IMintableERC721, Multicall {
    constructor(
        string memory _name,
        string memory _symbol
    )
        ERC721A(
            _name,
            _symbol
        )
    {}
 
    function mintTo(address to, string calldata uri) external override returns (uint256) {
        // Your custom implementation here
    }
 
}
```

### Base Contracts Implementing This Extension

* [ERC721Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/base)
* [ERC721SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/signature-mint)
## ERC721ClaimCustom

```solidity
import "@thirdweb-dev/contracts/eip/ERC721.sol";
import "@thirdweb-dev/contracts/extension/interface/IClaimableERC721.sol";
```

Allow other wallets to claim/mint tokens that you have Lazy Minted by implementing [ERC721](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721) and [ERC721Claimable](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Claimable) extensions.

This is an extension which is detectable in the dashboard if the smart contract implements the[ERC721](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721) and [ERC721Claimable](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Claimable) extensions.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/interface/IClaimableERC721.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from the extensions which make up the `ERC721ClaimCustom` detectable extension. The functions which are available to be overridden (optionally) are also detailed.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/eip/ERC721A.sol";
import "@thirdweb-dev/contracts/extension/LazyMint.sol";
import "@thirdweb-dev/contracts/extension/interface/IClaimableERC721.sol";
 
contract Contract is ERC721A, LazyMint, IClaimableERC721 {
    constructor(
        string memory _name,
        string memory _symbol
    )
        ERC721A(
            _name,
            _symbol
        )
    {}
 
    function _canLazyMint() internal view override returns (bool) {
        // Your custom implementation here
    }
 
    function _canSetClaimConditions() internal view override returns (bool) {
        // Your custom implementation here
    }
 
    function _collectPriceOnClaim(
        address _primarySaleRecipient,
        uint256 _quantityToClaim,
        address _currency,
        uint256 _pricePerToken
    ) internal virtual override {
        // Your custom implementation here
    }
 
    function _transferTokensOnClaim(address _to, uint256 _quantityBeingClaimed)
        internal
        virtual
        override
        returns (uint256 startTokenId)
    {
        // Your custom implementation here
    }
 
    function claim(address _receiver, uint256 _quantity) external payable override {
        // Your custom implementation here
    }
 
    function verifyClaim(address _claimer, uint256 _quantity) external view override {
        // Your custom implementation here
    }
}
```

### Base Contracts Implementing This Extension

* [ERC721DelayedReveal](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/delayed-reveal)
* [ERC721LazyMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/lazy-mint)
## ERC721Burnable

```solidity
import "@thirdweb-dev/contracts/extension/interface/IBurnableERC721.sol";
```

ERC721Burnable allows the NFTs in the contract to be burned (transferred to a non-recoverable address).

#### info

This extension is an interface and requires all of the functions to be implemented

  
[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/interface/IBurnableERC721.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/eip/ERC721A.sol";
import "@thirdweb-dev/contracts/extension/interface/IBurnableERC721.sol";
 
contract Contract is ERC721A, IBurnableERC721 {
    constructor(
        string memory _name,
        string memory _symbol
    )
        ERC721A(
            _name,
            _symbol
        )
    {}
 
    function burn(uint256 tokenId) external {
        // Your custom implementation here
    }
}
```

### Base Contracts Implementing This Extension

* [ERC721Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/base)
* [ERC721DelayedReveal](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/delayed-reveal)
* [ERC721Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/drop)
* [ERC721LazyMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/lazy-mint)
* [ERC721SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/signature-mint)
## ERC721ClaimConditions

```solidity
import "@thirdweb-dev/contracts/eip/ERC721.sol";
import "@thirdweb-dev/contracts/extension/DropSinglePhase.sol";
```

Allow other wallets to claim/mint tokens from the contract under the criteria of claim conditions by implementing [ERC721](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721) and [DropSinglePhase](https://portal.thirdweb.com/contracts/build/extensions/general/DropSinglePhase) extensions.

This is an extension which is detectable in the dashboard if the smart contract implements the[ERC721](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721) and [DropSinglePhase](https://portal.thirdweb.com/contracts/build/extensions/general/DropSinglePhase) extensions.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/DropSinglePhase.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from the extensions which make up the `ERC721ClaimConditions` detectable extension. The functions which are available to be (optionally) overridden are detailed.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/eip/ERC721A.sol";
import "@thirdweb-dev/contracts/extension/LazyMint.sol";
import "@thirdweb-dev/contracts/extension/DropSinglePhase.sol";
 
contract Contract is ERC721A, LazyMint, DropSinglePhase {
    constructor(
        string memory _name,
        string memory _symbol
    )
        ERC721A(
            _name,
            _symbol
        )
    {}
 
    function _canLazyMint() internal view override returns (bool) {
        // Your custom implementation here
    }
 
    function _canSetClaimConditions() internal view override returns (bool) {
        // Your custom implementation here
    }
 
    function _collectPriceOnClaim(
        address _primarySaleRecipient,
        uint256 _quantityToClaim,
        address _currency,
        uint256 _pricePerToken
    ) internal virtual override {
        // Your custom implementation here
    }
 
    function _transferTokensOnClaim(address _to, uint256 _quantityBeingClaimed)
        internal
        virtual
        override
        returns (uint256 startTokenId)
    {
        // Your custom implementation here
    }
}
```

### Base Contracts Implementing This Extension

* [ERC721Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/drop)
## ERC721Claimable

```solidity
import "@thirdweb-dev/contracts/extension/interface/IClaimableERC721.sol";
```

Allow other wallets to **claim** NFTs that you have lazy-minted.

This is not an extension which is detectable on the dashboard without also inheriting from other extensions.

It is recommended to use this extension alongside the [LazyMint](https://portal.thirdweb.com/contracts/build/extensions/general/LazyMint) extension.

#### info

This extension is an interface and requires all of the functions to be implemented

  
[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/interface/IClaimableERC721.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/eip/ERC721A.sol";
import "@thirdweb-dev/contracts/extension/interface/IClaimableERC721.sol";
 
contract Contract is ERC721A, IClaimableERC721 {
    constructor(
        string memory _name,
        string memory _symbol
    )
        ERC721A(
            _name,
            _symbol
        )
    {}
 
    function _canLazyMint() internal view override returns (bool) {
        // Your custom implementation here
    }
 
    function verifyClaim(address _claimer, uint256 _quantity) public view virtual {
        // Your custom implementation here
    }
 
    function claim(address _receiver, uint256 _quantity) public payable virtual {
        // Your custom implementation here
    }
}
```

### Base Contracts Implementing This Extension

This extension is used as part of the [ERC721ClaimCustom](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721ClaimCustom) extension. The base contracts which have ERC721ClaimCustom detected on them will also implement ERC721Claimable.

* [ERC721DelayedReveal](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/delayed-reveal)
* [ERC721LazyMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/lazy-mint)
## ERC721ClaimPhases

```solidity
import "@thirdweb-dev/contracts/eip/ERC721.sol";
import "@thirdweb-dev/contracts/extension/Drop.sol";
```

Allow other wallets to claim/mint tokens from the contract under the criteria of claim conditions by implementing [ERC721](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721) and [Drop](https://portal.thirdweb.com/contracts/build/extensions/general/Drop) extensions.

Unlike [ERC721ClaimCondition](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721ClaimConditions), this extension allows you to set _multiple_ [claim phases](https://portal.thirdweb.com/glossary/claim-phases).

This is an extension which is detectable in the dashboard if the smart contract implements the[ERC721](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721) and [Drop](https://portal.thirdweb.com/contracts/build/extensions/general/Drop) extensions.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/Drop.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from the extensions which make up the `ERC721ClaimPhases` detectable extension. The functions which are available to be (optionally) overridden are also detailed.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/eip/ERC721A.sol";
import "@thirdweb-dev/contracts/extension/LazyMint.sol";
import "@thirdweb-dev/contracts/extension/Drop.sol";
 
contract Contract is ERC721A, LazyMint, Drop {
    constructor(
        string memory _name,
        string memory _symbol
    )
        ERC721A(
            _name,
            _symbol
        )
    {}
 
    function _canLazyMint() internal view override returns (bool) {
        // Your custom implementation here
    }
 
    /// @dev Runs before every `claim` function call.
    function _beforeClaim(
        uint256 _tokenId,
        address _receiver,
        uint256 _quantity,
        address _currency,
        uint256 _pricePerToken,
        AllowlistProof calldata _allowlistProof,
        bytes memory _data
    ) internal virtual override {
      // Your custom implementation logic here
    }
 
    /// @dev Runs after every `claim` function call.
    function _afterClaim(
        uint256 _tokenId,
        address _receiver,
        uint256 _quantity,
        address _currency,
        uint256 _pricePerToken,
        AllowlistProof calldata _allowlistProof,
        bytes memory _data
    ) internal virtual override {
      // Your custom implementation logic here
    }
 
    /// @dev Collects and distributes the primary sale value of tokens being claimed.
    function _collectPriceOnClaim(
        address _primarySaleRecipient,
        uint256 _quantityToClaim,
        address _currency,
        uint256 _pricePerToken
    ) internal virtual override {
        if (_pricePerToken == 0) {
            return;
        }
 
        uint256 totalPrice = (_quantityToClaim * _pricePerToken) / 1 ether;
        require(totalPrice > 0, "quantity too low");
 
        if (_currency == CurrencyTransferLib.NATIVE_TOKEN) {
            require(msg.value == totalPrice, "Must send total price.");
        }
 
        address saleRecipient = _primarySaleRecipient;
        CurrencyTransferLib.transferCurrency(
            _currency,
            msg.sender,
            saleRecipient,
            totalPrice
        );
    }
 
    /// @dev Transfers the tokens being claimed.
    function _transferTokensOnClaim(address _to, uint256 _quantityBeingClaimed)
        internal
        virtual
        override
        returns (uint256)
    {
        _mint(_to, _quantityBeingClaimed);
        return 0;
    }
 
    /// @dev Checks whether platform fee info can be set in the given execution context.
    function _canSetClaimConditions()
        internal
        view
        virtual
        override
        returns (bool)
    {
        return msg.sender == owner();
    }
}
```

### Base Contracts Implementing This Extension

None of the base contracts implement this extension.
## ERC721Enumerable

```solidity
import "@thirdweb-dev/contracts/eip/interface/IERC721Enumerable.sol";
```

View all of the NFTs owned by a specific wallet address by implementing the `IERC721Enumerable` interface.

#### info

This extension is an interface and requires all of the functions to be implemented

  
[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/eip/interface/IERC721Enumerable.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/eip/ERC721A.sol";
import "@thirdweb-dev/contracts/eip/interface/IERC721Enumerable.sol";
 
contract Contract is ERC721A, IERC721Enumerable {
    constructor(
        string memory _name,
        string memory _symbol
    )
        ERC721A(
            _name,
            _symbol
        )
    {}
 
    function tokenByIndex(uint256 _index) external view override returns (uint256) {
        // Your custom implementation here
    }
 
    function tokenOfOwnerByIndex(address _owner, uint256 _index) external view override returns (uint256) {
        // Your custom implementation here
    }
}
```

### Base Contracts Implementing This Extension

* [ERC721Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/base)
* [ERC721DelayedReveal](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/delayed-reveal)
* [ERC721Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/drop)
* [ERC721LazyMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/lazy-mint)
* [ERC721SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/signature-mint)
## ERC721Mintable

```solidity
import "@thirdweb-dev/contracts/extension/interface/IMintableERC721.sol";
```

Enable new NFTs to be minted into the collection by implementing the `IMintableERC721` interface on your ERC721(A) contract.

#### info

This extension is an interface and requires all of the functions to be implemented

  
[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/interface/IMintableERC721.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/eip/ERC721A.sol";
import "@thirdweb-dev/contracts/extension/interface/IMintableERC721.sol";
 
contract Contract is ERC721A, IMintableERC721 {
    constructor(
        string memory _name,
        string memory _symbol
    )
        ERC721A(
            _name,
            _symbol
        )
    {}
 
    function mintTo(address to, string calldata uri) external override returns (uint256) {
        // Your custom implementation here
    }
 
}
```

### Base Contracts Implementing This Extension

* [ERC721Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/base)
* [ERC721DelayedReveal](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/delayed-reveal)
* [ERC721Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/drop)
* [ERC721LazyMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/lazy-mint)
* [ERC721SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/signature-mint)
## ERC721Revealable

```solidity
import "@thirdweb-dev/contracts/eip/ERC721.sol";
import "@thirdweb-dev/contracts/extension/DelayedReveal.sol";
```

Create batches of ['delayed-reveal'](https://portal.thirdweb.com/glossary/delayed-reveal) NFTs that can be revealed at a later date after they have been minted and claimed.

This is an extension which is detectable in the dashboard if the smart contract implements the[ERC721](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721) and [DelayedReveal](https://portal.thirdweb.com/contracts/build/extensions/general/DelayedReveal) extensions.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/DelayedReveal.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/eip/ERC721A.sol";
import "@thirdweb-dev/contracts/extension/LazyMint.sol";
import "@thirdweb-dev/contracts/extension/DelayedReveal.sol";
 
contract Contract is ERC721A, LazyMint, DelayedReveal {
    constructor(
        string memory _name,
        string memory _symbol
    )
        ERC721A(
            _name,
            _symbol
        )
    {}
  function reveal(uint256 _index, bytes calldata _key)
        external
        override
        returns (string memory revealedURI)
    {
      // Your custom implementation here
    }
 
    function _canLazyMint() internal view override returns (bool) {
        // Your custom implementation here
    }
}
```

### Base Contracts Implementing This Extension

* [ERC721DelayedReveal](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/delayed-reveal)
* [ERC721Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/drop)
## ERC721Supply

```solidity
import "@thirdweb-dev/contracts/eip/interface/IERC721Supply.sol"
```

View all of the NFTs from the collection by implementing the `totalSupply` function on your ERC721(A) contract.

#### info

This extension is an interface and requires all of the functions to be implemented

  
[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/eip/interface/IERC721Supply.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

The [ERC721A](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721) contract comes with a `totalSupply`function that returns the total number of NFTs that have been minted in the collection (including tokens that have been burned).

This means you can already view the total supply of NFTs in the collection by implementing the `ERC721A` contract.

You can optionally override the functionality of this function as outlined below:

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/eip/ERC721A.sol";
 
contract Contract is ERC721A {
    constructor(
        string memory _name,
        string memory _symbol
    )
        ERC721A(
            _name,
            _symbol
        )
    {}
 
    function totalSupply() public view override returns (uint256) {
        // Your custom implementation here (overriding this function is optional)
    }
 
}
```

### Base Contracts Implementing This Extension

* [ERC721Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/base)
* [ERC721DelayedReveal](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/delayed-reveal)
* [ERC721Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/drop)
* [ERC721LazyMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/lazy-mint)
* [ERC721SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/signature-mint)
## ERC721Staking

```solidity
import "@thirdweb-dev/contracts/extension/Staking721.sol";
```

The `Staking721` smart contract extension implements NFT staking mechanism. With this extension you can setup a staking contract for NFT holders of your ERC721 Collection. Users can stake their NFTs and earn ERC20 tokens as rewards.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/Staking721.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/extension/Staking721.sol";
import "@thirdweb-dev/contracts/eip/interface/IERC20.sol";
 
contract MyContract is Staking721 {
    // ERC20 Reward Token address. See {_mintRewards}.
    address public rewardToken;
 
    /**
     *  We store the contract deployer's address only for the purposes of the example
     *  in the code comment below.
     *
     *  Doing this is not necessary to use the `Staking721` extension.
     */
    address public deployer;
 
    constructor(
        uint256 _timeUnit,
        uint256 _rewardsPerUnitTime,
        address _stakingToken,
        address _rewardToken
    ) Staking721(_stakingToken) {
        _setStakingCondition(_timeUnit, _rewardsPerUnitTime);
 
        rewardToken = _rewardToken;
        deployer = msg.sender;
    }
 
    /**
     *  @dev    Mint/Transfer ERC20 rewards to the staker. Must override.
     *
     *  @param _staker    Address for sending rewards to.
     *  @param _rewards   Amount of tokens to be given out as reward.
     *
     */
    function _mintRewards(address _staker, uint256 _rewards) internal override {
        IERC20(rewardToken).transfer(_staker, _rewards);
    }
 
    // Returns whether staking restrictions can be set in given execution context.
    function _canSetStakeConditions() internal view override returns (bool) {
        return msg.sender == deployer;
    }
}
```

### Base Contracts Implementing This Extension

* [Staking721Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/staking)

### Full API Reference

##### stake

```solidity
function stake(uint256[] calldata tokenIds) external;
```

* Lets a user stake a number of ERC721 tokens by passing in token-Ids.
* Parameter `tokenIds`: List of token-Ids to stake.

##### withdraw

```solidity
function withdraw(uint256[] calldata tokenIds) external;
```

* Un-stake and withdraw NFTs from the contract.
* Parameter `tokenIds`: List of token-Ids to withdraw.

##### claimRewards

```solidity
function claimRewards() external;
```

* Claim accumulated rewards. This claim method allows for a pull mechanism where users must initiate claiming of rewards.

##### getStakeInfo

```solidity
function getStakeInfo(address staker) external view returns (uint256 tokensStaked, uint256 rewards);
```

* View number of NFTs staked and total rewards available for a user.
* Parameter `staker`: Account address of staker.

##### setRewardsPerUnitTime

```solidity
function setRewardsPerUnitTime(uint256 rewardsPerUnitTime) external;
```

* Allows an authorized account to set rewards per unit of time. Interpreted as x rewards per second/per day/etc based on time-unit.
* Parameter `rewardsPerUnitTime`: New rewards per unit time.

##### setTimeUnit

```solidity
function setTimeUnit(uint256 timeUnit) external;
```

* Allows an authorized account to set time unit as a number of seconds. For e.g. 1 hour can be set as 3600 seconds - setting the reward frequency as _per hour_.
* Parameter `timeUnit`: New time unit.
## ERC721SignatureMint

```solidity
import "@thirdweb-dev/contracts/extension/SignatureMintERC721.sol";
```

The `SignatureMintERC721` smart contract is an extension meant for distributing ERC721 tokens.

The ['signature minting'](https://portal.thirdweb.com/glossary/signature-based-minting) mechanism in the `SignatureMintERC721` extension uses [EIP-712](https://eips.ethereum.org/EIPS/eip-712), and is a way for a contract admin to authorize an external party's request to mint tokens on the admin's contract. At a high level, this means you can authorize some external party to mint tokens on your contract, and specify what exactly will be minted by that external party.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/SignatureMintERC721.sol) 

### Usage

The `SignatureMintERC721` extension is an _abstract contract_, and expects you to implement the following functions by yourself:

| Name                                                                                                       | Type                    | Description                                                                                                                                     |
| ---------------------------------------------------------------------------------------------------------- | ----------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------- |
| [\_canSignMintRequest](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721SignatureMint) | internal view _virtual_ | Runs on every attempt to mint tokens with signature on the contract. Returns whether the signer is authorized to issue a signature for minting. |
| [mintWithSignature](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721SignatureMint)    | external payable        | Mints tokens according to the provided mint request.                                                                                            |

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/base/ERC721Base.sol";
import "@thirdweb-dev/contracts/extension/SignatureMintERC721.sol";
import "@thirdweb-dev/contracts/lib/CurrencyTransferLib.sol";
 
contract ERC721SignatureMint is ERC721Base, SignatureMintERC721 {
    constructor(
        address _defaultAdmin,
        string memory _name,
        string memory _symbol,
        address _royaltyRecipient,
        uint128 _royaltyBps
    ) ERC721Base(_defaultAdmin, _name, _symbol, _royaltyRecipient, _royaltyBps) {}
 
    /// @dev Mints tokens according to the provided mint request.
    function mintWithSignature(
        MintRequest calldata _req,
        bytes calldata _signature
    ) external payable virtual override returns (address signer) {
        require(_req.quantity == 1, "quantity must be 1");
 
        uint256 tokenIdToMint = nextTokenIdToMint();
 
        // Verify and process payload.
        signer = _processRequest(_req, _signature);
 
        address receiver = _req.to;
 
        // Collect price
        _collectPriceOnClaim(
            _req.primarySaleRecipient,
            _req.quantity,
            _req.currency,
            _req.pricePerToken
        );
 
        // Mint tokens.
        _setTokenURI(tokenIdToMint, _req.uri);
        _safeMint(receiver, _req.quantity);
 
        emit TokensMintedWithSignature(signer, receiver, tokenIdToMint, _req);
    }
 
    /// @dev Returns whether a given address is authorized to sign mint requests.
    function _canSignMintRequest(address _signer)
        internal
        view
        virtual
        override
        returns (bool)
    {
        return _signer == owner();
    }
 
    /// @dev Collects and distributes the primary sale value of tokens being claimed.
    function _collectPriceOnClaim(
        address _primarySaleRecipient,
        uint256 _quantityToClaim,
        address _currency,
        uint256 _pricePerToken
    ) internal virtual {
        if (_pricePerToken == 0) {
            return;
        }
 
        uint256 totalPrice = (_quantityToClaim * _pricePerToken) / 1 ether;
        require(totalPrice > 0, "quantity too low");
 
        if (_currency == CurrencyTransferLib.NATIVE_TOKEN) {
            require(msg.value == totalPrice, "Must send total price.");
        }
 
        address saleRecipient = _primarySaleRecipient;
        CurrencyTransferLib.transferCurrency(
            _currency,
            msg.sender,
            saleRecipient,
            totalPrice
        );
    }
}
```

### Base Contracts Implementing This Extension

* [ERC721SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/signature-mint)

### Full API reference

##### verify

```solidity
struct MintRequest {
    address to;
    address royaltyRecipient;
    uint256 royaltyBps;
    address primarySaleRecipient;
    string uri;
    uint256 quantity;
    uint256 pricePerToken;
    address currency;
    uint128 validityStartTimestamp;
    uint128 validityEndTimestamp;
    bytes32 uid;
}
 
function verify(MintRequest calldata req, bytes calldata signature)
    public
    view
    returns (bool success, address signer)
```

* Verifies that a mint request is valid and signed by an authorized wallet.
* Parameter `req`: The mint request.  
   * `to`: The recipient of the tokens to mint.  
   * `royaltyRecipient`: The recipient of the minted token's secondary sales royalties.  
   * `royaltyBps`: The percentage of the minted token's secondary sales to take as royalties.  
   * `primarySaleRecipient`: The recipient of the minted token's primary sales proceeds.  
   * `uri`: The metadata URI of the token to mint.  
   * `quantity`: The quantity of tokens to mint.  
   * `pricePerToken`: The price to pay per quantity of tokens minted.  
   * `currency`: The currency in which to pay the price per token minted.  
   * `validityStartTimestamp`: The unix timestamp after which the payload is valid.  
   * `validityEndTimestamp`: The unix timestamp at which the payload expires.  
   * `uid`: A unique identifier for the payload.
* Parameter `signature`: The signature produced by an authorized wallet signing the mint request.

##### mintWithSignature

```solidity
struct MintRequest {
    address to;
    address royaltyRecipient;
    uint256 royaltyBps;
    address primarySaleRecipient;
    string uri;
    uint256 quantity;
    uint256 pricePerToken;
    address currency;
    uint128 validityStartTimestamp;
    uint128 validityEndTimestamp;
    bytes32 uid;
}
 
function mintWithSignature(MintRequest calldata req, bytes calldata signature)
    external
    payable
    returns (address signer)
```

* Mints tokens according to the provided mint request.
* Parameter `req`: The mint request.  
   * `to`: The recipient of the tokens to mint.  
   * `royaltyRecipient`: The recipient of the minted token's secondary sales royalties.  
   * `royaltyBps`: The percentage of the minted token's secondary sales to take as royalties.  
   * `primarySaleRecipient`: The recipient of the minted token's primary sales proceeds.  
   * `uri`: The metadata URI of the token to mint.  
   * `quantity`: The quantity of tokens to mint.  
   * `pricePerToken`: The price to pay per quantity of tokens minted.  
   * `currency`: The currency in which to pay the price per token minted.  
   * `validityStartTimestamp`: The unix timestamp after which the payload is valid.  
   * `validityEndTimestamp`: The unix timestamp at which the payload expires.  
   * `uid`: A unique identifier for the payload.
* Parameter `signature`: The signature produced by an authorized wallet signing the mint request.

##### \_processRequest

```solidity
struct MintRequest {
    address to;
    address royaltyRecipient;
    uint256 royaltyBps;
    address primarySaleRecipient;
    string uri;
    uint256 quantity;
    uint256 pricePerToken;
    address currency;
    uint128 validityStartTimestamp;
    uint128 validityEndTimestamp;
    bytes32 uid;
}
 
function _processRequest(MintRequest calldata req, bytes calldata signature)
    internal
    returns (address signer)
```

* Verifies a mint request and marks the request and signature as used.
* Parameter `req`: The mint request.  
   * `to`: The recipient of the tokens to mint.  
   * `royaltyRecipient`: The recipient of the minted token's secondary sales royalties.  
   * `royaltyBps`: The percentage of the minted token's secondary sales to take as royalties.  
   * `primarySaleRecipient`: The recipient of the minted token's primary sales proceeds.  
   * `uri`: The metadata URI of the token to mint.  
   * `quantity`: The quantity of tokens to mint.  
   * `pricePerToken`: The price to pay per quantity of tokens minted.  
   * `currency`: The currency in which to pay the price per token minted.  
   * `validityStartTimestamp`: The unix timestamp after which the payload is valid.  
   * `validityEndTimestamp`: The unix timestamp at which the payload expires.  
   * `uid`: A unique identifier for the payload.
* Parameter `signature`: The signature produced by an authorized wallet signing the mint request.

##### \_recoverAddress

```solidity
struct MintRequest {
    address to;
    address royaltyRecipient;
    uint256 royaltyBps;
    address primarySaleRecipient;
    string uri;
    uint256 quantity;
    uint256 pricePerToken;
    address currency;
    uint128 validityStartTimestamp;
    uint128 validityEndTimestamp;
    bytes32 uid;
}
 
function _recoverAddress(MintRequest calldata req, bytes calldata signature)
    internal
    view
    returns (address signer)
```

* Returns the address of the signer of the mint request.
* Parameter `req`: The mint request.  
   * `to`: The recipient of the tokens to mint.  
   * `royaltyRecipient`: The recipient of the minted token's secondary sales royalties.  
   * `royaltyBps`: The percentage of the minted token's secondary sales to take as royalties.  
   * `primarySaleRecipient`: The recipient of the minted token's primary sales proceeds.  
   * `uri`: The metadata URI of the token to mint.  
   * `quantity`: The quantity of tokens to mint.  
   * `pricePerToken`: The price to pay per quantity of tokens minted.  
   * `currency`: The currency in which to pay the price per token minted.  
   * `validityStartTimestamp`: The unix timestamp after which the payload is valid.  
   * `validityEndTimestamp`: The unix timestamp at which the payload expires.  
   * `uid`: A unique identifier for the payload.
* Parameter `signature`: The signature produced by an authorized wallet signing the mint request.

##### \_canSignMintRequest

```solidity
function _canSignMintRequest(address signer) internal view virtual returns (bool);
```

* Returns whether a given address is authorized to sign mint requests.
* Parameter `signer`: the address that the contract checks is eligible to sign mint requests, or not.
## ContractMetadata

```solidity
import "@thirdweb-dev/contracts/extension/ContractMetadata.sol";
```

The `ContractMetadata` smart contract is an extension usable with any smart contract. It lets you define metadata for your smart contract. Additionally, `ContractMetadata` is necessary to enable [royalties](https://portal.thirdweb.com/contracts/build/extensions/general/Royalty) on NFT contracts on OpenSea.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/ContractMetadata.sol) 

### Usage

The `ContractMetadata` extension is an _abstract contract_, and expects you to implement the following functions by yourself:

| Name                                                                                                                        | Type                    | Returns | Description                                                                                                                             |
| --------------------------------------------------------------------------------------------------------------------------- | ----------------------- | ------- | --------------------------------------------------------------------------------------------------------------------------------------- |
| [\_canSetContractURI](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata#%5Fcansetcontracturi) | internal view _virtual_ | bool    | Runs on every attempt to set the metadata of the contract. Returns whether contract metadata can be set in the given execution context. |

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/extension/ContractMetadata.sol";
 
contract MyContract is ContractMetadata {
 
    /**
     *  We store the contract deployer's address only for the purposes of the example
     *  in the code comment below.
     *
     *  Doing this is not necessary to use the `ContractMetadata` extension.
     */
    address public deployer;
 
    constructor() {
        deployer = msg.sender;
    }
 
    /**
     *  This function returns who is authorized to set the metadata for your metadata.
     *
     *  As an EXAMPLE, we'll only allow the contract deployer to set the contract's metadata.
     *
     *  You MUST complete the body of this function to use the `ContractMetadata` extension.
     */
    function _canSetContractURI() internal view virtual override returns (bool){
        return msg.sender == deployer;
    }
}
```

### Base Contracts Implementing This Extension

All of the base contracts implement this extension.

### Full API reference

##### contractURI

```solidity
function contractURI() external view returns (string memory);
```

* Returns the URI for the metadata associated with the smart contract. Generally, an IPFS URI.
* Set this value using the `setContractURI` function.

##### setContractURI

```solidity
function setContractURI(string calldata _uri) external;
```

* Sets the metadata of the smart contract. This value can be read from the `contractURI` function.
* Parameter `_uri`: The URI of the metadata to associate with the contract.
* The `_canSetContractURI` function is run on every call to this function. If the return value of `_canSetContractURI` is `false`, the `setContractURI` call will revert.

##### \_setupContractURI

```solidity
function _setupContractURI(string memory _uri) internal;
```

* Sets the metadata of the smart contract. This value can be read from the `contractURI` function.
* Parameter `_uri`: The URI of the metadata to associate with the contract.
* The `_canSetContractURI` function is _not_ run on a call to this function.

##### \_canSetContractURI

```solidity
function _canSetContractURI() internal view virtual returns (bool);
```

* Runs on every `setContractURI` function call.
* Returns whether contract metadata can be set in the given execution context.
* For example, this function can check whether the wallet calling `setContractURI` is the contract owner, and enforce that only the owner should be able to successfully call `setContractURI`.
## BatchMintMetadata (ERC1155 & ERC721)

```solidity
import "@thirdweb-dev/contracts/extension/BatchMintMetadata.sol";
```

The `BatchMintMetadata` smart contract is an extension for any NFT contract. It lets the smart contract using this extension set the metadata for `n` number of NFTs in one transaction. A single base URI for a batch of `n` NFTs is defined, where the metadata URI for each NFT in a relevant batch is `baseURI/tokenId`.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/BatchMintMetadata.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/extension/BatchMintMetadata.sol";
 
contract MyContract is BatchMintMetadata {}
```

### Base Contracts Implementing This Extension

None of the base contracts implement this extension.

### Full API reference

##### getBaseURICount

```solidity
function getBaseURICount() public view returns (uint256);
```

* Returns the total number of batches of NFTs, where each batch has a single base URI and metadata for NFTs in the batch is stored as `baseURI/tokenId`.
* This value is updated when the metadata of a new set of NFTs is 'batch minted' using the `_batchMintMetadata` function.

##### getBatchIdAtIndex

```solidity
function getBatchIdAtIndex(uint256 _index) public view returns (uint256);
```

* The extension smart contract stores an array of 'batch IDs' i.e. IDs for different batches of NFTs minted on the contract. This function returns the batch ID at a given index in this ordered array of batch IDs.

##### \_getBatchId

```solidity
function _getBatchId(uint256 tokenId) internal view returns (uint256 batchId, uint256 index);
```

* Returns the batch ID for the batch of NFTs the given tokenId belongs to.
* Parameter `tokenId`: the tokenId for which to retrieve the associated batch ID.

##### \_getBaseURI

```solidity
function _getBaseURI(uint256 _tokenId) internal view returns (string memory);
```

* Returns the base metadata URI for the given tokenId.
* Parameter `tokenId`: the tokenId for which to retrieve the associated base metadata URI.

##### \_setBaseURI

```solidity
function _setBaseURI(uint256 batchId, string memory baseURI) internal;
```

* Update the base metadata URI for a given batch of NFTs.
* Parameter `batchID`: the batch ID of the batch of NFTs whose metadata URI is to be updated.
* Parameter `baseURI`: the value to set as the new base URI for the relevant batch of NFTs.

##### \_batchMintMetadata

```solidity
function _batchMintMetadata(
    uint256 _startId,
    uint256 _amountToMint,
    string memory _baseURIForTokens
) internal returns (uint256 nextTokenIdToMint, uint256 batchId);
```

* Mints a batch of tokenIds and associates a common baseURI to all those Ids.
* Parameter `_startId`: The lowest tokenId from the batch of NFTs to mint. It is assumed that token Ids are assigned to NFTs in a serial order, when batch minting e.g. `[startId, startId + 1, ... n-1, n]`
* Parameter `_amountToMint`: The number of NFTs to mint at once.
* Parameter `_baseURIForTokens`: The common base URI for the batch of NFTs being minted, where for a batch of NFTs with token IDs `[startId, startId + 1, ... n-1, n]`, each NFT's associated metadata URI is `[baseURI/startId, baseURI/startId+1, ... baseURI/n-1, baseURI/n]`
## DelayedReveal

```solidity
import "@thirdweb-dev/contracts/extension/DelayedReveal.sol";
```

The [DelayedReveal](https://portal.thirdweb.com/glossary/delayed-reveal) smart contract is an extension for any NFT contract. It lets you create batches of 'delayed-reveal' NFTs.

In order for `ERC721Revealable` or `ERC1155Revealable` extensions to be detected in the dashboard on your contract, the respective EIP ([ERC721](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721) or [ERC1155](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155) needs to be inherited.

#### info

It is recommended to use this extension alongside the[LazyMint](https://portal.thirdweb.com/contracts/build/extensions/general/LazyMint) extension.

  
[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/DelayedReveal.sol) 

### Usage

The `DelayedReveal` extension is an _abstract contract_, and expects you to implement the following functions by yourself:

| Name                                                                                          | Type     | Returns       | Description                             |
| --------------------------------------------------------------------------------------------- | -------- | ------------- | --------------------------------------- |
| [reveal](https://portal.thirdweb.com/contracts/build/extensions/general/DelayedReveal#reveal) | external | string memory | Reveals a batch of delayed reveal NFTs. |

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/base/ERC721LazyMint.sol";
import "@thirdweb-dev/contracts/extension/DelayedReveal.sol";
 
/// This is just an EXAMPLE contract that uses `DelayedReveal`.
 
contract MyContract is ERC721LazyMint, DelayedReveal {
    using TWStrings for uint256;
 
    constructor(
        string memory _name,
        string memory _symbol,
        address _royaltyRecipient,
        uint128 _royaltyBps
    ) ERC721LazyMint(_name, _symbol, _royaltyRecipient, _royaltyBps) {}
 
    /**
     *  We override the `lazyMint` function, and use the `_data` parameter for storing encrypted metadata
     *  for 'delayed reveal' NFTs.
     */
    function lazyMint(
        uint256 _amount,
        string calldata _baseURIForTokens,
        bytes calldata _data
    ) public override returns (uint256 batchId) {
        if (_data.length > 0) {
            (bytes memory encryptedURI, bytes32 provenanceHash) = abi.decode(
                _data,
                (bytes, bytes32)
            );
            if (encryptedURI.length != 0 && provenanceHash != "") {
                _setEncryptedData(nextTokenIdToLazyMint + _amount, _data);
            }
        }
 
        return super.lazyMint(_amount, _baseURIForTokens, _data);
    }
 
    /**
     *  We override `tokenURI` to return an appropriate URI for NFTs whose true metadata is encrypted.
     */
    function tokenURI(uint256 _tokenId)
        public
        view
        virtual
        override
        returns (string memory)
    {
        (uint256 batchId, ) = _getBatchId(_tokenId);
        string memory batchUri = _getBaseURI(_tokenId);
 
        if (isEncryptedBatch(batchId)) {
            return string(abi.encodePacked(batchUri, "0"));
        } else {
            return string(abi.encodePacked(batchUri, _tokenId.toString()));
        }
    }
 
    /**
     *  We only let the owner of the contract reveal the metadata for a batch of NFTs.
     */
    function reveal(uint256 _index, bytes calldata _key)
        external
        override
        returns (string memory revealedURI)
    {
        require(msg.sender == owner(), "Not authorized");
 
        uint256 batchId = getBatchIdAtIndex(_index);
        revealedURI = getRevealURI(batchId, _key);
 
        _setEncryptedData(batchId, "");
        _setBaseURI(batchId, revealedURI);
    }
}
```

### Base Contracts Implementing This Extension

* [ERC721DelayedReveal](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/delayed-reveal)
* [ERC721Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/drop)
* [ERC1155DelayedReveal](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/delayed-reveal)
* [ERC1155Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/drop)

### Full API Reference

##### \_setEncryptedData

```solidity
function _setEncryptedData(uint256 batchId, bytes memory encryptedData) internal;
```

* Sets the delayed reveal data for a given batch of NFTs.
* Parameter `batchId`: The identifier for the batch of delayed reveal NFTs.
* Parameter `encryptedData`: The encrypted metadata to store for the given batch of NFTs.

##### getRevealURI

```solidity
function getRevealURI(uint256 batchId, bytes calldata key) public view returns (string memory revealedURI);
```

* Returns revealed URI i.e. true metadata URI for a batch of NFTs.
* Parameter `batchId`: The identifier for the batch of delayed reveal NFTs whose true metadata URI is being retrieved.
* Parameter `key`: Secure key used by caller/admin for initially encrypting the metadata of the relevant batch of NFTs.

##### encryptDecrypt

```solidity
function encryptDecrypt(bytes memory data, bytes calldata key) public pure override returns (bytes memory result);
```

* Standard XOR encryption implementation in Solidity. Used to encrypt the metadata of NFTs.
* Learn more about the usage of this function in this [blogpost](https://blog.thirdweb.com/delayed-reveal-nfts).

##### isEncryptedBatch

```solidity
function isEncryptedBatch(uint256 batchId) public view returns (bool);
```

* Returns whether the relevant batch of NFTs is subject to a delayed reveal.
* Parameter `batchId`: The identifier for a batch of NFTs.

##### reveal

```solidity
function reveal(uint256 batchId, bytes calldata key) external returns (string memory revealedURI);
```

* Reveals a batch of delayed reveal NFTs.
* Parameter `batchId`: The ID for the batch of delayed-reveal NFTs to reveal.
* Parameter `key`: The key with which the base URI for the relevant batch of NFTs was encrypted.
## Drop (ERC20 & ERC721)

```solidity
import "@thirdweb-dev/contracts/extension/Drop.sol";
```

[Drop](https://portal.thirdweb.com/glossary/drop) is an extension meant for distributing ERC20 or ERC721 tokens. It allows setting up multiple claim phases unlike `DropSinglePhase`. This series of claim phases is ordered by their respective `startTimestamp`.

This extension implements the ['Drop' distribution mechanism](https://portal.thirdweb.com/glossary/drop): set multiple claim phases with restrictions such as a price to charge, an allowlist etc. for the public / allowlisted mint of your tokens.

#### info

It is recommended to use this extension alongside the [LazyMint](https://portal.thirdweb.com/contracts/build/extensions/general/LazyMint) extension.

  
[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/Drop.sol) 

### Usage

The `Drop` extension is an _abstract contract_, and expects you to implement the following functions by yourself:

| Name                    | Type                    | Description                                                                                                                                      |
| ----------------------- | ----------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------ |
| \_afterClaim            | internal _virtual_      | Runs after every claim function call.                                                                                                            |
| \_beforeClaim           | internal _virtual_      | Runs before every claim function call.                                                                                                           |
| \_collectPriceOnClaim   | internal _virtual_      | Collects and distributes the primary sale value of NFTs being claimed.                                                                           |
| \_transferTokensOnClaim | internal _virtual_      | Transfers the NFTs being claimed.                                                                                                                |
| \_canSetClaimConditions | internal view _virtual_ | Runs on every attempt to set the claim condition on the contract. Returns whether the claim condition can be set in the given execution context. |

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: Apache-2.0
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/extension/Drop.sol";
import "@thirdweb-dev/contracts/base/ERC20Base.sol";
import "@thirdweb-dev/contracts/lib/CurrencyTransferLib.sol";
 
/// This is an EXAMPLE of usage of `Drop` for distributing ERC20 tokens.
 
contract MyContract is ERC20Base, Drop {
    /*//////////////////////////////////////////////////////////////
                            Constructor
    //////////////////////////////////////////////////////////////*/
 
    constructor(address _defaultAdmin, string memory _name, string memory _symbol)
        ERC20Base(_defaultAdmin, _name, _symbol)
    {}
 
    /*//////////////////////////////////////////////////////////////
                        Internal (overrideable) functions
    //////////////////////////////////////////////////////////////*/
 
    /// @dev Runs before every `claim` function call.
    function _beforeClaim(
        uint256 _tokenId,
        address _receiver,
        uint256 _quantity,
        address _currency,
        uint256 _pricePerToken,
        AllowlistProof calldata _allowlistProof,
        bytes memory _data
    ) internal virtual override {
      // Your custom implementation logic here
    }
 
    /// @dev Runs after every `claim` function call.
    function _afterClaim(
        uint256 _tokenId,
        address _receiver,
        uint256 _quantity,
        address _currency,
        uint256 _pricePerToken,
        AllowlistProof calldata _allowlistProof,
        bytes memory _data
    ) internal virtual override {
      // Your custom implementation logic here
    }
 
    /// @dev Collects and distributes the primary sale value of tokens being claimed.
    function _collectPriceOnClaim(
        address _primarySaleRecipient,
        uint256 _quantityToClaim,
        address _currency,
        uint256 _pricePerToken
    ) internal virtual override {
        if (_pricePerToken == 0) {
            return;
        }
 
        uint256 totalPrice = (_quantityToClaim * _pricePerToken) / 1 ether;
        require(totalPrice > 0, "quantity too low");
 
        if (_currency == CurrencyTransferLib.NATIVE_TOKEN) {
            require(msg.value == totalPrice, "Must send total price.");
        }
 
        address saleRecipient = _primarySaleRecipient;
        CurrencyTransferLib.transferCurrency(
            _currency,
            msg.sender,
            saleRecipient,
            totalPrice
        );
    }
 
    /// @dev Transfers the tokens being claimed.
    function _transferTokensOnClaim(address _to, uint256 _quantityBeingClaimed)
        internal
        virtual
        override
        returns (uint256)
    {
        _mint(_to, _quantityBeingClaimed);
        return 0;
    }
 
    /// @dev Checks whether platform fee info can be set in the given execution context.
    function _canSetClaimConditions()
        internal
        view
        virtual
        override
        returns (bool)
    {
        return msg.sender == owner();
    }
}
```

### Base Contracts Implementing This Extension

None of the base contracts implement this extension.

### Full API reference

##### claim

```solidity
function claim(
    address receiver,
    uint256 quantity,
    address currency,
    uint256 pricePerToken,
    AllowlistProof calldata allowlistProof,
    bytes memory data
) external payable;
```

* Lets an account claim a given quantity of tokens.
* Parameter `receiver`: The receiver of the tokens to claim.
* Parameter `quantity`: The quantity of tokens to claim.
* Parameter `currency`: The currency in which to pay for the claim.
* Parameter `pricePerToken`: The price per token to pay for the claim.
* Parameter `allowlistProof`: The proof of the claimer's inclusion in the merkle root allowlist.
* Parameter `data`: Arbitrary bytes data that can be leveraged in the implementation of this interface.

##### setClaimConditions

```solidity
struct ClaimCondition {
    uint256 startTimestamp;
    uint256 maxClaimableSupply;
    uint256 supplyClaimed;
    uint256 quantityLimitPerWallet;
    bytes32 merkleRoot;
    uint256 pricePerToken;
    address currency;
    string metadata;
}
 
function setClaimConditions(ClaimCondition[] calldata phases, bool resetClaimEligibility) external;
```

* Lets an authorized wallet set the claim condition for the contract.
* Parameter `phases`: The array where each `phase` contains a set of restrictions that will apply to the minting of tokens on the contract.  
   * `startTimestamp`: The unix timestamp after which the claim condition applies. The same claim condition applies until the `startTimestamp` of the next claim condition.  
   * `maxClaimableSupply`: The maximum total number of tokens that can be claimed under the claim condition.  
   * `supplyClaimed`: At any given point, the number of tokens that have been claimed under the claim condition.  
   * `quantityLimitPerWallet`: The maximum number of tokens that can be claimed by a wallet.  
   * `merkleRoot`: The allowlist of addresses that can claim tokens under the claim condition.  
   * `pricePerToken`: The price required to pay per token claimed.  
   * `currency`: The currency in which the price must be paid.  
   * `metadata`: Claim condition metadata.
* Parameter `resetClaimEligibility`: Whether to carry over the restrictions active for wallets that claimed tokens in the incumbent claim condition (e.g. next valid claim timestamp for a given wallet).
* The `_canSetClaimConditions` function is run on every call to this function. If the return value of `_canSetClaimConditions` is `false`, the `setClaimConditions` call will revert.

##### verifyClaim

```solidity
struct AllowlistProof {
    bytes32[] proof;
    uint256 quantityLimitPerWallet;
    uint256 pricePerToken;
    address currency;
}
 
function verifyClaim(
    uint256 conditionId,
    address claimer,
    uint256 quantity,
    address currency,
    uint256 pricePerToken,
    AllowlistProof calldata allowlistProof
) public view returns (bool isOverride);
```

* Checks a request to claim tokens against the active claim condition's criteria.
* Parameter `conditionId`: Id of the active claim condition.
* Parameter `claimer`: The wallet claiming tokens.
* Parameter `quantity`: The quantity of tokens to claim.
* Parameter `currency`: The currency in which to pay the price for the claim.
* Parameter `pricePerToken`: The price to pay per token claimed.
* Parameter `allowlistProof`: Struct containing below elements:  
   * `proof`: Proof of concerned wallet's inclusion in an allowlist.  
   * `quantityLimitPerWallet`: The total quantity of tokens the allowlisted wallet is eligible to claim over time.  
   * `pricePerToken`: The price per token the allowlisted wallet must pay to claim tokens.  
   * `currency`: The currency in which the allowlisted wallet must pay the price for claiming tokens.

##### getActiveClaimConditionId

```solidity
function getActiveClaimConditionId() public view returns (uint256);
```

* Returns the Id of currently active claim condition.

##### getClaimConditionById

```solidity
function getClaimConditionById(uint256 conditionId) external view returns (ClaimCondition memory);
```

* Returns the claim condition for a given condition Id.
* Parameter `conditionId`: Id of the claim condition being viewed.

##### getSupplyClaimedByWallet

```solidity
function getSupplyClaimedByWallet(uint256 conditionId, address claimer) public view returns (uint256);
```

* Returns the number of tokens claimed by a wallet under the given condition.
* Parameter `conditionId`: Id of the claim condition under which to check the supply claimed.
* Parameter `claimer`: The wallet claiming tokens.

##### \_dropMsgSender

```solidity
function _dropMsgSender() internal virtual returns (address);
```

* Exposes the ability to override the msg sender.

##### \_beforeClaim

```solidity
function _beforeClaim(
    address receiver,
    uint256 quantity,
    address currency,
    uint256 pricePerToken,
    AllowlistProof calldata allowlistProof,
    bytes memory data
) internal virtual
```

* Runs before every `claim` function call. Exposes the ability to add custom logic that runs before every claim of tokens.
* Parameter `receiver`: The receiver of the tokens to claim.
* Parameter `quantity`: The quantity of tokens to claim.
* Parameter `currency`: The currency in which to pay for the claim.
* Parameter `pricePerToken`: The price per token to pay for the claim.
* Parameter `allowlistProof`: The proof of the claimer's inclusion in the merkle root allowlist.
* Parameter `data`: Arbitrary bytes data that can be leveraged in the implementation of this interface.

##### \_afterClaim

```solidity
function _afterClaim(
    address receiver,
    uint256 quantity,
    address currency,
    uint256 pricePerToken,
    AllowlistProof calldata allowlistProof,
    bytes memory data
) internal virtual
```

* Runs after every `claim` function call. Exposes the ability to add custom logic that runs after every claim of tokens.
* Parameter `receiver`: The receiver of the tokens to claim.
* Parameter `quantity`: The quantity of tokens to claim.
* Parameter `currency`: The currency in which to pay for the claim.
* Parameter `pricePerToken`: The price per token to pay for the claim.
* Parameter `allowlistProof`: The proof of the claimer's inclusion in the merkle root allowlist.
* Parameter `data`: Arbitrary bytes data that can be leveraged in the implementation of this interface.

##### \_collectPriceOnClaim

```solidity
function _collectPriceOnClaim(
    address primarySaleRecipient,
    uint256 quantityToClaim,
    address currency,
    uint256 pricePerToken
) internal virtual;
```

* Collects and distributes the primary sale value of tokens being claimed.
* Parameter `primarySaleRecipient`: The recipient of the primary sale value generated from a claim.
* Parameter `quantityToClaim`: The quantity of tokens being claimed.
* Parameter `currency`: The currency used to pay for the claim.
* Parameter `pricePerToken`: The price per token to pay for the claim.

##### \_transferTokensOnClaim

```solidity
function _transferTokensOnClaim(address to, uint256 quantityBeingClaimed)
    internal
    virtual
    returns (uint256 startTokenId);
```

* Transfers the tokens being claimed to the appropriate recipient.
* Parameter `to`: The recipient of the tokens for a claim.
* Parameter `quantityBeingClaimed`: The quantity of tokens being claimed.

##### \_canSetClaimConditions

```solidity
function _canSetClaimConditions() internal view virtual returns (bool);
```

* Runs on every `setClaimConditions` function call.
* Returns whether the claim condition can be set in the given execution context.
* For example, this function can check whether the wallet calling `setClaimConditions` is the contract owner, and enforce that only the owner should be able to successfully call `setClaimConditions`.
## LazyMint

```solidity
import "@thirdweb-dev/contracts/extension/LazyMint.sol";
```

The `LazyMint` smart contract is an extension for any base NFT contract. It lets you 'lazy mint' any number of NFTs at once.

Here, ['lazy mint'](https://portal.thirdweb.com/glossary/lazy-minting) means defining the metadata for particular tokenIds of your NFT contract, without actually minting a non-zero balance of NFTs of those tokenIds.

#### info

In order for the `ERC721LazyMintable`, `ERC1155LazyMintable` or `ERC20LazyMintable` extension to be detected in the Dashboard, the corresponding [ERC721](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721), [ERC1155](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155) or [ERC20](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20) extensions need to be added alongside the `LazyMint` extension.

  
[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/LazyMint.sol) 

### Usage

The `LazyMint` extension is an _abstract contract_, and expects you to implement the following functions by yourself:

| Name                                                                                                    | Type                    | Returns | Description                                                                                                                      |
| ------------------------------------------------------------------------------------------------------- | ----------------------- | ------- | -------------------------------------------------------------------------------------------------------------------------------- |
| [\_canLazyMint](https://portal.thirdweb.com/contracts/build/extensions/general/LazyMint#%5Fcanlazymint) | internal view _virtual_ | bool    | Runs on every attempt to lazy mint NFTs on the contract. Returns whether NFTs can be lazy minted in the given execution context. |

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/extension/LazyMint.sol";
 
contract MyContract is LazyMint {
    /**
     *  We store the contract deployer's address only for the purposes of the example
     *  in the code comment below.
     *
     *  Doing this is not necessary to use the `LazyMint` extension.
     */
    address public deployer;
 
    constructor() {
        deployer = msg.sender;
    }
 
    /**
     *  This function returns who is authorized to lazy mint NFTs on this contract.
     *
     *  As an EXAMPLE, we'll only allow the contract deployer to lazy mint NFTs.
     *
     *  You MUST complete the body of this function to use the `LazyMint` extension.
     */
    function _canLazyMint() internal view virtual override returns (bool) {
        return msg.sender == deployer;
    }
}
```

### Base Contracts Implementing This Extension

(if combined with either [ERC721](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721) or [ERC1155](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155))

* [ERC721LazyMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/lazy-mint)
* [ERC721DelayedReveal](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/delayed-reveal)
* [ERC721Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/drop)
* [ERC1155LazyMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/lazy-mint)
* [ERC1155DelayedReveal](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/delayed-reveal)
* [ERC1155Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/drop)

### Full API Reference

##### lazyMint

```solidity
function lazyMint(
    uint256 amount,
    string calldata baseURIForTokens,
    bytes calldata extraData
) external returns (uint256 batchId);
```

* Lazy mints a given amount of NFTs.
* Parameter `amount`: The number of NFTs to lazy mint.
* Parameter `baseURIForTokens`: The base URI for the 'n' number of NFTs being lazy minted, where the metadata for each of those NFTs is `baseURIForTokens/tokenId`.
* Parameter `extraData`: Additional bytes data to be used at the discretion of the contract.

##### \_canLazyMint

```solidity
function _canLazyMint() internal view virtual returns (bool);
```

* Runs on every `lazyMint` function call.
* Returns whether NFTs can be lazy minted in the given execution context.
* For example, this function can check whether the wallet calling `lazyMint` is the contract owner, and enforce that only the owner should be able to successfully call `lazyMint`.
## DropSinglePhase (ERC20 & ERC721)

```solidity
import "@thirdweb-dev/contracts/extension/DropSinglePhase.sol";
```

The `DropSinglePhase` smart contract is an extension meant for distributing ERC20 or ERC721 tokens.

This extension implements the 'Drop' distribution mechanism: set restrictions, known as a claim phase, such as a price to charge, an allowlist etc. for the public / allowlisted mint of your tokens.

`DropSinglePhase` allows you to set one claim phase unlike the [Drop](https://portal.thirdweb.com/contracts/build/extensions/general/Drop) extension.

#### info

It is recommended to use this extension alongside the [LazyMint](https://portal.thirdweb.com/contracts/build/extensions/general/LazyMint) extension.

  
[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/DropSinglePhase.sol) 

### Usage

The `DropSinglePhase` extension is an _abstract contract_, and expects you to implement the following functions by yourself:

| Name                    | Type                    | Description                                                                                                                                      |
| ----------------------- | ----------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------ |
| \_afterClaim            | internal _virtual_      | Runs after every claim function call.                                                                                                            |
| \_beforeClaim           | internal _virtual_      | Runs before every claim function call.                                                                                                           |
| \_collectPriceOnClaim   | internal _virtual_      | Collects and distributes the primary sale value of NFTs being claimed.                                                                           |
| \_transferTokensOnClaim | internal _virtual_      | Transfers the NFTs being claimed.                                                                                                                |
| \_canSetClaimConditions | internal view _virtual_ | Runs on every attempt to set the claim condition on the contract. Returns whether the claim condition can be set in the given execution context. |

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: Apache-2.0
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/extension/DropSinglePhase.sol";
import "@thirdweb-dev/contracts/base/ERC20Base.sol";
import "@thirdweb-dev/contracts/lib/CurrencyTransferLib.sol";
 
/// This is an EXAMPLE of the usage of `DropSinglePhase` for distributing ERC20 tokens.
 
contract MyContract is ERC20Base, DropSinglePhase {
    /*//////////////////////////////////////////////////////////////
                            Constructor
    //////////////////////////////////////////////////////////////*/
 
    constructor(address _defaultAdmin, string memory _name, string memory _symbol)
        ERC20Base(_defaultAdmin, _name, _symbol)
    {}
 
    /*//////////////////////////////////////////////////////////////
                        Internal (overrideable) functions
    //////////////////////////////////////////////////////////////*/
 
    /// @dev Runs before every `claim` function call.
    function _beforeClaim(
        uint256 _tokenId,
        address _receiver,
        uint256 _quantity,
        address _currency,
        uint256 _pricePerToken,
        AllowlistProof calldata _allowlistProof,
        bytes memory _data
    ) internal virtual override {
      // Your custom implementation logic here
    }
 
    /// @dev Runs after every `claim` function call.
    function _afterClaim(
        uint256 _tokenId,
        address _receiver,
        uint256 _quantity,
        address _currency,
        uint256 _pricePerToken,
        AllowlistProof calldata _allowlistProof,
        bytes memory _data
    ) internal virtual override {
      // Your custom implementation logic here
    }
 
    /// @dev Collects and distributes the primary sale value of tokens being claimed.
    function _collectPriceOnClaim(
        address _primarySaleRecipient,
        uint256 _quantityToClaim,
        address _currency,
        uint256 _pricePerToken
    ) internal virtual override {
        if (_pricePerToken == 0) {
            return;
        }
 
        uint256 totalPrice = (_quantityToClaim * _pricePerToken) / 1 ether;
        require(totalPrice > 0, "quantity too low");
 
        if (_currency == CurrencyTransferLib.NATIVE_TOKEN) {
            require(msg.value == totalPrice, "Must send total price.");
        }
 
        address saleRecipient = _primarySaleRecipient;
        CurrencyTransferLib.transferCurrency(
            _currency,
            msg.sender,
            saleRecipient,
            totalPrice
        );
    }
 
    /// @dev Transfers the tokens being claimed.
    function _transferTokensOnClaim(address _to, uint256 _quantityBeingClaimed)
        internal
        virtual
        override
        returns (uint256)
    {
        _mint(_to, _quantityBeingClaimed);
        return 0;
    }
 
    /// @dev Checks whether platform fee info can be set in the given execution context.
    function _canSetClaimConditions()
        internal
        view
        virtual
        override
        returns (bool)
    {
        return msg.sender == owner();
    }
}
```

### Base Contracts Implementing This Extension

* [ERC721Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/drop)
* [ERC20Drop](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Claimable)

### Full API reference

##### claim

```solidity
function claim(
    address receiver,
    uint256 quantity,
    address currency,
    uint256 pricePerToken,
    AllowlistProof calldata allowlistProof,
    bytes memory data
) external payable;
```

* Lets an account claim a given quantity of tokens.
* Parameter `receiver`: The receiver of the tokens to claim.
* Parameter `quantity`: The quantity of tokens to claim.
* Parameter `currency`: The currency in which to pay for the claim.
* Parameter `pricePerToken`: The price per token to pay for the claim.
* Parameter `allowlistProof`: The proof of the claimer's inclusion in the merkle root allowlist.
* Parameter `data`: Arbitrary bytes data that can be leveraged in the implementation of this interface.

##### setClaimConditions

```solidity
struct ClaimCondition {
    uint256 startTimestamp;
    uint256 maxClaimableSupply;
    uint256 supplyClaimed;
    uint256 quantityLimitPerWallet;
    bytes32 merkleRoot;
    uint256 pricePerToken;
    address currency;
    string metadata;
}
 
function setClaimConditions(ClaimCondition calldata phase, bool resetClaimEligibility) external;
```

* Lets an authorized wallet set the claim condition for the contract.
* Parameter `phase`: The set of restrictions that will apply to the minting of tokens on the contract.  
   * `startTimestamp`: The unix timestamp after which the claim condition applies.  
   * `maxClaimableSupply`: The maximum total number of tokens that can be claimed under the claim condition.  
   * `supplyClaimed`: At any given point, the number of tokens that have been claimed under the claim condition.  
   * `quantityLimitPerWallet`: The maximum number of tokens that can be claimed by a wallet.  
   * `merkleRoot`: The allowlist of addresses that can claim tokens under the claim condition.  
   * `pricePerToken`: The price required to pay per token claimed.  
   * `currency`: The currency in which the price must be paid.  
   * `metadata`: Claim condition metadata.
* Parameter `resetClaimEligibility`: Whether to carry over the restrictions active for wallets that claimed tokens in the incumbent claim condition (e.g. next valid claim timestamp for a given wallet).
* The `_canSetClaimConditions` function is run on every call to this function. If the return value of `_canSetClaimConditions` is `false`, the `setClaimConditions` call will revert.

##### verifyClaim

```solidity
struct AllowlistProof {
    bytes32[] proof;
    uint256 quantityLimitPerWallet;
    uint256 pricePerToken;
    address currency;
}
 
function verifyClaim(
    address claimer,
    uint256 quantity,
    address currency,
    uint256 pricePerToken,
    AllowlistProof calldata allowlistProof
) public view returns (bool isOverride);
```

* Checks a request to claim tokens against the active claim condition's criteria.
* Parameter `claimer`: The wallet claiming tokens.
* Parameter `quantity`: The quantity of tokens to claim.
* Parameter `currency`: The currency in which to pay the price for the claim.
* Parameter `pricePerToken`: The price to pay per token claimed.
* Parameter `allowlistProof`: Struct containing below elements:  
   * `proof`: Proof of concerned wallet's inclusion in an allowlist.  
   * `quantityLimitPerWallet`: The total quantity of tokens the allowlisted wallet is eligible to claim over time.  
   * `pricePerToken`: The price per token the allowlisted wallet must pay to claim tokens.  
   * `currency`: The currency in which the allowlisted wallet must pay the price for claiming tokens.

##### getSupplyClaimedByWallet

```solidity
function getSupplyClaimedByWallet(address claimer) public view returns (uint256);
```

* Returns the number of tokens claimed by a wallet under the active condition.
* Parameter `claimer`: The wallet claiming tokens.

##### \_dropMsgSender

```solidity
function _dropMsgSender() internal virtual returns (address);
```

* Exposes the ability to override the msg sender.

##### \_beforeClaim

```solidity
function _beforeClaim(
    address receiver,
    uint256 quantity,
    address currency,
    uint256 pricePerToken,
    AllowlistProof calldata allowlistProof,
    bytes memory data
) internal virtual
```

* Runs before every `claim` function call. Exposes the ability to add custom logic that runs before every claim of tokens.
* Parameter `receiver`: The receiver of the tokens to claim.
* Parameter `quantity`: The quantity of tokens to claim.
* Parameter `currency`: The currency in which to pay for the claim.
* Parameter `pricePerToken`: The price per token to pay for the claim.
* Parameter `allowlistProof`: The proof of the claimer's inclusion in the merkle root allowlist.
* Parameter `data`: Arbitrary bytes data that can be leveraged in the implementation of this interface.

##### \_afterClaim

```solidity
function _afterClaim(
    address receiver,
    uint256 quantity,
    address currency,
    uint256 pricePerToken,
    AllowlistProof calldata allowlistProof,
    bytes memory data
) internal virtual
```

* Runs after every `claim` function call. Exposes the ability to add custom logic that runs after every claim of tokens.
* Parameter `receiver`: The receiver of the tokens to claim.
* Parameter `quantity`: The quantity of tokens to claim.
* Parameter `currency`: The currency in which to pay for the claim.
* Parameter `pricePerToken`: The price per token to pay for the claim.
* Parameter `allowlistProof`: The proof of the claimer's inclusion in the merkle root allowlist.
* Parameter `data`: Arbitrary bytes data that can be leveraged in the implementation of this interface.

##### \_collectPriceOnClaim

```solidity
function _collectPriceOnClaim(
    address primarySaleRecipient,
    uint256 quantityToClaim,
    address currency,
    uint256 pricePerToken
) internal virtual;
```

* Collects and distributes the primary sale value of tokens being claimed.
* Parameter `primarySaleRecipient`: The recipient of the primary sale value generated from a claim.
* Parameter `quantityToClaim`: The quantity of tokens being claimed.
* Parameter `currency`: The currency used to pay for the claim.
* Parameter `pricePerToken`: The price per token to pay for the claim.

##### \_transferTokensOnClaim

```solidity
function _transferTokensOnClaim(address to, uint256 quantityBeingClaimed)
    internal
    virtual
    returns (uint256 startTokenId);
```

* Transfers the tokens being claimed to the appropriate recipient.
* Parameter `to`: The recipient of the tokens for a claim.
* Parameter `quantityBeingClaimed`: The quantity of tokens being claimed.

##### \_canSetClaimConditions

```solidity
function _canSetClaimConditions() internal view virtual returns (bool);
```

* Runs on every `setClaimConditions` function call.
* Returns whether the claim condition can be set in the given execution context.
* For example, this function can check whether the wallet calling `setClaimConditions` is the contract owner, and enforce that only the owner should be able to successfully call `setClaimConditions`.
## Multicall

```solidity
import "@thirdweb-dev/contracts/extension/Multicall.sol";
```

The `Multicall` smart contract is an extension usable with any base smart contract. It provides a function `multicall` to batch together multiple calls in a single external call.

#### info

It is recommended to use this extension alongside the [ERC721Mintable](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Mintable), [ERC1155Mintable](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Mintable) or [ERC20Mintable](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20BatchMintable)extension to unlock the [ERC721BatchMintable](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721BatchMintable), [ERC1155BatchMintable](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155BatchMintable) or [ERC20BatchMintable](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20BatchMintable) dashboard extension detection.

  
[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/Multicall.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/extension/Multicall.sol";
 
contract MyContract is Multicall { ... }
```

### Base Contracts Implementing This Extension

* [ERC721Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/base)
* [ERC721SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/signature-mint)
* [ERC1155Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/base)
* [ERC1155SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/signature-mint)
* [ERC20Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/base)
* [ERC20SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/signature-mint)
* [ERC20SignatureMintVote](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/signature-mint-vote)
* [ERC20Vote](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/base)

### Full API reference

##### multicall

```solidity
function multicall(bytes[] calldata data) external virtual override returns (bytes[] memory results);
```

* Receives and executes a batch of function calls on the contract.
* Parameter `data`: The bytes data that makes up the batch of function calls to execute.
* Return value `results`: The bytes data that makes up the result of the batch of function calls executed.
## Ownable

```solidity
import "@thirdweb-dev/contracts/extension/Ownable.sol";
```

The `Ownable` smart contract extension is usable with any base smart contract. It lets you set an owner for your smart contract.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/Ownable.sol) 

### Usage

The `Ownable` extension is an _abstract contract_, and expects you to implement the following functions by yourself:

| Name                                                                                                   | Type                    | Returns | Description                                                                                                                  |
| ------------------------------------------------------------------------------------------------------ | ----------------------- | ------- | ---------------------------------------------------------------------------------------------------------------------------- |
| [\_canSetOwner](https://portal.thirdweb.com/contracts/build/extensions/general/Ownable#%5Fcansetowner) | internal view _virtual_ | bool    | Runs on every attempt to set the owner of the contract. Returns whether the owner can be set in the given execution context. |

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/extension/Ownable.sol";
 
contract MyContract is Ownable {
    /**
     *  This function returns who is authorized to set the owner of your contract.
     *
     *  As an EXAMPLE, we'll only allow the current owner to set the contract's new owner.
     *
     *  You MUST complete the body of this function to use the `Ownable` extension.
     */
    function _canSetOwner() internal virtual view override returns (bool) {
        return msg.sender == owner();
    }
}
```

### Base Contracts Implementing This Extension

All of the base contracts implement this extension.

### Full API reference

##### owner

```solidity
function owner() public view override returns (address);
```

* Returns the owner of the contract.
* Set this value using the `setOwner` function.

##### setOwner

```solidity
function setOwner(address _newOwner) external;
```

* Lets an authorized wallet set a new owner for the contract. This value can be read from the `owner` function.
* Parameter `_newOwner`: The address to make the owner of the contract.
* The `_canSetOwner` function is run on every call to this function. If the return value of `_canSetOwner` is `false`, the `setOwner` call will revert.

##### \_setupOwner

```solidity
function _setupOwner(address _newOwner) internal;
```

* Sets the owner of the smart contract. This value can be read from the `owner` function.
* Parameter `_newOwner`: The address to make the owner of the contract.
* The `_canSetOwner` function is _not_ run on a call to this function.

##### \_canSetOwner

```solidity
function _canSetOwner() internal view virtual returns (bool);
```

* Runs on every `setOwner` function call.
* Returns whether a new owner can be set in the given execution context.
* For example, this function can check whether the wallet calling `setOwner` is the contract owner, and enforce that only the current owner should be able to successfully call `setOwner`.
## PermissionsEnumerable

```solidity
import "@thirdweb-dev/contracts/extension/PermissionsEnumerable.sol";
```

The `PermissionsEnumerable` extension provides role-based access control: you can create roles and write custom logic in your smart contract that depends on whether a given wallet holds a given role. The `Enumerable` part provides the capability to view all the addresses holding a specific role.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/PermissionsEnumerable.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/extension/PermissionsEnumerable.sol";
 
contract MyContract is PermissionsEnumerable {
    // Any `bytes32` value is a valid role. You can create roles by defining them like this.
    bytes32 public constant NUMBER_ROLE = keccak256("NUMBER_ROLE");
 
    // See comments for `setNumber`, below.
    uint256 public number;
 
    /**
     *  The `PermissionsEnumerable` contract makes an already defined role available: the `DEFAULT_ADMIN_ROLE`.
     *
     *  As an EXAMPLE, we grant the deployer of the contract this admin role.
     */
    constructor() {
        _setupRole(DEFAULT_ADMIN_ROLE, msg.sender);
    }
 
    /**
     *  EXAMPLE: here we have a function that we want to restrict only to holders of `NUMBER_ROLE`.
     *
     *  To accomplish this, we use the `onlyRole` modifier made available by `PermissionsEnumerable`, and
     *  pass it `NUMBER_ROLE` as an argument.
     */
    function setNumber(uint256 _newNumber) public onlyRole(NUMBER_ROLE) {
        number = _newNumber;
    }
}
```

### Base Contracts Implementing This Extension

None of the base contracts implement this extension.

### Full API Reference

`PermissionsEnumerable` inherits from the [Permissions](https://portal.thirdweb.com/contracts/build/extensions/general/Permissions#full-api-reference) extension so includes all of the functions in that extension. It also includes the following functions:

##### getRoleMember

```solidity
function getRoleMember(bytes32 role, uint256 index) external view returns (address member);
```

* Returns one of the accounts that have `role`. `index` must be a value between 0 and the value of `getRoleMemberCount` at the time, non-inclusive.
* Parameters:  
   * `role`: keccak256 hash of the role. e.g. keccak256("TRANSFER\_ROLE")  
   * `index`: Index in list of current members for the role.

##### getRoleMemberCount

```solidity
function getRoleMemberCount(bytes32 role) external view returns (uint256 count);
```

* Returns the number of accounts that have `role`. Can be used together with `getRoleMember` to enumerate all bearers of a role.
* Parameters:  
   * `role`: keccak256 hash of the role. e.g. keccak256("TRANSFER\_ROLE")
## Permissions

```solidity
import "@thirdweb-dev/contracts/extension/Permissions.sol";
```

The `Permissions` extension provides role-based access control: you can create roles and write custom logic in your smart contract that depends on whether a given wallet holds a given role.

There are two different contracts you can implement to add permissions:

* `Permissions`: Create roles and restrict access to functions based on those roles.
* [PermissionsEnumerable](https://portal.thirdweb.com/contracts/build/extensions/general/PermissionsEnumerable): `Permissions` plus the capability to view all the addresses holding a specific role (or all roles).

You only need to implement **one** of the two.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/Permissions.sol) 

### Usage

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/extension/Permissions.sol";
 
contract MyContract is Permissions {
    // Any `bytes32` value is a valid role. You can create roles by defining them like this.
    bytes32 public constant NUMBER_ROLE = keccak256("NUMBER_ROLE");
 
    // See comments for `setNumber`, below.
    uint256 public number;
 
    /**
     *  The `Permissions` contract makes an already defined role available: the `DEFAULT_ADMIN_ROLE`.
     *
     *  As an EXAMPLE, we grant the deployer of the contract this admin role.
     */
    constructor() {
        _setupRole(DEFAULT_ADMIN_ROLE, msg.sender);
    }
 
    /**
     *  EXAMPLE: here we have a function that we want to restrict only to holders of `NUMBER_ROLE`.
     *
     *  To accomplish this, we use the `onlyRole` modifier made available by `Permissions`, and
     *  pass it `NUMBER_ROLE` as an argument.
     */
    function setNumber(uint256 _newNumber) public onlyRole(NUMBER_ROLE) {
        number = _newNumber;
    }
}
```

### Base Contracts Implementing This Extension

None of the base contracts implement this extension.

### Full API Reference

##### hasRole

```solidity
function hasRole(bytes32 role, address account) external view returns (bool);
```

* Returns `true` if `account` has been granted `role`.

##### getRoleAdmin

```solidity
function getRoleAdmin(bytes32 role) external view returns (bytes32);
```

* Returns the admin role that controls `role` i.e. the holders of the admin role (the return value) can grant or revoke `role` from wallets.

##### grantRole

```solidity
function grantRole(bytes32 role, address account) external;
```

* Grants `role` to `account`. Can only be called by a holder of the admin role of the role being granted.

##### revokeRole

```solidity
function revokeRole(bytes32 role, address account) external;
```

* Revokes `role` from `account`. Can only be called by a holder of the admin role of the role being granted.

##### renounceRole

```solidity
function renounceRole(bytes32 role, address account) external;
```

* Revokes `role` from the calling account.

##### hasRoleWithSwitch

```solidity
function hasRoleWithSwitch(bytes32 role, address account) public view returns (bool);
```

* Returns `true` if `account` has been granted `role`.
* Role restrictions can be switched on and off:  
   * If `address(0)` has `role`, then the role restrictions don't apply i.e. this function will always return `true`.  
   * If `address(0)` does not have `role`, then the role restrictions will apply i.e. this function will behave like `hasRole`.
## PrimarySale

```solidity
import "@thirdweb-dev/contracts/extension/PrimarySale.sol";
```

`PrimarySale` lets you set a recipient for any sale value you intend to collect in your smart contract.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/PrimarySale.sol) 

### Usage

The `PrimarySale` extension is an _abstract contract_, and expects you to implement the following functions by yourself:

| Name                                                                                                                                     | Type                    | Returns | Description                                                                                                                     |
| ---------------------------------------------------------------------------------------------------------------------------------------- | ----------------------- | ------- | ------------------------------------------------------------------------------------------------------------------------------- |
| [\_canSetPrimarySaleRecipient](https://portal.thirdweb.com/contracts/build/extensions/general/PrimarySale#%5Fcansetprimarysalerecipient) | internal view _virtual_ | bool    | Runs on every attempt to set a new primary sale recipient. Returns whether this info can be set in the given execution context. |

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/extension/PrimarySale.sol";
 
contract MyContract is PrimarySale {
    /**
     *  We store the contract deployer's address only for the purposes of the example
     *  in the code comment below.
     *
     *  Doing this is not necessary to use the `PrimarySale` extension.
     */
    address public deployer;
 
    constructor() {
        deployer = msg.sender;
    }
 
    /**
     *  This function returns who is authorized to set primary sale recipient address for your contract.
     *
     *  As an EXAMPLE, we'll only allow the contract deployer to set the primary sale recipient address.
     *
     *  You MUST complete the body of this function to use the `PrimarySale` extension.
     */
    function _canSetPrimarySaleRecipient()
        internal
        virtual
        override
        returns (bool)
    {
        return msg.sender == deployer;
    }
}
```

### Base Contracts Implementing This Extension

* [ERC20Drop](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Claimable)
* [ERC20DropVote](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/drop-vote)
* [ERC20SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/signature-mint)
* [ERC20SignatureMintVote](https://portal.thirdweb.com/contracts/build/base-contracts/erc-20/signature-mint-vote)
* [ERC721Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/drop)
* [ERC721SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/signature-mint)
* [ERC1155Drop](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/drop)
* [ERC1155SignatureMint](https://portal.thirdweb.com/contracts/build/base-contracts/erc-1155/signature-mint)

### Full API Reference

##### primarySaleRecipient

```solidity
function primarySaleRecipient() public view returns (address);
```

* Returns the primary sale recipient address stored in the contract.
* Set this value using the `setPrimarySaleRecipient` function.

##### setPrimarySaleRecipient

```solidity
function setPrimarySaleRecipient(address saleRecipient) external;
```

* Lets an authorized wallet set the primary sale recipient address.
* Parameter `saleRecipient`: The address to set as the new primary sale recipient.
* The `_canSetPrimarySaleRecipient` function is run on every call to this function. If the return value of `_canSetPrimarySaleRecipient` is `false`, the `setPrimarySaleRecipient` call will revert.

##### \_setupPrimarySaleRecipient

```solidity
function _setupPrimarySaleRecipient(address saleRecipient) internal;
```

* Sets the primary sale recipient.
* Parameter `saleRecipient`: The address to set as the new primary sale recipient.
* The `_canSetPrimarySaleRecipient` function is _not_ run on a call to this function.

##### \_canSetPrimarySaleRecipient

```solidity
function _canSetPrimarySaleRecipient() internal view virtual returns (bool);
```

* Runs on every `setPrimarySaleRecipient` function call.
* Returns whether a new primary sale recipient can be set in the given execution context.
* For example, this function can check whether the wallet calling `setPrimarySaleRecipient` is the contract owner, and enforce that only the current owner should be able to successfully call `setPrimarySaleRecipient`.
## Extensions

### ERC721

| Name                                                                                                          | Description                                                                                |
| ------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------ |
| [ERC721](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721)                               | Basic functionality of ERC721 "non-fungible" NFTs                                          |
| [ERC721BatchMintable](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721BatchMintable)     | Batch minting of new NFTs                                                                  |
| [ERC721Burnable](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Burnable)               | Burn (take out of circulation) NFTs                                                        |
| [ERC721Claimable](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Claimable)             | Interface to allow users to claim NFTs that you have lazy minted                           |
| [ERC721ClaimConditions](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721ClaimConditions) | Allow users to claim NFTs from your drop under specific conditions (one claim phase)       |
| [ERC721ClaimCustom](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721ClaimCustom)         | Allow users to claim NFTs from your drop under specific conditions                         |
| [ERC721ClaimPhases](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721ClaimPhases)         | Allow users to claim NFTs from your drop under specific conditions (multiple claim phases) |
| [ERC721Enumerable](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Enumerable)           | Enumerate through NFTs in a contract to get all or get owned NFTs                          |
| [ERC721Mintable](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Mintable)               | Mint new NFTs into the contract                                                            |
| [ERC721Revealable](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Revealable)           | NFTs that can be revealed at a later date after they have been minted and claimed          |
| [ERC721SignatureMint](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721SignatureMint)     | Use signature-based minting functionality to mint new NFTs into the contract               |
| [ERC721Staking](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Staking)                 | Implement ERC721 staking mechanism                                                         |
| [ERC721Supply](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Supply)                   | View information about the supply of the NFT collection                                    |

### ERC1155

| Name                                                                                                             | Description                                                                                |
| ---------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------ |
| [ERC1155](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155)                               | Basic functionality of ERC1155 "semi-fungible" NFTs                                        |
| [ERC1155BatchMintable](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155BatchMintable)     | Batch minting of new NFTs                                                                  |
| [ERC1155Burnable](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Burnable)               | Burn (take out of circulation) NFTs                                                        |
| [ERC1155Claimable](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Claimable)             | Interface to allow users to claim NFTs that you have lazy minted                           |
| [ERC1155ClaimConditions](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155ClaimConditions) | Allow users to claim NFTs from your drop under specific conditions (one claim phase)       |
| [ERC1155ClaimCustom](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155ClaimCustom)         | Allow users to claim NFTs from your drop under specific conditions                         |
| [ERC1155ClaimPhases](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155ClaimPhases)         | Allow users to claim NFTs from your drop under specific conditions (multiple claim phases) |
| [ERC1155Drop](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Drop)                       | For distributing ERC1155 tokens to set up multiple claim phases                            |
| [ERC1155DropSinglePhase](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155DropSinglePhase) | For distributing ERC1155 tokens to set up a single claim phase                             |
| [ERC1155Enumerable](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Enumerable)           | Enumerate through NFTs in a contract to get all or get owned NFTs                          |
| [ERC1155Mintable](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Mintable)               | Mint new NFTs into the contract                                                            |
| [ERC1155Revealable](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Revealable)           | NFTs that can be revealed at a later date after they have been minted and claimed          |
| [ERC1155SignatureMint](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155SignatureMint)     | Use signature-based minting functionality to mint new NFTs into the contract               |
| [ERC1155Staking](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Staking)                 | Implement ERC721 staking mechanism                                                         |

### ERC20

| Name                                                                                                       | Description                                                                            |
| ---------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------- |
| [ERC20](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20)                               | Basic functionality of ERC20 "fungible" tokens                                         |
| [ERC20BatchMintable](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20BatchMintable)     | Batch minting of new tokens                                                            |
| [ERC20Burnable](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20Burnable)               | Burn (take out of circulation) tokens                                                  |
| [ERC20ClaimConditions](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20ClaimConditions) | Allow users to claim tokens from your drop under specific conditions (one claim phase) |
| [ERC20Mintable](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20Mintable)               | Mint new tokens into the contract                                                      |
| [ERC20Permit](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20Permit)                   | Mint new tokens into the contract                                                      |
| [ERC20SignatureMint](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20SignatureMint)     | Use signature-based minting functionality to mint new tokens into the contract         |
| [ERC20Staking](https://portal.thirdweb.com/contracts/build/extensions/erc-20/ERC20Staking)                 | Implement ERC20 staking mechanism                                                      |

### General

| Name                                                                                                          | Description                                                                                              |
| ------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------- |
| [BatchMintMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/BatchMintMetadata)         | Batch minting of new tokens                                                                              |
| [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)           | Define metadata for your smart contract                                                                  |
| [DelayedReveal](https://portal.thirdweb.com/contracts/build/extensions/general/DelayedReveal)                 | create batches of 'delayed-reveal' NFTs                                                                  |
| [Drop](https://portal.thirdweb.com/contracts/build/extensions/general/Drop)                                   | for distributing ERC20 or ERC721 tokens to set up multiple claim phases                                  |
| [DropSinglePhase](https://portal.thirdweb.com/contracts/build/extensions/general/DropSinglePhase)             | for distributing ERC20 or ERC721 tokens to set up a single claim phase                                   |
| [LazyMint](https://portal.thirdweb.com/contracts/build/extensions/general/LazyMint)                           | Pre define the metadata for NFTs before they are minted & upload to IPFS                                 |
| [Multicall](https://portal.thirdweb.com/contracts/build/extensions/general/Multicall)                         | Batch together multiple calls in a single external call                                                  |
| [Ownable](https://portal.thirdweb.com/contracts/build/extensions/general/Ownable)                             | Set an owner for your smart contract                                                                     |
| [Permissions](https://portal.thirdweb.com/contracts/build/extensions/general/Permissions)                     | Provide role-based access control                                                                        |
| [PermissionsEnumerable](https://portal.thirdweb.com/contracts/build/extensions/general/PermissionsEnumerable) | Provide role-based access control, plus the capability to view all the addresses holding a specific role |
| [PlatformFee](https://portal.thirdweb.com/contracts/build/extensions/general/PlatformFee)                     | Charge a percentage fee wherever there is a transfer of currency                                         |
| [PrimarySale](https://portal.thirdweb.com/contracts/build/extensions/general/PrimarySale)                     | Set a recipient for any sale value you intend to collect                                                 |
| [Royalty](https://portal.thirdweb.com/contracts/build/extensions/general/Royalty)                             | Take a percentage fee of secondary sales of your NFTs by giving royalty support on NFT marketplaces      |

### Account Abstraction

| Name                                                                                                     | Description                                                                                                |
| -------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------- |
| [AccountExtension](https://portal.thirdweb.com/contracts/build/extensions/erc-4337/AccountExtension)     | Batch minting of new tokens                                                                                |
| [BaseAccount](https://portal.thirdweb.com/contracts/build/extensions/erc-4337/SmartWallet)               | Implementation of the IAccount interface used to detect the SmartWallet Dashboard extension.               |
| [BaseAccountFactory](https://portal.thirdweb.com/contracts/build/extensions/erc-4337/SmartWalletFactory) | Implementation of the IAccountFactory interface used to detect the SmartWalletFactory Dashboard extension. |
## Getting Started

To get started with the Solidity SDK, run the following command to create a new project:

```bash
npx thirdweb create contract
```

Or, install the `contracts` package into your existing Solidity project:

ForgeHardhat

```bash
forge install https://github.com/thirdweb-dev/contracts
```

### Using the Solidity SDK

The Solidity SDK can be used to build new smart contracts _end-to-end_, or to add functionality to your own, existing smart contract using [extensions](https://portal.thirdweb.com/contracts/build/extensions).

All functions in the [base contracts](https://portal.thirdweb.com/contracts/build/base-contracts) and [extensions](https://portal.thirdweb.com/contracts/build/extensions) can be modified by [overriding them](https://portal.thirdweb.com/contracts/build/get-started#inheritance-and-overriding-functions).

#### Using Base Contracts

The Solidity SDK includes [base contracts](https://portal.thirdweb.com/contracts/build/base-contracts) that are fully complete smart contracts that can be customized by overriding functions OR by adding extensions.

**1.** To start, import and inherit the base contract. You can find the list of all available base contracts [here](https://portal.thirdweb.com/contracts/build/base-contracts).

**2.** Base contracts expect certain constructor arguments to function as intended. Implement a constructor for your smart contract and pass the appropriate values to a constructor for the base contract.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/base/ERC721Base.sol";
 
contract MyNFT is ERC721Base {
    constructor(
        address _defaultAdmin,
        string memory _name,
        string memory _symbol,
        address _royaltyRecipient,
        uint128 _royaltyBps
    ) ERC721Base(_defaultAdmin, _name, _symbol, _royaltyRecipient, _royaltyBps) {}
}
```

**3.** Now you're all set up! 🎉 Your smart contract now has all the [extensions](https://portal.thirdweb.com/contracts/build/extensions) provided by the [base contract](https://portal.thirdweb.com/contracts/build/base-contracts) it inherits and is ready to be [deployed](https://portal.thirdweb.com/contracts/deploy/overview) to any EVM blockchain of your choice.

#### Using Extensions

Extensions are to be used via inheritance - your project's smart contract will inherit from them.

Additional [extensions](https://portal.thirdweb.com/contracts/build/extensions) can be added to existing smart contracts or to the [base contracts](https://portal.thirdweb.com/contracts/build/base-contracts) to add extra functionality and unlocking features in the SDKs and Dashboard.

**1.** To start, import and inherit the extension. You can find the list of all available extensions [here](https://portal.thirdweb.com/contracts/build/extensions).

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/base/ERC721Base.sol";
import "@thirdweb-dev/contracts/extension/Permissions.sol";
 
contract MyNFT is ERC721Base, Permissions {
    constructor(
        address _defaultAdmin,
        string memory _name,
        string memory _symbol,
        address _royaltyRecipient,
        uint128 _royaltyBps
    ) ERC721Base(_defaultAdmin, _name, _symbol, _royaltyRecipient, _royaltyBps) {}
}
```

**Note:**

* Some Extensions are **Abstract** and so require certain functions to be implemented\*.
* Some Extensions are **Interfaces** and so require **all** the functions to be implemented\*.

\*implement = write the logic for the function with a matching function signature (matching name, parameters, visibility and return type)

**2.** Use the functions provided by the Extension to change the behavior of your smart contract.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/base/ERC721Base.sol";
import "@thirdweb-dev/contracts/extension/Permissions.sol";
 
contract MyNFT is ERC721Base, Permissions {
    bytes32 private constant MINTER_ROLE = keccak256("MINTER_ROLE");
 
    constructor(
        address _defaultAdmin,
        string memory _name,
        string memory _symbol,
        address _royaltyRecipient,
        uint128 _royaltyBps
    ) ERC721Base(_defaultAdmin, _name, _symbol, _royaltyRecipient, _royaltyBps) {}
 
    /**
     *  `_canMint` is a function available in `ERC721Base`.
     *
     *  It is called every time a wallet tries to mint NFTs on this
     *  contract, and lets you define the condition in which an
     *  attempt to mint NFTs should be permitted, or rejected.
     *
     *  By default, `ERC721Base` only lets the contract's owner mint
     *  NFTs. Here, we override that functionality.
     *
     *  We use the `Permissions` extension to specify that anyone holding
     *  "MINTER_ROLE" should be able to mint NFTs.
     */
    function _canMint() internal view override returns (bool) {
        return hasRole(MINTER_ROLE, msg.sender);
    }
}
```

#### Inheritance and Overriding Functions

Inheritance allows you to extend your smart contract's properties to include the parent contract's attributes and properties. The inherited functions from this parent contract can be modified in the child contract via a process known as overriding.

Parent contract: Contract that the inheriting contract is inheriting from.

Child contract: The inheriting contract.

To override a function, to add your own custom logic, simply use the keyword `override` when declaring the function, making sure that the function signature matches. To add the original logic from the parent contract, use the keyword `super`.

For example, the [ERC721Base](https://portal.thirdweb.com/contracts/build/base-contracts/erc-721/base) contract has an implementation of the function `mintTo`, I could instead override this function to add custom logic and restrict this function in the `myNFT` contract to only allow 1 NFT per wallet:

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/base/ERC721Base.sol";
import "@thirdweb-dev/contracts/extension/Permissions.sol";
 
contract MyNFT is ERC721Base, Permissions {
    constructor(
        address _defaultAdmin,
        string memory _name,
        string memory _symbol,
        address _royaltyRecipient,
        uint128 _royaltyBps
    ) ERC721Base(_defaultAdmin, _name, _symbol, _royaltyRecipient, _royaltyBps) {}
 
    function mintTo(address _to, string memory _tokenURI) public override {
        require(balanceOf(_to) < 1, "only 1 NFT per wallet!");
        super.mintTo(_to, _tokenURI);
    }
}
```

```

```
## Modular Contracts

**Modular Contracts** are contracts for which you can add, remove, or upgrade the exact parts you want.

### Getting started

To get started, install the `modular-contracts` package in your existing Solidity project:

Forge

```bash
forge install https://github.com/thirdweb-dev/modular-contracts
```

A modular contract is made up of \[1\] a **Core** and \[2\] **Extension** contracts. Learn more about these, below.

Follow this [end-to-end guide](https://blog.thirdweb.com/p/d45e40f7-e8f3-4bcd-be6b-f800beff963f/)to learn how to write, deploy and use your own custom modular contract.

### Background

A modular contract is made up of two kinds of contracts:

* **Core** contract: the foundational API that can be customized by installing Extensions.
* **Extension** contract: implements a set of functionality that is enabled on a Core when it is installed.

As an analogy, think of the robot, below. The torso is the _Core_ to which you attach/detach _Extensions_.

The torso has a particular shape and exposes sockets at fixed places -- all of which determine how extensions will be attached to it. Similarly, a Core smart contract has a fixed API that determines what Extensions are compatible for installation.

The _Extensions_ themselves e.g. a leg, arm, head, etc. give the robot (i.e. the modular contract as a whole) its various capabilities.

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fmodular-contracts-analogy.7dc42067.png&w=3840&q=75)

Installing an Extension in a Core customizes the Core’s behaviour in two ways:

* New functions become callable on the Core contract (via its [fallback function](https://docs.soliditylang.org/en/v0.8.26/contracts.html#fallback-function)).
* Core contract’s fixed functions make callback function calls into the Extension.

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fmodular-contracts-flow.c8523b89.png&w=3840&q=75)

You can read about the full technical design details of Modular Contracts in its [design document](https://portal.thirdweb.com/contracts/design-docs/modular-contracts).
## Royalty

```solidity
import "@thirdweb-dev/contracts/extension/Royalty.sol";
```

`Royalty` implements [EIP-2981](https://eips.ethereum.org/EIPS/eip-2981) NFT royalty standard for royalty support on NFT marketplaces, allowing you to take a percentage fee of secondary sales of your NFTs.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/Royalty.sol) 

### Usage

The `Royalty` extension is an _abstract contract_, and expects you to implement the following functions by yourself:

| Name                                                                                                               | Type                    | Returns | Description                                                                                                                       |
| ------------------------------------------------------------------------------------------------------------------ | ----------------------- | ------- | --------------------------------------------------------------------------------------------------------------------------------- |
| [\_canSetRoyaltyInfo](https://portal.thirdweb.com/contracts/build/extensions/general/Royalty#%5Fcansetroyaltyinfo) | internal view _virtual_ | bool    | Runs on every attempt to set a new royalty recipient or BPS. Returns whether this info can be set in the given execution context. |

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/extension/Royalty.sol";
 
contract MyContract is Royalty {
    /**
     *  We store the contract deployer's address only for the purposes of the example
     *  in the code comment below.
     *
     *  Doing this is not necessary to use the `Royalty` extension.
     */
    address public deployer;
 
    constructor() {
        deployer = msg.sender;
    }
 
    function supportsInterface(bytes4 interfaceId)
        public
        view
        virtual
        returns (bool)
    {
        return type(IERC2981).interfaceId == interfaceId;
    }
 
    /**
     *  This function returns who is authorized to set royalty info for your NFT contract.
     *
     *  As an EXAMPLE, we'll only allow the contract deployer to set the royalty info.
     *
     *  You MUST complete the body of this function to use the `Royalty` extension.
     */
    function _canSetRoyaltyInfo()
        internal
        view
        virtual
        override
        returns (bool)
    {
        return msg.sender == deployer;
    }
}
```

### Base Contracts Implementing This Extension

All NFT contracts ([ERC721](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721) or [ERC1155](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155)) implement this extension.

### Full API Reference

##### royaltyInfo

```solidity
function royaltyInfo(uint256 tokenId, uint256 salePrice)
    external
    view
    virtual
returns (address receiver, uint256 royaltyAmount)
```

* Returns royalty recipient and amount for a given NFT and its sale price.
* Parameter `tokenId`: The tokenID of the NFT for which to query royalty info.
* Parameter `salePrice`: Sale price of the NFT.

##### getRoyaltyInfoForToken

```solidity
function getRoyaltyInfoForToken(uint256 tokenId) public view override returns (address, uint16);
```

* Returns the royalty recipient and BPS for a given NFT.
* Parameter `tokenId`: The tokenID of the NFT for which to query royalty info.

##### getDefaultRoyaltyInfo

```solidity
function getDefaultRoyaltyInfo() external view override returns (address, uint16);
```

* Returns the default royalty recipient and BPS for the contract's NFTs.

##### setDefaultRoyaltyInfo

```solidity
function setDefaultRoyaltyInfo(address royaltyRecipient, uint256 royaltyBps) external;
```

* Lets an authorized wallet set the default royalty recipient and BPS for the contract's NFT.
* Parameter `royaltyRecipient`: The address to set as the new default royalty recipient.
* Parameter `royaltyBps`: The value to set as the new default royalty BPS.
* The `_canSetRoyaltyInfo` function is run on every call to this function. If the return value of `_canSetRoyaltyInfo` is `false`, the `setDefaultRoyaltyInfo` call will revert.

##### setRoyaltyInfoForToken

```solidity
function setRoyaltyInfoForToken(
    uint256 tokenId,
    address recipient,
    uint256 bps
) external
```

* Lets an authorized wallet set the royalty recipient and BPS for a particular NFT of the contract.
* Parameter `tokenId`: The tokenId of the NFT for which to set royalty info.
* Parameter `recipient`: The address to set as the new royalty recipient for the NFT.
* Parameter `bps`: The value to set as the new royalty BPS for the NFT.
* The `_canSetRoyaltyInfo` function is run on every call to this function. If the return value of `_canSetRoyaltyInfo` is `false`, the `setRoyaltyInfoForToken` call will revert.

##### \_setupDefaultRoyaltyInfo

```solidity
function _setupDefaultRoyaltyInfo(address royaltyRecipient, uint256 royaltyBps) internal;
```

* Sets the default royalty recipient and BPS for the contract's NFT.
* Parameter `royaltyRecipient`: The address to set as the new default royalty recipient.
* Parameter `royaltyBps`: The value to set as the new default royalty BPS.
* The `_canSetRoyaltyInfo` function is _not_ run on a call to this function.

##### \_setupRoyaltyInfoForToken

```solidity
function _setupDefaultRoyaltyInfo(address royaltyRecipient, uint256 royaltyBps) internal;
```

* Sets the royalty recipient and BPS for a particular NFT of the contract.
* Parameter `tokenId`: The tokenId of the NFT for which to set royalty info.
* Parameter `recipient`: The address to set as the new royalty recipient for the NFT.
* Parameter `bps`: The value to set as the new royalty BPS for the NFT.
* The `_canSetRoyaltyInfo` function is _not_ run on a call to this function.

##### \_canSetRoyaltyInfo

```solidity
function _canSetRoyaltyInfo() internal view virtual returns (bool);
```

* Runs on every `setDefaultRoyaltyInfo` and `setRoyaltyInfoForToken` function calls.
* Returns whether the relevant royalty info can be set in the given execution context.
* For example, this function can check whether the wallet calling `setDefaultRoyaltyInfo` is the contract owner, and enforce that only the owner should be able to successfully call `setDefaultRoyaltyInfo`.
## Deploy Contract

To deploy a contract using Deploy:

* #### Run CLI  
Navigate to the root of the smart contract repository using the CLI. Then, run the command `npx thirdweb deploy`.  
![Screenshot of CLI deployment output text](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fdeploy-cli.6a93f744.png&w=1920&q=75)
* #### Authorize device  
To deploy from a desired wallet in the browser, connect and authorize the device.  
![Screenshot to link Device](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Flink-device.18c52f90.png&w=3840&q=75)
* #### Fill parameter  
Once completed, a user interface will open in the browser that allows filling out the parameters of the contract.  
![Screenshot to detected extensions when deploying contracts](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fdetected-extensions.60fb6424.png&w=3840&q=75)
* #### Select Options  
Fill in the necessary fields, then find the Network / Chain drop-down menu to select a network for deployment. Choose the `Add to dashboard` option if managing this contract from the dashboard and select Deploy Now. This will require signing a transaction in the connected wallet.  
![Screenshot of contract deployment confirmation](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fdeploy-contract.a6e416a9.png&w=3840&q=75)
* #### Manage contract  
Once deployed, you can manage your contract through the dashboard.
## Build (Solidity SDK)

**Build** or **Solidity SDK** provides the tools needed to build custom smart contracts more efficiently by offering a set of pre-built base contracts and reusable components, better known as extensions.

![](/_next/static/media/extension-model.8231e09e.svg)

##### Features

* **Supports popular EIPs:** Effortlessly integrate common smart contract features and functionality from popular EIPs such as ERC-20, ERC-721, ERC-1155, permissions, metadata, and more.
* **Open Source:** The Solidity SDK is open-source and therefore available for any user to audit or contribute to the repository. [View the contracts repository.](https://github.com/thirdweb-dev/contracts)
* **Gas-optimized and audited base contracts:** Using base contracts provides a gas-optimized and audited foundation to build your projects.
* **Unlocked Management & Building Tools:** Each inherited extension unlocks easy-to-use functions in the contract interaction SDKs, custom admin dashboards, and tailored data feeds.
## Deploy

Deployment tools allow you to deploy any contract to any EVM compatible chain through one simple command and an easy-to-use interface. Deploy reduces the complexities of deploying a contract by eliminating steps such as hardcoding private keys, managing RPC URLs, or running scripts to deploy your contracts.

Simply run the following command at the root of your contract directory:

```bash
npx thirdweb deploy
```

#### Features

![](/icons/feature-cards/verified.svg)

##### Automatically verified

Contracts are automatically verified on Sourcify

![](/icons/feature-cards/security.svg)

##### Increased security

Avoid exporting private keys with client-side deployment

![](/icons/feature-cards/frameworks.svg)

##### Support for frameworks

Works with any contract built with Hardhat and Foundry

![](/icons/feature-cards/wallet.svg)

##### Deploy with any wallet

Use any supported EOA or in-app wallet to deploy

![](/icons/feature-cards/dashboard.svg)

##### Dashboard

Unlock a management dashboard to interact with contracts and view analytics

![](/icons/feature-cards/versioning.svg)

##### Publish options

Include versioning and a landing page for published contracts
## PlatformFee

```solidity
import "@thirdweb-dev/contracts/extension/PlatformFee.sol";
```

`PlatformFee` allows you to charge a percentage fee wherever there is a transfer of currency (ERC20 tokens or native tokens) in your contract.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts/blob/main/contracts/extension/PlatformFee.sol) 

### Usage

The `PlatformFee` extension is an _abstract contract_, and expects you to implement the following functions by yourself:

| Name                                                                                                                           | Type                    | Returns | Description                                                                                                                            |
| ------------------------------------------------------------------------------------------------------------------------------ | ----------------------- | ------- | -------------------------------------------------------------------------------------------------------------------------------------- |
| [\_canSetPlatformFeeInfo](https://portal.thirdweb.com/contracts/build/extensions/general/PlatformFee#%5Fcansetplatformfeeinfo) | internal view _virtual_ | bool    | Runs on every attempt to set a new platform fee recipient or bps. Returns whether this info can be set in the given execution context. |

This is an example smart contract demonstrating how to inherit from this extension and override the functions to add (optional) custom functionality.

```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;
 
import "@thirdweb-dev/contracts/extension/PlatformFee.sol";
 
contract MyContract is PlatformFee {
    /**
     *  We store the contract deployer's address only for the purposes of the example
     *  in the code comment below.
     *
     *  Doing this is not necessary to use the `PlatformFee` extension.
     */
    address public deployer;
 
    constructor() {
        deployer = msg.sender;
    }
 
    /**
     *  This function returns who is authorized to set platform fee info for your contract.
     *
     *  As an EXAMPLE, we'll only allow the contract deployer to set the platform fee info.
     *
     *  You MUST complete the body of this function to use the `PlatformFee` extension.
     */
    function _canSetPlatformFeeInfo() internal view virtual override returns (bool) {
        return msg.sender == deployer;
    }
}
```

### Base Contracts Implementing This Extension

None of the base contracts implement this extension.

### Full API reference

##### getPlatformFeeInfo

```solidity
function getPlatformFeeInfo() public view returns (address, uint16);
```

* Returns the platform fee recipient and bps.
* Set this value using the `setPlatformFeeInfo` function.

##### setPlatformFeeInfo

```solidity
function setPlatformFeeInfo(address platformFeeRecipient, uint256 platformFeeBps) external;
```

* Lets an authorized wallet set the platform fee recipient and bps.
* Parameter `platformFeeRecipient`: The address to set as the new platform fee recipient.
* Parameter `platformFeeBps`: The value to set as the new platform fee BPS.
* The `_canSetPlatformFeeInfo` function is run on every call to this function. If the return value of `_canSetPlatformFeeInfo` is `false`, the `setPlatformFeeInfo` call will revert.

##### \_setupPlatformFeeInfo

```solidity
function _setupPlatformFeeInfo(address platformFeeRecipient, uint256 platformFeeBps) internal;
```

* Sets the platform fee recipient and bps.
* Parameter `platformFeeRecipient`: The address to set as the new platform fee recipient.
* Parameter `platformFeeBps`: The value to set as the new platform fee BPS.
* The `_canSetPlatformFeeInfo` function is _not_ run on a call to this function.

##### \_canSetPlatformFeeInfo

```solidity
function _canSetPlatformFeeInfo() internal view virtual returns (bool);
```

* Runs on every `setPlatformFeeInfo` function call.
* Returns whether a new platform fee recipient or bps can be set in the given execution context.
* For example, this function can check whether the wallet calling `setPlatformFeeInfo` is the contract owner, and enforce that only the current owner should be able to successfully call `setPlatformFeeInfo`.
## CLI Reference

Use the CLI to deploy your contracts directly to any EVM compatible blockchain by running:

```bash
npx thirdweb [options]
```

#### Options

```bash
-p--path <string>
```

* Path to project

```bash
-c--clean
```

* Clear the cache before building

```bash
--dry-run
```

* Dry run (skip actually publishing)

```bash
-d--debug
```

* Show debug logs

```bash
--ci
```

* Continuous Integration mode

```bash
--dist-path <string>
```

* Path to the dist folder where the HTML based App is

```bash
-n--name <string>
```

* Name of the pre-built or published contract (such as nft-drop)

```bash
-f--file <string>
```

* Filter for contract files that contain this file name

```bash
-cn--contract-name <string>
```

* Filter for contracts that contain this contract name

```bash
-cv--contract-version <string>
```

* Version of the published contract

```bash
--app
```

* Deploy a web app to decentralized storage

```bash
--contract
```

* Deploy a smart contract to blockchains

```bash
--dynamic
```

* Deploy a dynamic smart contract made up of extensions to blockchains

```bash
-k--key <string>
```

* Optional parameter to use passed in secret key, most useful for continuous integration use cases.
## Drop design document.

This is a live document that explains what the [thirdweb](https://thirdweb.com/) `Drop` smart contracts are, how they work and can be used, and why they are written the way they are.

The document is written for technical and non-technical readers. To ask further questions about any of thirdweb's `Drop`, please [visit our support site](https://thirdweb.com/support) or create a github issue.

### Background

The thirdweb `Drop` contracts are distribution mechanisms for tokens. This distribution mechanism is offered for ERC20, ERC721 and ERC1155 tokens, as `DropERC20`, `DropERC721` and `DropERC1155`.

The `Drop` contracts are meant to be used when the goal of the contract creator is for an audience to come in and claim tokens within certain restrictions e.g. — ‘only addresses in an allowlist can mint tokens', or ‘minters must pay _x_ amount of price in _y_ currency to mint', etc.

The `Drop` contracts let the contract creator establish phases (periods of time), where each phase can specify multiple such restrictions on the minting of tokens during that period of time. We refer to such a phase as a ‘claim condition'.

#### Why we're building `Drop`

We've observed that there are largely three distinct contexts under which one mints tokens —

* Minting tokens for yourself on a contract you own. E.g. a person wants to mint their Twitter profile picture as an NFT.
* Having an audience mint tokens on a contract you own.  
   * The nature of tokens to be minted by the audience is pre-determined by the contract admin. E.g. a 10k NFT drop where the contents of the NFTs to be minted by the audience is already known and determined by the contract admin before the audience comes in to mint NFTs.  
   * The nature of tokens to be minted by the audience is _not_ pre-determined by the contract admin. E.g. a course 'certificate' dynamically generated with the name of the course participant, to be minted by the course participant at the time of course completion.

The thirdweb `Token` contracts serve the cases described in (1) and 2(ii).

The thirdweb `Drop` contracts serve the case described in 2(i). They are written to give a contract creator granular control over restrictions around an audience minting tokens from the same contract (or ‘collection', in the case of NFTs) over an extended period of time.

### Technical Details

The distribution mechanism of `Drop` is as follows — A contract admin establishes a series of 'claim conditions'. A 'claim condition' is a period of time in which accounts can mint tokens on the respective `Drop` contract, within a set of restrictions defined by the ‘claim condition'.

#### Claim Conditions

The following makes up a claim condition —

```solidity
struct ClaimCondition {
  uint256 startTimestamp;
  uint256 maxClaimableSupply;
  uint256 supplyClaimed;
  uint256 quantityLimitPerWallet;
  bytes32 merkleRoot;
  uint256 pricePerToken;
  address currency;
}
```

| Parameters             | Type    | Description                                                                                                                                        |
| ---------------------- | ------- | -------------------------------------------------------------------------------------------------------------------------------------------------- |
| startTimestamp         | uint256 | The unix timestamp after which the claim condition applies. The same claim condition applies until the startTimestamp of the next claim condition. |
| maxClaimableSupply     | uint256 | The maximum total number of tokens that can be claimed under the claim condition.                                                                  |
| supplyClaimed          | uint256 | At any given point, the number of tokens that have been claimed under the claim condition.                                                         |
| quantityLimitPerWallet | uint256 | The maximum number of tokens that can be claimed by a wallet under a given claim condition.                                                        |
| merkleRoot             | bytes32 | The allowlist of addresses that can claim tokens under the claim condition.                                                                        |

(Optional) The allowlist may specify quantity limits, price and currency for addresses in the list, overriding these values under that claim condition.

The parameters that make up a claim condition can be composed in different ways to create specific restrictions around a mint. For example, a single claim condition where:

* `quantityLimitPerWallet = 5`
* `merkleRoot = bytes32(0)`

creates restrictions around a mint, where (1) a wallet can mint at most 5 tokens and (2) all wallets are subject to general claim condition limits, without any overrides.

A `Drop` contract lets a contract admin establish a series of claim conditions, at once. Since each claim condition specifies a `startTime`, a contract admin can establish a series of claim conditions, ordered by their start time, to specify different set of restrictions around minting, during different periods of time.

At any moment, there is only one active claim condition, and an account attempting to mint tokens on the respective `Drop` contract successfully or unsuccessfully, based on whether the account passes the restrictions defined by that moment's active claim condition.

A `Drop` contract natively keeps track of claim conditions set by a contract admin in a ‘claim conditions list', which looks as follows —

```solidity
struct ClaimConditionList {
  uint256 currentStartId;
  uint256 count;
  mapping(uint256 => ClaimCondition) conditions;
  mapping(uint256 => mapping(address => uint256)) supplyClaimedByWallet;
}
```

| Parameter             | Description                                                                                                                                                                   |
| --------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| currentStartId        | The uid for the first claim condition amongst the current set of claim conditions. The uid for each next claim condition is one more than the previous claim condition's uid. |
| count                 | The total number of claim conditions in the list of claim conditions.                                                                                                         |
| conditions            | The claim conditions at a given uid. Claim conditions are ordered in an ascending order by their startTimestamp.                                                              |
| supplyClaimedByWallet | Map from a claim condition uid and account to the supply claimed by that account.                                                                                             |

#### Allowlist as an override list

As mentioned above, an allowlist can specify different conditions for addresses in the list. This way, it serves as an override over general/open restrictions for non-allowlisted addresses. In this allowlist or override-list, an admin can set any/all of these three:

* quantity limit
* price
* currency

If a value is not set for any of these, then the value specified in general claim condition will be used. However, currency override will be considered only when a price override is set too, and not without it.

> **IMPORTANT**: _The allowlist should not contain an address more than once in the same merkle tree. Multiple instances for the same address (with different/same quantity, price etc.) may not function as expected and may lead to unexpected behavior during claim. (More details in Limitations section)._

#### Setting claim conditions

In all `Drop` contracts, a contract admin specifies the following when setting claim conditions:

| Parameter             | Type               | Description                                                                      |
| --------------------- | ------------------ | -------------------------------------------------------------------------------- |
| conditions            | ClaimCondition\[\] | Claim conditions in ascending order by startTimestamp.                           |
| resetClaimEligibility | bool               | Whether to reset supplyClaimedByWallet values when setting new claim conditions. |

When setting claim conditions, any existing set of claim conditions stored in `ClaimConditionsList` are overwritten with the new claim conditions specified in `conditions`.

The claim conditions specified in `conditions` are expected to be in ordered in ascending order, by their ‘start time'. As a result, only one claim condition is active during at any given time.

Each of the claim conditions specified in `conditions` is assigned a unique integer ID. The UID of the first condition in `conditions` is stored as the `ClaimConditionList.currentStartId` and each next claim condition's UID is one more than the previous condition's UID.

![Claim conditions](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fclaim-conditions.408b624f.png&w=3840&q=75)

The `resetClaimEligibility` boolean flag determines what UIDs are assigned to the claim conditions specified in `conditions`. Since `ClaimConditionList.supplyClaimedByWallet` is indexed by the UID of claim conditions, this gives a contract admin more granular control over the restrictions that claim conditions can express. We now illustrate this with an example:

Let's say an existing claim condition **C1** specifies the following restrictions:

* `quantityLimitPerWallet = 1`
* `merkleRoot = bytes32(0)`
* `pricePerToken = 0.1 ether`
* `currency = 0xEeeeeEeeeEeEeeEeEeEeeEEEeeeeEeeeeeeeEEeE` (i.e. native token of the chain e.g ether for Ethereum mainnet)

At a high level, **C1** expresses the following restrictions on minting — any address can claim at most one token, ever, by paying 0.1 ether in price.

Let's say the contract admin wants to increase the price per token from 0.1 ether to 0.2 ether, while ensuring that wallets that have already claimed tokens are not able to claim tokens again. Essentially, the contract admin now wants to instantiate a claim condition **C2** with the following restrictions:

* `quantityLimitPerWallet = 1`
* `merkleRoot = bytes32(0)`
* `pricePerToken = 0.2 ether`
* `currency = 0xEeeeeEeeeEeEeeEeEeEeeEEEeeeeEeeeeeeeEEeE` (i.e. native token of the chain e.g ether for Ethereum mainnet)

To go from **C1** to **C2** while ensuring that wallets that have already claimed tokens are not able to claim tokens again, the contract admin will set claim conditions while specifying `resetClaimEligibility == false`. As a result, the **C2** will be assigned the same UID as **C1**. Since `ClaimConditionList.supplyClaimedByWallet` is indexed by the UID of claim conditions, the information of the quantity of tokens claimed by the wallet during **C1** will not be lost. And so, wallets that claimed tokens during **C1** will now be ineligible to claim tokens during **C2** because of the following check:

```solidity
// pseudo-code
supplyClaimedByWallet = claimCondition.supplyClaimedByWallet[conditionId][claimer];
 
require(quantityToClaim + supplyClaimedByWallet <= quantityLimitPerWallet);
```

#### EIPs supported / implemented

The distribution mechanism for tokens expressed by thirdweb's `Drop` is implemented for ERC20, ERC721 and ERC1155 tokens, as `DropERC20`, `DropERC721` and `DropERC1155`.

There are a few key differences between the three implementations —

* `DropERC20` is written for the distribution of completely fungible, ERC20 tokens. On the other hand, `DropERC721` and `DropERC1155` are written for the distribution of NFTs, which requires ‘lazy minting' i.e. defining the content of the NFTs before an audience comes in to mint them during a claim condition.
* Both `DropERC20` and `DropERC721` maintain a global, contract-wide `ClaimConditionsList` which stores the claim conditions under which tokens can be minted. The `DropERC1155` contract, on the other hand, maintains a `ClaimConditionList` for every integer token ID that an NFT can assume. And so, a contract admin can set up claim conditions per NFT i.e. per token ID, in the `DropERC1155` contract.

### Limitations

#### Sybil attacks

The distribution mechanism of thirdweb's `Drop` contracts is vulnerable to [sybil attacks](https://en.wikipedia.org/wiki/Sybil%5Fattack). That is, despite the various ways in which restrictions can be applied to the minting of tokens, some restrictions that claim conditions can express target wallets and not persons.

For example, the restriction `quantityLimitPerWallet` expresses the max quantity a _wallet_ can claim during the respective claim condition. A sophisticated actor may generate multiple wallets to claim tokens in a way that undermine such restrictions, when viewing such restrictions as restrictions on unique persons, and not wallets.

#### Allowlist behavior

When specifying allowlist of addresses, and quantities, price, etc. for those addresses, contract admins must ensure that they don't list an address more than once in the same merkle tree.

For e.g. admin wishes to grant user X permission to mint 2 tokens at 0.25 ETH, and 4 tokens at 0.5 ETH. In this case, the contract design will not permit the user X to claim 6 tokens with different prices as desired. Instead, the user may be limited to claiming just 2 tokens or 4 tokens based on their order of claiming.

To avoid such pitfalls, an address should be listed only once per merkle tree or allowlist.
## Pack design document.

This is a live document that explains what the [thirdweb](https://thirdweb.com/) `Pack` smart contract is, how it works and can be used, and why it is designed the way it is.

The document is written for technical and non-technical readers. To ask further questions about thirdweb's `Pack` contract, please [visit our support site](https://thirdweb.com/support) or create a github issue.

### Background

The thirdweb `Pack` contract is a lootbox mechanism. An account can bundle up arbitrary ERC20, ERC721 and ERC1155 tokens into a set of packs. A pack can then be opened in return for a selection of the tokens in the pack. The selection of tokens distributed on opening a pack depends on the relative supply of all tokens in the packs.

> **IMPORTANT**: _Pack functions, such as opening of packs, can be costly in terms of gas usage due to random selection of rewards. Please check your gas estimates/usage, and do a trial on testnets before any mainnet deployment._

### Product: How packs _should_ work (without web3 terminology)

Let's say we want to create a set of packs with three kinds of rewards - 80 **circles**, 15 **squares**, and 5 **stars** — and we want exactly 1 reward to be distributed when a pack is opened.

In this case, with thirdweb's `Pack` contract, each pack is guaranteed to yield exactly 1 reward. To deliver this guarantee, the number of packs created is equal to the sum of the supplies of each reward. So, we now have `80 + 15 + 5` i.e. `100` packs at hand.

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fpack-diagram-1.05cb0a04.png&w=1200&q=75)

On opening one of these 100 packs, the opener will receive one of the pack's rewards - either a **circle**, a **square**, or a **star**. The chances of receiving a particular reward is determined by how many of that reward exists across our set of packs.

The percentage chance of receiving a particular kind of reward (e.g. a **star**) on opening a pack is calculated as:`(number_of_stars_packed) / (total number of packs)`

In the beginning, 80 **circles**, 15 **squares**, and 5 **stars** exist across our set of 100 packs. That means the chances of receiving a **circle** upon opening a pack is `80/100` i.e. 80%. Similarly, a pack opener stands a 15% chance of receiving a **square**, and a 5% chance of receiving a **star** upon opening a pack.

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fpack-diagram-2.24e9fed1.png&w=1200&q=75)

The chances of receiving each kind of reward change as packs are opened. Let's say one of our 100 packs is opened, yielding a **circle**. We then have 99 packs remaining, with _79_ **circles**, 15 **squares**, and 5 **stars** packed.

For the next pack that is opened, the opener will have a `79/99` i.e. around 79.8% chance of receiving a **circle**, around 15.2% chance of receiving a **square**, and around 5.1% chance of receiving a **star**.

#### Core parts of `Pack` as a product

Given the above illustration of 'how packs _should_ work', we can now note down certain core parts of the `Pack` product, that any implementation of `Pack` should maintain:

* A creator can pack arbitrary ERC20, ERC721 and ERC1155 tokens into a set of packs.
* The % chance of receiving a particular reward on opening a pack should be a function of the relative supplies of the rewards within a pack. That is, opening a pack _should not_ be like a lottery, where there's an unchanging % chance of being distributed, assigned to rewards in a set of packs.
* A pack opener _should not_ be able to tell beforehand what reward they'll receive on opening a pack.
* Each pack in a set of packs can be opened whenever the respective pack owner chooses to open the pack.
* Packs must be capable of being transferred and sold on a marketplace.

### Why we're building `Pack`

Packs are designed to work as generic packs that contain rewards in them, where a pack can be opened to retrieve the rewards in that pack.

Packs like these already exist as e.g. regular [Pokemon card packs](https://www.pokemoncenter.com/category/booster-packs), or in other forms that use blockchain technology, like [NBA Topshot](https://nbatopshot.com/) packs. This concept is ubiquitous across various cultures, sectors and products.

As tokens continue to get legitimized as assets / items, we're bringing 'packs' — a long-standing way of gamifying distribution of items — onchain, as a primitive with a robust implementation that can be used across all chains, and for all kinds of use cases.

### Technical details

We'll now go over the technical details of the `Pack` contract, with references to the example given in the previous section — 'How packs work (without web3 terminology)'.

#### What can be packed in packs?

You can create a set of packs with any combination of any number of ERC20, ERC721 and ERC1155 tokens. For example, you can create a set of packs with 10,000 [USDC](https://www.circle.com/en/usdc) (ERC20), 1 [Bored Ape Yacht Club](https://opensea.io/collection/boredapeyachtclub) NFT (ERC721), and 50 of [adidas originals' first NFT](https://opensea.io/assets/0x28472a58a490c5e09a238847f66a68a47cc76f0f/0) (ERC1155).

With strictly non-fungible tokens i.e. ERC721 NFTs, each NFT has a supply of 1\. This means if a pack is opened and an ERC721 NFT is selected by the `Pack` contract to be distributed to the opener, that 1 NFT will be distributed to the opener.

With fungible (ERC20) and semi-fungible (ERC1155) tokens, you must specify how many of those tokens must be distributed on opening a pack, as a unit. For example, if adding 10,000 USDC to a pack, you may specify that 20 USDC, as a unit, are meant to be distributed on opening a pack. This means you're adding 500 units of 20 USDC to the set of packs you're creating.

And so, what can be packed in packs are _n_ number of configurations like '500 units of 20 USDC'. These configurations are interpreted by the `Pack` contract as `PackContent`:

```solidity
enum TokenType { ERC20, ERC721, ERC1155 }
 
struct Token {
    address assetContract;
    TokenType tokenType;
    uint256 tokenId;
    uint256 totalAmount;
}
 
uint256 perUnitAmount;
```

| Value         | Description                                                                                                                                                             |
| ------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| assetContract | The contract address of the token.                                                                                                                                      |
| tokenType     | The type of the token -- ERC20 / ERC721 / ERC1155                                                                                                                       |
| tokenId       | The tokenId of the token. (Not applicable for ERC20 tokens. The contract will ignore this value for ERC20 tokens.)                                                      |
| totalAmount   | The total amount of this token packed in the pack. (Not applicable for ERC721 tokens. The contract will always consider this as 1 for ERC721 tokens.)                   |
| perUnitAmount | The amount of this token to distribute as a unit, on opening a pack. (Not applicable for ERC721 tokens. The contract will always consider this as 1 for ERC721 tokens.) |

**Note:** A pack can contain different configurations for the same token. For example, the same set of packs can contain '500 units of 20 USDC' and '10 units of 1000 USDC' as two independent types of underlying rewards.

### Creating packs

You can create packs with any ERC20, ERC721 or ERC1155 tokens that you own. To create packs, you must specify the following:

```solidity
/// @dev Creates a pack with the stated contents.
function createPack(
    Token[] calldata contents,
    uint256[] calldata numOfRewardUnits,
    string calldata packUri,
    uint128 openStartTimestamp,
    uint128 amountDistributedPerOpen,
    address recipient
) external
```

| Parameter                | Description                                                                                                    |
| ------------------------ | -------------------------------------------------------------------------------------------------------------- |
| contents                 | Tokens/assets packed in the set of pack.                                                                       |
| numOfRewardUnits         | Number of reward units for each asset, where each reward unit contains per unit amount of corresponding asset. |
| packUri                  | The (metadata) URI assigned to the packs created.                                                              |
| openStartTimestamp       | The timestamp after which packs can be opened.                                                                 |
| amountDistributedPerOpen | The number of reward units distributed per open.                                                               |
| recipient                | The recipient of the packs created.                                                                            |

#### Packs are ERC1155 tokens i.e. NFTs

Packs themselves are ERC1155 tokens. And so, a set of packs created with your tokens is itself identified by a unique tokenId, has an associated metadata URI and a variable supply.

In the example given in the previous section — 'Non technical overview', there is a set of 100 packs created, where that entire set of packs is identified by a unique tokenId.

Since packs are ERC1155 tokens, you can publish multiple sets of packs using the same `Pack` contract.

#### Supply of packs

When creating packs, you can specify the number of reward units to distribute to the opener on opening a pack. And so, when creating a set of packs, the total number of packs in that set is calculated as:

`total_supply_of_packs = (total_reward_units) / (reward_units_to_distribute_per_open)`

This guarantees that each pack can be opened to retrieve the intended _n_ reward units from inside the set of packs.

### Updating packs

You can add more contents to a created pack, up till the first transfer of packs. No addition can be made post that.

```solidity
/// @dev Add contents to an existing packId.
function addPackContents(
    uint256 packId,
    Token[] calldata contents,
    uint256[] calldata numOfRewardUnits,
    address recipient
) external
```

| Parameter        | Description                                                                                                    |
| ---------------- | -------------------------------------------------------------------------------------------------------------- |
| PackId           | The identifier of the pack to add contents to.                                                                 |
| contents         | Tokens/assets packed in the set of pack.                                                                       |
| numOfRewardUnits | Number of reward units for each asset, where each reward unit contains per unit amount of corresponding asset. |
| recipient        | The recipient of the new supply added. Should be the same address used during creation of packs.               |

### Opening packs

Packs can be opened by owners of packs. A pack owner can open multiple packs at once. 'Opening a pack' essentially means burning the pack and receiving the intended _n_ number of reward units from inside the set of packs, in exchange.

```solidity
function openPack(uint256 packId, uint256 amountToOpen) external;
```

| Parameter    | Description                          |
| ------------ | ------------------------------------ |
| packId       | The identifier of the pack to open.  |
| amountToOpen | The number of packs to open at once. |

#### How reward units are selected to distribute on opening packs

We build on the example in the previous section — 'Non-technical overview'.

Each single **square**, **circle** or **star** is considered as a 'reward unit'. For example, the 5 **stars** in the packs may be “5 units of 1000 USDC”, which is represented in the `Pack` contract by the following information

```solidity
struct Token {
    address assetContract; // USDC address
    TokenType tokenType; // TokenType.ERC20
    uint256 tokenId; // Not applicable
    uint256 totalAmount; // 5000
}
 
uint256 perUnitAmount; // 1000
```

The percentage chance of receiving a particular kind of reward (e.g. a **star**) on opening a pack is calculated as:`(number_of_stars_packed) / (total number of packs)`. Here, `number_of_stars_packed` refers to the total number of reward units of the **star** kind inside the set of packs e.g. a total of 5 units of 1000 USDC.

Going back to the example in the previous section — 'Non-technical overview'. — the supply of the reward units in the relevant set of packs - 80 **circles**, 15 **squares**, and 5 **stars -** can be represented on a number line, from zero to the total supply of packs - in this case, 100.

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fpack-diagram-2.24e9fed1.png&w=1200&q=75)

Whenever a pack is opened, the `Pack` contract uses a new _random_ number in the range of the total supply of packs to determine what reward unit will be distributed to the pack opener.

In our example case, the `Pack` contract uses a random number less than 100 to determine whether the pack opener will receive a **circle**, **square** or a **star**.

So e.g. if the random number `num` is such that `0 <= num < 5`, the pack opener will receive a **star**. Similarly, if `5 <= num < 20`, the opener will receive a **square**, and if `20 <= num < 100`, the opener will receive a **circle**.

Note that given this design, the opener truly has a 5% chance of receiving a **star**, a 15% chance of receiving a **square**, and an 80% chance of receiving a **circle**, as long as the random number used in the selection of the reward unit(s) to distribute is truly random.

### The problem with random numbers

From the previous section — 'How reward units are selected to distribute on opening packs':

> Note that given this design, the opener truly has a 5% chance of receiving a **star**, a 15% chance of receiving a **square**, and an 80% chance of receiving a **circle**, as long as the random number used in the selection of the reward unit(s) to distribute is truly random.

In the event of a pack opening, the random number used in the process affects what unit of reward is selected by the `Pack` contract to be distributed to the pack owner.

If a pack owner can predict, at any moment, what random number will be used in this process of the contract selecting what unit of reward to distribute on opening a pack at that moment, the pack owner can selectively open their pack at a moment where they'll receive the reward they want from the pack.

This is a **possible** **critical vulnerability** since a core feature of the `Pack` product offering is the guarantee that each reward unit in a pack has a % probability of being distributed on opening a pack, and that this probability has some integrity (in the common sense way). Being able to predict the random numbers, as described above, overturns this guarantee.

#### Sourcing random numbers — solution

The `Pack` contract requires a design where a pack owner _cannot possibly_ predict the random number that will be used in the process of their pack opening.

To ensure the above, we make a simple check in the `openPack` function:

```solidity
require(isTrustedForwarder(msg.sender) || _msgSender() == tx.origin, "opener cannot be smart contract");
```

`tx.origin` returns the address of the external account that initiated the transaction, of which the `openPack` function call is a part of.

The above check essentially means that only an external account i.e. an end user wallet, and no smart contract, can open packs. This lets us generate a pseudo random number using block variables, for the purpose of `openPack`:

```solidity
uint256 random = uint256(keccak256(abi.encodePacked(_msgSender(), blockhash(block.number - 1), block.difficulty)));
```

Since only end user wallets can open packs, a pack owner _cannot possibly_ predict the random number that will be used in the process of their pack opening. That is because a pack opener cannot query the result of the random number calculation during a given block, and call `openPack` within that same block.

We now list the single most important advantage, and consequent trade-off of using this solution:

| Advantage                                                                                                      | Trade-off                                                                        |
| -------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------- |
| A pack owner cannot possibly predict the random number that will be used in the process of their pack opening. | Only external accounts / EOAs can open packs. Smart contracts cannot open packs. |

#### Sourcing random numbers — discarded solutions

We'll now discuss some possible solutions for this design problem along with their trade-offs / why we do not use these solutions:

* **Using an oracle (e.g. Chainlink VRF)**  
Using an oracle like Chainlink VRF enables the original design for the `Pack` contract: a pack owner can open _n_ number of packs, whenever they want, independent of when the other pack owners choose to open their own packs. All in all — opening _n_ packs becomes a closed isolated event performed by a single pack owner.  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fpack-diagram-3.530165ba.png&w=1200&q=75)  
**Why we're not using this solution:**  
   * Chainlink VRF v1 is only on Ethereum and Polygon, and Chainlink VRF v2 (current version) is only on Ethereum and Binance. As a result, this solution cannot be used by itself across all the chains thirdweb supports (and wants to support).  
   * Each random number request costs an end user Chainlink's LINK token — it is costly, and seems like a random requirement for using a thirdweb offering.
* **Delayed-reveal randomness: rewards for all packs in a set of packs visible all at once**By 'delayed-reveal' randomness, we mean the following —  
   * When creating a set of packs, the creator provides (1) an encrypted seed i.e. integer (see the [encryption pattern used in thirdweb's delayed-reveal NFTs](https://blog.thirdweb.com/delayed-reveal-nfts#step-1-encryption)), and (2) a future block number.  
   * The created packs are _non-transferrable_ by any address except the (1) pack creator, or (2) addresses manually approved by the pack creator. This is to let the creator distribute packs as they desire, _and_ is essential for the next step.  
   * After the specified future block number passes, the creator submits the unencrypted seed to the `Pack` contract. Whenever a pack owner now opens a pack, we calculate the random number to be used in the opening process as follows:  
   ```solidity  
   uint256 random = uint(keccak256(seed, msg.sender, blockhash(storedBlockNumber)));  
   ```  
         * No one can predict the block hash of the stored future block unless the pack creator is the miner of the block with that block number (highly unlikely).  
         * The seed is controlled by the creator, submitted at the time of pack creation, and cannot be changed after submission.  
         * Since packs are non-transferrable in the way described above, as long as the pack opener is not approved to transfer packs, the opener cannot manipulate the value of `random` by transferring packs to a desirable address and then opening the pack from that address.**Why we're not using this solution:**  
   * Active involvement from the pack creator. They're trusted to reveal the unencrypted seed once packs are eligible to be opened.  
   * Packs _must_ be non-transferrable in the way described above, which means they can't be purchased on a marketplace, etc. Lack of a built-in distribution mechanism for the packs.
## Modular Contracts design document.

### Background

_Modular Contracts_ is a framework for writing highly composable smart contracts. These are smart contracts for which you can add, remove, upgrade or switch out the exact parts you want.

A modular contract is made up of two kinds of contracts:

* **Core** contract: the foundational API that can be customized by installing Extensions.
* **Extension** contract: implements a set of functionality that is enabled on a Core when it is installed.

As an analogy, think of the robot, below. The torso is the _Core_ to which you attach/detach _Extensions_.

The torso has a particular shape and exposes sockets at fixed places -- all of which determine how extensions will be attached to it. Similarly, a Core smart contract has a fixed API that determines what Extensions are compatible for installation.

The _Extensions_ themselves e.g. a leg, arm, head, etc. give the robot (i.e. the modular contract as a whole) its various capabilities.

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fmodular-contracts-analogy.7dc42067.png&w=3840&q=75)

Installing an Extension in a Core customizes the Core’s behaviour in two ways:

* New functions become callable on the Core contract (via its [fallback function](https://docs.soliditylang.org/en/v0.8.26/contracts.html#fallback-function)).
* Core contract’s fixed functions make callback function calls into the Extension.

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fmodular-contracts-flow.c8523b89.png&w=3840&q=75)

As an example — a developer can write an ERC-721 NFT smart contract as a **_Core_** contract. An entire ecosystem of third-party developer built customizations can form around this one **_Core_**.

Various minting and burning mechanisms, token metadata formats, soulbound capabilities, etc. can all be implemented as independent **_Extension_** smart contracts which can be plugged into a developer’s ERC-721 **_Core_** contract.

This means — builders can now deploy this ERC-721 **_Core_** contract, and access a host of customizations they can use to evolve their NFT collection over time.

As seen in this example, the advantage of building a product with Modular Contracts is:

* **Future Proof:** a product has needs that evolve over time. Modular contracts can be updated to adapt to changing product requirements and new industry innovations as needed.
* **Flexible:** the Modular Contracts framework is compatible with all upgradeability and feature-related industry standards. This means modular contracts can be written to follow any of the popular EIPs and be structured as upgradeable or non-upgradeable contracts — all without losing out on its customizability.
* **Highly Customizable:** Modular Contracts have been developed to enjoy a vast library of opt-in customizations in which you can discover the right smart contract features for building out your use case.

### Technical Design

#### Abstract

This architecture standardizes how a router contract verifies that an implementation contract is safe and compatible as a call destination for a given set of functions.

The architecture outlines interfaces for router contracts and implementation contracts that let them communicate and agree over compatibility with each other, and interfaces for ERC-165 compliance by router contracts.

#### Motivation

Router contracts (i.e. contracts with a potentially different call destination per function) have gained adoption for their quality of being future-proof and upgradeable in parts.

There are various different ways to write router or implementation contracts, which means using any given implementation contract as a call destination in any given router contract can lead to either contract not operating according to its specification.

The goal of this architecture is to make all router and implementation contracts interoperable by creating a method where both contracts communicate and agree over compatibility before a router sets some implementation contract as the call destination for a set of functions.

The ecosystem benefits from this standardization as

* developers can safely re-use any self or third-party developed features (implementation contracts) across many projects (router contracts).
* new feature innovations (implementation contracts) can explicitly break compatibility with older, already deployed projects (router contracts).

#### Specification

> The key words “MUST”, “MUST NOT”, “REQUIRED”, “SHALL”, “SHALL NOT”, “SHOULD”, “SHOULD NOT”, “RECOMMENDED”, “NOT RECOMMENDED”, “MAY”, and “OPTIONAL” in this document are to be interpreted as described in RFC 2119 and RFC 8174.

##### Definitions

* **Router**: a smart contract with a potentially different call destination per function
* **Implementation**: a smart contract stored by a router contract as the call destination a given set of functions.
* **Modular Core:** a router contract written in the Modular Contract architecture and expresses compatibility with certain implementation contracts. Also referenced as “Core”.
* **Modular Extension**: an implementation contract written in the Modular Contract architecture and expresses compatibility with certain router contracts. Also referenced as “Extension”.

##### Extension Config

The `ExtensionConfig` struct contains all information that a Core uses to check whether an Extension is compatible for installation.

**`ExtensionConfig` struct**

| Field                        | Type                 | Description                                                                                                                           |
| ---------------------------- | -------------------- | ------------------------------------------------------------------------------------------------------------------------------------- |
| requiredInterfaces           | bytes4\[\]           | The ERC-165 interfaces that a Core MUST support to be compatible for installation. (OPTIONAL field)                                   |
| registerInstallationCallback | bool                 | Whether the Extension expects onInstall and onUninstall callback function calls at installation and uninstallation time, respectively |
| supportedInterfaces          | bytes4\[\]           | The ERC-165 interfaces that a Core supports upon installing the Extension.                                                            |
| callbackFunctions            | CallbackFunction\[\] | List of callback functions that the Core MUST call at some point in the execution of its fixed functions.                             |
| fallbackFunction             | FallbackFunction\[\] | List of functions that the Core MUST call via its fallback function with the Extension as the call destination.                       |

**`FallbackFunction` struct**

| Field          | Type    | Description                                                                                                                           |
| -------------- | ------- | ------------------------------------------------------------------------------------------------------------------------------------- |
| selector       | bytes4  | The 4-byte selector of the function.                                                                                                  |
| permissionBits | uint256 | Core’s fallback function MUST check that msg.sender has these permissions before performing a call on the Extension. (OPTIONAL field) |

**`CallbackFunction` struct**

| Field    | Type   | Description                          |
| -------- | ------ | ------------------------------------ |
| selector | bytes4 | The 4-byte selector of the function. |

##### Modular Core

A router contract MUST implement `IModularCore` and ERC-165 interfaces to comply with the Modular Contract architecture.

The `ERC165.supportsInterface` function MUST return true for all interfaces supported by the Core and the supported interfaces expressed in the ExtensionConfig of installed extensions.

```solidity
// SPDX-License-Identifier: Apache-2.0
pragma solidity ^0.8.23;
 
import {IExtensionConfig} from "./IExtensionConfig.sol";
import {IERC165} from "./IERC165.sol";
 
interface IModularCore is IExtensionConfig, IERC165 {
    /*//////////////////////////////////////////////////////////////
                            STRUCTS & ENUMS
    //////////////////////////////////////////////////////////////*/
 
    /**
     *  @dev Whether execution reverts when the callback function is not implemented by any installed Extension.
     *  @param OPTIONAL Execution does not revert when the callback function is not implemented.
     *  @param REQUIRED Execution reverts when the callback function is not implemented.
     */
    enum CallbackMode {
        OPTIONAL,
        REQUIRED
    }
 
    /**
     *  @dev Struct representing a callback function called on an Extension during some fixed function's execution.
     *  @param selector The 4-byte function selector of the callback function.
     *  @param mode Whether execution reverts when the callback function is not implemented by any installed Extension.
     */
    struct SupportedCallbackFunction {
        bytes4 selector;
        CallbackMode mode;
    }
 
    /**
     *  @dev Struct representing an installed Extension.
     *  @param implementation The address of the Extension contract.
     *  @param config The Extension Config of the Extension contract.
     */
    struct InstalledExtension {
        address implementation;
        ExtensionConfig config;
    }
 
    /*//////////////////////////////////////////////////////////////
                            VIEW FUNCTIONS
    //////////////////////////////////////////////////////////////*/
 
    /// @dev Returns all callback function calls made to Extensions at some point during a fixed function's execution.
    function getSupportedCallbackFunctions() external pure returns (SupportedCallbackFunction[] memory);
 
    /// @dev Returns all installed extensions and their respective extension configs.
    function getInstalledExtensions() external view returns (InstalledExtension[] memory);
 
    /*//////////////////////////////////////////////////////////////
                            EXTERNAL FUNCTIONS
    //////////////////////////////////////////////////////////////*/
 
    /**
     *  @dev Installs an Extension in the Core.
     *
     *  @param extensionContract The address of the Extension contract to be installed.
     *  @param data The data to be passed to the Extension's onInstall callback function.
     *
     *  MUST implement authorization control.
     *  MUST call `onInstall` callback function if Extension Config has registerd for installation callbacks.
     *  MUST revert if Core does not implement the interface required by the Extension, specified in the Extension Config.
     *  MUST revert if any callback or fallback function in the Extension's ExtensionConfig is already registered in the Core with another Extension.
     *
     *  MAY interpret the provided address as the implementation address of the Extension contract to install as a proxy.
     */
    function installExtension(address extensionContract, bytes calldata data) external payable;
 
    /**
     *  @dev Uninstalls an Extension from the Core.
     *
     *  @param extensionContract The address of the Extension contract to be uninstalled.
     *  @param data The data to be passed to the Extension's onUninstall callback function.
     *
     *  MUST implement authorization control.
     *  MUST call `onUninstall` callback function if Extension Config has registerd for installation callbacks.
     *
     *  MAY interpret the provided address as the implementation address of the Extension contract which is installed as a proxy.
     */
    function uninstallExtension(address extensionContract, bytes calldata data) external payable;
}
```

##### Modular Extension

Any given callback function in the ExtensionConfig of an installed Extension MUST be called by the Core during the function execution of some fixed function.

Any given fallback function in the ExtensionConfig of an installed Extension MUST be called by the Core via its fallback, when called with the given fallback function’s calldata.

```solidity
interface IModularExtension is IExtensionConfig {
    /**
     *  @dev Returns the ExtensionConfig of the Extension contract.
     */
    function getExtensionConfig() external pure returns (ExtensionConfig memory);
}
```

#### Rationale

##### Callback and Fallback functions

We allow for a Core to be customized by Extension contracts in two different ways — callback functions and fallback functions.

Callback functions are function calls made to an Extension at some point during the execution of a fixed function. They allow injecting custom logic to run within a Core’s fixed functions. This means a Core can have a foundational API of fixed functions which can nevertheless enjoy customizations.

Fallback functions are functions that are callable on the Core as an entrypoint, whereon the Core calls an Extension from its fallback function with the calldata it receives. They allow additions to a Core’s foundational API of fixed functions.

##### Callback and Fallback functions are called via delegateCall

All callback and fallback functions care called via performing a delegateCall on the Extension contract where the respective function is defined. This means that Extension contracts define functions that instruct the Core contract on how it should update its state.

This is to allow developers to only care about a core contract’s address as an entrypoint for calling any functions, and for the state making up the whole smart contract system to not be split across the Core and various Extension contracts, and instead, only be consolidated in the Core contract’s state.

##### Core and Extension compatibility

An Extension is compatible to install in a Core if:

* all of the Extension’s callback functions (specified in ExtensionConfig) are included in the Core’s supported callbacks (specified in IModularCore.getSupportedCallbackFunctions).  
This is because we assume that an Extension only specifies a callback function in its ExtensionConfig when it expects a Core to call it.
* the Core implements the required interface (if any) specified by the ExtensionConfig  
It is optional for an ExtensionConfig to specify an interface that a Core must implement. However, some Extensions may only be sensible to install in particular Core contracts, and the ExtensionConfig.requiredInterfaceId field encodes this requirement.

##### Pure getter functions

Both IModularCore.getSupportedCallbackFunctions and IModularExtension.getExtensionConfig are pure functions, which means their return value does not change based on any storage.

For a given Extension, it is important for the Core’s stored representation of an ExtensionConfig to not go out of sync with the actual return value of IModularExtension.getExtensionConfig at any time, since this may lead to unintended consequences such as the Core calling functions on the Extension that no longer exist or be called on the Extension contract.

##### Permissions in FallbackFunction and CallbackFunction structs

The FallbackFunction struct contains a `uint256 permissions` field that allows expressing the permissions required by the msg.sender in the Core contract’s fallback to be authorized for calling the relevant function on the Extension contract.

This is important because a caller should be authorized for making the state updates to the Core contract that’ll result from a delegateCall to the relevant Extension contract function.

The CallbackFunction struct does not contain a similar permissions struct field.

This is because a callback function call is specified in the function body of a fixed function, and so, the authorization a caller is left to the Core contract itself since it is expected that the Core will perform authorization checks on callers in its fixed functions, wherever necessary.

#### Reference Implementation

##### IModularCore

<https://github.com/thirdweb-dev/modular-contracts/blob/main/src/ModularCore.sol>

##### IModularExtension

```solidity
library MockExtensionStorage {
    /// @custom:storage-location erc7201:mock.extension
    bytes32 public constant MOCK_EXTENSION_STORAGE_POSITION =
        keccak256(abi.encode(uint256(keccak256("mock.extension")) - 1)) & ~bytes32(uint256(0xff));
 
    struct Data {
				uint256 count;
    }
 
    function data() internal pure returns (Data storage data_) {
        bytes32 position = MOCK_EXTENSION_STORAGE_POSITION;
        assembly {
            data_.slot := position
        }
    }
}
 
contract MockExtension is IModularExtension {
 
    function increment() external {
			   MockExtensionStorage.data().count++;
    }
 
    function getIndex() external view {
		    return MockExtensionStorage.data().count++;
    }
 
    function getExtensionConfig() external pure override returns (ExtensionConfig memory config) {
        config.callbackFunctions = new CallbackFunction[](1);
        config.callbackFunctions[0] = CallbackFunction(this.increment.selector);
 
        config.fallbackFunctions = new FallbackFunction()[1];
        config.fallbackFunctions[0] = FallbackFunction(this.getIndex.selector, 0);
    }
}
```

#### Security Considerations

##### Core out-of-sync with Extension

For a Core to go “out of sync” with an installed Extension means that the extension config stored locally by the Core is different from the return value of the `getExtensionConfig` function of the Extension.

Since the extension config of an Extension encodes the spec. that defines how the Extension contract is _meant_ to be used when installed, a Core going out-of-sync with an installed Extension in this way is spec. breaking for both the Core and Extension contracts.

This scenario can occur when the return value of the `getExtensionConfig` function changes after and while the Extension is installed in the Core. Since the `getExtensionConfig` is a pure function, this is only possible when the installed Extension is a proxy contract whose underlying implementation can be upgraded, and hence, the return value of the pure function `getExtensionConfig` can potentially change.

For this reason, we recommend not using already proxy contracts as Extensions to install, and rather, install Extensions that are non-proxy, implementation contracts.

An upgrade/patch to an installed Extension should be performed by first uninstalling the Extension, and then re-installing the Extension by providing the `installExtension` function the relevant new implementation address.

---

thirdweb is excited to bring Modular Contracts to developers. The Modular Contract framework is actively being developed in the opensource thirdweb-dev/modular-contracts github repository, and is currently in audit.
## Account Factory

The **Account Factory** contract is used to deploy immutable [ERC-4337](https://eips.ethereum.org/EIPS/eip-4337) smart accounts with role based permission control. The `Account` contract is a simple smart account contract that comes with all the basic benefits of account abstraction, along with the mentioned default features. App developers can issue `Account` smart accounts programmatically by deploying an `AccountFactory` smart contract. The `Account` smart contract is non-upgradeable. Developers should use this wallet if they do not anticipate making any future upgrades to their users' wallets.

thirdweb’s smart accounts have the following features by default:

* Have multiple signers with different permissions
* Execute transactions (single and batched).
* Send and receive native tokens.
* Send and receive ERC-721 and ERC-1155 NFTs.
* Multicall-able.
* Store contract metadata.

### Extensions

This contract includes the following extensions:

* [Permissions](https://portal.thirdweb.com/contracts/build/extensions/general/Permissions)
* [PermissionsEnumerable](https://portal.thirdweb.com/contracts/build/extensions/general/PermissionsEnumerable)
* [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)
* [AccountFactory](https://portal.thirdweb.com/contracts/build/extensions/erc-4337/SmartWallet-factory)

### Use Cases & Examples

Use the `AccountFactory` contract alongside the [Connect SDK](https://portal.thirdweb.com/connect/account-abstraction) to easily use account abstraction in your projects:

* [React Guide](https://portal.thirdweb.com/connect/account-abstraction/guides/react)
* [Typescript Guide](https://portal.thirdweb.com/connect/account-abstraction/guides/typescript)
* [Unity Guide](https://portal.thirdweb.com/unity/wallets/providers/account-abstraction)
## Multiwrap design document.

This is a live document that explains what the [thirdweb](https://thirdweb.com/) `Multiwrap` smart contract is, how it works and can be used, and why it is designed the way it is.

The document is written for technical and non-technical readers. To ask further questions about thirdweb's `Multiwrap` contract, please [visit our support site](https://thirdweb.com/support) or create a github issue.

### Background

The thirdweb Multiwrap contract lets you wrap arbitrary ERC20, ERC721 and ERC1155 tokens you own into a single wrapped token / NFT.

The `Multiwrap` contract is meant to be used for bundling up multiple assets (ERC20 / ERC721 / ERC1155) into a single wrapped token, which can then be unwrapped in exchange for the underlying tokens.

The single wrapped token received on bundling up multiple assets, as mentioned above, is an ERC721 NFT. It can be transferred, sold on any NFT Marketplace, and generate royalties just like any other NFTs.

#### How the `Multiwrap` product _should_ work

![Multiwrap diagram](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fmultiwrap-diagram.ced70fcb.png&w=3840&q=75)

A token owner should be able to wrap any combination of _n_ ERC20, ERC721 or ERC1155 tokens as a wrapped NFT. When wrapping, the token owner should be able to specify a recipient for the wrapped NFT. At the time of wrapping, the token owner should be able to set the metadata of the wrapped NFT that will be minted.

The wrapped NFT owner should be able to unwrap the NFT to retrieve the underlying tokens of the wrapped NFT. At the time of unwrapping, the wrapped NFT owner should be able to specify a recipient for the underlying tokens of the wrapped NFT.

The `Multiwrap` contract creator should be able to apply the following role-based restrictions:

* Restrict what assets can be wrapped on the contract.
* Restrict which wallets can wrap tokens on the contract.
* Restrict what wallets can unwrap owned wrapped NFTs.

#### Core parts of the `Multiwrap` product

* A token owner should be able to wrap any combination of _n_ ERC20, ERC721 or ERC1155 tokens as a wrapped token.
* A wrapped token owner should be able to unwrap the token to retrieve the underlying contents of the wrapped token.

#### Why we're building `Multiwrap`

We're building `Multiwrap` for cases where an application wishes to bundle up / distribute / transact over _n_ independent tokens all at once, as a single asset. This opens up several novel NFT use cases.

For example, consider a lending service where people can take out a loan while putting up an NFT as a collateral. Using `Multiwrap`, a borrower can wrap their NFT with some ether, and put up the resultant wrapped ERC721 NFT as collateral on the lending service. Now, the borrower's NFT, as collateral, has a floor value.

### Technical Details

The `Multiwrap`contract itself is an ERC721 contract.

It lets you wrap arbitrary ERC20, ERC721 or ERC1155 tokens you own into a single wrapped token / NFT. This means escrowing the relevant ERC20, ERC721 and ERC1155 tokens into the `Multiwrap` contract, and receiving the wrapped NFT in exchange.

This wrapped NFT can later be 'unwrapped' i.e. burned in exchange for the underlying tokens.

#### Wrapping tokens

To wrap multiple ERC20, ERC721 or ERC1155 tokens as a single wrapped NFT, a token owner must:

* approve the relevant tokens to be transferred by the `Multiwrap` contract.
* specify the tokens to be wrapped into a single wrapped NFT. The following is the format in which each token to be wrapped must be specified:

```solidity
/// @notice The type of assets that can be wrapped.
enum TokenType { ERC20, ERC721, ERC1155 }
 
struct Token {
    address assetContract;
    TokenType tokenType;
    uint256 tokenId;
    uint256 totalAmount;
}
```

| Parameters    | Type      | Description                                                                         |
| ------------- | --------- | ----------------------------------------------------------------------------------- |
| assetContract | address   | The contract address of the asset to wrap.                                          |
| tokenType     | TokenType | The token type (ERC20 / ERC721 / ERC1155) of the asset to wrap.                     |
| tokenId       | uint256   | The token Id of the asset to wrap, if the asset is an ERC721 / ERC1155 NFT.         |
| totalAmount   | uint256   | The amount of the asset to wrap, if the asset is an ERC20 / ERC1155 fungible token. |

Each token in the bundle of tokens to be wrapped as a single wrapped NFT must be specified to the `Multiwrap` contract in the form of the `Token` struct. The contract handles the respective token based on the value of `tokenType` provided. Any incorrect values passed (e.g. the `totalAmount` specified to be wrapped exceeds the token owner's token balance) will cause the wrapping transaction to revert.

Multiple tokens can be wrapped as a single wrapped NFT by calling the following function:

```solidity
function wrap(
    Token[] memory tokensToWrap,
    string calldata uriForWrappedToken,
    address recipient
) external payable returns (uint256 tokenId);
```

| Parameters         | Type      | Description                           |
| ------------------ | --------- | ------------------------------------- |
| tokensToWrap       | Token\[\] | The tokens to wrap.                   |
| uriForWrappedToken | string    | The metadata URI for the wrapped NFT. |
| recipient          | address   | The recipient of the wrapped NFT.     |

#### Unwrapping the wrapped NFT

The single wrapped NFT, received on wrapping multiple assets as explained in the previous section, can be unwrapped in exchange for the underlying assets.

A wrapped NFT can be unwrapped either by the owner, or a wallet approved by the owner to transfer the NFT via `setApprovalForAll` or `approve` ERC721 functions.

When unwrapping the wrapped NFT, the wrapped NFT is burned.\*\*\*\*

A wrapped NFT can be unwrapped by calling the following function:

```solidity
function unwrap(
    uint256 tokenId,
    address recipient
) external;
```

| Parameters | Type      | Description                                                                         |
| ---------- | --------- | ----------------------------------------------------------------------------------- |
| tokenId    | Token\[\] | The token Id of the wrapped NFT to unwrap.                                          |
| recipient  | address   | The recipient of the underlying ERC20, ERC721 or ERC1155 tokens of the wrapped NFT. |

### Permissions

| Role name      | Type (Switch / !Switch) | Purpose                                                   |
| -------------- | ----------------------- | --------------------------------------------------------- |
| TRANSFER\_ROLE | Switch                  | Only token transfers to or from role holders are allowed. |
| MINTER\_ROLE   | Switch                  | Only role holders can wrap tokens.                        |
| UNWRAP\_ROLE   | Switch                  | Only role holders can unwrap wrapped NFTs.                |
| ASSET\_ROLE    | Switch                  | Only assets with the role can be wrapped.                 |

What does **Type (Switch / !Switch)** mean?

* **Switch:** If `address(0)` has `ROLE`, then the `ROLE` restrictions don't apply.
* **!Switch:** `ROLE` restrictions always apply.

### Relevant EIPs

| EIP  | Link                                      | Relation to Multiwrap                                                                                                                                       |
| ---- | ----------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------- |
| 721  | <https://eips.ethereum.org/EIPS/eip-721>  | Multiwrap itself is an ERC721 contract. The wrapped NFT received by a token owner on wrapping is an ERC721 NFT. Additionally, ERC721 tokens can be wrapped. |
| 20   | <https://eips.ethereum.org/EIPS/eip-20>   | ERC20 tokens can be wrapped.                                                                                                                                |
| 1155 | <https://eips.ethereum.org/EIPS/eip-1155> | ERC1155 tokens can be wrapped.                                                                                                                              |
| 2981 | <https://eips.ethereum.org/EIPS/eip-2981> | Multiwrap implements ERC 2981 for distributing royalties for sales of the wrapped NFTs.                                                                     |
| 2771 | <https://eips.ethereum.org/EIPS/eip-2771> | Multiwrap implements ERC 2771 to support meta-transactions (aka “gasless” transactions).                                                                    |
## Signature minting design document.

This is a live document that explains the 'signature minting' mechanism used in [thirdweb](https://thirdweb.com/) `Token` smart contracts.

The document is written for technical and non-technical readers. To ask further questions about any of thirdweb's `Drop`, please [visit our support site](https://thirdweb.com/support) or create a github issue.

### Background

The 'signature minting' mechanism used in [thirdweb](https://thirdweb.com/) `Token` smart contracts is a way for a contract admin to authorize an external party's request to mint tokens on the admin's contract. At a high level, this means you can authorize some external party to mint tokens on your contract, and specify what exactly will be minted by that external party.

A contract admin signs a 'payload' or 'mint request' which specifies parameters around a mint e.g. which address should tokens be minted to, what price should be collected in exchange for the minted tokens, etc.

Any external party can then present a smart contract implementing the 'signature minting' mechanism with a payload, along with the signature generated from a contract admin signing the payload. Tokens will then be minted according to the information specified in the payload.

The following diagram illustrates how the 'signature minting' flow looks like. For example, consider a webapp like [wombo.art](https://www.wombo.art/) which lets a user generate artwork on its website. Once a user has generated artwork on the wombo website, wombo can allow the user to mint their generated artwork as an NFT on wombo's own contract, where wombo can ensure that what the user will mint on wombo's contract is the intended generated artwork.

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fsignature-drop-diagram.77ef08e2.png&w=3840&q=75)

#### Why we're developing `Signature Minting`

We've observed that there are largely three distinct contexts under which one mints tokens:

* Minting tokens for yourself on a contract you own. E.g. a person wants to mint their Twitter profile picture as an NFT.
* Having an audience mint tokens on a contract you own.  
   * The nature of tokens to be minted by the audience is pre-determined by the contract admin. E.g. a 10k NFT drop where the contents of the NFTs to be minted by the audience is already known and determined by the contract admin before the audience comes in to mint NFTs.  
   * The nature of tokens to be minted by the audience is _not_ pre-determined by the contract admin. E.g. a course ‘certificate' dynamically generated with the name of the course participant, to be minted by the course participant at the time of course completion.

The thirdweb `Drop` contracts serve the cases described in 2(i).

The thirdweb `Token` contracts serve the cases described in (1) and 2(ii). And the 'signature minting' mechanism is particularly designed to serve the case described in 2(ii).

### Technical Details

We'll now go over the technical details involved in the 'signature minting' mechanism illustrated in the diagram in the preceding section.

#### Payload / Mint request

We'll now cover what makes up a payload, or 'mint request':

```solidity
struct MintRequest {
    address to;
    address royaltyRecipient;
    uint256 royaltyBps;
    address primarySaleRecipient;
    uint256 tokenId;
    string uri;
    uint256 quantity;
    uint256 pricePerToken;
    address currency;
    uint128 validityStartTimestamp;
    uint128 validityEndTimestamp;
    bytes32 uid;
}
```

| Parameter              | Description                                                                                                                         |
| ---------------------- | ----------------------------------------------------------------------------------------------------------------------------------- |
| to                     | The receiver of the tokens to mint.                                                                                                 |
| royaltyRecipient       | The recipient of the minted token's secondary sales royalties. (Not applicable for ERC20 tokens)                                    |
| royaltyBps             | The percentage of the minted token's secondary sales to take as royalties. (Not applicable for ERC20 tokens)                        |
| primarySaleRecipient   | The recipient of the minted token's primary sales proceeds.                                                                         |
| tokenId                | The tokenId of the token to mint. (Only applicable for ERC1155 tokens)                                                              |
| uri                    | The metadata URI of the token to mint. (Not applicable for ERC20 tokens)                                                            |
| quantity               | The quantity of tokens to mint.                                                                                                     |
| pricePerToken          | The price to pay per quantity of tokens minted. (For TokenERC20, this parameter is price, indicating the total price of all tokens) |
| currency               | The currency in which to pay the price per token minted.                                                                            |
| validityStartTimestamp | The unix timestamp after which the payload is valid.                                                                                |
| validityEndTimestamp   | The unix timestamp at which the payload expires.                                                                                    |
| uid                    | A unique identifier for the payload.                                                                                                |

The described fields in `MintRequest` are what make up a payload or 'mint request'. This is the payload that a contract admin signs off, to be used by an external party to mint tokens on the admin's contract.

When any external party presents a payload to the contract implementing the 'signature minting' mechanism, tokens are minted exactly according to the information specified in the presented `MintRequest`.

#### Minting tokens with a payload / 'mint request'

Any external party can present a smart contract implementing the 'signature minting' mechanism with a payload, along with the signature generated from a contract admin signing the payload. Tokens will then be minted according to the information specified in the payload.

To mint tokens with a payload, the following function is called:

```solidity
function mintWithSignature(MintRequest calldata req, bytes calldata signature) external payable;
```

| Parameter | Description                                                    |
| --------- | -------------------------------------------------------------- |
| req       | The payload / mint request.                                    |
| signature | The signature produced by an account signing the mint request. |

The contract implementing the 'signature minting' mechanism first recover's the address of the signer from the given payload i.e. `req` and the `signature`, and verifies that an authorized address has signed off this incoming mint request.

Once verified, tokens are minted according to the information specified in the payload.
## Airdrop ERC1155 Claimable

The `AirdropERC1155Claimable` contract is suitable to use when you want to airdrop ERC1155 NFTs to a list of recipient addresses, where these recipients are expected to individually claim their own airdrop.

When deploying this contract, you specify:

* The address of the ERC1155 NFTs being airdropped.
* The tokenIds of the NFTs to airdrop.
* The amounts of each tokenId to airdrop.
* The address of the owner of NFTs from whom NFTs will be transferred out in the airdrop.
* The UNIX timestamp after which the airdrop period will expire.
* A maximum claimable amount per wallet (claiming the airdrop) for each tokenId.
* An optional merkle root allowlist for recipients permitted to claim the airdrop, for each tokenId.

On claiming an airdrop, a recipient specifies:

* The address to transfer the claimed airdrop to.
* The tokenId of the NFT to claim.
* The total quantity to claim.
* The proof of inclusion in the merkle root allowlist, if it exists.

### Extensions

* [Ownable](https://portal.thirdweb.com/contracts/build/extensions/general/Ownable)
* [Gasless](https://portal.thirdweb.com/contracts/build/extensions)
## Explore (Pre-built Contracts)

Pre-built contracts are proxy contracts created by the thirdweb team to cover most common use cases and patterns for smart contracts. Contracts cover various use cases across NFTs, airdrops, staking, marketplaces, memberships, and more. All pre-built contracts are available to deploy on [Explore](https://thirdweb.com/explore).

#### Features

![](/icons/feature-cards/verified.svg)

##### Increased security

Audited contracts with ongoing bug-bounty programs

![](/icons/feature-cards/ownership.svg)

##### Retain ownership

All contracts are fully owned by the contract deployer (you)

![](/icons/feature-cards/deployable.svg)

##### Easily deployable

Deploy any contract through a UI, CLI, or programmatically

![](/icons/feature-cards/protocols.svg)

##### Built with protocols

Use contracts published by protocols for a wide range of use cases

![](/icons/feature-cards/manage-contracts.svg)

##### Manage contracts

Use a custom interface post-deployment to interact with contracts

![](/icons/feature-cards/default-library.svg)

##### Default library

All thirdweb pre-built contracts are available with custom UIs and SDK functionality
## Airdrop ERC-20 (Claimable)

The `AirdropERC20Claimable` contract is suitable to use when you want to airdrop ERC20 tokens to a list of recipient addresses, where these recipients are expected to individually claim their own airdrop.

When deploying this contract, you specify:

* The address of the ERC20 token being airdropped.
* The total token amount to airdrop.
* The address of the owner of tokens from whom tokens will be transferred out in the airdrop.
* The UNIX timestamp after which the airdrop period will expire.
* A maximum claimable amount per wallet (claiming the airdrop).
* An optional merkle root allowlist for recipients permitted to claim the airdrop.

On claiming an airdrop, a recipient specifies:

* The address to transfer the claimed airdrop to.
* The total quantity to claim.
* The proof of inclusion in the merkle root allowlist, if it exists.

### Extensions

* [Ownable](https://portal.thirdweb.com/contracts/build/extensions/general/Ownable)
* [Gasless](https://portal.thirdweb.com/contracts/build/extensions)
## Airdrop ERC-20

Airdrop ERC-20 tokens or the chain's native token (e.g. ether for Ethereum mainnet) to a list of recipients.

The `AirdropERC20` contract is suitable to use when you want to transfer ERC20 tokens or native tokens to a list of recipient addresses, where these recipients are not expected to individually claim their airdrop; they just receive it in a transfer. When airdropping tokens with this contract, you specify:

* The address of the ERC20 token being transferred. (For native tokens, the address used is `0xEeeeeEeeeEeEeeEeEeEeeEEEeeeeEeeeeeeeEEeE`)
* The address from which the token will be transferred to a list of the recipients.
* An array of objects containing recipient-address and token-amounts, for e.g.

```typescript
[
  {
    recipient: "0x123...",
    amount: 1, // these amounts are in wei
  },
  {
    recipient: "0xabc...",
    amount: 10, // these amounts are in wei
  },
];
```

note: token-owner must approve their tokens to this airdrop contract, by calling approval related function on the ERC20 token contract.

**Estimated gas costs for airdropping tokens:**Cost of airdropping `1` ERC20 token: \~`66,600` gas. Cost of airdropping each additional ERC20 token: \~`32,526` gas.

### Extensions

* [Permissions](https://portal.thirdweb.com/contracts/build/extensions/general/Permissions)
* [PermissionsEnumerable](https://portal.thirdweb.com/contracts/build/extensions/general/PermissionsEnumerable)
* [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)
* [Gasless](https://portal.thirdweb.com/contracts/build/extensions)
* [AirdropERC20](https://portal.thirdweb.com/contracts/build/extensions)

### Airdrop
## Airdrop ERC721 Claimable

The `AirdropERC721Claimable` contract is suitable to use when you want to airdrop ERC721 NFTs to a list of recipient addresses, where these recipients are expected to individually claim their own airdrop.

When deploying this contract, you specify:

* The address of the ERC721 NFTs being airdropped.
* The tokenIds of the NFTs to airdrop.
* The address of the owner of NFTs from whom NFTs will be transferred out in the airdrop.
* The UNIX timestamp after which the airdrop period will expire.
* A maximum claimable amount per wallet (claiming the airdrop).
* An optional merkle root allowlist for recipients permitted to claim the airdrop.

On claiming an airdrop, a recipient specifies:

* The address to transfer the claimed airdrop to.
* The total quantity to claim.
* The proof of inclusion in the merkle root allowlist, if it exists.

### Extensions

* [Ownable](https://portal.thirdweb.com/contracts/build/extensions/general/Ownable)
* [Gasless](https://portal.thirdweb.com/contracts/build/extensions)
## Airdrop ERC1155

Airdrop ERC1155 NFTs to a list of recipients.

The `AirdropERC1155` contract is suitable to use when you want to transfer ERC1155 NFTs to a list of recipient addresses, where these recipients are not expected to individually claim their airdrop; they just receive it in a transfer. When airdropping tokens with this contract, you specify:

* The address of the Edition (ERC-1155 contract) from which NFTs are being transferred.
* The owner address of the NFTs from where the NFTs will be transferred to a list of the recipients.
* An array of objects containing recipient-address, token-ids, and amounts for e.g.

```typescript
[
  {
    recipient: "0x123...",
    tokenId: 1,
    amount: 5,
  },
  {
    recipient: "0xabc...",
    tokenId: 1,
    amount: 5,
  },
];
```

note: token-owner must approve their tokens to this airdrop contract, by calling approval related functions on the ERC1155 contract.

**Estimated gas costs for airdropping tokens:**Cost of airdropping `1` ERC1155 token: \~`51,571` gas. Cost of airdropping each additional ERC1155 token: \~`42,672` gas.

### Extensions

* [Permissions](https://portal.thirdweb.com/contracts/build/extensions/general/Permissions)
* [PermissionsEnumerable](https://portal.thirdweb.com/contracts/build/extensions/general/PermissionsEnumerable)
* [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)
* [Gasless](https://portal.thirdweb.com/contracts/build/extensions)
* [AirdropERC1155](https://portal.thirdweb.com/contracts/build/extensions)
## Airdrop ERC-721

Airdrop ERC721 NFTs to a list of recipients.

The `AirdropERC721` contract is suitable to use when you want to transfer ERC721 NFTs to a list of recipient addresses, where these recipients are not expected to individually claim their airdrop; they just receive it in a transfer. When airdropping NFTs with this contract, you specify:

* The address of the NFT collection from which NFTs are being transferred.
* The owner address of the NFTs from where the NFTs will be transferred to a list of the recipients.
* An array of objects containing recipient-address and token-ids, for e.g.

```typescript
[
  {
    recipient: "0x123...",
    tokenId: 1,
  },
  {
    recipient: "0xabc...",
    tokenId: 2,
  },
];
```

note: token-owner must approve their tokens to this airdrop contract, by calling approval related function on the ERC721 contract.

**Estimated gas costs for airdropping tokens:**Cost of airdropping `1` ERC721 token: \~`76,521` gas. Cost of airdropping each additional ERC721 token: \~`44,610` gas.

### Extensions
## Edition

The **Edition** contract is best used when you want to release many NFTs based on the same asset, but you **don't** want to "drop" or "release" them for your community to claim.

Unlike the [Edition Drop](https://portal.thirdweb.com/pre-built-contracts/edition-drop) contract, the Edition contract does not **lazy mint** your NFTs. Instead, NFTs are minted immediately when they are added to the collection.

This means you can still transfer the NFTs or sell them on a [Marketplace](https://portal.thirdweb.com/contracts/explore/pre-built-contracts/marketplace) and perform any other actions you would expect to do with an NFT.

For advanced use-cases, the Edition also has [signature-based minting](https://portal.thirdweb.com/glossary/signature-based-minting) capabilities.

### Use Cases & Examples

You could use the Edition contract to:

* Create an NFT Collection where each NFT has 100 copies
* Airdrop an NFT to a list of addresses that all use the same asset and metadata
* Create 10 "copies" of your artwork and sell them on a [Marketplace](https://portal.thirdweb.com/contracts/explore/pre-built-contracts/marketplace)

### Creating & Configuring the Edition

Learn how to create and configure your smart contract using the [dashboard](https://thirdweb.com/team).

#### Creating an Edition Contract

Deploy the edition contract to any EVM network using the button below.

#### Minting NFTs

Click **Mint** to create a single NFT.

You can add additional supply to an existing NFT by clicking on that NFT and clicking **Mint**:

#### Airdrop NFTs

Click on the token you want to use, navigate to the **Airdrop** tab, and upload a `.csv` file containing a list of addresses you want to airdrop NFTs to.

In the `.csv` file, you must specify an `address` column and a `quantity` column, representing the address you want to send the NFTs and how many you wish to send. You can download our example [CSV File](https://thirdweb.com/assets/examples/airdrop.csv) to get started.

#### Contract Metadata

To configure the image, name, and description of the contract, click the **Settings** tab:

#### Royalty & Platform Fees

From the **Settings** tab, you also configure the royalty fee, primary sales recipient, and platform fee.
## Edition Drop

The **Edition Drop** contract is best used when you want to release many NFTs with the same metadata that you want users to be able to claim. This contract follows the [ERC1155 extension](https://eips.ethereum.org/EIPS/eip-1155), also known as "Semi-Fungible Tokens".

The Edition Drop contract allows you to define the conditions for when and how your users can claim an NFT, which has been previously [lazy minted](https://portal.thirdweb.com/glossary/lazy-minting) by the contract admin (usually the deployer), including allowlists, release dates, and the maximum number of NFTs which can be claimed.

### Extensions

This contract includes the following extensions:

* [ERC1155](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155)
* [ERC1155Supply](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Supply)
* [ERC1155Enumerable](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155Enumerable)
* [ERC1155LazyMintable](https://portal.thirdweb.com/contracts/build/extensions/general/LazyMintable)
* [ERC1155ClaimPhases](https://portal.thirdweb.com/contracts/build/extensions/erc-1155/ERC1155ClaimPhases)
* [Royalty](https://portal.thirdweb.com/contracts/build/extensions/general/Royalty)
* [PlatformFee](https://portal.thirdweb.com/contracts/build/extensions/general/PlatformFee)
* [PrimarySale](https://portal.thirdweb.com/contracts/build/extensions/general/PrimarySale)
* [Permissions](https://portal.thirdweb.com/contracts/build/extensions/general/Permissions)
* [PermissionsEnumerable](https://portal.thirdweb.com/contracts/build/extensions/general/PermissionsEnumerable)
* [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)
* [Ownable](https://portal.thirdweb.com/contracts/build/extensions/general/Ownable)

### Use Cases & Examples

You could use the Edition Drop contract to:

* Create NFT Memberships such as our [Early Access Cards](https://opensea.io/collection/thirdweb-community) that you want your users to claim
* Release an item in your game for a limited-time
* Create 100 NFTs based on one art piece, and allow users to claim one per wallet

### Resources

* [Frontend demo project](https://github.com/thirdweb-example/edition-drop)
* [Technical Design Doc](https://portal.thirdweb.com/contracts/design-docs/drop)
* [Full reference](https://portal.thirdweb.com/contracts/DropERC1155)

### Creating & Configuring the Edition Drop

Learn how to create and configure your smart contract using the [dashboard](https://thirdweb.com/team).

#### Creating an Edition Drop Contract

Deploy the edition drop contract to any EVM network using the button below.

#### Lazy Minting NFTs

Lazy minting is the process of uploading your metadata for your NFT(s) without minting them _yet_.

This is useful when you want _other_ wallets to mint NFTs from your drop into their own wallets.

To lazy-mint NFT(s), click **Create** to lazy-mint a single NFT, or **Batch Upload** to lazy-mint multiple NFTs at once.

To get started, you can use one of our example files for [CSV](https://thirdweb.com/assets/examples/example.csv) or [JSON](https://thirdweb.com/assets/examples/example.json) metadata.

#### Setting Claim Phases

On the Edition Drop contract, you set claim phases for each NFT, by clicking the **Claim Phases** button

A claim phase is a set of conditions that define when and how your users can claim an NFT from your drop.

**The Edition Drop contract supports multiple sequential claim phases**.

Within a claim phase, you can define:

* When the claim phase will start
* How many NFTs do you want to drop
* How much do you want to charge per NFT
* What currency do you want to use
* Which wallet addresses are allowed to mint (allowlist)
* How many NFTs can be claimed per transaction
* How many seconds do wallets have to wait between claims

To add a claim phase to a token, click **Add Initial Claim Phase**:

#### Airdrop NFTs

Click **Airdrop** on the token you want to use, and upload a `.csv` file containing a list of addresses you want to airdrop NFTs to.

In the `.csv` file, you must specify an `address` column and a `quantity` column, representing the address you want to send the NFTs and how many you wish to send. You can download our example [CSV File](https://thirdweb.com/assets/examples/airdrop.csv) to get started.

#### Contract Metadata

To configure the image, name, and description of the contract, click the **Settings** tab:

#### Royalty & Platform Fees

From the **Settings** tab, you also configure the royalty fee, primary sales recipient, and platform fee.
## Multiwrap

The Multiwrap contract lets you wrap [ERC20](https://eips.ethereum.org/EIPS/eip-20),[ERC721](https://eips.ethereum.org/EIPS/eip-721) and[ERC1155](https://eips.ethereum.org/EIPS/eip-1155)tokens into a **new** wrapped ERC721 NFT. The wrapped NFT can be unwrapped (burned) back into the underlying tokens.

The wrapped NFT itself also acts as an ERC721 token, which can have the metadata you'd expect of an NFT, such as a name, image, description, etc.

### Use Cases & Examples

You could use the Multiwrap contract to:

* Combine multiple NFTs into one NFT with new metadata
* Wrap NFTs along with ERC20 tokens to easily trade them for other NFTs
* Create a transparent "bundle" in your game, where the contents of the bundle are visible to the player

### Smart Contract Design

For a detailed exploration of how the multiwrap smart contract works, why it was built, and it's limitations, visit our [Multiwrap Design Doc](https://portal.thirdweb.com/contracts/design-docs/multiwrap)!

### Creating & Configuring the Multiwrap

Learn how to create and configure your smart contract using the [dashboard](https://thirdweb.com/team).

#### Contract Metadata

To configure the image, name, and description of the contract, click the **Settings** tab:

#### Royalty & Platform Fees

From the **Settings** tab, you also configure the royalty fee.
## Managed Account Factory

The **Managed Account Factory** contract is used to deploy upgradeable [ERC-4337](https://eips.ethereum.org/EIPS/eip-4337s) smart wallets with role based permission control.

The `ManagedAccount` smart wallet is an **upgradeable** smart contract written in the [dynamic contract pattern](https://github.com/thirdweb-dev/dynamic-contracts).

App developers can issue `ManagedAccount` smart wallets programmatically by deploying a `ManagedAccountFactory` smart contract.

The admin of the `ManagedAccountFactory` contract can push upgrades to all `ManagedAccounts` that it creates. This admin does not require any permissions on the `ManagedAccount` smart wallets to do so. An upgrade to the features of `ManagedAccount` applies to all `ManagedAccount` smart wallets created by the factory. This is the right wallet for developers who anticipate pushing upgrades to their users' wallets.

thirdweb's smart wallets have the following features by default:

* Have multiple signers with different permissions
* Execute transactions (single and batched).
* Send and receive native tokens.
* Send and receive ERC-721 and ERC-1155 NFTs.
* Multicall-able.
* Store contract metadata.

### Extensions

This contract includes the following extensions:

* [Permissions](https://portal.thirdweb.com/contracts/build/extensions/general/Permissions)
* [PermissionsEnumerable](https://portal.thirdweb.com/contracts/build/extensions/general/PermissionsEnumerable)
* [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)
* [AccountFactory](https://portal.thirdweb.com/contracts/build/extensions/erc-4337/SmartWallet-factory)
* [DynamicContract](https://github.com/thirdweb-dev/dynamic-contracts)

### Use Cases & Examples

Use the `ManagedAccountFactory` contract alongside the [Connect SDK](https://portal.thirdweb.com/connect/account-abstraction) to easily use account abstraction in your projects:

* [React Guide](https://portal.thirdweb.com/connect/account-abstraction/guides/react)
* [Typescript Guide](https://portal.thirdweb.com/connect/account-abstraction/guides/typescript)
* [Unity Guide](https://portal.thirdweb.com/unity/wallets/providers/account-abstraction)
## NFT Collection

The NFT Collection contract is suitable for when you want to have a collection of unique NFTs, but **not** "drop" or "release" them for your community to claim.

Unlike the [NFT Drop](https://portal.thirdweb.com/contracts/explore/pre-built-contracts/nft-drop) contract, the NFT Collection contract does not **lazy mint** your NFTs. Instead, NFTs are minted immediately when they are added to the collection.

This means you can still transfer the NFTs or sell them on a [Marketplace](https://portal.thirdweb.com/contracts/explore/pre-built-contracts/marketplace) and perform any other actions you would expect to do with an NFT.

For advanced use-cases, the NFT Collection also has [signature-based minting](https://portal.thirdweb.com/glossary/signature-based-minting) capabilities.

#### Signature Minting Design

For a detailed exploration of how **signature-based minting** works in the NFT Collection contract, why it was built, and it's limitations, visit our[Signature Minting Design Document](https://portal.thirdweb.com/contracts/design-docs/signature-mint)

### Use Cases & Examples

You could use the NFT Collection contract to:

* Create a 1-of-many collection of your photography
* Create a 1-of-1 NFT that provides special utility
* Mint your artwork as NFTs and then sell them on a [Marketplace](https://portal.thirdweb.com/contracts/explore/pre-built-contracts/marketplace)
* Create a community-made NFT collection

### Creating & Configuring the NFT Collection

Learn how to create and configure your smart contract using the [dashboard](https://thirdweb.com/team).

#### Creating a NFT Collection Contract

Deploy the NFT collection contract to any EVM network using the button below.

#### Minting NFTs

Click **Mint** to create a single NFT.

![Minting an NFT collection](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fmint-nft-collection.af6d3a09.png&w=3840&q=75)

#### Contract Metadata

To configure the image, name, and description of the contract, click the **Settings** tab:

![NFT Collection settings](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fnft-collection-settings.e44471c2.png&w=3840&q=75)

#### Royalty & Platform Fees

From the **Settings** tab, you also configure the royalty fee, primary sales recipient, and platform fee.

![Royalty and Platform Fee](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fmore-settings.8d50bea7.png&w=3840&q=75)
## Pack

The packs are ERC1155 NFTs themselves, which can have the metadata you'd expect of an NFT, such as a name, image, description, etc.

When a pack is opened, a pre-defined quantity of tokens are randomly selected from the ones that were used to create the packs _(that haven't already been selected)_, and awarded to the opener. The pack NFT is burned as it's opened.

You can configure how many tokens get selected for the pack:

* How many tokens are in each "unit" (for ERC20 & ERC1155 tokens - one unit could be multiple tokens).
* How many units are in each pack.

> **IMPORTANT**: _Pack functions, such as opening of packs, can be costly in terms of gas usage due to random selection of rewards. Please check your gas estimates/usage, and do a trial on testnets before any mainnet deployment._

### Use Cases & Examples

You could use the Pack contract to:

* Create randomized NFT loot boxes
* Run a randomized raffle where some users open a winning ticket
* Reward your community with token gift boxes

### Smart Contract Design

For a detailed exploration of how the pack smart contract works, why it was built, and it's limitations, visit our [Pack Design Doc](https://portal.thirdweb.com/contracts/design-docs/pack)!

### Creating & Configuring the Pack

Learn how to create and configure your smart contract using the [dashboard](https://thirdweb.com/team).

#### Creating a Pack Contract

Deploy the pack contract to any of our[supported networks](https://blog.thirdweb.com/guides/which-network-should-you-use) using the button below.

#### Contract Metadata

To configure the image, name, and description of the contract, click the **Settings** tab:

#### Royalty & Platform Fees

From the **Settings** tab, you also configure the royalty fee.
## Marketplace

A Marketplace is a contract where you can buy and sell NFTs, such as OpenSea or Rarible.

The Marketplace contract allows users to list NFTs for direct sale or auction. Other users can place offers/bids or buy the NFTs for the specified amount in the listing.

The marketplace can be configured to only allow certain users to list NFTs for sale, or allow _any_ user to list NFTs for sale.

### Use Cases & Examples

You could use the Marketplace contract to:

* Sell your NFTs on your marketplace
* Create auctions where the highest bidder, after a certain period, wins the NFT
* Create an open marketplace where any user can list NFTs for sale, like OpenSea.

### Smart Contract Design

For a detailed exploration of how the marketplace smart contract works, why it was built, and it's limitations, visit our [Marketplace Design Doc](https://portal.thirdweb.com/contracts/design-docs/marketplace)!

### Creating & Configuring the Marketplace

Learn how to create and configure your smart contract using the [dashboard](https://thirdweb.com/team).

### Direct & Auction Listings

There are two types of listings in our prebuilt marketplace contract.

#### Direct Listings

Direct listings are low commitment, high-frequency listings; people constantly list and de-list their NFTs based on market trends. So, the listed NFTs and offer amounts are not escrowed in the Marketplace to keep the seller's NFTs and the buyer's currency liquid.

This allows users to list NFTs for sale just by signing an approval; giving them the freedom to list the same NFT in multiple marketplaces, e.g. this Marketplace contract, OpenSea, etc. at the same time.

**Key elements of a direct listing:**

* Sellers list their NFT for direct sale with the price users can buy it for.
* The NFT remains in your wallet, but you provide permission for the marketplace contract to move the NFT.
* If a user pays the asking price, the NFT will be transferred to them, and the seller will receive the funds.
* Users can make offers below the asking price, and the listing can have multiple offers. The seller can choose to accept an offer at any time.
* Users can cancel their bids at any time.

#### Auction Listings

Auction listings are high commitment, low-frequency listings. The seller and bidders respect the auction window, and recognize that their NFTs / bid amounts will be illiquid for the auction duration, and expect a guaranteed payout at auction closing — the auctioned items for the bidder, and the winning bid amount for the seller.

Both the NFTs that are listed for sale in an auction and the highest bid at any given moment are escrowed in the market.

**Key elements of an auction listing:**

* Sellers list their NFT for auction with a minimum asking price.
* The NFT is transferred to escrow in the marketplace contract until the auction is canceled or finished.
* Other users can place bids until the auction is closed.
* Users can only make a bid if it is higher than the current highest bid (or asking price if there are no bids). Once made, bids cannot be withdrawn, and the auction contract holds the funds in escrow.
* At the end of the auction, no more bids can be placed.
* At the end of the auction, the `closeAuction` function needs to be called twice; once for the **buyer** and once for the **seller**.

### Creating a Listing

Create a new listing by clicking the **New Listing** button in the dashboard.
## NFT Drop

NFT Drop enables users to release a collection of unique NFTs using the ERC721A standard. NFT Drop uses a “drop” mechanism intended for large collections to distribute NFTs.

#### NFT Drop vs NFT Collection

NFT Drop differs from [NFT Collection](https://portal.thirdweb.com/contracts/explore/pre-built-contracts/nft-collection) in that it allows users to lazy-mint the NFT directly to their wallet. This eliminates the need to mint the NFT to the creator's wallet and then transfer the asset to another user’s wallet.

The NFT Drop contract can be deployed via the [dashboard](https://portal.thirdweb.com/contracts/explore/pre-built-contracts/nft-drop#deploy-nft-drop-dashboard), [CLI](https://portal.thirdweb.com/contracts/explore/pre-built-contracts/nft-drop#deploy-nft-drop-cli), or [SDKs](https://portal.thirdweb.com/contracts/explore/pre-built-contracts/nft-drop#deploy-nft-drop-sdk).

#### Drop Design

Learn more about why Drop contracts were built, how they were designed, and their limitations by reading the [Drop Design Document](https://portal.thirdweb.com/contracts/design-docs/drop)

### Use Cases

* Create restricted-access NFTs which can only be claimed by a specified allowlist of wallets
* Create large collections of unique NFT profile pics with each NFT corresponding to unique metadata or traits
* Create NFTs of artwork intended for distribution

### Deploy NFT Drop (Dashboard)

Learn how to deploy and manage an NFT Drop contract using dashboard.

#### Deploy and configure contract

* #### Select Contract  
Navigate to Contracts > Explore > [NFT Drop](https://thirdweb.com/thirdweb.eth/DropERC721)
* #### Deploy  
Select `Deploy now`  
![Deploy a contract view from Explore](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fdeploy-now.6f58ba62.png&w=3840&q=75)
* #### Set Metadata  
A modal will appear to set Contract Metadata or settings to organize and distinguish between contracts. Set the following metadata:  
   * **Name** \- name of the contract.  
   * **Symbol (optional)** \- shortened name or symbol to denote a specific group of tokens. Similar to a stock ticker.  
   * **Description (optional)** \- description of contract to  
   * **Image (optional)** \- image or icon of contract  
![Contract metadata settings](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcontract-metadata.adba3d1b.png&w=3840&q=75)
* #### Fund distribution  
Set fund distribution recipients for Primary Sales and Secondary Sales by passing in the corresponding wallet addresses you want to receive the funds.  
   * **Primary Sales** \- The initial recipient will receive any funds from sales made upon initially minting the NFT.  
   * **Royalties / Secondary Sales** \- The recipient that will receive funds from any secondary sales or re-sales of the NFT.  
   ![Fund distribution settings](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Ffunds.5c540637.png&w=3840&q=75)  
   * **(Optional) Platform fees** \- Recipient that will receive additional fees for all primary sales that happen on this contract. (This is useful if you are deploying this contract for a 3rd party and want to take fees for your service).  
   ![Screenshot of advanced configuration](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fadvanced-configuration.a47943b3.png&w=3840&q=75)
* #### Choose network  
Choose a Network / Chain to Deploy to. [View list of available Networks.](https://thirdweb.com/chainlist)  
![Choose network screen](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fchoose-network.20e43342.png&w=3840&q=75)
* #### Sign transaction  
Select `Deploy` and sign the transaction prompted in the connected wallet to finish deploying the contract.

#### Upload NFTs

**Single Upload**

* Single upload is a preferred option for users uploading few NFTs at a time.

**Batch Upload**

* Batch upload is a method that allows you to upload large amounts of NFTs in one click.

![NFT settings page highlighting NFT Upload types](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fupload-types.0c3fb367.png&w=3840&q=75)

#### Enable Delayed Reveal

Optionally, users may choose to hide their NFT image and metadata from users before minting.

![Screenshot of delayed reveal page](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fdelayed-reveal.320c3340.png&w=3840&q=75)

### Deploy NFT Drop (CLI)

* In the CLI run the following Deploy command:  
```bash  
npx thirdweb deploy -n --name nft-drop  
```
* Follow the prompts to fill out your contract by following the Deploy NFT Drop (Dashboard) section.

### Deploy NFT Drop (SDK)

TypeScriptReactReact Native

```jsx
const txResult = await sdk.deployer.deployBuiltInContract(
  "nft-drop",
  {
    name: "<your_contract_name>",
    primary_sale_recipient: "<wallet_address>",
  },
);
```

### Interact with your contract

For easy-to-use code snippets for your contract, view the Code Snippets on your contract's dashboard or visit the [SDK documentation](https://portal.thirdweb.com/contracts).
## Open Edition ERC721

The `OpenEditionERC721` contract is an 'open edition' ERC721 NFT collection. The contract uses the [ERC-721A](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721) standard.

The `OpenEditionERC721` contract is ideal when you want to release an open edition of NFTs like the Base, `Introduced` collection.

All NFTs in the contract have shared metadata except that each NFT has its unique token ID appended to the NFT's name. An admin can set this shared metadata at any time.

The contract does not require the admin to set a limit to the total supply of NFTs. The admin can set claim phases (like in NFT Drop) to apply restrictions on the minting of NFTs, such as a price, mint start and end times, etc.

### Extensions

* [ERC721](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721)
* [ERC721Burnable](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Burnable)
* [ERC721Supply](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Supply)
* [ERC721AQueryable](https://portal.thirdweb.com/contracts/build/extensions)
* [ERC721ClaimPhasesV2](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721ClaimPhases)
* [ERC721SharedMetadata](https://portal.thirdweb.com/contracts/build/extensions)
* [Royalty](https://portal.thirdweb.com/contracts/build/extensions/general/Royalty)
* [PrimarySale](https://portal.thirdweb.com/contracts/build/extensions/general/PrimarySale)
* [Permissions](https://portal.thirdweb.com/contracts/build/extensions/general/Permissions)
* [PermissionsEnumerable](https://portal.thirdweb.com/contracts/build/extensions/general/PermissionsEnumerable)
* [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)
* [Ownable](https://portal.thirdweb.com/contracts/build/extensions/general/Ownable)
* [Gasless](https://portal.thirdweb.com/contracts/build/extensions)
## Split

The Split contract lets you specify multiple wallet addresses that are recipients of any revenue or royalty split.

You define what percentage of any funds that get sent to the split contract address is sent to each recipient. For example, you could define `0x1` and `0x2` as recipients, and configure them to receive 50% of the funds sent to the split contract.

The split contract will store the funds, and when any user calls the `distribute` function, the funds will be distributed to the recipients according to the percentages you define.

### Use Cases & Examples

You could use the Split contract to:

* Use as a "team wallet", where funds are distributed between the members of your team with set percentages
* Share revenue from your primary minting in an NFT drop
* Share revenue from royalty sales with members of your team, such as an artist
* Any programmatic split of revenue

### Creating & Configuring the Split

Learn how to create and configure your smart contract using the [dashboard](https://thirdweb.com/team).

#### Creating a Split Contract

Deploy the split contract to any of our[supported networks](https://blog.thirdweb.com/guides/which-network-should-you-use) using the button below.

#### View Recipients

You can view the recipients of your Split contract in the **Overview** button on the dashboard.

#### View Balance

In the **Overview** tab of your split in the dashboard, you can see **your** (the wallet you're currently connected with) split of the funds in this contract.

#### Distribute Funds

**Any wallet** can distribute funds to the split recipients.

To do so, click the **Distribute Funds** button.

#### Native Token Storage

If your contract is storing both native tokens such as `ETH`, and ERC20 tokens such as `wrapped ETH`, it will prompt you to accept two separate transactions to distribute the funds.
## Stake ERC1155

This contract allows users to stake their ERC-1155 NFTs and get ERC-20 tokens as staking rewards. Contract admin should set the NFT and Reward-token addresses during deployment. These can't be changed later.

Staked NFTs are stored inside the contract and rewards are calculated for the amount of time these NFTs were staked. Admin should maintain adequate balance of reward tokens in the staking-contract. These rewards are then transferred to stakers upon claiming.

Reward calculation at the time of claiming rewards:

`rewardsPerTokenStaked = (stakingDuration * rewardsPerUnitTime) / timeUnit`

Note:

* Users need to approve their NFTs to the staking contract address before they can stake them
* Contract admin should maintain adequate balance of Reward Tokens in the staking contract -- use the deposit function for depositing reward tokens
* Default time-unit and rewards will apply for all token-Ids unless specific values are set for a token

### Extensions

* [Permissions](https://portal.thirdweb.com/contracts/build/extensions/general/Permissions)
* [PermissionsEnumerable](https://portal.thirdweb.com/contracts/build/extensions/general/PermissionsEnumerable)
* [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)
* [Gasless](https://portal.thirdweb.com/contracts/build/extensions)
## Stake ERC-20

This contract allows users to stake their ERC-20 tokens and get ERC-20 tokens as staking rewards (different from the staked tokens). Contract admin should set the Staking and Reward token addresses during deployment. These can't be changed later.

Staked tokens are stored inside the contract and rewards are calculated for the amount of time these tokens were staked. Admin should maintain adequate balance of reward tokens in the staking-contract. These rewards are then transferred to stakers upon claiming.

Reward calculation at the time of claiming rewards:

`rewardsPerTokenStaked = ((stakingDuration * rewardRatioNumerator) / rewardRatioDenominator) / timeUnit`For e.g., if reward ratio is 1/20, this implies that there will be 1 Reward token given out for every 20 tokens staked. The numerator and denominator of the reward ratio should be set separately (1 and 20 in this case respectively).

Note:

* Users need to approve their tokens to the staking contract address before they can stake them
* Contract admin should maintain adequate balance of Reward Tokens in the staking contract -- use the deposit function for depositing reward tokens

### Extensions

* [Permissions](https://portal.thirdweb.com/contracts/build/extensions/general/Permissions)
* [PermissionsEnumerable](https://portal.thirdweb.com/contracts/build/extensions/general/PermissionsEnumerable)
* [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)
* [Gasless](https://portal.thirdweb.com/contracts/build/extensions)
## Stake ERC-721

This contract allows users to stake their ERC-721 NFTs and get ERC-20 tokens as staking rewards. Contract admin should set the NFT and Reward-token addresses during deployment. These can't be changed later.

Staked NFTs are stored inside the contract and rewards are calculated for the amount of time these NFTs were staked. Admin should maintain adequate balance of reward tokens in the staking-contract. These rewards are then transferred to stakers upon claiming.

Reward calculation at the time of claiming rewards:

`rewardsPerTokenStaked = (stakingDuration * rewardsPerUnitTime) / timeUnit`

Note:

* Users need to approve their NFTs to the staking contract address before they can stake them
* Contract admin should maintain adequate balance of Reward Tokens in the staking contract -- use the deposit function for depositing reward tokens

### Extensions

* [Permissions](https://portal.thirdweb.com/contracts/build/extensions/general/Permissions)
* [PermissionsEnumerable](https://portal.thirdweb.com/contracts/build/extensions/general/PermissionsEnumerable)
* [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)
* [Gasless](https://portal.thirdweb.com/contracts/build/extensions)
## Token Drop

The Token Drop contract is a way of releasing your [ERC20](https://eips.ethereum.org/EIPS/eip-20)tokens for a set price.

It allows you to define the conditions for when and how your users can claim your tokens; including allowlists, release dates, and claim limits.

In the Token Drop, you define the price for your tokens in each claim phase and can set a limit on how many tokens you want to release. Other users can then claim your tokens under the conditions you defined.

#### Drop Design

Learn more about why Drop contracts were built, how they were designed, and their limitations by reading the [Drop Design Document](https://portal.thirdweb.com/contracts/design-docs/drop)

### Use Cases & Examples

You could use the Token Drop contract to:

* Release your new cryptocurrency for a set price such as 1 MATIC per token.
* Allow a specific set of wallets to claim your ERC20 tokens before releasing them to the public.
* Allow users to claim your tokens up until a specific date.

### Creating & Configuring the Token Drop

Learn how to create and configure your smart contract using the [dashboard](https://thirdweb.com/team).
## Vote

The Vote contract is designed for groups such as DAOs to vote on proposals.

To use the Vote contract, you also need to have an existing ERC20 token, such as our [token contract](https://portal.thirdweb.com/contracts/explore/pre-built-contracts/token) to act as the governance token.

### Use Cases & Examples

You could use the Vote contract to:

* Vote to decide on organizational changes
* Vote on managing and distributing funds in a treasury
* Vote on any other proposal in an organization, such as a DAO

### Creating & Configuring the Vote

Learn how to create and configure your smart contract using the [dashboard](https://thirdweb.com/team).

#### Creating a Vote Contract

Deploy the vote contract to any of our[supported networks](https://blog.thirdweb.com/guides/which-network-should-you-use) using the button below.

#### Creating Proposals

To create a new proposal for people to vote on, click **Create Proposal**

#### Viewing Proposals

You can view all the active and past proposals from the **Overview** tab.

#### Voting on Proposals

If you hold the governance token, you can vote on active proposals from the **Overview** tab.
## Deploy a modular Edition Drop contract

The Edition Drop contract also known as “semi-fungible” or “multi” tokens create multiple NFTs from the same asset based on the [ERC-1155 standard](https://eips.ethereum.org/EIPS/eip-1155).

Edition Drop includes settings called claim conditions which allow deployers to set a prices for tokens per claim phase and limits on how many tokens to be released.

Deploy Modular Edition Drop

The Modular Edition Drop is available to deploy on Explore. Deploy it now through dashboard.

[Deploy Now](https://thirdweb.com/thirdweb.eth/ERC1155CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkNsYWltYWJsZUVSQzExNTUifQ%3D%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkJhdGNoTWV0YWRhdGFFUkMxMTU1In0%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlJveWFsdHlFUkMxMTU1In0%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlNlcXVlbnRpYWxUb2tlbklkRVJDMTE1NSJ9&displayName=Modular+Edition+Drop)

#### Edition Drop vs Edition

The Edition Drop contract allows users to claim tokens based on specific settings set using Claim Conditions. If you do not need to set limits or special settings on how to claim, refer to the Edition contract.

#### Use Cases & Examples

* Create NFT Memberships such as Early Access Cards for users to claim
* Release a limited in-game item
* Create badges, certificates, or passes for real world assets and events

#### Default Installed Modules

* Claimable
* BatchMetadata
* Royalty
* SequentialTokenId

#### Deploy modular Edition Drop contract

Learn how to deploy a modular Edition Drop contract through the dashboard.

* #### Locate Contract  
Navigate to Explore, locate the [Modular Edition Drop contract](https://thirdweb.com/thirdweb.eth/ERC1155CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6Ik1pbnRhYmxlRVJDMTE1NSJ9&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkJhdGNoTWV0YWRhdGFFUkMxMTU1In0%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlRyYW5zZmVyYWJsZUVSQzExNTUifQ%3D%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlNlcXVlbnRpYWxUb2tlbklkRVJDMTE1NSJ9&displayName=Modular+Edition), and select the Deploy Now button.  
![Screenshot Edition Drop contract](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fedition_drop_step1.1765e548.png&w=3840&q=75)
* #### Configure Contract Metadata  
Fill in the Contract Metadata including Name, Symbol, Description, and Image.  
Contract Metadata serves as your unique identifier.  
![Screenshot of Edition Drop configure metadata](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fedition_drop_step2.7257b912.png&w=3840&q=75)
* #### Configure Sequential Token Id  
Input a number you want your tokens to start at for the sequential token id. If you don’t have a preference to change it, you may input 0.  
![Screenshot of Edition Drop configure sequential token id](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fedition_drop_step3.aedd720e.png&w=3840&q=75)
* #### Select Chain  
Select the preferred chain you want to deploy on and select Deploy Now.  
![Screenshot of Edition Drop select chain](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fedition_drop_step4.fb8e7723.png&w=3840&q=75)  
#### Any EVM Compatible  
The Edition Drop contract is deployable on any EVM compatible network. [View all available networks.](https://thirdweb.com/chainlist)  
If you are signed in with an EOA wallet, you will be prompted to sign the transaction. After that your contract is deployed and you can begin configuring the modules.

#### Modular Contract

This contract is created using the modular contract framework. Modules on this contract are upgradeable. [Learn more about Modular Contracts.](https://portal.thirdweb.com/contracts/modular-contracts/overview)

#### Configure Modules

To configure the modules, navigate to the Modules view:

(Coming soon)

#### Install Modules

To install additional modules on this contract, navigate to the Modules view after deploying your contract.
## Deploy a modular Edition Drop

The Edition contract also known as “semi-fungible” or “multi” tokens create multiple NFTs from the same asset based on the [ERC-1155 standard](https://eips.ethereum.org/EIPS/eip-1155). NFTs are minted to the creator’s wallet as they are added to the collection. NFTs are still transferable, able to be sold on a marketplace, and perform any other actions as defined by ERC-1155.

For advanced use cases, Edition enables signature-minting capabilities.

Deploy Modular Edition

The Modular Edition is available to deploy on Explore. Deploy it now through dashboard.

[Deploy Now](https://thirdweb.com/thirdweb.eth/ERC1155CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6Ik1pbnRhYmxlRVJDMTE1NSJ9&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkJhdGNoTWV0YWRhdGFFUkMxMTU1In0%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlRyYW5zZmVyYWJsZUVSQzExNTUifQ%3D%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlNlcXVlbnRpYWxUb2tlbklkRVJDMTE1NSJ9&displayName=Modular+Edition)

#### Edition vs Edition Drop

Edition does not have lazy minting capabilities or claim conditions. If you’d prefer to define specific settings such as claim limits, start and end times to claim, and more, please refer to the [Edition Drop contract](https://thirdweb.com/thirdweb.eth/ERC1155CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkNsYWltYWJsZUVSQzExNTUifQ%3D%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkJhdGNoTWV0YWRhdGFFUkMxMTU1In0%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlJveWFsdHlFUkMxMTU1In0%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlNlcXVlbnRpYWxUb2tlbklkRVJDMTE1NSJ9&displayName=Modular+Edition+Drop).

#### Use Cases & Examples

* Create an NFT Collection with multiple copies of each NFT
* Airdrop an NFT to an allowlist of addresses using the same assets and metadata
* Create copies of artwork to be sold on a marketplace

#### Default Installed Modules

* Mintable
* BatchMetadata
* Transferable
* SequentialTokenId

#### Deploy modular Edition contract

Learn how to deploy a modular Edition contract through the dashboard.

* #### Locate Contract  
Navigate to Explore, locate the [Modular Edition contract](https://thirdweb.com/thirdweb.eth/ERC721CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6Ik1pbnRhYmxlRVJDNzIxIn0%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkJhdGNoTWV0YWRhdGFFUkM3MjEifQ%3D%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlRyYW5zZmVyYWJsZUVSQzcyMSJ9&displayName=Modular+NFT+Collection), and select the Deploy Now button.  
![Screenshot Edition contract](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fedition_step1.8a68e528.png&w=3840&q=75)
* #### Configure Contract Metadata  
Fill in the Contract Metadata including Name, Symbol, Description, and Image.  
Contract Metadata serves as your unique identifier.  
![Screenshot of Edition  configure metadata](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fedition_step2.128b9a03.png&w=3840&q=75)
* #### Configure Sequential Token Id  
Input a number you want your tokens to start at for the sequential token id. If you don’t have a preference to change it, you may input 0.  
![Screenshot of Edition  configure sequential token id](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fedition_step3.a369b239.png&w=3840&q=75)
* #### Select Chain  
Select the preferred chain you want to deploy on and select Deploy Now.  
![Screenshot of Edition select chain](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fedition_step4.8a3364e3.png&w=3840&q=75)  
#### Any EVM Compatible  
The Edition contract is deployable on any EVM compatible network. [View all available networks.](https://thirdweb.com/chainlist)  
If you are signed in with an EOA wallet, you will be prompted to sign the transaction. After that your contract is deployed and you can begin configuring the modules.

#### Modular Contract

This contract is created using the modular contract framework. Modules on this contract are upgradeable. [Learn more about Modular Contracts.](https://portal.thirdweb.com/contracts/modular-contracts/overview)

#### Configure Modules

To configure the modules, navigate to the Modules view:

(Coming soon)

#### Install Modules

To install additional modules on this contract, navigate to the Modules view after deploying your contract.
## Token

The Token contract is suited for creating a digital currency and is compliant with the [ERC20](https://eips.ethereum.org/EIPS/eip-20) standard. It can be purchased and traded between users on an exchange, utilized to buy and sell NFTs in a marketplace, etc.

Unlike the [Token Drop](https://portal.thirdweb.com/contracts/explore/pre-built-contracts/token-drop) contract, the Token contract does not allow users to claim tokens under the criteria of claim conditions.

### Use Cases & Examples

You could use the Token contract to:

* Create your own cryptocurrency
* Sell your NFTs on the [Marketplace](https://portal.thirdweb.com/contracts/explore/pre-built-contracts/marketplace) in your custom token
* Reward users with tokens for some action they take

### Creating & Configuring the Token

Learn how to create and configure your smart contract using the [dashboard](https://thirdweb.com/team).
## Deploy a modular NFT Collection contract

The NFT Collection contract creates a unique collection of NFTs based on the ERC-721A standard. NFTs are minted to the creator’s wallet as they are added to the collection. NFTs are still transferable, able to be sold on a marketplace, and perform any other actions as defined by ERC-721A.

For advanced use-cases requiring , NFT Collection includes signature-based minting capabilities.

Deploy Modular NFT Collection

The Modular NFT Collection is available to deploy on Explore. Deploy it now through dashboard.

[Deploy Now](https://thirdweb.com/thirdweb.eth/ERC721CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6Ik1pbnRhYmxlRVJDNzIxIn0%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkJhdGNoTWV0YWRhdGFFUkM3MjEifQ%3D%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlRyYW5zZmVyYWJsZUVSQzcyMSJ9&displayName=Modular+NFT+Collection)

#### NFT Collection vs NFT Drop

NFT Collection contract does not have lazy minting capabilities or claim conditions. If you’d prefer to define specific settings such as claim limits, start and end times to claim, and more, please refer to the [NFT Drop contract](https://thirdweb.com/thirdweb.eth/ERC721CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkNsYWltYWJsZUVSQzcyMSJ9&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkJhdGNoTWV0YWRhdGFFUkM3MjEifQ%3D%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlJveWFsdHlFUkM3MjEifQ%3D%3D&displayName=Modular+NFT+Drop).

#### Use Cases & Examples

* Create a 1-of-many collection of photography, artwork, or other media to be collected or sold on a marketplace
* Create a 1-of-1 NFT which provide special utility or can be used to gate access to an application
* Create a community-made collection of NFTs using signature-minting

#### Default Installed Modules

* Mintable
* BatchMetadata
* Transferable

* #### Locate Contract  
Navigate to Explore, locate the [Modular NFT Collection contract](https://thirdweb.com/thirdweb.eth/ERC721CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6Ik1pbnRhYmxlRVJDNzIxIn0%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkJhdGNoTWV0YWRhdGFFUkM3MjEifQ%3D%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlRyYW5zZmVyYWJsZUVSQzcyMSJ9&displayName=Modular+NFT+Collection), and select the Deploy Now button.  
![Screenshot NFT Collection contract](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fnft_collection_step1.1486f8db.png&w=3840&q=75)
* #### Configure Contract Metadata  
Fill in the Contract Metadata including Name, Symbol, Description, and Image.  
Contract Metadata serves as your unique identifier.  
![Screenshot of NFT Collectionconfigure metadata](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fnft_collection_step2.3614d12c.png&w=3840&q=75)
* #### Select Chain  
Select the preferred chain you want to deploy on and select Deploy Now.  
![Screenshot of Token select chain screen](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fnft_collection_step3.e9ee4ccf.png&w=3840&q=75)  
#### Any EVM Compatible  
The NFT Collection contract is deployable on any EVM compatible network. [View all available networks.](https://thirdweb.com/chainlist)  
If you are signed in with an EOA wallet, you will be prompted to sign the transaction. After that your contract is deployed and you can begin configuring the modules.

#### Modular Contract

This contract is created using the modular contract framework. Modules on this contract are upgradeable. [Learn more about Modular Contracts.](https://portal.thirdweb.com/contracts/modular-contracts/overview)

#### Configure Modules

To configure the modules, navigate to the Modules view:

* Configure the MintableERC721 module to facilitate minting of ERC721 tokens with sales settings

![Screenshot of ERC721 Mintable module](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Ferc721_mintable.0cc7b187.png&w=3840&q=75)

* Configure BatchMetadataERC721 to upload the NFT metadata

![Screenshot of ERC721 BatchMetadata module](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Ferc721_batchmetadata.5e4cc146.png&w=3840&q=75)

* Configure the Transferable721 Module to restrict transfers, if desired.

![Screenshot of ERC721 Transferable module](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Ferc721_transferable.28724d4e.png&w=3840&q=75)

#### Install Modules

To install additional modules on this contract, navigate to the Modules view after deploying your contract.
## Deploy a modular Open Edition contract

The Open Edition contract creates NFTs with shared metadata with unique token IDs appended to the NFTs name. Contrary to standard NFT contracts, Open Edition has an unlimited supply and users may continuously mint them increasing accessibility to a broader audience. The Open Edition contract is based on the ERC-721A contract.

Deploy Modular Open Edition

The Modular Open Edition is available to deploy on Explore. Deploy it now through dashboard.

[Deploy Now](https://thirdweb.com/thirdweb.eth/ERC721CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkNsYWltYWJsZUVSQzcyMSJ9&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6Ik9wZW5FZGl0aW9uTWV0YWRhdGFFUkM3MjEifQ%3D%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlJveWFsdHlFUkM3MjEifQ%3D%3D&displayName=Modular+Open+Edition)

#### Claim Settings

This contract does not require limits to the total supply of NFTs. Any settings related to claim phases may still be applied such as price per NFT, allowlists, start and end times to the phases, and NFTs per wallet.

#### Use Cases & Examples

* Timed Drops to allow unlimited purchases of NFTs within a certain window of time
* Generative art NFTs with each NFT portraying unique artwork different from previous
* Event specific drops to collect as commemorations, special promotions, and more

#### Default Installed Modules

* Claimable
* OpenEditionMetadata
* Royalty

#### Deploy modular Open Edition contract

Learn how to deploy a modular Open Edition contract through the dashboard.

* #### Locate Contract  
Navigate to Explore, locate the [Modular Open Edition contract](https://thirdweb.com/thirdweb.eth/ERC721CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkNsYWltYWJsZUVSQzcyMSJ9&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6Ik9wZW5FZGl0aW9uTWV0YWRhdGFFUkM3MjEifQ%3D%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlJveWFsdHlFUkM3MjEifQ%3D%3D&displayName=Modular+Open+Edition), and select the Deploy Now button.  
![Screenshot of Open Edition Deployment screen](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Foe_step1.028a3743.png&w=3840&q=75)
* #### Configure Contract Metadata  
Fill in the Contract Metadata including Name, Symbol, Description, and Image.  
Contract Metadata serves as your unique identifier.  
![Screenshot of Open Edition configure metadata](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Foe_step2.e4b1cdea.png&w=3840&q=75)
* #### Configure Royalties  
Determine a percentage of the revenue from royalties and pass to the percentage field, if desired.  
The Transfer Validator Address is an address that must enforce royalties in compliance with ERC-721C. [Learn more about the ERC-721C standard.](https://blog.thirdweb.com/guides/deploy-erc721a-nft-collection-royalties-thirdweb-guide-2/)  
![Screenshot of Open Edition configure royalties](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Foe_step3.a4dfc48f.png&w=3840&q=75)
* #### Select Chain  
Select the preferred chain you want to deploy on and select Deploy Now.  
![Screenshot of Token Drop select chain screen](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Foe_step4.9a5892db.png&w=3840&q=75)  
#### Any EVM Compatible  
The Open Edition contract is deployable on any EVM compatible network. [View all available networks.](https://thirdweb.com/chainlist)  
If you are signed in with an EOA wallet, you will be prompted to sign the transaction. After that your contract is deployed and you can begin configuring the modules.

#### Modular Contract

This contract is created using the modular contract framework. Modules on this contract are upgradeable. [Learn more about Modular Contracts.](https://portal.thirdweb.com/contracts/modular-contracts/overview)

#### Configure Modules

To configure the modules, navigate to the Modules view:

(Coming soon)

#### Install Modules

To install additional modules on this contract, navigate to the Modules view after deploying your contract.
## Deploy a modular NFT Drop contract

The NFT Drop contract creates a unique collection of NFTs based on the [ERC-721A](https://www.erc721a.org/) standard. NFT Drop allows you to define claim conditions or settings which define how a user can claim an NFT.

Deploy Modular NFT Drop

The Modular NFT Drop is available to deploy on Explore. Deploy it now through dashboard.

[Deploy Now](https://thirdweb.com/thirdweb.eth/ERC721CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkNsYWltYWJsZUVSQzcyMSJ9&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkJhdGNoTWV0YWRhdGFFUkM3MjEifQ%3D%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlJveWFsdHlFUkM3MjEifQ%3D%3D&displayName=Modular+NFT+Drop)

#### NFT Drop vs NFT Collection

NFT Drop has the Claimable module enabling claim conditions. If you’d prefer to not define specific settings such as claim limits, start and end times to claim, and more, please refer to the [NFT Collection contract](https://thirdweb.com/thirdweb.eth/ERC721CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6Ik1pbnRhYmxlRVJDNzIxIn0%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkJhdGNoTWV0YWRhdGFFUkM3MjEifQ%3D%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlRyYW5zZmVyYWJsZUVSQzcyMSJ9&displayName=Modular+NFT+Collection).

#### Use Cases & Examples

* Create an NFT profile pic collection with each NFT having a different combination of traits
* Release NFTs in phases with exclusivity, discounted, or public phases
* Create restricted-access NFT Drops for allowlisted wallets to claim

#### Default Installed Modules

* Claimable
* BatchMetadata
* Royalty

#### Deploy a modular NFT Drop contract

Learn how to deploy a modular NFT Drop contract through the dashboard.

* #### Locate Contract  
Navigate to Explore, locate the [Modular NFT Drop contract](https://thirdweb.com/thirdweb.eth/ERC721CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkNsYWltYWJsZUVSQzcyMSJ9&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkJhdGNoTWV0YWRhdGFFUkM3MjEifQ%3D%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlJveWFsdHlFUkM3MjEifQ%3D%3D&displayName=Modular+NFT+Drop), and select the Deploy Now button.  
![Screenshot NFT Drop contract](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fnft_drop_step1.d1b778c1.png&w=3840&q=75)
* #### Configure Contract Metadata  
Fill in the Contract Metadata including Name, Symbol, Description, and Image.  
Contract Metadata serves as your unique identifier.  
![Screenshot of NFT Drop configure metadata](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fnft_drop_step2.053affd0.png&w=3840&q=75)
* #### Select Chain  
Select the preferred chain you want to deploy on and select Deploy Now.  
![Screenshot of NFT Drop select chain screen](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fnft_drop_step3.3255541c.png&w=3840&q=75)  
#### Any EVM Compatible  
The NFT Drop contract is deployable on any EVM compatible network. [View all available networks.](https://thirdweb.com/chainlist)  
If you are signed in with an EOA wallet, you will be prompted to sign the transaction. After that your contract is deployed and you can begin configuring the modules.

#### Modular Contract

This contract is created using the modular contract framework. Modules on this contract are upgradeable. [Learn more about Modular Contracts.](https://portal.thirdweb.com/contracts/modular-contracts/overview)

#### Configure Modules

To configure the modules, navigate to the Modules view:

(Coming soon)

#### Install Modules

To install additional modules on this contract, navigate to the Modules view after deploying your contract.
## Deploy a modular Token Drop Contract

The Token Drop contract creates digital currencies that are released for a set price and is compliant with the [ERC-20](https://eips.ethereum.org/EIPS/eip-20) standard. This contract defines a common set of rules for tokens including how they can be transferred, how transactions are approved, and how data about token balances is accessed.

Token Drop includes settings called claim conditions which allow deployers to set a prices for tokens per claim phase and limits on how many tokens to be released. These are enabled through the Claimable module.

Deploy Modular Token Drop

The Modular Token Drop is available to deploy on Explore. Deploy it now through dashboard.

[Deploy Now](https://thirdweb.com/thirdweb.eth/ERC20CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkNsYWltYWJsZUVSQzIwIn0%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlRyYW5zZmVyYWJsZUVSQzIwIn0%3D&displayName=Modular+Token+Drop)

#### Token vs Token Drop

The Token Drop contract allows users to claim tokens based on specific settings set using Claim Conditions. If you do not need to set limits or special settings on how to claim, refer to the simple [Token contract](https://thirdweb.com/thirdweb.eth/ERC20CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6Ik1pbnRhYmxlRVJDMjAifQ%3D%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlRyYW5zZmVyYWJsZUVSQzIwIn0%3D&displayName=Modular+Token).

#### Use Cases

* Release cryptocurrency for a set prices. Example, 1 MATIC per token
* Allow specific wallets to claim tokens before public releases
* Allow users to claim tokens till a set deadline

#### Default Installed Modules

* Transferable
* Claimable

#### Deploy modular Token Drop

Learn how to deploy a modular Token Drop contract through the dashboard.

* #### Locate Contract  
Navigate to Explore, locate the [Modular Token Drop contract](https://thirdweb.com/thirdweb.eth/ERC20CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkNsYWltYWJsZUVSQzIwIn0%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlRyYW5zZmVyYWJsZUVSQzIwIn0%3D&displayName=Modular+Token+Drop), and select the Deploy Now button.  
![Screenshot of Token Drop Deployment screen](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Ftoken_drop_step1.7e7050f5.png&w=3840&q=75)
* #### Configure Contract Metadata  
Fill in the Contract Metadata including Name, Symbol, Description, and Image.  
Contract Metadata serves as your unique identifier.  
![Screenshot of Token Drop configure metadata](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Ftoken_drop_step2.3308abd8.png&w=3840&q=75)
* #### Select Chain  
Select the preferred chain you want to deploy on and select Deploy Now.  
![Screenshot of Token Drop select chain screen](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Ftoken_drop_step3.1b268516.png&w=3840&q=75)  
#### Any EVM Compatible  
The Token Drop contract is deployable on any EVM compatible network. [View all available networks.](https://thirdweb.com/chainlist)  
If you are signed in with an EOA wallet, you will be prompted to sign the transaction. After that your contract is deployed and you can begin configuring the modules.

#### Modular Contract

This contract is created using the modular contract framework. Modules on this contract are upgradeable. [Learn more about Modular Contracts.](https://portal.thirdweb.com/contracts/modular-contracts/overview)

#### Configure Modules

To configure the modules, navigate to the Modules view:

* Configure the Transferable Module to restrict transfers, if desired.

![Screenshot of ERC20 Transferable module](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Ferc20_transferable.6aaba8f1.png&w=3840&q=75)

* Configure the Claimable module to mint tokens, set claim conditions, and update the primary sale recipient

![Screenshot of ERC20 Claimable module](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Ferc20_claimable.f3c5afc0.png&w=3840&q=75)

#### Install Modules

To install additional modules on this contract, navigate to the Modules view after deploying your contract.
## ERC-1155 Core

### Supported Callback Functions

| Function                       | Mode     |
| ------------------------------ | -------- |
| beforeMintERC1155              | REQUIRED |
| beforeMintWithSignatureERC1155 | REQUIRED |
| beforeTransferERC1155          | OPTIONAL |
| beforeBatchTransferERC1155     | OPTIONAL |
| beforeBurnERC1155              | OPTIONAL |
| beforeApproveForAll            | OPTIONAL |
| onTokenURI                     | REQUIRED |
| updateMetadataERC1155          | REQUIRED |
| updateTokenIdERC1155           | OPTIONAL |

### Supported Interfaces

| Interface          | ID         |
| ------------------ | ---------- |
| ERC165             | 0x01ffc9a7 |
| ERC1155            | 0xd9b67a26 |
| ERC1155MetadataURI | 0x0e89341c |
| ERC-7572           | 0xe8a3d485 |
| ERC-173            | 0x7f5828d0 |

### Functions Supported

| Function                      | Description                                                                                                                                           |
| ----------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------- |
| \_initialize                  | Initializes the contract with parameters for name, symbol, metadata URI, owner, modules, and their data.                                              |
| contractURI                   | Returns the contract metadata URI.                                                                                                                    |
| totalSupply                   | Returns the total supply of a specified tokenId.                                                                                                      |
| uri                           | Returns the token metadata of an NFT.                                                                                                                 |
| supportsInterface             | Checks if the contract implements an interface with the given interface ID.                                                                           |
| getSupportedCallbackFunctions | Returns the supported callback functions.                                                                                                             |
| setContractURI                | Sets the contract metadata URI. Callable only by the contract admin.                                                                                  |
| mint                          | Mints tokens to a specified address, calling the beforeMint hook.                                                                                     |
| mintWithSignature             | Mints tokens with a signature, calling the beforeMintWithSignature hook.                                                                              |
| burn                          | Burns a specified token, calling the beforeBurn hook if it exists.                                                                                    |
| safeTransferFrom              | Transfers ownership of an NFT, calling the beforeTransfer hook if it exists.                                                                          |
| safeBatchTransferFrom         | Batch transfers ownership of NFTs, calling the beforeBatchTransfer hook if it exists.                                                                 |
| setApprovalForAll             | Approves or revokes approval from an operator to transfer or approve for all of the caller's NFTs, calling the beforeApproveForAll hook if it exists. |
## Loyalty Card

The Loyalty Card contract is suitable for launching loyalty programs. Each NFT represents a loyalty card, and the NFT's metadata contains the loyalty card's information.

A loyalty card's **metadata can be updated by an admin** of the contract. A loyalty card can be cancelled (i.e. 'burned') by its owner or an approved operator. A loyalty card can be revoked (i.e. 'burned') without its owner's approval, by an admin of the contract. By default, loyalty cards are non-transferrable NFTs.

Loyalty cards can be minted to users via signature minting.

### Extensions

* [ERC721](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721)
* [ERC721Supply](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Supply)
* [ERC721Mintable](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721Mintable)
* [ERC721BatchMintable](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721BatchMintable)
* [ERC721SignatureMintV2](https://portal.thirdweb.com/contracts/build/extensions/erc-721/ERC721SignatureMint)
* [ERC721LoyaltyCard](https://portal.thirdweb.com/contracts/build/extensions)
* [ERC721UpdatableMetadata](https://portal.thirdweb.com/contracts/build/extensions)
* [Royalty](https://portal.thirdweb.com/contracts/build/extensions/general/Royalty)
* [PlatformFee](https://portal.thirdweb.com/contracts/build/extensions/general/PlatformFee)
* [PrimarySale](https://portal.thirdweb.com/contracts/build/extensions/general/PrimarySale)
* [Permissions](https://portal.thirdweb.com/contracts/build/extensions/general/Permissions)
* [PermissionsEnumerable](https://portal.thirdweb.com/contracts/build/extensions/general/PermissionsEnumerable)
* [ContractMetadata](https://portal.thirdweb.com/contracts/build/extensions/general/ContractMetadata)
* [Ownable](https://portal.thirdweb.com/contracts/build/extensions/general/Ownable)
* [Gasless](https://portal.thirdweb.com/contracts/build/extensions)
## Deploy a modular Token Contract

The modular Token contract creates digital currencies and is compliant with the ERC-20 standard. This contract defines a common set of rules for tokens including how they can be transferred, how transactions are approved, and how data about token balances is accessed.

Deploy Modular Token

The Modular Token is available to deploy on Explore. Deploy it now through dashboard.

[Deploy Now](https://thirdweb.com/thirdweb.eth/ERC20CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6Ik1pbnRhYmxlRVJDMjAifQ%3D%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlRyYW5zZmVyYWJsZUVSQzIwIn0%3D&displayName=Modular+Token)

#### Token vs Token Drop

The Token contract does not allow users to claim tokens under the criteria of claim conditions. If you would prefer to set limits such as when and how your users can claim tokens defined through allowlists, release dates, and claim limits, please refer to the [Token Drop contract](https://thirdweb.com/thirdweb.eth/ERC20CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IkNsYWltYWJsZUVSQzIwIn0%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlRyYW5zZmVyYWJsZUVSQzIwIn0%3D&displayName=Modular+Token+Drop).

#### Use Cases

* Sell NFTs on a marketplace in a custom token
* Create custom cryptocurrencies used as a digital currency, for payments, trading, stable-coins, ICOs, and more
* Reward users with tokens for specific actions completed in games or other applications
* Grant governance rights by using tokens to vote on protocol upgrades, decisions, allocations of treasury resources

#### Default Installed Modules

* Transferable
* Mintable

#### Deploy modular Token

Learn how to deploy a modular Token contract through the dashboard.

* #### Locate Contract  
Navigate to Explore, locate the [Modular Token contract](https://thirdweb.com/thirdweb.eth/ERC20CoreInitializable?module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6Ik1pbnRhYmxlRVJDMjAifQ%3D%3D&module=eyJwdWJsaXNoZXIiOiJkZXBsb3llci50aGlyZHdlYi5ldGgiLCJtb2R1bGVJZCI6IlRyYW5zZmVyYWJsZUVSQzIwIn0%3D&displayName=Modular+Token), and select the Deploy Now button.  
![Screenshot of Token Deployment screen](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Ftoken_step1.e893bf02.png&w=3840&q=75)
* #### Configure Contract Metadata  
Fill in the Contract Metadata including Name, Symbol, Description, and Image.  
Contract Metadata serves as your unique identifier.  
![Screenshot of Token configure metadata](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Ftoken_step2.a5ce581b.png&w=3840&q=75)
* #### Select Chain  
Select the preferred chain you want to deploy on and select Deploy Now.  
![Screenshot of Token select chain screen](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Ftoken_step3.f5191487.png&w=3840&q=75)  
#### Any EVM Compatible  
The Token contract is deployable on any EVM compatible network. [View all available networks.](https://thirdweb.com/chainlist)  
If you are signed in with an EOA wallet, you will be prompted to sign the transaction. After that your contract is deployed and you can begin configuring the modules.

#### Modular Contract

This contract is created using the modular contract framework. Modules on this contract are upgradeable. [Learn more about Modular Contracts.](https://portal.thirdweb.com/contracts/modular-contracts/overview)

#### Configure Modules

To configure the modules, navigate to the Modules view:

* Configure the Transferable Module to restrict transfers, if desired.

![Screenshot of ERC20 Transferable module](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Ferc20_transferable.6aaba8f1.png&w=3840&q=75)

#### Install Modules

To install additional modules on this contract, navigate to the Modules view after deploying your contract.
## ERC-721 Core

### Supported Callback Functions

| Function                      | Mode     |
| ----------------------------- | -------- |
| beforeMintERC721              | REQUIRED |
| beforeMintWithSignatureERC721 | REQUIRED |
| beforeTransferERC721          | OPTIONAL |
| beforeBurnERC721              | OPTIONAL |
| beforeApproveERC721           | OPTIONAL |
| beforeApproveForAll           | OPTIONAL |
| onTokenURI                    | REQUIRED |
| updateMetadataERC721          | REQUIRED |

### Supported Interfaces

| Interface      | ID         |
| -------------- | ---------- |
| ERC165         | 0x01ffc9a7 |
| ERC721         | 0x80ac58cd |
| ERC721Metadata | 0x5b5e139f |
| ERC-7572       | 0xe8a3d485 |
| ERC-173        | 0x7f5828d0 |

### Functions Supported

| Function                      | Description                                                                                              |
| ----------------------------- | -------------------------------------------------------------------------------------------------------- |
| \_initialize                  | Initializes the contract with parameters for name, symbol, metadata URI, owner, modules, and their data. |
| contractURI                   | Returns the contract metadata URI.                                                                       |
| startTokenId                  | Returns the starting token ID for sequential mints.                                                      |
| totalMinted                   | Returns the total number of tokens minted ever.                                                          |
| tokenURI                      | Returns the token metadata of an NFT.                                                                    |
| supportsInterface             | Checks if the contract implements an interface with the given interface ID.                              |
| getSupportedCallbackFunctions | Returns the supported callback functions.                                                                |
| setContractURI                | Sets the contract metadata URI. Callable only by the contract admin.                                     |
| mint                          | Mints tokens to a specified address, calling the beforeMint hook.                                        |
| mintWithSignature             | Mints tokens with a signature, calling the beforeMintWithSignature hook.                                 |
| burn                          | Burns a specified token, calling the beforeBurn hook if it exists.                                       |
| transferFrom                  | Transfers ownership of an NFT, calling the beforeTransfer hook if it exists.                             |
| approve                       | Approves an address to transfer a specific NFT, calling the beforeApprove hook if it exists.             |
| setApprovalForAll             | Approves or revokes approval from an operator to transfer or approve for all of the caller's NFTs.       |
## ERC-20 Core

### Supported Callback Functions

| Function                     | Mode     |
| ---------------------------- | -------- |
| beforeMintERC20              | REQUIRED |
| beforeMintWithSignatureERC20 | REQUIRED |
| beforeTransferERC20          | OPTIONAL |
| beforeBurnERC20              | OPTIONAL |
| beforeApproveERC20           | OPTIONAL |

### Supported Interfaces

| Interface | ID         |
| --------- | ---------- |
| ERC165    | 0x01ffc9a7 |
| ERC-7572  | 0xe8a3d485 |
| ERC-173   | 0x7f5828d0 |
| IERC20    | 0x36372b07 |

### Functions Supported

| Function                      | Description                                                                                              |
| ----------------------------- | -------------------------------------------------------------------------------------------------------- |
| \_initialize                  | Initializes the contract with parameters for name, symbol, metadata URI, owner, modules, and their data. |
| contractURI                   | Returns the contract metadata URI.                                                                       |
| name                          | Returns the name of the token.                                                                           |
| symbol                        | Returns the symbol of the token.                                                                         |
| supportsInterface             | Checks if the contract implements an interface with the given interface ID.                              |
| getSupportedCallbackFunctions | Returns the supported callback functions.                                                                |
| setContractURI                | Sets the contract metadata URI. Callable only by the contract admin.                                     |
| mint                          | Mints tokens to a specified address, calling the beforeMint hook.                                        |
| mintWithSignature             | Mints tokens with a signature, calling the beforeMintWithSignature hook.                                 |
| burn                          | Burns tokens from a specified address, calling the beforeBurn hook if it exists.                         |
| transfer                      | Transfers tokens to a recipient, calling the beforeTransfer hook if it exists.                           |
| transferFrom                  | Transfers tokens from a sender to a recipient, calling the beforeTransfer hook if it exists.             |
| approve                       | Approves a spender to spend tokens on behalf of an owner, calling the beforeApprove hook if it exists.   |
| permit                        | Sets allowance based on token owner's signed approval, calling the beforeApprove hook.                   |
## Create Core Contract

#### Installation

Install Forge from Foundry and add the modular contract framework:

```bash
forge init
forge install thirdweb-dev/modular-contracts --no-commit
```

Add the Thirdweb modular contracts to `foundry.toml` under `remappings`:

```toml
remappings = ['@thirdweb-dev=lib/modular-contracts/']
```

#### Setup Core Contract

* #### Create a Core Contract  
Create a new file in the `src` folder called `CounterCore.sol`, and inherit the `Core` contract.  
```solidity  
// SPDX-License-Identifier: MIT  
 pragma solidity ^0.8.20;  
   
 import {Core} from "@thirdweb-dev/src/Core.sol";  
 import {BeforeIncrementCallback} from "./interface/BeforeIncrementCallback.sol";  
   
 contract CounterCore is Core {  
     constructor(address owner) {  
         _initializeOwner(owner);  
     }  
 }  
```  
> **Note**The `Core` contract is the base contract that needs to be inherited for this contract to be recognized as a core contract.
* #### Set Get Supported Callback Function  
Implement the `getSupportedCallbackFunctions` function. The Core contract is abstract because this function is not implemented. To avoid compilation errors, declare the function with an empty body for now.  
```solidity  
// SPDX-License-Identifier: MIT  
    pragma solidity ^0.8.20;  
   
    import {Core} from "@thirdweb-dev/src/Core.sol";  
   
    contract CounterCore is Core {  
        constructor(address owner) {  
            _initializeOwner(owner);  
        }  
   
        function getSupportedCallbackFunctions()  
            public  
            pure  
            override  
            returns (SupportedCallbackFunction[] memory supportedCallbackFunctions)  
        {}  
    }  
```
* #### Set Up Increment Function  
Define a function to increment a counter.  
```solidity  
// SPDX-License-Identifier: MIT  
 pragma solidity ^0.8.20;  
   
 import {Core} from "@thirdweb-dev/src/Core.sol";  
   
 contract CounterCore is Core {  
     uint256 public count;  
   
     constructor(address owner) {  
         _initializeOwner(owner);  
     }  
   
     function getSupportedCallbackFunctions()  
         public  
         pure  
         override  
         returns (SupportedCallbackFunction[] memory supportedCallbackFunctions)  
     {}  
   
     // 👇👇👇👇👇👇👇👇👇  
     function increment() public {  
         count += 1;  
     }  
 }  
```
* #### Add a Callback Function  
Introduce the `_beforeIncrement` function to use the `beforeIncrement` callback from a module to achieve this, we'll introduce the interface `BeforeIncrementCallback`  
> **Note**Callback functions are hook-like functionalities that can be used before or after the main functionality of a core contract. In this example, the `beforeIncrement` callback is executed before the main increment functionality.  
```solidity  
// SPDX-License-Identifier: MIT  
 pragma solidity ^0.8.20;  
   
 import {Core} from "@thirdweb-dev/src/Core.sol";  
   
 // 👇👇👇👇👇👇👇👇👇  
   
 interface BeforeIncrementCallback {  
     function beforeIncrement(uint256 count) external returns (uint256);  
 }  
   
 contract CounterCore is Core {  
     uint256 public count;  
   
     constructor(address owner) {  
         _initializeOwner(owner);  
     }  
   
     function getSupportedCallbackFunctions()  
         public  
         pure  
         override  
         returns (SupportedCallbackFunction[] memory supportedCallbackFunctions)  
     {}  
   
     function increment() public {  
         count += 1;  
     }  
   
     // 👇👇👇👇👇👇👇👇👇  
   
     function _beforeIncrement(  
         uint256 _count  
     ) internal returns (uint256 newCount) {  
         (, bytes memory returnData) = _executeCallbackFunction(  
             BeforeIncrementCallback.beforeIncrement.selector,  
             abi.encodeCall(BeforeIncrementCallback.beforeIncrement, (_count))  
         );  
   
         newCount = abi.decode(returnData, (uint256));  
     }  
 }  
```
* #### Implement Supported Functions  
Implement the `getSupportedCallbackFunctions` and `supportsInterface` functions to expose which callback functions and interfaces this core contract supports.  
```solidity  
// SPDX-License-Identifier: MIT  
pragma solidity ^0.8.20;  
   
import {Core} from "@thirdweb-dev/src/Core.sol";  
   
interface BeforeIncrementCallback {  
    function beforeIncrement(uint256 count) external returns (uint256);  
}  
   
contract CounterCore is Core {  
    uint256 public count;  
   
    constructor(address owner) {  
        _initializeOwner(owner);  
    }  
   
     // 👇👇👇👇👇👇👇👇👇  
    function getSupportedCallbackFunctions()  
        public  
        pure  
        override  
        returns (SupportedCallbackFunction[] memory supportedCallbackFunctions)  
    {  
        supportedCallbackFunctions = new SupportedCallbackFunction[](1);  
        supportedCallbackFunctions[0] = SupportedCallbackFunction({  
            selector: BeforeIncrementCallback.beforeIncrement.selector,  
            mode: CallbackMode.OPTIONAL  
        });  
    }  
   
    function increment() public {  
        count += 1;  
    }  
   
    function _beforeIncrement(  
        uint256 _count  
    ) internal returns (uint256 newCount) {  
        (, bytes memory returnData) = _executeCallbackFunction(  
            BeforeIncrementCallback.beforeIncrement.selector,  
            abi.encodeCall(BeforeIncrementCallback.beforeIncrement, (_count))  
        );  
   
        newCount = abi.decode(returnData, (uint256));  
    }  
   
     // 👇👇👇👇👇👇👇👇👇  
    function supportsInterface(  
        bytes4 interfaceId  
    ) public view override returns (bool) {  
        return interfaceId == 0x00000001 || super.supportsInterface(interfaceId);  
    }  
}  
```

---

This guide will help you create a core contract that can increment a counter with optional callback functions for additional modular functionality.
## How Do Modular Contracts Work

Modular contracts are composed of two core components:

* **Core Contracts**
* **Module Contracts**

Core contracts serve as the foundation upon which module contracts are installed. Module contracts are smart contracts that provide additional functionality and can be installed or uninstalled from a core contract. You can think of core and module contracts as building blocks, like Lego pieces.

##### How Do Module Contracts Supply Additional Functionality?

Once installed, module contracts provide additional functionality by creating `fallback` and `callback` functions that the core contract can interact with through delegate calls.

* **Fallback functions** are independent functions that can be called through the core contract.
* **Callback functions** are dependent functions that must be called within the context of a core contract function. These functions enhance the core contract's functionality by executing additional logic either before or after the main core contract logic.

##### How Are Module Contracts Installed onto Core Contracts?

Like Lego pieces, modular contracts must "fit" together properly. If the pieces don't align—meaning the contracts aren't compatible—they cannot be installed together.

This raises the question:

##### What Makes a Module Contract Compatible with a Core Contract?

Two factors determine compatibility: **interfaces** and **callback functions**.

* If a module contract has a callback function that the core contract doesn’t support (or is already in use), it can’t be installed.
* Similarly, if a module contract requires a certain interface to be supported by the core contract and it doesn’t have it, then it can’t be installed.

##### How Core and Module Contracts Communicate

Core contracts expose their supported callback functions and interfaces through two methods:

* `getSupportedCallbackFunctions` \- to expose the core contract’s supported callback functions.
* `supportsInterface` \- to expose the core contract’s supported interfaces.

Module contracts also expose their supplied callback and fallback functions, along with the required interfaces, via the `getModuleConfig` function.

##### Example: Core and Module Contract Interaction

Let’s walk through an example with three contracts:

* `ERC721Core`
* `MintableModule`
* `TransferableModule`

###### `ERC721Core` Example

The `ERC721Core` contract supports the `beforeMint` callback and the ERC-721 interface (`0x80ac58cd`).

```solidity
function getSupportedCallbackFunctions()
	public
	pure
	override
	returns (SupportedCallbackFunction[] memory supportedCallbackFunctions)
{
	supportedCallbackFunctions = new SupportedCallbackFunction ;
	supportedCallbackFunctions[0] = SupportedCallbackFunction({
		selector: BeforeMintCallback.beforeMint.selector,
		mode: CallbackMode.REQUIRED
	});
}
 
function supportsInterface(bytes4 interfaceId)
	public
	view
	override(ERC721AUpgradeable, IERC721AUpgradeable, Core)
	returns (bool)
{
	return interfaceId == 0x80ac58cd // ERC165 Interface ID for ERC721
		|| super.supportsInterface(interfaceId);
}
```

###### `MintableModule` Example

The `MintableModule` provides the `beforeMint` callback and requires the ERC-721 interface.

```solidity
function getModuleConfig() external pure override returns (ModuleConfig memory config) {
	config.callbackFunctions = new CallbackFunction ;
	config.callbackFunctions[0] = CallbackFunction(this.beforeMint.selector);
 
	config.requiredInterfaces = new bytes4 ;
	config.requiredInterfaces[0] = 0x80ac58cd; // ERC721.
}
```

###### `TransferableModule` Example

The `TransferableModule` provides the `beforeTransfer` callback and also requires the ERC-721 interface.

```solidity
function getModuleConfig() external pure override returns (ModuleConfig memory config) {
	config.callbackFunctions = new CallbackFunction ;
	config.callbackFunctions[0] = CallbackFunction(this.beforeTransfer.selector);
 
	config.requiredInterfaces = new bytes4 ;
	config.requiredInterfaces[0] = 0x80ac58cd; // ERC721.
}
```

###### Compatibility in Action

The `ERC721Core` contract supports the ERC-721 interface (`0x80ac58cd`), which is required by both the `MintableModule` and the `TransferableModule`.

However, since `ERC721Core` only supports the `beforeMint` callback, only the `MintableModule` can be installed. The `TransferableModule`, which provides the `beforeTransfer` callback, cannot be installed because `ERC721Core` does not support it.

---

##### Conclusion

Modular contracts work by allowing core contracts to interact with module contracts through delegate calls to `fallback` and `callback` functions. Compatibility between core and module contracts is determined by their supported interfaces and callback functions. This modular architecture provides flexibility, allowing functionality to be added or removed as needed, like assembling or disassembling Lego pieces.
## Get Started with Modular Contracts

The Get Started documentation for Modular Contracts guides you through building and deploying an example modular contract that increments a counter. It also shows you how to build an application using this contract.

**Prerequisites:**This guide assumes you have a basic understanding of Solidity and the thirdweb SDK. If you are new to Solidity, we recommend starting with the [Solidity docs](https://docs.soliditylang.org/en/v0.8.26/) and the [thirdweb SDK docs](https://portal.thirdweb.com/typescript/v5/getting-started).

#### Objectives

* Learn how to code and deploy core contract
* Learn how to code and deploy module contract
* Learn how to build an application with a modular contract

#### Sections

Create Modular Contract

* [Create Core Contract](https://portal.thirdweb.com/contracts/modular-contracts/get-started/create-core-contract)
* [Create Module Contract](https://portal.thirdweb.com/contracts/modular-contracts/get-started/create-module-contract)
* [Deploy Modular Contract](https://portal.thirdweb.com/contracts/modular-contracts/get-started/deploy-modular-contract)

Interact with the Modular Contract

* Add and remove modules (coming soon)
* Build application (coming soon)

The full repository for this project can be found on GitHub [here](https://github.com/thirdweb-example/modular-contract-starter).
## Deploy a Modular Contract

This guide will show you how to publish a Modular Contract that increments a counter. If you're interested in learning how modular contracts work, refer to [How it works](https://portal.thirdweb.com/contracts/modular-contracts/how-it-works). If you haven't read through [Create a Core Contract](https://portal.thirdweb.com/contracts/modular-contracts/get-started/create-core-contact) and [Create a Module Contract](https://portal.thirdweb.com/contracts/modular-contracts/get-started/create-module-contract), please do so before proceeding as this guide will build on top of those previous guides.

* #### Grab an API Key from the thirdweb Dashboard  
Go to the [thirdweb Dashboard](https://thirdweb.com/team), Create a new Project to obtain API Key  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcreate-api-key.5c77a3c0.png&w=3840&q=75)  
A dialog should pop up asking for the name of the key. Use `modular-contract-test-key`.  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fapi-key-name.6e4ae41d.png&w=3840&q=75)  
Click "Proceed".  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fproceed.12d03bcd.png&w=3840&q=75)  
Then, click on the copy icon and store the API key in a secure place.  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcopy-api-key.b4e1503f.png&w=3840&q=75)
* #### Publish the Module Contract  
In your terminal, run the following command:  
```bash  
npx thirdweb publish -k "THIRDWEB_API_KEY"  
```  
Replace `THIRDWEB_API_KEY` with your API key. Then, select `CounterModule`.  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fselect-counter-module.11d1c3fe.png&w=3840&q=75)  
It should open up your browser. Scroll to the bottom and click "Next".  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fscroll-and-next.3734975f.png&w=3840&q=75)  
Then, choose the Sepolia network and click "Publish Contract".  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fpublish-contract.5288021b.png&w=3840&q=75)  
Now, we can move on to deploying the core contract.
* #### Deploy the Core Contract  
In your terminal, run the following command:  
```bash  
npx thirdweb deploy -k "THIRDWEB_API_KEY"  
```  
Replace `THIRDWEB_API_KEY` with your API key. Choose `CounterCore`.  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fselect-counter-core.2394f457.png&w=3840&q=75)  
It should open up your browser. Input the `owner` of the contract and click "Deploy Now".  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Finput-owner.46acff55.png&w=3840&q=75)  
Then, choose the Sepolia chain and click "Deploy Now".  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fsepolia-deploy-now.1ef4494d.png&w=3840&q=75)  
It should now be deploying.  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fdeploying.749161fa.png&w=2048&q=75)  
Once the core contract has been deployed, click "View Contract".
* #### Install the Module  
On the contract dashboard, click on "Modules" in the left-hand sidebar.  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcontract-dashboard-modules.46582583.png&w=3840&q=75)  
You will be redirected to the "Edit Modules" page, where you can install the `CoreModule`. Under the "Publisher" input, paste in the address of the publisher you used.  
Then, the "Module Name" input will unlock. Click on that and select `counterModule`. Once it finishes checking eligibility, select "Module Version" as 1.0.0 and choose whichever step you wish to use.  
Finally, click "Install".  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Finstall-module.e43c79de.png&w=3840&q=75)  
Now the module has been successfully installed.  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fmodule-installed.5f9dc0c8.png&w=3840&q=75)

---

And there you have it! You have now deployed your very own Modular Contract!
## Create Module Contract

**Prerequisite:** Read “Create Core Contract” before creating a Module.

#### Installation

* #### Install Forge from Foundry  
For assistance, refer to the [Foundry installation guide](https://book.getfoundry.sh/getting-started/installation).  
```bash  
forge init  
forge install thirdweb-dev/modular-contracts --no-commit  
```  
Add the Thirdweb modular contracts to `foundry.toml` under `remappings`:  
```toml  
remappings = ['@thirdweb-dev=lib/modular-contracts/']  
```

#### Create Module

* #### Create a New Module File  
Create a new file called `CounterModule.sol` in the `src` folder and start with the following code:  
```solidity  
//SPDX-License-Identifier: MIT  
   
pragma solidity ^0.8.20;  
   
import {Module} from "@thirdweb-dev/src/Module.sol";  
   
contract CounterModule is Module {  
    function getModuleConfig()  
        public  
        pure  
        override  
        returns (ModuleConfig memory config)  
    {}  
}  
```  
> **Note**The `Module` contract is the base contract that needs to be inherited for this contract to be recognized as a Module Contract, and we need to implement the `getModuleConfig` function to prevent the contract to be marked as abstract.
* #### Create a Storage Library  
Create a library called `CounterStorage` responsible for holding the state of the Module Contract:  
```solidity  
//SPDX-License-Identifier: MIT  
   
pragma solidity ^0.8.20;  
   
import {Module} from "@thirdweb-dev/src/Module.sol";  
   
contract CounterModule is Module {  
    function getModuleConfig()  
        public  
        pure  
        override  
        returns (ModuleConfig memory config)  
    {}  
}  
   
 // 👇👇👇👇👇👇👇👇👇  
library CounterStorage {  
    /// @custom:storage-location erc7201:token.minting.counter  
    bytes32 public constant COUNTER_STORAGE_POSITION =  
        keccak256(abi.encode(uint256(keccak256("counter")) - 1)) &  
            ~bytes32(uint256(0xff));  
   
    struct Data {  
        uint256 step;  
    }  
   
    function data() internal pure returns (Data storage data_) {  
        bytes32 position = COUNTER_STORAGE_POSITION;  
        assembly {  
            data_.slot := position  
        }  
    }  
}  
```  
> **Note**The library `CounterStorage` uses the ERC-7201: Namespace storage layout to store the data. Learn more about [ERC-7201](https://eips.ethereum.org/EIPS/eip-7201).
* #### Set Up Storage Access Function  
Set up the function `_counterStorage` to access the storage from the `CounterStorage` library:  
```solidity  
//SPDX-License-Identifier: MIT  
   
pragma solidity ^0.8.20;  
   
import {Module} from "@thirdweb-dev/src/Module.sol";  
   
contract CounterModule is Module {  
    function getModuleConfig()  
        public  
        pure  
        override  
        returns (ModuleConfig memory config)  
    {}  
   
     // 👇👇👇👇👇👇👇👇👇  
   
    function _counterStorage()  
        internal  
        pure  
        returns (CounterStorage.Data storage)  
    {  
        return CounterStorage.data();  
    }  
}  
   
library CounterStorage {  
    /// @custom:storage-location erc7201:token.minting.counter  
    bytes32 public constant COUNTER_STORAGE_POSITION =  
        keccak256(abi.encode(uint256(keccak256("counter")) - 1)) &  
            ~bytes32(uint256(0xff));  
   
    struct Data {  
        uint256 step;  
    }  
   
    fun2ction data() internal pure returns (Data storage data_) {  
        bytes32 position = COUNTER_STORAGE_POSITION;  
        assembly {  
            data_.slot := position  
        }  
    }  
}  
```
* #### Set Up Fallback Functions  
Set up fallback functions that act as the setters and getters for `step`:  
```solidity  
//SPDX-License-Identifier: MIT  
   
pragma solidity ^0.8.20;  
   
import {Module} from "@thirdweb-dev/src/Module.sol";  
   
contract CounterModule is Module {  
    function getModuleConfig()  
        public  
        pure  
        override  
        returns (ModuleConfig memory config)  
    {}  
   
    function _counterStorage()  
        internal  
        pure  
        returns (CounterStorage.Data storage)  
    {  
        return CounterStorage.data();  
    }  
   
    // 👇👇👇👇👇👇👇👇👇  
    // Fallback Functions  
    function getStep() external view returns (uint256) {  
        return _counterStorage().step;  
    }  
   
    function setStep(uint256 _step) external {  
        _counterStorage().step = _step;  
    }  
}  
   
library CounterStorage {  
    /// @custom:storage-location erc7201:token.minting.counter  
    bytes32 public constant COUNTER_STORAGE_POSITION =  
        keccak256(abi.encode(uint256(keccak256("counter")) - 1)) &  
            ~bytes32(uint256(0xff));  
   
    struct Data {  
        uint256 step;  
    }  
   
    function data() internal pure returns (Data storage data_) {  
        bytes32 position = COUNTER_STORAGE_POSITION;  
        assembly {  
            data_.slot := position  
        }  
    }  
}  
```  
> **Note**Fallback functions are extra functionalities that a core contract can use via the Solidity `fallback` function.
* #### Set Up Callback Function  
Set up a callback function `beforeIncrement` that increases the given count by `step`:  
```solidity  
//SPDX-License-Identifier: MIT  
   
pragma solidity ^0.8.20;  
   
import {Module} from "@thirdweb-dev/src/Module.sol";  
   
contract CounterModule is Module {  
    function getModuleConfig()  
        public  
        pure  
        override  
        returns (ModuleConfig memory config)  
    {}  
   
    function _counterStorage()  
        internal  
        pure  
        returns (CounterStorage.Data storage)  
    {  
        return CounterStorage.data();  
    }  
   
    // Fallback Functions  
    function getStep() external view returns (uint256) {  
        return _counterStorage().step;  
    }  
   
    function setStep(uint256 _step) external {  
        _counterStorage().step = _step;  
    }  
   
   
    // 👇👇👇👇👇👇👇👇👇  
    function beforeIncrement(uint256 count) external view returns (uint256) {  
        return count + _counterStorage().step;  
    }  
}  
   
library CounterStorage {  
    /// @custom:storage-location erc7201:token.minting.counter  
    bytes32 public constant COUNTER_STORAGE_POSITION =  
        keccak256(abi.encode(uint256(keccak256("counter")) - 1)) &  
            ~bytes32(uint256(0xff));  
   
    struct Data {  
        uint256 step;  
    }  
   
    function data() internal pure returns (Data storage data_) {  
        bytes32 position = COUNTER_STORAGE_POSITION;  
        assembly {  
            data_.slot := position  
        }  
    }  
}  
```  
> **Note**Callback functions are hook-like functionalities that can be used before or after the main functionality of a core contract. In this snippet, the `beforeIncrement` callback is used before the main increment functionality.
* #### Set Up Module Config  
Lastly, set up the `getModuleConfig` functionallity as this is the one which is responsible for communicating to the core contract:  
```solidity  
//SPDX-License-Identifier: MIT  
   
pragma solidity ^0.8.20;  
   
import {Module} from "@thirdweb-dev/src/Module.sol";  
// 👇👇👇👇👇👇👇👇👇  
import {Role} from "@thirdweb-dev/src/Role.sol";  
   
contract CounterModule is Module {  
    // 👇👇👇👇👇👇👇👇👇  
    function getModuleConfig()  
        public  
        pure  
        override  
        returns (ModuleConfig memory config)  
    {  
        // Callback Function array of one element  
        config.callbackFunctions = new CallbackFunction[](1);  
        // Fallback Function array of two elements  
        config.fallbackFunctions = new FallbackFunction[](2);  
   
        //adding the functions to the arrays  
        config.callbackFunctions[0] = CallbackFunction(  
            this.beforeIncrement.selector  
        );  
   
        config.fallbackFunctions[0] = FallbackFunction({  
            selector: this.getStep.selector,  
            permissionBits: 0  
        });  
   
        config.fallbackFunctions[1] = FallbackFunction({  
            selector: this.setStep.selector,  
            permissionBits: Role._MANAGER_ROLE  
        });  
   
        // Required interfaces for the Module  
        config.requiredInterfaces = new bytes4[](1);  
        config.requiredInterfaces[0] = 0x00000001;  
   
        // register the intallation callback  
        config.registerInstallationCallback = true;  
    }  
   
    function _counterStorage()  
        internal  
        pure  
        returns (CounterStorage.Data storage)  
    {  
        return CounterStorage.data();  
    }  
   
    // Fallback Functions  
    function getStep() external view returns (uint256) {  
        return _counterStorage().step;  
    }  
   
    function setStep(uint256 _step) external {  
        _counterStorage().step = _step;  
    }  
   
    function beforeIncrement(uint256 count) external view returns (uint256) {  
        return count + _counterStorage().step;  
    }  
}  
   
library CounterStorage {  
    /// @custom:storage-location erc7201:token.minting.counter  
    bytes32 public constant COUNTER_STORAGE_POSITION =  
        keccak256(abi.encode(uint256(keccak256("counter")) - 1)) &  
            ~bytes32(uint256(0xff));  
   
    struct Data {  
        uint256 step;  
    }  
   
    function data() internal pure returns (Data storage data_) {  
        bytes32 position = COUNTER_STORAGE_POSITION;  
        assembly {  
            data_.slot := position  
        }  
    }  
}  
```

---

In the next tutorial, learn how to deploy this modular contract and attach it to the Core contract.
## Agglayer Module Contract

We created a module which leverages Agglayer, an interoperability protocol. This module may be added to any ERC-20 modular contract to construct a cross-chain interoperable smart contract for trustless and secure transfers across any chain. [Learn more about Agglayer.](https://github.com/AggLayer)

Agglayer Module Contract

Agglayer Module Contract is open-source. View and contribute to its source code on GitHub.

[GitHubView on GitHub](https://thirdweb.com/thirdweb.eth/AgglayerCrossChain)

### Get Started

Learn how to add the Agglayer module to your modular contract and enable cross-chain transfers.

#### Prerequisites

* [Deployed ERC-20 Base Contract](https://portal.thirdweb.com/contracts/modular-contracts/tutorials/deploy-erc20-core)

* #### Add Agglayer module  
On your deployed contract dashboard, navigate to the Modules section to add the Agglayer module. Paste the following parameters then select Install.  
   * Publisher: `0xdd99b75f095d0c4d5112aCe938e4e6ed962fb024`  
   * Module Name: `AgglayerCrossChain`  
   * Module Version: `Latest`  
   * Router: `0x2311BFA86Ae27FC10E1ad3f805A2F9d22Fc8a6a1`  
![Agglayer Module](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fagglayer-module.38a482fe.png&w=3840&q=75)  
When completed, you will see your module under the installed modules section.
* #### Grant minter role  
Next, navigate to the Explorer tab and locate grantRoles under the Write functions to grant your wallet the minter role then select Execute.  
   * User: `your-wallet-address`  
   * Roles: `1`  
   * Native Token Value: `0`  
![Grant Minter Role](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fgrant-minter.1ea1c263.png&w=3840&q=75)  
#### Modular Contract Roles  
Non-admin roles are disabled by default on modular contracts and must be enabled through the contract.
* #### Mint tokens  
Navigate back to the modules section and mint tokens to your wallet or a recipient's wallet using the mintable module.  
![Mint Tokens](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fmint-tokens.9f7312c4.png&w=3840&q=75)
* #### Approve transfers on contract  
Navigate back to Explorer and find the Approve write function. Paste in the following parameters and select Execute.  
   * Spender: `your-contract-address`  
   * Amount: `your-desired-amount`  
![Approve Function](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fapprove-function.1a59e9f9.png&w=3840&q=75)  
#### Modular Contract Approvals  
This step enables the contract to have approval to transfer user's tokens to the bridge.
* #### Approve transfers on module  
Navigate back to the modules view and disable Restrict Transfers on the TransferableERC20 module to allow any token holders to transfer tokens. Select Update to confirm.  
![Restrict Transfer](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Frestrict-transfers.35a2fbc5.png&w=3840&q=75)
* #### Bridge tokens  
Navigate back to Explorer and locate the `bridgeTokens` function. Select Execute to confirm the transaction.  
   * Destination Network: `chain-to-send`  
   * Call Address: `your-wallet-address`  
   * Amount: `amount-of-tokens`
## Modular Contracts

**Modular Contracts** are contracts for which you can add, remove, or upgrade the exact parts you want.

### Getting started

To get started, install the `modular-contracts` package in your existing Solidity project:

Forge

```bash
forge install https://github.com/thirdweb-dev/modular-contracts
```

A modular contract is made up of \[1\] a **Core** and \[2\] **Module** contracts. Learn more about these, below.

Follow this [end-to-end guide](https://blog.thirdweb.com/p/d45e40f7-e8f3-4bcd-be6b-f800beff963f/)to learn how to write, deploy and use your own custom modular contract.

### Background

A modular contract is made up of two kinds of contracts:

* **Core** contract: the foundational API that can be customized by installing Modules.
* **Module** contract: implements a set of functionality that is enabled on a Core when it is installed.

As an analogy, think of the robot, below. The torso is the _Core_ to which you attach/detach _Modules_.

The torso has a particular shape and exposes sockets at fixed places -- all of which determine how modules will be attached to it. Similarly, a Core smart contract has a fixed API that determines what Modules are compatible for installation.

The _Modules_ themselves e.g. a leg, arm, head, etc. give the robot (i.e. the modular contract as a whole) its various capabilities.

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fmodular-contracts-analogy.7dc42067.png&w=3840&q=75)

Installing a Module in a Core customizes the Core’s behaviour in two ways:

* New functions become callable on the Core contract (via its [fallback function](https://docs.soliditylang.org/en/v0.8.26/contracts.html#fallback-function)).
* Core contract’s fixed functions make callback function calls into the Module.

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fmodular-contracts-flow.c8523b89.png&w=3840&q=75)

You can read about the full technical design details of Modular Contracts in its [design document](https://portal.thirdweb.com/contracts/design-docs/modular-contracts).
## OpenEditionMetadataERC1155

### Description

The `OpenEditionMetadataERC1155` contract is a module that provides metadata management for Open Edition ERC-1155 tokens. This module builds upon the functionalities of the `OpenEditionMetadataERC721` contract, adapting them for the ERC-1155 standard.

[GitHubView on GitHub](https://github.com/thirdweb-dev/modular-contracts/blob/dev/src/module/token/metadata/OpenEditionMetadataERC1155.sol) 

### Callback Functions

| Function   | Description                                                       |
| ---------- | ----------------------------------------------------------------- |
| onTokenURI | Callback function that returns the token URI for ERC-1155 tokens. |

### Fallback Functions

| Function          | Description                                                                       |
| ----------------- | --------------------------------------------------------------------------------- |
| setSharedMetadata | Sets the shared metadata for the ERC-1155 token collection. Requires minter role. |

### Required Interfaces

| Interface | ID         |
| --------- | ---------- |
| ERC-1155  | 0xd9b67a26 |

### Supported Interfaces

| Interface | ID         |
| --------- | ---------- |
| ERC4906   | 0x49064906 |
## BatchMetadataERC1155

### Description

The `BatchMetadataERC1155` contract is a module that provides batch metadata management for ERC-1155 tokens. This module builds upon the functionalities of the `BatchMetadataERC721` contract, adapting them for the ERC-1155 standard. It includes functionalities for updating and managing metadata in batches efficiently.

[GitHubView on GitHub](https://github.com/thirdweb-dev/modular-contracts/blob/dev/src/module/token/metadata/BatchMetadataERC1155.sol) 

### Callback Functions

| Function              | Description                                                             |
| --------------------- | ----------------------------------------------------------------------- |
| onTokenURI            | Callback function that returns the token URI for ERC-1155 tokens.       |
| updateMetadataERC1155 | Callback function that updates metadata for a batch of ERC-1155 tokens. |

### Fallback Functions

| Function              | Description                                                      |
| --------------------- | ---------------------------------------------------------------- |
| uploadMetadata        | Allows uploading of metadata. Requires minter role.              |
| setBaseURI            | Sets the base URI for the token metadata. Requires manager role. |
| getAllMetadataBatches | Retrieves all metadata batches uploaded so far.                  |
| nextTokenIdToMint     | Returns the next token ID to be minted.                          |
| getBatchId            | Returns the batch ID for a specific token ID.                    |
| getBatchRange         | Returns the range of token IDs for a specific metadata batch.    |

### Required Interfaces

| Interface | ID         |
| --------- | ---------- |
| ERC-1155  | 0xd9b67a26 |

### Supported Interfaces

| Interface | ID         |
| --------- | ---------- |
| ERC4906   | 0x49064906 |
## Simple Metadata ERC-1155

### Description

The `SimpleMetadataERC1155` contract is a module that provides simple metadata functionality for ERC-1155 tokens. It inherits from `SimpleMetadataERC721` to leverage the metadata management capabilities and adapt them for ERC-1155 tokens, allowing for easy setting and retrieval of token URIs.

### Callback Functions

| Function   | Description                                                             |
| ---------- | ----------------------------------------------------------------------- |
| onTokenURI | Callback function for retrieving the metadata URI for a given token ID. |

### Fallback Functions

| Function    | Description                                                 |
| ----------- | ----------------------------------------------------------- |
| setTokenURI | Sets the token URI for a given token. Requires minter role. |

### Required Interfaces

| Interface | ID         |
| --------- | ---------- |
| ERC-1155  | 0xd9b67a26 |

### Supported Interfaces

| Interface | ID         |
| --------- | ---------- |
| ERC-4906  | 0x49064906 |
## ClaimableERC1155

### Description

The `ClaimableERC1155` contract is a module that provides claim-based minting functionality for ERC-1155 tokens. It includes features for setting claim conditions, validating claims via Merkle proofs, and handling signature-based claim requests. This contract ensures secure and controlled minting processes with the possibility of integrating primary sales.

[GitHubView on GitHub](https://github.com/thirdweb-dev/modular-contracts/blob/dev/src/module/token/minting/ClaimableERC1155.sol) 

### Callback Functions

| Function                       | Description                                                                                          |
| ------------------------------ | ---------------------------------------------------------------------------------------------------- |
| beforeMintERC1155              | Callback function that checks the claim conditions before minting ERC-1155 tokens.                   |
| beforeMintWithSignatureERC1155 | Callback function that verifies a claim request with a signature and processes the mint accordingly. |

### Fallback Functions

| Function                   | Description                                                                                           |
| -------------------------- | ----------------------------------------------------------------------------------------------------- |
| getSaleConfig              | Returns the sale configuration for a token, including the primary sale recipient.                     |
| setSaleConfig              | Sets the sale configuration for a token, including the primary sale recipient. Requires manager role. |
| getClaimConditionByTokenId | Returns the claim condition for a specific token ID.                                                  |
| setClaimConditionByTokenId | Sets the claim condition for a specific token ID. Requires minter role.                               |

### Required Interfaces

| Interface | ID         |
| --------- | ---------- |
| ERC-1155  | 0xd9b67a26 |

### Installation Callback

This module uses an installation callback to set up the initial parameters such as the primary sale recipient.
## MintableERC1155

### Description

The `MintableERC1155` contract is a module that provides minting functionalities for ERC-1155 tokens. This module includes features such as minting with and without signatures, and configuration for primary sales recipients.

[GitHubView on GitHub](https://github.com/thirdweb-dev/modular-contracts/blob/dev/src/module/token/minting/MintableERC1155.sol) 

### Callback Functions

| Function                       | Description                                                                                            |
| ------------------------------ | ------------------------------------------------------------------------------------------------------ |
| beforeMintERC1155              | Callback function that checks the mint authorization before minting ERC-1155 tokens.                   |
| beforeMintWithSignatureERC1155 | Callback function that verifies a minting request with a signature and processes the mint accordingly. |

### Fallback Functions

| Function      | Description                                                                                           |
| ------------- | ----------------------------------------------------------------------------------------------------- |
| getSaleConfig | Returns the sale configuration for a token, including the primary sale recipient.                     |
| setSaleConfig | Sets the sale configuration for a token, including the primary sale recipient. Requires manager role. |

### Required Interfaces

| Interface | ID         |
| --------- | ---------- |
| ERC-1155  | 0xd9b67a26 |

### Installation Callback

This module uses an installation callback to set up the initial parameters such as the primary sale recipient.
## SequentialTokenIdERC1155

### Description

The `SequentialTokenIdERC1155` contract is a module that provides sequential token ID generation for ERC-1155 tokens. This module ensures that each new token minted receives a unique, incrementing ID, preventing ID collisions and simplifying the token minting process.

[GitHubView on GitHub](https://github.com/thirdweb-dev/modular-contracts/blob/dev/src/module/token/tokenId/SequentialTokenIdERC1155.sol) 

### Callback Functions

| Function             | Description                                                                                                                                                  |
| -------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| updateTokenIdERC1155 | Callback function to update the token ID for ERC-1155 tokens. Generates a sequential token ID if the provided ID is max value and returns the next token ID. |

### Fallback Functions

| Function       | Description                                       |
| -------------- | ------------------------------------------------- |
| getNextTokenId | Returns the next token ID to be used for minting. |

### Required Interfaces

| Interface | ID         |
| --------- | ---------- |
| ERC-1155  | 0xd9b67a26 |

### Supported Interfaces

(No supported interfaces for this contract)
## Transferable ERC-1155

### Description

The `TransferableERC1155` contract is a module that provides transfer control functionality for ERC-1155 tokens. This contract allows enabling or disabling token transfers globally or for specific addresses, adding an extra layer of control over how tokens can be moved.

[GitHubView on GitHub](https://github.com/thirdweb-dev/modular-contracts/blob/dev/src/module/token/transferable/TransferableERC1155.sol) 

### Callback Functions

| Function                   | Description                                                                                                         |
| -------------------------- | ------------------------------------------------------------------------------------------------------------------- |
| beforeTransferERC1155      | Callback function for ERC1155.safeTransferFrom. Ensures that transfers are enabled before allowing them.            |
| beforeBatchTransferERC1155 | Callback function for ERC1155.safeBatchTransferFrom. Ensures that batch transfers are enabled before allowing them. |

### Fallback Functions

| Function             | Description                                                                    |
| -------------------- | ------------------------------------------------------------------------------ |
| isTransferEnabled    | Returns whether transfers are enabled globally for the token.                  |
| isTransferEnabledFor | Returns whether transfers are enabled for a specific address.                  |
| setTransferable      | Sets the transferability status for the token globally. Requires manager role. |
| setTransferableFor   | Sets the transferability status for a specific address. Requires manager role. |

### Required Interfaces

| Interface | ID         |
| --------- | ---------- |
| ERC-1155  | 0xd9b67a26 |

### Supported Interfaces

(No supported interfaces for this contract)
## RoyaltyERC1155

### Description

The `RoyaltyERC1155` contract is a module that integrates royalty management and validation functionalities for ERC-1155 token transfers. This module ensures that royalties are appropriately handled during token transfers, and allows for the validation of these transfers through a customizable transfer validator.

[GitHubView on GitHub](https://github.com/thirdweb-dev/modular-contracts/blob/dev/src/module/token/transferable/TransferableERC1155.sol) 

### Callback Functions

| Function                   | Description                                                                                                                              |
| -------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------- |
| beforeTransferERC1155      | Callback function for the ERC1155.transferFrom and ERC1155.safeTransferFrom functions. Validates the transfer via the transferValidator. |
| beforeBatchTransferERC1155 | Callback function for batch transfers of ERC-1155 tokens. Validates each transfer in the batch via the transferValidator.                |

### Fallback Functions

| Function                      | Description                                                                                     |
| ----------------------------- | ----------------------------------------------------------------------------------------------- |
| royaltyInfo                   | Returns the royalty recipient and amount for a given sale.                                      |
| getDefaultRoyaltyInfo         | Returns the default royalty info (recipient and BPS) for the token contract.                    |
| getRoyaltyInfoForToken        | Returns the royalty info (recipient and BPS) for a specific token.                              |
| getTransferValidator          | Returns the transfer validator contract address for this token contract.                        |
| getTransferValidationFunction | Returns the function selector and view status for the transfer validator's validation function. |
| hasRole                       | Checks if the given account has the specified role.                                             |
| setDefaultRoyaltyInfo         | Sets the default royalty info (recipient and BPS). Requires manager role.                       |
| setRoyaltyInfoForToken        | Sets the royalty info (recipient and BPS) for a specific token. Requires manager role.          |
| setTransferValidator          | Sets the transfer validator contract address. Requires manager role.                            |

### Required Interfaces

| Interface | ID         |
| --------- | ---------- |
| ERC-1155  | 0xd9b67a26 |

### Supported Interfaces

| Interface           | ID         |
| ------------------- | ---------- |
| IERC2981            | 0x2a55205a |
| ICreatorToken       | 0xad0d7f6c |
| ICreatorTokenLegacy | 0xa07d229a |

### Installation Callback

This module uses an installation callback to set up initial parameters such as the default royalty information and the transfer validator contract.
## ClaimableERC20

### Description

The `ClaimableERC20` contract is a module that provides claim-based minting functionality for ERC-20 tokens. It includes features for setting claim conditions, validating claims via Merkle proofs, and handling signature-based claim requests. This contract ensures secure and controlled minting processes with the possibility of integrating primary sales.

[GitHubView on GitHub](https://github.com/thirdweb-dev/modular-contracts/blob/dev/src/module/token/minting/ClaimableERC20.sol) 

### Callback Functions

| Function                     | Description                                                                                          |
| ---------------------------- | ---------------------------------------------------------------------------------------------------- |
| beforeMintERC20              | Callback function that checks the claim conditions before minting ERC-20 tokens.                     |
| beforeMintWithSignatureERC20 | Callback function that verifies a claim request with a signature and processes the mint accordingly. |

### Fallback Functions

| Function          | Description                                                                                           |
| ----------------- | ----------------------------------------------------------------------------------------------------- |
| getSaleConfig     | Returns the sale configuration for a token, including the primary sale recipient.                     |
| setSaleConfig     | Sets the sale configuration for a token, including the primary sale recipient. Requires manager role. |
| getClaimCondition | Returns the claim condition for a specific token ID.                                                  |
| setClaimCondition | Sets the claim condition for a specific token ID. Requires minter role.                               |

### Required Interfaces

| Interface | ID         |
| --------- | ---------- |
| ERC-20    | 0x36372b07 |

### Installation Callback

This module uses an installation callback to set up the initial parameters such as the primary sale recipient.
## MintableERC20

### Description

The `MintableERC20` contract is a module that provides minting functionalities for ERC-20 tokens. This module includes features such as minting with and without signatures, and configuration for primary sales recipients.

[GitHubView on GitHub](https://github.com/thirdweb-dev/modular-contracts/blob/dev/src/module/token/minting/MintableERC20.sol) 

### Callback Functions

| Function                     | Description                                                                                            |
| ---------------------------- | ------------------------------------------------------------------------------------------------------ |
| beforeMintERC20              | Callback function that checks the mint authorization before minting ERC-20 tokens.                     |
| beforeMintWithSignatureERC20 | Callback function that verifies a minting request with a signature and processes the mint accordingly. |

### Fallback Functions

| Function      | Description                                                                                           |
| ------------- | ----------------------------------------------------------------------------------------------------- |
| getSaleConfig | Returns the sale configuration for a token, including the primary sale recipient.                     |
| setSaleConfig | Sets the sale configuration for a token, including the primary sale recipient. Requires manager role. |

### Required Interfaces

| Interface | ID         |
| --------- | ---------- |
| ERC-20    | 0x36372b07 |

### Installation Callback

This module uses an installation callback to set up the initial parameters such as the primary sale recipient.
## Transferable ERC-20

### Description

The `TransferableERC20` contract is a module that provides transfer control functionality for ERC-20 tokens. This contract allows enabling or disabling token transfers globally or for specific addresses, adding an extra layer of control over how tokens can be moved.

[GitHubView on GitHub](https://github.com/thirdweb-dev/modular-contracts/blob/dev/src/module/token/transferable/TransferableERC20.sol) 

### Callback Functions

| Function            | Description                                                                                    |
| ------------------- | ---------------------------------------------------------------------------------------------- |
| beforeTransferERC20 | Callback function for ERC20.transfer. Ensures that transfers are enabled before allowing them. |

### Fallback Functions

| Function             | Description                                                                    |
| -------------------- | ------------------------------------------------------------------------------ |
| isTransferEnabled    | Returns whether transfers are enabled globally for the token.                  |
| isTransferEnabledFor | Returns whether transfers are enabled for a specific address.                  |
| setTransferable      | Sets the transferability status for the token globally. Requires manager role. |
| setTransferableFor   | Sets the transferability status for a specific address. Requires manager role. |

### Required Interfaces

(No required interfaces for this contract)

### Supported Interfaces

(No supported interfaces for this contract)
## BatchMetadataERC721

### Description

The `BatchMetadataERC721` contract is a module that provides batch metadata management for ERC-721 tokens. It includes functionalities for uploading, updating, and retrieving metadata in batches efficiently. This contract helps manage metadata for large collections of tokens by organizing them in batches.

[GitHubView on GitHub](https://github.com/thirdweb-dev/modular-contracts/blob/dev/src/module/token/metadata/BatchMetadataERC721.sol) 

### Callback Functions

| Function             | Description                                                            |
| -------------------- | ---------------------------------------------------------------------- |
| onTokenURI           | Callback function that returns the token URI for ERC-721 tokens.       |
| updateMetadataERC721 | Callback function that updates metadata for a batch of ERC-721 tokens. |

### Fallback Functions

| Function              | Description                                                      |
| --------------------- | ---------------------------------------------------------------- |
| uploadMetadata        | Allows uploading of metadata. Requires minter role.              |
| setBaseURI            | Sets the base URI for the token metadata. Requires manager role. |
| getAllMetadataBatches | Retrieves all metadata batches uploaded so far.                  |
| nextTokenIdToMint     | Returns the next token ID to be minted.                          |
| getBatchId            | Returns the batch ID for a specific token ID.                    |
| getBatchRange         | Returns the range of token IDs for a specific metadata batch.    |

### Required Interfaces

| Interface | ID         |
| --------- | ---------- |
| ERC-721   | 0x80ac58cd |

### Supported Interfaces

| Interface | ID         |
| --------- | ---------- |
| ERC4906   | 0x49064906 |
## CreatorTokenERC20

### Description

The `CreatorTokenERC20` contract is a module that builds upon the ERC-20 standard to offer additional functionality tailored for token creators. This module includes features such as transfer validation to ensure only approved transfers are processed, adding a layer of control and security for token transfers.

[GitHubView on GitHub](https://github.com/thirdweb-dev/modular-contracts/blob/dev/src/module/token/transferable/CreatorTokenERC20.sol) 

### Callback Functions

| Function            | Description                                                                                                                                                                            |
| ------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| beforeTransferERC20 | Callback function for the ERC20.transferFrom and ERC20.safeTransferFrom functions. Executes actions before token transfers, including validation of the transfer by transferValidator. |

### Fallback Functions

| Function                      | Description                                                                                     |
| ----------------------------- | ----------------------------------------------------------------------------------------------- |
| getTransferValidator          | Returns the transfer validator contract address for this token contract.                        |
| getTransferValidationFunction | Returns the function selector and view status for the transfer validator's validation function. |
| setTransferValidator          | Sets the address of the transferValidator. Requires admin role.                                 |

### Required Interfaces

(No required interfaces for this contract)
## OpenEditionMetadataERC721

### Description

The `OpenEditionMetadataERC721` contract is a module that provides metadata management for Open Edition ERC-721 tokens. It includes functionalities for setting and retrieving shared metadata for tokens, making metadata management simple and efficient.

[GitHubView on GitHub](https://github.com/thirdweb-dev/modular-contracts/blob/dev/src/module/token/metadata/OpenEditionMetadataERC721.sol) 

### Callback Functions

| Function   | Description                                                      |
| ---------- | ---------------------------------------------------------------- |
| onTokenURI | Callback function that returns the token URI for ERC-721 tokens. |

### Fallback Functions

| Function          | Description                                                                      |
| ----------------- | -------------------------------------------------------------------------------- |
| setSharedMetadata | Sets the shared metadata for the ERC-721 token collection. Requires minter role. |

### Required Interfaces

| Interface | ID         |
| --------- | ---------- |
| ERC-721   | 0x80ac58cd |

### Supported Interfaces

| Interface | ID         |
| --------- | ---------- |
| ERC4906   | 0x49064906 |
## Simple Metadata ERC-721

### Description

The `SimpleMetadataERC721` contract is a module that provides simple metadata functionality for ERC-721 tokens. It allows for easy setting and retrieval of token URIs, making it straightforward to manage metadata for individual tokens.

### Callback Functions

| Function   | Description                                                             |
| ---------- | ----------------------------------------------------------------------- |
| onTokenURI | Callback function for retrieving the metadata URI for a given token ID. |

### Fallback Functions

| Function    | Description                                                 |
| ----------- | ----------------------------------------------------------- |
| setTokenURI | Sets the token URI for a given token. Requires minter role. |

### Required Interfaces

| Interface | ID         |
| --------- | ---------- |
| ERC-721   | 0x80ac58cd |

### Supported Interfaces

| Interface | ID         |
| --------- | ---------- |
| ERC-4906  | 0x49064906 |
## Delayed Reveal Batch Metadata ERC-721

### Description

The `DelayedRevealBatchMetadataERC721` contract is a module that provides functionality for delayed reveal of metadata for ERC-721 tokens. It enables the uploading of metadata for ranges of token IDs with optional encryption, allowing tokens to be revealed at a later time with a decryption key. This is useful for scenarios where the token metadata needs to be kept secret until a specified time.

### Callback Functions

| Function   | Description                                                                                                                                              |
| ---------- | -------------------------------------------------------------------------------------------------------------------------------------------------------- |
| onTokenURI | Callback function for ERC721Metadata.tokenURI. Returns the metadata URI for a given tokenId. If the metadata is encrypted, it returns a placeholder URI. |

### Fallback Functions

| Function              | Description                                                                                                                                                          |
| --------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| getAllMetadataBatches | Returns all metadata batches for a token. Each batch contains a range of token IDs, their associated base URI, and any encrypted data.                               |
| uploadMetadata        | Uploads metadata for a range of token IDs. Emits a NewMetadataBatch event and a BatchMetadataUpdate event. Optionally includes encrypted data and a provenance hash. |
| reveal                | Reveals the URI for a range of 'delayed-reveal' tokens using a provided decryption key. Emits a TokenURIRevealed event and a BatchMetadataUpdate event.              |

### Required Interfaces

| Interface | ID         |
| --------- | ---------- |
| ERC-721   | 0x80ac58cd |

### Supported Interfaces

| Interface | ID         |
| --------- | ---------- |
| ERC-4906  | 0x49064906 |
## MintableERC721

### Description

The `MintableERC721` contract is a module that provides minting functionalities for ERC-721 tokens. This module includes features such as minting with and without signatures, and configuration for primary sales recipients.

[GitHubView on GitHub](https://github.com/thirdweb-dev/modular-contracts/blob/dev/src/module/token/minting/MintableERC721.sol) 

### Callback Functions

| Function                      | Description                                                                                            |
| ----------------------------- | ------------------------------------------------------------------------------------------------------ |
| beforeMintERC721              | Callback function that checks the mint authorization before minting ERC-721 tokens.                    |
| beforeMintWithSignatureERC721 | Callback function that verifies a minting request with a signature and processes the mint accordingly. |

### Fallback Functions

| Function      | Description                                                                                           |
| ------------- | ----------------------------------------------------------------------------------------------------- |
| getSaleConfig | Returns the sale configuration for a token, including the primary sale recipient.                     |
| setSaleConfig | Sets the sale configuration for a token, including the primary sale recipient. Requires manager role. |

### Required Interfaces

| Interface | ID         |
| --------- | ---------- |
| ERC-721   | 0x80ac58cd |

### Installation Callback

This module uses an installation callback to set up the initial parameters such as the primary sale recipient.
## ClaimableERC721

### Description

The `ClaimableERC721` contract is a module that provides claim-based minting functionality for ERC-721 tokens. It includes features for setting claim conditions, validating claims via Merkle proofs, and handling signature-based claim requests. This contract ensures secure and controlled minting processes with the possibility of integrating primary sales.

[GitHubView on GitHub](https://github.com/thirdweb-dev/modular-contracts/blob/dev/src/module/token/minting/ClaimableERC721.sol) 

### Callback Functions

| Function                      | Description                                                                                          |
| ----------------------------- | ---------------------------------------------------------------------------------------------------- |
| beforeMintERC721              | Callback function that checks the claim conditions before minting ERC-721 tokens.                    |
| beforeMintWithSignatureERC721 | Callback function that verifies a claim request with a signature and processes the mint accordingly. |

### Fallback Functions

| Function          | Description                                                                                           |
| ----------------- | ----------------------------------------------------------------------------------------------------- |
| getSaleConfig     | Returns the sale configuration for a token, including the primary sale recipient.                     |
| setSaleConfig     | Sets the sale configuration for a token, including the primary sale recipient. Requires manager role. |
| getClaimCondition | Returns the claim condition for a specific token ID.                                                  |
| setClaimCondition | Sets the claim condition for a specific token ID. Requires minter role.                               |

### Required Interfaces

| Interface | ID         |
| --------- | ---------- |
| ERC-721   | 0x80ac58cd |

### Installation Callback

This module uses an installation callback to set up the initial parameters such as the primary sale recipient.
## RoyaltyERC721

### Description

The `RoyaltyERC721` contract is a module that integrates royalty management and validation functionalities for ERC-721 token transfers. This module ensures that royalties are appropriately handled during token transfers, and allows for the validation of these transfers through a customizable transfer validator.

[GitHubView on GitHub](https://github.com/thirdweb-dev/modular-contracts/blob/dev/src/module/token/royalty/RoyaltyERC721.sol) 

### Callback Functions

| Function             | Description                                                                                                                            |
| -------------------- | -------------------------------------------------------------------------------------------------------------------------------------- |
| beforeTransferERC721 | Callback function for the ERC721.transferFrom and ERC721.safeTransferFrom functions. Validates the transfer via the transferValidator. |

### Fallback Functions

| Function                      | Description                                                                                     |
| ----------------------------- | ----------------------------------------------------------------------------------------------- |
| royaltyInfo                   | Returns the royalty recipient and amount for a given sale.                                      |
| getDefaultRoyaltyInfo         | Returns the default royalty info (recipient and BPS) for the token contract.                    |
| getRoyaltyInfoForToken        | Returns the royalty info (recipient and BPS) for a specific token.                              |
| getTransferValidator          | Returns the transfer validator contract address for this token contract.                        |
| getTransferValidationFunction | Returns the function selector and view status for the transfer validator's validation function. |
| hasRole                       | Checks if the given account has the specified role.                                             |
| setDefaultRoyaltyInfo         | Sets the default royalty info (recipient and BPS). Requires manager role.                       |
| setRoyaltyInfoForToken        | Sets the royalty info (recipient and BPS) for a specific token. Requires manager role.          |
| setTransferValidator          | Sets the transfer validator contract address. Requires manager role.                            |

### Required Interfaces

| Interface | ID         |
| --------- | ---------- |
| ERC-721   | 0x80ac58cd |

### Supported Interfaces

| Interface           | ID         |
| ------------------- | ---------- |
| IERC2981            | 0x2a55205a |
| ICreatorToken       | 0xad0d7f6c |
| ICreatorTokenLegacy | 0xa07d229a |

### Installation Callback

This module uses an installation callback to set up initial parameters such as the default royalty information and the transfer validator contract.
## What are Modular Contracts?

Modular contracts is a framework that enables the creation of highly customizable and upgradeable smart contracts. Modular contracts is designed to encompass a broad number of use cases without compromising on the ease and security of creating smart contracts with thirdweb.

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Foverview-image.92535d7a.png&w=3840&q=75)

Modular contracts are composed of two components:

* **Core Contract**: smart contracts that serve as the foundation of the modular contract
* **Module Contract**: smart contracts that are installed on top of the core contract

You can think of Modular Contracts like building bricks. Pick a core, install modules, and swap them out to enable different functionality.

##### Features

##### Customizable

Build contracts to only add features relevant to your use case

##### Upgradeable

Enable ability to add, configure, and remove modules post-deployment

##### Secure

Core & Module contracts published by thirdweb are audited

##### Interoperable

Usable with frameworks such as Hardhat and Foundry

##### Gas-optimized

Increased gas-savings on deployment and for end-users

##### Integration Options

Deploy through Explore, SDKs, or Contract Wizard (coming soon)

#### Templates

[Extension Starter Template](https://github.com/thirdweb-example/modular-contract-starter)
## Transferable ERC-721

### Description

The `TransferableERC721` contract is a module that provides transfer control functionality for ERC-721 tokens. This contract allows enabling or disabling token transfers globally or for specific addresses, adding an extra layer of control over how tokens can be moved.

[GitHubView on GitHub](https://github.com/thirdweb-dev/modular-contracts/blob/dev/src/module/token/transferable/TransferableERC721.sol) 

### Callback Functions

| Function             | Description                                                                                                          |
| -------------------- | -------------------------------------------------------------------------------------------------------------------- |
| beforeTransferERC721 | Callback function for ERC721.transferFrom/safeTransferFrom. Ensures that transfers are enabled before allowing them. |

### Fallback Functions

| Function             | Description                                                                    |
| -------------------- | ------------------------------------------------------------------------------ |
| isTransferEnabled    | Returns whether transfers are enabled globally for the token.                  |
| isTransferEnabledFor | Returns whether transfers are enabled for a specific address.                  |
| setTransferable      | Sets the transferability status for the token globally. Requires manager role. |
| setTransferableFor   | Sets the transferability status for a specific address. Requires manager role. |

### Required Interfaces

| Interface | ID         |
| --------- | ---------- |
| ERC-721   | 0x80ac58cd |

### Supported Interfaces

(No supported interfaces for this contract)
## Deploy ERC-20 Core Contract

Learn how to deploy an ERC-20 Core Contract. This contract serves as the foundation for creating a modular contract with additional features and functionalities.

* #### Navigate to Explore  
Navigate to the Explore section of your dashboard. This is where you can find and deploy various contracts.  
![Modular Contracts](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fmodular-contracts.619c2cd8.png&w=3840&q=75)
* #### Select ERC-20 Core  
Select the ERC-20 Core contract from the list of available contracts. This contract will serve as the base for your modular contract.  
![ERC-20 Base](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Ferc-20-base.584a91cc.png&w=3840&q=75)
* #### Contract Metadata  
Fill out the contract metadata and parameters to your desired preference.  
![Contract Metadata](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcontract-metadata.7b31250a.png&w=3840&q=75)
* #### Deploy Contract  
Optionally, you may add your contract to an existing project. Select a chain then select Deploy Now.
* #### Manage Contract  
Once deployed, select View Contract to be redirected to your contract’s management dashboard.  
![Deployed Contract](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fdeployed-contract.94cad4ef.png&w=3840&q=75)
## Publish Options

The deployment options you choose will determine how _users_ deploy your contract.

### 1\. Direct deploy

Publishing with the direct deploy option allows users to deploy a copy of your contract, including the logic and storage. Choose this option if your contract does not follow the upgradeable contract pattern.

#### Requirements

There are no requirements. Any contract can be published with this deployment option.

### 2\. Deploy via Factory

Choose this option if you would like users to deploy proxies of your implementation contract using the thirdweb default factory contract or using your own pre-deployed custom factory.

#### Deploy via Factory

To use the "Deploy via Factory" option, you should be publishing your implementation contract rather than a factory.

#### 2(a). Default Factory

Publishing your contract using the [thirdweb default factory](https://github.com/thirdweb-dev/contracts/blob/main/contracts/infra/TWStatelessFactory.sol) allows users to deploy a proxy contract.

* Allows users to deploy to **any EVM compatible network**.
* Users will deploy an [EIP-1167](https://eips.ethereum.org/EIPS/eip-1167) minimal proxy contract, containing the state, which will refer to your implementation contract for the logic. This makes the deployment cheaper for your users.
* The [thirdweb default factory](https://github.com/thirdweb-dev/contracts/blob/main/contracts/infra/TWStatelessFactory.sol) is open-source, permissionless, and does not alter contract ownership - contract deployers have 100% ownership.

##### Requirements

* Your contract needs to implement the [upgradeable pattern](https://docs.openzeppelin.com/upgrades-plugins/1.x/writing-upgradeable), meaning it has an "initialize" function to set the storage, instead of a constructor.

##### Usage

* Choose your "initialize" function - in most cases, this will be `initialize` but can be any function on your contract.
* Select which networks you would like to publish to. This way, you can limit which networks your users can deploy to.
* Click "Next" and fill in the ["Contract Parameters"](https://portal.thirdweb.com/contracts/publish/publish-contract#customize-contract-parameters) form.

#### 2(b). Custom Factory

Publishing your contract using a custom factory allows users to deploy a proxy contract using your own pre-deployed custom factory. This allows you to add custom logic to the function which is invoked when a user deploys a contract.

##### Requirements

* Be publishing your implementation contract rather than a factory.
* Have a custom factory contract pre-deployed to all networks you are publishing to.

##### Usage

* Enter the address(s) of your custom factory contract on each network you would like users to be able to deploy to.
* Choose your "factory function" - this will be the function that will be called when deploying a user's contract.
* Click "Next" and fill in the ["Contract Parameters"](https://portal.thirdweb.com/contracts/publish/publish-contract#customize-contract-parameters) form.

### Not sure which option to choose?

| Deployment option                                                                                           | Description                                                                                                          | Main use case                                                                                                                           | Requirements                                                                                                          | Can my contract be deployed to any EVM?                       | Can your contract be featured on Explore? |
| ----------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------- | ----------------------------------------- |
| [Direct Deploy](https://portal.thirdweb.com/contracts/publish/publish-options#direct-deploy)                | Users can deploy a copy of your contract, including the logic and storage.                                           | Smart contract developers using publish to share their smart contract and are not expecting their contract to get lots of deploys       | No requirements.                                                                                                      | Yes.                                                          | No.                                       |
| [Deploy via Default Factory](https://portal.thirdweb.com/contracts/publish/publish-options#default-factory) | Users can deploy proxies of your implementation contract, containing the storage, using the thirdweb default factory | Protocols that want their contract to be deployable to all networks and want to gas-optimize the deploys                                | Must be written in the [upgradeable pattern](https://docs.openzeppelin.com/upgrades-plugins/1.x/writing-upgradeable). | Yes.                                                          | Yes.                                      |
| [Deploy via Custom Factory](https://portal.thirdweb.com/contracts/publish/publish-options#custom-factory)   | Use your own pre-deployed factory contract to deploy proxies for your users.                                         | Protocols that want to use a custom factory to create proxies for their users & the ability to add custom logic to the create function. | Must have pre-deployed a custom factory on each chain you would like users to be able to deploy to.                   | Deployable to all networks the custom factory is deployed to. | Yes.                                      |
## Publish

Publish allows developers to share their contract for others to deploy. Publishing a contract allows it to be shareable, verifiable, and deployable by other users.

To publish a contract, run the following at the root of your directory:

```bash
npx thirdweb publish
```

#### Features

* **Deployable to any EVM network:** Contracts published using the default factory pattern are deployable to any EVM network.
* **Unlocked functionality:** Deploying published contracts unlocks auto-generated SDKs and a dashboard to easily build applications.
* **Free to publish:** thirdweb covers all gas costs associated with publishing your contract
* **Auto-generated landing page:** Receive an automatically generated shareable landing page to allow others to explore contract source code, functions, events, code snippets, and more.
* **Featured on Explore:** Some selected contracts are featured on Explore available to the broader community. [Inquire about publishing your contract to Explore.](https://thirdweb.com/contact-us)
## What are Contracts?

Contracts is an end-to-end development suite which provides tools to develop, deploy, and manage smart contracts.

Contracts

Contracts is open-source. View and contribute to its source code on GitHub.

[GitHubView on GitHub](https://github.com/thirdweb-dev/contracts)

#### With Contracts, you can:

* Easily deploy custom or pre-built contracts to [any EVM network](https://thirdweb.com/chainlist)
* Create and publish contracts for your team or community to utilize with an easy-to-deploy interface
* Create reusable contract components or modules to add to modular contracts to upgrade functionality
* Manage contract functionality, upload NFTs, set distribution mechanisms, and more directly from the dashboard
* Reduce development time by using an existing library of contracts with accompanying SDK functions and dashboard integrations to interact with contracts

#### Templates

[GitHubHardhat JavaScript Starter](https://github.com/thirdweb-example/hardhat-javascript-starter)[GitHubHardhat TypeScript Starter](https://github.com/thirdweb-example/hardhat-typescript-starter)[GitHubForge Starter](https://github.com/thirdweb-example/forge-starter)[GitHubSolidity Hello World](https://github.com/thirdweb-example/solidity-hello-world)[GitHubSmart Account Upgrades](https://github.com/thirdweb-example/smart-account-upgrades)[GitHubTiered Loyalty Contract](https://github.com/thirdweb-example/tiered-loyalty-contract)[GitHubERC-6551](https://github.com/thirdweb-example/erc-6551)[GitHubAnvil Local Node](https://github.com/thirdweb-example/anvil-local-node)[GitHubSoulbound Token](https://github.com/thirdweb-example/soulbound-token)[GitHubOnchain NFT Metadata](https://github.com/thirdweb-example/on-chain-nft-metadata)[GitHubERC-721 NFT Collection with Deploy & Hardhat](https://github.com/thirdweb-example/erc721a-thirdweb-deploy)[GitHubToken Gated Account](https://github.com/thirdweb-example/token-gated-account)

Show More

### Supported Chains

Contracts is supported on every EVM compatible chain. To view the full list, visit [thirdweb chainlist](https://thirdweb.com/chainlist?service=contracts).

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fsupported-chains.eca8603d.png&w=3840&q=75)
## ThirdwebContract.Create

Create an instance of `ThirdwebContract` to start interacting with a deployed smart contract. You can read data from and write data to the blockchain using this contract instance. If the ABI is not provided, it will attempt to fetch it automatically if available.

### Usage

```csharp
var contract = await ThirdwebContract.Create(client, "contractAddress", chainId, "optionalAbi");
```

##### Parameters

#### client (required)

An instance of `ThirdwebClient`.

#### address (required)

The address of the smart contract you want to interact with. Must be a hexadecimal `string`.

#### chain (required)

The blockchain network's chain ID as a `BigInteger`. This ID specifies which network the contract is deployed on.

#### abi (optional)

The ABI of the contract. If not provided, it will attempt to fetch the ABI automatically if available.

##### Return Value

#### ThirdwebContract

Returns an instance of `ThirdwebContract` configured with the provided parameters, ready to interact with the blockchain.
## Publish

Use the [CLI](https://portal.thirdweb.com/cli) to publish your contracts directly to **Any EVM compatible chain** using the [dashboard](https://thirdweb.com/team):

```bash
npx thirdweb publish
```

This command will:

* Compile your smart contract.
* Upload the contract source code (ABI) to IPFS.
* Open the publish flow in the dashboard.

### How to Publish Your Contract

In your browser, follow the steps below to publish your contract:

#### Configure Contract Metadata

From the dashboard, provide the metadata for your smart contract including:

* **Name**
* **Image**
* **Description**
* **README** \- Markdown is supported. What your contract does, common use cases & examples are great things to include here.

#### Add A Version & Audit Report (Optional)

Use [semantic versioning](https://semver.org/) to incrementally publish new versions of your smart contract; ideal for when you want to make changes to your smart contract but don't want to break existing integrations.

Each version of your smart contract is stored onchain and can be deployed by anyone. You can optionally include release notes, to describe the changes you've made between versions.

You can also link each version to an audit report. You can paste a link to it, or drag and drop a PDF. We will generate an IPFS link for you.

#### Choose how users will deploy your published contract

Select the contract type for your published contract

* Direct Deploy: Choose this option if your contract does not follow the upgradeable contract pattern.  
   * This option can be used for **any contract**  
   * there are no requirements for using this option to publish your contract.  
   * Users will deploy the **full contract**: storage and implementation logic.
* [Deploy via Factory](https://portal.thirdweb.com/contracts/publish/publish-options): Choose this option if you would like users to deploy proxies of your contract using the thirdweb default factory contract or using your own pre-deployed custom factory.  
   * [Default Factory](https://portal.thirdweb.com/contracts/publish/publish-options#default-factory) \- Use this option to use the thirdweb default factory if your contract follows the upgradeable contract pattern.  
   * [Custom Factory](https://portal.thirdweb.com/contracts/publish/publish-options#custom-factory) \- Use this option to use your own pre-deployed custom factory to create proxies for your users.

Once selected, click "Next" to move on to the flow corresponding to the contract type selected.

#### Choose which network(s) to publish your contract to

Select the network(s) you would like to publish your contract. You can select multiple networks or any EVM.

If you chose to publish via direct deploy, you will be asked to select the network(s) you would like users to be able to deploy your contract to and then click the "Next" button. If you chose to publish via factory, you will be asked to select the network(s) you would like users to be able to deploy your contract to when setting your "Factory deploy settings".

#### Customize Contract Parameters

Help users trying to deploy your smart contract by changing what your contract parameters look like. These are fields that users need to enter before deploying your contract with each field corresponding to the associated variable in the constructor of your contract.

* **Display name**: Use this to have a more readable version of the parameter name. Otherwise, the parameter name from the contract will be shown as is.
* **Default value**: This will be pre-filled in the deploy form. Use this to guide users on what value to enter. If the parameter is of the address datatype, you can pre-fill the users connected wallet address by setting the default value as your connected wallet
* **Description**: Use this to clear up any confusion and explain what value this parameter is expecting
* **Advanced**: Tick this option if you want to hide this parameter from the deploy form. This is useful for parameters that are not required to be changed by the user. This option is only available for parameters that have a default value.

#### Publish Contract

Finally, click the "Publish Contract" button to publish your smart contract to the onchain registry.
## Initializing a Thirdweb Client

The `ThirdwebClient` class is the main entry point for interacting with the Thirdweb SDK.

You can pass the client to other methods to interact with wallets and smart contracts.

One client unlocks all thirdweb infrastructure services by default.

### Usage

To start interacting with a deployed smart contract using the Thirdweb .NET SDK, first create a `ThirdwebClient` instance. You can create a client using either a `secretKey` for backend applications or a `clientId` for frontend applications. If your application is not web-based (has no origin), you should also provide a `bundleId`.

#### Choosing between clientId and secretKey

* Use `Client ID` for client-side or frontend applications.
* Use `Secret Key` for server-side or backend applications where you can securely store and use the secret key.
* A `Client ID` should be paired with a `Bundle ID` for non-web applications.

Always ensure that your secret keys are stored securely and not exposed in client-side code.

```csharp
using Thirdweb;
 
// For native applications
var client = ThirdwebClient.Create(clientId: "yourClientId", bundleId: "yourBundleId");
 
// For frontend applications
var client = ThirdwebClient.Create(clientId: "yourClientId");
 
// For backend applications
var client = ThirdwebClient.Create(secretKey: "yourSecretKey");
```

##### Configuration

#### clientId (optional)

The client ID associated with your thirdweb dashboard API Key.

#### secretKey (optional)

The secret key associated with your thirdweb dashboard API Key.

#### bundleId (optional)

The bundle ID associated with your thirdweb dashboard API Key. Required for non-web applications and paired with the client ID.

#### fetchTimeoutOptions (optional)

Options for configuring timeouts for fetching data. Useful for fine-tuning request performance.

```csharp
// You can choose to override default timeout values for storage, rpc, and other requests.
TimeoutOptions(int? storage = null, int? rpc = null, int? other = null)
```

#### rpcOverrides (optional)

Overrides for the default RPC endpoints. Will use your custom endpoints instead of thirdweb RPC endpoints.

```csharp
var client = ThirdwebClient.Create(
    ...,
    rpcOverrides: new()
    {
        { 1, "https://eth.llamarpc.com" },
        { 42161, "https://arbitrum.llamarpc.com" }
    }
);
```
## Contract Extensions

Thirdweb's .NET SDK provides a set of useful type-safe extensions for calling smart contracts. These extensions simplify the process of interacting with smart contracts by providing a more intuitive and user-friendly API.

### Usage

```csharp
// Write without extensions
var receiver = await wallet.GetAddress();
var quantity = BigInteger.One;
var currency = Constants.NATIVE_TOKEN_ADDRESS;
var pricePerToken = BigInteger.Zero;
var allowlistProof = new object[] { new byte[] { }, BigInteger.Zero, BigInteger.Zero, Constants.ADDRESS_ZERO };
var data = new byte[] { };
var receipt = await contract.Write(smartAccount, contract, "claim", 0, receiver, quantity, currency, pricePerToken, allowlistProof, data);
 
// Write with extensions
var receipt = await contract.DropERC20_Claim(wallet, receiver, amount);
 
// Read without extensions
var balance = await contract.Read<string>("balanceOf", "0xOwnerAddress");
 
// Read with extensions
var balance = await contract.ERC20_BalanceOf("0xOwnerAddress");
 
// Generate low level calldata
var calldata = contract.CreateCallData("myFunction", param1, param2);
```

### Available Contract Extensions

Please refer to the `ThirdwebExtensions` [full reference](https://thirdweb-dev.github.io/dotnet/docs/Thirdweb.ThirdwebExtensions.html) for a complete list of available contract extensions.

If you are using our [Marketplace](https://thirdweb.com/thirdweb.eth/MarketplaceV3) contract, check out our [Marketplace-specific](https://thirdweb-dev.github.io/dotnet/docs/Thirdweb.ThirdwebMarketplaceExtensions.html) extensions.
## ThirdwebContract.Read

Use `ThirdwebContract.Read` to fetch data from a smart contract without making any state changes to the blockchain. This method is primarily used for "view" and "pure" functions within the smart contract.

### Usage

```csharp
var result = await contract.Read<T>(contract, "methodName", parameters);
```

##### Parameters

#### contract (required)

An instance of `ThirdwebContract`. Represents the smart contract you want to interact with.

#### methodName (required)

The name of the contract method you wish to call. Must be a `string`.

#### parameters (optional)

The parameters to pass to the contract method, if any. Provide as a comma-separated list following methodName.

##### Return Value

#### T

Returns the result of the contract method call as type T. The type T should match the expected return type of the smart contract method. For example, if the smart contract method returns an uint256, you should expect to receive a BigInteger in C#.
## ThirdwebContract.Prepare

Instantiate a low level [Transaction](https://portal.thirdweb.com/dotnet/transactions/create) object from a contract prepare call.

Useful for preparing, simulating and manipulating transactions before sending them to the blockchain.

### Usage

```csharp
ThirdwebTransaction transaction = await contract.Prepare(wallet, contract, "methodName", weiValue, parameters);
```

##### Parameters

#### wallet (required)

An instance of `IThirdwebWallet`. This represents the signer of the transaction, which can be any type of wallet provider.

#### contract (required)

An instance of `ThirdwebContract`. Represents the smart contract you wish to interact with.

#### methodName (required)

The name of the smart contract method you intend to call. Must be a `string`.

#### weiValue (required)

The amount of Wei to send with payable transactions as a `BigInteger`. This is often set to 0 for methods that don't require sending Ether.

#### parameters (optional)

The parameters to pass to the smart contract method, if any. Provide these as a comma-separated list after weiValue.

##### Return Value

#### Transaction

Returns an instance of `ThirdwebTransaction` configured with the provided parameters, ready to be sent to the blockchain.
## Integrating into MAUI Projects

Thirdweb's .NET SDK is fully compatible with .NET MAUI, allowing you to integrate wallets and blockchain functionality into your cross-platform applications.

### Configuration

#### Adding the Package to Your Project

To add the Thirdweb .NET SDK to your MAUI project, you'll simply need to run:

```bash
dotnet add package Thirdweb
```

### Example Project

An example MAUI project integrating the Thirdweb .NET SDK is available below.

MAUI Template

A MAUI project template with the Thirdweb .NET SDK integrated.

[GitHubView on GitHub](https://github.com/thirdweb-example/dotnet-maui)
## ThirdwebContract.Write

The `ThirdwebContract.Write` method allows you to execute transactions that alter the state of the blockchain via a smart contract. This is typically used for functions that create, modify, or delete data on the blockchain.

### Usage

```csharp
var transactionReceipt = await contract.Write(wallet, contract, "methodName", weiValue, parameters);
```

##### Parameters

#### wallet (required)

An instance of `IThirdwebWallet`. This represents the signer of the transaction, which can be any type of wallet provider.

#### contract (required)

An instance of `ThirdwebContract`. Represents the smart contract you wish to interact with.

#### methodName (required)

The name of the smart contract method you intend to call. Must be a `string`.

#### weiValue (required)

The amount of Wei to send with payable transactions as a `BigInteger`. This is often set to 0 for methods that don't require sending Ether.

#### parameters (optional)

The parameters to pass to the smart contract method, if any. Provide these as a comma-separated list after weiValue.

##### Return Value

#### TransactionReceipt

Returns the transaction receipt as a `TransactionReceipt` object, which contains information about the executed transaction.

### Example

Let's say you have a smart contract with a `transfer` method that transfers ERC20 tokens from the caller's address to another address. Here's how you could execute a transaction to transfer tokens using `ThirdwebContract.Write`:

```csharp
BigInteger chainId = 1; // Ethereum mainnet
string contractAddress = "0x..."; // Your contract address
var client = ThirdwebClient.Create(secretKey: "yourSecretKey");
var contract = await ThirdwebContract.Create(client, contractAddress, chainId);
 
// The wallet that signs and sends the transaction
var wallet = await PrivateKeyWallet.Create(client, "yourPrivateKeyHex");
 
// Assuming transfer takes an address and an amount as parameters
string toAddress = "0x...";
BigInteger amount = new BigInteger(1000); // The amount to transfer
 
// No ether is being sent in this non-payable transaction, so weiValue is 0
BigInteger weiValue = BigInteger.Zero;
 
// Executing the transfer
var receipt = await contract.Write(wallet, contract, "transfer", weiValue, toAddress, amount);
Console.WriteLine($"Transaction receipt: {receipt}");
```

This method is essential for interacting with smart contracts when you need to make changes to the blockchain, such as updating state or transferring assets.
## Getting Started

#### Recommendation

We recommend using an API key to use thirdweb’s default infrastructure services with the .NET SDK such as RPC, Storage, and Account Abstraction. If you haven’t created a key yet, you can do so for free from the [thirdweb dashboard](https://thirdweb.com/create-api-key).

To get started with the Thirdweb .NET SDK, ensure you have [.NET SDK](https://dotnet.microsoft.com/download) installed on your machine.

We recommend using the latest stable version of .NET.

### Integration Steps

* #### .NET Package Installation  
Install the Thirdweb .NET SDK via NuGet package manager:  
```bash  
dotnet add package Thirdweb  
```  
This command adds the Thirdweb SDK to your project, allowing you to interact with the blockchain in your .NET applications.
* #### Initialize Thirdweb Client  
Create a new instance of the Thirdweb client in your application:  
```csharp  
// For Web Applications  
var client = ThirdwebClient.Create(clientId: "yourClientId");  
   
// For Native Applications  
var client = ThirdwebClient.Create(clientId: "yourClientId", bundleId: "yourBundleId");  
   
// For Backend Applications  
var client = ThirdwebClient.Create(secretKey: "yourSecretKey");  
```  
Replace "yourClientId" and "yourBundleId" with your actual client ID and bundle ID.
* #### Interact with Smart Contracts  
Now, you can start interacting with smart contracts. For example, to read from a contract:  
```csharp  
var contract = await ThirdwebContract.Create(client: client, address: "contractAddress", chain: chainId);  
var readResult = await contract.Read<string>(contract, "methodName");  
Console.WriteLine($"Contract read result: {readResult}");  
```  
Replace "contractAddress", chainId, and "methodName" with your contract's address, the chain ID, and the method name you wish to call.
* #### Explore Advanced Features  
Check the SDK documentation for more advanced features like interacting with smart wallets, signing messages, and performing transactions.

### Gaming Integrations
## Integrating into Godot Projects

To integrate the Thirdweb .NET SDK into your Godot projects, you will need to add the Thirdweb SDK package directly to your Godot project's `.csproj` file. This enables you to use the SDK's functionalities within your Godot application, allowing for blockchain interactions such as connecting to user's wallets, interacting with smart contracts, and more.

### Configuration

#### Adding the Package to Your Project

To add the Thirdweb .NET SDK to your Godot project, you will need to manually edit your project's `.csproj` file to include the Thirdweb NuGet package as a dependency. Here is how you can do it:

* Close your Godot project if it's open in the Godot editor.
* Locate your project's `.csproj` file in your project directory.
* Open the `.csproj` file in a text editor.
* Add the following `PackageReference` inside the `<ItemGroup>` tag that contains other `PackageReference` entries:

```xml
<ItemGroup>
  <!-- Other NuGet package references -->
  <PackageReference Include="Thirdweb" Version="2.4.0" />
  <!-- Update with the latest version when necessary -->
</ItemGroup>
```

### Example Project

An example Godot project integrating the Thirdweb .NET SDK is available below.

Godot Template

A Godot project template with the Thirdweb .NET SDK integrated.

[GitHubView on GitHub](https://github.com/thirdweb-example/godot-starter)
## [Insight](https://thirdweb.com/insight) Indexer .NET Integration

Insight is an extremely useful and performant tool to query blockchain data and can decorate it quite nicely too.

Did you know that vitalik, on Ethereum, Polygon and Arbitrum alone owns 7811 ERC20s, 34,362 ERC721s and 2,818 ERC1155s? Let's go through some examples!

#### Instantiation

```csharp
using Thirdweb.Indexer;
 
// Create a ThirdwebInsight instance
var insight = await ThirdwebInsight.Create(client);
```

#### Simple Filters

```csharp
// Setup some filters
var address = await Utils.GetAddressFromENS(client, "vitalik.eth");
var chains = new BigInteger[] { 1, 137, 42161 };
```

#### Fetching all tokens owned by a given address

```csharp
// Fetch all token types
var tokens = await insight.GetTokens(address, chains);
Console.WriteLine($"ERC20 Count: {tokens.erc20Tokens.Length} | ERC721 Count: {tokens.erc721Tokens.Length} | ERC1155 Count: {tokens.erc1155Tokens.Length}");
```

#### Fetching a specific type of token owned by a given address

```csharp
// Fetch ERC20s only
var erc20Tokens = await insight.GetTokens_ERC20(address, chains);
Console.WriteLine($"ERC20 Tokens: {JsonConvert.SerializeObject(erc20Tokens, Formatting.Indented)}");
 
// Fetch ERC721s only
var erc721Tokens = await insight.GetTokens_ERC721(address, chains);
Console.WriteLine($"ERC721 Tokens: {JsonConvert.SerializeObject(erc721Tokens, Formatting.Indented)}");
 
// Fetch ERC1155s only
var erc1155Tokens = await insight.GetTokens_ERC1155(address, chains);
Console.WriteLine($"ERC1155 Tokens: {JsonConvert.SerializeObject(erc1155Tokens, Formatting.Indented)}");
```

#### Fetching Events

Note: most of these parameters are optional (and some are not showcased here)

```csharp
// Fetch events (great amount of optional filters available)
var events = await insight.GetEvents(
    chainIds: new BigInteger[] { 1 }, // ethereum
    contractAddress: "0xbc4ca0eda7647a8ab7c2061c2e118a18a936f13d", // bored apes
    eventSignature: "Transfer(address,address,uint256)", // transfer event
    fromTimestamp: Utils.GetUnixTimeStampNow() - 3600, // last hour
    sortBy: SortBy.TransactionIndex, // block number, block timestamp or transaction index
    sortOrder: SortOrder.Desc, // latest first
    limit: 5 // last 5 transfers
);
Console.WriteLine($"Events: {JsonConvert.SerializeObject(events, Formatting.Indented)}");
```

#### Fetching Transactions

```csharp
// Fetch transactions (great amount of optional filters available)
var transactions = await insight.GetTransactions(
    chainIds: new BigInteger[] { 1 }, // ethereum
    contractAddress: "0xbc4ca0eda7647a8ab7c2061c2e118a18a936f13d", // bored apes
    fromTimestamp: Utils.GetUnixTimeStampNow() - 3600, // last hour
    sortBy: SortBy.TransactionIndex, // block number, block timestamp or transaction index
    sortOrder: SortOrder.Desc, // latest first
    limit: 5 // last 5 transactions
);
Console.WriteLine($"Transactions: {JsonConvert.SerializeObject(transactions, Formatting.Indented)}");
```

#### Fetching NFTs with Metadata

Insight can return rich NFT Metadata. Extensions can turn Insight results into familiar NFT objects.

```csharp
// Fetch ERC721s with extra metadata returned
var erc721Tokens = await insight.GetTokens_ERC721(address, chains, withMetadata: true);
 
// Use ToNFT or ToNFTList extensions
var convertedNft = erc721Tokens[0].ToNFT();
var convertedNfts = erc721Tokens.ToNFTList();
 
// Use NFT Extensions (GetNFTImageBytes, or GetNFTSprite in Unity)
var imageBytes = await convertedNft.GetNFTImageBytes(client);
var pathToSave = Path.Combine(Environment.GetFolderPath(Environment.SpecialFolder.MyPictures), "nft.png");
await File.WriteAllBytesAsync(pathToSave, imageBytes);
Console.WriteLine($"NFT image saved to: {pathToSave}");
```
## BuyWithFiat

Generate an onramp link to redirect users to. See [GetBuyWithFiatQuote](https://portal.thirdweb.com/dotnet/pay/getbuywithfiatquote) for more information on how to get an onramp quote.

### Usage

```csharp
using Thirdweb.Pay;
 
// We return the raw onramp link you should redirect the user to.
var onRampLink = await ThirdwebPay.BuyWithFiat(buyWithFiatQuoteResult);
// You can then use the quote's intent id to track the onramp status.
```

##### Configuration

##### BuyWithFiatQuoteResult (required)

See [GetBuyWithFiatQuote](https://portal.thirdweb.com/dotnet/pay/getbuywithfiatquote) for more information on the `BuyWithFiatQuoteResult` object.

##### Return Value

#### Return Value

`string`: The onramp link to redirect the user to.
## [Nebula AI](https://thirdweb.com/nebula) .NET Integration

The last piece of the puzzle required to create .NET apps and games leveraging a blockchain-powered AI assistant or NPC that also has the power to fully execute transactions.

### Read, Write, Reason.

The best way to understand is to look at examples.

We'll prepare some context for the AI - here, we'll generate a basic `PrivateKeyWallet` and upgrade it to a `SmartWallet` on Sepolia.

```csharp
// Prepare some context
var myChain = 11155111; // Sepolia
var mySigner = await PrivateKeyWallet.Generate(client);
var myWallet = await SmartWallet.Create(mySigner, myChain);
var myContractAddress = "0xe2cb0eb5147b42095c2FfA6F7ec953bb0bE347D8"; // DropERC1155
var usdcAddress = "0x1c7D4B196Cb0C7B01d743Fbc6116a902379C7238"; // Sepolia USDC
```

A one liner creates a Nebula session.

```csharp
// Create a Nebula session
var nebula = await ThirdwebNebula.Create(client);
```

You can **Chat** with Nebula. The Chat method accepts any `IThirdwebWallet` as an optional parameter, context will automatically be updated.

```csharp
// Chat, passing wallet context
var response1 = await nebula.Chat(message: "What is my wallet address?", wallet: myWallet);
Console.WriteLine($"Response 1: {response1.Message}");
```

You may also pass it smart contract context.

```csharp
// Chat, passing contract context
var response2 = await nebula.Chat(
    message: "What's the total supply of token id 0 for this contract?",
    context: new NebulaContext(contractAddresses: new List<string> { myContractAddress }, chainIds: new List<BigInteger> { myChain })
);
Console.WriteLine($"Response 2: {response2.Message}");
```

You can have a full on conversation with it with our **Chat** override accepting multiple messages.

```csharp
// Chat, passing multiple messages and context
var response3 = await nebula.Chat(
    messages: new List<NebulaChatMessage>
    {
        new($"Tell me the name of this contract: {myContractAddress}", NebulaChatRole.User),
        new("The name of the contract is CatDrop", NebulaChatRole.Assistant),
        new("What's the symbol of this contract?", NebulaChatRole.User),
    },
    context: new NebulaContext(contractAddresses: new List<string> { myContractAddress }, chainIds: new List<BigInteger> { myChain })
);
Console.WriteLine($"Response 3: {response3.Message}");
```

Chatting is cool, but what if I just want it to _**do**_ things and stop talking so much?

You can **Execute** transactions directly with a simple prompt.

```csharp
// Execute, this directly sends transactions
var executionResult = await nebula.Execute("Approve 1 USDC to vitalik.eth", wallet: myWallet, context: new NebulaContext(contractAddresses: new List<string>() { usdcAddress }));
if (executionResult.TransactionReceipts != null && executionResult.TransactionReceipts.Count > 0)
{
    Console.WriteLine($"Receipt: {executionResult.TransactionReceipts[0]}");
}
else
{
    Console.WriteLine($"Message: {executionResult.Message}");
}
```

Similarly, **Execute** can take in multiple messages.

```csharp
// Batch execute
var batchExecutionResult = await nebula.Execute(
    new List<NebulaChatMessage>
    {
        new("What's the address of vitalik.eth", NebulaChatRole.User),
        new("The address of vitalik.eth is 0xd8dA6BF26964aF8E437eEa5e3616511D7G3a3298", NebulaChatRole.Assistant),
        new("Approve 1 USDC to them", NebulaChatRole.User),
    },
    wallet: myWallet,
    context: new NebulaContext(contractAddresses: new List<string>() { usdcAddress })
);
if (batchExecutionResult.TransactionReceipts != null && batchExecutionResult.TransactionReceipts.Count > 0)
{
    Console.WriteLine($"Receipts: {JsonConvert.SerializeObject(batchExecutionResult.TransactionReceipts, Formatting.Indented)}");
}
else
{
    Console.WriteLine($"Message: {batchExecutionResult.Message}");
}
```
## BuyWithCrypto

Send a quoted swap transaction. See [GetBuyWithCryptoQuote](https://portal.thirdweb.com/dotnet/pay/getbuywithcryptoquote) for more information on how to get a swap quote.

### Usage

```csharp
using Thirdweb.Pay;
 
var txHash = await ThirdwebPay.BuyWithCrypto(wallet, buyWithCryptoquote);
```

##### Configuration

##### wallet (required)

An instance of `IThirdwebWallet`. This represents the signer of the transaction, which can be any type of wallet provider.

##### BuyWithCryptoQuoteResult (required)

See [GetBuyWithCryptoQuote](https://portal.thirdweb.com/dotnet/pay/getbuywithcryptoquote) for more information on the `BuyWithCryptoQuoteResult` object.

##### Return Value

#### Return Value

`string`: The transaction hash of the swap transaction.
## GetBuyHistory

Get buy history for a specific wallet that executed a [Buy With Crypto](https://portal.thirdweb.com/dotnet/pay/buywithcrypto) or [Buy With Fiat](https://portal.thirdweb.com/dotnet/pay/buywithfiat) swap, supports cursor and pagination.

### Usage

```csharp
using Thirdweb.Pay;
 
var history = await ThirdwebPay.GetBuyHistory(client, walletAddress);
```

##### Configuration

##### Client (required)

`ThirdwebClient`: The Thirdweb client instance.

##### Wallet Address (required)

`string`: The wallet address to get the swap history for.

##### Start Index (optional)

`int`: The start index of the swap history.

##### Count (optional)

`int`: The number of swaps to return.

##### Cursor (optional)

`string`: The cursor to get the next page of swap history. (Optional)

##### Page Size (optional)

`int`: The page size of the swap history. (Optional)

##### Return Value

#### Return Value

A `BuyHistoryResult` object containing the following properties:

```csharp
string WalletAddress; // The wallet address.
List<HistoryPage> Page; // The buy history page.
string NextCursor; // The next cursor.
int PageSize; // The page size.
```

The `HistoryPage` object contains the following properties:

```csharp
BuyWithCryptoStatusResult BuyWithCryptoStatus; // Swap status for Buy With Crypto transactions if any.
BuyWithFiatStatusResult BuyWithFiatStatus; // Swap status for Buy With Fiat transactions if any.
```
## GetBuyWithCryptoQuote

Get a quote containing a TransactionRequest for swapping any token pair.

### Usage

```csharp
using Thirdweb.Pay;
 
var swapQuoteParams = new BuyWithCryptoQuoteParams(
	fromAddress: connectedAddress,
	fromChainId: 137,
	fromTokenAddress: Thirdweb.Constants.NATIVE_TOKEN_ADDRESS; // MATIC
	toTokenAddress: "0x0d500b1d8e8ef31e21c99d1db9a6444d3adf1270"; // WMATIC
	toAmount: "2" // I want to buy 2 WMATIC
);
 
var quote = await ThirdwebPay.GetBuyWithCryptoQuote(client, swapQuoteParams);
```

##### Configuration

##### client (required)

`ThirdwebClient`: The Thirdweb client instance.

##### BuyWithCryptoQuoteParams (required)

A `BuyWithCryptoQuoteParams` object (with a helpful constructor) containing the following properties:

```csharp
string fromAddress; // Address executing the swap
BigInteger? fromChainId; // Chain ID of the from token
string fromTokenAddress; // Address of the from token
string toTokenAddress; // Address of the to token
string fromAmount; // Optional, amount of from token
string fromAmountWei; // Optional, amount of from token in wei
BigInteger? toChainId; // Optional, chain ID of the to token
string toAmount; // Optional, amount of to token
string toAmountWei; // Optional, amount of to token in wei
string toAddress; // Optional, address to receive the to token
int? maxSlippageBPS; // Optional, maximum slippage in basis points
string intentId; // Optional, intent identifier used to link status to a BuyWithFiat onramp flow if any
object purchaseData; // Optional, additional data to be passed and retained during the flow
```

##### Return Value

#### Return Value

A `BuyWithCryptoQuoteResult` object containing the following properties:

```csharp
string quoteId; // Quote identifier
TransactionRequest transactionRequest; // TransactionRequest object for the swap
Approval approval; // Approval transaction details if needed
string fromAddress; // Address executing the swap
Token fromToken; // Token object of the from token
Token toToken; // Token object of the to token
string fromAmountWei; // Amount of from token in wei
string fromAmount; // Amount of from token
string toAmountMinWei; // Minimum amount of to token in wei
string toAmountMin; // Minimum amount of to token
string toAmountWei; // Amount of to token in wei
string toAmount; // Amount of to token
List<PaymentToken> paymentTokens; // Payment token details
List<ProcessingFee> processingFees; // Processing fee details
Estimated estimated; // Estimated usd values, slippage, duration if available
int maxSlippageBPS; // Maximum slippage in basis points
string bridge // Bridge to be used if applicable
```
## GetBuyWithCryptoStatus

Get swap status for a transaction hash returned by [BuyWithCrypto](https://portal.thirdweb.com/dotnet/pay/buywithcrypto).

### Usage

```csharp
using Thirdweb.Pay;
 
var status = await ThirdwebPay.GetBuyWithCryptoStatus(client, txHash);
```

##### Configuration

##### Client (required)

`ThirdwebClient`: The Thirdweb client instance.

##### Transaction Hash (required)

`string`: The transaction hash of the swap transaction returned by [BuyWithCrypto](https://portal.thirdweb.com/dotnet/pay/buywithcrypto).

##### Return Value

#### Return Value

A `BuyWithCryptoStatusResult` object containing the following properties:

```csharp
Quote Quote; // The quote object containing the swap details.
string SwapType; // The swap type, see SwapType enum.
TransactionDetails Source; // The source transaction details.
TransactionDetails Destination; // The destination transaction details.
string Status; // The status of the swap, see SwapStatus enum.
string SubStatus; // The sub status of the swap, see SwapSubStatus enum.
string FromAddress; // The source address.
string FailureMessage; // The failure message if the swap failed.
string Bridge; // The bridge used for the swap if applicable.
object PurchaseData; // Additional data passed when creating the quote
```
## GetBuyWithFiatCurrencies

Returns a list of fiat currencies supported by Buy With Fiat that can be used when getting a quote using the [GetBuyWithFiatQuote](https://portal.thirdweb.com/dotnet/pay/getbuywithfiatquote) API.

### Usage

```csharp
using Thirdweb.Pay;
 
var currencies = await ThirdwebPay.GetBuyWithFiatCurrencies(client);
```

##### Configuration

##### Client (required)

`ThirdwebClient`: The Thirdweb client instance.

##### Return Value

#### Return Value

`List<string>`: A list of supported fiat currencies.
## GetBuyWithFiatQuote

Get a quote containing an intent id and onramp link for a fiat to crypto swap.

### Usage

```csharp
using Thirdweb.Pay;
 
 
var connectedAddress = await wallet.GetAddress();
 
var fiatQuoteParams = new BuyWithFiatQuoteParams(
	fromCurrencySymbol: "USD", // US Dollar
	toAddress: connectedAddress, // Receiver address
	toChainId: "137", toTokenAddress: Thirdweb.Constants.NATIVE_TOKEN_ADDRESS, // MATIC
	toAmount: "20" // I want to buy 20 MATIC
);
 
var quote = await ThirdwebPay.GetBuyWithFiatQuote(client, fiatQuoteParams);
```

##### Configuration

##### Client (required)

`ThirdwebClient`: The Thirdweb client instance.

##### BuyWithFiatQuoteParams

A `BuyWithFiatQuoteParams` object (with a helpful constructor) containing the following properties:

```csharp
string fromCurrencySymbol; // Currency symbol of the from token
string toAddress; // Address executing the swap
string toChainId; // Chain ID of the to token
string toTokenAddress; // Address of the to token
string fromAmount; // Optional, amount of from token
string fromAmountUnits; // Optional, amount of from token in units
string toAmount; // Optional, amount of to token
string toAmountWei; // Optional, amount of to token in wei
double? maxSlippageBPS; // Optional, maximum slippage in basis points
bool isTestMode; // Optional, enters test mode onramp flow, defaults to false
string preferredProvider; // Optional, can be set to "STRIPE", "KADO", etc.
object purchaseData; // Optional, additional data to be passed and retained during the flow
```

##### Return Value

#### Return Value

A `BuyWithFiatQuoteResult` object containing the following properties:

```csharp
string IntentId; // Intent identifier used to track the onramp status
string ToAddress; // Address to receive the tokens
OnRampCurrency FromCurrency; // OnRamp Currency details
OnRampCurrency FromCurrencyWithFees; // OnRamp Currency details with fees
OnRampToken OnRampToken; // OnRamp Token details
string Provider; // Onramp provider
Token ToToken; // Token details of the to token
string EstimatedToAmountMinWei; // Estimated to token amount received min in wei
string EstimatedToAmountMin; // Estimated to token amount received min
List<OnRampFees> ProcessingFees; // Processing fee details
string EstimatedDurationSeconds; // Estimated onramp duration in seconds
double MaxSlippageBPS; // Maximum slippage in basis points
string OnRampLink; // Onramp link that will be used to trigger the onramp flow
```
## GetBuyWithFiatStatus

Get onramp status for an intent id returned by [BuyWithFiat](https://portal.thirdweb.com/dotnet/pay/buywithfiat).

### Usage

```csharp
using Thirdweb.Pay;
 
var status = await ThirdwebPay.GetBuyWithFiatStatus(client, _quote.IntentId);
```

In some cases, you may onramp to an intermediary token that requires an additional step, in these cases the `CRYPTO_SWAP_REQUIRED` status indicates that the onramp transfer has completed and you may now use the intent id to trigger a [BuyWithCrypto](https://portal.thirdweb.com/dotnet/pay/buywithcrypto) transaction to get to your destination token. The flow is the same for [GetBuyWithCryptoQuote](https://portal.thirdweb.com/dotnet/pay/getbuywithcryptoquote), though you may now pass the intent id as a parameter to link both statuses together.

##### Configuration

##### Client (required)

`ThirdwebClient`: The Thirdweb client instance.

##### Intent ID

`string`: The intent id returned by the quote.

##### Return Value

#### Return Value

A `BuyWithFiatStatusResult` object containing the following properties:

```csharp
string IntentId; // Intent identifier to track onramp flow status
string Status; // Status of the onramp flow
string ToAddress; // Address to receive the tokens
OnRampQuote Quote; // OnRamp Quote details
TransactionDetails Source; // Source transaction details
TransactionDetails Destination; // Destination transaction details
string FailureMessage; // Failure message if any
object PurchaseData; // Additional data passed when creating the quote
```

##### OnRamp Status

#### OnRamp Status

Possible status returned for a onramp transactions

```csharp
NONE - No status.
PENDING_PAYMENT - Payment is pending.
PAYMENT_FAILED - Payment has failed.
PENDING_ON_RAMP_TRANSFER -  Pending on-ramp transfer.
ON_RAMP_TRANSFER_IN_PROGRESS - On-ramp transfer is in progress.
ON_RAMP_TRANSFER_COMPLETED - On-ramp transfer is completed
ON_RAMP_TRANSFER_FAILED - On-ramp transfer has failed.
CRYPTO_SWAP_REQUIRED - Crypto swap is required.
CRYPTO_SWAP_COMPLETED - Crypto swap is completed.
CRYPTO_SWAP_FALLBACK - Crypto swap fallback.
CRYPTO_SWAP_IN_PROGRESS - Crypto swap is in progress.
CRYPTO_SWAP_FAILED -  Crypto swap has failed.
```
## Quickstart

Thirdweb Pay is a powerful service that allows you to easily integrate fiat onramps and cross-chain crypto purchases.

### Cross-Chain Swaps

This example demonstrates how to perform a cross-chain swap using the Thirdweb Pay SDK.

```csharp
using Thirdweb.Pay;
 
// Swap Polygon MATIC to Base ETH
var swapQuoteParams = new BuyWithCryptoQuoteParams(
    fromAddress: walletAddress,
    fromChainId: 137,
    fromTokenAddress: Thirdweb.Constants.NATIVE_TOKEN_ADDRESS,
    toTokenAddress: Thirdweb.Constants.NATIVE_TOKEN_ADDRESS,
    toChainId: 8453,
    toAmount: "0.1"
);
var swapQuote = await ThirdwebPay.GetBuyWithCryptoQuote(client, swapQuoteParams);
Console.WriteLine($"Swap quote: {JsonConvert.SerializeObject(swapQuote, Formatting.Indented)}");
 
// Initiate swap
var txHash = await ThirdwebPay.BuyWithCrypto(wallet: privateKeyWallet, buyWithCryptoQuote: swapQuote);
Console.WriteLine($"Swap transaction hash: {txHash}");
 
// Poll for status
var currentSwapStatus = SwapStatus.NONE;
while (currentSwapStatus is not SwapStatus.COMPLETED and not SwapStatus.FAILED)
{
    var swapStatus = await ThirdwebPay.GetBuyWithCryptoStatus(client, txHash);
    currentSwapStatus = Enum.Parse<SwapStatus>(swapStatus.Status);
    Console.WriteLine($"Swap status: {JsonConvert.SerializeObject(swapStatus, Formatting.Indented)}");
    await Task.Delay(5000);
}
```

### Fiat Onramps

This example demonstrates how to use the Thirdweb Pay SDK to initiate a fiat onramp.

```csharp
// Get a Buy with Fiat quote
var fiatQuoteParams = new BuyWithFiatQuoteParams(
    fromCurrencySymbol: "USD",
    toAddress: walletAddress,
    toChainId: "137",
    toTokenAddress: Thirdweb.Constants.NATIVE_TOKEN_ADDRESS,
    toAmount: "20"
);
var fiatOnrampQuote = await ThirdwebPay.GetBuyWithFiatQuote(client, fiatQuoteParams);
Console.WriteLine($"Fiat onramp quote: {JsonConvert.SerializeObject(fiatOnrampQuote, Formatting.Indented)}");
 
// Get a Buy with Fiat link
var onRampLink = ThirdwebPay.BuyWithFiat(fiatOnrampQuote);
Console.WriteLine($"Fiat onramp link: {onRampLink}");
 
// Open onramp link to start the process (use your framework's version of this)
var psi = new ProcessStartInfo { FileName = onRampLink, UseShellExecute = true };
_ = Process.Start(psi);
 
// Poll for status
var currentOnRampStatus = OnRampStatus.NONE;
while (currentOnRampStatus is not OnRampStatus.ON_RAMP_TRANSFER_COMPLETED and not OnRampStatus.ON_RAMP_TRANSFER_FAILED)
{
    var onRampStatus = await ThirdwebPay.GetBuyWithFiatStatus(client, fiatOnrampQuote.IntentId);
    currentOnRampStatus = Enum.Parse<OnRampStatus>(onRampStatus.Status);
    Console.WriteLine($"Fiat onramp status: {JsonConvert.SerializeObject(onRampStatus, Formatting.Indented)}");
    await Task.Delay(5000);
}
```

### Learn More

Please refer to our official [Thirdweb Pay](https://portal.thirdweb.com/connect/pay/overview) documentation for more general information.
## ThirdwebStorage

The `ThirdwebStorage` class provides methods to interact with any URL including IPFS, allowing you to download and upload data easily.

### Download

Download data from an HTTP or IPFS URI.

```csharp
var data = await ThirdwebStorage.Download<string>(client, "{{uri}}");
```

##### Configuration

#### uri

The IPFS URI or a URL that points to the data.

Must be a `string`.

#### Return Value

Returns the data as the specified type. If you're downloading a string, such as JSON data, it's directly returned. For other types, the method attempts to deserialize the data to the specified type using `Newtonsoft.Json`.

### Upload

Upload file to IPFS and pin it.

```csharp
var result = await ThirdwebStorage.Upload(client, "{{path/to-file}}");
```

##### Configuration

#### path

The path to the file to upload.

Must be a `string`.

#### Return Value

Returns an `IPFSUploadResult` containing the IPFS hash (IpfsHash), the size of the pinned content (PinSize), the timestamp of the pinning (Timestamp), and a preview URL (PreviewUrl) constructed using the client ID and the IPFS hash.

### UploadRaw

Upload raw data to IPFS and pin it.

```csharp
var bytes = Encoding.UTF8.GetBytes("{{data}}");
var result = await ThirdwebStorage.UploadRaw(client, bytes);
```

##### Configuration

#### rawBytes

The raw data to upload.

Must be a `byte[]`.

#### Return Value

Returns an `IPFSUploadResult` containing the IPFS hash (IpfsHash), the size of the pinned content (PinSize), the timestamp of the pinning (Timestamp), and a preview URL (PreviewUrl) constructed using the client ID and the IPFS hash.

### Example Usage

#### Downloading JSON Data

```csharp
var jsonData = await ThirdwebStorage.Download<Dictionary<string, object>>(client, "ipfs://Qm...");
```

#### Uploading a File

```csharp
var uploadResult = await ThirdwebStorage.Upload(client, @"C:\path\to\your\file.txt");
Console.WriteLine($"IPFS Hash: {uploadResult.IpfsHash}");
```
## ThirdwebTransaction Instance Methods

The `ThirdwebTransaction` class provides a set of instance methods to set various properties of your transaction's input data and gas settings.

Do note that in most cases those are autopolulated by the SDK and you don't need to set them manually.

### ThirdwebTransaction.SetTo

Set the target address or contract of the transaction.

```csharp
ThirdwebTransaction transaction = transaction.SetTo("0xToAddress");
```

##### Parameters

#### toAddress (required)

The target address or contract of the transaction. Must be a hexadecimal `string`.

##### Return Value

#### ThirdwebTransaction

Returns the instance of `ThirdwebTransaction` with the `to` property set.

### ThirdwebTransaction.SetData

Set the raw encoded data payload (potentially overriding previous data if the transaction was created using `ThirdwebContract.Prepare`).

```csharp
ThirdwebTransaction transaction = transaction.SetData("0x");
```

##### Parameters

#### data (required)

The raw data payload of the transaction. Must be a hexadecimal `string`.

##### Return Value

#### ThirdwebTransaction

Returns the instance of `ThirdwebTransaction` with the `data` property set.

### ThirdwebTransaction.SetValue

Set the value of the payable transaction in Wei.

```csharp
ThirdwebTransaction transaction = transaction.SetValue(1000000000000000000);
```

##### Parameters

#### value (required)

The value of the transaction in Wei. Must be a `BigInteger`.

##### Return Value

#### ThirdwebTransaction

Returns the instance of `ThirdwebTransaction` with the `value` property set.

### ThirdwebTransaction.SetGasLimit

Set the gas limit of the transaction.

```csharp
ThirdwebTransaction transaction = transaction.SetGasLimit(21000);
```

##### Parameters

#### gasLimit (required)

The gas limit of the transaction. Must be an `BigInteger`.

##### Return Value

Returns the instance of `ThirdwebTransaction` with the `gasLimit` property set.

### ThirdwebTransaction.SetGasPrice

Set the gas price of a legacy transaction.

```csharp
ThirdwebTransaction transaction = transaction.SetGasPrice(1000000000);
```

##### Parameters

#### gasPrice (required)

The gas price of the transaction. Must be an `BigInteger`.

##### Return Value

#### ThirdwebTransaction

Returns the instance of `ThirdwebTransaction` with the `gasPrice` property set.

### ThirdwebTransaction.SetNonce

Set the nonce of the transaction.

```csharp
ThirdwebTransaction transaction = transaction.SetNonce(1);
```

##### Parameters

#### nonce (required)

The nonce of the transaction. Must be an `BigInteger`.

##### Return Value

#### ThirdwebTransaction

Returns the instance of `ThirdwebTransaction` with the `nonce` property set.

### ThirdwebTransaction.SetMaxFeePerGas

Set the maximum fee per gas of an EIP-1559 transaction.

```csharp
ThirdwebTransaction transaction = transaction.SetMaxFeePerGas(1000000000);
```

##### Parameters

#### maxFeePerGas (required)

The maximum fee per gas of the transaction. Must be an `BigInteger`.

##### Return Value

#### ThirdwebTransaction

Returns the instance of `ThirdwebTransaction` with the `maxFeePerGas` property set.

### ThirdwebTransaction.SetMaxPriorityFeePerGas

Set the maximum priority fee per gas of an EIP-1559 transaction.

```csharp
ThirdwebTransaction transaction = transaction.SetMaxPriorityFeePerGas(1000000000);
```

##### Parameters

#### maxPriorityFeePerGas (required)

The maximum priority fee per gas of the transaction. Must be an `BigInteger`.

##### Return Value

#### ThirdwebTransaction

Returns the instance of `ThirdwebTransaction` with the `maxPriorityFeePerGas` property set.

### ThirdwebTransaction.SetChainId

Set the chain ID of the transaction.

```csharp
ThirdwebTransaction transaction = transaction.SetChainId(1);
```

##### Parameters

#### chainId (required)

The chain ID of the transaction. Must be an `BigInteger`.

##### Return Value

#### ThirdwebTransaction

Returns the instance of `ThirdwebTransaction` with the `chainId` property set.

### ThirdwebTransaction.SetZkSyncOptions

Set the ZkSync options of the transaction.

This allows you to use native ZkSync Account Abstraction with any paymaster.

```csharp
ZkSyncOptions zkSyncOptions = new ZkSyncOptions("0xPaymaster", "0xPaymasterInput");
ThirdwebTransaction transaction = transaction.SetZkSyncOptions(zkSyncOptions);
```

##### Parameters

#### zkSyncOptions (required)

The ZkSync options of the transaction. Must be an instance of `ZkSyncOptions`.

`ZkSyncOptions` includes the following properties:

* `Paymaster` \- The paymaster address. Must be a hexadecimal `string`.
* `PaymasterInput` \- The paymaster input data. Must be a hexadecimal `string`.
* `GasPerPubdataByteLimit` \- The gas limit per pubdata byte. Must be a `BigInteger`.
* `FactoryDeps` \- A list of factory dependencies. Must be a list of `byte[]`.

##### Return Value

#### ThirdwebTransaction

Returns the instance of `ThirdwebTransaction` with the `zkSyncOptions` property set.
## Utils

A collection of common utility functions that are useful for interacting with the Thirdweb .NET SDK or the blockchain in general. Full list available [here](https://thirdweb-dev.github.io/dotnet/docs/Thirdweb.Utils.html).

### Constants.ADDRESS\_ZERO

A `string` representing the zero address `0x0000000000000000000000000000000000000000`.

Useful for passing the zero address to various functions.

### Constants.NATIVE\_TOKEN\_ADDRESS

A `string` representing the native token address `0xEeeeeEeeeEeEeeEeEeEeeEEEeeeeEeeeeeeeEEeE`.

Useful for passing the native token address (ETH or equivalent) to various functions.

### Constants.ENTRYPOINT\_ADDRESS\_V06

A `string` representing the entrypoint address for Account Abstraction 0.7.0 `0x5FF137D4b0FDCD49DcA30c7CF57E578a026d2789`.

### Constants.ENTRYPOINT\_ADDRESS\_V07

A `string` representing the entrypoint address for Account Abstraction 0.7.0 `0x0000000071727De22E5E9d8BAf0edAc6f37da032`.

### GetSocialProfiles

Fetches the social profiles for the given address or ENS using a Thirdweb client.

```csharp
var socialProfiles = await Utils.GetSocialProfiles(client, addressOrEns);
```

##### Parameters

#### client

A `ThirdwebClient` object representing the client to use for fetching social profiles.

#### addressOrEns

A `string` representing the wallet address or ENS to fetch social profiles for.

##### Return Value

#### socialProfiles

A `SocialProfiles` object containing the fetched social profiles.

### GetENSFromAddress

Fetches the ENS name for the given address using a Thirdweb client.

```csharp
var ensName = await Utils.GetENSFromAddress(client, address);
```

##### Parameters

#### client

A `ThirdwebClient` object representing the client to use for fetching the ENS name.

#### address

A `string` representing the wallet address to fetch the ENS name for.

##### Return Value

#### ensName

A `string` representing the fetched ENS name.

### GetAddressFromENS

Fetches the address for the given ENS name using a Thirdweb client.

```csharp
var address = await Utils.GetAddressFromENS(client, ensName);
```

##### Parameters

#### client

A `ThirdwebClient` object representing the client to use for fetching the address.

#### ensName

A `string` representing the ENS name to fetch the address for.

##### Return Value

#### address

A `string` representing the fetched address.

### GetChainMetadata

Fetches chain data for a specified chain ID using a Thirdweb client.

```csharp
var chainData = await Utils.GetChainMetadata (client, chainId);
```

##### Parameters

#### client

A `ThirdwebClient` object representing the client to use for fetching chain data.

#### chainId

A `BigInteger` representing the chain ID to fetch data for.

##### Return Value

#### chainData

A `ThirdwebChainData` object containing the fetched chain data such as native token name, symbol, decimals, etc.

### HexConcat

Concatenates the given hex strings into a single hex string.

```csharp
var concatenatedHex = Utils.HexConcat("0x1234", "0x5678");
```

##### Parameters

#### hexStrings

An array of hexadecimal `string` values to concatenate.

##### Return Value

#### concatenatedHex

The concatenated hexadecimal `string`.

### HashPrefixedMessage

Hashes the given message bytes with a prefixed message for Ethereum signing.

```csharp
var hashedMessage = messageBytes.HashPrefixedMessage();
```

##### Parameters

#### messageBytes

A `byte[]` representing the message to hash.

##### Return Value

#### hashedMessage

A `byte[]` representing the hashed message.

### HashMessage

Hashes the given message using SHA3 Keccak hashing.

```csharp
var hashedMessage = message.HashMessage();
```

##### Parameters

#### message

A `string` representing the message to hash.

##### Return Value

#### hashedMessage

A `string` representing the hashed message in hexadecimal format.

### BytesToHex

Converts a byte array to a hexadecimal string.

```csharp
var hexString = byteArray.BytesToHex();
```

##### Parameters

#### bytes

A `byte[]` representing the byte array to convert.

##### Return Value

#### hexString

A `string` representing the converted hexadecimal string.

### HexToBytes

Converts a hexadecimal string to a byte array.

```csharp
var byteArray = hexString.HexToBytes();
```

##### Parameters

#### hex

A `string` representing the hexadecimal string to convert.

##### Return Value

#### byteArray

A `byte[]` representing the converted byte array.

### StringToHex

Converts a regular string to a hexadecimal string.

```csharp
var hexString = "Hello".StringToHex();
```

##### Parameters

#### str

A `string` representing the regular string to convert.

##### Return Value

#### hexString

A `string` representing the converted hexadecimal string.

### GetUnixTimeStampNow

Gets the current Unix timestamp in seconds.

```csharp
var timestampNow = Utils.GetUnixTimeStampNow();
```

##### Return Value

#### timestampNow

A `long` representing the current Unix timestamp.

### GetUnixTimeStampIn10Years

Gets the Unix timestamp for 10 years from now.

```csharp
var timestampIn10Years = Utils.GetUnixTimeStampIn10Years();
```

##### Return Value

#### timestampIn10Years

A `long` representing the Unix timestamp 10 years from now.

### ReplaceIPFS

Replaces an IPFS URI with a specified gateway.

```csharp
var gatewayUri = ipfsUri.ReplaceIPFS("https://ipfs.io/ipfs/");
```

##### Parameters

#### uri

A `string` representing the IPFS URI to replace.

#### gateway

A `string` representing the gateway to use. Default is `Constants.FALLBACK_IPFS_GATEWAY`.

##### Return Value

#### gatewayUri

A `string` representing the replaced URI with the specified gateway.

### ToWei

Converts Ether values to Wei.

```csharp
var weiValue = ethValue.ToWei();
```

##### Parameters

#### eth

A `string` representing the Ether value to convert.

##### Return Value

#### weiValue

A `string` representing the converted Wei value.

### ToEth

Converts Wei values to Ether.

```csharp
var ethValue = weiValue.ToEth();
```

##### Parameters

#### wei

A `string` representing the Wei value to convert.

#### decimalsToDisplay

An `int` specifying the number of decimals to display. Default is `4`.

#### addCommas

A `bool` indicating whether to add commas to the output. Default is `false`.

##### Return Value

#### ethValue

A `string` representing the converted Ether value.

### GenerateSIWE

Generates a Sign-In With Ethereum (SIWE) message.

```csharp
var siweMessage = Utils.GenerateSIWE(loginPayloadData);
```

##### Parameters

#### loginPayloadData

A `LoginPayloadData` object containing the payload data for generating the SIWE message.

##### Return Value

#### siweMessage

A `string` representing the generated SIWE message.

### IsZkSync

Checks if a given chain ID corresponds to zkSync.

```csharp
var isZkSync = Utils.IsZkSync(chainId);
```

##### Parameters

#### chainId

A `BigInteger` representing the chain ID to check.

##### Return Value

#### isZkSync

A `bool` indicating whether the chain ID corresponds to zkSync.

### ToChecksumAddress

Converts an Ethereum address to its checksum format.

```csharp
var checksummedAddress = address.ToChecksumAddress();
```

##### Parameters

#### address

A `string` representing the Ethereum address to convert.

##### Return Value

#### checksummedAddress

A `string` representing the checksummed Ethereum address.

### AdjustDecimals

Adjusts the decimal places of a value.

```csharp
var adjustedValue = value.AdjustDecimals(18, 6);
```

##### Parameters

#### value

A `BigInteger` representing the value to adjust.

#### fromDecimals

An `int` specifying the original number of decimals.

#### toDecimals

An `int` specifying the target number of decimals.

##### Return Value

#### adjustedValue

A `BigInteger` representing the value adjusted to the new decimals.

### ToJsonExternalWalletFriendly

Converts typed data into a JSON string suitable for external wallet interaction.

```csharp
var jsonString = Utils.ToJsonExternalWalletFriendly(typedData, message);
```

##### Parameters

#### typedData

A `TypedData<TDomain>` object representing the typed data to convert.

#### message

A `TMessage` object representing the message to include in the JSON.

##### Return Value

#### jsonString

A `string` representing the JSON formatted data.
## IThirdwebWallet.Authenticate

Login to your [thirdweb Auth](https://portal.thirdweb.com/connect/auth)\-integrated backend.

### Usage

```csharp
var authResult = await wallet.Authenticate<string>(domain: "https://mydomain.com", chainId: 1);
```

##### Parameters

#### wallet

The wallet instance that will sign the SIWE (Sign-In With Ethereum) payload, must be an `IThirdwebWallet`.

#### domain

The domain of the backend to authenticate with, must be a `string`.

#### chainId

The chain ID of the blockchain to authenticate with, must be a `BigInteger`.

#### authPayloadPath (optional)

The path to the auth payload endpoint, defaults to `"/auth/payload"`, must be a `string`.

#### authLoginPath (optional)

The path to the auth login endpoint, defaults to `"/auth/login"`, must be a `string`.

#### authPayloadMethod (optional)

The HTTP method for the auth payload request, either `"GET"` or `"POST"`. Defaults to `"GET"`.

#### authLoginMethod (optional)

The HTTP method for the auth login request, either `"GET"` or `"POST"`. Defaults to `"POST"`.

#### separatePayloadAndSignatureInBody (optional)

Whether to separate the payload and signature in the body of the login request, must be a `boolean`. Defaults to `false`.

#### httpClientOverride (optional)

An `IThirdwebHttpClient` instance to override the default HTTP client, defaults to `null`.

##### Return Value

#### T

The authentication result as the type `T`. Can be `string`, `byte[]`, or a deserialized object.

### Example

```csharp
// Example usage returning the auth result as a string
var authResult = await wallet.Authenticate<string>(domain: "https://mydomain.com", chainId: 1);
 
// Example usage returning the auth result as a byte array
var authResultBytes = await wallet.Authenticate<byte[]>(domain: "https://mydomain.com", chainId: 1);
 
// Example usage returning the auth result as a custom object
var authResultObject = await wallet.Authenticate<MyCustomType>(domain: "https://mydomain.com", chainId: 1);
```
## SmartWallet.CreateSessionKey

Grants restricted Smart Wallet access to a signer, otherwise known as session keys, allowing that signer to connect to this Smart Wallet and interact with it, alongside the original admin.

### Usage

```csharp
// Grant a session key to pk wallet (advanced use case)
var receipt = await smartWallet.CreateSessionKey(
    signerAddress: await privateKeyWallet.GetAddress(),
    approvedTargets: new List<string>() { Constants.ADDRESS_ZERO },
    nativeTokenLimitPerTransactionInWei: "0",
    permissionStartTimestamp: "0",
    permissionEndTimestamp: (Utils.GetUnixTimeStampNow() + 86400).ToString(),
    reqValidityStartTimestamp: "0",
    reqValidityEndTimestamp: Utils.GetUnixTimeStampIn10Years().ToString()
);
```

##### Parameters

#### signerAddress

`string`: the address of the signer to grant access to.

#### approvedTargets

`List<string>`: the contracts this signer may interact with, set to ADDRESS\_ZERO to allow all.

#### nativeTokenLimitPerTransactionInWei

`string`: amount of native tokens per transaction this signer is allowed to use, in wei.

#### permissionStartTimestamp

`string`: UNIX timestamp representing the date at which this session key shall be granted, set to 0 to immediately activate it.

#### permissionEndTimestamp

`string`: UNIX timestamp representing the date at which this session key shall end, set to 0 to immediately activate it.

#### reqValidityStartTimestamp

`string`: UNIX timestamp representing the date at which this signed request shall begin to be valid and processable.

#### reqValidityEndTimestamp

`string`: UNIX timestamp representing the date at which this signed request shall no longer be valid and processable.

##### Return Value

#### TransactionReceipt

The transaction receipt for this user operation, as a `TransactionReceipt` object.
## SmartWallet.AddAmin

Add a new admin to the connected Smart Wallet.

### Usage

```csharp
var receipt = await SmartWallet.AddAdmin("0xNewAdminAddress");
```

##### Parameters

#### admin

Hexadecimal `string` representing the signer to grant admin access to.

##### Return Value

#### receipt

The transaction receipt as a `TransactionReceipt` object.
## Publish CLI Reference

Use the CLI to publish your contracts directly to Any EVM compatible chain using the dashboard:

```bash
npx thirdweb publish
```

This command will:

* Compile your smart contract.
* Upload the contract source code (ABI) to IPFS.
* Open the publish flow in the dashboard.

#### Options

```bash
-p--path <string>
```

* Path to project

```bash
-f--file <string>
```

* Filter for contract files that contain this file name

```bash
-cn--contract-name <string>
```

* Filter for contracts that contain this contract name

```bash
-c--clean
```

* Clear the cache before building

```bash
--dry-run
```

* Dry run (skip actually publishing)

```bash
-d--debug
```

* Show debug logs

```bash
--ci
```

* Continuous Integration mode

```bash
-k--key <string>
```
## ThirdwebTransaction Static Methods

The `ThirdwebTransaction` class includes several static methods that provide functionality to estimate costs, simulate, send and poll transactions and user operations.

These methods are crucial for advanced transaction management and execution in blockchain applications.

### ThirdwebTransaction.EstimateGasCosts

Estimate the gas costs of a transaction.

```csharp
TotalCosts gasCosts = await ThirdwebTransaction.EstimateGasCosts(transaction);
```

##### Parameters

#### transaction (required)

An instance of `ThirdwebTransaction`. The transaction for which you are estimating the gas costs.

##### Return Value

#### TotalCosts

Returns the estimated gas costs as `TotalCosts`, including costs in both `ether` and `wei`.

### ThirdwebTransaction.EstimateTotalCosts

Calculate the total costs of a transaction, combining the gas costs and transaction value.

```csharp
TotalCosts totalCosts = await ThirdwebTransaction.EstimateTotalCosts(transaction);
```

##### Parameters

#### transaction (required)

An instance of `ThirdwebTransaction`. The transaction for which you are calculating total costs.

##### Return Value

#### TotalCosts

Returns the total costs of the transaction as `TotalCosts`, encompassing both the gas costs and the transaction value in `ether` and `wei`.

### ThirdwebTransaction.EstimateGasLimit

Estimate the gas limit of a transaction or user operation.

```csharp
BigInteger estimatedGasLimit = await ThirdwebTransaction.EstimateGasLimit(transaction);
```

##### Parameters

#### transaction (required)

An instance of `ThirdwebTransaction`. The transaction for which you are estimating the gas limit.

##### Return Value

#### BigInteger

Returns the estimated gas limit as a `BigInteger`.

### ThirdwebTransaction.EstimateGasPrice (Legacy)

Estimate the gas price for a transaction, optionally adjusting the estimate by a bump ratio.

```csharp
BigInteger estimatedGasPrice = await ThirdwebTransaction.EstimateGasPrice(transaction, withBump);
```

##### Parameters

#### transaction (required)

An instance of `ThirdwebTransaction`. The transaction for which you are estimating the gas price.

#### withBump (optional)

A Boolean indicating whether to adjust the estimated gas price by a factor to account for network conditions. Defaults to `true`.

##### Return Value

#### BigInteger

Returns the estimated gas price as a `BigInteger`.

### ThirdwebTransaction.EstimateGasFees (EIP-1559)

Estimate the gas fees for a transaction, optionally adjusting the estimate by a bump ratio.

```csharp
(BigInteger maxFeePerGas, BigInteger maxPriorityFeePerGas) = await ThirdwebTransaction.EstimateGasFees(transaction, withBump);
```

##### Parameters

#### transaction (required)

An instance of `ThirdwebTransaction`. The transaction for which you are estimating the gas fees.

#### withBump (optional)

A Boolean indicating whether to adjust the estimated gas fees by a factor to account for network conditions. Defaults to `true`.

##### Return Value

#### (BigInteger maxFeePerGas, BigInteger maxPriorityFeePerGas)

Returns a tuple containing the estimated maximum fee per gas and maximum priority fee per gas, both as `BigInteger`.

### ThirdwebTransaction.Simulate

Simulate the execution of a transaction and return raw data.

```csharp
string data = await ThirdwebTransaction.Simulate(transaction);
```

##### Parameters

#### transaction (required)

An instance of `ThirdwebTransaction`. The transaction you are simulating.

##### Return Value

#### string

Returns the raw data of the simulated transaction as a `string`.

### ThirdwebTransaction.Sign

Sign a raw transaction and returns the signed transaction data or the signed user operation json.

```csharp
string signedTx = await ThirdwebTransaction.Sign(transaction);
```

##### Parameters

#### transaction (required)

An instance of `ThirdwebTransaction`. The transaction you are signing.

##### Return Value

#### string

Returns the signed transaction data as a `string` or the signed user operation json if using Account Abstraction.

### ThirdwebTransaction.Prepare

Prepares the transaction for sending by setting default values for any unset fields, such as gas limits and gas prices.

```csharp
ThirdwebTransaction preparedTransaction = await ThirdwebTransaction.Prepare(transaction);
```

##### Parameters

#### transaction (required)

An instance of `ThirdwebTransaction`. The transaction you want to prepare for sending.

##### Return Value

#### ThirdwebTransaction

Returns the prepared transaction as an instance of `ThirdwebTransaction`, with all necessary fields populated.

### ThirdwebTransaction.Send

Send a transaction to the blockchain without waiting for confirmation.

```csharp
string transactionHash = await ThirdwebTransaction.Send(transaction);
```

##### Parameters

#### transaction (required)

An instance of `ThirdwebTransaction`. The transaction you want to send to the blockchain.

##### Return Value

#### string

Returns the hash of the transaction as a `string`.

### ThirdwebTransaction.SendAndWaitForTransactionReceipt

Send a transaction and wait for its receipt.

```csharp
TransactionReceipt receipt = await ThirdwebTransaction.SendAndWaitForTransactionReceipt(transaction);
```

##### Parameters

#### transaction (required)

An instance of `ThirdwebTransaction`. The transaction you are sending and waiting for a receipt.

##### Return Value

#### TransactionReceipt

Returns the transaction receipt as a `TransactionReceipt`, which includes details of the transaction execution result.

### ThirdwebTransaction.WaitForTransactionReceipt

Wait for a transaction receipt to be available. Throws if reverted explicitly or silently and attempts to decode the revert reason.

```csharp
TransactionReceipt receipt = await ThirdwebTransaction.WaitForTransactionReceipt(client, chainId, txHash);
```

##### Parameters

#### client (required)

An instance of `ThirdwebClient`.

#### chainId (required)

The chain ID of the blockchain network where the transaction was sent. Must be a `BigInteger`.

#### txHash (required)

The hash of the transaction you are waiting for. Must be a hexadecimal `string`.

#### cancellationToken (optional)

A `CancellationToken` to cancel the operation.

##### Return Value

#### TransactionReceipt

Returns the transaction receipt as a `TransactionReceipt`, which includes details of the transaction execution result.
## IThirdwebWallet.Disconnect

This method cleanly disconnects the wallet instance from the blockchain network or any related services, effectively ending the session.

**Note:** When using `InAppWallet` this will clear the session and require the user to re-authenticate to reconnect later on. When using `SmartWallet` this will disconnect the personal wallet it uses as a signer.

### Usage

```csharp
await wallet.Disconnect();
```

##### Description

The `Disconnect` method is used to terminate any active connection or session that the wallet might have with the blockchain network or related services. This can include disconnecting from a web3 provider, clearing any cached authentication, or other necessary cleanup actions to ensure a clean state.
## EcosystemWallet.GenerateExternalLoginLink

This method returns a URL that can be used to forward the logged-in session of In-App or Ecosystem Wallets from .NET to React apps built using thirdweb.

Configure your React website to use thirdweb Connect, open the link generated by this method and your users will be autoconnected. If using Ecosystem Wallets, make sure to create the ecosystem wallet with the same ecosystem id and partner id (if any) and include it as one of your wallets in, for example, your ConnectButton's wallets prop. Make sure you're using the same api key on both ends.

### Usage

```csharp
var url = await ecosystemWallet.GenerateExternalLoginLink();
```

##### Return Value

#### string

The URL that can be used to forward the logged-in session of In-App or Ecosystem Wallets from .NET to React apps built using thirdweb.
## IThirdwebWallet.ExecuteTransaction

Sends a raw transaction from the connected wallet (if supported), waits for it to be mined and returns the receipt. It is recommended to use `ThirdwebContract.Write` instead.

### Usage

```csharp
var receipt = await wallet.ExecuteTransaction(new ThirdwebTransactionInput(...));
```

##### Parameters

#### ThirdwebTransactionInput

`ThirdwebTransactionInput` object containing necessary transaction details such as `To`, `Data`, `Value`.

##### Return Value

#### ThirdwebTransactionReceipt

The transaction receipt as a `ThirdwebTransactionReceipt`.
## ThirdwebTransaction.Create

#### Advanced Use Case

If you are interacting with a contract, it is best to use[ThirdwebContract.Prepare](https://portal.thirdweb.com/dotnet/contracts/prepare) to create a transaction.

The `ThirdwebTransaction.Create` method allows advanced users to manually create transactions using specific wallet credentials and transaction inputs. This method is ideal for users who need precise control over the transaction details.

### Usage

```csharp
ThirdwebTransaction transaction = await ThirdwebTransaction.Create(wallet, txInput, chainId);
```

##### Parameters

#### wallet (required)

An instance of `IThirdwebWallet`. This represents the wallet that will be used to perform the transaction. The wallet's address must match the from address specified in txInput, if provided.

#### txInput (required)

An instance of `ThirdwebTransactionInput`. This structure includes necessary details such as the from address, value, gas limit, and data payload.

The `from` field is optional and, if not provided, will default to the wallet's address.

#### chainId (required)

The blockchain network's chain ID as a `BigInteger`. This ID specifies which network the transaction is intended for.

##### Return Value

#### ThirdwebTransaction

Returns an instance of `ThirdwebTransaction` configured with the provided parameters, ready to interact with the blockchain.
## SmartWallet.GetAllActiveSigners

This method retrieves a list of all active signers with their permissions for a smart wallet.

### Usage

```csharp
// Get all active signers
List<SignerPermissions> signers = await smartWallet.GetAllActiveSigners();
```

##### Parameters

#### None

This method does not require any parameters.

##### Return Value

#### List of `SignerPermissions`

The method returns a list of `SignerPermissions` objects, each representing a signer and their permissions.

Each `SignerPermissions` object contains the following properties:

* `Signer`: The address of the signer.
* `ApprovedTargets`: A list of addresses that the signer is approved to interact with.
* `NativeTokenLimitPerTransaction`: The maximum amount of native tokens the signer can transfer per transaction.
* `StartTimestamp`: The start time for the signer's permissions.
* `EndTimestamp`: The end time for the signer's permissions.
## IThirdwebWallet.GetAddress

This method retrieves the blockchain address associated with a Thirdweb wallet instance, enabling developers to easily identify and interact with the wallet on the blockchain.

### Usage

```csharp
string walletAddress = await wallet.GetAddress();
```

##### Return Value

`string`

The blockchain address as a hexadecimal `string`. This address uniquely identifies the wallet on the blockchain, allowing for interactions such as transactions or smart contract calls.
## SmartWallet.GetAllAdmins

This method retrieves a list of all admin addresses for a smart wallet.

### Usage

```csharp
// Get all admin addresses
List<string> admins = await smartWallet.GetAllAdmins();
```

##### Parameters

#### None

This method does not require any parameters.

##### Return Value

#### List of `string`

The method returns a list of `string` objects, each representing an admin address.
## EcosystemWallet.GetEcosystemDetails

This method returns information about the Ecosystem the wallet is part of.

### Usage

```csharp
var result = await ecosystemWallet.GetEcosystemDetails();
```

##### Return Value

#### EcosystemDetails

The Ecosystem details, such as the Ecosystem name, slug, image URL and more.
## IThirdwebWallet.GetBalance

This method allows getting either the native token balance or the balance of a specific token for a wallet.

### Usage

```csharp
// Get native balance
BigInteger nativeBalance = await wallet.GetBalance(chainId);
 
// Get ERC20 token balance
BigInteger tokenBalance = await wallet.GetBalance(chainId, erc20ContractAddress);
```

##### Parameters

#### wallet (required)

An instance of `IThirdwebWallet`. This represents the wallet for which you want to retrieve the balance.

#### chainId (required)

The chain ID from which you want to retrieve the balance.

#### erc20ContractAddress (optional)

The optional ERC20 contract address from which you want to retrieve the balance. If not provided, the method will return the native token balance.

##### Return Value

#### string

The method returns a `BigInteger` representing the balance in Wei.
## GetPersonalWallet

This method retrieves the current signer of the connected SmartWallet.

### Usage

```csharp
var signer = await smartWallet.GetPersonalWallet();
```

##### Return Value

#### IThirdwebWallet

The method returns an instance of `IThirdwebWallet` representing the current signer of the connected SmartWallet.
## EcosystemWallet.GetUserDetails

This method returns information about the connected user wallet and its linked accounts.

### Usage

```csharp
var result = await ecosystemWallet.GetUserDetails();
```

##### Return Value

#### UserStatusResponse

The user and linked accounts information, such as the user's address, email and more.
## EcosystemWallet.GetUserDetails

This method returns information about the connected user auth provider details, for instance Google or Github specific details.

### Usage

```csharp
var result = ecosystemWallet.GetUserAuthDetails();
```

##### Return Value

#### JObject

The user auth provider details as a `JObject`.
## IThirdwebWallet.GetTransactionCount

This method retrieves the transaction count (i.e., nonce) for a specified wallet address on a given chain.

### Usage

```csharp
BigInteger transactionCount = await wallet.GetTransactionCount(chainId, address);
```

##### Parameters

#### wallet (required)

An instance of `IThirdwebWallet`. This represents the wallet for which you want to retrieve the transaction count.

#### chainId (required)

The chain ID from which you want to retrieve the transaction count.

#### address (required)

The wallet address for which you want to retrieve the transaction count.

#### blocktag (optional)

The block tag to retrieve the transaction count at. Defaults to `"pending"`. You can set this to `"latest"` or `"earliest"`.

##### Return Value

#### BigInteger

The method returns a `BigInteger` representing the transaction count (nonce) of the wallet.
## IThirdwebWallet.IsConnected

Determines whether the wallet instance is currently connected to the blockchain network and any related services.

**Note:** an `InAppWallet` returning `false` here means that it could not auto-connect to the wallet right after creation, and requires user authentication, see [InAppWallet.Connect](https://portal.thirdweb.com/dotnet/wallets/providers/in-app-wallet) for more information.

### Usage

```csharp
bool isConnected = await wallet.IsConnected();
```

##### Return Value

#### bool

Returns a `bool` indicating the wallet's connection status. `true` signifies that the wallet is currently connected and ready to go, whereas `false` indicates it is not.
## SmartWallet.RemoveAdmin

Removes an admin from the connected Smart Wallet.

### Usage

```csharp
var receipt = await SmartWallet.RemoveAdmin("0xLivedminAddress");
```

##### Parameters

#### admin

Hexadecimal `string` representing the signer to remove admin access from.

##### Return Value

#### receipt

The transaction receipt as a `TransactionReceipt` object.
## SmartWallet.IsDeployed

This method retrieves whether the connected Smart Wallet is deployed onchain.

### Usage

```csharp
bool isDeployed = await SmartWallet.IsDeployed();
```

##### Return Value

#### bool

Whether a Smart Wallet is deployed as a `bool`.
## IThirdwebWallet.SendTransaction

Sends a raw transaction from the connected wallet (if supported) and returns the hash. It is recommended to use `ThirdwebContract.Write` instead.

### Usage

```csharp
string transactionHash = await wallet.SendTransaction(new ThirdwebTransactionInput(...));
```

##### Parameters

#### ThirdwebTransactionInput

`ThirdwebTransactionInput` object containing necessary transaction details such as `To`, `Data`, `Value`.

##### Return Value

#### string

The transaction hash as a `string`.
## IThirdwebWallet.PersonalSign

This method allows signing a string message using the wallet's private key. The signed message proves the message's integrity and authenticity, demonstrating that the message was indeed created by the owner of the private key.

**Note:** When using `SmartWallet`, calling this method from an undeployed smart account will make use of [EIP-6492](https://eips.ethereum.org/EIPS/eip-6492).

### Usage

```csharp
string signature = await wallet.PersonalSign("Your message here");
```

##### Parameters

#### message (required)

A `string` message to be signed. This is the message whose integrity and authenticity you want to ensure.

##### Return Value

#### string

The method returns a `string` representing the hexadecimal signature of the message. This signature can be used to verify the message's authenticity.
## IThirdwebWallet.SignTypedDataV4

Signs structured data according to EIP-712, enhancing the security and usability of signing structured data by providing a standardized user experience across Ethereum applications.

### Usage

```csharp
string signature = await wallet.SignTypedDataV4(jsonTypedData);
```

##### Parameters

#### jsonTypedData (required)

A JSON string representing the typed data to be signed. This data should follow the EIP-712 standard, including types, domain, and message.

##### Return Value

#### string

Returns a `string` representing the hexadecimal signature of the typed data. This signature can be verified to confirm the data's integrity and the signer's authenticity.
## SmartWallet.Create

Instantiate a `SmartWallet` to enable advanced blockchain interactions, including gasless transactions through account abstraction. This wallet type is especially useful for creating a user-friendly experience in decentralized applications.

### Usage

```csharp
var smartWallet = await SmartWallet.Create(personalWallet, chainId);
```

#### Advanced Functionality

This method sets up a SmartWallet with optional gasless transactions, leveraging account abstraction. It's designed for developers looking to create seamless blockchain interactions within their applications.

##### Parameters

#### personalWallet (required)

An instance of IThirdwebWallet (e.g., `PrivateKeyWallet` or `InAppWallet`). Represents the personal wallet connected to the SmartWallet.

#### chainId (required)

The blockchain network's chain ID as a `BigInteger`. Identifies the network the smart wallet interacts with.

#### factoryAddress (optional)

The address of the factory contract used to deploy new smart wallet instances.

#### gasless (optional)

A `boolean` indicating if the wallet should operate in a gasless mode for transactions.

#### accountAddressOverride (optional)

Overrides the default account address for the smart wallet. Useful for session key advanced use cases.

#### entryPoint (optional)

The entry point contract address for account abstraction.

#### bundlerUrl (optional)

URL of the bundler server used for processing User Operations.

#### paymasterUrl (optional)

URL of the paymaster service that sponsors gas for User Operations.

#### tokenPaymaster (optional)

The `TokenPaymaster` (enum) representing the ERC20 token you want users to pay gas fees with.

##### Return Value

#### SmartWallet

Returns an instance of `SmartWallet`, configured with the provided parameters and ready for blockchain interactions.

Example

Here's how you can create a SmartWallet for a user, assuming you already have a ThirdwebClient and a personal wallet (PrivateKeyWallet or InAppWallet) set up:

```csharp
var client = ThirdwebClient.Create(clientId: "yourClientId", bundleId: "yourBundleId");
var personalWallet = await PrivateKeyWallet.Create(client, "yourPrivateKeyHex");
 
BigInteger chainId = 137; // Polygon mainnet
bool gasless = true; // Enable gasless transactions
 
var smartWallet = await SmartWallet.Create(
    personalWallet,
    gasless,
);
 
Console.WriteLine($"SmartWallet address: {await smartWallet.GetAddress()}");
 
// Sign a message (this will also deploy your smart wallet if it hasn't been deployed yet)
var message = "Hello, Thirdweb!";
var signature = await wallet.PersonalSign(message);
Console.WriteLine($"Signature: {signature}");
```
## [EIP-7702](https://eips.ethereum.org/EIPS/eip-7702) Integration (Experimental)

Integrates `authorizationList` for any transactions. This EIP essentially allows you to set code to an EOA, unlocking a world of possibilities to enhance their functionality.

The best way to understand it outside of reading the EIP is looking at the example below; to preface it: we sign an authorization using the wallet we want to set code to. Another wallet sends a transaction with said authorization passed in, essentially activating it. The authority wallet now has code set to it pointing to an (insecure) [Delegation](https://thirdweb.com/odyssey-911867/0x654F42b74885EE6803F403f077bc0409f1066c58) contract in this case, which allows any wallet to execute any call through it on behalf of the authority. In this example, we call the wallet executing both the authorization and the claim transaction afterwards, the exectuor.

An authority may execute its own authorization, the only difference is internal whereby the authorization nonce is incremented by 1.

```csharp
// Chain and contract addresses
var chainWith7702 = 911867;
var erc20ContractAddress = "0xAA462a5BE0fc5214507FDB4fB2474a7d5c69065b"; // Fake ERC20
var delegationContractAddress = "0x654F42b74885EE6803F403f077bc0409f1066c58"; // BatchCallDelegation
 
// Initialize contracts normally
var erc20Contract = await ThirdwebContract.Create(client: client, address: erc20ContractAddress, chain: chainWith7702);
var delegationContract = await ThirdwebContract.Create(client: client, address: delegationContractAddress, chain: chainWith7702);
 
// Initialize a (to-be) 7702 EOA
var eoaWallet = await PrivateKeyWallet.Generate(client);
var eoaWalletAddress = await eoaWallet.GetAddress();
Console.WriteLine($"EOA address: {eoaWalletAddress}");
 
// Initialize another wallet, the "executor" that will hit the eoa's (to-be) execute function
var executorWallet = await PrivateKeyWallet.Generate(client);
var executorWalletAddress = await executorWallet.GetAddress();
Console.WriteLine($"Executor address: {executorWalletAddress}");
 
// Fund the executor wallet
var fundingWallet = await PrivateKeyWallet.Create(client, privateKey);
var fundingHash = (await fundingWallet.Transfer(chainWith7702, executorWalletAddress, BigInteger.Parse("0.001".ToWei()))).TransactionHash;
Console.WriteLine($"Funded Executor Wallet: {fundingHash}");
 
// Sign the authorization to make it point to the delegation contract
var authorization = await eoaWallet.SignAuthorization(chainId: chainWith7702, contractAddress: delegationContractAddress, willSelfExecute: false);
Console.WriteLine($"Authorization: {JsonConvert.SerializeObject(authorization, Formatting.Indented)}");
 
// Execute the delegation
var tx = await ThirdwebTransaction.Create(executorWallet, new ThirdwebTransactionInput(chainId: chainWith7702, to: executorWalletAddress, authorization: authorization));
var hash = (await ThirdwebTransaction.SendAndWaitForTransactionReceipt(tx)).TransactionHash;
Console.WriteLine($"Authorization execution transaction hash: {hash}");
 
// Prove that code has been deployed to the eoa
var rpc = ThirdwebRPC.GetRpcInstance(client, chainWith7702);
var code = await rpc.SendRequestAsync<string>("eth_getCode", eoaWalletAddress, "latest");
Console.WriteLine($"EOA code: {code}");
 
// Log erc20 balance of executor before the claim
var executorBalanceBefore = await erc20Contract.ERC20_BalanceOf(executorWalletAddress);
Console.WriteLine($"Executor balance before: {executorBalanceBefore}");
 
// Prepare the claim call
var claimCallData = erc20Contract.CreateCallData(
    "claim",
    new object[]
    {
        executorWalletAddress, // receiver
        100, // quantity
        Constants.NATIVE_TOKEN_ADDRESS, // currency
        0, // pricePerToken
        new object[] { Array.Empty<byte>(), BigInteger.Zero, BigInteger.Zero, Constants.ADDRESS_ZERO }, // allowlistProof
        Array.Empty<byte>() // data
    }
);
 
// Embed the claim call in the execute call
var executeCallData = delegationContract.CreateCallData(
    method: "execute",
    parameters: new object[]
    {
        new List<Thirdweb.Console.Call>
        {
            new()
            {
                Data = claimCallData.HexToBytes(),
                To = erc20ContractAddress,
                Value = BigInteger.Zero
            }
        }
    }
);
 
// Execute from the executor wallet targeting the eoa which is pointing to the delegation contract
var tx2 = await ThirdwebTransaction.Create(executorWallet, new ThirdwebTransactionInput(chainId: chainWith7702, to: eoaWalletAddress, data: executeCallData));
var hash2 = (await ThirdwebTransaction.SendAndWaitForTransactionReceipt(tx2)).TransactionHash;
Console.WriteLine($"Token claim transaction hash: {hash2}");
 
// Log erc20 balance of executor after the claim
var executorBalanceAfter = await erc20Contract.ERC20_BalanceOf(executorWalletAddress);
Console.WriteLine($"Executor balance after: {executorBalanceAfter}");
```

_Note that for the time being this only works on 7702-enabled chains such as [Odyssey](https://thirdweb.com/odyssey-911867) and the feature has only been integrated with `PrivateKeyWallet`._
## PrivateKeyWallet.Create

Instantiate a `PrivateKeyWallet` with a given private key. This wallet is capable of signing transactions and messages, interacting with smart contracts, and performing other blockchain operations. **This wallet type is intended for backend applications only,** due to the sensitive nature of private keys.

### Usage

```csharp
var wallet = await PrivateKeyWallet.Create(client, "yourPrivateKeyHex");
```

#### Important

This method involves using a raw private key, which should be handled with the utmost care. Never expose private keys in client-side code or store them in an insecure manner. Ideally, use environment variables or secure vaults to manage private keys in backend services.

##### Parameters

#### client (required)

An instance of `ThirdwebClient`.

#### privateKeyHex (required)

The private key of the wallet, provided as a hexadecimal `string`. This key grants full control over the wallet's funds and assets on the blockchain.

##### Return Value

#### PrivateKeyWallet

Returns an instance of `PrivateKeyWallet`, ready to sign transactions and messages with the provided private key.

### Example

Here is an example of creating a PrivateKeyWallet to sign a simple message. This example assumes you have a ThirdwebClient instance already created:

```csharp
var client = ThirdwebClient.Create("yourClientId");
var privateKeyHex = "yourPrivateKeyHex"; // Should be securely stored and accessed
var wallet = await PrivateKeyWallet.Create(client, privateKeyHex);
 
Console.WriteLine($"PrivateKeyWallet address: {await wallet.GetAddress()}");
 
// Sign a message
var message = "Hello, Thirdweb!";
var signature = await wallet.PersonalSign(message);
Console.WriteLine($"Signature: {signature}");
```

**Note**: The `PrivateKeyWallet` is intended for use in secure, backend environments. Ensure private keys are never exposed or hard-coded in client-side applications. Use `InAppWallet` and `SmartWallet` for client-side applications.
## EngineWallet.Create

A .NET integration of thirdweb [Engine](https://thirdweb.com/engine).

Instantiate a `Engine` with a given private key. This wallet is capable of signing transactions and messages, interacting with smart contracts, and performing other blockchain operations. **This wallet type is intended for backend applications only,** due to the sensitive nature of private keys.

### Usage

```csharp
// EngineWallet is compatible with IThirdwebWallet and can be used with any SDK method/extension
var engineWallet = await EngineWallet.Create(
    client: client,
    engineUrl: Environment.GetEnvironmentVariable("ENGINE_URL"),
    authToken: Environment.GetEnvironmentVariable("ENGINE_ACCESS_TOKEN"),
    walletAddress: Environment.GetEnvironmentVariable("ENGINE_BACKEND_WALLET_ADDRESS"),
    timeoutSeconds: null, // no timeout
    additionalHeaders: null // can set things like x-account-address if using basic session keys
);
 
// Simple self transfer
var receipt = await engineWallet.Transfer(chainId: 11155111, toAddress: await engineWallet.GetAddress(), weiAmount: 0);
Console.WriteLine($"Receipt: {receipt}");
```

#### Important

This method involves using an access token, it is meant to be used in a secure backend environment. Never expose access tokens in client-side code or store them in an insecure manner. Ideally, use environment variables or secure vaults to manage access tokens in backend services.

##### Parameters

#### client (required)

An instance of `ThirdwebClient`.

#### engineUrl (required)

The URL of the Thirdweb Engine instance, get it from your Engine dashboard.

#### authToken (required)

The access token for the Engine instance, get it from your Engine dashboard.

#### walletAddress (required)

The address of the backend wallet that will be used to sign transactions. You can create a backend wallet using the Engine dashboard.

#### timeoutSeconds (optional)

Enforce a timeout for requests to the Engine instance, in seconds.

#### additionalHeaders (optional)

Additional headers to include in requests to the Engine instance, such as `x-account-address` for Account Abstraction/Session Key flows.

##### Return Value

#### EngineWallet

Returns an instance of `EngineWallet`, ready to sign transactions and messages with the provided access token.
## .NET SDK

Build decentralized .NET applications and create seamless user experiences using Thirdweb's .NET SDK.

Connect to users’ wallets, interact with smart contracts, sign messages, and utilize common standards such as tokens, NFTs, and marketplaces; all with built-in RPC URLs, IPFS gateways, and more.

.NET SDK

.NET SDK is open-source. View and contribute to its source code on GitHub.

[GitHubView on GitHub](https://github.com/thirdweb-dev/dotnet)

### Installation

The .NET SDK is distributed as a [NuGet package](https://www.nuget.org/packages/Thirdweb).

You can install the latest version of the SDK in your project using the NuGet Package Manager:

```bash
dotnet add package Thirdweb
```

### Get Started

Check out the getting started guide to learn how to use the SDK in less than 2 minutes.
## FAQ

### About Engine

#### Which contracts work with Engine?

Engine supports reads and writes to any contract verified on the blockchain explorer, including any contract deployed via thirdweb._Note: Some endpoints allow providing the contract ABI to support any unverified contract._

Engine also supports deploys for thirdweb [prebuilt contracts](https://thirdweb.com/explore) including NFTs, tokens, marketplaces, and smart accounts.

If you have a question about a particular contract type, [contact us](https://thirdweb.com/support).

#### How are Engine and the thirdweb Contract SDK different?

Engine is a server that manages your backend wallets and how they interact with contracts. This difference unlocks capabilities that thirdweb and other web3 SDKs, including:

* Management of KMS backend wallets
* Fine-grained access control with access tokens
* Transaction parallelization to handle higher throughput per wallet
* Observability and retries on stuck transactions
* Webhooks on completed transactions to sync onchain and off-chain activity

Additionally, Engine is built on top of the thirdweb SDK and has the same capabilities.

### Using Engine

#### How do I wait for a transaction to be mined?

Write calls to contracts do not block until they are mined. Instead they enqueue an async job and immediately return a reference to the job called `queueId`.

Here are three ways to determine when the job is mined:

* Use [webhooks](https://portal.thirdweb.com/engine/features/webhooks) to notify your backend when a transaction event occurs.
* Poll the `/transaction/status/<queue_id>` endpoint.
* Use websockets:  
```js  
const socket = new WebSocket(  
  "wss://<engine_url>/transaction/status/<queue_id>?token=<session_token>",  
);  
socket.onmessage = (event) => {  
  const res = JSON.parse(event.data);  
  console.log("Received data:", JSON.parse(res.result));  
};  
```

#### How do I send native currency with my transaction?

To send native tokens (e.g. ETH on Ethereum), set `txOverrides.value`. This may be required when calling a `payable` contract method.

Here's an example of sending 0.2 ETH:

```json
{
  // ...other arguments in the write transaction
 
  "txOverrides": {
    "value": "200000000000000000"
  }
}
```

#### How do I override gas settings?

To override the gas settings, set relevant `txOverrides` gas fields. Each field is optional and will be estimated by Engine if omitted.

Here's an example of setting a gas limit of 210,000 gas units, 1 gwei max fee, and 1 gwei max priority fee:

```json
{
  // ...other arguments in the write transaction
 
  "txOverrides": {
    "gas": "210000",
    "maxFeePerGas": "1000000000",
    "maxPriorityFeePerGas": "1000000000"
  }
}
```

#### It is highly recommended to set a timeout when setting a maxFeePerGas.

Otherwise if gas prices don't fall, transactions may be in your queue indefinitely.

#### How do I set a timeout on transactions?

To specify a transaction timeout, set `txOverrides.timeoutSeconds`. Engine flags transactions as `errored` if they are not sent before the timeout. An `errored` webhook will be sent.

Note: A transaction sent before the timeout may be mined after the timeout.

Here's an example of a 2-hour timeout:

```json
{
  // ...other arguments in the write transaction
 
  "txOverrides": {
    "timeoutSeconds": 7200
  }
}
```
## InAppWallet.Create

Create an instance of `InAppWallet` using a user's email, phone number or OAuth. This wallet type facilitates secure user authentication through OTP verification, making it suitable for client-facing applications where handling private keys directly is not ideal.

### Login Methods

In-App Wallets support a variety of login methods:

* Email (OTP Login)
* Phone (OTP Login)
* Socials (Google, Apple, Facebook, Telegram, Farcaster, Line, Github, Twitch, Steam etc.)
* Custom Auth (OIDC Compatible)
* Custom Auth (Generic Auth Endpoint)
* Guest (Onboard easily, link other accounts later)
* Backend (Server Wallets)
* Siwe (Login with a seperate wallet supported by the SDK)
* SiweExternal (Login with an external wallet that only supports web using a browser loading a static thirdweb React page temporarily)

### Usage

```csharp
// Email
var wallet = await InAppWallet.Create(client: client, email: "userEmail");
// Phone
var wallet = await InAppWallet.Create(client: client, phoneNumber: "+1234567890");
// Google, Apple, Facebook, etc.
var wallet = await InAppWallet.Create(client: client, authProvider: AuthProvider.Google);
// Custom Auth - JWT
var wallet = await InAppWallet.Create(client: client, authProvider: AuthProvider.JWT);
// Custom Auth - AuthEndpoint
var wallet = await InAppWallet.Create(client: client, authProvider: AuthProvider.AuthEndpoint);
// Guest Login
var wallet = await InAppWallet.Create(client: client, authProvider: AuthProvider.Guest);
// Server Login
var wallet = await InAppWallet.Create(client: client, authProvider: AuthProvider.Backend, walletSecret: "very-secret");
// Siwe
var wallet = await InAppWallet.Create(client: client, authProvider: AuthProvider.Siwe, siweSigner: anyExternalWallet);
// SiweExternal
var wallet = await InAppWallet.Create(client: client, authProvider: AuthProvider.SiweExternal);
 
// Session resuming supported for all methods
var isConnected = await wallet.IsConnected();
 
// If not connected, initiate login flow based on the auth provider you are using
 
// Email & Phone (OTP)
await wallet.SendOTP(); // and fetch the otp
var address = await wallet.LoginWithOtp("userEnteredOTP"); // try catch and retry if needed
 
// Socials (OAuth)
var address = await wallet.LoginWithOauth(
    // Windows console app example, adaptable to any runtime
    isMobile: false,
    browserOpenAction: (url) =>
    {
        var psi = new ProcessStartInfo { FileName = url, UseShellExecute = true };
        _ = Process.Start(psi);
    },
    mobileRedirectScheme: "myBundleId://"
);
 
// Custom Auth (JWT)
var address = await wallet.LoginWithCustomAuth(jwt: "myjwt");
 
// Custom Auth (AuthEndpoint)
var address = await wallet.LoginWithAuthEndpoint(payload: "mypayload");
 
// Guest Login (Easy onboarding)
var address = await wallet.LoginWithGuest();
 
// Backend (Server Wallets)
var address = await wallet.LoginWithBackend();
 
// SIWE (Wallet)
var address = await siweWallet.LoginWithSiwe(chainId: 1);
 
// SiweExternal (React-only wallet)
var address = await wallet.LoginWithSiweExternal(
    // Windows console app example, adaptable to any runtime
    isMobile: false,
    browserOpenAction: (url) =>
    {
        var psi = new ProcessStartInfo { FileName = url, UseShellExecute = true };
         _ = Process.Start(psi);
    },
    forceWalletIds: new List<string> { "io.metamask", "com.coinbase.wallet", "xyz.abs" }
);
```

##### Parameters

#### client (required)

An instance of `ThirdwebClient`.

#### email (optional)

The user's email address. Required if `phoneNumber` is not provided.

#### phoneNumber (optional)

The user's phone number. Required if `email` is not provided.

#### authProvider (optional)

The OAuth provider to use for authentication. Supported values are `AuthProvider.Google`, `AuthProvider.Apple`, `AuthProvider.Facebook`.

#### storageDirectoryPath (optional)

The path to the directory where the wallet data is stored. Defaults to the application's data directory.

#### siweSigner (optional)

An external wallet instance to use for SIWE authentication.

#### legacyEncryptionKey (optional)

The encryption key that is no longer required but was used in the past. Only pass this if you had used custom auth before this was deprecated.

#### walletSecret (optional)

The secret identifier to use when creating server-side wallets with backend authentication.

##### Return Value

#### InAppWallet

Returns an instance of InAppWallet, initialized for the user based on the provided email or phone number. This wallet is ready for OTP authentication and further blockchain interactions.

### Authentication, Linking and more.

`InAppWallet` extends `EcosystemWallet`, refer to the [EcosystemWallet](https://portal.thirdweb.com/dotnet/wallets/providers/ecosystem-wallet) documentation for information about authentication, linking multiple auth providers to the same wallet, and more. All functionality outside of creation and third-party integrations is the same as `EcosystemWallet`.
## Access Tokens

Manage API access to your Engine instance. Access tokens are valid until deleted.

#### Create an access token

Grant API access to your Engine instance with long-lived access tokens.

* Navigate to the [thirdweb engine dashboard](https://thirdweb.com/team/~/~/engine) and select your engine
* Select **Access Tokens**.
* Select **Create Access Token**.

Provide the header `Authorization: Bearer <access_token>` when calling the Engine API.

#### An access token is only shown once!

Securely store access tokens and remove them if they are compromised.

#### Delete an access token

* Navigate to the [thirdweb engine dashboard](https://thirdweb.com/team/~/~/engine) and select your engine
* Select **Access Tokens**.
* Next to an access token, select **... > Delete**.

### FAQ

##### How do I generate short-lived access tokens?

Consider using [Keypair Authentication](https://portal.thirdweb.com/engine/features/keypair-authentication) (advanced feature).
## Admins

Manage access to your Engine instance.

### Add an admin

* Navigate to the [Engine dashboard page](https://thirdweb.com/team/~/~/engine) and select your engine.
* Select the **Permissions** tab.
* Under **Admins**, select **Add New Admin**.
* Provide the wallet address owned by the user to add.

The user with this wallet address can now manage your Engine instance.

### Remove an admin

* Navigate to the [Engine dashboard page](https://thirdweb.com/team/~/~/engine) and select your engine.
* Select the **Permissions** tab.
* Next to an existing admin, select **... > Remove**.
## Alert Notifications

All cloud-hosted Engine instances (running `v2.0.10` or later) can now configure alert notifications to be notified when an issue is detected on your Engine instance.

### Add an alert

* Go to [Engine dashboard](https://thirdweb.com/team/~/~/engine) and select your engine.
* Navigate to the new _Alerts_ tab.
* Select _Create Alert_.  
   * If the button is disabled, see below.
* Select the type of alert and how to be notified. Currently the following are supported:  
   * Alert types: Elevated 5xx rate, stuck nonce  
   * Notification types: Webhook, Slack, Email
* Select _Add Alert_.

![Add alert](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fadd-alert.2f67ff3e.png&w=2048&q=75)

##### Why is my Create Alert button is disabled?

At this time only the original admin (the account which deployed the cloud-hosted Engine) can view and manage alerts. This is usually the first admin address listed on the Admins tab. We plan to expand alert management to all admins in the near future.

### View alert history

You can also view recently fired/resolved alerts on the _Alerts_ tab.

![Recent alerts](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Frecent-alerts.5bcf7222.png&w=3840&q=75)
## Account Abstraction

#### Looking to use account abstraction for your backend operations?

Consider using [Smart Backend Wallets](https://portal.thirdweb.com/engine/features/backend-wallets#smart-backend-wallets) instead. They combine EOA and smart account management into a single wallet, with automatic deployment and simplified integration:

* No need to deploy or manage account factories
* No separate account and backend wallet addresses to track
* Works with all existing Engine endpoints without modification
* Built-in transaction batching and recovery
* Automatic gas management with paymaster

Smart backend wallets are recommended when you need account abstraction for your own backend operations. Use the approach described below when you need to manage smart accounts for your users.

Use Engine to deploy, manage, and transact with smart accounts on behalf of your users.

### Deploy an account factory

To deploy smart accounts (referred to as "accounts" from here on), deploy an `AccountFactory` contract. This contract handles deploying individual `Account` contracts for your users.

**Endpoint:** `POST /deploy/<chain>/deployer.thirdweb.eth/AccountFactory`

**Payload:**

```json
{
	"constructorParams": [
		"<default_admin>",
		"0x5FF137D4b0FDCD49DcA30c7CF57E578a026d2789"
	] // <default_admin> should be your backend-wallet-address
}
```

### Deploy user accounts

Once the factory is set up, deploy accounts for your users.

**Endpoint:** `POST /contract/<chain>/<account_factory_address>/account-factory/create-account`

**Body:**

```json
{
	"adminAddress": "0x..." // The user's wallet address to deploy a smart wallet for
}
```

This adds the `adminAddress` as the primary admin that can act on behalf of the newly deployed account.

To control the account with a backend wallet, specify the backend wallet in the `adminAddress` field.

### Grant permissions and sessions

Grant & revoke admins on an account with the `/contract/<chain>/<account_address>/account/admins` endpoints.

Grant & revoke sessions on an account which allow specific wallets to interact with specified contracts for a given period of time with the `/contract/<chain>/<account_address>/account/sessions` endpoints.

### Transact with an account using session keys

Make write calls with a smart account by calling a write endpoint and specify the `x-backend-wallet-address` and `x-account-address` headers.

The `x-backend-wallet-address` should be set to the Engine backend wallet that has been granted signing permission by the smart account's admin through a [session key](https://portal.thirdweb.com/references/typescript/v5/erc4337/addSessionKey).

The `x-account-address` should be set to the deployed smart account address itself.

Write calls made using these headers will initiate a `UserOperation` sent from the specified account.
## EcosystemWallet.Create

Create an instance of `EcosystemWallet` using a user's email, phone number or OAuth. This wallet type facilitates secure user authentication through OTP verification, making it suitable for client-facing applications where handling private keys directly is not ideal.

### Login Methods

Ecosystem Wallets support a variety of login methods:

* Email (OTP Login)
* Phone (OTP Login)
* Socials (Google, Apple, Facebook, Telegram, Farcaster, Line, Github, Twitch, Steam etc.)
* Custom Auth (OIDC Compatible)
* Custom Auth (Generic Auth Endpoint)
* Guest (Onboard easily, link other accounts later)
* Backend (Server Wallets)
* Siwe (Login with a seperate wallet supported by the SDK)
* SiweExternal (Login with an external wallet that only supports web using a browser loading a static thirdweb React page temporarily)

### Usage

```csharp
// NOTE: All creation examples below may take in an `ecosystemPartnerId` if you are the ecosystem partner integrating with a third-party ecosystem
 
// Email
var wallet = await EcosystemWallet.Create(client: client, ecosystemId: "ecosystem.my-ecosystem", email: "userEmail");
// Phone
var wallet = await EcosystemWallet.Create(client: client, ecosystemId: "ecosystem.my-ecosystem", phoneNumber: "+1234567890");
// Google, Apple, Facebook, etc.
var wallet = await EcosystemWallet.Create(client: client, ecosystemId: "ecosystem.my-ecosystem", authProvider: AuthProvider.Google);
// Custom Auth - JWT
var wallet = await EcosystemWallet.Create(client: client, ecosystemId: "ecosystem.my-ecosystem", authProvider: AuthProvider.JWT);
// Custom Auth - AuthEndpoint
var wallet = await EcosystemWallet.Create(client: client, ecosystemId: "ecosystem.my-ecosystem", authProvider: AuthProvider.AuthEndpoint);
// Guest Login
var wallet = await EcosystemWallet.Create(client: client, ecosystemId: "ecosystem.my-ecosystem", authProvider: AuthProvider.Guest);
// Server Login
var wallet = await EcosystemWallet.Create(client: client, ecosystemId: "ecosystem.my-ecosystem", authProvider: AuthProvider.Backend, walletSecret: "very-secret");
// Siwe
var wallet = await EcosystemWallet.Create(client: client, ecosystemId: "ecosystem.my-ecosystem", authProvider: AuthProvider.Siwe, siweSigner: anyExternalWallet);
// SiweExternal
var wallet = await EcosystemWallet.Create(client: client, ecosystemId: "ecosystem.my-ecosystem", authProvider: AuthProvider.SiweExternal);
 
// Session resuming supported for all methods
var isConnected = await wallet.IsConnected();
 
// If not connected, initiate login flow based on the auth provider you are using
 
// Email & Phone (OTP)
await wallet.SendOTP(); // and fetch the otp
var address = await wallet.LoginWithOtp("userEnteredOTP"); // try catch and retry if needed
 
// Socials (OAuth)
var address = await wallet.LoginWithOauth(
    // Windows console app example, adaptable to any runtime
    isMobile: false,
    browserOpenAction: (url) =>
    {
        var psi = new ProcessStartInfo { FileName = url, UseShellExecute = true };
        _ = Process.Start(psi);
    },
    mobileRedirectScheme: "myBundleId://"
);
 
// Custom Auth (JWT)
var address = await wallet.LoginWithCustomAuth(jwt: "myjwt");
 
// Custom Auth (AuthEndpoint)
var address = await wallet.LoginWithAuthEndpoint(payload: "mypayload");
 
// Guest Login (Easy onboarding)
var address = await wallet.LoginWithGuest();
 
// Backend (Server Wallets)
var address = await wallet.LoginWithBackend();
 
// SIWE (Wallet)
var address = await siweWallet.LoginWithSiwe(chainId: 1);
 
// SiweExternal (React-only wallet)
var address = await wallet.LoginWithSiweExternal(
    // Windows console app example, adaptable to any runtime
    isMobile: false,
    browserOpenAction: (url) =>
    {
        var psi = new ProcessStartInfo { FileName = url, UseShellExecute = true };
         _ = Process.Start(psi);
    },
    forceWalletIds: new List<string> { "io.metamask", "com.coinbase.wallet", "xyz.abs" }
);
```

##### Parameters

#### client (required)

An instance of `ThirdwebClient`.

#### ecosystemId (required)

The ID of the ecosyste wallet you created on the dashboard.

#### ecosystemPartnerId (optional)

The partner ID you were provided by the Ecosystem owner.

#### email (optional)

The user's email address. Required if `phoneNumber` is not provided.

#### phoneNumber (optional)

The user's phone number. Required if `email` is not provided.

#### authProvider (optional)

The OAuth provider to use for authentication. Supported values are `AuthProvider.Google`, `AuthProvider.Apple`, `AuthProvider.Facebook`.

#### storageDirectoryPath (optional)

The path to the directory where the wallet data is stored. Defaults to the application's data directory.

#### siweSigner (optional)

An external wallet instance to use for SIWE authentication.

#### legacyEncryptionKey (optional)

The encryption key that is no longer required but was used in the past. Only pass this if you had used custom auth before this was deprecated.

#### walletSecret (optional)

The secret identifier to use when creating server-side wallets with backend authentication.

##### Return Value

#### EcosystemWallet

Returns an instance of EcosystemWallet, initialized for the user based on the provided email or phone number. This wallet is ready for OTP authentication and further blockchain interactions.

### OTP Authentication Flow

The OTP authentication flow involves sending an OTP to the user's email or phone and then verifying the OTP to complete authentication:

**Send OTP:** Initiate the login process by calling SendOTP on the EcosystemWallet instance. This sends an OTP to the user's email or phone number.

```csharp
await wallet.SendOTP();
```

**Submit OTP:** Once the user receives the OTP, they submit it back to the application, which then calls LoginWithOtp on the EcosystemWallet instance to verify the OTP and complete the login process.

```csharp
var address = await wallet.LoginWithOtp("userEnteredOTP");
// If this fails, feel free to catch and take in another OTP and retry the login process
```

### Example

Here's an example of creating an `EcosystemWallet` with a user's email and completing the OTP authentication flow:

```csharp
// Create EcosystemWallet wallet as signer to unlock web2 auth
var ecosystemWallet = await EcosystemWallet.Create(client: client, ecosystemId: "ecosystem.my-ecosystem", email: "email@email.com"); // or email: null, phoneNumber: "+1234567890"
 
// Resume session (if `EcosystemWallet` wallet was not logged in)
if (!await ecosystemWallet.IsConnected())
{
    await ecosystemWallet.SendOTP();
    Console.WriteLine("Please submit the OTP.");
    var otp = Console.ReadLine();
    var ecosystemWalletAddress = await ecosystemWallet.LoginWithOtp(otp); // try catch and retry if needed
}
 
Console.WriteLine($"EcosystemWallet address: {await ecosystemWallet.GetAddress()}");
 
// Sign a message
var message = "Hello, Thirdweb!";
var signature = await wallet.PersonalSign(message);
Console.WriteLine($"Signature: {signature}");
```

**Note:** EcosystemWallet leverages the security of OTP-based authentication to ensure a secure and user-friendly experience in blockchain applications.

### OAuth Authentication Flow

**LoginWithOauth:** Initiate the login process by calling LoginWithOauth on the EcosystemWallet instance. This redirects the user to the OAuth provider's login page.

```csharp
// Windows console app example
var address = await ecosystemWallet.LoginWithOauth(
    isMobile: false,
    browserOpenAction: (url) =>
    {
        var psi = new ProcessStartInfo { FileName = url, UseShellExecute = true };
        _ = Process.Start(psi);
    },
);
// Godot standalone example
var address = await ThirdwebManager.Instance.EcosystemWallet.LoginWithOauth(
        isMobile: OS.GetName() == "Android" || OS.GetName() == "iOS",
        browserOpenAction: (url) => OS.ShellOpen(url),
        mobileRedirectScheme: "thirdweb://"
);
```

##### Parameters

#### isMobile

A `bool` indicating whether the application is running on a mobile platform.

#### browserOpenAction

An `Action<string>` that opens the OAuth provider's login page in a browser.

#### mobileRedirectScheme

The redirect scheme to use for mobile platforms. Defaults to `"thirdweb://"`.

#### browser

An instance of `IThirdwebBrowser` to use for the OAuth login process. Defaults to `null`.

#### cancellationToken

A `CancellationToken` to cancel the operation. Defaults to `default`.

##### Return Value

#### string

The EcosystemWallet address as a hexadecimal `string`.

### Example

Here's an example of creating an `EcosystemWallet` using OAuth.

```csharp
// Create EcosystemWallet wallet as signer to unlock web2 auth
var ecosystemWallet = await EcosystemWallet.Create(client: client, ecosystemId: "ecosystem.my-ecosystem", authProvider: AuthProvider.Google);
 
// Resume session (if `EcosystemWallet` wallet was not logged in)
if (!await ecosystemWallet.IsConnected())
{
    try {
        var address = await ecosystemWallet.LoginWithOauth(
            isMobile: false,
            browserOpenAction: (url) =>
            {
                var psi = new ProcessStartInfo { FileName = url, UseShellExecute = true };
                _ = Process.Start(psi);
            },
        );
        Console.WriteLine($"OAuth login successful. EcosystemWallet address: {address}");
    } catch (Exception ex) {
        Console.WriteLine($"OAuth login failed: {ex.Message}");
        return;
    }
}
```

**Note:** The `LoginWithOauth` API allows for custom browser handling, making it suitable for various application types and platforms.

### External Wallet Auth (Siwe & SiweExternal)

**LoginWithSiwe:** Initiate the login process by calling LoginWithSiwe on the EcosystemWallet instance. This will prompt the external wallet to sign a message instantly.

```csharp
var address = await siweWallet.LoginWithSiwe(chainId: 1);
```

**LoginWithSiweExternal:** Initiate the login process by calling LoginWithSiweExternal on the EcosystemWallet instance. This will initiate a browser-based login flow for external wallets that only support web platforms.

```csharp
var address = await wallet.LoginWithSiweExternal(
    // Windows console app example, adaptable to any runtime
    isMobile: false,
    browserOpenAction: (url) =>
    {
        var psi = new ProcessStartInfo { FileName = url, UseShellExecute = true };
        _ = Process.Start(psi);
    },
    forceWalletIds: new List<string> { "io.metamask", "com.coinbase.wallet", "xyz.abs" }
);
```

Note: The parameters are similar to the OAuth flow, with the addition of `forceWalletIds` to specify the wallet IDs to force the user to use. Using a single wallet id will skip the wallet selection screen and directly open the wallet.

### Unified Identity - Account Linking

EcosystemWallet supports linking multiple authentication methods to a single user account. This feature enables users to access their account using different authentication methods, such as email, phone, or OAuth, without creating separate accounts for each method.

#### Linking Accounts

```csharp
var ecosystemWalletMain = await EcosystemWallet.Create(client: client, ecosystemId: "ecosystem.my-ecosystem", authProvider: AuthProvider.Google);
if (!await ecosystemWalletMain.IsConnected())
{
    _ = await ecosystemWalletMain.LoginWithOauth(
        isMobile: false,
        (url) =>
        {
            var psi = new ProcessStartInfo { FileName = url, UseShellExecute = true };
            _ = Process.Start(psi);
        },
        "thirdweb://",
        new EcosystemWalletBrowser()
    );
}
Console.WriteLine($"Main EcosystemWallet address: {await ecosystemWalletMain.GetAddress()}");
 
// Prepare Telegram
var socialWallet = await EcosystemWallet.Create(client: client, ecosystemId: "ecosystem.my-ecosystem", authProvider: AuthProvider.Telegram);
// Link Telegram
_ = await ecosystemWalletMain.LinkAccount(walletToLink: socialWallet,);
 
// Prepare Phone
var phoneWallet = await EcosystemWallet.Create(client: client, ecosystemId: "ecosystem.my-ecosystem", phoneNumber: "+1234567890");
_ = await phoneWallet.SendOTP();
var otp = Console.ReadLine();
// Link Phone
_ = await ecosystemWalletMain.LinkAccount(walletToLink: phoneWallet, otp: otp);
```

#### Getting Linked Accounts

```csharp
List<LinkedAccount> linkedAccounts = await ecosystemWalletMain.GetLinkedAccounts();
```

#### Unlinking Accounts

```csharp
List<LinkedAccount> linkedAccounts = await ecosystemWallet.GetLinkedAccounts();
List<LinkedAccount> linkedAccountsAfterUnlinking = await ecosystemWallet.UnlinkAccount(linkedAccounts[0]);
```
## Cancelling Transactions

Engine submits transactions to the blockchain within 5-10 seconds of receiving a request. During gas or traffic spikes, transactions may take longer to be mined.

In some cases, your application may want to cancel the transaction, such as:

* The transaction was sent in error.
* An NFT collection's supply has run out.
* The transaction's exchange rate has changed and should be re-attempted with a new exchange rate.

When Engine receives a cancellation request:

* If the transaction is completed (mined, errored, or canceled), this endpoint returns an error.
* If the transaction is already submitted to RPC, this endpoint sends a no-op transaction with aggressive gas options to "replace" the original transaction.
* If the transaction is not yet submitted, this endpoint will remove it from the queue.

**When canceled, the transaction will not be re-attempted.** Your backend may safely re-attempt this transaction.

### Cancel a transaction from the API

```typescript
// queueId was returned from a previous write request.
 
const resp = await fetch("<engine_url>/transaction/cancel", {
  method: "POST",
  headers: {
    "Content-Type": "application/json",
    Authorization: "Bearer <access_token>",
  },
  body: JSON.stringify({ queueId }),
});
if (resp.status === 200) {
  console.log(`Transaction ${queueId} was canceled.`);
}
```

Reference: [Cancel Transaction](https://thirdweb-engine.apidocumentation.com/reference#tag/transaction/POST/transaction/cancel)

### Cancel a transaction from the dashboard

Select the **Cancel** icon next to a queued transaction in the Tranasctions table.

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fcancel-transaction-button.f4f195ce.png&w=3840&q=75)

### Cancel all queued transactions

Coming soon.
## Backend Wallets

Engine performs blockchain actions using backend wallets that you own and manage.

There are multiple options for securing backend wallets.

### Smart Backend Wallets

Smart backend wallets are the recommended way to perform blockchain operations with Engine. Each smart backend wallet consists of an EOA (managed internally by Engine) and a smart account (using thirdweb's default account implementation).

#### Benefits

Smart backend wallets inherit smart account benefits and offer several advantages over traditional EOAs:

* **Gas Management**: Built-in paymaster eliminates the need to maintain gas tokens. This means you never need to hold crypto or top up gas.
* **Better Nonce Management**: Smart accounts use multi-dimensional nonces, which are more efficient than EOAs.
* **Simple Integration**: Works with all existing Engine endpoints without any code changes.

#### How it works

The smart account is automatically deployed the first time you send a transaction on a chain. You don't need to think about deploying or managing the smart account - Engine handles everything behind the scenes. All transactions are sent as UserOperations to the EntryPoint contract on chain.

##### How are Smart Backend Wallets different from existing engine AA features?

Unlike the [previous account abstraction implementation in Engine](account-abstraction) where you had to manage both the account address (`x-account-address`) and the backend wallet address (`x-backend-wallet-address`) separately, smart backend wallets simplify this. The backend wallet address is now the smart account address itself.

##### When not to use Smart Backend Wallets?

At this time, Smart Backend Wallets do not allow for importing a smart account. In use cases where you need to import a smart account (such as with session keys), you should use [Engine AA features that utilise thex-account-address header](account-abstraction).

#### Configuration Types

* `smart:local` \- Smart account backed by a local key
* `smart:aws-kms` \- Smart account backed by AWS KMS
* `smart:gcp-kms` \- Smart account backed by Google Cloud KMS
* `smart:circle` \- Smart account backed by Circle Developer-Controlled Wallets

For AWS and Google Cloud KMS options, follow the setup instructions in the respective sections below.

#### Pricing

Smart backend wallets have no additional costs to use with your Engine instance. Transactions sent from smart backend wallets follow the [same billing model as regular account abstraction transactions with thirdweb](https://portal.thirdweb.com/connect/account-abstraction/infrastructure#pricing--billing). Smart accounts need to be deployed on each chain. This costs gas and is billed to your account like any other transaction.

### Local wallet

A local wallet is a wallet created or imported from a private key. Ensure your private key is backed up before transacting with a local wallet in a production environment.

> Local wallets private keys are stored encrypted in Engine's database. For security reasons, private keys cannot be exported.

### AWS KMS wallet

An AWS KMS Wallet is a wallet securely stored in your AWS account. Engine can create and transact with the wallet, but not delete it.

##### Setup

* [Create an IAM user](https://docs.aws.amazon.com/IAM/latest/UserGuide/id%5Fusers%5Fcreate.html#id%5Fusers%5Fcreate%5Fconsole) with programmatic access.
* [Grant the following KMS permissions](https://docs.aws.amazon.com/kms/latest/developerguide/control-access.html) to this user.  
   * `kms:CreateKey`  
   * `kms:GetPublicKey`  
   * `kms:Sign`  
   * `kms:CreateAlias`  
   * `kms:Verify`
* On the user page, navigate to **Security credentials > Access keys**.
* Select **Create access key** to get an **Access Key** and **Secret Key**.
* In the dashboard, navigate to **Configuration > Backend Wallets**.
* Select **AWS KMS** and provide the following:  
   * Access Key (example: `AKIA...`)  
   * Secret Key (example: `UW7A...`)  
   * Region (example: `us-west-1`)

##### Import an existing wallet

* Ensure your [KMS key is created](https://docs.aws.amazon.com/kms/latest/developerguide/create-keys.html) with the following settings:  
   * Key type: `Asymmetric`  
   * Key spec: `ECC_SECG_P256K1`  
   * Key usage: `Sign and verify`
* In the dashboard, navigate to **Overview > Backend Wallets**.
* Select **Import** and provide the following:  
   * AWS KMS Key ID (example: `0489da75-9830-4a5a-97e3-e4a6df7775b3`)  
   * AWS KMS ARN (example: `arn:aws:kms:us-west-1:632186309261:key/0489da75-9830-4a5a-97e3-e4a6df7775b3`)

### Google Cloud KMS wallet

##### Setup

* [Enable Google KMS API](https://cloud.google.com/kms/docs/create-encryption-keys#before-you-begin) for your GCP account.
* [Create a Service Account](https://cloud.google.com/iam/docs/service-accounts-create).
* Navigate to the [IAM](https://console.cloud.google.com/iam-admin/iam) page. Find the service account and select **Edit Principal** to add the following roles:  
   * Cloud KMS Admin  
   * Cloud KMS CryptoKey Signer/Verifier
* Navigate to the [Service Accounts](https://console.cloud.google.com/iam-admin/serviceaccounts) page. Select the above service account.
* Navigate to the **Keys** tab. Select **Add Key > Create new key**.
* Select **JSON** to download the JSON file. This file contains the key's private key in plaintext.
* In the dashboard, navigate to **Configuration > Backend Wallets**.
* Select **Google KMS** and provide the following:  
##### gcpApplicationProjectId  
This is the Project ID of the GCP project where the key was created.  
**Where to find**:  
   * Navigate to the Google Cloud Console.  
   * Click on the project dropdown at the top of the page.  
   * The Project ID is displayed under your project's name.  
##### gcpKmsLocationId  
This is the location where the keyring was created (e.g., us-central1, europe-west1).  
**Where to find**:  
   * In the Google Cloud Console, go to **Security > Cryptographic Keys**.  
   * Click on the keyring that contains your key.  
   * The location is displayed in the Location field.  
##### gcpKmsKeyRingId  
This is the ID of the keyring where your key is stored.  
**Where to find**:  
   * In the Google Cloud Console, go to **Security > Cryptographic Keys**.  
   * Select the keyring that contains your key.  
   * The KeyRing ID is displayed in the list or the URL.  
##### gcpApplicationCredentialEmail  
This is the email associated with the service account used for accessing the KMS key.  
**Where to find**:  
   * In the Google Cloud Console, go to **IAM & Admin > Service Accounts**.  
   * Find the service account you are using. its email will be in the format: `name@project.iam.gserviceaccount.com`  
##### gcpApplicationCredentialPrivateKey  
This is the private key of the service account that is used for authenticating API requests.  
**Where to find**:  
   * Open the JSON file downloaded above.  
   * Copy the value of the `private_key` field.

##### Import an existing wallet

* Ensure your [keyring is created](https://cloud.google.com/kms/docs/create-key-ring) with the following settings:  
   * Purpose: `Asymmetric sign`  
   * Algorithm: `Elliptic Curve P-256 - SHA256 Digest`
* In the dashboard, navigate to **Overview > Backend Wallets**.
* Select **Import** and provide the following:  
   * GCP KMS Key ID (example: `0489da75-9830-4a5a-97e3-e4a6df7775b3`)  
   * GCP KMS Version ID (example: `1`)

### Circle Wallet

[Circle Programmable Wallets](https://developers.circle.com/w3s/programmable-wallets) is a Wallet as a Service (WaaS) solution designed to simplify the creation and management of secure Web3 wallets and their private keys. Engine can create and transact with the wallet, but not delete it.

##### Setup

* Create a Circle account at the [Circle Console](https://console.circle.com/signin).
* Navigate to [API & Client Keys](https://console.circle.com/api-keys).
* Create an API Key. (Either a standard key or a restricted key scoped to "Programmable Wallets" is required.) Do not enable the IP Allowlist. Store this key, it is not shown again.
* In the dashboard, navigate to **Configuration > Backend Wallets**.
* Select **Circle** and provide the following:  
   * API Key (example: `API_KEY:...`)

Circle API Keys are scoped to either Testnet or Mainnet. Backend wallets created with a testnet key will not work on the mainnet, and vice versa  
 If you want to change between testnet and mainnet, you will need to update the API key configuration in engine, and recreate a wallet with the Mainnet scope.

### Create a wallet

For AWS or Google Cloud KMS wallets, you must provide your credentials.

* In the dashboard, navigate to **Overview > Backend Wallets**.
* Select **Create**.
* (Optional) Provide a label to organize your wallets.

Circle wallets require creating a [Credential](https://portal.thirdweb.com/engine/features/wallet-credentials) first before creating a wallet.

### Import a wallet

For AWS or Google Cloud KMS wallets, you must provide your credentials.

* In the dashboard, navigate to **Overview > Backend Wallets**.
* Select **Import**.
* Provide the requested fields.  
   * See above for instructions for specific wallet types.

### List wallets

In the dashboard, navigate to **Overview > Backend Wallets** to view your wallets created by or imported to Engine.

### Best practices

* It is recommend to use AWS or Google Cloud KMS wallets for production use. Private keys are never exposed and the wallet is backed up securely by the cloud provider.
* Use labels and multiple backend wallets to organize and track usage.  
   * Example: Use one wallet to pay out creators on your platform and another to airdrop NFTs to users.
* If your wallets require topping up gas or ERC20 tokens regularly, consider a separate "funds storage" backend wallet that transfers funds to other wallets via the dashboard UI or API.
## Contracts

Call or deploy contracts from your backend wallet to any EVM blockchain with one API call.

### Write to a contract

> This request requires gas funds in the backend wallet.

```ts
const resp = await fetch(
  "<engine_url>/contract/<chain>/<contract_address>/write",
  {
    method: "POST",
    headers: {
      "Content-Type": "application/json",
      Authorization: "Bearer <access_token>",
      "x-backend-wallet-address": "<backend_wallet_address>",
    },
    body: JSON.stringify({
      functionName: "transferFrom",
      args: [
        "0x1946267d81Fb8aDeeEa28e6B98bcD446c8248473",
        "0x3EcDBF3B911d0e9052b64850693888b008e18373",
        "0",
      ],
    }),
  },
);
 
const { result } = await resp.json();
// queueId is a reference to the transaction queued by Engine.
console.log("Queue ID:", result.queueId);
```

##### Handling overloaded functions

If there are multiple signatures for `functionName` on the contract, provide the full signature with args.

**Example**

Your contract has two functions named `mintTo`:

```solidity
function mintTo(address to) public
```

```solidity
function mintTo(address to, uint256 quantity) public
```

This is the request body to call the second function:

```json
{
  "functionName": "mintTo(address, uint256)",
  "args": [
    "0x4Ff9aa707AE1eAeb40E581DF2cf4e14AffcC553d",
    "3"
  ]
}
```

[See API reference](https://thirdweb-engine.apidocumentation.com/reference#tag/contract/POST/contract/%7Bchain%7D/%7BcontractAddress%7D/write)

#### Call a payable method

To send native tokens to a payable method (e.g. ETH on Ethereum), set `txOverrides.value` in the request body to `POST /contract/<chain>/<contract_address>/write`.

```json
{
  "functionName": "...",
  "args": [ ... ],
  "txOverrides": {
    "value": "1000000000000000", // 0.001 ETH in wei
  }
}
```

### Read from a contract

```ts
const resp = await fetch(
  "<engine_url>/contract/<chain>/<contract_address>/read?functionName=balanceOf&args=0x3EcDBF3B911d0e9052b64850693888b008e18373",
  {
    headers: {
      Authorization: "Bearer <access_token>",
    },
  },
);
 
const { result } = await resp.json();
console.log("ERC-20 balance:", result);
```

### Deploy a contract

> This request requires gas funds in the backend wallet.

```ts
const resp = await fetch(
  "<engine_url>/deploy/<chain>/prebuilts/nft-drop",
  {
    method: "POST",
    headers: {
      "Content-Type": "application/json",
      Authorization: "Bearer <access_token>",
      "x-backend-wallet-address": "<backend_wallet_address>",
    },
    body: JSON.stringify({
      contractMetadata: {
        name: "thirdweb Engine example",
        symbol: "eng",
        primary_sale_recipient:
          "0x3EcDBF3B911d0e9052b64850693888b008e18373",
      },
    }),
  },
);
 
const { result } = await resp.json();
// queueId is a reference to the transaction queued by Engine.
console.log("Queue ID:", result.queueId);
```
## Custom Chains

Engine supports all [public EVM chains](https://thirdweb.com/chainlist) and your own custom chains.

You can define chain overrides allowing Engine to look up a chain ID's RPC URL, currency, and other metadata.

### Use Cases

* Allow Engine to interact with your private or custom EVM chain.
* Bring your own RPC URL for an existing EVM chain.

### Add a custom chain

When adding a chain override, Engine will use the provided chain metadata for the given chain ID.

#### How to override a chain RPC URL

To override a chain's RPC URL, provide the same chain ID as an existing chain and a new RPC URL.

**Endpoint**

`POST /configuration/chains`

**Headers**

* `Authorization: Bearer <engine_access_token>`
* `Content-Type: application/json`

**Body**

```json
{
  "chainOverrides": [
    {
      "name": "My Custom Chain",
      "chain": "ETH",
      "rpc": [
        "https://my-custom-rpc-url.com"
      ],
      "nativeCurrency": {
        "name": "Ether",
        "symbol": "ETH",
        "decimals": 18
      },
      "chainId": 678,
      "slug": "my-custom-chain"
    }
  ]
}
```

Reference: [POST /configuration/chains](https://engine-api.thirdweb.com/reference#tag/configuration/POST/configuration/chains)

### View custom chains

Call Engine to [get a chain's metadata](https://engine-api.thirdweb.com/reference#tag/chain/GET/chain/get) or [view all chain overrides](https://engine-api.thirdweb.com/reference#tag/configuration/GET/configuration/chains).

### Limitations

* **When calling the Engine API for a custom chain, provide the chain ID and not the chain slug.** Chain slugs are only supported for public chains.
* Since Engine may be unable to resolve the ABI for your contract automatically, provide the ABI manually to call contract methods. We recommend providing the full function signature:  
```json  
POST /contract/:chainId/:address/write  
{  
	"functionName": "function setTokenURI(string uri)",  
	"args": ["ipfs://..."]  
}  
```  
   * Due to this reason, extension endpoints like `erc721/transfer` may not be supported for custom chains.

### Add custom chains to the thirdweb dashboard

While you may interact with your custom chain from the Engine dashboard, the UI may not support your custom chain yet. To add it to the dashboard, follow these steps:

![Add custom chain](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fadd-custom-chain-1.77ddb307.png&w=1080&q=75)

![Add custom chain](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fadd-custom-chain-2.223a41d2.png&w=1920&q=75)

![Add custom chain](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fadd-custom-chain-3.2a5e26e1.png&w=1920&q=75)

![Add custom chain](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fadd-custom-chain-4.fa9eaf59.png&w=1920&q=75)
## Contract Subscriptions

Receive webhooks for any transaction log or receipt on any contract.

A **log** is an event emitted from a successfully executed transaction. Example: a burned NFT emits a `Transfer OWNER -> 0x000...` log.

A **receipt** contains onchain details for any transaction. This may be useful for tracking onchain failures (reverted executions).

### Use cases

Your app may trigger an action when an onchain event occurs, such as:

* ETH or an ERC20 currency is transferred to or from a wallet.
* An token is minted from your NFT collection.
* An token in your NFT collection is burned or transferred.
* Metadata for an oracle contract is updated.

### Manage Contract Subscriptions

##### Add a Contract Subscription

* Navigate to the [thirdweb engine dashboard](https://thirdweb.com/team/~/~/engine) and select your engine.
* Select **Contract Subscriptions**.
* Select **Add Contract Subscription**.
* Provide a webhook URL.

API reference: [POST /contract-subscriptions/add](https://thirdweb-engine.apidocumentation.com/reference#tag/contract-subscriptions/POST/contract-subscriptions/add)

##### Remove a Contract Subscription

* Navigate to the [thirdweb engine dashboard](https://thirdweb.com/team/~/~/engine) and select your engine.
* Select **Contract Subscriptions**.
* Select **... > Remove** next to an existing subscription.

API reference: [POST /contract-subscriptions/remove](https://thirdweb-engine.apidocumentation.com/reference#tag/contract-subscriptions/POST/contract-subscriptions/remove)

### Handling webhooks

Engine will call your webhook URL with event logs and transaction details for your specified contract(s).

##### Example webhook body

##### Event log

```json
{
  "type": "event-log",
  "data": {
    "chainId": 8453,
    "contractAddress": "0xcf205808ed36593aa40a44f10c7f7c2f67d4a4d4",
    "blockNumber": 14306496,
    "transactionHash": "0xdd73fc70754b6cb5238c33657b382e397aae635a8f9a3b26abe5f336059d0a40",
    "topics": [
      "0x2c76e7a47fd53e2854856ac3f0a5f3ee40d15cfaa82266357ea9779c486ab9c3"
    ],
    "data": "0x000000000000000000000000c60bf6eec03b33e1d02943348aaf8a5a3e6af4a80000000000000000000000004e5d89e10beafb7a49a03d136e7bb8e9519f4950000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000010000000000000000000000000000000000000000000000000000e35fa931a00000000000000000000000000000000000000000000000000000000b5e620f480000000000000000000000000000000000000000000000000000000b5e620f48000000000000000000000000000000000000000000000000000000000000000002",
    "eventName": "Trade",
    "decodedLog": {
      "isBuy": {
        "type": "bool",
        "value": "false"
      },
      "supply": {
        "type": "uint256",
        "value": "2"
      },
      "trader": {
        "type": "address",
        "value": "0xC60bf6EEc03B33E1D02943348AAf8A5a3E6Af4A8"
      },
      "subject": {
        "type": "address",
        "value": "0x4e5D89e10bEAfb7A49A03d136E7Bb8e9519f4950"
      },
      "ethAmount": {
        "type": "uint256",
        "value": "250000000000000"
      },
      "shareAmount": {
        "type": "uint256",
        "value": "1"
      },
      "subjectEthAmount": {
        "type": "uint256",
        "value": "12500000000000"
      },
      "protocolEthAmount": {
        "type": "uint256",
        "value": "12500000000000"
      }
    },
    "timestamp": 1715402339000,
    "transactionIndex": 33,
    "logIndex": 91
  }
}
```

##### Transaction receipt

```json
{
  "type": "transaction-receipt",
  "data": {
    "chainId": 8453,
    "blockNumber": 14306498,
    "contractAddress": "0xcf205808ed36593aa40a44f10c7f7c2f67d4a4d4",
    "transactionHash": "0xa2cef7ca09ed9d6b6790fcb8556673e0c3e64ab5b2c127509469231454390e9e",
    "blockHash": "0x2302a36de3da9678638e577c35f66c766d5a011512f0644ab0c99a2018a8f2de",
    "timestamp": 1715402343000,
    "data": "0xb51d05340000000000000000000000005d5ecf22298e311815f92e0f5d41ae39148e9fc40000000000000000000000000000000000000000000000000000000000000001",
    "value": "0",
    "to": "0xcf205808ed36593aa40a44f10c7f7c2f67d4a4d4",
    "from": "0xc85077441915d1b0bd9bcf92cf03019710d317d9",
    "transactionIndex": 41,
    "gasUsed": "77523",
    "effectiveGasPrice": "31254333",
    "status": 1
  }
}
```

##### Verifying webhook signatures

See [Webhooks](https://portal.thirdweb.com/engine/features/webhooks) for more information on managing webhooks and verifying webhook signatures.

### FAQ

##### How do I receive multiple webhooks for the same contract address?

Add multiple Contract Subscriptions with different webhooks. Engine will process onchain data once to avoid duplicating work.

##### Can I query data via API?

Not at this time. This feature is on the future roadmap.

##### Do Contract Subscriptions backfill past data?

Not at this time. This feature is on the future roadmap.

##### Why should I use Contract Subscriptions instead of querying the blockchain directly?

Querying RPC nodes for onchain data is slow, unreliable, and costly at scale. RPCs have limits on the number of blocks that can be queried once. Even if your contract has low activity, your app must all blocks in your desired range to get accurate results.

Contract Subscriptions allow your app to query the onchain data you care about from database, which is faster, more reliable, and less costly.

##### How is Contract Subscriptions different than using event listeners with any web3 library?

Event listeners built into web3 libraries are appropriate to listen for real-time results without any persistence or resilience. If your backend request times out or your backend has an outage, event data is missed.

A Contract Subscription continuously poll the blockchain for logs and receipts since the last processed block and stores the results to database. Your app can rely on data to be stored eventually, even when unexpected issues with your backend, Engine, the RPC, or the blockchain occur.
## IThirdwebWallet.Transfer

This method transfers a specified amount of Wei (smallest denomination of Ether) or ERC20s to a specified wallet address on a given chain.

### Usage

```csharp
// Transfer Wei
var receipt = await wallet.Transfer(chainId, toAddress, weiAmount);
// Transfer ERC20
var receipt = await wallet.Transfer(chainId, toAddress, weiAmount, erc20ContractAddress);
```

##### Parameters

#### wallet (required)

An instance of `IThirdwebWallet`. This represents the wallet from which the Wei is being transferred.

#### chainId (required)

The chain ID of the network on which the transfer is to occur.

#### toAddress (required)

The address to which the Wei will be transferred.

#### weiAmount (required)

The amount of Wei to transfer. It must be 0 or greater.

#### erc20ContractAddress (optional)

The contract address of the ERC20 token to transfer. If not provided, the transfer will be in native tokens.

##### Return Value

#### ThirdwebTransactionReceipt

The method returns a `ThirdwebTransactionReceipt` which contains details about the transaction.

### Exceptions

* `ArgumentNullException`: Thrown when the `wallet` is null.
* `ArgumentOutOfRangeException`: Thrown when the `chainId` is less than or equal to 0.
* `ArgumentException`: Thrown when the recipient `toAddress` is null or empty.
* `ArgumentOutOfRangeException`: Thrown when the `weiAmount` is less than 0.
## Gasless Transactions

Attract a broader audience by removing the need to have gas to use your application. Engine offers multiple options for developers looking to sponsor gas for their users' transactions.

### Use cases

* Build an NFT checkout where the buyer is sent an NFT upon fiat payment.
* Enable users to transfer an NFT to a friend or list an NFT on a marketplace.
* Minimize friction by seamlessly managing transactions for players in a web3 game.

### Approaches

Here are several ways to offer gasless transactions to your users.

#### Send transactions with backend wallets

If a contract method can be called on behalf of a user, the simplest approach is to send the transaction from a backend wallet.

Examples:

* An NFT contract that can be claimed _by_ a wallet and _sent to_ another wallet.
* An oracle where state can be updated by any wallet.

#### Send meta-transactions with relayers

If your contract supports meta-transactions, use Engine as a relayer to send meta-transactions that are signed by your users' wallets.

[Learn more about relayers in Engine.](https://portal.thirdweb.com/engine/features/relayers)

#### Send transactions with smart accounts

If your users have smart accounts, use Engine backend wallets to transact on behalf of smart accounts.

[Learn more about smart accounts in Engine.](https://portal.thirdweb.com/engine/features/smart-wallets)
## Keypair Authentication

Engine supports keypair authentication allowing your app to generate short-lived access tokens.

#### Advanced feature

Keypair authentication is an advanced feature and must be explicitly enabled.

[Contact us](https://thirdweb.com/contact-us) to enable this on your Cloud-hosted Engine instance.

**Don't need short-lived access tokens?**Utilize [Access Tokens](https://portal.thirdweb.com/engine/features/access-tokens) which are valid until deleted.

### Use cases

* You don't want an access token to be reused for a long duration if shared or compromised.
* You want to restrict what each access token can do (e.g. specific calls).

### Usage

##### 1\. Generate a keypair

Generate a cryptographic keypair in your terminal with `openssl`.

These commands generate a private and public key with the `ES256` algorithm.

```bash
openssl ecparam -name prime256v1 -genkey -noout -out private.key
```

```bash
openssl ec -in private.key -pubout -out public.key
```

##### Private key example

Your private key (`private.key`) looks like:

```text
-----BEGIN PRIVATE KEY-----
...
-----END PRIVATE KEY-----
```

_Note: The exact lines may differ based on the algorithm._

##### Public key example

Your public key (`public.key`) looks like:

```text
-----BEGIN PUBLIC KEY-----
...
-----END PUBLIC KEY-----
```

##### 2\. Add your public key to Engine

* Navigate to the [Engine dashboard](https://thirdweb.com/team/~/~/engine) and select your engine.
* Select **Access Tokens**.
* Select **Keypair Authentication**.  
   * Note: If this option is unavailable, your Engine instance may not be configured to support keypairs.
* Select **Add Public Key**.
* Add your public key including the `-----` boundary lines.

##### 3\. Sign a JWT with your private key

This step must be done for each request.

```typescript
import jsonwebtoken from "jsonwebtoken";
 
const payload = {
  iss: publicKey,
};
const accessToken = jsonwebtoken.sign(payload, privateKey, {
  algorithm: "ES256", // The keypair algorithm
  expiresIn: "15s", // Invalidate after 15 seconds
});
```

##### 4\. Authenticate Engine requests

Provide the access token in the `Authorization` header.

```typescript
await fetch(`${engineBaseUrl}/backend-wallet/get-all`, {
  headers: {
    authorization: `Bearer ${accessToken}`,
  },
});
```

### Restrict the payload body (Advanced)

To ensure this access token can only execute a specific payload, provide a SHA256 hash of the payload body as the `bodyHash` argument of the signed object.

Example: This access token is restricted to transfer 0.1 MATIC on Polygon to 0xE68FFAE106cc68A0e36Ba9Fd86f27337E3a71da6.

```typescript
import { createHash } from "crypto";
import jsonwebtoken from "jsonwebtoken";
 
// Prepare the request payload body.
const body = JSON.stringify({
  to: "0xE68FFAE106cc68A0e36Ba9Fd86f27337E3a71da6",
  currencyAddress: "0x0000000000000000000000000000000000000000",
  amount: "0.1",
});
 
// Add a hash of `body` to the signed payload.
const payload = {
  iss: publicKey,
  bodyHash: createHash("sha256").update(body).digest("hex"),
};
const accessToken = jsonwebtoken.sign(payload, privateKey, {
  algorithm: "ES256",
});
 
// Call Engine with `body`.
await fetch(`${engineBaseUrl}/backend-wallet/137/transfer`, {
  headers: {
    "Content-Type": "application/json",
    authorization: `Bearer ${accessToken}`,
    "x-backend-wallet-address": "<engine_backend_wallet_address>",
  },
  body,
});
```

### FAQ

##### How do I enable this feature on my self-hosted Engine?

Set the environment variable `ENABLE_KEYPAIR_AUTH="true"` and restart your Engine.

##### Which cryptographic algorithms are supported?

The following algorithms can be used.

| algorithm | Description                                        |
| --------- | -------------------------------------------------- |
| RS256     | RSASSA-PKCS1-v1\_5 using SHA-256 hash algorithm    |
| PS256     | RSASSA-PSS using SHA-256 hash algorithm            |
| ES256     | ECDSA using P-256 curve and SHA-256 hash algorithm |

Refer to the OpenSSL documentation on generating keypairs for different algorithms.

Remember to change `algorithm` in the `jsonwebtoken.sign()` call on [Step 3\. Sign a JWT with your private key](https://portal.thirdweb.com/engine/features/keypair-auth#3-sign-a-jwt-with-your-private-key).
## Preventing Duplicate Transactions

Your backend server may implement retries to handle when an HTTP response from Engine was not received successfully. In these cases, set an **idempotency key** to drop duplicate submissions of the same transaction.

This approach prevents costly and irreversible errors like transferring funds or minting NFTs more than once.

### Usage

Set the `x-idempotency-key` header to a unique string.

Engine only submits a transaction if there was not another transaction sent with the same idempotency key in the past 24 hours. Subsequent calls with the same idempotency key return the original transaction `queueId`.

### Example

This example safely retries a request up to three times if a 2xx is not received.

```typescript
const idempotencyKey = "27R82mBV"; // Some unique identifier from your app
const numRetries = 3;
let queueId: string | undefined;
 
for (let i = 0; i < numRetries; i++) {
  const resp = await fetch(url, {
    method: "POST",
    headers: {
      Authorization: `Bearer ${process.env.THIRDWEB_ACCESS_TOKEN}`,
      "Content-Type": "application/json",
      "x-backend-wallet-address":
        "0x4Ff9aa707AE1eAeb40E581DF2cf4e14AffcC553d",
      "x-idempotency-key": idempotencyKey,
    },
    body: JSON.stringify({
      to: "0x4Ff9aa707AE1eAeb40E581DF2cf4e14AffcC553d",
      amount: "42000000000",
    }),
  });
 
  // If 2xx, break. Else try again.
  if (resp.ok) {
    queueId = (await resp.json()).result;
    break;
  }
}
 
if (queueId) {
  console.log("Transaction submitted:", queueId);
} else {
  console.error("Unable to submit transaction.");
}
```
## Relayers

Use Engine as a relayer to sponsor gas for transactions on behalf of your users. Users sign a transaction with their own wallet (no gas required), and pay [gas fees](https://portal.thirdweb.com/glossary/gas) with an Engine backend wallet.

Removing the need for your users to get gas greatly improves the user experience and reach of your dApp.

### Use cases

Enable users to claim, transfer, list, or burn NFTs with no gas. [Learn more about gasless transactions.](https://portal.thirdweb.com/glossary/gasless-transactions)

### Requirements

* Your Engine instance has a [backend wallet](https://portal.thirdweb.com/engine/features/backend-wallets) with funds.
* The target contract must support one of:  
   * [EIP-2771 meta transactions](https://eips.ethereum.org/EIPS/eip-2771) \*  
   * [EIP-2612 permit approval](https://eips.ethereum.org/EIPS/eip-2612)  
   * [Polygon meta transactions](https://docs.polygon.technology/pos/concepts/transactions/meta-transactions/)

\*The target contract must trust a forwarder that implements the `verify` and `execute` methods, like thirdweb's default forwarder (0xd04f98c88ce1054c90022ee34d566b9237a1203c).

### Allow calls to Engine from your domain (CORS)

* Native to [Engine dashboard](https://thirdweb.com/team/~/~/engine) and select your Engine instance.
* Navigate to the **Configuration** section.
* Under **Allowlisted Domains**, enter your application domain(s).  
   * Include local or development environments for testing.

#### The relay endpoint is unauthenticated.

Set **Allowed Contracts** and **Allowed Forwarders** to restrict transactions your relayer allows.

### Create a relayer

* Navigate to [Engine dashboard](https://thirdweb.com/team/~/~/engine) and select your Engine instance.
* Navigate to the **Explorer** section.
* Select **Add relayer**.
* Provide the following details:  
   * **Chain**: The chain where contracts will be called.  
   * **Backend Wallet**: The backend wallet that will submit meta-transactions to the forwarder. Ensure this wallet has sufficient gas funds.  
   * **Label**: A descriptive name for this relayer.  
   * **Allowed Contracts**: (Optional) A list of contract addresses this relayer is allowed to submit transactions to.  
   * **Allowed Forwarders**: (Optional) A list of forwarder addresses this relayer is allowed to submit transactions to.

The relayer will be assigned a URL in this format: `https://<engine_url>/relayer/<relayer_id>`

### Submit a meta transaction from your app frontend

Use the [Connect SDK](https://portal.thirdweb.com/react) to prompt the user to sign transactions and send it this relayer.

First wrap your app with `<ThirdwebProvider>`:

```tsx
import { ThirdwebProvider } from "thirdweb/react";
 
<ThirdwebProvider>
  <YourApp />
</ThirdwebProvider>;
```

Next prompt the user to connect a wallet. See [ConnectButton](https://portal.thirdweb.com/connect/sign-in/ConnectButton) for customization options.

```tsx
import { ConnectButton } from "thirdweb/react";
 
<ConnectButton client={client} />;
```

This example will call the `claim` method on an [NFT Drop contract](https://portal.thirdweb.com/contracts/explore/pre-built-contracts/nft-drop):

```solidity
function claim(address _receiver, uint256 _quantity, address _currency, uint256 _pricePerToken, AllowlistProof calldata _allowlistProof, bytes memory _data)
```

Render a `<TransactionButton>` to prepare a transaction to be relayed via Engine.

```tsx
import { TransactionButton } from "thirdweb/react";
 
<TransactionButton
  transaction={() => {
    const contract = getContract({
      client,
      chain,
      address: NFT_ADDRESS,
    });
 
    return prepareContractCall({
      contract,
      method: resolveMethod("claim"),
      params: [
        // receiver
        account.address,
        // quantity
        1n,
        // currency
        NATIVE_TOKEN_ADDRESS,
        // pricePerToken
        0n,
        // allowlistProof
        {
          proof: [],
          quantityLimitPerWallet: 0n,
          pricePerToken: 0n,
          currency: NATIVE_TOKEN_ADDRESS,
        },
        // data
        "0x",
      ],
    });
  }}
  onTransactionSent={(result) =>
    console.log("Submitted:", result.transactionHash)
  }
  onTransactionConfirmed={(receipt) =>
    console.log("Confirmed:", receipt.transactionHash)
  }
  onError={(error) => console.error("Error:", error)}
  gasless={{
    provider: "engine",
    relayerUrl: RELAYER_URL, // e.g. https://<engine_url>/relayer/<relayer_id>
    relayerForwarderAddress: FORWARDER_ADDRESS, // a trusted forwarder on the contract
  }}
>
  Claim
</TransactionButton>;
```

### Submit a meta transaction from your app backend (Advanced)

Alternatively submit transactions to your relayer from your backend. This approach allows you to apply server-side validation or business logic before submitting the transaction to be relayed.

* Prompt the user to sign a transaction.  
   * This step does not require gas.  
   * The signature must match the format that the forwarder expects.
* Call your backend with this signature.
* Call Engine from your backend: `POST https://<engine_url>/relayer/{relayer_id}`  
##### Body payload  
```typescript  
{  
	type: "forward";  
	request: {  
		chainid?: string | undefined;  
		from: string;  
		to: string;  
		value: string;  
		gas: string;  
		nonce: string;  
		data: string;  
	};  
	signature: string;  
	forwarderAddress: string;  
} | {  
	type: "permit";  
	request: {  
		to: string;  
		owner: string;  
		spender: string;  
		value: string;  
		nonce: string;  
		deadline: string;  
	};  
	signature: string;  
} | {  
	type: "execute-meta-transaction";  
	request: {  
		from: string;  
		to: string;  
		data: string;  
	};  
	signature: string;  
}  
```
## Security

Engine provides you with security features to configure and restrict access to sensitive operations.

### IP Allowlist

You can restrict access to your Engine instance by configuring an IP allowlist. This can be configured in the **Configuration** section of the your Engine. If an IP allowlist is not configured, Engine will allow all incoming requests.

#### Note

This does not affect calls from the Engine dashboard to your Engine instance.

### Domain Allowlist (CORS)

You can restrict access to your Engine instance by configuring a domain allowlist. This can be configured in the **Configuration** section of the Engine settings. Multiple domains can be added to the allowlist, and Engine will only accept requests from these domains. A wildcard domain can also be added to allow requests from any domain.
## Wallet Credentials

Wallet credentials are authentication details required to interact with different cloud providers and wallet services. They enable secure access to wallet functionality across various platforms.

Currently, the credentials system has only been rolled out for Circle wallets. Default credentials are not yet supported. Existing wallets will continue to work as normal, but new wallet creations will use the new credential system after the rollout.

### Overview

Each wallet in the system is associated with a credential that contains the necessary authentication details for its specific provider (AWS, GCP, etc.). These credentials are stored securely and can be either:

* Specified explicitly when creating a wallet
* Used automatically through default credentials configured for each provider type

### Default Credentials

Each provider type (AWS, GCP, etc.) can have one default credential. When creating a wallet without specifying a credential, the system automatically uses the default credential for that provider type.

### Creating a Credential

Credentials are created in the dashboard and can be reused across multiple wallets of the same type.

#### Create a credential

* In the dashboard, navigate to **Configuration > Credentials**.
* Click on **Create**.
* Assign a name to the credential.
* Select the type of the credential.
* Populate the credential fields which are specific to the type.
* Click on **Create**.

##### Circle Credentials

Circle credentials require an `entitySecret` to be created and registered before creating a credential with engine. Consult<https://developers.circle.com/w3s/entity-secret-management> to create and register an entity secret.

### Usage

When creating a wallet, you can either:

* Provide a specific credential ID to use custom authentication details
* Omit the credential ID to automatically use the default credential for your chosen provider

### Security

Credential details are stored encrypted securely in the database and are only accessible through authorized system operations. Once created, they are not retrievable. You can still view the credential (label, type), but you cannot access the credential details. This ensures that credentials are secure and cannot be used to gain unauthorized access to your wallets.
## Get Started

Once you have Engine set up, learn the basics of Engine.

### Learn how transactions work

Blockchain **read** calls (e.g. get token balance) are synchronous and will return the value read.

Blockchain **write** calls (e.g. transfer tokens) are asynchronous:

* Your app backend sends a write transaction to Engine.
* Engine enqueues the job and returns a reference to the job: `queueId`.  
   * If `queueId` is returned, this transaction will be attempted.  
   * If `queueId` is not returned, this transaction failed to be added to the queue and will not be attempted.
* Engine will attempt to submit the transaction from your specified backend wallet.  
   * If there is an error (failed simulation, out of gas), the transaction is set to `errored` and will not be re-attempted.
* Engine polls to check if the transaction is mined. If it is, the transaction is set to `mined`.
* If the transaction is not mined after some duration, Engine re-submits the transaction with aggressive gas settings. This transaction is sent with the same nonce and will be mined at most once.

![Transaction lifecycle](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Ftx-lifecycle.ea58b34b.webp&w=3840&q=75)

### Learn what each transaction status means

* **Queued**: The transaction was received by Engine and waiting in the transaction queue.
* **Sent**: The transaction was successfully sent to RPC.
* **Mined**: The transaction was successfully mined onchain.
* **Cancelled**: The transaction was cancelled by the user.
* **Errored**: The transaction failed to be sent to RPC or to the chain's nodes. This can happen for many reasons (malformed transaction, failed simulation, too low gas).

### Manage Engine from the dashboard

#### Check if Engine is set up

Tip: Navigate to your Engine URL. You should see the following response: `Engine is set up successfully.`

Navigate to the [thirdweb Engine dashboard](https://thirdweb.com/team/~/~/engine) to manage your Engine instances.

**Overview**

* View your backend wallets.
* Create a backend wallet.
* View recent transactions.
* View transaction details (e.g. error messages, gas used).
* Cancel a queued transaction.

**Explorer**

* Interactively view and call your Engine API.

**Relayer**

* View relayers.
* Add or remove relayers.

**Configuration**

* Change backend wallet types.
* View webhooks.
* Add and remove webhooks.

**Permissions**

* View admin users.
* Add and remove admin users.
* View access tokens.
* Create and revoke access tokens.

### Manage permissions

Engine endpoints require authentication.

* Add other **admins** for other users to manage Engine from the dashboard.
* Create **access tokens** for your backends to call the Engine API. _These are secrets that should be stored securely._
* Revoke permissions at any time.

Learn more about [admins](https://portal.thirdweb.com/engine/features/admins) and [access tokens](https://portal.thirdweb.com/engine/features/access-tokens).

### Create backend wallets

**Backend wallet** are your wallets managed by Engine. Engine will send blockchain transactions from these wallets.

* Configure how to back up wallets.
* Create or import a backend wallet.
* Specify the backend wallet to use when calling the Engine API.

[Learn more about backend wallets.](https://portal.thirdweb.com/engine/features/backend-wallets)

### Interact with the blockchain

Here are a few example API calls.

Tip: Use the [TypeScript SDK](https://portal.thirdweb.com/engine/references/typescript) for type-safety.

#### Get a wallet's balance

```ts
const resp = await fetch(
  "<engine_url>/backend-wallet/<chain>/<backend_wallet_address>/get-balance",
  {
    headers: {
      Authorization: "Bearer <access_token>",
    },
  },
);
 
const { result } = await resp.json();
console.log("Balance:", result.value);
```

#### Read from a contract

This code example does not require gas funds and returns the function result.

```ts
const resp = await fetch(
  "<engine_url>/contract/<chain>/<contract_address>/read?functionName=balanceOf&args=0x3EcDBF3B911d0e9052b64850693888b008e18373",
  {
    headers: {
      Authorization: "Bearer <access_token>",
    },
  },
);
 
const { result } = await resp.json();
console.log("ERC-20 balance:", result);
```

#### Write to a contract

This code example calls a write method on a contract. It requires gas funds and returns a `queueId` to query for the result.

```ts
const resp = await fetch(
  "<engine_url>/contract/<chain>/<contract_address>/write",
  {
    method: "POST",
    headers: {
      "Content-Type": "application/json",
      Authorization: "Bearer <access_token>",
      "x-backend-wallet-address": "<backend_wallet_address>",
    },
    body: JSON.stringify({
      functionName: "transferFrom",
      args: [
        "0x1946267d81Fb8aDeeEa28e6B98bcD446c8248473",
        "0x3EcDBF3B911d0e9052b64850693888b008e18373",
        "0",
      ],
    }),
  },
);
 
const { result } = await resp.json();
// queueId is a reference to the transaction queued by Engine.
console.log("Queue ID:", result.queueId);
```

#### Deploy a contract

This code example deploys a [thirdweb NFT drop contract](https://thirdweb.com/thirdweb.eth/DropERC721). It requires gas funds and returns a `queueId` to query for the result.

```ts
const resp = await fetch(
  "<engine_url>/deploy/<chain>/prebuilts/nft-drop",
  {
    method: "POST",
    headers: {
      "Content-Type": "application/json",
      Authorization: "Bearer <access_token>",
      "x-backend-wallet-address": "<backend_wallet_address>",
    },
    body: JSON.stringify({
      contractMetadata: {
        name: "thirdweb Engine example",
        symbol: "eng",
        primary_sale_recipient:
          "0x3EcDBF3B911d0e9052b64850693888b008e18373",
      },
    }),
  },
);
 
const { result } = await resp.json();
// queueId is a reference to the transaction queued by Engine.
console.log("Queue ID:", result.queueId);
```

Engine can enable your application to airdrop NFTs, send funds between wallets, update onchain game state, and more.

#### Check the status of a transaction

```ts
const resp = await fetch(
  "<engine_url>/transaction/status/<queue_id>",
  {
    method: "GET",
    headers: {
      Authorization: "Bearer <access_token>",
    },
  },
);
 
const { result } = await resp.json();
// status can be: processed, queued, sent, errored, mined, cancelled, retried
const isComplete = ["mined", "errored", "cancelled"].includes(
  result.status,
);
```

### Configure webhooks

Get notified when a transaction is mined, in addition to other wallet and transaction events.

* Navigate to the **Webhooks** tab on the Engine dashboard.
* Create a new webhook URL.

[Learn more about webhooks.](https://portal.thirdweb.com/engine/features/webhooks)
## Webhooks

Configure webhooks in Engine to notify your backend server of transaction or backend wallet events.

### Supported events

#### Transactions

Handle when a blockchain transaction is sent and mined onchain.

| Event                | Description                                                                                                                                                                |
| -------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| sent\_transaction    | A transaction is submitted to RPC. A transaction hash is provided, but it may not be mined onchain yet.                                                                    |
| mined\_transaction   | A transaction is mined on the blockchain. **Note: The transaction may have reverted onchain. Check the onchainStatus field to confirm if the transaction was successful.** |
| errored\_transaction | A transaction is unable to be submitted. There may be an error in the transaction params, backend wallet, or server.                                                       |
| all\_transaction     | All the above events.                                                                                                                                                      |

![Webhooks lifecycle](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fengine-webhooks.412bb6f1.webp&w=3840&q=75)

The transaction payload contains a `status` field which is one of: `sent`, `mined`, `errored`

Depending on the transaction, your backend will receive one of these webhook sequences:

| Transaction statuses | Description                                                                                                                                                                                                                                                                      |
| -------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| sent \+ mined        | The transaction was sent and mined onchain.                                                                                                                                                                                                                                      |
| errored              | The transaction errored before being sent. Common reasons: The transaction failed simulation, the backend wallet is out of funds, the network is down, or another internal error, transaction with a gas ceiling timed out. The errorMessage field will contain further details. |
| sent \+ errored      | The transaction was sent but was not mined onchain after some duration. Common reasons: The transaction was dropped from RPC mempool, another transaction was mined with the same nonce, or the nonce was too far ahead of the onchain nonce.                                    |
| cancelled            | The transaction was in queue (not sent yet) and cancelled.                                                                                                                                                                                                                       |
| sent \+ cancelled    | The transaction was sent and waiting to be mined, but cancelled.                                                                                                                                                                                                                 |

**Note:** Webhooks may come out of order. Treat later statuses as higher priority than earlier ones. For example if your backend receives a `sent` webhook after a `mined` webhook, treat this transaction as `mined`.

#### Wallets

| Event                    | Description                                                                                                                              |
| ------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------- |
| backend\_wallet\_balance | A backend wallet's balance is below minWalletBalance. To read or update this value, call GET/POST /configuration/backend-wallet-balance. |

### Setup

#### Create a webhook

* Visit the [Engine dashboard](https://thirdweb.com/team/~/~/engine) and select your Engine.
* Select the **Configuration** tab.
* Select **Create Webhook**.

Webhook URLs must start with `https://`.

### Payload format

Method: `POST`

Headers:

* `Content-Type: application/json`
* `X-Engine-Signature: <payload signature>`
* `X-Engine-Timestamp: <Unix timestamp in seconds>`

##### Example sent transaction

```json
{
	// Queue details
	"queueId": "1411246e-b1c8-4f5d-9a25-8c1f40b54e55",
	"status": "sent",
	"onchainStatus": null,
	"queuedAt": "2023-09-29T22:01:31.031Z",
	"sentAt": "2023-09-29T22:01:41.580Z",
	"minedAt": null,
	"errorMessage": null,
	"cancelledAt": null,
	"retryCount": 0,
 
	// Onchain details
	"chainId": 80001,
	"fromAddress": "0x3ecdbf3b911d0e9052b64850693888b008e18373",
	"toAddress": "0x365b83d67d5539c6583b9c0266a548926bf216f4",
	"data": "0xa9059cbb0000000000000000000000003ecdbf3b911d0e9052b64850693888b008e183730000000000000000000000000000000000000000000000000000000000000064",
	"value": "0x00",
	"nonce": 1786,
	"gasLimit": "39580",
	"maxFeePerGas": "2063100466",
	"maxPriorityFeePerGas": "1875545856",
	"gasPrice": "1875545871",
	"transactionType": null,
	"transactionHash": "0xc3ffa42dd4734b017d483e1158a2e936c8a97dd1aa4e4ce11df80ac8e81d2c7e",
	"sentAtBlockNumber": 40660021,
	"blockNumber": null,
 
	// User operation (account abstraction) details
	"signerAddress": null,
	"accountAddress": null,
	"target": null,
	"sender": null,
	"initCode": null,
	"callData": null,
	"callGasLimit": null,
	"verificationGasLimit": null,
	"preVerificationGas": null,
	"paymasterAndData": null,
	"userOpHash": null,
 
	// Off-chain details
	"functionName": "transfer",
	"functionArgs": "0x3ecdbf3b911d0e9052b64850693888b008e18373,100",
	"extension": "none",
	"deployedContractAddress": null,
	"deployedContractType": null
}
```

##### Example mined transaction

Tip: Check the `onchainStatus` field. "success" means the transaction is mined onchain with no errors. "reverted" means the transaction or userOp was reverted.

```json
{
	// Queue details
	"queueId": "1411246e-b1c8-4f5d-9a25-8c1f40b54e55",
	"status": "mined",
	"onchainStatus": "success",
	"queuedAt": "2023-09-29T22:01:31.031Z",
	"sentAt": "2023-09-29T22:01:41.580Z",
	"minedAt": "2023-09-29T22:01:44.000Z",
	"errorMessage": null,
	"cancelledAt": null,
	"retryCount": 0,
 
	// Onchain details
	"chainId": 80001,
	"fromAddress": "0x3ecdbf3b911d0e9052b64850693888b008e18373",
	"toAddress": "0x365b83d67d5539c6583b9c0266a548926bf216f4",
	"data": "0xa9059cbb0000000000000000000000003ecdbf3b911d0e9052b64850693888b008e183730000000000000000000000000000000000000000000000000000000000000064",
	"value": "0x00",
	"nonce": 1786,
	"gasLimit": "39580",
	"maxFeePerGas": "2063100466",
	"maxPriorityFeePerGas": "1875545856",
	"gasPrice": "1875545871",
	"transactionType": 2,
	"transactionHash": "0xc3ffa42dd4734b017d483e1158a2e936c8a97dd1aa4e4ce11df80ac8e81d2c7e",
	"sentAtBlockNumber": 40660021,
	"blockNumber": 40660026,
 
	// User operation (account abstraction) details
	"signerAddress": null,
	"accountAddress": null,
	"target": null,
	"sender": null,
	"initCode": null,
	"callData": null,
	"callGasLimit": null,
	"verificationGasLimit": null,
	"preVerificationGas": null,
	"paymasterAndData": null,
	"userOpHash": null,
 
	// Off-chain details
	"functionName": "transfer",
	"functionArgs": "0x3ecdbf3b911d0e9052b64850693888b008e18373,100",
	"extension": "none",
	"deployedContractAddress": null,
	"deployedContractType": null
}
```

### Webhook verification (recommended)

Since any outside origin can call your webhook endpoint, it is recommended to verify the webhook signature to ensure a request comes from your Engine instance.

#### Check the signature

The payload body is signed with the webhook secret and provided in the `X-Engine-Signature` request header.

Get the **webhook secret** for your webhook endpoint from the dashboard.

This code example checks if the signature is valid:

```ts
const generateSignature = (
  body: string,
  timestamp: string,
  secret: string,
): string => {
  const payload = `${timestamp}.${body}`;
  return crypto
    .createHmac("sha256", secret)
    .update(payload)
    .digest("hex");
};
 
const isValidSignature = (
  body: string,
  timestamp: string,
  signature: string,
  secret: string,
): boolean => {
  const expectedSignature = generateSignature(
    body,
    timestamp,
    secret,
  );
  return crypto.timingSafeEqual(
    Buffer.from(expectedSignature),
    Buffer.from(signature),
  );
};
```

#### Check the timestamp

The event timestamp is provided in the `X-Engine-Timestamp` request header.

This code example checks if the event exceeds a given expiration duration:

```ts
export const isExpired = (
  timestamp: string,
  expirationInSeconds: number,
): boolean => {
  const currentTime = Math.floor(Date.now() / 1000);
  return currentTime - parseInt(timestamp) > expirationInSeconds;
};
```

#### Example webhook endpoint

This NodeJS code example listens for event notifications on the `/webhook` endpoint:

```ts
import express from "express";
import bodyParser from "body-parser";
import { isValidSignature, isExpired } from "./webhookHelper";
 
const app = express();
const port = 3000;
 
const WEBHOOK_SECRET = "<your_webhook_auth_secret>";
 
app.use(bodyParser.text());
 
app.post("/webhook", (req, res) => {
  const signatureFromHeader = req.header("X-Engine-Signature");
  const timestampFromHeader = req.header("X-Engine-Timestamp");
 
  if (!signatureFromHeader || !timestampFromHeader) {
    return res
      .status(401)
      .send("Missing signature or timestamp header");
  }
 
  if (
    !isValidSignature(
      req.body,
      timestampFromHeader,
      signatureFromHeader,
      WEBHOOK_SECRET,
    )
  ) {
    return res.status(401).send("Invalid signature");
  }
 
  if (isExpired(timestampFromHeader, 300)) {
    // Assuming expiration time is 5 minutes (300 seconds)
    return res.status(401).send("Request has expired");
  }
 
  // Process the request
  res.status(200).send("Webhook received!");
});
 
app.listen(port, () => {
  console.log(`Server started on http://localhost:${port}`);
});
```
## Airdrop NFTs

Engine makes it effortless for any developer to airdrop NFTs at scale. You sponsor the gas so your users only need a wallet address!

![Airdrop overview](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fairdrop-overview.8ce60625.png&w=3840&q=75)

### Prerequisites

* An Engine instance
* A [backend wallet](https://portal.thirdweb.com/engine/features/backend-wallets) with currency to pay for gas
* A deployed NFT contract that can be claimed by the backend wallet
* A client ID and secret key from your Team > Project > Settings page.

### Frontend: Add Connect Wallet and Claim buttons

Use [ConnectButton](https://portal.thirdweb.com/references/typescript/v5/ConnectButton) component to prompt the user for their wallet. The **Claim** button calls `POST /api/claim`.

```tsx
import { useActiveAccount } from "thirdweb/react";
function ClaimPage() {
  const account = useActiveAccount();
  const address = account?.address;
 
  const onClick = async () => {
    await fetch("/api/claim", {
      method: "POST",
      body: JSON.stringify({ address }),
    });
    alert(`🎉 A reward has been sent to your wallet: ${address}`);
  };
 
  return (
    <main>
      <h2>Thank you for being a superfan! ❤️</h2>
      <ConnectWallet />
      {address && <button onClick={onClick}>Claim my reward</button>}
    </main>
  );
}
 
function Example() {
  return (
    <ThirdwebProvider
      activeChain="<chain_id>"
      clientId="<thirdweb_client_id>"
    >
      <ClaimPage />
    </ThirdwebProvider>
  );
}
```

_Replace `<thirdwebclientid>`_.

### Backend: Call Engine to mint an NFT

`POST /api/claim` calls Engine to mint an NFT to the user's wallet.

```tsx
export async function POST(request: Request) {
  const { userWalletAddress } = await request.json();
 
  await fetch(
    "<engine_url>/contract/<chain_id>/<nft_contract_address>/erc1155/mint-to",
    {
      method: "POST",
      headers: {
        "Content-Type": "application/json",
        Authorization: "Bearer <thirdweb_secret_key>",
        "x-backend-wallet-address": "<backend_wallet_address>",
      },
      body: JSON.stringify({
        receiver: userWalletAddress,
        metadataWithSupply: {
          metadata: {
            name: "Acme Inc. Superfan",
            description: "Created with thirdweb Engine",
            image:
              "ipfs://QmciR3WLJsf2BgzTSjbG5zCxsrEQ8PqsHK7JWGWsDSNo46/nft.png",
          },
          supply: "1",
        },
      }),
    },
  );
 
  return NextResponse.json({ message: "Success!" });
}
```

### Try it out!

Here’s what the user flow looks like.

The app prompts the user to connect their wallet.

![Initial page load](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fairdrop-nfts-1.8be1261a.png&w=3840&q=75)

![The app prompts the user to connect their wallet](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fairdrop-nfts-2.e66bac14.png&w=3840&q=75)

A user presses claim.

![A user presses claim](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fairdrop-nfts-3.ad5111e9.png&w=3840&q=75)

They'll receive the NFT in their wallet shortly!

![They'll receive the NFT in their wallet shortly](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fairdrop-nfts-4.20a552ec.png&w=3840&q=75)

### Full code example

The code above is simplified for readability. [View the full source code →](https://github.com/thirdweb-example/engine-minting-api)
## Production Checklist

Follow best practices when using Engine in a production environment.

#### Security

* The Engine API is intended to be called from your backend only. Ensure your access tokens are not accessible from your frontend.  
   * Exception: Relayer endpoints do not require access tokens. [Learn more about relayers.](infrastructure/engine/guides/relayer)
* Securely store access tokens and the thirdweb secret key. Rotate these credentials if they are compromised.
* Use labels to keep track of your wallets, admins, and access tokens.
* Use access token with expirations to grant time-bound access.
* Regularly review the admins list to remove inactive and former team members.

#### Backend wallets

* Recommended: Use a wallet backed by AWS KMS or Google KMS. Wallet access is always recoverable and private keys are never exposed.
* If using a local wallet: **back up the private key**. Engine cannot recover private keys if the encrypted stored data is lost or corrupted.
* Ensure your backend wallets have sufficient funds. Use [wallet webhooks](https://portal.thirdweb.com/engine/features/webhooks) to alert when your gas balance is low.
## NFT Checkout

This guide uses thirdweb Engine to sell NFTs with credit card:

* A buyer pays with credit card.
* Upon payment, your backend calls Engine.
* Engine mints an NFT to the buyer's wallet.

The buyer receives the NFT without requiring wallet signatures or gas funds.

![NFT checkout overview](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fnft-checkout-overview.0a5bb1f2.png&w=3840&q=75)

### Prerequisites

* A thirdweb client ID and secret key from your Team > Project > Settings page.
* An Engine instance
* A [backend wallet](https://portal.thirdweb.com/engine/features/backend-wallets) with currency to pay for gas
* An [access token](https://portal.thirdweb.com/engine/features/authentication) for your Engine instance
* A deployed NFT contract that can be claimed by the backend wallet
* A [Stripe account](https://dashboard.stripe.com/register) on test mode (no real payments will be made)

### Frontend: Add Connect Wallet and credit card form

Use [<ConnectButton>](https://portal.thirdweb.com/references/typescript/v5/ConnectButton) to prompt the buyer for their wallet address. The buyer provides their credit card details and selects **Pay now** to send payment details directly to Stripe.

```tsx
function Home() {
  return (
    <ThirdwebProvider>
      <PurchasePage />
    </ThirdwebProvider>
  );
}
```

```tsx
// src/app/page.tsx
function PurchasePage() {
  const buyerWalletAddress = useAddress();
  const [clientSecret, setClientSecret] = useState("");
 
  // Retrieve a Stripe client secret to display the credit card form.
  const onClick = async () => {
    const resp = await fetch("/api/stripe-intent", {
      method: "POST",
      headers: { "Content-Type": "application/json" },
      body: JSON.stringify({ buyerWalletAddress }),
    });
    const json = await resp.json();
    setClientSecret(json.clientSecret);
  };
 
  const stripe = loadStripe("<stripe_publishable_key>");
 
  return (
    <main>
      <ConnectWallet />
 
      {!clientSecret ? (
        <button onClick={onClick}>Buy with credit card</button>
      ) : (
        <Elements stripe={stripe} options={{ clientSecret }}>
          <CreditCardForm />
        </Elements>
      )}
    </main>
  );
}
```

```tsx
const CreditCardForm = () => {
  const elements = useElements();
  const stripe = useStripe();
 
  const onClick = async () => {
    // Submit payment to Stripe. The NFT is minted later in the webhook.
    await stripe.confirmPayment({
      elements,
      confirmParams: { return_url: "http://localhost:3000" },
      redirect: "if_required",
    });
    alert(
      "Payment success. The NFT will be delivered to your wallet shortly.",
    );
  };
 
  return (
    <>
      <PaymentElement />
      <button onClick={onClick}>Pay now</button>
    </>
  );
};
```

### Backend: Get a Stripe client secret

`POST /api/stripe-intent` returns a client secret which is needed to display the credit card form.

```tsx
// src/app/api/stripe-intent/route.ts
 
export async function POST(req: Request) {
  const { buyerWalletAddress } = await req.json();
 
  const stripe = new Stripe("<stripe_secret_key>", {
    apiVersion: "2023-10-16",
  });
  const paymentIntent = await stripe.paymentIntents.create({
    amount: 100_00,
    currency: "usd",
    payment_method_types: ["card"],
    // buyerWalletAddress is needed in the webhook.
    metadata: { buyerWalletAddress },
  });
 
  return NextResponse.json({
    clientSecret: paymentIntent.client_secret,
  });
}
```

### Backend: Configure the Stripe webhook

`POST /api/stripe-webhook` calls Engine to mint an NFT when a buyer is successfully charged.

```tsx
// src/app/api/stripe-webhook/route.ts
 
export const config = {
  api: { bodyParser: false },
};
 
export async function POST(req: NextRequest) {
  // Validate the webhook signature
  // Source: https://stripe.com/docs/webhooks#secure-webhook
  const body = await req.text();
  const signature = headers().get("stripe-signature");
  const stripe = new Stripe("<stripe_secret_key>", {
    apiVersion: "2023-10-16",
  });
 
  // Validate and parse the payload.
  const event = stripe.webhooks.constructEvent(
    body,
    signature,
    "<webhook_secret_key>",
  );
 
  if (event.type === "charge.succeeded") {
    const { buyerWalletAddress } = event.data.object.metadata;
 
    // Mint an NFT to the buyer with Engine.
    const engine = new Engine({
      url: "<engine_url>",
      accessToken: "<engine_access_token>",
    });
    await engine.erc1155.mintTo(
      "<chain_id>",
      "<nft_contract_address>",
      "<backend_wallet_address>",
      {
        receiver: buyerWalletAddress,
        metadataWithSupply: {
          metadata: {
            name: "Engine Hackathon 2023",
            description: "Created with thirdweb Engine",
            image:
              "ipfs://QmakhKF5oMyxupCZ2RsmcvPRyYTHnQzYeb9mQGv3RM81n1/hat.webp",
          },
          supply: "1",
        },
      },
    );
  }
 
  return NextResponse.json({ message: "OK" });
}
```

### Configure Stripe webhooks

Navigate to the [Stripe webhooks dashboard (test mode)](https://dashboard.stripe.com/test/webhooks) and add the `/api/stripe-webhook` endpoint and send the `charge.succeeded` event.

### Try it out!

Here’s what the user flow looks like.

The buyer is prompted to provide their credit card.

![Initial page load](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fnft-checkout-1.c405205e.png&w=1920&q=75)

They provide their card details.

> _Tip: Stripe testmode accepts `4242 4242 4242 4242` as a valid credit card._

![Prompted for card details](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fnft-checkout-2.28ea6e2b.png&w=1920&q=75)

They are informed when their payment is submitted.

![Successful payment](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fnft-checkout-3.b668c7c0.png&w=1920&q=75)

### Full code example

The code above is simplified for readability. [View the full source code →](https://github.com/thirdweb-example/engine-nft-checkout)

### FAQ

#### Can I accept different payment methods?

Yes! You provide the payment provider and can accept different currencies (EUR, JPY), digital wallets (Apple Pay, Google Pay), bank payments (ACH, SEPA), local payment methods (UPI, iDEAL), and more.

#### How is thirdweb NFT Checkout different?

[thirdweb Checkout](https://thirdweb.com/checkout) is a full solution that detects fraud, provides chargeback liability, accepts multiple payment methods including cryptocurrency, includes a prebuilt checkout UX, and more.
## Security

### Data handling

* Since Engine is self-hosted, you (the developer) maintain control over the server, database, logging, and observability.
* Engine handles configuration data encrypted in transit and at rest.
* Backend wallet signers are reconstructed only in memory on your Engine instance, and this data is never sent to thirdweb or other external platforms.
* thirdweb may collect the following information:  
   * Metrics on which accounts are using Engine  
   * Anonymized metrics on usage  
   * Transactions history  
   * (TBD future data to power advanced analytics)

### Third-party security audit

As of Jan 2024, Engine has received a thorough security audit and internal bug bounty program from HackerOne. A Letter of Attestation may be provided upon request.

### Responsible disclosure

To report a security vulnerability, please contact [security@thirdweb.com](mailto:security@thirdweb.com).

### Legal

* [Terms of Service](https://thirdweb.com/tos)
* [Privacy Policy](https://thirdweb.com/privacy)
## Typescript SDK

Update configuration, manage backend wallets, and call contracts in Typescript. All Engine APIs are accessible via SDK.

### Setup

npmyarnpnpm

`npm i @thirdweb-dev/engine

`

### Usage

```typescript
import { Engine } from "@thirdweb-dev/engine";
 
const engine = new Engine({
  url: "http://0.0.0.0:3005",
  accessToken: "<engine_access_token>",
});
 
await engine.erc20.mintTo(
  // chain
  "<chain_id>",
  // contract address
  "0x365b83D67D5539C6583b9c0266A548926Bf216F4",
  // backend wallet address
  "0x43CAe0d7fe86C713530E679Ce02574743b2Ee9FC",
  // args matching the API reference
  {
    toAddress: "0x43CAe0d7fe86C713530E679Ce02574743b2Ee9FC",
    amount: "1.0",
  },
);
```
## Troubleshooting

Here are helpful resources for debugging issues you may encounter while using thirdweb Engine.

### Sending transactions

#### Received "UNPREDICTABLE\_GAS\_LIMIT" error

**What it means**

The RPC reported that this transaction failed simulation and is expected to fail onchain, and it is being rejected before it is sent. No gas is consumed. This error indicates the contract logic will throw an error (or "revert the execution").

Common reasons: minting from a token contract that has no claim condition, has not started the minting period, is out of supply, has the incorrect amount paid to it, the calling backend wallet does not have permissions to call the contract.

**How to resolve**

Try to simulate the transaction by passing the `?simulateTx=true` query parameter or using the thirdweb [Transaction Simulator](https://thirdweb.com/tools/transaction-simulator) to reveal the error message.

#### The transaction failed onchain

_Also known as: execution reverted_

**What it means**

The transaction passed simulation but the execution was reverted onchain. This can occur if a change in state occurred, such as an NFT contract running out of supply before a transaction was mined.

Another common reason is the transaction ran out of gas. You can verify this by checking the "More Details" section in your blockchain explorer and confirming if the gas usage reached the gas limit:

![Out of gas](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fengine-out-of-gas.01fbadb3.png&w=3840&q=75)

**How to resolve**

If the transaction failed due to onchain logic, try to simulate the transaction (see above) to identify the reason.

If the gas limit was reached, you may try [manually overriding the gas settings](https://portal.thirdweb.com/engine/features/contracts#override-gas-settings). Engine automatically estimates the gas limit through simulation, and it is not recommended to override the gas limit unless the estimation is incorrect.

#### Received "replacement transaction underpriced" error

_Also known as: REPLACEMENT\_UNDERPRICED, already known_

**What it means**

Engine has already submitted this or another transaction with the same nonce. That transaction is in mempool and waiting to be mined by the chain.

Engine automatically manages nonces so this error typically should not occur.

**How to resolve**

It's possible the transactions are not being accepted by the mempool. To remediate this issue, you can retry a transaction, cancel it, or reset all backend wallet nonces.

To retry a transaction, use [POST /transaction/sync-retry](https://thirdweb-engine.apidocumentation.com/reference#tag/transaction/POST/transaction/sync-retry) and provide the `queueId`. You may also provide a higher gas value to increase the likelihood of the transaction being mined.

To cancel a transaction, use [POST /transaction/cancel](https://thirdweb-engine.apidocumentation.com/reference#tag/transaction/POST/transaction/cancel) and provide the `queueId`.

#### Resetting the nonce may fail previous transactions

Transactions that were sent but not yet mined may fail because new transactions will use the same nonce values as previously sent transactions.

To reset the nonce for all backend wallets, use [POST /backend-wallet/reset-nonce](https://thirdweb-engine.apidocumentation.com/reference#tag/backend-wallet/POST/backend-wallet/reset-nonces) to force-sync the Engine nonces with the onchain values.

#### Received "Insufficient funds for gas \* price + value" error

_Also known as: Insufficient funds for intrinsic transaction cost_

**What it means**

Your backend wallet has insufficient funds to complete the transaction.

Note that on EVM blockchains, a transaction must place a _gas fee bid_ on a transaction that is higher than the amount that will actually get consumed. This means your wallet must have a minimum amount of gas in order to send transactions.

You can estimate how much gas is needed. Adjust the values to your use case and chain.

* `gas` ("gas limit"): The unit of gas that a transaction needs to complete. Assume an NFT mint that takes **120,000 gas**.
* `maxFeePerGas`: The maximum amount of native token to bid, per gas. Assume **50 gwei**.
* Amount of gas needed = **6,000,000,000,000,000 wei**. Assume the native currency is ETH which has 18 decimals, this equals 0.006 ETH.

Even though the transaction is expected to consume less gas, the transaction will fail unless the wallet holds at least this much native gas currency.

**How to resolve**

Add more funds to your backend wallet. Or wait until the gas fees on the chain are lower and try again.

### Sending UserOps

UserOps are **User Op**erations sent by a backend wallet on behalf of smart accounts, used in the Account Abstraction pattern.

#### Received "Invalid UserOperation signature or paymaster signature" error

_Also known as: code -32507_

**What it means**

The backend wallet you are sending the transaction with does not have sufficient permissions to send a userOp for this account address.

**How to resolve**

Confirm if the backend wallet is a valid admin for this account. If you are using Session Keys, confirm they are not close to or already expired.

#### Received "AA21 didn’t pay prefund" error

**What it means**

Your thirdweb API key used by Engine is not properly configured to use Account Abstraction, or you have a [sponsorship rule](https://portal.thirdweb.com/connect/account-abstraction/sponsorship-rules) that has been exceeded.

**How to resolve**

Confirm if the API key is tied to an account with valid payment. Also confirm if there are any sponsorship rule for the Engine API key.
## Self-Host Instructions

Self-host Engine on your own infrastructure for free and manage your self-hosted Engine from the [thirdweb dashboard](https://thirdweb.com/team/~/~/engine).

#### Want to avoid setup and maintenance?

[Get Engine hosted by thirdweb.](https://thirdweb.com/team/~/~/engine/create)

#### Requirements

* [Docker](https://docs.docker.com/get-docker/)
* A thirdweb secret key from your Team > Project > Settings page.
* PostgresDB (version 14+)
* Redis (version 7.2.4+)

#### Running Engine locally

Start Postgres:

```bash
docker run -p 5432:5432 -e POSTGRES_PASSWORD=postgres -d postgres
```

Start Redis:

```bash
docker run -p 6379:6379 -d redis:7.2.4
```

Start Engine server:

```bash
docker run \
  -e ENCRYPTION_PASSWORD="<encryption_password>" \
  -e THIRDWEB_API_SECRET_KEY="<thirdweb_secret_key>" \
  -e ADMIN_WALLET_ADDRESS="<admin_wallet_address>" \
  -e POSTGRES_CONNECTION_URL="postgresql://postgres:postgres@host.docker.internal:5432/postgres?sslmode=disable" \
  -e ENABLE_HTTPS=true \
  -e REDIS_URL="redis://host.docker.internal:6379/0" \
  -p 3005:3005 \
  --pull=always \
  --cpus="0.5" \
  thirdweb/engine:latest
```

##### Environment variables

| Variable (\* \= Required)    | Description                                                                                                                 |
| ---------------------------- | --------------------------------------------------------------------------------------------------------------------------- |
| ENCRYPTION\_PASSWORD\*       | Provide a string to encrypt sensitive data stored in DB. Do _not_ change this value or encrypted data will be inaccessible. |
| THIRDWEB\_API\_SECRET\_KEY\* | A thirdweb secret key created at the time of project (API Key) creation                                                     |
| ADMIN\_WALLET\_ADDRESS\*     | The wallet address that will configure Engine from the thirdweb dashboard. You will be able to add other admins later.      |
| POSTGRES\_CONNECTION\_URL\*  | Postgres connection string: postgresql://\[user\[:password\]@\]\[host\]\[:port\]\[/dbname\]\[?param1=value1&...\]           |
| REDIS\_URL\*                 | Redis connection string: redis://\[user:password@\]host:port\[/db-number\]                                                  |
| ENABLE\_HTTPS                | Self-sign a certificate to serve API requests on HTTPS. Set to true if running Engine locally only. (Default: false)        |
| LOG\_LEVEL                   | Determines the logging severity level. Adjust for finer control over logged information. (Default: debug)                   |
| PRUNE\_TRANSACTIONS          | When false, Engine prevents the pruning/deletion of processed transaction data. (Default: true)                             |
| ENABLE\_KEYPAIR\_AUTH        | Enables [Keypair Authentication](https://portal.thirdweb.com/engine/features/keypair-authentication).                       |
| TRUST\_PROXY                 | When true, trust the X-Forwarded-For header to allow Engine to use the correct client IP address for the IP allowlist.      |

\* Required

Your server is running when this log line appears:

```bash
Listening on https://localhost:3005. Manage your Engine from https://thirdweb.com/team/~/~/engine.
```

##### Manage Engine from the dashboard

To manage your Engine instance from the dashboard:

* Navigate to `https://localhost:3005/json`  
   * The "Your connection is not private" page will appear.  
   * Select **Show advanced** and select **Proceed to localhost (unsafe)** to render the JSON file.  
   * _This one-time step allows your browser to connect to your local Engine instance._
* Navigate to the [Engine dashboard page](https://thirdweb.com/team/~/~/engine).
* Sign in with the `<admin_wallet_address>` wallet.
* Select **Import**
* Add your publicly accessible Engine URL.  
   * If Engine is running locally, provide the URL `https://localhost:3005`.

#### Running Engine in production

See the [Production Checklist](https://portal.thirdweb.com/engine/production-checklist#cloud-hosting) for best practices using Engine in a production environment.

* Pin Engine Docker to a version to control when changes are introduced.  
   * `latest` may include major version changes which can introduce breaking changes.
* Host Engine DB on any [Postgres-compatible database](https://www.postgresql.org/support/professional%5Fhosting/).  
   * Remember to update `POSTGRES_CONNECTION_URL`.  
   * Examples: [AWS RDS](https://aws.amazon.com/rds/postgresql/), [Google Cloud SQL](https://cloud.google.com/sql/docs/postgres), [Heroku](https://www.heroku.com/postgres), [Supabase](https://supabase.com/docs/guides/database/overview)  
   * Minimum specs: 2 vCPU, 2 GB memory (AWS equivalent: t4g.small)  
   * Minimum version: 14  
   * Add the `?connection_limit=10` param to your `POSTGRES_CONNECTION_URL` to increase the connection limit.
* Host Engine server on any cloud provider.  
   * Minimum specs: 1 vCPU, 2 GB memory (AWS equivalent: t2.small)  
   * Auto-scale the instance count to increase inbound throughput and queuing capacity.
* Remove the `ENABLE_HTTPS` env var.

#### FAQ

##### Why is my Docker image unable to reach my Postgres database?

Here are common troubleshooting tips:

* Ensure the Postgres DB is running in Docker. `POSTGRES_CONNECTION_URL` should be set to `localhost` (if in the same container) or `host.docker.internal` (if in a different container).
* Ensure the Postgres DB connection URL and credentials are correct.
* Ensure the database name exists on the Postgres DB.

See [Production Checklist](https://portal.thirdweb.com/engine/production-checklist#cloud-hosting) for best practices using Engine in a production environment.

##### Self-hosting recommendations

* Do _not_ set the environment variable `ENABLE_HTTPS=true`.
* Host Engine Docker on a cloud provider.  
   * Minimum specs: 1 vCPU, 2 GB memory (AWS equivalent: t2.small)  
   * Auto-scale the instance count to increase inbound throughput and queuing capacity.
* Host Postgres DB on a cloud provider.  
   * Examples: [AWS RDS](https://aws.amazon.com/rds/postgresql/), [Google Cloud SQL](https://cloud.google.com/sql/docs/postgres), [Heroku](https://www.heroku.com/postgres), [Supabase](https://supabase.com/docs/guides/database/overview)  
   * Minimum specs: 2 vCPU, 2 GB memory (AWS equivalent: t4g.small)  
   * Set the `connection_limit` parameter within your `POSTGRES_CONNECTION_URL` environment variable to `10`.

##### How do I filter logs in Engine?

Configure log verbosity via the `LOG_LEVEL` environment variable. The severity levels ordered from highest to lowest are:

* `fatal` : Terminates the program due to critical errors.
* `error` : Highlights serious issues needing immediate action.
* `warn` : Suggests caution due to potential issues.
* `info` : Shares routine operational insights.
* `debug` : Provides detailed debugging information.
* `trace` : Offers in-depth tracing details.

Engine by default captures logs at `debug` severity and higher. Setting `LOG_LEVEL` to `error` limits logging to only `error` and `fatal` severities.

```bash
LOG_LEVEL="error"
```

##### How to prevent `SIGSEGV` errors with the Engine docker image?

Ensure the Engine docker image's stability by allocating a minimum of `0.5 vCPU & 1 GB memory` to the container, mitigating `SIGSEGV` (Segmentation Fault) errors due to inadequate resources or memory access issues.

##### How to mitigate Prisma errors related connections and/or prisma transactions?

Engine recommends a minimum DB connections limit of `8` PER HOST. Please set the `connection_limit` parameter within your `POSTGRES_CONNECTION_URL` environment variable, to allow a connection limit between (8, # conns supported by your DB / # hosts). In practice, 10-20 is a suitable connection limit.

DB Error:

```bash
Timed out fetching a new connection from the connection pool. More info: http://pris.ly/d/connection-pool (Current connection pool timeout: 10, connection limit: 3)
```

Example configuration:

```bash
POSTGRES_CONNECTION_URL=postgres://postgres:postgres@localhost:5432/postgres?connection_limit=10
```

##### What is `x-forwarded-for` and how does it affect Engine?

If you have engine running on a server behind a reverse proxy, you can set the `TRUST_PROXY` environment variable to `true` to trust the `X-Forwarded-For` header. Reverse proxies like Nginx or Apache will add this header to the request with the original client IP address, and setting this variable will allow Engine to use the correct IP address for the IP Allowlist. For more details on IP Allowlisting, refer to the [Security Features](https://portal.thirdweb.com/engine/features/security) page.
## Bundler

A bundler is a node that monitors the alternative mempool of `UserOperations` and bundles multiple `UserOps` together to forward to the EntryPoint contract as a single transaction. These `UserOps` can be sent from different accounts and are bundled and sent to the `EntryPoint` contract via a `handleOps` call.

The bundler is controlled by its own EOA which initially pays for the gas fees upfront and is then repaid by either the sender or a paymaster if the transaction is sponsored.

The entry point contract then uses the `validateOp` and `executeOp` functions on the smart account contract to verify and execute the `UserOps` on behalf of the users.

It allows you to send transactions with smart accounts.
## Engine

Engine is an open-source, backend server that reads, writes, and deploys contracts at production scale.

### Why use Engine?

Engine enables your app to:

* Send multiple blockchain transactions at once.
* Resubmit stuck transactions, handling nonce values, gas settings, and RPC errors.
* Avoid duplicate transactions.
* Manage multiple backend wallets and their funds.
* Control access from your backends and team members.
* Sponsor user gas fees.
* Deploy and interact with smart accounts.
* Subscribe to contract events and transactions.

🚀 [Get Engine hosted by thirdweb](https://thirdweb.com/team/~/~/engine/create) or [self-host for free](https://portal.thirdweb.com/engine/self-host).

![Engine overview](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fengine-overview.25c5a965.png&w=3840&q=75)

Engine

Engine is open-source. View and contribute to its source code on GitHub.

[GitHubView on GitHub](https://github.com/thirdweb-dev/engine)

### Standard Engine

Supports 500 write transactions per second. Great for minting APIs, airdrops, and managing user wallets.

##### Features

* **High transaction throughput** \- Transactions batched on the same block with nonces managed automatically.
* **Secure backend wallets** \- Your backend wallets stored locally, on AWS KMS, or on Google KMS.
* **Any contract on any EVM chain** \- Supports contract calls on all [1700+ EVM blockchains](https://thirdweb.com/chainlist) and private subnets.
* **Contract deployments** \- Deploy smart accounts, tokens, NFTs, marketplaces, and more.
* **Account abstraction** \- Use smart accounts and session keys to transact on behalf of your users.
* **Built-in relayer** \- Sponsor gas for your users so reduce user friction.
* **Event webhooks** \- Get notified of wallet and contract events to automate other actions like payments or emails.
* **Contract subscriptions** \- Store event logs and transaction receipts to be queried later.
* **Transaction observability** \- Debug transaction failures with detailed timelines, onchain errors, and gas details.
* **Idempotency** \- Prevent costly, duplicate transactions.
* **Production-ready web3 infrastructure** \- Includes RPC, IPFS, and Account Abstraction out of the box.

### Premium Engine

Engine Premium provides added scaling and resilience. It include server autoscaling, server failover, database failover, and 30-day database backups.

##### Features

* **_Everything in Standard Engine_**
* **Autoscaling** \- Scale to millions of users with a fleet of Engine instances that scale up along with your traffic.
* **Production-grade Server** \- High availability and redundancy.
* **Production-grade Database** \- High availability, Multi-AZ.
* **Database backups** \- Recoverability and peace of mind for your stored data (30-day database backups).

### Pricing

Cloud-hosting Engine with thirdweb starts at $99 per month. Learn more about [Engine pricing](https://thirdweb.com/team/~/~/engine/create).

Self-hosting Engine is always free.

### Get in touch

For dedicated support and feature requests, [contact Sales](https://thirdweb.com/contact-us).
## Claiming

Claiming is the process of transferring token ownership to the claimer's wallet. Once a token has been [lazy minted](https://portal.thirdweb.com/glossary/lazy-minting), it can be claimed by a wallet.
## Claim Phases

Claim phases or "claim conditions" allow you to configure various aspects of a [drop](https://portal.thirdweb.com/glossary/drop); such as who can claim tokens, how many tokens will be released, the price of each token, release date, etc.

They are available to use for any smart contract that implements the [Drop Single Phase](https://portal.thirdweb.com/contracts/build/extensions/general/DropSinglePhase)or [Drop](https://portal.thirdweb.com/contracts/build/extensions/general/Drop) extension smart contracts, which includes our ready-to-deploy smart contracts like the[NFT Drop](https://thirdweb.com/thirdweb.eth/DropERC721), [Token Drop](https://thirdweb.com/thirdweb.eth/DropERC20), and [Edition Drop](https://thirdweb.com/thirdweb.eth/DropERC1155) smart contracts.
## Delayed Reveal

Delayed reveal is a feature that allows you to release NFTs in a [drop](https://portal.thirdweb.com/glossary/drop) with hidden content that can only be revealed at a later time. The owner of the smart contract (or a wallet with the appropriate permissions) can [lazy-mints](https://portal.thirdweb.com/glossary/lazy-minting) a batch of NFTs, along with placeholder metadata and a password.

Until the NFTs are revealed using this password, the metadata of the NFTs will be the placeholder metadata, and the "real" metadata is not visible to external parties.

This is achieved by using the password as an encryption/decryption key to encrypt the URI containing the "real" metadata. The encrypted URI is stored onchain, and the password is stored off-chain, only known by the owner.

When the NFTs are revealed, the owner of the smart contract (or a wallet with the appropriate permissions) can decrypt the URI using the password, and the "real" metadata is revealed.

[Learn more from our feature release product update](https://blog.thirdweb.com/delayed-reveal-nfts/).
## Drop

A drop smart contract allows the owner of the contract to [lazy mint](https://portal.thirdweb.com/glossary/lazy-minting) NFTs _(unless it is an ERC20 drop)_, and have other users mint them, typically under the conditions defined in the smart contract’s [claim phases](https://portal.thirdweb.com/glossary/claim-phases), although these are not required.

This is a common pattern for projects that want their community to be able to claim tokens:

* The contract owner defines the metadata for the tokens:  
   * For NFTs, this means they [lazy mint](https://portal.thirdweb.com/glossary/lazy-minting) the NFTs by providing the metadata for each NFT.  
   * For ERC20 tokens, the token metadata is defined when the contract is deployed.
* The contract owner defines how user’s can claim the tokens, optionally configuring [claim phases](https://portal.thirdweb.com/glossary/claim-phases).
* Users can claim tokens by calling the `claim` function on the contract, which will mint the tokens to the user’s address.
## Externally Owned Account

An Externally Owned Account (EOA) is an account controlled by the owner of the account's private key usually through a wallet application. Examples include MetaMask, Coinbase Wallet, and Phantom.
## Factory contract

A factory contract is a smart contract that is used to deploy other smart contracts.
## Entry Point

The EntryPoint is a singleton contract (a contract that has a predictable address that is the same on every chain and only one instance per chain). It has two methods that are used as entry points to execute bundles of UserOperations: `handleOps` and `handleAggregatedOps` which validate and execute user operation(s).
## Gas Fees

All transactions (operations that change information stored on the blockchain) require a gas fee, which is used to cover the costs of the computational resources to execute that transaction.

Gas fees are typically paid in the currency that is native to the blockchain you are interacting with. For example, if you are using the Ethereum blockchain, you will need to pay gas fees in Ether.

While using thirdweb is free, you will need to cover the cost of performing actions that update the blockchain's state.

This includes actions performed via the thirdweb [dashboard](https://thirdweb.com/team), our [SDKs](https://portal.thirdweb.com/contracts), or any of our other products, including:

* Deploying smart contracts
* [Lazy-minting](https://portal.thirdweb.com/glossary/lazy-minting) the metadata of your NFTs
* Updating permissions on your smart contracts
* Setting [claim phases](https://portal.thirdweb.com/glossary/claim-phases)

[Learn more on the official Ethereum documentation](https://ethereum.org/en/developers/docs/gas/).
## Interoperability

Interoperability refers to the ability of different networks to share data or assets (like tokens) and interact with each other.

For example, if Blockchain A is interoperable with Blockchain B, it means that a user could send tokens from Blockchain A to Blockchain B in a way that's secure and verifiable on both chains.
## Gasless Transactions

Gasless Transactions, also known as meta-transactions, are transactions that have the [gas fee](https://portal.thirdweb.com/glossary/gas)paid for by a third party instead of the transaction sender. Typically, this means the dApp owner covers the gas costs of their users' transactions, providing a more seamless user experience.

This works by having the user sign a message that is then sent to a relayer, which pays the gas fee and forwards the transaction to the blockchain.

You can attract a broader audience by removing the need to have gas to use your application. Engine offers multiple options for developers looking to sponsor gas for their users' transactions.
## IPFS

IPFS (InterPlanetary File System) is a protocol to store files in a decentralized peer-to-peer network.

Storing information on the blockchain is expensive and comes with significant size limitations, IPFS provides a way to store files in a decentralized manner _not_ on the blockchain, sometimes referred to as "off-chain" storage.

To secure content on IPFS forever, a node must [pin](https://docs.ipfs.tech/concepts/persistence/) the content, otherwise, it may be discarded and therefore made unavailable.[Learn more about how IPFS works](https://ipfs.tech/#how).

To read data from IPFS, an [IPFS Gateway](https://docs.ipfs.tech/concepts/ipfs-gateway/) is required. This allows you to access data from the IPFS protocol on browsers and other HTTP clients, such as when building an application using our [SDK](https://portal.thirdweb.com/contracts).

Out of the box, all of our tools use [Storage](https://portal.thirdweb.com/storage) to store, pin, and retrieve data from IPFS via a gateway, currently powered by [Pinata](https://pinata.cloud/) under the hood.
## Lazy Minting

Lazy minting is the preparation of NFT metadata without actually minting the NFT to a wallet address.

This is a useful process for smart contract admins who want to prepare metadata for NFTs that will be minted by other wallets in a [drop](https://portal.thirdweb.com/glossary/drop),_without_ paying the [gas cost](https://portal.thirdweb.com/glossary/gas) to mint those NFTs.

The typical process for lazy minting is:

* Contract admin lazy-mints NFT metadata (either in bulk or for individual NFTs).
* Contract admin defines how NFTs can be minted using [claim phases](https://portal.thirdweb.com/glossary/claim-phases).
* Other wallets mint NFTs by claiming them. When they claim, they pay the gas cost to mint the NFT and the NFT is minted to their wallet address.
## Local Wallet

A local wallet is a type of wallet that allows you to create wallets within your application or project.

It is a non-custodial solution that simplifies the onboarding process by offering a "checkout as guest" experience. This improves the user experience for web3 apps in two ways:

* It enables non-web3 native users to get started easily without having to create a wallet with an external provider like MetaMask.
* It hides transaction confirmations from users. With a local wallet, you can generate wallets on the backend, and each app can have one wallet that is app-scoped.
## NFT

A Non-fungible token (NFT) is a type of cryptographic token that represents something unique; non-fungible tokens are thus not mutually interchangeable. It is defined by the [ERC-721 standard](https://eips.ethereum.org/EIPS/eip-721), which is a standard for creating NFTs on the Ethereum blockchain. This is in contrast to ERC-20 tokens, which are 1:1 exchangeable.

An analogy to highlight this difference is that an ERC-20 token is like a $20 bill, where the value of Sally's $20 bill is equivalent to the value of John's $20 bill. Think of an NFT as a collector's item, like a rare baseball card. Each card, or NFT, is unique and has different values based on the player, the year it was made, its condition, and other factors. When you buy a rare baseball card, you often get a certificate of authenticity and know the history of the card — who owned it, when it was sold, etc. The same applies to NFTs, but this information is recorded on the blockchain, making it transparent and impossible to forge. An NFT contains information on the token's provenance. The entire history of that NFT, including its creation and any subsequent transactions, is recorded on the blockchain, providing proof of authenticity and ownership.
## Non-Custodial Wallet

A non-custodial wallet (also known as a self-custody wallet) is a wallet where the user has full control of their security & assets. The user is solely responsible for the security of their private key and therefore their funds. Examples of non-custodial wallets are Coinbase Wallet, Electron, and Ledger.
## Paymaster

A paymaster is a smart contract that relays transactions. It provides a service that enables a third party to pay the transaction fee on behalf of the user by funding the paymaster in advance. The Paymaster acts as a gas reserve which then can be used during the call execution via the`EntryPoint` contract.

The thirdweb paymaster is initially paid for by thirdweb. By using an [API key](https://portal.thirdweb.com/api-keys), the usage is tracked and billed.
## Permissionless

On the context of smart contracts, permissionless means that anyone can interact with the contract without needing special permission or approval. Smart contracts can be deployed on public blockchains like Ethereum, promoting open access and transparency. While anyone can interact with a permissionless smart contract, the contract's code may still limit certain operations (like modifying the contract or accessing certain data) to specific roles, such as the contract's owner or creator.
## Composability

Composability refers to the ability for different protocols and smart contracts to interact and build upon each other. It allows for the creation of new products and services without having to build everything from scratch.

Thirdweb is completely composable. Each product can be used independently or in combination with other products. For example, you can use the [SDKs](https://portal.thirdweb.com/connect) or [Dashboard](https://thirdweb.com/team) with **any** contract. Similarly, you can use the [Solidity SDK](https://portal.thirdweb.com/contracts/build/overview)without using the [Dashboard](https://thirdweb.com/team) or [TypeScript/JavaScript SDK](https://portal.thirdweb.com/typescript/v5).

So, if you already have your own workflow which works for you, you can pick and choose which products you want to use.
## Proxy Contracts

A Proxy smart contract contains the [Storage](https://portal.thirdweb.com/storage) for an upgradable contract that allows you to modify its logic post-deployment.

A smart contract is made up of (1) persistent state/storage, and (2) logic defined for how this state can be mutated. Upgrading a smart contract means changing the logic defined for how the smart contract’s state can be mutated.

An “upgradeable smart contract” is two smart contracts considered together as one system:

* **Proxy smart contract**: The smart contract whose state/storage we’re concerned with.
* **Implementation smart contract**: A stateless smart contract that defines the logic for how the proxy smart contract’s state can be mutated.

To _upgrade_ the smart contract, simply deploy a new implementation contract and call the upgrade function on the proxy contract to _upgrade_ to the new implementation.
## RPC URLs

An RPC (Remote Procedure Call) URL is an endpoint that enables an application to communicate with a blockchain network. It is used to send requests (initiate transactions) and receive responses (read data) from the blockchain, enabling developers to build applications that interact with the blockchain.

Out of the box, we provide free [RPC URLs](https://thirdweb.com/chainlist) for all supported blockchains, including All EVM-compatible networks.
## Minting

Minting is the process of creating new tokens on the blockchain. These tokens can be any type of asset, such as ERC-20, ERC-721 or ERC-1155 tokens. Minting is usually done by the creator of the token (the default admin), but can also be done by anyone who has been given [permission](https://portal.thirdweb.com/contracts/build/extensions/general/Permissions) to mint tokens by the creator.

Minting is enabled on contracts that implement a `mint` function.
## Signature-based Minting

Signature-based minting, or "on-demand minting" allows a smart contract admin to generate signatures that can be used by other wallets to allow them to mint tokens on your smart contract in real-time.

This allows you to conditionally generate signatures based on some condition/criteria, or allow a user to mint NFTs with metadata that you specify. Enabling use cases such as:

* [Allowing NFT holders to mint for free](https://blog.thirdweb.com/guides/signature-drop/)
* [Creating a community-made NFT collection](https://blog.thirdweb.com/guides/mint-nft-unique-code/)
* [Restricted mints to users who are GitHub contributors](https://blog.thirdweb.com/guides/allow-github-contributors-to-mint-an-nft/)
* [Restricted mints to Discord members](https://github.com/thirdweb-example/community-rewards)
## Smart Contract

A smart contract is a computer program, stored on the blockchain. Smart contracts allow trustless transactions to be executed without third parties - the smart contract enforces the rules of the transaction automatically. These transactions are trackable and irreversible.

Key features of smart contracts are:

* **Autonomous**: Once a smart contract is initiated, it can act by itself without further participant involvement.
* **Decentralized**: No single party has control over the entirety of the contract, and it cannot be modified after deployment.
* **Deterministic**: Outcomes can be determined from the inputs and the contract code.
## Smart Account

A Smart Account is a wallet that is controlled by a smart contract following the [ERC-4337 specification](https://eips.ethereum.org/EIPS/eip-4337).

Ethereum has 2 types of accounts to transfer and receive tokens: EOAs (Externally Owned Accounts) and Contract Accounts. A smart contract wallet is a wallet managed by a contract account instead of an EOA. A smart account is a wallet type requiring **no private keys or seed phrases**. Smart contract wallets rely on code instead of private keys to secure and recover wallet information. Instead, you set _who_ and _under what conditions_, users may access the wallet via smart contracts.

**A smart contract wallet is a type of Web3 wallet powered by smart contracts.**

This smart account is unlocked by a 'key' - a personal account. This key can be anything from a [MetaMask wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.metamask) or even an [in-App Wallet](https://portal.thirdweb.com/typescript/v5/in-app-wallet) and is used as a way to 'sign in' to the wallet.

Benefits of Smart Accounts:

* Optimized transaction efficiency & batch transactions  
   * Combine multiple transactions into a single transaction to save on [gas fees](https://portal.thirdweb.com/glossary/gas)
* Improved Security Features
* Social & Multi-Sig Recovery  
   * Recover a wallet without seed phrases/passwords  
   * Nominate a trusted person to recover your wallet in the case of an emergency

### Terminology

#### UserOperations

This is the data structure for the transaction that the user wants to perform. It contains the following fields:

* `sender`: The account making the operation.
* `nonce`: Anti-replay parameter; also used as the salt for first-time account creation.
* `initCode`: The initialization code needed to create the account (needed if and only if the account is not yet onchain).
* `callData`: The data to pass to the `sender` during the operation.
* `callGasLimit`: The amount of gas to allocate for the operation.
* `verificationGasLimit`: The amount of gas to allocate for the verification step.
* `preVerificationGas`: The amount of gas to pay for to compensate the bundler for pre-verification execution and calldata.
* `maxFeePerGas`: Maximum fee per gas (similar to [EIP-1559](https://eips.ethereum.org/EIPS/eip-1559) `max_fee_per_gas`).
* `maxPriorityFeePerGas`: Maximum priority fee per gas (similar to [EIP-1559](https://eips.ethereum.org/EIPS/eip-1559)).
* `paymasterAndData`: Address of paymaster sponsoring the transaction, followed by extra data to send to the paymaster (empty for self-sponsored transaction).
* `signature`: Data passed into the account along with the nonce during the verification step. Should depend on the `chainid` and `EntryPoint` address to prevent replay attacks.

#### EntryPoint

The EntryPoint is a singleton contract (a contract that has a predictable address that is the same on every chain). It has two methods that are used as entry points to execute bundles of UserOperations: `handleOps` and `handleAggregatedOps`.

#### Bundler (relayer)

A bundler is a smart contract that bundles multiple 'UserOperations' into a single bundle, a `handleOps` call, to the `EntryPoint` contract.

#### Paymaster

A paymaster is a smart contract that relays transactions. It provides a service that enables a third party to pay the transaction fee on behalf of the user by funding the paymaster in advance. The Paymaster acts as a gas reserve which then can be used during the call execution via `EntryPoint`. The thirdweb [Account ABstraction](https://portal.thirdweb.com/connect/account-abstraction) paymaster is initially paid for by thirdweb. By using an API key, the usage is tracked and billed.
## Soulbound Tokens

Soulbound tokens refer to NFTs that are permanently attached to a specific wallet address on the blockchain.

Once a soulbound token is created, it cannot be transferred, sold, or traded to another address.
## Token

A token is a type of digital asset that represents a particular value or utility. Tokens are defined by smart contracts which follow a token standard such as the ERC-20, ERC-1155 or ERC-721 standards.

Tokens are a critical component of decentralized applications (dApps) built on top of blockchain platforms. They can incentivize certain behaviors, represent ownership of digital or physical assets, or facilitate transactions within the dApp's ecosystem.
## Wallet

A wallet is a user's way of interacting with the blockchain. Wallets can be used to store, send, and receive blockchain assets such as ERC-20 tokens and NFTS.
## Staking

Staking is the process of locking up tokens to support the operations of a blockchain network. In return for staking, users receive rewards in the form of additional tokens. Staking is a key element of Proof of Stake (PoS) consensus mechanisms, which are used by many blockchains to secure their networks.

When you stake your tokens, you essentially lock them up in the network for a certain period. Depending on the specific protocol, staking your tokens might allow you to participate in network governance (voting on various decisions), validate transactions, and earn rewards.

Staking serves the dual purpose of incentivizing participants to operate in the best interest of the network (since they have a financial stake in it) and deter malicious activity (since malicious actors stand to lose their staked tokens).
## Glossary

This section aims to guide you through web3 concepts, including [EIPs](https://eips.ethereum.org/) and thirdweb-specific innovations.

| Term                                                                                      | Description                                                                                                                                                                                                                                                                                        |
| ----------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [Claim phases](https://portal.thirdweb.com/glossary/claim-phases)                         | Claim phases or "claim conditions" allow you to configure various aspects of a drop; such as who can claim tokens, how many tokens will be released, the price of each token, release date, etc.                                                                                                   |
| [Claiming](https://portal.thirdweb.com/glossary/claiming)                                 | Claiming is the process of transferring token ownership to the claimer's wallet..                                                                                                                                                                                                                  |
| [Composability](https://portal.thirdweb.com/glossary/composability)                       | Composability refers to the ability for different protocols and smart contracts to interact and build upon each other.                                                                                                                                                                             |
| [Delayed reveal](https://portal.thirdweb.com/glossary/delayed-reveal)                     | Delayed reveal is a feature that allows you to release NFTs in a drop with hidden content that can only be revealed at a later time. The owner of the smart contract (or a wallet with the appropriate permissions) can lazy-mint a batch of NFTs, along with placeholder metadata and a password. |
| [Drop](https://portal.thirdweb.com/glossary/drop)                                         | A drop smart contract allows the owner of the contract to lazy mint NFTs (unless it is an ERC20 drop), and have other users mint them, typically under the conditions defined in the smart contract’s claim phases, although these are not required.                                               |
| [Externally Owned Account](https://portal.thirdweb.com/glossary/externally-owned-account) | An Externally Owned Account (EOA) is an account controlled by the owner of the account's private key.                                                                                                                                                                                              |
| [Factory Contract](https://portal.thirdweb.com/glossary/factory-contract)                 | A factory contract is a smart contract that is used to deploy other smart contracts.                                                                                                                                                                                                               |
| [Gas fees](https://portal.thirdweb.com/glossary/gas)                                      | All transactions (operations that change information stored on the blockchain) require a gas fee, which is used to cover the costs of the computational resources to execute that transaction.                                                                                                     |
| [Gasless Transactions](https://portal.thirdweb.com/glossary/gasless-transactions)         | Gasless transactions, also known as meta-transactions, are transactions that have the gas fee paid for by a third party instead of the transaction sender. Typically, this means the dApp owner covers the gas costs of their users' transactions, providing a more seamless user experience.      |
| [Interoperability](https://portal.thirdweb.com/glossary/interoperability)                 | Interoperability refers to the ability of different networks to share data or assets (like tokens) and interact with each other.                                                                                                                                                                   |
| [IPFS](https://portal.thirdweb.com/glossary/ipfs)                                         | IPFS is a protocol to store files in a decentralized peer-to-peer network.                                                                                                                                                                                                                         |
| [Lazy minting](https://portal.thirdweb.com/glossary/lazy-minting)                         | Lazy minting is the preparation of NFT metadata without actually minting the NFT to a wallet address.                                                                                                                                                                                              |
| [Local Wallet](https://portal.thirdweb.com/glossary/local-wallet)                         | A local wallet is a type of wallet that allows you to create wallets within your application or project.                                                                                                                                                                                           |
| [Minting](https://portal.thirdweb.com/glossary/minting)                                   | Minting is the process of creating new tokens on the blockchain..                                                                                                                                                                                                                                  |
| [NFT](https://portal.thirdweb.com/glossary/nft)                                           | A Non-fungible token (NFT) is a type of cryptographic token that is not mutually interchangeable.                                                                                                                                                                                                  |
| [Non-custodial Wallet](https://portal.thirdweb.com/glossary/non-custodial-wallet)         | A non-custodial wallet (also known as a self-custody wallet) is a wallet where the user is solely responsible for their private key.                                                                                                                                                               |
| [Permissionless](https://portal.thirdweb.com/glossary/permissionless)                     | Anyone can interact with a smart contract without needing special permission or approval.                                                                                                                                                                                                          |
| [Proxy Contracts](https://portal.thirdweb.com/glossary/local-wallet)                      | A Proxy smart contract contains the [Storage](https://portal.thirdweb.com/storage) for an upgradable contract that allows you to modify its logic post-deployment.                                                                                                                                 |
| [RPC URL](https://portal.thirdweb.com/glossary/rpc)                                       | An RPC URL is an endpoint that enables an application to communicate with a blockchain network. It is used to send requests (initiate transactions) and receive responses (read data) from the blockchain, enabling developers to build applications that interact with the blockchain.            |
| [Signature-based minting](https://portal.thirdweb.com/glossary/signature-based-minting)   | Signature-based minting, or "on-demand minting" allows a smart contract admin to generate signatures that can be used by other wallets to allow them to mint tokens on your smart contract in real-time.                                                                                           |
| [Smart Contract](https://portal.thirdweb.com/glossary/smart-contract)                     | A smart contract is a computer program, stored on the blockchain.                                                                                                                                                                                                                                  |
| [Smart Wallet](https://portal.thirdweb.com/glossary/smart-wallet)                         | A Smart Wallet is a wallet that is controlled by a smart contract following the [ERC-4337 specification](https://eips.ethereum.org/EIPS/eip-4337).                                                                                                                                                 |
| [Soulbound tokens](https://portal.thirdweb.com/glossary/soulbound)                        | Soulbound tokens refer to NFTs that are permanently attached to a specific wallet address on the blockchain.                                                                                                                                                                                       |
| [Staking](https://portal.thirdweb.com/glossary/staking)                                   | Staking is the process of locking up tokens to support the operations of a blockchain network.                                                                                                                                                                                                     |
| [Token](https://portal.thirdweb.com/glossary/token)                                       | A token is a type of digital asset that represents a particular value or utility.                                                                                                                                                                                                                  |
| [Wallet](https://portal.thirdweb.com/glossary/wallet)                                     | A wallet is a user's way of interacting with the blockchain..                                                                                                                                                                                                                                      |
| [Bundler](https://portal.thirdweb.com/glossary/bundler)                                   | A bundler is a node that monitors the alternative mempool of UserOperations and bundles multiple UserOps together to forward to the EntryPoint contract as a single transaction.                                                                                                                   |
## Blueprints

A blueprint is an API that provides access to on-chain data in a user-friendly format. There's no need for ABIs, decoding, RPC, or web3 knowledge to fetch blockchain data. Every chain exposes the default blueprints below

All blueprints support [multichain queries](https://portal.thirdweb.com/insight/multichain-queries)!

### Events Blueprint

Blockchain events offers developers a powerful way to track and analyze blockchain events emitted by smart contracts. This endpoint provides access to detailed event information, such as the address of the contract that generated the event, the transaction that triggered it, and when and where the event occurred on the blockchain. By offering data points like event topics, block numbers, and transaction hashes, developers can easily filter and search for specific event types, such as token transfers or contract executions. With precise timestamps and block references, the Events Blueprint ensures that developers have real-time access to critical on-chain activity, enabling them to build responsive, high-performance applications that can monitor, analyze, and react to blockchain events seamlessly. Whether working on DeFi, NFTs, or general dApps, this endpoint helps unlock the full potential of blockchain data in any project.

#### Blueprint details

| Name              | Description                                                                                                                                                                                                                               | Example                                                                                                                                                                                                                                                                                            |
| ----------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Address           | The address is the identifier of the smart contract or account that emitted the event. It tells you who or what generated the event.                                                                                                      | If the event is related to an ERC-20 token transfer, the address would be the smart contract address of the token. For instance, if you're tracking events for the USDT token, the address would be the contract address of USDT on Ethereum.                                                      |
| Chain ID          | The chain\_id is a unique identifier for the blockchain network where the event occurred. Different blockchain networks (e.g., Ethereum, Binance Smart Chain, Polygon) have their own unique chain IDs.                                   | Ethereum's mainnet has a chain\_id of 1, while Binance Smart Chain has a chain\_id of 56\. This field ensures you know which network the event is coming from, which is crucial when interacting with multiple EVM chains.                                                                         |
| Data              | The data field contains additional information specific to the event. In many cases, it's the raw output of the smart contract event.                                                                                                     | In an ERC-20 Transfer event, the data might include the number of tokens transferred in raw hexadecimal format. For instance, if 1000 USDT were transferred, this value would be encoded in the event's data field.                                                                                |
| Log Index         | The log\_index is the order of the log (event) in the list of all events within the block. It helps you pinpoint exactly where this event is located in the block.                                                                        | If multiple events occurred within the same block (e.g., multiple token transfers), the log\_index tells you the sequence of this particular event. For example, it might be the 3rd event in the block.                                                                                           |
| Topics            | The topics array contains indexed parameters of the event, often used for filtering or categorizing events. The first topic contains the event signature (the function name), while the remaining topics contain indexed event arguments. | In an ERC-20 Transfer event, the first topic would be the hash of the event signature Transfer(address,address,uint256). The second topic would be the sender's address, and the third would be the receiver's address. This allows filtering to track all Transfer events for a specific address. |
| Transaction Hash  | The transaction\_hash is the unique identifier for the transaction that triggered the event. It helps you link the event to the specific transaction that caused it.                                                                      | If you transfer 1 ETH to another wallet, the transaction hash might be 0x5c7b6f... which uniquely identifies that transaction. Using this hash, you can look up the transaction in any block explorer (e.g., Etherscan) to see all the details.                                                    |
| Transaction Index | The transaction\_index tells you the position of the transaction within the block. This helps you identify where in the block this particular transaction was placed relative to others.                                                  | If multiple transactions occurred within the same block (e.g., multiple token transfers), the transaction\_index tells you the sequence of this particular transaction. For example, it might be the 3rd transaction in the block.                                                                 |
| Block Hash        | A block\_hash is the unique identifier of a block, generated after the block is confirmed. It's like a tamper-proof record of all the transactions and events in that block.                                                              | If you wanted to verify that a particular transaction or event was part of a block, you could use the block hash to check its integrity. Think of it as a digital signature for the entire block, such as 0x91d... representing all transactions within that specific block.                       |
| Block Number      | The block\_number indicates the position of the block in the blockchain. It tells you when (in terms of blockchain sequence) the event occurred.                                                                                          | Block number 12,345,678 on Ethereum might contain transactions from a particular moment, such as the transfer of 10 ETH between two accounts. You can think of block numbers like page numbers in a ledger.                                                                                        |
| Block Timestamp   | The block\_timestamp is the exact time when the block was mined and added to the blockchain.                                                                                                                                              | If block 12,345,678 was mined on July 1, 2023, at 12:30 PM UTC, the timestamp will reflect this exact moment. This helps you pinpoint when an event, such as a token transfer, actually happened in real time.                                                                                     |

### Transactions Blueprint

Transaction data equips developers with the tools they need to interact with blockchain data efficiently and effectively. By providing clear, actionable insights into each transaction, the API helps streamline tasks like monitoring smart contract interactions, tracking asset transfers, and debugging. Developers can rely on this endpoint to access essential transaction details, enabling faster troubleshooting and more informed decision-making. Whether building DeFi platforms, dApps, or blockchain-based analytics tools, transaction data is the essence for all interactions with any chains.

#### Blueprint details

| Name                     | Description                                                                                                                                                                                                                      | Example                                                                                                                                                                                                                                                                                                       |
| ------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| From Address             | This is the address that initiated the transaction. It represents the sender who paid for the gas to execute the transaction.                                                                                                    | If a user sends 1 ETH from their wallet, the from\_address will be the sender's Ethereum address, such as 0xabc123....                                                                                                                                                                                        |
| To Address               | This is the recipient of the transaction. It could be another wallet or a smart contract.                                                                                                                                        | If sending ETH to a friend, their wallet address, like 0xdef456..., would be the to\_address. In the case of interacting with a DeFi platform, the address of the smart contract being called would be the to\_address.                                                                                       |
| Hash                     | The unique identifier (hash) of the transaction. This hash can be used to look up and verify the transaction on the blockchain.                                                                                                  | A transaction might have a hash like 0x5c7b6f.... You can use this hash to check the transaction status on a block explorer like Etherscan.                                                                                                                                                                   |
| Value                    | This is the amount of cryptocurrency (in wei) being transferred in the transaction.                                                                                                                                              | If transferring 1 ETH, the value would be 1,000,000,000,000,000,000 wei (1 ETH = 10^18 wei).                                                                                                                                                                                                                  |
| Gas                      | This is the maximum amount of gas units the sender is willing to pay for the transaction to be processed. It limits how much work the transaction can perform on the blockchain.                                                 | A simple ETH transfer might require 21,000 gas, while calling a complex smart contract function could require significantly more, such as 100,000 gas.                                                                                                                                                        |
| Gas Price                | The price per gas unit the sender is willing to pay, expressed in wei (the smallest unit of ETH). The total transaction cost is calculated as gas \* gas\_price.                                                                 | If the gas\_price is 100 gwei (1 gwei = 1 billion wei), the sender will pay 100 gwei \* 21,000 gas for a basic ETH transfer.                                                                                                                                                                                  |
| Max Fee Per Gas          | This is the maximum amount of gas fees (in wei) the sender is willing to pay for each gas unit. It was introduced in EIP-1559 to provide a cap on gas costs.                                                                     | If max\_fee\_per\_gas is set to 200 gwei, the sender is ensuring that they will never pay more than this for each gas unit, even during periods of high network congestion.                                                                                                                                   |
| Max Priority Fee Per Gas | This is the maximum additional fee the sender is willing to pay to incentivize miners to prioritize their transaction. Also introduced in EIP-1559.                                                                              | A transaction might specify a max\_priority\_fee\_per\_gas of 2 gwei, which acts as a "tip" for miners to get their transaction included faster in a block.                                                                                                                                                   |
| Data                     | The data field contains additional information required by a transaction, such as the input parameters for interacting with a smart contract.                                                                                    | In a call to a DeFi contract's swap function, the data field will include the encoded function call and arguments (e.g., token amount, recipient address).                                                                                                                                                    |
| Nonce                    | The nonce is the number of transactions sent from the sender's address. It ensures that transactions are processed in the correct order and prevents double-spending.                                                            | If the sender has sent 5 transactions before, the nonce will be 5\. This helps in tracking the sequence of transactions and ensuring that each one is processed correctly.                                                                                                                                    |
| Transaction Index        | The position of the transaction within the block. It indicates the order in which the transaction was included relative to other transactions                                                                                    | If the transaction\_index is 5, this was the 6th transaction included in the block.                                                                                                                                                                                                                           |
| Transaction Type         | The type of transaction, typically either legacy (type 0x0 ) or one of the newer types introduced in EIP-1559 (e.g., type 0x2 for transactions that use the new gas fee mechanism).                                              | A transaction\_type of 0x2 indicates the transaction follows the new EIP-1559 rules for gas fees.                                                                                                                                                                                                             |
| Access List              | The access\_list is an optional field introduced in EIP-2930 that specifies which addresses and storage slots the transaction intends to interact with. It's used to optimize gas costs by pre-declaring the data access needed. | When a transaction interacts with a smart contract, the access\_list may declare the contract address and storage slots the transaction intends to read from or write to. For example, interacting with a DeFi smart contract could include its contract address and the storage slots holding user balances. |
| Chain ID                 | The chain\_id identifies the blockchain network on which the transaction was conducted. It prevents replay attacks across different networks.                                                                                    | On Ethereum mainnet, the chain ID is 1, while on Base Mainnet, the chain ID is 8453 . This field tells you which network the transaction belongs to.                                                                                                                                                          |
| Block Hash               | This is the unique identifier (or "fingerprint") of the block that includes this transaction. The hash ensures that the block hasn't been altered.                                                                               | If the transaction is included in block 12,345,678, the block's hash might look like 0xabc123..., and this hash can be used to reference that particular block on the blockchain.                                                                                                                             |
| Block Number             | The block\_number indicates the specific position of the block in the blockchain that contains the transaction.                                                                                                                  | If a transaction is included in block 12,345,678, this number can be used to quickly locate the block and all the transactions it contains.                                                                                                                                                                   |
| Block Timestamp          | This is the exact time when the block containing the transaction was mined and added to the blockchain.                                                                                                                          | If the transaction was confirmed on July 1, 2023, at 12:30 PM UTC, the block timestamp will reflect this moment. It's useful for analyzing when specific activities (like token transfers) occurred.                                                                                                          |
| r, s, v                  | These are the cryptographic components of the transaction signature. They prove that the transaction was signed by the private key associated with the sender's address.                                                         | The r, s, and v values are produced during the signing process and are necessary to verify the authenticity of the transaction on the blockchain.                                                                                                                                                             |

### Tokens Blueprint

Tokens on blockchain can be of different standards, but ones of the most widely used ones are:

* ERC-20 for fungible tokens
* ERC-721 and ERC-1155 for NFTs

This blueprint provides access to such tokens' balances information for a given owner address.

#### Blueprint details

##### ERC-20 balances of an address

```yaml
GET /v1/{clientId}/tokens/erc20/:ownerAddress
```

Path Parameters:

* `ownerAddress` _(required)_: The address of the owner of the tokens.
* `clientId` _(required)_: The thirdweb client ID of your project.

Successful response schema:

```json
[
  {
    "tokenAddress": "…",
    "balance": "…"
  }
]
```

##### ERC-721 tokens of an address

```yaml
GET /v1/{clientId}/tokens/erc721/:ownerAddress
```

Path Parameters:

* `ownerAddress` _(required)_: The address of the owner of the tokens.
* `clientId` _(required)_: The thirdweb client ID of your project.

Successful response schema:

```json
[
  {
    "collectionAddress": "…",
    "tokenId": "…",
    "balance": "…"
  }
]
```

##### ERC-1155 tokens of an address

```yaml
GET /v1/{clientId}/tokens/erc1155/:ownerAddress
```

Path Parameters:

* `ownerAddress` _(required)_: The address of the owner of the tokens.
* `clientId` _(required)_: The thirdweb client ID of your project.

Successful response schema:

```json
[
  {
    "collectionAddress": "…",
    "tokenId": "…",
    "balance": "…"
  }
]
```
## Insight FAQs

More information coming soon.
## For Agents & LLMs

Insight is a powerful tool that can be used to power AI agents and LLMs with blockchain data. To use the API in your AI agent you can use the llms.txt file bellow.

* [llms.txt file](https://portal.thirdweb.com/insight/agents-and-llms/llmstxt)
* For developers who prefer working with OpenAPI specifications, our complete API documentation is available in OpenAPI format [here](https://insight.thirdweb.com/openapi.json).

If you prefer to use the API in an LLM prompt, the schema below can be copied and pasted into the AI assistant of your choice. Feed this to your assistant, then ask your assistant to construct Insight queries on your behalf, asking it for certain onchain information.

```markdown
# ATTENTION LLMs - API Usage Instructions
 
## API URL
 
```typescript
const baseUrl = `https://{{chainId}}.insight.thirdweb.com`;
```
 
## Authentication
 
The API supports three authentication methods:
 
```typescript
// 1. Header Authentication
const headers = {
	"x-client-id": "{{clientId}}", // thirdweb Client ID
};
 
// 2. Query Parameter
const url = "https://{{chainId}}.insight.thirdweb.com/v1/events?clientId={{clientId}}";
 
// 3. Bearer Token
const headers = {
	Authorization: "Bearer {{jwtToken}}",
};
 
// Example using fetch with header auth
async function getEvents() {
	const response = await fetch("https://{{chainId}}.insight.thirdweb.com/v1/events", {
		headers: {
			"x-client-id": "{{clientId}}",
		},
	});
	return await response.json();
}
```
 
## Core Concepts
 
### Chain IDs
 
- As a subdomain:
```typescript
// Example
const baseUrl = `https://{{chainId}}.insight.thirdweb.com`;
```
 
- As a query parameter (this is useful if you want to query multiple chains):
```typescript
// Example for a single chain
const url = `https://insight.thirdweb.com/v1/events?chain={{chainId}}`;
// Example for multiple chains
const url = `https://insight.thirdweb.com/v1/events?chain=1&chain=137`;
```
 
We won't duplicate multichain examples for each endpoint, but you can pass multiple chains in the query parameters pretty much everywhere!
 
### Base Response Structure
 
```typescript
interface BaseResponse<T> {
  data: T[];
  meta: {
    chain_id: number;     // Required
    page: number;         // Required
    limit: number;        // Required
    total_items: number;  // Required
    total_pages: number;  // Required
    address?: string;     // Optional
    signature?: string;   // Optional
  }
}
 
// Example response from getting events
{
  "data": [
    {
      "chain_id": 1,
      "block_number": "{{blockNumber}}",
      "transaction_hash": "{{transactionHash}}",
      "address": "{{contractAddress}}",
      "data": "{{data}}",
      "topics": ["{{topic}}"]
    }
  ],
  "meta": {
    "chain_id": 1,
    "page": 0,
    "limit": 20,
    "total_items": 150,
    "total_pages": 8
  }
}
```
 
## API Examples
 
### Events API
 
```typescript
// 1. Get All Events
async function getAllEvents() {
	const response = await fetch("https://{{chainId}}.insight.thirdweb.com/v1/events", {
		headers: { "x-client-id": "{{clientId}}" },
	});
	return await response.json();
}
 
// 2. Get Contract Events with Filtering
async function getContractEvents(contractAddress: string) {
	const params = new URLSearchParams({
		filter_block_number_gte: blockNumber,
		sort_by: "block_timestamp",
		sort_order: "desc",
		limit: "{{limit}}",
	});
 
	const url = `https://{{chainId}}.insight.thirdweb.com/v1/events/{{contractAddress}}?${params}`;
	const response = await fetch(url, {
		headers: { "x-client-id": "{{clientId}}" },
	});
	return await response.json();
}
```
 
### Token Balance API
 
```typescript
// 1. Get ERC20 Balances
async function getERC20Balances(ownerAddress: string) {
	const response = await fetch(
		`https://{{chainId}}.insight.thirdweb.com/v1/tokens/erc20/${ownerAddress}`,
		{ headers: { "x-client-id": "{{clientId}}" } },
	);
	const data = await response.json();
	// Example response:
	// {
	//   "data": [
	//     {
	//       "tokenAddress": "0x123...",
	//       "balance": "1000000000000000000"
	//     }
	//   ]
	// }
	return data;
}
 
// 2. Get NFT Balances
async function getNFTBalances(ownerAddress: string) {
	const response = await fetch(
		`https://{{chainId}}.insight.thirdweb.com/v1/tokens/erc721/${ownerAddress}`,
		{ headers: { "x-client-id": "{{clientId}}" } },
	);
	const data = await response.json();
	// Example response:
	// {
	//   "data": [
	//     {
	//       "collectionAddress": "0x456...",
	//       "tokenId": "1",
	//       "balance": "1"
	//     }
	//   ]
	// }
	return data;
}
```
 
### Using Filters
 
```typescript
// Example: Get events with complex filtering
async function getFilteredEvents() {
	const params = new URLSearchParams({
		// Block filters
		filter_block_number_gte: blockNumberStart,
		filter_block_number_lte: blockNumberEnd,
 
		// Time filters
		filter_block_timestamp_gte: "{{timestamp}}",
 
		// Transaction filters
		filter_from_address: "{{fromAddress}}",
		filter_value_gte: "{{value}}", // 1 ETH
 
		// Pagination
		page: "{{page}}",
		limit: "{{limit}}",
 
		// Sorting
		sort_by: "{{sortBy}}",
		sort_order: "{{sortOrder}}",
	});
 
	const response = await fetch(
		`https://{{chainId}}.insight.thirdweb.com/v1/events?${params}`,
		{ headers: { "x-client-id": "{{clientId}}" } },
	);
	return await response.json();
}
```
 
### Error Handling
 
```typescript
async function safeApiCall() {
	try {
		const response = await fetch("https://{{chainId}}.insight.thirdweb.com/v1/events", {
			headers: { "x-client-id": "{{clientId}}" },
		});
 
		if (!response.ok) {
			const errorData = await response.json();
			// Example error response:
			// { "error": "Invalid client ID" }
			throw new Error(errorData.error);
		}
 
		return await response.json();
	} catch (error) {
		console.error("API Error:", error.message);
		throw error;
	}
}
```
 
## API Reference
 
### Events API
 
1. **Get All Events**
 
```typescript
GET /v1/events
 
interface EventsResponse {
  data: Event[];
  meta: MetaData;
}
```
 
2. **Get Contract Events**
 
```typescript
GET /v1/events/:contractAddress
```
 
3. **Get Specific Event Type**
 
```typescript
GET /v1/events/:contractAddress/:signature
```
 
### Transactions API
 
1. **Get All Transactions**
 
```typescript
GET /v1/transactions
```
 
2. **Get Contract Transactions**
 
```typescript
GET /v1/transactions/:contractAddress
```
 
3. **Get Specific Transaction Type**
 
```typescript
GET /v1/transactions/:contractAddress/:signature
```
 
### Token Balance API
 
1. **ERC20 Balances**
 
```typescript
GET /v1/tokens/erc20/:ownerAddress
 
interface ERC20Response {
  data: {
    tokenAddress: string;  // Required
    balance: string;      // Required
  }[];
}
```
 
2. **ERC721 & ERC1155 Balances**
 
```typescript
GET /v1/tokens/erc721/:ownerAddress
GET /v1/tokens/erc1155/:ownerAddress
 
interface TokenBalanceResponse {
  data: {
    collectionAddress: string;  // Required
    tokenId: string;           // Required
    balance: string;           // Required
  }[];
}
```
 
## Query Parameters
 
### Common Parameters
 
```typescript
interface CommonQueryParams {
	page?: number;      // Default: 0
	limit?: number;     // Default: 20, must be > 0
	sort_by?: "block_number" | "block_timestamp" | "transaction_index";
	sort_order?: "asc" | "desc";
	group_by?: string;  // Group results by a specific field
	aggregate?: string[]; // Apply aggregate functions (count, sum, avg, etc.) to grouped results
}
```
 
### Filter Types
 
1. **Block Filters**
 
```typescript
interface BlockFilters {
	filter_block_number?: number; // Example: 1000000
	filter_block_number_gte?: number; // Example: 1000000
	filter_block_number_gt?: number; // Example: 1000000
	filter_block_number_lte?: number; // Example: 1000000
	filter_block_number_lt?: number; // Example: 1000000
	filter_block_hash?: string; // Example: "0x3a1fba5..."
}
```
 
2. **Time Filters**
 
```typescript
interface TimeFilters {
	filter_block_timestamp?: number; // Example: 1715222400
	filter_block_timestamp_gte?: number; // Example: 1715222400
	filter_block_timestamp_gt?: number; // Example: 1715222400
	filter_block_timestamp_lte?: number; // Example: 1715222400
	filter_block_timestamp_lt?: number; // Example: 1715222400
}
```
 
3. **Transaction Filters**
 
```typescript
interface TransactionFilters {
	filter_transaction_index?: number;
	filter_transaction_hash?: string;
	filter_from_address?: string;
	filter_value?: string;    // Value in wei (e.g., "1000000000000000000" for 1 ETH)
	filter_value_gte?: string;
	filter_value_gt?: string;
	filter_value_lte?: string;
	filter_value_lt?: string;
	filter_gas_price?: number;
	filter_gas?: number;
	// Additional gte, gt, lte, lt variants for numeric fields
}
```
 
## Error Handling
 
All endpoints return standard error responses for 400 and 500 status codes:
 
```typescript
// 400 Bad Request
// 500 Internal Server Error
interface ErrorResponse {
	error: string; // Required
}
```
```
## Thirdweb Insight

Insight is a powerful tool that lets you retrieve blockchain data from any EVM chain, enrich it with metadata, and transform it using custom logic. Whether you're building a gaming inventory system, tracking DeFi metrics, or analyzing NFT collections, Insight makes it easy to get the data you need with simple API calls.

### Things to Keep in Mind

* **Rate Limiting**: The API has rate limits based on your authentication tier. Monitor your usage and implement appropriate retry logic.
* **Pagination**: When retrieving large datasets, use pagination parameters (`page` and `limit`) to avoid timeouts and manage response sizes effectively.
* **Chain Selection**: Always verify you're querying the correct chain ID. Using an incorrect chain ID will return a 404 error.
* **Data Freshness**: There may be a slight delay between on-chain events and their availability in the API due to block confirmation times.
* **Error Handling**: Implement proper error handling for both HTTP errors (400/500) and network issues. Consider implementing retries for transient failures.
* **Query Optimization**:  
   * Use specific filters to reduce response size and improve performance  
   * Avoid overly broad date ranges when possible  
   * Consider using aggregations for large datasets
* **Authentication**: Keep your authentication credentials secure and don't expose them in client-side code.
* **Response Processing**: Some numeric values are returned as strings to maintain precision. Convert them appropriately in your application.

### API URL

```typescript
const baseUrl = `https://{{chainId}}.insight.thirdweb.com`;
```

### Authentication

The API supports three authentication methods:

```typescript
// 1. Header Authentication
const headers = {
  "x-client-id": "{{clientId}}", // thirdweb Client ID
};
 
// 2. Query Parameter
const url = `https://{{chainId}}.insight.thirdweb.com/v1/events?clientId={{clientId}}`;
 
// 3. Bearer Token
const headers = {
  Authorization: "Bearer {{jwtToken}}",
};
 
// Example using fetch with header auth
async function getEvents() {
  const response = await fetch(
    `https://{{chainId}}.insight.thirdweb.com/v1/events`,
    {
      headers: {
        "x-client-id": "{{clientId}}",
      },
    },
  );
  return await response.json();
}
```

### Core Concepts

#### Chain IDs

The API supports chain IDs in the following formats:

* As a subdomain:

```typescript
// Example
const baseUrl = `https://{{chainId}}.insight.thirdweb.com`;
```

* As a query parameter (this is useful if you want to query multiple chains):

```typescript
// Example for a single chain
const url = `https://insight.thirdweb.com/v1/events?chain={{chainId}}`;
// Example for multiple chains
const url = `https://insight.thirdweb.com/v1/events?chain=1&chain=137`;
```

We won't duplicate multichain examples for each endpoint, but you can pass multiple chains in the query parameters pretty much everywhere!

#### Base Response Structure

```typescript
interface BaseResponse<T> {
  data: T[];
  meta: {
    chain_id: number;     // Required
    page: number;         // Required
    limit: number;        // Required
    total_items: number;  // Required
    total_pages: number;  // Required
    address?: string;     // Optional
    signature?: string;   // Optional
  }
}
 
// Example response from getting events
{
  "data": [
    {
      "chain_id": 1,
      "block_number": "17859301",
      "transaction_hash": "0x123...",
      "address": "0x456...",
      "data": "0x789...",
      "topics": ["0xabc..."]
    }
  ],
  "meta": {
    "chain_id": 1,
    "page": 0,
    "limit": 20,
    "total_items": 150,
    "total_pages": 8
  }
}
```

### API Examples

#### Events API

```typescript
// 1. Get All Events
async function getAllEvents(): Promise<BaseResponse<Event>> {
  const response = await fetch(
    `https://{{chainId}}.insight.thirdweb.com/v1/events`,
    {
      headers: { "x-client-id": "{{clientId}}" },
    },
  );
  return await response.json();
}
 
// 2. Get Contract Events with Filtering
async function getContractEvents(
  contractAddress: string,
): Promise<BaseResponse<Event>> {
  const params = new URLSearchParams({
    filter_block_number_gte: "{{blockNumber}}",
    sort_by: "block_timestamp",
    sort_order: "desc",
    limit: "50",
  });
 
  const url = `https://{{chainId}}.insight.thirdweb.com/v1/events/${contractAddress}?${params}`;
  const response = await fetch(url, {
    headers: { "x-client-id": "{{clientId}}" },
  });
  return await response.json();
}
```

#### Token Balance API

```typescript
// 1. Get ERC20 Balances
async function getERC20Balances(
  ownerAddress: string,
): Promise<ERC20Response> {
  const response = await fetch(
    `https://{{chainId}}.insight.thirdweb.com/v1/tokens/erc20/${ownerAddress}`,
    { headers: { "x-client-id": "{{clientId}}" } },
  );
  const data = await response.json();
  // Example response:
  // {
  //   "data": [
  //     {
  //       "tokenAddress": "0x123...",
  //       "balance": "1000000000000000000"
  //     }
  //   ]
  // }
  return data;
}
 
// 2. Get NFT Balances
async function getNFTBalances(ownerAddress: string) {
  const response = await fetch(
    `https://{{chainId}}.insight.thirdweb.com/v1/tokens/erc721/${ownerAddress}`,
    { headers: { "x-client-id": "{{clientId}}" } },
  );
  const data = await response.json();
  // Example response:
  // {
  //   "data": [
  //     {
  //       "collectionAddress": "0x456...",
  //       "tokenId": "1",
  //       "balance": "1"
  //     }
  //   ]
  // }
  return data;
}
```

#### Using Filters

```typescript
// Example: Get events with complex filtering
async function getFilteredEvents() {
  const params = new URLSearchParams({
    // Block filters
    filter_block_number_gte: "{{startBlock}}",
    filter_block_number_lte: "{{endBlock}}",
 
    // Time filters
    filter_block_timestamp_gte: "{{startTimestamp}}",
 
    // Transaction filters
    filter_from_address: "{{fromAddress}}",
    filter_value_gte: "{{minValue}}", // 1 ETH
 
    // Pagination
    page: "0",
    limit: "20",
 
    // Sorting
    sort_by: "block_timestamp",
    sort_order: "desc",
  });
 
  const response = await fetch(
    `https://{{chainId}}.insight.thirdweb.com/v1/events?${params}`,
    { headers: { "x-client-id": "{{clientId}}" } },
  );
  return await response.json();
}
```

#### Error Handling

```typescript
async function safeApiCall() {
  try {
    const response = await fetch(
      `https://{{chainId}}.insight.thirdweb.com/v1/events`,
      {
        headers: { "x-client-id": "{{clientId}}" },
      },
    );
 
    if (!response.ok) {
      const errorData = await response.json();
      // Example error response:
      // { "error": "Invalid client ID" }
      throw new Error(errorData.error);
    }
 
    return await response.json();
  } catch (error) {
    console.error("API Error:", error.message);
    throw error;
  }
}
```

### API Reference

#### Events API

* **Get All Events**

```typescript
GET https://{{chainId}}.insight.thirdweb.com/v1/events
```

or

```typescript
GET https://insight.thirdweb.com/v1/events?chainId={{chainId1}}&chainId={{chainId2}}
```

* **Get Contract Events**

```typescript
GET https://{{chainId}}.insight.thirdweb.com/v1/events/:contractAddress
```

* **Get Specific Event Type**

```typescript
GET https://{{chainId}}.insight.thirdweb.com/v1/events/:contractAddress/:signature
```

#### Transactions API

* **Get All Transactions**

```typescript
GET https://{{chainId}}.insight.thirdweb.com/v1/transactions
```

* **Get Contract Transactions**

```typescript
GET https://{{chainId}}.insight.thirdweb.com/v1/transactions/:contractAddress
```

* **Get Specific Transaction Type**

```typescript
GET https://{{chainId}}.insight.thirdweb.com/v1/transactions/:contractAddress/:signature
```

#### Token Balance API

* **ERC20 Balances**

```typescript
GET https://{{chainId}}.insight.thirdweb.com/v1/tokens/erc20/:ownerAddress
 
interface ERC20Response {
  data: ERC20Balance[];
}
 
interface ERC20Balance {
  tokenAddress: string;
  balance: string;
}
```

* **ERC721 & ERC1155 Balances**

```typescript
GET https://{{chainId}}.insight.thirdweb.com/v1/tokens/erc721/:ownerAddress
GET https://{{chainId}}.insight.thirdweb.com/v1/tokens/erc1155/:ownerAddress
 
interface TokenBalance {
  data: NFTBalance[];
}
 
interface NFTBalance {
  collectionAddress: string;
  tokenId: string;
  balance: string;
}
```

### Query Parameters

#### Common Parameters

```typescript
interface CommonQueryParams {
  page?: number; // Default: 0
  limit?: number; // Default: 20, must be > 0
  sort_by?: "block_number" | "block_timestamp" | "transaction_index";
  sort_order?: "asc" | "desc";
  group_by?: string;
  aggregate?: string[];
}
```

#### Filter Types

* **Block Filters**

```typescript
interface BlockFilters {
  filter_block_number?: number; // Example: 1000000
  filter_block_number_gte?: number; // Example: 1000000
  filter_block_number_gt?: number; // Example: 1000000
  filter_block_number_lte?: number; // Example: 1000000
  filter_block_number_lt?: number; // Example: 1000000
  filter_block_hash?: string; // Example: "0x3a1fba5..."
}
```

* **Time Filters**

```typescript
interface TimeFilters {
  filter_block_timestamp?: number; // Example: 1715222400
  filter_block_timestamp_gte?: number; // Example: 1715222400
  filter_block_timestamp_gt?: number; // Example: 1715222400
  filter_block_timestamp_lte?: number; // Example: 1715222400
  filter_block_timestamp_lt?: number; // Example: 1715222400
}
```

* **Transaction Filters**

```typescript
interface TransactionFilters {
  filter_transaction_index?: number;
  filter_transaction_hash?: string;
  filter_from_address?: string;
  filter_value?: number;
  filter_gas_price?: number;
  filter_gas?: number;
  // Additional gte, gt, lte, lt variants for numeric fields
}
```

### Error Handling

All endpoints return standard error responses for 400 and 500 status codes:

```typescript
// 400 Bad Request
// 500 Internal Server Error
interface ErrorResponse {
  error: string; // Required
}
```
## Insight Troubleshoot Guide

More information coming soon.
## Insight

Insight is a tool that lets you retrieve blockchain data from any EVM chain, enrich it with metadata, and transform it using custom logic.

Insight

Insight is open-source. View and contribute to its source code on GitHub.

[GitHubView on GitHub](https://github.com/thirdweb-dev/insight)

### Features

##### Easy-to-Use API

Easily understandable data API to query blockchain data.

##### Managed Infrastructure

No need to index blockchains yourself or manage infrastructure and RPC costs.

##### Custom Blueprints

Transform and enrich data easily to suit your needs.

##### Lightning-Fast Queries

Access any transaction, event or token API data

### Video Tutorials

### Supported Chains

Insight is supported on select EVM compatible chains. To view the full list, visit [thirdweb chainlist](https://thirdweb.com/chainlist?service=insight).

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fsupported-chains.eca8603d.png&w=3840&q=75)
## Get Started

In this guide we will learn how to use the events blueprint in insight.

### Pre-requisites

* [Create a project](https://thirdweb.com/team) and navigate to the project settings to get a client ID
* Use insight API with the base URL below.
* To authenticate use your client ID in the `x-client-id` header or `clientId` query parameter

```

```

### Basic Usage

```typescript
const getUsdtTransfers = async () => {
 try {
   const response = await fetch('https://1.insight.thirdweb.com/v1/events/0xdAC17F958D2ee523a2206206994597C13D831ec7/Transfer(address,address,uint256)?limit=5', {
    headers: {
      'x-client-id': <YOUR_THIRDWEB_CLIENT_ID>
    }
   });
   const transfersInfo = await response.json();
   return transfersInfo
 } catch (error) {
   console.error('Error:', error);
 }
};
```

Once you execute the query above you will receive a result similar to this:

```json
{
  "meta": {
    "chain_id": 1,
    "address": "0xdAC17F958D2ee523a2206206994597C13D831ec7",
    "signature": "0xddf252ad1be2c89b69c2b068fc378daa952ba7f163c4a11628f55a4df523b3ef",
    "page": 0,
    "limit": 5,
    "total_items": 5,
    "total_pages": 0
  },
  "data": [
    {
      "chain_id": 1,
      "block_number": 14705663,
      "block_hash": "0x8f7014ff29e3ea83ee03354bd968741d01b92d4c3ddf02bfa5121465b8240736",
      "block_timestamp": 1651594686,
      "transaction_hash": "0xf5009000b57b761900010bf7f365c12ce34438ac3afdef9778b46055c26353b3",
      "transaction_index": 193,
      "log_index": 278,
      "address": "0xdac17f958d2ee523a2206206994597c13d831ec7",
      "data": "0x0000000000000000000000000000000000000000000000000000000005f5e100",
      "topics": [
        "0xddf252ad1be2c89b69c2b068fc378daa952ba7f163c4a11628f55a4df523b3ef",
        "0x000000000000000000000000b8418cdb539069e075b4c6c6675114879ffd441b",
        "0x000000000000000000000000515ea78a0ff34aef46a5e323d759935e05de4827"
      ]
    },
    {
      "chain_id": 1,
      "block_number": 14705664,
      "block_hash": "0x916d67589f2bc37600faf055309fd9f654d0c0030df35d31c04e22fef8d24ff2",
      "block_timestamp": 1651594701,
      "transaction_hash": "0x0999f86751fe5b8f2bc5446e38abf3f0e01ee1c7ff5ce6288abbea506ac3cebf",
      "transaction_index": 41,
      "log_index": 120,
      "address": "0xdac17f958d2ee523a2206206994597c13d831ec7",
      "data": "0x0000000000000000000000000000000000000000000000000000000014dc9380",
      "topics": [
        "0xddf252ad1be2c89b69c2b068fc378daa952ba7f163c4a11628f55a4df523b3ef",
        "0x0000000000000000000000005041ed759dd4afc3a72b8192c143f72f4724081a",
        "0x0000000000000000000000000f69fce36dc680512d836526fc1abb9cd6bdcdd4"
      ]
    },
    {
      "chain_id": 1,
      "block_number": 14705664,
      "block_hash": "0x916d67589f2bc37600faf055309fd9f654d0c0030df35d31c04e22fef8d24ff2",
      "block_timestamp": 1651594701,
      "transaction_hash": "0x0f25b357155dca3186700e69a7586ee0153f1d7d75304a158aab9be210b31a56",
      "transaction_index": 72,
      "log_index": 133,
      "address": "0xdac17f958d2ee523a2206206994597c13d831ec7",
      "data": "0x0000000000000000000000000000000000000000000000000000000643e6c140",
      "topics": [
        "0xddf252ad1be2c89b69c2b068fc378daa952ba7f163c4a11628f55a4df523b3ef",
        "0x0000000000000000000000007b29bee9cb744122edcd7e8223efcdf8d8d8e0a4",
        "0x0000000000000000000000001724aabcef350d3f3433804e6167d4c4137aab01"
      ]
    },
    {
      "chain_id": 1,
      "block_number": 14705664,
      "block_hash": "0x916d67589f2bc37600faf055309fd9f654d0c0030df35d31c04e22fef8d24ff2",
      "block_timestamp": 1651594701,
      "transaction_hash": "0x10da03bea7828722c92c86704522c7e1ce7dd2947d633ec6c1fb36680cb256e5",
      "transaction_index": 145,
      "log_index": 229,
      "address": "0xdac17f958d2ee523a2206206994597c13d831ec7",
      "data": "0x00000000000000000000000000000000000000000000000000000000163d3a0d",
      "topics": [
        "0xddf252ad1be2c89b69c2b068fc378daa952ba7f163c4a11628f55a4df523b3ef",
        "0x00000000000000000000000056eddb7aa87536c09ccc2793473599fd21a8b17f",
        "0x0000000000000000000000002b38e18192a442ed923addb4739e0a7724945d3c"
      ]
    },
    {
      "chain_id": 1,
      "block_number": 14705664,
      "block_hash": "0x916d67589f2bc37600faf055309fd9f654d0c0030df35d31c04e22fef8d24ff2",
      "block_timestamp": 1651594701,
      "transaction_hash": "0x20967f489b5237c0c6ffcbf7afcd921303e0db9e49382f9dc37809874e674b8b",
      "transaction_index": 188,
      "log_index": 295,
      "address": "0xdac17f958d2ee523a2206206994597c13d831ec7",
      "data": "0x0000000000000000000000000000000000000000000000000000000011b9e2b6",
      "topics": [
        "0xddf252ad1be2c89b69c2b068fc378daa952ba7f163c4a11628f55a4df523b3ef",
        "0x0000000000000000000000003cd751e6b0078be393132286c442345e5dc49699",
        "0x0000000000000000000000000e6eeff72188094c78b2478b693bbdbf9b13aaac"
      ]
    }
  ]
}
```

### Multichain Queries

Insight also supports querying multiple chains in a single API call. This is useful when you need to retrieve data across different networks without making separate requests.

```typescript
const getMultichainTransfers = async () => {
 try {
   // Query USDT transfers on Ethereum (1) and Polygon (137)
   const response = await fetch('https://insight.thirdweb.com/v1/events?chain=1&chain=137&limit=10', {
    headers: {
      'x-client-id': <YOUR_THIRDWEB_CLIENT_ID>
    }
   });
   const transfersInfo = await response.json();
   return transfersInfo
 } catch (error) {
   console.error('Error:', error);
 }
};
```

When querying multiple chains, the response includes a `chain_ids` array in the metadata and each item in the data array includes its `chain_id`:

```json
{
  "meta": {
    "chain_ids": [1, 137],
    "total_items": 10,
    "limit_per_chain": 5,
    "page": 0,
    "limit": 10,
    "total_pages": 1
  },
  "data": [
    {
      "chain_id": 1,
      "block_number": 14705663,
      // ... other Ethereum event data
    },
    {
      "chain_id": 137,
      "block_number": 25631042,
      // ... other Polygon event data
    }
    // ... more events from both chains
  ]
}
```

Key points about multichain queries:

* Use the base URL `https://insight.thirdweb.com` instead of the chain-specific subdomain
* Add multiple `chain` query parameters (e.g., `chain=1&chain=137`)
* The response includes a `chain_ids` array and `limit_per_chain` in the metadata
* Each item in the data array includes its `chain_id` for identification

For more detailed information and advanced use cases, check out our [Multichain Queries](https://portal.thirdweb.com/insight/multichain-queries) documentation.
## Multichain Queries

Insight now supports querying multiple blockchain networks in a single API call. This powerful feature allows you to retrieve and analyze data across different chains without making separate requests for each network.

### Why Use Multichain Queries?

* **Efficiency**: Reduce the number of API calls needed to fetch data from multiple chains
* **Simplicity**: Consolidate cross-chain data in a single request and response
* **Performance**: Minimize latency by avoiding sequential requests to different chains
* **Consistency**: Process data from different networks using a unified format

### How to Use Multichain Queries

Instead of using the chain-specific subdomain approach, multichain queries use the base URL with multiple `chain` query parameters:

```typescript
// Traditional single-chain query (using subdomain)
const singleChainUrl = `https://1.insight.thirdweb.com/v1/events`;
 
// Multichain query (using base URL with chain parameters)
const multiChainUrl = `https://insight.thirdweb.com/v1/events?chain=1&chain=137`;
```

#### Authentication

Authentication works the same way as with single-chain queries:

```typescript
// Using client ID in header
const headers = {
  "x-client-id": "{{clientId}}",
};
 
// Or as a query parameter
const url = `https://insight.thirdweb.com/v1/events?chain=1&chain=137&clientId={{clientId}}`;
```

### Response Format

Responses for multichain queries include additional metadata to help you identify which data belongs to which chain:

```json
{
  "meta": {
    "chain_ids": [1, 137],     // List of queried chain IDs
    "total_items": 113,        // Total count across all chains
    "limit_per_chain": 100,    // Per-chain limit derived from the request
    "page": 0,
    "limit": 200,
    "total_pages": 1
  },
  "data": [
    {
      "chain_id": 1,           // Each item includes its chain ID
      "block_number": "17859301",
      "transaction_hash": "0x123...",
      // ... other fields
    },
    {
      "chain_id": 137,
      "block_number": "48392021",
      // ... other fields
    }
  ]
}
```

Key differences in the response format:

* The `meta` object includes a `chain_ids` array listing all queried chains
* A `limit_per_chain` field indicates how many items were requested per chain
* Each item in the `data` array includes a `chain_id` field to identify its network

### Pagination and Limits

When using multichain queries, the `limit` parameter applies to each chain individually:

```typescript
// This will return up to 20 items from each chain (potentially 40 total items)
const url = `https://insight.thirdweb.com/v1/events?chain=1&chain=137&limit=20`;
```

The `limit_per_chain` in the response metadata shows how many items were requested per chain, while the overall `limit` represents the maximum total items across all chains.

### Examples

#### Example 1: Query Events Across Multiple Chains

```typescript
const getMultichainEvents = async () => {
  try {
    // Query events on Ethereum (1) and Polygon (137)
    const response = await fetch(
      "https://insight.thirdweb.com/v1/events?chain=1&chain=137&limit=10",
      {
        headers: {
          "x-client-id": "<YOUR_THIRDWEB_CLIENT_ID>",
        },
      },
    );
    return await response.json();
  } catch (error) {
    console.error("Error:", error);
  }
};
```

#### Example 2: Track Token Balances Across Networks

```typescript
const getMultichainTokenBalances = async (ownerAddress) => {
  try {
    // Get ERC-20 balances on Ethereum, Polygon, and Arbitrum
    const response = await fetch(
      `https://insight.thirdweb.com/v1/tokens/erc20/${ownerAddress}?chain=1&chain=137&chain=42161`,
      {
        headers: {
          "x-client-id": "<YOUR_THIRDWEB_CLIENT_ID>",
        },
      },
    );
    return await response.json();
  } catch (error) {
    console.error("Error:", error);
  }
};
```

#### Example 3: Monitor NFT Collections Across Chains

```typescript
const getMultichainNFTs = async (ownerAddress) => {
  try {
    // Get NFTs on Ethereum and Base
    const response = await fetch(
      `https://insight.thirdweb.com/v1/tokens/erc721/${ownerAddress}?chain=1&chain=8453`,
      {
        headers: {
          "x-client-id": "<YOUR_THIRDWEB_CLIENT_ID>",
        },
      },
    );
    return await response.json();
  } catch (error) {
    console.error("Error:", error);
  }
};
```

### Supported Endpoints

All Insight blueprints support multichain queries:

* **Events Blueprint**: `/v1/events` \- Returns events from specified chains
* **Transactions Blueprint**: `/v1/transactions` \- Provides transactions from multiple chains
* **Tokens Blueprint**:  
   * `/v1/tokens/erc20/:ownerAddress` \- Consolidates ERC-20 token balances across chains  
   * `/v1/tokens/erc721/:ownerAddress` \- Consolidates NFT holdings across chains  
   * `/v1/tokens/erc1155/:ownerAddress` \- Consolidates ERC-1155 token balances across chains

### Best Practices

* **Limit Chain Count**: While you can query multiple chains, it's best to limit the number of chains in a single request to avoid timeouts.
* **Use Appropriate Limits**: Set reasonable `limit` values to control response size and processing time.
* **Handle Chain-Specific Errors**: Some chains might return errors while others succeed. Your code should handle partial successes.
* **Process Data by Chain**: When analyzing the response, group or filter data by `chain_id` for chain-specific analysis.
* **Consider Rate Limits**: Multichain queries count against your rate limits for each chain queried.

### Use Cases

#### Cross-Chain Portfolio Tracking

Track a user's assets across multiple networks to provide a comprehensive view of their holdings:

```typescript
const getPortfolio = async (address) => {
  // Get ERC-20 tokens across major chains
  const erc20Response = await fetch(
    `https://insight.thirdweb.com/v1/tokens/erc20/${address}?chain=1&chain=137&chain=42161&chain=10&chain=8453`,
    { headers: { "x-client-id": "<YOUR_CLIENT_ID>" } },
  );
 
  // Get NFTs across the same chains
  const nftResponse = await fetch(
    `https://insight.thirdweb.com/v1/tokens/erc721/${address}?chain=1&chain=137&chain=42161&chain=10&chain=8453`,
    { headers: { "x-client-id": "<YOUR_CLIENT_ID>" } },
  );
 
  return {
    tokens: await erc20Response.json(),
    nfts: await nftResponse.json(),
  };
};
```

#### Cross-Chain Activity Monitoring

Monitor transactions or events across multiple chains for a specific address:

```typescript
const getRecentActivity = async (address) => {
  const response = await fetch(
    `https://insight.thirdweb.com/v1/transactions?filter_from_address=${address}&chain=1&chain=137&chain=42161&sort_by=block_timestamp&sort_order=desc&limit=10`,
    { headers: { "x-client-id": "<YOUR_CLIENT_ID>" } },
  );
 
  return await response.json();
};
```

#### Cross-Chain Protocol Analysis

Analyze protocol activity across different deployments on multiple chains:

```typescript
const getProtocolActivity = async (protocolAddresses) => {
  // protocolAddresses = { 1: "0x123...", 137: "0x456...", 42161: "0x789..." }
 
  const queryParams = Object.entries(protocolAddresses)
    .map(
      ([chainId, address]) =>
        `chain=${chainId}&filter_address=${address}`,
    )
    .join("&");
 
  const response = await fetch(
    `https://insight.thirdweb.com/v1/events?${queryParams}&limit=50`,
    { headers: { "x-client-id": "<YOUR_CLIENT_ID>" } },
  );
 
  return await response.json();
};
```
## Insight Use Cases

Insight offers versatile use cases for using blockchain data within applications, enabling developers to track and analyze a wide array of on-chain activities. With Insight, you can efficiently monitor transfer events, transactions, token ownership, NFT collections, and staking activities across multiple chains, and more, making it a powerful tool for building dynamic blockchain applications.

| Use Case                                                                                                                                              | Blueprint(s)                                                                                                                                                                                                                        |
| ----------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Display in-game assets such as items or tokens (ERC-20, ERC-721, or ERC-1155) tied to the player's wallet.                                            | Use Events Blueprint to fetch transfer events where the player’s wallet is the recipient, showing all NFTs or in-game items acquired by the player.                                                                                 |
| Display earned tokens based on achievements or progress rewarded to players in games.                                                                 | Use Transactions Blueprint to track transactions where the game’s smart contract sends tokens to a player’s wallet.  Use Events Blueprint to filter transfer events from the game’s contract to list all tokens awarded to players. |
| Analyze token economics such as daily trading volume to understand token liquidity or market activity.                                                | Use the Transactions Blueprint to get transactions involving any token and then aggregate data based on timestamps to calculate 24-hour transaction volumes.                                                                        |
| Analyze gas consumption of different transactions to help minimize gas fees for users by evaluating high-gas transactions or commonly used functions. | Use Transactions Blueprint to summarize gas usage across transactions for specific functions, helping to analyze and optimize protocol functions for efficiency.                                                                    |
| Analyze token ownership to understand community health and investment risks.                                                                          | Use Events Blueprint to track token transfer events, allowing users to analyze the distribution and concentration of token holders.                                                                                                 |
| Track the movements of an entire NFT collection.                                                                                                      | Use Events Blueprint to capture all transfer events for a specified collection and show ownership history or current trading volume for the collection.                                                                             |
| Fetch all NFTs owned by a specific wallet address.                                                                                                    | Use Events Blueprint to fetch transfer events for each NFT contract where the specified wallet address is the recipient.                                                                                                            |
| Fetch all transactions emitted by a single wallet across multiple chains.                                                                             | Use Transactions Blueprint to filter transactions by wallet address across different chain\_ids to provide a historical view of cross-chain transactions.                                                                           |
| Fetch all tokens owned by a specific wallet address.                                                                                                  | Use Events Blueprint to find transfer events where the wallet address is the recipient, providing a list of token balances.                                                                                                         |
| Detect wallet staking activity on platforms such as AAVE or other DeFi protocols.                                                                     | Use Events Blueprint to filter for staking-related events such as deposits, and monitor which wallets are actively staking.                                                                                                         |
## Clear Session

Clears all messages for a specific session using the session ID.

### Headers

##### x-secret-key

Required

Your thirdweb secret key for authentication.

#####  Type 

`string;

`

### Path parameters

##### session\_id

Required

The unique ID of the session

#####  Type 

`string;

`

### Request

POST

/session/{session\_id}/clear

`fetch("https://nebula-api.thirdweb.com/session/{session_id}/clear", {

 method: "POST",

 headers: {

"x-secret-key": "YOUR_THIRDWEB_SECRET_KEY",

 },

});

`

### Response

200

401

`{

"result": {

"id": "3fa85f64-5717-4562-b3fc-2c963f66afa6",

"title": "string",

"context": {

"chain_ids": [

"1",

"137"

 ],

"wallet_address": "0x..."

 },

"history": [

 {}

 ],

"account_id": "string",

"model_name": "string",

"is_public": true,

"memory": [

 {}

 ],

"action": [

 {}

 ],

"archive_at": "2025-01-08T17:22:45.016Z",

"deleted_at": "2025-01-08T17:22:45.016Z",

"created_at": "2025-01-08T17:22:45.016Z",

"updated_at": "2025-01-08T17:22:45.016Z"

 }

}

`
## Create Session

Creates a new session.

### Headers

##### x-secret-key

Required

Your thirdweb secret key for authentication.

#####  Type 

`string;

`

### Body

##### title

Set a custom title for the session.

#####  Type 

`string;

`

##### context

Provide additional context information along with the message

#####  Type 

`{

chainIds: string[] | null;

walletAddress: string | null;

}

`

### Request

POST

/session

`fetch("https://nebula-api.thirdweb.com/session", {

 method: "POST",

 headers: {

"x-secret-key": "YOUR_THIRDWEB_SECRET_KEY",

 },

});

`

### Response

200

401

422

`{

"result": {

"id": "3fa85f64-5717-4562-b3fc-2c963f66afa6",

"title": "string",

"context": {

"chain_ids": [

"1",

"137"

 ],

"wallet_address": "0x..."

 },

"history": [

 {}

 ],

"account_id": "string",

"model_name": "string",

"is_public": true,

"memory": [

 {}

 ],

"action": [

 {}

 ],

"archive_at": "2025-01-08T17:22:45.016Z",

"deleted_at": "2025-01-08T17:22:45.016Z",

"created_at": "2025-01-08T17:22:45.016Z",

"updated_at": "2025-01-08T17:22:45.016Z"

 }

}

`
## Delete Session

Deletes a session by ID

### Headers

##### x-secret-key

Required

Your thirdweb secret key for authentication.

#####  Type 

`string;

`

### Path parameters

##### session\_id

Required

The unique ID of the session

#####  Type 

`string;

`

### Request

DELETE

/session/{session\_id}

`fetch("https://nebula-api.thirdweb.com/session/{session_id}", {

 method: "DELETE",

 headers: {

"x-secret-key": "YOUR_THIRDWEB_SECRET_KEY",

 },

});

`

### Response

200

401

422

`{

"result": {

"id": "3fa85f64-5717-4562-b3fc-2c963f66afa6",

"deleted_at": "2025-01-08T19:27:37.296Z"

 }

}

`
## Send Message

Process a chat message and return the response

### Headers

##### x-secret-key

Required

Your thirdweb secret key for authentication.

#####  Type 

`string;

`

### Body

##### message

Required

The message to be processed.

#####  Type 

`string;

`

##### stream

Whether to stream the response or not

#####  Type 

`boolean;

`

##### session\_id

The session ID to associate with the message. If not provided, a new session will be created.

#####  Type 

`string;

`

##### context

Provide additional context information along with the message

#####  Type 

`{

chainIds: string[] | null;

walletAddress: string | null;

}

`

### Request

POST

/chat

`fetch("https://nebula-api.thirdweb.com/chat", {

 method: "POST",

 headers: {

"x-secret-key": "YOUR_THIRDWEB_SECRET_KEY",

 },

 body: {

 message: "Hello",

 stream: false,

 session_id: "3fa85f64-5717-4562-b3fc-2c963f66afa6",

 },

});

`

### Response

200

401

422

`{

"message": "string",

"actions": [

 {

"session_id": "string",

"request_id": "string",

"type": "init",

"source": "string",

"data": "string"

 }

 ],

"session_id": "string",

"request_id": "string"

}

`

## Chat Actions

Chat actions represent blockchain transactions or operations that Nebula has prepared in response to your request. The response includes both a detailed explanation in the `message` field and the actual transaction data in the `actions` array.

**Example Response with Chat Action:**

```json
{
  "message": "The transaction to transfer 0.0001 ETH to the address resolved from the ENS name `vitalik.eth` (which is `0xd8dA6BF26964aF9D7eEd9e03E53415D37aA96045`) is set up successfully. The simulation indicates that the transaction is likely to succeed.\n\nPlease proceed by signing and confirming the transaction.",
  "actions": [
    {
      "session_id": "437a0df7-d512-4ef4-95b5-6168ccbbe097",
      "request_id": "c2b51ed6-da79-49ac-b411-206a42059509",
      "type": "sign_transaction",
      "source": "executor",
      "data": "{\"chainId\": 11155111, \"to\": \"0xd8dA6BF26964aF9D7eEd9e03E53415D37aA96045\", \"data\": \"0x\", \"value\": \"0x5af3107a4000\"}"
    }
  ],
  "session_id": "437a0df7-d512-4ef4-95b5-6168ccbbe097",
  "request_id": "c2b51ed6-da79-49ac-b411-206a42059509"
}
```

**Action Properties:**

* `session_id`: Unique identifier for the current session
* `request_id`: Unique identifier for the specific request
* `type`: The type of action (e.g., "sign\_transaction")
* `source`: Origin of the action (e.g., "executor")
* `data`: Transaction parameters including:  
   * `chainId`: Network identifier (e.g., 11155111 for Sepolia)  
   * `to`: Recipient's address  
   * `data`: Transaction data (if any)  
   * `value`: Amount to send in wei

When handling actions:

* Parse the `message` field for human-readable transaction details
* Extract the transaction data from the `actions` array
* Present transaction details to the user for review
* Use a local wallet to sign the transaction
* Broadcast the signed transaction to the network

**Example Implementation with thirdweb SDK:**

```javascript
import {
  createThirdwebClient,
  prepareTransaction,
  sendTransaction,
  privateKeyToAccount,
} from "thirdweb";
 
// Example function to handle the API response
async function handleNebulaResponse(response) {
  // Initialize thirdweb client
  const client = createThirdwebClient({
    secretKey: process.env.THIRDWEB_SECRET_KEY,
  });
 
  // Initialize account
  const account = privateKeyToAccount({
    client,
    privateKey: process.env.EOA_PRIVATE_KEY,
  });
 
  // Check if we have any actions
  if (response.actions && response.actions.length > 0) {
    const action = response.actions[0];
 
    // Parse the transaction data from the action
    const txData = JSON.parse(action.data);
 
    try {
      // Prepare transaction with client
      const transaction = prepareTransaction({
        to: txData.to,
        data: txData.data,
        value: BigInt(txData.value),
        chain: txData.chainId,
        client,
      });
 
      // Send transaction with account
      const result = await sendTransaction({
        transaction,
        account,
      });
 
      return result;
    } catch (error) {
      console.error("Error processing transaction:", error);
      throw error;
    }
  }
}
 
// Example usage
const response = await fetch("https://nebula-api.thirdweb.com/chat", {
  method: "POST",
  headers: {
    "Content-Type": "application/json",
    "x-secret-key": "YOUR_THIRDWEB_SECRET_KEY",
  },
  body: JSON.stringify({
    message: "send 0.0001 ETH on sepolia to vitalik.eth",
    execute_config: {
      mode: "client",
      signer_wallet_address:
        "0xc3F2b2a12Eba0f5989cD75B2964E31D56603a2cE",
    },
  }),
});
 
const data = await response.json();
const result = await handleNebulaResponse(data);
```
## Execute Action

Executes a specified action.   
 It is similar to /chat but it only handles transaction requests. It is designed to be used without history context.

### Headers

##### x-secret-key

Required

Your thirdweb secret key for authentication.

#####  Type 

`string;

`

### Body

##### message

Required

The message to be processed.

#####  Type 

`string;

`

##### stream

Whether to stream the response or not

#####  Type 

`boolean;

`

##### session\_id

The session ID to associate with the message. If not provided, a new session will be created.

#####  Type 

`string;

`

##### context

Provide additional context information along with the message

#####  Type 

`{

chainIds: string[] | null;

walletAddress: string | null;

}

`

### Request

POST

/execute

`fetch("https://nebula-api.thirdweb.com/execute", {

 method: "POST",

 headers: {

"x-secret-key": "YOUR_THIRDWEB_SECRET_KEY",

 },

 body: {

 message: "Hello",

 stream: false,

 session_id: "3fa85f64-5717-4562-b3fc-2c963f66afa6",

 },

});

`

### Response

200

401

422

`{

"message": "string",

"actions": [

 {

"session_id": "string",

"request_id": "string",

"type": "init",

"source": "string",

"data": "string"

 }

 ],

"session_id": "string",

"request_id": "string"

}

`
## Get Session

Get details of a session by ID

### Headers

##### x-secret-key

Required

Your thirdweb secret key for authentication.

#####  Type 

`string;

`

### Path parameters

##### session\_id

Required

The unique ID of the session

#####  Type 

`string;

`

### Request

GET

/session/{session\_id}

`fetch("https://nebula-api.thirdweb.com/session/{session_id}", {

 method: "GET",

 headers: {

"x-secret-key": "YOUR_THIRDWEB_SECRET_KEY",

 },

});

`

### Response

200

401

422

`{

"result": {

"id": "3fa85f64-5717-4562-b3fc-2c963f66afa6",

"title": "string",

"context": {

"chain_ids": [

"1",

"137"

 ],

"wallet_address": "0x..."

 },

"history": [

 {}

 ],

"account_id": "string",

"model_name": "string",

"is_public": true,

"memory": [

 {}

 ],

"action": [

 {}

 ],

"archive_at": "2025-01-08T17:22:45.016Z",

"deleted_at": "2025-01-08T17:22:45.016Z",

"created_at": "2025-01-08T17:22:45.016Z",

"updated_at": "2025-01-08T17:22:45.016Z"

 }

}

`
## Update Session

Update session details like title, context, etc.

### Headers

##### x-secret-key

Required

Your thirdweb secret key for authentication.

#####  Type 

`string;

`

### Path parameters

##### session\_id

Required

The unique ID of the session

#####  Type 

`string;

`

### Body

##### title

Set a custom title for the session.

#####  Type 

`string;

`

##### context

Provide additional context information along with the message

#####  Type 

`{

chainIds: string[] | null;

walletAddress: string | null;

}

`

### Request

PUT

/session/{session\_id}

`fetch("https://nebula-api.thirdweb.com/session/{session_id}", {

 method: "PUT",

 headers: {

"x-secret-key": "YOUR_THIRDWEB_SECRET_KEY",

 },

});

`

### Response

200

401

422

`{

"result": {

"id": "3fa85f64-5717-4562-b3fc-2c963f66afa6",

"title": "string",

"context": {

"chain_ids": [

"1",

"137"

 ],

"wallet_address": "0x..."

 },

"history": [

 {}

 ],

"account_id": "string",

"model_name": "string",

"is_public": true,

"memory": [

 {}

 ],

"action": [

 {}

 ],

"archive_at": "2025-01-08T17:22:45.016Z",

"deleted_at": "2025-01-08T17:22:45.016Z",

"created_at": "2025-01-08T17:22:45.016Z",

"updated_at": "2025-01-08T17:22:45.016Z"

 }

}

`
## IThirdwebWallet.SwitchNetwork

This method allows setting the active chain of the wallet if applicable.

When using Smart Wallets, make sure any overrides to default contracts, such as factories, are deployed on all chains you intend to switch to. We also support switching between zksync and non-zksync chains.

### Usage

```csharp
await wallet.SwitchNetwork(chainId);
```

##### Parameters

#### chainId (required)

The chain ID to which you want to switch the wallet.
## List Sessions

Fetches a list of all available sessions.

### Headers

##### x-secret-key

Required

Your thirdweb secret key for authentication.

#####  Type 

`string;

`

### Request

GET

/session/list

`fetch("https://nebula-api.thirdweb.com/session/list", {

 method: "GET",

 headers: {

"x-secret-key": "YOUR_THIRDWEB_SECRET_KEY",

 },

});

`

### Response

200

401

`{

"result": [

 {

"id": "3fa85f64-5717-4562-b3fc-2c963f66afa6",

"title": "string",

"created_at": "2025-01-08T10:52:40.293Z",

"updated_at": "2025-01-08T10:52:40.293Z"

 }

 ]

}

`
## Nebula API Reference

Nebula provides a conversational interface to interact with blockchain data and services, and access to thirdweb tools.

### Base URL

All API requests should be made to:

```bash
https://nebula-api.thirdweb.com
```

### Authentication

All API endpoints require authentication using the thirdweb secret key. [Learn how to obtain a secret key.](https://portal.thirdweb.com/nebula/get-started).

Include this key in your request headers:

```bash
x-secret-key: YOUR_THIRDWEB_SECRET_KEY
```

Example curl with authentication:

```bash
curl -X POST https://nebula-api.thirdweb.com/chat \
  -H "Content-Type: application/json" \
  -H "x-secret-key: YOUR_THIRDWEB_SECRET_KEY" \
  -d '{
    "message": "send 0.0001 ETH on sepolia to vitalik.eth",
    "user_id": "default-user",
    "stream": false,
  }'
```
## Nebula FAQs

##### I am still waiting on access to Nebula. How can I be approved?

We are rolling out Nebula approval in batches daily - stay tuned!

##### What underlying model does Nebula use?

During Alpha, we are primarily testing the t0 model while conducting limited trials of the upcoming t1 model. The t0 model utilizes a mixture-of-agents architecture. We are targeting an early Q2 launch for t1, and will provide additional details around launch.

##### Does Nebula support \_\_\_\_\_\_\_\_ chain?

Nebula supports reading and writing capabilities on any EVM-compatible chain. [View the chainlist](https://thirdweb.com/chainlist) for all supported chains.

##### Does Nebula support multiple languages?

Yes, you may ask Nebula questions in any spoken language.

##### How can I improve upon Nebula's responses?

We recommend using [context filters](https://portal.thirdweb.com/nebula/key-concepts/context-filters) to improve relevant responses. You may also modify hyperparameters such as temperature, top-p, and more using the OpenAI API. Learn more about our [OpenAI API integration](https://portal.thirdweb.com/nebula/plugins/openai).

##### Which contracts does Nebula support?

Nebula supports the read and write context of any verified contract or any contract on the thirdweb dashboard. For deploying through Nebula, supported contracts include [Token - ERC20](https://thirdweb.com/thirdweb.eth/TokenERC20),[NFT Collection - ERC721](https://thirdweb.com/thirdweb.eth/TokenERC721), [Edition - ERC1155](https://thirdweb.com/thirdweb.eth/TokenERC1155), and [Split](https://thirdweb.com/thirdweb.eth/Split) contracts.

If you have a published contract you would like to enable for deployment through Nebula, please [contact us](https://thirdweb.com/contact-us).

##### Does Nebula have memory from past conversations?

Nebula retains memory within the confines of a session. [Learn more about sessions](https://portal.thirdweb.com/nebula/key-concepts/sessions).

##### What is the context size of Nebula?

The context size or window is 128k tokens or approximately 96,000 words which may vary depending on the specific language and text characteristics.

##### Will Nebula be open source?

Nebula is not currently open source. We are exploring open sourcing Nebula in the future.

##### When will pricing be available for Nebula?

Pricing options will be available in beta. Nebula is still being tested in alpha.
## Chat & Execute endpoints

The `/chat` endpoint is used for **natural language interactions** with the AI. It allows users to ask questions, get explanations, or retrieve blockchain-related insights, and execute transactions.

The `/execute` endpoint is used for **triggering actual blockchain transactions** through AI-generated execution logic. This endpoint **performs actions** on-chain and is designed to be used without historical context.
## Context Filters

Context filters help control what blockchain data the AI uses to generate responses.

You can specify:

* Chain IDs – Choose which blockchain networks to pull data from.
* Wallet Address – Focus on a specific wallet’s transactions, balances, and interactions.

Benefits:

* **More relevant answers:** AI focuses only on the data you care about.
* **Enable Scope**: Keep results relevant to networks and wallets specified.

Example,

```jsx
{
  "context": {
    "chain_ids": ["1"],  // Ethereum network
    "wallet_address": "0x123...abc"  // Specific wallet to analyze
  }
}
```
## Execute Configuration

Configure transaction execution behavior using the execute config:

```json
{
  "execute_config": {
    "mode": "client",
    "signer_wallet_address": "0x..."
  }
}
```

Parameters:

* `mode`: Execution mode (currently supports "client")
* `signer_wallet_address`: Wallet address for transaction signing

When mode is "client", Nebula returns an unsigned transaction for local wallet signing.
## Get Started

Learn how to get set up and started with the Nebula API to successfully prepare and enable a connected user to sign a transfer .

### Prerequisites

Before you begin, ensure you have the following:

* A thirdweb account
* A blockchain wallet for executing transactions
* Node.js and npm or yarn installed on your system

### Obtain Client ID & Secret Key

* #### Create project  
Navigate to the [projects dashboard](https://thirdweb.com/) and create a new project.  
![Create a new project](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fnew-project.d97ef6dc.png&w=3840&q=75)
* #### Obtain keys  
Setup your project and obtain your client ID and secret key. Please note your secret key somewhere safe as it is not recoverable.  
#### Client Id vs Secret Key  
Client Id is used for client side usage and is restricted by the domain restrictions you set on your API key, it is a public identifier which can be used on the frontend safely.  
Secret key is used for server side or script usage and is not restricted by the domain restrictions. Never expose your secret key in client side code.  
![Obtain keys](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fkeys.9eb13732.png&w=3840&q=75)

### Setup API (TypeScript SDK)

* #### Install SDK  
Install the TypeScript SDK  
```bash  
npm install thirdweb  
```
* #### Environment Variables  
Setup environmental variables.  
#### Storing Secret Keys  
Ensure you keep your secret key safe and do not expose it in your codebase. We recommend using a secret key manager such as [AWS Secret Manager](https://aws.amazon.com/secrets-manager/) or [Google Secret Manager](https://cloud.google.com/secret-manager).  
```jsx  
THIRDWEB_SECRET_KEY = your_thirdweb_secret_key;  
```
* #### Import Libraries  
Import required libraries from thirdweb.  
```jsx  
import {  
  createThirdwebClient,  
  prepareTransaction,  
  sendTransaction,  
  privateKeyToAccount,  
} from "thirdweb";  
```
* #### Create Function to Handle Response  
This function processes the API's response and executes blockchain transactions.  
```jsx  
import { generateAccount } from "thirdweb/wallets";  
   
async function handleNebulaResponse(response) {  
  const client = createThirdwebClient({  
    secretKey: process.env.THIRDWEB_SECRET_KEY,  
  });  
   
  // You can use any wallet- see https://portal.thirdweb.com/typescript/v5/supported-wallets  
  const account = await generateAccount({ client });  
   
  if (response.actions && response.actions.length > 0) {  
    const action = response.actions[0];  
    const txData = JSON.parse(action.data);  
   
    try {  
      const transaction = prepareTransaction({  
        to: txData.to,  
        data: txData.data,  
        value: BigInt(txData.value),  
        chain: txData.chainId,  
        client,  
      });  
   
      const result = await sendTransaction({  
        transaction,  
        account,  
      });  
   
      console.log("Transaction Successful:", result);  
      return result;  
    } catch (error) {  
      console.error("Error executing transaction:", error);  
      throw error;  
    }  
  }  
}  
```
* #### Call Nebula API  
Send a request to the Nebula API to interpret your natural language command and retrieve the transaction details.  
```jsx  
const response = await fetch("https://nebula-api.thirdweb.com/chat", {  
  method: "POST",  
  headers: {  
    "Content-Type": "application/json",  
    "x-secret-key": process.env.THIRDWEB_SECRET_KEY,  
  },  
  body: JSON.stringify({  
    message: "send 0.001 ETH on Sepolia to vitalik.eth",  
    execute_config: {  
      mode: "client",  
      signer_wallet_address: "0xYourWalletAddress",  
    },  
  }),  
});  
   
const data = await response.json();  
await handleNebulaResponse(data);  
```
* #### Example Response  
The response from the API will contain the transaction details.  
```jsx  
Transaction Successful: {  
  transactionHash: "0x123abc...",  
  blockNumber: 1234567,  
  ...  
}  
```

Congratulations! You have successfully set up the Nebula API and executed a transaction using the thirdweb SDK.

#### Additional Resources

* [Nebula API Documentation](https://portal.thirdweb.com/nebula/api-reference)
* [thirdweb SDK Documentation](https://portal.thirdweb.com/typescript/v5)
## Sessions

Sessions are a way to maintain context across multiple interactions with a user. Since LLMs are stateless by default, sessions help simulate continuity.

* Sessions are created automatically when calling `/chat` without a `session_id` or can be created explicitly by calling the `/session` endpoint.
* Sessions can be managed through the following endpoints:  
   * [Create Session](https://portal.thirdweb.com/api-reference/create-session)  
   * [Get Session](https://portal.thirdweb.com/api-reference/get-session)  
   * [Clear Session](https://portal.thirdweb.com/api-reference/clear-session)  
   * [Update Session](https://portal.thirdweb.com/api-reference/update-session)  
   * [Delete Session](https://portal.thirdweb.com/api-reference/delete-session)  
   * [List Sessions](https://portal.thirdweb.com/api-reference/list-sessions)
* Sessions persist your conversation history, custom configurations for blockchain data, and thirdweb tools interactions.
## Eliza

Eliza is a simple, fast, and lightweight AI agent framework to build flexible, scalable, and secure conversational agents.

With the thirdweb plugin, you can easily integrate Nebula into an AI agent built with Eliza to provide increasingly accurate read, write, and reasoning capabilities to blockchain-related prompts:

Nebula Plugin

Nebula Plugin is open-source. View and contribute to its source code on GitHub.

[GitHubView on GitHub](https://github.com/elizaOS/eliza/tree/main/packages/plugin-thirdweb)

### Prerequisites

* Create a thirdweb account
* Node.js 23+ and pnpm 9+ installed

### Obtain Client ID & Secret Key

* #### Create project  
Navigate to the [projects dashboard](https://thirdweb.com/) and create a new project.  
![Create a new project](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fnew-project.d97ef6dc.png&w=3840&q=75)
* #### Obtain keys  
Setup your project and obtain your client ID and secret key. Please note your secret key somewhere safe as it is not recoverable.  
#### Client Id vs Secret Key  
Client Id is used for client side usage and is restricted by the domain restrictions you set on your API key, it is a public identifier which can be used on the frontend safely.  
Secret key is used for server side or script usage and is not restricted by the domain restrictions. Never expose your secret key in client side code.  
![Obtain keys](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fkeys.9eb13732.png&w=3840&q=75)

### Setup Eliza Starter

If you have not created a project with Eliza, it is recommended to start with the Eliza Starter repository:

* #### Clone Starter  
#### Version  
The Nebula plugin is only available on version 0.1.8 of Eliza and above and is available by default.  
Clone the starter repository  
```bash  
git clone https://github.com/elizaos/eliza-starter.git  
```
* #### Environment Variables  
Create a .env file and add your secret key and any other environmental variables:  
```bash  
THIRDWEB_SECRET_KEY=your_secret_key  
```  
#### Client Id vs Secret Key  
Client Id is used for client side usage and is restricted by the domain restrictions you set on your API key, it is a public identifier which can be used on the frontend safely.  
Secret key is used for server side or script usage and is not restricted by the domain restrictions. Never expose your secret key in client side code.
* #### Install Dependencies  
```bash  
pnpm i  
```
* #### Start Eliza  
```bash  
pnpm start  
```

#### Additional Resources

* [Eliza Documentation](https://elizaos.github.io/eliza/)
## Response Handling

### Streamed vs non-streamed responses

* **Streaming Responses**: This method streams data in real-time, providing immediate feedback as the response is generated. Set the `stream` parameter to `true` in your request, the API delivers responses via Server-Sent Events (SSE).
* **Non-Streaming Responses**: When the `stream` parameter is set to `false`, the API returns the complete response in a single JSON payload after processing is complete.

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fstreamed-response.b945a71f.png&w=3840&q=75)

For `stream:true`, you'll need to handle the following event types:

* `init`: Initializes the stream and provides session information
* `presence`: Provides backend status updates about worker processing
* `action`: Contains blockchain transaction or action data
* `delta`: Contains chunks of the response message text
* `error`: Contains error information if something goes wrong

**Example SSE Stream:**

```jsx
event: init
data: {
  "session_id": "f4b45429-9570-4ee8-8c8f-8b267429915a",
  "request_id": "9efc7f6a-8576-4d9c-8603-f6c72aa72164",
  "type": "init",
  "source": "user",
  "data": ""
}
 
event: presence
data: {
  "session_id": "f4b45429-9570-4ee8-8c8f-8b267429915a",
  "request_id": "9efc7f6a-8576-4d9c-8603-f6c72aa72164",
  "type": "presence",
  "source": "executor",
  "data": "Performing function execution: ExecuteNativeTransferClientSigning"
}
 
event: action
data: {
  "session_id": "f4b45429-9570-4ee8-8c8f-8b267429915a",
  "request_id": "9efc7f6a-8576-4d9c-8603-f6c72aa72164",
  "type": "sign_transaction",
  "source": "executor",
  "data": "{\"chainId\": 11155111, \"to\": \"0xd8dA6BF26964aF9D7eEd9e03E53415D37aA96045\", \"data\": \"0x\", \"value\": \"0x5af3107a4000\"}"
}
 
event: delta
data: {"v": "To send 0.0001 ETH on the Sepolia network"}
 
event: delta
data: {"v": " to the address associated with"}
```

**JavaScript Example for handling streams:**

```jsx
const eventSource = new EventSource("/chat", {
  headers: {
    "x-secret-key": "YOUR_THIRDWEB_SECRET_KEY",
  },
});
 
let messageText = "";
 
eventSource.addEventListener("init", (event) => {
  const data = JSON.parse(event.data);
  console.log("Stream initialized:", data);
});
 
eventSource.addEventListener("presence", (event) => {
  const data = JSON.parse(event.data);
  console.log("Backend status:", data.data);
});
 
eventSource.addEventListener("action", (event) => {
  const data = JSON.parse(event.data);
  console.log("Received action:", data);
  if (data.type === "sign_transaction") {
    // Handle transaction signing
    handleTransaction(data);
  }
});
 
eventSource.addEventListener("delta", (event) => {
  const data = JSON.parse(event.data);
  messageText += data.v;
  console.log("Current message:", messageText);
});
 
eventSource.addEventListener("error", (event) => {
  const error = JSON.parse(event.data);
  console.error("Error:", error);
  eventSource.close();
});
```

### Response Format

By default, responses are returned as JSON Objects. You may optionally specify the desired response format using the `response_format` parameter.

* **JSON Object**: To receive the response as a JSON object, set `response_format` to `{ "type": "json_object" }`.
* **JSON Schema**: For responses adhering to a specific JSON schema, set `response_format` to `{ "type": "json_schema", "json_schema": { ... } }`, where you define the desired schema structure.

Example with `json_schema` format,

```jsx
curl -X POST https://nebula-api.thirdweb.com/chat \
-H "Content-Type: application/json" \
-H "x-secret-key: ...." \
-d '{
  "message": "what is the balance of eimanabdel.eth on contract 0xddC761FEb956Caf62dfa1c8b42e9f33Df424715A on sepolia",
  "stream": false,
  "response_format": {
    "type": "json_schema",
    "json_schema": {
      "type": "object",
      "properties": {
        "ens_name": {
          "type": "string",
          "description": "The ENS name being queried"
        },
        "balance": {
          "type": "integer",
          "description": "The balance of the address on the specified contract"
        }
      },
      "required": ["ens_name", "balance"]
    }
  }
}'
```
## OpenAI

#### Chat Completions API

Compatible with OpenAI’s Chat Completion API to process chat history and generate context-aware responses.

```python
from openai import OpenAI
 
client = OpenAI(
	base_url="https://nebula-api.thirdweb.com",
	api_key="{{THIRDWEB_SECRET_KEY}}",
)
chat_completion = client.chat.completions.create(
	model="t0",
	messages=[{"role": "user", "content": "Hello Nebula!"}],
	stream=False,
    extra_body={ "context": { "wallet_address": "0x..." }}
)
 
print(chat_completion)
```

#### Models API

Compatible with OpenAI’s Models API to list out models used.

```python
from openai import OpenAI
 
# https://nebula-api.thirdweb.com/models
 
client = OpenAI(
    base_url="https://nebula-api.thirdweb.com/",
    api_key="",
)
 
models = client.models.list()
print(models)
```
## Nebula Troubleshoot Guide

For any issues you encounter while using Nebula, please [visit our support site](https://thirdweb.com/support).
## Plugins

* [OpenAI](https://portal.thirdweb.com/nebula/plugins/openai)
* [Eliza](https://portal.thirdweb.com/nebula/plugins/eliza)

We are actively adding more integrations, for any specific requests please [contact us](https://thirdweb.com/contact).
## Prompt Guide

Maximize the potential of Nebula. Whether you’re new to blockchain development or an experienced user, this document will help you craft prompts that fully leverage Nebula’s blockchain specific features.

#### Supported Actions

| **Action**        | **Description**                                                   | **Examples**                                                                                                                                                                                                                                                                                                                                   |
| ----------------- | ----------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Bridge & Swap** | Bridge and swap native currencies                                 | • "Swap 1 USDC to 1 USDT on the Ethereum Mainnet"• "Bridge 0.5 ETH from Ethereum Mainnet to Polygon"                                                                                                                                                                                                                                           |
| **Transfer**      | Send native and ERC-20 currencies                                 | • "Send 0.1 ETH to vitalik.eth"• "Transfer 1 USDC to saminacodes.eth on Base"                                                                                                                                                                                                                                                                  |
| **Deploy**        | Deploy published contracts                                        | • "Deploy a Token ERC20 Contract"• "Deploy a Split contract with two recipients."• "Deploy an ERC1155 Contract named 'Hello World' with description 'Hello badges on Ethereum'"                                                                                                                                                                |
| **Understand**    | Retrieve information about smart contracts.                       | • "What ERC standards are implemented by contract address 0x59325733eb952a92e069C87F0A6168b29E80627f on Ethereum?"• "What functions can I use to mint more of my contract's NFTs?"• "What is the total supply of NFTs for my contract?"                                                                                                        |
| **Interact**      | Query wallet balances, addresses, and token holdings.             | • "How much ETH is in my wallet?"• "What is the wallet address of vitalik.eth?"• "Does my wallet hold USDC on Base?"                                                                                                                                                                                                                           |
| **Explore**       | Access blockchain-specific data.                                  | • "What is the last block on zkSync?"• "What is the current gas price on Avalanche C-Chain?"• "Can you show me transaction details for 0xdfc450bb39e44bd37c22e0bfd0e5212edbea571e4e534d87b5cbbf06f10b9e04 on Optimism?"                                                                                                                        |
| **Research**      | Obtain details about tokens, their addresses, and current prices. | • "What is the address of USDC on Ethereum?"• "Is there a UNI token on Arbitrum?"• "What is the current price of ARB?"                                                                                                                                                                                                                         |
| **Build**         | Implement features using Web3 SDKs and tools.                     | • "How can I add a connect wallet button to my web app? I want to support users connecting with both email/social wallets and MetaMask and use smart wallets."• "Can you show me how to claim an NFT from an ERC721 using TypeScript?"• "I have an ERC1155 contract from thirdweb. Can you show me how to generate and mint with a signature?" |
## Nebula

Nebula is a natural language model with improved blockchain reasoning, autonomous transaction capabilities, and real-time access to the blockchain. [Learn more about Nebula.](https://blog.thirdweb.com/introducing-nebula-a-powerful-blockchain-model-to-read-write-and-reason-onchain/)

Nebula is currently available in Alpha. [Join the waitlist.](https://thirdweb.com/nebula)

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fnebula-diagram.a48e0dc2.png&w=3840&q=75)

### Features

##### Proprietary Blockchain Model

Trained on every EVM network and 1M+ contracts

##### Execute Transactions

Deploy contracts, send transactions, and more with natural language

##### Wallet Integration

Connect with over 500+ EOAs, in-app wallets, and smart wallets with session keys

##### Framework Integration

Integrate with popular AI orchestration frameworks

### Video Tutorials

### Templates

[GitHubBouncer Eliza Agent](https://github.com/thirdweb-example/bouncer-eliza-agent)[GitHubBlock Explorer](https://github.com/thirdweb-example/nebula-block-explorer)[GitHubERC-20 Token Deployer](https://github.com/thirdweb-example/erc20-token-deployer)

### Supported Chains

Nebula is supported on every EVM compatible chain. To view the full list, visit [thirdweb chainlist](https://thirdweb.com/chainlist?service=nebula).

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fsupported-chains.eca8603d.png&w=3840&q=75)
## Batching transactions

Batching transactions allows sending multiple transactions in a single user operation. This can be useful to save on fees, reduce number of user confimations or to ensure that multiple transactions are executed atomically.

A typical example is to do an approval and a transfer in a single userOperation. This way, the transfer will only happen if the approval is successful.

```tsx
import {
  useActiveAccount,
  useSendBatchTransaction,
} from "thirdweb/react";
import { approve, transferFrom } from "thirdweb/extensions/erc20";
 
const smartAccount = useActiveAccount();
const { mutate: sendBatchTransaction } = useSendBatchTransaction();
 
const approveAndTransfer = async () => {
  const transactions = [
    approve({
      contract,
      spender: "0x...",
      value: 100,
    }),
    transferFrom({
      contract,
      from: "0x...",
      to: "0x...",
      amount: 100,
    }),
  ];
  await sendBatchTransaction(transactions);
};
```
## Build your own UI

You can also use the connection hooks and functions to connect to your smart accounts and build your fully custom UI.

* #### Get a free API key  
You will require an API key to use thirdweb's infrastructure services such as the bundler and paymaster.  
Obtain an API key from the [thirdweb dashboard Settings page](https://thirdweb.com/create-api-key).  
The API key lets you access thirdweb's bundler and paymaster infrastructure, which is required for smart accounts to operate and optionally enable [gasless transactions](https://portal.thirdweb.com/glossary/gasless-transactions).  
Learn more about creating an API key and restricting which contracts the smart account can interact with [here](https://portal.thirdweb.com/api-keys).
* #### Connect smart accounts in your application  
Using `useConnect`, you can pass the `accountAbstraction` prop to automatically convert any connected wallet to a smart account.  
The connected wallet will be the admin wallet of the smart account.  
#### Sponsored transactions  
To set up sponsored transactions, set the `sponsorGas` option to `true` in the smart account configuration. All transactions performed with the smart account will then be sponsored by your application. Testnet transactions are free, but you need a valid credit card on file for mainnet transactions.  
```tsx  
import { useConnect } from "thirdweb/react";  
import { inAppWallet } from "thirdweb/wallets";  
import { sepolia } from "thirdweb/chains";  
   
function App() {  
  // 1. set the `accountAbstraction` configuration  
  const { connect } = useConnect({  
    client,  
    accountAbstraction: {  
      chain: sepolia, // the chain where your smart accounts will be or is deployed  
      sponsorGas: true, // enable or disable sponsored transactions  
    },  
  });  
   
  const connectToSmartAccount = async () => {  
    // 2. connect with the admin wallet of the smart account  
    connect(async () => {  
      const wallet = inAppWallet(); // or any other wallet  
      await wallet.connect({  
        client,  
        chain: sepolia,  
        strategy: "google",  
      });  
      return wallet;  
    });  
  };  
   
  return (  
    <button onClick={() => connectToSmartAccount()}>Connect</button>  
  );  
}  
```
* #### Executing Transactions with Smart Accounts  
Once setup, you can use the Connect [TypeScript](https://portal.thirdweb.com/typescript/v5), [React](https://portal.thirdweb.com/react/v5), or [React Native](https://portal.thirdweb.com/react-native/v5) SDKs to deploy contracts, perform transactions, and manipulate smart accounts like any other wallet.  
```tsx  
import { getContract } from "thirdweb";  
import { useActiveAccount, useSendTransaction } from "thirdweb/react";  
import { claimTo, balanceOf } from "thirdweb/extensions/erc721";  
   
const contract = getContract({ client, chain, address: "0x..." });  
   
// The ThirdwebProvider setup above already handles the connection to the smart account  
// Within the provider, you can use the SDK normally to interact with the blockchain  
export default function MyComponent() {  
  // Get the connected smart account  
  const smartAccount = useActiveAccount();  
  // Example read  
  const { data, isLoading } = useReadContract(  
    balanceOf,  
    {  
      contract,  
      owner: smartAccount.address,  
    },  
    {  
      enabled: !!smartAccount,  
    },  
  );  
  // Example write  
  const { mutate: sendTransaction, isPending } = useSendTransaction();  
  const mint = () => {  
    sendTransaction({  
      transaction: claimTo({  
        contract,  
        to: smartAccount.address,  
        quantity: 1n,  
      }),  
    });  
  };  
  // Mint a new NFT  
  return <button onClick={mint}>Mint NFT</button>;  
}  
```

#### Demos

Learn by example with these open-source demos:

Account Abstraction Demos

A reference implementation to create and interact with smart accounts.

[GitHubView on GitHub](https://github.com/thirdweb-example/account-abstraction)
## ERC-4337 Smart Accounts

Convert any wallet to a ERC-4337 smart account to your application.

* Let users **connect to their smart account** using any personal wallet, including in-app wallets for easy onboarding.
* Automatically **deploy individual account contracts** for your users when they do their first onchain transaction.
* **Sponsor gas costs for all transactions** via the thirdweb paymaster.

#### Sponsored transactions

To set up sponsored transactions, set the `sponsorGas` option to `true` in the smart account configuration. All transactions performed with the smart account will then be sponsored by your application. Testnet transactions are free, but you need a valid credit card on file for mainnet transactions.

### Live Playground

Try out in-app wallets for yourself in the [in-app wallet live playground](https://playground.thirdweb.com/connect/account-abstraction/connect)

### Usage with Connect UI components

The easiest way to get started with account abstraction is to use the [ConnectButton](https://portal.thirdweb.com/connect/sign-in/ConnectButton) component. Simply add the `accountAbstraction` property with the desired chain and whether to sponsor gas for your users.

With this property, all connected wallets will be automatically converted to smart accounts. The connected wallet will be the admin wallet of the smart account.

```tsx
import { createThirdwebClient } from "thirdweb";
import { ThirdwebProvider, ConnectButton } from "thirdweb/react";
 
const client = createThirdwebClient({
  clientId: "YOUR_CLIENT_ID",
});
 
export default function App() {
  return (
    <ThirdwebProvider>
      <ConnectButton
        client={client}
        accountAbstraction={{
          chain: sepolia, // the chain where your smart accounts will be or is deployed
          sponsorGas: true, // enable or disable sponsored transactions
        }}
      />
    </ThirdwebProvider>
  );
}
```

You can also make it so _only_ in-app wallets get converted to smart accounts, by configuring the in-app wallet individually. Other external wallets will not be converted to smart accounts with this setup.

```tsx
import { createThirdwebClient } from "thirdweb";
import { ThirdwebProvider, ConnectButton } from "thirdweb/react";
 
const client = createThirdwebClient({
  clientId: "YOUR_CLIENT_ID",
});
 
const wallets = [
  inAppWallet({
    // only configure smart accounts for in-app wallets
    smartAccount: {
      chain: sepolia,
      sponsorGas: true,
    },
  }),
  // other external wallets will not become smart accounts
  createWallet("io.metamask"),
  createWallet("rainbow.me"),
];
 
export default function App() {
  return (
    <ThirdwebProvider>
      <ConnectButton client={client} wallets={wallets} />
    </ThirdwebProvider>
  );
}
```

### Usage with your own UI

You can also use the connection hooks and functions to connect to your smart accounts and build your fully custom UI.

```tsx
import { useConnect } from "thirdweb/react";
import { inAppWallet } from "thirdweb/wallets";
import { sepolia } from "thirdweb/chains";
 
function App() {
  // 1. set the `accountAbstraction` configuration to convert wallets to smart accounts
  const { connect } = useConnect({
    client,
    accountAbstraction: {
      chain: sepolia, // the chain where your smart accounts will be or is deployed
      sponsorGas: true, // enable or disable sponsored transactions
    },
  });
 
  const connectToSmartAccount = async () => {
    // 2. connect with the admin wallet of the smart account
    connect(async () => {
      const wallet = inAppWallet(); // or any other wallet
      await wallet.connect({
        client,
        chain: sepolia,
        strategy: "google",
      });
      return wallet;
    });
  };
 
  return (
    <button onClick={() => connectToSmartAccount()}>Connect</button>
  );
}
```

#### Auto connection of smart accounts

When building your own UI, remember to also pass the `accountAbstraction` prop to `useAutoConnect` to always reconnect to the smart account on page reload.

Refer to the [Smart Wallet API reference](https://portal.thirdweb.com/references/typescript/v5/smartWallet) for more advanced configuration of your smart accounts.
## Adapters

The thirdweb SDK can work side by side with:

* wagmi
* viem
* privy
* ethers.js v5
* ethers.js v6
* older versions of the @thirdweb-dev/sdk (using the ethers.js v5 adapter)
* any other library that conforms to the [EIP-1193](https://eips.ethereum.org/EIPS/eip-1193) standard

Adapters allow you to use contracts, providers and wallets from these libraries with the thirdweb SDK and vice versa.

### Wagmi

#### Using thirdweb in-app wallets with wagmi

View the demo repo for using thirdweb in-app / smart wallets with wagmi:

[GitHubwagmi + thirdweb demo repo](https://github.com/thirdweb-example/wagmi-inapp-smart-wallets)

You can use thirdweb's in-app, ecosystem and smart wallets in your wagmi application by using the `@thirdweb-dev/wagmi-adapter` package.

```bash
npm install thirdweb @thirdweb-dev/wagmi-adapter
```

Make sure you're running wagmi 2.14.1 or above.

You probably already have a wagmi config with some connectors, simply add the inAppWalletConnector to the list, along with the desired options.

```ts
import { http, createConfig } from "wagmi";
import { inAppWalletConnector } from "@thirdweb-dev/wagmi-adapter";
import {
  createThirdwebClient,
  defineChain as thirdwebChain,
} from "thirdweb";
 
const client = createThirdwebClient({
  clientId: "your-client-id",
});
 
export const config = createConfig({
  chains: [sepolia],
  connectors: [
    // add the in-app wallet connector
    inAppWalletConnector({
      client,
      // optional: turn on smart accounts!
      smartAccounts: {
        sponsorGas: true,
        chain: thirdwebChain(sepolia),
      },
    }),
  ],
  transports: {
    [sepolia.id]: http(),
  },
});
```

Then in your application, you can use the connector to trigger the in-app wallet connection.

```ts
const { connect, connectors } = useConnect();
 
const onClick = () => {
  // grab the connector
  const inAppWallet = connectors.find(
    (x) => x.id === "in-app-wallet",
  );
  // call connect with the desired strategy
  connect({
    connector: inAppWallet,
    strategy: "google",
  });
};
```

#### Converting a wagmi wallet client to a thirdweb wallet

You can use the thirdweb SDK within a wagmi application by setting the wagmi connected account as the thirdweb 'active wallet'. After that, you can use all of the react components and hooks normally, including `PayEmbed`, `TransactionButton`, etc.

```ts
// Assumes you've wrapped your application in a `<ThirdwebProvider>`
 
import { useEffect } from "react";
import { defineChain } from "thirdweb";
import { useSetActiveWallet } from "thirdweb/react";
import { createWalletAdapter } from "thirdweb/wallets";
import {
  useDisconnect,
  useSwitchChain,
  useWalletClient,
} from "wagmi";
import { viemAdapter } from "thirdweb/adapters/viem";
import { client } from "./client";
 
const account = useAccount(); // from wagmi
const setActiveWallet = useSetActiveWallet(); // from thirdweb/react
 
// whenever the wagmi account changes,
// we adapt it to a thirdweb wallet and set it as the active wallet
useEffect(() => {
  const setActive = async () => {
    if (account?.connector?.getProvider) {
      const provider = await account?.connector?.getProvider({
        chainId,
      });
      const thirdwebWallet = EIP1193.fromProvider({
        provider,
      });
      await thirdwebWallet.connect({
        client,
      });
      setActiveWallet(thirdwebWallet);
    }
  };
  setActive();
}, [account?.connector?.getProvider, setActiveWallet]);
```

You can view a fully functioning wagmi + thirdweb app in this [github repository](https://github.com/thirdweb-example/wagmi-thirdweb).

### Privy

Similarly, you can use the thirdweb SDK with privy by setting the privy wallet as the thirdweb 'active wallet'. After that, you can use all of the react components, functions and hooks normally, including `PayEmbed`, `TransactionButton`, etc.

```ts
// Assumes you've wrapped your application in a `<ThirdwebProvider>`
 
import { useEffect } from "react";
import { defineChain } from "thirdweb";
import { useSetActiveWallet } from "thirdweb/react";
import { createWalletAdapter } from "thirdweb/wallets";
import { ethers5Adapter } from "thirdweb/adapters/ethers5";
import { client } from "./client";
import { useWallets } from "@privy-io/react-auth";
 
const { wallets } = useWallets(); // from privy
const setActiveWallet = useSetActiveWallet(); // from thirdweb/react
 
// whenever the privy wallet changes,
// we adapt it to a thirdweb account and set it as the active wallet
useEffect(() => {
  const setActive = async () => {
    const privyWallet = wallets[0];
    if (privyWallet) {
      const ethersProvider = await privyWallet.getEthersProvider();
      // create a thirdweb wallet with the privy provider
      const thirdwebWallet = EIP1193.fromProvider({
        provider: ethersProvider,
      });
      await thirdwebWallet.connect({
        client,
      });
      setActiveWallet(thirdwebWallet);
    }
  };
  setActive();
}, [wallets]);
```
## Account Permissions & Session Keys

A [smart account](https://portal.thirdweb.com/react/v5/account-abstraction/get-started) can have two types of actors: _Session Keys_ and _Admins_.

### Admins

Admins have **unrestricted access** to the account; call any functions on the contract, use the contract without going through the ERC-4337 infrastructure (bundlers, EntryPoint, etc.), withdraw the account's native token balance, and so on.

#### Assigning Admin Permissions

Existing admins on the account can add new admins, remove existing admins or renounce their own admin status.

```tsx
import { addAdmin } from "thirdweb/extensions/erc4337";
import { useSendTransaction, useActiveAccount } from "thirdweb/react";
import { getContract } from "thirdweb";
 
const { mutate: sendTransaction } = useSendTransaction();
const smartAccount = useActiveAccount();
 
const onClick = () => {
  if (!smartAccount) return;
  const transaction = addAdmin({
    contract: getContract({
      address: smartAccount.address,
      chain,
      client,
    }),
    account: smartAccount,
    adminAddress: "0x...", // the address of the new admin
  });
  sendTransaction(transaction);
};
```

Check out the [API reference](https://portal.thirdweb.com/references/typescript/v5/erc4337/addAdmin) function for more information.

### Session Keys

Session Keys are additional authorized signers that must go through ERC-4337 infrastructure (bundlers, EntryPoint, etc.) to use an account to execute transactions. Session keys can use an account under certain restrictions.

#### Assigning Session Key Permissions

Each individual session key has its own permissions to use the account. Only admins can set the permissions for session keys.

Session keys can be assigned the following permissions:

* \[Required\] Allow interaction with specific contracts with the account ("\*" for any contracts)
* \[Optional\] Have a maximum amount of native tokens that can be transferred per transaction (defaults to 0 eth, transactions with value will be rejected)
* \[Optional\] Have access to the account only during a specific time window (defaults to 10 years from now)

```tsx
import { addSessionKey } from "thirdweb/extensions/erc4337";
import { useSendTransaction, useActiveAccount } from "thirdweb/react";
import { getContract } from "thirdweb";
 
const { mutate: sendTransaction } = useSendTransaction();
const smartAccount = useActiveAccount();
 
const onClick = () => {
  if (!smartAccount) return;
  const transaction = addSessionKey({
    contract: getContract({
      address: smartAccount.address,
      chain,
      client,
    }),
    account: smartAccount,
    sessionKeyAddress: "0x...", // the address of the new session key
    permissions: {
      approvedTargets: "*", // the addresses of allowed contracts, or '*' for any contract
      nativeTokenLimitPerTransaction: 0.1, // the maximum amount of native token (in ETH) that the session key can spend per transaction
      permissionStartTimestamp: new Date(), // the date when the session key becomes active
      permissionEndTimestamp: new Date(
        Date.now() + 24 * 60 * 60 * 1000,
      ), // the date when the session key expires
    },
  });
  sendTransaction(transaction);
};
```

Check out the [API reference](https://portal.thirdweb.com/references/typescript/v5/erc4337/addSessionKey) for more information.
## Sign in with Ethereum

Authenticate users with your backend securely by proving they own a given Ethereum address.

SIWE (Sign-In with Ethereum) allows anyone to integrate passwordless web3-native authentication and authorization into their applications. Users can then login using any wallet (in-app, external, or smart wallet).

This allows developers to create a familiar, secure authentication flow that works with traditional backends while leveraging the features of a web3 application.

### Live Playground

Try out SIWE auth for yourself in the [auth live playground](https://playground.thirdweb.com/connect/auth)

### Configuring thirdweb auth

In your backend, configure the auth object with the `createAuth` function.

```tsx
import { createThirdwebClient } from "thirdweb";
import { createAuth } from "thirdweb/auth";
 
const client = createThirdwebClient({
  secretKey, // always use secret key for backend code
});
 
const thirdwebAuth = createAuth({
  domain: "localhost:3000", // your domain
  client,
  // your backend wallet to sign login payloads
  adminAccount: privateKeyToAccount({ client, privateKey }),
});
```

The `createAuth` helper returns an object with all the functions you will need to authenticate users. Check out the [createAuth API reference](https://portal.thirdweb.com/auth/siwe) for more details.

Your backend can use those functions to expose a SIWE compliant login flow to your frontend.

Here's an example using server actions and a JWT for session management:

```tsx
export async function generatePayload(params) {
  // generates a SIWE compliant login payload to return to the client
  return thirdwebAuth.generatePayload(params);
}
 
export async function login(params) {
  // verify the user's signature
  const verifiedPayload = await thirdwebAuth.verifyPayload(params);
  if (verifiedPayload.valid) {
    // generate a JWT for the client (or use your own method to store the user session)
    const jwt = await thirdwebAuth.generateJWT({
      payload: verifiedPayload,
    });
    // set the JWT in cookies, or return it to the client to use as needed
    setJWTCookie(jwt);
    return true;
  } else {
    // the payload is not valid, you can return an error message to the client
    return false;
  }
}
 
export async function getUser() {
  // check if the user is logged in with cookies, storage, or your method of choice
  const jwt = getJWTCookie();
  const { valid, parsedJWT } = await thirdwebAuth.verifyJWT({ jwt });
  if (valid) {
    return authResult.parsedJWT.sub; // sub is the user's address
  }
  return null;
}
 
export async function logout() {
  // logout the user, delete cookies, etc.
}
```

### Usage with UI components

You can then add a SIWE step to the connection flow of the `ConnectWallet` or `ConnectEmbed` UI component by configuring the `auth` option. This will automatically trigger the wallet to sign the login payload returned by `getLoginPayload` and trigger the `doLogin` function you implemented in your backend.

```tsx
import { ThirdwebProvider, ConnectButton } from "thirdweb/react";
import {
  generatePayload,
  getUser,
  login,
  logout,
} from "@/server/actions/auth";
 
export default function App() {
  const [loggedIn, setLoggedIn] = useState(false);
  return (
    // The ThirdwebProvider should be at the root of your application, but the ConnectButton can be anywhere
    <ThirdwebProvider>
      <ConnectButton
        client={client}
        auth={{
          getLoginPayload: async (params) => {
            // here you should call your backend, using generatePayload to return
            // a SIWE compliant login payload to the client
            return generatePayload(params);
          },
          doLogin: async (params) => {
            // here you should call your backend to verify the signed payload passed in params
            // this will verify that the signature matches the intended wallet
            return login(params);
          },
          isLoggedIn: async () => {
            // here you should ask you backend if the user is logged in
            // can use cookies, storage, or your method of choice
            const user = await getUser();
            return !!user;
          },
          doLogout: async () => {
            // here you should call your backend to logout the user if needed
            // and delete any local auth tokens
            return logout();
          },
        }}
      />
    </ThirdwebProvider>
  );
}
```

### Using your own UI

You can use the [signLoginPayload](https://portal.thirdweb.com/references/typescript/v5/signLoginPayload) function to trigger the signing of the login payload yourself. This can be useful if you want to use a custom UI for the login flow. You can get the active account that will sign the payload from the [useActiveAccount](https://portal.thirdweb.com/references/typescript/v5/useActiveAccount) hook.
## AutoConnect

Automatically connects the last connected wallet in the case a user reloads the page or revisits the app at a later time.

This component has no UI, simply mount it anywher in your app to trigger the auto connection flow on page load.

If you are using [ConnectButton](https://portal.thirdweb.com/react/v5/ConnectButton)or [ConnectEmbed](https://portal.thirdweb.com/react/v5/ConnectEmbed) components, You don't need to use this component because it is already included.

#### Example

```tsx
import { createWallet, inAppWallet } from "thirdweb/wallets";
import { AutoConnect } from "thirdweb/react";
 
// wallets used in your app
const wallets = [
  inAppWallet(),
  createWallet("io.metamask"),
  createWallet("com.coinbase.wallet"),
  createWallet("me.rainbow"),
];
 
function Example() {
  return (
    <AutoConnect
      client={client}
      timeout={10000}
      wallets={wallets}
      appMetadata={appMetadata}
    />
  );
}
```

### Props
## ConnectButton

ConnectButton component renders a `<button>` which when clicked opens a modal and allows users to connect to various wallets. It is extremely customizable and very easy to use.

#### Playground

See the ConnectButton in action on [ConnectButton Playground!](https://playground.thirdweb.com/connect/sign-in/button)

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fconnect-wallet-hero.8fcc6628.webp&w=3840&q=75)

### Usage

To Configure the wallets to show in the ConnectButton Modal, configure the `wallets` prop

To mark a wallet as `Recommended`, pass in the `recommended: true` property in the wallet config function.

Refer to [Props](#props) to see all the available configuration options

#### In-App Wallets

This example uses [In-App Wallets](https://portal.thirdweb.com/connect/in-app-wallet/overview), a special type of wallet that allows users to connect to your app using email, social logins, or other custom forms of authentication.

```tsx
import { ConnectButton } from "thirdweb/react";
import { createWallet, inAppWallet } from "thirdweb/wallets";
 
const wallets = [
  inAppWallet(),
  createWallet("io.metamask"),
  createWallet("com.coinbase.wallet"),
  createWallet("me.rainbow"),
];
 
function Example() {
  return (
    <div>
      <ConnectButton client={client} wallets={wallets} />
    </div>
  );
}
```

### Auth

The `ConnectButton` can optionally include [Auth](https://portal.thirdweb.com/connect/auth) to manage user authentication for you. When the user connects their wallet, the `ConnectButton` will immediately prompt them to sign a message to login. That signature can then be verified on your server to issue the user a JWT authenticating their session.

```ts
<ConnectButton
  client={client}
  auth={{
    isLoggedIn: async (address) => {
      console.log("checking if logged in!", { address });
      return await isLoggedIn();
    },
    doLogin: async (params) => {
      console.log("logging in!");
      await login(params);
    },
    getLoginPayload: async ({ address }) =>
      generatePayload({ address }),
    doLogout: async () => {
      console.log("logging out!");
      await logout();
    },
  }}
/>;
```

Each of these functions correspond to a server API endpoint or server-side function. For their implementations, see the [TypeScript Auth docs](https://portal.thirdweb.com/typescript/v5/auth#server-functions) or check out our [examples](https://portal.thirdweb.com/typescript/v5/auth#example-repos).

### Props
## MediaRenderer

Component that renders any asset stored on IPFS (or anywhere else), given the IPFS URI / URL.

If an IPFS URL is given, the asset is fetched from IPFS through the thirdweb IPFS gateway by default. You can also specify a custom gateway URL using the gatewayUrl prop.

The mime type of the asset is determined and the appropriate component is rendered on the UI.

For example, if the URI points to an image, the `<img>` tag will be used. If it is a video, the `<video>` tag will be used, etc. The component currently supports:

* Images
* Videos
* Audio files
* 3D Models
* SVGs (for [on-chain NFTs](https://blog.thirdweb.com/guides/how-to-create-on-chain-nfts-with-thirdweb/))
* iframe and HTML

If none of these are appropriate, the fallback is a link to the asset.

The default size of rendered media is 300px x 300px, but this can be changed using the width and height props.

You can use thirdweb CLI to upload any file to IPFS and get the IPFS URI:

```bash
npx thirdweb upload <path/to/file>
```

#### Example

```tsx
import { MediaRenderer } from "thirdweb/react";
 
function Home() {
  return (
    <MediaRenderer
      client={client}
      src="ipfs://QmV4HC9fNrPJQeYpbW55NLLuSBMyzE11zS1L4HmL6Lbk7X"
    />
  );
}
```

### Props
## ConnectEmbed

ConnectEmbed component renders a UI to connect to various wallets. It renders the same UI as the [ConnectButton](https://portal.thirdweb.com/react/v5/ConnectButton) component's Modal UI. This is really useful for Implementing a "Sign in" page by embedding the UI for connecting wallets directly in the page instead of showing inside a modal.

#### Playground

See the ConnectButton in action on [ConnectButton Playground!](https://playground.thirdweb.com/connect/sign-in/button)

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2FConnectEmbed-default.6756e15f.png&w=3840&q=75)

It only renders UI if wallet is not connected, Once the wallet is connected, it renders nothing.

### Usage

To Configure the wallets to show in the ConnectEmbed, configure the `wallets` prop

To mark a wallet as `Recommended`, pass in the `recommended: true` property in the wallet config function.

Refer to [Props](#props) to see all the available configuration options

```tsx
import { ConnectEmbed } from "thirdweb/react";
import { createWallet, inAppWallet } from "thirdweb/wallets";
 
const wallets = [
  inAppWallet(),
  createWallet("io.metamask"),
  createWallet("com.coinbase.wallet"),
  createWallet("me.rainbow"),
];
 
function Example() {
  return (
    <div>
      <ConnectEmbed client={client} wallets={wallets} />
    </div>
  );
}
```

### Props
## TransactionButton

TransactionButton component is used to render a button that sends a given transaction. Refer to [preparing transactions guide](https://portal.thirdweb.com/typescript/v5/transactions/prepare) to learn how to create a transaction object.

It shows a "Switch Network" button if the connected wallet is on a different chain than the transaction.

#### Example

```tsx
function Example() {
  return (
    <TransactionButton
      transaction={() => {
        // Create a transaction object and return it
        const tx = prepareContractCall({
          contract,
          method: "mint",
          params: [address, amount],
        });
        return tx;
      }}
      onTransactionSent={(result) => {
        console.log("Transaction submitted", result.transactionHash);
      }}
      onTransactionConfirmed={(receipt) => {
        console.log("Transaction confirmed", receipt.transactionHash);
      }}
      onError={(error) => {
        console.error("Transaction error", error);
      }}
    >
      Confirm Transaction
    </TransactionButton>
  );
}
```

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Ftx-button.ccb0b1cb.png&w=3840&q=75)

### Props
## Account UI Components

Build your own UI for displaying account information with these headless components.

```tsx
import {
  AccountProvider,
  AccountAvatar,
  AccountName,
  AccountBalance,
} from "thirdweb/react";
 
const App = () => (
  <AccountProvider>
    <AccountAvatar />
    <AccountName />
    <AccountBalance />
  </AccountProvider>
);
```

### Available components
## UI Components
## Onchain Data UI Components

Build your own UI and interact with onchain data using headless components.

### Available components

#### Transactions

#### Tokens

#### NFTs

#### Chains

#### Wallets
## Connection Hooks

You can build a completely custom UI for connecting the wallet using the [useConnect](https://portal.thirdweb.com/references/typescript/v5/useConnect) hook to connect any of [supported wallets](https://portal.thirdweb.com/typescript/v5/supported-wallets).

```tsx
import { createThirdwebClient } from "thirdweb";
import { useConnect } from "thirdweb/react";
import { createWallet, injectedProvider } from "thirdweb/wallets";
 
const client = createThirdwebClient({ clientId });
 
function Example() {
  const { connect, isConnecting, error } = useConnect();
  return (
    <button
      onClick={() =>
        connect(async () => {
          // create a wallet instance
          const metamask = createWallet("io.metamask"); // autocomplete the wallet id
          // trigger the connection
          await metamask.connect({ client });
          // return the wallet
          return metamask;
        })
      }
    >
      Connect
    </button>
  );
}
```

### Creating Wallets

You can create any wallet by id with auto completion using the [createWallet](https://portal.thirdweb.com/references/typescript/v5/createWallet) function. Or use one of the first party wallets like [inAppWallet](https://portal.thirdweb.com/references/typescript/v5/inAppWallet) or [ecosystemWallet](https://portal.thirdweb.com/references/typescript/v5/ecosystemWallet).

### Pre Connection Hooks

Use these hooks to trigger and manage wallet connection within your own UI. Refer to [wallet connection hooks reference](https://portal.thirdweb.com/references/typescript/v5/useConnect) for more information.

### Post Connection Hooks

Once the wallet is connected, you can use the [wallet connection hooks](https://portal.thirdweb.com/references/typescript/v5/hooks#wallet-connection) to get information about the connected wallet like getting the address, account, etc.
## Connecting Wallets

Use the prebuilt UI components or create your own UX with hooks to connect wallets in your app.
## UI Components

You can use [ConnectButton](https://portal.thirdweb.com/react/v5/ConnectButton) or [ConnectEmbed](https://portal.thirdweb.com/react/v5/ConnectEmbed) component for a quick, easy and customizable UI.

These components provide a prebuilt UI for connecting various wallets and take care of a lot of wallet-specific edge cases - so you can focus on building your app.

```tsx
import { createThirdwebClient } from "thirdweb";
import { ThirdwebProvider, ConnectButton } from "thirdweb/react";
 
const client = createThirdwebClient({ clientId });
 
export default function App() {
  return (
    <ThirdwebProvider>
      <ConnectButton client={client} />
    </ThirdwebProvider>
  );
}
```

These components support over 500+ wallets, including support in-app wallets and account abstraction.

It also automatically shows all installed `EIP-6963` compliant wallet extensions installed by the user.

### Creating Wallets

You can create any wallet by id with auto completion using the [createWallet](https://portal.thirdweb.com/references/typescript/v5/createWallet) function. Or use one of the first party wallets like [inAppWallet](https://portal.thirdweb.com/references/typescript/v5/inAppWallet) or [ecosystemWallet](https://portal.thirdweb.com/references/typescript/v5/ecosystemWallet).

### React Components

The SDK supports 500+ wallets out of the box, all you need to pass is their id.

### Post Connection

Once the wallet is connected, you can use the [Connection hooks](https://portal.thirdweb.com/react/v5/connecting-wallets/hooks) to get information about the connected wallet like getting the address, account, etc
## Extensions

Get familiar with the concept of extensions and how to use them in your project.

### Using read extensions in React

Any extension that reads from the blockchain can be used with `useReadContract`. The extension function itself be passed as the first argument, and the extension's parameters must be passed as the second argument.

```ts
import { getContract } from "thirdweb";
import { useReadContract } from "thirdweb/react";
import { getOwnedNFTs } from "thirdweb/extensions/erc721";
 
const contract = getContract({
  client,
  chain,
  address: "0x...",
});
 
const MyComponent = () => {
  const ownedNFTs = useReadContract(getOwnedNFTs, {
    contract,
    address: "0x...",
  });
};
```

### Using write extensions in React

For extensions that write to the blockchain, they work the same way as raw contract calls using `useSendTransaction`.

Write extensions always return a `Transaction` object that can be passed to `useSendTransaction`.

Note that unlike in TypeScript core, `useSendTransaction` does not require passing the active `Account`, it will used the current active account from the React context.

```ts
import { getContract } from "thirdweb";
import { useSendTransaction } from "thirdweb/react";
import { mintTo } from "thirdweb/extensions/erc721";
 
const contract = getContract({
  client,
  chain,
  address: "0x...",
});
 
const MyComponent = () => {
  const { mutate: sendTransaction, isPending } = useSendTransaction();
 
  const onClick = async () => {
    const transaction = mintTo({
      contract,
      to: "0x...",
      nft: {
        name: "NFT Name",
        description: "NFT Description",
        image: "https://example.com/image.png",
      },
    });
    sendTransaction(transaction);
  };
};
```
## Getting Started

You can get started by creating a new project or adding thirdweb to an existing project.

### New Projects

You can quickly create a new project with the thirdweb CLI

```bash
npx thirdweb create app
```

or clone the the Next.js or Vite starter repo:

[GitHubNext.js + thirdweb starter repo](https://github.com/thirdweb-example/next-starter)[GitHubVite + thirdweb starter repo](https://github.com/thirdweb-example/vite-starter)

### Existing Projects

Install the thirdweb packages in your project

npmyarnpnpm

`npm i thirdweb

`

### Build your app

* #### Setup the ThirdwebProvider  
At the root of your application, wrap your app with a `ThirdwebProvider` component. This keeps state around like the active wallet and chain.  
```tsx  
// src/main.tsx  
import { ThirdwebProvider } from "thirdweb/react";  
   
function Main() {  
  return (  
    <ThirdwebProvider>  
      <App />  
    </ThirdwebProvider>  
  );  
}  
```
* #### Create the thirdweb client  
Head to the [thirdweb dashboard](https://thirdweb.com/team), create your account (or sign in), and click **Projects** to see all your projects.  
Create a Project with `localhost` included in the allowed domains. Securely store your secret key and copy your client id for use in the next step.  
Create a `.env` file and add your client ID there. Then create a `client.ts` file with the following content:  
```tsx  
// src/client.ts  
import { createThirdwebClient } from "thirdweb";  
   
export const client = createThirdwebClient({  
  clientId: process.env.NEXT_PUBLIC_THIRDWEB_CLIENT_ID,  
});  
```  
You only need to define the client once. Exporting the client variable will allow you to use anywhere in your app.
* #### Connect a wallet  
There are two ways to connect users to your app:  
   * The prebuilt `ConnectButton` or `ConnectEmbed` components.  
   * Your own custom button.  
In this guide, we'll use the prebuilt `ConnectButton` component.  
```tsx  
// src/app.tsx  
import { client } from "./client";  
import { ConnectButton } from "thirdweb/react";  
   
function App() {  
  return (  
    <div>  
      <ConnectButton client={client} />  
    </div>  
  );  
}  
```  
The `ConnectButton` and `ConnectEmbed` components come with built-in support for 500+ of wallets, 2000+ chains, fiat on-ramping, crypto swapping, transaction tracking, and more.  
You can also build your own custom button using the [useConnect](https://portal.thirdweb.com/react/v5/connecting-wallets/hooks) hook.
* #### Get the connected wallet information  
Once the user has connected their wallet, you can get the wallet address, balance, and other details.  
```tsx  
import { useActiveAccount, useWalletBalance } from "thirdweb/react";  
   
export default function App() {  
  const account = useActiveAccount();  
  const { data: balance, isLoading } = useWalletBalance({  
    client,  
    chain,  
    address: account.address,  
  });  
   
  return (  
    <div>  
      <p>Wallet address: {account.address}</p>  
      <p>  
        Wallet balance: {balance?.displayValue} {balance?.symbol}  
      </p>  
    </div>  
  );  
}  
```
* #### Read blockchain data  
You can read contract state with the [useReadContract](https://portal.thirdweb.com/react/v5/useReadContract) hook. This works with any contract call. Simply specify the solidity function signature to get a type safe API for your contract.  
```tsx  
import { client } from "./client";  
import { getContract } from "thirdweb";  
import { sepolia } from "thirdweb/chains";  
import { useReadContract } from "thirdweb/react";  
   
const contract = getContract({  
  client,  
  address: "0x...",  
  chain: sepolia,  
});  
   
export default function App() {  
  const { data, isLoading } = useReadContract({  
    contract,  
    method: "function tokenURI(uint256 tokenId) returns (string)",  
    params: [1n], // type safe params  
  });  
   
  return (  
    <div>  
      <p>Token URI: {data}</p>  
    </div>  
  );  
}  
```  
Using [Extensions](https://portal.thirdweb.com/react/v5/extensions) you can do powerful queries like getting all the owned NFTs of a specific address, and generate performant typesafe functions for your contract.  
```tsx  
import { client } from "./client";  
import { getContract } from "thirdweb";  
import { sepolia } from "thirdweb/chains";  
import { useReadContract } from "thirdweb/react";  
import { getOwnedNFTs } from "thirdweb/extensions/erc721";  
   
const contract = getContract({  
  client,  
  address: "0x...",  
  chain: sepolia,  
});  
   
export default function App() {  
  const { data: ownedNFTs } = useReadContract(getOwnedNFTs, {  
    contract,  
    address: "0x...",  
  });  
   
  return (  
    <div>  
      <p>Owned NFTs: {ownedNFTs}</p>  
    </div>  
  );  
}  
```
* #### Execute transactions  
You can execute transactions with the [useSendTransaction](https://portal.thirdweb.com/react/v5/useSendTransaction) hook. Prepare a transaction with the [prepareContractCall](https://portal.thirdweb.com/references/typescript/v5/prepareContractCall) function and pass it to the `sendTransaction` function.  
```tsx  
import { client } from "./client";  
import { getContract } from "thirdweb";  
import { sepolia } from "thirdweb/chains";  
import { useSendTransaction } from "thirdweb/react";  
   
const contract = getContract({  
  client,  
  address: "0x...",  
  chain: sepolia,  
});  
   
export default function App() {  
  const { mutate: sendTransaction } = useSendTransaction();  
   
  const onClick = async () => {  
    const transaction = prepareContractCall({  
      contract,  
      method: "function mint(address to)",  
      params: ["0x..."], // type safe params  
    });  
    sendTransaction(transaction);  
  };  
   
  return (  
    <div>  
      <button onClick={onClick}>Mint</button>  
    </div>  
  );  
}  
```  
Using [Extensions](https://portal.thirdweb.com/react/v5/extensions/use) you can do more complex transactions like a claim, batch mint, and more. These will handle all the preprocessing needed before calling the contract.  
```tsx  
import { client } from "./client";  
import { getContract } from "thirdweb";  
import { sepolia } from "thirdweb/chains";  
import { useSendTransaction } from "thirdweb/react";  
import { mintTo } from "thirdweb/extensions/erc721";  
   
const contract = getContract({  
  client,  
  address: "0x...",  
  chain: sepolia,  
});  
   
export default function App() {  
  const { mutate: sendTransaction } = useSendTransaction();  
   
  const onClick = async () => {  
    // this mint extension handles uploading metadata to IPFS and pining it  
    const transaction = mintTo({  
      contract,  
      to: "0x...",  
      nft: {  
        name: "NFT Name",  
        description: "NFT Description",  
        image: "https://example.com/image.png",  
      },  
    });  
    sendTransaction(transaction);  
  };  
   
  return (  
    <div>  
      <button onClick={onClick}>Mint</button>  
    </div>  
  );  
}  
```

### Learn more

You now have all the basics to build your own app with thirdweb. You can also check out the [full thirdweb SDK reference](https://portal.thirdweb.com/references/typescript/v5) to learn more about the different hooks and functions available.
## Sponsor Transactions

By using [Account abstraction](https://portal.thirdweb.com/connect/account-abstraction) or [In-App Wallets](https://portal.thirdweb.com/connect/in-app-wallet/overview), you can sponsor all gas costs for your users transactions.

#### Sponsored transactions

To set up sponsored transactions, set the `sponsorGas` option to `true` in the smart account configuration. All transactions performed with the smart account will then be sponsored by your application. Testnet transactions are free, but you need a valid credit card on file for mainnet transactions.

### Live Playground

Try out the demo for yourself in the [sponsored transactions playground](https://playground.thirdweb.com/connect/account-abstraction/sponsor)

### Sponsor transactions for all in-app wallets

To enable account abstraction for in-app wallets, you need to add the `smartAccount` prop with the `inAppWallet` creation.

```jsx
import { ConnectButton } from "thirdweb/react";
import { inAppWallet } from "thirdweb/wallets";
import { sepolia } from "thirdweb/chains";
 
const wallets = [
  inAppWallet({
    smartAccount: {
      chain: sepolia,
      sponsorGas: true,
    },
  }),
];
 
export default function App() {
  return (
    <ThirdwebProvider>
      <ConnectButton client={client} wallets={wallets} />
    </ThirdwebProvider>
  );
}
```

This will create an in-app wallet and a smart account for the user. The smart account will be initialized with the in-app wallet as the owner.

You can sponsor transactions simply by passing `sponsrGas: true` to the `smartAccount` prop. This will allow the smart account to send transactions without the user needing to hold any ETH.

### Sponsor transactions for all connected wallets

To sponsor transactions for all connected wallets, you can use the `sponsorGas` prop on the `ConnectButton` or `useConnect` hook.

```jsx
import { createThirdwebClient } from "thirdweb";
import { ThirdwebProvider, ConnectButton } from "thirdweb/react";
 
const client = createThirdwebClient({
  clientId: "YOUR_CLIENT_ID",
});
 
export default function App() {
  return (
    <ThirdwebProvider>
      <ConnectButton
        client={client}
        accountAbstraction={{
          chain: sepolia, // the chain where your smart accounts will be or is deployed
          sponsorGas: true, // enable or disable sponsored transactions
        }}
      />
    </ThirdwebProvider>
  );
}
```

or with the `useConnect` hook:

```jsx
import { useConnect } from "thirdweb/react";
import { inAppWallet } from "thirdweb/wallets";
import { sepolia } from "thirdweb/chains";
 
function App() {
  // 1. set the `accountAbstraction` configuration to convert wallets to smart accounts
  const { connect } = useConnect({
    client,
    accountAbstraction: {
      chain: sepolia, // the chain where your smart accounts will be or is deployed
      sponsorGas: true, // enable or disable sponsored transactions
    },
  });
 
  const connectToSmartAccount = async () => {
    // 2. connect with the admin wallet of the smart account
    connect(async () => {
      const wallet = createWallet("io.metamask"); // or any other wallet
      await wallet.connect({
        client,
        chain: sepolia,
      });
      return wallet;
    });
  };
 
  return (
    <button onClick={() => connectToSmartAccount()}>Connect</button>
  );
}
```

Once connected, all transactions sent via the `useSendTransaction` hook or the `TransactionButton` component will be sponsored.
## Build your own UI

### Low level control to authenticate and connect wallets

You have full control with the connection hooks and functions to build your own UI. To use in-app wallets, you first choose an authentication strategy and then connect.

### Setup the ThirdwebProvider

This will ensure that the wallet is available to all components in your app, handle connection states and auto-connection on page load.

```jsx
import { ThirdwebProvider } from "thirdweb/react";
 
<ThirdwebProvider>
  <YourApp />
</ThirdwebProvider>;
```

### Create an in-app wallet

The simplest way to create an in-app wallet is to use the `inAppWallet()` function. By default, this will create a wallet that supports email/password login, Google, Apple, Facebook login, and passkey.

```tsx
import { inAppWallet } from "thirdweb/wallets";
 
const wallet = inAppWallet();
```

You can also customize the wallet by passing in options.

```tsx
import { inAppWallet } from "thirdweb/wallets";
 
const wallet = inAppWallet({
  auth: {
    mode, // options are "popup" | "redirect" | "window";
    options, // ex: ["discord", "farcaster", "apple", "facebook", "google", "passkey"],
    passkeyDomain, // for passkey, the domain that the passkey is created on
    redirectUrl, // the URL to redirect to after authentication
  },
  metadata, // metadata for the wallet
  partnerId, // partner ID for the wallet
  smartAccount, // smart account options for the wallet
});
```

[View all in-app wallet options](https://portal.thirdweb.com/references/typescript/v5/InAppWalletCreationOptions).

Once created, you can connect to the wallet using the `connect()` function with the desired `strategy`.

### Authenticate via Google

Note that for Apple and Facebook, you just need to update the strategy to "facebook" or "apple".

In React and React Native, the `useConnect()` hook handles authentication and connection states.

```tsx
import { inAppWallet } from "thirdweb/wallets";
import { useConnect } from "thirdweb/react";
 
const { connect } = useConnect();
 
const handleLogin = async () => {
  await connect(async () => {
    const wallet = inAppWallet();
    await wallet.connect({
      client,
      strategy: "google",
    });
    return wallet;
  });
};
```

Other social options include Apple, Facebook, Discord, Farcaster and more.

### Authenticate via Email verification

```typescript
import {
  inAppWallet,
  preAuthenticate,
} from "thirdweb/wallets/in-app";
 
const { connect } = useConnect();
 
const preLogin = async (email: string) => {
  // send email verification code
  await preAuthenticate({
    client,
    strategy: "email",
    email, // ex: user@example.com
  });
};
 
const handleLogin = async (
  email: string,
  verificationCode: string,
) => {
  // verify email and connect
  await connect(async () => {
    const wallet = inAppWallet();
    await wallet.connect({
      client,
      strategy: "email",
      email,
      verificationCode,
    });
    return wallet;
  });
};
```

### Authenticate via Phone number verification

```typescript
import {
  inAppWallet,
  preAuthenticate,
} from "thirdweb/wallets/in-app";
 
const { connect } = useConnect();
 
const preLogin = async (phoneNumber: string) => {
  // send phone number verification code
  await preAuthenticate({
    client,
    strategy: "phone",
    phoneNumber, // ex: +1234567890
  });
};
 
const handleLogin = async (
  phoneNumber: string,
  verificationCode: string,
) => {
  // verify phone number and connect
  await connect(async () => {
    const wallet = inAppWallet();
    await wallet.connect({
      client,
      strategy: "phone",
      phoneNumber,
      verificationCode,
    });
    return wallet;
  });
};
```

### Authenticate via Passkey

#### React Native support

For React Native, `passkeyDomain` is required and must be set to a valid app universal link. To setup universal links for your application, follow the [iOS documentation](https://developer.apple.com/documentation/xcode/supporting-associated-domains) and [Android documentation](https://developer.android.com/identity/sign-in/credential-manager#add-support-dal).

```typescript
import {
  inAppWallet,
  hasStoredPasskey,
} from "thirdweb/wallets/in-app";
 
const { connect } = useConnect();
 
const handleLogin = async () => {
  await connect(async () => {
    const wallet = inAppWallet({
      auth: {
        passkeyDomain: "example.com", // defaults to current url
      },
    });
    const hasPasskey = await hasStoredPasskey(client);
    await wallet.connect({
      client,
      strategy: "passkey",
      type: hasPasskey ? "sign-in" : "sign-up",
    });
    return wallet;
  });
};
```
## Export Private Key

Learn how to export the private key for a thirdweb in-app wallet using the Connect modal.

* #### Login  
Login to your in-app wallet on the application using the [ConnectButton](https://portal.thirdweb.com/react/v5/connect-button) component.
* #### Manage  
Select "Manage Wallet".  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fmanage-wallet.c0f64900.png&w=1920&q=75)
* #### Export  
Choose "Export Private Key" and confirm the action to reveal the private key.  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fexport-key.92a825c7.png&w=1920&q=75)
* #### Confirm  
Confirm you want to reveal your private key.  
#### Secure Private Keys  
Revealing private keys can compromise your assets and security. Keep them safe and confidential at all times.  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fconfirm-reveal.b058edda.png&w=1920&q=75)
* #### Reveal  
Copy the exported private key directly from the modal.  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fexported-key.fb9b0156.png&w=1920&q=75)

#### Advanced Configuration

As an advanced option, to hide the export private key option from the modal, set the `hidePrivateKeyOption` to `true`
## Retrieving In-App Wallet User Details on the Server

You can query user details through the thirdweb SDK using a wallet address, email, phone number, or user ID. **This function requires a secret key to be present on the thirdweb client and should only be used on the server.**

WalletEmailPhoneUser ID

```ts
import { getUser } from "thirdweb";
 
const user = await getUser({
  client,
  walletAddress: "0x123...",
});
```
## Interact with wallets

Once connected, you can interact with the wallet using the `thirdweb/wallets/inApp` specific methods.

### Get the user email

```typescript
import { getUserEmail } from "thirdweb/wallets/in-app";
 
const email = await getUserEmail({ client });
console.log("user email", email);
```

### Get the user's account

ReactTypeScript

```typescript
import { useActiveAccount } from "thirdweb/react";
 
const account = useActiveAccount();
```

### Get the user's wallet address

ReactTypeScript

```typescript
import { useActiveAccount } from "thirdweb/react";
 
const account = useActiveAccount();
console.log("wallet address", account.address);
```

### Get wallet balance

```typescript
await getWalletBalance({
  client,
  chain,
  address: account.address,
});
```

### Sign a message

```typescript
await inAppWallet.sign("Hello World!");
```
## Interact with the blockchain

Once connected, in-app wallets can be used alongside the [Contract SDK](https://portal.thirdweb.com/contracts) to interact with the blockchain.

### Initialize the SDK With Your Wallet

React & React Native Other Frameworks

The `ThirdwebProvider` handles maintaining the connection state, and allows using all the hooks in the SDK to interact with the blockchain as the connected user.

Here's an example using the `TransactionButton` component to claim an NFT on a smart contract:

```tsx
export default function App() {
  const account = useActiveAccount();
 
  return (
    <div>
      <TransactionButton
        transaction={() => {
          if (!account) {
            return alert("Please connect your wallet");
          }
          return claimTo({
            contract,
            to: account.address,
            quantity: 1,
          });
        }}
      >
        Claim NFT
      </TransactionButton>
    </div>
  );
}
```

### Full Reference

View everything you can do in the Connect SDK once you have connected your wallet:
## Link Profiles

When using [in-app wallets](https://portal.thirdweb.com/react/v5/in-app-wallet/get-started) or [ecosystem wallets](https://portal.thirdweb.com/react/v5/ecosystem-wallets/get-started), you can link profiles to your account. This allows users to login with a frictionless method like guest, passkey or email, then later link their wallet or social profile to their account.

Once linked, users can login to their account with any of their linked profiles.

### Live Playground

Try out the demo for yourself in the [link profiles live playground](https://playground.thirdweb.com/connect/in-app-wallet)

### Available auth methods

* Email
* Phone
* Passkey
* Guest
* Wallet
* Google
* Apple
* Facebook
* X
* Discord
* Telegram
* Twitch
* Farcaster
* Github
* Line
* Coinbase
* Steam
* Backend

### Usage with UI Components

When using [ConnectButton](https://portal.thirdweb.com/references/typescript/v5/ConnectButton) or [useWalletDetailsModal](https://portal.thirdweb.com/references/typescript/v5/useWalletDetailsModal), users can link a new profile by clicking the "Manage Wallet" button, as long as they are connected with an in-app or ecosystem wallet.

### Usage with your own UI

You can use the [useLinkProfile](https://portal.thirdweb.com/references/typescript/v5/useLinkProfile) function to link a new profile to your account. This can be useful if you want to use a custom UI for the linking flow.
## In-App Wallets

Create in-app wallet for your users based on their email, phone, passkey, social auth or even their external wallets. These wallets are scoped by your clientId and do not require any confirmation to sign transactions.

### Available auth methods

* Email
* Phone
* Passkey
* Guest
* Wallet
* Google
* Apple
* Facebook
* X
* Discord
* Telegram
* Twitch
* Farcaster
* Github
* Line
* Coinbase
* Steam
* Backend

### Live Playground

Try out in-app wallets for yourself in the [in-app wallet live playground](https://playground.thirdweb.com/connect/in-app-wallet)

### Configure in-app wallets

The simplest way to create an in-app wallet is to use the `inAppWallet()` function. By default, this will create a wallet that supports email/password login, Google, Apple, Facebook login, and passkey.

```tsx
import { inAppWallet } from "thirdweb/wallets";
 
const wallet = inAppWallet();
```

You can also customize the wallet by passing in options.

```tsx
import { inAppWallet } from "thirdweb/wallets";
 
const wallet = inAppWallet({
  auth: {
    mode, // options are "popup" | "redirect" | "window";
    options, // ex: ["discord", "farcaster", "apple", "facebook", "google", "passkey"],
    passkeyDomain, // for passkey, the domain that the passkey is created on
    redirectUrl, // the URL to redirect to after authentication
  },
  metadata, // metadata for the wallet (name, icon, etc.)
  smartAccount, // smart account options for the wallet (for gasless tx)
});
```

[View all in-app wallet options](https://portal.thirdweb.com/references/typescript/v5/InAppWalletCreationOptions).

Once created, you can use it either with the prebuilt UI components, or with your own UI.

### Usage with Connect UI components

The easiest way to use in-app wallets is using the prebuilt connect UI components like [ConnectButton](https://portal.thirdweb.com/references/typescript/v5/ConnectButton) and [ConnectEmbed](https://portal.thirdweb.com/references/typescript/v5/ConnectEmbed) to authenticate users and connect their wallets.

By default, the connect UI supports multiple social logins as well as email, phone and passkey authentication. You can customize which authentication methods to support which will be reflected in the UI.

#### Authentication Order

By default, email login is displayed before phone number login. To display phone number first, add "phone" before "email" in the providers array

```tsx
import { ThirdwebProvider, ConnectButton } from "thirdweb/react";
import { inAppWallet } from "thirdweb/wallets";
 
const client = createThirdwebClient({ clientId });
const wallets = [
  inAppWallet({
    auth: { options: ["email", "passkey", "google"] },
  }),
];
 
export default function App() {
  return (
    <ThirdwebProvider>
      <ConnectButton client={client} wallets={wallets} />
    </ThirdwebProvider>
  );
}
```

### Usage with your own UI

You have full control with the connection hooks and functions to build your own UI. Pick an authentication strategy and then connect.

#### Setup the ThirdwebProvider

This will ensure that the wallet is available to all components in your app, handle connection states and auto-connection on page load.

```jsx
import { ThirdwebProvider } from "thirdweb/react";
 
<ThirdwebProvider>
  <YourApp />
</ThirdwebProvider>;
```

#### Authenticate via Google

Note that for Apple and Facebook, you just need to update the strategy to "facebook" or "apple".

In React and React Native, the `useConnect()` hook handles authentication and connection states.

```tsx
import { inAppWallet } from "thirdweb/wallets";
import { useConnect } from "thirdweb/react";
 
const { connect } = useConnect();
 
const handleLogin = async () => {
  await connect(async () => {
    const wallet = inAppWallet();
    await wallet.connect({
      client,
      strategy: "google",
    });
    return wallet;
  });
};
```

Other social options include Apple, Facebook, Discord, Farcaster and more.

#### Authenticate via Email verification

```typescript
import {
  inAppWallet,
  preAuthenticate,
} from "thirdweb/wallets/in-app";
 
const { connect } = useConnect();
 
const preLogin = async (email: string) => {
  // send email verification code
  await preAuthenticate({
    client,
    strategy: "email",
    email, // ex: user@example.com
  });
};
 
const handleLogin = async (
  email: string,
  verificationCode: string,
) => {
  // verify email and connect
  await connect(async () => {
    const wallet = inAppWallet();
    await wallet.connect({
      client,
      strategy: "email",
      email,
      verificationCode,
    });
    return wallet;
  });
};
```

#### Authenticate via Phone number verification

```typescript
import {
  inAppWallet,
  preAuthenticate,
} from "thirdweb/wallets/in-app";
 
const { connect } = useConnect();
 
const preLogin = async (phoneNumber: string) => {
  // send phone number verification code
  await preAuthenticate({
    client,
    strategy: "phone",
    phoneNumber, // ex: +1234567890
  });
};
 
const handleLogin = async (
  phoneNumber: string,
  verificationCode: string,
) => {
  // verify phone number and connect
  await connect(async () => {
    const wallet = inAppWallet();
    await wallet.connect({
      client,
      strategy: "phone",
      phoneNumber,
      verificationCode,
    });
    return wallet;
  });
};
```

#### Authenticate via Passkey

#### React Native support

For React Native, `passkeyDomain` is required and must be set to a valid app universal link. To setup universal links for your application, follow the [iOS documentation](https://developer.apple.com/documentation/xcode/supporting-associated-domains) and [Android documentation](https://developer.android.com/identity/sign-in/credential-manager#add-support-dal).

```typescript
import {
  inAppWallet,
  hasStoredPasskey,
} from "thirdweb/wallets/in-app";
 
const { connect } = useConnect();
 
const handleLogin = async () => {
  await connect(async () => {
    const wallet = inAppWallet({
      auth: {
        passkeyDomain: "example.com", // defaults to current url
      },
    });
    const hasPasskey = await hasStoredPasskey(client);
    await wallet.connect({
      client,
      strategy: "passkey",
      type: hasPasskey ? "sign-in" : "sign-up",
    });
    return wallet;
  });
};
```

#### Authenticate with an external wallet

You can also use wallets as an authentication method, when using this method, both external and in-app wallets are connected, and you can switch between the 2 at any time.

```typescript
import { inAppWallet } from "thirdweb/wallets/in-app";
import { sepolia } from "thirdweb/chains";
 
const { connect } = useConnect();
 
const handleLogin = async () => {
  await connect(async () => {
    const wallet = inAppWallet();
    await wallet.connect({
      client,
      strategy: "wallet",
      wallet: createWallet("io.metamask"), // or any other wallet
      chain: sepolia, // required for SIWE
    });
    return wallet;
  });
};
```

#### Authenticate as Guest

You can also create wallets for your users without any input at all. This will create a session that can be later upgraded by linking another identity. Great for progressive onboarding.

```typescript
import { inAppWallet } from "thirdweb/wallets/in-app";
 
const { connect } = useConnect();
 
const handleLogin = async () => {
  await connect(async () => {
    const wallet = inAppWallet();
    await wallet.connect({
      client,
      strategy: "guest",
    });
    return wallet;
  });
};
```

### Bring your own auth

From the in-app wallet settings on the thirdweb dashboard, you can enable [custom authentication with your own JWT or auth endpoint](https://portal.thirdweb.com/connect/in-app-wallet/custom-auth/configuration)

#### OICD compliant JWT

Pass any OICD compliant JWT, can be used with firebase, auth0, and more.

```typescript
import { inAppWallet } from "thirdweb/wallets/in-app";
 
const { connect } = useConnect();
 
const handleLogin = async () => {
  await connect(async () => {
    const wallet = inAppWallet();
    await wallet.connect({
      client,
      strategy: "jwt",
      jwt: "your-jwt",
    });
    return wallet;
  });
};
```

#### Custom Auth endpoint

Fully custom auth endpoint, pass your own payload and configure your auth verification endpoint on the thirdweb dashboard. This approach lets you use virtually any auth method you can imagine.

```typescript
import { inAppWallet } from "thirdweb/wallets/in-app";
 
const { connect } = useConnect();
 
const handleLogin = async () => {
  await connect(async () => {
    const wallet = inAppWallet();
    await wallet.connect({
      client,
      strategy: "auth_endpoint",
      payload: "your-auth-payload",
    });
    return wallet;
  });
};
```
[Migrate from React v4](https://portal.thirdweb.com/react/v5/migrate)

## Interacting with contracts

With SDK v4, you always have to "load" a contract with `useContract`. This process adds complexity to your app and inpacts its performance.  
In the latest version, a smart contract (type: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)) represents a simple object containing info about the contract address, the chain it was deployed on, and the thirdweb client object.

Example for declaring a smart contract on Ethereum mainnet

```tsx
import { getContract, createThirdwebClient } from "thirdweb";
import { ethereum } from "thirdweb/chains";
 
const client = createThirdwebClient({
  clientId: process.env.NEXT_PUBLIC_TW_CLIENT_ID,
});
 
const contract = getContract({
  address: "0x....",
  chain: ethereum,
  client,
});
```

### Contract extensions

This is a new terminology that we introduced in the new SDK. Basically, each extension represents a method of a contract, be it a "write" or a "read" method.

An extension is a function that returns a [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction) which in turn can be executed in a React hook for interacting with the contract. We will talk more about it in the section below.

One of the amazing updates that v5 brings is the rich set of prebuilt extensions. They are the contract methods that have been precompile to ensure a typesafe & performant developer experience.

Check out the list of over 100 prebuilt extensions [here](https://portal.thirdweb.com/typescript/v5/extensions/built-in), ranging from ERC20, ERC721, ERC1155 to top popular DeFi protocols like Uniswap, Farcaster & Lens.

Example: Import an ERC1155 "read" extension, for checking the balance of a wallet

```tsx
import { balanceOf } from "thirdweb/extensions/erc1155";
 
const transaction = balanceOf({
  contract,
  owner: "0x...",
  tokenId: 0n,
});
```

### Reading states of a contract

Given the task of calling `balanceOf` from an ERC1155 contract, we'll be comparing the code between v4 and v5

##### SDK v4

```tsx
import { useNFTBalance, useContract } from "@thirdweb-dev/react";
 
function App() {
  const { contract } = useContract(contractAddress);
  const { isLoading, data, error } = useNFTBalance(
    contract,
    "{{wallet_address}}",
    "{{token_id}}",
  );
}
```

##### SDK v5

```tsx
import { getContract, createThirdwebClient } from "thirdweb";
import { balanceOf } from "thirdweb/extensions/erc1155";
import { ethereum } from "thirdweb/chains";
import { client } from "@lib/client";
 
const contract = getContract({
  address: "0x....",
  chain: ethereum,
  client,
});
 
function App() {
  const { data } = useReadContract(balanceOf, {
    contract,
    owner: "0x...",
    tokenId: 0n,
  });
}
```

As you can see from the example above, we introduced the hook [useReadContract](https://portal.thirdweb.com/references/typescript/v5/useReadContract) in v5\. You should use it to perform any contract "read" in your React app. It is the perfect replacement for the old chunky React hooks from v4.

The formula for reading a contract state is:

```

```

##### If the extension you are looking for is not included in the SDK

You can always use the function signature with `useReadContract` (It's also typesafe)

```tsx
useReadContract({
  contract,
  method: "function balanceOf(address _owner, uint256 tokenId) view returns (uint256)",
  ...
})
```

##### A tip for getting a function's signature

Go to the thirdweb Dashboard's explorer page and select the function that you want to interact with. You should see the "Use this function in your app" section with the code snippet for the signature of the function.

[An example](https://thirdweb.com/avalanche-fuji/0xd5e815241882676F772A624E3892b27Ff3a449c4/explorer?name=balanceOf)

### Writing to a contract

In v5, you can utilize the following hooks for writing to contracts: [useSendTransaction](https://portal.thirdweb.com/references/typescript/v5/useSendTransaction) and [useSendAndConfirmTransaction](https://portal.thirdweb.com/references/typescript/v5/useSendAndConfirmTransaction). The main difference between the 2 hooks is that `useSendTransaction` will mark the request as "complete" once the transaction is sent, while `useSendAndConfirmTransaction` will wait until the transaction is included in the blockchain.

Given the task of claiming an NFT from an NFT Drop collection, let's compare the code between the SDK v4 and v5

##### SDK V4

```tsx
import { useContract, useClaimNFT } from "@thirdweb-dev/react";
 
function App() {
  const { contract } = useContract(contractAddress);
  const {
    mutateAsync: claimNft,
    isLoading,
    error,
  } = useClaimNFT(contract);
 
  return (
    <Web3Button
      contractAddress={contractAddress}
      action={() =>
        claimNft({
          to: "{{wallet_address}}", // Use useAddress hook to get current wallet address
          quantity: 1,
        })
      }
    >
      Claim NFT
    </Web3Button>
  );
}
```

##### SDK v5

```tsx
import { useSendTransaction } from "thirdweb/react";
import { claimTo } from "thirdweb/extension/erc721";
 
function App() {
  const transaction = claimTo({
    contract,
    quantity: 1n,
    to: "0x...",
  });
  const { mutateAsync: claimNft } = useSendTransaction();
 
  return <button onClick={() => claimNft(transaction)}>Claim</button>;
}
```

Another beautiful thing about the SDK v5 is that it comes with the [TransactionButton](https://portal.thirdweb.com/references/typescript/v5/TransactionButton)which allows you to make a contract call _without_ having to use the above React hooks. As you can see, the code is much cleaner this way!

```tsx
import { TransactionButton } from "thirdweb/react";
import { claimTo } from "thirdweb/extension/erc721";
 
function App() {
  return (
    <TransactionButton
      transaction={() =>
        claimTo({ contract, quantity: 1n, to: "0x..." })
      }
    >
      Claim
    </TransactionButton>
  );
}
```
## Cheatsheet

#### React Cheatsheet

| Task                | @thirdweb-dev/react                                 | thirdweb                                                                                                                  |
| ------------------- | --------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------- |
| Provider            | import { ThirdwebProvider} from @thirdweb-dev/react | [import { ThirdwebProvider } from "thirdweb/react"](https://portal.thirdweb.com/react/v5/ThirdwebProvider)                |
| Contract            | useContract(...)                                    | [getContract(...) // not a hook](https://portal.thirdweb.com/references/typescript/v5/getContract)                        |
| Address             | useAddress(...)                                     | [useActiveAccount(...) // account?.address](https://portal.thirdweb.com/references/typescript/v5/useActiveAccount)        |
| Read                | useContractRead(...)                                | [useReadContract(...)](https://portal.thirdweb.com/references/typescript/v5/useReadContract)                              |
| Write               | useContractWrite(...)                               | [useSendTransaction()](https://portal.thirdweb.com/references/typescript/v5/useSendTransaction)                           |
| Extensions          | useNFTs(...)                                        | [useReadContract(getNFTs, { ... })](https://portal.thirdweb.com/references/typescript/v5/useReadContract)                 |
| Get Signer          | useSigner()                                         | [useActiveAccount()](https://portal.thirdweb.com/references/typescript/v5/useActiveAccount)                               |
| Get Wallet          | useWallet()                                         | [useActiveWallet()](https://portal.thirdweb.com/references/typescript/v5/useActiveWallet)                                 |
| Button              | Web3Button                                          | [TransactionButton](https://portal.thirdweb.com/react/v5/TransactionButton)                                               |
| Connect             | ConnectWallet                                       | [ConnectButton](https://portal.thirdweb.com/react/v5/ConnectButton)                                                       |
| Connection Status   | useConnectionStatus()                               | [useActiveWalletConnectionStatus()](https://portal.thirdweb.com/references/typescript/v5/useActiveWalletConnectionStatus) |
| Switch Chain        | useSwitchChain()                                    | [useSwitchActiveWalletChain()](https://portal.thirdweb.com/references/typescript/v5/useSwitchActiveWalletChain)           |
| Get Connected Chain | useChain()                                          | [useActiveWalletChain()](https://portal.thirdweb.com/references/typescript/v5/useActiveWalletChain)                       |

#### TypeScript Cheatsheet

| Task       | @thirdweb-dev/sdk                                      | thirdweb                                                                                                                  |
| ---------- | ------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------- |
| Chains     | import { Sepolia } from "@thirdweb-dev/chains"         | [import { sepolia } from "thirdweb/chains"](https://portal.thirdweb.com/typescript/v5/chain)                              |
| Wallets    | import { MetaMaskWallet } from "@thirdweb-dev/wallets" | [import { createWallet } from "thirdweb/wallets"](https://portal.thirdweb.com/references/typescript/v5/createWallet)      |
| Initialize | new ThirdwebSDK(...)                                   | [createThirdwebClient({ ... })](https://portal.thirdweb.com/references/typescript/v5/createThirdwebClient)                |
| Contract   | await sdk.getContract(...)                             | [getContract(...) // no await](https://portal.thirdweb.com/references/typescript/v5/getContract)                          |
| Read       | await contract.call(...)                               | [await readContract(...)](https://portal.thirdweb.com/references/typescript/v5/readContract)                              |
| Prepare    | await contract.prepare(...)                            | [prepareContractCall(...) // no await](https://portal.thirdweb.com/references/typescript/v5/prepareContractCall)          |
| Send       | await contract.call(...)                               | [await sendTransaction(...)](https://portal.thirdweb.com/references/typescript/v5/sendTransaction)                        |
| Extensions | await contract.erc721.getAll()                         | [await getNFTs(...)](https://portal.thirdweb.com/references/typescript/v5/erc721/getNFTs)                                 |
| Deploy     | sdk.deployer.deployBuiltInContract(...)                | [await deployPublishedContract(...)](https://portal.thirdweb.com/references/typescript/v5/deploy/deployPublishedContract) |
## Ethers.js in v5

One common misconception about the thirdweb SDK v5 is that it will no longer work with Ethers.js. As a matter of fact, the SDK v5 is built so that it can play well with polular web3 SDKs like viem, ethers v5 and ether v6!

Let's say you decide to upgrade to v5, and still want to stick with ethers.js, you can utilize thirdweb's ethers Adapter to achieve that!

#### Signer

In v5, instead of having "signer", we pivoted to [Account](https://portal.thirdweb.com/references/typescript/v5/Account), which is the replacement for "signer". Thanks to the thirdweb ethers adapter, you can conveniently convert between ethers's Signer and thirdweb's Account.

```ts
import { ethers5Adapter } from "thirdweb/adapters/ethers5";
import { useActiveAccount } from "thirdweb/react";
 
const account = useActiveAccount();
...
const signer = await ethers5Adapter.signer.toEthers({ client, chain, account });
```

Once you have the signer, you can perform different tasks using ethers.js as usual:

```tsx
// Get balance
const balance = await signer.getBalance();
 
// Sign message
const signature = await signer.signMessage(message);
```

#### Provider

Similar to `signer`, you can retrieve the ethers provider in thirdweb v5 using the same adapter:

```ts
import { ethers5Adapter } from "thirdweb/adapters/ethers5";
import { createThirdwebClient } from "thirdweb";
 
const client = createThirdwebClient({
  clientId: "...",
});
 
const provider = ethers5Adapter.provider.toEthers({
  client,
  chainId,
});
```

and perform tasks with it:

```ts
const blockNumber = await provider.getBlockNumber();
```

#### Contracts

Similarly to the 2 components above, here's how you can convert a [thirdweb contract instance](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract) to ethers's:

```tsx
import { ethers5Adapter } from "thirdweb/adapters/ethers5";
const ethersContract = await ethers5Adapter.contract.toEthers({
  thirdwebContract,
});
```

and then do stuff with it:

```tsx
// Estimate gas
const gasLimit = await contract.estimateGas["functionName"](
  ...params,
);
 
// Send a transaction
const tx = await contract["functionName"](...params, { gasLimit });
```
## Migration from React SDK v4

### Why you should migrate

##### 1\. Better performance, happier clients

The new SDK is built with performance in mind and proper tree-shaking. Therefore, the minimum bundle size of your application is greatly reduced.

Below is the comparison of 2 similar applications, using `ConnectWallet` (v4) & `ConnectButton` (v5), which are identical in term of functionality.

| SDK v4              | SDK v5                                                                          |                       |
| ------------------- | ------------------------------------------------------------------------------- | --------------------- |
| Minimum bundle size | 766kb                                                                           | 104kb                 |
| Dependencies        | "@thirdweb-dev/react": "^4.9.4""@thirdweb-dev/sdk": "^4.0.99""ethers": "^5.7.2" | "thirdweb": "^5.42.0" |

_(Built with Next.js 14.2.5)_

##### 2\. More wallets supported

The SDK v4 only supports a handful of web3 wallets and the more wallets you want to include in your app, the heavier it becomes.

SDK v5 supports over 300 wallets and this number is increasing! You can [interact with wallets based on their unique IDs](https://portal.thirdweb.com/typescript/v5/wallets#example-connect-a-wallet-and-access-an-account-to-send-a-transaction). Hence, adding more wallets to your app has little to no effect to the final bundle.

##### 3\. Flexibility with React hooks

When building a React web3 application with thirdweb SDK v4, you have access to a set of prebuilt React hooks which let you conveniently interact with your smart contracts.

The issue with this approach is that, the number of smart-contract methods is ever-increasing, and for each hook that does not exist, we have to dedicate time & energy to write, test & maintain. This process is time-consuming & frankly, the more React hooks you add to your app, the slower and more unmaintainable your projects become.

In SDK v5, we introduce a novel concept called "prebuilt extensions" - a set of read & write methods for popular contracts which you can _plug & play_. For example:

###### Read contract states with v5

```ts
// Get a list of owned ERC721 tokens in a wallet
import { useReadContract } from "thirdweb/react";
import { getOwnedNFTs } from "thirdweb/extensions/erc721";
 
const { data } = useReadContract(getOwned, { contract, owner });
```

###### Write to contract with v5

```ts
// Claim an NFT from thirdweb Drop contract
import { useSendTransaction } from "thirdweb/react";
import { claimTo } from "thirdweb/extensions/erc721";
 
const { mutate: sendTx } = useSendTransaction();
const transaction = claimTo({
  contract,
  to: "0x...",
  quantity: 1n,
});
sendTx(transaction);
```

As you can see, by pairing the contract extensions with `useReadContract` (for read) and `useSendTransaction` (for write), we are able to greatly reduce the amount of code that is packaged & shipped to the end users. Plus, with this approach we can dedicate more time to building contract extensions. The SDK v5 currenty supports over hundreds of extensions, with some popular protocols like Uniswap, Farcaster, Lens & more to come.

View a list of [supported extensions](https://portal.thirdweb.com/typescript/v5/extensions/built-in) here, or [build your own](https://portal.thirdweb.com/typescript/v5/extensions/create)!

##### 4\. Access to latest software

Currently the SDK v4 is using `ethers@5.7.2` and `@tanstack/react-query@^4` which can be considered "outdated". We unfortunately do not have a plan to upgrade v4's dependencies to the latest versions. We highly recommend you to migrate to the SDK v5 to receive the latest software with better security and performance.  
Want to keep using ethers.js 5? Worry not! The SDK v5 comes with powerful adapters which let you use thirdweb with popular web3 frameworks like viem or ethers 5 & 6.  
[Learn more](https://portal.thirdweb.com/typescript/v5/adapters#ethers-v5)

---

#### Get started

* [Installation & Setups](https://portal.thirdweb.com/typescript/v5/react/migrate/installation)
* [Interacting with contracts](https://portal.thirdweb.com/typescript/v5/react/migrate/contracts)
* [ethers.js Adapter](https://portal.thirdweb.com/typescript/v5/react/migrate/ethers-adapter)
* [Cheatsheet](https://portal.thirdweb.com/typescript/v5/react/migrate/cheatsheet)
## Funding wallets

Let users fund their wallets with crypto or fiat on all the supported chains.

### Live Playground

Try out the demo for yourself in the [fund wallets live playground](https://playground.thirdweb.com/connect/pay)

### Usage with UI Components

The easiest way to fund wallets is to use the `PayEmbed` prebuilt UI component. Note that the `ConnectButton` also has a built-in funding flow that can also be customised.

```tsx
import { PayEmbed } from "thirdweb/react";
 
function App() {
  return (
    <PayEmbed
      client={client}
      payOptions={{
        mode: "fund_wallet",
        metadata: {
          name: "Get funds",
        },
        prefillBuy: {
          chain: base,
          amount: "0.01",
        },
        // ... theme, currency, amounts, payment methods, etc.
      }}
    />
  );
}
```

Check out the [PayEmbed API reference](https://portal.thirdweb.com/references/typescript/v5/PayEmbed) for more information.

### Usage with your own UI

If you want more control over the funding flow, you can use the [Buy with Crypto or Fiat hooks](https://portal.thirdweb.com/references/typescript/v5/hooks#buy-crypto) to create your own custom UI.
[Migrate from React v4](https://portal.thirdweb.com/react/v5/migrate)

## Installation & Setups

#### High-level changes

* All imports from `@thirdweb-dev/*` should be replaced with `thirdweb` SDK with sub-exports.
* The new SDK is `function` based rather than `class` based for better tree shaking and performance.
* All contract calls are now prepared using `prepareContractCall` and sent using the `useSendTransaction` function.
* Transactions are submitted without waiting for receipt by default. You can call the `useSendAndConfirmTransaction` function to wait for the transaction to be mined.

### Installation

##### Below is how you install thirdweb v4 SDKs

npmyarnpnpmbun

`npm i @thirdweb-dev/sdk @thirdweb-dev/react ethers@5.7.2

`

##### With the latest version, everything comes in one single package

npmyarnpnpmbun

`npm i thirdweb

`

### Setups

Once you have installed the latest package (alongside the older version that you want to replace), you can start the migration process.

#### ThirdwebProvider

In the latest SDK, the [ThirdwebProvider](https://portal.thirdweb.com/references/typescript/v5/ThirdwebProvider) no longer accepts any prop such as `activeChain`, `clientId` or any extra SDK options. Instead, you only need to pass the clientId when necessary (we'll talk more about this in a few sections below).

```tsx
import { ThirdwebProvider } from "thirdweb/react";
 
<ThirdwebProvider>...</ThirdwebProvider>;
```

###### Progressive migration

If you're currently using the `@thirdweb-dev/sdk`, you can progressively migrate to the new `thirdweb` SDK. Both SDKs can be used side by side and are interoperable with each other.

In React, you can mix and match the v4 and v5 `ThirdwebProvider`, that gives you access to the hooks and functionality of both SDKs. This way, once you have moved away from all the v4 functionalities, you can finally remove the `ThirdwebProviderV4` from your app.

```tsx
import { ThirdwebProvider as ThirdwebProviderV4 } from "@thirdweb-dev/react";
import { ThirdwebProvider } from "thirdweb/react"; // v5
 
<ThirdwebProviderV4 activeChain={...} clientId={...}>
  <ThirdwebProvider>
     ...
  </ThirdwebProvider>
</ThirdwebProviderV4>
```

#### Connecting wallets

Similar to v4's `ConnectWallet` component, the latest version has the [ConnectButton](https://portal.thirdweb.com/connect/sign-in/ConnectButton) component which has the same functionality.

However, unlike with v4 where the number of supported wallets is limited (about 20), and adding more wallets mean your app becomes heavier, the SDK v5 supports [over 300 wallets](https://portal.thirdweb.com/typescript/v5/supported-wallets) with virtually no impact to your application.

Here's how you use the new `ConnectButton`:

```tsx
import { createThirdwebClient } from "thirdweb";
import { ConnectButton } from "thirdweb/react";
 
const client = createThirdwebClient({
  clientId: process.env.NEXT_PUBLIC_TW_CLIENT_ID,
});
 
<ConnectButton client={client} />;
```

To learn more about the new `ConnectButton`, head over to the [Playground](https://playground.thirdweb.com/connect/sign-in/button).

Notice how you are passing the thirdweb client to the component itself and not to the `ThirdwebProvider` like in v4? By not putting every config inside the context wrapper, we were able to make the SDK v5 much more lightweight since you only load what you need!

Tip: You can reuse the thirdweb client object by putting it in a file and export it.

```ts
// @lib/client.ts
 
import { createThirdwebClient } from "thirdweb";
 
export const client = createThirdwebClient({
  clientId: process.env.NEXT_PUBLIC_TW_CLIENT_ID,
});
```
## Chain Abstraction

Facilitate transactions by letting users pay with any token from any chain, or with fiat.

### Live Playground

Try out the demo for yourself in the [live playground](https://playground.thirdweb.com/connect/pay/transactions)

### Usage with PayEmbed

You can use the `PayEmbed` component to let users execute a transaction from any chain, paying with any token.

```tsx
import { claimTo } from "thirdweb/extensions/erc1155";
import { PayEmbed, useActiveAccount } from "thirdweb/react";
 
function App() {
  const account = useActiveAccount();
  const { data: nft } = useReadContract(getNFT, {
    contract: nftContract,
    tokenId: 0n,
  });
 
  return (
    <PayEmbed
      client={client}
      payOptions={{
        mode: "transaction",
        transaction: claimTo({
          contract: nftContract,
          quantity: 1n,
          tokenId: 0n,
          to: account?.address,
        }),
        metadata: nft?.metadata,
      }}
    />
  );
}
```

Check out the [PayEmbed API reference](https://portal.thirdweb.com/references/typescript/v5/PayEmbed) for more information.

### Usage with regular transactions

Any transaction sent with `useSendTransaction` or with `TransactionButton` will prompt the user to choose a different payment method if they don't have enough balance for the transaction.

You can turn off this behaviour by setting the `payModal` option to `false`.
## Read contract state

Read onchain data from any contract on any chain.

### Live Playground

Try out the demo for yourself in the [reading contract state playground](https://playground.thirdweb.com/connect/blockchain-api)

### Generic Contract Read

Reading contract state in react is done via the `useReadContract` hook. The hook returns a React Query `data`, `isLoading`, and other useful state that you can use to render your component.

```ts
import { getContract } from "thirdweb";
import { useReadContract } from "thirdweb/react";
 
const contract = getContract({
  client,
  chain,
  address: "0x...",
});
 
const MyComponent = () => {
  const { data, isLoading } = useReadContract({
    contract,
    method: "function tokenURI(uint256 tokenId) returns (string)",
    params: [1n],
  });
};
```

### Using Extensions

Extensions are a way to make complex queries from a contract in a type-safe way with a simple API.

```tsx
import { getContract } from "thirdweb";
import { useReadContract } from "thirdweb/react";
import { getOwnedNFTs } from "thirdweb/extensions/erc721";
 
const contract = getContract({
  client,
  chain,
  address: "0x...",
});
 
const MyComponent = () => {
  const ownedNFTs = useReadContract(getOwnedNFTs, {
    contract,
    address: "0x...",
  });
};
```

Check out all the [available extensions](https://portal.thirdweb.com/references/typescript/v5/functions#extensions) for more details.

### Generic Contract Events

Query and listen to contract events with the `useContractEvents` hook.

```tsx
import { useContractEvents } from "thirdweb/react";
import { prepareEvent } from "thirdweb";
 
const myEvent = prepareEvent({
  signature: "event MyEvent(uint256 myArg)",
});
 
const { data: events } = useContractEvents({
  contract,
  eventName: [myEvent],
});
```

or with extensions:

```tsx
import { useContractEvents } from "thirdweb/react";
import { tokensClaimedEvent } from "thirdweb/extensions/erc721";
 
const { data: events } = useContractEvents({
  contract,
  events: [tokensClaimedEvent()],
});
```

### API References

Check out the [contract hooks](https://thirdweb.com/docs/references/typescript/v5/useReadContract) reference for more details.
## Migrate from RainbowKit

Learn how to migrate to thirdweb's ConnectButton component from [RainbowKit](https://www.rainbowkit.com/).

* #### Installation  
Install the connect SDK in your application  
npmyarnpnpmbun  
`npm i thirdweb  
`  
#### Dependency Conflicts  
If you are installing thirdweb using `npm` and run into any dependency conflicts, install thirdweb using `npm install thirdweb --legacy-peer-deps`
* #### Setup  
Wrap application using `ThirdwebProvider` and remove `RainbowKitProvider`  
```jsx  
import { ThirdwebProvider } from "thirdweb/react";  
.  
.  
.  
.  
function MyApp({ Component, pageProps }: AppProps) {  
  return (  
    <ThirdwebProvider>  
      <WagmiProvider config={config}>  
        <QueryClientProvider client={client}>  
            <Component {...pageProps} />  
        </QueryClientProvider>  
      </WagmiProvider>  
    </ThirdwebProvider>  
  );  
}  
```
* #### Swap ConnectButton component  
Import `createThirdwebClient` and `ConnectButton` from thirdweb and add them to your application. Modify the `ConnectButton` component by adding the [client](https://portal.thirdweb.com/typescript/v5/client) prop.  
```jsx  
import { ConnectButton } from "thirdweb/react";  
import { createThirdwebClient } from "thirdweb";  
.  
.  
.  
.  
const Home: NextPage = () => {  
   
  const client = createThirdwebClient({  
    clientId: "<client_id>",  
  });  
   
  return (  
      <main>  
        <ConnectButton client={client} />  
      </main>  
   
  );  
};  
```  
#### Client ID  
Get a free client ID to use in your application by creating a project in [thirdweb's dashboard](https://thirdweb.com/team).
* #### Customize  
To customize your ConnectButton component, view the cheatsheet below or [view the customization documentation](https://portal.thirdweb.com/connect/sign-in/customization).
* #### (Optional) Adapters  
If you are using Wagmi, Viem, or Ethers in your application, use thirdweb adapters to continue using contracts, providers, and wallets from these libraries.  
[View the Adapter documentation.](https://portal.thirdweb.com/typescript/v5/adapters)

### Cheatsheet

#### Installation

##### RainbowKit

`npm install @rainbow-me/rainbowkit wagmi viem@2.x @tanstack/react-query`

##### thirdweb

`npm install thirdweb`

---

#### Initalization

##### RainbowKit

```jsx
import "@rainbow-me/rainbowkit/styles.css";
import {
  getDefaultConfig,
  RainbowKitProvider,
} from "@rainbow-me/rainbowkit";
import { WagmiProvider } from "wagmi";
import {
  mainnet,
  polygon,
  optimism,
  arbitrum,
  base,
} from "wagmi/chains";
import {
  QueryClientProvider,
  QueryClient,
} from "@tanstack/react-query";
 
const config = getDefaultConfig({
  appName: "My RainbowKit App",
  projectId: "YOUR_PROJECT_ID",
  chains: [mainnet, polygon, optimism, arbitrum, base],
  ssr: true, // If your dApp uses server side rendering (SSR)
});
const queryClient = new QueryClient();
 
const App = () => {
  return (
    <WagmiProvider config={config}>
      <QueryClientProvider client={queryClient}>
        <RainbowKitProvider>{/* Your App */}</RainbowKitProvider>
      </QueryClientProvider>
    </WagmiProvider>
  );
};
```

##### thirdweb

```jsx
import { ThirdwebProvider } from "thirdweb/react";
 
const App = () => {
  return <ThirdwebProvider>{/* Your App */}</ThirdwebProvider>;
};
```

---

#### ConnectButton

##### RainbowKit

```jsx
import { ConnectButton } from "@rainbow-me/rainbowkit";
 
export const YourApp = () => {
  return <ConnectButton />;
};
```

##### thirdweb

```jsx
import { ConnectButton } from "thirdweb/react";
import { createThirdwebClient } from "thirdweb";
 
const client = createThirdwebClient({ clientId: "your-client-id" });
 
export const YourApp = () => {
  return <ConnectButton client={client} />;
};
```

---

#### Localization

##### RainbowKit

```jsx
<RainbowKitProvider locale="zh-CN" {...etc}>
  {/* Your App */}
</RainbowKitProvider>;
```

##### thirdweb

```jsx
<ConnectButton locale={"es-ES"} {...etc} />;
```

---

#### Modal Sizes

##### RainbowKit

```jsx
<RainbowKitProvider modalSize="compact" {...etc}>
  {/* Your App */}
</RainbowKitProvider>;
```

##### thirdweb

```jsx
<ConnectButton locale={"es-ES"} {...etc} />;
```

---

#### Theming

##### RainbowKit

```jsx
import { ...etc, darkTheme } from '@rainbow-me/rainbowkit';
 
<RainbowKitProvider
  theme={darkTheme()}
  {...etc}>
  {/* Your App */}
</RainbowKitProvider>
```

##### thirdweb

```jsx
<ConnectButton
  theme="dark" // "light"
  {...etc}
/>;
```

---

### Templates

[GitHubWagmi AdapterExample](https://github.com/thirdweb-example/wagmi-adapter-example)[GitHubEthers AdapterExample](https://github.com/thirdweb-example/ethers-adapter-example)
## Web3 Social Identities

Query all web3 social identities for a given address.

### Supported Social Identities

* [Farcaster](https://farcaster.xyz/)
* [Lens Protocol](https://lens.xyz/)
* [ENS](https://ens.domains/)

### Live Playground

Try out the demo for yourself in the [web3 social identities live playground](https://playground.thirdweb.com/connect/social)

### Usage with UI Components

When using [ConnectButton](https://portal.thirdweb.com/references/typescript/v5/ConnectButton) or [useWalletDetailsModal](https://portal.thirdweb.com/references/typescript/v5/useWalletDetailsModal), the user's avatar and username will be automatically populated with their linked social profiles.

### Usage with your own UI

Use the [useSocialProfiles](https://portal.thirdweb.com/references/typescript/v5/useSocialProfiles) hook to query all web3 social identities for a given address.
## React SDK

On top of the core typescript API, `thirdweb/react` exports various Components and Hooks to easily connect wallets & interact with smart contracts

### Installation

npmyarnpnpmbun

`npm i thirdweb

`

### Quickstart

Follow this [guide](https://portal.thirdweb.com/react/v5/getting-started) to get started with the React SDK.

#### Have you generated a client ID?

You'll need a client ID to access the SDK's free blockchain APIs, storage, and more.

[ Generate ](https://thirdweb.com/create-api-key)

### Starter kits

You can quickly create a new project with the thirdweb CLI

```bash
npx thirdweb create app
```

or clone the the Next.js or Vite starter repo:

[GitHubNext.js + thirdweb starter repo](https://github.com/thirdweb-example/next-starter)[GitHubVite + thirdweb starter repo](https://github.com/thirdweb-example/vite-starter)

### Live Playground

You can interact with the React SDK in the [Live Playground](https://playground.thirdweb.com/).

### API Reference

Browse the full API reference for detailed information on each function, hook and component.
## Transactions

Sending a transaction in react is done via the `useSendTransaction` hook. The hook returns a React Query `mutate` function that you can call with a transaction object created with `prepareContractCall` or `prepareTransaction`.

Note that unlike in TypeScript core, `useSendTransaction` does not require passing the active `Account`, it will used the current active account from the React context.

### Live Playground

Try out the demo for yourself in the [sending transactions playground](https://playground.thirdweb.com/connect/transactions)

### Sending a generic contract call

```ts
import { prepareContractCall, getContract } from "thirdweb";
import { useSendTransaction } from "thirdweb/react";
 
const contract = getContract({
  client,
  chain,
  address: "0x...",
});
 
const MyComponent = () => {
  const { mutate: sendTransaction, isPending } = useSendTransaction();
 
  const onClick = async () => {
    const transaction = prepareContractCall({
      contract,
      method: "function mint(address to)",
      params: ["0x..."],
      value: 0,
    });
    sendTransaction(transaction);
  };
};
```

### Using extensions

Extensions are a way to make complex transactions in a type-safe way with a simple API.

```tsx
import { getContract } from "thirdweb";
import { useSendTransaction } from "thirdweb/react";
import { mintTo } from "thirdweb/extensions/erc721";
 
const contract = getContract({
  client,
  chain,
  address: "0x...",
});
 
const MyComponent = () => {
  const { mutate: sendTransaction, isPending } = useSendTransaction();
 
  const onClick = async () => {
    const transaction = mintTo({
      contract,
      to: "0x...",
      nft: {
        name: "NFT Name",
        description: "NFT Description",
        image: "https://example.com/image.png",
      },
    });
    sendTransaction(transaction);
  };
};
```

Check out all the [available extensions](https://portal.thirdweb.com/references/typescript/v5/functions#extensions) for more details.

### API References

Check out the [transaction hooks](https://thirdweb.com/docs/references/typescript/v5/useSendTransaction) reference for more details.
## Differences from React

The `thirdweb` package is designed to work with React Native, but there are some differences you should be aware of.

#### Available wallets

All wallets are supported on both web and React Native

| Component         | React | React Native |
| ----------------- | ----- | ------------ |
| inAppWallet       | ✅     | ✅            |
| smartWallet       | ✅     | ✅            |
| privateKeyAccount | ✅     | ✅            |
| walletConnect     | ✅     | ✅            |
| coinbaseWallet    | ✅     | ✅            |
| injectedWallet    | ✅     | ✅            |

#### UI components

Some UI components might not be implemented yet on React Native. However, you can build your own UI easily with the hooks and functions provided.

| Component         | React | React Native     |
| ----------------- | ----- | ---------------- |
| ConnectButton     | ✅     | ✅                |
| ConnectEmbed      | ✅     | ✅                |
| TransactionButton | ✅     | ✅                |
| PayEmbed          | ✅     | ⚠️ (coming soon) |

Interested in contributing to get these out sooner? Put up a PR on the [JS monorepo](https://github.com/thirdweb-dev/js)!

thirdweb JS monorepo

thirdweb JS monorepo is open-source. View and contribute to its source code on GitHub.

[GitHubView on GitHub](https://github.com/thirdweb-example/account-abstraction)
## Troubleshooting

### Expo Go

Due to required native dependencies, you cannot use Expo Go for running your app. You must use a development build.

You can create ios/android development builds using the following command:

```bash
npx expo prebuild
```

You can then run the development build using the following command:

```bash
npx expo run:ios
```

```bash
npx expo run:android
```

### OpenSSL iOS build error

If you see a build error that mentions OpenSSL, you may need to update `app.json` to pin a version of OpenSSL that is compatible with your Xcode version.

Here's how to pin the OpenSSL version in `app.json`:

```json
{
  "expo": {
    "plugins": [
      "expo-build-properties",
      {
        "ios": {
          "extraPods": [
            {
              "name": "OpenSSL-Universal",
              "configurations": [
                "Release",
                "Debug"
              ],
              "modular_headers": true,
              "version": "<OPENSSL_VERSION>"
            }
          ]
        }
      }
    ]
  }
}
```

Replace `<OPENSSL_VERSION>` with the correct version of OpenSSL for your Xcode version:

* Xcode 16: `3.3.2000`
* Xcode 15: `3.1.5004`

Make sure you have `expo-build-properties` added to your `package.json` dependencies.

### Android minSdkVersion error

If you see an Android error mentioning `minSdkVersion`, you may need to update your `app.json` to set the `minSdkVersion` to a higher version.

Here's how to update the `minSdkVersion` in `app.json`:

```json
{
  "expo": {
    "plugins": [
      "expo-build-properties",
      {
        "android": {
          "minSdkVersion": 26
        }
      }
    ]
  }
}
```

Make sure you have `expo-build-properties` added to your `package.json` dependencies.
## React Native SDK

You can use all of the `thirdweb` and `thirdweb/react` exports in your React Native app, with some exceptions (see differences).

### Quickstart

Many of the components and hooks in the React Native SDK use a [client](https://portal.thirdweb.com/typescript/v5/core/client) to interface with the core SDK and your private RPC endpoints. You'll need to create a `clientId` in the [Dashboard](https://thirdweb.com/create-api-key) to generate this client.

#### Have you generated a client ID?

You'll need a client ID to access the SDK's free blockchain APIs, storage, and more.

[ Generate ](https://thirdweb.com/create-api-key)

### Starter kit

If you want to get started quickly run:

```bash
npx thirdweb create app --react-native
```

or clone the [expo-starter](https://github.com/thirdweb-dev/expo-starter) repo using git.

[GitHubExpo + thirdweb starter repo](https://github.com/thirdweb-dev/expo-starter)

### Usage
## Getting Started

#### Automatic Installation

We recommend starting a new thirdweb React Native project using our CLI, which sets up everything automatically for you.

In your CLI, run:

```bash
npx thirdweb create app --react-native
```

or clone the [expo-starter](https://github.com/thirdweb-dev/expo-starter) repo using git.

[GitHubExpo + thirdweb demo repo](https://github.com/thirdweb-dev/expo-starter) 

#### Manual Installation

To manually install the React Native SDK, you'll need to install the `@thirdweb/react-native-adapter` package from npm on top of the `thirdweb` package.

* #### Install the packages  
Using your favorite package manager or expo, install all the require dependencies  
```bash  
npx expo install thirdweb @thirdweb-dev/react-native-adapter  
```  
Since react native requires installing native dependencies directly, you also have to install these required peer dependencies:  
```bash  
npx expo install react-native-get-random-values @react-native-community/netinfo expo-application @react-native-async-storage/async-storage expo-web-browser expo-linking react-native-aes-gcm-crypto react-native-quick-crypto amazon-cognito-identity-js @coinbase/wallet-mobile-sdk react-native-mmkv react-native-svg @walletconnect/react-native-compat react-native-passkey  
```  
Here's an explanation of each peer dependency and why its needed:  
```ts  
// needed for wallet connect  
react-native-get-random-values  
@react-native-community/netinfo  
expo-application  
   
// needed wallet connect + in-app wallet  
@react-native-async-storage/async-storage  
   
// needed for inapp wallet  
expo-web-browser // for oauth flows  
amazon-cognito-identity-js // for authentication  
react-native-aes-gcm-crypto // for encryption  
react-native-quick-crypto@0.7.0-rc.6 // for fast hashing  
   
// needed for coinbase wallet  
@coinbase/wallet-mobile-sdk  
react-native-mmkv  
   
// needed for UI components  
react-native-svg  
```
* #### Edit your \`metro.config.js\`  
If you don't already have a `metro.config.file.js` in your project, you can create one by running:  
```bash  
npx expo customize metro.config.js  
```  
Then, you need to add 2 properties to the metro resolver: `unstable_enablePackageExports` and `unstable_conditionNames`. This is to tell metro to resolve named `exports` properly.  
```js  
// file: metro.config.js  
   
// Learn more https://docs.expo.io/guides/customizing-metro  
const { getDefaultConfig } = require("expo/metro-config");  
   
/** @type {import('expo/metro-config').MetroConfig} */  
const config = getDefaultConfig(__dirname);  
   
// ADD THESE 2 PROPERTIES  
config.resolver.unstable_enablePackageExports = true;  
config.resolver.unstable_conditionNames = [  
  "react-native",  
  "browser",  
  "require",  
];  
   
module.exports = config;  
```
* #### Import \`@thirdweb-dev/react-native-adapter\`  
#### Without `expo-router`  
Simply import the package in the entrypoint of your app before any other import. This will polyfill all the required functionality needed.  
```js  
// file: App.tsx  
   
// this needs to be imported before anything else  
import "@thirdweb-dev/react-native-adapter";  
// ... the rest of your app  
```  
#### With `expo-router`  
If you're using `expo-router`, you need to polyfill before the router entry:  
##### 1\. create a `index.js`  
Create an `index.js` file at the root of the repo. This will be the new entrypoint to your app, ensuring the polyfills happen before any routing.  
```ts  
// file: index.js  
   
// this needs to be imported before expo-router  
import "@thirdweb-dev/react-native-adapter";  
import "expo-router/entry";  
```  
##### 2\. Change your main entrypoint in `package.json`  
Now you can replace `expo-router/entry` with `./index.js` as your main entrypoint.  
```ts  
// file: package.json  
   
"main": "./index.js",  
```  
#### Additional notes  
   * `react-native-aes-gcm-crypto` requires `minSDK 26` for android, you can edit this in your `app.json` file.  
   * You will get some warnings about unresolved exports, this is normal and will get better as the libraries get updated.
* #### Run the development build  
You can run the development build using the Expo CLI, note that this needs to use the 'development build' option and not Expo Go.  
#### Expo Go  
Due to conflicts between Expo Go's wrapper and thirdweb's, **Expo Go is not currently supported**. When running your app, be sure to run a normal development build without using Expo Go.  
If the Expo CLI says "Using Expo Go" when starting the app, press `s` to switch to the development build.  
![](https://i.ibb.co/JxyZzLn/Screenshot-2024-06-24-at-12-38-57-PM.png)  
Prebuild the app (only needed once):  
```bash  
npx expo prebuild  
```  
Run the development build on ios:  
```bash  
npx expo run:ios  
```  
Run the development build on android:  
```bash  
npx expo run:android  
```
* ####  Use the \`thirdweb\` package normally  
Once all the setup above is all done, you can use the most of functionality in the `thirdweb` package out of the box, without having to do any react native specific code.  
This means that you can follow all the React documentation and expect it all to be exactly the same.  
Examples:  
```tsx  
// import thirdweb hooks, extensions, provider and wallets as usual  
import { ThirdwebProvider } from "thirdweb/react";  
import { balanceOf, claimTo } from "thirdweb/extensions/erc721";  
import { inAppWallet } from "thirdweb/wallets/in-app";  
```
## ADDRESS\_ZERO

 The zero address in Ethereum, represented as a hexadecimal string.

`let ADDRESS_ZERO: "0x0000000000000000000000000000000000000000";

`
## AcceptOfferParams

`type AcceptOfferParams = GeneratedAcceptOfferParams;

`
## Connect Users to your Ecosystem

Ecosystem wallets inherit all the functionality of [in-app wallets](https://portal.thirdweb.com/react/v5/in-app-wallet/get-started), but instead of being scoped to a single app, they can be used across multiple applications.

Head over to the [thirdweb dashboard](https://thirdweb.com/team) to create an ecosystem and obtain your ecosystem id.

### Available auth methods

* Email
* Phone
* Passkey
* Guest
* Wallet
* Google
* Apple
* Facebook
* X
* Discord
* Telegram
* Twitch
* Farcaster
* Github
* Line
* Coinbase
* Steam
* Backend

### Live Playground

Try out ecosystem wallets for yourself in the [in-app wallet live playground](https://playground.thirdweb.com/connect/in-app-wallet/ecosystem)

### Configure ecosystem wallets

The only difference with in-app wallets is how you create an ecosystem wallet using the `ecosystemWallet()` function and passing your ecosystem id.

```tsx
import { ecosystemWallet } from "thirdweb/wallets";
 
const wallet = ecosystemWallet("ecosystem.your-ecosystem-id");
```

### Configuring auth strategies

You can configure the allowed auth strategies on [your dashboard](https://thirdweb.com/team/~/~/ecosystem).

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fsocial-config.74389cb5.png&w=3840&q=75)

For prebuilt UIs, the enabled auth strategies are automatically read from your dashbaord configurations.

For custom UIs, you can configure the auth options when connecting the wallet. See [using your own UI](#using-your-own-ui) for an example.

#### Using disabled auth strategies

Note that while you're allowed to pass any auth strategy today, we recommend only passing the strategies that are enabled on your dashboard. We might enforce this in the future.

### Passing a partner ID

For closed ecosystems, you can invite partners to your ecosystem. Partners will have to pass a valid `partnerId` to the `ecosystemWallet()` function in order to connect to your ecosystem.

```tsx
const wallet = ecosystemWallet("ecosystem.your-ecosystem-id", {
  partnerId: "your-partner-id",
});
```

For more information, refer to the [ecosystemWallet API reference](https://portal.thirdweb.com/references/typescript/v5/ecosystemWallet).

### Using ecosystem wallets

Refer to the [in-app wallets](https://portal.thirdweb.com/react/v5/in-app-wallet/get-started) documentation to add your ecosystem wallet to the connect UI components or build your own UI.
## AddressInput

`type AddressInput = string;

`
## Address

`` type Address = `0x${string}`;

 ``
## BASENAME\_RESOLVER\_ADDRESS

`let BASENAME_RESOLVER_ADDRESS: "0xC6d566A56A1aFf6508b41f6c90ff131615583BCD";

`
## BASE\_SEPOLIA\_BASENAME\_RESOLVER\_ADDRESS

`let BASE_SEPOLIA_BASENAME_RESOLVER_ADDRESS: "0x6533C94869D28fAA8dF77cc63f9e2b2D6Cf77eBA";

`
## BoolToBytesOpts

`type BoolToBytesOpts = ox__Bytes.fromBoolean.Options;

`
## BoolToHexOpts

`type BoolToHexOpts = ox__Hex.fromBoolean.Options;

`
## BytesToBoolOpts

`type BytesToBoolOpts = ox__Bytes.toBoolean.Options;

`
## BytesToNumberOpts

`type BytesToNumberOpts = [BytesToBigIntOpts](https://portal.thirdweb.com/references/typescript/v5/BytesToBigIntOpts);

`
## BytesToStringOpts

`type BytesToStringOpts = ox__Bytes.toString.Options;

`
## Chain

`type Chain = Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## ConnectionManager

`type ConnectionManager = ReturnType<typeof createConnectionManager>;

`
## ConnectionStatus

`type ConnectionStatus =

| "connected"

| "disconnected"

| "connecting"

| "unknown";

`
## CoreType

`type CoreType = "ERC20" | "ERC721" | "ERC1155";

`
## DeepLinkSupportedWalletCreationOptions

`type DeepLinkSupportedWalletCreationOptions =

| { preferDeepLink?: boolean }

| undefined;

`
## DEFAULT\_ACCOUNT\_FACTORY\_V0\_6

`let DEFAULT_ACCOUNT_FACTORY_V0_6: "0x85e23b94e7F5E9cC1fF78BCe78cfb15B81f0DF00";

`
## DEFAULT\_ACCOUNT\_FACTORY\_V0\_7

`let DEFAULT_ACCOUNT_FACTORY_V0_7: "0x4be0ddfebca9a5a4a617dee4dece99e7c862dceb";

`
## DeployPackContractOptions

`type DeployPackContractOptions = Prettify<

ClientAndChainAndAccount & { params: [PackContractParams](https://portal.thirdweb.com/references/typescript/v5/PackContractParams) }

>;

`
## DeploySplitContractOptions

`type DeploySplitContractOptions = Prettify<

ClientAndChainAndAccount & { params: [SplitContractParams](https://portal.thirdweb.com/references/typescript/v5/SplitContractParams) }

>;

`
## DepositParams

`type DepositParams = { amount: string } | { amountWei: bigint };

`
## DownloadOptions

`type DownloadOptions = Prettify<

[ResolveSchemeOptions](https://portal.thirdweb.com/references/typescript/v5/ResolveSchemeOptions) & { requestTimeoutMs?: number }

>;

`
## ENTRYPOINT\_ADDRESS\_v0\_6

`let ENTRYPOINT_ADDRESS_v0_6: "0x5FF137D4b0FDCD49DcA30c7CF57E578a026d2789";

`
## ENTRYPOINT\_ADDRESS\_v0\_7

`let ENTRYPOINT_ADDRESS_v0_7: "0x0000000071727De22E5E9d8BAf0edAc6f37da032";

`
## ERC1155ContractType

`type ERC1155ContractType = "DropERC1155" | "TokenERC1155";

`
## ERC20ContractType

`type ERC20ContractType = "DropERC20" | "TokenERC20";

`
## ERC721ContractType

`type ERC721ContractType =

| "DropERC721"

| "TokenERC721"

| "OpenEditionERC721"

| "LoyaltyCard";

`
## ERC7579Config

`type ERC7579Config = [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions) & {

factoryAddress: string;

validatorAddress: string;

};

`
## EcosystemWalletConnectionOptions

`type EcosystemWalletConnectionOptions = [InAppWalletConnectionOptions](https://portal.thirdweb.com/references/typescript/v5/InAppWalletConnectionOptions);

`
## EcosystemWalletAutoConnectOptions

`type EcosystemWalletAutoConnectOptions =

[InAppWalletAutoConnectOptions](https://portal.thirdweb.com/references/typescript/v5/InAppWalletAutoConnectOptions);

`
## EstimateGasResult

`type EstimateGasResult = bigint;

`
## FetchDeployMetadataResult

`type FetchDeployMetadataResult = Partial<[ExtendedMetadata](https://portal.thirdweb.com/references/typescript/v5/ExtendedMetadata)> &

CompilerMetadata;

`
## GetActiveClaimConditionParams

`type GetActiveClaimConditionParams = GetActiveClaimConditionIdParams;

`
## GetAuctionParams

`type GetAuctionParams = GetAuction.GetAuctionParams;

`
## GetCapabilitiesResult

`type GetCapabilitiesResult = Prettify<

[WalletCapabilitiesRecord](https://portal.thirdweb.com/references/typescript/v5/WalletCapabilitiesRecord)<[WalletCapabilities](https://portal.thirdweb.com/references/typescript/v5/WalletCapabilities), number>

>;

`
## GetListingParams

`type GetListingParams = GetListing.GetListingParams;

`
## GetNFTParams

 Parameters for getting an NFT.

`type GetNFTParams = Prettify<

[TokenURIParams](https://portal.thirdweb.com/references/typescript/v5/TokenURIParams) & { includeOwner?: boolean; tokenByIndex?: boolean }

>;

`
## GetOfferParams

`type GetOfferParams = GetOfferParamsGenerated;

`
## GetOwnedNFTsParams

 Parameters for retrieving NFTs.

`type GetOwnedNFTsParams = [GetOwnedTokenIdsParams](https://portal.thirdweb.com/references/typescript/v5/GetOwnedTokenIdsParams);

`
## GetOwnedTokenIdsParams

`type GetOwnedTokenIdsParams = [BalanceOfParams](https://portal.thirdweb.com/references/typescript/v5/BalanceOfParams);

`
## GetOwnedNFTsParams

`type GetOwnedNFTsParams = [GetOwnedTokenIdsParams](https://portal.thirdweb.com/references/typescript/v5/GetOwnedTokenIdsParams);

`
## GetWinningBidParams

`type GetWinningBidParams = GetWinningBid.GetWinningBidParams;

`
## Hex

`type Hex = ox__Hex.Hex;

`
## HexToBigIntOpts

`type HexToBigIntOpts = ox__Hex.toBigInt.Options;

`
## HexToBoolOpts

`type HexToBoolOpts = ox__Hex.toBoolean.Options;

`
## HexToBytesOpts

`type HexToBytesOpts = ox__Bytes.fromHex.Options;

`
## HexToNumberOpts

`type HexToNumberOpts = [HexToBigIntOpts](https://portal.thirdweb.com/references/typescript/v5/HexToBigIntOpts);

`
## HexToStringOpts

`type HexToStringOpts = ox__Hex.toString.Options;

`
## HexToUint8ArrayOpts

`type HexToUint8ArrayOpts = ox__Hex.toBytes.Options;

`
## ID\_REGISTRY\_ADDRESS

`let ID_REGISTRY_ADDRESS: "0x00000000Fc6c5F01Fc30151999387Bb99A9f489b";

`
## InAppWalletAuth

`type InAppWalletAuth = AuthOption;

`
## InAppWalletSocialAuth

`type InAppWalletSocialAuth = SocialAuthOption;

`
## IsHexOptions

`type IsHexOptions = ox__Hex.assert.Options;

`
## LENS\_COLLECT\_NFT\_ADDRESS\_TESTNET

`let LENS_COLLECT_NFT_ADDRESS_TESTNET: "0x0c2a7761E2971D906338F5da1ecF0027E4247fd7";

`
## KEY\_GATEWAY\_ADDRESS

`let KEY_GATEWAY_ADDRESS: "0x00000000fC56947c7E7183f8Ca4B62398CaAdf0B";

`
## LENS\_COLLECT\_NFT\_ADDRESS

`let LENS_COLLECT_NFT_ADDRESS: "0x0c2a7761E2971D906338F5da1ecF0027E4247fd7";

`
## LENS\_FOLLOW\_NFT\_ADDRESS

`let LENS_FOLLOW_NFT_ADDRESS: "0x288715E67B7b184fD299143280CA6c1Eb7F31e1B";

`
## LENS\_FOLLOW\_NFT\_ADDRESS\_TESTNET

`let LENS_FOLLOW_NFT_ADDRESS_TESTNET: "0x288715E67B7b184fD299143280CA6c1Eb7F31e1B";

`
## LENS\_HANDLE\_ADDRESS

`let LENS_HANDLE_ADDRESS: "0xe7E7EaD361f3AaCD73A61A9bD6C10cA17F38E945";

`
## LENS\_HUB\_ADDRESS

 List of Lens's contracts on both polygon mainnet and polygon amoy testnet Update to the latest data here: https://www.lens.xyz/docs/resources/smart-contracts

 In our Lens extensions we will default to using these hard-coded values on mainnet to simplify the code for users, however they can override anytime

`let LENS_HUB_ADDRESS: "0xDb46d1Dc155634FbC732f92E853b10B288AD5a1d";

`
## LENS\_HANDLE\_ADDRESS\_TESTNET

`let LENS_HANDLE_ADDRESS_TESTNET: "0xe7E7EaD361f3AaCD73A61A9bD6C10cA17F38E945";

`
## LENS\_HUB\_ADDRESS\_TESTNET

`let LENS_HUB_ADDRESS_TESTNET: "0xDb46d1Dc155634FbC732f92E853b10B288AD5a1d";

`
## LENS\_MODULE\_REGISTRY\_ADDRESS

`let LENS_MODULE_REGISTRY_ADDRESS: "0x1eD5983F0c883B96f7C35528a1e22EEA67DE3Ff9";

`
## LENS\_MODULE\_REGISTRY\_ADDRESS\_TESTNET

`let LENS_MODULE_REGISTRY_ADDRESS_TESTNET: "0x1eD5983F0c883B96f7C35528a1e22EEA67DE3Ff9";

`
## LENS\_TOKEN\_HANDLE\_REGISTRY\_ADDRESS

`let LENS_TOKEN_HANDLE_REGISTRY_ADDRESS: "0xD4F2F33680FCCb36748FA9831851643781608844";

`
## LENS\_TOKEN\_HANDLE\_REGISTRY\_ADDRESS\_TESTNET

`let LENS_TOKEN_HANDLE_REGISTRY_ADDRESS_TESTNET: "0xD4F2F33680FCCb36748FA9831851643781608844";

`
## MintAdditionalSupplyToBatchParams

`type MintAdditionalSupplyToBatchParams = WithOverrides<{

nfts: Array<[MintAdditionalSupplyToParams](https://portal.thirdweb.com/references/typescript/v5/MintAdditionalSupplyToParams)>;

}>;

`
## MintToParams

`type MintToParams = WithOverrides<{

nft: [NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput) | string;

to: string;

}>;

`
## ID\_GATEWAY\_ADDRESS

`let ID_GATEWAY_ADDRESS: "0x00000000Fc25870C6eD6b6c7E41Fb078b7656f69";

`
## MultiStepAuthArgsType

`type MultiStepAuthArgsType = MultiStepAuthProviderType & {

verificationCode: string;

};

`
## NATIVE\_TOKEN\_ADDRESS

 The address of the native token.

`let NATIVE_TOKEN_ADDRESS: "0xeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee";

`
## NumberToHexOpts

`type NumberToHexOpts = ox__Hex.fromNumber.Options;

`
## ParseErc6492SignatureReturnType

`type ParseErc6492SignatureReturnType = OneOf<

[Erc6492Signature](https://portal.thirdweb.com/references/typescript/v5/Erc6492Signature) | { signature: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex) }

>;

`
## QuoteApprovalParams

`type QuoteApprovalParams = [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ApproveParams](https://portal.thirdweb.com/references/typescript/v5/ApproveParams)>;

`
## ReleasableByTokenParams

`type ReleasableByTokenParams = [ReleasableParams](https://portal.thirdweb.com/references/typescript/v5/ReleasableParams) & {

tokenAddress: string;

};

`
## ReleaseByTokenParams

`type ReleaseByTokenParams = [ReleaseParams](https://portal.thirdweb.com/references/typescript/v5/ReleaseParams) & { tokenAddress: string };

`
## ResetClaimEligibilityParams

`type ResetClaimEligibilityParams = [GetClaimConditionsParams](https://portal.thirdweb.com/references/typescript/v5/GetClaimConditionsParams);

`
## STORAGE\_REGISTRY\_ADDRESS

`let STORAGE_REGISTRY_ADDRESS: "0x00000000fcCe7f938e7aE6D3c335bD6a1a7c593D";

`
## SIGNED\_KEY\_REQUEST\_VALIDATOR\_ADDRESS

`let SIGNED_KEY_REQUEST_VALIDATOR_ADDRESS: "0x00000000FC700472606ED4fA22623Acf62c60553";

`
## SendCallsResult

`type SendCallsResult = [WalletSendCallsId](https://portal.thirdweb.com/references/typescript/v5/WalletSendCallsId);

`
## SetContractURIParams

 Represents the parameters for the "setContractURI" function.

`type SetContractURIParams = WithOverrides<{

uri: AbiParameterToPrimitiveType<{ name: "_uri"; type: "string" }>;

}>;

`
## SetContractMetadataParams

`type SetContractMetadataParams = Record<string, unknown>;

`
## SignedAuthorization

 Represents a signed EIP-7702 authorization object.

`type SignedAuthorization = ox__Authorization.ListSigned[number];

`
## SupportedTokens

`type SupportedTokens = Record<number, Array<[TokenInfo](https://portal.thirdweb.com/references/typescript/v5/TokenInfo)>>;

`
## StringToHexOpts

`type StringToHexOpts = ox__Hex.fromString.Options;

`
## TokenMintParams

`type TokenMintParams = { to: string } & (

| { quantity: string }

| { quantityWei: bigint }

);

`
## TokenPaymaster

`let TokenPaymaster: Record<PAYMASTERS, TokenPaymasterConfig>;

`
## UD\_POLYGON\_MAINNET

`let UD_POLYGON_MAINNET: "0xa9a6A3626993D487d2Dbda3173cf58cA1a9D9e9f";

`
## Uint8ArrayToHexOpts

`type Uint8ArrayToHexOpts = ox__Hex.fromBoolean.Options;

`
## UploadMobileOptions

`type UploadMobileOptions = InternalUploadMobileOptions & {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

};

`
## UploadMetadataParams

`type UploadMetadataParams = CommonUploadMetadataParams;

`
## UploadOptions

`type UploadOptions<TFiles extends Array<UploadableFile>> =

InternalUploadOptions<TFiles> & { client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient) };

`
## VerifySignatureParams

`type VerifySignatureParams = Prettify<

[VerifyEOASignatureParams](https://portal.thirdweb.com/references/typescript/v5/VerifyEOASignatureParams) &

Partial<[VerifyContractWalletSignatureParams](https://portal.thirdweb.com/references/typescript/v5/VerifyContractWalletSignatureParams)>

>;

`
## WalletCapabilities

`type WalletCapabilities = {};

`
## WalletConnectClient

`type WalletConnectClient = Awaited<

ReturnType<typeof SignClient.init>

>;

`
## WalletEmitter

`type WalletEmitter<TWalletId extends [WalletId](https://portal.thirdweb.com/references/typescript/v5/WalletId)> = Emitter<

[WalletEmitterEvents](https://portal.thirdweb.com/references/typescript/v5/WalletEmitterEvents)<TWalletId>

>;

`
## WalletSendCallsId

`type WalletSendCallsId = string;

`
## WalletUser

`type WalletUser = UserStatus;

`
## abstract

`let abstract: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## abstractTestnet

`let abstractTestnet: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## anvil

`let anvil: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## arbitrum

`let arbitrum: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## arbitrumSepolia

`let arbitrumSepolia: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## arbitrumNova

`let arbitrumNova: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## assetChainTestnet

`let assetChainTestnet: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## astriaEvmDusknet

`let astriaEvmDusknet: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## avalanche

`let avalanche: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## avalancheFuji

`let avalancheFuji: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## baseSepolia

`let baseSepolia: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## base

`let base: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## blast

`let blast: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## blastSepolia

`let blastSepolia: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## bsc

`let bsc: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## bscTestnet

`let bscTestnet: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## celo

`let celo: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## celoAlfajoresTestnet

`let celoAlfajoresTestnet: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## cronos

`let cronos: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## defaultTokens

 Default tokens shown in [ConnectButton](https://portal.thirdweb.com/react/v4/components/ConnectButton) 's SendFunds screen for each network.

 You can use the default tokens as a starting point for your own list of tokens and override tokens for specific networks.

`let defaultTokens: [SupportedTokens](https://portal.thirdweb.com/references/typescript/v5/SupportedTokens);

`
## degen

`let degen: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## ethereum

`let ethereum: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## fantom

`let fantom: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## fantomTestnet

`let fantomTestnet: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## fraxtalTestnet

`let fraxtalTestnet: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## frameTestnet

`let frameTestnet: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## gnosisChiadoTestnet

`let gnosisChiadoTestnet: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## gnosis

`let gnosis: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## godWoken

`let godWoken: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## godWokenTestnetV1

`let godWokenTestnetV1: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## hardhat

`let hardhat: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## hokumTestnet

`let hokumTestnet: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## linea

`let linea: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## lineaSepolia

`let lineaSepolia: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## localhost

`let localhost: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## loot

`let loot: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## mantaPacific

`let mantaPacific: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## mainnet

`let mainnet: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## mantaPacificTestnet

`let mantaPacificTestnet: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## maxUint256

`let maxUint256: bigint;

`
## metalL2Testnet

`let metalL2Testnet: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## mode

`let mode: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## modeTestnet

`let modeTestnet: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## moonbeam

`let moonbeam: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## mumbai

`let mumbai: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## optimism

`let optimism: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## optimismSepolia

`let optimismSepolia: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## palm

`let palm: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## palmTestnet

`let palmTestnet: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## polygon

`let polygon: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## polygonAmoy

`let polygonAmoy: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## polygonMumbai

`let polygonMumbai: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## polygonZkEvmTestnet

`let polygonZkEvmTestnet: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## polygonZkEvm

`let polygonZkEvm: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## rari

`let rari: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## rariTestnet

`let rariTestnet: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## scrollAlphaTestnet

`let scrollAlphaTestnet: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## scroll

`let scroll: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## scrollSepoliaTestnet

`let scrollSepoliaTestnet: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## sepolia

`let sepolia: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## soneiumMinato

`let soneiumMinato: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## treasure

`let treasure: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## treasureTopaz

`let treasureTopaz: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## zkCandySepolia

`let zkCandySepolia: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## xaiSepolia

`let xaiSepolia: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## zkSync

`let zkSync: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## xai

`let xai: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## zkSyncSepolia

`let zkSyncSepolia: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## zora

`let zora: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## TypeScript SDK Reference
## zoraSepolia

`let zoraSepolia: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`
## Batching transactions

Batching transactions allows sending multiple transactions in a single user operation. This can be useful to save on fees, reduce number of user confimations or to ensure that multiple transactions are executed atomically.

A typical example is to do an approval and a transfer in a single userOperation. This way, the transfer will only happen if the approval is successful.

```tsx
import { smartWallet } from "thirdweb/wallets";
import { sendBatchTransaction } from "thirdweb";
import { approve, transferFrom } from "thirdweb/extensions/erc20";
 
const smartWallet = new smartWallet(config);
const smartAccount = await smartWallet.connect({
  client,
  personalAccount,
});
 
const transactions = [
  approve({
    contract,
    spender: "0x...",
    value: 100,
  }),
  transferFrom({
    contract,
    from: "0x...",
    to: "0x...",
    amount: 100,
  }),
];
 
await sendBatchTransaction({
  transactions,
  account: smartAccount,
});
```
## Account Permissions & Session Keys

All of the account contracts - [Simple](https://thirdweb.com/thirdweb.eth/AccountFactory) and [Managed](https://thirdweb.com/thirdweb.eth/ManagedAccountFactory) \- share the same permission model. In this section, we'll describe this permission model in detail.

An account recognizes only two types of actors: _Session Keys_ and _Admins_.

### 1\. Admins

Admins have **unrestricted access** to the account; call any functions on the contract, use the contract without going through the ERC-4337 infrastructure (bundlers, EntryPoint, etc.), withdraw the account's native token balance, and so on.

#### Assigning Admin Permissions

Existing admins on the account can add new admins, remove existing admins or renounce their own admin status.

```typescript
import { addAdmin } from "thirdweb/extensions/erc4337";
import { smartWallet } from "thirdweb/wallets";
import { sendTransaction, getContract } from "thirdweb";
 
const smartWallet = new smartWallet(config);
const smartAccount = await smartWallet.connect({
  client,
  personalAccount,
});
 
const transaction = addAdmin({
  contract: getContract({
    address: smartAccount.address,
    chain,
    client,
  }),
  account: smartAccount,
  adminAddress: "0x...", // the address of the new admin
});
await sendTransaction({
  transaction,
  account: smartAccount,
});
```

### 2\. Session Keys

Session Keys are additional authorized signers that must go through ERC-4337 infrastructure (bundlers, EntryPoint, etc.) to use an account to execute transactions. Session keys can use an account under certain restrictions.

#### Assigning Session Key Permissions

Each individual session key has its own permissions to use the account. Only admins can set the permissions for session keys.

Session keys can be assigned the following permissions:

* \[Required\] Allow interaction with specific contracts with the account ("\*" for any contracts)
* \[Optional\] Have a maximum amount of native tokens that can be transferred per transaction (defaults to 0 eth, transactions with value will be rejected)
* \[Optional\] Have access to the account only during a specific time window (defaults to 10 years from now)

```ts
import { addAdmin } from "thirdweb/extensions/erc4337";
import { smartWallet } from "thirdweb/wallets";
import { sendTransaction, getContract } from "thirdweb";
 
const smartWallet = new smartWallet(config);
const smartAccount = await smartWallet.connect({
  client,
  personalAccount,
});
 
const transaction = addSessionKey({
  contract: getContract({
    address: smartAccount.address,
    chain,
    client,
  }),
  account: smartAccount,
  sessionKeyAddress: "0x...", // the address of the new session key
  permissions: {
    approvedTargets: "*", // the addresses of allowed contracts, or '*' for any contract
    nativeTokenLimitPerTransaction: 0.1, // the maximum amount of native token (in ETH) that the session key can spend per transaction
    permissionStartTimestamp: new Date(), // the date when the session key becomes active
    permissionEndTimestamp: new Date(
      Date.now() + 24 * 60 * 60 * 1000,
    ), // the date when the session key expires
  },
});
await sendTransaction({
  transaction,
  account: smartAccount,
});
```
## Using Account abstraction in Typescript

By using the [TypeScript SDK](https://portal.thirdweb.com/typescript/v5), you can use smart accounts in your applications easily.

### Example Use Cases

The wallet SDK with the TypeScript SDK is primarily used when creating a backend for your application or when creating a node script. In this guide, we will be using the wallet SDK to create a Node script but the logic for creating a backend is the same.

If you are working in a React environment, you are recommended to follow [this guide](https://portal.thirdweb.com/connect/account-abstraction/guides/react).

* #### Create an API key  
To use the bundler and paymaster, you must create an API key and a billing account.  
To create an API Key:  
   * Head to the settings page in the dashboard and click the **API Keys** tab.  
   * Click on **Create API Key**.  
   * Follow the steps to create your API key.  
To use account abstraction infrastructure on mainnet you will also need to [create an account and add a payment method](https://thirdweb.com/team/~/~/settings/billing).
* #### Create a Node Script  
To use smart accounts in a node script, simply create a new Node.js project and install the `thirdweb` package.  
```bash  
npm i thirdweb  
```  
Create a `.env` file and add the following:  
```bash  
THIRDWEB_SECRET_KEY=<YOUR_SECRET_KEY>  
PRIVATE_KEY=<A_TEST_WALLET_PRIVATE_KEY>  
```  
Create an `index.ts` file where we'll write our script.
* #### Creating the Personal Wallet Key  
This smart account is unlocked by a 'key' - a personal wallet. This key can be anything from a MetaMask wallet or an In-App Wallet or just a private key and is used as a way to 'sign in' to the smart account.  
To create a personal wallet key, we are going to use the [privateKeyAccount](https://portal.thirdweb.com/references/typescript/v5/privateKeyAccount), which we need to import from the `thirdweb/wallets` package.  
```typescript  
import { createThirdwebClient } from "thirdweb";  
import { privateKeyAccount } from "thirdweb/wallets";  
   
const client = createThirdwebClient({  
  secretKey: process.env.THIRDWEB_SECRET_KEY as string,  
});  
   
const personalAccount = privateKeyAccount({  
  client,  
  privateKey: process.env.PRIVATE_KEY as string,  
});  
console.log("Personal account address:", personalAccount.address);  
```
* #### Creating the Smart account  
Now, let's create a smart account using `smartWallet` from `thirdweb/wallets` package. To do this, we need to pass an object of type [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions) to the function.  
Some of the important properties in this object are:  
   * `chain`: the chain that the smart account will be deployed on.  
   * `sponsorGas`: whether the smart account should have sponsored transactions or not.  
Once we have created the smart wallet interface, we can connect the personal wallet to the smart account using the `connect` method.  
```typescript  
import { smartWallet } from "thirdweb/wallets";  
   
// Configure the smart wallet  
const wallet = smartWallet({  
  chain: sepolia,  
  sponsorGas: true,  
});  
   
// Connect the smart wallet  
const smartAccount = await wallet.connect({  
  client,  
  personalAccount,  
});  
```
* #### Using the Smart Account  
Now that we have created a smart account object and connected it, we can use it to perform onchain actions gaslessly.  
In this example, we will claim a NFT using the `claimTo` method and then send the transaction using the `sendTransaction` method.  
```typescript  
const balance = await getWalletBalance({  
  client,  
  chain,  
  address: smartAccount.address,  
});  
console.log("Smart account balance:", balance.displayValue);  
   
const contract = getContract({  
  client,  
  chain: sepolia,  
  address: "0x...", // deploy a drop contract from thirdweb.com/explore  
});  
   
const transaction = await claimTo({  
  contract,  
  to: smartAccount.address,  
  quantity: 1,  
});  
const { transactionHash } = await sendTransaction({  
  transaction,  
  smartAccount,  
});  
console.log(`Minted NFT with transaction hash: ${transactionHash}`);  
```  
We have also passed our `secretKey` to the SDK so that we can use the bundler and paymaster.  
We have also added some helpful logs to view the smart account address and balance using the associated `balance` and `getAddress` methods.
* #### Run the Script  
To run the script, run the following command:  
```bash  
bun index.ts  
```  
As you can see in the terminal output, upon claiming the token, the smart account is deployed. This is because smart account contracts are deployed when the first transaction is initiated.  
We have successfully deployed a smart account and claimed an ERC20 token!
* #### Conclusion  
In this guide, we have learned how to use the wallet SDK with the TypeScript SDK to create a smart account and claim an NFT.
## Chain

The thirdweb SDK works with **any EVM chain**.

All you need to connect a chain is its chain id. RPC connection to the chain is handled for you.

```ts
import { defineChain } from "thirdweb";
 
const myChain = defineChain(myChainId);
```

The SDK comes with predefined popular chains like `base`, `polygon`, and more exported from the `thirdweb/chains` entrypoint.

```ts
import { polygon } from "thirdweb/chains";
 
const myChain = polygon;
```

#### Configuring chains (Advanced)

You can also configure chains with custom RPC endpoints, native currency, block explorers, and more.

```ts
const myChain = defineChain({
  id: myChainId,
  rpc: "https://my-custom-rpc.com",
  ...
})
```
## Adapters

The thirdweb SDK can work side by side with:

* any wallet that supports EIP1193
* ethers.js v5
* ethers.js v6
* viem
* older versions of the @thirdweb-dev/sdk (using the ethers.js v5 adapter)

Adapters allow you to use contracts, providers and wallets from these libraries with the thirdweb SDK and vice versa.

### EIP1193

You can use any wallet that supports EIP1193 with the thirdweb SDK by converting it using `EIP1193.fromProvider`:

```ts
import { EIP1193 } from "thirdweb/wallets";
 
// Create a Thirdweb wallet from a EIP1193 provider
const wallet = EIP1193.fromProvider({
  provider: yourProvider, // any EIP1193 provider
});
 
// Use like any other Thirdweb wallet
const account = await wallet.connect({
  client: createThirdwebClient({ clientId: "..." }),
});
 
// Sign messages
await account.signMessage({ message: "Hello World" });
```

You can also convert a thirdweb account to an EIP1193 provider using `EIP1193.toProvider`, which can then be used with other libraries:

```ts
import { EIP1193 } from "thirdweb/wallets";
 
// Create an EIP-1193 provider from a Thirdweb wallet
const provider = EIP1193.toProvider({
  wallet,
  chain: ethereum,
  client: createThirdwebClient({ clientId: "..." }),
});
 
// Use with any EIP-1193 compatible library
const accounts = await provider.request({
  method: "eth_requestAccounts",
});
```

### viem

You can use an existing wallet client from viem with the thirdweb SDK by converting it using the `viemAdapter`:

```ts
import { viemAdapter } from "thirdweb/adapters/viem";
 
// convert a viem wallet client to a thirdweb wallet
const walletClient = createWalletClient(...);
const thirdwebWallet = await viemAdapter.wallet.fromViem({
  walletClient,
});
 
 
// convert a thirdweb account to viem wallet client
const viemClientWallet = viemAdapter.wallet.toViem({
  client,
  chain,
  wallet,
});
```

You can also convert viem public clients and contracts from and to the thirdweb SDK.

View the [viemAdapter](https://portal.thirdweb.com/references/typescript/v5/viemAdapter) reference for more details.

### Ethers v6

You can use an existing ethers.js v6 Signer with the thirdweb SDK by converting it using the `ethers6Adapter`:

```ts
import { ethers6Adapter } from "thirdweb/adapters/ethers6";
import { sendTransaction } from "thirdweb";
 
// convert a ethers signer
const signer: ethers.Signer = ...;
const account = await ethers6Adapter.signer.fromEthers({
  signer,
});
 
// use it with the thirdweb SDK
await sendTransaction({
  transaction,
  account,
});
```

Similarly, you can use any wallets created with the thirdweb SDK with ethers.js v6 by converting them using the `ethers6Adapter`:

```ts
import { ethers6Adapter } from "thirdweb/adapters/ethers6";
import { createThirdwebClient, inAppWallet } from "thirdweb/wallets";
import { sepolia } from "thirdweb/chains";
 
const client = createThirdwebClient({ clientId });
const wallet = inAppWallet();
const chain = sepolia;
const account = await wallet.connect({
  client,
  strategy: "google",
});
 
// convert a thirdweb account to ethers signer
const ethersSigner = await ethers6Adapter.signer.toEthers({
  client,
  chain,
  account,
});
```

You can also convert ethers.js providers and contracts from and to the thirdweb SDK.

View the [ethers6Adapter](https://portal.thirdweb.com/references/typescript/v5/ethers6Adapter) reference for more details.

### Ethers v5

You can use an existing ethers.js v5 Signer with the thirdweb SDK by converting it using the `ethers5Adapter`:

```ts
import { ethers5Adapter } from "thirdweb/adapters/ethers5";
 
// convert an ethers signer to a thirdweb account
const signer: ethers.Signer = ...;
const account = await ethers5Adapter.signer.fromEthers({
  signer,
});
 
// convert a thirdweb account to ethers signer
const ethersSigner = await ethers5Adapter.signer.toEthers({
  client,
  chain,
  account
});
```

You can also convert ethers.js providers and contracts from and to the thirdweb SDK.

View the [ethers5Adapter](https://portal.thirdweb.com/references/typescript/v5/ethers5Adapter) reference for more details.
## Auth

Using [EIP-4361](https://eips.ethereum.org/EIPS/eip-4361) (Sign in with Ethererum) standard, you can authenticate users to your backend using only their wallet. This is a secure and easy way to authenticate users without requiring them to create an additional account.

### Usage

#### Client Functions

#### Auth with React

If you're using React, Auth integrates directly with our built-in[ConnectButton component](https://portal.thirdweb.com/react/v5/ConnectButton). This handles things like caching, error handling, and retries for you.

```ts
import { signLoginPayload } from 'thirdweb/auth';
 
// 1. fetch a login payload from your server
const result = await fetch(...);
const loginPayload = await result.json();
 
// 2. sign the login payload with the user's account
const signature = await signLoginPayload({ payload: loginPayload, account });
 
// 3. send the login payload and signature to your server
const result = await fetch(...);
const verifiedPayload = await result.json();
```

How you store and maintain a user session is up to you, but our recommended approach is to store a JWT token in a cookie that is verified on the server. The server functions below include utility functions to generate and verify the JWT.

In order to generate and verify the JWT you will also need an EOA private key. This private key's wallet does not need to hold any funds, it is only used for signing.

#### Server Functions

```ts
import { createThirdwebClient } from "thirdweb";
import { createAuth } from "thirdweb/auth";
import { privateKeyToAccount } from "thirdweb/wallets";
 
const privateKey = process.env.THIRDWEB_PRIVATE_KEY;
const thirdwebClient = createThirdwebClient({
	secretKey: process.env.THIRDWEB_SECRET_KEY;
});
 
const auth = createAuth({
	domain: "localhost:3000",
	client: thirdwebClient,
	adminAccount: privateKeyToAccount({client, privateKey})
});
 
// 1. generate a login payload for a client on the server side
const loginPayload = await auth.generatePayload({ address: "0x123..." });
 
// 2. send the login payload to the client to sign
 
// 3. verify the login payload and signature that the client sends back later
const verifiedPayload = await auth.verifyPayload({
	payload: loginPayload,
	signature: "0x123...",
});
 
// 4. generate a JWT for the client
const jwt = await auth.generateJWT({ payload: verifiedPayload });
 
// 5. set the JWT as a cookie or otherwise provide it to the client
 
// 6. authenticate the client based on the JWT on subsequent calls
const { valid, parsedJWT } = await auth.verifyJWT({ jwt });
```

### Example Repos

Auth + Next.js

A working example of Auth + Next.js

[GitHubView on GitHub](https://github.com/thirdweb-example/thirdweb-auth-next)

Auth + Express

A working example of a React + Express app using Auth

[GitHubView on GitHub](https://github.com/thirdweb-example/thirdweb-auth-express)
## Client

A client is the entry point to the thirdweb SDK. It is required for all other actions.

#### Client ID

You must provide a `clientId` or `secretKey` in order to initialize a client.

You can create a client ID for free at[thirdweb.com/create-api-key](https://thirdweb.com/create-api-key).

### Create a client

##### For "client-side" usage

```ts
import { createThirdwebClient } from "thirdweb";
 
const client = createThirdwebClient({
  clientId: "<your_client_id>",
});
```

##### For "server-side" usage

```ts
import { createThirdwebClient } from "thirdweb";
 
const client = createThirdwebClient({
  secretKey: "<your_secret_key>",
});
```

You will need to pass this client to other methods in the SDK. This will allow you to

* get performant RPC to all chains
* download/upload to IPFS
* access Account Abstraction infrastructure (bundler, paymaster)
* access other thirdweb services

#### Getting your RPC URL

If you need to access the raw RPC URL, just use thirdweb's default RPC format with your client ID `https://<chainId>.rpc.thirdweb.com/<clientId>`.
## Connecting Wallets

The SDK supports 500+ wallets out of the box, all you need to pass is their id.

These wallets include thirdweb's first-party wallets like Smart Wallet and In-App Wallet, as well as other popular wallet extensions/mobile apps.

Refer to [createWallet](https://portal.thirdweb.com/references/typescript/v5/createWallet) and [injectedProvider](https://portal.thirdweb.com/references/typescript/v5/injectedProvider) for more information.

```tsx
import { createThirdwebClient } from "thirdweb";
import { createWallet, injectedProvider } from "thirdweb/wallets";
 
const client = createThirdwebClient({ clientId });
 
const metamask = createWallet("io.metamask"); // pass the wallet id
 
// if user has metamask installed, connect to it
if (injectedProvider("io.metamask")) {
  await metamask.connect({ client });
}
 
// open wallet connect modal so user can scan the QR code and connect
else {
  await metamask.connect({
    client,
    walletConnect: { showQrModal: true },
  });
}
```
## Connect Users to your Ecosystem

Ecosystem wallets inherit all the functionality of [in-app wallets](https://portal.thirdweb.com/references/typescript/v5/in-app-wallet), but instead of being scoped to a single app, they can be used across multiple applications.

Head over to the [thirdweb dashboard](https://thirdweb.com/team) to create an ecosystem and obtain your ecosystem id.

### Available auth methods

* Email
* Phone
* Passkey
* Guest
* Wallet
* Google
* Apple
* Facebook
* X
* Discord
* Telegram
* Twitch
* Farcaster
* Github
* Line
* Coinbase
* Steam
* Backend

### Live Playground

Try out ecosystem wallets for yourself in the [in-app wallet live playground](https://playground.thirdweb.com/connect/in-app-wallet/ecosystem)

### Configure ecosystem wallets

The only difference with in-app wallets is how you create an ecosystem wallet using the `ecosystemWallet()` function and passing your ecosystem id.

```tsx
import { ecosystemWallet } from "thirdweb/wallets";
 
const wallet = ecosystemWallet("ecosystem.your-ecosystem-id");
```

### Configuring auth strategies

You can configure the allowed auth strategies on [your dashboard](https://thirdweb.com/team/~/~/ecosystem).

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fsocial-config.74389cb5.png&w=3840&q=75)

For prebuilt UIs, the enabled auth strategies are automatically read from your dashbaord configurations.

For custom UIs, you can configure the auth options when connecting the wallet. See [using your own UI](#using-your-own-ui) for an example.

#### Using disabled auth strategies

Note that while you're allowed to pass any auth strategy today, we recommend only passing the strategies that are enabled on your dashboard. We might enforce this in the future.

### Passing a partner ID

For closed ecosystems, you can invite partners to your ecosystem. Partners will have to pass a valid `partnerId` to the `ecosystemWallet()` function in order to connect to your ecosystem.

```tsx
const wallet = ecosystemWallet("ecosystem.your-ecosystem-id", {
  partnerId: "your-partner-id",
});
```

For more information, refer to the [ecosystemWallet API reference](https://portal.thirdweb.com/references/typescript/v5/ecosystemWallet).

### Using ecosystem wallets

Refer to the [in-app wallets](https://portal.thirdweb.com/references/typescript/v5/in-app-wallet) documentation to add your ecosystem wallet to your applications.
## Contract

A "contract" is a wrapper around a smart contract that is deployed on a chain. It is what you use to create transactions and read contract state.

```ts
import { getContract } from "thirdweb";
import { ethereum } from "thirdweb/chains";
 
// get a contract
const contract = getContract({
  // the client you have created via `createThirdwebClient()`
  client,
  // the chain the contract is deployed on
  chain: ethereum,
  // the contract's address
  address: "0x123...",
  // OPTIONAL: the contract's abi
  abi: [...],
});
```

Contracts defined this way are lightweight and can be exported as consts accross your application to read or write to it.
## Built-in extensions for common standards

The SDK comes packed with a set of built-in extensions for common standards. These extensions are designed to make it easy to interact with popular contracts and protocols. They are available as part of the SDK and can be used in your application without any additional setup.

| Standard            | Import Path                                                                                                                   | Description                    |
| ------------------- | ----------------------------------------------------------------------------------------------------------------------------- | ------------------------------ |
| EIP1193             | [thirdweb/extensions/eip1193](https://portal.thirdweb.com/references/typescript/v5/functions#eip1193)                         | EIP1193 extensions             |
| DEPLOY              | [thirdweb/extensions/deploy](https://portal.thirdweb.com/references/typescript/v5/functions#deploy)                           | DEPLOY extensions              |
| MARKETPLACE         | [thirdweb/extensions/marketplace](https://portal.thirdweb.com/references/typescript/v5/functions#marketplace)                 | MARKETPLACE extensions         |
| AIRDROP             | [thirdweb/extensions/airdrop](https://portal.thirdweb.com/references/typescript/v5/functions#airdrop)                         | AIRDROP extensions             |
| COMMON              | [thirdweb/extensions/common](https://portal.thirdweb.com/references/typescript/v5/functions#common)                           | COMMON extensions              |
| ENS                 | [thirdweb/extensions/ens](https://portal.thirdweb.com/references/typescript/v5/functions#ens)                                 | ENS extensions                 |
| ERC1155             | [thirdweb/extensions/erc1155](https://portal.thirdweb.com/references/typescript/v5/functions#erc1155)                         | ERC1155 extensions             |
| ERC721              | [thirdweb/extensions/erc721](https://portal.thirdweb.com/references/typescript/v5/functions#erc721)                           | ERC721 extensions              |
| ERC1271             | [thirdweb/extensions/erc1271](https://portal.thirdweb.com/references/typescript/v5/functions#erc1271)                         | ERC1271 extensions             |
| ERC20               | [thirdweb/extensions/erc20](https://portal.thirdweb.com/references/typescript/v5/functions#erc20)                             | ERC20 extensions               |
| ERC4337             | [thirdweb/extensions/erc4337](https://portal.thirdweb.com/references/typescript/v5/functions#erc4337)                         | ERC4337 extensions             |
| ERC4626             | [thirdweb/extensions/erc4626](https://portal.thirdweb.com/references/typescript/v5/functions#erc4626)                         | ERC4626 extensions             |
| FARCASTER           | [thirdweb/extensions/farcaster](https://portal.thirdweb.com/references/typescript/v5/functions#farcaster)                     | FARCASTER extensions           |
| LENS                | [thirdweb/extensions/lens](https://portal.thirdweb.com/references/typescript/v5/functions#lens)                               | LENS extensions                |
| MULTICALL3          | [thirdweb/extensions/multicall3](https://portal.thirdweb.com/references/typescript/v5/functions#multicall3)                   | MULTICALL3 extensions          |
| PACK                | [thirdweb/extensions/pack](https://portal.thirdweb.com/references/typescript/v5/functions#pack)                               | PACK extensions                |
| PERMISSIONS         | [thirdweb/extensions/permissions](https://portal.thirdweb.com/references/typescript/v5/functions#permissions)                 | PERMISSIONS extensions         |
| SPLIT               | [thirdweb/extensions/split](https://portal.thirdweb.com/references/typescript/v5/functions#split)                             | SPLIT extensions               |
| THIRDWEB            | [thirdweb/extensions/thirdweb](https://portal.thirdweb.com/references/typescript/v5/functions#thirdweb)                       | THIRDWEB extensions            |
| thirdweb            | [thirdweb/extensions/thirdweb](https://portal.thirdweb.com/references/typescript/v5/functions#thirdweb)                       | thirdweb extensions            |
| UNISWAP             | [thirdweb/extensions/uniswap](https://portal.thirdweb.com/references/typescript/v5/functions#uniswap)                         | UNISWAP extensions             |
| UNSTOPPABLE-DOMAINS | [thirdweb/extensions/unstoppable-domains](https://portal.thirdweb.com/references/typescript/v5/functions#unstoppable-domains) | UNSTOPPABLE-DOMAINS extensions |
| VOTE                | [thirdweb/extensions/vote](https://portal.thirdweb.com/references/typescript/v5/functions#vote)                               | VOTE extensions                |
| MODULES             | [thirdweb/extensions/modules](https://portal.thirdweb.com/references/typescript/v5/functions#modules)                         | MODULES extensions             |
| EIP5792             | [thirdweb/extensions/eip5792](https://portal.thirdweb.com/references/typescript/v5/functions#eip5792)                         | EIP5792 extensions             |

More extensions are being added regularly. Anyone can [create an extension](https://portal.thirdweb.com/typescript/v5/extensions/create) and contribute it back to the repository. You can also [generate extensions](https://portal.thirdweb.com/typescript/v5/extensions/generate) for any deployed contract.
## Writing your own extensions

You can create your own extensions. They are just regular functions that pre-define the behavior of a `prepareContractCall()` or `readContract()` function.

The goal of extensions is to add a layer of convenience to direct contract calls, either to simplify the inputs or to give richer outputs.

#### Example: Creating the `getBalance` extension for ERC20 tokens

The `erc20/getBalance` extension is a very convenient and efficient way to fetch all the information needed to display an ERC20 token balance to a user, a very common usecase for applications. Here is how it is implemented in the SDK.

```typescript
// Define your extension function
export function getBalance(
	// The base options include everything that is needed to interact with the contract, *except* the specific params for your function, in this case, "address"
	options: BaseTransactionOptions<{ address: string }>,
) {
	// The extension conveniently fetches all the relevant information from the contract to display a readable balance
	const [balanceWei, decimals_, symbol_, name_] = await Promise.all([
		balanceOf(options),
		decimals(options),
		symbol(options),
		name(options),
	]);
	return {
		value: balanceWei,
		decimals: decimals_,
		// The `toTokens` function converts the balance from wei to a human-readable format
		displayValue: toTokens(balanceWei, decimals_),
		symbol: symbol_,
		name: name_,
	};
}
```

#### Example: Creating the `mintTo` extension for ERC721 tokens

The `erc721/mintTo` extension handles uploading the NFT metadata to IPFS before minting. Here is how it is implemented in the SDK.

```typescript
import {
  prepareContractCall,
  type BaseTransactionOptions,
} from "thirdweb";
 
// Define your extension function
export function mintTo(
  // The base options include everything that is needed to interact with the contract, *except* the specific params for your function, in this case "to" and "nft"
  options: BaseTransactionOptions<{ to: string; nft: NFTMetadata }>,
) {
  return prepareContractCall({
    // Pass the contract from the options
    contract: options.contract,
    // Pre-define the function to call on the smart contract
    method: "function mintTo(address to, string uri)",
    // The function params can be async
    params: async () => {
      // Upload the metadata to IPFS
      const tokenURI = (await upload({
        client: options.contract.client,
        files: [options.nft],
      })[0]) as string;
      // return the contract params
      return [options.to, tokenURI] as const;
    },
  });
}
```
## Interacting with ENS

### Resolve an ENS name to an Ethereum address

```ts
import { resolveAddress } from "thirdweb/extensions/ens";
 
const address = await resolveAddress({
  client,
  name: "vitalik.eth",
});
 
// Expected result: "0x..."
```

### Resolve the primary name for a specified address

```ts
import { resolveName } from "thirdweb/extensions/ens";
 
const name = await resolveName({
  client,
  address: "0x1234...",
});
 
// Expected result: "something.eth"
```

### Resolve an ENS name to the avatar URL.

```ts
import { resolveAvatar } from "thirdweb/extensions/ens";
 
const address = await resolveAvatar({
  client,
  name: "vitalik.eth",
});
 
// Expected result: An URL that points to the image of the ENS
```
## Generating extensions

You can generate precompiled, optimized extensions for any deployed contract using the thirdweb CLI.

The thirdweb SDK comes with a CLI that can be run with your package manager of choice.

```bash
npx thirdweb generate <chainId>/<contract-address>
```

This will generate a new `thirdweb` directory in your own project, containing the precompiled extension for the contract at the given address.

#### Example: Generating an extension for a USDC contract on Optimism

```bash
npx thirdweb generate 10/0x0b2c639c533813f4aa9d7837caf62653d097ff85
```

This will generate the following file `thirdweb/10/0x0b2c639c533813f4aa9d7837caf62653d097ff85.ts` in your project, containing:

* Precompiled, type-safe event definitions
* Precompiled, type-safe function definitions

You can inspect the generated code, modify it, and use it in your project.

#### Example: Using a generated extension function

```typescript
import { permit } from "/thirdweb/10/0x0b2c639c533813f4aa9d7837caf62653d097ff85";
 
const contract = getContract({
	client,
	chain: optimism,
	address: USDC_ADDRESS,
});
 
// Type-safe function to do a permit transaction
const transaction = permit({
  owner: ...,
  spender: ...,
  value: ...,
  deadline: ...,
  signature: ...,
});
await sendTransaction({ transaction, account });
```

#### Example: Using a generated event

```typescript
import { transferEvent } from "/thirdweb/10/0x0b2c639c533813f4aa9d7837caf62653d097ff85";
 
const contract = getContract({
	client,
	chain: optimism,
	address: USDC_ADDRESS,
});
 
// Type-safe event listener
const events = await getContractEvents({
  contract,
  events: [
    transferEvent({
      from: ...,
      to: ...,
    })
  ],
});
```
## Interacting with Lens protocol

In Lens protocol, each profile is represented by an ERC721 token. In this particular context, the tokenId (of the ERC721 token) is the profileId. They can be used interchangably.

### Get Lens profile metadata from a profileId

```ts
import { getProfileMetadata } from "thirdweb/extensions/lens";
 
const profileData = await getProfileMetadata({ profileId, client });
 
if (profileData) {
  console.log("Display name: ", profileData.lens.name);
  console.log("Bio: ", profileData.lens.bio);
}
```

### Get the owner's wallet address from their Lens handle

```ts
import { resolveAddress } from "thirdweb/extensions/lens";
 
const walletAddress = await resolveAddress({
  name: "vitalik",
  client,
});
```
## Transfering (sending) tokens using thirdweb extensions

### ERC721

```typescript
import { safeTransferFrom } from "thirdweb/extensions/erc721";
import { sendAndConfirmTransaction } from "thirdweb";
 
const transaction = safeTransferFrom({
  contract, // the erc721 contract
  from: "0x-wallet-address-of-owner",
  to: "0x-recipient-address",
  tokenId: 0n, // bigint - if you want to transfer tokenId #0, enter `0n`
});
 
const transactionReceipt = await sendAndConfirmTransaction({
  account, // the account initiating the transaction
  transaction,
});
```

### ERC1155

ERC1155 works in a similar way. However you must specify the quantity that you want to transfer, and an optional data parameter.

```ts
import { safeTransferFrom } from "thirdweb/extensions/erc1155";
import { sendAndConfirmTransaction } from "thirdweb";
 
const quantity = 1n;
const optionalData = "0x";
 
const transaction = safeTransferFrom({
  contract, // the erc1155 contract
  from: "0x...", // owner's wallet address
  to: "0x...", // recipient address
  tokenId: 0n,
  value: quantity,
  data: optionalData,
});
 
const transactionReceipt = await sendAndConfirmTransaction({
  account, // the account initiating the transaction
  transaction,
});
```

### ERC20

```ts
import { transferFrom } from "thirdweb/extensions/erc20";
import { sendAndConfirmTransaction } from "thirdweb";
 
const transaction = transferFrom({
  contract, // the erc20 contract
  from: "0x...", // owner's wallet address
  to: "0x...", // recipient address
  amount: 10n, // sending 10 tokens
  // Alternatively, you can use `amountWei` if you prefer to use the value in wei
  // amountWei: 10000000000000000000n, // assuming a decimals of 18
});
```
## Using extensions

### What are extensions?

Extensions are the most convenient way to interact with contracts and protocols.

They are precompiled, type-safe and highly optimized implementations of common standards such as ERC20, ERC721, ERC1155, etc. They can be handwritten to provide an easier API, sometimes combining multiple contract calls into one convenient function. They can also be generated from any deployed contract using a [simple CLI command](https://portal.thirdweb.com/typescript/v5/extensions/generate).

To use an extension, you just need to import it and call it with the necessary parameters.

#### Example: `getOwned()` extension for ERC1155 tokens

This read extension handles fetching all the tokens owned by an address. Under the hood, this combines multiple contract calls.

```typescript
import { getContract } from "thirdweb";
import { getOwnedNFTs } from "thirdweb/extensions/erc1155";
 
// get the contract
const contract = getContract({...});
 
// since this is a read extension, we can just await the result
const ownedNFTs = await getOwnedNFTs({
	contract,
	address: "0x5678...",
});
```

#### Example: `mintTo()` extension for ERC721 tokens

This extension handles uploading metadata to IPFS before minting an ERC721 token.

```typescript
import { getContract } from "thirdweb";
import { mintTo } from "thirdweb/extensions/erc721";
 
// get the contract
const contract = getContract({...});
 
// call the extension function to prepare the transaction
const transaction = mintTo({
	contract,
	to: "0x5678...",
    nft: {
        name: "My NFT",
        description: "This is my NFT",
        image: "https://example.com/image.png",
    },
});
 
// Send the transaction
const transactionResult = await sendTransaction({
  transaction,
  account,
});
```

#### Example: `transfer()` extension for ERC20 tokens

This extension conveniently handles unit conversion when transfering ERC20 tokens. You can pass the amount in tokens, the extension will convert it to the right unit before calling the contract.

```typescript
import { getContract, sendTransaction } from "thirdweb";
import { transfer } from "thirdweb/extensions/erc20";
 
// get the contract
const contract = getContract({...});
 
// Call the extension function to prepare the transaction
const transaction = transfer({
  contract,
  to: "0x1234...",
  amount: "0.01",
});
 
// Send the transaction
const transactionResult = await sendTransaction({
  transaction,
  account,
});
```
## Getting Started

In this quickstart guide, we'll create a basic script to generate a wallet using a private key and send a transaction. We’ll assume you already have a TypeScript project created.

* #### Install the SDK  
To get started, install the thirdweb SDK using your preferred package manager.  
npmyarnpnpmbun  
`npm i thirdweb  
`
* #### Create a thirdweb client  
Get a client id from <https://thirdweb.com/create-api-key> by creating a new project and add it to your `.env`.  
```bash  
THIRDWEB_SECRET_KEY=[YOUR SECRET KEY]  
WALLET_PRIVATE_KEY=[YOUR WALLET PRIVATE KEY]  
```  
Create a thirdweb client in your script.  
```ts  
import { createThirdwebClient } from "thirdweb";  
   
const client = createThirdwebClient({  
  // use `secretKey` for server side or script usage  
  secretKey: process.env.THIRDWEB_SECRET_KEY,  
});  
```  
#### Client Id vs Secret Key  
Client Id is used for **client side usage** and is restricted by the domain restrictions you set on your API key, it is a public identifier which can be used on the frontend safely.  
Secret key is used for **server side or script usage** and is not restricted by the domain restrictions. Never expose your secret key in client side code.
* #### Read Contract State  
A client is all you need to start reading blockchain data.  
   * Import the extensions you want to use.  
   * Define a contract with `getContract` at a given address and chain.  
   * Call the extension function to read the data.  
```ts  
import { getContract } from "thirdweb";  
import { sepolia } from "thirdweb/chains";  
// 1. import the extension you want to use  
import { getOwnedNFTs } from "thirdweb/extensions/erc1155";  
   
// 2. get the contract  
const contract = getContract({  
  client,  
  address: "0x1234...",  
  chain: sepolia,  
});  
   
// 3. call the extension function  
const ownedNFTs = await getOwnedNFTs({  
  contract,  
  address: "0x1234...",  
});  
   
console.log(ownedNFTs);  
```
* #### Generate a wallet from a private key  
To perform transactions from your script, you'll need an account. You can generate a wallet from a private key using the `privateKeyToAccount` function.  
```ts  
import { privateKeyToAccount } from "thirdweb/wallets";  
   
const account = privateKeyToAccount({  
  client,  
  privateKey: process.env.PRIVATE_KEY,  
});  
   
// Get the address of the account  
const address = account.address;  
console.log("Connected as", address);  
```
* #### Read Wallet Data  
Let's read balance of the account you just created, you'll need funds to perform transactions.  
```ts  
import { getWalletBalance } from "thirdweb/wallets";  
   
// Get the balance of the account  
const balance = await getWalletBalance({  
  account,  
  chain: sepolia,  
});  
console.log("Balance:", balance.displayValue, balance.symbol);  
```
* #### Send a transaction  
With the account created and funded, you can now send a transaction.  
   * Import the extension you want to use.  
   * Define a contract with `getContract` at a given address and chain.  
   * Call the extension function to prepare the transaction.  
   * Send the transaction.  
```ts  
import { getContract, sendTransaction } from "thirdweb";  
// 1. Import the extension you want to use  
import { transfer } from "thirdweb/extensions/erc20";  
   
// 2. Define the contract  
const contract = getContract({  
  client,  
  address: "0x1234...",  
  chain: sepolia,  
});  
   
// 3. Call the extension function to prepare the transaction  
const transaction = transfer({  
  contract,  
  to: "0x1234...",  
  amount: "0.01",  
});  
   
// 4. Send the transaction  
const result = await sendTransaction({  
  transaction,  
  account,  
});  
   
console.log("Transaction hash:", result.transactionHash);  
```  
You can also call generic contract functions using the `prepareContractCall` function by just specifying the solidity method signature you want to call. The arguments will be automatically inferred based on the method signature.  
```ts  
import {  
  getContract,  
  prepareContractCall,  
  sendTransaction,  
} from "thirdweb";  
import { sepolia } from "thirdweb/chains";  
import { toWei } from "thirdweb/utils";  
   
// 1. Define the contract  
const contract = getContract({  
  client,  
  address: "0x1234...",  
  chain: sepolia,  
});  
   
// 2. Prepare the transaction  
const transaction = prepareContractCall({  
  contract,  
  // Pass the method signature that you want to call  
  method: "function mintTo(address to, uint256 amount)",  
  // and the params for that method  
  // Their types are automatically inferred based on the method signature  
  params: ["0x123...", toWei("100")],  
});  
   
// 3. Send the transaction  
const result = await sendTransaction({  
  transaction,  
  account,  
});  
   
console.log("Transaction hash:", result.transactionHash);  
```
* #### Conclusion  
You've now learned the basics of how to use the thirdweb SDK to read and write to the blockchain. You can now start building your own applications and explore the full potential of the SDK.  
[View the full SDK reference](https://portal.thirdweb.com/references/typescript/v5).
## Extensions

### What are extensions?

Extensions are the most convenient way to interact with contracts and protocols.

They are precompiled, type-safe and highly optimized implementations of common standards such as ERC20, ERC721, ERC1155, etc. They can be handwritten to provide an easier API, sometimes combining multiple contract calls into one convenient function. They can also be generated from any deployed contract using a [simple CLI command](https://portal.thirdweb.com/typescript/v5/extensions/generate).
## Built-in modules

The SDK comes packed with a set of built-in modules for convenient use. Note that you can also create your own modules.

| Module Name                                                                                                           |
| --------------------------------------------------------------------------------------------------------------------- |
| [BatchMetadataERC1155](https://portal.thirdweb.com/references/typescript/v5/functions#batchmetadataerc1155)           |
| [BatchMetadataERC721](https://portal.thirdweb.com/references/typescript/v5/functions#batchmetadataerc721)             |
| [ClaimableERC1155](https://portal.thirdweb.com/references/typescript/v5/functions#claimableerc1155)                   |
| [ClaimableERC20](https://portal.thirdweb.com/references/typescript/v5/functions#claimableerc20)                       |
| [ClaimableERC721](https://portal.thirdweb.com/references/typescript/v5/functions#claimableerc721)                     |
| [MintableERC1155](https://portal.thirdweb.com/references/typescript/v5/functions#mintableerc1155)                     |
| [MintableERC20](https://portal.thirdweb.com/references/typescript/v5/functions#mintableerc20)                         |
| [MintableERC721](https://portal.thirdweb.com/references/typescript/v5/functions#mintableerc721)                       |
| [OpenEditionMetadataERC721](https://portal.thirdweb.com/references/typescript/v5/functions#openeditionmetadataerc721) |
| [RoyaltyERC1155](https://portal.thirdweb.com/references/typescript/v5/functions#royaltyerc1155)                       |
| [RoyaltyERC721](https://portal.thirdweb.com/references/typescript/v5/functions#royaltyerc721)                         |
| [SequentialTokenIdERC1155](https://portal.thirdweb.com/references/typescript/v5/functions#sequentialtokeniderc1155)   |
| [TransferableERC1155](https://portal.thirdweb.com/references/typescript/v5/functions#transferableerc1155)             |
| [TransferableERC20](https://portal.thirdweb.com/references/typescript/v5/functions#transferableerc20)                 |
| [TransferableERC721](https://portal.thirdweb.com/references/typescript/v5/functions#transferableerc721)               |

More modules are being added regularly. You can also [create your own modules](https://portal.thirdweb.com/contracts/modular-contracts/get-started/create-module-contract).
## In-App Wallets

Create in-app wallet for your users based on their email, phone, passkey, social auth or even their external wallets. These wallets are scoped by your clientId and do not require any confirmation to sign transactions.

### Available auth methods

* Email
* Phone
* Passkey
* Guest
* Wallet
* Google
* Apple
* Facebook
* X
* Discord
* Telegram
* Twitch
* Farcaster
* Github
* Line
* Coinbase
* Steam
* Backend

### Live Playground

Try out in-app wallets for yourself in the [in-app wallet live playground](https://playground.thirdweb.com/connect/in-app-wallet)

### Configure in-app wallets

The simplest way to create an in-app wallet is to use the `inAppWallet()` function. By default, this will create a wallet that supports email/password login, Google, Apple, Facebook login, and passkey.

```tsx
import { inAppWallet } from "thirdweb/wallets";
 
const wallet = inAppWallet();
```

You can also customize the wallet by passing in options.

```tsx
import { inAppWallet } from "thirdweb/wallets";
 
const wallet = inAppWallet({
  auth: {
    mode, // options are "popup" | "redirect" | "window";
    options, // ex: ["discord", "farcaster", "apple", "facebook", "google", "passkey"],
    passkeyDomain, // for passkey, the domain that the passkey is created on
    redirectUrl, // the URL to redirect to after authentication
  },
  metadata, // metadata for the wallet (name, icon, etc.)
  smartAccount, // smart account options for the wallet (for gasless tx)
});
```

[View all in-app wallet options](https://portal.thirdweb.com/references/typescript/v5/InAppWalletCreationOptions).

Once created, you can use it either with the prebuilt UI components, or with your own UI.

### Usage

```tsx
import { ThirdwebProvider, ConnectButton } from "thirdweb/react";
import { inAppWallet } from "thirdweb/wallets";
 
const client = createThirdwebClient({ clientId });
const wallet = inAppWallet();
 
const account = await wallet.connect({
  client,
  strategy: "google",
});
 
console.log("connected as", account.address);
```

### API Reference

View all the auth and configuration options for in-app wallets in the [API Reference](https://portal.thirdweb.com/references/typescript/v5/inAppWallet).
## Deploying a Modular Contract

To deploy a modular contract, you can use the `deployModularContract` function. You can deploy just the core contract, or decide to deploy a core with specific modules preinstalled.

Here's an example of deploying a modular ERC721 contract with the `ClaimableERC721` and `BatchMetadataERC721` modules, which recreate a NFT Drop behavior.

```ts
import {
  ClaimableERC721,
  BatchMetadataERC721,
  deployModularContract,
} from "thirdweb/modules";
 
const deployed = deployModularContract({
  client,
  chain,
  account,
  core: "ERC721", // or "ERC20" or "ERC1155"
  params: {
    name: "My Modular NFT Contract",
  },
  modules: [
    ClaimableERC721.module({
      primarySaleRecipient: "0x...",
    }),
    BatchMetadataERC721.module(),
  ],
});
```

Check out the [deployModularContract](https://portal.thirdweb.com/typescript/v5/common/deployModularContract) reference for more information.
## Migration from TypeScript SDK v4

### Why you should migrate to SDK v5

##### 1\. Better performance, happier clients

The new SDK is built with performance in mind and proper tree-shaking. Therefore, the minimum bundle size of your application is greatly reduced.

Below is the comparison of 2 similar applications, using `ConnectWallet` (v4) & `ConnectButton` (v5), which are identical in term of functionality.

| SDK v4              | SDK v5                                                                          |                       |
| ------------------- | ------------------------------------------------------------------------------- | --------------------- |
| Minimum bundle size | 766kb                                                                           | 104kb                 |
| Dependencies        | "@thirdweb-dev/react": "^4.9.4""@thirdweb-dev/sdk": "^4.0.99""ethers": "^5.7.2" | "thirdweb": "^5.42.0" |

_(Built with Next.js 14.2.5)_

##### 2\. More wallets supported

The SDK v4 only supports a handful of web3 wallets and the more wallets you want to include in your app, the heavier it becomes.

SDK v5 supports over 300 wallets and this number is increasing! You can [interact with wallets based on their unique IDs](https://portal.thirdweb.com/typescript/v5/wallets#example-connect-a-wallet-and-access-an-account-to-send-a-transaction). Hence, adding more wallets to your app has little to no effect to the final bundle.

##### 3\. Flexibility with React hooks

When building a React web3 application with thirdweb SDK v4, you have access to a set of prebuilt React hooks which let you conveniently interact with your smart contracts.

The issue with this approach is that, the number of smart-contract methods is ever-increasing, and for each hook that does not exist, we have to dedicate time & energy to write, test & maintain. This process is time-consuming & frankly, the more React hooks you add to your app, the slower and more unmaintainable your projects become.

In SDK v5, we introduce a novel concept called "prebuilt extensions" - a set of read & write methods for popular contracts which you can _plug & play_. For example:

###### Read contract states with v5

```ts
// Get a list of owned ERC721 tokens in a wallet
import { useReadContract } from "thirdweb/react";
import { getOwnedNFTs } from "thirdweb/extensions/erc721";
 
const { data } = useReadContract(getOwned, { contract, owner });
```

###### Write to contract with v5

```ts
// Claim an NFT from thirdweb Drop contract
import { useSendTransaction } from "thirdweb/react";
import { claimTo } from "thirdweb/extensions/erc721";
 
const { mutate: sendTx } = useSendTransaction();
const transaction = claimTo({
  contract,
  to: "0x...",
  quantity: 1n,
});
sendTx(transaction);
```

As you can see, by pairing the contract extensions with `useReadContract` (for read) and `useSendTransaction` (for write), we are able to greatly reduce the amount of code that is packaged & shipped to the end users. Plus, with this approach we can dedicate more time to building contract extensions. The SDK v5 currenty supports over hundreds of extensions, with some popular protocols like Uniswap, Farcaster, Lens & more to come.

View a list of [supported extensions](https://portal.thirdweb.com/typescript/v5/extensions/built-in) here, or [build your own](https://portal.thirdweb.com/typescript/v5/extensions/create)!

##### 4\. Access to latest software

Currently the SDK v4 is using `ethers@5.7.2` and `@tanstack/react-query@^4` which can be considered "outdated". We unfortunately do not have a plan to upgrade v4's dependencies to the latest versions. We highly recommend you to migrate to the SDK v5 to receive the latest software with better security and performance.  
Want to keep using ethers.js 5? Worry not! The SDK v5 comes with powerful adapters which let you use thirdweb with popular web3 frameworks like viem or ethers 5 & 6.  
[Learn more](https://portal.thirdweb.com/typescript/v5/adapters#ethers-v5)

---

### High-level changes

* All imports from `@thirdweb-dev/*` should be replaced with `thirdweb` SDK with sub-exports.
* The new SDK is `function` based rather than `class` based for better tree shaking and performance.
* All contract calls are now prepared using `prepareContractCall` and sent using the `sendTransaction` function.
* Transactions are submitted without waiting for receipt by default. You can call the `waitForReceipt` function to wait for the transaction to be mined.

### Progressive migration

If you're currently using the `@thirdweb-dev/sdk`, you can progressively migrate to the new `thirdweb` SDK. Both SDKs can be used side by side and are interoperable with each other.

You can easily share the same wallet between the two SDKs by using the `ethers5adapter` utility, allowing you to progressively replace calls one by one.

```ts
import { ThirdwebSDK } from "@thirdweb-dev/sdk";
import { prepareContractCall, sendTransaction } from "thirdweb";
import { ethers5Adapter } from "thirdweb/adapters/ethers5";
 
const sdk = ThirdwebSDK.fromPrivateKey(pkey, chain);
 
// convert the signer to be used with the new thirdweb SDK
const account = await ethers5Adapter.signer.fromEthers(sdk.getSigner());
 
// then use the new thirdweb SDK normally
const transaction = prepareContractCall({ ... });
await sendTransaction({
	transaction,
	account,
});
```

In React, you can mix and match the v4 and v5 `ThirdwebProvider`, that gives you access to the hooks and functionality of both SDKs.

```tsx
import { ThirdwebProvider} from "@thirdweb-dev/react" }
import { ThirdwebProvider as ThirdwebProviderV5 } from "thirdweb/react"
 
<ThirdwebProvider activeChain={...} clientId={...}>
  <ThirdwebProviderV5>
     ...
  </ThirdwebProviderV5>
</V4TWProvider>
```

From there, you can obtain the current signer using the `useSigner` hook, and convert it when needed using the `ethers5Adapter`:

```tsx
import { useSigner } from "@thirdweb-dev/react";
import { ethers5Adapter } from "thirdweb/adapters/ethers5";
 
const signer = useSigner();
 
const onClick = async () => {
    // convert the signer to used with the new SDK
	const account = await ethers5Adapter.signer.fromEthers(signer);
    // then use the new SDK normally
    const transaction = prepareContractCall({ ... });
    await sendTransaction({
	    transaction,
	    account,
    });
};
```

### TypeScript Cheatsheet

| Task       | @thirdweb-dev/sdk                                      | thirdweb                                                                                                                  |
| ---------- | ------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------- |
| Chains     | import { Sepolia } from "@thirdweb-dev/chains"         | [import { sepolia } from "thirdweb/chains"](https://portal.thirdweb.com/typescript/v5/chain)                              |
| Wallets    | import { MetaMaskWallet } from "@thirdweb-dev/wallets" | [import { createWallet } from "thirdweb/wallets"](https://portal.thirdweb.com/references/typescript/v5/createWallet)      |
| Initialize | new ThirdwebSDK(...)                                   | [createThirdwebClient({ ... })](https://portal.thirdweb.com/references/typescript/v5/createThirdwebClient)                |
| Contract   | await sdk.getContract(...)                             | [getContract(...) // no await](https://portal.thirdweb.com/references/typescript/v5/getContract)                          |
| Read       | await contract.call(...)                               | [await readContract(...)](https://portal.thirdweb.com/references/typescript/v5/readContract)                              |
| Prepare    | await contract.prepare(...)                            | [prepareContractCall(...) // no await](https://portal.thirdweb.com/references/typescript/v5/prepareContractCall)          |
| Send       | await contract.call(...)                               | [await sendTransaction(...)](https://portal.thirdweb.com/references/typescript/v5/sendTransaction)                        |
| Extensions | await contract.erc721.getAll()                         | [await getNFTs(...)](https://portal.thirdweb.com/references/typescript/v5/erc721/getNFTs)                                 |
| Deploy     | sdk.deployer.deployBuiltInContract(...)                | [await deployPublishedContract(...)](https://portal.thirdweb.com/references/typescript/v5/deploy/deployPublishedContract) |

### React Cheatsheet

| Task                | @thirdweb-dev/react                                 | thirdweb                                                                                                                  |
| ------------------- | --------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------- |
| Provider            | import { ThirdwebProvider} from @thirdweb-dev/react | [import { ThirdwebProvider } from "thirdweb/react"](https://portal.thirdweb.com/react/v5/ThirdwebProvider)                |
| Contract            | useContract(...)                                    | [getContract(...) // not a hook](https://portal.thirdweb.com/references/typescript/v5/getContract)                        |
| Address             | useAddress(...)                                     | [useActiveAccount(...) // account?.address](https://portal.thirdweb.com/references/typescript/v5/useActiveAccount)        |
| Read                | useContractRead(...)                                | [useReadContract(...)](https://portal.thirdweb.com/references/typescript/v5/useReadContract)                              |
| Write               | useContractWrite(...)                               | [useSendTransaction()](https://portal.thirdweb.com/references/typescript/v5/useSendTransaction)                           |
| Extensions          | useNFTs(...)                                        | [useReadContract(getNFTs, { ... })](https://portal.thirdweb.com/references/typescript/v5/useReadContract)                 |
| Get Signer          | useSigner()                                         | [useActiveAccount()](https://portal.thirdweb.com/references/typescript/v5/useActiveAccount)                               |
| Get Wallet          | useWallet()                                         | [useActiveWallet()](https://portal.thirdweb.com/references/typescript/v5/useActiveWallet)                                 |
| Button              | Web3Button                                          | [TransactionButton](https://portal.thirdweb.com/react/v5/TransactionButton)                                               |
| Connect             | ConnectWallet                                       | [ConnectButton](https://portal.thirdweb.com/react/v5/ConnectButton)                                                       |
| Connection Status   | useConnectionStatus()                               | [useActiveWalletConnectionStatus()](https://portal.thirdweb.com/references/typescript/v5/useActiveWalletConnectionStatus) |
| Switch Chain        | useSwitchChain()                                    | [useSwitchActiveWalletChain()](https://portal.thirdweb.com/references/typescript/v5/useSwitchActiveWalletChain)           |
| Get Connected Chain | useChain()                                          | [useActiveWalletChain()](https://portal.thirdweb.com/references/typescript/v5/useActiveWalletChain)                       |
## Interacting with a Modular Contract

There are core contracts for ERC20, ERC721 and ERC1155 standards. Those follow the standard ERCs and can be interacted with like usual with the standard extensions.

The interesting part is to interact with an attached module. This is done by using the defined module name spaced API for that module.

```ts
import { ClaimableERC721 } from "thirdweb/modules";
 
const transaction = ClaimableERC721.mint({
  contract,
  to: "0x...", // Address to mint tokens to
  quantity: 2, // Amount of tokens to mint
});
 
// Send the transaction
await sendTransaction({ transaction, account });
```

You can view all the prebuilt modules available in the [modules reference](https://portal.thirdweb.com/references/typescript/v5/functions#modules-1).
## Modular Contracts

Modular contracts are a new way to build, deploy, and interact with contracts that can be upgraded and modified over time.

### Built-in modules

The SDK comes with a set of built-in modules that are designed to make it easy to interact with popular contracts and protocols.

### Creating your own modules

You can also create your own modules to add new functionality to your contracts. Learn more about how to create your own modules [here](https://portal.thirdweb.com/contracts/modular-contracts/get-started/create-module-contract).
## Upgrading a Modular Contract

#### Installing a new module

These modules can be swapped at any time, and new ones can also be added post deployment. Here's how to install a new module.

```ts
import { RoyaltyERC721 } from "thirdweb/modules";
 
const transaction = RoyaltyERC721.install({
  contract: coreContract,
  account,
  params: {
    royaltyRecipient: account.address,
    royaltyBps: 100n,
    transferValidator: ZERO_ADDRESS,
  },
});
```

The `install` function is available on all modules, organized by module name space.

You can also use the standalone [installPublishedModule](https://portal.thirdweb.com/typescript/v5/common/installPublishedModule) function to install custom modules.
## IPFS Storage

The thirdweb SDK comes built-in with an IPFS uploader and downloader.

### Download from IPFS

```ts
import { download } from "thirdweb/storage";
 
const file = await download({
  client,
  uri: "ipfs://Qm...",
});
```

You can view all of the configuration options in the [full reference](https://portal.thirdweb.com/references/typescript/v5/download).

### Upload to IPFS

#### Uploading JSON objects

```ts
import { upload } from "thirdweb/storage";
 
const uris = await upload({
  client,
  files: [
    {
      name: "something",
      data: {
        hello: "world",
      },
    },
  ],
});
```

#### Uploading files

```ts
import { upload } from "thirdweb/storage";
 
const uris = await upload({
  client,
  files: [new File(["hello world"], "hello.txt")],
});
```

You can view all of the configuration options in the [full reference](https://portal.thirdweb.com/references/typescript/v5/upload).

#### Resolve IPFS uris

You can easily convert a `ipfs://` uri to a `https://` uri with your own IPFS gateway using the `resolveScheme` function.

The resolved uri will be protected by your api key settings, and only accessible to your whitelisted domains.

```ts
import { resolveScheme } from "thirdweb/storage";
 
const uri = await resolveScheme("ipfs://Qm...");
// resolves to https://<clientId>.ipfscdn.io/Qm...
```
## Coinbase Wallet

<https://www.coinbase.com/wallet/>

### Wallet ID

`"com.coinbase.wallet";

`

### Connect Wallet

 TypeScript  React (Custom UI)  React (Component) 

`import { createThirdwebClient } from "thirdweb";

import { createWallet } from "thirdweb/wallets";

const client = createThirdwebClient({ clientId });

const wallet = createWallet("com.coinbase.wallet", {

 appMetadata: {

 name: "My app",

 description: "My app description",

 icon: "https://myapp.com/icon.png",

 },

// for mobile, pass the callback URL of your app's universal link

 mobileConfig: {

 callbackURL: "https://myapp.com",

 },

// switch between smart wallet and EOA wallet

 walletConfig: {

 options: "smartWalletOnly", // or "eoaOnly" or "all"

 },

 }),;

await wallet.connect({ client });

`

### Reference

[View All Creation Options](https://portal.thirdweb.com/references/typescript/v5/CoinbaseWalletCreationOptions)
## Preparing Transactions

All transactions sent with the SDK need to be prepared first. Preparing a transaction is synchronous, lightweight and does not require any network requests. It also gives you type-safe definitions for your contract calls.

### Preparing a contract call

The recommended way to prepare a contract call is to pass the Solidity method signature and the params. This is type-safe based on the Solidity method signature you define. You can get your desired contract method signature from the solidity code directly.

```ts
import { prepareContractCall, toWei } from "thirdweb";
 
const tx = prepareContractCall({
  contract,
  // Pass the method signature that you want to call
  method: "function mintTo(address to, uint256 amount)",
  // and the params for that method
  // Their types are automatically inferred based on the method signature
  params: ["0x123...", toWei("100")],
});
```

This will return a prepared transaction object that is ready to be sent to the blockchain and can be acted on in various ways.

### Preparing a raw transaction

You can also create a raw transaction directly. This is useful when you want to send ether to an address for example, or when you already have encoded data.

```ts
import { prepareTransaction, toWei } from "thirdweb";
 
const transaction = prepareTransaction({
  // The account that will be the receiver
  to: "0x456...",
  // The value is the amount of ether you want to send with the transaction
  value: toWei("1"),
  // The chain to execute the transaction on
  chain: defineChain(1),
  // Your thirdweb client
  client,
});
```

### Other ways to prepare a transaction

There are few other ways to prepare a contract call, all of these return the same transaction object.

#### Generating extension functions for a deployed contract

Using the CLI, you can generate optimized functions for all the possible calls to a contract. This saves you time and precomputes all the necessary encoding.

```bash
npx thirdweb generate <contractId>/<contractAddress>
```

Read more on how to [generate extension functions using the CLI](https://portal.thirdweb.com/cli).

#### Explicit Contract ABI

Another way to get type safety is to pass the full contract ABI to `getContract`. This will give you autocompletion for all methods declared in the ABI. There is a slight extract cost of having the full ABI in your code which can be pretty large.

```ts
import { getContract, prepareContractCall, toWei } from "thirdweb";
 
const contract = getContract({
  client,
	chainId,
  // The ABI for the contract is defined here
  abi: [
    ...
    {
      name: "mintTo",
      inputs: [
        {
          type: "address",
          name: "to",
        },
        {
          type: "uint256",
          name: "amount",
        },
      ],
      type: "function",
    }
    ...
  ],
});
 
const tx = prepareContractCall({
  contract,
  // We get auto-completion for all the available functions on the contract ABI
  method: "mintTo",
  // including full type-safety for the params
  params: ["0x123...", toWei("100")],
});
```

#### ABI snippet

As an alternative to passing the full ABI, you can pass a snippet of the ABI for the method you want to call. This is useful when you only want to call a single method and don't want to have the full ABI in your code.

```ts
import { prepareContractCall, toWei } from "thirdweb";
 
const tx = prepareContractCall({
  contract,
  // Pass a snippet of the ABI for the method you want to call.
  method: {
    name: "mintTo",
    inputs: [
      {
        type: "address",
        name: "to",
      },
      {
        type: "uint256",
        name: "amount",
      },
    ],
    type: "function",
  },
  // The Types of `params` are automatically inferred based on the ABI inputs.
  params: ["0x123...", toWei("100")],
});
```

#### Automatic ABI Resolution

Finally, you can dynamically resolve contract methods at runtime using the `resolveMethod` function. This is the best way to handle contracts you don't know the ABI of in advance but it is also less performant and not type-safe.

```ts
import { prepareContractCall, resolveMethod, toWei } from "thirdweb";
const tx = prepareContractCall({
  contract,
  // in this case we only pass the name of the method we want to call
  method: resolveMethod("mintTo"),
  // however using this method we lose type safety for our params
  params: ["0x123...", toWei("100")],
});
```

#### Please note

This method is convenient, however, it is also:

* less performant at runtime (it has to resolve the ABI of the contract and then match the method name you provide)
* not type-safe (you lose type safety for your params)

There are cases where you specifically _need_ to be able to resolve methods dynamically at runtime, in which case this method is useful.
## Reading contract state

The recommended way to read the contract state is to use the `readContract` function and pass the Solidity method signature and the params. This is type-safe based on the Solidity method signature you define. You can get your desired contract method signature from the solidity code directly.

```ts
import { readContract } from "thirdweb";
 
const balance = await readContract({
  contract: contract,
  method: "function balanceOf(address) view returns (uint256)",
  params: ["0x123..."],
});
```

This will execute the read immediately and return the result from the blockchain.

### Reading contract events

The recommended way to read the contract events is to use the `getContractEvents` function and passing a prepared event with the Solidity event signature and the params. This is type-safe based on the Solidity event signature you define. You can get your desired contract event signature from the solidity code directly.

```ts
import { getContractEvents, prepareEvent } from "thirdweb";
 
const myEvent = prepareEvent({
  signature:
    "event Transfer(address indexed from, address indexed to, uint256 value)",
});
 
const events = await getContractEvents({
  contract: myContract,
  events: [myEvent],
  blockRange: 1000,
});
```

#### Generating all read functions and events for a deployed contract

Using the CLI, you can generate optimized functions for all the possible calls to a contract. This saves you time and precomputes all the necessary encoding.

```bash
npx thirdweb generate <contractId>/<contractAddress>
```

Read more on how to [generate extension functions using the CLI](https://portal.thirdweb.com/typescript/v5/extensions/generate).
## Transactions

Transactions are the primary way to read and write to the blockchain.
## Acting on a prepared transaction

Transactions have a variety of actions that can be called on them, in all cases this is done by passing the transaction to the various action functions.

### Sending a transaction

Send the prepared transaction to the blockchain. Sending a transaction requires a wallet.

See [Wallets](https://portal.thirdweb.com/typescript/v5/wallets) for more information on how to create a wallet.

```ts
import { sendTransaction } from "thirdweb";
import { createWallet } from "thirdweb/wallets";
 
const wallet = createWallet("io.metamask");
const account = await wallet.connect({ client });
 
const transactionResult = await sendTransaction({
  transaction,
  account,
});
```

### sendAndConfirmTransaction

Send a transaction and wait for it to be mined. Useful when you want to block until the transaction is fully confirmed onchain before proceeding to the next step.

```ts
import { sendAndConfirmTransaction } from "thirdweb";
import { createWallet } from "thirdweb/wallets";
 
const wallet = createWallet("io.metamask");
const account = await wallet.connect({ client });
 
const receipt = await sendAndConfirmTransaction({
  transaction,
  account,
});
```

### waitForReceipt

Wait for a transaction to be mined and get the transaction receipt.

```ts
import { sendTransaction, waitForReceipt } from "thirdweb";
import { createWallet } from "thirdweb/wallets";
 
const wallet = createWallet("io.metamask");
const account = await wallet.connect({ client });
 
const transactionResult = await sendTransaction({
  transaction,
  account,
});
 
const receipt = await waitForReceipt(transactionResult);
```

### estimateGas

Estimating gas used by a transaction

```ts
import { estimateGas } from "thirdweb";
 
const gasEstimate = await estimateGas({ transaction });
console.log("estmated gas used", gasEstimate);
```

### estimateGasCost

Estimating gas cost in ether and wei for a transaction

```ts
import { estimateGas } from "thirdweb";
 
const gasCost = await estimateGasCost({ transaction });
console.log("cost in ether", gasCost.ether);
```

### simulateTransaction

Simulate a transaction to see if it would be successful.

```ts
import { simulateTransaction } from "thirdweb";
 
const result = await simulateTransaction({ transaction });
console.log("simulation result", result);
```

### encode

Encode a transaction data to be used later

```ts
import { encode } from "thirdweb";
 
const data = await encode(transaction);
console.log("encoded data", data);
```
## Accounts & Wallets

We distinguish between "accounts" and "wallets" in the thirdweb SDK. We believe this ultimately provides a more predictable and flexible API for developers.

### What is an Account?

* An account always has an `address` and a way to `sign` messages, transactions, and typed data.
* An account is always mapped to exactly one address on the blockchain.
* An account cannot be "connected" or "disconnected" like a wallet, instead it is often the result of a wallet being connected.

See also: [Account (ethereum.org)](https://ethereum.org/en/glossary/#account)

### What is a Wallet?

* A wallet "contains" one or more accounts.
* A wallet can be "connected" (often prompting the user for approval) or "disconnected".
* A wallet cannot independently sign messages, transactions, or typed data, instead, it delegates this to the account(s) it "contains".

### Example: Connect a wallet and access an account to send a transaction.

```ts
import { sendTransaction } from "thirdweb";
// We use MetaMask wallet as an example, the pattern is the same for all wallets
import { createWallet } from "thirdweb/wallets";
 
// initialize the wallet, you can pick any of the 300+ wallet connectors supported
// wallet ids are typed, let your TS editor autocomplete them for you
// ex: "io.metamask", "com.coinbase.wallet", "me.rainbow", etc...
const wallet = createWallet("io.metamask");
 
// connect the wallet, this returns a promise that resolves to the connected account
const account = await wallet.connect({
  // pass the client you created with `createThirdwebClient()`
  client,
});
 
// sign & send a transaction with the account -> returns the transaction hash
const { transactionHash } = await sendTransaction({
  // assuming you have called `prepareTransaction()` or `prepareContractCall()` before which returns the prepared transaction to send
  transaction,
  // Pass the account to sign the transaction with
  account,
});
```
## ThirdwebContract

`ThirdwebContract` is a wrapper around any EVM-compatible smart contract. It allows you to interact with the contract's functions easily, as well as prepare transactions.

#### Instantiating a ThirdwebContract

```csharp
var contract = await ThirdwebManager.Instance.GetContract(
	address: "contract-address", 
	chainId: 1, 
	abi: "optional-abi"
);
```

That's it! You can now interact with the contract using the `ThirdwebContract`.

It contains `Read`, `Write` and `Prepare` methods to respectively read contract state, write to the contract and prepare transactions.

Furthermore, it contains shorthands such as `ThirdwebContract.ERC20_BalanceOf` to easily interact with common contract interfaces.
## TypeScript SDK

Performant & lightweight SDK to interact with any EVM chain from Node, React and React Native.

Connect TypeScript SDK

Connect TypeScript SDK is open-source. View and contribute to its source code on GitHub.

[GitHubView on GitHub](https://github.com/thirdweb-dev/js)

### Installation

npmyarnpnpmbun

`npm i thirdweb

`

#### Have you generated a client ID?

You'll need a client ID to access the SDK's free blockchain APIs, storage, and more.

[ Generate ](https://thirdweb.com/create-api-key)

### Quickstart

Follow our [Quickstart](https://portal.thirdweb.com/typescript/v5/getting-started) to get started with the TypeScript SDK.

### Features

* **React and React Native UI Components**: for wallets connection, transactions and more
* **In-app wallets**: first-class support for email and social logins
* **Account abstraction**: first-class support for ERC4337 smart accounts
* **Type safe contract API**: fully typed with human readable ABI
* **Code generation**: CLI to generate highly optimized contract, type-safe interfaces\\
* **RPC for any EVM chain**: highly performant RPCs with just a chain id
* **IPFS upload/download**: simple and efficient IPFS integration
* **Auto ABI resolution**: resolve ABIs for any deployed contract with just an address
* **Ethers / Viem Interoperability**: adapters for ethers and viem libraries

### Design principles

* **Single package:** for Node, React and React Native with tree shaking for a minimal footprint.
* **Performance optimized:** focuses on speed and efficiency with single responsibility principles.
* **Out-of-the-box infra:** direct access to all the thirdweb infrastructure from wallets to RPCs to IPFS.
* **Developer experience:** type-safe, simple to use, with repeatable and predictable patterns.
* **Interoperable:** works with any infra provider and with other libraries like viem and ethers.

### API Reference

### Requirements

* Node 18.6 or higher
* TypeScript 5.0.4 or higher (for TypeScript users)
* React 18.0.0 or higher (for React users)
## Build Instructions

### All Target Platforms

* **Player Settings:** Use IL2CPP over Mono when available.
* **Build Settings:** Use `Smaller (faster) Builds` / `Shorter Build Time` for IL2CPP Code Generation.
* **Stripping Level:** Set `Managed Stripping Level` to `Minimal` (`Player Settings` \> `Other Settings` \> `Optimization`). (Generally not a hard requirement unless using WalletConnect as a wallet provider option.)
* **Strip Engine Code:** Make sure this is turned off.

### WebGL

* **WebGL Template:** None enforced, feel free to customize!
* **Compression Format:** Set to `Disabled` (`Player Settings` \> `Publishing Settings`) for final builds.
* **Testing WebGL Social Login Locally:** Host the build or run it locally with `Cross-Origin-Opener-Policy` set to `same-origin-allow-popups`.

Example setup for testing In-App or Ecosystem Wallet Social Login locally:

```javascript
// YourWebGLOutputFolder/server.js
const express = require("express");
const app = express();
const port = 8000;
 
app.use((req, res, next) => {
  res.header(
    "Cross-Origin-Opener-Policy",
    "same-origin-allow-popups",
  );
  next();
});
 
app.use(express.static("."));
app.listen(port, () =>
  console.log(`Server running on http://localhost:${port}`),
);
 
// run it with `node server.js`
```

No action needed for hosted builds.

### Mobile

* **EDM4U:** Comes with the package, resolves dependencies at runtime. Use `Force Resolve` from `Assets` \> `External Dependency Manager` \> `Android Resolver`.
* **Redirect Schemes:** Set custom schemes matching your bundle ID in `Plugins/Android/AndroidManifest.xml` or equivalent to ensure OAuth redirects if using social login.

```xml
<!-- Set your bundle id here -->
<!-- Replace 'com.thirdweb.unitysdk' with your desired scheme -->
<data android:scheme="com.thirdweb.unitysdk" />
```

### Troubleshooting OAuth Redirects

If you notice issues with redirects on mobile, for instance hanging after selecting an account when logging in with Google, you did not setup OAuth properly. Best practice is to use a lowercase bundle id that is the same as your Unity project's application identifier, it must be present in the following places:

* Your `ThirdwebManager` prefab `Bundle ID` field.
* Your `Plugins/AndroidManifest.xml` scheme field as mentioned above (it doesn't have to be our default `AndroidManifest.xml`, it can be in your custom one, just add the scheme).
* Your thirdweb dashboard project settings as one of:  
   * `Bundle ID Allowlist` field (those automatically added to allowed redirect URIs).  
   * In-App Wallet Configuration `Allowed redirect URIs` field.
## Getting Started

#### API Key Required

To get started with the Unity SDK, you will need to have a [thirdweb API Key](https://thirdweb.com/create-api-key) created. Make sure you allowlist a bundle ID to use within Unity native applications.

To get started, you'll need to [download and install the Unity Hub and Unity Editor](https://unity.com/download).

We recommend using the 2022 LTS version of Unity.

### Integration Steps

* #### Unity Package Download  
Download the latest thirdweb Unity SDK package from the [releases page](https://github.com/thirdweb-dev/unity/releases).
* #### Unity Package Import  
Drag and drop the package into your Unity project.
* #### Test it!  
Play around in our example `Scene_Playground` to test out the SDK!
* #### Build it!  
Refer to the [Build Instructions](https://portal.thirdweb.com/unity/v5/build-instructions), pick a target platform and build your scene!  
We support all platforms.

### Thirdweb Manager

Now you're ready to use the SDK in your own scene!

We recommend adding a [ThirdwebManager](https://portal.thirdweb.com/unity/v5/thirdwebmanager) prefab to your scene.

Navigate to `Thirdweb` \> `Runtime` \> `Unity` \> `Prefabs` and drag the `ThirdwebManager` into your scene.

Alternatively, use our handy quickstart installer from the top level `Tools > Thirdweb` menu.
## Unity SDK v4 to v5 Migration Guide

This guide outlines the migration process from thirdweb Unity SDK v4 to v5\. SDK v5 offers enhanced features and modularity, and also allows direct integration with the .NET SDK.

### Key Changes in Unity SDK v5

* **ThirdwebManager**: The `ThirdwebManager` remains the recommended entry point and offers enhanced management of wallets, contracts, and the main ThirdwebClient. However, it simply acts as a wrapper for some lower level APIs from our .NET SDK and is optional.
* **Contract Interactions**: Contract interactions are done through the `ThirdwebContract` class, which has more flexible `Prepare`, `Read` and `Write` methods. This allows for easier interaction with various chains. It also has built-in extensions for common contract types like ERC721, ERC1155, etc.
* **Wallet Management**: Wallet management has been modularized, providing more control over wallet providers simultaenously. You can instantiate wallets directly through their `Create` function or through `ThirdwebManager.Instance.ConnectWallet`.
* **Infrastructure**: An API key is required in v5 for access to thirdweb services like RPC, Storage, Account Abstraction and more. Set your client id and bundle id in your `ThirdwebManager` inspector.
* **Integration with .NET SDK**: Unity SDK v5 allows you to directly use the .NET SDK for improved flexibility, especially in contract interaction and wallet operations.

### Migration Steps

#### Update Unity SDK to v5

Start by downloading the latest version of the Unity SDK from the [releases page](https://github.com/thirdweb-dev/unity-sdk/releases). Ensure the old SDK files are removed and the new SDK is imported into your Unity project.

#### Recommendation

It's recommended to back up your project before making any major updates to avoid data loss.

#### General Guidelines

In v5, the majority of state management has been moved off the `ThirdwebManager` or `ThirdwebSDK`, no longer tying you to a specific chain or wallet at all times. The Unity SDK acts as a wrapper for the .NET SDK, providing a more user-friendly interface.

The settings that previously crowded the `ThirdwebManager` have been removed, most of these options can now be set as runtime options when connecting to a wallet or contract. This allows for more flexibility - you may instantiate as many contracts and wallets as you need, on multiple chains, and switch between them easily, or even execute multiple cross-chain transactions simultaneously.

You will find that the general structure of functions and classes are similar to v4, but the arguments and return types have been updated to be more flexible and modular.

#### ThirdwebManager

We've recreated similar APIs to v4 in v5 to make the transition easier. Anything previously under `ThirdwebManager.Instance.SDK` is now directly accessible from `ThirdwebManager.Instance` or through a static class. Review the Unity v5 and .NET SDK documentation to explore the new APIs.

```csharp
// Unity v4
var contract = ThirdwebManager.Instance.SDK.GetContract(..);
 
// Unity v5
var contract = await ThirdwebManager.Instance.GetContract(..); // now async
// or with .NET SDK
var contract = await ThirdwebContract.Create(..);
```

#### Contracts

Contract interaction has been simplified in v5\. The specific contract interfaces (e.g., ERC721, ERC1155) are now handled via `ThirdwebContract` with more flexible extension methods.

```csharp
// Unity v4
var balance = await contract.ERC1155.Balance(..);
 
// Unity v5
var balance = await contract.ERC1155_Balance(..);
 
// contract.Prepare, contract.Read, contract.Write, etc. are available and take in a chain id
```

#### Wallets

In v5, wallets are more modular. You can connect to multiple wallets simultaneously and switch between them easily.

```csharp
// Unity v4
var connection = new WalletConnection(..);
var address = await ThirdwebManager.Instance.SDK.Wallet.Connect(connection);
 
// Unity v5
var options = new WalletOptions(..);
var wallet = await ThirdwebManager.Instance.ConnectWallet(options);
// or instantiate the wallet directly with .NET SDK
var wallet = await PrivateKeyWallet.Create(..);
 
// Extensions for common wallet operations are available
var address = await wallet.GetAddress();
```

#### Storage

v5 requires an API key for storage and RPC services. You can generate an API key from the thirdweb dashboard and integrate it into your Unity project.

```csharp
// Unity v4
var data = await ThirdwebManager.Instance.SDK.Storage.DownloadText<string>("{{text_uri}}");
 
// Unity v5
var data = await ThirdwebStorage.Download<string>("{{text_uri}}");
```

### UI

If you were using our example prefabs from v4 in production, you may need to back them up as they have been removed from v5\. You can still use them as a reference to create your own prefabs in v5.

You may choose to adapt their code to v5 or recreate your own UI and use the new APIs we offer.

Generally, for a wallet connect button, all you need is to call `var wallet = await ThirdwebManager.Instance.ConnectWallet` with the appropriate options.

You can then display the balance using `await wallet.GetBalance` or other extension methods. `Utils.GetChainMetadata` will help find native token symbols and more, dynamically.

New production ready prefabs will be available in future releases.

#### Full Reference

The [.NET SDK Documentation](https://portal.thirdweb.com/dotnet) provides a comprehensive reference for all classes and methods available in the Unity SDK v5.
## Thirdweb Manager

The `ThirdwebManager` is a prefab that provides a convenient way to instantiate the [ThirdwebClient](https://portal.thirdweb.com/dotnet/client), and contains helper functions to create contracts and wallets. Add the prefab to your scene and the client will persist throughout your game's lifecycle, keeping track of your connected wallets.

It is entirely optional, and you can opt to use the [.NET SDK](https://portal.thirdweb.com/dotnet) directly if you prefer to do so.

If you are wrapping the SDK, we recommend making your own Manager inspired by `ThirdwebManager.cs`, specifically for `ThirdwebClient` initialization.

### Configuration

Configure `ThirdwebManager` through the Unity Inspector window.

Below is a list of all the settings you can adjust.

#### Client

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fthirdwebmanager_client.934bea30.png&w=1920&q=75)

This section involves the required thirdweb client settings to configure the SDK:

* `Client ID`: Thirdweb [API Key](https://thirdweb.com/create-api-key). Used to access thirdweb services such as RPC, Storage, and Account Abstraction.
* `Bundle ID`: The bundle ID used to access thirdweb services from native platforms. Should be the same as the bundle ID in your Unity project, e.g., `com.companyname.gamename`.
* `Create API Key`: A link to create a new API key if you don't have one.

#### Preferences

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fthirdwebmanager_preferences.83c36717.png&w=1920&q=75)

This section allows you to define the default preferences for the SDK:

* `Initialize On Awake`: Whether the SDK should initialize on awake or not. If not, you can call `ThirdwebManager.Instance.Initialize()` to initialize it manually.
* `Show Debug Logs`: Whether to show thirdweb SDK debug logs.
* `Auto-Connect Last Wallet`: If enabled, we will automatically connect to the last connected wallet on initialization (this behavior does not apply to the WalletConnectWallet provider option). If a wallet was connected as a non smart wallet, then later upgraded, the smart wallet is saved as the last wallet, and the next session will autoconnect to the smart wallet. Any failure during this entire flow should not throw.

#### Miscellaneous

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fthirdwebmanager_misc.94a0f038.png&w=1920&q=75)

This section allows you to customize the SDK's behavior:

* `RPC Overrides`: A list of RPC overrides to use when connecting to a chain. You can bypass using thirdweb's RPC that way (not recommended).
* `OAuth Redirect Page HTML Override`: Raw HTML to override the default redirect page when connecting to `InAppWallet` or `EcosystemWallet` providers.
* `WalletConnect Supported Chains`: A list of chains that the wallets should be able to connect to by default when using `WalletConnect` as a wallet provider.
* `WalletConnect Included Wallet IDs`: A list of wallet IDs that should be included in the WalletConnect modal by default (optional override).

#### Debug

![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fthirdwebmanager_debug.76611661.png&w=1920&q=75)

This section allows you to find helpful information:

* `Log Active Wallet Info`: Logs the active (last connected) wallet's information such as its address.
* `Open Documentation`: Opens the thirdweb SDK documentation in your default browser.

### Interacting with the ThirdwebManager

Once your `ThirdwebManager` is set up, you can interact with it using the following methods:

#### Initialize (If not set to `Initialize On Awake`)

```csharp
ThirdwebManager.Instance.Initialize();
```

Initializes the SDK with the settings specified in the Unity Inspector.

#### GetContract

```csharp
var contract = await ThirdwebManager.Instance.GetContract("contract-address", chainId, "optional-contract-abi");
var result = await contract.Read<string>("name");
```

Returns a [ThirdwebContract](https://portal.thirdweb.com/dotnet/contracts/create) instance that can be used to interact with a smart contract.

#### ConnectWallet

```csharp
var walletOptions = new WalletOptions(WalletProvider.PrivateKeyWallet, 421614);
var wallet = await ThirdwebManager.Instance.ConnectWallet(walletOptions);
var address = await wallet.GetAddress();
```

Connects a wallet based on the specified `WalletOptions` and returns an `IThirdwebWallet` instance that can be used to interact with the blockchain.

#### UpgradeToSmartWallet

```csharp
var smartWallet = await ThirdwebManager.Instance.UpgradeToSmartWallet(wallet, chainId, smartWalletOptions);
```

Upgrades the specified wallet to a `SmartWallet`, returning a `SmartWallet` instance.

#### LinkAccount

```csharp
var linkedAccounts = await ThirdwebManager.Instance.LinkAccount(mainWallet, walletToLink, otp, chainId, jwtOrPayload);
```

Links another `InAppWallet` or `EcosystemWallet` account to the main wallet and returns a list of linked accounts, allowing you to login with either authentication method later.

#### GetActiveWallet

```csharp
var wallet = ThirdwebManager.Instance.GetActiveWallet();
```

Returns the currently active wallet as an `IThirdwebWallet`.

#### SetActiveWallet

```csharp
ThirdwebManager.Instance.SetActiveWallet(wallet);
```

Sets the specified wallet as the active wallet.

#### GetWallet

```csharp
var wallet = ThirdwebManager.Instance.GetWallet("wallet-address");
```

Returns a wallet from the manager's wallet mapping by its address.

#### AddWallet

```csharp
var wallet = await ThirdwebManager.Instance.AddWallet(wallet);
```

Adds a wallet to the manager's wallet mapping and returns the added wallet.

#### RemoveWallet

```csharp
ThirdwebManager.Instance.RemoveWallet("wallet-address");
```

Removes a wallet from the manager's wallet mapping by its address.

### Child Prefabs

#### DefaultOTPModal

The helper modal that is displayed when using the `ThirdwebManager`'s `ConnectWallet` function with an auth method that requires an OTP, such as Email or Phone login.

It can be replaced with a custom modal that extends `AbstractOTPVerifyModal` to customize the OTP verification process.

#### WalletConnectModal

The `WalletConnectModal` prefab is an out-of-the-box WalletConnect modal that can be used to connect to 400+ wallets.

It will be automatically activated when connecting to a `WalletConnect` provider.

### What Now?

Explore the [.NET SDK](https://portal.thirdweb.com/dotnet) to learn more about interacting with smart contracts, wallets, storage, RPC, account abstraction, and more.
## InAppWallet

`InAppWallet` is the ultimate persistent wallet provider option for your game. It supports email, phone, social and custom authentication schemes, and will persist across devices, platforms, and other SDKs.

It makes for a fantastic [SmartWallet](https://portal.thirdweb.com/unity/v5/wallets/account-abstraction) admin/signer and will make sure your users can have the same wallet address across all your games, apps and blockchains.

### Login Methods

In-App Wallets support a variety of login methods:

* Email (OTP Login)
* Phone (OTP Login)
* Socials (Google, Apple, Facebook, Telegram, Farcaster, Line, Github, Twitch, Steam etc.)
* Custom Auth (OIDC Compatible)
* Custom Auth (Generic Auth Endpoint)
* Guest (Onboard easily, link other accounts later)
* Backend (Server Wallets)
* Siwe (Login with a seperate wallet supported by the SDK)
* SiweExternal (Login with an external wallet that only supports web using a browser loading a static thirdweb React page temporarily)

#### Login with Email

```csharp
var inAppWalletOptions = new InAppWalletOptions(email: "myepicemail@domain.id");
var options = new WalletOptions(
    provider: WalletProvider.InAppWallet, 
    chainId: 1, 
    inAppWalletOptions: inAppWalletOptions
);
var wallet = await ThirdwebManager.Instance.ConnectWallet(options);
```

Will instantiate `InAppWalletModal` or resume the session - a simple prefab that will verify the user OTP.

#### Login with Phone

```csharp
var inAppWalletOptions = new InAppWalletOptions(phoneNumber: "+1234567890");
var options = new WalletOptions(
    provider: WalletProvider.InAppWallet, 
    chainId: 1, 
    inAppWalletOptions: inAppWalletOptions
);
var wallet = await ThirdwebManager.Instance.ConnectWallet(options);
```

Will instantiate `InAppWalletModal` or resume the session - a simple prefab that will verify the user OTP.

#### Login with Socials (Google, Apple, Facebook, etc.)

```csharp
var inAppWalletOptions = new InAppWalletOptions(authprovider: AuthProvider.Google);
var options = new WalletOptions(
    provider: WalletProvider.InAppWallet, 
    chainId: 1, 
    inAppWalletOptions: inAppWalletOptions
);
var wallet = await ThirdwebManager.Instance.ConnectWallet(options);
```

Will open a native browser or oauth session to authenticate the user and redirect back to the game.

#### Login with Siwe

```csharp
var inAppWalletOptions = new InAppWalletOptions(authprovider: AuthProvider.Siwe, siweSigner: sdkSupportedExternalWallet);
var options = new WalletOptions(
    provider: WalletProvider.InAppWallet, 
    chainId: 1, 
    inAppWalletOptions: inAppWalletOptions
);
var wallet = await ThirdwebManager.Instance.ConnectWallet(options);
```

Will use a separate wallet to sign a message and login to the InAppWallet.

#### Login with SiweExternal

```csharp
var inAppWalletOptions = new InAppWalletOptions(authprovider: AuthProvider.SiweExternal)
var options = new WalletOptions(
    provider: WalletProvider.InAppWallet,
    chainId: 421614,
    inAppWalletOptions: inAppWalletOptions
);
var wallet = await ConnectWallet(inAppWalletOptions);
```

Will open a browser and load a static thirdweb React page to authenticate the user and redirect back to the game. You can pass `forceSiweExternalWalletIds` to force the page to use one or more wallets.

Example:

```csharp
var inAppWalletOptions = new InAppWalletOptions(
    authprovider: AuthProvider.SiweExternal,
    forceSiweExternalWalletIds: new List<string> { "xyz.abs" });
```

#### Login with Custom Auth - OIDC Compatible

```csharp
var inAppWalletOptions = new InAppWalletOptions(authprovider: AuthProvider.JWT, jwtOrPayload: "myjwt");
var options = new WalletOptions(
    provider: WalletProvider.InAppWallet, 
    chainId: 1, 
    inAppWalletOptions: inAppWalletOptions
);
var wallet = await ThirdwebManager.Instance.ConnectWallet(options);
```

#### Login with Custom Auth - Generic Auth Endpoint

```csharp
var inAppWalletOptions = new InAppWalletOptions(
    authprovider: AuthProvider.AuthEndpoint, 
    jwtOrPayload: "mypayload"
);
var options = new WalletOptions(
    provider: WalletProvider.InAppWallet, 
    chainId: 1, 
    inAppWalletOptions: inAppWalletOptions
);
var wallet = await ThirdwebManager.Instance.ConnectWallet(options);
```

#### Login with Guest - Onboard easily, link other accounts later

```csharp
var inAppWalletOptions = new InAppWalletOptions(
    authprovider: AuthProvider.Guest
);
var options = new WalletOptions(
    provider: WalletProvider.EcosystemWallet, 
    chainId: 1, 
    inAppWalletOptions: inAppWalletOptions
);
var wallet = await ThirdwebManager.Instance.ConnectWallet(options);
```

#### Login with Backend - Server Wallets

```csharp
var inAppWalletOptions = new InAppWalletOptions(
    authprovider: AuthProvider.Backend, 
    walletSecret: "very-secret"
);
var options = new WalletOptions(
    provider: WalletProvider.InAppWallet, 
    chainId: 1, 
    inAppWalletOptions: inAppWalletOptions
);
var wallet = await ThirdwebManager.Instance.ConnectWallet(options);
```

### Account Linking

InAppWallets support linking multiple authentication methods to a single wallet, for instance linking Google to your Email-based In-App-Wallet. This is useful to have a unified identity across platforms.

```csharp
// Your main InAppWallet account, already authenticated and connected
InAppWallet mainInAppWallet = ...
 
// An InAppWallet with a new auth provider to be linked to the main account, not connected
InAppWallet walletToLink = await InAppWallet.Create(client: Client, authProvider: AuthProvider.Telegram);
 
// Link Account - Headless version
var linkedAccounts = await mainInAppWallet.LinkAccount(walletToLink: walletToLink);
 
// Link Account - Unity wrapper version
var linkedAccounts = await ThirdwebManager.Instance.LinkAccount(mainInAppWallet, walletToLink);
 
// You can also fetch linked accounts at any time
List<LinkedAccount> linkedAccounts = await mainInAppWallet.GetLinkedAccounts();
 
// Unlink an account
List<LinkedAccount> linkedAccounts = await mainInAppWallet.UnlinkAccount(linkedAccounts[0]);
```
## SmartWallet

Instantiate or upgrade any other wallet to a `SmartWallet` to enable advanced blockchain interactions, including gasless transactions through Account Abstraction (ERC4337 as well as ZkSync Native AA).

Account Abstraction is a system that turns any personal wallet into a smart wallet, allowing you to sponsor gas for your users and unlocking advanced permissioning features that allow for seamless user onboarding, gasless transactions, automation and more.

We recommend using Smart Wallets as the primary wallet type for your users.

#### Connecting to a Smart Wallet directly

```csharp
var smartWalletOptions = new SmartWalletOptions(sponsorGas: true)
var options = new WalletOptions(..., smartWalletOptions: smartWalletOptions);
var wallet = await ThirdwebManager.Instance.ConnectWallet(options);
```

#### Upgrading an existing wallet to a Smart Wallet

```csharp
var smartWalletOptions = new SmartWalletOptions(sponsorGas: true)
var smartWallet = await ThirdwebManager.Instance.UpgradeToSmartWallet(
    personalWallet: myExistingIThirdwebWallet, 
    chainId: 1, 
    smartWalletOptions: smartWalletOptions
);
```
## MetaMaskWallet

`MetaMaskWallet` is the most popular external wallet provider that allows users to connect their MetaMask wallet to your game.

This connection method allows you to connect to the browser extension and is only available for WebGL builds.

Use [WalletConnectWallet](https://portal.thirdweb.com/unity/v5/wallets/walletconnect) if you are building for standalone or mobile runtime platforms.

#### Connecting using MetaMask

```csharp
var options = new WalletOptions(provider: WalletProvider.MetaMaskWallet, chainId: 1);
var wallet = await ThirdwebManager.Instance.ConnectWallet(options);
```

Will prompt the user to connect their MetaMask browser extension to your game.
## PrivateKeyWallet

`PrivateKeyWallet` is best used as a guest wallet. Should be treated as ephemereal, useful for testing.

#### Generating a PrivateKeyWallet

```csharp
var options = new WalletOptions(provider: WalletProvider.PrivateKeyWallet, chainId: 1);
var wallet = await ThirdwebManager.Instance.ConnectWallet(options);
```
## EcosystemWallet

`EcosystemWallet` is the ultimate persistent wallet provider option for your game. It supports email, phone, social and custom authentication schemes, and will persist across devices, platforms, and other SDKs.

It makes for a fantastic [SmartWallet](https://portal.thirdweb.com/unity/v5/wallets/account-abstraction) admin/signer and will make sure your users can have the same wallet address across all your games, apps and blockchains.

Ecosystem Wallets have a very similar API to the [In-App Wallet](https://portal.thirdweb.com/unity/v5/wallets/in-app-wallet) but with the added benefit of being able to share your wallets with ecosystem partners through special identifiers that they can use, preserving the user's identity across not only your apps and games, but other ecosystem partners' as well. It is secure, easy to use, and use enclave technology to protect your user's data. All examples below can take in an `ecosystemPartnerId` if you are the ecosystem partner integrating with a third-party ecosystem.

### Login Methods

Ecosystem Wallets support a variety of login methods:

* Email (OTP Login)
* Phone (OTP Login)
* Socials (Google, Apple, Facebook, Telegram, Farcaster, Line, Github, Twitch, Steam etc.)
* Custom Auth (OIDC Compatible)
* Custom Auth (Generic Auth Endpoint)
* Guest (Onboard easily, link other accounts later)
* Backend (Server Wallets)
* Siwe (Login with a seperate wallet supported by the SDK)
* SiweExternal (Login with an external wallet that only supports web using a browser loading a static thirdweb React page temporarily)

#### Login with Email

```csharp
var ecosystemWalletOptions = new EcosystemWalletOptions(
    ecosystemId: "ecosystem.your-ecosystem", 
    email: "myepicemail@domain.id"
);
var options = new WalletOptions(
    provider: WalletProvider.EcosystemWallet, 
    chainId: 1, 
    ecosystemWalletOptions: ecosystemWalletOptions
);
var wallet = await ThirdwebManager.Instance.ConnectWallet(options);
```

Will instantiate `EcosystemWalletModal` or resume the session - a simple prefab that will verify the user OTP.

#### Login with Phone

```csharp
var ecosystemWalletOptions = new EcosystemWalletOptions(
    ecosystemId: "ecosystem.your-ecosystem", 
    phoneNumber: "+1234567890"
);
var options = new WalletOptions(
    provider: WalletProvider.EcosystemWallet, 
    chainId: 1, 
    ecosystemWalletOptions: ecosystemWalletOptions
);
var wallet = await ThirdwebManager.Instance.ConnectWallet(options);
```

Will instantiate `EcosystemWalletModal` or resume the session - a simple prefab that will verify the user OTP.

#### Login with Socials (Google, Apple, Facebook, etc.)

```csharp
var ecosystemWalletOptions = new EcosystemWalletOptions(
    ecosystemId: "ecosystem.your-ecosystem", 
    authprovider: AuthProvider.Google
);
var options = new WalletOptions(
    provider: WalletProvider.EcosystemWallet, 
    chainId: 1, 
    ecosystemWalletOptions: ecosystemWalletOptions
);
var wallet = await ThirdwebManager.Instance.ConnectWallet(options);
```

Will open a native browser or oauth session to authenticate the user and redirect back to the game.

#### Login with SIWE

```csharp
var ecosystemWalletOptions = new EcosystemWalletOptions(
    ecosystemId: "ecosystem.your-ecosystem", 
    authprovider: AuthProvider.Siwe, 
    siweSigner: anyExternalWallet
);
var options = new WalletOptions(
    provider: WalletProvider.EcosystemWallet, 
    chainId: 1,
    ecosystemWalletOptions: ecosystemWalletOptions
);
var wallet = await ThirdwebManager.Instance.ConnectWallet(options);
```

Will use the external wallet to sign a message and login to the EcosystemWallet.

#### Login with SiweExternal

```csharp
var ecosystemWalletOptions = new EcosystemWalletOptions(ecosystemId: "ecosystem.your-ecosystem", authprovider: AuthProvider.SiweExternal)
var options = new WalletOptions(
    provider: WalletProvider.EcosystemWallet,
    chainId: 421614,
    ecosystemWalletOptions: ecosystemWalletOptions
);
var wallet = await ConnectWallet(options);
```

Will open a browser and load a static thirdweb React page to authenticate the user and redirect back to the game. You can pass `forceSiweExternalWalletIds` to force the page to use one or more wallets.

Example:

```csharp
var ecosystemWalletOptions = new EcosystemWalletOptions(
    ecosystemId: "ecosystem.your-ecosystem",
    authprovider: AuthProvider.SiweExternal,
    forceSiweExternalWalletIds: new List<string> { "xyz.abs" });
```

#### Login with Custom Auth - OIDC Compatible

```csharp
var ecosystemWalletOptions = new EcosystemWalletOptions(
    ecosystemId: "ecosystem.your-ecosystem", 
    authprovider: AuthProvider.JWT, 
    jwtOrPayload: "myjwt"
);
var options = new WalletOptions(
    provider: WalletProvider.EcosystemWallet, 
    chainId: 1, 
    ecosystemWalletOptions: ecosystemWalletOptions
);
var wallet = await ThirdwebManager.Instance.ConnectWallet(options);
```

#### Login with Custom Auth - Generic Auth Endpoint

```csharp
var ecosystemWalletOptions = new EcosystemWalletOptions(
    ecosystemId: "ecosystem.your-ecosystem", 
    authprovider: AuthProvider.AuthEndpoint, 
    jwtOrPayload: "mypayload"
);
var options = new WalletOptions(
    provider: WalletProvider.EcosystemWallet, 
    chainId: 1, 
    ecosystemWalletOptions: ecosystemWalletOptions
);
var wallet = await ThirdwebManager.Instance.ConnectWallet(options);
```

#### Login with Guest - Onboard easily, link other accounts later

```csharp
var ecosystemWalletOptions = new EcosystemWalletOptions(
    ecosystemId: "ecosystem.your-ecosystem", 
    authprovider: AuthProvider.Guest
);
var options = new WalletOptions(
    provider: WalletProvider.EcosystemWallet, 
    chainId: 1, 
    ecosystemWalletOptions: ecosystemWalletOptions
);
var wallet = await ThirdwebManager.Instance.ConnectWallet(options);
```

#### Login with Backend - Server Wallets

```csharp
var ecosystemWalletOptions = new EcosystemWalletOptions(
    ecosystemId: "ecosystem.your-ecosystem",
    authprovider: AuthProvider.Backend, 
    walletSecret: "very-secret"
);
var options = new WalletOptions(
    provider: WalletProvider.EcosystemWallet, 
    chainId: 1, 
    ecosystemWalletOptions: ecosystemWalletOptions
);
var wallet = await ThirdwebManager.Instance.ConnectWallet(options);
```

### Account Linking

EcosystemWallets support linking multiple authentication methods to a single wallet, for instance linking Google to your Email-based In-App-Wallet. This is useful to have a unified identity across platforms.

```csharp
// Your main EcosystemWallet account, already authenticated and connected
EcosystemWallet mainEcosystemWallet = ...
 
// An EcosystemWallet with a new auth provider to be linked to the main account, not connected
EcosystemWallet walletToLink = await EcosystemWallet.Create(client: Client, ecosystemId: "ecosystem.your-ecosystem", authProvider: AuthProvider.Telegram);
 
// Link Account - Headless version
var linkedAccounts = await mainEcosystemWallet.LinkAccount(walletToLink: walletToLink);
 
// Link Account - Unity wrapper version
var linkedAccounts = await ThirdwebManager.Instance.LinkAccount(mainEcosystemWallet, walletToLink);
 
// You can also fetch linked accounts at any time
List<LinkedAccount> linkedAccounts = await mainEcosystemWallet.GetLinkedAccounts();
 
// Unlink an account
List<LinkedAccount> linkedAccounts = await mainEcosystemWallet.UnlinkAccount(linkedAccounts[0]);
```
## WalletConnectWallet

`WalletConnectWallet` is a wallet provider that allows users to connect any of 400+ external wallets.

It uses the [WalletConnect](https://explorer.walletconnect.com/) protocol.

#### Connecting using WalletConnect

```csharp
var options = new WalletOptions(provider: WalletProvider.WalletConnectWallet, chainId: 1);
var wallet = await ThirdwebManager.Instance.ConnectWallet(options);
```

Will instantiate `WalletConnectModal` \- an out-of-the-box WalletConnect modal that can be used to connect to 400+ wallets.

Make sure you have any chains you want to connect to added to your [ThirdwebManager](https://portal.thirdweb.com/unity/v5/thirdwebmanager) prefab.
## Unity SDK

The best Unity SDK to build cross-platform games on any EVM blockchain.

Connect to user’s wallets, interact with smart contracts, sign messages, and utilize common standards such as tokens, NFTs, marketplaces; all with built-in RPC URLs, IPFS gateways, Account Abstraction and more.

Unity SDK

Unity SDK is open-source. View and contribute to its source code on GitHub.

[GitHubView on GitHub](https://github.com/thirdweb-dev/unity)

### Installation

The Unity SDK is distributed as an [Asset Package](https://docs.unity3d.com/Manual/AssetPackages.html) allowing you to view and edit the source code.

It also wraps our open-source gaming-focused [.NET SDK](https://github.com/thirdweb-dev/dotnet) making version updates extremely simple containing a single DLL filechange.

You can download the latest version of the SDK from our [GitHub releases page](https://github.com/thirdweb-dev/unity-sdk/releases).

### Get Started

Check out the [getting started](https://portal.thirdweb.com/unity/v5/getting-started) guide to learn how to use the SDK in less than 2 minutes.

### Examples
## Engine

### Contract Interaction

#### Read Contract

Call the Read Contract endpoint on an engine instance.

#### Write Contract

Call the Write Contract endpoint on an engine instance.

#### Get Transaction Status

Get the transaction Status of a queue id from an engine instance.

#### Get Transaction Receipt

Get the transaction receipt of a transaction hash from a chain.
## Smart Wallets

#### Create Smart Wallet

Creates an in-app email wallet.

#### Is Deployed

Checks if the smart wallet is deployed.

#### Create Session Key

Creates a session key for the smart wallet.

#### Get Admins

Retrieves the list of admins for the smart wallet.

#### Get Active Signers

Retrieves the list of active signers for the smart wallet.

#### Is Active Signer

Checks to see if a specific signer is valid

#### Revoke Session Key

Revokes a session key for a smart wallet signer.

#### Add Admin

Adds an admin signer to the smart wallet.

#### Remove Admin

Removes an admin signer from the smart wallet.
## In-App Wallets

#### Create Wallet

Creates an in-app wallet based on inputs.

#### Sign In

Sign in, passing the required input if OTP, JWT, or Auth Endpoint

#### Link Wallet

Link a new auth method with a created - but never signed in - wallet

### OTP

#### Send OTP

Sends an OTP for the in-app wallet.

### OAuth

#### Fetch OAuth login link

Fetches the OAuth login link for the in-app wallet.

### Utilities

#### Is Connected

Checks if the wallet handle is connected to a session. boolean and macro variants

#### Disconnect

Disconnects the wallet handle from its session.
## Blueprint Overview

All blueprint facing nodes are contained within the `UThirdwebFunctionLibrary` class. It provides a comprehensive set of Blueprint functions to interact with Thirdweb's wallet functionalities within Unreal Engine. This includes utilities for wallet creation, session management, signing messages, and more.

### Internal Implementation Notes

* The `BP_` function prefix is an unreal engine standard designed to ensure c++ developers do not use functions intended for blueprint use
* The `Conv_` function prefix is an unreal engine required convention to detect autocast nodes
* All operator function prefixes are an unreal engine convention required to detect standard operator node wildcards
## Utilities

#### Sign Message

Signs a message with the specified wallet handle.

#### To Text/String

Signs a message with the specified wallet handle.

#### Is Valid Address

Checks the validity of the address

#### Is Checksummed Address

Signs a message with the specified wallet handle.

#### To Checksummed Address

Signs a message with the specified wallet handle.

#### Is Valid

Signs a message with the specified wallet handle.

#### Equality

Native equality/inequality operators

#### Zero Address

Constant zero address

#### OAuth Provider to String/Text

Convert an EThirdwebOAuthProvider to string/text

#### String/Text to OAuth Provider

Convert string/text to an EThirdwebOAuthProvider
## Common

`ThirdwebCommon` defines several common enums and structs that are used across the Thirdweb Unreal Engine SDK. They represent various states and outcomes for operations related to wallets, smart contracts, and authentication providers.

### Enums

#### **EFunctionResult**

Represents the result of a generic function call.

* `Success`: The operation completed successfully.
* `Failed`: The operation failed.

#### **ESmartWalletDeployedFunctionResult**

Represents the deployment status of a smart wallet.

* `Deployed`: The smart wallet is deployed.
* `NotDeployed`: The smart wallet is not deployed.
* `Failed`: The check for deployment status failed.

#### **EOTPVerificationFunctionResult**

Represents the result of an OTP (One-Time Password) verification.

* `Verified`: The OTP was successfully verified.
* `Retry`: The OTP verification failed, but can be retried.
* `Failed`: The OTP verification failed with no retry available.

#### **EThirdwebOAuthProvider**

* Represents the supported OAuth providers.
* `Google`: Represents Google as an OAuth provider.
* `Apple`: Represents Apple as an OAuth provider.
* `Facebook`: Represents Facebook as an OAuth provider.
* `Discord`: Represents Discord as an OAuth Provider.
* `Farcaster`: Represents Farcaster as an OAuth Provider.
* `Telegram`: Represents Telegram as an OAuth Provider.
* `Line`: Represents Line as an OAuth Provider.
* `X`: Represents X as an OAuth Provider.
* `Coinbase`: Represents Coinbase as an OAuth Provider.

#### **EThirdwebOTPMethod**

* Represents the supported OTP authentication methods.
* `Email`: Email authentication.
* `Phone`: Phone Authentication.

### Structs

#### FSigner

`FSigner` represents a signer in the context of a smart wallet within the Thirdweb SDK. The signer is responsible for signing transactions and managing the approval of targets and limits on native tokens.

##### Properties

* `Address`: The Ethereum address of the signer.
* `ApprovedTargets`: An array of approved contract addresses that the signer is allowed to interact with.
* `NativeTokenLimitPerTransaction`: The limit of native tokens (e.g. ETH) that can be spent per transaction.
* `StartTime`: The start time for the signer's permissions, specified as a `FDateTime`.
* `EndTime`: The end time for the signer's permissions, specified as a `FDateTime`.

##### Class Functions

* `FromJson(JsonObject)`: create an `FSigner` instance from a JSON object.
## Runtime Settings

`ThirdwebRuntimeSettings` provides configuration settings for the Thirdweb SDK within Unreal Engine. These settings are used by the SDK to manage essential information like client credentials and storage paths.

The runtime settings are located in `Edit > Project Settings > Engine > Thirdweb`. You can also access the settings by clicking the thirdweb logo on your Editor action bar, or manually in `DefaultEngine.ini`.

### **Properties**

* `ClientID`: The client ID used to authenticate with Thirdweb services.
* `BundleID`: The bundle ID associated with the application.
* `EncryptionKey`: Required if using custom auth methods via standard InApp wallets (Non-Ecosystem).
* `EngineSigners`: Optional array of engine signers stored globally for convenience
* `EcosystemId`: Ecosystem Wallet Identifier tied to your Thirdweb Ecosystem account. Only relevant when using Ecosystem Wallets. e.g. `ecosystem.my-cool-game`
* `bSendAnalytics`: Opt in or out of connect analytics.
* `bOverrideOAuthBrowserProviderBackends`: Edit Condition for overriding OAuth browser Provider backends
* `OAuthBrowserProviderBackendOverrides`: Array of OAuth provider backend methods that can be overridden

#### Configuration Requirements

`ClientID` \+ `BundleID` are required for authentication with Thirdweb services.`EcosystemId` is required if using ecosystem wallets

#### Class Functions

* **`Get()`**: Retrieve the current `UThirdwebRuntimeSettings` instance.
* **`GetThirdwebGlobalEngineSigners()`**: Retrieve the `EngineSigners` array.
* **`GetThirdwebGlobalEngineSigner(bFound)`**: Retrieve the first Engine Signer from the `EngineSigners` array, if any.
* **`GetEncryptionKey()`**: Static accessor to get `EncryptionKey`
* **`GetStorageDirectory()`**: Static accessor to retrieve the absolute path of the thirdweb InAppWallet platform save directory
* **`IsExternalOAuthBackend(Provider)`**: Static accessor to get the resolved backend of an OAuth provider
* **`GetEcosystemId()`**: Static accessor to get `EcosystemId`
* **`IsEcosystem()`**: Static accessor to check `EcosystemId` validity
* **`GetClientId()`**: Static accessor to get `ClientID`
* **`GetBundleId()`**: Static accessor to get `BundleId`
* **`AnalyticsEnabled()`**: Static accessor to check Analytics Opt-In status
## ThirdwebUtils

The `ThirdwebUtils` namespace provides a set of utility functions for class-agnostic use.

### Validation Functions

* `IsChecksummedAddress(Address)`: Checks if the provided Ethereum address is checksummed.
* `IsValidAddress(Address)`: Checks if the provided Ethereum address is valid.
* `IsValidPrivateKey(PrivateKey)`: Determines if the provided string is a valid private key.
* `ToChecksummedAddress(Address)`: Converts the provided Ethereum address to a checksummed address.

### Conversion Functions

* `ToText(Provider)`: Converts an [EThirdwebOAuthProvider](https://portal.thirdweb.com/unreal/cpp/common#ethirdweboauthprovider) enum value to its corresponding FText representation.
* `ToString(Provider)`: Converts an [EThirdwebOAuthProvider](https://portal.thirdweb.com/unreal/cpp/common#ethirdweboauthprovider) enum value to its string representation.
## WalletHandle

`FWalletHandle` is the base struct that provides a unique handle for distinguishing different types of wallets in the Thirdweb SDK. It supports a variety of shared operations and is not used directly, but rather inherited.

### Enums

#### EWalletHandleType

Wallet handle type identifier.

* `InvalidHandle`: Represents an uninitialized or invalid handle.
* `InApp`: Represents an in-app wallet.
* `Smart`: Represents a smart contract wallet.

### Member Functions

* **`IsValid()`**: Checks if the wallet handle is valid.
* **`Invalidate()`**: Invalidates the wallet handle, setting its ID to zero and marking its type as invalid.
* **`ToAddress()`**: Retrieves the wallet address associated with this handle.
* **`Sign(Message)`**: Sign a message using the wallet handle.
* **`GetType()`**: Get the type of wallet handle.
* **`GetID()`**: Gets the ID of the wallet handle.
* **`GetDisplayName()`**: Retrieves the debug display name of the wallet handle.
* **`GetTypeString()`**: Retrieves the type of the wallet handle as a string.

### Operators

* **`operator==`**: Compares two wallet handles for equality.
* **`operator!=`**: Compares two wallet handles for inequality.

## InAppWalletHandle

`FInAppWalletHandle` provides a unique handle for InApp wallets. It supports a variety of operations for authentication.

### Enums

#### EInAppSource

Source that created the InApp wallet

* `InvalidSource`: Represents an uninitialized or invalid source.
* `OAuthProvider`: Represents an OAuth provider source.
* `Email`: Represents an email source.
* `Phone`: Represents a phone source.
* `Jwt`: Represents a JWT source.
* `AuthEndpoint`: Represents an auth endpoint source.
* `Guest`: Represents a guest source.

### Member Functions

* **`CreateEmailWallet(Email, Wallet, Error)`**: Creates an in-app email wallet.
* **`CreateEcosystemEmailWallet(PartnerId, Email, Wallet, Error)`**: Creates an ecosystem email wallet.
* **`CreateOAuthWallet(Provider, Wallet, Error)`**: Creates an in-app OAuth wallet using the specified provider.
* **`CreateEcosystemOAuthWallet(PartnerId, Provider, Wallet, Error)`**: Creates an ecosystem OAuth wallet using the specified provider.
* **`CreatePhoneWallet(Phone, Wallet, Error)`**: Creates an in-app phone wallet.
* **`CreateEcosystemPhoneWallet(PartnerId, Phone, Wallet, Error)`**: Creates an ecosystem phone wallet.
* **`CreateJwtWallet(Wallet, Error)`**: Creates an in-app JWT wallet.
* **`CreateEcosystemJwtWallet(PartnerId, Wallet, Error)`**: Creates an ecosystem JWT wallet.
* **`CreateAuthEndpointWallet(Wallet, Error)`**: Creates an in-app wallet using an authentication endpoint.
* **`CreateEcosystemAuthEndpointWallet(PartnerId, Wallet, Error)`**: Creates an ecosystem wallet using an authentication endpoint.
* **`CreateGuestWallet(Email, Wallet, Error)`**: Creates an in-app guest wallet.
* **`CreateEcosystemGuestWallet(PartnerId, Email, Wallet, Error)`**: Creates an ecosystem guest wallet.
* **`IsConnected()`**: Checks if the wallet is connected to a session.
* **`Disconnect()`**: Disconnects a wallet from a session.
* **`VerifyOTP(Method, OTP, Error)`**: Verifies an OTP for in-app wallets.
* **`SendOTP(Method, Error)`**: Sends an OTP for in-app wallets.
* **`FetchOAuthLoginURL(RedirectUrl, LoginLink, Error)`**: Fetches the OAuth login URL for in-app wallets.
* **`SignInWithOAuth(AuthResult, Error)`**: Signs in using OAuth authentication details.
* **`SignInWithJwt(Jwt, Error)`**: Signs in using a JSON Web Token (JWT).
* **`SignInWithAuthEndpoint(Jwt, Error)`**: Signs in using any payload.
* **`SignInWithGuest(Error)`**: Signs in as an anonymous guest user using a semi-reproducible device fingerprint. Fingerprints can change from update to update and should not be relied upon for long term use.
* **`GetSourceString()`**: Retrieves the source as an `FString`.
* **`GetSourceString(Source)`**: Retrieves the specified source as an `FString`.
* **`GetOAuthProvider()`**: Retrieves the configured OAuth provider.

## SmartWalletHandle

`FSmartWalletHandle` provides a unique handle for smart wallets. It supports a variety of operations for handling sessions, and interacting with smart contract wallets.

### Member Functions

* **`Create(InInAppWallet, ChainID, bGasless, Factory, AccountOverride, bSuccess, Error)`**: Creates a smart wallet.
* **`IsDeployed(bDeployed, Error)`**: Checks if the smart wallet is deployed.
* **`CreateSessionKey(Signer, ApprovedTargets, NativeTokenLimitPerTransactionInWei, PermissionStart, PermissionEnd, RequestValidityStart, RequestValidityEnd, TransactionHash, Error)`**: Creates a session key for a smart wallet.
* **`RevokeSessionKey(Signer, Error)`**: Revokes a session key for a smart wallet.
* **`GetAdmins(Admins, Error)`**: Retrieves the admins of a smart wallet.
* **`AddAdmin(Signer, Error)`**: Adds an admin to a smart wallet.
* **`RemoveAdmin(Signer, Error)`**: Removes an admin from a smart wallet.
* **`GetActiveSigners(Signers, Error)`**: Retrieves the active signers of a smart wallet.
## Getting Started

#### API Key Required

To get started with the Unreal SDK, you will need to have a [thirdweb API Key](https://thirdweb.com/create-api-key) created. Make sure you allowlist a bundle ID to use within Unreal native applications.

### Integration Steps

* #### Plugin Download  
Download and install the Thirdweb Unreal Plugin from the [Unreal Marketplace](https://www.unrealengine.com/marketplace/en-US/product/f21200c2610146f3888172994448e50d).
* #### Runtime Settings  
Once you import the plugin into your project, you will need to set up the plugin settings with your Client ID and Bundle ID.  
You can do so by clicking the thirdweb icon on your engine action bar, or by navigating to`Edit > Project Settings > Engine > Thirdweb` and filling in the required fields.  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Funreal-engine-settings.0a348246.png&w=2048&q=75)  
Alternatively, you can head to your root `Config` folder and open the `DefaultEngine.ini` file to set up the plugin settings.  
```ini  
[/Script/Thirdweb.ThirdwebRuntimeSettings]  
ClientID=  
BundleID=  
```
* #### Test it!  
Try out our prebuilt example `Level_Thirdweb` to create and login to wallets seamlessly, using all kinds of authentication, and explore advanced Account Abstraction use cases.  
![](/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Funreal-engine-level.57455467.png&w=3840&q=75)
## Thirdweb

The `Thirdweb` namespace is a low-level wrapper around the `Thirdweb` Rust library, providing a set of utility functions and classes to interact with the Thirdweb SDK.

#### Note

Although accessible, this namespace is designed as an internal wrapper. All functionality is exposed in its intended place throughout the plugin, and the following is documented is for posterity.

### Structures

#### **FFIResult**

Encapsulates operation results, returning success status and messages.

##### Properties

* **`bool success`**: Success status of the operation result
* **`const char* message`**: Operation result message

##### Member Functions

* **`AssignResult(Output, bErrorOnlyResult)`**: Assign's result and then frees the underlying pointer
* **`GetOutput()`**: Assign's result to output directly
* **`Free()`**: Frees the underlying pointer for functions that have no relevant output
* **`Log()`**: Convenience function to log all properties

### Internal Functions

The `Thirdweb` namespace in `Thirdweb.h` offers various methods for managing wallets and interacting with smart contracts. Note that inputs may change in future versions, so always refer to the latest documentation or source code for the most accurate information.

#### Wallet Management

##### Private Key Wallet

* **`create_private_key_wallet(private_key)`**: Creates a wallet using a private key.
* **`generate_private_key_wallet()`**: Generates a new private key wallet.
* **`private_key_wallet_export(handle_id)`**: Exports the private key of a wallet.

##### In App Wallet

* **`create_in_app_wallet(client_id, bundle_id, secret_key, email, storage_directory_path, auth_provider)`**: Creates an in-app wallet.
* **`in_app_wallet_send_otp_email(handle_id)`**: Sends an OTP for in-app email wallet.
* **`in_app_wallet_verify_otp_email(handle_id, otp)`**: Verifies an OTP for in-app email wallet.
* **`in_app_wallet_send_otp_phone(handle_id)`**: Sends an OTP for in-app phone wallet.
* **`in_app_wallet_verify_otp_phone(handle_id, otp)`**: Verifies an OTP for in-app phone wallet.
* **`in_app_wallet_fetch_oauth_login_link(handle_id, redirect_url)`**: Fetches an OAuth login link for in-app wallet.
* **`in_app_wallet_sign_in_with_oauth(handle_id, auth_result)`**: Signs in with OAuth for in-app wallet.
* **`in_app_wallet_sign_in_with_jwt(handle_id, jwt, encryption_key)`**: Signs in with jwt for in-app wallet.
* **`in_app_wallet_sign_in_with_auth_endpoint(handle_id, payload, encryption_key)`**: Signs in with auth endpoint for in-app wallet.
* **`in_app_wallet_sign_in_with_guest(handle_id, session_id)`**: Signs in with guest for in-app wallet.

#### Ecosystem Wallet

* **`create_ecosystem_wallet(ecosystem_id, ecosystem_partner_id, client_id, bundle_id, secret_key, email, storage_directory_path, auth_provider)`**: Creates an ecosystem wallet.
* **`ecosystem_wallet_send_otp_email(handle_id)`**: Sends an OTP for ecosystem email wallet.
* **`ecosystem_wallet_verify_otp_email(handle_id, otp)`**: Verifies an OTP for ecosystem email wallet.
* **`ecosystem_wallet_send_otp_phone(handle_id)`**: Sends an OTP for ecosystem phone wallet.
* **`ecosystem_wallet_verify_otp_phone(handle_id, otp)`**: Verifies an OTP for ecosystem phone wallet.
* **`ecosystem_wallet_fetch_oauth_login_link(handle_id, redirect_url)`**: Fetches an OAuth login link for ecosystem wallet.
* **`ecosystem_wallet_sign_in_with_oauth(handle_id, auth_result)`**: Signs in with OAuth for ecosystem wallet.
* **`ecosystem_wallet_sign_in_with_jwt(handle_id, jwt)`**: Signs in with jwt for ecosystem wallet.
* **`ecosystem_wallet_sign_in_with_auth_endpoint(handle_id, payload)`**: Signs in with auth endpoint for ecosystem wallet.
* **`ecosystem_wallet_sign_in_with_guest(handle_id, session_id)`**: Signs in with guest for ecosystem wallet.

#### Smart Wallet

* **`create_smart_wallet(client_id, bundle_id, secret_key, personal_wallet_handle_id, chain_id, gasless, factory, account_override)`**: Creates a smart wallet.
* **`smart_wallet_is_deployed(handle_id)`**: Checks if the smart wallet is deployed.
* **`smart_wallet_get_all_admins(handle_id)`**: Retrieves all admins of the smart wallet.
* **`smart_wallet_get_all_active_signers(handle_id)`**: Retrieves all active signers of the smart wallet.
* **`smart_wallet_create_session_key(handle_id, signer_address, approved_targets, approved_targets_count, native_token_limit_per_transaction_in_wei, permission_start_timestamp, permission_end_timestamp, req_validity_start_timestamp, req_validity_end_timestamp)`**: Creates a session key for the smart wallet.
* **`smart_wallet_revoke_session_key(handle_id, signer_address)`**: Revokes a session key for the smart wallet.
* **`smart_wallet_add_admin(handle_id, signer_address)`**: Adds an admin to the smart wallet.
* **`smart_wallet_remove_admin(handle_id, signer_address)`**: Removes an admin from the smart wallet.

#### Utility

* **`get_wallet_address(handle_id)`**: Retrieves the wallet address.
* **`sign_message(handle_id, message)`**: Signs a message with the wallet.
* **`is_connected(handle_id)`**: Checks if the wallet is connected.
* **`disconnect(handle_id)`**: Disconnects the wallet.
* **`free_wallet(handle_id)`**: Frees the wallet handle.
* **`free_ffi_result(result)`**: Frees the FFI result.
* **`free_string(result)`**: Frees the string.
* **`is_valid_address(address, check_checksum)`**: Validates an Ethereum address.
* **`to_checksummed_address(address)`**: Converts an address to checksummed format.
* **`is_valid_private_key(private_key)`**: Validates a private key.
* **`compute_client_id_from_secret_key(secret_key)`**: Gets the client id of a secret key.
* **`get_unix_timestamp_now()`**: Gets the current unix timestamp.
* **`get_unix_timestamp_in_ten_years()`**: Gets the unix timestamp in 10 years.
## Unreal Engine SDK

A Code Plugin for Unreal Engine that enables developers to create thirdweb In-App, Ecosystem and Smart Wallets for their games and applications. The plugin provides a simple API and blueprints to interact with wallets, login with email or socials as well as create Smart Wallet session keys.

With this plugin, you can keep the onboarding of your users in-client and grant a session key to your[thirdweb Engine](https://portal.thirdweb.com/engine) powered backend to interact with the blockchain, no signature in sight.

The Thirdweb Unreal Plugin is distributed as an [Unreal Marketplace Code Plugin](https://www.unrealengine.com/marketplace/en-US/product/f21200c2610146f3888172994448e50d).

Unreal Engine SDK

Unreal Engine SDK is open-source. View and contribute to its source code on GitHub.

[GitHubView on GitHub](https://github.com/thirdweb-dev/unreal-sdk)

### Features

* **Create and Login to In-App Wallets** \- unlocking email and social authentication to create persistent, cross-platform, cross-device and cross-sdk signless embedded wallets.
* **Unlock the power of Account Abstraction** \- unlock the ability to sponsor gas and interact on behalf of users by upgrading any wallet to a Smart Wallet, and using Session Keys to grant scoped access to your backend - fully compatible with [thirdweb Engine](https://portal.thirdweb.com/engine) or other SDKs.
* **Rust Core** \- the plugin's core logic is built from Rust, making it lightning-fast and minimizing the clutter in your Unreal project.
* **Compatible with Unreal Engine 5.3-5.5** \- the plugin is compatible with the latest versions of Unreal Engine, allowing you to leverage the latest features and improvements.

### Installation

Download and install the Thirdweb Unreal Plugin from the [Unreal Marketplace](https://www.unrealengine.com/marketplace/en-US/product/f21200c2610146f3888172994448e50d).

Our plugin is coded using an intuitive handle system and blueprint async tasks, allowing you to interact with it very easily.
## Marketplace V3 design document.

This is a live document that explains what the [thirdweb](https://thirdweb.com/) `Marketplace V3` smart contract is, how it works and can be used, and why it is written the way it is.

The document is written for technical and non-technical readers. To ask further questions about `Marketplace V3`, please [visit our support site](https://thirdweb.com/contact-us) or create a [github issue](https://github.com/thirdweb-dev/contracts/issues).

### Background

The [thirdweb](https://thirdweb.com/) `Marketplace V3` is a marketplace where people can sell NFTs — [ERC 721](https://eips.ethereum.org/EIPS/eip-721) or [ERC 1155](https://eips.ethereum.org/EIPS/eip-1155) tokens — at a fixed price ( what we'll refer to as a "Direct listing"), or auction them (what we'll refer to as an "Auction listing"). It also allows users to make "Offers" on unlisted NFTs.

`Marketplace V3` offers improvements over previous version in terms of design and features, which are discussed in this document. You can refer to previous (v2) `Marketplace` design document [here](https://github.com/thirdweb-dev/contracts/blob/main/contracts/old-marketplace/marketplace.md).

### Context behind this update

We have given `Marketplace` an update that was long overdue. The marketplace product is still made up of three core ways of exchanging NFTs for money:

* Selling NFTs via a ‘direct listing'.
* Auctioning off NFTs.
* Making offers for NFTs not on sale at all, or at favorable prices.

The core improvement of the `Marketplace V3` smart contract is better developer experience of working with the contract.

Previous version had some limitations, arising due to (1) the smart contract size limit of `~24.576 kb` on Ethereum mainnet (and other thirdweb supported chains), and (2) the way the smart contract code is organized (single, large smart contract that inherits other contracts). The previous `Marketplace` smart contract has functions that have multiple jobs, behave in many different ways under different circumstances, and a lack of convenient view functions to read data easily.

Moreover, over time, we received feature requests for `Marketplace`, some of which have been incorporated in `Marketplace V3`, for e.g.:

* Ability to accept multiple currencies for direct listings
* Ability to explicitly cancel listings
* Explicit getter functions for fetching high level states e.g. “has an auction ended”, “who is the winning bidder”, etc.
* Simplify start time and expiration time for listings

For all these reasons and feature additions, the `Marketplace` contract is getting an update, and being rolled out as `Marketplace V3`. In this update:

* the contract has been broken down into independent extensions (later offered in Solidity SDK).
* the contract provides explicit functions for each important action (something that is missing from the contract, today).
* the contract provides convenient view functions for all relevant state of the contract, without expecting users to rely on events to read critical information.

Finally, to accomplish all these things without the constraint of the smart contract size limit, the `Marketplace V3` contract is written in the following new code pattern, which we call `Plugin Pattern`. It was influenced by [EIP-2535](https://eips.ethereum.org/EIPS/eip-2535). You can read more about Plugin Pattern [here](https://blog.thirdweb.com/).

### Extensions that make up `Marketplace V3`

The `Marketplace V3` smart contract is now written as the sum of three main extension smart contracts:

* `DirectListings`: List NFTs for sale at a fixed price. Buy NFTs from listings.
* `EnglishAuctions`: Put NFTs up for auction. Bid for NFTs up on auction. The highest bid within an auction's duration wins.
* `Offers`: Make offers of ERC20 or native token currency for NFTs. Accept a favorable offer if you own the NFTs wanted.

Each of these extension smart contracts is independent, and does not care about the state of the other extension contracts.

#### What the Marketplace will look like to users

There are two groups of users — (1) thirdweb's customers who'll set up the marketplace, and (2) the end users of thirdweb customers' marketplaces.

To thirdweb customers, the marketplace can be set up like any of the other thirdweb contract (e.g. 'NFT Collection') through the thirdweb dashboard, the thirdweb SDK, or by directly consuming the open sourced marketplace smart contract.

To the end users of thirdweb customers, the experience of using the marketplace will feel familiar to popular marketplace platforms like OpenSea, Zora, etc. The biggest difference in user experience will be that performing any action on the marketplace requires gas fees.

* Thirdweb's customers  
   * Deploy the marketplace contract like any other thirdweb contract.  
   * Can set a % 'platform fee'. This % is collected on every sale — when a buyer buys tokens from a direct listing, and when a seller collects the highest bid on auction closing. This platform fee is distributed to the platform fee recipient (set by a contract admin).  
   * Can list NFTs for sale at a fixed price.  
   * Can edit an existing listing's parameters, e.g. the currency accepted. An auction's parameters cannot be edited once it has started.  
   * Can make offers to NFTs listed/unlisted for a fixed price.  
   * Can auction NFTs.  
   * Can make bids to auctions.  
   * Must pay gas fees to perform any actions, including the actions just listed.

#### EIPs implemented / supported

To be able to escrow NFTs in the case of auctions, Marketplace implements the receiver interfaces for [ERC1155](https://eips.ethereum.org/EIPS/eip-1155) and [ERC721](https://eips.ethereum.org/EIPS/eip-721) tokens.

To enable meta-transactions (gasless), Marketplace implements [ERC2771](https://eips.ethereum.org/EIPS/eip-2771).

Marketplace also honors [ERC2981](https://eips.ethereum.org/EIPS/eip-2981) for the distribution of royalties on direct and auction listings.

#### Events emitted

All events emitted by the contract, as well as when they're emitted, can be found in the interface of the contract, [here](https://github.com/thirdweb-dev/contracts/blob/main/contracts/marketplace/IMarketplace.sol). In general, events are emitted whenever there is a state change in the contract.

#### Currency transfers

The contract supports both ERC20 currencies and a chain's native token (e.g. ether for Ethereum mainnet). This means that any action that involves transferring currency (e.g. buying a token from a direct listing) can be performed with either an ERC20 token or the chain's native token.

💡 **Note**: The exception is offers — these can only be made with ERC20 tokens, since Marketplace needs to transfer the offer amount from the buyer to the seller, in case the latter accepts the offer. This cannot be done with native tokens without escrowing the requisite amount of currency.

The contract wraps all native tokens deposited into it as the canonical ERC20 wrapped version of the native token (e.g. WETH for ether). The contract unwraps the wrapped native token when transferring native tokens to a given address.

If the contract fails to transfer out native tokens, it wraps them back to wrapped native tokens, and transfers the wrapped native tokens to the concerned address. The contract may fail to transfer out native tokens to an address, if the address represents a smart contract that cannot accept native tokens transferred to it directly.

### API Reference for Extensions

#### Direct listings

The `DirectListings` extension smart contract lets you buy and sell NFTs (ERC-721 or ERC-1155) for a fixed price.

#### `createListing`

**What:** List NFTs (ERC721 or ERC1155) for sale at a fixed price.

* Interface  
```solidity  
struct ListingParameters {  
  address assetContract;  
  uint256 tokenId;  
  uint256 quantity;  
  address currency;  
  uint256 pricePerToken;  
  uint128 startTimestamp;  
  uint128 endTimestamp;  
  bool reserved;  
}  
   
function createListing(ListingParameters memory params) external returns (uint256 listingId);  
```
* Parameters  
| Parameter           | Description                                                                                                                                                                   |  
| ------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |  
| assetContract       | The address of the smart contract of the NFTs being listed.                                                                                                                   |  
| tokenId             | The tokenId of the NFTs being listed.                                                                                                                                         |  
| quantity            | The quantity of NFTs being listed. This must be non-zero, and is expected to be 1 for ERC-721 NFTs.                                                                           |  
| currency            | The currency in which the price must be paid when buying the listed NFTs. The address considered for native tokens of the chain is 0xEeeeeEeeeEeEeeEeEeEeeEEEeeeeEeeeeeeeEEeE |  
| pricePerToken       | The price to pay per unit of NFTs listed.                                                                                                                                     |  
| startTimestamp      | The UNIX timestamp at and after which NFTs can be bought from the listing.                                                                                                    |  
| expirationTimestamp | The UNIX timestamp at and after which NFTs cannot be bought from the listing.                                                                                                 |  
| reserved            | Whether the listing is reserved to be bought from a specific set of buyers.                                                                                                   |
* Criteria that must be satisfied  
   * The listing creator must own the NFTs being listed.  
   * The listing creator must have already approved Marketplace to transfer the NFTs being listed (since the creator is not required to escrow NFTs in the Marketplace).  
   * The listing creator must list a non-zero quantity of tokens. If listing ERC-721 tokens, the listing creator must list only quantity `1`.  
   * The listing start time must not be less than 1+ hour before the block timestamp of the transaction. The listing end time must be after the listing start time.  
   * Only ERC-721 or ERC-1155 tokens must be listed.  
   * The listing creator must have `LISTER_ROLE` if role restrictions are active.  
   * The asset being listed must have `ASSET_ROLE` if role restrictions are active.

#### `updateListing`

**What:** Update information (e.g. price) for one of your listings on the marketplace.

* Interface  
```solidity  
struct ListingParameters {  
  address assetContract;  
  uint256 tokenId;  
  uint256 quantity;  
  address currency;  
  uint256 pricePerToken;  
  uint128 startTimestamp;  
  uint128 endTimestamp;  
  bool reserved;  
}  
   
function updateListing(uint256 listingId, ListingParameters memory params) external  
```
* Parameters  
| Parameter           | Description                                                                                                                                                                   |  
| ------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |  
| listingId           | The unique ID of the listing being updated.                                                                                                                                   |  
| assetContract       | The address of the smart contract of the NFTs being listed.                                                                                                                   |  
| tokenId             | The tokenId of the NFTs being listed.                                                                                                                                         |  
| quantity            | The quantity of NFTs being listed. This must be non-zero, and is expected to be 1 for ERC-721 NFTs.                                                                           |  
| currency            | The currency in which the price must be paid when buying the listed NFTs. The address considered for native tokens of the chain is 0xEeeeeEeeeEeEeeEeEeEeeEEEeeeeEeeeeeeeEEeE |  
| pricePerToken       | The price to pay per unit of NFTs listed.                                                                                                                                     |  
| startTimestamp      | The UNIX timestamp at and after which NFTs can be bought from the listing.                                                                                                    |  
| expirationTimestamp | The UNIX timestamp at and after which NFTs cannot be bought from the listing.                                                                                                 |  
| reserved            | Whether the listing is reserved to be bought from a specific set of buyers.                                                                                                   |
* Criteria that must be satisfied  
   * The caller of the function _must_ be the creator of the listing being updated.  
   * The listing creator must own the NFTs being listed.  
   * The listing creator must have already approved Marketplace to transfer the NFTs being listed (since the creator is not required to escrow NFTs in the Marketplace).  
   * The listing creator must list a non-zero quantity of tokens. If listing ERC-721 tokens, the listing creator must list only quantity `1`.  
   * Only ERC-721 or ERC-1155 tokens must be listed.  
   * The listing start time must be greater than or equal to the incumbent start timestamp. The listing end time must be after the listing start time.  
   * The asset being listed must have `ASSET_ROLE` if role restrictions are active.

#### `cancelListing`

**What:** Cancel (i.e. delete) one of your listings on the marketplace.

* Interface  
```solidity  
function cancelListing(uint256 listingId) external;  
```
* Parameters  
| Parameter | Description                                         |  
| --------- | --------------------------------------------------- |  
| listingId | The unique ID of the listing to cancel i.e. delete. |
* Criteria that must be satisfied  
   * The caller of the function _must_ be the creator of the listing being cancelled.  
   * The listing must exist.

#### `approveBuyerForListing`

**What:** Approve a buyer to buy from a reserved listing.

* Interface  
```solidity  
function approveBuyerForListing(  
  uint256 listingId,  
  address buyer,  
  bool toApprove  
) external;  
```
* Parameters  
| Parameter | Description                                                  |  
| --------- | ------------------------------------------------------------ |  
| listingId | The unique ID of the listing.                                |  
| buyer     | The address of the buyer to approve to buy from the listing. |  
| toApprove | Whether to approve the buyer to buy from the listing.        |
* Criteria that must be satisfied  
   * The caller of the function _must_ be the creator of the listing in question.  
   * The listing must be reserved.

#### `approveCurrencyForListing`

**What:** Approve a currency as a form of payment for the listing.

* Interface  
```solidity  
function approveCurrencyForListing(  
  uint256 listingId,  
  address currency,  
  uint256 pricePerTokenInCurrency,  
) external;  
```
* Parameters  
| Parameter               | Description                                                                               |  
| ----------------------- | ----------------------------------------------------------------------------------------- |  
| listingId               | The unique ID of the listing.                                                             |  
| currency                | The address of the currency to approve as a form of payment for the listing.              |  
| pricePerTokenInCurrency | The price per token for the currency to approve. A value of 0 here disapprove a currency. |
* Criteria that must be satisfied  
   * The caller of the function _must_ be the creator of the listing in question.  
   * The currency being approved must not be the main currency accepted by the listing.

#### `buyFromListing`

**What:** Buy NFTs from a listing.

* Interface  
```solidity  
function buyFromListing(  
  uint256 listingId,  
  address buyFor,  
  uint256 quantity,  
  address currency,  
  uint256 expectedTotalPrice  
) external payable;  
```
* Parameters  
| Parameter          | Description                                                |  
| ------------------ | ---------------------------------------------------------- |  
| listingId          | The unique ID of the listing to buy NFTs from.             |  
| buyFor             | The recipient of the NFTs being bought.                    |  
| quantity           | The quantity of NFTs to buy from the listing.              |  
| currency           | The currency to use to pay for NFTs.                       |  
| expectedTotalPrice | The expected total price to pay for the NFTs being bought. |
* Criteria that must be satisfied  
   * The buyer must own the total price amount to pay for the NFTs being bought.  
   * The buyer must approve the Marketplace to transfer the total price amount to pay for the NFTs being bought.  
   * If paying in native tokens, the buyer must send exactly the expected total price amount of native tokens along with the transaction.  
   * The buyer's expected total price must match the actual total price for the NFTs being bought.  
   * The buyer must buy a non-zero quantity of NFTs.  
   * The buyer must not attempt to buy more NFTs than are listed at the time.  
   * The buyer must pay in a currency approved by the listing creator.

#### `totalListings`

**What:** Returns the total number of listings created so far.

* Interface  
```solidity  
function totalListings() external view returns (uint256);  
```

#### `getAllListings`

**What:** Returns all listings between the start and end Id (both inclusive) provided.

* Interface  
```solidity  
enum TokenType {  
  ERC721,  
  ERC1155  
}  
   
enum Status {  
  UNSET,  
  CREATED,  
  COMPLETED,  
  CANCELLED  
}  
   
struct Listing {  
  uint256 listingId;  
  address listingCreator;  
  address assetContract;  
  uint256 tokenId;  
  uint256 quantity;  
  address currency;  
  uint256 pricePerToken;  
  uint128 startTimestamp;  
  uint128 endTimestamp;  
  bool reserved;  
  TokenType tokenType;  
  Status status;  
}  
   
function getAllListings(uint256 startId, uint256 endId) external view returns (Listing[] memory listings);  
```
* Parameters  
| Parameter | Description                |  
| --------- | -------------------------- |  
| startId   | Inclusive start listing Id |  
| endId     | Inclusive end listing Id   |

#### `getAllValidListings`

**What:** Returns all valid listings between the start and end Id (both inclusive) provided. A valid listing is where the listing is active, as well as the creator still owns and has approved Marketplace to transfer the listed NFTs.

* Interface  
```solidity  
function getAllValidListings(uint256 startId, uint256 endId) external view returns (Listing[] memory listings);  
```
* Parameters  
| Parameter | Description                |  
| --------- | -------------------------- |  
| startId   | Inclusive start listing Id |  
| endId     | Inclusive end listing Id   |

#### `getListing`

**What:** Returns a listing at the provided listing ID.

* Interface  
```solidity  
function getListing(uint256 listingId) external view returns (Listing memory listing);  
```
* Parameters  
| Parameter | Description                     |  
| --------- | ------------------------------- |  
| listingId | The ID of the listing to fetch. |

### English auctions

The `EnglishAuctions` extension smart contract lets you sell NFTs (ERC-721 or ERC-1155) in an english auction.

#### `createAuction`

**What:** Put up NFTs (ERC721 or ERC1155) for an english auction.

* **What is an English auction?**  
   * `Alice` deposits her NFTs in the Marketplace contract and specifies: **\[1\]** a minimum bid amount, and **\[2\]** a duration for the auction.  
   * `Bob` is the first person to make a bid.  
         * _Before_ the auction duration ends, `Bob` makes a bid in the auction (≥ minimum bid).  
         * `Bob`'s bid is now deposited and locked in the Marketplace.  
   * `Tom` also wants the auctioned NFTs. `Tom`'s bid _must_ be greater than `Bob`'s bid.  
         * _Before_ the auction duration ends, `Tom` makes a bid in the auction (≥ `Bob`'s bid).  
         * `Tom`'s bid is now deposited and locked in the Marketplace. `Bob`'s is _automatically_ refunded his bid.  
   * _After_ the auction duration ends:  
         * `Alice` collects the highest bid that has been deposited in Marketplace.  
         * The “highest bidder” e.g. `Tom` collects the auctioned NFTs.
* Interface  
```solidity  
struct AuctionParameters {  
  address assetContract;  
  uint256 tokenId;  
  uint256 quantity;  
  address currency;  
  uint256 minimumBidAmount;  
  uint256 buyoutBidAmount;  
  uint64 timeBufferInSeconds;  
  uint64 bidBufferBps;  
  uint64 startTimestamp;  
  uint64 endTimestamp;  
}  
   
function createAuction(AuctionParameters memory params) external returns (uint256 auctionId);  
```
* Parameters  
| Parameter           | Description                                                                                                                                                      |  
| ------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------- |  
| assetContract       | The address of the smart contract of the NFTs being auctioned.                                                                                                   |  
| tokenId             | The tokenId of the NFTs being auctioned.                                                                                                                         |  
| quantity            | The quantity of NFTs being auctioned. This must be non-zero, and is expected to be 1 for ERC-721 NFTs.                                                           |  
| currency            | The currency in which the bid must be made when bidding for the auctioned NFTs.                                                                                  |  
| minimumBidAmount    | The minimum bid amount for the auction.                                                                                                                          |  
| buyoutBidAmount     | The total bid amount for which the bidder can directly purchase the auctioned items and close the auction as a result.                                           |  
| timeBufferInSeconds | This is a buffer e.g. x seconds. If a new winning bid is made less than x seconds before expirationTimestamp, the expirationTimestamp is increased by x seconds. |  
| bidBufferBps        | This is a buffer in basis points e.g. x%. To be considered as a new winning bid, a bid must be at least x% greater than the current winning bid.                 |  
| startTimestamp      | The timestamp at and after which bids can be made to the auction                                                                                                 |  
| expirationTimestamp | The timestamp at and after which bids cannot be made to the auction.                                                                                             |
* Criteria that must be satisfied  
   * The auction creator must own and approve Marketplace to transfer the auctioned tokens to itself.  
   * The auction creator must auction a non-zero quantity of tokens. If the auctioned token is ERC721, the quantity must be `1`.  
   * The auction creator must specify a non-zero time and bid buffers.  
   * The minimum bid amount must be less than the buyout bid amount.  
   * The auction start time must not be less than 1+ hour before the block timestamp of the transaction. The auction end time must be after the auction start time.  
   * The auctioned token must be ERC-721 or ERC-1155.  
   * The auction creator must have `LISTER_ROLE` if role restrictions are active.  
   * The asset being auctioned must have `ASSET_ROLE` if role restrictions are active.

#### `cancelAuction`

**What:** Cancel an auction.

* Interface  
```solidity  
function cancelAuction(uint256 auctionId) external;  
```
* Parameters  
| Parameter | Description                             |  
| --------- | --------------------------------------- |  
| auctionId | The unique ID of the auction to cancel. |
* Criteria that must be satisfied  
   * The caller of the function must be the auction creator.  
   * There must be no bids placed in the ongoing auction. (Default true for all auctions that haven't started)

#### `collectAuctionPayout`

**What:** Once the auction ends, collect the highest bid made for your auctioned NFTs.

* Interface  
```solidity  
function collectAuctionPayout(uint256 auctionId) external;  
```
* Parameters  
| Parameter | Description                                             |  
| --------- | ------------------------------------------------------- |  
| auctionId | The unique ID of the auction to collect the payout for. |
* Criteria that must be satisfied  
   * The auction must be expired.  
   * The auction must have received at least one valid bid.

#### `collectAuctionTokens`

**What:** Once the auction ends, collect the auctioned NFTs for which you were the highest bidder.

* Interface  
```solidity  
function collectAuctionTokens(uint256 auctionId) external;  
```
* Parameters  
| Parameter | Description                                             |  
| --------- | ------------------------------------------------------- |  
| auctionId | The unique ID of the auction to collect the payout for. |
* Criteria that must be satisfied  
   * The auction must be expired.  
   * The caller must be the winning bidder.

#### `bidInAuction`

**What:** Make a bid in an auction.

* Interface  
```solidity  
function bidInAuction(uint256 auctionId, uint256 bidAmount) external payable;  
```
* Parameters  
| Parameter | Description                             |  
| --------- | --------------------------------------- |  
| auctionId | The unique ID of the auction to bid in. |  
| bidAmount | The total bid amount.                   |
* Criteria that must be satisfied  
   * Auction must not be expired.  
   * The caller must own and approve Marketplace to transfer the requisite bid amount to itself.  
   * The bid amount must be a winning bid amount. (For convenience, this can be verified by calling `isNewWinningBid`)

#### `isNewWinningBid`

**What:** Check whether a given bid amount would make for a new winning bid.

* Interface  
```solidity  
function isNewWinningBid(uint256 auctionId, uint256 bidAmount) external view returns (bool);  
```
* Parameters  
| Parameter | Description                             |  
| --------- | --------------------------------------- |  
| auctionId | The unique ID of the auction to bid in. |  
| bidAmount | The total bid amount.                   |
* Criteria that must be satisfied  
   * The auction must not have been cancelled or expired.

#### `totalAuctions`

**What:** Returns the total number of auctions created so far.

* Interface  
```solidity  
function totalAuctions() external view returns (uint256);  
```

#### `getAuction`

**What:** Fetch the auction info at a particular auction ID.

* Interface  
```solidity  
struct Auction {  
  uint256 auctionId;  
  address auctionCreator;  
  address assetContract;  
  uint256 tokenId;  
  uint256 quantity;  
  address currency;  
  uint256 minimumBidAmount;  
  uint256 buyoutBidAmount;  
  uint64 timeBufferInSeconds;  
  uint64 bidBufferBps;  
  uint64 startTimestamp;  
  uint64 endTimestamp;  
  TokenType tokenType;  
  Status status;  
}  
   
function getAuction(uint256 auctionId) external view returns (Auction memory auction);  
```
* Parameters  
| Parameter | Description                   |  
| --------- | ----------------------------- |  
| auctionId | The unique ID of the auction. |

#### `getAllAuctions`

**What:** Returns all auctions between the start and end Id (both inclusive) provided.

* Interface  
```solidity  
function getAllAuctions(uint256 startId, uint256 endId) external view returns (Auction[] memory auctions);  
```
* Parameters  
| Parameter | Description                |  
| --------- | -------------------------- |  
| startId   | Inclusive start auction Id |  
| endId     | Inclusive end auction Id   |

#### `getAllValidAuctions`

**What:** Returns all valid auctions between the start and end Id (both inclusive) provided. A valid auction is where the auction is active, as well as the creator still owns and has approved Marketplace to transfer the auctioned NFTs.

* Interface  
```solidity  
function getAllValidAuctions(uint256 startId, uint256 endId) external view returns (Auction[] memory auctions);  
```
* Parameters  
| Parameter | Description                |  
| --------- | -------------------------- |  
| startId   | Inclusive start auction Id |  
| endId     | Inclusive end auction Id   |

#### `getWinningBid`

**What:** Get the winning bid of an auction.

* Interface  
```solidity  
function getWinningBid(uint256 auctionId)  
  external  
  view  
  returns (  
    address bidder,  
    address currency,  
    uint256 bidAmount  
  );  
```
* Parameters  
| Parameter | Description                  |  
| --------- | ---------------------------- |  
| auctionId | The unique ID of an auction. |

#### `isAuctionExpired`

**What:** Returns whether an auction is expired or not.

* Interface  
```solidity  
function isAuctionExpired(uint256 auctionId) external view returns (bool);  
```
* Parameters  
| Parameter | Description                  |  
| --------- | ---------------------------- |  
| auctionId | The unique ID of an auction. |

### Offers

#### `makeOffer`

**What:** Make an offer for any ERC721 or ERC1155 NFTs (unless `ASSET_ROLE` restrictions apply)

* Interface  
```solidity  
struct OfferParams {  
  address assetContract;  
  uint256 tokenId;  
  uint256 quantity;  
  address currency;  
  uint256 totalPrice;  
  uint256 expirationTimestamp;  
}  
   
function makeOffer(OfferParams memory params) external returns (uint256 offerId);  
```
* Parameters  
| Parameter           | Description                               |  
| ------------------- | ----------------------------------------- |  
| assetContract       | The contract address of the NFTs wanted.  |  
| tokenId             | The tokenId of the NFTs wanted.           |  
| quantity            | The quantity of NFTs wanted.              |  
| currency            | The currency offered for the NFT wanted.  |  
| totalPrice          | The price offered for the NFTs wanted.    |  
| expirationTimestamp | The timestamp at which the offer expires. |
* Criteria that must be satisfied  
   * The offeror must own and approve Marketplace to transfer the requisite amount currency offered for the NFTs wanted.  
   * The offeror must make an offer for non-zero quantity of NFTs. If offering for ERC721 tokens, the quantity wanted must be `1`.  
   * Expiration timestamp must be greater than block timestamp, or within 1 hour of block timestamp.

#### `cancelOffer`

**What:** Cancel an existing offer.

* Interface  
```solidity  
function cancelOffer(uint256 offerId) external;  
```
* Parameters  
| Parameter | Description                |  
| --------- | -------------------------- |  
| offerId   | The unique ID of the offer |
* Criteria that must be satisfied  
   * The caller of the function must be the offeror.

#### `acceptOffer`

**What:** Accept an offer made for your NFTs.

* Interface  
```solidity  
function acceptOffer(uint256 offerId) external;  
```
* Parameters  
| Parameter | Description                 |  
| --------- | --------------------------- |  
| offerId   | The unique ID of the offer. |
* Criteria that must be satisfied  
   * The caller of the function must own and approve Marketplace to transfer the tokens for which the offer is made.  
   * The offeror must still own and have approved Marketplace to transfer the requisite amount currency offered for the NFTs wanted.

#### `totalOffers`

**What:** Returns the total number of offers created so far.

* Interface  
```solidity  
function totalOffers() external view returns (uint256);  
```

#### `getOffer`

**What:** Returns the offer at a particular offer Id.

* Interface  
```solidity  
struct Offer {  
  uint256 offerId;  
  address offeror;  
  address assetContract;  
  uint256 tokenId;  
  uint256 quantity;  
  address currency;  
  uint256 totalPrice;  
  uint256 expirationTimestamp;  
  TokenType tokenType;  
  Status status;  
}  
   
function getOffer(uint256 offerId) external view returns (Offer memory offer);  
```
* Parameters  
| Parameter | Description                |  
| --------- | -------------------------- |  
| offerId   | The unique ID of an offer. |

#### `getAllOffers`

**What:** Returns all offers between the start and end Id (both inclusive) provided.

* Interface  
```solidity  
function getAllOffers(uint256 startId, uint256 endId) external view returns (Offer[] memory offers);  
```
* Parameters  
| Parameter | Description              |  
| --------- | ------------------------ |  
| startId   | Inclusive start offer Id |  
| endId     | Inclusive end offer Id   |

#### `getAllValidOffers`

**What:** Returns all valid offers between the start and end Id (both inclusive) provided. A valid offer is where the offer is active, as well as the offeror still owns and has approved Marketplace to transfer the currency tokens.

* Interface  
```solidity  
function getAllValidOffer(uint256 startId, uint256 endId) external view returns (Offer[] memory offers);  
```
* Parameters  
| Parameter | Description              |  
| --------- | ------------------------ |  
| startId   | Inclusive start offer Id |  
| endId     | Inclusive end offer Id   |
## Abi

 Contract [ ABI Specification](https://docs.soliditylang.org/en/latest/abi-spec.html#json)

`type Abi = readonly Array<(AbiConstructor) | (AbiError) | (AbiEvent) | (AbiFallback) | (AbiFunction) | (AbiReceive)>

`
## AbiConstructor

 ABI [ "constructor"](https://docs.soliditylang.org/en/latest/abi-spec.html#json) type

`type AbiConstructor = { inputs: readonly Array<AbiParameter>; payable?: boolean; stateMutability: Extract<AbiStateMutability, "payable" | "nonpayable">; type: "constructor" }

`

##### inputs

`type inputs = readonly Array<AbiParameter>

`

##### payable

Deprecated

 use `payable` or `nonpayable` from AbiStateMutability instead

 https://github.com/ethereum/solidity/issues/992

`type payable = boolean;

`

##### stateMutability

`type stateMutability = Extract<

AbiStateMutability,

"payable" | "nonpayable"

>;

`

##### type

`type type = "constructor";

`
## AbiEvent

 ABI [ "event"](https://docs.soliditylang.org/en/latest/abi-spec.html#events) type

`type AbiEvent = { anonymous?: boolean; inputs: readonly Array<AbiEventParameter>; name: string; type: "event" }

`

##### anonymous

`type anonymous = boolean;

`

##### inputs

`type inputs = readonly Array<AbiEventParameter>

`

##### name

`type name = string;

`

##### type

`type type = "event";

`
## AbiFallback

 ABI [ "fallback"](https://docs.soliditylang.org/en/latest/abi-spec.html#json) type

`type AbiFallback = {

payable?: boolean;

stateMutability: Extract<

AbiStateMutability,

"payable" | "nonpayable"

 >;

type: "fallback";

};

`

##### payable

Deprecated

 use `payable` or `nonpayable` from AbiStateMutability instead

 https://github.com/ethereum/solidity/issues/992

`type payable = boolean;

`

##### stateMutability

`type stateMutability = Extract<

AbiStateMutability,

"payable" | "nonpayable"

>;

`

##### type

`type type = "fallback";

`
## AbiFunction

 ABI [ "function"](https://docs.soliditylang.org/en/latest/abi-spec.html#json) type

`type AbiFunction = { constant?: boolean; gas?: number; inputs: readonly Array<AbiParameter>; name: string; outputs: readonly Array<AbiParameter>; payable?: boolean; stateMutability: AbiStateMutability; type: "function" }

`

##### constant

Deprecated

 use `pure` or `view` from AbiStateMutability instead

 https://github.com/ethereum/solidity/issues/992

`type constant = boolean;

`

##### gas

Deprecated

 Vyper used to provide gas estimates

 https://github.com/vyperlang/vyper/issues/2151

`type gas = number;

`

##### inputs

`type inputs = readonly Array<AbiParameter>

`

##### name

`type name = string;

`

##### outputs

`type outputs = readonly Array<AbiParameter>

`

##### payable

Deprecated

 use `payable` or `nonpayable` from AbiStateMutability instead

 https://github.com/ethereum/solidity/issues/992

`type payable = boolean;

`

##### stateMutability

`type stateMutability = AbiStateMutability;

`

##### type

`type type = "function";

`
## AbiReceive

 ABI [ "receive"](https://docs.soliditylang.org/en/latest/contracts.html#receive-ether-function) type

`type AbiReceive = {

stateMutability: Extract<AbiStateMutability, "payable">;

type: "receive";

};

`

##### stateMutability

`type stateMutability = Extract<AbiStateMutability, "payable">;

`

##### type

`type type = "receive";

`
## AbiError

 ABI [ "error"](https://docs.soliditylang.org/en/latest/abi-spec.html#errors) type

`type AbiError = { inputs: readonly Array<AbiParameter>; name: string; type: "error" }

`

##### inputs

`type inputs = readonly Array<AbiParameter>

`

##### name

`type name = string;

`

##### type

`type type = "error";

`
## AcceptedOfferEventFilters

 Represents the filters for the "AcceptedOffer" event.

`type AcceptedOfferEventFilters = Partial<{

assetContract: AbiParameterToPrimitiveType<{

indexed: true;

name: "assetContract";

type: "address";

 }>;

offerId: AbiParameterToPrimitiveType<{

indexed: true;

name: "offerId";

type: "uint256";

 }>;

offeror: AbiParameterToPrimitiveType<{

indexed: true;

name: "offeror";

type: "address";

 }>;

}>;

`
## Account

 Account interface

 Refer to [ Account vs Wallet](https://portal.thirdweb.com/typescript/v5/wallets) to understand the difference between `Account` and `Wallet` interface

`type Account = {

address: Address;

estimateGas?: (tx: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)) => Promise<bigint>;

onTransactionRequested?: (

transaction: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any>,

 ) => Promise<void>;

sendBatchTransaction?: (

txs: Array<SendTransactionOption>,

 ) => Promise<SendTransactionResult>;

sendRawTransaction?: (

tx: SendRawTransactionOptions,

 ) => Promise<SendTransactionResult>;

sendTransaction: (

tx: SendTransactionOption,

 ) => Promise<SendTransactionResult>;

signAuthorization?: (

authorization: [AuthorizationRequest](https://portal.thirdweb.com/references/typescript/v5/AuthorizationRequest),

 ) => Promise<[SignedAuthorization](https://portal.thirdweb.com/references/typescript/v5/SignedAuthorization)>;

signMessage: ({

message,

originalMessage,

chainId,

 }: {

chainId?: number;

message: SignableMessage;

originalMessage?: string;

 }) => Promise<Hex>;

signTransaction?: (tx: SerializableTransaction) => Promise<Hex>;

signTypedData: (

_typedData: ox__TypedData.Definition<typedData, primaryType>,

 ) => Promise<Hex>;

watchAsset?: (asset: WatchAssetParams) => Promise<boolean>;

};

`

##### address

 address of the account

`type address = Address;

`

##### estimateGas

##### Signature

`function estimateGas(tx: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)): Promise<bigint>;

`

##### Parameters

##### tx

###### Type

`let tx: Readonly<options> & {

__contract?: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi>;

__preparedMethod?: () => Promise<PreparedMethod<abiFn>>;

};

`

##### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

##### onTransactionRequested

##### Signature

`function onTransactionRequested(

transaction: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any>,

): Promise<void>;

`

##### Parameters

##### transaction

###### Type

`let transaction: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any>;

`

##### Returns

##### Return Type

`let returnType: Promise<void>;

`

##### sendBatchTransaction

##### Signature

`function sendBatchTransaction(

txs: Array<SendTransactionOption>,

): Promise<SendTransactionResult>;

`

##### Parameters

##### txs

###### Type

`let txs: Array<SendTransactionOption>;

`

##### Returns

##### Return Type

`let returnType: Promise<SendTransactionResult>;

`

##### sendRawTransaction

##### Signature

`function sendRawTransaction(

tx: SendRawTransactionOptions,

): Promise<SendTransactionResult>;

`

##### Parameters

##### tx

###### Type

`let tx: SendRawTransactionOptions;

`

##### Returns

##### Return Type

`let returnType: Promise<SendTransactionResult>;

`

##### sendTransaction

##### Signature

`function sendTransaction(

tx: SendTransactionOption,

): Promise<SendTransactionResult>;

`

##### Parameters

##### tx

###### Type

`let tx: SendTransactionOption;

`

##### Returns

##### Return Type

`let returnType: Promise<SendTransactionResult>;

`

##### signAuthorization

##### Signature

`function signAuthorization(

authorization: [AuthorizationRequest](https://portal.thirdweb.com/references/typescript/v5/AuthorizationRequest),

): Promise<[SignedAuthorization](https://portal.thirdweb.com/references/typescript/v5/SignedAuthorization)>;

`

##### Parameters

##### authorization

###### Type

`let authorization: {

address: [Address](https://portal.thirdweb.com/references/typescript/v5/Address);

chainId: number;

nonce: bigint;

};

`

##### Returns

##### Return Type

`let returnType: ox__Authorization.ListSigned[number];

`

##### signMessage

##### Signature

`function signMessage({

message,

originalMessage,

chainId,

}: {

chainId?: number;

message: SignableMessage;

originalMessage?: string;

}): Promise<Hex>;

`

##### Parameters

##### { message, originalMessage, chainId, }

###### Type

`let {

 message,

 originalMessage,

 chainId,

 }: { chainId?: number; message: SignableMessage; originalMessage?: string }

`

##### Returns

##### Return Type

`let returnType: ox__Hex.Hex;

`

##### signTransaction

##### Signature

`function signTransaction(tx: SerializableTransaction): Promise<Hex>;

`

##### Parameters

##### tx

###### Type

`let tx: SerializableTransaction;

`

##### Returns

##### Return Type

`let returnType: ox__Hex.Hex;

`

##### signTypedData

##### Signature

`function signTypedData(

_typedData: ox__TypedData.Definition<typedData, primaryType>,

): Promise<Hex>;

`

##### Parameters

##### \_typedData

###### Type

`let _typedData: ox__TypedData.Definition<typedData, primaryType>;

`

##### Returns

##### Return Type

`let returnType: ox__Hex.Hex;

`

##### watchAsset

##### Signature

`function watchAsset(asset: WatchAssetParams): Promise<boolean>;

`

##### Parameters

##### asset

 The asset to watch.

###### Type

`let asset: WatchAssetParams;

`

##### Returns

##### Return Type

`let returnType: Promise<boolean>;

`
## AccountBalanceInfo

`type AccountBalanceInfo = { balance: number; symbol: string };

`

##### balance

 Represents either token balance or fiat balance.

`type balance = number;

`

##### symbol

 Represents either token symbol or fiat symbol

`type symbol = string;

`
## AccountProvider

 A React context provider component that supplies Account-related data to its child components.

 This component serves as a wrapper around the `AccountProviderContext.Provider` and passes the provided account data down to all of its child components through the context API.

### Example

`import {

 AccountProvider,

 AccountAvatar,

 AccountName,

 AccountAddress,

} from "thirdweb/react";

<AccountProvider address="0x..." client={client}>

 <AccountAvatar />

 <AccountName />

 <AccountAddress />

</AccountProvider>;

`

##### Signature

`function AccountProvider(

props: PropsWithChildren<[AccountProviderProps](https://portal.thirdweb.com/references/typescript/v5/AccountProviderProps)>,

): Element;

`

### Parameters

##### props

#### Type

`let props: PropsWithChildren<[AccountProviderProps](https://portal.thirdweb.com/references/typescript/v5/AccountProviderProps)>;

`

### Returns

##### Return Type

`let returnType: Element;

`
## AccountBlobbie

 A wrapper for the Blobbie component

##### Signature

`function AccountBlobbie(

props: Omit<BlobbieProps, "address">,

): Element;

`

### Parameters

##### props

 BlobbieProps

#### Type

`let props: Omit<BlobbieProps, "address">;

`

### Returns

##### Return Type

`let returnType: Element;

`
## AdapterWalletOptions

`type AdapterWalletOptions = {

adaptedAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

onDisconnect: () => Promise<void> | void;

switchChain: (chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain)) => Promise<void> | void;

};

`

##### adaptedAccount

`type adaptedAccount = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### chain

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### onDisconnect

##### Signature

`function onDisconnect(): Promise<void> | void;

`

##### Returns

##### Return Type

`let returnType: Promise<void> | void;

`

##### switchChain

##### Signature

`function switchChain(chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain)): Promise<void> | void;

`

##### Parameters

##### chain

###### Type

`let chain: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`

##### Returns

##### Return Type

`let returnType: Promise<void> | void;

`
## AddAdminOptions

`type AddAdminOptions = { account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account); adminAddress: string };

`

##### account

 The admin account that will perform the operation.

`type account = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### adminAddress

 The address to add as an admin.

`type adminAddress = string;

`
## AccountProviderProps

 Props for the `<AccountProvider />` component

`type AccountProviderProps = {

address: string;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

};

`

##### address

 The user's wallet address

`type address = string;

`

##### client

 thirdweb Client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`
## AddMessage

`type AddMessage = {

deadline: bigint;

key: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

keyType: number;

metadata: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

metadataType: number;

nonce: bigint;

owner: Address;

};

`

##### deadline

 Unix timestamp when this message expires

`type deadline = bigint;

`

##### key

 Public key to register onchain

`type key = [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

`

##### keyType

 Key type. The only currently supported key type is 1, for EdDSA signers.

`type keyType = number;

`

##### metadata

 ABI-encoded SignedKeyRequestMetadata struct

`type metadata = [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

`

##### metadataType

 Metadata type. The only currently supported metadata type is 1.

`type metadataType = number;

`

##### nonce

 KeyGateway nonce for signer address

`type nonce = bigint;

`

##### owner

 FID owner address

`type owner = Address;

`
## AddParams

 Represents the parameters for the "add" function.

`type AddParams = WithOverrides<{

chainId: AbiParameterToPrimitiveType<{

name: "_chainId";

type: "uint256";

 }>;

deployer: AbiParameterToPrimitiveType<{

name: "_deployer";

type: "address";

 }>;

deployment: AbiParameterToPrimitiveType<{

name: "_deployment";

type: "address";

 }>;

metadataUri: AbiParameterToPrimitiveType<{

name: "metadataUri";

type: "string";

 }>;

}>;

`
## AddSessionKeyOptions

`type AddSessionKeyOptions = {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

permissions: AccountPermissions;

sessionKeyAddress: string;

};

`

##### account

 The admin account that will perform the operation.

`type account = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### permissions

 The permissions to assign to the session key.

`type permissions = AccountPermissions;

`

##### sessionKeyAddress

 The address to add as a session key.

`type sessionKeyAddress = string;

`
## AddSignerForParams

 Represents the parameters for the `addSignerFor` function.

`type AddSignerForParams = Prettify<

 {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

disableCache?: boolean;

signerPublicKey: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

 } & (

| { appAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account) }

| {

appAccountAddress: Address;

deadline: bigint;

signedKeyRequestMetadata: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

 }

 ) &

 (

| { userAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account) }

| { addSignature: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex); deadline: bigint; userAddress: Address }

 )

>;

`
## AddSignerParams

 Represents the parameters for the `addSigner` function.

`type AddSignerParams = Prettify<

 {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

disableCache?: boolean;

signerPublicKey: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

 } & (

| { appAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account) }

| {

appAccountAddress: Address;

deadline: bigint;

signedKeyRequestMetadata: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

 }

 )

>;

`
## Aggregate3Params

 Represents the parameters for the "aggregate3" function.

`type Aggregate3Params = WithOverrides<{

calls: AbiParameterToPrimitiveType<{

components: [

 { name: "target"; type: "address" },

 { name: "allowFailure"; type: "bool" },

 { name: "callData"; type: "bytes" },

 ];

name: "calls";

type: "tuple[]";

 }>;

}>;

`
## AggregateParams

 Represents the parameters for the "aggregate" function.

`type AggregateParams = WithOverrides<{

calls: AbiParameterToPrimitiveType<{

components: [

 { name: "target"; type: "address" },

 { name: "callData"; type: "bytes" },

 ];

name: "calls";

type: "tuple[]";

 }>;

}>;

`
## AbiParameterToPrimitiveType

 Converts AbiParameter to corresponding TypeScript primitive type.

`` type AbiParameterToPrimitiveType<

abiParameter extends AbiParameter | { name: string; type: unknown },

abiParameterKind extends AbiParameterKind = AbiParameterKind,

> = abiParameter["type"] extends AbiBasicType

? AbiTypeToPrimitiveType<abiParameter["type"], abiParameterKind>

: abiParameter extends {

components: infer components;

type: SolidityTuple;

 }

? AbiComponentsToPrimitiveType<components, abiParameterKind>

: MaybeExtractArrayParameterType<abiParameter["type"]> extends [

infer head,

infer size,

 ]

? AbiArrayToPrimitiveType<

abiParameter,

abiParameterKind,

head,

size

 >

: ResolvedRegister["strictAbiType"] extends true

? Error<`Unknown type '${abiParameter["type"] & string}'.`>

: abiParameter extends { components: Error<string> }

? abiParameter["components"]

: unknown;

 ``
## AirdropERC1155Params

 Represents the parameters for the "airdropERC1155" function.

`type AirdropERC1155Params = WithOverrides<{

contents: AbiParameterToPrimitiveType<{

components: [

 { name: "recipient"; type: "address" },

 { name: "tokenId"; type: "uint256" },

 { name: "amount"; type: "uint256" },

 ];

name: "_contents";

type: "tuple[]";

 }>;

tokenAddress: AbiParameterToPrimitiveType<{

name: "_tokenAddress";

type: "address";

 }>;

}>;

`
## Aggregate3ValueParams

 Represents the parameters for the "aggregate3Value" function.

`type Aggregate3ValueParams = WithOverrides<{

calls: AbiParameterToPrimitiveType<{

components: [

 { name: "target"; type: "address" },

 { name: "allowFailure"; type: "bool" },

 { name: "value"; type: "uint256" },

 { name: "callData"; type: "bytes" },

 ];

name: "calls";

type: "tuple[]";

 }>;

}>;

`
## AirdropERC20Params

 Represents the parameters for the "airdropERC20" function.

`type AirdropERC20Params = WithOverrides<{

contents: AbiParameterToPrimitiveType<{

components: [

 { name: "recipient"; type: "address" },

 { name: "amount"; type: "uint256" },

 ];

name: "_contents";

type: "tuple[]";

 }>;

tokenAddress: AbiParameterToPrimitiveType<{

name: "_tokenAddress";

type: "address";

 }>;

}>;

`
## AirdropERC721Params

 Represents the parameters for the "airdropERC721" function.

`type AirdropERC721Params = WithOverrides<{

contents: AbiParameterToPrimitiveType<{

components: [

 { name: "recipient"; type: "address" },

 { name: "tokenId"; type: "uint256" },

 ];

name: "_contents";

type: "tuple[]";

 }>;

tokenAddress: AbiParameterToPrimitiveType<{

name: "_tokenAddress";

type: "address";

 }>;

}>;

`
## AirdropNativeTokenParams

 Represents the parameters for the "airdropNativeToken" function.

`type AirdropNativeTokenParams = WithOverrides<{

contents: AbiParameterToPrimitiveType<{

components: [

 { name: "recipient"; type: "address" },

 { name: "amount"; type: "uint256" },

 ];

name: "_contents";

type: "tuple[]";

 }>;

}>;

`
## AllowanceParams

 Represents the parameters for the "allowance" function.

`type AllowanceParams = {

owner: AbiParameterToPrimitiveType<{

name: "owner";

type: "address";

 }>;

spender: AbiParameterToPrimitiveType<{

name: "spender";

type: "address";

 }>;

};

`

##### owner

`type owner = AbiParameterToPrimitiveType<{

name: "owner";

type: "address";

}>;

`

##### spender

`type spender = AbiParameterToPrimitiveType<{

name: "spender";

type: "address";

}>;

`
## ApprovalEventFilters

 Represents the filters for the "Approval" event.

`type ApprovalEventFilters = Partial<{

approved: AbiParameterToPrimitiveType<{

indexed: true;

name: "approved";

type: "address";

 }>;

owner: AbiParameterToPrimitiveType<{

indexed: true;

name: "owner";

type: "address";

 }>;

tokenId: AbiParameterToPrimitiveType<{

indexed: true;

name: "tokenId";

type: "uint256";

 }>;

}>;

`
## ApprovalEventFilters

 Represents the filters for the "Approval" event.

`type ApprovalEventFilters = Partial<{

owner: AbiParameterToPrimitiveType<{

indexed: true;

name: "owner";

type: "address";

 }>;

spender: AbiParameterToPrimitiveType<{

indexed: true;

name: "spender";

type: "address";

 }>;

}>;

`
## ApprovalForAllEventFilters

 Represents the filters for the "ApprovalForAll" event.

`type ApprovalForAllEventFilters = Partial<{

_operator: AbiParameterToPrimitiveType<{

indexed: true;

name: "_operator";

type: "address";

 }>;

_owner: AbiParameterToPrimitiveType<{

indexed: true;

name: "_owner";

type: "address";

 }>;

}>;

`
## ApprovalForAllEventFilters

 Represents the filters for the "ApprovalForAll" event.

`type ApprovalForAllEventFilters = Partial<{

operator: AbiParameterToPrimitiveType<{

indexed: true;

name: "operator";

type: "address";

 }>;

owner: AbiParameterToPrimitiveType<{

indexed: true;

name: "owner";

type: "address";

 }>;

}>;

`
## ApproveBuyerForListingParams

 Represents the parameters for the "approveBuyerForListing" function.

`type ApproveBuyerForListingParams = WithOverrides<{

buyer: AbiParameterToPrimitiveType<{

name: "_buyer";

type: "address";

 }>;

listingId: AbiParameterToPrimitiveType<{

name: "_listingId";

type: "uint256";

 }>;

toApprove: AbiParameterToPrimitiveType<{

name: "_toApprove";

type: "bool";

 }>;

}>;

`
## ApproveCurrencyForListingParams

 Represents the parameters for the "approveCurrencyForListing" function.

`type ApproveCurrencyForListingParams = WithOverrides<{

currency: AbiParameterToPrimitiveType<{

name: "_currency";

type: "address";

 }>;

listingId: AbiParameterToPrimitiveType<{

name: "_listingId";

type: "uint256";

 }>;

pricePerTokenInCurrency: AbiParameterToPrimitiveType<{

name: "_pricePerTokenInCurrency";

type: "uint256";

 }>;

}>;

`
## ApproveParams

 Represents the parameters for the `approve` function.

`type ApproveParams = Prettify<

 { spender: Address } & (

| { amount: number | string }

| { amountWei: bigint }

 )

>;

`
## ApproveParams

 Represents the parameters for the "approve" function.

`type ApproveParams = WithOverrides<{

to: AbiParameterToPrimitiveType<{ name: "to"; type: "address" }>;

tokenId: AbiParameterToPrimitiveType<{

name: "tokenId";

type: "uint256";

 }>;

}>;

`
## AsyncStorage

`type AsyncStorage = {

getItem: (key: string) => Promise<null | string>;

removeItem: (key: string) => Promise<void>;

setItem: (key: string, value: string) => Promise<void>;

};

`

##### getItem

##### Signature

`function getItem(key: string): Promise<null | string>;

`

##### Parameters

##### key

###### Type

`let key: string;

`

##### Returns

##### Return Type

`let returnType: Promise<null | string>;

`

##### removeItem

##### Signature

`function removeItem(key: string): Promise<void>;

`

##### Parameters

##### key

###### Type

`let key: string;

`

##### Returns

##### Return Type

`let returnType: Promise<void>;

`

##### setItem

##### Signature

`function setItem(key: string, value: string): Promise<void>;

`

##### Parameters

##### key

###### Type

`let key: string;

`

##### value

###### Type

`let value: string;

`

##### Returns

##### Return Type

`let returnType: Promise<void>;

`
## AuctionClosedEventFilters

 Represents the filters for the "AuctionClosed" event.

`type AuctionClosedEventFilters = Partial<{

assetContract: AbiParameterToPrimitiveType<{

indexed: true;

name: "assetContract";

type: "address";

 }>;

auctionId: AbiParameterToPrimitiveType<{

indexed: true;

name: "auctionId";

type: "uint256";

 }>;

closer: AbiParameterToPrimitiveType<{

indexed: true;

name: "closer";

type: "address";

 }>;

}>;

`
## AuthOptions

`type AuthOptions = {

adminAccount?: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

client?: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

domain: string;

jwt?: {

expirationTimeSeconds?: number;

jwtId?: {

generate: () => string | Promise<string>;

validate: (jwtId: string) => boolean | Promise<boolean>;

 };

 };

login?: {

nonce?: {

generate: () => string | Promise<string>;

validate: (nonce: string) => boolean | Promise<boolean>;

 };

payloadExpirationTimeSeconds?: number;

resources?: Array<string>;

statement?: string;

uri?: string;

version?: string;

 };

};

`

##### adminAccount

`type adminAccount = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### domain

`type domain = string;

`

##### jwt

`type jwt = {

expirationTimeSeconds?: number;

jwtId?: {

generate: () => string | Promise<string>;

validate: (jwtId: string) => boolean | Promise<boolean>;

 };

};

`

##### login

`type login = {

nonce?: {

generate: () => string | Promise<string>;

validate: (nonce: string) => boolean | Promise<boolean>;

 };

payloadExpirationTimeSeconds?: number;

resources?: Array<string>;

statement?: string;

uri?: string;

version?: string;

};

`
## AuthorizationRequest

 An EIP-7702 authorization object fully prepared and ready for signing.

`type AuthorizationRequest = {

address: [Address](https://portal.thirdweb.com/references/typescript/v5/Address);

chainId: number;

nonce: bigint;

};

`

##### address

`type address = [Address](https://portal.thirdweb.com/references/typescript/v5/Address);

`

##### chainId

`type chainId = number;

`

##### nonce

`type nonce = bigint;

`
## AutoConnect

 AutoConnect last connected wallet on page reload or revisit. Note: If you are using `ConnectButton` or `ConnectEmbed` components, You don't need to use this component as it is already included.

 This is useful if you are manually connecting the wallets using the [useConnect](https://portal.thirdweb.com/references/typescript/v5/useConnect) hook and want to auto connect the last connected wallets on page reload or revisit.

 You can also use the [useAutoConnect](https://portal.thirdweb.com/references/typescript/v5/useAutoConnect) hook to achieve the same result.

 To check if the wallet in in the process of auto connecting, you can use the [useIsAutoConnecting](https://portal.thirdweb.com/references/typescript/v5/useIsAutoConnecting) hook.

### Example

`import { AutoConnect } from "thirdweb/react";

import { createWallet, inAppWallet } from "thirdweb/wallets";

// list of wallets that your app uses

const wallets = [

inAppWallet(),

createWallet("io.metamask"),

createWallet("me.rainbow"),

];

function Example() {

return (

 <AutoConnect

wallets={wallets}

client={client}

appMetadata={appMetadata}

 />

 );

}

`

##### Signature

`function AutoConnect(props: [AutoConnectProps](https://portal.thirdweb.com/references/typescript/v5/AutoConnectProps)): Element;

`

### Parameters

##### props

 Object of type `AutoConnectProps` . Refer to [AutoConnectProps](https://portal.thirdweb.com/references/typescript/v5/AutoConnectProps)

#### Type

`let props: {

accountAbstraction?: [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions);

appMetadata?: AppMetadata;

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

onConnect?: (wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)) => void;

onTimeout?: () => void;

timeout?: number;

wallets?: Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

};

`

### Returns

##### Return Type

`let returnType: Element;

`
## AutoConnectProps

`type AutoConnectProps = {

accountAbstraction?: [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions);

appMetadata?: AppMetadata;

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

onConnect?: (wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)) => void;

onTimeout?: () => void;

timeout?: number;

wallets?: Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

};

`

##### accountAbstraction

 Enable Account abstraction for all wallets. This will connect to the users's smart account based on the connected personal wallet and the given options.

 If you are connecting to smart wallet using personal wallet - setting this configuration will autoConnect the personal wallet and then connect to the smart wallet.

`<AutoConnect

accountAbstraction={{

 factoryAddress: "0x123...",

 chain: sepolia,

 gasless: true;

 }}

/>

`

`type accountAbstraction = [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions);

`

##### appMetadata

 Metadata of the app that will be passed to connected wallet. Setting this is highly recommended.

 Some wallets display this information to the user when they connect to your app.

`type appMetadata = AppMetadata;

`

### Example

`{

name: "My App",

url: "https://my-app.com",

description: "some description about your app",

logoUrl: "https://path/to/my-app/logo.svg",

};

`

##### chain

 Optional chain to autoconnect to

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### client

 A client is the entry point to the thirdweb SDK. It is required for all other actions. You can create a client using the `createThirdwebClient` function. Refer to the [ Creating a Client](https://portal.thirdweb.com/typescript/v5/client) documentation for more information.

 You must provide a `clientId` or `secretKey` in order to initialize a client. Pass `clientId` if you want for client-side usage and `secretKey` for server-side usage.

`import { createThirdwebClient } from "thirdweb";

const client = createThirdwebClient({

 clientId: "<your_client_id>",

});

`

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### onConnect

##### Signature

`function onConnect(wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)): void;

`

##### Parameters

##### wallet

###### Type

`let wallet: {

getAdminAccount?: () => [Account](https://portal.thirdweb.com/references/typescript/v5/Account) | undefined;

getConfig: () => [CreateWalletArgs](https://portal.thirdweb.com/references/typescript/v5/CreateWalletArgs)<TWalletId>[1];

id: TWalletId;

onConnectRequested?: () => Promise<void>;

subscribe: [WalletEmitter](https://portal.thirdweb.com/references/typescript/v5/WalletEmitter)<TWalletId>["subscribe"];

autoConnect: (

options: [WalletAutoConnectionOption](https://portal.thirdweb.com/references/typescript/v5/WalletAutoConnectionOption)<TWalletId>,

 ) => Promise<[Account](https://portal.thirdweb.com/references/typescript/v5/Account)>;

connect: (

options: [WalletConnectionOption](https://portal.thirdweb.com/references/typescript/v5/WalletConnectionOption)<TWalletId>,

 ) => Promise<[Account](https://portal.thirdweb.com/references/typescript/v5/Account)>;

disconnect: () => Promise<void>;

getAccount: () => undefined | [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

getChain: () =>

| undefined

| Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

switchChain: (chain: Readonly) => Promise<void>;

};

`

##### Returns

##### Return Type

`let returnType: void;

`

##### onTimeout

##### Signature

`function onTimeout(): void;

`

##### Returns

##### Return Type

`let returnType: void;

`

##### timeout

 if the autoConnection does not succeed within given timeout in milliseconds, it will be cancelled.

 By default, the timeout is set to 15000ms (15 seconds).

`<AutoConnect

client={client}

autoConnect={{ timeout: 10000 }}

wallets={wallets}

appMetadata={appMetadata}

/>;

`

`type timeout = number;

`

##### wallets

 Array of wallets that your app uses

`type wallets = Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

`

### Example

`import { AutoConnect } from "thirdweb/react";

import { createWallet, inAppWallet } from "thirdweb/wallets";

const wallets = [

inAppWallet(),

createWallet("io.metamask"),

createWallet("com.coinbase.wallet"),

createWallet("me.rainbow"),

];

function Example() {

return <AutoConnect client={client} wallets={wallets} />;

}

`
## BalanceOfParams

 Represents the parameters for the "balanceOf" function.

`type BalanceOfParams = {

owner: AbiParameterToPrimitiveType<{

name: "_owner";

type: "address";

 }>;

tokenId: AbiParameterToPrimitiveType<{

name: "tokenId";

type: "uint256";

 }>;

};

`

##### owner

`type owner = AbiParameterToPrimitiveType<{

name: "_owner";

type: "address";

}>;

`

##### tokenId

`type tokenId = AbiParameterToPrimitiveType<{

name: "tokenId";

type: "uint256";

}>;

`
## BalanceOfBatchParams

 Represents the parameters for the "balanceOfBatch" function.

`type BalanceOfBatchParams = {

owners: AbiParameterToPrimitiveType<{

name: "_owners";

type: "address[]";

 }>;

tokenIds: AbiParameterToPrimitiveType<{

name: "tokenIds";

type: "uint256[]";

 }>;

};

`

##### owners

`type owners = AbiParameterToPrimitiveType<{

name: "_owners";

type: "address[]";

}>;

`

##### tokenIds

`type tokenIds = AbiParameterToPrimitiveType<{

name: "tokenIds";

type: "uint256[]";

}>;

`
## BatchToReveal

`type BatchToReveal = {

batchId: bigint;

batchUri: string;

placeholderMetadata: undefined | NFTMetadata;

};

`

##### batchId

`type batchId = bigint;

`

##### batchUri

`type batchUri = string;

`

##### placeholderMetadata

`type placeholderMetadata = undefined | [NFTMetadata](https://portal.thirdweb.com/references/typescript/v5/NFTMetadata);

`
## BiconomyOptions

`type BiconomyOptions = {

apiId: string;

apiKey: string;

deadlineSeconds?: number;

provider: "biconomy";

relayerForwarderAddress: Address;

};

`

##### apiId

`type apiId = string;

`

##### apiKey

`type apiKey = string;

`

##### deadlineSeconds

`type deadlineSeconds = number;

`

##### provider

`type provider = "biconomy";

`

##### relayerForwarderAddress

`type relayerForwarderAddress = Address;

`
## BalanceOfParams

 Represents the parameters for the "balanceOf" function.

`type BalanceOfParams = {

owner: AbiParameterToPrimitiveType<{

name: "owner";

type: "address";

 }>;

};

`

##### owner

`type owner = AbiParameterToPrimitiveType<{

name: "owner";

type: "address";

}>;

`
## BlockAndAggregateParams

 Represents the parameters for the "blockAndAggregate" function.

`type BlockAndAggregateParams = WithOverrides<{

calls: AbiParameterToPrimitiveType<{

components: [

 { name: "target"; type: "address" },

 { name: "callData"; type: "bytes" },

 ];

name: "calls";

type: "tuple[]";

 }>;

}>;

`
## Blobbie

 A unique gradient avatar based on the provided address.

### Example

`import { Blobbie } from "thirdweb/react";

<Blobbie address="0x...." className="w-10 h-10" />;

`

##### Signature

`function Blobbie(props: BlobbieProps): Element;

`

### Parameters

##### props

 The component props.

#### Type

`let props: BlobbieProps;

`

### Returns

##### Return Type

`let returnType: Element;

`
## BaseTransactionOptions

`type BaseTransactionOptions<

T extends object = object,

abi extends Abi = any,

> = { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`
## BurnBatchParams

 Represents the parameters for the "burnBatch" function.

`type BurnBatchParams = WithOverrides<{

account: AbiParameterToPrimitiveType<{

name: "account";

type: "address";

 }>;

ids: AbiParameterToPrimitiveType<{

name: "ids";

type: "uint256[]";

 }>;

values: AbiParameterToPrimitiveType<{

name: "values";

type: "uint256[]";

 }>;

}>;

`
## BidInAuctionParams

`type BidInAuctionParams = { auctionId: bigint } & (

| { bidAmountWei: bigint }

| { bidAmount: string }

);

`
## BurnParams

 Represents the parameters for the "burn" function.

`type BurnParams = WithOverrides<{

tokenId: AbiParameterToPrimitiveType<{

name: "tokenId";

type: "uint256";

 }>;

}>;

`
## BurnParams

 Represents the parameters for the "burn" function.

`type BurnParams = WithOverrides<{

amount: AbiParameterToPrimitiveType<{

name: "amount";

type: "uint256";

 }>;

}>;

`
## BurnParams

 Represents the parameters for the "burn" function.

`type BurnParams = WithOverrides<{

account: AbiParameterToPrimitiveType<{

name: "account";

type: "address";

 }>;

id: AbiParameterToPrimitiveType<{ name: "id"; type: "uint256" }>;

value: AbiParameterToPrimitiveType<{

name: "value";

type: "uint256";

 }>;

}>;

`
## BuyDirectListingButton

 This button is used with thirdweb Marketplace v3 contract, for buying NFT(s) from a listing.

 Under the hood, it prepares a transaction using the [buyFromListing extension](https://portal.thirdweb.com/references/typescript/v5/marketplace/buyFromListing)and then pass it to a `<TransactionButton />`

 Since it uses the TransactionButton, it can take in any props that can be passed to the [TransactionButton](https://portal.thirdweb.com/references/typescript/v5/TransactionButton)

### Example

`import { BuyDirectListingButton } from "thirdweb/react";

<BuyDirectListingButton

contractAddress="0x..." // contract address of the marketplace v3

chain={...} // the chain which the marketplace contract is deployed on

client={...} // thirdweb client

listingId={100n} // the listingId or the item you want to buy

quantity={1n} // optional - see the docs to learn more

>

 Buy NFT

</BuyDirectListingButton>

`

 For error handling & callbacks on transaction-sent and transaction-confirmed, please refer to the TransactionButton docs.

##### Signature

`function BuyDirectListingButton(

props: [BuyDirectListingButtonProps](https://portal.thirdweb.com/references/typescript/v5/BuyDirectListingButtonProps),

): Element;

`

### Parameters

##### props

#### Type

`let props: Omit<[TransactionButtonProps](https://portal.thirdweb.com/references/typescript/v5/TransactionButtonProps), "transaction"> & {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

contractAddress: string;

listingId: bigint;

quantity?: bigint;

};

`

### Returns

##### Return Type

`let returnType: Element;

`

`<TransactionButton />`
## BuyFromListingParams

`type BuyFromListingParams = {

listingId: bigint;

quantity: bigint;

recipient: Address;

};

`

##### listingId

`type listingId = bigint;

`

##### quantity

`type quantity = bigint;

`

##### recipient

`type recipient = Address;

`
## BuyDirectListingButtonProps

`type BuyDirectListingButtonProps = Omit<

[TransactionButtonProps](https://portal.thirdweb.com/references/typescript/v5/TransactionButtonProps),

"transaction"

> & {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

contractAddress: string;

listingId: bigint;

quantity?: bigint;

};

`
## BuyHistoryData

 The result for [getBuyHistory](https://portal.thirdweb.com/references/typescript/v5/getBuyWithCryptoHistory) function

 It includes both "Buy with Crypto" and "Buy with Fiat" transactions

`type BuyHistoryData = {

hasNextPage: boolean;

page: Array<

| { buyWithFiatStatus: [BuyWithFiatStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatStatus) }

| { buyWithCryptoStatus: [BuyWithCryptoStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoStatus) }

 >;

};

`

##### hasNextPage

 Whether there are more pages of results.

`type hasNextPage = boolean;

`

##### page

 The list of buy transactions.

`type page = Array<

| { buyWithFiatStatus: [BuyWithFiatStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatStatus) }

| { buyWithCryptoStatus: [BuyWithCryptoStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoStatus) }

>;

`
## BuyWithCryptoHistoryData

 The results for [getBuyWithCryptoHistory](https://portal.thirdweb.com/references/typescript/v5/getBuyWithCryptoHistory) function It includes information about transactions that the wallet address has made through thirdweb buy with crypto.

`type BuyWithCryptoHistoryData = {

hasNextPage: boolean;

page: Array<[BuyWithCryptoStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoStatus)>;

};

`

##### hasNextPage

`type hasNextPage = boolean;

`

##### page

`type page = Array<[BuyWithCryptoStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoStatus)>;

`
## BuyHistoryParams

 The parameters for [getBuyHistory](https://portal.thirdweb.com/references/typescript/v5/getBuyHistory) function

`type BuyHistoryParams = {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

count: number;

start: number;

walletAddress: string;

};

`

##### client

 A client is the entry point to the thirdweb SDK. It is required for all other actions.

 You can create a client using the `createThirdwebClient` function. Refer to the [ Creating a Client](https://portal.thirdweb.com/typescript/v5/client) documentation for more information.

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### count

 The number of results to return.

 The default value is `10` .

`type count = number;

`

##### start

 Index of the first result to return. The default value is `0` .

`type start = number;

`

##### walletAddress

 The wallet address to get the buy history for.

`type walletAddress = string;

`
## BuyWithCryptoHistoryParams

 The parameters for [getBuyWithCryptoHistory](https://portal.thirdweb.com/references/typescript/v5/getBuyWithCryptoHistory) function It takes the wallet history address and optional cursor and page size. for paginated results.

`type BuyWithCryptoHistoryParams = {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

count: number;

start: number;

walletAddress: string;

};

`

##### client

 A client is the entry point to the thirdweb SDK. It is required for all other actions.

 You can create a client using the `createThirdwebClient` function. Refer to the [ Creating a Client](https://portal.thirdweb.com/typescript/v5/client) documentation for more information.

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### count

 The number of results to return in a single page. The default value is 10.

`type count = number;

`

##### start

 The cursor for the page of results to return. The default value is `undefined` .

`type start = number;

`

##### walletAddress

 The address of the wallet to get the wallet history for

`type walletAddress = string;

`
## BuyWithCryptoQuote

`type BuyWithCryptoQuote = {

approvalData?: QuoteApprovalInfo;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

paymentTokens: Array<QuotePaymentToken>;

processingFees: Array<QuotePaymentToken>;

swapDetails: {

estimated: {

durationSeconds?: number;

feesUSDCents: number;

fromAmountUSDCents: number;

gasCostUSDCents?: number;

slippageBPS: number;

toAmountMinUSDCents: number;

toAmountUSDCents: number;

 };

fromAddress: string;

fromAmount: string;

fromAmountWei: string;

fromToken: [QuoteTokenInfo](https://portal.thirdweb.com/references/typescript/v5/QuoteTokenInfo);

maxSlippageBPS: number;

toAddress: string;

toAmount: string;

toAmountMin: string;

toAmountMinWei: string;

toAmountWei: string;

toToken: [QuoteTokenInfo](https://portal.thirdweb.com/references/typescript/v5/QuoteTokenInfo);

 };

transactionRequest: [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions);

};

`

##### approvalData

`type approvalData = QuoteApprovalInfo;

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### paymentTokens

`type paymentTokens = Array<QuotePaymentToken>;

`

##### processingFees

`type processingFees = Array<QuotePaymentToken>;

`

##### swapDetails

`type swapDetails = {

estimated: {

durationSeconds?: number;

feesUSDCents: number;

fromAmountUSDCents: number;

gasCostUSDCents?: number;

slippageBPS: number;

toAmountMinUSDCents: number;

toAmountUSDCents: number;

 };

fromAddress: string;

fromAmount: string;

fromAmountWei: string;

fromToken: [QuoteTokenInfo](https://portal.thirdweb.com/references/typescript/v5/QuoteTokenInfo);

maxSlippageBPS: number;

toAddress: string;

toAmount: string;

toAmountMin: string;

toAmountMinWei: string;

toAmountWei: string;

toToken: [QuoteTokenInfo](https://portal.thirdweb.com/references/typescript/v5/QuoteTokenInfo);

};

`

##### transactionRequest

`type transactionRequest = [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions);

`
## BuyWithCryptoTransaction

`type BuyWithCryptoTransaction = {

chainId: number;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

transactionHash: string;

};

`

##### chainId

`type chainId = number;

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### transactionHash

`type transactionHash = string;

`
## BuyWithCryptoTransfer

`type BuyWithCryptoTransfer = {

approvalData?: QuoteApprovalInfo;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

estimatedGasCostUSDCents: number;

fromAddress: string;

paymentToken: QuotePaymentToken;

processingFee: QuotePaymentToken;

toAddress: string;

transactionRequest: [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions);

};

`

##### approvalData

`type approvalData = QuoteApprovalInfo;

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### estimatedGasCostUSDCents

`type estimatedGasCostUSDCents = number;

`

##### fromAddress

`type fromAddress = string;

`

##### paymentToken

`type paymentToken = QuotePaymentToken;

`

##### processingFee

`type processingFee = QuotePaymentToken;

`

##### toAddress

`type toAddress = string;

`

##### transactionRequest

`type transactionRequest = [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions);

`
## BurnFromParams

 Represents the parameters for the "burnFrom" function.

`type BurnFromParams = WithOverrides<{

account: AbiParameterToPrimitiveType<{

name: "account";

type: "address";

 }>;

amount: AbiParameterToPrimitiveType<{

name: "amount";

type: "uint256";

 }>;

}>;

`
## BuyWithFiatQuote

 The response object returned by the [getBuyWithFiatQuote](https://portal.thirdweb.com/references/typescript/v5/getBuyWithFiatQuote) function.

 This includes various information for buying a token using a fiat currency:

* on-ramp provider UI link
* The estimated time for the transaction to complete.
* The on-ramp and destination token information.
* Processing fees

`type BuyWithFiatQuote = {

estimatedDurationSeconds: number;

estimatedToAmountMin: string;

estimatedToAmountMinWei: string;

fromAddress: string;

fromCurrency: {

amount: string;

amountUnits: string;

currencySymbol: string;

decimals: number;

 };

fromCurrencyWithFees: {

amount: string;

amountUnits: string;

currencySymbol: string;

decimals: number;

 };

intentId: string;

maxSlippageBPS: number;

onRampLink: string;

onRampToken: {

amount: string;

amountUSDCents: number;

amountWei: string;

token: [PayTokenInfo](https://portal.thirdweb.com/references/typescript/v5/PayTokenInfo);

 };

processingFees: Array<{

amount: string;

amountUnits: string;

currencySymbol: string;

decimals: number;

feeType: "ON_RAMP" | "NETWORK";

 }>;

provider: FiatProvider;

routingToken?: {

amount: string;

amountUSDCents: number;

amountWei: string;

token: [PayTokenInfo](https://portal.thirdweb.com/references/typescript/v5/PayTokenInfo);

 };

toAddress: string;

toAmountMin: string;

toAmountMinWei: string;

toToken: [PayTokenInfo](https://portal.thirdweb.com/references/typescript/v5/PayTokenInfo);

};

`

##### estimatedDurationSeconds

 Estimated time for the transaction to complete in seconds.

`type estimatedDurationSeconds = number;

`

##### estimatedToAmountMin

 Minimum amount of token that is expected to be received in units.

`type estimatedToAmountMin = string;

`

##### estimatedToAmountMinWei

 Minimum amount of token that is expected to be received in wei.

`type estimatedToAmountMinWei = string;

`

##### fromAddress

 Address of the wallet used for buying the token.

`type fromAddress = string;

`

##### fromCurrency

 fiat currency used to buy the token - excluding the fees.

`type fromCurrency = {

amount: string;

amountUnits: string;

currencySymbol: string;

decimals: number;

};

`

##### fromCurrencyWithFees

 Fiat currency used to buy the token - including the fees.

`type fromCurrencyWithFees = {

amount: string;

amountUnits: string;

currencySymbol: string;

decimals: number;

};

`

##### intentId

 Id of transaction

`type intentId = string;

`

##### maxSlippageBPS

 The maximum slippage in basis points (bps) allowed for the transaction.

`type maxSlippageBPS = number;

`

##### onRampLink

 Link to the on-ramp provider UI that will prompt the user to buy the token with fiat currency.

 This link should be opened in a new tab.

`type onRampLink = string;

`

### Example

`window.open(quote.onRampLink, "_blank");

`

##### onRampToken

 Token that will be sent to the user's wallet address by the on-ramp provider.

 If the token is same as `toToken` \- the user can directly buy the token from the on-ramp provider. If not, the user will receive this token and a swap is required to convert it `toToken` .

`type onRampToken = {

amount: string;

amountUSDCents: number;

amountWei: string;

token: [PayTokenInfo](https://portal.thirdweb.com/references/typescript/v5/PayTokenInfo);

};

`

##### processingFees

 Array of processing fees for the transaction.

 This includes the processing fees for on-ramp and swap (if required).

`type processingFees = Array<{

amount: string;

amountUnits: string;

currencySymbol: string;

decimals: number;

feeType: "ON_RAMP" | "NETWORK";

}>;

`

##### provider

 The provider that was used to get the quote.

`type provider = FiatProvider;

`

##### routingToken

 Routing token that will be swapped from the on-ramp token, so that it can be bridged to the destination token.

`type routingToken = {

amount: string;

amountUSDCents: number;

amountWei: string;

token: [PayTokenInfo](https://portal.thirdweb.com/references/typescript/v5/PayTokenInfo);

};

`

##### toAddress

 Address of the wallet to which the tokens will be sent.

`type toAddress = string;

`

##### toAmountMin

 Amount of token that is expected to be received in wei.

 (estimatedToAmountMin - maxSlippageWei)

`type toAmountMin = string;

`

##### toAmountMinWei

 Amount of token that is expected to be received in units.

 (estimatedToAmountMinWei - maxSlippageWei)

`type toAmountMinWei = string;

`

##### toToken

 Token information for the desired token. (token the user wants to buy)

`type toToken = [PayTokenInfo](https://portal.thirdweb.com/references/typescript/v5/PayTokenInfo);

`
## BuyWithCryptoStatus

 The object returned by the [getBuyWithCryptoStatus](https://portal.thirdweb.com/references/typescript/v5/getBuyWithCryptoStatus) function to represent the status of a quoted transaction

`type BuyWithCryptoStatus =

| { status: "NOT_FOUND" }

| {

bridge?: string;

destination?: [PayOnChainTransactionDetails](https://portal.thirdweb.com/references/typescript/v5/PayOnChainTransactionDetails);

failureMessage?: string;

fromAddress: string;

purchaseData?: object;

quote: BuyWithCryptoQuoteSummary;

source?: [PayOnChainTransactionDetails](https://portal.thirdweb.com/references/typescript/v5/PayOnChainTransactionDetails);

status: BuyWithCryptoStatuses;

subStatus: BuyWithCryptoSubStatuses;

swapType: SwapType;

toAddress: string;

 };

`
## BuyWithFiatHistoryData

 The results for [getBuyWithFiatHistory](https://portal.thirdweb.com/references/typescript/v5/getBuyWithFiatHistory) function

`type BuyWithFiatHistoryData = {

hasNextPage: boolean;

page: Array<[BuyWithFiatStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatStatus)>;

};

`

##### hasNextPage

`type hasNextPage = boolean;

`

##### page

`type page = Array<[BuyWithFiatStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatStatus)>;

`
## BuyWithFiatStatus

 The returned object from [getBuyWithFiatStatus](https://portal.thirdweb.com/references/typescript/v5/getBuyWithFiatStatus) function

 If the in invalid intentId is provided, the object will have a status of "NOT\_FOUND" and no other fields.

`type BuyWithFiatStatus =

| { status: "NOT_FOUND" }

| {

destination?: [PayOnChainTransactionDetails](https://portal.thirdweb.com/references/typescript/v5/PayOnChainTransactionDetails);

failureMessage?: string;

fromAddress: string;

intentId: string;

purchaseData?: object;

quote: {

createdAt: string;

estimatedDurationSeconds?: number;

estimatedOnRampAmount: string;

estimatedOnRampAmountWei: string;

estimatedToTokenAmount: string;

estimatedToTokenAmountWei: string;

fromCurrency: {

amount: string;

amountUnits: string;

currencySymbol: string;

decimals: number;

 };

fromCurrencyWithFees: {

amount: string;

amountUnits: string;

currencySymbol: string;

decimals: number;

 };

onRampToken: [PayTokenInfo](https://portal.thirdweb.com/references/typescript/v5/PayTokenInfo);

toToken: [PayTokenInfo](https://portal.thirdweb.com/references/typescript/v5/PayTokenInfo);

 };

source?: [PayOnChainTransactionDetails](https://portal.thirdweb.com/references/typescript/v5/PayOnChainTransactionDetails);

status:

| "NONE"

| "PENDING_PAYMENT"

| "PAYMENT_FAILED"

| "PENDING_ON_RAMP_TRANSFER"

| "ON_RAMP_TRANSFER_IN_PROGRESS"

| "ON_RAMP_TRANSFER_COMPLETED"

| "ON_RAMP_TRANSFER_FAILED"

| "CRYPTO_SWAP_REQUIRED"

| "CRYPTO_SWAP_COMPLETED"

| "CRYPTO_SWAP_FALLBACK"

| "CRYPTO_SWAP_IN_PROGRESS"

| "CRYPTO_SWAP_FAILED";

toAddress: string;

 };

`
## BuyerApprovedForListingEventFilters

 Represents the filters for the "BuyerApprovedForListing" event.

`type BuyerApprovedForListingEventFilters = Partial<{

buyer: AbiParameterToPrimitiveType<{

indexed: true;

name: "buyer";

type: "address";

 }>;

listingId: AbiParameterToPrimitiveType<{

indexed: true;

name: "listingId";

type: "uint256";

 }>;

}>;

`
## BytesToBigIntOpts

`type BytesToBigIntOpts = { signed?: boolean; size?: number };

`

##### signed

 Whether or not the number of a signed representation.

`type signed = boolean;

`

##### size

 Size of the bytes.

`type size = number;

`
## BuyWithFiatHistoryParams

 The parameters for [getBuyWithFiatHistory](https://portal.thirdweb.com/references/typescript/v5/getBuyWithFiatHistory) function

`type BuyWithFiatHistoryParams = {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

count: number;

start: number;

walletAddress: string;

};

`

##### client

 A client is the entry point to the thirdweb SDK. It is required for all other actions.

 You can create a client using the `createThirdwebClient` function. Refer to the [ Creating a Client](https://portal.thirdweb.com/typescript/v5/client) documentation for more information.

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### count

 The number of results to return in a single page. The default value is `10` .

`type count = number;

`

##### start

 index of the first result to return. The default value is `0` .

 If you want to start the list from nth item, you can set the start value to (n-1).

`type start = number;

`

##### walletAddress

 The address of the wallet to get the wallet history for

`type walletAddress = string;

`
## BuyoutAuctionParams

`type BuyoutAuctionParams = { auctionId: bigint };

`

##### auctionId

`type auctionId = bigint;

`
## CanClaimParams

`type CanClaimParams = { claimer: string; from?: string } & (

| { quantityInWei: bigint }

| { quantity: string }

);

`
## CanClaimParams

`type CanClaimParams = {

claimer: string;

from?: string;

quantity: bigint;

tokenId: bigint;

};

`

##### claimer

`type claimer = string;

`

##### from

`type from = string;

`

##### quantity

`type quantity = bigint;

`

##### tokenId

`type tokenId = bigint;

`
## CanClaimParams

`type CanClaimParams = {

claimer: string;

from?: string;

quantity: bigint;

};

`

##### claimer

`type claimer = string;

`

##### from

`type from = string;

`

##### quantity

`type quantity = bigint;

`
## CanClaimResult

`type CanClaimResult = { reason?: string; result: boolean };

`

##### reason

`type reason = string;

`

##### result

`type result = boolean;

`
## CancelAuctionParams

`type CancelAuctionParams = { auctionId: bigint };

`

##### auctionId

`type auctionId = bigint;

`
## BalanceOfParams

 Represents the parameters for the "balanceOf" function.

`type BalanceOfParams = {

address: AbiParameterToPrimitiveType<{

name: "_address";

type: "address";

 }>;

};

`

##### address

`type address = AbiParameterToPrimitiveType<{

name: "_address";

type: "address";

}>;

`
## CanClaimResult

`type CanClaimResult = { reason?: string; result: boolean };

`

##### reason

`type reason = string;

`

##### result

`type result = boolean;

`
## CancelOfferParams

 Represents the parameters for the "cancelOffer" function.

`type CancelOfferParams = WithOverrides<{

offerId: AbiParameterToPrimitiveType<{

name: "_offerId";

type: "uint256";

 }>;

}>;

`
## CancelledListingEventFilters

 Represents the filters for the "CancelledListing" event.

`type CancelledListingEventFilters = Partial<{

listingCreator: AbiParameterToPrimitiveType<{

indexed: true;

name: "listingCreator";

type: "address";

 }>;

listingId: AbiParameterToPrimitiveType<{

indexed: true;

name: "listingId";

type: "uint256";

 }>;

}>;

`
## CancelListingParams

 Represents the parameters for the "cancelListing" function.

`type CancelListingParams = WithOverrides<{

listingId: AbiParameterToPrimitiveType<{

name: "_listingId";

type: "uint256";

 }>;

}>;

`
## CancelledOfferEventFilters

 Represents the filters for the "CancelledOffer" event.

`type CancelledOfferEventFilters = Partial<{

offerId: AbiParameterToPrimitiveType<{

indexed: true;

name: "offerId";

type: "uint256";

 }>;

offeror: AbiParameterToPrimitiveType<{

indexed: true;

name: "offeror";

type: "address";

 }>;

}>;

`
## CastVoteBySigParams

 Represents the parameters for the "castVoteBySig" function.

`type CastVoteBySigParams = WithOverrides<{

proposalId: AbiParameterToPrimitiveType<{

name: "proposalId";

type: "uint256";

 }>;

r: AbiParameterToPrimitiveType<{ name: "r"; type: "bytes32" }>;

s: AbiParameterToPrimitiveType<{ name: "s"; type: "bytes32" }>;

support: AbiParameterToPrimitiveType<{

name: "support";

type: "uint8";

 }>;

v: AbiParameterToPrimitiveType<{ name: "v"; type: "uint8" }>;

}>;

`
## CastVoteParams

 Represents the parameters for the "castVote" function.

`type CastVoteParams = WithOverrides<{

proposalId: AbiParameterToPrimitiveType<{

name: "proposalId";

type: "uint256";

 }>;

support: AbiParameterToPrimitiveType<{

name: "support";

type: "uint8";

 }>;

}>;

`
## CastVoteWithReasonAndParamsParams

 Represents the parameters for the "castVoteWithReasonAndParams" function.

`type CastVoteWithReasonAndParamsParams = WithOverrides<{

params: AbiParameterToPrimitiveType<{

name: "params";

type: "bytes";

 }>;

proposalId: AbiParameterToPrimitiveType<{

name: "proposalId";

type: "uint256";

 }>;

reason: AbiParameterToPrimitiveType<{

name: "reason";

type: "string";

 }>;

support: AbiParameterToPrimitiveType<{

name: "support";

type: "uint8";

 }>;

}>;

`
## CancelledAuctionEventFilters

 Represents the filters for the "CancelledAuction" event.

`type CancelledAuctionEventFilters = Partial<{

auctionCreator: AbiParameterToPrimitiveType<{

indexed: true;

name: "auctionCreator";

type: "address";

 }>;

auctionId: AbiParameterToPrimitiveType<{

indexed: true;

name: "auctionId";

type: "uint256";

 }>;

}>;

`
## CastVoteWithReasonAndParamsBySigParams

 Represents the parameters for the "castVoteWithReasonAndParamsBySig" function.

`type CastVoteWithReasonAndParamsBySigParams = WithOverrides<{

params: AbiParameterToPrimitiveType<{

name: "params";

type: "bytes";

 }>;

proposalId: AbiParameterToPrimitiveType<{

name: "proposalId";

type: "uint256";

 }>;

r: AbiParameterToPrimitiveType<{ name: "r"; type: "bytes32" }>;

reason: AbiParameterToPrimitiveType<{

name: "reason";

type: "string";

 }>;

s: AbiParameterToPrimitiveType<{ name: "s"; type: "bytes32" }>;

support: AbiParameterToPrimitiveType<{

name: "support";

type: "uint8";

 }>;

v: AbiParameterToPrimitiveType<{ name: "v"; type: "uint8" }>;

}>;

`
## ChainMetadata

`type ChainMetadata = { chain: string; chainId: number; ens?: { registry: string }; explorers?: Readonly<Array<ChainExplorer>>; faucets?: readonly Array<string>; features?: Readonly<Array<{ name: string }>>; icon?: Icon; infoURL?: string; name: string; nativeCurrency: { decimals: number; name: string; symbol: string }; networkId?: number; parent?: { bridges?: Readonly<Array<{ url: string }>>; chain: string; type: string }; redFlags?: readonly Array<string>; rpc: readonly Array<string>; shortName: string; slip44?: number; slug: string; stackType: string; status?: string; testnet: boolean; title?: string }

`

##### chain

`type chain = string;

`

##### chainId

`type chainId = number;

`

##### ens

`type ens = { registry: string };

`

##### explorers

`type explorers = Readonly<Array<ChainExplorer>>;

`

##### faucets

`type faucets = readonly Array<string>

`

##### features

`type features = Readonly<Array<{ name: string }>>;

`

##### icon

`type icon = Icon;

`

##### infoURL

`type infoURL = string;

`

##### name

`type name = string;

`

##### nativeCurrency

`type nativeCurrency = {

decimals: number;

name: string;

symbol: string;

};

`

##### networkId

`type networkId = number;

`

##### parent

`type parent = {

bridges?: Readonly<Array<{ url: string }>>;

chain: string;

type: string;

};

`

##### redFlags

`type redFlags = readonly Array<string>

`

##### rpc

`type rpc = readonly Array<string>

`

##### shortName

`type shortName = string;

`

##### slip44

`type slip44 = number;

`

##### slug

`type slug = string;

`

##### stackType

`type stackType = string;

`

##### status

`type status = string;

`

##### testnet

`type testnet = boolean;

`

##### title

`type title = string;

`
## ChainOptions

`type ChainOptions = {

blockExplorers?: Array<{

apiUrl?: string;

name: string;

url: string;

 }>;

experimental?: { increaseZeroByteCount?: boolean };

faucets?: Array<string>;

feeType?: FeeType;

icon?: Icon;

id: number;

name?: string;

nativeCurrency?: {

decimals?: number;

name?: string;

symbol?: string;

 };

rpc?: string;

testnet?: true;

};

`

##### blockExplorers

`type blockExplorers = Array<{

apiUrl?: string;

name: string;

url: string;

}>;

`

##### experimental

`type experimental = { increaseZeroByteCount?: boolean };

`

##### faucets

`type faucets = Array<string>;

`

##### feeType

`type feeType = FeeType;

`

##### icon

`type icon = Icon;

`

##### id

`type id = number;

`

##### name

`type name = string;

`

##### nativeCurrency

`type nativeCurrency = {

decimals?: number;

name?: string;

symbol?: string;

};

`

##### rpc

`type rpc = string;

`

##### testnet

`type testnet = true;

`
## ChainProvider

 A React context provider component that supplies Chain-related data to its child components.

 This component serves as a wrapper around the `ChainProviderContext.Provider` and passes the provided chain data down to all of its child components through the context API.

### Example

####  Basic usage

`import { ChainProvider, ChainIcon, ChainName } from "thirdweb/react";

import { ethereum } from "thirdweb/chains";

<ChainProvider chain={ethereum}>

 <ChainIcon />

 <ChainName />

</ChainProvider>;

`

####  Usage with defineChain

`import { defineChain } from "thirdweb/chains"l

import { ChainProvider, ChainName } from "thirdweb/react";

const chainId = someNumber;

<ChainProvider chain={defineChain(chainId)}>

 <ChainName />

</ChainProvider>

`

##### Signature

`function ChainProvider(

props: PropsWithChildren<[ChainProviderProps](https://portal.thirdweb.com/references/typescript/v5/ChainProviderProps)>,

): Element;

`

### Parameters

##### props

#### Type

`let props: PropsWithChildren<[ChainProviderProps](https://portal.thirdweb.com/references/typescript/v5/ChainProviderProps)>;

`

### Returns

##### Return Type

`let returnType: Element;

`
## ChainProviderProps

 Props for the `<ChainProvider />` component

`type ChainProviderProps = { chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain) };

`

##### chain

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`
## ChangeRecoveryAddressParams

 Represents the parameters for the "changeRecoveryAddress" function.

`type ChangeRecoveryAddressParams = WithOverrides<{

recovery: AbiParameterToPrimitiveType<{

name: "recovery";

type: "address";

 }>;

}>;

`
## CastVoteWithReasonParams

 Represents the parameters for the "castVoteWithReason" function.

`type CastVoteWithReasonParams = WithOverrides<{

proposalId: AbiParameterToPrimitiveType<{

name: "proposalId";

type: "uint256";

 }>;

reason: AbiParameterToPrimitiveType<{

name: "reason";

type: "string";

 }>;

support: AbiParameterToPrimitiveType<{

name: "support";

type: "uint8";

 }>;

}>;

`
## ClaimButton

 This button is used to claim tokens (NFT or ERC20) from a given thirdweb Drop contract.

 there are 3 type of Drop contract: NFT Drop (DropERC721), Edition Drop (DropERC1155) and Token Drop (DropERC20)

 Learn more: https://thirdweb.com/explore/drops

 Note: This button only works with thirdweb Drop contracts. For custom contract, please use [TransactionButton](https://portal.thirdweb.com/references/typescript/v5/TransactionButton)

### Example

 Example for claiming NFT from an NFT Drop contract

`import { ClaimButton } from "thirdweb/react";

import { ethereum } from "thirdweb/chains";

<ClaimButton

contractAddress="0x..." // contract address of the NFT Drop

chain={ethereum}

client={client}

claimParams={{

 type: "ERC721",

 quantity: 1n, // claim 1 token

 }}

>

 Claim now

</ClaimButton>;

`

 For Edition Drop (ERC1155)

`<ClaimButton

contractAddress="0x..." // contract address of the Edition Drop

chain={ethereum}

client={client}

claimParams={{

 type: "ERC1155",

 quantity: 1n,

 tokenId: 0n,

 }}

>

 Claim now

</ClaimButton>;

`

 For Token Drop (ERC20)

`` <ClaimButton

contractAddress="0x..." // contract address of the Token Drop

chain={ethereum}

client={client}

claimParams={{

 type: "ERC20",

 quantity: "100", // claim 100 ERC20 tokens

// instead of `quantity`, you can also use `quantityInWei` (bigint)

 }}

>

 Claim now

</ClaimButton>;

 ``

 Attach custom Pay metadata

`<ClaimButton

payModal={{

 metadata: {

 name: "Van Gogh Starry Night",

 image: "https://unsplash.com/starry-night.png",

 },

 }}

>

 ...

</ClaimButton>;

`

 Since this button uses the `TransactionButton` , it can take in any props that can be passed to the [TransactionButton](https://portal.thirdweb.com/references/typescript/v5/TransactionButton)

 For error handling & callbacks on transaction-sent and transaction-confirmed, please refer to the TransactionButton docs.

##### Signature

`function ClaimButton(props: [ClaimButtonProps](https://portal.thirdweb.com/references/typescript/v5/ClaimButtonProps)): Element;

`

### Parameters

##### props

#### Type

`let props: Omit<[TransactionButtonProps](https://portal.thirdweb.com/references/typescript/v5/TransactionButtonProps), "transaction"> & {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

claimParams: ClaimParams;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

contractAddress: string;

};

`

### Returns

##### Return Type

`let returnType: Element;

`

 A wrapper for TransactionButton
## CheckContractWalletSignatureOptions

`type CheckContractWalletSignatureOptions = {

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

message: SignableMessage;

signature: string;

};

`

##### contract

`type contract = [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

`

##### message

`type message = SignableMessage;

`

##### signature

`type signature = string;

`
## ClaimButtonProps

 Props for the ClaimButton component

`type ClaimButtonProps = Omit<

[TransactionButtonProps](https://portal.thirdweb.com/references/typescript/v5/TransactionButtonProps),

"transaction"

> & {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

claimParams: ClaimParams;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

contractAddress: string;

};

`
## ClaimERC1155Params

`type ClaimERC1155Params = { recipient: string; tokenAddress: string };

`

##### recipient

`type recipient = string;

`

##### tokenAddress

`type tokenAddress = string;

`
## ClaimERC20Params

`type ClaimERC20Params = { recipient: string; tokenAddress: string };

`

##### recipient

`type recipient = string;

`

##### tokenAddress

`type tokenAddress = string;

`
## ClaimERC721Params

`type ClaimERC721Params = { recipient: string; tokenAddress: string };

`

##### recipient

`type recipient = string;

`

##### tokenAddress

`type tokenAddress = string;

`
## ClaimToBatchParams

`type ClaimToBatchParams = WithOverrides<{

content: Array<{ quantity: bigint; to: Address }>;

from?: Address;

}>;

`
## ClaimToParams

 Represents the parameters for claiming an ERC20 token.

`type ClaimToParams = {

from?: Address;

singlePhaseDrop?: boolean;

to: Address;

} & ({ quantityInWei: bigint } | { quantity: string });

`
## ClaimToParams

`type ClaimToParams = {

from?: string;

quantity: bigint;

singlePhaseDrop?: boolean;

to: string;

tokenId: bigint;

};

`

##### from

`type from = string;

`

##### quantity

`type quantity = bigint;

`

##### singlePhaseDrop

`type singlePhaseDrop = boolean;

`

##### to

`type to = string;

`

##### tokenId

`type tokenId = bigint;

`
## CoinbaseSDKWalletConnectionOptions

 Options for connecting to the CoinbaseSDK Wallet

`type CoinbaseSDKWalletConnectionOptions = {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

};

`

##### chain

 If you want the wallet to be connected to a specific blockchain, you can pass a `Chain` object to the `connect` method. This will trigger a chain switch if the wallet provider is not already connected to the specified chain.

 You can create a `Chain` object using the [defineChain](https://portal.thirdweb.com/references/typescript/v5/defineChain) function. At minimum, you need to pass the `id` of the blockchain.

`import { defineChain } from "thirdweb";

const myChain = defineChain(myChainId);

const address = await wallet.connect({ chain: myChain });

`

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### client

 The Thirdweb client object

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`
## ClaimToParams

 Represents the parameters for claiming an ERC721 token.

`type ClaimToParams = {

from?: Address;

quantity: bigint;

singlePhaseDrop?: boolean;

to: Address;

};

`

##### from

`type from = Address;

`

##### quantity

`type quantity = bigint;

`

##### singlePhaseDrop

`type singlePhaseDrop = boolean;

`

##### to

`type to = Address;

`
## CheckContractWalletSignTypedDataOptions

`type CheckContractWalletSignTypedDataOptions<

typedData extends ox__TypedData.TypedData | Record<string, unknown>,

primaryType extends

| keyof typedData

| "EIP712Domain" = keyof typedData,

> = {

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

data: ox__TypedData.Definition<typedData, primaryType>;

signature: string;

};

`

##### contract

`type contract = [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

`

##### data

`type data = ox__TypedData.Definition<typedData, primaryType>;

`

##### signature

`type signature = string;

`
## CoinbaseWalletCreationOptions

`type CoinbaseWalletCreationOptions =

| {

appMetadata?: AppMetadata;

chains?: Array<[Chain](https://portal.thirdweb.com/references/typescript/v5/Chain)>;

mobileConfig?: { callbackURL?: string };

walletConfig?: Preference;

 }

| undefined;

`
## CollectAuctionTokensParams

 Represents the parameters for the "collectAuctionTokens" function.

`type CollectAuctionTokensParams = WithOverrides<{

auctionId: AbiParameterToPrimitiveType<{

name: "_auctionId";

type: "uint256";

 }>;

}>;

`
## CompleteOwnershipHandoverParams

 Represents the parameters for the "completeOwnershipHandover" function.

`type CompleteOwnershipHandoverParams = WithOverrides<{

pendingOwner: AbiParameterToPrimitiveType<{

name: "pendingOwner";

type: "address";

 }>;

}>;

`
## CanClaimResult

`type CanClaimResult = { reason?: string; result: boolean };

`

##### reason

`type reason = string;

`

##### result

`type result = boolean;

`
## ConnectButton\_connectButtonOptions

 Options for configuring the `ConnectButton` 's Connect Button

`type ConnectButton_connectButtonOptions = {

className?: string;

label?: React.ReactNode;

style?: React.CSSProperties;

};

`

##### className

 CSS class to apply to the button element

 For some CSS properties, you may need to use the `!important` to override the default styles

`<ConnectButton

connectButton={{

 className: "my-custom-class",

 }}

/>;

`

`type className = string;

`

##### label

 Set a custom label for the button. The default is `"Connect"`

`type label = React.ReactNode;

`

### Example

`<ConnectButton

connectButton={{

 label: "Sign in",

 }}

/>;

`

##### style

 CSS styles to apply to the connectButton element

`type style = React.CSSProperties;

`

### Example

`<ConnectButton

connectButton={{

 style: {

 color: "red",

 },

 }}

/>;

`
## ConnectButton\_connectModalOptions

 Options for configuring the `ConnectButton` 's Connect Modal

`type ConnectButton_connectModalOptions = {

privacyPolicyUrl?: string;

requireApproval?: boolean;

showThirdwebBranding?: boolean;

size?: "compact" | "wide";

termsOfServiceUrl?: string;

title?: string;

titleIcon?: string;

welcomeScreen?: [WelcomeScreen](https://portal.thirdweb.com/references/typescript/v5/WelcomeScreen);

};

`

##### privacyPolicyUrl

 URL of the "privacy policy" page

 If provided, Modal will show a Privacy Policy message at the bottom with below link

`type privacyPolicyUrl = string;

`

### Example

`<ConnectButton connectModal={{

 privacyPolicyUrl="https://your-privacy-policy-url.com"

}} />

`

##### requireApproval

 Require terms of service and privacy policy to be accepted before connecting an in-app wallet.

 By default it's `false`

`type requireApproval = boolean;

`

### Example

`<ConnectButton

connectModal={{

 requireApproval: true,

 }}

/>;

`

##### showThirdwebBranding

 By default `ConnectButton` 's Modal shows "Powered by Thirdweb" branding at the bottom of the Modal.

 If you want to hide the branding, set this prop to `false`

`type showThirdwebBranding = boolean;

`

### Example

`<ConnectButton

connectModal={{

 showThirdwebBranding: false,

 }}

/>;

`

##### size

 Set the size of the connect modal on desktop - `"compact"` or `"wide"`

 Modal size is always `compact` on mobile

 By default it is `"wide"` for desktop.

`type size = "compact" | "wide";

`

##### termsOfServiceUrl

 URL of the "terms of service" page

 If provided, Modal will show a Terms of Service message at the bottom with below link

`type termsOfServiceUrl = string;

`

### Example

`<ConnectButton

connectModal={{

 termsOfServiceUrl: "https://your-terms-of-service-url.com",

 }}

/>;

`

##### title

 Title to show in `ConnectButton` 's Modal

 The default is `"Connect"`

`type title = string;

`

##### titleIcon

 Replace the default thirdweb icon next to Modal title with your own icon

 Set to empty string (`""` ) to hide the icon

`type titleIcon = string;

`

### Example

`<ConnectButton

modal={{

 titleIconUrl: "https://your-icon-url.png",

 }}

/>;

`

##### welcomeScreen

 Customize the welcome screen. This prop is only applicable when modalSize prop is set to "wide". On "wide" Modal size, a welcome screen is shown on the right side of the modal.

 This screen can be customized in two ways

#####  1\. Customize Metadata and Image

`const welcomeScreen = {

 title: "your title",

 subtitle: "your subtitle",

 img: {

 src: "https://your-image-url.png",

 width: 300,

 height: 50,

 },

}

<ConnectButton connectModal={{

 welcomeScreen: welcomeScreen,

}} />

`

#####  2\. Render Custom Component

`<ConnectButton

connectModal={{

welcomeScreen: () => <YourCustomComponent />,

 }}

/>;

`

`type welcomeScreen = [WelcomeScreen](https://portal.thirdweb.com/references/typescript/v5/WelcomeScreen);

`
## ConnectButton\_detailsModalOptions

 Options for configuring the `ConnectButton` 's Details Modal

`type ConnectButton_detailsModalOptions = {

assetTabs?: Array<AssetTabs>;

connectedAccountAvatarUrl?: string;

connectedAccountName?: React.ReactNode;

footer?: (props: { close: () => void }) => JSX.Element;

hiddenWallets?: Array<[WalletId](https://portal.thirdweb.com/references/typescript/v5/WalletId)>;

hideBuyFunds?: boolean;

hideDisconnect?: boolean;

hideReceiveFunds?: boolean;

hideSendFunds?: boolean;

hideSwitchWallet?: boolean;

manageWallet?: { allowLinkingProfiles?: boolean };

networkSelector?: [NetworkSelectorProps](https://portal.thirdweb.com/references/typescript/v5/NetworkSelectorProps);

onClose?: (screen: string) => void;

payOptions?: Extract<[PayUIOptions](https://portal.thirdweb.com/references/typescript/v5/PayUIOptions), { mode?: "fund_wallet" }>;

showBalanceInFiat?: SupportedFiatCurrency;

showTestnetFaucet?: boolean;

};

`

##### assetTabs

 When you click on "View Assets", by default the "Tokens" tab is shown first. If you want to show the "NFTs" tab first, change the order of the asset tabs to: \["nft", "token"\] Note: If an empty array is passed, the \[View Funds\] button will be hidden

`type assetTabs = Array<AssetTabs>;

`

##### connectedAccountAvatarUrl

 Use custom avatar URL for the connected wallet image in the `ConnectButton` Details Modal, overriding ENS avatar or Blobbie icon.

`type connectedAccountAvatarUrl = string;

`

##### connectedAccountName

 Render custom UI for the connected wallet name in the `ConnectButton` Details Modal, overriding ENS name or wallet address.

`type connectedAccountName = React.ReactNode;

`

##### footer

##### Signature

`function footer(props: { close: () => void }): JSX.Element;

`

##### Parameters

##### props

 props passed to the footer component which includes a function to close the modal

###### Type

`let props: { close: () => void };

`

##### Returns

##### Return Type

`let returnType: JSX.Element;

`

##### hiddenWallets

 All wallet IDs included in this array will be hidden from wallet selection when connected.

`type hiddenWallets = Array<[WalletId](https://portal.thirdweb.com/references/typescript/v5/WalletId)>;

`

##### hideBuyFunds

 Hide the "Buy Funds" button in the `ConnectButton` Details Modal.

 By default the "Buy Funds" button is shown.

`type hideBuyFunds = boolean;

`

##### hideDisconnect

 Hide the "Disconnect Wallet" button in the `ConnectButton` Details Modal.

 By default it is `false`

`type hideDisconnect = boolean;

`

### Example

`<ConnectButton

detailsModal={{

 hideDisconnect: true,

 }}

/>;

`

##### hideReceiveFunds

 Hide the "Receive Funds" button in the `ConnectButton` Details Modal.

 By default the "Receive Funds" button is shown.

`type hideReceiveFunds = boolean;

`

##### hideSendFunds

 Hide the "Send Funds" button in the `ConnectButton` Details Modal.

 By default the "Send Funds" button is shown.

`type hideSendFunds = boolean;

`

##### hideSwitchWallet

 Hide the "Switch Wallet" button in the `ConnectButton` Details Modal.

 By default it is `false`

`type hideSwitchWallet = boolean;

`

### Example

`<ConnectButton

detailsModal={{

 hideSwitchWallet: true,

 }}

/>;

`

##### manageWallet

 Configure options for managing the connected wallet.

`type manageWallet = { allowLinkingProfiles?: boolean };

`

##### networkSelector

 customize the Network selector shown in the `ConnectButton` Details Modal

`type networkSelector = [NetworkSelectorProps](https://portal.thirdweb.com/references/typescript/v5/NetworkSelectorProps);

`

##### onClose

##### Signature

`function onClose(screen: string): void;

`

##### Parameters

##### screen

 The screen's name that was last shown when user closed the modal

###### Type

`let screen: string;

`

##### Returns

##### Return Type

`let returnType: void;

`

##### payOptions

 Configure options for thirdweb Pay.

 thirdweb Pay allows users to buy tokens using crypto or fiat currency.

`type payOptions = Extract<[PayUIOptions](https://portal.thirdweb.com/references/typescript/v5/PayUIOptions), { mode?: "fund_wallet" }>;

`

##### showBalanceInFiat

 Show the token balance's value in fiat. Note: Not all tokens are resolvable to a fiat value. In that case, nothing will be shown.

`type showBalanceInFiat = SupportedFiatCurrency;

`

##### showTestnetFaucet

 Show a "Request Testnet funds" link in `ConnectButton` Details Modal when user is connected to a testnet.

 By default it is `false` , If you want to show the "Request Testnet funds" link when user is connected to a testnet, set this prop to `true` . Keep in mind that the link will only be shown if there are faucet links registered with the chain.

`type showTestnetFaucet = boolean;

`

### Example

`<ConnectButton

detailsModal={{

 showTestnetFaucet: true,

 }}

/>;

`
## ConnectButton

 A fully featured wallet connection component that allows to:

* Connect to 500+ external wallets
* Connect with email, phone, passkey or socials
* Convert any wallet to a ERC4337 smart wallet for gasless transactions
* Sign in with ethereum (Auth)

 Once connected, the component allows to:

* Reolve ENS names and avatars
* Manage multipple connected wallets
* Send and receive native tokens and ERC20 tokens
* View ERC20 tokens and NFTs
* Onramp, bridge and swap tokens
* Switch chains
* Connect to another app with WalletConnect

### Example

###  Default setup

`import { createThirdwebClient } from "thirdweb";

import { ConnectButton } from "thirdweb/react";

const client = createThirdwebClient({ clientId: "YOUR_CLIENT_ID" });

<ConnectButton client={client} />;

`

[ View all available config options](https://portal.thirdweb.com/references/typescript/v5/ConnectButtonProps)

###  Customization options

####  Customizing wallet options

`<ConnectButton

client={client}

wallets={[

createWallet("io.metamask"),

createWallet("com.coinbase.wallet"),

createWallet("me.rainbow"),

 ]}

/>;

`

[ View all available wallets](https://portal.thirdweb.com/typescript/v5/supported-wallets)

####  Customizing the default chain to connect to

`import { sepolia } from "thirdweb/chains";

<ConnectButton client={client} chain={sepolia} />;

`

####  Enabling Account Abstraction

 By passing the `accountAbstraction` prop, ALL connected wallets will be converted to smart accounts. And by setting `sponsorGas` to `true` , all transactions done with those smart accounts will be sponsored.

`<ConnectButton

client={client}

accountAbstraction={{

 chain: sepolia,

 sponsorGas: true,

 }}

/>;

`

 Note that this prop doesn't affect ecosystem wallets. Ecosystem wallets will only be converted to smart accounts if the ecosystem owner has enabled account abstraction.

####  Enabling sign in with ethereum (Auth)

`<ConnectButton

client={client}

auth={{

isLoggedIn: async (address) => {

 console.log("checking if logged in!", { address });

return await isLoggedIn();

 },

doLogin: async (params) => {

 console.log("logging in!");

await login(params);

 },

getLoginPayload: async ({ address }) =>

generatePayload({ address }),

doLogout: async () => {

 console.log("logging out!");

await logout();

 },

 }}

/>;

`

####  Customizing the theme

`<ConnectButton client={client} theme="light" />;

`

 For more granular control, you can also pass a custom theme object:

`<ConnectButton

client={client}

theme={lightTheme({

 colors: {

 modalBg: "red",

 },

 })}

/>;

`

[ View all available themes properties](https://portal.thirdweb.com/references/typescript/v5/Theme)

####  Changing the display language

`<ConnectEmbed client={client} locale="ja_JP" />;

`

[ View all available locales](https://portal.thirdweb.com/references/typescript/v5/LocaleId)

####  Customizing the connect button UI

`<ConnectButton

client={client}

connectButton={{

 label: "Sign in to MyApp",

 }}

/>;

`

####  Customizing the modal UI

`<ConnectButton

client={client}

connectModal={{

 title: "Sign in to MyApp",

 titleIcon: "https://example.com/logo.png",

 size: "compact",

 }}

/>;

`

####  Customizing details button UI (after connecting)

`<ConnectButton

client={client}

detailsButton={{

 displayBalanceToken: {

 [sepolia.id]: "0x...", // token address to display balance for

 [ethereum.id]: "0x...", // token address to display balance for

 },

 }}

/>;

`

[ View all available auth helper functions](https://portal.thirdweb.com/references/typescript/v5/createAuth)

####  Customizing the Auth sign in button (after connecting, but before authenticating)

`<ConnectButton

client={client}

auth={{ ... }}

signInButton: {

 label: "Authenticate with MyApp",

},

}}

/>;

`

####  Customizing supported Tokens and NFTs

 These tokens and NFTs will be shown in the modal when the user clicks "View Assets", as well as the send token screen.

`<ConnectButton

client={client}

supportedTokens={{

 [ethereum.id]: [

 {

 address: "0x...",

 name: "MyToken",

 symbol: "MT",

 icon: "https://example.com/icon.png",

 },

 ],

 }}

supportedNFTs={{

 [ethereum.id]: [

"0x...", // nft contract address

 ],

 }}

/>;

`

####  Customizing the orders of the tabs in the \[View Funds\] screen

 When you click on "View Assets", by default the "Tokens" tab is shown first. If you want to show the "NFTs" tab first, change the order of the asset tabs to: \["nft", "token"\] Note: If an empty array is passed, the \[View Funds\] button will be hidden

`<ConnectButton

client={client}

detailsModal={{

 assetTabs: ["nft", "token"],

 }}

/>;

`

####  Callback for when the details modal is closed

`<ConnectButton

detailsModal={{

onClose: (screen: string) => {

 console.log({ screen });

 },

 }}

/>;

`

##### Signature

`function ConnectButton(props: [ConnectButtonProps](https://portal.thirdweb.com/references/typescript/v5/ConnectButtonProps)): Element;

`

### Parameters

##### props

 Props for the `ConnectButton` component

 Refer to [ ConnectButtonProps](https://portal.thirdweb.com/references/typescript/v5/ConnectButtonProps) to see the available props.

#### Type

`let props: {

accountAbstraction?: [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions);

appMetadata?: AppMetadata;

auth?: [SiweAuthOptions](https://portal.thirdweb.com/references/typescript/v5/SiweAuthOptions);

autoConnect?: { timeout: number } | boolean;

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

chains?: Array<[Chain](https://portal.thirdweb.com/references/typescript/v5/Chain)>;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

connectButton?: [ConnectButton_connectButtonOptions](https://portal.thirdweb.com/references/typescript/v5/ConnectButton%5FconnectButtonOptions);

connectModal?: [ConnectButton_connectModalOptions](https://portal.thirdweb.com/references/typescript/v5/ConnectButton%5FconnectModalOptions);

detailsButton?: [ConnectButton_detailsButtonOptions](https://portal.thirdweb.com/references/typescript/v5/ConnectButton%5FdetailsButtonOptions);

detailsModal?: [ConnectButton_detailsModalOptions](https://portal.thirdweb.com/references/typescript/v5/ConnectButton%5FdetailsModalOptions);

locale?: [LocaleId](https://portal.thirdweb.com/references/typescript/v5/LocaleId);

onConnect?: (wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)) => void;

onDisconnect?: (info: { account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account); wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet) }) => void;

recommendedWallets?: Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

showAllWallets?: boolean;

signInButton?: {

className?: string;

label?: string;

style?: React.CSSProperties;

 };

supportedNFTs?: SupportedNFTs;

supportedTokens?: [SupportedTokens](https://portal.thirdweb.com/references/typescript/v5/SupportedTokens);

switchButton?: {

className?: string;

label?: string;

style?: React.CSSProperties;

 };

theme?: "dark" | "light" | [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme);

walletConnect?: { projectId?: string };

wallets?: Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

};

`

### Returns

##### Return Type

`let returnType: Element;

`

 A JSX element that renders the `<ConnectButton>` component.
## ConnectEmbed

 An inline wallet connection component that allows to:

* Connect to 500+ external wallets
* Connect with email, phone, passkey or socials
* Convert any wallet to a ERC4337 smart wallet for gasless transactions
* Sign in with ethereum (Auth)

 It renders the same UI as the [ConnectButton](https://portal.thirdweb.com/react/v5/ConnectButton) component's modal - but directly inline in the page instead of being in a modal.

 Once connected, the component does not render any UI. It only renders UI if wallet is not connected.

### Example

###  Default setup

`import { createThirdwebClient } from "thirdweb";

import { ConnectEmbed } from "thirdweb/react";

const client = createThirdwebClient({ clientId: "YOUR_CLIENT_ID" });

<ConnectEmbed client={client} />;

`

[ View all available config options](https://portal.thirdweb.com/references/typescript/v5/ConnectEmbedProps)

###  Customization options

####  Customizing wallet options

`<ConnectEmbed

client={client}

wallets={[

createWallet("io.metamask"),

createWallet("com.coinbase.wallet"),

createWallet("me.rainbow"),

 ]}

/>;

`

[ View all available wallets](https://portal.thirdweb.com/typescript/v5/supported-wallets)

####  Customizing the default chain to connect to

`import { base } from "thirdweb/chains";

<ConnectEmbed client={client} chain={base} />;

`

####  Enabling Account Abstraction

 By passing the `accountAbstraction` prop, ALL connected wallets will be converted to smart accounts. And by setting `sponsorGas` to `true` , all transactions done with those smart accounts will be sponsored.

`<ConnectEmbed

client={client}

accountAbstraction={{

 chain: sepolia,

 sponsorGas: true,

 }}

/>;

`

 Note that this prop doesn't affect ecosystem wallets. Ecosystem wallets will only be converted to smart accounts if the ecosystem owner has enabled account abstraction.

####  Enabling sign in with ethereum (Auth)

`<ConnectEmbed

client={client}

auth={{

isLoggedIn: async (address) => {

 console.log("checking if logged in!", { address });

return await isLoggedIn();

 },

doLogin: async (params) => {

 console.log("logging in!");

await login(params);

 },

getLoginPayload: async ({ address }) =>

generatePayload({ address }),

doLogout: async () => {

 console.log("logging out!");

await logout();

 },

 }}

/>;

`

####  Customizing the theme

`<ConnectEmbed client={client} theme="light" />;

`

 For more granular control, you can also pass a custom theme object:

`<ConnectEmbed

client={client}

theme={lightTheme({

 colors: {

 modalBg: "red",

 },

 })}

/>;

`

[ View all available themes properties](https://portal.thirdweb.com/references/typescript/v5/Theme)

####  Changing the display language

`<ConnectEmbed client={client} locale="ja_JP" />;

`

[ View all available locales](https://portal.thirdweb.com/references/typescript/v5/LocaleId)

##### Signature

`function ConnectEmbed(props: [ConnectEmbedProps](https://portal.thirdweb.com/references/typescript/v5/ConnectEmbedProps)): Element;

`

### Parameters

##### props

 The props for the `ConnectEmbed` component.

 Refer to the [ConnectEmbedProps](https://portal.thirdweb.com/references/typescript/v5/ConnectEmbedProps) type for more details

#### Type

`let props: {

accountAbstraction?: [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions);

appMetadata?: AppMetadata;

auth?: [SiweAuthOptions](https://portal.thirdweb.com/references/typescript/v5/SiweAuthOptions);

autoConnect?: { timeout: number } | boolean;

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

chains?: Array<[Chain](https://portal.thirdweb.com/references/typescript/v5/Chain)>;

className?: string;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

header?: { title?: string; titleIcon?: string } | true;

locale?: [LocaleId](https://portal.thirdweb.com/references/typescript/v5/LocaleId);

modalSize?: "compact" | "wide";

onConnect?: (wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)) => void;

privacyPolicyUrl?: string;

recommendedWallets?: Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

requireApproval?: boolean;

showAllWallets?: boolean;

showThirdwebBranding?: boolean;

style?: React.CSSProperties;

termsOfServiceUrl?: string;

theme?: "dark" | "light" | [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme);

walletConnect?: { projectId?: string };

wallets?: Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

welcomeScreen?: [WelcomeScreen](https://portal.thirdweb.com/references/typescript/v5/WelcomeScreen);

};

`

### Returns

##### Return Type

`let returnType: Element;

`

 A JSX element that renders the `<ConnectEmbed>` component.
## ConnectButton\_detailsButtonOptions

 Options for configuring the `ConnectButton` 's Details Button

`type ConnectButton_detailsButtonOptions = {

className?: string;

connectedAccountAvatarUrl?: string;

connectedAccountName?: React.ReactNode;

displayBalanceToken?: Record<number, string>;

render?: () => JSX.Element;

showBalanceInFiat?: SupportedFiatCurrency;

style?: React.CSSProperties;

};

`

##### className

 CSS class to apply to the details button element

`type className = string;

`

##### connectedAccountAvatarUrl

 Use custom avatar URL for the connected wallet image in the `ConnectButton` details button, overriding ENS avatar or Blobbie icon.

`type connectedAccountAvatarUrl = string;

`

##### connectedAccountName

 Render custom UI for the connected wallet name in the `ConnectButton` details button, overriding ENS name or wallet address.

`type connectedAccountName = React.ReactNode;

`

##### displayBalanceToken

 Display the balance of a token instead of the native token in `ConnectButton` details button.

`type displayBalanceToken = Record<number, string>;

`

### Example

`<ConnectButton detailsButton={{

 displayBalanceToken:{

// show USDC balance when connected to Ethereum mainnet or Polygon

 [ethereum.id]: "0x2260FAC5E5542a773Aa44fBCfeDf7C193bc2C599",

 [polygon.id]: "0x3c499c542cEF5E3811e1192ce70d8cC03d5c3359",

 }

 })

/>

`

##### render

##### Signature

`function render(): JSX.Element;

`

##### Returns

##### Return Type

`let returnType: JSX.Element;

`

##### showBalanceInFiat

 Show the token balance's value in fiat. Note: Not all tokens are resolvable to a fiat value. In that case, nothing will be shown.

`type showBalanceInFiat = SupportedFiatCurrency;

`

##### style

 CSS styles to apply to the details button element

`type style = React.CSSProperties;

`
## CollectAuctionPayoutParams

 Represents the parameters for the "collectAuctionPayout" function.

`type CollectAuctionPayoutParams = WithOverrides<{

auctionId: AbiParameterToPrimitiveType<{

name: "_auctionId";

type: "uint256";

 }>;

}>;

`
## ConnectEmbedProps

`type ConnectEmbedProps = {

accountAbstraction?: [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions);

appMetadata?: AppMetadata;

auth?: [SiweAuthOptions](https://portal.thirdweb.com/references/typescript/v5/SiweAuthOptions);

autoConnect?: { timeout: number } | boolean;

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

chains?: Array<[Chain](https://portal.thirdweb.com/references/typescript/v5/Chain)>;

className?: string;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

header?: { title?: string; titleIcon?: string } | true;

locale?: [LocaleId](https://portal.thirdweb.com/references/typescript/v5/LocaleId);

modalSize?: "compact" | "wide";

onConnect?: (wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)) => void;

privacyPolicyUrl?: string;

recommendedWallets?: Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

requireApproval?: boolean;

showAllWallets?: boolean;

showThirdwebBranding?: boolean;

style?: React.CSSProperties;

termsOfServiceUrl?: string;

theme?: "dark" | "light" | [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme);

walletConnect?: { projectId?: string };

wallets?: Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

welcomeScreen?: [WelcomeScreen](https://portal.thirdweb.com/references/typescript/v5/WelcomeScreen);

};

`

##### accountAbstraction

 Enable Account abstraction for all wallets. This will connect to the users's smart account based on the connected personal wallet and the given options.

 This allows to sponsor gas fees for your user's transaction using the thirdweb account abstraction infrastructure.

`<ConnectEmbed

accountAbstraction={{

 factoryAddress: "0x123...",

 chain: sepolia,

 gasless: true;

 }}

/>

`

`type accountAbstraction = [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions);

`

##### appMetadata

 Metadata of the app that will be passed to connected wallet. Setting this is highly recommended.

 Some wallets display this information to the user when they connect to your app.

`type appMetadata = AppMetadata;

`

### Example

`{

name: "My App",

url: "https://my-app.com",

description: "some description about your app",

logoUrl: "https://path/to/my-app/logo.svg",

};

`

##### auth

 Enable SIWE (Sign in with Ethererum) by passing an object of type `SiweAuthOptions` to enforce the users to sign a message after connecting their wallet to authenticate themselves.

 Refer to the [SiweAuthOptions](https://portal.thirdweb.com/references/typescript/v5/SiweAuthOptions) for more details

`type auth = [SiweAuthOptions](https://portal.thirdweb.com/references/typescript/v5/SiweAuthOptions);

`

##### autoConnect

 When the user has connected their wallet to your site, this configuration determines whether or not you want to automatically connect to the last connected wallet when user visits your site again in the future.

 By default it is set to `{ timeout: 15000 }` meaning that autoConnect is enabled and if the autoConnection does not succeed within 15 seconds, it will be cancelled.

 If you want to disable autoConnect, set this prop to `false` .

 If you want to customize the timeout, you can assign an object with a `timeout` key to this prop.

`<ConnectEmbed client={client} autoConnect={{ timeout: 10000 }} />;

`

`type autoConnect = { timeout: number } | boolean;

`

##### chain

 The [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain) object of the blockchain you want the wallet to connect to

 If a `chain` is not specified, Wallet will be connected to whatever is the default set in the wallet.

 If a `chain` is specified, Wallet will be prompted to switch to given chain after connection if it is not already connected to it. This ensures that the wallet is connected to the correct blockchain before interacting with your app.

 You can create a `Chain` object using the [defineChain](https://portal.thirdweb.com/references/typescript/v5/defineChain) function. At minimum, you need to pass the `id` of the blockchain to `defineChain` function to create a `Chain` object.

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

### Example

`import { polygon } from "thirdweb/chains";

function Example() {

return (

 <div>

{" "}

 <ConnectEmbed chain={polygon} />{" "}

 </div>

 );

}

`

##### chains

 Array of chains that your app supports.

 This is only relevant if your app is a multi-chain app and works across multiple blockchains. If your app only works on a single blockchain, you should only specify the `chain` prop.

 Given list of chains will used in various ways:

* They will be displayed in the network selector in the `ConnectEmbed` 's details modal post connection
* They will be sent to wallet at the time of connection if the wallet supports requesting multiple chains ( example: WalletConnect ) so that users can switch between the chains post connection easily

`<ConnectEmbed chains={[ethereum, polygon, optimism]} />;

`

 You can create a `Chain` object using the [defineChain](https://portal.thirdweb.com/references/typescript/v5/defineChain) function. At minimum, you need to pass the `id` of the blockchain to `defineChain` function to create a `Chain` object.

`import { defineChain } from "thirdweb/react";

const polygon = defineChain({

 id: 137,

});

`

`type chains = Array<[Chain](https://portal.thirdweb.com/references/typescript/v5/Chain)>;

`

##### className

 Class name to be added to the root element of ConnectEmbed

`type className = string;

`

##### client

 A client is the entry point to the thirdweb SDK. It is required for all other actions. You can create a client using the `createThirdwebClient` function. Refer to the [ Creating a Client](https://portal.thirdweb.com/typescript/v5/client) documentation for more information.

 You must provide a `clientId` or `secretKey` in order to initialize a client. Pass `clientId` if you want for client-side usage and `secretKey` for server-side usage.

`import { createThirdwebClient } from "thirdweb";

const client = createThirdwebClient({

 clientId: "<your_client_id>",

});

`

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### header

 Set custom title and icon to show for the embed

 Set it to `true` to show the default title and icon

`type header = { title?: string; titleIcon?: string } | true;

`

##### locale

 By default - ConnectEmbed UI uses the `en-US` locale for english language users.

 You can customize the language used in the ConnectEmbed UI by setting the `locale` prop.

 Refer to the [LocaleId](https://portal.thirdweb.com/references/typescript/v5/LocaleId) type for supported locales.

`type locale = [LocaleId](https://portal.thirdweb.com/references/typescript/v5/LocaleId);

`

##### modalSize

 ConnectEmbed supports two modal size variants: `compact` and `wide` .

 By default it is set to `compact` , you can set it to `wide` if you want to show a wider modal.

 Note that if the screen width can not fit the wide modal, the `compact` version will be shown regardless of this `modalSize` options provided

`type modalSize = "compact" | "wide";

`

##### onConnect

##### Signature

`function onConnect(wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)): void;

`

##### Parameters

##### wallet

###### Type

`let wallet: {

getAdminAccount?: () => [Account](https://portal.thirdweb.com/references/typescript/v5/Account) | undefined;

getConfig: () => [CreateWalletArgs](https://portal.thirdweb.com/references/typescript/v5/CreateWalletArgs)<TWalletId>[1];

id: TWalletId;

onConnectRequested?: () => Promise<void>;

subscribe: [WalletEmitter](https://portal.thirdweb.com/references/typescript/v5/WalletEmitter)<TWalletId>["subscribe"];

autoConnect: (

options: [WalletAutoConnectionOption](https://portal.thirdweb.com/references/typescript/v5/WalletAutoConnectionOption)<TWalletId>,

 ) => Promise<[Account](https://portal.thirdweb.com/references/typescript/v5/Account)>;

connect: (

options: [WalletConnectionOption](https://portal.thirdweb.com/references/typescript/v5/WalletConnectionOption)<TWalletId>,

 ) => Promise<[Account](https://portal.thirdweb.com/references/typescript/v5/Account)>;

disconnect: () => Promise<void>;

getAccount: () => undefined | [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

getChain: () =>

| undefined

| Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

switchChain: (chain: Readonly) => Promise<void>;

};

`

##### Returns

##### Return Type

`let returnType: void;

`

##### privacyPolicyUrl

 If provided, Embed will show a Privacy Policy message at the bottom with below link

`type privacyPolicyUrl = string;

`

##### recommendedWallets

 Wallets to show as recommended in the `ConnectEmbed` UI

`type recommendedWallets = Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

`

##### requireApproval

 If provided, users will be required to accept the Terms of Service before connecting an in-app wallet.

`type requireApproval = boolean;

`

##### showAllWallets

 By default, `ConnectEmbed` shows a "All Wallets" button that shows a list of 500+ wallets.

 You can disable this button by setting `showAllWallets` prop to `false`

`type showAllWallets = boolean;

`

##### showThirdwebBranding

 By default, A "Powered by Thirdweb" branding is shown at the bottom of the embed.

 If you want to hide it, set this to `false`

`type showThirdwebBranding = boolean;

`

### Example

`<ConnectEmbed showThirdwebBranding={false} />;

`

##### style

 CSS styles to be applied to the root element of ConnectEmbed

`type style = React.CSSProperties;

`

##### termsOfServiceUrl

 If provided, Embed will show a Terms of Service message at the bottom with below link

`type termsOfServiceUrl = string;

`

##### theme

 Set the theme for the `ConnectEmbed` component. By default it is set to `"dark"`

 theme can be set to either `"dark"` , `"light"` or a custom theme object. You can also import [lightTheme](https://portal.thirdweb.com/references/typescript/v5/lightTheme)or [darkTheme](https://portal.thirdweb.com/references/typescript/v5/darkTheme)functions from `thirdweb/react` to use the default themes as base and overrides parts of it.

`type theme = "dark" | "light" | [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme);

`

### Example

`import { lightTheme } from "thirdweb/react";

const customTheme = lightTheme({

 colors: {

 modalBg: "red",

 },

});

function Example() {

return <ConnectEmbed theme={customTheme} />;

}

`

##### walletConnect

 Configure options for WalletConnect

 By default WalletConnect uses the thirdweb's default project id. Setting your own project id is recommended.

 You can create a project id by signing up on [ walletconnect.com](https://walletconnect.com/)

`type walletConnect = { projectId?: string };

`

##### wallets

 Array of supported wallets. If not provided, default wallets will be used.

`type wallets = Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

`

### Example

`import { AutoConnect } from "thirdweb/react";

import { createWallet, inAppWallet } from "thirdweb/wallets";

const wallets = [

inAppWallet(),

createWallet("io.metamask"),

createWallet("com.coinbase.wallet"),

createWallet("me.rainbow"),

];

function Example() {

return <ConnectEmbed client={client} wallets={wallets} />;

}

`

 If no wallets are specified. The component will show All the EIP-6963 compliant installed wallet extensions, as well as below default wallets:

`const defaultWallets = [

inAppWallet(),

createWallet("io.metamask"),

createWallet("com.coinbase.wallet"),

createWallet("me.rainbow"),

createWallet("io.zerion.wallet"),

];

`

 The `ConnectEmbed` also shows a "All wallets" button at the end of wallet list which allows user to connect to any of the 500+ wallets

##### welcomeScreen

 Customize the welcome screen. This prop is only applicable when modalSize prop is set to "wide". On "wide" Modal size, a welcome screen is shown on the right side of the modal.

 This screen can be customized in two ways

#####  1\. Customize Metadata and Image

`const welcomeScreen = {

 title: "your title",

 subtitle: "your subtitle",

 img: {

 src: "https://your-image-url.png",

 width: 300,

 height: 50,

 },

}

<ConnectEmbed welcomeScreen={welcomeScreen} />

`

#####  2\. Render Custom Component

`<ConnectEmbed welcomeScreen={() => <YourComponent />} />;

`

`type welcomeScreen = [WelcomeScreen](https://portal.thirdweb.com/references/typescript/v5/WelcomeScreen);

`
## ContractOptions

`type ContractOptions<

abi extends Abi = [],

address extends string = string,

> = {

readonly abi?: abi;

address: address;

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

};

`

##### abi

`type abi = abi;

`

##### address

`type address = address;

`

##### chain

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`
## ConvertFiatToCryptoParams

 Props for the `convertFiatToCrypto` function

`type ConvertFiatToCryptoParams = {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

from: SupportedFiatCurrency;

fromAmount: number;

to: Address;

};

`

##### chain

 The chain that the token is deployed to

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### from

 The fiat symbol. e.g: "USD" Currently only USD is supported.

`type from = SupportedFiatCurrency;

`

##### fromAmount

 The total amount of fiat to convert e.g: If you want to convert 2 cents to USD, enter `0.02`

`type fromAmount = number;

`

##### to

 The token address For native token, use NATIVE\_TOKEN\_ADDRESS

`type to = Address;

`
## ConvertToAssetsParams

 Represents the parameters for the "convertToAssets" function.

`type ConvertToAssetsParams = {

shares: AbiParameterToPrimitiveType<{

name: "shares";

type: "uint256";

 }>;

};

`

##### shares

`type shares = AbiParameterToPrimitiveType<{

name: "shares";

type: "uint256";

}>;

`
## ConnectManagerOptions

`type ConnectManagerOptions = {

accountAbstraction?: [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

onConnect?: (wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)) => void;

setWalletAsActive?: boolean;

};

`

##### accountAbstraction

`type accountAbstraction = [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions);

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### onConnect

##### Signature

`function onConnect(wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)): void;

`

##### Parameters

##### wallet

###### Type

`let wallet: {

getAdminAccount?: () => [Account](https://portal.thirdweb.com/references/typescript/v5/Account) | undefined;

getConfig: () => [CreateWalletArgs](https://portal.thirdweb.com/references/typescript/v5/CreateWalletArgs)<TWalletId>[1];

id: TWalletId;

onConnectRequested?: () => Promise<void>;

subscribe: [WalletEmitter](https://portal.thirdweb.com/references/typescript/v5/WalletEmitter)<TWalletId>["subscribe"];

autoConnect: (

options: [WalletAutoConnectionOption](https://portal.thirdweb.com/references/typescript/v5/WalletAutoConnectionOption)<TWalletId>,

 ) => Promise<[Account](https://portal.thirdweb.com/references/typescript/v5/Account)>;

connect: (

options: [WalletConnectionOption](https://portal.thirdweb.com/references/typescript/v5/WalletConnectionOption)<TWalletId>,

 ) => Promise<[Account](https://portal.thirdweb.com/references/typescript/v5/Account)>;

disconnect: () => Promise<void>;

getAccount: () => undefined | [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

getChain: () =>

| undefined

| Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

switchChain: (chain: Readonly) => Promise<void>;

};

`

##### Returns

##### Return Type

`let returnType: void;

`

##### setWalletAsActive

`type setWalletAsActive = boolean;

`
## ConvertCryptoToFiatParams

 Props for the `convertCryptoToFiat` function

`type ConvertCryptoToFiatParams = {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

fromAmount: number;

fromTokenAddress: Address;

to: SupportedFiatCurrency;

};

`

##### chain

 The chain that the token is deployed to

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### fromAmount

 The amount of token to convert to fiat value

`type fromAmount = number;

`

##### fromTokenAddress

 The contract address of the token For native token, use NATIVE\_TOKEN\_ADDRESS

`type fromTokenAddress = Address;

`

##### to

 The fiat symbol. e.g "USD" Only USD is supported at the moment.

`type to = SupportedFiatCurrency;

`
## ConvertToSharesParams

 Represents the parameters for the "convertToShares" function.

`type ConvertToSharesParams = {

assets: AbiParameterToPrimitiveType<{

name: "assets";

type: "uint256";

 }>;

};

`

##### assets

`type assets = AbiParameterToPrimitiveType<{

name: "assets";

type: "uint256";

}>;

`
## CreateAccountParams

 Represents the parameters for the "createAccount" function.

`type CreateAccountParams = WithOverrides<{

admin: AbiParameterToPrimitiveType<{

name: "admin";

type: "address";

 }>;

data: AbiParameterToPrimitiveType<{ name: "_data"; type: "bytes" }>;

}>;

`
## CreateAuctionParams

`type CreateAuctionParams = {

assetContractAddress: Address;

bidBufferBps?: number;

currencyContractAddress?: Address;

endTimestamp?: Date;

quantity?: bigint;

startTimestamp?: Date;

timeBufferInSeconds?: number;

tokenId: bigint;

} & MinimumBidAmount &

BuyoutBidAmount;

`
## CreateDelayedRevealBatchParams

`type CreateDelayedRevealBatchParams = {

metadata: Array<[NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput)>;

password: string;

placeholderMetadata: [NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput);

};

`

##### metadata

`type metadata = Array<[NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput)>;

`

##### password

`type password = string;

`

##### placeholderMetadata

`type placeholderMetadata = [NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput);

`
## CountParams

 Represents the parameters for the "count" function.

`type CountParams = {

deployer: AbiParameterToPrimitiveType<{

name: "_deployer";

type: "address";

 }>;

};

`

##### deployer

`type deployer = AbiParameterToPrimitiveType<{

name: "_deployer";

type: "address";

}>;

`
## CreateListingParams

`type CreateListingParams = {

assetContractAddress: Address;

currencyContractAddress?: Address;

endTimestamp?: Date;

isReservedListing?: boolean;

quantity?: bigint;

startTimestamp?: Date;

tokenId: bigint;

} & ({ pricePerToken: string } | { pricePerTokenWei: string });

`
## CreateDirectListingButtonProps

`type CreateDirectListingButtonProps = Omit<

[TransactionButtonProps](https://portal.thirdweb.com/references/typescript/v5/TransactionButtonProps),

"transaction"

> &

[CreateListingParams](https://portal.thirdweb.com/references/typescript/v5/CreateListingParams) & {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

contractAddress: string;

 };

`
## CreateNewPackParams

`type CreateNewPackParams = {

amountDistributedPerOpen: bigint;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

erc1155Rewards?: Array<[ERC1155Reward](https://portal.thirdweb.com/references/typescript/v5/ERC1155Reward)>;

erc20Rewards?: Array<[ERC20Reward](https://portal.thirdweb.com/references/typescript/v5/ERC20Reward)>;

erc721Rewards?: Array<[ERC721Reward](https://portal.thirdweb.com/references/typescript/v5/ERC721Reward)>;

openStartTimestamp: Date;

packMetadata: [NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput) | string;

recipient: string;

tokenOwner: string;

};

`

##### amountDistributedPerOpen

`type amountDistributedPerOpen = bigint;

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### contract

`type contract = [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

`

##### erc1155Rewards

 An array of ERC1155 rewards, see type `ERC1155Reward` for more info

`type erc1155Rewards = Array<[ERC1155Reward](https://portal.thirdweb.com/references/typescript/v5/ERC1155Reward)>;

`

##### erc20Rewards

 An array of ERC20 rewards, see type `ERC20Reward` for more info

`type erc20Rewards = Array<[ERC20Reward](https://portal.thirdweb.com/references/typescript/v5/ERC20Reward)>;

`

##### erc721Rewards

 An array of ERC721 rewards, see type `ERC721Reward` for more info

`type erc721Rewards = Array<[ERC721Reward](https://portal.thirdweb.com/references/typescript/v5/ERC721Reward)>;

`

##### openStartTimestamp

 JavaScript Date object

`type openStartTimestamp = Date;

`

##### packMetadata

 The metadata (image, description, etc.) of the Pack. This is similar to an NFT's metadata

`type packMetadata = [NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput) | string;

`

##### recipient

 The address of the reward recipient

`type recipient = string;

`

##### tokenOwner

 The address of the entity who owns the tokens that are used as rewards. This is only used for checking token approval

`type tokenOwner = string;

`
## CreatePackParams

 Represents the parameters for the "createPack" function.

`type CreatePackParams = WithOverrides<{

amountDistributedPerOpen: AbiParameterToPrimitiveType<{

name: "amountDistributedPerOpen";

type: "uint128";

 }>;

contents: AbiParameterToPrimitiveType<{

components: [

 { name: "assetContract"; type: "address" },

 { name: "tokenType"; type: "uint8" },

 { name: "tokenId"; type: "uint256" },

 { name: "totalAmount"; type: "uint256" },

 ];

name: "contents";

type: "tuple[]";

 }>;

numOfRewardUnits: AbiParameterToPrimitiveType<{

name: "numOfRewardUnits";

type: "uint256[]";

 }>;

openStartTimestamp: AbiParameterToPrimitiveType<{

name: "openStartTimestamp";

type: "uint128";

 }>;

packUri: AbiParameterToPrimitiveType<{

name: "packUri";

type: "string";

 }>;

recipient: AbiParameterToPrimitiveType<{

name: "recipient";

type: "address";

 }>;

}>;

`
## CreatePoolParams

 Represents the parameters for the "createPool" function.

`type CreatePoolParams = WithOverrides<{

fee: AbiParameterToPrimitiveType<{ name: "fee"; type: "uint24" }>;

tokenA: AbiParameterToPrimitiveType<{

name: "tokenA";

type: "address";

 }>;

tokenB: AbiParameterToPrimitiveType<{

name: "tokenB";

type: "address";

 }>;

}>;

`
## CreatePackParams

 Represents the parameters for the "createPack" function.

`type CreatePackParams = WithOverrides<{

amountDistributedPerOpen: AbiParameterToPrimitiveType<{

name: "amountDistributedPerOpen";

type: "uint128";

 }>;

contents: AbiParameterToPrimitiveType<{

components: [

 { name: "assetContract"; type: "address" },

 { name: "tokenType"; type: "uint8" },

 { name: "tokenId"; type: "uint256" },

 { name: "totalAmount"; type: "uint256" },

 ];

name: "contents";

type: "tuple[]";

 }>;

numOfRewardUnits: AbiParameterToPrimitiveType<{

name: "numOfRewardUnits";

type: "uint256[]";

 }>;

openStartTimestamp: AbiParameterToPrimitiveType<{

name: "openStartTimestamp";

type: "uint128";

 }>;

packUri: AbiParameterToPrimitiveType<{

name: "packUri";

type: "string";

 }>;

recipient: AbiParameterToPrimitiveType<{

name: "recipient";

type: "address";

 }>;

}>;

`
## CreateWalletArgs

 Generic type for getting the tuple type of arguments that the `createWallet` function takes.

`type CreateWalletArgs<T extends [WalletId](https://portal.thirdweb.com/references/typescript/v5/WalletId)> =

[WalletCreationOptions](https://portal.thirdweb.com/references/typescript/v5/WalletCreationOptions)<T> extends undefined

? [id: T]

: undefined extends [WalletCreationOptions](https://portal.thirdweb.com/references/typescript/v5/WalletCreationOptions)<T>

? [id: T, options: [WalletCreationOptions](https://portal.thirdweb.com/references/typescript/v5/WalletCreationOptions)<T>]

: [id: T, options: [WalletCreationOptions](https://portal.thirdweb.com/references/typescript/v5/WalletCreationOptions)<T>];

`

### Example

`type X = CreateWalletArgs<"io.metamask">;

`
## CurrencyApprovedForListingEventFilters

 Represents the filters for the "CurrencyApprovedForListing" event.

`type CurrencyApprovedForListingEventFilters = Partial<{

currency: AbiParameterToPrimitiveType<{

indexed: true;

name: "currency";

type: "address";

 }>;

listingId: AbiParameterToPrimitiveType<{

indexed: true;

name: "listingId";

type: "uint256";

 }>;

}>;

`
## CreateThirdwebClientOptions

`type CreateThirdwebClientOptions = Prettify<

 (

| { clientId: string; secretKey?: string }

| { clientId?: string; secretKey: string }

 ) &

ClientOptions

>;

`
## CurrencyPriceForListingParams

`type CurrencyPriceForListingParams = {

currency: Address;

listingId: bigint;

};

`

##### currency

`type currency = Address;

`

##### listingId

`type listingId = bigint;

`
## CustodyOfParams

 Represents the parameters for the "custodyOf" function.

`type CustodyOfParams = {

fid: AbiParameterToPrimitiveType<{ name: "fid"; type: "uint256" }>;

};

`

##### fid

`type fid = AbiParameterToPrimitiveType<{

name: "fid";

type: "uint256";

}>;

`
## DefaultWalletConnectRequestHandlers

 Default request handlers for WalletConnect requests.

`let DefaultWalletConnectRequestHandlers: {

eth_sendRawTransaction: {};

eth_sendTransaction: {};

eth_sign: {};

eth_signTransaction: {};

eth_signTypedData: {};

eth_signTypedData_v4: {};

personal_sign: {};

wallet_addEthereumChain: (_: {

params: WalletConnectAddEthereumChainRequestParams;

wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

 }) => never;

wallet_switchEthereumChain: {};

};

`

##### eth\_sendRawTransaction

`type eth_sendRawTransaction = {};

`

##### eth\_sendTransaction

`type eth_sendTransaction = {};

`

##### eth\_sign

`type eth_sign = {};

`

##### eth\_signTransaction

`type eth_signTransaction = {};

`

##### eth\_signTypedData

`type eth_signTypedData = {};

`

##### eth\_signTypedData\_v4

`type eth_signTypedData_v4 = {};

`

##### personal\_sign

`type personal_sign = {};

`

##### wallet\_addEthereumChain

##### Signature

`function wallet_addEthereumChain(_: {

params: WalletConnectAddEthereumChainRequestParams;

wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

}): never;

`

#### Parameters

##### \_

##### Type

`let _: {

params: WalletConnectAddEthereumChainRequestParams;

wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

};

`

#### Returns

##### Return Type

`let returnType: never;

`

##### wallet\_switchEthereumChain

`type wallet_switchEthereumChain = {};

`
## DelegateParams

 Represents the parameters for the "delegate" function.

`type DelegateParams = WithOverrides<{

delegatee: AbiParameterToPrimitiveType<{

name: "delegatee";

type: "address";

 }>;

}>;

`
## DeployERC20ContractOptions

`type DeployERC20ContractOptions = Prettify<

ClientAndChainAndAccount & {

params: [ERC20ContractParams](https://portal.thirdweb.com/references/typescript/v5/ERC20ContractParams);

publisher?: string;

type: [ERC20ContractType](https://portal.thirdweb.com/references/typescript/v5/ERC20ContractType);

 }

>;

`
## DelegatesParams

 Represents the parameters for the "delegates" function.

`type DelegatesParams = {

account: AbiParameterToPrimitiveType<{

name: "account";

type: "address";

 }>;

};

`

##### account

`type account = AbiParameterToPrimitiveType<{

name: "account";

type: "address";

}>;

`
## DeployERC1155ContractOptions

`type DeployERC1155ContractOptions = Prettify<

ClientAndChainAndAccount & {

params: [ERC1155ContractParams](https://portal.thirdweb.com/references/typescript/v5/ERC1155ContractParams);

type: [ERC1155ContractType](https://portal.thirdweb.com/references/typescript/v5/ERC1155ContractType);

 }

>;

`
## DeployModularContractOptions

`type DeployModularContractOptions = Prettify<

ClientAndChainAndAccount & {

core: [CoreType](https://portal.thirdweb.com/references/typescript/v5/CoreType);

modules?: Array<[ModuleInstaller](https://portal.thirdweb.com/references/typescript/v5/ModuleInstaller)>;

params: [ModularContractParams](https://portal.thirdweb.com/references/typescript/v5/ModularContractParams);

publisher?: string;

salt?: string;

 }

>;

`
## DeployERC721ContractOptions

`type DeployERC721ContractOptions = Prettify<

ClientAndChainAndAccount & {

params: [ERC721ContractParams](https://portal.thirdweb.com/references/typescript/v5/ERC721ContractParams);

type: [ERC721ContractType](https://portal.thirdweb.com/references/typescript/v5/ERC721ContractType);

 }

>;

`
## DeployMarketplaceContractOptions

`type DeployMarketplaceContractOptions = Prettify<

ClientAndChainAndAccount & { params: [MarketplaceContractParams](https://portal.thirdweb.com/references/typescript/v5/MarketplaceContractParams) } & {

version?: string;

 }

>;

`
## DeployProxyByImplementationParams

 Represents the parameters for the "deployProxyByImplementation" function.

`type DeployProxyByImplementationParams = WithOverrides<{

data: AbiParameterToPrimitiveType<{ name: "data"; type: "bytes" }>;

implementation: AbiParameterToPrimitiveType<{

name: "implementation";

type: "address";

 }>;

salt: AbiParameterToPrimitiveType<{

name: "salt";

type: "bytes32";

 }>;

}>;

`
## DeployPublishedContractOptions

`type DeployPublishedContractOptions = {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

contractId: string;

contractParams?: Record<string, unknown>;

implementationConstructorParams?: Record<string, unknown>;

publisher?: string;

salt?: string;

version?: string;

};

`

##### account

`type account = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### chain

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### contractId

`type contractId = string;

`

##### contractParams

`type contractParams = Record<string, unknown>;

`

##### implementationConstructorParams

`type implementationConstructorParams = Record<string, unknown>;

`

##### publisher

`type publisher = string;

`

##### salt

`type salt = string;

`

##### version

`type version = string;

`
## DepositParams

 Represents the parameters for the "deposit" function.

`type DepositParams = WithOverrides<{

assets: AbiParameterToPrimitiveType<{

name: "assets";

type: "uint256";

 }>;

receiver: AbiParameterToPrimitiveType<{

name: "receiver";

type: "address";

 }>;

}>;

`
## DepositEventFilters

 Represents the filters for the "Deposit" event.

`type DepositEventFilters = Partial<{

caller: AbiParameterToPrimitiveType<{

indexed: true;

name: "caller";

type: "address";

 }>;

owner: AbiParameterToPrimitiveType<{

indexed: true;

name: "owner";

type: "address";

 }>;

}>;

`
## DirectPaymentOptions

`type DirectPaymentOptions = {

mode: "direct_payment";

paymentInfo: [PaymentInfo](https://portal.thirdweb.com/references/typescript/v5/PaymentInfo);

};

`

##### mode

`type mode = "direct_payment";

`

##### paymentInfo

 The payment information

`type paymentInfo = [PaymentInfo](https://portal.thirdweb.com/references/typescript/v5/PaymentInfo);

`
## DirectListing

`type DirectListing = {

asset: [NFT](https://portal.thirdweb.com/references/typescript/v5/NFT);

assetContractAddress: Address;

creatorAddress: Address;

currencyContractAddress: Address;

currencyValuePerToken: [GetBalanceResult](https://portal.thirdweb.com/references/typescript/v5/GetBalanceResult);

endTimeInSeconds: bigint;

id: bigint;

isReservedListing: boolean;

pricePerToken: bigint;

quantity: bigint;

startTimeInSeconds: bigint;

status: ListingStatus;

tokenId: bigint;

type: "direct-listing";

};

`

##### asset

`type asset = [NFT](https://portal.thirdweb.com/references/typescript/v5/NFT);

`

##### assetContractAddress

`type assetContractAddress = Address;

`

##### creatorAddress

`type creatorAddress = Address;

`

##### currencyContractAddress

`type currencyContractAddress = Address;

`

##### currencyValuePerToken

`type currencyValuePerToken = [GetBalanceResult](https://portal.thirdweb.com/references/typescript/v5/GetBalanceResult);

`

##### endTimeInSeconds

`type endTimeInSeconds = bigint;

`

##### id

`type id = bigint;

`

##### isReservedListing

`type isReservedListing = boolean;

`

##### pricePerToken

`type pricePerToken = bigint;

`

##### quantity

`type quantity = bigint;

`

##### startTimeInSeconds

`type startTimeInSeconds = bigint;

`

##### status

`type status = ListingStatus;

`

##### tokenId

`type tokenId = bigint;

`

##### type

`type type = "direct-listing";

`
## EIP1193Provider

`type EIP1193Provider = {

request: (params: any) => Promise<any>;

on: (event: any, listener: (params: any) => any) => void;

removeListener: (

event: any,

listener: (params: any) => any,

 ) => void;

};

`

##### request

##### Signature

`function request(params: any): Promise<any>;

`

##### Parameters

##### params

###### Type

`let params: any;

`

##### Returns

##### Return Type

`let returnType: Promise<any>;

`

##### on

##### Signature

`function on(event: any, listener: (params: any) => any): void;

`

##### Parameters

##### event

###### Type

`let event: any;

`

##### listener

###### Type

`let listener: (params: any) => any;

`

##### Returns

##### Return Type

`let returnType: void;

`

##### removeListener

##### Signature

`function removeListener(

event: any,

listener: (params: any) => any,

): void;

`

##### Parameters

##### event

###### Type

`let event: any;

`

##### listener

###### Type

`let listener: (params: any) => any;

`

##### Returns

##### Return Type

`let returnType: void;

`
## ERC1155ContractParams

`type ERC1155ContractParams = {

contractURI?: string;

defaultAdmin?: string;

description?: string;

external_link?: string;

image?: FileOrBufferOrString;

name: string;

platformFeeBps?: bigint;

platformFeeRecipient?: string;

royaltyBps?: bigint;

royaltyRecipient?: string;

saleRecipient?: string;

social_urls?: Record<string, string>;

symbol?: string;

trustedForwarders?: Array<string>;

};

`

##### contractURI

`type contractURI = string;

`

##### defaultAdmin

`type defaultAdmin = string;

`

##### description

`type description = string;

`

##### external\_link

`type external_link = string;

`

##### image

`type image = FileOrBufferOrString;

`

##### name

`type name = string;

`

##### platformFeeBps

`type platformFeeBps = bigint;

`

##### platformFeeRecipient

`type platformFeeRecipient = string;

`

##### royaltyBps

`type royaltyBps = bigint;

`

##### royaltyRecipient

`type royaltyRecipient = string;

`

##### saleRecipient

`type saleRecipient = string;

`

##### social\_urls

`type social_urls = Record<string, string>;

`

##### symbol

`type symbol = string;

`

##### trustedForwarders

`type trustedForwarders = Array<string>;

`
## ERC1155Reward

`type ERC1155Reward = {

contractAddress: string;

quantityPerReward: number | string;

tokenId: bigint;

totalRewards: number | string;

};

`

##### contractAddress

`type contractAddress = string;

`

##### quantityPerReward

`type quantityPerReward = number | string;

`

##### tokenId

`type tokenId = bigint;

`

##### totalRewards

`type totalRewards = number | string;

`
## ERC20ContractParams

`type ERC20ContractParams = {

contractURI?: string;

defaultAdmin?: string;

description?: string;

external_link?: string;

image?: FileOrBufferOrString;

name: string;

platformFeeBps?: bigint;

platformFeeRecipient?: string;

saleRecipient?: string;

social_urls?: Record<string, string>;

symbol?: string;

trustedForwarders?: Array<string>;

};

`

##### contractURI

`type contractURI = string;

`

##### defaultAdmin

`type defaultAdmin = string;

`

##### description

`type description = string;

`

##### external\_link

`type external_link = string;

`

##### image

`type image = FileOrBufferOrString;

`

##### name

`type name = string;

`

##### platformFeeBps

`type platformFeeBps = bigint;

`

##### platformFeeRecipient

`type platformFeeRecipient = string;

`

##### saleRecipient

`type saleRecipient = string;

`

##### social\_urls

`type social_urls = Record<string, string>;

`

##### symbol

`type symbol = string;

`

##### trustedForwarders

`type trustedForwarders = Array<string>;

`
## ERC721ContractParams

`type ERC721ContractParams = {

contractURI?: string;

defaultAdmin?: string;

description?: string;

external_link?: string;

image?: FileOrBufferOrString;

name: string;

platformFeeBps?: bigint;

platformFeeRecipient?: string;

royaltyBps?: bigint;

royaltyRecipient?: string;

saleRecipient?: string;

social_urls?: Record<string, string>;

symbol?: string;

trustedForwarders?: Array<string>;

};

`

##### contractURI

`type contractURI = string;

`

##### defaultAdmin

`type defaultAdmin = string;

`

##### description

`type description = string;

`

##### external\_link

`type external_link = string;

`

##### image

`type image = FileOrBufferOrString;

`

##### name

`type name = string;

`

##### platformFeeBps

`type platformFeeBps = bigint;

`

##### platformFeeRecipient

`type platformFeeRecipient = string;

`

##### royaltyBps

`type royaltyBps = bigint;

`

##### royaltyRecipient

`type royaltyRecipient = string;

`

##### saleRecipient

`type saleRecipient = string;

`

##### social\_urls

`type social_urls = Record<string, string>;

`

##### symbol

`type symbol = string;

`

##### trustedForwarders

`type trustedForwarders = Array<string>;

`
## ERC20Reward

`type ERC20Reward = {

contractAddress: string;

quantityPerReward: number | string;

totalRewards: number | string;

};

`

##### contractAddress

`type contractAddress = string;

`

##### quantityPerReward

`type quantityPerReward = number | string;

`

##### totalRewards

`type totalRewards = number | string;

`
## ERC721Reward

`type ERC721Reward = { contractAddress: string; tokenId: bigint };

`

##### contractAddress

`type contractAddress = string;

`

##### tokenId

`type tokenId = bigint;

`
## EcosystemWalletCreationOptions

`type EcosystemWalletCreationOptions = {

auth?: {

defaultSmsCountryCode?: SupportedSmsCountry;

mode?: "popup" | "redirect" | "window";

redirectUrl?: string;

 };

partnerId?: string;

storage?: [AsyncStorage](https://portal.thirdweb.com/references/typescript/v5/AsyncStorage);

};

`

##### auth

`type auth = {

defaultSmsCountryCode?: SupportedSmsCountry;

mode?: "popup" | "redirect" | "window";

redirectUrl?: string;

};

`

##### partnerId

 The partnerId of the ecosystem wallet to connect to

`type partnerId = string;

`

##### storage

 The storage to use for storing wallet state

`type storage = [AsyncStorage](https://portal.thirdweb.com/references/typescript/v5/AsyncStorage);

`
## Ed25519Keypair

`type Ed25519Keypair = { privateKey: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex); publicKey: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex) };

`

##### privateKey

`type privateKey = [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

`

##### publicKey

`type publicKey = [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

`
## EditionMintParams

`type EditionMintParams = {

amount: bigint;

nft: [NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput) | string;

to: string;

tokenId?: bigint;

};

`

##### amount

`type amount = bigint;

`

##### nft

`type nft = [NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput) | string;

`

##### to

`type to = string;

`

##### tokenId

`type tokenId = bigint;

`
## EnableFeeAmountParams

 Represents the parameters for the "enableFeeAmount" function.

`type EnableFeeAmountParams = WithOverrides<{

fee: AbiParameterToPrimitiveType<{ name: "fee"; type: "uint24" }>;

tickSpacing: AbiParameterToPrimitiveType<{

name: "tickSpacing";

type: "int24";

 }>;

}>;

`
## EngineAccountOptions

 Options for creating an engine account.

`type EngineAccountOptions = {

authToken: string;

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

engineUrl: string;

walletAddress: string;

};

`

##### authToken

 The auth token to use with the engine instance.

`type authToken = string;

`

##### chain

 The chain to use for signing messages and typed data (smart backend wallet only).

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### engineUrl

 The URL of your engine instance.

`type engineUrl = string;

`

##### walletAddress

 The backend wallet to use for sending transactions inside engine.

`type walletAddress = string;

`
## EnglishAuction

`type EnglishAuction = {

asset: [NFT](https://portal.thirdweb.com/references/typescript/v5/NFT);

assetContractAddress: Address;

bidBufferBps: bigint;

buyoutBidAmount: bigint;

buyoutCurrencyValue: [GetBalanceResult](https://portal.thirdweb.com/references/typescript/v5/GetBalanceResult);

creatorAddress: Address;

currencyContractAddress: Address;

endTimeInSeconds: bigint;

id: bigint;

minimumBidAmount: bigint;

minimumBidCurrencyValue: [GetBalanceResult](https://portal.thirdweb.com/references/typescript/v5/GetBalanceResult);

quantity: bigint;

startTimeInSeconds: bigint;

status: ListingStatus;

timeBufferInSeconds: bigint;

tokenId: bigint;

type: "english-auction";

};

`

##### asset

`type asset = [NFT](https://portal.thirdweb.com/references/typescript/v5/NFT);

`

##### assetContractAddress

`type assetContractAddress = Address;

`

##### bidBufferBps

`type bidBufferBps = bigint;

`

##### buyoutBidAmount

`type buyoutBidAmount = bigint;

`

##### buyoutCurrencyValue

`type buyoutCurrencyValue = [GetBalanceResult](https://portal.thirdweb.com/references/typescript/v5/GetBalanceResult);

`

##### creatorAddress

`type creatorAddress = Address;

`

##### currencyContractAddress

`type currencyContractAddress = Address;

`

##### endTimeInSeconds

`type endTimeInSeconds = bigint;

`

##### id

`type id = bigint;

`

##### minimumBidAmount

`type minimumBidAmount = bigint;

`

##### minimumBidCurrencyValue

`type minimumBidCurrencyValue = [GetBalanceResult](https://portal.thirdweb.com/references/typescript/v5/GetBalanceResult);

`

##### quantity

`type quantity = bigint;

`

##### startTimeInSeconds

`type startTimeInSeconds = bigint;

`

##### status

`type status = ListingStatus;

`

##### timeBufferInSeconds

`type timeBufferInSeconds = bigint;

`

##### tokenId

`type tokenId = bigint;

`

##### type

`type type = "english-auction";

`
## EngineOptions

`type EngineOptions = {

domainName?: string;

domainSeparatorVersion?: string;

domainVersion?: string;

experimentalChainlessSupport?: boolean;

provider: "engine";

relayerForwarderAddress: Address;

relayerUrl: string;

};

`

##### domainName

`type domainName = string;

`

##### domainSeparatorVersion

`type domainSeparatorVersion = string;

`

##### domainVersion

`type domainVersion = string;

`

##### experimentalChainlessSupport

`type experimentalChainlessSupport = boolean;

`

##### provider

`type provider = "engine";

`

##### relayerForwarderAddress

`type relayerForwarderAddress = Address;

`

##### relayerUrl

`type relayerUrl = string;

`
## EnsProfile

`type EnsProfile = {

address?: string;

avatar?: string;

description?: string;

discord?: string;

display?: string;

email?: string;

github?: string;

keywords?: Array<string>;

location?: string;

mail?: string;

name?: string;

notice?: string;

phone?: string;

telegram?: string;

twitter?: string;

url?: string;

};

`

##### address

`type address = string;

`

##### avatar

`type avatar = string;

`

##### description

`type description = string;

`

##### discord

`type discord = string;

`

##### display

`type display = string;

`

##### email

`type email = string;

`

##### github

`type github = string;

`

##### keywords

`type keywords = Array<string>;

`

##### location

`type location = string;

`

##### mail

`type mail = string;

`

##### name

`type name = string;

`

##### notice

`type notice = string;

`

##### phone

`type phone = string;

`

##### telegram

`type telegram = string;

`

##### twitter

`type twitter = string;

`

##### url

`type url = string;

`
## CreateDirectListingButton

 This button is used to create Direct listings for the thirdweb Marketplace v3 contract

 It uses the [TransactionButton](https://portal.thirdweb.com/references/typescript/v5/TransactionButton)and the [createListing extension](https://portal.thirdweb.com/references/typescript/v5/marketplace/createListing) under the hood which means it inherits all the props of those 2 components.

### Example

`` import { CreateDirectListingButton } from "thirdweb/react";

<CreateDirectListingButton

contractAddress="0x..." // contract address for the marketplace-v3

chain={...} // the chain which the marketplace contract is deployed on

// These props below are the same props for `createListing`

// to get the full list, check the docs link above

tokenId={0n}

assetContractAddress="0x..." // The NFT contract address whose NFT(s) you want to sell

pricePerToken={"0.1"} // sell for 0.1 <native token>

>

 Sell NFT

</CreateDirectListingButton>

 ``

 For error handling & callbacks on transaction-sent and transaction-confirmed, please refer to the TransactionButton docs.

##### Signature

`function CreateDirectListingButton(

props: [CreateDirectListingButtonProps](https://portal.thirdweb.com/references/typescript/v5/CreateDirectListingButtonProps),

): Element;

`

### Parameters

##### props

#### Type

`let props: Omit<[TransactionButtonProps](https://portal.thirdweb.com/references/typescript/v5/TransactionButtonProps), "transaction"> &

[CreateListingParams](https://portal.thirdweb.com/references/typescript/v5/CreateListingParams) & {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

contractAddress: string;

 };

`

### Returns

##### Return Type

`let returnType: Element;

`
## EstimateGasOptions

`type EstimateGasOptions = Prettify<

 { transaction: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any> } & (

| { account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account); from?: never }

| { account?: never; from?: string | [Account](https://portal.thirdweb.com/references/typescript/v5/Account) }

 )

>;

`
## Erc6492Signature

`type Erc6492Signature = {

address: string;

data: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

signature: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

};

`

##### address

`type address = string;

`

##### data

`type data = [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

`

##### signature

`type signature = [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

`
## EstimateGasCostResult

`type EstimateGasCostResult = { ether: string; wei: bigint };

`

##### ether

 The estimated gas cost in ether.

`type ether = string;

`

##### wei

 The estimated gas cost in wei.

`type wei = bigint;

`
## ExactInputParams

 Represents the parameters for the "exactInput" function.

`type ExactInputParams = WithOverrides<{

params: AbiParameterToPrimitiveType<{

components: [

 { name: "path"; type: "bytes" },

 { name: "recipient"; type: "address" },

 { name: "deadline"; type: "uint256" },

 { name: "amountIn"; type: "uint256" },

 { name: "amountOutMinimum"; type: "uint256" },

 ];

name: "params";

type: "tuple";

 }>;

}>;

`
## ExactInputSingleParams

 Represents the parameters for the "exactInputSingle" function.

`type ExactInputSingleParams = WithOverrides<{

params: AbiParameterToPrimitiveType<{

components: [

 { name: "tokenIn"; type: "address" },

 { name: "tokenOut"; type: "address" },

 { name: "fee"; type: "uint24" },

 { name: "recipient"; type: "address" },

 { name: "deadline"; type: "uint256" },

 { name: "amountIn"; type: "uint256" },

 { name: "amountOutMinimum"; type: "uint256" },

 { name: "sqrtPriceLimitX96"; type: "uint160" },

 ];

name: "params";

type: "tuple";

 }>;

}>;

`
## ExactOutputParams

 Represents the parameters for the "exactOutput" function.

`type ExactOutputParams = WithOverrides<{

params: AbiParameterToPrimitiveType<{

components: [

 { name: "path"; type: "bytes" },

 { name: "recipient"; type: "address" },

 { name: "deadline"; type: "uint256" },

 { name: "amountOut"; type: "uint256" },

 { name: "amountInMaximum"; type: "uint256" },

 ];

name: "params";

type: "tuple";

 }>;

}>;

`
## ExecuteParams

 Represents the parameters for the "execute" function.

`type ExecuteParams = WithOverrides<{

calldatas: AbiParameterToPrimitiveType<{

name: "calldatas";

type: "bytes[]";

 }>;

descriptionHash: AbiParameterToPrimitiveType<{

name: "descriptionHash";

type: "bytes32";

 }>;

targets: AbiParameterToPrimitiveType<{

name: "targets";

type: "address[]";

 }>;

values: AbiParameterToPrimitiveType<{

name: "values";

type: "uint256[]";

 }>;

}>;

`
## ExactOutputSingleParams

 Represents the parameters for the "exactOutputSingle" function.

`type ExactOutputSingleParams = WithOverrides<{

params: AbiParameterToPrimitiveType<{

components: [

 { name: "tokenIn"; type: "address" },

 { name: "tokenOut"; type: "address" },

 { name: "fee"; type: "uint24" },

 { name: "recipient"; type: "address" },

 { name: "deadline"; type: "uint256" },

 { name: "amountOut"; type: "uint256" },

 { name: "amountInMaximum"; type: "uint256" },

 { name: "sqrtPriceLimitX96"; type: "uint160" },

 ];

name: "params";

type: "tuple";

 }>;

}>;

`
## ExecuteSaleParams

`type ExecuteSaleParams = { auctionId: bigint };

`

##### auctionId

`type auctionId = bigint;

`
## FarcasterContractOptions

 Represents the options to retrieve a Farcaster contract

`type FarcasterContractOptions = {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

};

`

##### chain

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`
## FeeAmountTickSpacingParams

 Represents the parameters for the "feeAmountTickSpacing" function.

`type FeeAmountTickSpacingParams = {

fee: AbiParameterToPrimitiveType<{ name: "fee"; type: "uint24" }>;

};

`

##### fee

`type fee = AbiParameterToPrimitiveType<{

name: "fee";

type: "uint24";

}>;

`
## ExtendedMetadata

`type ExtendedMetadata = {

audit?: string;

bytecodeUri: string;

changelog?: string;

compilers?: Record<

"solc" | "zksolc",

Array<{

bytecodeUri: string;

compilerVersion: string;

evmVersion: string;

metadataUri: string;

 }>

 >;

compositeAbi?: Abi;

constructorParams?: Record<

string,

 {

defaultValue?: string;

description?: string;

displayName?: string;

dynamicValue?: DynamicParams;

hidden?: boolean;

 }

 >;

defaultExtensions?: Array<{

extensionName: string;

extensionVersion: string;

publisherAddress: string;

 }>;

defaultModules?: Array<{

moduleName: string;

moduleVersion: string;

publisherAddress: string;

 }>;

deployType?: "standard" | "autoFactory" | "customFactory";

description?: string;

displayName?: string;

externalLinks?: Array<{ name: string; url: string }>;

factoryDeploymentData?: {

customFactoryInput?: {

customFactoryAddresses: Record<string, string>;

factoryFunction: string;

params: Array<{ name: string; type: string }>;

 };

factoryAddresses?: Record<string, string>;

implementationAddresses: Record<string, string>;

implementationInitializerFunction: string;

modularFactoryInput?: { hooksParamName: string };

 };

implConstructorParams?: Record<

string,

 { defaultValue?: string; dynamicValue?: DynamicParams }

 >;

isDeployableViaFactory?: boolean;

isDeployableViaProxy?: boolean;

logo?: string;

metadataUri: string;

name: string;

networksForDeployment?: {

allNetworks?: boolean;

networksEnabled?: Array<number>;

 };

publisher?: string;

readme?: string;

routerType?: "none" | "plugin" | "dynamic" | "modular";

tags?: Array<string>;

version: string;

};

`

##### audit

`type audit = string;

`

##### bytecodeUri

`type bytecodeUri = string;

`

##### changelog

`type changelog = string;

`

##### compilers

`type compilers = Record<

"solc" | "zksolc",

Array<{

bytecodeUri: string;

compilerVersion: string;

evmVersion: string;

metadataUri: string;

 }>

>;

`

##### compositeAbi

`type compositeAbi = Abi;

`

##### constructorParams

`type constructorParams = Record<

string,

 {

defaultValue?: string;

description?: string;

displayName?: string;

dynamicValue?: DynamicParams;

hidden?: boolean;

 }

>;

`

##### defaultExtensions

`type defaultExtensions = Array<{

extensionName: string;

extensionVersion: string;

publisherAddress: string;

}>;

`

##### defaultModules

`type defaultModules = Array<{

moduleName: string;

moduleVersion: string;

publisherAddress: string;

}>;

`

##### deployType

`type deployType = "standard" | "autoFactory" | "customFactory";

`

##### description

`type description = string;

`

##### displayName

`type displayName = string;

`

##### externalLinks

`type externalLinks = Array<{ name: string; url: string }>;

`

##### factoryDeploymentData

`type factoryDeploymentData = {

customFactoryInput?: {

customFactoryAddresses: Record<string, string>;

factoryFunction: string;

params: Array<{ name: string; type: string }>;

 };

factoryAddresses?: Record<string, string>;

implementationAddresses: Record<string, string>;

implementationInitializerFunction: string;

modularFactoryInput?: { hooksParamName: string };

};

`

##### implConstructorParams

`type implConstructorParams = Record<

string,

 { defaultValue?: string; dynamicValue?: DynamicParams }

>;

`

##### isDeployableViaFactory

`type isDeployableViaFactory = boolean;

`

##### isDeployableViaProxy

`type isDeployableViaProxy = boolean;

`

##### logo

`type logo = string;

`

##### metadataUri

`type metadataUri = string;

`

##### name

`type name = string;

`

##### networksForDeployment

`type networksForDeployment = {

allNetworks?: boolean;

networksEnabled?: Array<number>;

};

`

##### publisher

`type publisher = string;

`

##### readme

`type readme = string;

`

##### routerType

`type routerType = "none" | "plugin" | "dynamic" | "modular";

`

##### tags

`type tags = Array<string>;

`

##### version

`type version = string;

`
## ExistsParams

 Represents the parameters for the "exists" function.

`type ExistsParams = {

tokenId: AbiParameterToPrimitiveType<{

name: "tokenId";

type: "uint256";

 }>;

};

`

##### tokenId

`type tokenId = AbiParameterToPrimitiveType<{

name: "tokenId";

type: "uint256";

}>;

`
## FarcasterProfile

`type FarcasterProfile = {

addresses?: Array<string>;

bio?: string;

custodyAddress?: string;

display?: string;

fid?: number;

pfp?: string;

username?: string;

};

`

##### addresses

`type addresses = Array<string>;

`

##### bio

`type bio = string;

`

##### custodyAddress

`type custodyAddress = string;

`

##### display

`type display = string;

`

##### fid

`type fid = number;

`

##### pfp

`type pfp = string;

`

##### username

`type username = string;

`
## FromBytesReturnType

`type FromBytesReturnType<TTo> = TTo extends "string"

? string

: TTo extends "hex"

? [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex)

: TTo extends "bigint"

? bigint

: TTo extends "number"

? number

: TTo extends "boolean"

? boolean

: never;

`
## FromHexReturnType

`type FromHexReturnType<TTo> = TTo extends "string"

? string

: TTo extends "bigint"

? bigint

: TTo extends "number"

? number

: TTo extends "bytes"

? Uint8Array

: TTo extends "boolean"

? boolean

: never;

`
## FromBytesParameters

`type FromBytesParameters<

TTo extends "string" | "hex" | "bigint" | "number" | "boolean",

> = TTo | { size?: number; to: TTo };

`
## FromHexParameters

`type FromHexParameters<

TTo extends "string" | "bigint" | "number" | "bytes" | "boolean",

> = TTo | { size?: number; to: TTo };

`
## FullProfileResponse

`type FullProfileResponse = {

handle: string;

joinDate: bigint | null;

profileData: [LensProfileSchema](https://portal.thirdweb.com/references/typescript/v5/LensProfileSchema) | null;

} | null;

`
## FundWalletOptions

`type FundWalletOptions = {

mode?: "fund_wallet";

prefillBuy?: {

allowEdits?: { amount: boolean; chain: boolean; token: boolean };

amount?: string;

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

token?: [TokenInfo](https://portal.thirdweb.com/references/typescript/v5/TokenInfo);

 };

};

`

##### mode

`type mode = "fund_wallet";

`

##### prefillBuy

 Prefill the Buy Token amount, chain and/or token. You can also disable the edits for the prefilled values using `allowEdits` \- By default all are editable

 For example, if you want to allow changing the amount, but disable changing the token and chain, you can set `allowEdits` to `{ amount: true, token: false, chain: false }`

 If no `token` object is not specified, native token will be prefilled by default

`type prefillBuy = {

allowEdits?: { amount: boolean; chain: boolean; token: boolean };

amount?: string;

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

token?: [TokenInfo](https://portal.thirdweb.com/references/typescript/v5/TokenInfo);

};

`
## FromEip1193AdapterOptions

 Options for creating an EIP-1193 provider adapter.

`type FromEip1193AdapterOptions = {

provider: [EIP1193Provider](https://portal.thirdweb.com/references/typescript/v5/EIP1193Provider) | (() => Promise<[EIP1193Provider](https://portal.thirdweb.com/references/typescript/v5/EIP1193Provider)>);

walletId?: [WalletId](https://portal.thirdweb.com/references/typescript/v5/WalletId);

};

`

##### provider

`type provider = [EIP1193Provider](https://portal.thirdweb.com/references/typescript/v5/EIP1193Provider) | (() => Promise<[EIP1193Provider](https://portal.thirdweb.com/references/typescript/v5/EIP1193Provider)>);

`

##### walletId

`type walletId = [WalletId](https://portal.thirdweb.com/references/typescript/v5/WalletId);

`
## GenerateAirdropERC1155SignatureOptions

`type GenerateAirdropERC1155SignatureOptions = {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

airdropRequest: GenerateReqInput;

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

};

`

##### account

`type account = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### airdropRequest

`type airdropRequest = GenerateReqInput;

`

##### contract

`type contract = [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

`
## GaslessOptions

 Gasless configs for sending gasless transactions. This config is used in:

* [TransactionButton](https://portal.thirdweb.com/references/typescript/v5/TransactionButton)
* [sendTransaction](https://portal.thirdweb.com/references/typescript/v5/sendTransaction)
* [useSendTransaction](https://portal.thirdweb.com/references/typescript/v5/useSendTransaction)
* [sendAndConfirmTransaction](https://portal.thirdweb.com/references/typescript/v5/sendAndConfirmTransaction)
* [useSendAndConfirmTransaction](https://portal.thirdweb.com/references/typescript/v5/useSendAndConfirmTransaction)

 Please refer to the docs of those components above for more info.

`type GaslessOptions =

| [EngineOptions](https://portal.thirdweb.com/references/typescript/v5/EngineOptions)

| [OpenZeppelinOptions](https://portal.thirdweb.com/references/typescript/v5/OpenZeppelinOptions)

| [BiconomyOptions](https://portal.thirdweb.com/references/typescript/v5/BiconomyOptions);

`
## GenerateAirdropERC721SignatureOptions

`type GenerateAirdropERC721SignatureOptions = {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

airdropRequest: GenerateReqInput;

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

};

`

##### account

`type account = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### airdropRequest

`type airdropRequest = GenerateReqInput;

`

##### contract

`type contract = [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

`
## GenerateAccountOptions

`type GenerateAccountOptions = { client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient) };

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`
## GenerateLoginPayloadParams

`type GenerateLoginPayloadParams = {

address: string;

chainId?: number;

};

`

##### address

`type address = string;

`

##### chainId

`type chainId = number;

`
## GenerateAirdropERC20SignatureOptions

`type GenerateAirdropERC20SignatureOptions = {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

airdropRequest: GenerateReqInput;

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

};

`

##### account

`type account = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### airdropRequest

`type airdropRequest = GenerateReqInput;

`

##### contract

`type contract = [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

`
## GenerateMerkleTreeInfoERC1155Params

`type GenerateMerkleTreeInfoERC1155Params = {

snapshot: Array<SnapshotEntryERC1155>;

tokenAddress: string;

};

`

##### snapshot

`type snapshot = Array<SnapshotEntryERC1155>;

`

##### tokenAddress

`type tokenAddress = string;

`
## GenerateMerkleTreeInfoERC721Params

`type GenerateMerkleTreeInfoERC721Params = {

snapshot: Array<SnapshotEntryERC721>;

tokenAddress: string;

};

`

##### snapshot

`type snapshot = Array<SnapshotEntryERC721>;

`

##### tokenAddress

`type tokenAddress = string;

`
## GenerateMerkleTreeInfoERC20Params

`type GenerateMerkleTreeInfoERC20Params = {

snapshot: Array<SnapshotEntryERC20>;

tokenAddress: string;

};

`

##### snapshot

`type snapshot = Array<SnapshotEntryERC20>;

`

##### tokenAddress

`type tokenAddress = string;

`
## GenerateMintSignatureOptions

`type GenerateMintSignatureOptions<

T extends "LoyaltyCard" | "TokenERC721" = "TokenERC721",

> = {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

contractType?: T;

mintRequest: GeneratePayloadInput;

};

`

##### account

`type account = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### contract

`type contract = [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

`

##### contractType

`type contractType = T;

`

##### mintRequest

`type mintRequest = GeneratePayloadInput;

`
## GetAccountsOfSignerParams

 Represents the parameters for the "getAccountsOfSigner" function.

`type GetAccountsOfSignerParams = {

signer: AbiParameterToPrimitiveType<{

name: "signer";

type: "address";

 }>;

};

`

##### signer

`type signer = AbiParameterToPrimitiveType<{

name: "signer";

type: "address";

}>;

`
## GenerateMintSignatureOptions

`type GenerateMintSignatureOptions = {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

mintRequest: GeneratePayloadInput;

};

`

##### account

`type account = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### contract

`type contract = [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

`

##### mintRequest

`type mintRequest = GeneratePayloadInput;

`
## GenerateMintSignatureOptions

`type GenerateMintSignatureOptions = {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

mintRequest: GeneratePayloadInput;

nft: [NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput) | string;

};

`

##### account

`type account = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### contract

`type contract = [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

`

##### mintRequest

`type mintRequest = GeneratePayloadInput;

`

##### nft

`type nft = [NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput) | string;

`
## GenerateMintSignatureOptions

`type GenerateMintSignatureOptions = {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

contractType?: "TokenERC1155" | "SignatureMintERC1155";

mintRequest: GeneratePayloadInput;

};

`

##### account

`type account = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### contract

`type contract = [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

`

##### contractType

`type contractType = "TokenERC1155" | "SignatureMintERC1155";

`

##### mintRequest

`type mintRequest = GeneratePayloadInput;

`
## GenerateMintSignatureOptions

`type GenerateMintSignatureOptions = {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

mintRequest: GeneratePayloadInput;

};

`

##### account

`type account = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### contract

`type contract = [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

`

##### mintRequest

`type mintRequest = GeneratePayloadInput;

`
## GetAllAuctionParams

`type GetAllAuctionParams = { count?: bigint; start?: number };

`

##### count

 The number of listings to retrieve.

`type count = bigint;

`

##### start

 The start index of the listings to retrieve.

`type start = number;

`
## GetAllListingParams

`type GetAllListingParams = { count?: bigint; start?: number };

`

##### count

 The number of listings to retrieve.

`type count = bigint;

`

##### start

 The start index of the listings to retrieve.

`type start = number;

`
## GetAllOffersParams

`type GetAllOffersParams = { count?: bigint; start?: number };

`

##### count

 The number of offers to retrieve.

`type count = bigint;

`

##### start

 The start index of the offers to retrieve.

`type start = number;

`
## GetAllParams

 Represents the parameters for the "getAll" function.

`type GetAllParams = {

deployer: AbiParameterToPrimitiveType<{

name: "_deployer";

type: "address";

 }>;

};

`

##### deployer

`type deployer = AbiParameterToPrimitiveType<{

name: "_deployer";

type: "address";

}>;

`
## GetAllOwnersParams

 Parameters for retrieving NFTs.

`type GetAllOwnersParams = { count?: number; start?: number };

`

##### count

 The number of NFTs to retrieve.

`type count = number;

`

##### start

 Which tokenId to start at.

`type start = number;

`
## GetAllPublishedContractsParams

 Represents the parameters for the "getAllPublishedContracts" function.

`type GetAllPublishedContractsParams = {

publisher: AbiParameterToPrimitiveType<{

name: "publisher";

type: "address";

 }>;

};

`

##### publisher

`type publisher = AbiParameterToPrimitiveType<{

name: "publisher";

type: "address";

}>;

`
## GetAllValidAuctionParams

`type GetAllValidAuctionParams = { count?: bigint; start?: number };

`

##### count

 The number of listings to retrieve.

`type count = bigint;

`

##### start

 The start index of the listings to retrieve.

`type start = number;

`
## GenerateMintSignatureOptions

`type GenerateMintSignatureOptions = {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

mintRequest: GeneratePayloadInput;

nfts: Array<[NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput) | string>;

};

`

##### account

`type account = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### contract

`type contract = [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

`

##### mintRequest

`type mintRequest = GeneratePayloadInput;

`

##### nfts

`type nfts = Array<[NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput) | string>;

`
## GetAllValidOffersParams

`type GetAllValidOffersParams = { count?: bigint; start?: number };

`

##### count

 The number of offers to retrieve.

`type count = bigint;

`

##### start

 The start index of the offers to retrieve.

`type start = number;

`
## GetAllRoleMembersParams

`type GetAllRoleMembersParams = { role: RoleInput };

`

##### role

`type role = RoleInput;

`
## GetApprovalForTransactionParams

`type GetApprovalForTransactionParams = {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

transaction: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

};

`

##### account

 The caller's account

`type account = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### transaction

 The transaction that involves the ERC20 token

`type transaction = [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

`
## GetAuthenticatedUserParams

`type GetAuthenticatedUserParams = {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

ecosystem?: Ecosystem;

};

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### ecosystem

`type ecosystem = Ecosystem;

`
## GetAllValidListingParams

`type GetAllValidListingParams = { count?: bigint; start?: number };

`

##### count

 The number of listings to retrieve.

`type count = bigint;

`

##### start

 The start index of the listings to retrieve.

`type start = number;

`
## GetBalanceParams

 Represents the parameters for retrieving the balance of an address.

`type GetBalanceParams = { address: string };

`

##### address

 The address for which to retrieve the balance.

`type address = string;

`
## GetBalanceResult

 Represents the result of a balance query for an ERC20 token.

`type GetBalanceResult = {

decimals: number;

displayValue: string;

name: string;

symbol: string;

value: bigint;

};

`

##### decimals

`type decimals = number;

`

##### displayValue

`type displayValue = string;

`

##### name

`type name = string;

`

##### symbol

`type symbol = string;

`

##### value

`type value = bigint;

`
## GetBlockHashParams

 Represents the parameters for the "getBlockHash" function.

`type GetBlockHashParams = {

blockNumber: AbiParameterToPrimitiveType<{

name: "blockNumber";

type: "uint256";

 }>;

};

`

##### blockNumber

`type blockNumber = AbiParameterToPrimitiveType<{

name: "blockNumber";

type: "uint256";

}>;

`
## GetBuyWithFiatQuoteParams

 Parameters for [getBuyWithFiatQuote](https://portal.thirdweb.com/references/typescript/v5/getBuyWithFiatQuote) function

`type GetBuyWithFiatQuoteParams = {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

fromAddress: string;

fromAmount?: string;

fromCurrencySymbol: CurrencyMeta["shorthand"];

isTestMode?: boolean;

maxSlippageBPS?: number;

preferredProvider?: FiatProvider;

purchaseData?: object;

toAddress: string;

toAmount?: string;

toChainId: number;

toGasAmountWei?: string;

toTokenAddress: string;

};

`

##### client

 A client is the entry point to the thirdweb SDK. It is required for all other actions.

 You can create a client using the `createThirdwebClient` function. Refer to the [ Creating a Client](https://portal.thirdweb.com/typescript/v5/client) documentation for more information.

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### fromAddress

 The address of the wallet which will be used to buy the token.

`type fromAddress = string;

`

##### fromAmount

 The amount of fiat currency to spend to buy the token. This is useful if you want to buy whatever amount of token you can get for a certain amount of fiat currency.

 If you want a certain amount of token, you can provide `toAmount` instead of `fromAmount` .

`type fromAmount = string;

`

##### fromCurrencySymbol

 Symbol of the fiat currency to buy the token with.

`type fromCurrencySymbol = CurrencyMeta["shorthand"];

`

##### isTestMode

 Whether to use on-ramp provider in test mode for testing purpose or not.

 Defaults to `false`

`type isTestMode = boolean;

`

##### maxSlippageBPS

 The maximum slippage in basis points (bps) allowed for the transaction. For example, if you want to allow a maximum slippage of 0.5%, you should specify `50` bps.

`type maxSlippageBPS = number;

`

##### preferredProvider

 Optional parameter to specify the preferred onramp provider.

 By default, we choose a recommended provider based on the location of the user, KYC status, and currency.

`type preferredProvider = FiatProvider;

`

##### purchaseData

 Extra details to store with the purchase.

 This details will be stored with the purchase and can be retrieved later via the status API or Webhook

`type purchaseData = object;

`

##### toAddress

 The address of the wallet where the tokens will be sent.

`type toAddress = string;

`

##### toAmount

 The amount of token to buy This is useful if you want to get a certain amount of token.

 If you want to buy however much token you can get for a certain amount of fiat currency, you can provide `fromAmount` instead of `toAmount` .

`type toAmount = string;

`

##### toChainId

 Chain id of the token to buy.

`type toChainId = number;

`

##### toGasAmountWei

 Optional parameter to onramp gas with the purchase If native token, will onramp extra native token amount If erc20, will onramp native token + erc20

`type toGasAmountWei = string;

`

##### toTokenAddress

 Token address of the token to buy.

`type toTokenAddress = string;

`
## GetBuyWithCryptoQuoteParams

 The parameters for [getBuyWithCryptoQuote](https://portal.thirdweb.com/references/typescript/v5/getBuyWithCryptoQuote) function It includes information about which tokens to swap, the amount of tokens to swap, slippage, etc.

`type GetBuyWithCryptoQuoteParams = {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

fromAddress: string;

fromChainId: number;

fromTokenAddress: string;

intentId?: string;

maxSlippageBPS?: number;

purchaseData?: object;

toAddress: string;

toChainId: number;

toTokenAddress: string;

} & (

| { fromAmount: string; toAmount?: never }

| { fromAmount?: never; toAmount: string }

);

`
## GetBuyWithCryptoTransferParams

 The parameters for [getBuyWithCryptoTransfer](https://portal.thirdweb.com/references/typescript/v5/getBuyWithCryptoTransfer) function It facilitates a token transfer.

`type GetBuyWithCryptoTransferParams = {

amount: string;

chainId: number;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

fromAddress: string;

purchaseData?: object;

toAddress: string;

tokenAddress: string;

};

`

##### amount

 The amount of token to be transferred.

`type amount = string;

`

##### chainId

 The chain id of the transfer token.

`type chainId = number;

`

##### client

 A client is the entry point to the thirdweb SDK. It is required for all other actions.

 You can create a client using the `createThirdwebClient` function. Refer to the [ Creating a Client](https://portal.thirdweb.com/typescript/v5/client) documentation for more information.

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### fromAddress

 The address of wallet that pays for the tokens.

`type fromAddress = string;

`

##### purchaseData

 Extra details to store with the purchase.

 This details will be stored with the purchase and can be retrieved later via the status API or Webhook

`type purchaseData = object;

`

##### toAddress

 The address of the wallet where the tokens are sent

`type toAddress = string;

`

##### tokenAddress

 The token address of the transfer token.

`type tokenAddress = string;

`
## GetCapabilitiesOptions

`type GetCapabilitiesOptions<ID extends [WalletId](https://portal.thirdweb.com/references/typescript/v5/WalletId) = [WalletId](https://portal.thirdweb.com/references/typescript/v5/WalletId)> = {

wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)<ID>;

};

`

##### wallet

`type wallet = [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)<ID>;

`
## GetCallsStatusOptions

`type GetCallsStatusOptions = {

bundleId: [WalletSendCallsId](https://portal.thirdweb.com/references/typescript/v5/WalletSendCallsId);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

};

`

##### bundleId

`type bundleId = [WalletSendCallsId](https://portal.thirdweb.com/references/typescript/v5/WalletSendCallsId);

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### wallet

`type wallet = [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

`
## GetBuyWithFiatStatusParams

 Parameters for the [getBuyWithFiatStatus](https://portal.thirdweb.com/references/typescript/v5/getBuyWithFiatStatus) function

`type GetBuyWithFiatStatusParams = {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

intentId: string;

};

`

##### client

 A client is the entry point to the thirdweb SDK. It is required for all other actions.

 You can create a client using the `createThirdwebClient` function. Refer to the [ Creating a Client](https://portal.thirdweb.com/typescript/v5/client) documentation for more information.

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### intentId

 Intent ID of the "Buy with fiat" transaction. You can get the intent ID from the quote object returned by the [getBuyWithFiatQuote](https://portal.thirdweb.com/references/typescript/v5/getBuyWithFiatQuote) function

`type intentId = string;

`
## GetClaimConditionByIdParams

 Represents the parameters for the "getClaimConditionById" function.

`type GetClaimConditionByIdParams = {

conditionId: AbiParameterToPrimitiveType<{

name: "_conditionId";

type: "uint256";

 }>;

tokenId: AbiParameterToPrimitiveType<{

name: "_tokenId";

type: "uint256";

 }>;

};

`

##### conditionId

`type conditionId = AbiParameterToPrimitiveType<{

name: "_conditionId";

type: "uint256";

}>;

`

##### tokenId

`type tokenId = AbiParameterToPrimitiveType<{

name: "_tokenId";

type: "uint256";

}>;

`
## GetCallsStatusResponse

`type GetCallsStatusResponse = {

receipts: Array<[WalletCallReceipt](https://portal.thirdweb.com/references/typescript/v5/WalletCallReceipt)<bigint, "success" | "reverted">>;

status: "PENDING" | "CONFIRMED";

};

`

##### receipts

`type receipts = Array<

[WalletCallReceipt](https://portal.thirdweb.com/references/typescript/v5/WalletCallReceipt)<bigint, "success" | "reverted">

>;

`

##### status

`type status = "PENDING" | "CONFIRMED";

`
## GetClaimParamsOptions

`type GetClaimParamsOptions = {

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

from?: string;

quantity: bigint;

singlePhaseDrop?: boolean;

to: string;

} & (

| { type: "erc721" }

| { tokenDecimals: number; type: "erc20" }

| { tokenId: bigint; type: "erc1155" }

);

`
## GetContractEventsOptions

`type GetContractEventsOptions<

abi extends Abi,

abiEvents extends Array<[PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<AbiEvent>>,

TStrict extends boolean,

> = Prettify<

GetContractEventsOptionsDirect<abi, abiEvents, TStrict> &

GetLogsBlockParams

>;

`
## GetContentURIParams

 Represents the parameters for the "getContentURI" function.

`type GetContentURIParams = {

profileId: AbiParameterToPrimitiveType<{

name: "profileId";

type: "uint256";

 }>;

pubId: AbiParameterToPrimitiveType<{

name: "pubId";

type: "uint256";

 }>;

};

`

##### profileId

`type profileId = AbiParameterToPrimitiveType<{

name: "profileId";

type: "uint256";

}>;

`

##### pubId

`type pubId = AbiParameterToPrimitiveType<{

name: "pubId";

type: "uint256";

}>;

`
## GetContractEventsResult

`type GetContractEventsResult<

abiEvents extends Array<[PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<AbiEvent>>,

TStrict extends boolean,

> = [ParseEventLogsResult](https://portal.thirdweb.com/references/typescript/v5/ParseEventLogsResult)<abiEvents, TStrict>;

`
## GetEthBalanceParams

 Represents the parameters for the "getEthBalance" function.

`type GetEthBalanceParams = {

addr: AbiParameterToPrimitiveType<{

name: "addr";

type: "address";

 }>;

};

`

##### addr

`type addr = AbiParameterToPrimitiveType<{

name: "addr";

type: "address";

}>;

`
## GetCurrencyMetadataResult

`type GetCurrencyMetadataResult = {

decimals: number;

name: string;

symbol: string;

};

`

##### decimals

`type decimals = number;

`

##### name

`type name = string;

`

##### symbol

`type symbol = string;

`
## GetClaimConditionsParams

`type GetClaimConditionsParams = { tokenId: bigint };

`

##### tokenId

`type tokenId = bigint;

`
## GetFidParams

`type GetFidParams = {

address: Address;

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

disableCache?: boolean;

};

`

##### address

`type address = Address;

`

##### chain

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### disableCache

`type disableCache = boolean;

`
## GetFollowDataParams

 Represents the parameters for the "getFollowData" function.

`type GetFollowDataParams = {

followTokenId: AbiParameterToPrimitiveType<{

name: "followTokenId";

type: "uint256";

 }>;

};

`

##### followTokenId

`type followTokenId = AbiParameterToPrimitiveType<{

name: "followTokenId";

type: "uint256";

}>;

`
## GetFollowTokenIdParams

 Represents the parameters for the "getFollowTokenId" function.

`type GetFollowTokenIdParams = {

followerProfileId: AbiParameterToPrimitiveType<{

name: "followerProfileId";

type: "uint256";

 }>;

};

`

##### followerProfileId

`type followerProfileId = AbiParameterToPrimitiveType<{

name: "followerProfileId";

type: "uint256";

}>;

`
## GetFollowerProfileIdParams

 Represents the parameters for the "getFollowerProfileId" function.

`type GetFollowerProfileIdParams = {

followTokenId: AbiParameterToPrimitiveType<{

name: "followTokenId";

type: "uint256";

 }>;

};

`

##### followTokenId

`type followTokenId = AbiParameterToPrimitiveType<{

name: "followTokenId";

type: "uint256";

}>;

`
## GetFullProfileParams

`type GetFullProfileParams = {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

includeJoinDate?: boolean;

overrides?: {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

lensHandleAddress?: string;

lensHubAddress?: string;

tokenHandleRegistryAddress?: string;

 };

profileId: bigint;

};

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### includeJoinDate

`type includeJoinDate = boolean;

`

##### overrides

 Override variables for Lens smart contracts Make sure all of them have to be on the same network

`type overrides = {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

lensHandleAddress?: string;

lensHubAddress?: string;

tokenHandleRegistryAddress?: string;

};

`

##### profileId

`type profileId = bigint;

`
## GetHandleFromProfileIdParams

`type GetHandleFromProfileIdParams = {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

overrides?: {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

lensHandleAddress?: string;

tokenHandleRegistryAddress?: string;

 };

profileId: bigint;

};

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### overrides

 Override variables for LensHandle contract and TokenHandleRegistry contract Make sure both of them have to be on the same network

`type overrides = {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

lensHandleAddress?: string;

tokenHandleRegistryAddress?: string;

};

`

##### profileId

`type profileId = bigint;

`
## GetGasPriceOptions

`type GetGasPriceOptions = {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

percentMultiplier?: number;

};

`

##### chain

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### percentMultiplier

`type percentMultiplier = number;

`
## GetDefaultHandleParams

 Represents the parameters for the "getDefaultHandle" function.

`type GetDefaultHandleParams = {

profileId: AbiParameterToPrimitiveType<{

name: "profileId";

type: "uint256";

 }>;

};

`

##### profileId

`type profileId = AbiParameterToPrimitiveType<{

name: "profileId";

type: "uint256";

}>;

`
## GetHandleParams

 Represents the parameters for the "getHandle" function.

`type GetHandleParams = {

tokenId: AbiParameterToPrimitiveType<{

name: "tokenId";

type: "uint256";

 }>;

};

`

##### tokenId

`type tokenId = AbiParameterToPrimitiveType<{

name: "tokenId";

type: "uint256";

}>;

`
## GetLocalNameParams

 Represents the parameters for the "getLocalName" function.

`type GetLocalNameParams = {

tokenId: AbiParameterToPrimitiveType<{

name: "tokenId";

type: "uint256";

 }>;

};

`

##### tokenId

`type tokenId = AbiParameterToPrimitiveType<{

name: "tokenId";

type: "uint256";

}>;

`
## GetNFTParams

 Parameters for getting an NFT.

`type GetNFTParams = { tokenId: bigint };

`

##### tokenId

`type tokenId = bigint;

`
## GetModuleTypesParams

 Represents the parameters for the "getModuleTypes" function.

`type GetModuleTypesParams = {

moduleAddress: AbiParameterToPrimitiveType<{

name: "moduleAddress";

type: "address";

 }>;

};

`

##### moduleAddress

`type moduleAddress = AbiParameterToPrimitiveType<{

name: "moduleAddress";

type: "address";

}>;

`
## GetMetadataUriParams

 Represents the parameters for the "getMetadataUri" function.

`type GetMetadataUriParams = {

chainId: AbiParameterToPrimitiveType<{

name: "_chainId";

type: "uint256";

 }>;

deployment: AbiParameterToPrimitiveType<{

name: "_deployment";

type: "address";

 }>;

};

`

##### chainId

`type chainId = AbiParameterToPrimitiveType<{

name: "_chainId";

type: "uint256";

}>;

`

##### deployment

`type deployment = AbiParameterToPrimitiveType<{

name: "_deployment";

type: "address";

}>;

`
## GetNFTsParams

 Parameters for retrieving NFTs.

`type GetNFTsParams = {

count?: number;

includeOwners?: boolean;

start?: number;

tokenByIndex?: boolean;

};

`

##### count

 The number of NFTs to retrieve.

`type count = number;

`

##### includeOwners

 Whether to include the owner of each NFT.

`type includeOwners = boolean;

`

##### start

 Which tokenId to start at.

`type start = number;

`

##### tokenByIndex

 Whether to check and fetch tokenID by index, in case of non-sequential IDs.

 It should be set to true if it's an ERC721Enumerable contract, and has `tokenByIndex` function. In this case, the provided tokenId will be considered as token-index and actual tokenId will be fetched from the contract.

`type tokenByIndex = boolean;

`
## GetNFTsParams

 Parameters for retrieving NFTs.

`type GetNFTsParams = { count?: number; start?: number };

`

##### count

 The number of NFTs to retrieve.

`type count = number;

`

##### start

 Which tokenId to start at.

`type start = number;

`
## GetNonceParams

`type GetNonceParams = {

address: Address;

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

disableCache?: boolean;

};

`

##### address

`type address = Address;

`

##### chain

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### disableCache

`type disableCache = boolean;

`
## GetOriginalFollowTimestampParams

 Represents the parameters for the "getOriginalFollowTimestamp" function.

`type GetOriginalFollowTimestampParams = {

followTokenId: AbiParameterToPrimitiveType<{

name: "followTokenId";

type: "uint256";

 }>;

};

`

##### followTokenId

`type followTokenId = AbiParameterToPrimitiveType<{

name: "followTokenId";

type: "uint256";

}>;

`
## GetPackContentsParams

 Represents the parameters for the "getPackContents" function.

`type GetPackContentsParams = {

packId: AbiParameterToPrimitiveType<{

name: "_packId";

type: "uint256";

 }>;

};

`

##### packId

`type packId = AbiParameterToPrimitiveType<{

name: "_packId";

type: "uint256";

}>;

`
## GetOwnedTokenIdsParams

 Parameters for retrieving owned tokenIds of an ERC1155 contract.

`type GetOwnedTokenIdsParams = {

address: string;

count?: number;

start?: number;

};

`

##### address

 The address of the wallet to get the NFTs of.

`type address = string;

`

##### count

 The number of NFTs to retrieve.

`type count = number;

`

##### start

 Which tokenId to start at.

`type start = number;

`
## GetPermissionsForSignerParams

 Represents the parameters for the "getPermissionsForSigner" function.

`type GetPermissionsForSignerParams = {

signer: AbiParameterToPrimitiveType<{

name: "signer";

type: "address";

 }>;

};

`

##### signer

`type signer = AbiParameterToPrimitiveType<{

name: "signer";

type: "address";

}>;

`
## GetPoolParams

 Represents the parameters for the "getPool" function.

`type GetPoolParams = {

fee: AbiParameterToPrimitiveType<{ name: "fee"; type: "uint24" }>;

tokenA: AbiParameterToPrimitiveType<{

name: "tokenA";

type: "address";

 }>;

tokenB: AbiParameterToPrimitiveType<{

name: "tokenB";

type: "address";

 }>;

};

`

##### fee

`type fee = AbiParameterToPrimitiveType<{

name: "fee";

type: "uint24";

}>;

`

##### tokenA

`type tokenA = AbiParameterToPrimitiveType<{

name: "tokenA";

type: "address";

}>;

`

##### tokenB

`type tokenB = AbiParameterToPrimitiveType<{

name: "tokenB";

type: "address";

}>;

`
## GetPostOnRampQuoteParams

 The parameters for [getPostOnRampQuote](https://portal.thirdweb.com/references/typescript/v5/getPostOnRampQuote) function

`type GetPostOnRampQuoteParams = {

buyWithFiatStatus: [BuyWithFiatStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatStatus);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

};

`

##### buyWithFiatStatus

 The "Buy with fiat" transaction status object returned by [getBuyWithFiatStatus](https://portal.thirdweb.com/typescript/v5/getBuyWithFiatStatus) function

`type buyWithFiatStatus = [BuyWithFiatStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatStatus);

`

##### client

 A client is the entry point to the thirdweb SDK. It is required for all other actions.

 You can create a client using the `createThirdwebClient` function. Refer to the [ Creating a Client](https://portal.thirdweb.com/typescript/v5/client) documentation for more information.

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`
## GetProfileParams

 Represents the parameters for the "getProfile" function.

`type GetProfileParams = {

profileId: AbiParameterToPrimitiveType<{

name: "profileId";

type: "uint256";

 }>;

};

`

##### profileId

`type profileId = AbiParameterToPrimitiveType<{

name: "profileId";

type: "uint256";

}>;

`
## GetProfileIdByHandleHashParams

 Represents the parameters for the "getProfileIdByHandleHash" function.

`type GetProfileIdByHandleHashParams = {

handleHash: AbiParameterToPrimitiveType<{

name: "handleHash";

type: "bytes32";

 }>;

};

`

##### handleHash

`type handleHash = AbiParameterToPrimitiveType<{

name: "handleHash";

type: "bytes32";

}>;

`
## GetProfileMetadataParams

`type GetProfileMetadataParams = {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

overrides?: { chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain); lensHubAddress?: string };

profileId: bigint;

};

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### overrides

`type overrides = { chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain); lensHubAddress?: string };

`

##### profileId

`type profileId = bigint;

`
## GetPublicationParams

 Represents the parameters for the "getPublication" function.

`type GetPublicationParams = {

profileId: AbiParameterToPrimitiveType<{

name: "profileId";

type: "uint256";

 }>;

pubId: AbiParameterToPrimitiveType<{

name: "pubId";

type: "uint256";

 }>;

};

`

##### profileId

`type profileId = AbiParameterToPrimitiveType<{

name: "profileId";

type: "uint256";

}>;

`

##### pubId

`type pubId = AbiParameterToPrimitiveType<{

name: "pubId";

type: "uint256";

}>;

`
## GetPublishedContractParams

 Represents the parameters for the "getPublishedContract" function.

`type GetPublishedContractParams = {

contractId: AbiParameterToPrimitiveType<{

name: "contractId";

type: "string";

 }>;

publisher: AbiParameterToPrimitiveType<{

name: "publisher";

type: "address";

 }>;

};

`

##### contractId

`type contractId = AbiParameterToPrimitiveType<{

name: "contractId";

type: "string";

}>;

`

##### publisher

`type publisher = AbiParameterToPrimitiveType<{

name: "publisher";

type: "address";

}>;

`
## GetPublishedUriFromCompilerUriParams

 Represents the parameters for the "getPublishedUriFromCompilerUri" function.

`type GetPublishedUriFromCompilerUriParams = {

compilerMetadataUri: AbiParameterToPrimitiveType<{

name: "compilerMetadataUri";

type: "string";

 }>;

};

`

##### compilerMetadataUri

`type compilerMetadataUri = AbiParameterToPrimitiveType<{

name: "compilerMetadataUri";

type: "string";

}>;

`
## GetPublisherProfileUriParams

 Represents the parameters for the "getPublisherProfileUri" function.

`type GetPublisherProfileUriParams = {

publisher: AbiParameterToPrimitiveType<{

name: "publisher";

type: "address";

 }>;

};

`

##### publisher

`type publisher = AbiParameterToPrimitiveType<{

name: "publisher";

type: "address";

}>;

`
## GetRoleMemberCountParams

`type GetRoleMemberCountParams = { role: RoleInput };

`

##### role

`type role = RoleInput;

`
## GetRoleMemberParams

`type GetRoleMemberParams = { index: bigint; role: RoleInput };

`

##### index

`type index = bigint;

`

##### role

`type role = RoleInput;

`
## GetRoleAdminParams

`type GetRoleAdminParams = { role: RoleInput };

`

##### role

`type role = RoleInput;

`
## GetRoyaltyInfoForTokenParams

 Represents the parameters for the "getRoyaltyInfoForToken" function.

`type GetRoyaltyInfoForTokenParams = {

tokenId: AbiParameterToPrimitiveType<{

name: "_tokenId";

type: "uint256";

 }>;

};

`

##### tokenId

`type tokenId = AbiParameterToPrimitiveType<{

name: "_tokenId";

type: "uint256";

}>;

`
## GetRoyaltyInfoForTokenParams

 Represents the parameters for the "getRoyaltyInfoForToken" function.

`type GetRoyaltyInfoForTokenParams = {

tokenId: AbiParameterToPrimitiveType<{

name: "_tokenId";

type: "uint256";

 }>;

};

`

##### tokenId

`type tokenId = AbiParameterToPrimitiveType<{

name: "_tokenId";

type: "uint256";

}>;

`
## GetRoyaltyInfoForTokenParams

 Represents the parameters for the "getRoyaltyInfoForToken" function.

`type GetRoyaltyInfoForTokenParams = {

tokenId: AbiParameterToPrimitiveType<{

name: "tokenId";

type: "uint256";

 }>;

};

`

##### tokenId

`type tokenId = AbiParameterToPrimitiveType<{

name: "tokenId";

type: "uint256";

}>;

`
## GetTokenCountOfBundleParams

 Represents the parameters for the "getTokenCountOfBundle" function.

`type GetTokenCountOfBundleParams = {

bundleId: AbiParameterToPrimitiveType<{

name: "_bundleId";

type: "uint256";

 }>;

};

`

##### bundleId

`type bundleId = AbiParameterToPrimitiveType<{

name: "_bundleId";

type: "uint256";

}>;

`
## GetTokenIdParams

 Represents the parameters for the "getTokenId" function.

`type GetTokenIdParams = {

localName: AbiParameterToPrimitiveType<{

name: "localName";

type: "string";

 }>;

};

`

##### localName

`type localName = AbiParameterToPrimitiveType<{

name: "localName";

type: "string";

}>;

`
## GetStoragePriceParams

`type GetStoragePriceParams = {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

disableCache?: boolean;

units?: bigint | number | string;

};

`

##### chain

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### disableCache

`type disableCache = boolean;

`

##### units

`type units = bigint | number | string;

`
## GetUniswapV3PoolParams

 Represents the parameters for the `findUniswapV3Pool` function.

`type GetUniswapV3PoolParams = { tokenA: Address; tokenB: Address };

`

##### tokenA

`type tokenA = Address;

`

##### tokenB

`type tokenB = Address;

`
## GetUniswapV3PoolResult

`type GetUniswapV3PoolResult = {

poolAddress: Address;

poolFee: (typeof UniswapFee)[keyof typeof UniswapFee];

};

`

##### poolAddress

`type poolAddress = Address;

`

##### poolFee

`type poolFee = (typeof UniswapFee)[keyof typeof UniswapFee];

`
## GetUsdRegistrationPriceParams

`type GetUsdRegistrationPriceParams = {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

disableCache?: boolean;

extraStorage?: bigint | number | string;

};

`

##### chain

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### disableCache

`type disableCache = boolean;

`

##### extraStorage

`type extraStorage = bigint | number | string;

`
## GetUsdStoragePriceParams

`type GetUsdStoragePriceParams = {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

disableCache?: boolean;

units?: bigint | number | string;

};

`

##### chain

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### disableCache

`type disableCache = boolean;

`

##### units

`type units = bigint | number | string;

`
## GetUserResult

`type GetUserResult = {

createdAt: string;

email?: string;

phone?: string;

profiles: Array<[Profile](https://portal.thirdweb.com/references/typescript/v5/Profile)>;

userId: string;

walletAddress: string;

};

`

##### createdAt

`type createdAt = string;

`

##### email

`type email = string;

`

##### phone

`type phone = string;

`

##### profiles

`type profiles = Array<[Profile](https://portal.thirdweb.com/references/typescript/v5/Profile)>;

`

##### userId

`type userId = string;

`

##### walletAddress

`type walletAddress = string;

`
## GetUserOpHashParams

 Represents the parameters for the "getUserOpHash" function.

`type GetUserOpHashParams = {

userOp: AbiParameterToPrimitiveType<{

components: [

 { name: "sender"; type: "address" },

 { name: "nonce"; type: "uint256" },

 { name: "initCode"; type: "bytes" },

 { name: "callData"; type: "bytes" },

 { name: "callGasLimit"; type: "uint256" },

 { name: "verificationGasLimit"; type: "uint256" },

 { name: "preVerificationGas"; type: "uint256" },

 { name: "maxFeePerGas"; type: "uint256" },

 { name: "maxPriorityFeePerGas"; type: "uint256" },

 { name: "paymasterAndData"; type: "bytes" },

 { name: "signature"; type: "bytes" },

 ];

name: "userOp";

type: "tuple";

 }>;

};

`

##### userOp

`type userOp = AbiParameterToPrimitiveType<{

components: [

 { name: "sender"; type: "address" },

 { name: "nonce"; type: "uint256" },

 { name: "initCode"; type: "bytes" },

 { name: "callData"; type: "bytes" },

 { name: "callGasLimit"; type: "uint256" },

 { name: "verificationGasLimit"; type: "uint256" },

 { name: "preVerificationGas"; type: "uint256" },

 { name: "maxFeePerGas"; type: "uint256" },

 { name: "maxPriorityFeePerGas"; type: "uint256" },

 { name: "paymasterAndData"; type: "bytes" },

 { name: "signature"; type: "bytes" },

 ];

name: "userOp";

type: "tuple";

}>;

`
## GetVotesParams

 Represents the parameters for the "getVotes" function.

`type GetVotesParams = {

account: AbiParameterToPrimitiveType<{

name: "account";

type: "address";

 }>;

blockNumber: AbiParameterToPrimitiveType<{

name: "blockNumber";

type: "uint256";

 }>;

};

`

##### account

`type account = AbiParameterToPrimitiveType<{

name: "account";

type: "address";

}>;

`

##### blockNumber

`type blockNumber = AbiParameterToPrimitiveType<{

name: "blockNumber";

type: "uint256";

}>;

`
## GetVotesWithParamsParams

 Represents the parameters for the "getVotesWithParams" function.

`type GetVotesWithParamsParams = {

account: AbiParameterToPrimitiveType<{

name: "account";

type: "address";

 }>;

blockNumber: AbiParameterToPrimitiveType<{

name: "blockNumber";

type: "uint256";

 }>;

params: AbiParameterToPrimitiveType<{

name: "params";

type: "bytes";

 }>;

};

`

##### account

`type account = AbiParameterToPrimitiveType<{

name: "account";

type: "address";

}>;

`

##### blockNumber

`type blockNumber = AbiParameterToPrimitiveType<{

name: "blockNumber";

type: "uint256";

}>;

`

##### params

`type params = AbiParameterToPrimitiveType<{

name: "params";

type: "bytes";

}>;

`
## GetWalletBalanceOptions

`type GetWalletBalanceOptions = {

address: string;

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

tokenAddress?: string;

};

`

##### address

`type address = string;

`

##### chain

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### tokenAddress

 (Optional) The address of the token to retrieve the balance for. If not provided, the balance of the native token will be retrieved.

`type tokenAddress = string;

`
## GrantMinterRoleParams

`type GrantMinterRoleParams = {

user: AbiParameterToPrimitiveType<{

internalType: "address";

name: "user";

type: "address";

 }>;

};

`

##### user

`type user = AbiParameterToPrimitiveType<{

internalType: "address";

name: "user";

type: "address";

}>;

`
## GrantRoleParams

`type GrantRoleParams = {

role: RoleInput;

targetAccountAddress: Address;

};

`

##### role

`type role = RoleInput;

`

##### targetAccountAddress

`type targetAccountAddress = Address;

`
## GrantRolesParams

 Represents the parameters for the "grantRoles" function.

`type GrantRolesParams = WithOverrides<{

roles: AbiParameterToPrimitiveType<{

name: "roles";

type: "uint256";

 }>;

user: AbiParameterToPrimitiveType<{

name: "user";

type: "address";

 }>;

}>;

`
## HasAllRolesParams

 Represents the parameters for the "hasAllRoles" function.

`type HasAllRolesParams = {

roles: AbiParameterToPrimitiveType<{

name: "roles";

type: "uint256";

 }>;

user: AbiParameterToPrimitiveType<{

name: "user";

type: "address";

 }>;

};

`

##### roles

`type roles = AbiParameterToPrimitiveType<{

name: "roles";

type: "uint256";

}>;

`

##### user

`type user = AbiParameterToPrimitiveType<{

name: "user";

type: "address";

}>;

`
## HasRoleParams

`type HasRoleParams = {

role: RoleInput;

targetAccountAddress: string;

};

`

##### role

`type role = RoleInput;

`

##### targetAccountAddress

`type targetAccountAddress = string;

`
## HasAnyRoleParams

 Represents the parameters for the "hasAnyRole" function.

`type HasAnyRoleParams = {

roles: AbiParameterToPrimitiveType<{

name: "roles";

type: "uint256";

 }>;

user: AbiParameterToPrimitiveType<{

name: "user";

type: "address";

 }>;

};

`

##### roles

`type roles = AbiParameterToPrimitiveType<{

name: "roles";

type: "uint256";

}>;

`

##### user

`type user = AbiParameterToPrimitiveType<{

name: "user";

type: "address";

}>;

`
## HasVotedParams

 Represents the parameters for the "hasVoted" function.

`type HasVotedParams = {

account: AbiParameterToPrimitiveType<{

name: "account";

type: "address";

 }>;

proposalId: AbiParameterToPrimitiveType<{

name: "proposalId";

type: "uint256";

 }>;

};

`

##### account

`type account = AbiParameterToPrimitiveType<{

name: "account";

type: "address";

}>;

`

##### proposalId

`type proposalId = AbiParameterToPrimitiveType<{

name: "proposalId";

type: "uint256";

}>;

`
## HashProposalParams

 Represents the parameters for the "hashProposal" function.

`type HashProposalParams = {

calldatas: AbiParameterToPrimitiveType<{

name: "calldatas";

type: "bytes[]";

 }>;

descriptionHash: AbiParameterToPrimitiveType<{

name: "descriptionHash";

type: "bytes32";

 }>;

targets: AbiParameterToPrimitiveType<{

name: "targets";

type: "address[]";

 }>;

values: AbiParameterToPrimitiveType<{

name: "values";

type: "uint256[]";

 }>;

};

`

##### calldatas

`type calldatas = AbiParameterToPrimitiveType<{

name: "calldatas";

type: "bytes[]";

}>;

`

##### descriptionHash

`type descriptionHash = AbiParameterToPrimitiveType<{

name: "descriptionHash";

type: "bytes32";

}>;

`

##### targets

`type targets = AbiParameterToPrimitiveType<{

name: "targets";

type: "address[]";

}>;

`

##### values

`type values = AbiParameterToPrimitiveType<{

name: "values";

type: "uint256[]";

}>;

`
## GetPublishedContractVersionsParams

 Represents the parameters for the "getPublishedContractVersions" function.

`type GetPublishedContractVersionsParams = {

contractId: AbiParameterToPrimitiveType<{

name: "contractId";

type: "string";

 }>;

publisher: AbiParameterToPrimitiveType<{

name: "publisher";

type: "address";

 }>;

};

`

##### contractId

`type contractId = AbiParameterToPrimitiveType<{

name: "contractId";

type: "string";

}>;

`

##### publisher

`type publisher = AbiParameterToPrimitiveType<{

name: "publisher";

type: "address";

}>;

`
## GetRegistrationPriceParams

`type GetRegistrationPriceParams = {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

disableCache?: boolean;

extraStorage?: bigint | number | string;

};

`

##### chain

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### disableCache

`type disableCache = boolean;

`

##### extraStorage

`type extraStorage = bigint | number | string;

`
## GetProfileIdAllowedToRecoverParams

 Represents the parameters for the "getProfileIdAllowedToRecover" function.

`type GetProfileIdAllowedToRecoverParams = {

followTokenId: AbiParameterToPrimitiveType<{

name: "followTokenId";

type: "uint256";

 }>;

};

`

##### followTokenId

`type followTokenId = AbiParameterToPrimitiveType<{

name: "followTokenId";

type: "uint256";

}>;

`
## IdOfParams

 Represents the parameters for the "idOf" function.

`type IdOfParams = {

owner: AbiParameterToPrimitiveType<{

name: "owner";

type: "address";

 }>;

};

`

##### owner

`type owner = AbiParameterToPrimitiveType<{

name: "owner";

type: "address";

}>;

`
## InAppWalletAutoConnectOptions

`type InAppWalletAutoConnectOptions = {

authResult?: AuthStoredTokenWithCookieReturnType;

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

};

`

##### authResult

`type authResult = AuthStoredTokenWithCookieReturnType;

`

##### chain

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`
## InAppWalletConnectionOptions

`type InAppWalletConnectionOptions = Prettify<

 ([MultiStepAuthArgsType](https://portal.thirdweb.com/references/typescript/v5/MultiStepAuthArgsType) | [SingleStepAuthArgsType](https://portal.thirdweb.com/references/typescript/v5/SingleStepAuthArgsType)) & {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

 }

>;

`
## InAppWalletCreationOptions

`type InAppWalletCreationOptions =

| {

auth?: {

defaultSmsCountryCode?: SupportedSmsCountry;

mode?: "popup" | "redirect" | "window";

options: Array<[InAppWalletAuth](https://portal.thirdweb.com/references/typescript/v5/InAppWalletAuth)>;

passkeyDomain?: string;

redirectUrl?: string;

 };

hidePrivateKeyExport?: boolean;

metadata?: {

image?: {

alt?: string;

height?: number;

src: string;

width?: number;

 };

 };

partnerId?: string;

smartAccount?: [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions);

storage?: [AsyncStorage](https://portal.thirdweb.com/references/typescript/v5/AsyncStorage);

 }

| undefined;

`
## InjectedConnectOptions

`type InjectedConnectOptions = {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

};

`

##### chain

 Optional chain to connect to.

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### client

 The Thirdweb client.

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`
## Input

`type Input = {

account?: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

contextFilter?: {

chains?: Array<[Chain](https://portal.thirdweb.com/references/typescript/v5/Chain)>;

contractAddresses?: Array<string>;

walletAddresses?: Array<string>;

 };

sessionId?: string;

} & (

| {

messages: Array<{

content: string;

role: "user" | "assistant";

 }>;

 }

| { message: string }

);

`
## InjectedSupportedWalletIds

`type InjectedSupportedWalletIds =

| "io.metamask"

| "com.trustwallet.app"

| "com.okex.wallet"

| "me.rainbow"

| "com.bybit"

| "pro.tokenpocket"

| "io.zerion.wallet"

| "com.robinhood.wallet"

| "com.crypto.wallet"

| "io.magiceden.wallet"

| "com.coinbase.wallet"

| "app.backpack"

| "app.phantom"

| "com.roninchain.wallet"

| "xyz.frontier.wallet"

| "com.coin98"

| "io.rabby"

| "io.loopring.wallet"

| "app.keplr"

| "com.brave.wallet"

| "com.coolbitx.cwsapp"

| "com.bifrostwallet"

| "so.onekey.app.wallet"

| "xyz.ctrl"

| "com.flowfoundation.wallet"

| "app.subwallet"

| "app.zeal"

| "xyz.roam.wallet"

| "com.meld.app"

| "com.moongate.one"

| "com.cryptokara"

| "com.blanqlabs.wallet"

| "tech.levain"

| "com.enkrypt"

| "com.scramble"

| "com.fastex.wallet"

| "com.dextrade"

| "com.hashpack.wallet"

| "com.mpcvault.broswerplugin"

| "one.mixin.messenger"

| "io.finoa"

| "xyz.nestwallet"

| "inc.tomo"

| "me.komet.app"

| "com.cryptnox"

| "com.elrond.maiar.wallet"

| "com.zypto"

| "com.walletconnect.com"

| "app.nightly"

| "nl.greenhood.wallet"

| "com.blazpay.wallet"

| "com.companyname.swaptobe"

| "io.getjoin.prd"

| "xyz.talisman"

| "co.family.wallet"

| "eu.flashsoft.clear-wallet"

| "app.berasig"

| "com.lootrush"

| "app.core.extension"

| "xyz.dawnwallet"

| "xyz.abs";

`
## InstallPublishedModuleOptions

`` type InstallPublishedModuleOptions = {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

constructorParams?: Record<string, unknown>;

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

moduleData?: `0x${string}`;

moduleName: string;

nonce?: number;

publisher?: string;

version?: string;

};

 ``

##### account

`type account = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### constructorParams

`type constructorParams = Record<string, unknown>;

`

##### contract

`type contract = [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

`

##### moduleData

`` type moduleData = `0x${string}`;

 ``

##### moduleName

`type moduleName = string;

`

##### nonce

`type nonce = number;

`

##### publisher

`type publisher = string;

`

##### version

`type version = string;

`
## IsAccountDeployedParams

 Represents the parameters for the "getAddress" function.

`type IsAccountDeployedParams = {

adminSigner: AbiParameterToPrimitiveType<{

name: "adminSigner";

type: "address";

 }>;

data: AbiParameterToPrimitiveType<{ name: "data"; type: "bytes" }>;

};

`

##### adminSigner

`type adminSigner = AbiParameterToPrimitiveType<{

name: "adminSigner";

type: "address";

}>;

`

##### data

`type data = AbiParameterToPrimitiveType<{

name: "data";

type: "bytes";

}>;

`
## IsApprovedForAllParams

 Represents the parameters for the "isApprovedForAll" function.

`type IsApprovedForAllParams = {

operator: AbiParameterToPrimitiveType<{

name: "operator";

type: "address";

 }>;

owner: AbiParameterToPrimitiveType<{

name: "owner";

type: "address";

 }>;

};

`

##### operator

`type operator = AbiParameterToPrimitiveType<{

name: "operator";

type: "address";

}>;

`

##### owner

`type owner = AbiParameterToPrimitiveType<{

name: "owner";

type: "address";

}>;

`
## InstallModuleParams

 Represents the parameters for the "installModule" function.

`type InstallModuleParams = WithOverrides<{

data: AbiParameterToPrimitiveType<{ name: "data"; type: "bytes" }>;

moduleContract: AbiParameterToPrimitiveType<{

name: "moduleContract";

type: "address";

 }>;

}>;

`
## IsActiveSignerParams

 Represents the parameters for the "isActiveSigner" function.

`type IsActiveSignerParams = {

signer: AbiParameterToPrimitiveType<{

name: "signer";

type: "address";

 }>;

};

`

##### signer

`type signer = AbiParameterToPrimitiveType<{

name: "signer";

type: "address";

}>;

`
## IsApprovedForAllParams

 Represents the parameters for the "isApprovedForAll" function.

`type IsApprovedForAllParams = {

operator: AbiParameterToPrimitiveType<{

name: "_operator";

type: "address";

 }>;

owner: AbiParameterToPrimitiveType<{

name: "_owner";

type: "address";

 }>;

};

`

##### operator

`type operator = AbiParameterToPrimitiveType<{

name: "_operator";

type: "address";

}>;

`

##### owner

`type owner = AbiParameterToPrimitiveType<{

name: "_owner";

type: "address";

}>;

`
## IsBuyerApprovedForListingParams

`type IsBuyerApprovedForListingParams = {

buyer: Address;

listingId: bigint;

};

`

##### buyer

`type buyer = Address;

`

##### listingId

`type listingId = bigint;

`
## IsClaimedParams

 Represents the parameters for the "isClaimed" function.

`type IsClaimedParams = {

receiver: AbiParameterToPrimitiveType<{

name: "_receiver";

type: "address";

 }>;

token: AbiParameterToPrimitiveType<{

name: "_token";

type: "address";

 }>;

tokenId: AbiParameterToPrimitiveType<{

name: "_tokenId";

type: "uint256";

 }>;

};

`

##### receiver

`type receiver = AbiParameterToPrimitiveType<{

name: "_receiver";

type: "address";

}>;

`

##### token

`type token = AbiParameterToPrimitiveType<{

name: "_token";

type: "address";

}>;

`

##### tokenId

`type tokenId = AbiParameterToPrimitiveType<{

name: "_tokenId";

type: "uint256";

}>;

`
## IsErc20CurrencyRegisteredParams

 Represents the parameters for the "isErc20CurrencyRegistered" function.

`type IsErc20CurrencyRegisteredParams = {

currencyAddress: AbiParameterToPrimitiveType<{

name: "currencyAddress";

type: "address";

 }>;

};

`

##### currencyAddress

`type currencyAddress = AbiParameterToPrimitiveType<{

name: "currencyAddress";

type: "address";

}>;

`
## IsModuleRegisteredAsParams

 Represents the parameters for the "isModuleRegisteredAs" function.

`type IsModuleRegisteredAsParams = {

moduleAddress: AbiParameterToPrimitiveType<{

name: "moduleAddress";

type: "address";

 }>;

moduleType: AbiParameterToPrimitiveType<{

name: "moduleType";

type: "uint256";

 }>;

};

`

##### moduleAddress

`type moduleAddress = AbiParameterToPrimitiveType<{

name: "moduleAddress";

type: "address";

}>;

`

##### moduleType

`type moduleType = AbiParameterToPrimitiveType<{

name: "moduleType";

type: "uint256";

}>;

`
## IsModuleRegisteredParams

 Represents the parameters for the "isModuleRegistered" function.

`type IsModuleRegisteredParams = {

moduleAddress: AbiParameterToPrimitiveType<{

name: "moduleAddress";

type: "address";

 }>;

};

`

##### moduleAddress

`type moduleAddress = AbiParameterToPrimitiveType<{

name: "moduleAddress";

type: "address";

}>;

`
## IsNewWinningBidParams

 Represents the parameters for the "isNewWinningBid" function.

`type IsNewWinningBidParams = {

auctionId: AbiParameterToPrimitiveType<{

name: "_auctionId";

type: "uint256";

 }>;

bidAmount: AbiParameterToPrimitiveType<{

name: "_bidAmount";

type: "uint256";

 }>;

};

`

##### auctionId

`type auctionId = AbiParameterToPrimitiveType<{

name: "_auctionId";

type: "uint256";

}>;

`

##### bidAmount

`type bidAmount = AbiParameterToPrimitiveType<{

name: "_bidAmount";

type: "uint256";

}>;

`
## IsFollowingParams

 Represents the parameters for the "isFollowing" function.

`type IsFollowingParams = {

followerProfileId: AbiParameterToPrimitiveType<{

name: "followerProfileId";

type: "uint256";

 }>;

};

`

##### followerProfileId

`type followerProfileId = AbiParameterToPrimitiveType<{

name: "followerProfileId";

type: "uint256";

}>;

`
## IsTransferEnabledForParams

 Represents the parameters for the "isTransferEnabledFor" function.

`type IsTransferEnabledForParams = {

target: AbiParameterToPrimitiveType<{

name: "target";

type: "address";

 }>;

};

`

##### target

`type target = AbiParameterToPrimitiveType<{

name: "target";

type: "address";

}>;

`
## IsTransferEnabledForParams

 Represents the parameters for the "isTransferEnabledFor" function.

`type IsTransferEnabledForParams = {

target: AbiParameterToPrimitiveType<{

name: "target";

type: "address";

 }>;

};

`

##### target

`type target = AbiParameterToPrimitiveType<{

name: "target";

type: "address";

}>;

`
## IsTransferEnabledForParams

 Represents the parameters for the "isTransferEnabledFor" function.

`type IsTransferEnabledForParams = {

target: AbiParameterToPrimitiveType<{

name: "target";

type: "address";

 }>;

};

`

##### target

`type target = AbiParameterToPrimitiveType<{

name: "target";

type: "address";

}>;

`
## JWTPayload

`type JWTPayload<Tctx = unknown> = {

aud: string;

ctx?: Tctx;

exp: number;

iat: number;

iss: string;

jti: string;

nbf: number;

sub: string;

};

`

##### aud

`type aud = string;

`

##### ctx

`type ctx = Tctx;

`

##### exp

`type exp = number;

`

##### iat

`type iat = number;

`

##### iss

`type iss = string;

`

##### jti

`type jti = string;

`

##### nbf

`type nbf = number;

`

##### sub

`type sub = string;

`
## JWTPayloadInput

`type JWTPayloadInput<Tctx = unknown> = {

aud: string;

ctx?: Tctx;

exp: Date;

iat: Date;

iss: string;

jti?: string;

nbf: Date;

sub: string;

};

`

##### aud

`type aud = string;

`

##### ctx

`type ctx = Tctx;

`

##### exp

`type exp = Date;

`

##### iat

`type iat = Date;

`

##### iss

`type iss = string;

`

##### jti

`type jti = string;

`

##### nbf

`type nbf = Date;

`

##### sub

`type sub = string;

`
## IsCurrencyApprovedForListingParams

 Represents the parameters for the "isCurrencyApprovedForListing" function.

`type IsCurrencyApprovedForListingParams = {

currency: AbiParameterToPrimitiveType<{

name: "_currency";

type: "address";

 }>;

listingId: AbiParameterToPrimitiveType<{

name: "_listingId";

type: "uint256";

 }>;

};

`

##### currency

`type currency = AbiParameterToPrimitiveType<{

name: "_currency";

type: "address";

}>;

`

##### listingId

`type listingId = AbiParameterToPrimitiveType<{

name: "_listingId";

type: "uint256";

}>;

`
## LazyMintParams

`type LazyMintParams = { nfts: Array<[NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput) | string> };

`

##### nfts

`type nfts = Array<[NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput) | string>;

`
## LazyMintParams

`type LazyMintParams = { nfts: Array<[NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput) | string> };

`

##### nfts

`type nfts = Array<[NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput) | string>;

`
## LensProfileSchema

`type LensProfileSchema = {

lens: {

appId?: string;

attributes: Array<MetadataAttribute>;

bio: string;

coverPicture: string;

id: string;

name: string;

picture: string;

 };

signature: string;

};

`

##### lens

`type lens = {

appId?: string;

attributes: Array<MetadataAttribute>;

bio: string;

coverPicture: string;

id: string;

name: string;

picture: string;

};

`

##### signature

`type signature = string;

`
## LensProfile

`type LensProfile = {

bio?: string;

coverPicture?: string;

name?: string;

picture?: string;

};

`

##### bio

`type bio = string;

`

##### coverPicture

`type coverPicture = string;

`

##### name

`type name = string;

`

##### picture

`type picture = string;

`
## LocaleId

`type LocaleId =

| "en_US"

| "es_ES"

| "ja_JP"

| "ko_KR"

| "tl_PH"

| "vi_VN"

| "de_DE"

| "fr_FR"

| "pt_BR";

`
## LoginPayload

`type LoginPayload = {

address: string;

chain_id?: string;

domain: string;

expiration_time: string;

invalid_before: string;

issued_at: string;

nonce: string;

resources?: Array<string>;

statement: string;

uri?: string;

version: string;

};

`

##### address

`type address = string;

`

##### chain\_id

`type chain_id = string;

`

##### domain

`type domain = string;

`

##### expiration\_time

`type expiration_time = string;

`

##### invalid\_before

`type invalid_before = string;

`

##### issued\_at

`type issued_at = string;

`

##### nonce

`type nonce = string;

`

##### resources

`type resources = Array<string>;

`

##### statement

`type statement = string;

`

##### uri

`type uri = string;

`

##### version

`type version = string;

`
## MarketplaceContractParams

`type MarketplaceContractParams = {

contractURI?: string;

defaultAdmin?: Address;

description?: string;

external_link?: string;

image?: FileOrBufferOrString;

name: string;

platformFeeBps?: number;

platformFeeRecipient?: string;

social_urls?: Record<string, string>;

trustedForwarders?: Array<string>;

};

`

##### contractURI

`type contractURI = string;

`

##### defaultAdmin

`type defaultAdmin = Address;

`

##### description

`type description = string;

`

##### external\_link

`type external_link = string;

`

##### image

`type image = FileOrBufferOrString;

`

##### name

`type name = string;

`

##### platformFeeBps

`type platformFeeBps = number;

`

##### platformFeeRecipient

`type platformFeeRecipient = string;

`

##### social\_urls

`type social_urls = Record<string, string>;

`

##### trustedForwarders

`type trustedForwarders = Array<string>;

`
## MakeOfferParams

`type MakeOfferParams = {

assetContractAddress: Address;

currencyContractAddress: Address;

offerExpiresAt: Date;

quantity?: bigint;

tokenId: bigint;

} & ({ totalOfferWei: bigint } | { totalOffer: string });

`
## MaxDepositParams

 Represents the parameters for the "maxDeposit" function.

`type MaxDepositParams = {

receiver: AbiParameterToPrimitiveType<{

name: "receiver";

type: "address";

 }>;

};

`

##### receiver

`type receiver = AbiParameterToPrimitiveType<{

name: "receiver";

type: "address";

}>;

`
## MaxMintParams

 Represents the parameters for the "maxMint" function.

`type MaxMintParams = {

receiver: AbiParameterToPrimitiveType<{

name: "receiver";

type: "address";

 }>;

};

`

##### receiver

`type receiver = AbiParameterToPrimitiveType<{

name: "receiver";

type: "address";

}>;

`
## MaxRedeemParams

 Represents the parameters for the "maxRedeem" function.

`type MaxRedeemParams = {

owner: AbiParameterToPrimitiveType<{

name: "owner";

type: "address";

 }>;

};

`

##### owner

`type owner = AbiParameterToPrimitiveType<{

name: "owner";

type: "address";

}>;

`
## MediaRenderer

##### Signature

`function MediaRenderer(

props: [MediaRendererProps](https://portal.thirdweb.com/references/typescript/v5/MediaRendererProps) & RefAttributes<HTMLMediaElement>,

): ReactNode;

`

### Parameters

##### props

 Refer to [MediaRendererProps](https://portal.thirdweb.com/references/typescript/v5/MediaRendererProps) to see the available props.

#### Type

`let props: [MediaRendererProps](https://portal.thirdweb.com/references/typescript/v5/MediaRendererProps) & RefAttributes<HTMLMediaElement>;

`

### Returns

##### Return Type

`let returnType: ReactNode;

`
## MaxWithdrawParams

 Represents the parameters for the "maxWithdraw" function.

`type MaxWithdrawParams = {

owner: AbiParameterToPrimitiveType<{

name: "owner";

type: "address";

 }>;

};

`

##### owner

`type owner = AbiParameterToPrimitiveType<{

name: "owner";

type: "address";

}>;

`
## MediaRendererProps

 Props taken by the for the [MediaRenderer](https://portal.thirdweb.com/references/typescript/v5/MediaRenderer) component

`type MediaRendererProps = {

alt?: string;

className?: string;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

controls?: HTMLVideoElement["controls"];

gatewayUrl?: string;

height?: string;

mimeType?: string;

poster?: string | null;

requireInteraction?: boolean;

src?: string | null;

style?: React.CSSProperties;

width?: string;

};

`

##### alt

 The [ alt](https://www.w3schools.com/tags/att%5Fimg%5Falt.asp) attributes provides alternative information for the media, if a user for some reason cannot view it due to slow connection, an error in the `src` attribute, or if the user is visually impaired.

 The default value is `""` .

`type alt = string;

`

##### className

 The className to apply on the rendered element to add custom styling.

`type className = string;

`

##### client

 A client is the entry point to the thirdweb SDK. It is required for all other actions. You can create a client using the `createThirdwebClient` function. Refer to the [ Creating a Client](https://portal.thirdweb.com/typescript/v5/client) documentation for more information.

 You must provide a `clientId` or `secretKey` in order to initialize a client. Pass `clientId` if you want for client-side usage and `secretKey` for server-side usage.

`import { createThirdwebClient } from "thirdweb";

const client = createThirdwebClient({

 clientId: "<your_client_id>",

});

`

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### controls

 Show the media controls (where applicable)

 By default it is set to `false`

`type controls = HTMLVideoElement["controls"];

`

##### gatewayUrl

 The IPFS gateway URL to use

`type gatewayUrl = string;

`

##### height

 The height of the rendered media.

 The default value is `auto` .

`type height = string;

`

##### mimeType

 Provide the [ MIME type](https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics%5Fof%5FHTTP/MIME%5Ftypes) of the media if it is known

`type mimeType = string;

`

##### poster

 The [ poster](https://www.w3schools.com/tags/att%5Fvideo%5Fposter.asp) is the image that is shown before the video is played.

 The default value is the first frame of the video.

 If the `src` is not a video, this prop is ignored.

`type poster = string | null;

`

##### requireInteraction

 Require user interaction to play the media (i.e. disable autoplay).

 The default value is `false` .

`type requireInteraction = boolean;

`

##### src

 the `src` attribute specifies the URL of the media.

 This can be an IPFS URI or HTTP URL that points to media

`type src = string | null;

`

##### style

 The style to apply on the rendered element to add custom styling.

`type style = React.CSSProperties;

`

##### width

 The width of the rendered media.

 The default value is `auto` .

`type width = string;

`
## MintAdditionalSupplyToParams

`type MintAdditionalSupplyToParams = {

supply: bigint;

to: string;

tokenId: bigint;

};

`

##### supply

`type supply = bigint;

`

##### to

`type to = string;

`

##### tokenId

`type tokenId = bigint;

`
## MintTimestampOfFollowNFTParams

 Represents the parameters for the "mintTimestampOf" function.

`type MintTimestampOfFollowNFTParams = {

tokenId: AbiParameterToPrimitiveType<{

name: "tokenId";

type: "uint256";

 }>;

};

`

##### tokenId

`type tokenId = AbiParameterToPrimitiveType<{

name: "tokenId";

type: "uint256";

}>;

`
## MintParams

 Represents the parameters for the "mint" function.

`type MintParams = WithOverrides<{

receiver: AbiParameterToPrimitiveType<{

name: "receiver";

type: "address";

 }>;

shares: AbiParameterToPrimitiveType<{

name: "shares";

type: "uint256";

 }>;

}>;

`
## MintTimestampOfParams

 Represents the parameters for the "mintTimestampOf" function.

`type MintTimestampOfParams = {

tokenId: AbiParameterToPrimitiveType<{

name: "tokenId";

type: "uint256";

 }>;

};

`

##### tokenId

`type tokenId = AbiParameterToPrimitiveType<{

name: "tokenId";

type: "uint256";

}>;

`
## MintToBatchParams

`type MintToBatchParams = WithOverrides<{

nfts: Array<{ metadata: [NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput) | string; supply: bigint }>;

to: string;

}>;

`
## MintToParams

`type MintToParams = WithOverrides<{

nft: [NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput) | string;

supply: bigint;

to: string;

}>;

`
## MintToParams

 Represents the parameters for the `mintTo` function.

`type MintToParams = Prettify<

WithOverrides<

 { to: string } & (

| { amount: number | string }

| { amountWei: bigint }

 )

 >

>;

`
## ModuleInstallData

`type ModuleInstallData = { data: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex); module: [Address](https://portal.thirdweb.com/references/typescript/v5/Address) };

`

##### data

`type data = [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

`

##### module

`type module = [Address](https://portal.thirdweb.com/references/typescript/v5/Address);

`
## ModularContractParams

`type ModularContractParams = {

contractURI?: string;

defaultAdmin?: string;

description?: string;

external_link?: string;

image?: FileOrBufferOrString;

name: string;

social_urls?: Record<string, string>;

symbol?: string;

};

`

##### contractURI

`type contractURI = string;

`

##### defaultAdmin

`type defaultAdmin = string;

`

##### description

`type description = string;

`

##### external\_link

`type external_link = string;

`

##### image

`type image = FileOrBufferOrString;

`

##### name

`type name = string;

`

##### social\_urls

`type social_urls = Record<string, string>;

`

##### symbol

`type symbol = string;

`
## ModuleInstaller

`type ModuleInstaller = (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<[ModuleInstallData](https://portal.thirdweb.com/references/typescript/v5/ModuleInstallData)>;

`
## NFT

`type NFT =

| {

id: bigint;

metadata: [NFTMetadata](https://portal.thirdweb.com/references/typescript/v5/NFTMetadata);

owner: string | null;

tokenURI: string;

type: "ERC721";

 }

| {

id: bigint;

metadata: [NFTMetadata](https://portal.thirdweb.com/references/typescript/v5/NFTMetadata);

owner: string | null;

supply: bigint;

tokenURI: string;

type: "ERC1155";

 };

`
## MulticallParams

 Represents the parameters for the "multicall" function.

`type MulticallParams = WithOverrides<{

data: AbiParameterToPrimitiveType<{

name: "data";

type: "bytes[]";

 }>;

}>;

`
## NFTInput

 Represents the input data for creating an NFT (Non-Fungible Token).

`type NFTInput = Prettify<

 {

animation_url?: FileOrBufferOrString;

background_color?: string;

description?: string;

external_url?: FileOrBufferOrString;

image?: FileOrBufferOrString;

name?: string;

properties?:

| Record<string, unknown>

| Array<Record<string, unknown>>;

 } & Record<string, unknown>

>;

`
## NFTMedia

 This component fetches and displays an NFT's media. It uses thirdweb [MediaRenderer](https://portal.thirdweb.com/refernces/typescript/v5/MediaRenderer) under the hood so you can style it just like how you would style a MediaRenderer.

### Example

####  Basic usage

`import { NFTProvider, NFTMedia } from "thirdweb/react";

<NFTProvider>

 <NFTMedia />

</NFTProvider>;

`

####  Show a loading sign while the media is being fetched

`import { NFTProvider, NFTMedia } from "thirdweb/react";

<NFTProvider>

 <NFTMedia loadingComponent={<YourLoadingSign />} />

</NFTProvider>;

`

####  Show something in case the media failed to resolve

`import { NFTProvider, NFTMedia } from "thirdweb/react";

<NFTProvider>

 <NFTMedia fallbackComponent={<span>Failed to load media</span>} />

</NFTProvider>;

`

####  Custom query options for useQuery (tanstack-query)

`import { NFTProvider, NFTMedia } from "thirdweb/react";

<NFTProvider>

 <NFTMedia queryOptions={{ retry: 3, enabled: false }} />

</NFTProvider>;

`

####  Basic stylings

 You can style NFTMedia with the `style` and `className` props.

`<NFTMedia style={{ borderRadius: "8px" }} className="mx-auto" />;

`

####  Override the media with the `mediaResolver` prop

 If you already have the url, you can skip the network requests and pass it directly to the NFTMedia

`<NFTMedia

mediaResolver={{

 src: "/cat_video.mp4",

// Poster is applicable to medias that are videos and audios

 poster: "/cat-image.png",

 }}

/>;

`

 You can also pass in your own custom (async) function that retrieves the media url

`const getMedia = async () => {

const url = getNFTMedia(props);

return url;

};

<NFTMedia mediaResolver={getMedia} />;

`

##### Signature

`function NFTMedia(__namedParameters: [NFTMediaProps](https://portal.thirdweb.com/references/typescript/v5/NFTMediaProps)): null | Element;

`

### Parameters

##### \_\_namedParameters

#### Type

`let __namedParameters: Omit<

[MediaRendererProps](https://portal.thirdweb.com/references/typescript/v5/MediaRendererProps),

"src" | "poster" | "client"

> & {

fallbackComponent?: JSX.Element;

loadingComponent?: JSX.Element;

mediaResolver?:

| [NFTMediaInfo](https://portal.thirdweb.com/references/typescript/v5/NFTMediaInfo)

| (() => [NFTMediaInfo](https://portal.thirdweb.com/references/typescript/v5/NFTMediaInfo))

| (() => Promise<[NFTMediaInfo](https://portal.thirdweb.com/references/typescript/v5/NFTMediaInfo)>);

queryOptions?: Omit<

UseQueryOptions<[NFTMediaInfo](https://portal.thirdweb.com/references/typescript/v5/NFTMediaInfo)>,

"queryFn" | "queryKey"

 >;

};

`

### Returns

##### Return Type

`let returnType: null | Element;

`

 A MediaRenderer component
## NFTMediaInfo

`type NFTMediaInfo = { poster: string | undefined; src: string };

`

##### poster

`type poster = string | undefined;

`

##### src

`type src = string;

`
## NFTMintParams

`type NFTMintParams = { nfts: Array<[NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput) | string>; to: string };

`

##### nfts

`type nfts = Array<[NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput) | string>;

`

##### to

`type to = string;

`
## NFTMediaProps

`type NFTMediaProps = Omit<

[MediaRendererProps](https://portal.thirdweb.com/references/typescript/v5/MediaRendererProps),

"src" | "poster" | "client"

> & {

fallbackComponent?: JSX.Element;

loadingComponent?: JSX.Element;

mediaResolver?:

| [NFTMediaInfo](https://portal.thirdweb.com/references/typescript/v5/NFTMediaInfo)

| (() => [NFTMediaInfo](https://portal.thirdweb.com/references/typescript/v5/NFTMediaInfo))

| (() => Promise<[NFTMediaInfo](https://portal.thirdweb.com/references/typescript/v5/NFTMediaInfo)>);

queryOptions?: Omit<

UseQueryOptions<[NFTMediaInfo](https://portal.thirdweb.com/references/typescript/v5/NFTMediaInfo)>,

"queryFn" | "queryKey"

 >;

};

`
## NFTMetadata

`type NFTMetadata = {

animation_url?: string;

attributes?: Record<string, unknown>;

background_color?: string;

description?: string;

external_url?: string;

image?: string;

image_url?: string;

name?: string;

properties?: Record<string, unknown>;

uri: string;

} & Record<string, unknown>;

`
## NFTProviderProps

 Props for the `<NFT>` component

`type NFTProviderProps = {

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

tokenId: bigint;

};

`

##### contract

 The NFT contract address. Accepts both ERC721 and ERC1155 contracts

`type contract = [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

`

##### tokenId

 The tokenId whose info you want to display

`type tokenId = bigint;

`
## NFTProvider

 A React context provider component that supplies NFT-related data to its child components.

 This component serves as a wrapper around the `NFTProviderContext.Provider` and passes the provided NFT data down to all of its child components through the context API.

### Example

`import { getContract } from "thirdweb";

import {

 NFTProvider,

 NFTMedia,

 NFTDescription,

 NFTName,

} from "thirdweb/react";

const contract = getContract({

 address: "0x...",

 chain: ethereum,

 client: yourThirdwebClient,

});

<NFTProvider contract={contract} tokenId={0n}>

 <NFTMedia />

 <NFTDescription />

 <NFTName />

</NFTProvider>;

`

##### Signature

`function NFTProvider(

props: PropsWithChildren<[NFTProviderProps](https://portal.thirdweb.com/references/typescript/v5/NFTProviderProps)>,

): Element;

`

### Parameters

##### props

 The props for the NFT provider

#### Type

`let props: PropsWithChildren<[NFTProviderProps](https://portal.thirdweb.com/references/typescript/v5/NFTProviderProps)>;

`

### Returns

##### Return Type

`let returnType: Element;

`
## NamehashParams

 Represents the parameters for the "namehash" function.

`type NamehashParams = {

labels: AbiParameterToPrimitiveType<{

name: "labels";

type: "string[]";

 }>;

};

`

##### labels

`type labels = AbiParameterToPrimitiveType<{

name: "labels";

type: "string[]";

}>;

`
## NewAuctionEventFilters

 Represents the filters for the "NewAuction" event.

`type NewAuctionEventFilters = Partial<{

assetContract: AbiParameterToPrimitiveType<{

indexed: true;

name: "assetContract";

type: "address";

 }>;

auctionCreator: AbiParameterToPrimitiveType<{

indexed: true;

name: "auctionCreator";

type: "address";

 }>;

auctionId: AbiParameterToPrimitiveType<{

indexed: true;

name: "auctionId";

type: "uint256";

 }>;

}>;

`
## NetworkSelectorProps

`type NetworkSelectorProps = {

onCustomClick?: () => void;

onSwitch?: (chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain)) => void;

popularChainIds?: Array<number>;

recentChainIds?: Array<number>;

renderChain?: React.FC<NetworkSelectorChainProps>;

sections?: Array<ChainSection>;

};

`

##### onCustomClick

##### Signature

`function onCustomClick(): void;

`

##### Returns

##### Return Type

`let returnType: void;

`

##### onSwitch

##### Signature

`function onSwitch(chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain)): void;

`

##### Parameters

##### chain

 The `Chain` of the chain that was switched to

###### Type

`let chain: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`

##### Returns

##### Return Type

`let returnType: void;

`

##### popularChainIds

Deprecated

 Use `sections` prop instead

 If `sections` prop is provided, this prop will be ignored

 Chains to be displayed as "Popular"

`type popularChainIds = Array<number>;

`

##### recentChainIds

Deprecated

 Use `sections` prop instead

 If `sections` prop is provided, this prop will be ignored

 Chains to be displayed as "Recent"

`type recentChainIds = Array<number>;

`

##### renderChain

 Override how the chain button is rendered in the Modal

`type renderChain = React.FC<NetworkSelectorChainProps>;

`

##### sections

 Specify sections of chains to be displayed in the Network Selector Modal

`type sections = Array<ChainSection>;

`

### Example

 To display "Polygon", "Avalanche" chains under "Recently used" section and "Ethereum", "Arbitrum" chains under "Popular" section, you can set the prop with the following value

`import { arbitrum, base, ethereum, polygon } from "thirdweb/chains";

const sections = [

 { label: "Recently used", chains: [arbitrum, polygon] },

 { label: "Popular", chains: [base, ethereum] },

];

`
## NewBidEventFilters

 Represents the filters for the "NewBid" event.

`type NewBidEventFilters = Partial<{

assetContract: AbiParameterToPrimitiveType<{

indexed: true;

name: "assetContract";

type: "address";

 }>;

auctionId: AbiParameterToPrimitiveType<{

indexed: true;

name: "auctionId";

type: "uint256";

 }>;

bidder: AbiParameterToPrimitiveType<{

indexed: true;

name: "bidder";

type: "address";

 }>;

}>;

`
## NewListingEventFilters

 Represents the filters for the "NewListing" event.

`type NewListingEventFilters = Partial<{

assetContract: AbiParameterToPrimitiveType<{

indexed: true;

name: "assetContract";

type: "address";

 }>;

listingCreator: AbiParameterToPrimitiveType<{

indexed: true;

name: "listingCreator";

type: "address";

 }>;

listingId: AbiParameterToPrimitiveType<{

indexed: true;

name: "listingId";

type: "uint256";

 }>;

}>;

`
## NewOfferEventFilters

 Represents the filters for the "NewOffer" event.

`type NewOfferEventFilters = Partial<{

assetContract: AbiParameterToPrimitiveType<{

indexed: true;

name: "assetContract";

type: "address";

 }>;

offerId: AbiParameterToPrimitiveType<{

indexed: true;

name: "offerId";

type: "uint256";

 }>;

offeror: AbiParameterToPrimitiveType<{

indexed: true;

name: "offeror";

type: "address";

 }>;

}>;

`
## NewSaleEventFilters

 Represents the filters for the "NewSale" event.

`type NewSaleEventFilters = Partial<{

assetContract: AbiParameterToPrimitiveType<{

indexed: true;

name: "assetContract";

type: "address";

 }>;

listingCreator: AbiParameterToPrimitiveType<{

indexed: true;

name: "listingCreator";

type: "address";

 }>;

listingId: AbiParameterToPrimitiveType<{

indexed: true;

name: "listingId";

type: "uint256";

 }>;

}>;

`
## NoncesParams

 Represents the parameters for the "nonces" function.

`type NoncesParams = {

signer: AbiParameterToPrimitiveType<{

name: "signer";

type: "address";

 }>;

};

`

##### signer

`type signer = AbiParameterToPrimitiveType<{

name: "signer";

type: "address";

}>;

`
## OpenPackParams

 Represents the parameters for the "openPack" function.

`type OpenPackParams = WithOverrides<{

amountToOpen: AbiParameterToPrimitiveType<{

name: "amountToOpen";

type: "uint256";

 }>;

packId: AbiParameterToPrimitiveType<{

name: "packId";

type: "uint256";

 }>;

}>;

`
## OpenPackParams

 Represents the parameters for the "openPack" function.

`type OpenPackParams = WithOverrides<{

amountToOpen: AbiParameterToPrimitiveType<{

name: "amountToOpen";

type: "uint256";

 }>;

packId: AbiParameterToPrimitiveType<{

name: "packId";

type: "uint256";

 }>;

}>;

`
## Offer

`type Offer = {

asset: [NFT](https://portal.thirdweb.com/references/typescript/v5/NFT);

assetContractAddress: Address;

currencyContractAddress: Address;

currencyValue: [GetBalanceResult](https://portal.thirdweb.com/references/typescript/v5/GetBalanceResult);

endTimeInSeconds: bigint;

id: bigint;

offerorAddress: Address;

quantity: bigint;

status: ListingStatus;

tokenId: bigint;

totalPrice: bigint;

};

`

##### asset

`type asset = [NFT](https://portal.thirdweb.com/references/typescript/v5/NFT);

`

##### assetContractAddress

`type assetContractAddress = Address;

`

##### currencyContractAddress

`type currencyContractAddress = Address;

`

##### currencyValue

`type currencyValue = [GetBalanceResult](https://portal.thirdweb.com/references/typescript/v5/GetBalanceResult);

`

##### endTimeInSeconds

`type endTimeInSeconds = bigint;

`

##### id

`type id = bigint;

`

##### offerorAddress

`type offerorAddress = Address;

`

##### quantity

`type quantity = bigint;

`

##### status

`type status = ListingStatus;

`

##### tokenId

`type tokenId = bigint;

`

##### totalPrice

`type totalPrice = bigint;

`
## OpenZeppelinOptions

`type OpenZeppelinOptions = {

domainName?: string;

domainSeparatorVersion?: string;

domainVersion?: string;

experimentalChainlessSupport?: boolean;

provider: "openzeppelin";

relayerForwarderAddress: Address;

relayerUrl: string;

};

`

##### domainName

`type domainName = string;

`

##### domainSeparatorVersion

`type domainSeparatorVersion = string;

`

##### domainVersion

`type domainVersion = string;

`

##### experimentalChainlessSupport

`type experimentalChainlessSupport = boolean;

`

##### provider

`type provider = "openzeppelin";

`

##### relayerForwarderAddress

`type relayerForwarderAddress = Address;

`

##### relayerUrl

`type relayerUrl = string;

`
## Output

`type Output = {

message: string;

sessionId: string;

transactions: Array<[PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)>;

};

`

##### message

`type message = string;

`

##### sessionId

`type sessionId = string;

`

##### transactions

`type transactions = Array<[PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)>;

`
## OwnerUpdatedEventFilters

 Represents the filters for the "OwnerUpdated" event.

`type OwnerUpdatedEventFilters = Partial<{

newOwner: AbiParameterToPrimitiveType<{

indexed: true;

name: "newOwner";

type: "address";

 }>;

prevOwner: AbiParameterToPrimitiveType<{

indexed: true;

name: "prevOwner";

type: "address";

 }>;

}>;

`
## OwnershipHandoverExpiresAtParams

 Represents the parameters for the "ownershipHandoverExpiresAt" function.

`type OwnershipHandoverExpiresAtParams = {

pendingOwner: AbiParameterToPrimitiveType<{

name: "pendingOwner";

type: "address";

 }>;

};

`

##### pendingOwner

`type pendingOwner = AbiParameterToPrimitiveType<{

name: "pendingOwner";

type: "address";

}>;

`
## PACK\_TOKEN\_TYPE

`enum PACK_TOKEN_TYPE {

ERC1155,

ERC20,

ERC721,

}

`

#### ERC1155

`2;

`

#### ERC20

`0;

`

#### ERC721

`1;

`
## PackContractParams

`type PackContractParams = {

contractURI?: string;

defaultAdmin?: string;

description?: string;

external_link?: string;

image?: FileOrBufferOrString;

name: string;

royaltyBps?: number | string;

royaltyRecipient?: string;

social_urls?: Record<string, string>;

symbol?: string;

trustedForwarders?: Array<string>;

};

`

##### contractURI

`type contractURI = string;

`

##### defaultAdmin

 Defaults to the deployer's address

`type defaultAdmin = string;

`

##### description

`type description = string;

`

##### external\_link

`type external_link = string;

`

##### image

`type image = FileOrBufferOrString;

`

##### name

 Name of the Pack contract

`type name = string;

`

##### royaltyBps

 Defaults to 0 (zero)

`type royaltyBps = number | string;

`

##### royaltyRecipient

 Defaults to the deployer's address

`type royaltyRecipient = string;

`

##### social\_urls

`type social_urls = Record<string, string>;

`

##### symbol

 Defaults to an empty string ("")

`type symbol = string;

`

##### trustedForwarders

`type trustedForwarders = Array<string>;

`
## PackCreatedEventFilters

 Represents the filters for the "PackCreated" event.

`type PackCreatedEventFilters = Partial<{

packId: AbiParameterToPrimitiveType<{

indexed: true;

name: "packId";

type: "uint256";

 }>;

}>;

`
## PackCreatedEventFilters

 Represents the filters for the "PackCreated" event.

`type PackCreatedEventFilters = Partial<{

packId: AbiParameterToPrimitiveType<{

indexed: true;

name: "packId";

type: "uint256";

 }>;

}>;

`
## PackOpenedEventFilters

 Represents the filters for the "PackOpened" event.

`type PackOpenedEventFilters = Partial<{

opener: AbiParameterToPrimitiveType<{

indexed: true;

name: "opener";

type: "address";

 }>;

packId: AbiParameterToPrimitiveType<{

indexed: true;

name: "packId";

type: "uint256";

 }>;

}>;

`
## PackUpdatedEventFilters

 Represents the filters for the "PackUpdated" event.

`type PackUpdatedEventFilters = Partial<{

packId: AbiParameterToPrimitiveType<{

indexed: true;

name: "packId";

type: "uint256";

 }>;

}>;

`
## PackOpenedEventFilters

 Represents the filters for the "PackOpened" event.

`type PackOpenedEventFilters = Partial<{

opener: AbiParameterToPrimitiveType<{

indexed: true;

name: "opener";

type: "address";

 }>;

packId: AbiParameterToPrimitiveType<{

indexed: true;

name: "packId";

type: "uint256";

 }>;

}>;

`
## PackUpdatedEventFilters

 Represents the filters for the "PackUpdated" event.

`type PackUpdatedEventFilters = Partial<{

packId: AbiParameterToPrimitiveType<{

indexed: true;

name: "packId";

type: "uint256";

 }>;

}>;

`
## ParseEventLogsOptions

`type ParseEventLogsOptions<

abiEvents extends Array<[PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<AbiEvent>>,

TStrict extends boolean,

> = {

events: abiEvents;

logs: Array<Log | RpcLog>;

strict?: TStrict;

};

`

##### events

`type events = abiEvents;

`

##### logs

`type logs = Array<Log | RpcLog>;

`

##### strict

`type strict = TStrict;

`
## ParseAvatarOptions

`type ParseAvatarOptions = { client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient); uri: string };

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### uri

`type uri = string;

`
## ParseEventLogsResult

`type ParseEventLogsResult<

abiEvents extends Array<[PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<AbiEvent>>,

TStrict extends boolean,

abiEvent extends AbiEvent = abiEvents[number]["abiEvent"],

> = Array<

Log<bigint, number, false, undefined, TStrict, Array<abiEvent>>

>;

`
## OwnerOfParams

 Represents the parameters for the "ownerOf" function.

`type OwnerOfParams = {

tokenId: AbiParameterToPrimitiveType<{

name: "tokenId";

type: "uint256";

 }>;

};

`

##### tokenId

`type tokenId = AbiParameterToPrimitiveType<{

name: "tokenId";

type: "uint256";

}>;

`
## PayEmbedConnectOptions

 Connection options for the `PayEmbed` component

`type PayEmbedConnectOptions = {

accountAbstraction?: [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions);

appMetadata?: AppMetadata;

auth?: [SiweAuthOptions](https://portal.thirdweb.com/references/typescript/v5/SiweAuthOptions);

autoConnect?: { timeout: number } | boolean;

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

chains?: Array<[Chain](https://portal.thirdweb.com/references/typescript/v5/Chain)>;

connectModal?: [ConnectButton_connectModalOptions](https://portal.thirdweb.com/references/typescript/v5/ConnectButton%5FconnectModalOptions);

recommendedWallets?: Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

showAllWallets?: boolean;

walletConnect?: { projectId?: string };

wallets?: Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

};

`

### Example

`<PayEmbed

client={client}

connectOptions={{

 connectModal: {

 size: "compact",

 title: "Sign in",

 },

 }}

/>;

`

##### accountAbstraction

 Enable Account abstraction for all wallets. This will connect to the users's smart account based on the connected personal wallet and the given options.

 This allows to sponsor gas fees for your user's transaction using the thirdweb account abstraction infrastructure.

`type accountAbstraction = [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions);

`

##### appMetadata

 Metadata of the app that will be passed to connected wallet. Setting this is highly recommended.

`type appMetadata = AppMetadata;

`

##### auth

 Enable SIWE (Sign in with Ethererum) by passing an object of type `SiweAuthOptions` to enforce the users to sign a message after connecting their wallet to authenticate themselves.

 Refer to the [SiweAuthOptions](https://portal.thirdweb.com/references/typescript/v5/SiweAuthOptions) for more details

`type auth = [SiweAuthOptions](https://portal.thirdweb.com/references/typescript/v5/SiweAuthOptions);

`

##### autoConnect

 When the user has connected their wallet to your site, this configuration determines whether or not you want to automatically connect to the last connected wallet when user visits your site again in the future.

 By default it is set to `{ timeout: 15000 }` meaning that autoConnect is enabled and if the autoConnection does not succeed within 15 seconds, it will be cancelled.

 If you want to disable autoConnect, set this prop to `false` .

 If you want to customize the timeout, you can assign an object with a `timeout` key to this prop.

`type autoConnect = { timeout: number } | boolean;

`

##### chain

 The [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain) object of the blockchain you want the wallet to connect to

 If a `chain` is not specified, Wallet will be connected to whatever is the default set in the wallet.

 If a `chain` is specified, Wallet will be prompted to switch to given chain after connection if it is not already connected to it. This ensures that the wallet is connected to the correct blockchain before interacting with your app.

 The `ConnectButton` also shows a "Switch Network" button until the wallet is connected to the specified chain. Clicking on the "Switch Network" button triggers the wallet to switch to the specified chain.

 You can create a `Chain` object using the [defineChain](https://portal.thirdweb.com/references/typescript/v5/defineChain) function. At minimum, you need to pass the `id` of the blockchain to `defineChain` function to create a `Chain` object.

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### chains

 Array of chains that your app supports.

 This is only relevant if your app is a multi-chain app and works across multiple blockchains. If your app only works on a single blockchain, you should only specify the `chain` prop.

 Given list of chains will used in various ways:

* They will be displayed in the network selector in the `ConnectButton` 's details modal post connection
* They will be sent to wallet at the time of connection if the wallet supports requesting multiple chains ( example: WalletConnect ) so that users can switch between the chains post connection easily

 You can create a `Chain` object using the [defineChain](https://portal.thirdweb.com/references/typescript/v5/defineChain) function. At minimum, you need to pass the `id` of the blockchain to `defineChain` function to create a `Chain` object.

`import { defineChain } from "thirdweb/react";

const polygon = defineChain({

 id: 137,

});

`

`type chains = Array<[Chain](https://portal.thirdweb.com/references/typescript/v5/Chain)>;

`

##### connectModal

 Configurations for the `ConnectButton` 's Modal that is shown for connecting a wallet Refer to the [ConnectButton\_connectModalOptions](https://portal.thirdweb.com/references/typescript/v5/ConnectButton%5FconnectModalOptions) type for more details

`type connectModal = [ConnectButton_connectModalOptions](https://portal.thirdweb.com/references/typescript/v5/ConnectButton%5FconnectModalOptions);

`

##### recommendedWallets

 Wallets to show as recommended in the `ConnectButton` 's Modal

`type recommendedWallets = Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

`

##### showAllWallets

 By default, ConnectButton modal shows a "All Wallets" button that shows a list of 500+ wallets.

 You can disable this button by setting `showAllWallets` prop to `false`

`type showAllWallets = boolean;

`

##### walletConnect

 Configure options for WalletConnect

 By default WalletConnect uses the thirdweb's default project id. Setting your own project id is recommended.

 You can create a project id by signing up on [ walletconnect.com](https://walletconnect.com/)

`type walletConnect = { projectId?: string };

`

##### wallets

 Array of wallets to show in Connect Modal. If not provided, default wallets will be used.

`type wallets = Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

`
## PayEmbedProps

 Props of [PayEmbed](https://portal.thirdweb.com/references/typescript/v5/PayEmbed) component

`type PayEmbedProps = {

activeWallet?: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

className?: string;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

connectOptions?: [PayEmbedConnectOptions](https://portal.thirdweb.com/references/typescript/v5/PayEmbedConnectOptions);

hiddenWallets?: Array<[WalletId](https://portal.thirdweb.com/references/typescript/v5/WalletId)>;

locale?: [LocaleId](https://portal.thirdweb.com/references/typescript/v5/LocaleId);

payOptions?: [PayUIOptions](https://portal.thirdweb.com/references/typescript/v5/PayUIOptions);

style?: React.CSSProperties;

supportedTokens?: [SupportedTokens](https://portal.thirdweb.com/references/typescript/v5/SupportedTokens);

theme?: "light" | "dark" | [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme);

};

`

##### activeWallet

 The wallet that should be pre-selected in the PayEmbed UI.

`type activeWallet = [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

`

##### className

`type className = string;

`

##### client

 A client is the entry point to the thirdweb SDK. It is required for all other actions. You can create a client using the `createThirdwebClient` function. Refer to the [ Creating a Client](https://portal.thirdweb.com/typescript/v5/client) documentation for more information.

 You must provide a `clientId` or `secretKey` in order to initialize a client. Pass `clientId` if you want for client-side usage and `secretKey` for server-side usage.

`import { createThirdwebClient } from "thirdweb";

const client = createThirdwebClient({

 clientId: "<your_client_id>",

});

`

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### connectOptions

 Customize the options for "Connect" Button showing in the PayEmbed UI when the user is not connected to a wallet.

 Refer to the [PayEmbedConnectOptions](https://portal.thirdweb.com/references/typescript/v5/PayEmbedConnectOptions) type for more details.

`type connectOptions = [PayEmbedConnectOptions](https://portal.thirdweb.com/references/typescript/v5/PayEmbedConnectOptions);

`

##### hiddenWallets

 All wallet IDs included in this array will be hidden from wallet selection when connected.

`type hiddenWallets = Array<[WalletId](https://portal.thirdweb.com/references/typescript/v5/WalletId)>;

`

##### locale

 By default - ConnectButton UI uses the `en-US` locale for english language users.

 You can customize the language used in the ConnectButton UI by setting the `locale` prop.

 Refer to the [LocaleId](https://portal.thirdweb.com/references/typescript/v5/LocaleId) type for supported locales.

`type locale = [LocaleId](https://portal.thirdweb.com/references/typescript/v5/LocaleId);

`

##### payOptions

 Customize the Pay UI options. Refer to the [PayUIOptions](https://portal.thirdweb.com/references/typescript/v5/PayUIOptions) type for more details.

`type payOptions = [PayUIOptions](https://portal.thirdweb.com/references/typescript/v5/PayUIOptions);

`

##### style

`type style = React.CSSProperties;

`

##### supportedTokens

 Override the default tokens shown in PayEmbed UI By default, PayEmbed shows a few popular tokens for Pay supported chains

`type supportedTokens = [SupportedTokens](https://portal.thirdweb.com/references/typescript/v5/SupportedTokens);

`

### Example

`supportedTokens` prop allows you to override this list as shown below.

`import { PayEmbed } from "thirdweb/react";

import { NATIVE_TOKEN_ADDRESS } from "thirdweb";

function Example() {

return (

 <PayEmbed

supportedTokens={{

// Override the tokens for Base Mainnet ( chaid id 84532 )

84532: [

 {

 address: NATIVE_TOKEN_ADDRESS, // use NATIVE_TOKEN_ADDRESS for native token

 name: "Base ETH",

 symbol: "ETH",

 icon: "https://...",

 },

 {

 address: "0x...", // token contract address

 name: "Dai Stablecoin",

 symbol: "DAI",

 icon: "https://...",

 },

 ],

 }}

 />

 );

}

`

##### theme

 Set the theme for the `PayEmbed` component. By default it is set to `"dark"`

 theme can be set to either `"dark"` , `"light"` or a custom theme object. You can also import [lightTheme](https://portal.thirdweb.com/references/typescript/v5/lightTheme)or [darkTheme](https://portal.thirdweb.com/references/typescript/v5/darkTheme)functions from `thirdweb/react` to use the default themes as base and overrides parts of it.

`type theme = "light" | "dark" | [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme);

`

### Example

`import { lightTheme } from "thirdweb/react";

const customTheme = lightTheme({

 colors: {

 modalBg: "red",

 },

});

function Example() {

return <PayEmbed client={client} theme={customTheme} />;

}

`
## PayTokenInfo

`type PayTokenInfo = {

chainId: number;

decimals: number;

name?: string;

priceUSDCents: number;

symbol?: string;

tokenAddress: string;

};

`

##### chainId

`type chainId = number;

`

##### decimals

`type decimals = number;

`

##### name

`type name = string;

`

##### priceUSDCents

`type priceUSDCents = number;

`

##### symbol

`type symbol = string;

`

##### tokenAddress

`type tokenAddress = string;

`
## PayOnChainTransactionDetails

`type PayOnChainTransactionDetails = {

amount: string;

amountUSDCents: number;

amountWei: string;

completedAt?: string;

explorerLink?: string;

token: [PayTokenInfo](https://portal.thirdweb.com/references/typescript/v5/PayTokenInfo);

transactionHash: string;

};

`

##### amount

`type amount = string;

`

##### amountUSDCents

`type amountUSDCents = number;

`

##### amountWei

`type amountWei = string;

`

##### completedAt

`type completedAt = string;

`

##### explorerLink

`type explorerLink = string;

`

##### token

`type token = [PayTokenInfo](https://portal.thirdweb.com/references/typescript/v5/PayTokenInfo);

`

##### transactionHash

`type transactionHash = string;

`
## PayUIOptions

`type PayUIOptions = Prettify<

 {

buyWithCrypto?:

| false

| {

prefillSource?: {

allowEdits?: { chain: boolean; token: boolean };

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

token?: [TokenInfo](https://portal.thirdweb.com/references/typescript/v5/TokenInfo);

 };

testMode?: boolean;

 };

buyWithFiat?:

| {

preferredProvider?: FiatProvider;

prefillSource?: { currency?: CurrencyMeta["shorthand"] };

testMode?: boolean;

 }

| false;

metadata?: { image?: string; name?: string };

onPurchaseSuccess?: (

info:

| { status: [BuyWithCryptoStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoStatus); type: "crypto" }

| { status: [BuyWithFiatStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatStatus); type: "fiat" }

| {

chainId: number;

transactionHash: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

type: "transaction";

 },

 ) => void;

purchaseData?: object;

 } & ([FundWalletOptions](https://portal.thirdweb.com/references/typescript/v5/FundWalletOptions) | [DirectPaymentOptions](https://portal.thirdweb.com/references/typescript/v5/DirectPaymentOptions) | [TranasctionOptions](https://portal.thirdweb.com/references/typescript/v5/TranasctionOptions))

>;

`
## PayeeParams

 Represents the parameters for the "payee" function.

`type PayeeParams = {

index: AbiParameterToPrimitiveType<{

name: "index";

type: "uint256";

 }>;

};

`

##### index

`type index = AbiParameterToPrimitiveType<{

name: "index";

type: "uint256";

}>;

`
## PaymasterResult

`type PaymasterResult = {

callGasLimit?: bigint;

preVerificationGas?: bigint;

verificationGasLimit?: bigint;

} & (

| { paymasterAndData: string }

| {

paymaster: string;

paymasterData: string;

paymasterPostOpGasLimit?: bigint;

paymasterVerificationGasLimit?: bigint;

 }

);

`
## PrepareCallOptions

`type PrepareCallOptions = {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

} & PromisedObject<WalletCall>;

`
## PaymentInfo

`type PaymentInfo = {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

sellerAddress: string;

token?: [TokenInfo](https://portal.thirdweb.com/references/typescript/v5/TokenInfo);

} & ({ amount: string } | { amountWei: bigint });

`
## PrepareContractCallOptions

`type PrepareContractCallOptions<

TAbi extends Abi = [],

TMethod extends

| AbiFunction

| string

| ((

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<TAbi>,

 ) => Promise<AbiFunction>) = TAbi extends { length: 0 }

? AbiFunction | string

: ExtractAbiFunctionNames<TAbi>,

TPreparedMethod extends PreparedMethod<

ParseMethod<TAbi, TMethod>

 > = PreparedMethod<ParseMethod<TAbi, TMethod>>,

> = [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

Omit<

TransactionRequest,

| "from"

| "to"

| "data"

| "value"

| "accessList"

| "gas"

| "gasPrice"

| "maxFeePerGas"

| "maxPriorityFeePerGas"

| "nonce"

 > & {

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<TAbi>;

method: TMethod | TPreparedMethod;

 } & ParamsOption<TPreparedMethod[1]> &

Omit<

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions),

"to" | "data" | "chain" | "client"

 >,

TAbi

>;

`
## PrepareDirectDeployTransactionOptions

`type PrepareDirectDeployTransactionOptions = Prettify<

ClientAndChain & {

abi: Abi;

bytecode: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

constructorParams?: Record<string, unknown>;

 }

>;

`
## PrepareEventOptions

`` type PrepareEventOptions<

TSignature extends `event ${string}` | AbiEvent,

> = {

filters?: Readonly<EventFilters<ParseEvent<TSignature>>>;

signature: TSignature;

};

 ``

##### filters

`type filters = Readonly<EventFilters<ParseEvent<TSignature>>>;

`

##### signature

`type signature = TSignature;

`
## PrepareTransactionOptions

`type PrepareTransactionOptions = {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

} & PromisedObject<

Omit<StaticPrepareTransactionOptions, "chain" | "client">

>;

`
## PreparedEvent

`type PreparedEvent<abiEvent extends AbiEvent> = {

abiEvent: abiEvent;

hash: Hex;

topics: Array<Hex>;

};

`

##### abiEvent

`type abiEvent = abiEvent;

`

##### hash

`type hash = Hex;

`

##### topics

`type topics = Array<Hex>;

`
## PreparedSendCall

`type PreparedSendCall<

abi extends Abi = [],

abiFunction extends AbiFunction = AbiFunction,

> = [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<abi, abiFunction, [PrepareCallOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareCallOptions)>;

`
## PreviewDepositParams

 Represents the parameters for the "previewDeposit" function.

`type PreviewDepositParams = {

assets: AbiParameterToPrimitiveType<{

name: "assets";

type: "uint256";

 }>;

};

`

##### assets

`type assets = AbiParameterToPrimitiveType<{

name: "assets";

type: "uint256";

}>;

`
## PreparedTransaction

`type PreparedTransaction<

abi extends Abi = [],

abiFn extends AbiFunction = AbiFunction,

options extends

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions) = [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions),

> = Readonly<options> & {

__contract?: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi>;

__preparedMethod?: () => Promise<PreparedMethod<abiFn>>;

};

`
## PreviewMintParams

 Represents the parameters for the "previewMint" function.

`type PreviewMintParams = {

shares: AbiParameterToPrimitiveType<{

name: "shares";

type: "uint256";

 }>;

};

`

##### shares

`type shares = AbiParameterToPrimitiveType<{

name: "shares";

type: "uint256";

}>;

`
## PreviewRedeemParams

 Represents the parameters for the "previewRedeem" function.

`type PreviewRedeemParams = {

shares: AbiParameterToPrimitiveType<{

name: "shares";

type: "uint256";

 }>;

};

`

##### shares

`type shares = AbiParameterToPrimitiveType<{

name: "shares";

type: "uint256";

}>;

`
## PriceParams

 Represents the parameters for the "price" function.

`type PriceParams = {

extraStorage: AbiParameterToPrimitiveType<{

name: "extraStorage";

type: "uint256";

 }>;

};

`

##### extraStorage

`type extraStorage = AbiParameterToPrimitiveType<{

name: "extraStorage";

type: "uint256";

}>;

`
## PriceParams

 Represents the parameters for the "price" function.

`type PriceParams = {

units: AbiParameterToPrimitiveType<{

name: "units";

type: "uint256";

 }>;

};

`

##### units

`type units = AbiParameterToPrimitiveType<{

name: "units";

type: "uint256";

}>;

`
## PreviewWithdrawParams

 Represents the parameters for the "previewWithdraw" function.

`type PreviewWithdrawParams = {

assets: AbiParameterToPrimitiveType<{

name: "assets";

type: "uint256";

 }>;

};

`

##### assets

`type assets = AbiParameterToPrimitiveType<{

name: "assets";

type: "uint256";

}>;

`
## PriceParams

 Represents the parameters for the "price" function.

`type PriceParams = {

extraStorage: AbiParameterToPrimitiveType<{

name: "extraStorage";

type: "uint256";

 }>;

};

`

##### extraStorage

`type extraStorage = AbiParameterToPrimitiveType<{

name: "extraStorage";

type: "uint256";

}>;

`
## PrivateKeyToAccountOptions

`type PrivateKeyToAccountOptions = {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

privateKey: string;

};

`

##### client

 A client is the entry point to the thirdweb SDK. It is required for all other actions. You can create a client using the `createThirdwebClient` function. Refer to the [ Creating a Client](https://portal.thirdweb.com/typescript/v5/client) documentation for more information.

 You must provide a `clientId` or `secretKey` in order to initialize a client. Pass `clientId` if you want for client-side usage and `secretKey` for server-side usage.

`import { createThirdwebClient } from "thirdweb";

const client = createThirdwebClient({

 clientId: "<your_client_id>",

});

`

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### privateKey

 The private key to use for the account.

 Do not commit private key in your code and use environment variables or other secure methods to store the private key.

`type privateKey = string;

`

### Example

`const privateKey = process.env.PRIVATE_KEY;

`
## Profile

`type Profile = {

details: {

address?: [Address](https://portal.thirdweb.com/references/typescript/v5/Address);

email?: string;

id?: string;

phone?: string;

 };

type: AuthOption;

};

`

##### details

`type details = {

address?: [Address](https://portal.thirdweb.com/references/typescript/v5/Address);

email?: string;

id?: string;

phone?: string;

};

`

##### type

`type type = AuthOption;

`
## ProposalDeadlineParams

 Represents the parameters for the "proposalDeadline" function.

`type ProposalDeadlineParams = {

proposalId: AbiParameterToPrimitiveType<{

name: "proposalId";

type: "uint256";

 }>;

};

`

##### proposalId

`type proposalId = AbiParameterToPrimitiveType<{

name: "proposalId";

type: "uint256";

}>;

`
## ProposalItem

`type ProposalItem = {

description: string;

endBlock: bigint;

executions: Array<{

nativeTokenValue: bigint | undefined;

toAddress: string | undefined;

transactionData: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex) | undefined;

 }>;

proposalId: bigint;

proposer: string;

startBlock: bigint;

state: number;

stateLabel: string | undefined;

votes: ProposalVoteInfo;

};

`

##### description

 Description of the proposal

`type description = string;

`

##### endBlock

 The block number where the proposal concludes its voting phase

`type endBlock = bigint;

`

##### executions

 The array of containing info about the set of actions that will be executed onchain, should the proposal pass

`type executions = Array<{

nativeTokenValue: bigint | undefined;

toAddress: string | undefined;

transactionData: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex) | undefined;

}>;

`

##### proposalId

 ID of the proposal

`type proposalId = bigint;

`

##### proposer

 The wallet address of the proposer

`type proposer = string;

`

##### startBlock

 The block number at which the proposal is open for voting

`type startBlock = bigint;

`

##### state

 The current state of the proposal, represented in number

`type state = number;

`

##### stateLabel

 The current state of the proposal, represented in a user-friendly string Example: "pending" | "active" | "canceled"

`type stateLabel = string | undefined;

`

##### votes

 The current vote info. See type [ProposalVoteInfo](https://portal.thirdweb.com/references/typescript/v5/ProposalItem) for more context

`type votes = ProposalVoteInfo;

`
## ProposalSnapshotParams

 Represents the parameters for the "proposalSnapshot" function.

`type ProposalSnapshotParams = {

proposalId: AbiParameterToPrimitiveType<{

name: "proposalId";

type: "uint256";

 }>;

};

`

##### proposalId

`type proposalId = AbiParameterToPrimitiveType<{

name: "proposalId";

type: "uint256";

}>;

`
## ProposalState

`enum ProposalState {

active,

canceled,

defeated,

executed,

expired,

pending,

queued,

succeeded,

}

`

#### active

`1;

`

#### canceled

`2;

`

#### defeated

`3;

`

#### executed

`7;

`

#### expired

`6;

`

#### pending

`0;

`

#### queued

`5;

`

#### succeeded

`4;

`
## ProposalVotesParams

 Represents the parameters for the "proposalVotes" function.

`type ProposalVotesParams = {

proposalId: AbiParameterToPrimitiveType<{

name: "proposalId";

type: "uint256";

 }>;

};

`

##### proposalId

`type proposalId = AbiParameterToPrimitiveType<{

name: "proposalId";

type: "uint256";

}>;

`
## ProposalsParams

 Represents the parameters for the "proposals" function.

`type ProposalsParams = {

key: AbiParameterToPrimitiveType<{ name: "key"; type: "uint256" }>;

};

`

##### key

`type key = AbiParameterToPrimitiveType<{

name: "key";

type: "uint256";

}>;

`
## ProposeParams

 Represents the parameters for the "propose" function.

`type ProposeParams = WithOverrides<{

calldatas: AbiParameterToPrimitiveType<{

name: "calldatas";

type: "bytes[]";

 }>;

description: AbiParameterToPrimitiveType<{

name: "description";

type: "string";

 }>;

targets: AbiParameterToPrimitiveType<{

name: "targets";

type: "address[]";

 }>;

values: AbiParameterToPrimitiveType<{

name: "values";

type: "uint256[]";

 }>;

}>;

`
## PublishContractParams

`type PublishContractParams = {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

metadata: [FetchDeployMetadataResult](https://portal.thirdweb.com/references/typescript/v5/FetchDeployMetadataResult) & { version: string };

previousMetadata?: [FetchDeployMetadataResult](https://portal.thirdweb.com/references/typescript/v5/FetchDeployMetadataResult);

};

`

##### account

`type account = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### metadata

`type metadata = [FetchDeployMetadataResult](https://portal.thirdweb.com/references/typescript/v5/FetchDeployMetadataResult) & { version: string };

`

##### previousMetadata

`type previousMetadata = [FetchDeployMetadataResult](https://portal.thirdweb.com/references/typescript/v5/FetchDeployMetadataResult);

`
## QuorumParams

 Represents the parameters for the "quorum" function.

`type QuorumParams = {

blockNumber: AbiParameterToPrimitiveType<{

name: "blockNumber";

type: "uint256";

 }>;

};

`

##### blockNumber

`type blockNumber = AbiParameterToPrimitiveType<{

name: "blockNumber";

type: "uint256";

}>;

`
## QuoteExactInputParams

 Represents the parameters for the "quoteExactInput" function.

`type QuoteExactInputParams = WithOverrides<{

amountIn: AbiParameterToPrimitiveType<{

name: "amountIn";

type: "uint256";

 }>;

path: AbiParameterToPrimitiveType<{ name: "path"; type: "bytes" }>;

}>;

`
## QuoteExactOutputParams

 Represents the parameters for the "quoteExactOutput" function.

`type QuoteExactOutputParams = WithOverrides<{

amountOut: AbiParameterToPrimitiveType<{

name: "amountOut";

type: "uint256";

 }>;

path: AbiParameterToPrimitiveType<{ name: "path"; type: "bytes" }>;

}>;

`
## QuoteExactOutputSingleParams

 Represents the parameters for the "quoteExactOutputSingle" function.

`type QuoteExactOutputSingleParams = WithOverrides<{

amountOut: AbiParameterToPrimitiveType<{

name: "amountOut";

type: "uint256";

 }>;

fee: AbiParameterToPrimitiveType<{ name: "fee"; type: "uint24" }>;

sqrtPriceLimitX96: AbiParameterToPrimitiveType<{

name: "sqrtPriceLimitX96";

type: "uint160";

 }>;

tokenIn: AbiParameterToPrimitiveType<{

name: "tokenIn";

type: "address";

 }>;

tokenOut: AbiParameterToPrimitiveType<{

name: "tokenOut";

type: "address";

 }>;

}>;

`
## QuoteExactInputSingleParams

 Represents the parameters for the "quoteExactInputSingle" function.

`type QuoteExactInputSingleParams = WithOverrides<{

amountIn: AbiParameterToPrimitiveType<{

name: "amountIn";

type: "uint256";

 }>;

fee: AbiParameterToPrimitiveType<{ name: "fee"; type: "uint24" }>;

sqrtPriceLimitX96: AbiParameterToPrimitiveType<{

name: "sqrtPriceLimitX96";

type: "uint160";

 }>;

tokenIn: AbiParameterToPrimitiveType<{

name: "tokenIn";

type: "address";

 }>;

tokenOut: AbiParameterToPrimitiveType<{

name: "tokenOut";

type: "address";

 }>;

}>;

`
## ReadContractOptions

`type ReadContractOptions<

TAbi extends Abi = [],

TMethod extends

| AbiFunction

| string

| ((

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<TAbi>,

 ) => Promise<AbiFunction>) = TAbi extends { length: 0 }

? AbiFunction | string

: ExtractAbiFunctionNames<TAbi>,

TPreparedMethod extends PreparedMethod<

ParseMethod<TAbi, TMethod>

 > = PreparedMethod<ParseMethod<TAbi, TMethod>>,

> = [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

Omit<

TransactionRequest,

| "from"

| "to"

| "data"

| "value"

| "accessList"

| "gas"

| "gasPrice"

| "maxFeePerGas"

| "maxPriorityFeePerGas"

| "nonce"

 > & {

from?: string;

method: TMethod | TPreparedMethod;

 } & ParamsOption<TPreparedMethod[1]> &

Omit<

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions),

"to" | "data" | "chain" | "client"

 >,

TAbi

>;

`
## RecoverParams

 Represents the parameters for the "recover" function.

`type RecoverParams = WithOverrides<{

deadline: AbiParameterToPrimitiveType<{

name: "deadline";

type: "uint256";

 }>;

from: AbiParameterToPrimitiveType<{

name: "from";

type: "address";

 }>;

sig: AbiParameterToPrimitiveType<{ name: "sig"; type: "bytes" }>;

to: AbiParameterToPrimitiveType<{ name: "to"; type: "address" }>;

}>;

`
## RecoverForParams

 Represents the parameters for the "recoverFor" function.

`type RecoverForParams = WithOverrides<{

from: AbiParameterToPrimitiveType<{

name: "from";

type: "address";

 }>;

recoveryDeadline: AbiParameterToPrimitiveType<{

name: "recoveryDeadline";

type: "uint256";

 }>;

recoverySig: AbiParameterToPrimitiveType<{

name: "recoverySig";

type: "bytes";

 }>;

to: AbiParameterToPrimitiveType<{ name: "to"; type: "address" }>;

toDeadline: AbiParameterToPrimitiveType<{

name: "toDeadline";

type: "uint256";

 }>;

toSig: AbiParameterToPrimitiveType<{

name: "toSig";

type: "bytes";

 }>;

}>;

`
## RecoveryOfParams

 Represents the parameters for the "recoveryOf" function.

`type RecoveryOfParams = {

fid: AbiParameterToPrimitiveType<{ name: "fid"; type: "uint256" }>;

};

`

##### fid

`type fid = AbiParameterToPrimitiveType<{

name: "fid";

type: "uint256";

}>;

`
## RedeemParams

 Represents the parameters for the "redeem" function.

`type RedeemParams = WithOverrides<{

owner: AbiParameterToPrimitiveType<{

name: "owner";

type: "address";

 }>;

receiver: AbiParameterToPrimitiveType<{

name: "receiver";

type: "address";

 }>;

shares: AbiParameterToPrimitiveType<{

name: "shares";

type: "uint256";

 }>;

}>;

`
## ReadContractResult

`type ReadContractResult<outputs extends readonly Array<AbiParameter>> = outputs extends { length: 0 } ? never : outputs extends { length: 1 } ? AbiParametersToPrimitiveTypes<outputs>[0] : AbiParametersToPrimitiveTypes<outputs>

`
## RefreshJWTParams

`type RefreshJWTParams = {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

expirationTime?: number;

jwt: string;

};

`

##### account

`type account = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### expirationTime

`type expirationTime = number;

`

##### jwt

`type jwt = string;

`
## RegisterFidAndSignerParams

 Represents the parameters for the `registerFidAndSigner` function.

`type RegisterFidAndSignerParams = Prettify<

 {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

disableCache?: boolean;

extraStorage?: bigint | number;

recoveryAddress: Address;

signerPublicKey: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

 } & (

| { userAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account) }

| {

addSignature: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

deadline: bigint;

registerSignature: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

userAddress: Address;

 }

 ) &

 (

| { appAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account) }

| {

appAccountAddress: Address;

deadline: bigint;

signedKeyRequestMetadata: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

 }

 )

>;

`
## RegisterForParams

 Represents the parameters for the "registerFor" function.

`type RegisterForParams = WithOverrides<{

deadline: AbiParameterToPrimitiveType<{

name: "deadline";

type: "uint256";

 }>;

extraStorage: AbiParameterToPrimitiveType<{

name: "extraStorage";

type: "uint256";

 }>;

recovery: AbiParameterToPrimitiveType<{

name: "recovery";

type: "address";

 }>;

sig: AbiParameterToPrimitiveType<{ name: "sig"; type: "bytes" }>;

to: AbiParameterToPrimitiveType<{ name: "to"; type: "address" }>;

}>;

`
## RegisterMessage

`type RegisterMessage = {

deadline: bigint;

nonce: bigint;

recovery: Address;

to: Address;

};

`

##### deadline

 Unix timestamp when this message expires

`type deadline = bigint;

`

##### nonce

 IdGateway nonce for signer address

`type nonce = bigint;

`

##### recovery

 FID recovery address

`type recovery = Address;

`

##### to

 FID custody address

`type to = Address;

`
## RegisterFidParams

 Represents the parameters for the `registerFid` function.

`type RegisterFidParams = {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

disableCache?: boolean;

extraStorage?: bigint | string | number;

recoveryAddress: Address;

};

`

##### chain

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### disableCache

`type disableCache = boolean;

`

##### extraStorage

`type extraStorage = bigint | string | number;

`

##### recoveryAddress

`type recoveryAddress = Address;

`
## RegisterParams

 Represents the parameters for the "register" function.

`type RegisterParams = WithOverrides<{

extraStorage: AbiParameterToPrimitiveType<{

name: "extraStorage";

type: "uint256";

 }>;

recovery: AbiParameterToPrimitiveType<{

name: "recovery";

type: "address";

 }>;

}>;

`
## RegisterParams

 Represents the parameters for the "register" function.

`type RegisterParams = WithOverrides<{

extraStorage: AbiParameterToPrimitiveType<{

name: "extraStorage";

type: "uint256";

 }>;

registerParams: AbiParameterToPrimitiveType<{

components: [

 { name: "to"; type: "address" },

 { name: "recovery"; type: "address" },

 { name: "deadline"; type: "uint256" },

 { name: "sig"; type: "bytes" },

 ];

name: "registerParams";

type: "tuple";

 }>;

signerParams: AbiParameterToPrimitiveType<{

components: [

 { name: "keyType"; type: "uint32" },

 { name: "key"; type: "bytes" },

 { name: "metadataType"; type: "uint8" },

 { name: "metadata"; type: "bytes" },

 { name: "deadline"; type: "uint256" },

 { name: "sig"; type: "bytes" },

 ];

name: "signerParams";

type: "tuple[]";

 }>;

}>;

`
## ReleasableParams

 Represents the parameters for the "releasable" function.

`type ReleasableParams = {

account: AbiParameterToPrimitiveType<{

name: "account";

type: "address";

 }>;

};

`

##### account

`type account = AbiParameterToPrimitiveType<{

name: "account";

type: "address";

}>;

`
## RelayParams

 Represents the parameters for the "relay" function.

`type RelayParams = WithOverrides<{

data: AbiParameterToPrimitiveType<{ name: "data"; type: "bytes" }>;

target: AbiParameterToPrimitiveType<{

name: "target";

type: "address";

 }>;

value: AbiParameterToPrimitiveType<{

name: "value";

type: "uint256";

 }>;

}>;

`
## ReleaseParams

 Represents the parameters for the "release" function.

`type ReleaseParams = WithOverrides<{

account: AbiParameterToPrimitiveType<{

name: "account";

type: "address";

 }>;

}>;

`
## ReleasedParams

 Represents the parameters for the "released" function.

`type ReleasedParams = {

account: AbiParameterToPrimitiveType<{

name: "account";

type: "address";

 }>;

};

`

##### account

`type account = AbiParameterToPrimitiveType<{

name: "account";

type: "address";

}>;

`
## RemoveAdminOptions

`type RemoveAdminOptions = { account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account); adminAddress: string };

`

##### account

 The admin account that will perform the operation.

`type account = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### adminAddress

 The address to remove as an admin.

`type adminAddress = string;

`
## RemoveParams

 Represents the parameters for the "remove" function.

`type RemoveParams = WithOverrides<{

chainId: AbiParameterToPrimitiveType<{

name: "_chainId";

type: "uint256";

 }>;

deployer: AbiParameterToPrimitiveType<{

name: "_deployer";

type: "address";

 }>;

deployment: AbiParameterToPrimitiveType<{

name: "_deployment";

type: "address";

 }>;

}>;

`
## RenounceRoleParams

`type RenounceRoleParams = {

role: RoleInput;

targetAccountAddress: Address;

};

`

##### role

`type role = RoleInput;

`

##### targetAccountAddress

`type targetAccountAddress = Address;

`
## RemoveSessionKeyOptions

`type RemoveSessionKeyOptions = {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

sessionKeyAddress: string;

};

`

##### account

 The account that will perform the operation.

`type account = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### sessionKeyAddress

 The address to remove as a session key.

`type sessionKeyAddress = string;

`
## RenounceRolesParams

 Represents the parameters for the "renounceRoles" function.

`type RenounceRolesParams = WithOverrides<{

roles: AbiParameterToPrimitiveType<{

name: "roles";

type: "uint256";

 }>;

}>;

`
## RentStorageParams

 Represents the parameters for the `rentStorage` function.

`type RentStorageParams = {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

disableCache?: boolean;

fid: bigint | number | string;

units?: bigint | number | string;

};

`

##### chain

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### disableCache

`type disableCache = boolean;

`

##### fid

`type fid = bigint | number | string;

`

##### units

`type units = bigint | number | string;

`
## ResolveAddressOptions

`type ResolveAddressOptions = {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

name: string;

resolverAddress?: string;

resolverChain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

};

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### name

`type name = string;

`

##### resolverAddress

`type resolverAddress = string;

`

##### resolverChain

`type resolverChain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`
## ResolveAddressOptions

`type ResolveAddressOptions = {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

name: string;

resolverAddress?: string;

resolverChain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

};

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### name

`type name = string;

`

##### resolverAddress

`type resolverAddress = string;

`

##### resolverChain

`type resolverChain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`
## ResolveArweaveSchemeOptions

`type ResolveArweaveSchemeOptions = {

gatewayUrl?: string;

uri: string;

};

`

##### gatewayUrl

`type gatewayUrl = string;

`

##### uri

`type uri = string;

`
## ResolveAvatarOptions

`type ResolveAvatarOptions = {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

name: string;

resolverAddress?: string;

resolverChain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

};

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### name

`type name = string;

`

##### resolverAddress

`type resolverAddress = string;

`

##### resolverChain

`type resolverChain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`
## ResolveL2NameOptions

`type ResolveL2NameOptions = {

address: Address;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

resolverAddress: string;

resolverChain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

};

`

##### address

`type address = Address;

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### resolverAddress

`type resolverAddress = string;

`

##### resolverChain

`type resolverChain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`
## ResolveLensAddressParams

`type ResolveLensAddressParams = {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

name: string;

overrides?: { chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain); lensHandleContractAddress?: string };

};

`

##### client

 a [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient)

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### name

 Either a full lens handle, or a lens localName Examples:

* Full handle: "lens/vitalik"
* Just local name: "vitalik"

`type name = string;

`

##### overrides

 Override parameters for Lens contract, defaults to LensHandle contract on Polygon

`type overrides = {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

lensHandleContractAddress?: string;

};

`
## ResolveNameOptions

`type ResolveNameOptions = {

address: Address;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

resolverAddress?: string;

resolverChain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

};

`

##### address

`type address = Address;

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### resolverAddress

`type resolverAddress = string;

`

##### resolverChain

`type resolverChain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`
## ResolveParams

 Represents the parameters for the "resolve" function.

`type ResolveParams = {

handleId: AbiParameterToPrimitiveType<{

name: "handleId";

type: "uint256";

 }>;

};

`

##### handleId

`type handleId = AbiParameterToPrimitiveType<{

name: "handleId";

type: "uint256";

}>;

`
## ResolveSchemeOptions

`type ResolveSchemeOptions = { client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient); uri: string };

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### uri

`type uri = string;

`
## ResolveTextOptions

`type ResolveTextOptions = {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

key: string;

name: string;

resolverAddress?: string;

resolverChain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

};

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### key

`type key = string;

`

##### name

`type name = string;

`

##### resolverAddress

`type resolverAddress = string;

`

##### resolverChain

`type resolverChain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`
## ResolveUDNameOptions

`type ResolveUDNameOptions = {

address: string;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

resolverAddress?: string;

resolverChain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

};

`

##### address

`type address = string;

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### resolverAddress

`type resolverAddress = string;

`

##### resolverChain

`type resolverChain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`
## RevealParams

`type RevealParams = { batchId: bigint; password: string };

`

##### batchId

`type batchId = bigint;

`

##### password

`type password = string;

`
## RevokeRoleParams

`type RevokeRoleParams = {

role: RoleInput;

targetAccountAddress: Address;

};

`

##### role

`type role = RoleInput;

`

##### targetAccountAddress

`type targetAccountAddress = Address;

`
## PayEmbed

 Embed a prebuilt UI for funding wallets, purchases or transactions with crypto or fiat.

### Example

####  Default configuration

 By default, the `PayEmbed` component will allows users to fund their wallets with crypto or fiat on any of the supported chains..

`<PayEmbed client={client} />;

`

####  Top up wallets

 You can set the `mode` option to `"fund_wallet"` to allow users to top up their wallets with crypto or fiat.

`<PayEmbed

client={client}

payOptions={{

 mode: "fund_wallet",

 metadata: {

 name: "Get funds", // title of the payment modal

 },

 prefillBuy: {

 chain: base, // chain to prefill the buy screen with

 amount: "0.01", // amount to prefill the buy screen with

 },

 }}

/>;

`

####  Direct Payments

 You can set the `mode` option to `"direct_payment"` to allow users to make a direct payment to a wallet address.

`<PayEmbed

client={client}

theme={"light"}

payOptions={{

 mode: "direct_payment",

 paymentInfo: {

 amount: "35",

 chain: base,

 token: getDefaultToken(base, "USDC"),

 sellerAddress: "0x...", // the wallet address of the seller

 },

 metadata: {

 name: "Black Hoodie (Size L)",

 image: "/drip-hoodie.png",

 },

 }}

/>;

`

####  Transactions

 You can set the `mode` option to `"transaction"` to allow users to execute a transaction with a different wallet, chain or token.

`<PayEmbed

client={client}

payOptions={{

 mode: "transaction",

// can be any transaction

 transaction: claimTo({

 contract: nftContract,

 quantity: 1n,

 tokenId: 0n,

 to: "0x...",

 }),

// this could be any metadata, including NFT metadata

 metadata: {

 name: "VIP Ticket",

 image: "https://...",

 },

 }}

/>;

`

 You can also handle ERC20 payments by passing `erc20value` to your transaction:

`<PayEmbed

client={client}

payOptions={{

 mode: "transaction",

 transaction: prepareContractCall({

 contract: yourContract,

 functionName: "purchase",

 args: [arg1, arg2, ...],

 erc20value: {

 token: USDC_TOKEN_ADDRESS, // the erc20 token required to purchase

 amount: toUnits("100", 6), // the amount of erc20 token required to purchase

 },

 }),

 }}

 />

`

####  Enable/Disable payment methods

 You can disable the use of crypto or fiat by setting the `buyWithCrypto` or `buyWithFiat` options to `false` .

```` <PayEmbed

client={client}

payOptions={{

 buyWithFiat: false,

 }}

 />

### Customize the UI

You can customize the UI of the `PayEmbed` component by passing a custom theme object to the `theme` prop.

```tsx

<PayEmbed

 client={client}

 theme={darkTheme({

 colors: {

 modalBg: "red",

 },

 })}

/>

 ````

 Refer to the [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme) type for more details.

####  Configure the wallet connection

 You can customize the wallet connection flow by passing a `connectOptions` object to the `PayEmbed` component.

`<PayEmbed

client={client}

connectOptions={{

 connectModal: {

 size: "compact",

 title: "Sign in",

 },

 }}

/>;

`

 Refer to the [PayEmbedConnectOptions](https://portal.thirdweb.com/references/typescript/v5/PayEmbedConnectOptions) type for more details.

 @buyCrypto

##### Signature

`function PayEmbed(props: [PayEmbedProps](https://portal.thirdweb.com/references/typescript/v5/PayEmbedProps)): Element;

`

### Parameters

##### props

 Props of type [PayEmbedProps](https://portal.thirdweb.com/references/typescript/v5/PayEmbedProps) to configure the PayEmbed component.

#### Type

`let props: {

activeWallet?: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

className?: string;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

connectOptions?: [PayEmbedConnectOptions](https://portal.thirdweb.com/references/typescript/v5/PayEmbedConnectOptions);

hiddenWallets?: Array<[WalletId](https://portal.thirdweb.com/references/typescript/v5/WalletId)>;

locale?: [LocaleId](https://portal.thirdweb.com/references/typescript/v5/LocaleId);

payOptions?: [PayUIOptions](https://portal.thirdweb.com/references/typescript/v5/PayUIOptions);

style?: React.CSSProperties;

supportedTokens?: [SupportedTokens](https://portal.thirdweb.com/references/typescript/v5/SupportedTokens);

theme?: "light" | "dark" | [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme);

};

`

### Returns

##### Return Type

`let returnType: Element;

`
## RevokeRolesParams

 Represents the parameters for the "revokeRoles" function.

`type RevokeRolesParams = WithOverrides<{

roles: AbiParameterToPrimitiveType<{

name: "roles";

type: "uint256";

 }>;

user: AbiParameterToPrimitiveType<{

name: "user";

type: "address";

 }>;

}>;

`
## ReverseNameOfParams

 Represents the parameters for the "reverseNameOf" function.

`type ReverseNameOfParams = {

addr: AbiParameterToPrimitiveType<{

name: "addr";

type: "address";

 }>;

};

`

##### addr

`type addr = AbiParameterToPrimitiveType<{

name: "addr";

type: "address";

}>;

`
## RoleAdminChangedEventFilters

 Represents the filters for the "RoleAdminChanged" event.

`type RoleAdminChangedEventFilters = Partial<{

newAdminRole: AbiParameterToPrimitiveType<{

indexed: true;

name: "newAdminRole";

type: "bytes32";

 }>;

previousAdminRole: AbiParameterToPrimitiveType<{

indexed: true;

name: "previousAdminRole";

type: "bytes32";

 }>;

role: AbiParameterToPrimitiveType<{

indexed: true;

name: "role";

type: "bytes32";

 }>;

}>;

`
## RoleGrantedEventFilters

 Represents the filters for the "RoleGranted" event.

`type RoleGrantedEventFilters = Partial<{

account: AbiParameterToPrimitiveType<{

indexed: true;

name: "account";

type: "address";

 }>;

role: AbiParameterToPrimitiveType<{

indexed: true;

name: "role";

type: "bytes32";

 }>;

sender: AbiParameterToPrimitiveType<{

indexed: true;

name: "sender";

type: "address";

 }>;

}>;

`
## RoleRevokedEventFilters

 Represents the filters for the "RoleRevoked" event.

`type RoleRevokedEventFilters = Partial<{

account: AbiParameterToPrimitiveType<{

indexed: true;

name: "account";

type: "address";

 }>;

role: AbiParameterToPrimitiveType<{

indexed: true;

name: "role";

type: "bytes32";

 }>;

sender: AbiParameterToPrimitiveType<{

indexed: true;

name: "sender";

type: "address";

 }>;

}>;

`
## RolesOfParams

 Represents the parameters for the "rolesOf" function.

`type RolesOfParams = {

user: AbiParameterToPrimitiveType<{

name: "user";

type: "address";

 }>;

};

`

##### user

`type user = AbiParameterToPrimitiveType<{

name: "user";

type: "address";

}>;

`
## RoyaltyInfoParams

 Represents the parameters for the "royaltyInfo" function.

`type RoyaltyInfoParams = {

salePrice: AbiParameterToPrimitiveType<{

name: "_salePrice";

type: "uint256";

 }>;

tokenId: AbiParameterToPrimitiveType<{

name: "_tokenId";

type: "uint256";

 }>;

};

`

##### salePrice

`type salePrice = AbiParameterToPrimitiveType<{

name: "_salePrice";

type: "uint256";

}>;

`

##### tokenId

`type tokenId = AbiParameterToPrimitiveType<{

name: "_tokenId";

type: "uint256";

}>;

`
## RoyaltyInfoParams

 Represents the parameters for the "royaltyInfo" function.

`type RoyaltyInfoParams = {

salePrice: AbiParameterToPrimitiveType<{

name: "_salePrice";

type: "uint256";

 }>;

tokenId: AbiParameterToPrimitiveType<{

name: "_tokenId";

type: "uint256";

 }>;

};

`

##### salePrice

`type salePrice = AbiParameterToPrimitiveType<{

name: "_salePrice";

type: "uint256";

}>;

`

##### tokenId

`type tokenId = AbiParameterToPrimitiveType<{

name: "_tokenId";

type: "uint256";

}>;

`
## SafeBatchTransferFromParams

 Represents the parameters for the "safeBatchTransferFrom" function.

`type SafeBatchTransferFromParams = WithOverrides<{

data: AbiParameterToPrimitiveType<{ name: "_data"; type: "bytes" }>;

from: AbiParameterToPrimitiveType<{

name: "_from";

type: "address";

 }>;

to: AbiParameterToPrimitiveType<{ name: "_to"; type: "address" }>;

tokenIds: AbiParameterToPrimitiveType<{

name: "tokenIds";

type: "uint256[]";

 }>;

values: AbiParameterToPrimitiveType<{

name: "_values";

type: "uint256[]";

 }>;

}>;

`
## SafeTransferFromParams

 Represents the parameters for the "safeTransferFrom" function.

`type SafeTransferFromParams = WithOverrides<{

data: AbiParameterToPrimitiveType<{ name: "_data"; type: "bytes" }>;

from: AbiParameterToPrimitiveType<{

name: "_from";

type: "address";

 }>;

to: AbiParameterToPrimitiveType<{ name: "_to"; type: "address" }>;

tokenId: AbiParameterToPrimitiveType<{

name: "tokenId";

type: "uint256";

 }>;

value: AbiParameterToPrimitiveType<{

name: "_value";

type: "uint256";

 }>;

}>;

`
## SaveSnapshotParams

`type SaveSnapshotParams = { merkleRoot: string; snapshotUri: string };

`

##### merkleRoot

`type merkleRoot = string;

`

##### snapshotUri

`type snapshotUri = string;

`
## SendBatchTransactionOptions

`type SendBatchTransactionOptions = {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

transactions: Array<[PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)>;

};

`

##### account

`type account = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### transactions

`type transactions = Array<[PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)>;

`
## SendCallsOptions

`type SendCallsOptions<

ID extends [WalletId](https://portal.thirdweb.com/references/typescript/v5/WalletId) = [WalletId](https://portal.thirdweb.com/references/typescript/v5/WalletId),

abi extends Abi = [],

abiFunction extends AbiFunction = AbiFunction,

> = {

calls: Array<[PreparedSendCall](https://portal.thirdweb.com/references/typescript/v5/PreparedSendCall)<abi, abiFunction>>;

capabilities?: [WalletSendCallsParameters](https://portal.thirdweb.com/references/typescript/v5/WalletSendCallsParameters)[number]["capabilities"];

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

version?: [WalletSendCallsParameters](https://portal.thirdweb.com/references/typescript/v5/WalletSendCallsParameters)[number]["version"];

wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)<ID>;

};

`

##### calls

`type calls = Array<[PreparedSendCall](https://portal.thirdweb.com/references/typescript/v5/PreparedSendCall)<abi, abiFunction>>;

`

##### capabilities

`type capabilities = [WalletSendCallsParameters](https://portal.thirdweb.com/references/typescript/v5/WalletSendCallsParameters)[number]["capabilities"];

`

##### chain

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### version

`type version = [WalletSendCallsParameters](https://portal.thirdweb.com/references/typescript/v5/WalletSendCallsParameters)[number]["version"];

`

##### wallet

`type wallet = [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)<ID>;

`
## SendTransactionConfig

 Configuration for the `useSendTransaction` hook.

`type SendTransactionConfig = {

gasless?: [GaslessOptions](https://portal.thirdweb.com/references/typescript/v5/GaslessOptions);

payModal?: [SendTransactionPayModalConfig](https://portal.thirdweb.com/references/typescript/v5/SendTransactionPayModalConfig);

};

`

##### gasless

 Configuration for gasless transactions. Refer to [GaslessOptions](https://portal.thirdweb.com/references/typescript/v5/GaslessOptions) for more details.

`type gasless = [GaslessOptions](https://portal.thirdweb.com/references/typescript/v5/GaslessOptions);

`

##### payModal

 Refer to [SendTransactionPayModalConfig](https://portal.thirdweb.com/references/typescript/v5/SendTransactionPayModalConfig) for more details.

`type payModal = [SendTransactionPayModalConfig](https://portal.thirdweb.com/references/typescript/v5/SendTransactionPayModalConfig);

`
## SendTransactionOptions

 Send transaction options

`type SendTransactionOptions = {

account: Account;

gasless: GaslessOptions;

transaction: PreparedTransaction<any>;

};

`

##### account

 The account to send the transaction with

`type account = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### gasless

 Gasless options for the transaction, if applicable

`type gasless = [GaslessOptions](https://portal.thirdweb.com/references/typescript/v5/GaslessOptions);

`

##### transaction

 The prepared transaction to send

`type transaction = [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any>;

`
## SendTransactionPayModalConfig

 Configuration for the "Pay Modal" that opens when the user doesn't have enough funds to send a transaction. Set `payModal: false` to disable the "Pay Modal" popup

 This configuration object includes the following properties to configure the "Pay Modal" UI:

#### `locale`

 The language to use for the "Pay Modal" UI. Defaults to `"en_US"` .

#### `supportedTokens`

 An object of type [SupportedTokens](https://portal.thirdweb.com/references/typescript/v5/SupportedTokens) to configure the tokens to show for a chain.

#### `theme`

 The theme to use for the "Pay Modal" UI. Defaults to `"dark"` .

 It can be set to `"light"` or `"dark"` or an object of type [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme) for a custom theme.

 Refer to [lightTheme](https://portal.thirdweb.com/references/typescript/v5/lightTheme)or [darkTheme](https://portal.thirdweb.com/references/typescript/v5/darkTheme) helper functions to use the default light or dark theme and customize it.

`type SendTransactionPayModalConfig =

| {

buyWithCrypto?: false | { testMode?: boolean };

buyWithFiat?:

| false

| {

preferredProvider?: FiatProvider;

prefillSource?: {

currency?: "USD" | "CAD" | "GBP" | "EUR" | "JPY";

 };

testMode?: boolean;

 };

locale?: [LocaleId](https://portal.thirdweb.com/references/typescript/v5/LocaleId);

metadata?: { image?: string; name?: string };

onPurchaseSuccess?: (

info:

| { status: [BuyWithCryptoStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoStatus); type: "crypto" }

| { status: [BuyWithFiatStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatStatus); type: "fiat" }

| {

chainId: number;

transactionHash: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

type: "transaction";

 },

 ) => void;

purchaseData?: object;

supportedTokens?: [SupportedTokens](https://portal.thirdweb.com/references/typescript/v5/SupportedTokens);

theme?: [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme) | "light" | "dark";

 }

| false;

`
## SerializeTransactionOptions

`type SerializeTransactionOptions = {

signature?:

| ox__Signature.Signature<true, [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex)>

| ox__Signature.Legacy<[Hex](https://portal.thirdweb.com/references/typescript/v5/Hex), bigint>;

transaction: SerializableTransaction;

};

`

##### signature

`type signature =

| ox__Signature.Signature<true, [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex)>

| ox__Signature.Legacy<[Hex](https://portal.thirdweb.com/references/typescript/v5/Hex), bigint>;

`

##### transaction

`type transaction = SerializableTransaction;

`
## SetApprovalForAllParams

 Represents the parameters for the "setApprovalForAll" function.

`type SetApprovalForAllParams = WithOverrides<{

approved: AbiParameterToPrimitiveType<{

name: "_approved";

type: "bool";

 }>;

operator: AbiParameterToPrimitiveType<{

name: "operator";

type: "address";

 }>;

}>;

`
## SetApprovalForAllParams

 Represents the parameters for the "setApprovalForAll" function.

`type SetApprovalForAllParams = WithOverrides<{

approved: AbiParameterToPrimitiveType<{

name: "_approved";

type: "bool";

 }>;

operator: AbiParameterToPrimitiveType<{

name: "_operator";

type: "address";

 }>;

}>;

`
## SetClaimConditionsParams

`type SetClaimConditionsParams = {

phases: Array<ClaimConditionsInput>;

resetClaimEligibility?: boolean;

singlePhaseDrop?: boolean;

};

`

##### phases

`type phases = Array<ClaimConditionsInput>;

`

##### resetClaimEligibility

`type resetClaimEligibility = boolean;

`

##### singlePhaseDrop

`type singlePhaseDrop = boolean;

`
## SetClaimConditionsParams

`type SetClaimConditionsParams = {

phases: Array<ClaimConditionsInput>;

resetClaimEligibility?: boolean;

singlePhaseDrop?: boolean;

};

`

##### phases

`type phases = Array<ClaimConditionsInput>;

`

##### resetClaimEligibility

`type resetClaimEligibility = boolean;

`

##### singlePhaseDrop

`type singlePhaseDrop = boolean;

`
## SetClaimConditionsParams

`type SetClaimConditionsParams = {

phases: Array<ClaimConditionsInput>;

resetClaimEligibility?: boolean;

singlePhaseDrop?: boolean;

tokenId: bigint;

};

`

##### phases

`type phases = Array<ClaimConditionsInput>;

`

##### resetClaimEligibility

`type resetClaimEligibility = boolean;

`

##### singlePhaseDrop

`type singlePhaseDrop = boolean;

`

##### tokenId

`type tokenId = bigint;

`
## SetDefaultRoyaltyInfoParams

 Represents the parameters for the "setDefaultRoyaltyInfo" function.

`type SetDefaultRoyaltyInfoParams = WithOverrides<{

royaltyBps: AbiParameterToPrimitiveType<{

name: "_royaltyBps";

type: "uint16";

 }>;

royaltyRecipient: AbiParameterToPrimitiveType<{

name: "_royaltyRecipient";

type: "address";

 }>;

}>;

`
## SetDefaultRoyaltyInfoParams

 Represents the parameters for the "setDefaultRoyaltyInfo" function.

`type SetDefaultRoyaltyInfoParams = WithOverrides<{

royaltyBps: AbiParameterToPrimitiveType<{

name: "_royaltyBps";

type: "uint16";

 }>;

royaltyRecipient: AbiParameterToPrimitiveType<{

name: "_royaltyRecipient";

type: "address";

 }>;

}>;

`
## SetMerkleRootParams

 Represents the parameters for the "setMerkleRoot" function.

`type SetMerkleRootParams = WithOverrides<{

resetClaimStatus: AbiParameterToPrimitiveType<{

name: "_resetClaimStatus";

type: "bool";

 }>;

token: AbiParameterToPrimitiveType<{

name: "_token";

type: "address";

 }>;

tokenMerkleRoot: AbiParameterToPrimitiveType<{

name: "_tokenMerkleRoot";

type: "bytes32";

 }>;

}>;

`
## SetDefaultRoyaltyInfoParams

 Represents the parameters for the "setDefaultRoyaltyInfo" function.

`type SetDefaultRoyaltyInfoParams = WithOverrides<{

royaltyBps: AbiParameterToPrimitiveType<{

name: "_royaltyBps";

type: "uint256";

 }>;

royaltyRecipient: AbiParameterToPrimitiveType<{

name: "_royaltyRecipient";

type: "address";

 }>;

}>;

`
## SetOwnerParams

 Represents the parameters for the "setOwner" function.

`type SetOwnerParams = WithOverrides<{

newOwner: AbiParameterToPrimitiveType<{

name: "newOwner";

type: "address";

 }>;

}>;

`
## SetPlatformFeeInfoParams

 Represents the parameters for the "setPlatformFeeInfo" function.

`type SetPlatformFeeInfoParams = WithOverrides<{

platformFeeBps: AbiParameterToPrimitiveType<{

name: "_platformFeeBps";

type: "uint256";

 }>;

platformFeeRecipient: AbiParameterToPrimitiveType<{

name: "_platformFeeRecipient";

type: "address";

 }>;

}>;

`
## SetOwnerParams

 Represents the parameters for the "setOwner" function.

`type SetOwnerParams = WithOverrides<{

newOwner: AbiParameterToPrimitiveType<{

name: "_newOwner";

type: "address";

 }>;

}>;

`
## SetPrimarySaleRecipientParams

 Represents the parameters for the "setPrimarySaleRecipient" function.

`type SetPrimarySaleRecipientParams = WithOverrides<{

saleRecipient: AbiParameterToPrimitiveType<{

name: "_saleRecipient";

type: "address";

 }>;

}>;

`
## SetPublisherProfileUriParams

 Represents the parameters for the "setPublisherProfileUri" function.

`type SetPublisherProfileUriParams = WithOverrides<{

publisher: AbiParameterToPrimitiveType<{

name: "publisher";

type: "address";

 }>;

uri: AbiParameterToPrimitiveType<{ name: "uri"; type: "string" }>;

}>;

`
## SetProposalThresholdParams

 Represents the parameters for the "setProposalThreshold" function.

`type SetProposalThresholdParams = WithOverrides<{

newProposalThreshold: AbiParameterToPrimitiveType<{

name: "newProposalThreshold";

type: "uint256";

 }>;

}>;

`
## SetRoyaltyInfoForTokenParams

 Represents the parameters for the "setRoyaltyInfoForToken" function.

`type SetRoyaltyInfoForTokenParams = WithOverrides<{

bps: AbiParameterToPrimitiveType<{ name: "_bps"; type: "uint16" }>;

recipient: AbiParameterToPrimitiveType<{

name: "_recipient";

type: "address";

 }>;

tokenId: AbiParameterToPrimitiveType<{

name: "_tokenId";

type: "uint256";

 }>;

}>;

`
## SetRoyaltyInfoForTokenParams

 Represents the parameters for the "setRoyaltyInfoForToken" function.

`type SetRoyaltyInfoForTokenParams = WithOverrides<{

bps: AbiParameterToPrimitiveType<{ name: "_bps"; type: "uint16" }>;

recipient: AbiParameterToPrimitiveType<{

name: "_recipient";

type: "address";

 }>;

tokenId: AbiParameterToPrimitiveType<{

name: "_tokenId";

type: "uint256";

 }>;

}>;

`
## SetRoyaltyInfoForTokenParams

 Represents the parameters for the "setRoyaltyInfoForToken" function.

`type SetRoyaltyInfoForTokenParams = WithOverrides<{

bps: AbiParameterToPrimitiveType<{ name: "bps"; type: "uint256" }>;

recipient: AbiParameterToPrimitiveType<{

name: "recipient";

type: "address";

 }>;

tokenId: AbiParameterToPrimitiveType<{

name: "tokenId";

type: "uint256";

 }>;

}>;

`
## SetTokenURIParams

 Represents the parameters for the "setTokenURI" function.

`type SetTokenURIParams = WithOverrides<{

tokenId: AbiParameterToPrimitiveType<{

name: "_tokenId";

type: "uint256";

 }>;

uri: AbiParameterToPrimitiveType<{ name: "_uri"; type: "string" }>;

}>;

`
## SetTokenURIParams

 Represents the parameters for the "setTokenURI" function.

`type SetTokenURIParams = WithOverrides<{

tokenId: AbiParameterToPrimitiveType<{

name: "_tokenId";

type: "uint256";

 }>;

uri: AbiParameterToPrimitiveType<{ name: "_uri"; type: "string" }>;

}>;

`
## SetTransferValidatorParams

 Represents the parameters for the "setTransferValidator" function.

`type SetTransferValidatorParams = WithOverrides<{

validator: AbiParameterToPrimitiveType<{

name: "validator";

type: "address";

 }>;

}>;

`
## SetTransferableForParams

 Represents the parameters for the "setTransferableFor" function.

`type SetTransferableForParams = WithOverrides<{

enableTransfer: AbiParameterToPrimitiveType<{

name: "enableTransfer";

type: "bool";

 }>;

target: AbiParameterToPrimitiveType<{

name: "target";

type: "address";

 }>;

}>;

`
## SetTransferValidatorParams

 Represents the parameters for the "setTransferValidator" function.

`type SetTransferValidatorParams = WithOverrides<{

validator: AbiParameterToPrimitiveType<{

name: "validator";

type: "address";

 }>;

}>;

`
## SetTransferableForParams

 Represents the parameters for the "setTransferableFor" function.

`type SetTransferableForParams = WithOverrides<{

enableTransfer: AbiParameterToPrimitiveType<{

name: "enableTransfer";

type: "bool";

 }>;

target: AbiParameterToPrimitiveType<{

name: "target";

type: "address";

 }>;

}>;

`
## SetSharedMetadataParams

`type SetSharedMetadataParams = { nft: [NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput) };

`

##### nft

`type nft = [NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput);

`
## SetTransferableForParams

 Represents the parameters for the "setTransferableFor" function.

`type SetTransferableForParams = WithOverrides<{

enableTransfer: AbiParameterToPrimitiveType<{

name: "enableTransfer";

type: "bool";

 }>;

target: AbiParameterToPrimitiveType<{

name: "target";

type: "address";

 }>;

}>;

`
## SharesParams

 Represents the parameters for the "shares" function.

`type SharesParams = {

account: AbiParameterToPrimitiveType<{

name: "account";

type: "address";

 }>;

};

`

##### account

`type account = AbiParameterToPrimitiveType<{

name: "account";

type: "address";

}>;

`
## SetVotingPeriodParams

 Represents the parameters for the "setVotingPeriod" function.

`type SetVotingPeriodParams = WithOverrides<{

newVotingPeriod: AbiParameterToPrimitiveType<{

name: "newVotingPeriod";

type: "uint256";

 }>;

}>;

`
## SetVotingDelayParams

 Represents the parameters for the "setVotingDelay" function.

`type SetVotingDelayParams = WithOverrides<{

newVotingDelay: AbiParameterToPrimitiveType<{

name: "newVotingDelay";

type: "uint256";

 }>;

}>;

`
## SignAddOptions

`type SignAddOptions = { account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account); message: [AddMessage](https://portal.thirdweb.com/references/typescript/v5/AddMessage) };

`

##### account

`type account = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### message

`type message = [AddMessage](https://portal.thirdweb.com/references/typescript/v5/AddMessage);

`
## SignKeyRequestOptions

`type SignKeyRequestOptions = {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

message: [SignedKeyRequestMessage](https://portal.thirdweb.com/references/typescript/v5/SignedKeyRequestMessage);

};

`

##### account

`type account = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### message

`type message = [SignedKeyRequestMessage](https://portal.thirdweb.com/references/typescript/v5/SignedKeyRequestMessage);

`
## SignLoginPayloadParams

`type SignLoginPayloadParams = {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

payload: [LoginPayload](https://portal.thirdweb.com/references/typescript/v5/LoginPayload);

};

`

##### account

`type account = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### payload

`type payload = [LoginPayload](https://portal.thirdweb.com/references/typescript/v5/LoginPayload);

`
## SignMessageOptions

`type SignMessageOptions = { message: Message; privateKey: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex) };

`

##### message

`type message = Message;

`

##### privateKey

`type privateKey = [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

`
## SignOptions

 Options for signing a transaction hash.

`type SignOptions = { hash: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex); privateKey: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex) };

`

##### hash

`type hash = [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

`

##### privateKey

`type privateKey = [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

`
## SignRegisterOptions

`type SignRegisterOptions = {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

message: [RegisterMessage](https://portal.thirdweb.com/references/typescript/v5/RegisterMessage);

};

`

##### account

`type account = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### message

`type message = [RegisterMessage](https://portal.thirdweb.com/references/typescript/v5/RegisterMessage);

`
## SignTransactionOptions

`type SignTransactionOptions = {

privateKey: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

transaction: SerializableTransaction;

};

`

##### privateKey

`type privateKey = [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

`

##### transaction

`type transaction = SerializableTransaction;

`
## SignTypedDataOptions

`type SignTypedDataOptions<

typedData extends

| ox__TypedData.TypedData

| Record<string, unknown> = ox__TypedData.TypedData,

primaryType extends

| keyof typedData

| "EIP712Domain" = keyof typedData,

> = ox__TypedData.Definition<typedData, primaryType> & {

privateKey: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

};

`
## SignedKeyRequestMessage

`type SignedKeyRequestMessage = {

deadline: bigint;

key: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

requestFid: bigint;

};

`

##### deadline

 Unix timestamp when this message expires

`type deadline = bigint;

`

##### key

 Signer public key

`type key = [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

`

##### requestFid

 FID of user or app requesting key

`type requestFid = bigint;

`
## QuoteTokenInfo

`type QuoteTokenInfo = {

chainId: number;

decimals: number;

name?: string;

priceUSDCents: number;

symbol?: string;

tokenAddress: string;

};

`

##### chainId

`type chainId = number;

`

##### decimals

`type decimals = number;

`

##### name

`type name = string;

`

##### priceUSDCents

`type priceUSDCents = number;

`

##### symbol

`type symbol = string;

`

##### tokenAddress

`type tokenAddress = string;

`
## SignedKeyRequestMetadataOptions

`type SignedKeyRequestMetadataOptions = Prettify<

 { message: [SignedKeyRequestMessage](https://portal.thirdweb.com/references/typescript/v5/SignedKeyRequestMessage) } & (

| { account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account) }

| { accountAddress: Address; keyRequestSignature: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex) }

 )

>;

`
## SimulateOptions

`type SimulateOptions<

abi extends Abi,

abiFn extends AbiFunction,

> = Prettify<

 { transaction: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<abi, abiFn> } & (

| { account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account); from?: never }

| { account?: never; from?: string }

 )

>;

`
## SimulateHandleOpParams

 Represents the parameters for the "simulateHandleOp" function.

`type SimulateHandleOpParams = WithOverrides<{

op: AbiParameterToPrimitiveType<{

components: [

 { name: "sender"; type: "address" },

 { name: "nonce"; type: "uint256" },

 { name: "initCode"; type: "bytes" },

 { name: "callData"; type: "bytes" },

 { name: "callGasLimit"; type: "uint256" },

 { name: "verificationGasLimit"; type: "uint256" },

 { name: "preVerificationGas"; type: "uint256" },

 { name: "maxFeePerGas"; type: "uint256" },

 { name: "maxPriorityFeePerGas"; type: "uint256" },

 { name: "paymasterAndData"; type: "bytes" },

 { name: "signature"; type: "bytes" },

 ];

name: "op";

type: "tuple";

 }>;

target: AbiParameterToPrimitiveType<{

name: "target";

type: "address";

 }>;

targetCallData: AbiParameterToPrimitiveType<{

name: "targetCallData";

type: "bytes";

 }>;

}>;

`
## SingleStepAuthArgsType

`type SingleStepAuthArgsType =

| SocialAuthArgsType

| { encryptionKey?: string; jwt: string; strategy: "jwt" }

| {

encryptionKey?: string;

payload: string;

strategy: "auth_endpoint";

 }

| { email: string; strategy: "iframe_email_verification" }

| { strategy: "iframe" }

| {

passkeyName?: string;

storeLastUsedPasskey?: boolean;

strategy: "passkey";

type: "sign-up" | "sign-in";

 }

| { chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain); strategy: "wallet"; wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet) }

| { strategy: "guest" }

| { strategy: "backend"; walletSecret: string };

`
## SiteLink

 Creates a link to another thirdweb-supported site with wallet connection parameters.

 The target site must support the connected wallet (ecosystem or in-app).

### Example

`import { SiteLink } from "thirdweb/react";

<SiteLink

href="https://thirdweb.com"

client={thirdwebClient}

ecosystem={{ id: "ecosystem.thirdweb" }}

>

 Visit Site

</SiteLink>;

`

##### Signature

`function SiteLink(

props: {

children: ReactNode;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

ecosystem?: Ecosystem;

href: string;

 } & Omit<AnchorHTMLAttributes<HTMLAnchorElement>, "href">,

): Element;

`

### Parameters

##### props

 The props to pass to the anchor tag

#### Type

`let props: {

children: ReactNode;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

ecosystem?: Ecosystem;

href: string;

} & Omit<AnchorHTMLAttributes<HTMLAnchorElement>, "href">;

`

### Returns

##### Return Type

`let returnType: Element;

`
## SmartWalletConnectionOptions

`type SmartWalletConnectionOptions = {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

personalAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

};

`

##### chain

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### personalAccount

`type personalAccount = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`
## SmartWalletOptions

`type SmartWalletOptions = Prettify<

 {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

factoryAddress?: string;

overrides?: {

accountAddress?: string;

accountSalt?: string;

bundlerUrl?: string;

createAccount?: (

factoryContract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract),

admin: string,

 ) => [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

entrypointAddress?: string;

execute?: (

accountContract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract),

transaction: SendTransactionOption,

 ) => [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

executeBatch?: (

accountContract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract),

transactions: Array<SendTransactionOption>,

 ) => [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

getAccountNonce?: (

accountContract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract),

 ) => Promise<bigint>;

paymaster?: (

userOp: UserOperationV06 | UserOperationV07,

 ) => Promise<[PaymasterResult](https://portal.thirdweb.com/references/typescript/v5/PaymasterResult)>;

predictAddress?: (

factoryContract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract),

admin: string,

 ) => Promise<string>;

signMessage?: (options: {

accountContract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

adminAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

factoryContract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

message: SignableMessage;

 }) => Promise<[Hex](https://portal.thirdweb.com/references/typescript/v5/Hex)>;

signTypedData?: (options: {

accountContract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

adminAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

factoryContract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

typedData: ox__TypedData.Definition<typedData, primaryType>;

 }) => Promise<[Hex](https://portal.thirdweb.com/references/typescript/v5/Hex)>;

tokenPaymaster?: TokenPaymasterConfig;

 };

sessionKey?: { address: string; permissions: AccountPermissions };

 } & ({ gasless: boolean } | { sponsorGas: boolean })

>;

`
## SplitContractParams

`type SplitContractParams = {

contractURI?: string;

defaultAdmin?: string;

description?: string;

external_link?: string;

image?: FileOrBufferOrString;

name: string;

payees: Array<string>;

shares: Array<bigint>;

social_urls?: Record<string, string>;

symbol?: string;

trustedForwarders?: Array<string>;

};

`

##### contractURI

`type contractURI = string;

`

##### defaultAdmin

`type defaultAdmin = string;

`

##### description

`type description = string;

`

##### external\_link

`type external_link = string;

`

##### image

`type image = FileOrBufferOrString;

`

##### name

`type name = string;

`

##### payees

 An array of strings containing wallet addresses of the recipients For example:

`["0x...123", "0x...456"];

`

`type payees = Array<string>;

`

##### shares

 An array of bigints containing the shared percentages of each respective payees. Must have the same length as `payees`

`type shares = Array<bigint>;

`

### Example

`[

5100n, // 51%

4900n, // 49%

];

`

##### social\_urls

`type social_urls = Record<string, string>;

`

##### symbol

`type symbol = string;

`

##### trustedForwarders

`type trustedForwarders = Array<string>;

`
## SocialProfile

`type SocialProfile = {

avatar?: string;

bio?: string;

metadata?: [FarcasterProfile](https://portal.thirdweb.com/references/typescript/v5/FarcasterProfile) | [LensProfile](https://portal.thirdweb.com/references/typescript/v5/LensProfile) | [EnsProfile](https://portal.thirdweb.com/references/typescript/v5/EnsProfile);

name?: string;

type: "farcaster" | "lens" | "ens";

};

`

##### avatar

`type avatar = string;

`

##### bio

`type bio = string;

`

##### metadata

`type metadata = [FarcasterProfile](https://portal.thirdweb.com/references/typescript/v5/FarcasterProfile) | [LensProfile](https://portal.thirdweb.com/references/typescript/v5/LensProfile) | [EnsProfile](https://portal.thirdweb.com/references/typescript/v5/EnsProfile);

`

##### name

`type name = string;

`

##### type

`type type = "farcaster" | "lens" | "ens";

`
## StandaloneWCConnectOptions

`type StandaloneWCConnectOptions =

[WCConnectOptions](https://portal.thirdweb.com/references/typescript/v5/WCConnectOptions)["walletConnect"] & {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

 };

`
## StateParams

 Represents the parameters for the "state" function.

`type StateParams = {

proposalId: AbiParameterToPrimitiveType<{

name: "proposalId";

type: "uint256";

 }>;

};

`

##### proposalId

`type proposalId = AbiParameterToPrimitiveType<{

name: "proposalId";

type: "uint256";

}>;

`
## SplitRecipient

`type SplitRecipient = { address: string; splitPercentage: number };

`

##### address

 The address of the recipient

`type address = string;

`

##### splitPercentage

 The split of the recipient as a percentage of the total amount

 I.e. If a recipient has a split of 50%, and the asset sells for 100 ETH, the recipient will receive 50 ETH.

`type splitPercentage = number;

`
## StoredTransaction

`type StoredTransaction = { chainId: number; transactionHash: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex) };

`

##### chainId

`type chainId = number;

`

##### transactionHash

`type transactionHash = [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

`
## StringToBytesOpts

`type StringToBytesOpts = { size?: number };

`

##### size

 Size of the output bytes.

`type size = number;

`
## Theme

`type Theme = {

colors: {

accentButtonBg: string;

accentButtonText: string;

accentText: string;

borderColor: string;

connectedButtonBg: string;

connectedButtonBgHover: string;

danger: string;

inputAutofillBg: string;

modalBg: string;

modalOverlayBg: string;

primaryButtonBg: string;

primaryButtonText: string;

primaryText: string;

scrollbarBg: string;

secondaryButtonBg: string;

secondaryButtonHoverBg: string;

secondaryButtonText: string;

secondaryIconColor: string;

secondaryIconHoverBg: string;

secondaryIconHoverColor: string;

secondaryText: string;

selectedTextBg: string;

selectedTextColor: string;

separatorLine: string;

skeletonBg: string;

success: string;

tertiaryBg: string;

tooltipBg: string;

tooltipText: string;

 };

fontFamily: string;

type: "light" | "dark";

};

`

##### colors

`type colors = {

accentButtonBg: string;

accentButtonText: string;

accentText: string;

borderColor: string;

connectedButtonBg: string;

connectedButtonBgHover: string;

danger: string;

inputAutofillBg: string;

modalBg: string;

modalOverlayBg: string;

primaryButtonBg: string;

primaryButtonText: string;

primaryText: string;

scrollbarBg: string;

secondaryButtonBg: string;

secondaryButtonHoverBg: string;

secondaryButtonText: string;

secondaryIconColor: string;

secondaryIconHoverBg: string;

secondaryIconHoverColor: string;

secondaryText: string;

selectedTextBg: string;

selectedTextColor: string;

separatorLine: string;

skeletonBg: string;

success: string;

tertiaryBg: string;

tooltipBg: string;

tooltipText: string;

};

`

##### fontFamily

`type fontFamily = string;

`

##### type

`type type = "light" | "dark";

`
## ThemeOverrides

`type ThemeOverrides = {

 [key in Exclude<keyof [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme), "type">]: Partial<[Theme](https://portal.thirdweb.com/references/typescript/v5/Theme)[key]>;

};

`
## ThirdwebClient

`type ThirdwebClient = {

readonly clientId: string;

readonly secretKey: string | undefined;

} & Readonly<ClientOptions>;

`
## ThirdwebContract

`` type ThirdwebContract<

abi extends Abi = [],

address extends string = `0x${string}`,

> = Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<abi, address>>;

 ``
## ToBytesParameters

`type ToBytesParameters = { size?: number };

`

##### size

 Size of the output bytes.

`type size = number;

`
## ThirdwebProvider

 The ThirdwebProvider is component is a provider component that sets up the React Query client.

### Example

`import { ThirdwebProvider } from "thirdweb/react";

function Example() {

return (

 <ThirdwebProvider>

 <App />

 </ThirdwebProvider>

 );

}

`

##### Signature

`function ThirdwebProvider(

props: PropsWithChildren<{

connectionManager?: {

activeAccountStore: Store<undefined | [Account](https://portal.thirdweb.com/references/typescript/v5/Account)>;

activeWalletChainStore: Store<

undefined | Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>

 >;

activeWalletConnectionStatusStore: Store<[ConnectionStatus](https://portal.thirdweb.com/references/typescript/v5/ConnectionStatus)>;

activeWalletStore: Store<undefined | [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

addConnectedWallet: (wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)) => void;

connect: (

wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet),

options?: [ConnectManagerOptions](https://portal.thirdweb.com/references/typescript/v5/ConnectManagerOptions),

 ) => Promise<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

connectedWallets: ReadonlyStore<Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>>;

defineChains: (

chains: Array<Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>>,

 ) => void;

disconnectWallet: (wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)) => void;

handleConnection: (

wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet),

options?: [ConnectManagerOptions](https://portal.thirdweb.com/references/typescript/v5/ConnectManagerOptions),

 ) => Promise<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

isAutoConnecting: Store<boolean>;

removeConnectedWallet: (wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)) => void;

setActiveWallet: (activeWallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)) => Promise<void>;

switchActiveWalletChain: (chain: Readonly) => Promise<void>;

 };

 }>,

): Element;

`

### Parameters

##### props

 The props for the ThirdwebProvider

#### Type

`let props: PropsWithChildren<{

connectionManager?: {

activeAccountStore: Store<undefined | [Account](https://portal.thirdweb.com/references/typescript/v5/Account)>;

activeWalletChainStore: Store<

undefined | Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>

 >;

activeWalletConnectionStatusStore: Store<[ConnectionStatus](https://portal.thirdweb.com/references/typescript/v5/ConnectionStatus)>;

activeWalletStore: Store<undefined | [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

addConnectedWallet: (wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)) => void;

connect: (

wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet),

options?: [ConnectManagerOptions](https://portal.thirdweb.com/references/typescript/v5/ConnectManagerOptions),

 ) => Promise<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

connectedWallets: ReadonlyStore<Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>>;

defineChains: (

chains: Array<Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>>,

 ) => void;

disconnectWallet: (wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)) => void;

handleConnection: (

wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet),

options?: [ConnectManagerOptions](https://portal.thirdweb.com/references/typescript/v5/ConnectManagerOptions),

 ) => Promise<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

isAutoConnecting: Store<boolean>;

removeConnectedWallet: (wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)) => void;

setActiveWallet: (activeWallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)) => Promise<void>;

switchActiveWalletChain: (chain: Readonly) => Promise<void>;

 };

}>;

`

### Returns

##### Return Type

`let returnType: Element;

`
## ToEip1193ProviderOptions

`type ToEip1193ProviderOptions = {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

connectOverride?: (wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)) => Promise<Account>;

wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

};

`

##### chain

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### connectOverride

##### Signature

`function connectOverride(wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)): Promise<Account>;

`

##### Parameters

##### wallet

###### Type

`let wallet: {

getAdminAccount?: () => [Account](https://portal.thirdweb.com/references/typescript/v5/Account) | undefined;

getConfig: () => [CreateWalletArgs](https://portal.thirdweb.com/references/typescript/v5/CreateWalletArgs)<TWalletId>[1];

id: TWalletId;

onConnectRequested?: () => Promise<void>;

subscribe: [WalletEmitter](https://portal.thirdweb.com/references/typescript/v5/WalletEmitter)<TWalletId>["subscribe"];

autoConnect: (

options: [WalletAutoConnectionOption](https://portal.thirdweb.com/references/typescript/v5/WalletAutoConnectionOption)<TWalletId>,

 ) => Promise<[Account](https://portal.thirdweb.com/references/typescript/v5/Account)>;

connect: (

options: [WalletConnectionOption](https://portal.thirdweb.com/references/typescript/v5/WalletConnectionOption)<TWalletId>,

 ) => Promise<[Account](https://portal.thirdweb.com/references/typescript/v5/Account)>;

disconnect: () => Promise<void>;

getAccount: () => undefined | [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

getChain: () =>

| undefined

| Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

switchChain: (chain: Readonly) => Promise<void>;

};

`

##### Returns

##### Return Type

`let returnType: {

address: Address;

estimateGas?: (tx: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)) => Promise<bigint>;

onTransactionRequested?: (

transaction: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any>,

 ) => Promise<void>;

sendBatchTransaction?: (

txs: Array<SendTransactionOption>,

 ) => Promise<SendTransactionResult>;

sendRawTransaction?: (

tx: SendRawTransactionOptions,

 ) => Promise<SendTransactionResult>;

sendTransaction: (

tx: SendTransactionOption,

 ) => Promise<SendTransactionResult>;

signAuthorization?: (

authorization: [AuthorizationRequest](https://portal.thirdweb.com/references/typescript/v5/AuthorizationRequest),

 ) => Promise<[SignedAuthorization](https://portal.thirdweb.com/references/typescript/v5/SignedAuthorization)>;

signMessage: ({

message,

originalMessage,

chainId,

 }: {

chainId?: number;

message: SignableMessage;

originalMessage?: string;

 }) => Promise<Hex>;

signTransaction?: (tx: SerializableTransaction) => Promise<Hex>;

signTypedData: (

_typedData: ox__TypedData.Definition<typedData, primaryType>,

 ) => Promise<Hex>;

watchAsset?: (asset: WatchAssetParams) => Promise<boolean>;

};

`

##### wallet

`type wallet = [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

`
## ToHexParameters

`type ToHexParameters = { size?: number };

`

##### size

 The size (in bytes) of the output hex value.

`type size = number;

`
## TokenConditionIdParams

 Represents the parameters for the "tokenConditionId" function.

`type TokenConditionIdParams = {

tokenAddress: AbiParameterToPrimitiveType<{

name: "tokenAddress";

type: "address";

 }>;

};

`

##### tokenAddress

`type tokenAddress = AbiParameterToPrimitiveType<{

name: "tokenAddress";

type: "address";

}>;

`
## ToSerializableTransactionOptions

`type ToSerializableTransactionOptions = {

from?: string | [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

transaction: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any>;

};

`

##### from

 The from address or account to use for gas estimation and authorization signing.

`type from = string | [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### transaction

 The transaction to convert to a serializable transaction.

`type transaction = [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any>;

`
## TokenDataOfParams

 Represents the parameters for the "tokenDataOf" function.

`type TokenDataOfParams = {

tokenId: AbiParameterToPrimitiveType<{

name: "tokenId";

type: "uint256";

 }>;

};

`

##### tokenId

`type tokenId = AbiParameterToPrimitiveType<{

name: "tokenId";

type: "uint256";

}>;

`
## TokenInfo

`type TokenInfo = {

address: string;

icon?: string;

name: string;

symbol: string;

};

`

##### address

`type address = string;

`

##### icon

`type icon = string;

`

##### name

`type name = string;

`

##### symbol

`type symbol = string;

`
## TokenMerkleRootParams

 Represents the parameters for the "tokenMerkleRoot" function.

`type TokenMerkleRootParams = {

tokenAddress: AbiParameterToPrimitiveType<{

name: "tokenAddress";

type: "address";

 }>;

};

`

##### tokenAddress

`type tokenAddress = AbiParameterToPrimitiveType<{

name: "tokenAddress";

type: "address";

}>;

`
## TokenOfOwnerByIndexParams

 Represents the parameters for the "tokenOfOwnerByIndex" function.

`type TokenOfOwnerByIndexParams = {

index: AbiParameterToPrimitiveType<{

name: "_index";

type: "uint256";

 }>;

owner: AbiParameterToPrimitiveType<{

name: "_owner";

type: "address";

 }>;

};

`

##### index

`type index = AbiParameterToPrimitiveType<{

name: "_index";

type: "uint256";

}>;

`

##### owner

`type owner = AbiParameterToPrimitiveType<{

name: "_owner";

type: "address";

}>;

`
## TokenProvider

 A React context provider component that supplies Token-related data to its child components.

 This component serves as a wrapper around the `TokenProviderContext.Provider` and passes the provided token data down to all of its child components through the context API.

### Example

####  Basic usage

`import { TokenProvider, TokenIcon, TokenName } from "thirdweb/react";

import { ethereum } from "thirdweb/chains";

<TokenProvider address="0x..." client={...} chain={ethereum}>

 <TokenIcon />

 <TokenName />

</TokenProvider>

`

####  This component also works with native token!

`import { NATIVE_TOKEN_ADDRESS } from "thirdweb";

import { ethereum } from "thirdweb/chains";

<TokenProvider

address={NATIVE_TOKEN_ADDRESS}

chain={ethereum}

client={client}

>

 <TokenSymbol /> // "ETH"

</TokenProvider>;

`

##### Signature

`function TokenProvider(

props: PropsWithChildren<[TokenProviderProps](https://portal.thirdweb.com/references/typescript/v5/TokenProviderProps)>,

): Element;

`

### Parameters

##### props

#### Type

`let props: PropsWithChildren<[TokenProviderProps](https://portal.thirdweb.com/references/typescript/v5/TokenProviderProps)>;

`

### Returns

##### Return Type

`let returnType: Element;

`
## TokenProviderProps

 Props for the `<TokenProvider />` component

`type TokenProviderProps = {

address: Address;

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

};

`

##### address

 The token (ERC20) contract address

`type address = Address;

`

##### chain

 The chain (network) that the token is on

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### client

 thirdweb Client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`
## TokenURIParams

 Represents the parameters for the "tokenURI" function.

`type TokenURIParams = {

tokenId: AbiParameterToPrimitiveType<{

name: "_tokenId";

type: "uint256";

 }>;

};

`

##### tokenId

`type tokenId = AbiParameterToPrimitiveType<{

name: "_tokenId";

type: "uint256";

}>;

`
## TokenURIRevealedEventFilters

 Represents the filters for the "TokenURIRevealed" event.

`type TokenURIRevealedEventFilters = Partial<{

index: AbiParameterToPrimitiveType<{

indexed: true;

name: "index";

type: "uint256";

 }>;

}>;

`
## TokensClaimedEventFilters

 Represents the filters for the "TokensClaimed" event.

`type TokensClaimedEventFilters = Partial<{

claimConditionIndex: AbiParameterToPrimitiveType<{

indexed: true;

name: "claimConditionIndex";

type: "uint256";

 }>;

claimer: AbiParameterToPrimitiveType<{

indexed: true;

name: "claimer";

type: "address";

 }>;

receiver: AbiParameterToPrimitiveType<{

indexed: true;

name: "receiver";

type: "address";

 }>;

}>;

`
## TokensLazyMintedEventFilters

 Represents the filters for the "TokensLazyMinted" event.

`type TokensLazyMintedEventFilters = Partial<{

startTokenId: AbiParameterToPrimitiveType<{

indexed: true;

name: "startTokenId";

type: "uint256";

 }>;

}>;

`
## TokensClaimedEventFilters

 Represents the filters for the "TokensClaimed" event.

`type TokensClaimedEventFilters = Partial<{

claimConditionIndex: AbiParameterToPrimitiveType<{

indexed: true;

name: "claimConditionIndex";

type: "uint256";

 }>;

claimer: AbiParameterToPrimitiveType<{

indexed: true;

name: "claimer";

type: "address";

 }>;

receiver: AbiParameterToPrimitiveType<{

indexed: true;

name: "receiver";

type: "address";

 }>;

}>;

`
## TokensMintedEventFilters

 Represents the filters for the "TokensMinted" event.

`type TokensMintedEventFilters = Partial<{

mintedTo: AbiParameterToPrimitiveType<{

indexed: true;

name: "mintedTo";

type: "address";

 }>;

}>;

`
## TokensMintedWithSignatureEventFilters

 Represents the filters for the "TokensMintedWithSignature" event.

`type TokensMintedWithSignatureEventFilters = Partial<{

mintedTo: AbiParameterToPrimitiveType<{

indexed: true;

name: "mintedTo";

type: "address";

 }>;

signer: AbiParameterToPrimitiveType<{

indexed: true;

name: "signer";

type: "address";

 }>;

tokenIdMinted: AbiParameterToPrimitiveType<{

indexed: true;

name: "tokenIdMinted";

type: "uint256";

 }>;

}>;

`
## TokensMintedWithSignatureEventFilters

 Represents the filters for the "TokensMintedWithSignature" event.

`type TokensMintedWithSignatureEventFilters = Partial<{

mintedTo: AbiParameterToPrimitiveType<{

indexed: true;

name: "mintedTo";

type: "address";

 }>;

signer: AbiParameterToPrimitiveType<{

indexed: true;

name: "signer";

type: "address";

 }>;

}>;

`
## TokensOfOwnerParams

 Represents the parameters for the "tokensOfOwner" function.

`type TokensOfOwnerParams = {

owner: AbiParameterToPrimitiveType<{

name: "owner";

type: "address";

 }>;

};

`

##### owner

`type owner = AbiParameterToPrimitiveType<{

name: "owner";

type: "address";

}>;

`
## TokensMintedWithSignatureEventFilters

 Represents the filters for the "TokensMintedWithSignature" event.

`type TokensMintedWithSignatureEventFilters = Partial<{

mintedTo: AbiParameterToPrimitiveType<{

indexed: true;

name: "mintedTo";

type: "address";

 }>;

signer: AbiParameterToPrimitiveType<{

indexed: true;

name: "signer";

type: "address";

 }>;

tokenIdMinted: AbiParameterToPrimitiveType<{

indexed: true;

name: "tokenIdMinted";

type: "uint256";

 }>;

}>;

`
## TotalSupplyParams

 Represents the parameters for the "totalSupply" function.

`type TotalSupplyParams = {

id: AbiParameterToPrimitiveType<{ name: "id"; type: "uint256" }>;

};

`

##### id

`type id = AbiParameterToPrimitiveType<{

name: "id";

type: "uint256";

}>;

`
## TransactionButtonProps

 Props for the [TransactionButton](https://portal.thirdweb.com/references/typescript/v5/TransactionButton) component.

`type TransactionButtonProps = {

children: React.ReactNode;

className?: string;

disabled?: boolean;

gasless?: [GaslessOptions](https://portal.thirdweb.com/references/typescript/v5/GaslessOptions);

onClick?: () => void;

onError?: (error: Error) => void;

onTransactionConfirmed?: (receipt: TransactionReceipt) => void;

onTransactionSent?: (

transactionResult: [WaitForReceiptOptions](https://portal.thirdweb.com/references/typescript/v5/WaitForReceiptOptions),

 ) => void;

payModal?: [SendTransactionPayModalConfig](https://portal.thirdweb.com/references/typescript/v5/SendTransactionPayModalConfig);

style?: React.CSSProperties;

theme?: "dark" | "light" | [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme);

transaction: () =>

| [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any>

| Promise<[PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any>>;

type?: HTMLButtonElement["type"];

unstyled?: boolean;

};

`

##### children

 The `React.ReactNode` to be rendered inside the button

`type children = React.ReactNode;

`

##### className

 The className to apply to the button element for custom styling

`type className = string;

`

##### disabled

 The button's disabled state

`type disabled = boolean;

`

##### gasless

 Configuration for gasless transactions. Refer to [GaslessOptions](https://portal.thirdweb.com/references/typescript/v5/GaslessOptions) for more details.

`type gasless = [GaslessOptions](https://portal.thirdweb.com/references/typescript/v5/GaslessOptions);

`

##### onClick

##### Signature

`function onClick(): void;

`

##### Returns

##### Return Type

`let returnType: void;

`

##### onError

##### Signature

`function onError(error: Error): void;

`

##### Parameters

##### error

 The `Error` object thrown

###### Type

`let error: Error;

`

##### Returns

##### Return Type

`let returnType: void;

`

##### onTransactionConfirmed

##### Signature

`function onTransactionConfirmed(receipt: TransactionReceipt): void;

`

##### Parameters

##### receipt

 The transaction receipt object of type [TransactionReceipt](https://portal.thirdweb.com/references/typescript/v5/TransactionReceipt)

###### Type

`let receipt: {

blobGasPrice?: quantity;

blobGasUsed?: quantity;

blockHash: Hash;

blockNumber: quantity;

contractAddress: Address | null | undefined;

cumulativeGasUsed: quantity;

effectiveGasPrice: quantity;

from: Address;

gasUsed: quantity;

logs: Array<Log<quantity, index, false>>;

logsBloom: Hex;

root?: Hash;

status: status;

to: Address | null;

transactionHash: Hash;

transactionIndex: index;

type: type;

};

`

##### Returns

##### Return Type

`let returnType: void;

`

##### onTransactionSent

##### Signature

`function onTransactionSent(

transactionResult: [WaitForReceiptOptions](https://portal.thirdweb.com/references/typescript/v5/WaitForReceiptOptions),

): void;

`

##### Parameters

##### transactionResult

 The object of type [WaitForReceiptOptions](https://portal.thirdweb.com/references/typescript/v5/WaitForReceiptOptions)

###### Type

`let transactionResult: Prettify<

SendTransactionResult & {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

maxBlocksWaitTime?: number;

 }

>;

`

##### Returns

##### Return Type

`let returnType: void;

`

##### payModal

 Configuration for the "Pay Modal" that opens when the user doesn't have enough funds to send a transaction. Set `payModal: false` to disable the "Pay Modal" popup

 This configuration object includes the following properties to configure the "Pay Modal" UI:

#### `locale`

 The language to use for the "Pay Modal" UI. Defaults to `"en_US"` .

#### `supportedTokens`

 An object of type [SupportedTokens](https://portal.thirdweb.com/references/typescript/v5/SupportedTokens) to configure the tokens to show for a chain.

#### `theme`

 The theme to use for the "Pay Modal" UI. Defaults to `"dark"` .

 It can be set to `"light"` or `"dark"` or an object of type [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme) for a custom theme.

 Refer to [lightTheme](https://portal.thirdweb.com/references/typescript/v5/lightTheme)or [darkTheme](https://portal.thirdweb.com/references/typescript/v5/darkTheme) helper functions to use the default light or dark theme and customize it.

`type payModal = [SendTransactionPayModalConfig](https://portal.thirdweb.com/references/typescript/v5/SendTransactionPayModalConfig);

`

##### style

 The style to apply to the button element for custom styling

`type style = React.CSSProperties;

`

##### theme

 The theme to use for the button

`type theme = "dark" | "light" | [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme);

`

##### transaction

##### Signature

`function transaction():

| [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any>

 | Promise<[PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any>>;

`

##### Returns

##### Return Type

`let returnType:

| [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any>

| Promise<[PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any>>;

`

##### type

 Set the type attribute of the button element.

[ MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLButtonElement/type)

`type type = HTMLButtonElement["type"];

`

##### unstyled

 Remove all default styling from the button

`type unstyled = boolean;

`
## TranasctionOptions

`type TranasctionOptions = {

mode: "transaction";

transaction: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

};

`

##### mode

`type mode = "transaction";

`

##### transaction

 The transaction to be executed.

`type transaction = [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

`
## TransferAndChangeRecoveryParams

 Represents the parameters for the "transferAndChangeRecovery" function.

`type TransferAndChangeRecoveryParams = WithOverrides<{

deadline: AbiParameterToPrimitiveType<{

name: "deadline";

type: "uint256";

 }>;

recovery: AbiParameterToPrimitiveType<{

name: "recovery";

type: "address";

 }>;

sig: AbiParameterToPrimitiveType<{ name: "sig"; type: "bytes" }>;

to: AbiParameterToPrimitiveType<{ name: "to"; type: "address" }>;

}>;

`
## TransferBatchEventFilters

 Represents the filters for the "TransferBatch" event.

`type TransferBatchEventFilters = Partial<{

_from: AbiParameterToPrimitiveType<{

indexed: true;

name: "_from";

type: "address";

 }>;

_operator: AbiParameterToPrimitiveType<{

indexed: true;

name: "_operator";

type: "address";

 }>;

_to: AbiParameterToPrimitiveType<{

indexed: true;

name: "_to";

type: "address";

 }>;

}>;

`
## TransactionReceipt

`type TransactionReceipt<

quantity = bigint,

index = number,

status = "success" | "reverted",

type = TransactionType,

> = {

blobGasPrice?: quantity;

blobGasUsed?: quantity;

blockHash: Hash;

blockNumber: quantity;

contractAddress: Address | null | undefined;

cumulativeGasUsed: quantity;

effectiveGasPrice: quantity;

from: Address;

gasUsed: quantity;

logs: Array<Log<quantity, index, false>>;

logsBloom: Hex;

root?: Hash;

status: status;

to: Address | null;

transactionHash: Hash;

transactionIndex: index;

type: type;

};

`

##### blobGasPrice

 The actual value per gas deducted from the sender's account for blob gas. Only specified for blob transactions as defined by EIP-4844.

`type blobGasPrice = quantity;

`

##### blobGasUsed

 The amount of blob gas used. Only specified for blob transactions as defined by EIP-4844.

`type blobGasUsed = quantity;

`

##### blockHash

 Hash of block containing this transaction

`type blockHash = Hash;

`

##### blockNumber

 Number of block containing this transaction

`type blockNumber = quantity;

`

##### contractAddress

 Address of new contract or `null` if no contract was created

`type contractAddress = Address | null | undefined;

`

##### cumulativeGasUsed

 Gas used by this and all preceding transactions in this block

`type cumulativeGasUsed = quantity;

`

##### effectiveGasPrice

 Pre-London, it is equal to the transaction's gasPrice. Post-London, it is equal to the actual gas price paid for inclusion.

`type effectiveGasPrice = quantity;

`

##### from

 Transaction sender

`type from = Address;

`

##### gasUsed

 Gas used by this transaction

`type gasUsed = quantity;

`

##### logs

 List of log objects generated by this transaction

`type logs = Array<Log<quantity, index, false>>;

`

##### logsBloom

 Logs bloom filter

`type logsBloom = Hex;

`

##### root

 The post-transaction state root. Only specified for transactions included before the Byzantium upgrade.

`type root = Hash;

`

##### status

`success` if this transaction was successful or `reverted` if it failed

`type status = status;

`

##### to

 Transaction recipient or `null` if deploying a contract

`type to = Address | null;

`

##### transactionHash

 Hash of this transaction

`type transactionHash = Hash;

`

##### transactionIndex

 Index of this transaction in the block

`type transactionIndex = index;

`

##### type

 Transaction type

`type type = type;

`
## SiweAuthOptions

 Options for Setting up SIWE (Sign in with Ethereum) Authentication

`type SiweAuthOptions = {

doLogin: (params: [VerifyLoginPayloadParams](https://portal.thirdweb.com/references/typescript/v5/VerifyLoginPayloadParams)) => Promise<void>;

doLogout: () => Promise<void>;

getLoginPayload: (params: {

address: string;

chainId: number;

 }) => Promise<[LoginPayload](https://portal.thirdweb.com/references/typescript/v5/LoginPayload)>;

isLoggedIn: (address: string) => Promise<boolean>;

};

`

##### doLogin

##### Signature

`function doLogin(params: [VerifyLoginPayloadParams](https://portal.thirdweb.com/references/typescript/v5/VerifyLoginPayloadParams)): Promise<void>;

`

##### Parameters

##### params

###### Type

`let params: { payload: [LoginPayload](https://portal.thirdweb.com/references/typescript/v5/LoginPayload); signature: string };

`

##### Returns

##### Return Type

`let returnType: Promise<void>;

`

##### doLogout

##### Signature

`function doLogout(): Promise<void>;

`

##### Returns

##### Return Type

`let returnType: Promise<void>;

`

##### getLoginPayload

##### Signature

`function getLoginPayload(params: {

address: string;

chainId: number;

}): Promise<[LoginPayload](https://portal.thirdweb.com/references/typescript/v5/LoginPayload)>;

`

##### Parameters

##### params

 The parameters to get the login payload for.

###### Type

`let params: { address: string; chainId: number };

`

##### Returns

##### Return Type

`let returnType: {

address: string;

chain_id?: string;

domain: string;

expiration_time: string;

invalid_before: string;

issued_at: string;

nonce: string;

resources?: Array<string>;

statement: string;

uri?: string;

version: string;

};

`

##### isLoggedIn

##### Signature

`function isLoggedIn(address: string): Promise<boolean>;

`

##### Parameters

##### address

###### Type

`let address: string;

`

##### Returns

##### Return Type

`let returnType: Promise<boolean>;

`
## TransferEventFilters

 Represents the filters for the "Transfer" event.

`type TransferEventFilters = Partial<{

from: AbiParameterToPrimitiveType<{

indexed: true;

name: "from";

type: "address";

 }>;

to: AbiParameterToPrimitiveType<{

indexed: true;

name: "to";

type: "address";

 }>;

}>;

`
## TransferBatchParams

 Represents the parameters for a batch transfer operation.

`type TransferBatchParams = Prettify<{

batch: Array<

 { to: string } & (

| { amount: number | string }

| { amountWei: bigint }

 )

 >;

}>;

`
## TransferEventFilters

 Represents the filters for the "Transfer" event.

`type TransferEventFilters = Partial<{

from: AbiParameterToPrimitiveType<{

indexed: true;

name: "from";

type: "address";

 }>;

to: AbiParameterToPrimitiveType<{

indexed: true;

name: "to";

type: "address";

 }>;

tokenId: AbiParameterToPrimitiveType<{

indexed: true;

name: "tokenId";

type: "uint256";

 }>;

}>;

`
## TransactionButton

 TransactionButton component is used to render a button that triggers a transaction. It shows a "Switch Network" button if the connected wallet is on a different chain than the transaction.

### Example

####  Basic usage

`<TransactionButton

transaction={() => {}}

onTransactionConfirmed={handleSuccess}

onError={handleError}

>

 Confirm Transaction

</TransactionButton>;

`

####  Customize the styling by passing the `unstyled` prop and your inline styles and/or classes:

`<TransactionButton

transaction={() => {}}

unstyled

className="bg-white text-black rounded-md p-4 flex items-center justify-center"

>

 Confirm Transaction

</TransactionButton>;

`

####  Handle errors

`<TransactionButton

transaction={() => ...}

onError={(err) => {

alert(err.message);

// Add your own logic here

 }}

>

 Confirm Transaction

</TransactionButton>

`

####  Alert when a transaction is sent

`<TransactionButton

transaction={() => ...}

onTransactionSent={(tx) => {

alert("transaction sent!");

// Add your own logic here. For example, a toast

 }}

>

 Confirm Transaction

</TransactionButton>

`

####  Alert when a transaction is completed

`<TransactionButton

transaction={() => ...}

onTransactionConfirmed={(tx) => {

alert("transaction sent!");

 console.log(tx);

// Add your own logic here. For example, a toast

 }}

>

 Confirm Transaction

</TransactionButton>

`

####  The onClick prop, if provided, will be called before the transaction is sent.

`<TransactionButton

onClick={() => alert("Transaction is about to be sent")}

transaction={...}

>

 ...

</TransactionButton>

`

####  Attach custom Pay metadata

`<TransactionButton

payModal={{

// This image & title will show up in the Pay modal

 metadata: {

 name: "Van Gogh Starry Night",

 image: "https://unsplash.com/starry-night.png",

 },

 }}

>

 ...

</TransactionButton>;

`

####  Gasless usage with [ thirdweb Engine](https://portal.thirdweb.com/engine)

`<TransactionButton

gasless={{

 provider: "engine",

 relayerUrl:

"https://thirdweb.engine-***.thirdweb.com/relayer/***",

 relayerForwarderAddress: "0x...",

 }}

>

 ...

</TransactionButton>;

`

####  Gasless usage with OpenZeppelin

`<TransactionButton

gasless={{

 provider: "openzeppelin",

 relayerUrl: "https://...",

 relayerForwarderAddress: "0x...",

 }}

>

 ...

</TransactionButton>;

`

##### Signature

`function TransactionButton(props: [TransactionButtonProps](https://portal.thirdweb.com/references/typescript/v5/TransactionButtonProps)): Element;

`

### Parameters

##### props

 The props for this component. Refer to [ TransactionButtonProps](https://portal.thirdweb.com/references/typescript/v5/TransactionButtonProps) for details.

#### Type

`let props: {

children: React.ReactNode;

className?: string;

disabled?: boolean;

gasless?: [GaslessOptions](https://portal.thirdweb.com/references/typescript/v5/GaslessOptions);

onClick?: () => void;

onError?: (error: Error) => void;

onTransactionConfirmed?: (receipt: TransactionReceipt) => void;

onTransactionSent?: (

transactionResult: [WaitForReceiptOptions](https://portal.thirdweb.com/references/typescript/v5/WaitForReceiptOptions),

 ) => void;

payModal?: [SendTransactionPayModalConfig](https://portal.thirdweb.com/references/typescript/v5/SendTransactionPayModalConfig);

style?: React.CSSProperties;

theme?: "dark" | "light" | [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme);

transaction: () =>

| [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any>

| Promise<[PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any>>;

type?: HTMLButtonElement["type"];

unstyled?: boolean;

};

`

### Returns

##### Return Type

`let returnType: Element;

`
## TransferForParams

 Represents the parameters for the "transferFor" function.

`type TransferForParams = WithOverrides<{

from: AbiParameterToPrimitiveType<{

name: "from";

type: "address";

 }>;

fromDeadline: AbiParameterToPrimitiveType<{

name: "fromDeadline";

type: "uint256";

 }>;

fromSig: AbiParameterToPrimitiveType<{

name: "fromSig";

type: "bytes";

 }>;

to: AbiParameterToPrimitiveType<{ name: "to"; type: "address" }>;

toDeadline: AbiParameterToPrimitiveType<{

name: "toDeadline";

type: "uint256";

 }>;

toSig: AbiParameterToPrimitiveType<{

name: "toSig";

type: "bytes";

 }>;

}>;

`
## TransferFromParams

 Represents the parameters for the `transferFrom` function.

`type TransferFromParams = Prettify<

WithOverrides<

 { from: Address; to: Address } & (

| { amount: number | string }

| { amountWei: bigint }

 )

 >

>;

`
## TransferFromParams

 Represents the parameters for the "transferFrom" function.

`type TransferFromParams = WithOverrides<{

from: AbiParameterToPrimitiveType<{

name: "from";

type: "address";

 }>;

to: AbiParameterToPrimitiveType<{ name: "to"; type: "address" }>;

tokenId: AbiParameterToPrimitiveType<{

name: "tokenId";

type: "uint256";

 }>;

}>;

`
## TransferOwnershipParams

 Represents the parameters for the "transferOwnership" function.

`type TransferOwnershipParams = WithOverrides<{

newOwner: AbiParameterToPrimitiveType<{

name: "newOwner";

type: "address";

 }>;

}>;

`
## TransferParams

 Represents the parameters for the "transfer" function.

`type TransferParams = WithOverrides<{

deadline: AbiParameterToPrimitiveType<{

name: "deadline";

type: "uint256";

 }>;

sig: AbiParameterToPrimitiveType<{ name: "sig"; type: "bytes" }>;

to: AbiParameterToPrimitiveType<{ name: "to"; type: "address" }>;

}>;

`
## TryAggregateParams

 Represents the parameters for the "tryAggregate" function.

`type TryAggregateParams = WithOverrides<{

calls: AbiParameterToPrimitiveType<{

components: [

 { name: "target"; type: "address" },

 { name: "callData"; type: "bytes" },

 ];

name: "calls";

type: "tuple[]";

 }>;

requireSuccess: AbiParameterToPrimitiveType<{

name: "requireSuccess";

type: "bool";

 }>;

}>;

`
## TransferParams

 Represents the parameters for a transfer operation.

`type TransferParams = Prettify<

WithOverrides<

 { to: string } & (

| { amount: number | string }

| { amountWei: bigint }

 )

 >

>;

`
## TransferSingleEventFilters

 Represents the filters for the "TransferSingle" event.

`type TransferSingleEventFilters = Partial<{

_from: AbiParameterToPrimitiveType<{

indexed: true;

name: "_from";

type: "address";

 }>;

_operator: AbiParameterToPrimitiveType<{

indexed: true;

name: "_operator";

type: "address";

 }>;

_to: AbiParameterToPrimitiveType<{

indexed: true;

name: "_to";

type: "address";

 }>;

}>;

`
## TryBlockAndAggregateParams

 Represents the parameters for the "tryBlockAndAggregate" function.

`type TryBlockAndAggregateParams = WithOverrides<{

calls: AbiParameterToPrimitiveType<{

components: [

 { name: "target"; type: "address" },

 { name: "callData"; type: "bytes" },

 ];

name: "calls";

type: "tuple[]";

 }>;

requireSuccess: AbiParameterToPrimitiveType<{

name: "requireSuccess";

type: "bool";

 }>;

}>;

`
## UninstallModuleByProxyOptions

`` type UninstallModuleByProxyOptions = {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

moduleData?: `0x${string}`;

moduleProxyAddress: string;

};

 ``

##### chain

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### contract

`type contract = [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

`

##### moduleData

`` type moduleData = `0x${string}`;

 ``

##### moduleProxyAddress

`type moduleProxyAddress = string;

`
## UninstallPublishedModuleOptions

`` type UninstallPublishedModuleOptions = {

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

moduleData?: `0x${string}`;

moduleName: string;

publisherAddress?: string;

version?: string;

};

 ``

##### contract

`type contract = [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

`

##### moduleData

`` type moduleData = `0x${string}`;

 ``

##### moduleName

`type moduleName = string;

`

##### publisherAddress

`type publisherAddress = string;

`

##### version

`type version = string;

`
## UninstallModuleParams

 Represents the parameters for the "uninstallModule" function.

`type UninstallModuleParams = WithOverrides<{

data: AbiParameterToPrimitiveType<{ name: "data"; type: "bytes" }>;

moduleContract: AbiParameterToPrimitiveType<{

name: "moduleContract";

type: "address";

 }>;

}>;

`
## UnpinOptions

`type UnpinOptions = { cid: string; client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient) };

`

##### cid

`type cid = string;

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`
## UnpublishContractParams

 Represents the parameters for the "unpublishContract" function.

`type UnpublishContractParams = WithOverrides<{

contractId: AbiParameterToPrimitiveType<{

name: "contractId";

type: "string";

 }>;

publisher: AbiParameterToPrimitiveType<{

name: "publisher";

type: "address";

 }>;

}>;

`
## UpdateMetadataParams

`type UpdateMetadataParams = {

newMetadata: [NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput);

targetTokenId: bigint;

};

`

##### newMetadata

`type newMetadata = [NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput);

`

##### targetTokenId

`type targetTokenId = bigint;

`
## UpdateListingParams

`type UpdateListingParams = {

assetContractAddress?: Address;

currencyContractAddress?: Address;

endTimestamp?: Date;

isReservedListing?: boolean;

listingId: bigint;

quantity?: bigint;

startTimestamp?: Date;

tokenId?: bigint;

} & ({ pricePerToken: string } | { pricePerTokenWei: string });

`
## UpdateMetadataParams

`type UpdateMetadataParams = {

newMetadata: [NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput);

targetTokenId: bigint;

};

`

##### newMetadata

`type newMetadata = [NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput);

`

##### targetTokenId

`type targetTokenId = bigint;

`
## UpdateQuorumNumeratorParams

 Represents the parameters for the "updateQuorumNumerator" function.

`type UpdateQuorumNumeratorParams = WithOverrides<{

newQuorumNumerator: AbiParameterToPrimitiveType<{

name: "newQuorumNumerator";

type: "uint256";

 }>;

}>;

`
## UpdateTokenURIParams

`type UpdateTokenURIParams = {

newMetadata: [NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput);

tokenId: bigint;

};

`

##### newMetadata

`type newMetadata = [NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput);

`

##### tokenId

`type tokenId = bigint;

`
## UpdatedListingEventFilters

 Represents the filters for the "UpdatedListing" event.

`type UpdatedListingEventFilters = Partial<{

assetContract: AbiParameterToPrimitiveType<{

indexed: true;

name: "assetContract";

type: "address";

 }>;

listingCreator: AbiParameterToPrimitiveType<{

indexed: true;

name: "listingCreator";

type: "address";

 }>;

listingId: AbiParameterToPrimitiveType<{

indexed: true;

name: "listingId";

type: "uint256";

 }>;

}>;

`
## UploadMetadataParams

`type UploadMetadataParams = { metadatas: Array<[NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput) | string> };

`

##### metadatas

`type metadatas = Array<[NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput) | string>;

`
## UpdateTokenURIParams

`type UpdateTokenURIParams = {

newMetadata: [NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput);

tokenId: bigint;

};

`

##### newMetadata

`type newMetadata = [NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput);

`

##### tokenId

`type tokenId = bigint;

`
## UseBlockNumberOptions

`type UseBlockNumberOptions = {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

enabled?: boolean;

watch?: boolean;

};

`

##### chain

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### enabled

`type enabled = boolean;

`

##### watch

`type watch = boolean;

`
## UriParams

 Represents the parameters for the "uri" function.

`type UriParams = {

tokenId: AbiParameterToPrimitiveType<{

name: "tokenId";

type: "uint256";

 }>;

};

`

##### tokenId

`type tokenId = AbiParameterToPrimitiveType<{

name: "tokenId";

type: "uint256";

}>;

`
## UseConnectModalOptions

 Options for configuring Connect Modal for [useConnectModal](https://portal.thirdweb.com/references/typescript/v5/useConnectModal) hook

`type UseConnectModalOptions = {

accountAbstraction?: [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions);

appMetadata?: AppMetadata;

auth?: [SiweAuthOptions](https://portal.thirdweb.com/references/typescript/v5/SiweAuthOptions);

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

chains?: Array<[Chain](https://portal.thirdweb.com/references/typescript/v5/Chain)>;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

locale?: [LocaleId](https://portal.thirdweb.com/references/typescript/v5/LocaleId);

privacyPolicyUrl?: string;

recommendedWallets?: Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

setActive?: boolean;

showAllWallets?: boolean;

showThirdwebBranding?: boolean;

size?: "compact" | "wide";

termsOfServiceUrl?: string;

theme?: "dark" | "light" | [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme);

title?: string;

titleIcon?: string;

walletConnect?: { projectId?: string };

wallets?: Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

welcomeScreen?: [WelcomeScreen](https://portal.thirdweb.com/references/typescript/v5/WelcomeScreen);

};

`

##### accountAbstraction

 Enable Account abstraction for all wallets. This will connect to the users's smart account based on the connected personal wallet and the given options.

 This allows to sponsor gas fees for your user's transaction using the thirdweb account abstraction infrastructure.

`* function Example() {

const { connect } = useConnectModal();

async function handleConnect() {

await connect({

 client,

 accountAbstraction: {

 factoryAddress: "0x123...",

 chain: sepolia,

 sponsorGas: true

 }

 })

}

return (

 <button> onClick={handleConnect}>

 Connect

 </button>

)

}

`

`type accountAbstraction = [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions);

`

##### appMetadata

 Metadata of the app that will be passed to connected wallet. Setting this is highly recommended.

 Some wallets display this information to the user when they connect to your app.

`type appMetadata = AppMetadata;

`

### Example

`{

name: "My App",

url: "https://my-app.com",

description: "some description about your app",

logoUrl: "https://path/to/my-app/logo.svg",

};

`

##### auth

 Enable SIWE (Sign in with Ethererum) by passing an object of type `SiweAuthOptions` to enforce the users to sign a message after connecting their wallet to authenticate themselves.

 Refer to the [SiweAuthOptions](https://portal.thirdweb.com/references/typescript/v5/SiweAuthOptions) for more details

`type auth = [SiweAuthOptions](https://portal.thirdweb.com/references/typescript/v5/SiweAuthOptions);

`

##### chain

 The [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain) object of the blockchain you want the wallet to connect to

 If a `chain` is not specified, Wallet will be connected to whatever is the default set in the wallet.

 If a `chain` is specified, Wallet will be prompted to switch to given chain after connection if it is not already connected to it. This ensures that the wallet is connected to the correct blockchain before interacting with your app.

 You can create a `Chain` object using the [defineChain](https://portal.thirdweb.com/references/typescript/v5/defineChain) function. At minimum, you need to pass the `id` of the blockchain to `defineChain` function to create a `Chain` object.

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### chains

 Array of chains that your app supports.

 This is only relevant if your app is a multi-chain app and works across multiple blockchains. If your app only works on a single blockchain, you should only specify the `chain` prop.

 Given list of chains will be sent to wallet at the time of connection if the wallet supports requesting multiple chains ( example: WalletConnect ) so that users can switch between the chains post connection easily

 You can create a `Chain` object using the [defineChain](https://portal.thirdweb.com/references/typescript/v5/defineChain) function. At minimum, you need to pass the `id` of the blockchain to `defineChain` function to create a `Chain` object.

`import { defineChain } from "thirdweb/react";

const polygon = defineChain({

 id: 137,

});

`

`type chains = Array<[Chain](https://portal.thirdweb.com/references/typescript/v5/Chain)>;

`

##### client

 A client is the entry point to the thirdweb SDK. It is required for all other actions. You can create a client using the `createThirdwebClient` function. Refer to the [ Creating a Client](https://portal.thirdweb.com/typescript/v5/client) documentation for more information.

 You must provide a `clientId` or `secretKey` in order to initialize a client. Pass `clientId` if you want for client-side usage and `secretKey` for server-side usage.

`import { createThirdwebClient } from "thirdweb";

const client = createThirdwebClient({

 clientId: "<your_client_id>",

});

`

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### locale

 By default - Connect Modal UI uses the `en-US` locale for english language users.

 You can customize the language used in the Connect Modal UI by setting the `locale` prop.

 Refer to the [LocaleId](https://portal.thirdweb.com/references/typescript/v5/LocaleId) type for supported locales.

`type locale = [LocaleId](https://portal.thirdweb.com/references/typescript/v5/LocaleId);

`

##### privacyPolicyUrl

 URL of the "privacy policy" page

 If provided, Modal will show a Privacy Policy message at the bottom with below link

`type privacyPolicyUrl = string;

`

##### recommendedWallets

 Wallets to show as recommended in the Connect Modal

`type recommendedWallets = Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

`

##### setActive

 Whether to set the connected wallet as active wallet or not

 By default, It is set to `true`

 You can set it to `false` and use the retunred wallet from the `connect` method if you want to connect wallet without setting it as active wallet

`type setActive = boolean;

`

### Example

`function Example() {

const { connect } = useConnectModal();

return (

 <button>

 {" "}

 onClick=

 {async () => {

 const wallet = await connect({ setActive: false, client });

 }}

> Connect

</button>

 );

}

`

##### showAllWallets

 By default, Connect modal shows a "All Wallets" button that shows a list of 500+ wallets.

 You can disable this button by setting `showAllWallets` prop to `false`

`type showAllWallets = boolean;

`

##### showThirdwebBranding

 By default Connect Modal shows "Powered by Thirdweb" branding at the bottom of the Modal.

 If you want to hide the branding, set this prop to `false`

`type showThirdwebBranding = boolean;

`

##### size

 Set the size of the connect modal on desktop - `"compact"` or `"wide"`

 Modal size is always `compact` on mobile

 By default it is `"wide"` for desktop.

`type size = "compact" | "wide";

`

##### termsOfServiceUrl

 URL of the "terms of service" page

 If provided, Modal will show a Terms of Service message at the bottom with below link

`type termsOfServiceUrl = string;

`

##### theme

 Set the theme for the Connect Modal. By default it is set to `"dark"`

 theme can be set to either `"dark"` , `"light"` or a custom theme object. You can also import [lightTheme](https://portal.thirdweb.com/references/typescript/v5/lightTheme)or [darkTheme](https://portal.thirdweb.com/references/typescript/v5/darkTheme)functions from `thirdweb/react` to use the default themes as base and overrides parts of it.

`type theme = "dark" | "light" | [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme);

`

### Example

`import { lightTheme } from "thirdweb/react";

const customTheme = lightTheme({

 colors: {

 modalBg: "red",

 },

});

`

##### title

 Title to show in Connect Modal

 The default is `"Connect"`

`type title = string;

`

##### titleIcon

 Replace the default thirdweb icon next to Modal title with your own icon

 Set to empty string (`""` ) to hide the icon

`type titleIcon = string;

`

##### walletConnect

 Configure options for WalletConnect

 By default WalletConnect uses the thirdweb's default project id. Setting your own project id is recommended.

 You can create a project id by signing up on [ walletconnect.com](https://walletconnect.com/)

`type walletConnect = { projectId?: string };

`

##### wallets

 Array of supported wallets. If not provided, default wallets will be used.

`type wallets = Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

`

### Example

`import { AutoConnect } from "thirdweb/react";

import { createWallet, inAppWallet } from "thirdweb/wallets";

const wallets = [

inAppWallet(),

createWallet("io.metamask"),

createWallet("com.coinbase.wallet"),

createWallet("me.rainbow"),

];

function Example() {

const { connect } = useConnectModal();

return (

 <button>

{" "}

 onClick={() => connect({ wallets, client })}> Connect{" "}

 </button>

 );

}

`

 If no wallets are specified. The component will show All the EIP-6963 compliant installed wallet extensions, as well as below default wallets:

`const defaultWallets = [

inAppWallet(),

createWallet("io.metamask"),

createWallet("com.coinbase.wallet"),

createWallet("me.rainbow"),

createWallet("io.zerion.wallet"),

];

`

 Connect Modal also shows a "All wallets" button at the end of wallet list which allows user to connect to any of the 500+ wallets

##### welcomeScreen

 Customize the welcome screen. This prop is only applicable when modal size prop is set to "wide". On "wide" Modal size, a welcome screen is shown on the right side of the modal.

 This screen can be customized in two ways

#####  1\. Customize Metadata and Image

`const welcomeScreen = {

 title: "your title",

 subtitle: "your subtitle",

 img: {

 src: "https://your-image-url.png",

 width: 300,

 height: 50,

 },

};

`

#####  2\. Render Custom Component

`const welcomeScreen = () => <YourCustomComponent />;

`

`type welcomeScreen = [WelcomeScreen](https://portal.thirdweb.com/references/typescript/v5/WelcomeScreen);

`
## UseNetworkSwitcherModalOptions

 Options for the `useNetworkSwitcherModal` hook's returned `open` function

`type UseNetworkSwitcherModalOptions = {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

locale?: [LocaleId](https://portal.thirdweb.com/references/typescript/v5/LocaleId);

onCustomClick?: () => void;

onSwitch?: (chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain)) => void;

renderChain?: React.FC<NetworkSelectorChainProps>;

sections?: Array<ChainSection>;

theme?: [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme) | "dark" | "light";

};

`

##### client

 A client is the entry point to the thirdweb SDK. It is required for all other actions. You can create a client using the `createThirdwebClient` function. Refer to the [ Creating a Client](https://portal.thirdweb.com/typescript/v5/client) documentation for more information.

 You must provide a `clientId` or `secretKey` in order to initialize a client. Pass `clientId` if you want for client-side usage and `secretKey` for server-side usage.

`import { createThirdwebClient } from "thirdweb";

const client = createThirdwebClient({

 clientId: "<your_client_id>",

});

`

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### locale

 By default - NetworkSwitcher UI uses the `en-US` locale for english language users.

 You can customize the language used in the ConnectButton UI by setting the `locale` prop.

 Refer to the [LocaleId](https://portal.thirdweb.com/references/typescript/v5/LocaleId) type for supported locales.

`type locale = [LocaleId](https://portal.thirdweb.com/references/typescript/v5/LocaleId);

`

##### onCustomClick

##### Signature

`function onCustomClick(): void;

`

##### Returns

##### Return Type

`let returnType: void;

`

##### onSwitch

##### Signature

`function onSwitch(chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain)): void;

`

##### Parameters

##### chain

 The `Chain` of the chain that was switched to

###### Type

`let chain: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`

##### Returns

##### Return Type

`let returnType: void;

`

##### renderChain

 Override how the chain button is rendered in the Modal

`type renderChain = React.FC<NetworkSelectorChainProps>;

`

##### sections

 Specify sections of chains to be displayed in the Network Selector Modal

`type sections = Array<ChainSection>;

`

### Example

 To display "Polygon", "Avalanche" chains under "Recently used" section and "Ethereum", "Arbitrum" chains under "Popular" section, you can set the prop with the following value

`import { arbitrum, base, ethereum, polygon } from "thirdweb/chains";

const sections = [

 { label: "Recently used", chains: [arbitrum, polygon] },

 { label: "Popular", chains: [base, ethereum] },

];

`

##### theme

 Set the theme for the `NetworkSwitcher` Modal. By default it is set to `"dark"`

 theme can be set to either `"dark"` , `"light"` or a custom theme object.

 You can also import [lightTheme](https://portal.thirdweb.com/references/typescript/v5/lightTheme)or [darkTheme](https://portal.thirdweb.com/references/typescript/v5/darkTheme)functions from `thirdweb/react` to use the default themes as base and overrides parts of it.

`type theme = [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme) | "dark" | "light";

`

### Example

`import { lightTheme } from "thirdweb/react";

const customTheme = lightTheme({

 colors: {

 modalBg: "red",

 },

});

`
## UseWalletDetailsModalOptions

`type UseWalletDetailsModalOptions = {

assetTabs?: Array<AssetTabs>;

chains?: Array<[Chain](https://portal.thirdweb.com/references/typescript/v5/Chain)>;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

connectedAccountAvatarUrl?: string;

connectedAccountName?: React.ReactNode;

connectOptions?: DetailsModalConnectOptions;

displayBalanceToken?: Record<number, string>;

footer?: (props: { close: () => void }) => JSX.Element;

hideBuyFunds?: boolean;

hideDisconnect?: boolean;

hideReceiveFunds?: boolean;

hideSendFunds?: boolean;

hideSwitchWallet?: boolean;

locale?: [LocaleId](https://portal.thirdweb.com/references/typescript/v5/LocaleId);

networkSelector?: [NetworkSelectorProps](https://portal.thirdweb.com/references/typescript/v5/NetworkSelectorProps);

onClose?: (screen: string) => void;

onDisconnect?: (info: { account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account); wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet) }) => void;

payOptions?: Extract<[PayUIOptions](https://portal.thirdweb.com/references/typescript/v5/PayUIOptions), { mode?: "fund_wallet" }>;

showBalanceInFiat?: SupportedFiatCurrency;

showTestnetFaucet?: boolean;

supportedNFTs?: SupportedNFTs;

supportedTokens?: [SupportedTokens](https://portal.thirdweb.com/references/typescript/v5/SupportedTokens);

theme?: "light" | "dark" | [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme);

};

`

##### assetTabs

 When you click on "View Assets", by default the "Tokens" tab is shown first. If you want to show the "NFTs" tab first, change the order of the asset tabs to: \["nft", "token"\] Note: If an empty array is passed, the \[View Funds\] button will be hidden

`type assetTabs = Array<AssetTabs>;

`

##### chains

 Array of chains that your app supports. They will be displayed in the network selector in the screen.

 This is only relevant if your app is a multi-chain app and works across multiple blockchains. If your app only works on a single blockchain, you should only specify the `chain` prop.

 You can create a `Chain` object using the [defineChain](https://portal.thirdweb.com/references/typescript/v5/defineChain) function. At minimum, you need to pass the `id` of the blockchain to `defineChain` function to create a `Chain` object.

`import { defineChain } from "thirdweb/react";

const polygon = defineChain({

 id: 137,

});

`

`type chains = Array<[Chain](https://portal.thirdweb.com/references/typescript/v5/Chain)>;

`

##### client

 A client is the entry point to the thirdweb SDK. It is required for all other actions. You can create a client using the `createThirdwebClient` function. Refer to the [ Creating a Client](https://portal.thirdweb.com/typescript/v5/client) documentation for more information.

 You must provide a `clientId` or `secretKey` in order to initialize a client. Pass `clientId` if you want for client-side usage and `secretKey` for server-side usage.

`import { createThirdwebClient } from "thirdweb";

const client = createThirdwebClient({

 clientId: "<your_client_id>",

});

`

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### connectedAccountAvatarUrl

 Use custom avatar URL for the connected wallet image in the `ConnectButton` Details Modal, overriding ENS avatar or Blobbie icon.

`type connectedAccountAvatarUrl = string;

`

##### connectedAccountName

 Render custom UI for the connected wallet name in the `ConnectButton` Details Modal, overriding ENS name or wallet address.

`type connectedAccountName = React.ReactNode;

`

##### connectOptions

 Options to configure the Connect UI shown when user clicks the "Connect Wallet" button in the Wallet Switcher screen.

`type connectOptions = DetailsModalConnectOptions;

`

##### displayBalanceToken

 Display the balance of a token instead of the native token

`type displayBalanceToken = Record<number, string>;

`

### Example

`const displayBalanceToken = {

// show USDC balance when connected to Ethereum mainnet or Polygon

 [ethereum.id]: "0x2260FAC5E5542a773Aa44fBCfeDf7C193bc2C599",

 [polygon.id]: "0x3c499c542cEF5E3811e1192ce70d8cC03d5c3359",

};

`

##### footer

##### Signature

`function footer(props: { close: () => void }): JSX.Element;

`

##### Parameters

##### props

###### Type

`let props: { close: () => void };

`

##### Returns

##### Return Type

`let returnType: JSX.Element;

`

##### hideBuyFunds

 Hide the "Buy Funds" button in the Details Modal.

 By default the "Buy Funds" button is shown.

`type hideBuyFunds = boolean;

`

##### hideDisconnect

 Hide the "Disconnect Wallet" button in the Wallet Details Modal.

 By default it is `false`

`type hideDisconnect = boolean;

`

##### hideReceiveFunds

 Hide the "Receive Funds" button in the Details Modal.

 By default the "Receive Funds" button is shown.

`type hideReceiveFunds = boolean;

`

##### hideSendFunds

 Hide the "Send Funds" button in the Details Modal.

 By default the "Send Funds" button is shown.

`type hideSendFunds = boolean;

`

##### hideSwitchWallet

 Hide the "Switch Wallet" button in the Wallet Details Modal.

 By default it is `false`

`type hideSwitchWallet = boolean;

`

##### locale

 By default - Details Modal UI uses the `en-US` locale for english language users.

 You can customize the language used in the Details Modal UI by setting the `locale` prop.

 Refer to the [LocaleId](https://portal.thirdweb.com/references/typescript/v5/LocaleId) type for supported locales.

`type locale = [LocaleId](https://portal.thirdweb.com/references/typescript/v5/LocaleId);

`

##### networkSelector

 customize the Network selector shown in the Wallet Details Modal

`type networkSelector = [NetworkSelectorProps](https://portal.thirdweb.com/references/typescript/v5/NetworkSelectorProps);

`

##### onClose

##### Signature

`function onClose(screen: string): void;

`

##### Parameters

##### screen

 The name of the screen that was being shown when user closed the modal

###### Type

`let screen: string;

`

##### Returns

##### Return Type

`let returnType: void;

`

##### onDisconnect

##### Signature

`function onDisconnect(info: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

}): void;

`

##### Parameters

##### info

###### Type

`let info: { account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account); wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet) };

`

##### Returns

##### Return Type

`let returnType: void;

`

##### payOptions

 Configure options for thirdweb Pay.

 thirdweb Pay allows users to buy tokens using crypto or fiat currency.

`type payOptions = Extract<[PayUIOptions](https://portal.thirdweb.com/references/typescript/v5/PayUIOptions), { mode?: "fund_wallet" }>;

`

##### showBalanceInFiat

 Show the token balance's value in fiat. Note: Not all tokens are resolvable to a fiat value. In that case, nothing will be shown.

`type showBalanceInFiat = SupportedFiatCurrency;

`

##### showTestnetFaucet

 Show a "Request Testnet funds" link in Wallet Details Modal when user is connected to a testnet.

 By default it is `false` , If you want to show the "Request Testnet funds" link when user is connected to a testnet, set this prop to `true`

`type showTestnetFaucet = boolean;

`

##### supportedNFTs

 Customize the NFTs shown in the "View Funds" screen in Details Modal for various networks.

 By default, The "View Funds" screen shows a few popular tokens for default chains and the native token. For other chains it only shows the native token.

`type supportedNFTs = SupportedNFTs;

`

### Example

 supportedTokens prop allows you to customize this list as shown below which shows "Pudgy Penguins" when a users wallet is connected to Ethereum mainnet.

`import { ConnectButton } from "thirdweb/react";

function Example() {

return (

 <ConnectButton

supportedNFTs={{

// when connected to Ethereum mainnet - show Pudgy Penguins

1: ["0xBd3531dA5CF5857e7CfAA92426877b022e612cf8"],

 }}

 />

 );

}

`

##### supportedTokens

 Customize the tokens shown in the "Send Funds" screen in Details Modal for various networks.

 By default, The "Send Funds" screen shows a few popular tokens for default chains and the native token. For other chains it only shows the native token.

`type supportedTokens = [SupportedTokens](https://portal.thirdweb.com/references/typescript/v5/SupportedTokens);

`

### Example

 supportedTokens prop allows you to customize this list as shown below which shows "Dai Stablecoin" when users wallet is connected to the "Base" mainnet.

`import { useWalletDetailsModal } from "thirdweb/react";

function Example() {

const detailsModal = useWalletDetailsModal();

function handleClick() {

 detailsModal.open({

 client,

 supportedTokens: {

84532: [

 {

 address: "0x50c5725949A6F0c72E6C4a641F24049A917DB0Cb", // token contract address

 name: "Dai Stablecoin",

 symbol: "DAI",

 icon: "https://assets.coingecko.com/coins/images/9956/small/Badge_Dai.png?1687143508",

 },

 ],

 },

 });

 }

return <button onClick={handleClick}> show wallet details </button>;

}

`

##### theme

 Set the theme for the Wallet Details Modal. By default it is set to `"dark"`

 theme can be set to either `"dark"` , `"light"` or a custom theme object. You can also import [lightTheme](https://portal.thirdweb.com/references/typescript/v5/lightTheme)or [darkTheme](https://portal.thirdweb.com/references/typescript/v5/darkTheme)functions from `thirdweb/react` to use the default themes as base and overrides parts of it.

`type theme = "light" | "dark" | [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme);

`

### Example

`import { lightTheme } from "thirdweb/react";

const customTheme = lightTheme({

 colors: {

 modalBg: "red",

 },

});

`
## UserOperation

`type UserOperation = {

callData: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

callGasLimit: bigint;

initCode: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

maxFeePerGas: bigint;

maxPriorityFeePerGas: bigint;

nonce: bigint;

paymasterAndData: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

preVerificationGas: bigint;

sender: ox__Address.Address;

signature: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

verificationGasLimit: bigint;

};

`

##### callData

`type callData = [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

`

##### callGasLimit

`type callGasLimit = bigint;

`

##### initCode

`type initCode = [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

`

##### maxFeePerGas

`type maxFeePerGas = bigint;

`

##### maxPriorityFeePerGas

`type maxPriorityFeePerGas = bigint;

`

##### nonce

`type nonce = bigint;

`

##### paymasterAndData

`type paymasterAndData = [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

`

##### preVerificationGas

`type preVerificationGas = bigint;

`

##### sender

`type sender = ox__Address.Address;

`

##### signature

`type signature = [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

`

##### verificationGasLimit

`type verificationGasLimit = bigint;

`
## VerifyEOASignatureParams

`type VerifyEOASignatureParams = {

address: string;

message: string | Message;

signature: string | Uint8Array;

};

`

##### address

`type address = string;

`

##### message

`type message = string | Message;

`

##### signature

`type signature = string | Uint8Array;

`
## VerifyLoginPayloadResult

`type VerifyLoginPayloadResult =

| { payload: VerifiedLoginPayload; valid: true }

| { error: string; valid: false };

`
## VerifyContractWalletSignatureParams

`type VerifyContractWalletSignatureParams = Prettify<

[VerifyEOASignatureParams](https://portal.thirdweb.com/references/typescript/v5/VerifyEOASignatureParams) & {

accountFactory?: { address: string; verificationCalldata: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex) };

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

 }

>;

`
## VerifyFidSignatureParams

 Represents the parameters for the "verifyFidSignature" function.

`type VerifyFidSignatureParams = {

custodyAddress: AbiParameterToPrimitiveType<{

name: "custodyAddress";

type: "address";

 }>;

digest: AbiParameterToPrimitiveType<{

name: "digest";

type: "bytes32";

 }>;

fid: AbiParameterToPrimitiveType<{ name: "fid"; type: "uint256" }>;

sig: AbiParameterToPrimitiveType<{ name: "sig"; type: "bytes" }>;

};

`

##### custodyAddress

`type custodyAddress = AbiParameterToPrimitiveType<{

name: "custodyAddress";

type: "address";

}>;

`

##### digest

`type digest = AbiParameterToPrimitiveType<{

name: "digest";

type: "bytes32";

}>;

`

##### fid

`type fid = AbiParameterToPrimitiveType<{

name: "fid";

type: "uint256";

}>;

`

##### sig

`type sig = AbiParameterToPrimitiveType<{

name: "sig";

type: "bytes";

}>;

`
## VerifyLoginPayloadParams

`type VerifyLoginPayloadParams = {

payload: [LoginPayload](https://portal.thirdweb.com/references/typescript/v5/LoginPayload);

signature: string;

};

`

##### payload

`type payload = [LoginPayload](https://portal.thirdweb.com/references/typescript/v5/LoginPayload);

`

##### signature

`type signature = string;

`
## VerifyTypedDataParams

`type VerifyTypedDataParams<

typedData extends

| ox__TypedData.TypedData

| Record<string, unknown> = ox__TypedData.TypedData,

primaryType extends

| keyof typedData

| "EIP712Domain" = keyof typedData,

> = Omit<VerifyHashParams, "hash"> &

ox__TypedData.Definition<typedData, primaryType> & {

accountFactory?: { address: string; verificationCalldata: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex) };

address: string;

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

signature: string | Uint8Array | ox__Signature.Signature;

 };

`
## WCAutoConnectOptions

`type WCAutoConnectOptions = {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

savedConnectParams?: SavedConnectParams;

};

`

##### chain

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### client

 A client is the entry point to the thirdweb SDK. It is required for all other actions. You can create a client using the `createThirdwebClient` function. Refer to the [ Creating a Client](https://portal.thirdweb.com/typescript/v5/client) documentation for more information.

 You must provide a `clientId` or `secretKey` in order to initialize a client. Pass `clientId` if you want for client-side usage and `secretKey` for server-side usage.

`import { createThirdwebClient } from "thirdweb";

const client = createThirdwebClient({

 clientId: "<your_client_id>",

});

`

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### savedConnectParams

`type savedConnectParams = SavedConnectParams;

`
## VoteType

`enum VoteType {

abstain,

against,

for,

}

`

#### abstain

`2;

`

#### against

`0;

`

#### for

`1;

`
## WCConnectOptions

`type WCConnectOptions = {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

walletConnect?: Prettify<

WalletConnectConfig & {

onDisplayUri?: (_uri: string) => void;

optionalChains?: Array<[Chain](https://portal.thirdweb.com/references/typescript/v5/Chain)>;

pairingTopic?: string;

qrModalOptions?: WalletConnectQRCodeModalOptions;

showQrModal?: boolean;

 }

 >;

};

`

##### chain

 The [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain) object of the blockchain you want the wallet to connect to

 If a `chain` is not specified, Wallet will be connected to whatever is the default set in the wallet.

 If a `chain` is specified, Wallet will be prompted to switch to given chain after connection if it is not already connected to it. This ensures that the wallet is connected to the correct blockchain before interacting with your app.

 You can create a `Chain` object using the [defineChain](https://portal.thirdweb.com/references/typescript/v5/defineChain) function. At minimum, you need to pass the `id` of the blockchain to `defineChain` function to create a `Chain` object.

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

### Example

`import { defineChain } from "thirdweb/react";

const polygon = defineChain({

 id: 137,

});

await wallet.connect({ chain: polygon });

`

##### client

 A client is the entry point to the thirdweb SDK. It is required for all other actions. You can create a client using the `createThirdwebClient` function. Refer to the [ Creating a Client](https://portal.thirdweb.com/typescript/v5/client) documentation for more information.

 You must provide a `clientId` or `secretKey` in order to initialize a client. Pass `clientId` if you want for client-side usage and `secretKey` for server-side usage.

`import { createThirdwebClient } from "thirdweb";

const client = createThirdwebClient({

 clientId: "<your_client_id>",

});

`

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### walletConnect

`type walletConnect = Prettify<

WalletConnectConfig & {

onDisplayUri?: (_uri: string) => void;

optionalChains?: Array<[Chain](https://portal.thirdweb.com/references/typescript/v5/Chain)>;

pairingTopic?: string;

qrModalOptions?: WalletConnectQRCodeModalOptions;

showQrModal?: boolean;

 }

>;

`
## WaitForReceiptOptions

`type WaitForReceiptOptions = Prettify<

SendTransactionResult & {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

maxBlocksWaitTime?: number;

 }

>;

`
## WaitForBundleOptions

`type WaitForBundleOptions = Prettify<{

bundleId: [WalletSendCallsId](https://portal.thirdweb.com/references/typescript/v5/WalletSendCallsId);

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

maxBlocksWaitTime?: number;

wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

}>;

`
## WCSupportedWalletIds

`type WCSupportedWalletIds =

| "io.metamask"

| "com.trustwallet.app"

| "com.okex.wallet"

| "com.bitget.web3"

| "com.binance"

| "org.uniswap"

| "com.safepal"

| "me.rainbow"

| "com.bybit"

| "pro.tokenpocket"

| "com.ledger"

| "xyz.timelesswallet"

| "global.safe"

| "io.zerion.wallet"

| "com.robinhood.wallet"

| "io.1inch.wallet"

| "com.crypto.wallet"

| "com.exodus"

| "xyz.argent"

| "im.token"

| "com.blockchain"

| "io.magiceden.wallet"

| "com.kraken"

| "app.backpack"

| "com.zengo"

| "com.mewwallet"

| "app.phantom"

| "com.fireblocks"

| "org.mathwallet"

| "com.alphawallet"

| "com.roninchain.wallet"

| "com.unstoppabledomains"

| "app.keyring"

| "xyz.frontier.wallet"

| "app.omni"

| "technology.obvious"

| "com.ambire"

| "com.mtpelerin"

| "io.internetmoney"

| "app.walletnow"

| "com.bitcoin"

| "io.alpha-u.wallet.web"

| "com.coin98"

| "io.myabcwallet"

| "co.arculus"

| "com.opera"

| "com.chain"

| "io.huddln"

| "com.get-verso"

| "me.haha"

| "pk.modular"

| "org.kelp"

| "io.clingon"

| "com.broearn"

| "com.coinomi"

| "com.ripio"

| "com.sabay.wallet"

| "io.tokoin"

| "world.fncy"

| "io.copiosa"

| "com.liberawallet"

| "io.certhis"

| "com.burritowallet"

| "io.ancrypto"

| "network.cvl"

| "io.cypherhq"

| "app.status"

| "io.enjin"

| "io.trinity-tech"

| "app.everspace"

| "io.kriptomat"

| "io.oxalus"

| "org.thetatoken"

| "io.leapwallet"

| "finance.islamicoin"

| "xyz.coca"

| "com.monarchwallet"

| "co.filwallet"

| "com.valoraapp"

| "com.coincircle"

| "money.snowball"

| "io.paraswap"

| "network.mrhb"

| "com.apollox"

| "com.ennowallet"

| "io.loopring.wallet"

| "com.bee"

| "cc.localtrade.lab"

| "com.xcapit"

| "io.safematrix"

| "com.neonwallet"

| "xyz.sequence"

| "app.linen"

| "io.nabox"

| "net.spatium"

| "com.cryptnox"

| "com.rktechworks"

| "pro.assure"

| "trade.flooz.wallet"

| "app.keplr"

| "com.crossmint"

| "com.pierwallet"

| "app.core"

| "app.keeper-wallet"

| "com.dcentwallet"

| "com.withpaper"

| "finance.klever"

| "app.edge"

| "com.neftipedia"

| "io.goldbit"

| "com.coingrig"

| "io.xfun"

| "io.ricewallet"

| "com.antiersolutions"

| "io.okse"

| "com.aktionariat"

| "com.itoken"

| "io.zelus"

| "com.cardstack"

| "com.paybolt"

| "org.arianee"

| "io.slavi"

| "com.plasma-wallet"

| "tech.defiantapp"

| "cc.avacus"

| "org.bytebank"

| "com.coolbitx.cwsapp"

| "com.optowallet"

| "network.trustkeys"

| "app.beewallet"

| "io.ttmwallet"

| "io.pltwallet"

| "io.helixid"

| "it.airgap"

| "app.qubic.wallet"

| "com.holdstation"

| "com.saakuru.app"

| "com.3swallet"

| "com.payperless"

| "digital.minerva"

| "finance.voltage"

| "com.lif3"

| "net.shinobi-wallet"

| "com.kryptogo"

| "com.feralfile.app"

| "com.bifrostwallet"

| "com.nufinetes"

| "io.wallet3"

| "com.abra"

| "app.imem"

| "com.premanft"

| "so.onekey.app.wallet"

| "finance.slingshot"

| "com.kriptonio"

| "xyz.timelesswallet"

| "xyz.ctrl"

| "io.streakk"

| "com.saitamatoken"

| "com.flowfoundation.wallet"

| "io.hippowallet"

| "io.cosmostation"

| "org.bitizen"

| "io.blocto"

| "com.humbl"

| "io.passpay"

| "app.ultimate"

| "me.astrox"

| "org.thorwallet"

| "app.fizzwallet"

| "org.arianee"

| "app.stickey"

| "com.klipwallet"

| "app.coinstats"

| "land.liker"

| "app.krystal"

| "fi.pillar"

| "io.harti"

| "net.stasis"

| "io.novawallet"

| "io.dttd"

| "com.foxwallet"

| "network.haqq"

| "com.tomi"

| "io.tradestrike"

| "app.subwallet"

| "tech.okto"

| "app.catecoin"

| "io.ukiss"

| "com.tellaw"

| "com.tangem"

| "is.callback"

| "io.summonersarena"

| "co.xellar"

| "io.talken"

| "xyz.uniultra.wallet"

| "io.ozonewallet"

| "com.tiduswallet"

| "world.ixo"

| "xyz.coca"

| "io.zelcore"

| "world.dosi.vault"

| "com.ullapay"

| "com.ellipal"

| "money.unstoppable"

| "dev.auroracloud"

| "zone.bitverse"

| "io.konio"

| "net.gateweb3"

| "app.utorg"

| "com.coinsdo"

| "app.ammer"

| "us.binance"

| "co.muza"

| "com.fxwallet"

| "app.ryipay"

| "org.dota168"

| "io.altme"

| "com.bitpie"

| "io.moonstake"

| "gg.indi"

| "io.yusetoken"

| "com.coininn"

| "io.functionx"

| "io.pockie"

| "com.amazewallet"

| "com.paliwallet"

| "me.easy"

| "live.superex"

| "com.secuxtech"

| "io.didwallet"

| "social.halo"

| "com.sinohope"

| "com.ballet"

| "com.opz"

| "io.fizen"

| "com.kresus"

| "com.midoin"

| "app.onto"

| "com.oasys-wallet"

| "org.gooddollar"

| "id.competence"

| "ai.spotonchain.platform"

| "network.dgg"

| "llc.besc"

| "app.gamic"

| "baby.smart"

| "network.gridlock"

| "app.zeal"

| "com.ivirse"

| "network.trustkeys"

| "ch.dssecurity"

| "com.concordium"

| "io.zkape"

| "com.thirdweb"

| "io.pitaka"

| "com.trusteeglobal"

| "org.mugambo"

| "cc.dropp"

| "xyz.roam.wallet"

| "world.qoin"

| "com.meld.app"

| "com.bestwallet"

| "io.hyperpay"

| "io.xucre"

| "app.herewallet"

| "com.cakewallet"

| "io.unagi.unawallet"

| "io.ethos"

| "app.pluswallet"

| "com.authentrend"

| "finance.plena"

| "com.bifrostwallet"

| "com.wemix"

| "com.gemwallet"

| "com.caesiumlab"

| "pro.fintoken"

| "com.peakdefi"

| "com.nodle"

| "com.cryptokara"

| "com.poolsmobility.wallet"

| "com.veworld"

| "com.azcoiner"

| "technology.jambo"

| "vc.uincubator.api"

| "app.m1nty"

| "io.noone"

| "com.bitso"

| "online.puzzle"

| "network.blackfort"

| "io.armana.portal"

| "io.bharatbox"

| "com.greengloryglobal"

| "com.x9wallet"

| "io.miraiapp"

| "io.kigo"

| "com.getcogni"

| "com.fastex.wallet"

| "io.wallacy"

| "org.talkapp"

| "io.zelus"

| "com.usecapsule"

| "com.unitywallet"

| "app.sinum"

| "finance.soulswap.app"

| "com.shapeshift"

| "finance.panaroma"

| "io.neopin"

| "com.alicebob"

| "co.cyber.wallet"

| "com.dextrade"

| "com.hashpack.wallet"

| "org.thepulsewallet"

| "id.co.pintu"

| "io.bladewallet"

| "com.pandoshi"

| "money.keychain"

| "finance.voltage"

| "com.mpcvault.broswerplugin"

| "io.legacynetwork"

| "io.getclave"

| "me.iopay"

| "app.kabila"

| "one.mixin.messenger"

| "com.bettatrade"

| "io.scramberry"

| "io.earthwallet"

| "xyz.nestwallet"

| "xyz.echooo"

| "net.myrenegade"

| "io.ready"

| "ai.hacken"

| "io.plutope"

| "io.trustasset"

| "app.dfinnwallet"

| "com.bmawallet"

| "net.spatium.wallet"

| "io.transi"

| "com.dolletwallet"

| "app.wombat"

| "fi.dropmate"

| "pub.dg"

| "com.icewal"

| "one.metapro.wallet"

| "xyz.bonuz"

| "io.shido"

| "co.lifedefi"

| "fun.tobi"

| "inc.tomo"

| "app.clot"

| "me.komet.app"

| "io.guardiianwallet"

| "io.wallypto"

| "com.safemoon"

| "com.elrond.maiar.wallet"

| "co.swopme"

| "com.bitpay"

| "app.tofee"

| "com.zypto"

| "xyz.orion"

| "io.uptn.dapp-web"

| "io.nabox"

| "io.compasswallet"

| "app.nicegram"

| "finance.openwallet"

| "com.bitget.web3"

| "com.tastycrypto"

| "com.ipmb"

| "com.daffione"

| "io.owallet"

| "com.beexo"

| "com.webauth"

| "id.plumaa"

| "social.gm2"

| "nl.greenhood.wallet"

| "com.companyname.swaptobe"

| "finance.porta"

| "org.alephium"

| "network.over"

| "io.walletverse"

| "com.berasig"

| "org.shefi"

| "com.wemixplay"

| "co.family.wallet"

| "io.legionnetwork"

| "com.bitnovo"

| "io.safecryptowallet"

| "ag.jup"

| "io.koalawallet"

| "io.nonbank"

| "io.universaleverything";

`
## Wallet

 Wallet interface

`type Wallet<TWalletId extends [WalletId](https://portal.thirdweb.com/references/typescript/v5/WalletId) = [WalletId](https://portal.thirdweb.com/references/typescript/v5/WalletId)> = {

getAdminAccount?: () => [Account](https://portal.thirdweb.com/references/typescript/v5/Account) | undefined;

getConfig: () => [CreateWalletArgs](https://portal.thirdweb.com/references/typescript/v5/CreateWalletArgs)<TWalletId>[1];

id: TWalletId;

onConnectRequested?: () => Promise<void>;

subscribe: [WalletEmitter](https://portal.thirdweb.com/references/typescript/v5/WalletEmitter)<TWalletId>["subscribe"];

autoConnect: (

options: [WalletAutoConnectionOption](https://portal.thirdweb.com/references/typescript/v5/WalletAutoConnectionOption)<TWalletId>,

 ) => Promise<[Account](https://portal.thirdweb.com/references/typescript/v5/Account)>;

connect: (

options: [WalletConnectionOption](https://portal.thirdweb.com/references/typescript/v5/WalletConnectionOption)<TWalletId>,

 ) => Promise<[Account](https://portal.thirdweb.com/references/typescript/v5/Account)>;

disconnect: () => Promise<void>;

getAccount: () => undefined | [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

getChain: () =>

| undefined

| Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

switchChain: (chain: Readonly) => Promise<void>;

};

`

##### getAdminAccount

##### Signature

`function getAdminAccount(): [Account](https://portal.thirdweb.com/references/typescript/v5/Account) | undefined;

`

##### Returns

##### Return Type

`let returnType: [Account](https://portal.thirdweb.com/references/typescript/v5/Account) | undefined;

`

##### getConfig

##### Signature

`function getConfig(): [CreateWalletArgs](https://portal.thirdweb.com/references/typescript/v5/CreateWalletArgs)<TWalletId>[1];

`

##### Returns

##### Return Type

`let returnType: [CreateWalletArgs](https://portal.thirdweb.com/references/typescript/v5/CreateWalletArgs)<TWalletId>[1];

`

##### id

 Unique identifier of the wallet

 For example, MetaMask wallet id is `"io.metamask"`

`type id = TWalletId;

`

### Example

`const wallet = createWallet("io.metamask");

console.log(wallet.id); // "io.metamask"

`

##### onConnectRequested

##### Signature

`function onConnectRequested(): Promise<void>;

`

##### Returns

##### Return Type

`let returnType: Promise<void>;

`

##### subscribe

 Subscribe to wallet for certain events like `chainChanged` , `accountChanged` , `disconnect` , etc.

`type subscribe = [WalletEmitter](https://portal.thirdweb.com/references/typescript/v5/WalletEmitter)<TWalletId>["subscribe"];

`

### Example

`wallet.subscribe("chainChanged", (chain) => {

 console.log("wallet is now connected to network:", chain);

});

wallet.subscribe("accountChanged", (account) => {

 console.log("wallet is now connected to account:", account);

});

wallet.subscribe("disconnect", () => {

 console.log("wallet is disconnected");

});

`

##### autoConnect

 Re-connect the wallet automatically without prompting the user for connection.

 This is useful to automatically connect the wallet if it was already connected in the past to reconnect wallet when user re-visits the website after some time or refreshes the page.

##### Signature

`function autoConnect(

options: [WalletAutoConnectionOption](https://portal.thirdweb.com/references/typescript/v5/WalletAutoConnectionOption)<TWalletId>,

): Promise<[Account](https://portal.thirdweb.com/references/typescript/v5/Account)>;

`

##### Parameters

##### options

 Options to auto-connect the wallet

###### Type

`let options: [WalletAutoConnectionOption](https://portal.thirdweb.com/references/typescript/v5/WalletAutoConnectionOption)<TWalletId>;

`

##### Returns

##### Return Type

`let returnType: {

address: Address;

estimateGas?: (tx: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)) => Promise<bigint>;

onTransactionRequested?: (

transaction: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any>,

 ) => Promise<void>;

sendBatchTransaction?: (

txs: Array<SendTransactionOption>,

 ) => Promise<SendTransactionResult>;

sendRawTransaction?: (

tx: SendRawTransactionOptions,

 ) => Promise<SendTransactionResult>;

sendTransaction: (

tx: SendTransactionOption,

 ) => Promise<SendTransactionResult>;

signAuthorization?: (

authorization: [AuthorizationRequest](https://portal.thirdweb.com/references/typescript/v5/AuthorizationRequest),

 ) => Promise<[SignedAuthorization](https://portal.thirdweb.com/references/typescript/v5/SignedAuthorization)>;

signMessage: ({

message,

originalMessage,

chainId,

 }: {

chainId?: number;

message: SignableMessage;

originalMessage?: string;

 }) => Promise<Hex>;

signTransaction?: (tx: SerializableTransaction) => Promise<Hex>;

signTypedData: (

_typedData: ox__TypedData.Definition<typedData, primaryType>,

 ) => Promise<Hex>;

watchAsset?: (asset: WatchAssetParams) => Promise<boolean>;

};

`

##### connect

 Prompt the user to connect the wallet.

##### Signature

`function connect(

options: [WalletConnectionOption](https://portal.thirdweb.com/references/typescript/v5/WalletConnectionOption)<TWalletId>,

): Promise<[Account](https://portal.thirdweb.com/references/typescript/v5/Account)>;

`

##### Parameters

##### options

 Options to connect the wallet. Depending on the wallet id, The options can be different.

###### Type

`let options: [WalletConnectionOption](https://portal.thirdweb.com/references/typescript/v5/WalletConnectionOption)<TWalletId>;

`

##### Returns

##### Return Type

`let returnType: {

address: Address;

estimateGas?: (tx: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)) => Promise<bigint>;

onTransactionRequested?: (

transaction: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any>,

 ) => Promise<void>;

sendBatchTransaction?: (

txs: Array<SendTransactionOption>,

 ) => Promise<SendTransactionResult>;

sendRawTransaction?: (

tx: SendRawTransactionOptions,

 ) => Promise<SendTransactionResult>;

sendTransaction: (

tx: SendTransactionOption,

 ) => Promise<SendTransactionResult>;

signAuthorization?: (

authorization: [AuthorizationRequest](https://portal.thirdweb.com/references/typescript/v5/AuthorizationRequest),

 ) => Promise<[SignedAuthorization](https://portal.thirdweb.com/references/typescript/v5/SignedAuthorization)>;

signMessage: ({

message,

originalMessage,

chainId,

 }: {

chainId?: number;

message: SignableMessage;

originalMessage?: string;

 }) => Promise<Hex>;

signTransaction?: (tx: SerializableTransaction) => Promise<Hex>;

signTypedData: (

_typedData: ox__TypedData.Definition<typedData, primaryType>,

 ) => Promise<Hex>;

watchAsset?: (asset: WatchAssetParams) => Promise<boolean>;

};

`

##### disconnect

 Disconnect the wallet

##### Signature

`function disconnect(): Promise<void>;

`

##### Returns

##### Return Type

`let returnType: Promise<void>;

`

##### getAccount

 Get the [Account](https://portal.thirdweb.com/references/typescript/v5/Account) object that the wallet is currently connected to. If the wallet is not connected, it returns `undefined` .

 Refer to [ Account vs Wallet](https://portal.thirdweb.com/typescript/v5/wallets) to understand the difference between `Account` and `Wallet` interface

##### Example

`const account = wallet.getAccount();

`

##### Signature

`function getAccount(): undefined | [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### Returns

##### Return Type

`let returnType: undefined | [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### getChain

 Get the [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain) object of the network that the wallet is currently connected to. If the wallet is not connected, it returns `undefined` .

##### Example

`const chain = wallet.getChain();

`

##### Signature

`function getChain():

| undefined

 | Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`

##### Returns

##### Return Type

`let returnType: undefined | Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`

##### switchChain

 Switch the wallet to a different network by passing the [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain) object of the network

##### Signature

`function switchChain(chain: Readonly): Promise<void>;

`

##### Parameters

##### chain

 The [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain) object of the network to switch to.

 You can create a `Chain` object using the [defineChain](https://portal.thirdweb.com/references/typescript/v5/defineChain) function. At minimum, you need to pass the `id` of the blockchain to `defineChain` function to create a `Chain` object.

###### Type

`let chain: Readonly;

`

##### Returns

##### Return Type

`let returnType: Promise<void>;

`
## WalletCallReceipt

`type WalletCallReceipt<quantity = [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex), status = [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex)> = {

blockHash: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

blockNumber: quantity;

gasUsed: quantity;

logs: Array<{ address: string; data: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex); topics: Array<[Hex](https://portal.thirdweb.com/references/typescript/v5/Hex)> }>;

status: status;

transactionHash: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

};

`

##### blockHash

`type blockHash = [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

`

##### blockNumber

`type blockNumber = quantity;

`

##### gasUsed

`type gasUsed = quantity;

`

##### logs

`type logs = Array<{ address: string; data: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex); topics: Array<[Hex](https://portal.thirdweb.com/references/typescript/v5/Hex)> }>;

`

##### status

`type status = status;

`

##### transactionHash

`type transactionHash = [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

`
## WalletAutoConnectionOption

 Generic type for getting the type of object that the `wallet.autoConnect` method takes as the first argument.

`type WalletAutoConnectionOption<T extends [WalletId](https://portal.thirdweb.com/references/typescript/v5/WalletId)> =

T extends "walletConnect"

? [WCAutoConnectOptions](https://portal.thirdweb.com/references/typescript/v5/WCAutoConnectOptions)

: T extends "smart"

? [SmartWalletConnectionOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletConnectionOptions)

: T extends "inApp" | "embedded"

? [InAppWalletAutoConnectOptions](https://portal.thirdweb.com/references/typescript/v5/InAppWalletAutoConnectOptions)

: T extends typeof COINBASE

?

| [InjectedConnectOptions](https://portal.thirdweb.com/references/typescript/v5/InjectedConnectOptions)

| [CoinbaseSDKWalletConnectionOptions](https://portal.thirdweb.com/references/typescript/v5/CoinbaseSDKWalletConnectionOptions)

: T extends [InjectedSupportedWalletIds](https://portal.thirdweb.com/references/typescript/v5/InjectedSupportedWalletIds) &

[WCSupportedWalletIds](https://portal.thirdweb.com/references/typescript/v5/WCSupportedWalletIds)

? [InjectedConnectOptions](https://portal.thirdweb.com/references/typescript/v5/InjectedConnectOptions) | [WCAutoConnectOptions](https://portal.thirdweb.com/references/typescript/v5/WCAutoConnectOptions)

: T extends [InjectedSupportedWalletIds](https://portal.thirdweb.com/references/typescript/v5/InjectedSupportedWalletIds)

? [InjectedConnectOptions](https://portal.thirdweb.com/references/typescript/v5/InjectedConnectOptions)

: T extends EcosystemWalletId

? [EcosystemWalletAutoConnectOptions](https://portal.thirdweb.com/references/typescript/v5/EcosystemWalletAutoConnectOptions)

: [WCAutoConnectOptions](https://portal.thirdweb.com/references/typescript/v5/WCAutoConnectOptions);

`

### Example

`type X = WalletAutoConnectionOption<"io.metamask">;

`
## WalletCapabilitiesRecord

`type WalletCapabilitiesRecord<

capabilities extends [WalletCapabilities](https://portal.thirdweb.com/references/typescript/v5/WalletCapabilities),

id extends string | number = [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex),

> = { [chain in id]: capabilities } & { message?: string };

`
## WalletConnectSession

`type WalletConnectSession = { origin?: string; topic: string };

`

##### origin

`type origin = string;

`

##### topic

`type topic = string;

`
## WalletCreationOptions

 Generic type for getting the type of object that the `createWallet` function takes as the second argument. ( the first argument being the wallet id )

`type WalletCreationOptions<T extends [WalletId](https://portal.thirdweb.com/references/typescript/v5/WalletId)> = T extends "smart"

? [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions)

: T extends "inApp" | "embedded"

? [InAppWalletCreationOptions](https://portal.thirdweb.com/references/typescript/v5/InAppWalletCreationOptions)

: T extends typeof COINBASE

? [CoinbaseWalletCreationOptions](https://portal.thirdweb.com/references/typescript/v5/CoinbaseWalletCreationOptions)

: T extends "adapter"

? [AdapterWalletOptions](https://portal.thirdweb.com/references/typescript/v5/AdapterWalletOptions)

: T extends DeepLinkSupportedWalletIds

? [DeepLinkSupportedWalletCreationOptions](https://portal.thirdweb.com/references/typescript/v5/DeepLinkSupportedWalletCreationOptions)

: T extends EcosystemWalletId

? [EcosystemWalletCreationOptions](https://portal.thirdweb.com/references/typescript/v5/EcosystemWalletCreationOptions) | undefined

: undefined;

`

### Example

`type X = WalletCreationOptions<"io.metamask">;

`
## WalletConnectionOption

 Generic type for getting the type of object that the `wallet.connect` method takes as the first argument.

`type WalletConnectionOption<T extends [WalletId](https://portal.thirdweb.com/references/typescript/v5/WalletId)> =

T extends "walletConnect"

? [StandaloneWCConnectOptions](https://portal.thirdweb.com/references/typescript/v5/StandaloneWCConnectOptions)

: T extends "smart"

? [SmartWalletConnectionOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletConnectionOptions)

: T extends "inApp" | "embedded"

? [InAppWalletConnectionOptions](https://portal.thirdweb.com/references/typescript/v5/InAppWalletConnectionOptions)

: T extends typeof COINBASE

?

| [InjectedConnectOptions](https://portal.thirdweb.com/references/typescript/v5/InjectedConnectOptions)

| [CoinbaseSDKWalletConnectionOptions](https://portal.thirdweb.com/references/typescript/v5/CoinbaseSDKWalletConnectionOptions)

: T extends [InjectedSupportedWalletIds](https://portal.thirdweb.com/references/typescript/v5/InjectedSupportedWalletIds) &

[WCSupportedWalletIds](https://portal.thirdweb.com/references/typescript/v5/WCSupportedWalletIds)

? [InjectedConnectOptions](https://portal.thirdweb.com/references/typescript/v5/InjectedConnectOptions) | [WCConnectOptions](https://portal.thirdweb.com/references/typescript/v5/WCConnectOptions)

: T extends [InjectedSupportedWalletIds](https://portal.thirdweb.com/references/typescript/v5/InjectedSupportedWalletIds)

? [InjectedConnectOptions](https://portal.thirdweb.com/references/typescript/v5/InjectedConnectOptions)

: T extends EcosystemWalletId

? [EcosystemWalletConnectionOptions](https://portal.thirdweb.com/references/typescript/v5/EcosystemWalletConnectionOptions)

: [WCConnectOptions](https://portal.thirdweb.com/references/typescript/v5/WCConnectOptions);

`

### Example

`type X = WalletConnectionOption<"io.metamask">;

`
## WalletEmitterEvents

`type WalletEmitterEvents<TWalletId extends [WalletId](https://portal.thirdweb.com/references/typescript/v5/WalletId)> = {

accountChanged: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

accountsChanged: Array<string>;

chainChanged: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

disconnect?: never;

onConnect: [WalletAutoConnectionOption](https://portal.thirdweb.com/references/typescript/v5/WalletAutoConnectionOption)<TWalletId>;

};

`

##### accountChanged

`type accountChanged = [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

##### accountsChanged

`type accountsChanged = Array<string>;

`

##### chainChanged

`type chainChanged = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### disconnect

`type disconnect = never;

`

##### onConnect

`type onConnect = [WalletAutoConnectionOption](https://portal.thirdweb.com/references/typescript/v5/WalletAutoConnectionOption)<TWalletId>;

`
## WalletInfo

`type WalletInfo = {

app: {

android: string | null;

browser: string | null;

chrome: string | null;

edge: string | null;

firefox: string | null;

ios: string | null;

linux: string | null;

mac: string | null;

opera: string | null;

safari: string | null;

windows: string | null;

 };

deepLink?: { mobile: string };

desktop: { native: string | null; universal: string | null };

homepage: string;

id: string;

image_id: string;

mobile: { native: string | null; universal: string | null };

name: string;

rdns: string | null;

};

`

##### app

`type app = {

android: string | null;

browser: string | null;

chrome: string | null;

edge: string | null;

firefox: string | null;

ios: string | null;

linux: string | null;

mac: string | null;

opera: string | null;

safari: string | null;

windows: string | null;

};

`

##### deepLink

`type deepLink = { mobile: string };

`

##### desktop

`type desktop = { native: string | null; universal: string | null };

`

##### homepage

`type homepage = string;

`

##### id

`type id = string;

`

##### image\_id

`type image_id = string;

`

##### mobile

`type mobile = { native: string | null; universal: string | null };

`

##### name

`type name = string;

`

##### rdns

`type rdns = string | null;

`
## WalletId

`type WalletId =

| "walletConnect"

| "inApp"

| "embedded"

| "smart"

| "adapter"

| EcosystemWalletId

| [WCSupportedWalletIds](https://portal.thirdweb.com/references/typescript/v5/WCSupportedWalletIds)

| [InjectedSupportedWalletIds](https://portal.thirdweb.com/references/typescript/v5/InjectedSupportedWalletIds);

`
## WalletProvider

 A React context provider component that supplies Wallet-related data to its child components.

 This component serves as a wrapper around the `WalletProviderContext.Provider` and passes the provided wallet data down to all of its child components through the context API.

### Example

####  Basic usage

`import {

 WalletProvider,

 WalletIcon,

 WalletName,

} from "thirdweb/react";

<WalletProvider id="io.metamask">

 <WalletIcon />

 <WalletName />

</WalletProvider>;

`

##### Signature

`function WalletProvider(

props: PropsWithChildren<[WalletProviderProps](https://portal.thirdweb.com/references/typescript/v5/WalletProviderProps)>,

): Element;

`

### Parameters

##### props

#### Type

`let props: PropsWithChildren<[WalletProviderProps](https://portal.thirdweb.com/references/typescript/v5/WalletProviderProps)>;

`

### Returns

##### Return Type

`let returnType: Element;

`
## WalletProviderProps

 Props for the WalletProvider component

`type WalletProviderProps = { id: [WalletId](https://portal.thirdweb.com/references/typescript/v5/WalletId) };

`

##### id

`type id = [WalletId](https://portal.thirdweb.com/references/typescript/v5/WalletId);

`
## WalletSendCallsParameters

`type WalletSendCallsParameters<

capabilities extends [WalletCapabilities](https://portal.thirdweb.com/references/typescript/v5/WalletCapabilities) = [WalletCapabilities](https://portal.thirdweb.com/references/typescript/v5/WalletCapabilities),

chainId extends [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex) | number = [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex),

> = [

 {

calls: Array<EIP5792Call>;

capabilities?: capabilities;

chainId: chainId;

from: [Address](https://portal.thirdweb.com/references/typescript/v5/Address);

version: string;

 },

];

`
## WelcomeScreen

 Render custom Welcome Screen in "wide" `ConnectButton` 's Modal either by passing a custom React component or by passing an object with custom title, subtitle and image

`type WelcomeScreen =

| {

img?: { height?: number; src: string; width?: number };

subtitle?: string;

title?: string;

 }

| (() => React.ReactNode);

`

### Example

####  Custom React component

`<ConnectButton

connectModal={{

welcomeScreen: () => <CustomComponent />,

 }}

/>;

`

####  Custom title, subtitle and image

`<ConnectButton

connectModal={{

 welcomeScreen: {

 title: "Custom Title",

 subtitle: "Custom Subtitle",

 img: {

 src: "https://example.com/image.png",

 width: 100,

 height: 100,

 },

 },

 }}

/>;

`
## WithdrawEventFilters

 Represents the filters for the "Withdraw" event.

`type WithdrawEventFilters = Partial<{

caller: AbiParameterToPrimitiveType<{

indexed: true;

name: "caller";

type: "address";

 }>;

owner: AbiParameterToPrimitiveType<{

indexed: true;

name: "owner";

type: "address";

 }>;

receiver: AbiParameterToPrimitiveType<{

indexed: true;

name: "receiver";

type: "address";

 }>;

}>;

`
## WatchBlockNumberOptions

`type WatchBlockNumberOptions = {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

latestBlockNumber?: bigint;

onError?: (error: Error) => void;

onNewBlockNumber: (blockNumber: bigint) => void;

overPollRatio?: number;

};

`

##### chain

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

##### client

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### latestBlockNumber

`type latestBlockNumber = bigint;

`

##### onError

##### Signature

`function onError(error: Error): void;

`

##### Parameters

##### error

###### Type

`let error: Error;

`

##### Returns

##### Return Type

`let returnType: void;

`

##### onNewBlockNumber

##### Signature

`function onNewBlockNumber(blockNumber: bigint): void;

`

##### Parameters

##### blockNumber

###### Type

`let blockNumber: bigint;

`

##### Returns

##### Return Type

`let returnType: void;

`

##### overPollRatio

`type overPollRatio = number;

`
## WatchContractEventsOptions

`type WatchContractEventsOptions<

abi extends Abi,

abiEvents extends Array<[PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<AbiEvent>>,

TStrict extends boolean,

> = Prettify<

GetContractEventsOptionsDirect<abi, abiEvents, TStrict> & {

latestBlockNumber?: bigint;

onEvents: (

events: [ParseEventLogsResult](https://portal.thirdweb.com/references/typescript/v5/ParseEventLogsResult)<abiEvents, TStrict>,

 ) => void;

 }

>;

`
## WithdrawParams

 Represents the parameters for the "withdraw" function.

`type WithdrawParams = WithOverrides<{

amount: AbiParameterToPrimitiveType<{

name: "amount";

type: "uint256";

 }>;

}>;

`
## WithdrawParams

 Represents the parameters for the "withdraw" function.

`type WithdrawParams = WithOverrides<{

assets: AbiParameterToPrimitiveType<{

name: "assets";

type: "uint256";

 }>;

owner: AbiParameterToPrimitiveType<{

name: "owner";

type: "address";

 }>;

receiver: AbiParameterToPrimitiveType<{

name: "receiver";

type: "address";

 }>;

}>;

`
## airdropERC1155WithSignature

 Prepares a transaction to call the "airdropERC1155WithSignature" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { airdropERC1155WithSignature } from "thirdweb/extensions/airdrop";

const transaction = airdropERC1155WithSignature({

 contract,

 req: ...,

 signature: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function airdropERC1155WithSignature(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| AirdropERC1155WithSignatureParams

| {

asyncParams: () => Promise<AirdropERC1155WithSignatureParams>;

 }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "airdropERC1155WithSignature" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| AirdropERC1155WithSignatureParams

| { asyncParams: () => Promise<AirdropERC1155WithSignatureParams> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## airdropERC1155

 Prepares a transaction to call the "airdropERC1155" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { airdropERC1155 } from "thirdweb/extensions/airdrop";

const transaction = airdropERC1155({

 contract,

 tokenAddress: ...,

 contents: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function airdropERC1155(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [AirdropERC1155Params](https://portal.thirdweb.com/references/typescript/v5/AirdropERC1155Params)

| { asyncParams: () => Promise<[AirdropERC1155Params](https://portal.thirdweb.com/references/typescript/v5/AirdropERC1155Params)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "airdropERC1155" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [AirdropERC1155Params](https://portal.thirdweb.com/references/typescript/v5/AirdropERC1155Params)

| { asyncParams: () => Promise<[AirdropERC1155Params](https://portal.thirdweb.com/references/typescript/v5/AirdropERC1155Params)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## airdropERC20WithSignature

 Prepares a transaction to call the "airdropERC20WithSignature" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { airdropERC20WithSignature } from "thirdweb/extensions/airdrop";

const transaction = airdropERC20WithSignature({

 contract,

 req: ...,

 signature: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function airdropERC20WithSignature(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| AirdropERC20WithSignatureParams

| { asyncParams: () => Promise<AirdropERC20WithSignatureParams> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "airdropERC20WithSignature" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| AirdropERC20WithSignatureParams

| { asyncParams: () => Promise<AirdropERC20WithSignatureParams> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## airdropERC721

 Prepares a transaction to call the "airdropERC721" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { airdropERC721 } from "thirdweb/extensions/airdrop";

const transaction = airdropERC721({

 contract,

 tokenAddress: ...,

 contents: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function airdropERC721(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [AirdropERC721Params](https://portal.thirdweb.com/references/typescript/v5/AirdropERC721Params)

| { asyncParams: () => Promise<[AirdropERC721Params](https://portal.thirdweb.com/references/typescript/v5/AirdropERC721Params)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "airdropERC721" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [AirdropERC721Params](https://portal.thirdweb.com/references/typescript/v5/AirdropERC721Params)

| { asyncParams: () => Promise<[AirdropERC721Params](https://portal.thirdweb.com/references/typescript/v5/AirdropERC721Params)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## claimERC1155

 Claim airdrop of ERC1155 tokens for allowlisted addresses. (Pull based airdrop)

### Example

`import { claimERC1155 } from "thirdweb/extensions/airdrop";

import { sendTransaction } from "thirdweb";

const tokenAddress = "0x..."; // Address of airdropped tokens to claim

const recipient = "0x..."; // Address of the allowlisted recipient

const claimTransaction = claimERC1155({

 contract,

 tokenAddress,

 recipient,

});

await sendTransaction({ claimTransaction, account });

`

##### Signature

`function claimERC1155(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ClaimERC1155Params](https://portal.thirdweb.com/references/typescript/v5/ClaimERC1155Params)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The transaction options.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ClaimERC1155Params](https://portal.thirdweb.com/references/typescript/v5/ClaimERC1155Params)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A promise that resolves to the transaction result.
## airdropERC721WithSignature

 Prepares a transaction to call the "airdropERC721WithSignature" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { airdropERC721WithSignature } from "thirdweb/extensions/airdrop";

const transaction = airdropERC721WithSignature({

 contract,

 req: ...,

 signature: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function airdropERC721WithSignature(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| AirdropERC721WithSignatureParams

| { asyncParams: () => Promise<AirdropERC721WithSignatureParams> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "airdropERC721WithSignature" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| AirdropERC721WithSignatureParams

| { asyncParams: () => Promise<AirdropERC721WithSignatureParams> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## airdropERC20

 Prepares a transaction to call the "airdropERC20" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { airdropERC20 } from "thirdweb/extensions/airdrop";

const transaction = airdropERC20({

 contract,

 tokenAddress: ...,

 contents: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function airdropERC20(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [AirdropERC20Params](https://portal.thirdweb.com/references/typescript/v5/AirdropERC20Params)

| { asyncParams: () => Promise<[AirdropERC20Params](https://portal.thirdweb.com/references/typescript/v5/AirdropERC20Params)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "airdropERC20" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [AirdropERC20Params](https://portal.thirdweb.com/references/typescript/v5/AirdropERC20Params)

| { asyncParams: () => Promise<[AirdropERC20Params](https://portal.thirdweb.com/references/typescript/v5/AirdropERC20Params)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## airdropNativeToken

 Prepares a transaction to call the "airdropNativeToken" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { airdropNativeToken } from "thirdweb/extensions/airdrop";

const transaction = airdropNativeToken({

 contract,

 contents: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function airdropNativeToken(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [AirdropNativeTokenParams](https://portal.thirdweb.com/references/typescript/v5/AirdropNativeTokenParams)

| { asyncParams: () => Promise<[AirdropNativeTokenParams](https://portal.thirdweb.com/references/typescript/v5/AirdropNativeTokenParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "airdropNativeToken" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [AirdropNativeTokenParams](https://portal.thirdweb.com/references/typescript/v5/AirdropNativeTokenParams)

| { asyncParams: () => Promise<[AirdropNativeTokenParams](https://portal.thirdweb.com/references/typescript/v5/AirdropNativeTokenParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## fetchProofsERC1155

 Retrieves the claim merkle proof for the provided address.

### Example

`import { fetchProofsERCC1155 } from "thirdweb/extensions/airdrop";

import { getContract, defineChain } from "thirdweb";

const TOKEN = getContracct({

 client,

 chain: defineChain(1),

 address: "0x...",

});

const merkleRoot = await tokenMerkleRoot({

 contract: TOKEN,

 tokenAddress: TOKEN.address,

});

const proof = await fetchProofsERC1155({

 contract: TOKEN,

 recipient: "0x...",

 merkleRoot,

});

`

##### Signature

`function fetchProofsERC1155(options: {

contract: Readonly;

merkleRoot: string;

recipient: string;

}): Promise<null | ClaimProofERC1155>;

`

### Parameters

##### options

#### Type

`let options: {

contract: Readonly;

merkleRoot: string;

recipient: string;

};

`

### Returns

##### Return Type

`let returnType: Promise<null | ClaimProofERC1155>;

`

 A promise that resolves to the proof or null if the recipient is not in the allowlist
## fetchProofsERC20

 Retrieves the claim merkle proof for the provided address.

### Example

`import { fetchProofsERCC20 } from "thirdweb/extensions/airdrop";

import { getContract, defineChain } from "thirdweb";

const TOKEN = getContracct({

 client,

 chain: defineChain(1),

 address: "0x...",

});

const merkleRoot = await tokenMerkleRoot({

 contract: TOKEN,

 tokenAddress: TOKEN.address,

});

const proof = await fetchProofsERC20({

 contract: TOKEN,

 recipient: "0x...",

 merkleRoot,

});

`

##### Signature

`function fetchProofsERC20(options: {

contract: Readonly;

merkleRoot: string;

recipient: string;

tokenDecimals: number;

}): Promise<null | ClaimProofERC20>;

`

### Parameters

##### options

#### Type

`let options: {

contract: Readonly;

merkleRoot: string;

recipient: string;

tokenDecimals: number;

};

`

### Returns

##### Return Type

`let returnType: Promise<null | ClaimProofERC20>;

`

 A promise that resolves to the proof or null if the recipient is not in the allowlist
## claimERC721

 Claim airdrop of ERC721 tokens for allowlisted addresses. (Pull based airdrop)

### Example

`import { claimERC721 } from "thirdweb/extensions/airdrop";

import { sendTransaction } from "thirdweb";

const tokenAddress = "0x..."; // Address of airdropped tokens to claim

const recipient = "0x..."; // Address of the allowlisted recipient

const claimTransaction = claimERC721({

 contract,

 tokenAddress,

 recipient,

});

await sendTransaction({ claimTransaction, account });

`

##### Signature

`function claimERC721(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ClaimERC721Params](https://portal.thirdweb.com/references/typescript/v5/ClaimERC721Params)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The transaction options.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ClaimERC721Params](https://portal.thirdweb.com/references/typescript/v5/ClaimERC721Params)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A promise that resolves to the transaction result.
## claimERC20

 Claim airdrop of ERC20 tokens for allowlisted addresses. (Pull based airdrop)

### Example

`import { claimERC20 } from "thirdweb/extensions/airdrop";

import { sendTransaction } from "thirdweb";

const tokenAddress = "0x..."; // Address of airdropped tokens to claim

const recipient = "0x..."; // Address of the allowlisted recipient

const claimTransaction = claimERC20({

 contract,

 tokenAddress,

 recipient,

});

await sendTransaction({ claimTransaction, account });

`

##### Signature

`function claimERC20(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ClaimERC20Params](https://portal.thirdweb.com/references/typescript/v5/ClaimERC20Params)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The transaction options.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ClaimERC20Params](https://portal.thirdweb.com/references/typescript/v5/ClaimERC20Params)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A promise that resolves to the transaction result.
## fetchProofsERC721

 Retrieves the claim merkle proof for the provided address.

### Example

`import { fetchProofsERC721 } from "thirdweb/extensions/airdrop";

import { getContract, defineChain } from "thirdweb";

const NFT = getContracct({

 client,

 chain: defineChain(1),

 address: "0x...",

});

const merkleRoot = await tokenMerkleRoot({

 contract: NFT,

 tokenAddress: NFT.address,

});

const proof = await fetchProofsERC721({

 contract: NFT,

 recipient: "0x...",

 merkleRoot,

});

`

##### Signature

`function fetchProofsERC721(options: {

contract: Readonly;

merkleRoot: string;

recipient: string;

}): Promise<null | ClaimProofERC721>;

`

### Parameters

##### options

#### Type

`let options: {

contract: Readonly;

merkleRoot: string;

recipient: string;

};

`

### Returns

##### Return Type

`let returnType: Promise<null | ClaimProofERC721>;

`

 A promise that resolves to the proof or null if the recipient is not in the allowlist
## generateAirdropSignatureERC1155

 Generates the req and signature for sending ERC1155 airdrop.

### Example

`import {

 airdropERC1155WithSignature,

 generateAirdropSignatureERC1155,

} from "thirdweb/extensions/airdrop";

// list of recipients, tokenIds and amounts to airdrop for each recipient

const contents = [

 { recipient: "0x...", tokenId: 0, amount: 10n },

 { recipient: "0x...", tokenId: 0, amount: 15n },

 { recipient: "0x...", tokenId: 0, amount: 20n },

];

const { req, signature } = await generateAirdropSignatureERC1155({

 account,

 contract,

 airdropRequest: {

 tokenAddress: "0x...", // address of the ERC1155 token to airdrop

 contents,

 },

});

const transaction = airdropERC1155WithSignature({

 contract,

 req,

 signature,

});

await sendTransaction({ transaction, account });

`

##### Signature

`` function generateAirdropSignatureERC1155(options: [GenerateAirdropERC1155SignatureOptions](https://portal.thirdweb.com/references/typescript/v5/GenerateAirdropERC1155SignatureOptions)) : Promise<{ req: { contents: readonly Array<{ amount: bigint; recipient: string; tokenId: bigint }>; expirationTimestamp: bigint; tokenAddress: string; uid: `0x${string}` }; signature: `0x${string}` }>

 ``

### Parameters

##### options

 The options for the airdrop.

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

airdropRequest: GenerateReqInput;

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

};

`

### Returns

##### Return Type

`` let returnType: Promise<{ req: { contents: readonly Array<{ amount: bigint; recipient: string; tokenId: bigint }>; expirationTimestamp: bigint; tokenAddress: string; uid: `0x${string}` }; signature: `0x${string}` }>

 ``

 A promise that resolves to the req and signature.
## generateAirdropSignatureERC721

 Generates the req and signature for sending ERC721 airdrop.

### Example

`import {

 airdropERC721WithSignature,

 generateAirdropSignatureERC721,

} from "thirdweb/extensions/airdrop";

// list of recipients and tokenIds to airdrop for each recipient

const contents = [

 { recipient: "0x...", tokenId: 0 },

 { recipient: "0x...", tokenId: 1 },

 { recipient: "0x...", tokenId: 2 },

];

const { req, signature } = await generateAirdropSignatureERC721({

 account,

 contract,

 airdropRequest: {

 tokenAddress: "0x...", // address of the ERC721 token to airdrop

 contents,

 },

});

const transaction = airdropERC721WithSignature({

 contract,

 req,

 signature,

});

await sendTransaction({ transaction, account });

`

##### Signature

`` function generateAirdropSignatureERC721(options: [GenerateAirdropERC721SignatureOptions](https://portal.thirdweb.com/references/typescript/v5/GenerateAirdropERC721SignatureOptions)) : Promise<{ req: { contents: readonly Array<{ recipient: string; tokenId: bigint }>; expirationTimestamp: bigint; tokenAddress: string; uid: `0x${string}` }; signature: `0x${string}` }>

 ``

### Parameters

##### options

 The options for the airdrop.

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

airdropRequest: GenerateReqInput;

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

};

`

### Returns

##### Return Type

`` let returnType: Promise<{ req: { contents: readonly Array<{ recipient: string; tokenId: bigint }>; expirationTimestamp: bigint; tokenAddress: string; uid: `0x${string}` }; signature: `0x${string}` }>

 ``

 A promise that resolves to the req and signature.
## generateAirdropSignatureERC20

 Generates the req and signature for sending ERC20 airdrop.

### Example

`import {

 airdropERC20WithSignature,

 generateAirdropSignatureERC20,

} from "thirdweb/extensions/airdrop";

// list of recipients and amounts to airdrop for each recipient

const contents = [

 { recipient: "0x...", amount: 10n }, // amount in wei

 { recipient: "0x...", amount: 15n }, // amount in wei

 { recipient: "0x...", amount: 20n }, // amount in wei

];

const { req, signature } = await generateAirdropSignatureERC20({

 account,

 contract,

 airdropRequest: {

 tokenAddress: "0x...", // address of the ERC20 token to airdrop

 contents,

 },

});

const transaction = airdropERC20WithSignature({

 contract,

 req,

 signature,

});

await sendTransaction({ transaction, account });

`

##### Signature

`` function generateAirdropSignatureERC20(options: [GenerateAirdropERC20SignatureOptions](https://portal.thirdweb.com/references/typescript/v5/GenerateAirdropERC20SignatureOptions)) : Promise<{ req: { contents: readonly Array<{ amount: bigint; recipient: string }>; expirationTimestamp: bigint; tokenAddress: string; uid: `0x${string}` }; signature: `0x${string}` }>

 ``

### Parameters

##### options

 The options for the airdrop.

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

airdropRequest: GenerateReqInput;

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

};

`

### Returns

##### Return Type

`` let returnType: Promise<{ req: { contents: readonly Array<{ amount: bigint; recipient: string }>; expirationTimestamp: bigint; tokenAddress: string; uid: `0x${string}` }; signature: `0x${string}` }>

 ``

 A promise that resolves to the req and signature.
## generateMerkleTreeInfoERC721

 Generate merkle tree for a given snapshot.

### Example

`import { generateMerkleTreeInfoERC721 } from "thirdweb/extensions/airdrop";

// snapshot / allowlist of airdrop recipients and amounts

const snapshot = [

 { recipient: "0x...", tokenId: 0 },

 { recipient: "0x...", tokenId: 1 },

 { recipient: "0x...", tokenId: 2 },

];

const tokenAddress = "0x..."; // Address of ERC721 airdrop token

const { merkleRoot, snapshotUri } =

await generateMerkleTreeInfoERC721({

 contract,

 tokenAddress,

 snapshot,

 });

// Optional next steps {See: saveSnapshot and setMerkleRoot functions}

// - Save snapshot on-chain (on the airdrop contract uri)

// - Set merkle root on the contract to enable claiming

`

##### Signature

`function generateMerkleTreeInfoERC721(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GenerateMerkleTreeInfoERC721Params](https://portal.thirdweb.com/references/typescript/v5/GenerateMerkleTreeInfoERC721Params)>,

): Promise<{ merkleRoot: string; snapshotUri: string }>;

`

### Parameters

##### options

 The transaction options.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GenerateMerkleTreeInfoERC721Params](https://portal.thirdweb.com/references/typescript/v5/GenerateMerkleTreeInfoERC721Params)>;

`

### Returns

##### Return Type

`let returnType: Promise<{ merkleRoot: string; snapshotUri: string }>;

`

 A promise that resolves to the merkle-root and snapshot-uri.
## generateMerkleTreeInfoERC1155

 Generate merkle tree for a given snapshot.

### Example

`import { generateMerkleTreeInfoERC1155 } from "thirdweb/extensions/airdrop";

// snapshot / allowlist of airdrop recipients and amounts

const snapshot = [

 { recipient: "0x...", tokenId: 0, amount: 10 },

 { recipient: "0x...", tokenId: 1, amount: 12 },

 { recipient: "0x...", tokenId: 2, amount: 15 },

];

const tokenAddress = "0x..."; // Address of ERC1155 airdrop token

const { merkleRoot, snapshotUri } =

await generateMerkleTreeInfoERC1155({

 contract,

 tokenAddress,

 snapshot,

 });

// Optional next steps {See: saveSnapshot and setMerkleRoot functions}

// - Save snapshot on-chain (on the airdrop contract uri)

// - Set merkle root on the contract to enable claiming

`

##### Signature

`function generateMerkleTreeInfoERC1155(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GenerateMerkleTreeInfoERC1155Params](https://portal.thirdweb.com/references/typescript/v5/GenerateMerkleTreeInfoERC1155Params)>,

): Promise<{ merkleRoot: string; snapshotUri: string }>;

`

### Parameters

##### options

 The transaction options.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GenerateMerkleTreeInfoERC1155Params](https://portal.thirdweb.com/references/typescript/v5/GenerateMerkleTreeInfoERC1155Params)>;

`

### Returns

##### Return Type

`let returnType: Promise<{ merkleRoot: string; snapshotUri: string }>;

`

 A promise that resolves to the merkle-root and snapshot-uri.
## generateMerkleTreeInfoERC20

 Generate merkle tree for a given snapshot.

### Example

`import { generateMerkleTreeInfoERC20 } from "thirdweb/extensions/airdrop";

// snapshot / allowlist of airdrop recipients and amounts

const snapshot = [

 { recipient: "0x...", amount: 10 },

 { recipient: "0x...", amount: 15 },

 { recipient: "0x...", amount: 20 },

];

const tokenAddress = "0x..."; // Address of ERC20 airdrop token

const { merkleRoot, snapshotUri } = await generateMerkleTreeInfoERC20(

 {

 contract,

 tokenAddress,

 snapshot,

 },

);

// Optional next steps {See: saveSnapshot and setMerkleRoot functions}

// - Save snapshot on-chain (on the airdrop contract uri)

// - Set merkle root on the contract to enable claiming

`

##### Signature

`function generateMerkleTreeInfoERC20(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GenerateMerkleTreeInfoERC20Params](https://portal.thirdweb.com/references/typescript/v5/GenerateMerkleTreeInfoERC20Params)>,

): Promise<{ merkleRoot: string; snapshotUri: string }>;

`

### Parameters

##### options

 The transaction options.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GenerateMerkleTreeInfoERC20Params](https://portal.thirdweb.com/references/typescript/v5/GenerateMerkleTreeInfoERC20Params)>;

`

### Returns

##### Return Type

`let returnType: Promise<{ merkleRoot: string; snapshotUri: string }>;

`

 A promise that resolves to the merkle-root and snapshot-uri.
## isClaimed

 Calls the "isClaimed" function on the contract.

### Example

`import { isClaimed } from "thirdweb/extensions/airdrop";

const result = await isClaimed({

 contract,

 receiver: ...,

 token: ...,

 tokenId: ...,

});

`

##### Signature

`function isClaimed(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsClaimedParams](https://portal.thirdweb.com/references/typescript/v5/IsClaimedParams)>,

): Promise<boolean>;

`

### Parameters

##### options

 The options for the isClaimed function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsClaimedParams](https://portal.thirdweb.com/references/typescript/v5/IsClaimedParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 The parsed result of the function call.
## saveSnapshot

 Generate merkle tree for a given snapshot and save the info on-chain.

### Example

`` // This is ERC20 example. Should import and use other ERC variants as needed

import { generateMerkleTreeInfoERC20, saveSnapshot, setMerkleRoot } from "thirdweb/extensions/airdrop";

// snapshot / allowlist of airdrop recipients and amounts

const snapshot = [

 { recipient: "0x...", amount: 10 },

 { recipient: "0x...", amount: 15 },

 { recipient: "0x...", amount: 20 },

];

const tokenAddress = "0x..." // Address of airdrop token

const { merkleRoot, snapshotUri } = await generateMerkleTreeInfoERC20({

 contract,

 tokenAddress,

 snapshot

});

const saveSnapshotTransaction = saveSnapshot({

 contract,

 merkleRoot,

 snapshotUri,

});

await sendTransaction({ saveSnapshotTransaction, account });

const setMerkleRootTransaction = setMerkleRoot({

 contract,

 token,

 tokenMerkleRoot: merkleRoot as `0x${string}`,

 resetClaimStatus: false // toggle as needed

 signature,

});

await sendTransaction({ setMerkleRootTransaction, account });

 ``

##### Signature

`function saveSnapshot(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[SaveSnapshotParams](https://portal.thirdweb.com/references/typescript/v5/SaveSnapshotParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The transaction options.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[SaveSnapshotParams](https://portal.thirdweb.com/references/typescript/v5/SaveSnapshotParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A promise that resolves to the transaction result.
## tokenConditionId

 Calls the "tokenConditionId" function on the contract.

### Example

`import { tokenConditionId } from "thirdweb/extensions/airdrop";

const result = await tokenConditionId({

 contract,

 tokenAddress: ...,

});

`

##### Signature

`function tokenConditionId(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[TokenConditionIdParams](https://portal.thirdweb.com/references/typescript/v5/TokenConditionIdParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the tokenConditionId function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[TokenConditionIdParams](https://portal.thirdweb.com/references/typescript/v5/TokenConditionIdParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## setMerkleRoot

 Prepares a transaction to call the "setMerkleRoot" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { setMerkleRoot } from "thirdweb/extensions/airdrop";

const transaction = setMerkleRoot({

 contract,

 token: ...,

 tokenMerkleRoot: ...,

 resetClaimStatus: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setMerkleRoot(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetMerkleRootParams](https://portal.thirdweb.com/references/typescript/v5/SetMerkleRootParams)

| { asyncParams: () => Promise<[SetMerkleRootParams](https://portal.thirdweb.com/references/typescript/v5/SetMerkleRootParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setMerkleRoot" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetMerkleRootParams](https://portal.thirdweb.com/references/typescript/v5/SetMerkleRootParams)

| { asyncParams: () => Promise<[SetMerkleRootParams](https://portal.thirdweb.com/references/typescript/v5/SetMerkleRootParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## tokenMerkleRoot

 Calls the "tokenMerkleRoot" function on the contract.

### Example

`import { tokenMerkleRoot } from "thirdweb/extensions/airdrop";

const result = await tokenMerkleRoot({

 contract,

 tokenAddress: ...,

});

`

##### Signature

`` function tokenMerkleRoot(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[TokenMerkleRootParams](https://portal.thirdweb.com/references/typescript/v5/TokenMerkleRootParams)>,

): Promise<`0x${string}`>;

 ``

### Parameters

##### options

 The options for the tokenMerkleRoot function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[TokenMerkleRootParams](https://portal.thirdweb.com/references/typescript/v5/TokenMerkleRootParams)>;

`

### Returns

##### Return Type

`` let returnType: Promise<`0x${string}`>;

 ``

 The parsed result of the function call.
## authenticate

 Authenticates the user based on the provided authentication arguments.

### Example

`import { authenticate } from "thirdweb/wallets/in-app";

const result = await authenticate({

 client,

 strategy: "email",

 email: "example@example.org",

 verificationCode: "123456",

});

`

 Authenticate to a backend account (only do this on your backend):

`import { authenticate } from "thirdweb/wallets/in-app";

const result = await authenticate({

 client,

 strategy: "backend",

 walletSecret: "...", // Provided by your app

});

`

##### Signature

`function authenticate(

args: AuthArgsType,

): Promise<AuthStoredTokenWithCookieReturnType>;

`

### Parameters

##### args

 The authentication arguments.

#### Type

`let args: AuthArgsType;

`

### Returns

##### Return Type

`let returnType: Promise<AuthStoredTokenWithCookieReturnType>;

`

 A promise that resolves to the authentication result.
## authenticateWithRedirect

 Authenticates the user based on the provided authentication arguments using a redirect.

### Example

`import { authenticateWithRedirect } from "thirdweb/wallets/in-app";

const result = await authenticateWithRedirect({

 client,

 strategy: "google",

 mode: "redirect",

 redirectUrl: "https://example.org",

});

`

##### Signature

`function authenticateWithRedirect(

args: SocialAuthArgsType & {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

ecosystem?: Ecosystem;

 },

): Promise<void>;

`

### Parameters

##### args

 The authentication arguments.

#### Type

`let args: SocialAuthArgsType & {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

ecosystem?: Ecosystem;

};

`

### Returns

##### Return Type

`let returnType: Promise<void>;

`

 A promise that resolves to the authentication result.
## autoConnect

 Attempts to automatically connect to the last connected wallet. It combines both specified wallets and installed wallet providers that aren't already specified.

### Example

`import { autoConnect } from "thirdweb/wallets";

const autoConnected = await autoConnect({

 client,

onConnect: (wallet) => {

 console.log("wallet", wallet);

 },

});

`

##### Signature

`function autoConnect(

props: [AutoConnectProps](https://portal.thirdweb.com/references/typescript/v5/AutoConnectProps) & { wallets?: Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)> },

): Promise<boolean>;

`

### Parameters

##### props

 The auto-connect configuration properties

#### Type

`let props: [AutoConnectProps](https://portal.thirdweb.com/references/typescript/v5/AutoConnectProps) & { wallets?: Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)> };

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 a promise resolving to true or false depending on whether the auto connect function connected to a wallet or not
## batchMetadataUpdateEvent

 Creates an event object for the BatchMetadataUpdate event.

### Example

`import { getContractEvents } from "thirdweb";

import { BatchMetadataERC1155 } from "thirdweb/modules";

const events = await getContractEvents({

 contract,

 events: [BatchMetadataERC1155.batchMetadataUpdateEvent()],

});

`

##### Signature

`function batchMetadataUpdateEvent(): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly name: "startTokenIdIncluside";

readonly type: "uint256";

 },

 {

readonly name: "endTokenIdInclusive";

readonly type: "uint256";

 },

 { readonly name: "baseURI"; readonly type: "string" },

 ];

readonly name: "BatchMetadataUpdate";

readonly type: "event";

}>;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly name: "startTokenIdIncluside";

readonly type: "uint256";

 },

 {

readonly name: "endTokenIdInclusive";

readonly type: "uint256";

 },

 { readonly name: "baseURI"; readonly type: "string" },

 ];

readonly name: "BatchMetadataUpdate";

readonly type: "event";

}>;

`

 The prepared event object.
## encodeInstall

 Encodes the install data for the BatchMetadataERC1155 module.

##### Signature

`function encodeInstall(): string;

`

### Returns

##### Return Type

`let returnType: string;

`

* The encoded data.
## install

 Installs the BatchMetadataERC1155 module on a core contract.

### Example

`import { BatchMetadataERC1155 } from "thirdweb/modules";

const transaction = BatchMetadataERC1155.install({

 contract: coreContract,

 account: account,

});

await sendTransaction({

 transaction,

 account,

});

`

##### Signature

`function install(options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params?: { publisher?: string };

}): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

`

### Parameters

##### options

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params?: { publisher?: string };

};

`

### Returns

##### Return Type

`let returnType: Readonly<options> & {

__contract?: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi>;

__preparedMethod?: () => Promise<PreparedMethod<abiFn>>;

};

`

 the transaction to install the module
## uploadMetadata

 Uploads metadata for a batch of NFTs.

### Example

`import { BatchMetadataERC1155 } from "thirdweb/modules";

const transaction = BatchMetadataERC1155.uploadMetadata({

 contract,

 metadatas: [{ name: "My NFT", description: "This is my NFT" }],

});

await sendTransaction({

 transaction,

 account,

});

`

##### Signature

`function uploadMetadata(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[UploadMetadataParams](https://portal.thirdweb.com/references/typescript/v5/UploadMetadataParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the transaction.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[UploadMetadataParams](https://portal.thirdweb.com/references/typescript/v5/UploadMetadataParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 The transaction to upload the metadata.
## module

 Convenience function to add the BatchMetadataERC1155 module as a default module on a core contract.

### Example

`import {

 BatchMetadataERC1155,

 deployModularContract,

} from "thirdweb/modules";

const deployed = deployModularContract({

 client,

 chain,

 account,

 core: "ERC1155",

 params: {

 name: "My Modular Contract",

 },

 modules: [BatchMetadataERC1155.module()],

});

`

##### Signature

`` function module(params?: {

publisher?: string;

}): (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: "0x"; module: `0x${string}` }>;

 ``

### Parameters

##### params

optional

 The parameters for the module.

#### Type

`let params: { publisher?: string };

`

### Returns

##### Return Type

`` let returnType: (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: "0x"; module: `0x${string}` }>;

 ``

* The module function.
## batchMetadataUpdateEvent

 Creates an event object for the BatchMetadataUpdate event.

### Example

`import { getContractEvents } from "thirdweb";

import { BatchMetadataERC721 } from "thirdweb/modules";

const events = await getContractEvents({

 contract,

 events: [BatchMetadataERC721.batchMetadataUpdateEvent()],

});

`

##### Signature

`function batchMetadataUpdateEvent(): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly name: "startTokenIdIncluside";

readonly type: "uint256";

 },

 {

readonly name: "endTokenIdInclusive";

readonly type: "uint256";

 },

 { readonly name: "baseURI"; readonly type: "string" },

 ];

readonly name: "BatchMetadataUpdate";

readonly type: "event";

}>;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly name: "startTokenIdIncluside";

readonly type: "uint256";

 },

 {

readonly name: "endTokenIdInclusive";

readonly type: "uint256";

 },

 { readonly name: "baseURI"; readonly type: "string" },

 ];

readonly name: "BatchMetadataUpdate";

readonly type: "event";

}>;

`

 The prepared event object.
## encodeInstall

 Encodes the install data for the BatchMetadataERC721 module.

##### Signature

`function encodeInstall(): string;

`

### Returns

##### Return Type

`let returnType: string;

`

* The encoded data.
## module

 Convenience function to add the BatchMetadataERC721 module as a default module on a core contract.

### Example

`import {

 BatchMetadataERC721,

 deployModularContract,

} from "thirdweb/modules";

const deployed = deployModularContract({

 client,

 chain,

 account,

 core: "ERC721",

 params: {

 name: "My Modular Contract",

 },

 modules: [BatchMetadataERC721.module()],

});

`

##### Signature

`` function module(params?: {

publisher?: string;

}): (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: "0x"; module: `0x${string}` }>;

 ``

### Parameters

##### params

optional

 The parameters for the module.

#### Type

`let params: { publisher?: string };

`

### Returns

##### Return Type

`` let returnType: (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: "0x"; module: `0x${string}` }>;

 ``

* The module function.
## uploadMetadata

 Uploads metadata for a batch of NFTs.

### Example

`import { BatchMetadataERC721 } from "thirdweb/modules";

const transaction = BatchMetadataERC721.uploadMetadata({

 contract,

 metadatas: [{ name: "My NFT", description: "This is my NFT" }],

});

await sendTransaction({

 transaction,

 account,

});

`

##### Signature

`function uploadMetadata(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[UploadMetadataParams](https://portal.thirdweb.com/references/typescript/v5/UploadMetadataParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the transaction.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[UploadMetadataParams](https://portal.thirdweb.com/references/typescript/v5/UploadMetadataParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 The transaction to upload the metadata.
## boolToBytes

 Converts a boolean value to a Uint8Array of bytes.

### Example

`import { boolToBytes } from "thirdweb/utils";

const bytes = boolToBytes(true);

console.log(bytes); // Uint8Array(1) [ 1 ]

`

##### Signature

`function boolToBytes(

value: boolean,

opts: Options,

): Uint8Array<ArrayBufferLike>;

`

### Parameters

##### value

 The boolean value to convert.

#### Type

`let value: boolean;

`

##### opts

 Optional parameters for the conversion.

#### Type

`let opts: Options;

`

### Returns

##### Return Type

`let returnType: Uint8Array<ArrayBufferLike>;

`

 The Uint8Array of bytes representing the boolean value.
## boolToHex

 Converts a boolean value to a hexadecimal string representation.

### Example

`import { boolToHex } from "thirdweb/utils";

const hex = boolToHex(true);

console.log(hex); // "0x01"

`

##### Signature

`` function boolToHex(value: boolean, opts: Options): `0x${string}`;

 ``

### Parameters

##### value

 The boolean value to convert.

#### Type

`let value: boolean;

`

##### opts

 Optional options for the conversion.

#### Type

`let opts: Options;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

 The hexadecimal string representation of the boolean value.
## bundleUserOp

 Bundle a user operation.

### Example

`import { bundleUserOp } from "thirdweb/wallets/smart";

const userOpHash = await bundleUserOp({

 userOp,

 options,

});

`

##### Signature

`` function bundleUserOp(args: {

options: BundlerOptions;

userOp: UserOperationV06 | UserOperationV07;

}): Promise<`0x${string}`>;

 ``

### Parameters

##### args

 The options for bundling a user operation.

#### Type

`let args: {

options: BundlerOptions;

userOp: UserOperationV06 | UserOperationV07;

};

`

### Returns

##### Return Type

`` let returnType: Promise<`0x${string}`>;

 ``

 The bundle hash of the user operation.
## bytesToBigInt

 Converts a Uint8Array of bytes to a bigint.

### Example

`import { bytesToBigInt } from "thirdweb/utils";

const bytes = new Uint8Array([1, 164]);

const bigInt = bytesToBigInt(bytes);

console.log(bigInt); // 420n

`

##### Signature

`function bytesToBigInt(

bytes: Uint8Array,

opts: [BytesToBigIntOpts](https://portal.thirdweb.com/references/typescript/v5/BytesToBigIntOpts),

): bigint;

`

### Parameters

##### bytes

 The Uint8Array of bytes to convert.

#### Type

`let bytes: Uint8Array;

`

##### opts

 Optional parameters for the conversion.

#### Type

`let opts: { signed?: boolean; size?: number };

`

### Returns

##### Return Type

`let returnType: bigint;

`

 The converted bigint.
## bytesToString

 Converts an array of bytes to a string using UTF-8 encoding.

### Example

`import { bytesToString } from "thirdweb/utils";

const bytes = new Uint8Array([72, 101, 108, 108, 111]);

const string = bytesToString(bytes);

console.log(string); // "Hello"

`

##### Signature

`function bytesToString(bytes_: Uint8Array, opts: Options): string;

`

### Parameters

##### bytes\_

 The array of bytes to convert.

#### Type

`let bytes_: Uint8Array;

`

##### opts

 Optional parameters for the conversion.

#### Type

`let opts: Options;

`

### Returns

##### Return Type

`let returnType: string;

`

 The resulting string.
## bytesToBool

 Converts a byte array to a boolean value.

### Example

`import { bytesToBool } from "thirdweb/utils";

const bytes = new Uint8Array([1]);

const bool = bytesToBool(bytes);

console.log(bool); // true

`

##### Signature

`function bytesToBool(bytes_: Uint8Array, opts: Options): boolean;

`

### Parameters

##### bytes\_

 The byte array to convert.

#### Type

`let bytes_: Uint8Array;

`

##### opts

 Optional parameters for the conversion.

#### Type

`let opts: Options;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 The boolean value converted from the byte array.
## bytesToNumber

 Converts a Uint8Array of bytes to a number.

### Example

`import { bytesToNumber } from "thirdweb/utils";

const bytes = new Uint8Array([1, 164]);

const number = bytesToNumber(bytes);

console.log(number); // 420

`

##### Signature

`function bytesToNumber(

bytes: Uint8Array,

opts: [BytesToBigIntOpts](https://portal.thirdweb.com/references/typescript/v5/BytesToBigIntOpts),

): number;

`

### Parameters

##### bytes

 The Uint8Array of bytes to convert.

#### Type

`let bytes: Uint8Array;

`

##### opts

 Optional configuration options.

#### Type

`let opts: { signed?: boolean; size?: number };

`

### Returns

##### Return Type

`let returnType: number;

`

 The converted number.
## chat

 Chat with Nebula.

### Example

`import { Nebula } from "thirdweb/ai";

const response = await Nebula.chat({

 client: TEST_CLIENT,

 message:

"What's the symbol of this contract: 0xe2cb0eb5147b42095c2FfA6F7ec953bb0bE347D8",

 contextFilter: {

 chains: [sepolia],

 },

});

`

 Multi message prompt:

`const response = await Nebula.chat({

 client,

 messages: [

 { role: "user", content: "What's my balance?" },

 { role: "assistant", content: "Your balance is 0.023 ETH" },

 { role: "user", content: "What about my NFTs?" },

 ],

 contextFilter: {

 chains: [sepolia],

 },

});

`

 Extracting and sending transactions from a chat response:

`const response = await Nebula.chat({ ... });

const transactions = response.transactions;

for (const transaction of transactions) {

await sendTransaction({ transaction, account });

}

`

##### Signature

`function chat(input: [Input](https://portal.thirdweb.com/references/typescript/v5/Input)): Promise<[Output](https://portal.thirdweb.com/references/typescript/v5/Output)>;

`

### Parameters

##### input

 The input for the chat.

#### Type

`let input: {

account?: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

contextFilter?: {

chains?: Array<[Chain](https://portal.thirdweb.com/references/typescript/v5/Chain)>;

contractAddresses?: Array<string>;

walletAddresses?: Array<string>;

 };

sessionId?: string;

} & (

| {

messages: Array<{

content: string;

role: "user" | "assistant";

 }>;

 }

| { message: string }

);

`

### Returns

##### Return Type

`let returnType: {

message: string;

sessionId: string;

transactions: Array<[PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)>;

};

`

 The chat response. This API is in early access and might change in the future.
## checksumAddress

 Calculates the checksum address for the given address.

### Example

`import { checksumAddress } from "thirdweb/utils";

checksumAddress("0x5aAeb6053F3E94C9b9A09f33669435E7Ef1BeAed");

//=> '0x5aAeb6053F3E94C9b9A09f33669435E7Ef1BeAed'

`

##### Signature

`` function checksumAddress(address: string): `0x${string}`;

 ``

### Parameters

##### address

 The address to calculate the checksum for.

#### Type

`let address: string;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

 The checksum address.
## checkVerificationStatus

 Checks the verification status of a contract.

### Example

`import { checkVerificationStatus } from "thirdweb/contract";

const verificationStatus = await checkVerificationStatus({

 explorerApiUrl: "https://api.polygonscan.com/api",

 explorerApiKey: "YOUR_API_KEY",

 guid: "YOUR_GUID",

});

console.log(verificationStatus);

`

##### Signature

`function checkVerificationStatus(

options: CheckVerificationStatusOptions,

): Promise<unknown>;

`

### Parameters

##### options

 The options for checking the verification status.

#### Type

`let options: CheckVerificationStatusOptions;

`

### Returns

##### Return Type

`let returnType: Promise<unknown>;

`

 A promise that resolves with the verification status data.
## getSaleConfig

 Calls the "getSaleConfig" function on the contract.

### Example

`import { ClaimableERC1155 } from "thirdweb/modules";

const result = await ClaimableERC1155.getSaleConfig({

 contract,

});

`

##### Signature

`function getSaleConfig(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<string>;

`

### Parameters

##### options

 The options for the getSaleConfig function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## getClaimCondition

 Calls the "getClaimConditionByTokenId" function on the contract.

### Example

`import { ClaimableERC1155 } from "thirdweb/modules";

const result = await ClaimableERC1155.getClaimConditionByTokenId({

 contract,

 tokenId: ...,

});

`

##### Signature

`` function getClaimCondition(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<GetClaimConditionByTokenIdParams>,

): Promise<{

allowlistMerkleRoot: `0x${string}`;

auxData: string;

availableSupply: bigint;

currency: string;

endTimestamp: number;

maxMintPerWallet: bigint;

pricePerUnit: bigint;

startTimestamp: number;

}>;

 ``

### Parameters

##### options

 The options for the getClaimConditionByTokenId function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<GetClaimConditionByTokenIdParams>;

`

### Returns

##### Return Type

`` let returnType: Promise<{

allowlistMerkleRoot: `0x${string}`;

auxData: string;

availableSupply: bigint;

currency: string;

endTimestamp: number;

maxMintPerWallet: bigint;

pricePerUnit: bigint;

startTimestamp: number;

}>;

 ``

 The parsed result of the function call.
## encodeInstall

 Encodes the install data for the ClaimableERC1155 module.

##### Signature

`` function encodeInstall(

params: EncodeBytesOnInstallParams,

): `0x${string}`;

 ``

### Parameters

##### params

 The parameters for the module.

#### Type

`let params: EncodeBytesOnInstallParams;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

* The encoded data.
## install

 Installs the ClaimableERC1155 module on a core contract.

### Example

`import { ClaimableERC1155 } from "thirdweb/modules";

const transaction = ClaimableERC1155.install({

 contract: coreContract,

 account: account,

 params: {

 primarySaleRecipient: ...,

 },

});

await sendTransaction({

 transaction,

 account,

});

`

##### Signature

`function install(options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params: EncodeBytesOnInstallParams & { publisher?: string };

}): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

`

### Parameters

##### options

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params: EncodeBytesOnInstallParams & { publisher?: string };

};

`

### Returns

##### Return Type

`let returnType: Readonly<options> & {

__contract?: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi>;

__preparedMethod?: () => Promise<PreparedMethod<abiFn>>;

};

`

 the transaction to install the module
## module

 Convenience function to add the ClaimableERC1155 module as a default module on a core contract.

### Example

`import { ClaimableERC1155, deployModularContract } from "thirdweb/modules";

const deployed = deployModularContract({

 client,

 chain,

 account,

 core: "ERC1155",

 params: {

 name: "My Modular Contract",

 },

 modules: [

 ClaimableERC1155.module({

 primarySaleRecipient: ...,

 }),

 ],

});

`

##### Signature

`` function module(

params: EncodeBytesOnInstallParams & { publisher?: string },

): (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: `0x${string}`; module: `0x${string}` }>;

 ``

### Parameters

##### params

 The parameters for the module.

#### Type

`let params: EncodeBytesOnInstallParams & { publisher?: string };

`

### Returns

##### Return Type

`` let returnType: (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: `0x${string}`; module: `0x${string}` }>;

 ``

* The module function.
## mint

 Mints ERC1155 tokens to a specified address via a ClaimableERC1155 module.

### Example

`import { ClaimableERC1155 } from "thirdweb/modules";

const transaction = ClaimableERC1155.mint({

 contract,

 to: "0x...", // Address to mint tokens to

 quantity: 2, // Amount of tokens to mint

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function mint(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MintParams](https://portal.thirdweb.com/references/typescript/v5/MintParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for minting tokens.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MintParams](https://portal.thirdweb.com/references/typescript/v5/MintParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A transaction to mint tokens.
## setClaimCondition

 Sets the claim conditions for a given token ID.

### Example

`import { ClaimableERC1155 } from "thirdweb/modules";

const transaction = ClaimableERC1155.setClaimCondition({

 contract: contract,

 tokenId: 0n,

 pricePerToken: "1", // in ETH

 maxClaimableSupply: "1000000",

 maxClaimablePerWallet: "1",

});

await sendTransaction({ transaction, account });

`

##### Signature

`function setClaimCondition(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

ClaimConditionInput & { tokenId: bigint }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for setting the claim conditions.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

ClaimConditionInput & { tokenId: bigint }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A transaction to set the claim conditions.
## encodeInstall

 Encodes the install data for the ClaimableERC20 module.

##### Signature

`` function encodeInstall(

params: EncodeBytesOnInstallParams,

): `0x${string}`;

 ``

### Parameters

##### params

 The parameters for the module.

#### Type

`let params: EncodeBytesOnInstallParams;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

* The encoded data.
## setSaleConfig

 Prepares a transaction to call the "setSaleConfig" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { ClaimableERC1155 } from "thirdweb/modules";

const transaction = ClaimableERC1155.setSaleConfig({

 contract,

 primarySaleRecipient: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setSaleConfig(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| SetSaleConfigParams

| { asyncParams: () => Promise<SetSaleConfigParams> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setSaleConfig" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| SetSaleConfigParams

| { asyncParams: () => Promise<SetSaleConfigParams> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## getClaimCondition

 Calls the "getClaimCondition" function on the contract.

### Example

`import { ClaimableERC20 } from "thirdweb/modules";

const result = await ClaimableERC20.getClaimCondition({

 contract,

});

`

##### Signature

`` function getClaimCondition(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<{

allowlistMerkleRoot: `0x${string}`;

auxData: string;

availableSupply: bigint;

currency: string;

endTimestamp: number;

maxMintPerWallet: bigint;

pricePerUnit: bigint;

startTimestamp: number;

}>;

 ``

### Parameters

##### options

 The options for the getClaimCondition function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`` let returnType: Promise<{

allowlistMerkleRoot: `0x${string}`;

auxData: string;

availableSupply: bigint;

currency: string;

endTimestamp: number;

maxMintPerWallet: bigint;

pricePerUnit: bigint;

startTimestamp: number;

}>;

 ``

 The parsed result of the function call.
## getSaleConfig

 Calls the "getSaleConfig" function on the contract.

### Example

`import { ClaimableERC20 } from "thirdweb/modules";

const result = await ClaimableERC20.getSaleConfig({

 contract,

});

`

##### Signature

`function getSaleConfig(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<string>;

`

### Parameters

##### options

 The options for the getSaleConfig function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## install

 Installs the ClaimableERC20 module on a core contract.

### Example

`import { ClaimableERC20 } from "thirdweb/modules";

const transaction = ClaimableERC20.install({

 contract: coreContract,

 account: account,

 params: {

 primarySaleRecipient: ...,

 },

});

await sendTransaction({

 transaction,

 account,

});

`

##### Signature

`function install(options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params: EncodeBytesOnInstallParams & { publisher?: string };

}): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

`

### Parameters

##### options

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params: EncodeBytesOnInstallParams & { publisher?: string };

};

`

### Returns

##### Return Type

`let returnType: Readonly<options> & {

__contract?: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi>;

__preparedMethod?: () => Promise<PreparedMethod<abiFn>>;

};

`

 the transaction to install the module
## mint

 Mints tokens to a specified address via a ClaimableERC20 module.

### Example

`import { ClaimableERC20 } from "thirdweb/modules";

const transaction = ClaimableERC20.mint({

 contract,

 to: "0x...", // Address to mint tokens to

 quantity: "0.1", // Amount of tokens to mint (in decimals)

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function mint(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MintParams](https://portal.thirdweb.com/references/typescript/v5/MintParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for minting tokens.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MintParams](https://portal.thirdweb.com/references/typescript/v5/MintParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A transaction to mint tokens.
## module

 Convenience function to add the ClaimableERC20 module as a default module on a core contract.

### Example

`import { ClaimableERC20, deployModularContract } from "thirdweb/modules";

const deployed = deployModularContract({

 client,

 chain,

 account,

 core: "ERC20",

 params: {

 name: "My Modular Contract",

 },

 modules: [

 ClaimableERC20.module({

 primarySaleRecipient: ...,

 }),

 ],

});

`

##### Signature

`` function module(

params: EncodeBytesOnInstallParams & { publisher?: string },

): (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: `0x${string}`; module: `0x${string}` }>;

 ``

### Parameters

##### params

 The parameters for the module.

#### Type

`let params: EncodeBytesOnInstallParams & { publisher?: string };

`

### Returns

##### Return Type

`` let returnType: (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: `0x${string}`; module: `0x${string}` }>;

 ``

* The module function.
## setClaimCondition

 Sets the claim conditions for a given token ID.

### Example

`import { ClaimableERC20 } from "thirdweb/modules";

const transaction = ClaimableERC20.setClaimCondition({

 contract: contract,

 pricePerToken: "1", // in ETH

 maxClaimableSupply: "1000000",

 maxClaimablePerWallet: "1",

});

await sendTransaction({ transaction, account });

`

##### Signature

`function setClaimCondition(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<ClaimConditionInput>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for setting the claim conditions.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<ClaimConditionInput>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A transaction to set the claim conditions.
## setSaleConfig

 Prepares a transaction to call the "setSaleConfig" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { ClaimableERC20 } from "thirdweb/modules";

const transaction = ClaimableERC20.setSaleConfig({

 contract,

 primarySaleRecipient: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setSaleConfig(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| SetSaleConfigParams

| { asyncParams: () => Promise<SetSaleConfigParams> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setSaleConfig" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| SetSaleConfigParams

| { asyncParams: () => Promise<SetSaleConfigParams> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## encodeInstall

 Encodes the install data for the ClaimableERC721 module.

##### Signature

`` function encodeInstall(

params: EncodeBytesOnInstallParams,

): `0x${string}`;

 ``

### Parameters

##### params

 The parameters for the module.

#### Type

`let params: EncodeBytesOnInstallParams;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

* The encoded data.
## getClaimCondition

 Calls the "getClaimCondition" function on the contract.

### Example

`import { ClaimableERC721 } from "thirdweb/modules";

const result = await ClaimableERC721.getClaimCondition({

 contract,

});

`

##### Signature

`` function getClaimCondition(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<{

allowlistMerkleRoot: `0x${string}`;

auxData: string;

availableSupply: bigint;

currency: string;

endTimestamp: number;

maxMintPerWallet: bigint;

pricePerUnit: bigint;

startTimestamp: number;

}>;

 ``

### Parameters

##### options

 The options for the getClaimCondition function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`` let returnType: Promise<{

allowlistMerkleRoot: `0x${string}`;

auxData: string;

availableSupply: bigint;

currency: string;

endTimestamp: number;

maxMintPerWallet: bigint;

pricePerUnit: bigint;

startTimestamp: number;

}>;

 ``

 The parsed result of the function call.
## install

 Installs the BatchMetadataERC721 module on a core contract.

### Example

`import { BatchMetadataERC721 } from "thirdweb/modules";

const transaction = BatchMetadataERC721.install({

 contract: coreContract,

 account: account,

});

await sendTransaction({

 transaction,

 account,

});

`

##### Signature

`function install(options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params?: { publisher?: string };

}): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

`

### Parameters

##### options

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params?: { publisher?: string };

};

`

### Returns

##### Return Type

`let returnType: Readonly<options> & {

__contract?: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi>;

__preparedMethod?: () => Promise<PreparedMethod<abiFn>>;

};

`

 the transaction to install the module
## install

 Installs the ClaimableERC721 module on a core contract.

### Example

`import { ClaimableERC721 } from "thirdweb/modules";

const transaction = ClaimableERC721.install({

 contract: coreContract,

 account: account,

 params: {

 primarySaleRecipient: ...,

 },

});

await sendTransaction({

 transaction,

 account,

});

`

##### Signature

`function install(options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params: EncodeBytesOnInstallParams & { publisher?: string };

}): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

`

### Parameters

##### options

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params: EncodeBytesOnInstallParams & { publisher?: string };

};

`

### Returns

##### Return Type

`let returnType: Readonly<options> & {

__contract?: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi>;

__preparedMethod?: () => Promise<PreparedMethod<abiFn>>;

};

`

 the transaction to install the module
## getSaleConfig

 Calls the "getSaleConfig" function on the contract.

### Example

`import { ClaimableERC721 } from "thirdweb/modules";

const result = await ClaimableERC721.getSaleConfig({

 contract,

});

`

##### Signature

`function getSaleConfig(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<string>;

`

### Parameters

##### options

 The options for the getSaleConfig function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## mint

 Mints ERC721 tokens to a specified address via a ClaimableERC721 module.

### Example

`import { ClaimableERC721 } from "thirdweb/modules";

const transaction = ClaimableERC721.mint({

 contract,

 to: "0x...", // Address to mint tokens to

 quantity: 2, // Amount of tokens to mint

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function mint(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MintParams](https://portal.thirdweb.com/references/typescript/v5/MintParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for minting tokens.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MintParams](https://portal.thirdweb.com/references/typescript/v5/MintParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A transaction to mint tokens.
## module

 Convenience function to add the ClaimableERC721 module as a default module on a core contract.

### Example

`import { ClaimableERC721, deployModularContract } from "thirdweb/modules";

const deployed = deployModularContract({

 client,

 chain,

 account,

 core: "ERC721",

 params: {

 name: "My Modular Contract",

 },

 modules: [

 ClaimableERC721.module({

 primarySaleRecipient: ...,

 }),

 ],

});

`

##### Signature

`` function module(

params: EncodeBytesOnInstallParams & { publisher?: string },

): (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: `0x${string}`; module: `0x${string}` }>;

 ``

### Parameters

##### params

 The parameters for the module.

#### Type

`let params: EncodeBytesOnInstallParams & { publisher?: string };

`

### Returns

##### Return Type

`` let returnType: (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: `0x${string}`; module: `0x${string}` }>;

 ``

* The module function.
## setClaimCondition

 Sets the claim conditions for a given token ID.

### Example

`import { ClaimableERC721 } from "thirdweb/modules";

const transaction = ClaimableERC721.setClaimCondition({

 contract: contract,

 pricePerToken: "1", // in ETH

 maxClaimableSupply: "1000000",

 maxClaimablePerWallet: "1",

});

await sendTransaction({ transaction, account });

`

##### Signature

`function setClaimCondition(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<ClaimConditionInput>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for setting the claim conditions.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<ClaimConditionInput>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A transaction to set the claim conditions.
## setSaleConfig

 Prepares a transaction to call the "setSaleConfig" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { ClaimableERC721 } from "thirdweb/modules";

const transaction = ClaimableERC721.setSaleConfig({

 contract,

 primarySaleRecipient: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setSaleConfig(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| SetSaleConfigParams

| { asyncParams: () => Promise<SetSaleConfigParams> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setSaleConfig" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| SetSaleConfigParams

| { asyncParams: () => Promise<SetSaleConfigParams> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## checkModulesCompatibility

 Check if the given modules are compatible with the given core contract

##### Signature

`function checkModulesCompatibility(options: {

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

coreBytecode: string;

moduleBytecodes: Array<string>;

}): Promise<boolean>;

`

### Parameters

##### options

#### Type

`let options: {

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

coreBytecode: string;

moduleBytecodes: Array<string>;

};

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`
## contractURI

 Calls the "contractURI" function on the contract.

### Example

`import { contractURI } from "thirdweb/extensions/common";

const result = await contractURI({

 contract,

});

`

##### Signature

`function contractURI(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<string>;

`

### Parameters

##### options

 The options for the contractURI function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## deployModularContract

 Deploys an thirdweb ERC20 contract of the given type. On chains where the thirdweb infrastructure contracts are not deployed, this function will deploy them as well.

### Example

`import { deployModularContract } from "thirdweb/modules";

const contractAddress = await deployModularContract({

 chain,

 client,

 account,

 core: "ERC20",

 params: {

 name: "MyToken",

 description: "My Token contract",

 symbol: "MT",

 },

 modules: [

 ClaimableERC721.module({

 primarySaleRecipient: "0x...",

 }),

 RoyaltyERC721.module({

 royaltyRecipient: "0x...",

 royaltyBps: 500n,

 }),

 ],

});

`

##### Signature

`function deployModularContract(options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

core: [CoreType](https://portal.thirdweb.com/references/typescript/v5/CoreType);

modules?: Array<[ModuleInstaller](https://portal.thirdweb.com/references/typescript/v5/ModuleInstaller)>;

params: [ModularContractParams](https://portal.thirdweb.com/references/typescript/v5/ModularContractParams);

publisher?: string;

salt?: string;

}): Promise<string>;

`

### Parameters

##### options

 The deployment options.

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

core: [CoreType](https://portal.thirdweb.com/references/typescript/v5/CoreType);

modules?: Array<[ModuleInstaller](https://portal.thirdweb.com/references/typescript/v5/ModuleInstaller)>;

params: [ModularContractParams](https://portal.thirdweb.com/references/typescript/v5/ModularContractParams);

publisher?: string;

salt?: string;

};

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The deployed contract address.
## getContractMetadata

 Retrieves the contract metadata including name and symbol.

### Example

`import { getContractMetadata } from "thirdweb/extensions/common";

const metadata = await getContractMetadata({ contract });

`

##### Signature

`function getContractMetadata(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<{ name: string; symbol: string }>;

`

### Parameters

##### options

 The transaction options.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<{ name: string; symbol: string }>;

`

 A promise that resolves to an object containing the resolved metadata, name, and symbol.
## getDefaultRoyaltyInfo

 Calls the "getDefaultRoyaltyInfo" function on the contract.

### Example

`import { getDefaultRoyaltyInfo } from "thirdweb/extensions/common";

const result = await getDefaultRoyaltyInfo({

 contract,

});

`

##### Signature

`function getDefaultRoyaltyInfo(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<readonly [string, number]>;

`

### Parameters

##### options

 The options for the getDefaultRoyaltyInfo function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<readonly [string, number]>;

`

 The parsed result of the function call.
## getDeployedModule

 Gets a deployed module implementation contract.

### Example

`import { getDeployedModule } from "thirdweb/modules";

const module = await getDeployedModule({

 client,

 chain,

 contractId,

 publisher,

});

`

##### Signature

`` function getDeployedModule(options: {

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

contractId: string;

publisher?: string;

}): Promise<null | Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<[], `0x${string}`>>>;

 ``

### Parameters

##### options

 The options to use.

#### Type

`let options: {

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

contractId: string;

publisher?: string;

};

`

### Returns

##### Return Type

`` let returnType: Promise<null | Readonly<

[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<[], `0x${string}`>

>>;

 ``

 The module.
## getRoyaltyInfoForToken

 Calls the "getRoyaltyInfoForToken" function on the contract.

### Example

`import { getRoyaltyInfoForToken } from "thirdweb/extensions/common";

const result = await getRoyaltyInfoForToken({

 contract,

 tokenId: ...,

});

`

##### Signature

`function getRoyaltyInfoForToken(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetRoyaltyInfoForTokenParams](https://portal.thirdweb.com/references/typescript/v5/GetRoyaltyInfoForTokenParams)>,

): Promise<readonly [string, number]>;

`

### Parameters

##### options

 The options for the getRoyaltyInfoForToken function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetRoyaltyInfoForTokenParams](https://portal.thirdweb.com/references/typescript/v5/GetRoyaltyInfoForTokenParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<readonly [string, number]>;

`

 The parsed result of the function call.
## getOrDeployModule

 Gets or deploys a module implementation contract.

### Example

`import { getOrDeployModule } from "thirdweb/modules";

const module = await getOrDeployModule({

 client,

 chain,

 account,

 contractId,

 publisher,

});

`

##### Signature

`` function getOrDeployModule(options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

contractId: string;

publisher?: string;

}): Promise<Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<[], `0x${string}`>>>;

 ``

### Parameters

##### options

 The options to use.

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

contractId: string;

publisher?: string;

};

`

### Returns

##### Return Type

`` let returnType: Promise<Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<[], `0x${string}`>>>;

 ``

 The module.
## getPlatformFeeInfo

 Calls the "getPlatformFeeInfo" function on the contract.

### Example

`import { getPlatformFeeInfo } from "thirdweb/extensions/common";

const result = await getPlatformFeeInfo({

 contract,

});

`

##### Signature

`function getPlatformFeeInfo(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<readonly [string, number]>;

`

### Parameters

##### options

 The options for the getPlatformFeeInfo function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<readonly [string, number]>;

`

 The parsed result of the function call.
## grantMinterRole

 Grants the minter role to a user.

### Example

`import { grantMinterRole } from "thirdweb/modules";

const tx = await grantMinterRole({

 contract,

 user: userAddress,

});

`

##### Signature

`function grantMinterRole(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GrantMinterRoleParams](https://portal.thirdweb.com/references/typescript/v5/GrantMinterRoleParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The transaction options.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GrantMinterRoleParams](https://portal.thirdweb.com/references/typescript/v5/GrantMinterRoleParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 The transaction to send.
## isGetContractMetadataSupported

 Checks if the `contractURI` method is supported by the given contract.

### Example

`import { isContractURISupported } from "thirdweb/extensions/common";

const supported = isContractURISupported(["0x..."]);

`

##### Signature

`function isGetContractMetadataSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `contractURI` method is supported.
## installPublishedModule

 Install a published module on a modular contract

### Example

`import { installPublishedModule } from "thirdweb/modules";

const transaction = installPublishedModule({

 client,

 chain,

 account,

 contract,

 moduleName: "MyModule",

 publisherAddress: "0x...",

});

await sendTransaction({ transaction, account });

`

##### Signature

`function installPublishedModule(

options: [InstallPublishedModuleOptions](https://portal.thirdweb.com/references/typescript/v5/InstallPublishedModuleOptions),

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for installing a published module

#### Type

`` let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

constructorParams?: Record<string, unknown>;

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

moduleData?: `0x${string}`;

moduleName: string;

nonce?: number;

publisher?: string;

version?: string;

};

 ``

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction to send
## isGetDefaultRoyaltyInfoSupported

 Checks if the `getDefaultRoyaltyInfo` method is supported by the given contract.

### Example

`import { isGetDefaultRoyaltyInfoSupported } from "thirdweb/extensions/common";

const supported = isGetDefaultRoyaltyInfoSupported(["0x..."]);

`

##### Signature

`function isGetDefaultRoyaltyInfoSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getDefaultRoyaltyInfo` method is supported.
## isGetRoyaltyInfoForTokenSupported

 Checks if the `getRoyaltyInfoForToken` method is supported by the given contract.

### Example

`import { isGetRoyaltyInfoForTokenSupported } from "thirdweb/extensions/common";

const supported = isGetRoyaltyInfoForTokenSupported(["0x..."]);

`

##### Signature

`function isGetRoyaltyInfoForTokenSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getRoyaltyInfoForToken` method is supported.
## isGetPlatformFeeInfoSupported

 Checks if the `getPlatformFeeInfo` method is supported by the given contract.

### Example

`import { isGetPlatformFeeInfoSupported } from "thirdweb/extensions/common";

const supported = isGetPlatformFeeInfoSupported(["0x..."]);

`

##### Signature

`function isGetPlatformFeeInfoSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getPlatformFeeInfo` method is supported.
## isMulticallSupported

 Checks if the `multicall` method is supported by the given contract.

### Example

`import { isMulticallSupported } from "thirdweb/extensions/common";

const supported = isMulticallSupported(["0x..."]);

`

##### Signature

`function isMulticallSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `multicall` method is supported.
## isOwnerSupported

 Checks if the `owner` method is supported by the given contract.

### Example

`import { isOwnerSupported } from "thirdweb/extensions/common";

const supported = isOwnerSupported(["0x..."]);

`

##### Signature

`function isOwnerSupported(availableSelectors: Array<string>): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `owner` method is supported.
## isPrimarySaleRecipientSupported

 Checks if the `primarySaleRecipient` method is supported by the given contract.

### Example

`import { isPrimarySaleRecipientSupported } from "thirdweb/extensions/common";

const supported = isPrimarySaleRecipientSupported(["0x..."]);

`

##### Signature

`function isPrimarySaleRecipientSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `primarySaleRecipient` method is supported.
## SiteEmbed

 Embeds another thirdweb-supported site for seamless in-app and ecosystem wallet connection.

 Make sure the embedded site includes `<AutoConnect />` and supports frame ancestors, see [ here](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/frame-ancestors) for more information.

 The embedded site must support the connected wallet (ecosystem or in-app).

### Example

`import { SiteEmbed } from "thirdweb/react";

<SiteEmbed

src="https://thirdweb.com"

client={thirdwebClient}

ecosystem={{ id: "ecosystem.thirdweb" }}

/>;

`

##### Signature

`function SiteEmbed(

props: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

ecosystem?: Ecosystem;

src: string;

 } & ClassAttributes<HTMLIFrameElement> &

IframeHTMLAttributes<HTMLIFrameElement>,

): Element;

`

### Parameters

##### props

 The props to pass to the iframe

#### Type

`let props: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

ecosystem?: Ecosystem;

src: string;

} & ClassAttributes<HTMLIFrameElement> &

IframeHTMLAttributes<HTMLIFrameElement>;

`

### Returns

##### Return Type

`let returnType: Element;

`
## isNameSupported

 Checks if the `name` method is supported by the given contract.

### Example

`import { isNameSupported } from "thirdweb/extensions/common";

const supported = isNameSupported(["0x..."]);

`

##### Signature

`function isNameSupported(availableSelectors: Array<string>): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `name` method is supported.
## isSetPlatformFeeInfoSupported

 Checks if the `setPlatformFeeInfo` method is supported by the given contract.

### Example

`import { isSetPlatformFeeInfoSupported } from "thirdweb/extensions/common";

const supported = isSetPlatformFeeInfoSupported(["0x..."]);

`

##### Signature

`function isSetPlatformFeeInfoSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `setPlatformFeeInfo` method is supported.
## isSetContractURISupported

 Checks if the `setContractURI` method is supported by the given contract.

### Example

`import { isSetContractURISupported } from "thirdweb/extensions/common";

const supported = isSetContractURISupported(["0x..."]);

`

##### Signature

`function isSetContractURISupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `setContractURI` method is supported.
## isSetPrimarySaleRecipientSupported

 Checks if the `setPrimarySaleRecipient` method is supported by the given contract.

### Example

`import { isSetPrimarySaleRecipientSupported } from "thirdweb/extensions/common";

const supported = isSetPrimarySaleRecipientSupported(["0x..."]);

`

##### Signature

`function isSetPrimarySaleRecipientSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `setPrimarySaleRecipient` method is supported.
## isSetDefaultRoyaltyInfoSupported

 Checks if the `setDefaultRoyaltyInfo` method is supported by the given contract.

### Example

`import { isSetDefaultRoyaltyInfoSupported } from "thirdweb/extensions/common";

const supported = isSetDefaultRoyaltyInfoSupported(["0x..."]);

`

##### Signature

`function isSetDefaultRoyaltyInfoSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `setDefaultRoyaltyInfo` method is supported.
## isSymbolSupported

 Checks if the `symbol` method is supported by the given contract.

### Example

`import { isSymbolSupported } from "thirdweb/extensions/common";

const supported = isSymbolSupported(["0x..."]);

`

##### Signature

`function isSymbolSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `symbol` method is supported.
## isSetRoyaltyInfoForTokenSupported

 Checks if the `setRoyaltyInfoForToken` method is supported by the given contract.

### Example

`import { isSetRoyaltyInfoForTokenSupported } from "thirdweb/extensions/common";

const supported = isSetRoyaltyInfoForTokenSupported(["0x..."]);

`

##### Signature

`function isSetRoyaltyInfoForTokenSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `setRoyaltyInfoForToken` method is supported.
## multicall

 Prepares a transaction to call the "multicall" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { multicall } from "thirdweb/extensions/common";

const transaction = multicall({

 contract,

 data: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function multicall(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[MulticallParams](https://portal.thirdweb.com/references/typescript/v5/MulticallParams) | { asyncParams: () => Promise<[MulticallParams](https://portal.thirdweb.com/references/typescript/v5/MulticallParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "multicall" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[MulticallParams](https://portal.thirdweb.com/references/typescript/v5/MulticallParams) | { asyncParams: () => Promise<[MulticallParams](https://portal.thirdweb.com/references/typescript/v5/MulticallParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## name

 Retrieves the name associated with the given contract.

### Example

`import { name } from "thirdweb/extensions/common";

const contractName = await name({ contract });

`

##### Signature

`function name(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)): Promise<string>;

`

### Parameters

##### options

 The options for the transaction.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 A promise that resolves to the name associated with the contract.
## owner

 Calls the "owner" function on the contract.

### Example

`import { owner } from "thirdweb/extensions/common";

const result = await owner({

 contract,

});

`

##### Signature

`function owner(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)): Promise<string>;

`

### Parameters

##### options

 The options for the owner function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## ownerUpdatedEvent

 Creates an event object for the OwnerUpdated event.

### Example

`import { getContractEvents } from "thirdweb";

import { ownerUpdatedEvent } from "thirdweb/extensions/common";

const events = await getContractEvents({

contract,

events: [

ownerUpdatedEvent({

 prevOwner: ...,

 newOwner: ...,

})

],

});

`

##### Signature

`function ownerUpdatedEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "prevOwner";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "newOwner";

readonly type: "address";

 },

 ];

readonly name: "OwnerUpdated";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "prevOwner";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "newOwner";

readonly type: "address";

 },

 ];

readonly name: "OwnerUpdated";

readonly type: "event";

}>;

`

 The prepared event object.
## primarySaleRecipient

 Calls the "primarySaleRecipient" function on the contract.

### Example

`import { primarySaleRecipient } from "thirdweb/extensions/common";

const result = await primarySaleRecipient({

 contract,

});

`

##### Signature

`function primarySaleRecipient(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<string>;

`

### Parameters

##### options

 The options for the primarySaleRecipient function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## setContractMetadata

 Sets the metadata for a contract.

### Example

`import { setContractMetadata } from "@thirdweb/extensions/common";

import { sendTransaction } from "thirdweb";

const transaction = setContractMetadata({

 contract,

 name: "My NFT",

 symbol: "NFT",

});

// Send the transaction

await sendTransaction({

 transaction,

 account,

});

`

##### Signature

`function setContractMetadata(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[SetContractMetadataParams](https://portal.thirdweb.com/references/typescript/v5/SetContractMetadataParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for setting the contract metadata.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[SetContractMetadataParams](https://portal.thirdweb.com/references/typescript/v5/SetContractMetadataParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

* The prepared transaction to set the contract metadata.
## setContractURI

 Prepares a transaction to call the "setContractURI" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { setContractURI } from "thirdweb/extensions/common";

const transaction = setContractURI({

 contract,

 uri: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setContractURI(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetContractURIParams](https://portal.thirdweb.com/references/typescript/v5/SetContractURIParams)

| { asyncParams: () => Promise<[SetContractURIParams](https://portal.thirdweb.com/references/typescript/v5/SetContractURIParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setContractURI" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetContractURIParams](https://portal.thirdweb.com/references/typescript/v5/SetContractURIParams)

| { asyncParams: () => Promise<[SetContractURIParams](https://portal.thirdweb.com/references/typescript/v5/SetContractURIParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## setOwner

 Prepares a transaction to call the "setOwner" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { setOwner } from "thirdweb/extensions/common";

const transaction = setOwner({

 contract,

 newOwner: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setOwner(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[SetOwnerParams](https://portal.thirdweb.com/references/typescript/v5/SetOwnerParams) | { asyncParams: () => Promise<[SetOwnerParams](https://portal.thirdweb.com/references/typescript/v5/SetOwnerParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setOwner" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[SetOwnerParams](https://portal.thirdweb.com/references/typescript/v5/SetOwnerParams) | { asyncParams: () => Promise<[SetOwnerParams](https://portal.thirdweb.com/references/typescript/v5/SetOwnerParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## setDefaultRoyaltyInfo

 Prepares a transaction to call the "setDefaultRoyaltyInfo" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { setDefaultRoyaltyInfo } from "thirdweb/extensions/common";

const transaction = setDefaultRoyaltyInfo({

 contract,

 royaltyRecipient: ...,

 royaltyBps: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setDefaultRoyaltyInfo(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetDefaultRoyaltyInfoParams](https://portal.thirdweb.com/references/typescript/v5/SetDefaultRoyaltyInfoParams)

| { asyncParams: () => Promise<[SetDefaultRoyaltyInfoParams](https://portal.thirdweb.com/references/typescript/v5/SetDefaultRoyaltyInfoParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setDefaultRoyaltyInfo" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetDefaultRoyaltyInfoParams](https://portal.thirdweb.com/references/typescript/v5/SetDefaultRoyaltyInfoParams)

| { asyncParams: () => Promise<[SetDefaultRoyaltyInfoParams](https://portal.thirdweb.com/references/typescript/v5/SetDefaultRoyaltyInfoParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## setPrimarySaleRecipient

 Prepares a transaction to call the "setPrimarySaleRecipient" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { setPrimarySaleRecipient } from "thirdweb/extensions/common";

const transaction = setPrimarySaleRecipient({

 contract,

 saleRecipient: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setPrimarySaleRecipient(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetPrimarySaleRecipientParams](https://portal.thirdweb.com/references/typescript/v5/SetPrimarySaleRecipientParams)

| { asyncParams: () => Promise<[SetPrimarySaleRecipientParams](https://portal.thirdweb.com/references/typescript/v5/SetPrimarySaleRecipientParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setPrimarySaleRecipient" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetPrimarySaleRecipientParams](https://portal.thirdweb.com/references/typescript/v5/SetPrimarySaleRecipientParams)

| { asyncParams: () => Promise<[SetPrimarySaleRecipientParams](https://portal.thirdweb.com/references/typescript/v5/SetPrimarySaleRecipientParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## setRoyaltyInfoForToken

 Prepares a transaction to call the "setRoyaltyInfoForToken" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { setRoyaltyInfoForToken } from "thirdweb/extensions/common";

const transaction = setRoyaltyInfoForToken({

 contract,

 tokenId: ...,

 recipient: ...,

 bps: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setRoyaltyInfoForToken(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetRoyaltyInfoForTokenParams](https://portal.thirdweb.com/references/typescript/v5/SetRoyaltyInfoForTokenParams)

| { asyncParams: () => Promise<[SetRoyaltyInfoForTokenParams](https://portal.thirdweb.com/references/typescript/v5/SetRoyaltyInfoForTokenParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setRoyaltyInfoForToken" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetRoyaltyInfoForTokenParams](https://portal.thirdweb.com/references/typescript/v5/SetRoyaltyInfoForTokenParams)

| { asyncParams: () => Promise<[SetRoyaltyInfoForTokenParams](https://portal.thirdweb.com/references/typescript/v5/SetRoyaltyInfoForTokenParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## setPlatformFeeInfo

 Prepares a transaction to call the "setPlatformFeeInfo" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { setPlatformFeeInfo } from "thirdweb/extensions/common";

const transaction = setPlatformFeeInfo({

 contract,

 platformFeeRecipient: ...,

 platformFeeBps: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setPlatformFeeInfo(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetPlatformFeeInfoParams](https://portal.thirdweb.com/references/typescript/v5/SetPlatformFeeInfoParams)

| { asyncParams: () => Promise<[SetPlatformFeeInfoParams](https://portal.thirdweb.com/references/typescript/v5/SetPlatformFeeInfoParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setPlatformFeeInfo" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetPlatformFeeInfoParams](https://portal.thirdweb.com/references/typescript/v5/SetPlatformFeeInfoParams)

| { asyncParams: () => Promise<[SetPlatformFeeInfoParams](https://portal.thirdweb.com/references/typescript/v5/SetPlatformFeeInfoParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## symbol

 Retrieves the name associated with the given contract.

### Example

`import { symbol } from "thirdweb/extensions/common";

const contractSymbol = await symbol({ contract });

`

##### Signature

`function symbol(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)): Promise<string>;

`

### Parameters

##### options

 The options for the transaction.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 A promise that resolves to the name associated with the contract.
## uninstallPublishedModule

 Uninstall a published module

### Example

`import { uninstallPublishedModule } from "thirdweb/modules";

const transaction = uninstallPublishedModule({

 client,

 chain,

 contract,

 moduleName: "MyModule",

 publisherAddress: "0x...",

});

await sendTransaction({ transaction, account });

`

##### Signature

`function uninstallPublishedModule(

options: [UninstallPublishedModuleOptions](https://portal.thirdweb.com/references/typescript/v5/UninstallPublishedModuleOptions),

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for uninstalling a published module

#### Type

`` let options: {

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

moduleData?: `0x${string}`;

moduleName: string;

publisherAddress?: string;

version?: string;

};

 ``

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction to send
## uninstallModuleByProxy

 Uninstall an module by proxy

### Example

`import { uninstallModuleByProxy } from "thirdweb/modules";

const transaction = uninstallModuleByProxy({

 client,

 chain,

 contract,

 moduleProxyAddress: "0x...",

});

await sendTransaction({ transaction, account });

`

##### Signature

`function uninstallModuleByProxy(

options: [UninstallModuleByProxyOptions](https://portal.thirdweb.com/references/typescript/v5/UninstallModuleByProxyOptions),

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for uninstalling an module by proxy

#### Type

`` let options: {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

moduleData?: `0x${string}`;

moduleProxyAddress: string;

};

 ``

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction to send
## UI Components

##### Wallets

##### Wallet Connection

##### Chain

##### Transactions

##### NFT

##### Tokens

##### Miscellaneous
## computeDeploymentAddress

 Computes the deployment address for a contract based on the given options.

### Example

`import { computeDeploymentAddress } from "thirdweb/utils";

const deploymentAddress = computeDeploymentAddress({

 bytecode,

 encodedArgs,

 create2FactoryAddress,

 salt,

});

`

##### Signature

`function computeDeploymentAddress(

options: ComputeDeploymentAddressOptions,

): string;

`

### Parameters

##### options

 The options for computing the deployment address.

#### Type

`let options: ComputeDeploymentAddressOptions;

`

### Returns

##### Return Type

`let returnType: string;

`

 The computed deployment address.
## concatHex

 Concatenates an array of hexadecimal values into a single hexadecimal value.

##### Signature

`` function concatHex(values: readonly Array<`0x${string}`>) : `0x${string}`

 ``

### Parameters

##### values

 An array of hexadecimal values to concatenate.

#### Type

`` let values: readonly Array<`0x${string}`>

 ``

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

 The concatenated hexadecimal value.
## convertCryptoToFiat

 Get a price of a token (using tokenAddress + chainId) in fiat. Only USD is supported at the moment.

### Example

####  Basic usage

 For native token (non-ERC20), you should use NATIVE\_TOKEN\_ADDRESS as the value for `tokenAddress`

`` import { convertCryptoToFiat } from "thirdweb/pay";

// Get Ethereum price

const result = convertCryptoToFiat({

 fromTokenAddress: NATIVE_TOKEN_ADDRESS,

 to: "USD",

 chain: ethereum,

 fromAmount: 1,

});

// Result: `{ result: 3404.11 }`

 ``

##### Signature

`function convertCryptoToFiat(

options: [ConvertCryptoToFiatParams](https://portal.thirdweb.com/references/typescript/v5/ConvertCryptoToFiatParams),

): Promise<{ result: number }>;

`

### Parameters

##### options

#### Type

`let options: {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

fromAmount: number;

fromTokenAddress: Address;

to: SupportedFiatCurrency;

};

`

### Returns

##### Return Type

`let returnType: Promise<{ result: number }>;

`

 a number representing the price (in selected fiat) of "x" token, with "x" being the `fromAmount` .
## convertFiatToCrypto

 Convert a fiat value to a token. Currently only USD is supported.

### Example

####  Basic usage

`import { convertFiatToCrypto } from "thirdweb/pay";

// Convert 2 cents to ETH

const result = await convertFiatToCrypto({

 from: "USD",

// the token address. For native token, use NATIVE_TOKEN_ADDRESS

 to: "0x...",

// the chain (of the chain where the token belong to)

 chain: ethereum,

// 2 cents

 fromAmount: 0.02,

});

`

 Result: `{ result: 0.0000057 }`

##### Signature

`function convertFiatToCrypto(

options: [ConvertFiatToCryptoParams](https://portal.thirdweb.com/references/typescript/v5/ConvertFiatToCryptoParams),

): Promise<{ result: number }>;

`

### Parameters

##### options

#### Type

`let options: {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

from: SupportedFiatCurrency;

fromAmount: number;

to: Address;

};

`

### Returns

##### Return Type

`let returnType: Promise<{ result: number }>;

`
## createAndSignUserOp

 Create and sign a user operation.

### Example

`import { createAndSignUserOp } from "thirdweb/wallets/smart";

const userOp = await createAndSignUserOp({

 client,

 adminAccount,

 smartWalletOptions,

 transactions,

});

`

##### Signature

`function createAndSignUserOp(options: {

adminAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

isDeployedOverride?: boolean;

smartWalletOptions: [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions);

transactions: Array<[PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)>;

waitForDeployment?: boolean;

}): Promise<UserOperationV06 | UserOperationV07>;

`

### Parameters

##### options

 The options for creating and signing the user operation

#### Type

`let options: {

adminAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

isDeployedOverride?: boolean;

smartWalletOptions: [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions);

transactions: Array<[PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)>;

waitForDeployment?: boolean;

};

`

### Returns

##### Return Type

`let returnType: Promise<UserOperationV06 | UserOperationV07>;

`

* The signed user operation
## createAuth

 Creates an authentication object with the given options.

### Example

`import { createAuth } from 'thirdweb/auth';

const auth = createAuth({...});

// 1. generate a login payload for a client on the server side

const loginPayload = await auth.generatePayload({ address: '0x123...' });

// 2. send the login payload to the client

// 3. verify the login payload that the client sends back later

const verifiedPayload = await auth.verifyPayload({ payload: loginPayload, signature: '0x123...' });

// 4. generate a JWT for the client

const jwt = await auth.generateJWT({ payload: verifiedPayload });

// 5. set the JWT as a cookie or otherwise provide it to the client

// 6. authenticate the client based on the JWT on subsequent calls

const { valid, parsedJWT } = await auth.verifyJWT({ jwt });

`

##### Signature

`function createAuth(options: [AuthOptions](https://portal.thirdweb.com/references/typescript/v5/AuthOptions)): {

generateJWT: (params: GenerateJWTParams) => Promise<string>;

generatePayload: (

__namedParameters: [GenerateLoginPayloadParams](https://portal.thirdweb.com/references/typescript/v5/GenerateLoginPayloadParams),

 ) => Promise<[LoginPayload](https://portal.thirdweb.com/references/typescript/v5/LoginPayload)>;

verifyJWT: (params: VerifyJWTParams) => Promise<VerifyJWTResult>;

verifyPayload: (

__namedParameters: [VerifyLoginPayloadParams](https://portal.thirdweb.com/references/typescript/v5/VerifyLoginPayloadParams),

 ) => Promise<[VerifyLoginPayloadResult](https://portal.thirdweb.com/references/typescript/v5/VerifyLoginPayloadResult)>;

};

`

### Parameters

##### options

 The options for creating the authentication object.

#### Type

`let options: {

adminAccount?: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

client?: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

domain: string;

jwt?: {

expirationTimeSeconds?: number;

jwtId?: {

generate: () => string | Promise<string>;

validate: (jwtId: string) => boolean | Promise<boolean>;

 };

 };

login?: {

nonce?: {

generate: () => string | Promise<string>;

validate: (nonce: string) => boolean | Promise<boolean>;

 };

payloadExpirationTimeSeconds?: number;

resources?: Array<string>;

statement?: string;

uri?: string;

version?: string;

 };

};

`

### Returns

##### Return Type

`let returnType: {

generateJWT: (params: GenerateJWTParams) => Promise<string>;

generatePayload: (

__namedParameters: [GenerateLoginPayloadParams](https://portal.thirdweb.com/references/typescript/v5/GenerateLoginPayloadParams),

 ) => Promise<[LoginPayload](https://portal.thirdweb.com/references/typescript/v5/LoginPayload)>;

verifyJWT: (params: VerifyJWTParams) => Promise<VerifyJWTResult>;

verifyPayload: (

__namedParameters: [VerifyLoginPayloadParams](https://portal.thirdweb.com/references/typescript/v5/VerifyLoginPayloadParams),

 ) => Promise<[VerifyLoginPayloadResult](https://portal.thirdweb.com/references/typescript/v5/VerifyLoginPayloadResult)>;

};

`

 The created authentication object.
## createThirdwebClient

 Creates a Thirdweb client using the provided client ID (client-side) or secret key (server-side).

 Get your client ID and secret key from the Thirdweb dashboard [ here](https://thirdweb.com/create-api-key) . \*\*Never share your secret key with anyone.

 A client is necessary for most functions in the thirdweb SDK. It provides access to thirdweb APIs including built-in RPC, storage, and more.

### Example

 Create a client on the client side (client ID):

`import { createThirdwebClient } from "thirdweb";

const client = createThirdwebClient({ clientId: "..." });

`

 Create a client on the server (secret key):

`import { createThirdwebClient } from "thirdweb";

const client = createThirdwebClient({ secretKey: "..." });

`

##### Signature

`function createThirdwebClient(

options: [CreateThirdwebClientOptions](https://portal.thirdweb.com/references/typescript/v5/CreateThirdwebClientOptions),

): [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

### Parameters

##### options

 The options for creating the client.

#### Type

`let options: Prettify<

 (

| { clientId: string; secretKey?: string }

| { clientId?: string; secretKey: string }

 ) &

ClientOptions

>;

`

### Returns

##### Return Type

`let returnType: {

readonly clientId: string;

readonly secretKey: string | undefined;

} & Readonly<ClientOptions>;

`

 The created Thirdweb client.
## createUnsignedUserOp

 Creates an unsigned user operation from a prepared transaction.

### Example

`import { createUnsignedUserOp } from "thirdweb/wallets/smart";

const transaction = prepareContractCall(...);

const userOp = await createUnsignedUserOp({

 transaction,

 factoryContract,

 accountContract,

 adminAddress,

 sponsorGas,

 overrides,

});

`

##### Signature

`` function createUnsignedUserOp(args: {

accountContract: Readonly;

adminAddress: string;

factoryContract: Readonly;

isDeployedOverride?: boolean;

overrides?: {

accountAddress?: string;

accountSalt?: string;

bundlerUrl?: string;

createAccount?: (

factoryContract: Readonly,

admin: string,

 ) => [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

entrypointAddress?: string;

execute?: (

accountContract: Readonly,

transaction: SendTransactionOption,

 ) => [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

executeBatch?: (

accountContract: Readonly,

transactions: Array<SendTransactionOption>,

 ) => [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

getAccountNonce?: (accountContract: Readonly) => Promise<bigint>;

paymaster?: (

userOp: UserOperationV06 | UserOperationV07,

 ) => Promise<[PaymasterResult](https://portal.thirdweb.com/references/typescript/v5/PaymasterResult)>;

predictAddress?: (

factoryContract: Readonly,

admin: string,

 ) => Promise<string>;

signMessage?: (options: {

accountContract: Readonly;

adminAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

factoryContract: Readonly;

message: SignableMessage;

 }) => Promise<`0x${string}`>;

signTypedData?: (options: {

accountContract: Readonly;

adminAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

factoryContract: Readonly;

typedData: Definition<typedData, primaryType>;

 }) => Promise<`0x${string}`>;

tokenPaymaster?: TokenPaymasterConfig;

 };

sponsorGas: boolean;

transaction: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

waitForDeployment?: boolean;

}): Promise<UserOperationV06 | UserOperationV07>;

 ``

### Parameters

##### args

 The prepared transaction and options

#### Type

`` let args: {

accountContract: Readonly;

adminAddress: string;

factoryContract: Readonly;

isDeployedOverride?: boolean;

overrides?: {

accountAddress?: string;

accountSalt?: string;

bundlerUrl?: string;

createAccount?: (

factoryContract: Readonly,

admin: string,

 ) => [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

entrypointAddress?: string;

execute?: (

accountContract: Readonly,

transaction: SendTransactionOption,

 ) => [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

executeBatch?: (

accountContract: Readonly,

transactions: Array<SendTransactionOption>,

 ) => [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

getAccountNonce?: (accountContract: Readonly) => Promise<bigint>;

paymaster?: (

userOp: UserOperationV06 | UserOperationV07,

 ) => Promise<[PaymasterResult](https://portal.thirdweb.com/references/typescript/v5/PaymasterResult)>;

predictAddress?: (

factoryContract: Readonly,

admin: string,

 ) => Promise<string>;

signMessage?: (options: {

accountContract: Readonly;

adminAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

factoryContract: Readonly;

message: SignableMessage;

 }) => Promise<`0x${string}`>;

signTypedData?: (options: {

accountContract: Readonly;

adminAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

factoryContract: Readonly;

typedData: Definition<typedData, primaryType>;

 }) => Promise<`0x${string}`>;

tokenPaymaster?: TokenPaymasterConfig;

 };

sponsorGas: boolean;

transaction: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

waitForDeployment?: boolean;

};

 ``

### Returns

##### Return Type

`let returnType: Promise<UserOperationV06 | UserOperationV07>;

`

* The unsigned user operation
## createContractQuery

 Creates a `useQuery` hook for a contract call.

### Example

`import { createContractQuery } from "thirdweb/react";

import { totalSupply } from "thirdweb/extensions/erc20";

const useTotalSupply = createContractQuery(totalSupply);

const { data, isLoading } = useTotalSupply({ contract });

`

##### Signature

`` function createContractQuery(

readCall: (

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<opts, abi>,

 ) => Promise<result>,

): (

options: {

contract: Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<abi, `0x${string}`>>;

 } & opts & { queryOptions?: Partial<{ enabled: boolean }> },

) => UseQueryResult<result, Error>;

 ``

### Parameters

##### readCall

 A function that performs the contract function call and returns the result.

#### Type

`let readCall: (

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<opts, abi>,

) => Promise<result>;

`

### Returns

##### Return Type

`` let returnType: (

options: {

contract: Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<abi, `0x${string}`>>;

 } & opts & { queryOptions?: Partial<{ enabled: boolean }> },

) => UseQueryResult<result, Error>;

 ``

 An object containing the created `useRead` hook.
## createWalletAdapter

 Creates a wallet from the given account.

 You can use this to:

* convert a third party library wallet (wagmi, viem, ethers) into a thirdweb wallet.
* connect with a private key (for automated tests)

 Available wallet adatpers:

* [ Viem](https://portal.thirdweb.com/references/typescript/v5/viemAdapter)
* [ Ethers 6](https://portal.thirdweb.com/references/typescript/v5/ethers6Adapter)
* [ Ethers 5](https://portal.thirdweb.com/references/typescript/v5/ethers5Adapter)

### Example

`import { createWalletAdapter } from "thirdweb";

const wallet = createWalletAdapter({

 client,

 adaptedAccount,

 chain,

onDisconnect: () => {

// disconnect logic

 },

switchChain: async (chain) => {

// switch chain logic

 },

});

`

##### Signature

`function createWalletAdapter(

options: [AdapterWalletOptions](https://portal.thirdweb.com/references/typescript/v5/AdapterWalletOptions),

): [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)<"adapter">;

`

### Parameters

##### options

 The options for the adapter wallet.

#### Type

`let options: {

adaptedAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

onDisconnect: () => Promise<void> | void;

switchChain: (chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain)) => Promise<void> | void;

};

`

### Returns

##### Return Type

`let returnType: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)<"adapter">;

`

 a wallet instance.
## createWalletConnectClient

 Creates a new WalletConnect client for interacting with another application.

### Example

`import { createWalletConnectClient } from "thirdweb/wallets";

const client = await createWalletConnectClient({

 wallet: wallet,

 client: client,

});

`

 Pass custom handlers:

`import { createWalletConnectClient } from "thirdweb/wallets";

const client = await createWalletConnectClient({

 wallet: wallet,

 client: client,

 requestHandlers: {

eth_signTransaction: ({ account, chainId, params }) => {

// handle transaction signing

 },

 },

});

`

 Pass connect and disconnect callbacks:

`import { createWalletConnectClient } from "thirdweb/wallets";

const client = await createWalletConnectClient({

 wallet: wallet,

 client: client,

onConnect: (session) => {

 console.log("Connected to WalletConnect", session);

 },

onDisconnect: (session) => {

 console.log("Disconnected from WalletConnect", session);

 },

});

`

##### Signature

`` function createWalletConnectClient(options: {

appMetadata?: AppMetadata;

chains?: Array<Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>>;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

onConnect?: (session: [WalletConnectSession](https://portal.thirdweb.com/references/typescript/v5/WalletConnectSession)) => void;

onDisconnect?: (session: [WalletConnectSession](https://portal.thirdweb.com/references/typescript/v5/WalletConnectSession)) => void;

onError?: (error: Error) => void;

projectId?: string;

requestHandlers?: {

eth_sendRawTransaction?: (_: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chainId: number;

params: WalletConnectRawTransactionRequestParams;

 }) => Promise<`0x${string}` | WalletConnectRequestError>;

eth_sendTransaction?: (_: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chainId: number;

params: WalletConnectTransactionRequestParams;

 }) => Promise<`0x${string}` | WalletConnectRequestError>;

eth_sign?: (_: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

params: WalletConnectSignRequestPrams;

 }) => Promise<`0x${string}` | WalletConnectRequestError>;

eth_signTransaction?: (_: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

params: WalletConnectTransactionRequestParams;

 }) => Promise<`0x${string}` | WalletConnectRequestError>;

eth_signTypedData?: (_: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

params: WalletConnectSignTypedDataRequestParams;

 }) => Promise<`0x${string}` | WalletConnectRequestError>;

eth_signTypedData_v4?: (_: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

params: WalletConnectSignTypedDataRequestParams;

 }) => Promise<`0x${string}` | WalletConnectRequestError>;

personal_sign?: (_: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

params: WalletConnectSignRequestPrams;

 }) => Promise<`0x${string}` | WalletConnectRequestError>;

wallet_addEthereumChain?: (_: {

params: WalletConnectAddEthereumChainRequestParams;

wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

 }) => Promise<`0x${string}`>;

wallet_switchEthereumChain?: (_: {

params: WalletConnectSwitchEthereumChainRequestParams;

wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

 }) => Promise<`0x${string}`>;

 };

wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

}): Promise<SignClient>;

 ``

### Parameters

##### options

 The options to use to create the WalletConnect client.

#### Type

`` let options: {

appMetadata?: AppMetadata;

chains?: Array<Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>>;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

onConnect?: (session: [WalletConnectSession](https://portal.thirdweb.com/references/typescript/v5/WalletConnectSession)) => void;

onDisconnect?: (session: [WalletConnectSession](https://portal.thirdweb.com/references/typescript/v5/WalletConnectSession)) => void;

onError?: (error: Error) => void;

projectId?: string;

requestHandlers?: {

eth_sendRawTransaction?: (_: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chainId: number;

params: WalletConnectRawTransactionRequestParams;

 }) => Promise<`0x${string}` | WalletConnectRequestError>;

eth_sendTransaction?: (_: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chainId: number;

params: WalletConnectTransactionRequestParams;

 }) => Promise<`0x${string}` | WalletConnectRequestError>;

eth_sign?: (_: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

params: WalletConnectSignRequestPrams;

 }) => Promise<`0x${string}` | WalletConnectRequestError>;

eth_signTransaction?: (_: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

params: WalletConnectTransactionRequestParams;

 }) => Promise<`0x${string}` | WalletConnectRequestError>;

eth_signTypedData?: (_: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

params: WalletConnectSignTypedDataRequestParams;

 }) => Promise<`0x${string}` | WalletConnectRequestError>;

eth_signTypedData_v4?: (_: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

params: WalletConnectSignTypedDataRequestParams;

 }) => Promise<`0x${string}` | WalletConnectRequestError>;

personal_sign?: (_: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

params: WalletConnectSignRequestPrams;

 }) => Promise<`0x${string}` | WalletConnectRequestError>;

wallet_addEthereumChain?: (_: {

params: WalletConnectAddEthereumChainRequestParams;

wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

 }) => Promise<`0x${string}`>;

wallet_switchEthereumChain?: (_: {

params: WalletConnectSwitchEthereumChainRequestParams;

wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

 }) => Promise<`0x${string}`>;

 };

wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

};

 ``

### Returns

##### Return Type

`let returnType: Promise<SignClient>;

`

 The WalletConnect client. Use this client to connect to a WalletConnect URI with createWalletConnectSession.
## createWallet

 Creates a wallet based on the provided ID and arguments.

* Supports 500+ wallets
* Handles both injected browser wallets and WalletConnect sessions

[ View all available wallets](https://portal.thirdweb.com/typescript/v5/supported-wallets)

### Example

###  Connecting the wallet

 Once created, you can connect the wallet to your app by calling the `connect` method.

 The `connect` method returns a promise that resolves to the connected account.

 Each wallet type can have different connect options. [ View the different connect options](https://portal.thirdweb.com/references/typescript/v5/WalletConnectionOption)

###  Connecting to an injected wallet

`import { createWallet } from "thirdweb/wallets";

const metamaskWallet = createWallet("io.metamask");

const account = await metamaskWallet.connect({

 client,

});

`

 You can check if a wallet is installed by calling the [ injectedProvider](https://portal.thirdweb.com/references/typescript/v5/injectedProvider) method.

###  Connecting via WalletConnect modal

`import { createWallet } from "thirdweb/wallets";

const metamaskWallet = createWallet("io.metamask");

await metamask.connect({

 client,

 walletConnect: {

 projectId: "YOUR_PROJECT_ID",

 showQrModal: true,

 appMetadata: {

 name: "My App",

 url: "https://my-app.com",

 description: "my app description",

 logoUrl: "https://path/to/my-app/logo.svg",

 },

 },

});

`

[ View ConnectWallet connection options](https://portal.thirdweb.com/references/typescript/v5/WCConnectOptions)

###  Connecting with coinbase wallet

`import { createWallet } from "thirdweb/wallets";

const cbWallet = createWallet("com.coinbase.wallet", {

 appMetadata: {

 name: "My App",

 url: "https://my-app.com",

 description: "my app description",

 logoUrl: "https://path/to/my-app/logo.svg",

 },

 walletConfig: {

// options: 'all' | 'smartWalletOnly' | 'eoaOnly'

 options: "all",

 },

});

const account = await cbWallet.connect({

 client,

});

`

[ View Coinbase wallet creation options](https://portal.thirdweb.com/references/typescript/v5/CoinbaseWalletCreationOptions)

###  Connecting with a smart wallet

`import { createWallet } from "thirdweb/wallets";

const wallet = createWallet("smart", {

 chain: sepolia,

 sponsorGas: true,

});

const account = await wallet.connect({

 client,

 personalAccount, // pass the admin account

});

`

##### Signature

`function createWallet(...args: [CreateWalletArgs](https://portal.thirdweb.com/references/typescript/v5/CreateWalletArgs)<ID>): [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)<ID>;

`

### Parameters

##### args

 The arguments for creating the wallet.

#### Type

`let args: [CreateWalletArgs](https://portal.thirdweb.com/references/typescript/v5/CreateWalletArgs)<ID>;

`

### Returns

##### Return Type

`let returnType: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)<ID>;

`

* The created wallet.
## createWalletConnectSession

 Initiates a new WalletConnect session for interacting with another application.

### Example

`import {

 createWalletConnectClient,

 createWalletConnectSession,

} from "thirdweb/wallets";

const client = await createWalletConnectClient({

 wallet: wallet,

 client: client,

});

const session = createWalletConnectSession({

 walletConnectClient: client,

 uri: "wc:...",

});

`

##### Signature

`function createWalletConnectSession(

options: CreateWalletConnectSessionOptions,

): void;

`

### Parameters

##### options

 The options to use to create the WalletConnect session.

#### Type

`let options: CreateWalletConnectSessionOptions;

`

### Returns

##### Return Type

`let returnType: void;

`
## darkTheme

 Create a custom dark theme object by using the default dark theme as a base and applying overrides.

### Example

####  Get the default dark theme

`const defaultDarkTheme = darkTheme();

`

####  Create a custom dark theme

`const customTheme = darkTheme({

 colors: {

 modalBg: "red",

 },

});

`

##### Signature

`function darkTheme(overrides?: [ThemeOverrides](https://portal.thirdweb.com/references/typescript/v5/ThemeOverrides)): [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme);

`

### Parameters

##### overrides

optional

 The overrides to apply to the default dark theme.

#### Type

`let overrides: {

 [key in Exclude<keyof [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme), "type">]: Partial<[Theme](https://portal.thirdweb.com/references/typescript/v5/Theme)[key]>;

};

`

### Returns

##### Return Type

`let returnType: {

colors: {

accentButtonBg: string;

accentButtonText: string;

accentText: string;

borderColor: string;

connectedButtonBg: string;

connectedButtonBgHover: string;

danger: string;

inputAutofillBg: string;

modalBg: string;

modalOverlayBg: string;

primaryButtonBg: string;

primaryButtonText: string;

primaryText: string;

scrollbarBg: string;

secondaryButtonBg: string;

secondaryButtonHoverBg: string;

secondaryButtonText: string;

secondaryIconColor: string;

secondaryIconHoverBg: string;

secondaryIconHoverColor: string;

secondaryText: string;

selectedTextBg: string;

selectedTextColor: string;

separatorLine: string;

skeletonBg: string;

success: string;

tertiaryBg: string;

tooltipBg: string;

tooltipText: string;

 };

fontFamily: string;

type: "light" | "dark";

};

`

 Theme object
## decodeError

 Decodes an error.

### Example

`import { decodeError } from "thirdweb/utils";

const data = "0x...";

const error = await decodeError({ contract, data });

`

##### Signature

`` function decodeError(options: {

contract: Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<abi, `0x${string}`>>;

data: `0x${string}`;

}): Promise<unknown>;

 ``

### Parameters

##### options

 The options object.

#### Type

`` let options: {

contract: Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<abi, `0x${string}`>>;

data: `0x${string}`;

};

 ``

### Returns

##### Return Type

`let returnType: Promise<unknown>;

`

 The decoded error.
## decodeAbiParameters

##### Signature

`` function decodeAbiParameters(params: params, data: (`0x${string}`) | (ByteArray)) : {[key in string | number | symbol] : {[key in string | number | symbol] : AbiParameterToPrimitiveType<params extends readonly Array<AbiParameter> ? params<params> : Array<AbiParameter>[key<key>], AbiParameterKind>}[key]}

 ``

### Parameters

##### params

#### Type

`let params: params;

`

##### data

#### Type

`` let data: `0x${string}` | ByteArray;

 ``

### Returns

##### Return Type

`let returnType: {[key in string | number | symbol] : {[key in string | number | symbol] : AbiParameterToPrimitiveType<params extends readonly Array<AbiParameter> ? params<params> : Array<AbiParameter>[key<key>], AbiParameterKind>}[key]}

`
## decodeFunctionResult

 Decodes the result of a function call.

### Example

`import { decodeFunctionResult } from "thirdweb/utils";

const data = "0x...";

const result = await decodeFunctionResult({ contract, data });

`

##### Signature

`` function decodeFunctionResult(options: {

contract: Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<abi, `0x${string}`>>;

data: `0x${string}`;

}): Promise<

ReturnType<

ReturnType<abi, Name<abi>, undefined, AbiFunction>,

"Array"

 >

>;

 ``

### Parameters

##### options

 The options object.

#### Type

`` let options: {

contract: Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<abi, `0x${string}`>>;

data: `0x${string}`;

};

 ``

### Returns

##### Return Type

`let returnType: Promise<

ReturnType<

ReturnType<abi, Name<abi>, undefined, AbiFunction>,

"Array"

 >

>;

`

 The decoded result.
## decodeFunctionData

 Decodes the data of a function call.

### Example

`import { decodeFunctionData } from "thirdweb/utils";

const data = "0x...";

const decodedData = await decodeFunctionData({ contract, data });

`

##### Signature

`` function decodeFunctionData(options: {

contract: Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<abi, `0x${string}`>>;

data: `0x${string}`;

}): Promise<

ReturnType<ReturnType<abi, Name<abi>, undefined, AbiFunction>>

>;

 ``

### Parameters

##### options

 The options object.

#### Type

`` let options: {

contract: Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<abi, `0x${string}`>>;

data: `0x${string}`;

};

 ``

### Returns

##### Return Type

`let returnType: Promise<

ReturnType<ReturnType<abi, Name<abi>, undefined, AbiFunction>>

>;

`

 The decoded data.
## decodeJWT

 Decodes a JSON Web Token (JWT) and returns the decoded payload and signature.

### Example

`import { decodeJWT } from "thirdweb/utils";

const { payload, signature } = decodeJWT(jwt);

`

##### Signature

`` function decodeJWT(jwt: string): {

payload: [JWTPayload](https://portal.thirdweb.com/references/typescript/v5/JWTPayload);

signature: `0x${string}`;

};

 ``

### Parameters

##### jwt

 The JWT string to decode.

#### Type

`let jwt: string;

`

### Returns

##### Return Type

`` let returnType: { payload: [JWTPayload](https://portal.thirdweb.com/references/typescript/v5/JWTPayload); signature: `0x${string}` };

 ``

 An object containing the decoded payload and signature.
## defineChain

 Defines a chain with the given options.

### Example

 Just pass the chain ID to connect to:

`const chain = defineChain(1);

`

 Or pass your own RPC or custom values:

`const chain = defineChain({

 id: 1,

 rpc: "https://my-rpc.com",

 nativeCurrency: {

 name: "Ether",

 symbol: "ETH",

 decimals: 18,

 },

});

`

##### Signature

`function defineChain(

options: number | Chain | [ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) | LegacyChain,

): Readonly;

`

### Parameters

##### options

 The options for the chain.

#### Type

`let options: number | Chain | [ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) | LegacyChain;

`

### Returns

##### Return Type

`let returnType: Readonly;

`

 The defined chain.
## computePublishedContractAddress

 Predicts the implementation address of any published contract

### Example

`import { computePublishedContractAddress } from "thirdweb/deploys";

const address = await computePublishedContractAddress({

 client,

 chain,

 contractId: "AccountFactory",

 constructorParams,

});

`

##### Signature

`function computePublishedContractAddress(args: {

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

constructorParams?: Record<string, unknown>;

contractId: string;

publisher?: string;

salt?: string;

version?: string;

}): Promise<string>;

`

### Parameters

##### args

 The arguments for predicting the address of a published contract.

#### Type

`let args: {

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

constructorParams?: Record<string, unknown>;

contractId: string;

publisher?: string;

salt?: string;

version?: string;

};

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 A promise that resolves to the predicted address of the contract.
## deployContract

 Deploy a contract on a given chain

### Example

###  Deploying a regular contract from ABI and bytecode

`import { deployContract } from "thirdweb/deploys";

const address = await deployContract({

 client,

 chain,

 bytecode: "0x...",

 abi: contractAbi,

 constructorParams: {

 param1: "value1",

 param2: 123,

 },

 salt, // optional: salt enables deterministic deploys

});

`

###  Deploying a contract deterministically

`import { deployContract } from "thirdweb/deploys";

const address = await deployContract({

 client,

 chain,

 bytecode: "0x...",

 abi: contractAbi,

 constructorParams: {

 param1: "value1",

 param2: 123,

 },

 salt, // passing a salt will enable deterministic deploys

});

`

##### Signature

`` function deployContract(

options: {

abi: Abi;

bytecode: `0x${string}`;

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

constructorParams?: Record<string, unknown>;

 } & { account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account); salt?: string },

): Promise<string>;

 ``

### Parameters

##### options

 the deploy options

#### Type

`` let options: {

abi: Abi;

bytecode: `0x${string}`;

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

constructorParams?: Record<string, unknown>;

} & { account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account); salt?: string };

 ``

### Returns

##### Return Type

`let returnType: Promise<string>;

`

* a promise that resolves to the deployed contract address
## deployERC1155Contract

 Deploys an thirdweb ERC1155 contract of the given type. On chains where the thirdweb infrastructure contracts are not deployed, this function will deploy them as well.

### Example

`import { deployERC1155Contract } from "thirdweb/deploys";

const contractAddress = await deployERC1155Contract({

 chain,

 client,

 account,

 type: "DropERC1155",

 params: {

 name: "MyEdition",

 description: "My edition contract",

 symbol: "ME",

});

`

##### Signature

`function deployERC1155Contract(options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

params: [ERC1155ContractParams](https://portal.thirdweb.com/references/typescript/v5/ERC1155ContractParams);

type: [ERC1155ContractType](https://portal.thirdweb.com/references/typescript/v5/ERC1155ContractType);

}): Promise<string>;

`

### Parameters

##### options

 The deployment options.

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

params: [ERC1155ContractParams](https://portal.thirdweb.com/references/typescript/v5/ERC1155ContractParams);

type: [ERC1155ContractType](https://portal.thirdweb.com/references/typescript/v5/ERC1155ContractType);

};

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The deployed contract address.
## deployERC20Contract

 Deploys an thirdweb ERC20 contract of the given type. On chains where the thirdweb infrastructure contracts are not deployed, this function will deploy them as well.

### Example

`import { deployERC20Contract } from "thirdweb/deploys";

const contractAddress = await deployERC20Contract({

 chain,

 client,

 account,

 type: "TokenERC20",

 params: {

 name: "MyToken",

 description: "My Token contract",

 symbol: "MT",

});

`

##### Signature

`function deployERC20Contract(options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

params: [ERC20ContractParams](https://portal.thirdweb.com/references/typescript/v5/ERC20ContractParams);

publisher?: string;

type: [ERC20ContractType](https://portal.thirdweb.com/references/typescript/v5/ERC20ContractType);

}): Promise<string>;

`

### Parameters

##### options

 The deployment options.

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

params: [ERC20ContractParams](https://portal.thirdweb.com/references/typescript/v5/ERC20ContractParams);

publisher?: string;

type: [ERC20ContractType](https://portal.thirdweb.com/references/typescript/v5/ERC20ContractType);

};

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The deployed contract address.
## deployPackContract

 Deploy a thirdweb Pack contract

### Example

`import { deployPackContract } from "thirdweb/extensions/deploy";

const packAddress = await deployPackContract({

 account,

 client,

 chain,

 params: {

 name: "Pack contract name",

 symbol: "PACK1155",

 },

});

`

##### Signature

`function deployPackContract(options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

params: [PackContractParams](https://portal.thirdweb.com/references/typescript/v5/PackContractParams);

}): Promise<string>;

`

### Parameters

##### options

 params for deploying [Pack contract](https://thirdweb.com/thirdweb.eth/Pack)

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

params: [PackContractParams](https://portal.thirdweb.com/references/typescript/v5/PackContractParams);

};

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`
## deployERC721Contract

 Deploys an thirdweb ERC721 contract of the given type. On chains where the thirdweb infrastructure contracts are not deployed, this function will deploy them as well.

### Example

`import { deployERC721Contract } from "thirdweb/deploys";

const contractAddress = await deployERC721Contract({

 chain,

 client,

 account,

 type: "DropERC721",

 params: {

 name: "MyNFT",

 description: "My NFT contract",

 symbol: "NFT",

});

`

##### Signature

`function deployERC721Contract(options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

params: [ERC721ContractParams](https://portal.thirdweb.com/references/typescript/v5/ERC721ContractParams);

type: [ERC721ContractType](https://portal.thirdweb.com/references/typescript/v5/ERC721ContractType);

}): Promise<string>;

`

### Parameters

##### options

 The deployment options.

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

params: [ERC721ContractParams](https://portal.thirdweb.com/references/typescript/v5/ERC721ContractParams);

type: [ERC721ContractType](https://portal.thirdweb.com/references/typescript/v5/ERC721ContractType);

};

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The deployed contract address.
## deployPublishedContract

 Deploy an instance of a published contract on a given chain

### Example

###  Deploying a published contract

`import { deployPublishedContract } from "thirdweb/deploys";

const address = await deployPublishedContract({

 client,

 chain,

 account,

 contractId: "MyPublishedContract",

 contractParams: {

 param1: "value1",

 param2: 123,

 },

 publisher: "0x...", // optional, defaults to the thirdweb deployer

});

`

###  Deploying a published contract deterministically

`import { deployPublishedContract } from "thirdweb/deploys";

const address = await deployPublishedContract({

 client,

 chain,

 account,

 contractId: "MyPublishedContract",

 contractParams: {

 param1: "value1",

 param2: 123,

 },

 publisher: "0x...",

 salt: "your-salt", // this will deterministically deploy the contract at the same address on all chains

});

`

##### Signature

`function deployPublishedContract(

options: [DeployPublishedContractOptions](https://portal.thirdweb.com/references/typescript/v5/DeployPublishedContractOptions),

): Promise<string>;

`

### Parameters

##### options

 the deploy options

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

contractId: string;

contractParams?: Record<string, unknown>;

implementationConstructorParams?: Record<string, unknown>;

publisher?: string;

salt?: string;

version?: string;

};

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 a promise that resolves to the deployed contract address
## prepareDirectDeployTransaction

 Prepares a direct deploy transaction with ABI.

### Example

`import { prepareDirectDeployTransaction } from "thirdweb/deploys";

import { ethereum } from "thirdweb/chains";

const tx = prepareDirectDeployTransaction({

 client,

 chain: ethereum,

 bytecode: "0x...",

 constructorAbi: {

 inputs: [{ type: "uint256", name: "value" }],

 type: "constructor",

 },

 constructorParams: [123],

});

`

##### Signature

`` function prepareDirectDeployTransaction(options: {

abi: Abi;

bytecode: `0x${string}`;

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

constructorParams?: Record<string, unknown>;

}): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<[], AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

 ``

### Parameters

##### options

 The options for preparing the transaction.

#### Type

`` let options: {

abi: Abi;

bytecode: `0x${string}`;

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

constructorParams?: Record<string, unknown>;

};

 ``

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

 [],

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

* The prepared transaction.
## deploySplitContract

 Deploys a thirdweb [Split contract](https://thirdweb.com/thirdweb.eth/Split)On chains where the thirdweb infrastructure contracts are not deployed, this function will deploy them as well.

### Example

`` import { deploySplitContract } from "thirdweb/deploys";

const contractAddress = await deploySplitContract({

 chain,

 client,

 account,

 params: {

 name: "Split contract",

 payees: ["0x...123", "0x...456"],

 shares: [5100, 4900], // See type `SplitContractParams` for more context

 },

});

 ``

##### Signature

`function deploySplitContract(options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

params: [SplitContractParams](https://portal.thirdweb.com/references/typescript/v5/SplitContractParams);

}): Promise<string>;

`

### Parameters

##### options

 The deployment options.

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

params: [SplitContractParams](https://portal.thirdweb.com/references/typescript/v5/SplitContractParams);

};

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The deployed contract address.
## prepareDeterministicDeployTransaction

 Deploy a contract deterministically - will maintain the same address across chains. This is meant to be used with published contracts configured with the 'direct deploy' method. Under the hood, this uses a keyless transaction with a common create2 factory.

### Example

`import { prepareDeterministicDeployTransaction } from "thirdweb/deploys";

import { sepolia } from "thirdweb/chains";

const tx = prepareDeterministicDeployTransaction({

 client,

 chain: sepolia,

 contractId: "AccountFactory",

 constructorParams: [123],

});

`

##### Signature

`function prepareDeterministicDeployTransaction(options: {

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

constructorParams?: Record<string, unknown>;

contractId: string;

publisher?: string;

salt?: string;

version?: string;

}): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<[], AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 the options to deploy the contract

#### Type

`let options: {

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

constructorParams?: Record<string, unknown>;

contractId: string;

publisher?: string;

salt?: string;

version?: string;

};

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

 [],

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

* the transaction to deploy the contract
## disconnectWalletConnectSession

 Disconnects a WalletConnect session.

### Example

`import { disconnectWalletConnectSession } from "thirdweb/wallets";

await disconnectWalletConnectSession({

 session: mySession,

 walletConnectClient: wcClient,

});

`

##### Signature

`function disconnectWalletConnectSession(options: {

session: [WalletConnectSession](https://portal.thirdweb.com/references/typescript/v5/WalletConnectSession);

walletConnectClient: SignClient;

}): Promise<void>;

`

### Parameters

##### options

 The options to use to disconnect the WalletConnect session.

#### Type

`let options: {

session: [WalletConnectSession](https://portal.thirdweb.com/references/typescript/v5/WalletConnectSession);

walletConnectClient: SignClient;

};

`

### Returns

##### Return Type

`let returnType: Promise<void>;

`
## deploySmartAccount

 Deployes a smart account via a dummy transaction. If the account is already deployed, this will do nothing.

### Example

`import { deploySmartAccount } from "thirdweb";

const account = await deploySmartAccount({

 smartAccount,

 chain,

 client,

 accountContract,

});

`

##### Signature

`` function deploySmartAccount(args: {

accountContract: Readonly;

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

smartAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

}): Promise<

| undefined

| {

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

maxBlocksWaitTime?: number;

readonly transactionHash: `0x${string}`;

 }

>;

 ``

### Parameters

##### args

 Arguments for the deployment.

#### Type

`let args: {

accountContract: Readonly;

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

smartAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

};

`

### Returns

##### Return Type

`` let returnType: Promise<

| undefined

| {

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

maxBlocksWaitTime?: number;

readonly transactionHash: `0x${string}`;

 }

>;

 ``
## download

### Example

 Download a file from IPFS:

`import { download } from "thirdweb/storage";

import { createThirdwebClient } from "thirdweb";

const client = createThirdwebClient({ clientId: "YOUR_CLIENT_ID" });

const file = await download({

 client,

 uri: "ipfs://Qm...",

});

`

 Download a file from Arweave:

`import { download } from "thirdweb/storage";

import { createThirdwebClient } from "thirdweb";

const client = createThirdwebClient({ clientId: "YOUR_CLIENT_ID" });

const file = await download({

 client,

 uri: "ar://{arweave-transaction-id}",

});

`

 Download a file from HTTP:

`import { download } from "thirdweb/storage";

import { createThirdwebClient } from "thirdweb";

const client = createThirdwebClient({ clientId: "YOUR_CLIENT_ID" });

const file = await download({

 client,

 uri: "https://example.com/file.txt",

});

`

##### Signature

`function download(options: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

requestTimeoutMs?: number;

uri: string;

}): Promise<Response>;

`

### Parameters

##### options

 The download options.

#### Type

`let options: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

requestTimeoutMs?: number;

uri: string;

};

`

### Returns

##### Return Type

`let returnType: Promise<Response>;

`

 Asynchronously returns the network response from fetching the file.
## detectMethod

 Detects if the specified method is present in the contract bytecode.

### Example

`import { detectMethod } from "thirdweb/utils/extensions/detect.js";

const hasDecimals = await detectMethod({

 method: "function decimals() view returns (uint8)",

 availableSelectors: ["0x313ce567"],

});

`

##### Signature

`function detectMethod(options: DetectExtensionOptions): boolean;

`

### Parameters

##### options

 The options for detecting the extension.

#### Type

`let options: DetectExtensionOptions;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A promise that resolves to a boolean indicating if the extension is detected.
## sendCalls

 Send [ EIP-5792](https://eips.ethereum.org/EIPS/eip-5792) calls to a wallet. This function works with all Thirdweb wallets (in-app and smart) and certain injected wallets that already support EIP-5792\. Transactions will be bundled and sponsored when those capabilities are supported, otherwise they will be sent as individual transactions.

 This function is dependent on the wallet's support for EIP-5792 and could fail.

* getCallsStatus for how to retrieve the status of the bundle.
* getCapabilities for how to retrieve the capabilities of the wallet.

### Example

`import { createThirdwebClient } from "thirdweb";

import { sendCalls } from "thirdweb/wallets/eip5792";

const client = createThirdwebClient({ clientId: ... });

const wallet = createWallet("com.coinbase.wallet");

const sendTx1 = approve({

 contract: USDT_CONTRACT,

 amount: 100,

 spender: "0x33d9B8BEfE81027E2C859EDc84F5636cbb202Ed6",

 });

const sendTx2 = approve({

 contract: USDT_CONTRACT,

 amount: 100,

 spender: "0x2a4f24F935Eb178e3e7BA9B53A5Ee6d8407C0709",

 });

const bundleId = await sendCalls({

 wallet,

 client,

 calls: [sendTx1, sendTx2],

});

`

 Sponsor transactions with a paymaster:

`` const bundleId = await sendCalls({

 wallet,

 client,

 calls: [send1, send2],

 capabilities: {

 paymasterService: {

 url: `https://${CHAIN.id}.bundler.thirdweb.com/${client.clientId}`

 }

 }

});

 We recommend proxying any paymaster calls via an API route you setup and control.

 ``

##### Signature

`function sendCalls(options: [SendCallsOptions](https://portal.thirdweb.com/references/typescript/v5/SendCallsOptions)<ID>): Promise<string>;

`

### Parameters

##### options

#### Type

`let options: [SendCallsOptions](https://portal.thirdweb.com/references/typescript/v5/SendCallsOptions)<ID>;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The ID of the bundle of the calls.
## ecosystemWallet

 Creates an [ Ecosystem Wallet](https://portal.thirdweb.com/connect/wallet/overview) based on various authentication methods. Full list of available authentication methods [ here](https://portal.thirdweb.com/connect/wallet/sign-in-methods/configure) .

 Can also be configured to use Account Abstraction to directly connect to a ERC4337 smart account based on those authentication methods.

 Refer to [ inAppWallet](https://portal.thirdweb.com/typescript/v5/inAppWallet) for detailed usage examples.

### Example

####  Logging into an ecosystem wallet

 Below is the general code snippet needed to connect via a given auth strategy to an ecosystem wallet. For more variants on the various auth strategies, refer to [ inAppWallet](https://portal.thirdweb.com/typescript/v5/inAppWallet) .

`import { ecosystemWallet } from "thirdweb/wallets";

const wallet = ecosystemWallet("ecosystem.hooli");

const account = await wallet.connect({

 client,

 chain,

 strategy: "google",

});

`

[ View all connection options](https://portal.thirdweb.com/references/typescript/v5/EcosystemWalletConnectionOptions) .

####  Connect to a restricted ecosystem wallet with your designated partner ID

 The partner ID will be provided to you by the ecosystem with which you're integrating.

`import { ecosystemWallet } from "thirdweb/wallets";

const wallet = ecosystemWallet("ecosystem.hooli", {

 partnerId: "...",

});

`

##### Signature

`` function ecosystemWallet(

id: `ecosystem.${string}`,

options: [EcosystemWalletCreationOptions](https://portal.thirdweb.com/references/typescript/v5/EcosystemWalletCreationOptions),

): [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)<`ecosystem.${string}`>;

 ``

### Parameters

##### id

#### Type

`` let id: `ecosystem.${string}`;

 ``

##### options

#### Type

`let options: {

auth?: {

defaultSmsCountryCode?: SupportedSmsCountry;

mode?: "popup" | "redirect" | "window";

redirectUrl?: string;

 };

partnerId?: string;

storage?: [AsyncStorage](https://portal.thirdweb.com/references/typescript/v5/AsyncStorage);

};

`

### Returns

##### Return Type

`` let returnType: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)<`ecosystem.${string}`>;

 ``

 The created ecosystem wallet.
## toProvider

 Converts a Thirdweb wallet into an EIP-1193 compatible provider.

 This adapter allows you to use a Thirdweb wallet with any library or dApp that expects an EIP-1193 provider. The provider implements the standard EIP-1193 interface including request handling and event subscription.

### Example

`import { EIP1193 } from "thirdweb/wallets";

// Create an EIP-1193 provider from a Thirdweb wallet

const provider = EIP1193.toProvider({

 wallet,

 chain: ethereum,

 client: createThirdwebClient({ clientId: "..." }),

});

// Use with any EIP-1193 compatible library

const accounts = await provider.request({

 method: "eth_requestAccounts",

});

// Listen for events

provider.on("accountsChanged", (accounts) => {

 console.log("Active accounts:", accounts);

});

`

##### Signature

`function toProvider(

options: [ToEip1193ProviderOptions](https://portal.thirdweb.com/references/typescript/v5/ToEip1193ProviderOptions),

): [EIP1193Provider](https://portal.thirdweb.com/references/typescript/v5/EIP1193Provider);

`

### Parameters

##### options

 Configuration options for creating the provider

#### Type

`let options: {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

connectOverride?: (wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)) => Promise<Account>;

wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

};

`

### Returns

##### Return Type

`let returnType: {

request: (params: any) => Promise<any>;

on: (event: any, listener: (params: any) => any) => void;

removeListener: (

event: any,

listener: (params: any) => any,

 ) => void;

};

`

 An EIP-1193 compatible provider that wraps the Thirdweb wallet
## fromProvider

 Creates a Thirdweb wallet from an EIP-1193 compatible provider.

 This adapter allows you to use any EIP-1193 provider (like MetaMask, WalletConnect, etc.) as a Thirdweb wallet. It handles all the necessary conversions between the EIP-1193 interface and Thirdweb's wallet interface.

### Example

`import { EIP1193 } from "thirdweb/wallets";

// Create a Thirdweb wallet from MetaMask's provider

const wallet = EIP1193.fromProvider({

 provider: window.ethereum,

 walletId: "io.metamask",

});

// Use like any other Thirdweb wallet

const account = await wallet.connect({

 client: createThirdwebClient({ clientId: "..." }),

});

// Sign messages

await account.signMessage({ message: "Hello World" });

// Send transactions

await account.sendTransaction({

 to: "0x...",

 value: 1000000000000000000n,

});

`

##### Signature

`function fromProvider(options: [FromEip1193AdapterOptions](https://portal.thirdweb.com/references/typescript/v5/FromEip1193AdapterOptions)): [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

`

### Parameters

##### options

 Configuration options for creating the wallet adapter

#### Type

`let options: {

provider: [EIP1193Provider](https://portal.thirdweb.com/references/typescript/v5/EIP1193Provider) | (() => Promise<[EIP1193Provider](https://portal.thirdweb.com/references/typescript/v5/EIP1193Provider)>);

walletId?: [WalletId](https://portal.thirdweb.com/references/typescript/v5/WalletId);

};

`

### Returns

##### Return Type

`let returnType: {

getAdminAccount?: () => [Account](https://portal.thirdweb.com/references/typescript/v5/Account) | undefined;

getConfig: () => [CreateWalletArgs](https://portal.thirdweb.com/references/typescript/v5/CreateWalletArgs)<TWalletId>[1];

id: TWalletId;

onConnectRequested?: () => Promise<void>;

subscribe: [WalletEmitter](https://portal.thirdweb.com/references/typescript/v5/WalletEmitter)<TWalletId>["subscribe"];

autoConnect: (

options: [WalletAutoConnectionOption](https://portal.thirdweb.com/references/typescript/v5/WalletAutoConnectionOption)<TWalletId>,

 ) => Promise<[Account](https://portal.thirdweb.com/references/typescript/v5/Account)>;

connect: (

options: [WalletConnectionOption](https://portal.thirdweb.com/references/typescript/v5/WalletConnectionOption)<TWalletId>,

 ) => Promise<[Account](https://portal.thirdweb.com/references/typescript/v5/Account)>;

disconnect: () => Promise<void>;

getAccount: () => undefined | [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

getChain: () =>

| undefined

| Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

switchChain: (chain: Readonly) => Promise<void>;

};

`

 A Thirdweb wallet instance that wraps the EIP-1193 provider
## useSendCalls

 A hook to send [ EIP-5792](https://eips.ethereum.org/EIPS/eip-5792) calls to a wallet. This hook works with all Thirdweb wallets (in-app and smart) and certain injected wallets that already support EIP-5792\. Transactions will be bundled and sponsored when those capabilities are supported, otherwise they will be sent as individual transactions.

 When calls are sent, all contracts that are interacted with will have their corresponding reads revalidated via React Query.

 This hook is dependent on the wallet's support for EIP-5792 and could fail. The mutatuon function will use your currently connected wallet by default, but you can pass it a specific wallet to use if you'd like.

### Example

`import { useSendCalls } from "thirdweb/react";

const sendTx1 = approve({

 contract: USDT_CONTRACT,

 amount: 100,

 spender: "0x33d9B8BEfE81027E2C859EDc84F5636cbb202Ed6",

});

const sendTx2 = approve({

 contract: USDT_CONTRACT,

 amount: 100,

 spender: "0x2a4f24F935Eb178e3e7BA9B53A5Ee6d8407C0709",

});

const { mutate: sendCalls, data: bundleId } = useSendCalls({

 client,

});

await sendCalls({

 wallet,

 client,

 calls: [sendTx1, sendTx2],

});

`

 Await the bundle's full confirmation:

`const { mutate: sendCalls, data: bundleId } = useSendCalls({

 client,

 waitForResult: true,

});

await sendCalls({

 wallet,

 client,

 calls: [sendTx1, sendTx2],

});

`

 Sponsor transactions with a paymaster:

`` const { mutate: sendCalls, data: bundleId } = useSendCalls();

await sendCalls({

 client,

 calls: [sendTx1, sendTx2],

 capabilities: {

 paymasterService: {

 url: `https://${CHAIN.id}.bundler.thirdweb.com/${client.clientId}`,

 },

 },

});

 ``

 We recommend proxying any paymaster calls via an API route you setup and control.

##### Signature

`function useSendCalls(__namedParameters: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

waitForResult?: boolean;

}): UseMutationResult<

string | [GetCallsStatusResponse](https://portal.thirdweb.com/references/typescript/v5/GetCallsStatusResponse),

Error,

Omit<[SendCallsOptions](https://portal.thirdweb.com/references/typescript/v5/SendCallsOptions), "chain" | "wallet"> & { wallet?: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet) }

>;

`

### Parameters

##### \_\_namedParameters

#### Type

`let __namedParameters: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

waitForResult?: boolean;

};

`

### Returns

##### Return Type

`let returnType: UseMutationResult<

string | [GetCallsStatusResponse](https://portal.thirdweb.com/references/typescript/v5/GetCallsStatusResponse),

Error,

Omit<[SendCallsOptions](https://portal.thirdweb.com/references/typescript/v5/SendCallsOptions), "chain" | "wallet"> & { wallet?: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet) }

>;

`

 A React Query mutatuon object to interact with sendCalls
## useCallsStatus

 A hook to get a call bundle's current status according to [ EIP-5792](https://eips.ethereum.org/EIPS/eip-5792) .

 This function is dependent on the wallet's support for EIP-5792 and could throw an error if it's not supported.

### Example

`import { useCallsStatus } from "thirdweb/react";

const { data: status, isLoading } = useCallsStatus({

 bundleId,

 client,

});

`

##### Signature

`function useCallsStatus(options: {

bundleId: string;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

queryOptions?: { enabled?: boolean; retry?: number };

}): UseQueryResult<[GetCallsStatusResponse](https://portal.thirdweb.com/references/typescript/v5/GetCallsStatusResponse)>;

`

### Parameters

##### options

#### Type

`let options: {

bundleId: string;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

queryOptions?: { enabled?: boolean; retry?: number };

};

`

### Returns

##### Return Type

`let returnType: UseQueryResult<[GetCallsStatusResponse](https://portal.thirdweb.com/references/typescript/v5/GetCallsStatusResponse)>;

`

 a React Query object.
## getCallsStatus

 Get the status of an [ EIP-5792](https://eips.ethereum.org/EIPS/eip-5792) bundle.

 This function is dependent on the wallet's support for EIP-5792 and could fail.

### Example

`import { createThirdwebClient } from "thirdweb";

import { sendCalls, getCallsStatus } from "thirdweb/wallets/eip5792";

const client = createThirdwebClient({ clientId: ... });

const bundleId = await sendCalls({ wallet, client, calls });

let result;

while (result.status !== "CONFIRMED") {

 result = await getCallsStatus({ wallet, client, bundleId });

 }

`

##### Signature

`function getCallsStatus(

options: [GetCallsStatusOptions](https://portal.thirdweb.com/references/typescript/v5/GetCallsStatusOptions),

): Promise<[GetCallsStatusResponse](https://portal.thirdweb.com/references/typescript/v5/GetCallsStatusResponse)>;

`

### Parameters

##### options

#### Type

`let options: {

bundleId: [WalletSendCallsId](https://portal.thirdweb.com/references/typescript/v5/WalletSendCallsId);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

};

`

### Returns

##### Return Type

`let returnType: {

receipts: Array<[WalletCallReceipt](https://portal.thirdweb.com/references/typescript/v5/WalletCallReceipt)<bigint, "success" | "reverted">>;

status: "PENDING" | "CONFIRMED";

};

`

* A promise that resolves to the bundle's status and receipts (if available). GetCallsStatusResponse
## getCapabilities

 Get the capabilities of a wallet based on the [ EIP-5792](https://eips.ethereum.org/EIPS/eip-5792) specification.

 This function is dependent on the wallet's support for EIP-5792, but will not throw. _The returned object contains a `message` field detailing any issues with the wallet's support for EIP-5792._

### Example

`import { getCapabilities } from "thirdweb/wallets/eip5792";

const wallet = createWallet("com.coinbase.wallet");

const capabilities = await getCapabilities({ wallet });

`

##### Signature

`function getCapabilities(

options: [GetCapabilitiesOptions](https://portal.thirdweb.com/references/typescript/v5/GetCapabilitiesOptions)<ID>,

): Promise<{ message?: string }>;

`

### Parameters

##### options

#### Type

`let options: [GetCapabilitiesOptions](https://portal.thirdweb.com/references/typescript/v5/GetCapabilitiesOptions)<ID>;

`

### Returns

##### Return Type

`let returnType: Promise<{ message?: string }>;

`

* A promise that resolves to the capabilities of the wallet based on the [ EIP-5792](https://eips.ethereum.org/EIPS/eip-5792) spec.
## encode

 Encodes a transaction object into a hexadecimal string representation of the encoded data.

### Example

`import { encode } from "thirdweb";

const encodedData = await encode(transaction);

`

##### Signature

`` function encode(

transaction: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<abi, abiFn>,

): Promise<`0x${string}`>;

 ``

### Parameters

##### transaction

 The transaction object to encode.

#### Type

`let transaction: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<abi, abiFn>;

`

### Returns

##### Return Type

`` let returnType: Promise<`0x${string}`>;

 ``

 A promise that resolves to the encoded data as a hexadecimal string.
## waitForBundle

 Waits for the [ EIP-5792](https://eips.ethereum.org/EIPS/eip-5792) bundle to be confirmed.

 This function is dependent on the wallet's support for EIP-5792 and could fail.

### Example

`import { waitForBundle } from "thirdweb/wallets/eip5792";

const result = await waitForBundle({

 client,

 chain,

 wallet,

 bundleId: "0x123...",

});

`

##### Signature

`function waitForBundle(options: {

bundleId: string;

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

maxBlocksWaitTime?: number;

wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

}): Promise<[GetCallsStatusResponse](https://portal.thirdweb.com/references/typescript/v5/GetCallsStatusResponse)>;

`

### Parameters

##### options

 The options for waiting for the bundle. By default, the max wait time is 100 blocks.

#### Type

`let options: {

bundleId: string;

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

maxBlocksWaitTime?: number;

wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

};

`

### Returns

##### Return Type

`let returnType: {

receipts: Array<[WalletCallReceipt](https://portal.thirdweb.com/references/typescript/v5/WalletCallReceipt)<bigint, "success" | "reverted">>;

status: "PENDING" | "CONFIRMED";

};

`

 A promise that resolves with the final getCallsStatus result.
## encodeAbiParameters

 Encodes the given ABI parameters and values into a hexadecimal string.

### Example

`import { encodeAbiParameters } from "viem";

const params = [

 { name: "param1", type: "uint256" },

 { name: "param2", type: "string" },

];

const values = [123, "hello"];

const data = encodeAbiParameters(params, values);

console.log(data);

`

##### Signature

`` function encodeAbiParameters(params: TParams, values: TParams extends readonly Array<AbiParameter> ? {[key in string | number | symbol] : {[key in string | number | symbol] : AbiParameterToPrimitiveType<TParams<TParams>[key<key>], AbiParameterKind>}[key]} : never) : `0x${string}`

 ``

### Parameters

##### params

 The ABI parameters.

#### Type

`let params: TParams;

`

##### values

 The corresponding values for the ABI parameters.

#### Type

`let values: TParams extends readonly Array<AbiParameter> ? {[key in string | number | symbol] : {[key in string | number | symbol] : AbiParameterToPrimitiveType<TParams<TParams>[key<key>], AbiParameterKind>}[key]} : never

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

* The encoded ABI parameters as a hexadecimal string.
## encodeJWT

 Builds a JSON Web Token (JWT) using the provided options.

### Example

`import { encodeJWT } from "thirdweb/utils";

const jwt = await encodeJWT({

 payload: {

 iss: "0x1234567890123456789012345678901234567890",

 sub: "0x1234567890123456789012345678901234567890",

 aud: "0x1234567890123456789012345678901234567890",

 exp: new Date(Date.now() + 1000 * 60 * 60),

 nbf: new Date(),

 iat: new Date(),

 jti: "1234567890",

 ctx: {

 example: "example",

 },

 },

 wallet,

});

`

##### Signature

`function encodeJWT(options: EncodeJWTParams): Promise<string>;

`

### Parameters

##### options

 The options for building the JWT.

#### Type

`let options: EncodeJWTParams;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The generated JWT.
## encodePacked

##### Signature

`` function encodePacked(

types: packedAbiTypes,

values: EncodePackedValues<packedAbiTypes>,

): `0x${string}`;

 ``

### Parameters

##### types

#### Type

`let types: packedAbiTypes;

`

##### values

#### Type

`let values: EncodePackedValues<packedAbiTypes>;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``
## parseNftUri

 Parses an NFT URI.

### Example

`import { parseNftUri } from "thirdweb/utils/ens";

const nftUri = await parseNftUri({

 client,

 uri: "eip155:1/erc1155:0xb32979486938aa9694bfc898f35dbed459f44424/10063",

});

console.log(nftUri); // ipfs://bafybeiemxf5abjwjbikoz4mc3a3dla6ual3jsgpdr4cjr3oz3evfyavhwq/

`

##### Signature

`function parseNftUri(options: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

uri: string;

}): Promise<null | string>;

`

### Parameters

##### options

 The options for parsing an NFT URI.

#### Type

`let options: { client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient); uri: string };

`

### Returns

##### Return Type

`let returnType: Promise<null | string>;

`

 A promise that resolves to the NFT URI, or null if the URI could not be parsed.
## engineAccount

 Creates an account that uses your engine backend wallet for sending transactions and signing messages.

### Example

`import { engineAccount } from "thirdweb/wallets/engine";

const engineAcc = engineAccount({

 engineUrl: "https://engine.thirdweb.com",

 authToken: "your-auth-token",

 walletAddress: "0x...",

});

// then use the account as you would any other account

const transaction = claimTo({

 contract,

 to: "0x...",

 quantity: 1n,

});

const result = await sendTransaction({

 transaction,

 account: engineAcc,

});

console.log("Transaction sent:", result.transactionHash);

`

##### Signature

`function engineAccount(options: [EngineAccountOptions](https://portal.thirdweb.com/references/typescript/v5/EngineAccountOptions)): [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

### Parameters

##### options

 The options for the engine account.

#### Type

`let options: {

authToken: string;

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

engineUrl: string;

walletAddress: string;

};

`

### Returns

##### Return Type

`let returnType: {

address: Address;

estimateGas?: (tx: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)) => Promise<bigint>;

onTransactionRequested?: (

transaction: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any>,

 ) => Promise<void>;

sendBatchTransaction?: (

txs: Array<SendTransactionOption>,

 ) => Promise<SendTransactionResult>;

sendRawTransaction?: (

tx: SendRawTransactionOptions,

 ) => Promise<SendTransactionResult>;

sendTransaction: (

tx: SendTransactionOption,

 ) => Promise<SendTransactionResult>;

signAuthorization?: (

authorization: [AuthorizationRequest](https://portal.thirdweb.com/references/typescript/v5/AuthorizationRequest),

 ) => Promise<[SignedAuthorization](https://portal.thirdweb.com/references/typescript/v5/SignedAuthorization)>;

signMessage: ({

message,

originalMessage,

chainId,

 }: {

chainId?: number;

message: SignableMessage;

originalMessage?: string;

 }) => Promise<Hex>;

signTransaction?: (tx: SerializableTransaction) => Promise<Hex>;

signTypedData: (

_typedData: ox__TypedData.Definition<typedData, primaryType>,

 ) => Promise<Hex>;

watchAsset?: (asset: WatchAssetParams) => Promise<boolean>;

};

`

 An account that uses your engine backend wallet.
## parseAvatarRecord

 Parses an ENS or similar avatar record. Supports NFT URIs, IPFS scheme, and HTTPS URIs.

### Example

`import { parseAvatarRecord } from "thirdweb/utils/ens";

const avatarUrl = await parseAvatarRecord({

 client,

 uri: "ipfs://bafybeiemxf5abjwjbikoz4mc3a3dla6ual3jsgpdr4cjr3oz3evfyavhwq/",

});

console.log(avatarUrl); // "https://ipfs.io/ipfs/bafybeiemxf5abjwjbikoz4mc3a3dla6ual3jsgpdr4cjr3oz3evfyavhwq/"

const avatarUrl2 = await parseAvatarRecord({

 client,

 uri: "eip155:1/erc1155:0xb32979486938aa9694bfc898f35dbed459f44424/10063",

});

console.log(avatarUrl2); // "https://opensea.io/assets/0xb32979486938aa9694bfc898f35dbed459f44424/10063"

`

##### Signature

`function parseAvatarRecord(

options: [ParseAvatarOptions](https://portal.thirdweb.com/references/typescript/v5/ParseAvatarOptions),

): Promise<null | string>;

`

### Parameters

##### options

 The options for parsing an ENS avatar record.

#### Type

`let options: { client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient); uri: string };

`

### Returns

##### Return Type

`let returnType: Promise<null | string>;

`

 A promise that resolves to the avatar URL, or null if the URI could not be parsed.
## resolveAddress

 Resolves an ENS name to an Ethereum address.

### Example

`import { resolveAddress } from "thirdweb/extensions/ens";

const address = await resolveAddress({

 client,

 name: "vitalik.eth",

});

`

 Resolve an address to a Basename.

`import {

 resolveAddress,

 BASENAME_RESOLVER_ADDRESS,

} from "thirdweb/extensions/ens";

import { base } from "thirdweb/chains";

const address = await resolveAddress({

 client,

 name: "myk.base.eth",

 resolverAddress: BASENAME_RESOLVER_ADDRESS,

 resolverChain: base,

});

`

##### Signature

`` function resolveAddress(

options: [ResolveAddressOptions](https://portal.thirdweb.com/references/typescript/v5/ResolveAddressOptions),

): Promise<`0x${string}`>;

 ``

### Parameters

##### options

 The options for resolving an ENS address.

#### Type

`let options: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

name: string;

resolverAddress?: string;

resolverChain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

};

`

### Returns

##### Return Type

`` let returnType: Promise<`0x${string}`>;

 ``

 A promise that resolves to the Ethereum address.
## resolveAvatar

 Resolves an ENS name to the avatar URL.

### Example

`import { resolveAvatar } from "thirdweb/extensions/ens";

const address = await resolveAvatar({

 client,

 name: "vitalik.eth",

});

`

##### Signature

`function resolveAvatar(

options: [ResolveAvatarOptions](https://portal.thirdweb.com/references/typescript/v5/ResolveAvatarOptions),

): Promise<null | string>;

`

### Parameters

##### options

 The options for resolving an ENS address.

#### Type

`let options: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

name: string;

resolverAddress?: string;

resolverChain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

};

`

### Returns

##### Return Type

`let returnType: Promise<null | string>;

`

 A promise that resolves to the avatar url, or null if not set.
## resolveL2Name

 Resolves the L2 name for a specified address.

### Example

`import { resolveL2Name } from "thirdweb/extensions/ens";

const name = await resolveL2Name({

 client,

 address: "0x1234...",

 resolverAddress: "0x...",

 resolverChain: base,

});

`

 Resolve a Basename.

`import {

 resolveL2Name,

 BASENAME_RESOLVER_ADDRESS,

} from "thirdweb/extensions/ens";

import { base } from "thirdweb/chains";

const name = await resolveL2Name({

 client,

 address: "0x1234...",

 resolverAddress: BASENAME_RESOLVER_ADDRESS,

 resolverChain: base,

});

`

##### Signature

`function resolveL2Name(

options: [ResolveL2NameOptions](https://portal.thirdweb.com/references/typescript/v5/ResolveL2NameOptions),

): Promise<null | string>;

`

### Parameters

##### options

 The options for resolving an L2 ENS address.

#### Type

`let options: {

address: Address;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

resolverAddress: string;

resolverChain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

};

`

### Returns

##### Return Type

`let returnType: Promise<null | string>;

`

 A promise that resolves to the Ethereum address.
## resolveName

 Resolves the primary name for a specified address.

### Example

`import { resolveName } from "thirdweb/extensions/ens";

const name = await resolveName({

 client,

 address: "0x1234...",

});

`

##### Signature

`function resolveName(

options: [ResolveNameOptions](https://portal.thirdweb.com/references/typescript/v5/ResolveNameOptions),

): Promise<null | string>;

`

### Parameters

##### options

 The options for resolving an ENS address.

#### Type

`let options: {

address: Address;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

resolverAddress?: string;

resolverChain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

};

`

### Returns

##### Return Type

`let returnType: Promise<null | string>;

`

 A promise that resolves to the Ethereum address.
## resolveText

 Resolves an ENS name and key to the specified record.

### Example

`import { resolveText } from "thirdweb/extensions/ens";

const twitterUsername = await resolveText({

 client,

 name: "vitalik.eth",

 key: "com.twitter",

});

`

##### Signature

`function resolveText(

options: [ResolveTextOptions](https://portal.thirdweb.com/references/typescript/v5/ResolveTextOptions),

): Promise<null | string>;

`

### Parameters

##### options

 The options for resolving an ENS address.

#### Type

`let options: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

key: string;

name: string;

resolverAddress?: string;

resolverChain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

};

`

### Returns

##### Return Type

`let returnType: Promise<null | string>;

`

 A promise that resolves to the text record.
## useEnsAvatar

 Get the ENS avatar for an ENS name

### Example

`import { useEnsAvatar } from "thirdweb/react";

const { data: ensAvatar } = useEnsAvatar({

 client,

 ensName: "my-ens-name.eth",

});

`

##### Signature

`function useEnsAvatar(options: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

ensName: undefined | null | string;

}): UseQueryResult<null | string, Error>;

`

### Parameters

##### options

 the client and ENS name to get the avatar for

#### Type

`let options: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

ensName: undefined | null | string;

};

`

### Returns

##### Return Type

`let returnType: UseQueryResult<null | string, Error>;

`

* a query object that resolves to the avatar
## ensureBytecodePrefix

 Ensures that the given bytecode has the correct prefix. If the bytecode already starts with "0x", it is returned as is. Otherwise, the prefix "0x" is added to the bytecode.

### Example

`import { ensureBytecodePrefix } from "thirdweb/utils/bytecode/prefix";

const bytecode =

"363d3d373d3d3d363d30545af43d82803e903d91601857fd5bf3";

const prefixedBytecode = ensureBytecodePrefix(bytecode);

console.log(prefixedBytecode);

`

##### Signature

`` function ensureBytecodePrefix(bytecode: string): `0x${string}`;

 ``

### Parameters

##### bytecode

 The bytecode to ensure the prefix for.

#### Type

`let bytecode: string;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

 The bytecode with the correct prefix.
## useEnsName

 Get the ENS name and avatar for an address

### Example

`import { useEnsName } from "thirdweb/react";

const { data: ensName } = useEnsName({

 client,

 address: "0x1234...",

});

`

##### Signature

`function useEnsName(options: {

address: undefined | string;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}): UseQueryResult<null | string, Error>;

`

### Parameters

##### options

 the client and address to get the ENS name and avatar for

#### Type

`let options: { address: undefined | string; client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient) };

`

### Returns

##### Return Type

`let returnType: UseQueryResult<null | string, Error>;

`

* a query object that resolves to the ENS name
## approvalForAllEvent

 Creates an event object for the ApprovalForAll event.

### Example

`import { getContractEvents } from "thirdweb";

import { approvalForAllEvent } from "thirdweb/extensions/erc1155";

const events = await getContractEvents({

contract,

events: [

approvalForAllEvent({

 _owner: ...,

 _operator: ...,

})

],

});

`

##### Signature

`function approvalForAllEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "_owner";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "_operator";

readonly type: "address";

 },

 { readonly name: "_approved"; readonly type: "bool" },

 ];

readonly name: "ApprovalForAll";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "_owner";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "_operator";

readonly type: "address";

 },

 { readonly name: "_approved"; readonly type: "bool" },

 ];

readonly name: "ApprovalForAll";

readonly type: "event";

}>;

`

 The prepared event object.
## balanceOf

 Calls the "balanceOf" function on the contract.

### Example

`import { balanceOf } from "thirdweb/extensions/erc1155";

const result = await balanceOf({

 contract,

 owner: ...,

 tokenId: ...,

});

`

##### Signature

`function balanceOf(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[BalanceOfParams](https://portal.thirdweb.com/references/typescript/v5/BalanceOfParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the balanceOf function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[BalanceOfParams](https://portal.thirdweb.com/references/typescript/v5/BalanceOfParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## batchMetadataUpdateEvent

 Creates an event object for the BatchMetadataUpdate event.

### Example

`import { getContractEvents } from "thirdweb";

import { batchMetadataUpdateEvent } from "thirdweb/extensions/erc1155";

const events = await getContractEvents({

 contract,

 events: [batchMetadataUpdateEvent()],

});

`

##### Signature

`function batchMetadataUpdateEvent(): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "_fromTokenId"; readonly type: "uint256" },

 { readonly name: "_toTokenId"; readonly type: "uint256" },

 ];

readonly name: "BatchMetadataUpdate";

readonly type: "event";

}>;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "_fromTokenId"; readonly type: "uint256" },

 { readonly name: "_toTokenId"; readonly type: "uint256" },

 ];

readonly name: "BatchMetadataUpdate";

readonly type: "event";

}>;

`

 The prepared event object.
## balanceOfBatch

 Calls the "balanceOfBatch" function on the contract.

### Example

`import { balanceOfBatch } from "thirdweb/extensions/erc1155";

const result = await balanceOfBatch({

 contract,

 owners: ...,

 tokenIds: ...,

});

`

##### Signature

`function balanceOfBatch(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[BalanceOfBatchParams](https://portal.thirdweb.com/references/typescript/v5/BalanceOfBatchParams)>) : Promise<readonly Array<bigint>>

`

### Parameters

##### options

 The options for the balanceOfBatch function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[BalanceOfBatchParams](https://portal.thirdweb.com/references/typescript/v5/BalanceOfBatchParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<readonly Array<bigint>>

`

 The parsed result of the function call.
## burn

 Prepares a transaction to call the "burn" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { burn } from "thirdweb/extensions/erc1155";

const transaction = burn({

 contract,

 account: ...,

 id: ...,

 value: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function burn(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[BurnParams](https://portal.thirdweb.com/references/typescript/v5/BurnParams) | { asyncParams: () => Promise<[BurnParams](https://portal.thirdweb.com/references/typescript/v5/BurnParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "burn" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[BurnParams](https://portal.thirdweb.com/references/typescript/v5/BurnParams) | { asyncParams: () => Promise<[BurnParams](https://portal.thirdweb.com/references/typescript/v5/BurnParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## burnBatch

 Prepares a transaction to call the "burnBatch" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { burnBatch } from "thirdweb/extensions/erc1155";

const transaction = burnBatch({

 contract,

 account: ...,

 ids: ...,

 values: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function burnBatch(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[BurnBatchParams](https://portal.thirdweb.com/references/typescript/v5/BurnBatchParams) | { asyncParams: () => Promise<[BurnBatchParams](https://portal.thirdweb.com/references/typescript/v5/BurnBatchParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "burnBatch" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[BurnBatchParams](https://portal.thirdweb.com/references/typescript/v5/BurnBatchParams) | { asyncParams: () => Promise<[BurnBatchParams](https://portal.thirdweb.com/references/typescript/v5/BurnBatchParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## canClaim

 Check if a user can claim a drop.

### Example

`const claimResult = await canClaim({

 contract: contract,

 claimer: "0x1234567890123456789012345678901234567890",

 quantity: "1",

 tokenId: 0n,

});

`

##### Signature

`function canClaim(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[CanClaimParams](https://portal.thirdweb.com/references/typescript/v5/CanClaimParams)>,

): Promise<[CanClaimResult](https://portal.thirdweb.com/references/typescript/v5/CanClaimResult)>;

`

### Parameters

##### options

 The options for the transaction.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[CanClaimParams](https://portal.thirdweb.com/references/typescript/v5/CanClaimParams)>;

`

### Returns

##### Return Type

`let returnType: { reason?: string; result: boolean };

`

 Whether the user can claim the drop.
## createPack

 Prepares a transaction to call the "createPack" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { createPack } from "thirdweb/extensions/erc1155";

const transaction = createPack({

 contract,

 contents: ...,

 numOfRewardUnits: ...,

 packUri: ...,

 openStartTimestamp: ...,

 amountDistributedPerOpen: ...,

 recipient: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function createPack(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [CreatePackParams](https://portal.thirdweb.com/references/typescript/v5/CreatePackParams)

| { asyncParams: () => Promise<[CreatePackParams](https://portal.thirdweb.com/references/typescript/v5/CreatePackParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "createPack" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[CreatePackParams](https://portal.thirdweb.com/references/typescript/v5/CreatePackParams) | { asyncParams: () => Promise<[CreatePackParams](https://portal.thirdweb.com/references/typescript/v5/CreatePackParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## claimTo

 Claim ERC1155 NFTs to a specified address

### Example

####  Basic usage

`import { claimTo } from "thirdweb/extensions/erc1155";

import { sendTransaction } from "thirdweb";

const transaction = claimTo({

 contract,

 to: "0x...",

 tokenId: 0n,

 quantity: 1n,

});

await sendTransaction({ transaction, account });

`

####  For Drops with allowlists

 You need to specify the claimer address as the `from` param to avoid any issue with the allowlist

`const transaction = claimTo({

 contract,

 to: "0x...",

 tokenId: 0n,

 quantity: 1n,

 from: "0x...", // address of the one claiming

});

`

##### Signature

`function claimTo(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ClaimToParams](https://portal.thirdweb.com/references/typescript/v5/ClaimToParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the transaction

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ClaimToParams](https://portal.thirdweb.com/references/typescript/v5/ClaimToParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 The prepared transaction
## encodeSafeTransferFrom

 Encodes the "safeTransferFrom" function into a Hex string with its parameters.

### Example

`import { encodeSafeTransferFrom } from "thirdweb/extensions/erc1155";

const result = encodeSafeTransferFrom({

 from: ...,

 to: ...,

 tokenId: ...,

 value: ...,

 data: ...,

});

`

##### Signature

`` function encodeSafeTransferFrom(

options: [SafeTransferFromParams](https://portal.thirdweb.com/references/typescript/v5/SafeTransferFromParams),

): `0xf242432a${string}`;

 ``

### Parameters

##### options

 The options for the safeTransferFrom function.

#### Type

`let options: WithOverrides<{

data: AbiParameterToPrimitiveType<{ name: "_data"; type: "bytes" }>;

from: AbiParameterToPrimitiveType<{

name: "_from";

type: "address";

 }>;

to: AbiParameterToPrimitiveType<{ name: "_to"; type: "address" }>;

tokenId: AbiParameterToPrimitiveType<{

name: "tokenId";

type: "uint256";

 }>;

value: AbiParameterToPrimitiveType<{

name: "_value";

type: "uint256";

 }>;

}>;

`

### Returns

##### Return Type

`` let returnType: `0xf242432a${string}`;

 ``

 The encoded hexadecimal string.
## freezeMetadata

 Prepares a transaction to call the "freezeMetadata" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { freezeMetadata } from "thirdweb/extensions/erc1155";

const transaction = freezeMetadata();

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function freezeMetadata(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "freezeMetadata" function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## generateMintSignature

 Generates the payload and signature for minting an ERC1155 token.

### Example

`import {

 mintWithSignature,

 generateMintSignature,

} from "thirdweb/extensions/erc1155";

const { payload, signature } = await generateMintSignature({

 account,

 contract,

 mintRequest: {

 to: "0x...",

 quantity: 10n,

 metadata: {

 name: "My NFT",

 description: "This is my NFT",

 image: "https://example.com/image.png",

 },

 },

});

const transaction = mintWithSignature({

 contract,

 payload,

 signature,

});

await sendTransaction({ transaction, account });

`

##### Signature

`` function generateMintSignature(

options: [GenerateMintSignatureOptions](https://portal.thirdweb.com/references/typescript/v5/GenerateMintSignatureOptions),

): Promise<{

payload: {

currency: string;

pricePerToken: bigint;

primarySaleRecipient: string;

quantity: bigint;

royaltyBps: bigint;

royaltyRecipient: string;

to: string;

tokenId: bigint;

uid: `0x${string}`;

uri: string;

validityEndTimestamp: bigint;

validityStartTimestamp: bigint;

 };

signature: `0x${string}`;

}>;

 ``

### Parameters

##### options

 The options for the minting process.

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

contractType?: "TokenERC1155" | "SignatureMintERC1155";

mintRequest: GeneratePayloadInput;

};

`

### Returns

##### Return Type

`` let returnType: Promise<{

payload: {

currency: string;

pricePerToken: bigint;

primarySaleRecipient: string;

quantity: bigint;

royaltyBps: bigint;

royaltyRecipient: string;

to: string;

tokenId: bigint;

uid: `0x${string}`;

uri: string;

validityEndTimestamp: bigint;

validityStartTimestamp: bigint;

 };

signature: `0x${string}`;

}>;

 ``

 A promise that resolves to the payload and signature.
## getActiveClaimCondition

 Retrieves the active claim condition.

### Example

`import { getActiveClaimCondition } from "thirdweb/extensions/erc1155";

const activeClaimCondition = await getActiveClaimCondition({

 contract,

 tokenId,

});

`

##### Signature

`function getActiveClaimCondition(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<GetActiveClaimConditionIdParams>,

): Promise<ClaimCondition>;

`

### Parameters

##### options

 The transaction options.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<GetActiveClaimConditionIdParams>;

`

### Returns

##### Return Type

`let returnType: Promise<ClaimCondition>;

`

 A promise that resolves to the active claim condition.
## getClaimConditionById

 Calls the "getClaimConditionById" function on the contract.

### Example

`import { getClaimConditionById } from "thirdweb/extensions/erc1155";

const result = await getClaimConditionById({

 contract,

 tokenId: ...,

 conditionId: ...,

});

`

##### Signature

`` function getClaimConditionById(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetClaimConditionByIdParams](https://portal.thirdweb.com/references/typescript/v5/GetClaimConditionByIdParams)>,

): Promise<{

currency: string;

maxClaimableSupply: bigint;

merkleRoot: `0x${string}`;

metadata: string;

pricePerToken: bigint;

quantityLimitPerWallet: bigint;

startTimestamp: bigint;

supplyClaimed: bigint;

}>;

 ``

### Parameters

##### options

 The options for the getClaimConditionById function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetClaimConditionByIdParams](https://portal.thirdweb.com/references/typescript/v5/GetClaimConditionByIdParams)>;

`

### Returns

##### Return Type

`` let returnType: Promise<{

currency: string;

maxClaimableSupply: bigint;

merkleRoot: `0x${string}`;

metadata: string;

pricePerToken: bigint;

quantityLimitPerWallet: bigint;

startTimestamp: bigint;

supplyClaimed: bigint;

}>;

 ``

 The parsed result of the function call.
## getClaimConditions

 Retrieves all claim conditions.

### Example

`import { getClaimConditions } from "thirdweb/extensions/erc1155";

const conditions = await getClaimConditions({

 contract,

 tokenId: 1n,

});

`

##### Signature

`function getClaimConditions(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetClaimConditionsParams](https://portal.thirdweb.com/references/typescript/v5/GetClaimConditionsParams)>,

): Promise<Array<ClaimCondition>>;

`

### Parameters

##### options

 The transaction options.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetClaimConditionsParams](https://portal.thirdweb.com/references/typescript/v5/GetClaimConditionsParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<Array<ClaimCondition>>;

`

 A promise that resolves to all claim conditions.
## getNFT

 Retrieves information about a specific ERC1155 non-fungible token (NFT).

### Example

`import { getNFT } from "thirdweb/extensions/erc1155";

const nft = await getNFT({

 contract,

 tokenId: 1n,

});

`

##### Signature

`function getNFT(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetNFTParams](https://portal.thirdweb.com/references/typescript/v5/GetNFTParams)>,

): Promise<[NFT](https://portal.thirdweb.com/references/typescript/v5/NFT)>;

`

### Parameters

##### options

 The options for retrieving the NFT.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetNFTParams](https://portal.thirdweb.com/references/typescript/v5/GetNFTParams)>;

`

### Returns

##### Return Type

`let returnType:

| {

id: bigint;

metadata: [NFTMetadata](https://portal.thirdweb.com/references/typescript/v5/NFTMetadata);

owner: string | null;

tokenURI: string;

type: "ERC721";

 }

| {

id: bigint;

metadata: [NFTMetadata](https://portal.thirdweb.com/references/typescript/v5/NFTMetadata);

owner: string | null;

supply: bigint;

tokenURI: string;

type: "ERC1155";

 };

`

 A promise that resolves to the NFT object.
## getNFTs

 Retrieves an array of NFTs ("ERC1155") based on the provided options.

### Example

`import { getNFTs } from "thirdweb/extensions/erc1155";

const nfts = await getNFTs({

 contract,

 start: 0,

 count: 10,

});

`

##### Signature

`function getNFTs(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetNFTsParams](https://portal.thirdweb.com/references/typescript/v5/GetNFTsParams)>,

): Promise<Array<[NFT](https://portal.thirdweb.com/references/typescript/v5/NFT)>>;

`

### Parameters

##### options

 The options for retrieving the NFTs.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetNFTsParams](https://portal.thirdweb.com/references/typescript/v5/GetNFTsParams)>;

`

### Returns

##### Return Type

`let returnType:

| {

id: bigint;

metadata: [NFTMetadata](https://portal.thirdweb.com/references/typescript/v5/NFTMetadata);

owner: string | null;

tokenURI: string;

type: "ERC721";

 }

| {

id: bigint;

metadata: [NFTMetadata](https://portal.thirdweb.com/references/typescript/v5/NFTMetadata);

owner: string | null;

supply: bigint;

tokenURI: string;

type: "ERC1155";

 };

`

 A promise that resolves to an array of NFTs.
## getOwnedNFTs

 Retrieves the owned ERC1155 NFTs for a given wallet address.

### Example

`import { getOwnedNFTs } from "thirdweb/extensions/erc1155";

const nfts = await getOwnedNFTs({

 contract,

 start: 0,

 count: 10,

 address: "0x123...",

});

`

##### Signature

`function getOwnedNFTs(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetOwnedTokenIdsParams](https://portal.thirdweb.com/references/typescript/v5/GetOwnedTokenIdsParams)>,

): Promise<Array<[NFT](https://portal.thirdweb.com/references/typescript/v5/NFT) & { quantityOwned: bigint }>>;

`

### Parameters

##### options

 The transaction options and parameters.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetOwnedTokenIdsParams](https://portal.thirdweb.com/references/typescript/v5/GetOwnedTokenIdsParams)>;

`

### Returns

##### Return Type

`let returnType:

| {

id: bigint;

metadata: [NFTMetadata](https://portal.thirdweb.com/references/typescript/v5/NFTMetadata);

owner: string | null;

tokenURI: string;

type: "ERC721";

 }

| {

id: bigint;

metadata: [NFTMetadata](https://portal.thirdweb.com/references/typescript/v5/NFTMetadata);

owner: string | null;

supply: bigint;

tokenURI: string;

type: "ERC1155";

 };

`

 A promise that resolves to an array of ERC1155 NFTs owned by the wallet address, along with the quantity owned.
## isBurnSupported

 Checks if the `burn` method is supported by the given contract.

### Example

`import { isBurnSupported } from "thirdweb/extensions/erc1155";

const supported = isBurnSupported(["0x..."]);

`

##### Signature

`function isBurnSupported(availableSelectors: Array<string>): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `burn` method is supported.
## getOwnedTokenIds

 Retrieves the owned ERC1155 tokenIds & the owned balance of each tokenId for a given wallet address.

### Example

`import { getOwnedNFTs } from "thirdweb/extensions/erc1155";

const ownedTokenIds = await getOwnedTokenIds({

 contract,

 start: 0,

 count: 10,

 address: "0x123...",

});

`

##### Signature

`function getOwnedTokenIds(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetOwnedTokenIdsParams](https://portal.thirdweb.com/references/typescript/v5/GetOwnedTokenIdsParams)>,

): Promise<Array<{ balance: bigint; tokenId: bigint }>>;

`

### Parameters

##### options

 The transaction options and parameters.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetOwnedTokenIdsParams](https://portal.thirdweb.com/references/typescript/v5/GetOwnedTokenIdsParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<Array<{ balance: bigint; tokenId: bigint }>>;

`

 A promise that resolves to an array of ERC1155 NFTs owned by the wallet address, along with the quantity owned.
## isApprovedForAll

 Calls the "isApprovedForAll" function on the contract.

### Example

`import { isApprovedForAll } from "thirdweb/extensions/erc1155";

const result = await isApprovedForAll({

 contract,

 owner: ...,

 operator: ...,

});

`

##### Signature

`function isApprovedForAll(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsApprovedForAllParams](https://portal.thirdweb.com/references/typescript/v5/IsApprovedForAllParams)>,

): Promise<boolean>;

`

### Parameters

##### options

 The options for the isApprovedForAll function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsApprovedForAllParams](https://portal.thirdweb.com/references/typescript/v5/IsApprovedForAllParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 The parsed result of the function call.
## isClaimToSupported

 Checks if the `claimTo` method is supported by the given contract.

### Example

`import { isClaimToSupported } from "thirdweb/extensions/erc1155";

const supported = isClaimToSupported(["0x..."]);

`

##### Signature

`function isClaimToSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `claimTo` method is supported.
## isERC1155

 Check if a contract supports the ERC1155 interface.

### Example

`import { isERC1155 } from "thirdweb/extensions/erc1155";

const result = await isERC1155({ contract });

`

##### Signature

`function isERC1155(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)): Promise<boolean>;

`

### Parameters

##### options

 The transaction options.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 A boolean indicating whether the contract supports the ERC1155 interface.
## isGetActiveClaimConditionSupported

 Checks if the `getActiveClaimCondition` method is supported by the given contract.

### Example

`import { isGetActiveClaimConditionSupported } from "thirdweb/extensions/erc1155";

const supported = isGetActiveClaimConditionSupported(["0x..."]);

`

##### Signature

`function isGetActiveClaimConditionSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getActiveClaimCondition` method is supported.
## isGetClaimConditionByIdSupported

 Checks if the `getClaimConditionById` method is supported by the given contract.

### Example

`import { isGetClaimConditionByIdSupported } from "thirdweb/extensions/erc1155";

const supported = isGetClaimConditionByIdSupported(["0x..."]);

`

##### Signature

`function isGetClaimConditionByIdSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getClaimConditionById` method is supported.
## isGetClaimConditionsSupported

 Checks if the `getClaimConditions` method is supported by the given contract.

### Example

`import { isGetClaimConditionsSupported } from "thirdweb/extensions/erc1155";

const supported = isGetClaimConditionsSupported(["0x..."]);

`

##### Signature

`function isGetClaimConditionsSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getClaimConditions` method is supported.
## useCapabilities

 A hook to get the current wallet's capabilities according to [ EIP-5792](https://eips.ethereum.org/EIPS/eip-5792) .

 This function is dependent on the wallet's support for EIP-5792, but will not throw. _The returned object contains a `message` field detailing any issues with the wallet's support for EIP-5792._

### Example

`import { useCapabilities } from "thirdweb/react";

const { data: capabilities, isLoading } = useCapabilities();

`

##### Signature

`function useCapabilities(options?: {

queryOptions?: { enabled?: boolean; retry?: number };

}): UseQueryResult<{ message?: string }>;

`

### Parameters

##### options

optional

#### Type

`let options: { queryOptions?: { enabled?: boolean; retry?: number } };

`

### Returns

##### Return Type

`let returnType: UseQueryResult<{ message?: string }>;

`

 a React Query object.
## isGetNFTsSupported

 Checks if the `getNFTs` method is supported by the given contract.

### Example

`import { isGetNFTsSupported } from "thirdweb/extensions/erc721";

const supported = isGetNFTsSupported(["0x..."]);

`

##### Signature

`function isGetNFTsSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getNFTs` method is supported.
## isLazyMintSupported

 Checks if the `lazyMint` method is supported by the given contract.

### Example

`import { isLazyMintSupported } from "thirdweb/extensions/erc1155";

const supported = isLazyMintSupported(["0x..."]);

`

##### Signature

`function isLazyMintSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `lazyMint` method is supported.
## isGetNFTSupported

 Checks if the `uri` method is supported by the given contract.

### Example

`import { isUriSupported } from "thirdweb/extensions/erc1155";

const supported = isUriSupported(["0x..."]);

`

##### Signature

`function isGetNFTSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `uri` method is supported.
## isResetClaimEligibilitySupported

 Checks if the `resetClaimEligibility` method is supported by the given contract.

### Example

`import { isResetClaimEligibilitySupported } from "thirdweb/extensions/erc1155";

const supported = isResetClaimEligibilitySupported(["0x..."]);

`

##### Signature

`function isResetClaimEligibilitySupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `resetClaimEligibility` method is supported.
## isMintToSupported

 Checks if the `mintTo` method is supported by the given contract.

### Example

`import { isMintToSupported } from "thirdweb/extensions/erc1155";

const supported = isMintToSupported(["0x..."]);

`

##### Signature

`function isMintToSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `mintTo` method is supported.
## isMintAdditionalSupplyToSupported

 Checks if the `mintAdditionalSupplyTo` method is supported by the given contract.

### Example

`import { isMintAdditionalSupplyToSupported } from "thirdweb/extensions/erc1155";

const supported = isMintAdditionalSupplyToSupported(["0x..."]);

`

##### Signature

`function isMintAdditionalSupplyToSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `mintAdditionalSupplyTo` method is supported.
## isNextTokenIdToMintSupported

 Checks if the `nextTokenIdToMint` method is supported by the given contract.

### Example

`import { isNextTokenIdToMintSupported } from "thirdweb/extensions/erc1155";

const supported = isNextTokenIdToMintSupported(["0x..."]);

`

##### Signature

`function isNextTokenIdToMintSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `nextTokenIdToMint` method is supported.
## isSetClaimConditionsSupported

 Checks if the `setClaimConditions` method is supported by the given contract.

### Example

`import { isSetClaimConditionsSupported } from "thirdweb/extensions/erc1155";

const supported = isSetClaimConditionsSupported(["0x..."]);

`

##### Signature

`function isSetClaimConditionsSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `setClaimConditions` method is supported.
## isUpdateTokenURISupported

 Checks if the `setTokenURI` method is supported by the given contract.

### Example

`import { isSetTokenURISupported } from "thirdweb/extensions/erc1155";

const supported = isSetTokenURISupported(["0x..."]);

`

##### Signature

`function isUpdateTokenURISupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `setTokenURI` method is supported.
## isTotalSupplySupported

 Checks if the `totalSupply` method is supported by the given contract.

### Example

`import { isTotalSupplySupported } from "thirdweb/extensions/erc1155";

const supported = isTotalSupplySupported(["0x..."]);

`

##### Signature

`function isTotalSupplySupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `totalSupply` method is supported.
## lazyMint

 Lazily mints ERC1155 tokens.

### Example

`import { lazyMint } from "thirdweb/extensions/erc1155";

import { sendTransaction } from "thirdweb";

const transaction = lazyMint({

 contract,

 nfts: [

 {

 name: "My NFT",

 description: "This is my NFT",

 image: "https://example.com/image.png",

 },

 ],

});

await sendTransaction({ transaction, account });

`

##### Signature

`function lazyMint(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[LazyMintParams](https://portal.thirdweb.com/references/typescript/v5/LazyMintParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the lazy minting process.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[LazyMintParams](https://portal.thirdweb.com/references/typescript/v5/LazyMintParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A promise that resolves to the prepared contract call.
## metadataUpdateEvent

 Creates an event object for the MetadataUpdate event.

### Example

`import { getContractEvents } from "thirdweb";

import { metadataUpdateEvent } from "thirdweb/extensions/erc1155";

const events = await getContractEvents({

 contract,

 events: [metadataUpdateEvent()],

});

`

##### Signature

`function metadataUpdateEvent(): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "_tokenId"; readonly type: "uint256" },

 ];

readonly name: "MetadataUpdate";

readonly type: "event";

}>;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "_tokenId"; readonly type: "uint256" },

 ];

readonly name: "MetadataUpdate";

readonly type: "event";

}>;

`

 The prepared event object.
## metadataFrozenEvent

 Creates an event object for the MetadataFrozen event.

### Example

`import { getContractEvents } from "thirdweb";

import { metadataFrozenEvent } from "thirdweb/extensions/erc1155";

const events = await getContractEvents({

 contract,

 events: [metadataFrozenEvent()],

});

`

##### Signature

`function metadataFrozenEvent(): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [];

readonly name: "MetadataFrozen";

readonly type: "event";

}>;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [];

readonly name: "MetadataFrozen";

readonly type: "event";

}>;

`

 The prepared event object.
## mintAdditionalSupplyTo

 Mints a "supply" number of additional ERC1155 tokens to the specified "to" address.

### Example

`import { mintAdditionalSupplyTo } from "thirdweb/extensions/erc1155";

import { sendTransaction } from "thirdweb";

const transaction = mintAdditionalSupplyTo({

 contract,

 to: "0x...",

 tokenId: 1n,

 supply: 10n,

});

await sendTransaction({ transaction, account });

`

##### Signature

`function mintAdditionalSupplyTo(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MintAdditionalSupplyToParams](https://portal.thirdweb.com/references/typescript/v5/MintAdditionalSupplyToParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The transaction options.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MintAdditionalSupplyToParams](https://portal.thirdweb.com/references/typescript/v5/MintAdditionalSupplyToParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A promise that resolves to the transaction result.
## mintTo

 Mints a "supply" number of new ERC1155 tokens to the specified "to" address. If the `nft` parameter is a string, it will be used as the token URI. If the `nft` parameter is a file, it will be uploaded to the storage server and the resulting URI will be used as the token URI.

### Example

`import { mintTo } from "thirdweb/extensions/erc1155";

import { sendTransaction } from "thirdweb";

const transaction = mintTo({

 contract,

 to: "0x...",

 supply: 10n,

 nft: {

 name: "My NFT",

 description: "This is my NFT",

 image: "https://example.com/image.png",

 },

});

await sendTransaction({ transaction, account });

`

##### Signature

`function mintTo(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MintToParams](https://portal.thirdweb.com/references/typescript/v5/MintToParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The transaction options.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MintToParams](https://portal.thirdweb.com/references/typescript/v5/MintToParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A promise that resolves to the transaction result.
## mintAdditionalSupplyToBatch

 This extension batches multiple `mintAdditionalSupplyToBatch` extensions into one single multicall. Keep in mind that there is a limit of how many NFTs you can mint per transaction. This limit varies depends on the network that you are transacting on.

 You are recommended to experiment with the number to figure out the best number for your chain of choice.

### Example

`import { mintAdditionalSupplyToBatch } from "thirdweb/extensions/erc1155";

const transaction = mintAdditionalSupplyToBatch({

 contract,

 nfts: [

 { tokenId: 0n, supply: 99n, to: account.address },

 { tokenId: 1n, supply: 98n, to: account.address },

 { tokenId: 2n, supply: 97n, to: account.address },

 ],

});

`

##### Signature

`function mintAdditionalSupplyToBatch(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MintAdditionalSupplyToBatchParams](https://portal.thirdweb.com/references/typescript/v5/MintAdditionalSupplyToBatchParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MintAdditionalSupplyToBatchParams](https://portal.thirdweb.com/references/typescript/v5/MintAdditionalSupplyToBatchParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`
## mintToBatch

 This extension batches multiple `mintTo` extensions into one single multicall. Keep in mind that there is a limit of how many NFTs you can mint per transaction. This limit varies depends on the network that you are transacting on.

 You are recommended to experiment with the number to figure out the best number for your chain of choice.

### Example

`import { mintBatchTo } from "thirdweb/extension/erc1155";

const transaction = mintToBatch({

 contract: editionContract,

 to: "0x...",

 nfts: [

 {

 metadata: {

 name: "Token #0",

 image: "...",

 attributes: [],

 },

 supply: 100n,

 },

 {

 metadata: {

 name: "Token #1",

 image: "...",

 attributes: [],

 },

 supply: 111n,

 },

 ],

});

await sendTransaction({ transaction, account });

`

##### Signature

`function mintToBatch(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MintToBatchParams](https://portal.thirdweb.com/references/typescript/v5/MintToBatchParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 the transaction options

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MintToBatchParams](https://portal.thirdweb.com/references/typescript/v5/MintToBatchParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A promise that resolves to the transaction result.
## mintWithSignature

 Mints a new ERC1155 token with the given minter signature

### Example

`import { mintWithSignature, generateMintSignature } from "thirdweb/extensions/erc1155";

import { sendTransaction } from "thirdweb";

const { payload, signature } = await generateMintSignature(...)

const transaction = mintWithSignature({

 contract,

 payload,

 signature,

});

await sendTransaction({ transaction, account });

`

##### Signature

`function mintWithSignature(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<MintWithSignatureParams>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The transaction options.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<MintWithSignatureParams>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A promise that resolves to the transaction result.
## nextTokenId

 Calls the "nextTokenId" function on the contract.

### Example

`import { nextTokenId } from "thirdweb/extensions/erc1155";

const result = await nextTokenId({

 contract,

});

`

##### Signature

`function nextTokenId(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the nextTokenId function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## nextTokenIdToMint

 Calls the "nextTokenIdToMint" function on the contract.

### Example

`import { nextTokenIdToMint } from "thirdweb/extensions/erc1155";

const result = await nextTokenIdToMint({

 contract,

});

`

##### Signature

`function nextTokenIdToMint(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the nextTokenIdToMint function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## openPack

 Prepares a transaction to call the "openPack" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { openPack } from "thirdweb/extensions/erc1155";

const transaction = openPack({

 contract,

 packId: ...,

 amountToOpen: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function openPack(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[OpenPackParams](https://portal.thirdweb.com/references/typescript/v5/OpenPackParams) | { asyncParams: () => Promise<[OpenPackParams](https://portal.thirdweb.com/references/typescript/v5/OpenPackParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "openPack" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[OpenPackParams](https://portal.thirdweb.com/references/typescript/v5/OpenPackParams) | { asyncParams: () => Promise<[OpenPackParams](https://portal.thirdweb.com/references/typescript/v5/OpenPackParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## packCreatedEvent

 Creates an event object for the PackCreated event.

### Example

`import { getContractEvents } from "thirdweb";

import { packCreatedEvent } from "thirdweb/extensions/erc1155";

const events = await getContractEvents({

contract,

events: [

packCreatedEvent({

 packId: ...,

})

],

});

`

##### Signature

`function packCreatedEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "packId";

readonly type: "uint256";

 },

 { readonly name: "recipient"; readonly type: "address" },

 { readonly name: "totalPacksCreated"; readonly type: "uint256" },

 ];

readonly name: "PackCreated";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "packId";

readonly type: "uint256";

 },

 { readonly name: "recipient"; readonly type: "address" },

 { readonly name: "totalPacksCreated"; readonly type: "uint256" },

 ];

readonly name: "PackCreated";

readonly type: "event";

}>;

`

 The prepared event object.
## packUpdatedEvent

 Creates an event object for the PackUpdated event.

### Example

`import { getContractEvents } from "thirdweb";

import { packUpdatedEvent } from "thirdweb/extensions/erc1155";

const events = await getContractEvents({

contract,

events: [

packUpdatedEvent({

 packId: ...,

})

],

});

`

##### Signature

`function packUpdatedEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "packId";

readonly type: "uint256";

 },

 { readonly name: "recipient"; readonly type: "address" },

 { readonly name: "totalPacksCreated"; readonly type: "uint256" },

 ];

readonly name: "PackUpdated";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "packId";

readonly type: "uint256";

 },

 { readonly name: "recipient"; readonly type: "address" },

 { readonly name: "totalPacksCreated"; readonly type: "uint256" },

 ];

readonly name: "PackUpdated";

readonly type: "event";

}>;

`

 The prepared event object.
## packOpenedEvent

 Creates an event object for the PackOpened event.

### Example

`import { getContractEvents } from "thirdweb";

import { packOpenedEvent } from "thirdweb/extensions/erc1155";

const events = await getContractEvents({

contract,

events: [

packOpenedEvent({

 packId: ...,

 opener: ...,

})

],

});

`

##### Signature

`function packOpenedEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "packId";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "opener";

readonly type: "address";

 },

 { readonly name: "numOfPacksOpened"; readonly type: "uint256" },

 {

readonly components: readonly [

 { readonly name: "assetContract"; readonly type: "address" },

 { readonly name: "tokenType"; readonly type: "uint8" },

 { readonly name: "tokenId"; readonly type: "uint256" },

 { readonly name: "totalAmount"; readonly type: "uint256" },

 ];

readonly name: "rewardUnitsDistributed";

readonly type: "tuple[]";

 },

 ];

readonly name: "PackOpened";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "packId";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "opener";

readonly type: "address";

 },

 { readonly name: "numOfPacksOpened"; readonly type: "uint256" },

 {

readonly components: readonly [

 { readonly name: "assetContract"; readonly type: "address" },

 { readonly name: "tokenType"; readonly type: "uint8" },

 { readonly name: "tokenId"; readonly type: "uint256" },

 { readonly name: "totalAmount"; readonly type: "uint256" },

 ];

readonly name: "rewardUnitsDistributed";

readonly type: "tuple[]";

 },

 ];

readonly name: "PackOpened";

readonly type: "event";

}>;

`

 The prepared event object.
## resetClaimEligibility

 Reset the claim eligibility for all users.

### Example

`import { resetClaimEligibility } from "thirdweb/extensions/erc1155";

import { sendTransaction } from "thirdweb";

const transaction = resetClaimEligibility({

 contract,

});

await sendTransaction({ transaction, account });

`

##### Signature

`function resetClaimEligibility(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetClaimConditionsParams](https://portal.thirdweb.com/references/typescript/v5/GetClaimConditionsParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetClaimConditionsParams](https://portal.thirdweb.com/references/typescript/v5/GetClaimConditionsParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 the prepared transaction
## safeTransferFrom

 Prepares a transaction to call the "safeTransferFrom" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { safeTransferFrom } from "thirdweb/extensions/erc1155";

const transaction = safeTransferFrom({

 contract,

 from: ...,

 to: ...,

 tokenId: ...,

 value: ...,

 data: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function safeTransferFrom(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SafeTransferFromParams](https://portal.thirdweb.com/references/typescript/v5/SafeTransferFromParams)

| { asyncParams: () => Promise<[SafeTransferFromParams](https://portal.thirdweb.com/references/typescript/v5/SafeTransferFromParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "safeTransferFrom" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SafeTransferFromParams](https://portal.thirdweb.com/references/typescript/v5/SafeTransferFromParams)

| { asyncParams: () => Promise<[SafeTransferFromParams](https://portal.thirdweb.com/references/typescript/v5/SafeTransferFromParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## safeBatchTransferFrom

 Prepares a transaction to call the "safeBatchTransferFrom" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { safeBatchTransferFrom } from "thirdweb/extensions/erc1155";

const transaction = safeBatchTransferFrom({

 contract,

 from: ...,

 to: ...,

 tokenIds: ...,

 values: ...,

 data: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function safeBatchTransferFrom(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SafeBatchTransferFromParams](https://portal.thirdweb.com/references/typescript/v5/SafeBatchTransferFromParams)

| { asyncParams: () => Promise<[SafeBatchTransferFromParams](https://portal.thirdweb.com/references/typescript/v5/SafeBatchTransferFromParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "safeBatchTransferFrom" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SafeBatchTransferFromParams](https://portal.thirdweb.com/references/typescript/v5/SafeBatchTransferFromParams)

| { asyncParams: () => Promise<[SafeBatchTransferFromParams](https://portal.thirdweb.com/references/typescript/v5/SafeBatchTransferFromParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## setClaimConditions

 Set the claim conditions for a ERC1155 drop

### Example

`import { setClaimConditions } from "thirdweb/extensions/erc1155";

import { sendTransaction } from "thirdweb";

const transaction = setClaimConditions({

 contract,

 tokenId: 0n,

 phases: [

 {

 maxClaimableSupply: 100n,

 maxClaimablePerWallet: 1n,

 currencyAddress: "0x...",

 price: 0.1,

 startTime: new Date(),

 },

 ],

});

await sendTransaction({ transaction, account });

`

##### Signature

`function setClaimConditions(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[SetClaimConditionsParams](https://portal.thirdweb.com/references/typescript/v5/SetClaimConditionsParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[SetClaimConditionsParams](https://portal.thirdweb.com/references/typescript/v5/SetClaimConditionsParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 the prepared transaction
## setTokenURI

 Prepares a transaction to call the "setTokenURI" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { setTokenURI } from "thirdweb/extensions/erc1155";

const transaction = setTokenURI({

 contract,

 tokenId: ...,

 uri: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setTokenURI(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetTokenURIParams](https://portal.thirdweb.com/references/typescript/v5/SetTokenURIParams)

| { asyncParams: () => Promise<[SetTokenURIParams](https://portal.thirdweb.com/references/typescript/v5/SetTokenURIParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setTokenURI" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetTokenURIParams](https://portal.thirdweb.com/references/typescript/v5/SetTokenURIParams)

| { asyncParams: () => Promise<[SetTokenURIParams](https://portal.thirdweb.com/references/typescript/v5/SetTokenURIParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## tokensClaimedEvent

 Creates an event object for the TokensClaimed event.

### Example

`import { getContractEvents } from "thirdweb";

import { tokensClaimedEvent } from "thirdweb/extensions/erc1155";

const events = await getContractEvents({

contract,

events: [

tokensClaimedEvent({

 claimConditionIndex: ...,

 claimer: ...,

 receiver: ...,

})

],

});

`

##### Signature

`function tokensClaimedEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "claimConditionIndex";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "claimer";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "receiver";

readonly type: "address";

 },

 { readonly name: "tokenId"; readonly type: "uint256" },

 { readonly name: "quantityClaimed"; readonly type: "uint256" },

 ];

readonly name: "TokensClaimed";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "claimConditionIndex";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "claimer";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "receiver";

readonly type: "address";

 },

 { readonly name: "tokenId"; readonly type: "uint256" },

 { readonly name: "quantityClaimed"; readonly type: "uint256" },

 ];

readonly name: "TokensClaimed";

readonly type: "event";

}>;

`

 The prepared event object.
## tokensLazyMintedEvent

 Creates an event object for the TokensLazyMinted event.

### Example

`import { getContractEvents } from "thirdweb";

import { tokensLazyMintedEvent } from "thirdweb/extensions/erc1155";

const events = await getContractEvents({

contract,

events: [

tokensLazyMintedEvent({

 startTokenId: ...,

})

],

});

`

##### Signature

`function tokensLazyMintedEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "startTokenId";

readonly type: "uint256";

 },

 { readonly name: "endTokenId"; readonly type: "uint256" },

 { readonly name: "baseURI"; readonly type: "string" },

 { readonly name: "encryptedBaseURI"; readonly type: "bytes" },

 ];

readonly name: "TokensLazyMinted";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "startTokenId";

readonly type: "uint256";

 },

 { readonly name: "endTokenId"; readonly type: "uint256" },

 { readonly name: "baseURI"; readonly type: "string" },

 { readonly name: "encryptedBaseURI"; readonly type: "bytes" },

 ];

readonly name: "TokensLazyMinted";

readonly type: "event";

}>;

`

 The prepared event object.
## setApprovalForAll

 Prepares a transaction to call the "setApprovalForAll" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { setApprovalForAll } from "thirdweb/extensions/erc1155";

const transaction = setApprovalForAll({

 contract,

 operator: ...,

 approved: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setApprovalForAll(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetApprovalForAllParams](https://portal.thirdweb.com/references/typescript/v5/SetApprovalForAllParams)

| { asyncParams: () => Promise<[SetApprovalForAllParams](https://portal.thirdweb.com/references/typescript/v5/SetApprovalForAllParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setApprovalForAll" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetApprovalForAllParams](https://portal.thirdweb.com/references/typescript/v5/SetApprovalForAllParams)

| { asyncParams: () => Promise<[SetApprovalForAllParams](https://portal.thirdweb.com/references/typescript/v5/SetApprovalForAllParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## tokensMintedWithSignatureEvent

 Creates an event object for the TokensMintedWithSignature event.

### Example

`import { getContractEvents } from "thirdweb";

import { tokensMintedWithSignatureEvent } from "thirdweb/extensions/erc1155";

const events = await getContractEvents({

contract,

events: [

tokensMintedWithSignatureEvent({

 signer: ...,

 mintedTo: ...,

 tokenIdMinted: ...,

})

],

});

`

##### Signature

`function tokensMintedWithSignatureEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "signer";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "mintedTo";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "tokenIdMinted";

readonly type: "uint256";

 },

 {

readonly components: readonly [

 { readonly name: "to"; readonly type: "address" },

 {

readonly name: "royaltyRecipient";

readonly type: "address";

 },

 { readonly name: "royaltyBps"; readonly type: "uint256" },

 {

readonly name: "primarySaleRecipient";

readonly type: "address";

 },

 { readonly name: "tokenId"; readonly type: "uint256" },

 { readonly name: "uri"; readonly type: "string" },

 { readonly name: "quantity"; readonly type: "uint256" },

 { readonly name: "pricePerToken"; readonly type: "uint256" },

 { readonly name: "currency"; readonly type: "address" },

 {

readonly name: "validityStartTimestamp";

readonly type: "uint128";

 },

 {

readonly name: "validityEndTimestamp";

readonly type: "uint128";

 },

 { readonly name: "uid"; readonly type: "bytes32" },

 ];

readonly name: "mintRequest";

readonly type: "tuple";

 },

 ];

readonly name: "TokensMintedWithSignature";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "signer";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "mintedTo";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "tokenIdMinted";

readonly type: "uint256";

 },

 {

readonly components: readonly [

 { readonly name: "to"; readonly type: "address" },

 {

readonly name: "royaltyRecipient";

readonly type: "address";

 },

 { readonly name: "royaltyBps"; readonly type: "uint256" },

 {

readonly name: "primarySaleRecipient";

readonly type: "address";

 },

 { readonly name: "tokenId"; readonly type: "uint256" },

 { readonly name: "uri"; readonly type: "string" },

 { readonly name: "quantity"; readonly type: "uint256" },

 { readonly name: "pricePerToken"; readonly type: "uint256" },

 { readonly name: "currency"; readonly type: "address" },

 {

readonly name: "validityStartTimestamp";

readonly type: "uint128";

 },

 {

readonly name: "validityEndTimestamp";

readonly type: "uint128";

 },

 { readonly name: "uid"; readonly type: "bytes32" },

 ];

readonly name: "mintRequest";

readonly type: "tuple";

 },

 ];

readonly name: "TokensMintedWithSignature";

readonly type: "event";

}>;

`

 The prepared event object.
## transferBatchEvent

 Creates an event object for the TransferBatch event.

### Example

`import { getContractEvents } from "thirdweb";

import { transferBatchEvent } from "thirdweb/extensions/erc1155";

const events = await getContractEvents({

contract,

events: [

transferBatchEvent({

 _operator: ...,

 _from: ...,

 _to: ...,

})

],

});

`

##### Signature

`function transferBatchEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "_operator";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "_from";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "_to";

readonly type: "address";

 },

 { readonly name: "tokenIds"; readonly type: "uint256[]" },

 { readonly name: "_values"; readonly type: "uint256[]" },

 ];

readonly name: "TransferBatch";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "_operator";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "_from";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "_to";

readonly type: "address";

 },

 { readonly name: "tokenIds"; readonly type: "uint256[]" },

 { readonly name: "_values"; readonly type: "uint256[]" },

 ];

readonly name: "TransferBatch";

readonly type: "event";

}>;

`

 The prepared event object.
## transferSingleEvent

 Creates an event object for the TransferSingle event.

### Example

`import { getContractEvents } from "thirdweb";

import { transferSingleEvent } from "thirdweb/extensions/erc1155";

const events = await getContractEvents({

contract,

events: [

transferSingleEvent({

 _operator: ...,

 _from: ...,

 _to: ...,

})

],

});

`

##### Signature

`function transferSingleEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "_operator";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "_from";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "_to";

readonly type: "address";

 },

 { readonly name: "tokenId"; readonly type: "uint256" },

 { readonly name: "_value"; readonly type: "uint256" },

 ];

readonly name: "TransferSingle";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "_operator";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "_from";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "_to";

readonly type: "address";

 },

 { readonly name: "tokenId"; readonly type: "uint256" },

 { readonly name: "_value"; readonly type: "uint256" },

 ];

readonly name: "TransferSingle";

readonly type: "event";

}>;

`

 The prepared event object.
## totalSupply

 Calls the "totalSupply" function on the contract.

### Example

`import { totalSupply } from "thirdweb/extensions/erc1155";

const result = await totalSupply({

 contract,

 id: ...,

});

`

##### Signature

`function totalSupply(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[TotalSupplyParams](https://portal.thirdweb.com/references/typescript/v5/TotalSupplyParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the totalSupply function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[TotalSupplyParams](https://portal.thirdweb.com/references/typescript/v5/TotalSupplyParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## updateTokenURI

 This function is an abstracted layer of the [setTokenURI extension](https://portal.thirdweb.com/references/typescript/v5/erc1155/setTokenURI) , which means it uses `setTokenURI` under the hood. While the `setTokenURI` method only takes in a uri string, this extension takes in a user-friendly [NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput) , upload that content to IPFS and pass the IPFS URI (of said `NFTInput` ) to the underlying `setTokenURI` method.

 This extension does not validate the NFTInput so make sure you are passing the proper content that you want to update.

### Example

`import { updateTokenURI } from "thirdweb/extensions/erc1155";

const transaction = updateTokenURI({

 tokenId: 0n,

 nft: {

 name: "new name",

 description: "new description",

 image: "https://image-host.com/new-image.png",

 },

});

`

##### Signature

`function updateTokenURI(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[UpdateTokenURIParams](https://portal.thirdweb.com/references/typescript/v5/UpdateTokenURIParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[UpdateTokenURIParams](https://portal.thirdweb.com/references/typescript/v5/UpdateTokenURIParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 the prepared transaction from `setTokenURI`
## updateMetadata

 Update the metadata of the single token in an Edition Drop (DropERC1155) collection For Edition contracts, use `setTokenURI`

### Example

`import { updateMetadata } from "thirdweb/extensions/erc1155";

import { sendTransaction } from "thirdweb";

const transaction = updateMetadata({

 contract,

 targetTokenId: 0n,

 client: thirdwebClient,

 newMetadata: {

 name: "this is the new nft name",

 description: "...",

 image: "new image uri",

// ...

 },

});

await sendTransaction({ transaction, account });

`

##### Signature

`function updateMetadata(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[UpdateMetadataParams](https://portal.thirdweb.com/references/typescript/v5/UpdateMetadataParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[UpdateMetadataParams](https://portal.thirdweb.com/references/typescript/v5/UpdateMetadataParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 the prepared transaction
## uri

 Calls the "uri" function on the contract.

### Example

`import { uri } from "thirdweb/extensions/erc1155";

const result = await uri({

 contract,

 tokenId: ...,

});

`

##### Signature

`function uri(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[UriParams](https://portal.thirdweb.com/references/typescript/v5/UriParams)>,

): Promise<string>;

`

### Parameters

##### options

 The options for the uri function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[UriParams](https://portal.thirdweb.com/references/typescript/v5/UriParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## allowance

 Calls the "allowance" function on the contract.

### Example

`import { allowance } from "thirdweb/extensions/erc20";

const result = await allowance({

 contract,

 owner: ...,

 spender: ...,

});

`

##### Signature

`function allowance(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[AllowanceParams](https://portal.thirdweb.com/references/typescript/v5/AllowanceParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the allowance function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[AllowanceParams](https://portal.thirdweb.com/references/typescript/v5/AllowanceParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## checkContractWalletSignedTypedData

Deprecated

 Use `verifyTypedData` instead

 Checks if a contract wallet signature is valid.

### Example

`import { checkContractWalletSignedTypedData } from "thirdweb/extensions/erc1271";

const isValid = await checkContractWalletSignedTypedData({

 contract: myContract,

 data: {

 primaryType: "EIP712Domain",

 domain: {

 name: "Example",

 version: "1",

 chainId: 1,

 verifyingContract: myContract.address,

 },

});

`

##### Signature

`function checkContractWalletSignedTypedData(

options: [CheckContractWalletSignTypedDataOptions](https://portal.thirdweb.com/references/typescript/v5/CheckContractWalletSignTypedDataOptions)<

typedData,

primaryType

 >,

): Promise<boolean>;

`

### Parameters

##### options

 The options for the checkContractWalletSignature function.

#### Type

`let options: [CheckContractWalletSignTypedDataOptions](https://portal.thirdweb.com/references/typescript/v5/CheckContractWalletSignTypedDataOptions)<

typedData,

primaryType

>;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 A promise that resolves with a boolean indicating if the signature is valid.
## approvalEvent

 Creates an event object for the Approval event.

### Example

`import { getContractEvents } from "thirdweb";

import { approvalEvent } from "thirdweb/extensions/erc20";

const events = await getContractEvents({

contract,

events: [

approvalEvent({

 owner: ...,

 spender: ...,

})

],

});

`

##### Signature

`function approvalEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "owner";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "spender";

readonly type: "address";

 },

 { readonly name: "value"; readonly type: "uint256" },

 ];

readonly name: "Approval";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "owner";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "spender";

readonly type: "address";

 },

 { readonly name: "value"; readonly type: "uint256" },

 ];

readonly name: "Approval";

readonly type: "event";

}>;

`

 The prepared event object.
## burnFrom

 Prepares a transaction to call the "burnFrom" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { burnFrom } from "thirdweb/extensions/erc20";

const transaction = burnFrom({

 contract,

 account: ...,

 amount: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function burnFrom(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[BurnFromParams](https://portal.thirdweb.com/references/typescript/v5/BurnFromParams) | { asyncParams: () => Promise<[BurnFromParams](https://portal.thirdweb.com/references/typescript/v5/BurnFromParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "burnFrom" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[BurnFromParams](https://portal.thirdweb.com/references/typescript/v5/BurnFromParams) | { asyncParams: () => Promise<[BurnFromParams](https://portal.thirdweb.com/references/typescript/v5/BurnFromParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## checkContractWalletSignature

Deprecated

 Use `verifySignature` instead

 Checks if a contract wallet signature is valid.

### Example

`import { checkContractWalletSignature } from "thirdweb/extensions/erc1271";

const isValid = await checkContractWalletSignature({

 contract: myContract,

 message: "hello world",

 signature: "0x...",

});

`

##### Signature

`function checkContractWalletSignature(

options: [CheckContractWalletSignatureOptions](https://portal.thirdweb.com/references/typescript/v5/CheckContractWalletSignatureOptions),

): Promise<boolean>;

`

### Parameters

##### options

 The options for the checkContractWalletSignature function.

#### Type

`let options: {

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

message: SignableMessage;

signature: string;

};

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 A promise that resolves with a boolean indicating if the signature is valid.
## approve

 Approves the spending of tokens by a specific address.

### Example

`import { approve } from "thirdweb/extensions/erc20";

import { sendTransaction } from "thirdweb";

const transaction = await approve({

 contract,

 spender: "0x...",

 amount: 100,

});

await sendTransaction({ transaction, account });

`

##### Signature

`function approve(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ApproveParams](https://portal.thirdweb.com/references/typescript/v5/ApproveParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The transaction options.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ApproveParams](https://portal.thirdweb.com/references/typescript/v5/ApproveParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## canClaim

 Check if a user can claim a drop.

### Example

`const claimResult = await canClaim({

 contract: contract,

 claimer: "0x1234567890123456789012345678901234567890",

 quantity: "1",

});

`

##### Signature

`function canClaim(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[CanClaimParams](https://portal.thirdweb.com/references/typescript/v5/CanClaimParams)>,

): Promise<[CanClaimResult](https://portal.thirdweb.com/references/typescript/v5/CanClaimResult)>;

`

### Parameters

##### options

 The options for the transaction.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[CanClaimParams](https://portal.thirdweb.com/references/typescript/v5/CanClaimParams)>;

`

### Returns

##### Return Type

`let returnType: { reason?: string; result: boolean };

`

 Whether the user can claim the drop.
## burn

 Prepares a transaction to call the "burn" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { burn } from "thirdweb/extensions/erc20";

const transaction = burn({

 contract,

 amount: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function burn(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[BurnParams](https://portal.thirdweb.com/references/typescript/v5/BurnParams) | { asyncParams: () => Promise<[BurnParams](https://portal.thirdweb.com/references/typescript/v5/BurnParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "burn" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[BurnParams](https://portal.thirdweb.com/references/typescript/v5/BurnParams) | { asyncParams: () => Promise<[BurnParams](https://portal.thirdweb.com/references/typescript/v5/BurnParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## balanceOf

 Calls the "balanceOf" function on the contract.

### Example

`import { balanceOf } from "thirdweb/extensions/erc20";

const result = await balanceOf({

 contract,

 address: ...,

});

`

##### Signature

`function balanceOf(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[BalanceOfParams](https://portal.thirdweb.com/references/typescript/v5/BalanceOfParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the balanceOf function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[BalanceOfParams](https://portal.thirdweb.com/references/typescript/v5/BalanceOfParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## decimals

 Retrieves the number of decimal places for a given ERC20 contract.

### Example

`import { decimals } from "thirdweb/extensions/erc20";

const tokenDecimals = await decimals({ contract });

`

##### Signature

`function decimals(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)): Promise<number>;

`

### Parameters

##### options

 The options for the transaction.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<number>;

`

 A promise that resolves to the number of decimal places.
## claimConditionsUpdatedEvent

 Creates an event object for the ClaimConditionsUpdated event.

### Example

`import { getContractEvents } from "thirdweb";

import { claimConditionsUpdatedEvent } from "thirdweb/extensions/erc20";

const events = await getContractEvents({

 contract,

 events: [claimConditionsUpdatedEvent()],

});

`

##### Signature

`function claimConditionsUpdatedEvent(): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly components: readonly [

 { readonly name: "startTimestamp"; readonly type: "uint256" },

 {

readonly name: "maxClaimableSupply";

readonly type: "uint256";

 },

 { readonly name: "supplyClaimed"; readonly type: "uint256" },

 {

readonly name: "quantityLimitPerWallet";

readonly type: "uint256";

 },

 { readonly name: "merkleRoot"; readonly type: "bytes32" },

 { readonly name: "pricePerToken"; readonly type: "uint256" },

 { readonly name: "currency"; readonly type: "address" },

 { readonly name: "metadata"; readonly type: "string" },

 ];

readonly name: "claimConditions";

readonly type: "tuple[]";

 },

 { readonly name: "resetEligibility"; readonly type: "bool" },

 ];

readonly name: "ClaimConditionsUpdated";

readonly type: "event";

}>;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly components: readonly [

 { readonly name: "startTimestamp"; readonly type: "uint256" },

 {

readonly name: "maxClaimableSupply";

readonly type: "uint256";

 },

 { readonly name: "supplyClaimed"; readonly type: "uint256" },

 {

readonly name: "quantityLimitPerWallet";

readonly type: "uint256";

 },

 { readonly name: "merkleRoot"; readonly type: "bytes32" },

 { readonly name: "pricePerToken"; readonly type: "uint256" },

 { readonly name: "currency"; readonly type: "address" },

 { readonly name: "metadata"; readonly type: "string" },

 ];

readonly name: "claimConditions";

readonly type: "tuple[]";

 },

 { readonly name: "resetEligibility"; readonly type: "bool" },

 ];

readonly name: "ClaimConditionsUpdated";

readonly type: "event";

}>;

`

 The prepared event object.
## delegates

 Calls the "delegates" function on the contract.

### Example

`import { delegates } from "thirdweb/extensions/erc20";

const result = await delegates({

 contract,

 account: ...,

});

`

##### Signature

`function delegates(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[DelegatesParams](https://portal.thirdweb.com/references/typescript/v5/DelegatesParams)>,

): Promise<string>;

`

### Parameters

##### options

 The options for the delegates function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[DelegatesParams](https://portal.thirdweb.com/references/typescript/v5/DelegatesParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## claimTo

 Claim ERC20 NFTs to a specified address

### Example

####  Basic usage

`import { claimTo } from "thirdweb/extensions/erc20";

import { sendTransaction } from "thirdweb";

const transaction = claimTo({

 contract,

 to: "0x...",

 quantity: 100n,

});

await sendTransaction({ transaction, account });

`

####  For Drops with allowlists

 You need to specify the claimer address as the `from` param to avoid any issue with the allowlist

`const transaction = claimTo({

 contract,

 to: "0x...",

 quantity: 100n,

 from: "0x...", // address of the one claiming

});

`

##### Signature

`function claimTo(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ClaimToParams](https://portal.thirdweb.com/references/typescript/v5/ClaimToParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the transaction

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ClaimToParams](https://portal.thirdweb.com/references/typescript/v5/ClaimToParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A promise that resolves with the submitted transaction hash.
## delegate

 Prepares a transaction to call the "delegate" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { delegate } from "thirdweb/extensions/erc20";

const transaction = delegate({

 contract,

 delegatee: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function delegate(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[DelegateParams](https://portal.thirdweb.com/references/typescript/v5/DelegateParams) | { asyncParams: () => Promise<[DelegateParams](https://portal.thirdweb.com/references/typescript/v5/DelegateParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "delegate" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[DelegateParams](https://portal.thirdweb.com/references/typescript/v5/DelegateParams) | { asyncParams: () => Promise<[DelegateParams](https://portal.thirdweb.com/references/typescript/v5/DelegateParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## generateMintSignature

 Generates the payload and signature for minting an ERC20 token.

### Example

`import {

 mintWithSignature,

 generateMintSignature,

} from "thirdweb/extensions/erc20";

const { payload, signature } = await generateMintSignature({

 account,

 contract,

 mintRequest: {

 to: "0x...",

 quantity: "10",

 },

});

const transaction = mintWithSignature({

 contract,

 payload,

 signature,

});

await sendTransaction({ transaction, account });

`

##### Signature

`` function generateMintSignature(

options: [GenerateMintSignatureOptions](https://portal.thirdweb.com/references/typescript/v5/GenerateMintSignatureOptions),

): Promise<{

payload: {

currency: string;

price: bigint;

primarySaleRecipient: string;

quantity: bigint;

to: string;

uid: `0x${string}`;

validityEndTimestamp: bigint;

validityStartTimestamp: bigint;

 };

signature: `0x${string}`;

}>;

 ``

### Parameters

##### options

 The options for the minting process.

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

contractType?: "TokenERC1155" | "SignatureMintERC1155";

mintRequest: GeneratePayloadInput;

};

`

### Returns

##### Return Type

`` let returnType: Promise<{

payload: {

currency: string;

price: bigint;

primarySaleRecipient: string;

quantity: bigint;

to: string;

uid: `0x${string}`;

validityEndTimestamp: bigint;

validityStartTimestamp: bigint;

 };

signature: `0x${string}`;

}>;

 ``

 A promise that resolves to the payload and signature.
## getActiveClaimCondition

 Retrieves the active claim condition.

### Example

`import { getActiveClaimCondition } from "thirdweb/extensions/erc20";

const activeClaimCondition = await getActiveClaimCondition({

 contract,

});

`

##### Signature

`function getActiveClaimCondition(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<ClaimCondition>;

`

### Parameters

##### options

 The transaction options.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<ClaimCondition>;

`

 A promise that resolves to the active claim condition.
## getActiveClaimConditionId

 Calls the "getActiveClaimConditionId" function on the contract.

### Example

`import { getActiveClaimConditionId } from "thirdweb/extensions/erc20";

const result = await getActiveClaimConditionId({

 contract,

});

`

##### Signature

`function getActiveClaimConditionId(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the getActiveClaimConditionId function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## getClaimConditions

 Retrieves all claim conditions.

### Example

`import { getClaimConditions } from "thirdweb/extensions/erc20";

const conditions = await getClaimConditions({ contract });

`

##### Signature

`function getClaimConditions(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<Array<ClaimCondition>>;

`

### Parameters

##### options

 The transaction options.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<Array<ClaimCondition>>;

`

 A promise that resolves to all claim conditions.
## getClaimConditionById

 Calls the "getClaimConditionById" function on the contract.

### Example

`import { getClaimConditionById } from "thirdweb/extensions/erc20";

const result = await getClaimConditionById({

 contract,

 conditionId: ...,

});

`

##### Signature

`` function getClaimConditionById(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetClaimConditionByIdParams](https://portal.thirdweb.com/references/typescript/v5/GetClaimConditionByIdParams)>,

): Promise<{

currency: string;

maxClaimableSupply: bigint;

merkleRoot: `0x${string}`;

metadata: string;

pricePerToken: bigint;

quantityLimitPerWallet: bigint;

startTimestamp: bigint;

supplyClaimed: bigint;

}>;

 ``

### Parameters

##### options

 The options for the getClaimConditionById function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetClaimConditionByIdParams](https://portal.thirdweb.com/references/typescript/v5/GetClaimConditionByIdParams)>;

`

### Returns

##### Return Type

`` let returnType: Promise<{

currency: string;

maxClaimableSupply: bigint;

merkleRoot: `0x${string}`;

metadata: string;

pricePerToken: bigint;

quantityLimitPerWallet: bigint;

startTimestamp: bigint;

supplyClaimed: bigint;

}>;

 ``

 The parsed result of the function call.
## getBalance

 Retrieves the balance of an ERC20 token for a specific address.

### Example

`import { getBalance } from "thirdweb/extensions/erc20";

const balance = await getBalance({ contract, address: "0x..." });

`

##### Signature

`function getBalance(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetBalanceParams](https://portal.thirdweb.com/references/typescript/v5/GetBalanceParams)>,

): Promise<[GetBalanceResult](https://portal.thirdweb.com/references/typescript/v5/GetBalanceResult)>;

`

### Parameters

##### options

 The transaction options including the address.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetBalanceParams](https://portal.thirdweb.com/references/typescript/v5/GetBalanceParams)>;

`

### Returns

##### Return Type

`let returnType: {

decimals: number;

displayValue: string;

name: string;

symbol: string;

value: bigint;

};

`

 An object containing the balance value, display value, and symbol.
## getCurrencyMetadata

 Retrieves the metadata of a currency.

### Example

`import { getCurrencyMetadata } from "thirdweb/extensions/erc20";

const currencyMetadata = await getCurrencyMetadata({ contract });

`

##### Signature

`function getCurrencyMetadata(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<[GetCurrencyMetadataResult](https://portal.thirdweb.com/references/typescript/v5/GetCurrencyMetadataResult)>;

`

### Parameters

##### options

 The options for the transaction.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: { decimals: number; name: string; symbol: string };

`

 A promise that resolves to an object containing the currency metadata.
## deposit

 Calls the "deposit" function on the contract (useful to wrap ETH).

### Example

`import { deposit } from "thirdweb/extensions/erc20";

import { sendTransaction } from "thirdweb";

const transaction = deposit({ contract, amount: "0.1" });

await sendTransaction({ transaction, account });

`

##### Signature

`function deposit(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[DepositParams](https://portal.thirdweb.com/references/typescript/v5/DepositParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "deposit" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[DepositParams](https://portal.thirdweb.com/references/typescript/v5/DepositParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## isClaimToSupported

 Checks if the `claimTo` method is supported by the given contract.

### Example

`import { isClaimToSupported } from "thirdweb/extensions/erc20";

const supported = isClaimToSupported(["0x..."]);

`

##### Signature

`function isClaimToSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `claimTo` method is supported.
## isERC20

 Check if a contract is an ERC20 token.

### Example

`import { isERC20 } from "thirdweb/extensions/erc20";

import { resolveContractAbi } from "thirdweb/contract";

const abi = await resolveContractAbi(contract);

const selectors = abi

 .filter((f) => f.type === "function")

 .map((f) => toFunctionSelector(f));

const result = await isERC20(selectors);

`

##### Signature

`function isERC20(availableSelectors: Array<string>): boolean;

`

### Parameters

##### availableSelectors

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating whether the contract is an ERC20 token.
## isGetActiveClaimConditionSupported

 Checks if the `getActiveClaimCondition` method is supported by the given contract.

### Example

`import { isGetActiveClaimConditionSupported } from "thirdweb/extensions/erc20";

const supported = isGetActiveClaimConditionSupported(["0x..."]);

`

##### Signature

`function isGetActiveClaimConditionSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getActiveClaimCondition` method is supported.
## isGetClaimConditionByIdSupported

 Checks if the `getClaimConditionById` method is supported by the given contract.

### Example

`import { isGetClaimConditionByIdSupported } from "thirdweb/extensions/erc20";

const supported = isGetClaimConditionByIdSupported(["0x..."]);

`

##### Signature

`function isGetClaimConditionByIdSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getClaimConditionById` method is supported.
## isMintToSupported

 Checks if the `mintTo` method is supported by the given contract.

### Example

`import { isMintToSupported } from "thirdweb/extensions/erc20";

const supported = isMintToSupported(["0x..."]);

`

##### Signature

`function isMintToSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `mintTo` method is supported.
## isResetClaimEligibilitySupported

 Checks if the `resetClaimEligibility` method is supported by the given contract.

### Example

`import { isResetClaimEligibilitySupported } from "thirdweb/extensions/erc20";

const supported = isResetClaimEligibilitySupported(["0x..."]);

`

##### Signature

`function isResetClaimEligibilitySupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `resetClaimEligibility` method is supported.
## isGetActiveClaimConditionIdSupported

 Checks if the `getActiveClaimConditionId` method is supported by the given contract.

### Example

`import { isGetActiveClaimConditionIdSupported } from "thirdweb/extensions/erc20";

const supported = isGetActiveClaimConditionIdSupported(["0x..."]);

`

##### Signature

`function isGetActiveClaimConditionIdSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getActiveClaimConditionId` method is supported.
## mintTo

 Mints a specified amount of tokens to a given address.

### Example

`import { mintTo } from "thirdweb/extensions/erc20";

import { sendTransaction } from "thirdweb";

const transaction = mintTo({

 contract,

 to: "0x...",

 amount: 100,

});

await sendTransaction({ transaction, account });

`

##### Signature

`function mintTo(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MintToParams](https://portal.thirdweb.com/references/typescript/v5/MintToParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for minting tokens.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MintToParams](https://portal.thirdweb.com/references/typescript/v5/MintToParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## resetClaimEligibility

 Reset the claim eligibility for all users.

### Example

`import { resetClaimEligibility } from "thirdweb/extensions/erc20";

import { sendTransaction } from "thirdweb";

const transaction = resetClaimEligibility({

 contract,

});

await sendTransaction({ transaction, account });

`

##### Signature

`function resetClaimEligibility(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 the prepared transaction
## isSetClaimConditionsSupported

 Checks if the `setClaimConditions` method is supported by the given contract.

### Example

`import { isSetClaimConditionsSupported } from "thirdweb/extensions/erc20";

const supported = isSetClaimConditionsSupported(["0x..."]);

`

##### Signature

`function isSetClaimConditionsSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `setClaimConditions` method is supported.
## mintWithSignature

 Mints a new ERC20 token with the given minter signature

### Example

`import { mintWithSignature, generateMintSignature } from "thirdweb/extensions/erc20";

import { sendTransaction } from "thirdweb";

const { payload, signature } = await generateMintSignature(...)

const transaction = mintWithSignature({

 contract,

 payload,

 signature,

});

await sendTransaction({ transaction, account });

`

##### Signature

`function mintWithSignature(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<MintWithSignatureParams>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The transaction options.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<MintWithSignatureParams>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A promise that resolves to the transaction result.
## tokensClaimedEvent

 Creates an event object for the TokensClaimed event.

### Example

`import { getContractEvents } from "thirdweb";

import { tokensClaimedEvent } from "thirdweb/extensions/erc20";

const events = await getContractEvents({

contract,

events: [

tokensClaimedEvent({

 claimConditionIndex: ...,

 claimer: ...,

 receiver: ...,

})

],

});

`

##### Signature

`function tokensClaimedEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "claimConditionIndex";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "claimer";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "receiver";

readonly type: "address";

 },

 { readonly name: "quantityClaimed"; readonly type: "uint256" },

 ];

readonly name: "TokensClaimed";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "claimConditionIndex";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "claimer";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "receiver";

readonly type: "address";

 },

 { readonly name: "quantityClaimed"; readonly type: "uint256" },

 ];

readonly name: "TokensClaimed";

readonly type: "event";

}>;

`

 The prepared event object.
## setClaimConditions

 Set the claim conditions for a ERC20 drop

### Example

`import { setClaimConditions } from "thirdweb/extensions/erc20";

import { sendTransaction } from "thirdweb";

const transaction = setClaimConditions({

 contract,

 phases: [

 {

 maxClaimableSupply: 100n,

 maxClaimablePerWallet: 1n,

 currencyAddress: "0x...",

 price: 0.1,

 startTime: new Date(),

 },

 ],

});

await sendTransaction({ transaction, account });

`

##### Signature

`function setClaimConditions(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[SetClaimConditionsParams](https://portal.thirdweb.com/references/typescript/v5/SetClaimConditionsParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[SetClaimConditionsParams](https://portal.thirdweb.com/references/typescript/v5/SetClaimConditionsParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 the prepared transaction
## tokensMintedWithSignatureEvent

 Creates an event object for the TokensMintedWithSignature event.

### Example

`import { getContractEvents } from "thirdweb";

import { tokensMintedWithSignatureEvent } from "thirdweb/extensions/erc20";

const events = await getContractEvents({

contract,

events: [

tokensMintedWithSignatureEvent({

 signer: ...,

 mintedTo: ...,

})

],

});

`

##### Signature

`function tokensMintedWithSignatureEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "signer";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "mintedTo";

readonly type: "address";

 },

 {

readonly components: readonly [

 { readonly name: "to"; readonly type: "address" },

 {

readonly name: "primarySaleRecipient";

readonly type: "address";

 },

 { readonly name: "quantity"; readonly type: "uint256" },

 { readonly name: "price"; readonly type: "uint256" },

 { readonly name: "currency"; readonly type: "address" },

 {

readonly name: "validityStartTimestamp";

readonly type: "uint128";

 },

 {

readonly name: "validityEndTimestamp";

readonly type: "uint128";

 },

 { readonly name: "uid"; readonly type: "bytes32" },

 ];

readonly name: "mintRequest";

readonly type: "tuple";

 },

 ];

readonly name: "TokensMintedWithSignature";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "signer";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "mintedTo";

readonly type: "address";

 },

 {

readonly components: readonly [

 { readonly name: "to"; readonly type: "address" },

 {

readonly name: "primarySaleRecipient";

readonly type: "address";

 },

 { readonly name: "quantity"; readonly type: "uint256" },

 { readonly name: "price"; readonly type: "uint256" },

 { readonly name: "currency"; readonly type: "address" },

 {

readonly name: "validityStartTimestamp";

readonly type: "uint128";

 },

 {

readonly name: "validityEndTimestamp";

readonly type: "uint128";

 },

 { readonly name: "uid"; readonly type: "bytes32" },

 ];

readonly name: "mintRequest";

readonly type: "tuple";

 },

 ];

readonly name: "TokensMintedWithSignature";

readonly type: "event";

}>;

`

 The prepared event object.
## transfer

 Transfers ERC20 tokens from the sender's address to the specified recipient address.

### Example

`import { transfer } from "thirdweb/extensions/erc20";

import { sendTransaction } from "thirdweb";

const transaction = transfer({

 contract,

 to: "0x...",

 amount: 100,

});

await sendTransaction({ transaction, account });

`

##### Signature

`function transfer(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[TransferParams](https://portal.thirdweb.com/references/typescript/v5/TransferParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the transfer transaction.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[TransferParams](https://portal.thirdweb.com/references/typescript/v5/TransferParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A promise that resolves to the prepared transaction.
## transferBatch

 Transfers a batch of ERC20 tokens from the sender's address to the specified recipient address.

### Example

`import { transferBatch } from "thirdweb/extensions/erc20";

import { sendTransaction } from "thirdweb";

const transaction = transferBatch({

 contract,

 batch: [

 {

 to: "0x...",

 amount: 100,

 },

 {

 to: "0x...",

 amount: "0.1",

 },

]);

await sendTransaction({ transaction, account });

`

##### Signature

`function transferBatch(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<{

batch: Array<

 { to: string } & (

| { amount: string | number }

| { amountWei: bigint }

 )

 >;

 }>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the batch transfer transaction.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<{

batch: Array<

 { to: string } & (

| { amount: string | number }

| { amountWei: bigint }

 )

 >;

}>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A promise that resolves to the prepared transaction.
## tokensMintedEvent

 Creates an event object for the TokensMinted event.

### Example

`import { getContractEvents } from "thirdweb";

import { tokensMintedEvent } from "thirdweb/extensions/erc20";

const events = await getContractEvents({

contract,

events: [

tokensMintedEvent({

 mintedTo: ...,

})

],

});

`

##### Signature

`function tokensMintedEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "mintedTo";

readonly type: "address";

 },

 { readonly name: "quantityMinted"; readonly type: "uint256" },

 ];

readonly name: "TokensMinted";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "mintedTo";

readonly type: "address";

 },

 { readonly name: "quantityMinted"; readonly type: "uint256" },

 ];

readonly name: "TokensMinted";

readonly type: "event";

}>;

`

 The prepared event object.
## transferEvent

 Creates an event object for the Transfer event.

### Example

`import { getContractEvents } from "thirdweb";

import { transferEvent } from "thirdweb/extensions/erc20";

const events = await getContractEvents({

contract,

events: [

transferEvent({

 from: ...,

 to: ...,

})

],

});

`

##### Signature

`function transferEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "from";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "to";

readonly type: "address";

 },

 { readonly name: "value"; readonly type: "uint256" },

 ];

readonly name: "Transfer";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "from";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "to";

readonly type: "address";

 },

 { readonly name: "value"; readonly type: "uint256" },

 ];

readonly name: "Transfer";

readonly type: "event";

}>;

`

 The prepared event object.
## transferFrom

 Transfers a specified amount of tokens from one address to another address on the ERC20 contract.

### Example

`import { transferFrom } from "thirdweb/extensions/erc20";

import { sendTransaction } from "thirdweb";

const transaction = transferFrom({

 contract: USDC_CONTRACT,

 from: "0x1234...",

 to: "0x5678...",

 amount: 100,

});

await sendTransaction({ transaction, account });

`

##### Signature

`function transferFrom(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[TransferFromParams](https://portal.thirdweb.com/references/typescript/v5/TransferFromParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The transaction options including from, to, amount, and gas price.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[TransferFromParams](https://portal.thirdweb.com/references/typescript/v5/TransferFromParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A promise that resolves to the prepared transaction object.
## accountDeployedEvent

 Creates an event object for the AccountDeployed event.

### Example

`import { getContractEvents } from "thirdweb";

import { accountDeployedEvent } from "thirdweb/extensions/erc4337";

const events = await getContractEvents({

contract,

events: [

accountDeployedEvent({

 userOpHash: ...,

 sender: ...,

})

],

});

`

##### Signature

`function accountDeployedEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "userOpHash";

readonly type: "bytes32";

 },

 {

readonly indexed: true;

readonly name: "sender";

readonly type: "address";

 },

 { readonly name: "factory"; readonly type: "address" },

 { readonly name: "paymaster"; readonly type: "address" },

 ];

readonly name: "AccountDeployed";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "userOpHash";

readonly type: "bytes32";

 },

 {

readonly indexed: true;

readonly name: "sender";

readonly type: "address";

 },

 { readonly name: "factory"; readonly type: "address" },

 { readonly name: "paymaster"; readonly type: "address" },

 ];

readonly name: "AccountDeployed";

readonly type: "event";

}>;

`

 The prepared event object.
## withdraw

 Prepares a transaction to call the "withdraw" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { withdraw } from "thirdweb/extensions/erc20";

const transaction = withdraw({

 contract,

 amount: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function withdraw(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[WithdrawParams](https://portal.thirdweb.com/references/typescript/v5/WithdrawParams) | { asyncParams: () => Promise<[WithdrawParams](https://portal.thirdweb.com/references/typescript/v5/WithdrawParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "withdraw" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[WithdrawParams](https://portal.thirdweb.com/references/typescript/v5/WithdrawParams) | { asyncParams: () => Promise<[WithdrawParams](https://portal.thirdweb.com/references/typescript/v5/WithdrawParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## addSessionKey

 Adds session key permissions for a specified address.

### Example

`import { addSessionKey } from "thirdweb/extensions/erc4337";

import { sendTransaction } from "thirdweb";

const transaction = addSessionKey({

 contract,

 account,

 sessionKeyAddress,

 permissions: {

 approvedTargets: ["0x..."],

 nativeTokenLimitPerTransaction: 0.1, // in ETH

 permissionStartTimestamp: new Date(),

 permissionEndTimestamp: new Date(

 Date.now() + 1000 * 60 * 60 * 24 * 365,

 ), // 1 year from now

 },

});

await sendTransaction({ transaction, account });

`

##### Signature

`function addSessionKey(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[AddSessionKeyOptions](https://portal.thirdweb.com/references/typescript/v5/AddSessionKeyOptions)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the removeSessionKey function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[AddSessionKeyOptions](https://portal.thirdweb.com/references/typescript/v5/AddSessionKeyOptions)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 The transaction object to be sent.
## addAdmin

 Adds admin permissions for a specified address.

### Example

`import { addAdmin } from "thirdweb/extensions/erc4337";

import { sendTransaction } from "thirdweb";

const transaction = addAdmin({

 contract,

 account,

 adminAddress: "0x...",

});

await sendTransaction({ transaction, account });

`

##### Signature

`function addAdmin(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[AddAdminOptions](https://portal.thirdweb.com/references/typescript/v5/AddAdminOptions)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the addAdmin function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[AddAdminOptions](https://portal.thirdweb.com/references/typescript/v5/AddAdminOptions)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 The transaction object to be sent.
## adminUpdatedEvent

 Creates an event object for the AdminUpdated event.

### Example

`import { getContractEvents } from "thirdweb";

import { adminUpdatedEvent } from "thirdweb/extensions/erc4337";

const events = await getContractEvents({

contract,

events: [

adminUpdatedEvent({

 signer: ...,

})

],

});

`

##### Signature

`function adminUpdatedEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "signer";

readonly type: "address";

 },

 { readonly name: "isAdmin"; readonly type: "bool" },

 ];

readonly name: "AdminUpdated";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "signer";

readonly type: "address";

 },

 { readonly name: "isAdmin"; readonly type: "bool" },

 ];

readonly name: "AdminUpdated";

readonly type: "event";

}>;

`

 The prepared event object.
## getAccounts

 Calls the "getAccounts" function on the contract.

### Example

`import { getAccounts } from "thirdweb/extensions/erc4337";

const result = await getAccounts({

 contract,

 start: ...,

 end: ...,

});

`

##### Signature

`function getAccounts(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<GetAccountsParams>) : Promise<readonly Array<string>>

`

### Parameters

##### options

 The options for the getAccounts function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<GetAccountsParams>;

`

### Returns

##### Return Type

`let returnType: Promise<readonly Array<string>>

`

 The parsed result of the function call.
## createAccount

 Prepares a transaction to call the "createAccount" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { createAccount } from "thirdweb/extensions/erc4337";

const transaction = createAccount({

 contract,

 admin: ...,

 data: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function createAccount(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [CreateAccountParams](https://portal.thirdweb.com/references/typescript/v5/CreateAccountParams)

| { asyncParams: () => Promise<[CreateAccountParams](https://portal.thirdweb.com/references/typescript/v5/CreateAccountParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "createAccount" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [CreateAccountParams](https://portal.thirdweb.com/references/typescript/v5/CreateAccountParams)

| { asyncParams: () => Promise<[CreateAccountParams](https://portal.thirdweb.com/references/typescript/v5/CreateAccountParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## getAccountsOfSigner

 Calls the "getAccountsOfSigner" function on the contract.

### Example

`import { getAccountsOfSigner } from "thirdweb/extensions/erc4337";

const result = await getAccountsOfSigner({

 contract,

 signer: ...,

});

`

##### Signature

`function getAccountsOfSigner(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetAccountsOfSignerParams](https://portal.thirdweb.com/references/typescript/v5/GetAccountsOfSignerParams)>) : Promise<readonly Array<string>>

`

### Parameters

##### options

 The options for the getAccountsOfSigner function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetAccountsOfSignerParams](https://portal.thirdweb.com/references/typescript/v5/GetAccountsOfSignerParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<readonly Array<string>>

`

 The parsed result of the function call.
## getAllAccounts

 Calls the "getAllAccounts" function on the contract.

### Example

`import { getAllAccounts } from "thirdweb/extensions/erc4337";

const result = await getAllAccounts({

 contract,

});

`

##### Signature

`function getAllAccounts(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)) : Promise<readonly Array<string>>

`

### Parameters

##### options

 The options for the getAllAccounts function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<readonly Array<string>>

`

 The parsed result of the function call.
## getAllActiveSigners

 Calls the "getAllActiveSigners" function on the contract.

### Example

`import { getAllActiveSigners } from "thirdweb/extensions/erc4337";

const result = await getAllActiveSigners({

 contract,

});

`

##### Signature

`function getAllActiveSigners(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)) : Promise<readonly Array<{ approvedTargets: readonly Array<string>; endTimestamp: bigint; nativeTokenLimitPerTransaction: bigint; signer: string; startTimestamp: bigint }>>

`

### Parameters

##### options

 The options for the getAllActiveSigners function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<readonly Array<{ approvedTargets: readonly Array<string>; endTimestamp: bigint; nativeTokenLimitPerTransaction: bigint; signer: string; startTimestamp: bigint }>>

`

 The parsed result of the function call.
## getAllSigners

 Calls the "getAllSigners" function on the contract.

### Example

`import { getAllSigners } from "thirdweb/extensions/erc4337";

const result = await getAllSigners({

 contract,

});

`

##### Signature

`function getAllSigners(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)) : Promise<readonly Array<{ approvedTargets: readonly Array<string>; endTimestamp: bigint; nativeTokenLimitPerTransaction: bigint; signer: string; startTimestamp: bigint }>>

`

### Parameters

##### options

 The options for the getAllSigners function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<readonly Array<{ approvedTargets: readonly Array<string>; endTimestamp: bigint; nativeTokenLimitPerTransaction: bigint; signer: string; startTimestamp: bigint }>>

`

 The parsed result of the function call.
## getAllAdmins

 Calls the "getAllAdmins" function on the contract.

### Example

`import { getAllAdmins } from "thirdweb/extensions/erc4337";

const result = await getAllAdmins({

 contract,

});

`

##### Signature

`function getAllAdmins(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)) : Promise<readonly Array<string>>

`

### Parameters

##### options

 The options for the getAllAdmins function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<readonly Array<string>>

`

 The parsed result of the function call.
## getPermissionsForSigner

 Calls the "getPermissionsForSigner" function on the contract.

### Example

`import { getPermissionsForSigner } from "thirdweb/extensions/erc4337";

const result = await getPermissionsForSigner({

 contract,

 signer: ...,

});

`

##### Signature

`function getPermissionsForSigner(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetPermissionsForSignerParams](https://portal.thirdweb.com/references/typescript/v5/GetPermissionsForSignerParams)>) : Promise<{ approvedTargets: readonly Array<string>; endTimestamp: bigint; nativeTokenLimitPerTransaction: bigint; signer: string; startTimestamp: bigint }>

`

### Parameters

##### options

 The options for the getPermissionsForSigner function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetPermissionsForSignerParams](https://portal.thirdweb.com/references/typescript/v5/GetPermissionsForSignerParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<{ approvedTargets: readonly Array<string>; endTimestamp: bigint; nativeTokenLimitPerTransaction: bigint; signer: string; startTimestamp: bigint }>

`

 The parsed result of the function call.
## getUserOpHash

 Calls the "getUserOpHash" function on the contract.

### Example

`import { getUserOpHash } from "thirdweb/extensions/erc4337";

const result = await getUserOpHash({

 contract,

 userOp: ...,

});

`

##### Signature

`` function getUserOpHash(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetUserOpHashParams](https://portal.thirdweb.com/references/typescript/v5/GetUserOpHashParams)>,

): Promise<`0x${string}`>;

 ``

### Parameters

##### options

 The options for the getUserOpHash function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetUserOpHashParams](https://portal.thirdweb.com/references/typescript/v5/GetUserOpHashParams)>;

`

### Returns

##### Return Type

`` let returnType: Promise<`0x${string}`>;

 ``

 The parsed result of the function call.
## isActiveSigner

 Calls the "isActiveSigner" function on the contract.

### Example

`import { isActiveSigner } from "thirdweb/extensions/erc4337";

const result = await isActiveSigner({

 contract,

 signer: ...,

});

`

##### Signature

`function isActiveSigner(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsActiveSignerParams](https://portal.thirdweb.com/references/typescript/v5/IsActiveSignerParams)>,

): Promise<boolean>;

`

### Parameters

##### options

 The options for the isActiveSigner function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsActiveSignerParams](https://portal.thirdweb.com/references/typescript/v5/IsActiveSignerParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 The parsed result of the function call.
## totalSupply

 Calls the "totalSupply" function on the contract.

### Example

`import { totalSupply } from "thirdweb/extensions/erc20";

const result = await totalSupply({

 contract,

});

`

##### Signature

`function totalSupply(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the totalSupply function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## isAccountDeployed

 Adds admin permissions for a specified address.

### Example

`import { isAccountDeployed } from "thirdweb/extensions/erc4337";

const isDeployed = await isAccountDeployed({

 contract,

 account,

 adminSigner: "0x...",

});

await isAccountDeployed({ contract, adminSigner });

`

##### Signature

`function isAccountDeployed(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<GetAddressParams>,

): Promise<boolean>;

`

### Parameters

##### options

 The options for the addAdmin function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<GetAddressParams>;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 The transaction object to be sent.
## isAddSessionKeySupported

 Checks if the `isAddSessionKeySupported` method is supported by the given contract.

### Example

`import { isAddSessionKeySupported } from "thirdweb/extensions/erc4337";

const supported = isAddSessionKeySupported(["0x..."]);

`

##### Signature

`function isAddSessionKeySupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `isAddSessionKeySupported` method is supported.
## isAddAdminSupported

 Checks if the `isAddAdminSupported` method is supported by the given contract.

### Example

`import { isAddAdminSupported } from "thirdweb/extensions/erc4337";

const supported = isAddAdminSupported(["0x..."]);

`

##### Signature

`function isAddAdminSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `isAddAdminSupported` method is supported.
## isCreateAccountSupported

 Checks if the `createAccount` method is supported by the given contract.

### Example

`import { isCreateAccountSupported } from "thirdweb/extensions/erc4337";

const supported = isCreateAccountSupported(["0x..."]);

`

##### Signature

`function isCreateAccountSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `createAccount` method is supported.
## isAdmin

 Calls the "isAdmin" function on the contract.

### Example

`import { isAdmin } from "thirdweb/extensions/erc4337";

const result = await isAdmin({

 contract,

 signer: ...,

});

`

##### Signature

`function isAdmin(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<IsAdminParams>,

): Promise<boolean>;

`

### Parameters

##### options

 The options for the isAdmin function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<IsAdminParams>;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 The parsed result of the function call.
## isGetAccountsOfSignerSupported

 Checks if the `getAccountsOfSigner` method is supported by the given contract.

### Example

`import { isGetAccountsOfSignerSupported } from "thirdweb/extensions/erc4337";

const supported = isGetAccountsOfSignerSupported(["0x..."]);

`

##### Signature

`function isGetAccountsOfSignerSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getAccountsOfSigner` method is supported.
## isGetAccountsSupported

 Checks if the `getAccounts` method is supported by the given contract.

### Example

`import { isGetAccountsSupported } from "thirdweb/extensions/erc4337";

const supported = isGetAccountsSupported(["0x..."]);

`

##### Signature

`function isGetAccountsSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getAccounts` method is supported.
## isGetAllActiveSignersSupported

 Checks if the `getAllActiveSigners` method is supported by the given contract.

### Example

`import { isGetAllActiveSignersSupported } from "thirdweb/extensions/erc4337";

const supported = isGetAllActiveSignersSupported(["0x..."]);

`

##### Signature

`function isGetAllActiveSignersSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getAllActiveSigners` method is supported.
## isGetAllAccountsSupported

 Checks if the `getAllAccounts` method is supported by the given contract.

### Example

`import { isGetAllAccountsSupported } from "thirdweb/extensions/erc4337";

const supported = isGetAllAccountsSupported(["0x..."]);

`

##### Signature

`function isGetAllAccountsSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getAllAccounts` method is supported.
## isGetAllSignersSupported

 Checks if the `getAllSigners` method is supported by the given contract.

### Example

`import { isGetAllSignersSupported } from "thirdweb/extensions/erc4337";

const supported = isGetAllSignersSupported(["0x..."]);

`

##### Signature

`function isGetAllSignersSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getAllSigners` method is supported.
## isGetAllAdminsSupported

 Checks if the `getAllAdmins` method is supported by the given contract.

### Example

`import { isGetAllAdminsSupported } from "thirdweb/extensions/erc4337";

const supported = isGetAllAdminsSupported(["0x..."]);

`

##### Signature

`function isGetAllAdminsSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getAllAdmins` method is supported.
## isIsAccountDeployedSupported

 Checks if the `getAddress` method is supported by the given contract.

### Example

`import { isGetAddressSupported } from "thirdweb/extensions/erc4337";

const supported = isGetAddressSupported(["0x..."]);

`

##### Signature

`function isIsAccountDeployedSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getAddress` method is supported.
## isIsAdminSupported

 Checks if the `isAdmin` method is supported by the given contract.

### Example

`import { isIsAdminSupported } from "thirdweb/extensions/erc4337";

const supported = isIsAdminSupported(["0x..."]);

`

##### Signature

`function isIsAdminSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `isAdmin` method is supported.
## isIsActiveSignerSupported

 Checks if the `isActiveSigner` method is supported by the given contract.

### Example

`import { isIsActiveSignerSupported } from "thirdweb/extensions/erc4337";

const supported = isIsActiveSignerSupported(["0x..."]);

`

##### Signature

`function isIsActiveSignerSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `isActiveSigner` method is supported.
## isRegistered

 Calls the "isRegistered" function on the contract.

### Example

`import { isRegistered } from "thirdweb/extensions/erc4337";

const result = await isRegistered({

 contract,

 account: ...,

});

`

##### Signature

`function isRegistered(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<IsRegisteredParams>,

): Promise<boolean>;

`

### Parameters

##### options

 The options for the isRegistered function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<IsRegisteredParams>;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 The parsed result of the function call.
## isRemoveAdminSupported

 Checks if the `isRemoveAdminSupported` method is supported by the given contract.

### Example

`import { isRemoveAdminSupported } from "thirdweb/extensions/erc4337";

const supported = isRemoveAdminSupported(["0x..."]);

`

##### Signature

`function isRemoveAdminSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `isRemoveAdminSupported` method is supported.
## isRemoveSessionKeySupported

 Checks if the `isRemoveSessionKeySupported` method is supported by the given contract.

### Example

`import { isRemoveSessionKeySupported } from "thirdweb/extensions/erc4337";

const supported = isRemoveSessionKeySupported(["0x..."]);

`

##### Signature

`function isRemoveSessionKeySupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `isRemoveSessionKeySupported` method is supported.
## isValidateUserOpSupported

 Checks if the `validateUserOp` method is supported by the given contract.

### Example

`import { isValidateUserOpSupported } from "thirdweb/extensions/erc4337";

const supported = isValidateUserOpSupported(["0x..."]);

`

##### Signature

`function isValidateUserOpSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `validateUserOp` method is supported.
## isTotalAccountsSupported

 Checks if the `totalAccounts` method is supported by the given contract.

### Example

`import { isTotalAccountsSupported } from "thirdweb/extensions/erc4337";

const supported = isTotalAccountsSupported(["0x..."]);

`

##### Signature

`function isTotalAccountsSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `totalAccounts` method is supported.
## removeAdmin

 Removes admin permissions for a specified address.

### Example

`import { removeAdmin } from "thirdweb/extensions/erc4337";

import { sendTransaction } from "thirdweb";

const transaction = removeAdmin({

 contract,

 account,

 adminAddress: "0x...",

});

await sendTransaction({ transaction, account });

`

##### Signature

`function removeAdmin(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[RemoveAdminOptions](https://portal.thirdweb.com/references/typescript/v5/RemoveAdminOptions)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the removeAdmin function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[RemoveAdminOptions](https://portal.thirdweb.com/references/typescript/v5/RemoveAdminOptions)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 The transaction object to be sent.
## predictAccountAddress

 Calls the "getAddress" function on the contract.

### Example

`import { getAddress } from "thirdweb/extensions/erc4337";

const result = await getAddress({

 contract,

 adminSigner: ...,

 data: ...,

});

`

##### Signature

`function predictAccountAddress(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<GetAddressParams>,

): Promise<string>;

`

### Parameters

##### options

 The options for the getAddress function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<GetAddressParams>;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## removeSessionKey

 Removes session key permissions for a specified address.

### Example

`import { removeSessionKey } from "thirdweb/extensions/erc4337";

import { sendTransaction } from "thirdweb";

const transaction = removeSessionKey({

 contract,

 account,

 sessionKeyAddress,

});

await sendTransaction({ transaction, account });

`

##### Signature

`function removeSessionKey(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[RemoveSessionKeyOptions](https://portal.thirdweb.com/references/typescript/v5/RemoveSessionKeyOptions)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the removeSessionKey function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[RemoveSessionKeyOptions](https://portal.thirdweb.com/references/typescript/v5/RemoveSessionKeyOptions)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 The transaction object to be sent.
## signerPermissionsUpdatedEvent

 Creates an event object for the SignerPermissionsUpdated event.

### Example

`import { getContractEvents } from "thirdweb";

import { signerPermissionsUpdatedEvent } from "thirdweb/extensions/erc4337";

const events = await getContractEvents({

contract,

events: [

signerPermissionsUpdatedEvent({

 authorizingSigner: ...,

 targetSigner: ...,

})

],

});

`

##### Signature

`function signerPermissionsUpdatedEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "authorizingSigner";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "targetSigner";

readonly type: "address";

 },

 {

readonly components: readonly [

 { readonly name: "signer"; readonly type: "address" },

 { readonly name: "isAdmin"; readonly type: "uint8" },

 {

readonly name: "approvedTargets";

readonly type: "address[]";

 },

 {

readonly name: "nativeTokenLimitPerTransaction";

readonly type: "uint256";

 },

 {

readonly name: "permissionStartTimestamp";

readonly type: "uint128";

 },

 {

readonly name: "permissionEndTimestamp";

readonly type: "uint128";

 },

 {

readonly name: "reqValidityStartTimestamp";

readonly type: "uint128";

 },

 {

readonly name: "reqValidityEndTimestamp";

readonly type: "uint128";

 },

 { readonly name: "uid"; readonly type: "bytes32" },

 ];

readonly name: "permissions";

readonly type: "tuple";

 },

 ];

readonly name: "SignerPermissionsUpdated";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "authorizingSigner";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "targetSigner";

readonly type: "address";

 },

 {

readonly components: readonly [

 { readonly name: "signer"; readonly type: "address" },

 { readonly name: "isAdmin"; readonly type: "uint8" },

 {

readonly name: "approvedTargets";

readonly type: "address[]";

 },

 {

readonly name: "nativeTokenLimitPerTransaction";

readonly type: "uint256";

 },

 {

readonly name: "permissionStartTimestamp";

readonly type: "uint128";

 },

 {

readonly name: "permissionEndTimestamp";

readonly type: "uint128";

 },

 {

readonly name: "reqValidityStartTimestamp";

readonly type: "uint128";

 },

 {

readonly name: "reqValidityEndTimestamp";

readonly type: "uint128";

 },

 { readonly name: "uid"; readonly type: "bytes32" },

 ];

readonly name: "permissions";

readonly type: "tuple";

 },

 ];

readonly name: "SignerPermissionsUpdated";

readonly type: "event";

}>;

`

 The prepared event object.
## simulateHandleOp

 Prepares a transaction to call the "simulateHandleOp" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { simulateHandleOp } from "thirdweb/extensions/erc4337";

const transaction = simulateHandleOp({

 contract,

 op: ...,

 target: ...,

 targetCallData: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function simulateHandleOp(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SimulateHandleOpParams](https://portal.thirdweb.com/references/typescript/v5/SimulateHandleOpParams)

| { asyncParams: () => Promise<[SimulateHandleOpParams](https://portal.thirdweb.com/references/typescript/v5/SimulateHandleOpParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "simulateHandleOp" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SimulateHandleOpParams](https://portal.thirdweb.com/references/typescript/v5/SimulateHandleOpParams)

| { asyncParams: () => Promise<[SimulateHandleOpParams](https://portal.thirdweb.com/references/typescript/v5/SimulateHandleOpParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## totalAccounts

 Calls the "totalAccounts" function on the contract.

### Example

`import { totalAccounts } from "thirdweb/extensions/erc4337";

const result = await totalAccounts({

 contract,

});

`

##### Signature

`function totalAccounts(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the totalAccounts function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## convertToAssets

 Calls the "convertToAssets" function on the contract.

### Example

`import { convertToAssets } from "thirdweb/extensions/erc4626";

const result = await convertToAssets({

 contract,

 shares: ...,

});

`

##### Signature

`function convertToAssets(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ConvertToAssetsParams](https://portal.thirdweb.com/references/typescript/v5/ConvertToAssetsParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the convertToAssets function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ConvertToAssetsParams](https://portal.thirdweb.com/references/typescript/v5/ConvertToAssetsParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## asset

 Calls the "asset" function on the contract.

### Example

`import { asset } from "thirdweb/extensions/erc4626";

const result = await asset({

 contract,

});

`

##### Signature

`function asset(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)): Promise<string>;

`

### Parameters

##### options

 The options for the asset function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## userOperationEventEvent

 Creates an event object for the UserOperationEvent event.

### Example

`import { getContractEvents } from "thirdweb";

import { userOperationEventEvent } from "thirdweb/extensions/erc4337";

const events = await getContractEvents({

contract,

events: [

userOperationEventEvent({

 userOpHash: ...,

 sender: ...,

 paymaster: ...,

})

],

});

`

##### Signature

`function userOperationEventEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "userOpHash";

readonly type: "bytes32";

 },

 {

readonly indexed: true;

readonly name: "sender";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "paymaster";

readonly type: "address";

 },

 { readonly name: "nonce"; readonly type: "uint256" },

 { readonly name: "success"; readonly type: "bool" },

 { readonly name: "actualGasCost"; readonly type: "uint256" },

 { readonly name: "actualGasUsed"; readonly type: "uint256" },

 ];

readonly name: "UserOperationEvent";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "userOpHash";

readonly type: "bytes32";

 },

 {

readonly indexed: true;

readonly name: "sender";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "paymaster";

readonly type: "address";

 },

 { readonly name: "nonce"; readonly type: "uint256" },

 { readonly name: "success"; readonly type: "bool" },

 { readonly name: "actualGasCost"; readonly type: "uint256" },

 { readonly name: "actualGasUsed"; readonly type: "uint256" },

 ];

readonly name: "UserOperationEvent";

readonly type: "event";

}>;

`

 The prepared event object.
## userOperationRevertReasonEvent

 Creates an event object for the UserOperationRevertReason event.

### Example

`import { getContractEvents } from "thirdweb";

import { userOperationRevertReasonEvent } from "thirdweb/extensions/erc4337";

const events = await getContractEvents({

contract,

events: [

userOperationRevertReasonEvent({

 userOpHash: ...,

 sender: ...,

})

],

});

`

##### Signature

`function userOperationRevertReasonEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "userOpHash";

readonly type: "bytes32";

 },

 {

readonly indexed: true;

readonly name: "sender";

readonly type: "address";

 },

 { readonly name: "nonce"; readonly type: "uint256" },

 { readonly name: "revertReason"; readonly type: "bytes" },

 ];

readonly name: "UserOperationRevertReason";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "userOpHash";

readonly type: "bytes32";

 },

 {

readonly indexed: true;

readonly name: "sender";

readonly type: "address";

 },

 { readonly name: "nonce"; readonly type: "uint256" },

 { readonly name: "revertReason"; readonly type: "bytes" },

 ];

readonly name: "UserOperationRevertReason";

readonly type: "event";

}>;

`

 The prepared event object.
## depositEvent

 Creates an event object for the Deposit event.

### Example

`import { getContractEvents } from "thirdweb";

import { depositEvent } from "thirdweb/extensions/erc4626";

const events = await getContractEvents({

contract,

events: [

depositEvent({

 caller: ...,

 owner: ...,

})

],

});

`

##### Signature

`function depositEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "caller";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "owner";

readonly type: "address";

 },

 { readonly name: "assets"; readonly type: "uint256" },

 { readonly name: "shares"; readonly type: "uint256" },

 ];

readonly name: "Deposit";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "caller";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "owner";

readonly type: "address";

 },

 { readonly name: "assets"; readonly type: "uint256" },

 { readonly name: "shares"; readonly type: "uint256" },

 ];

readonly name: "Deposit";

readonly type: "event";

}>;

`

 The prepared event object.
## deposit

 Prepares a transaction to call the "deposit" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { deposit } from "thirdweb/extensions/erc4626";

const transaction = deposit({

 contract,

 assets: ...,

 receiver: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function deposit(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[DepositParams](https://portal.thirdweb.com/references/typescript/v5/DepositParams) | { asyncParams: () => Promise<[DepositParams](https://portal.thirdweb.com/references/typescript/v5/DepositParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "deposit" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[DepositParams](https://portal.thirdweb.com/references/typescript/v5/DepositParams) | { asyncParams: () => Promise<[DepositParams](https://portal.thirdweb.com/references/typescript/v5/DepositParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## convertToShares

 Calls the "convertToShares" function on the contract.

### Example

`import { convertToShares } from "thirdweb/extensions/erc4626";

const result = await convertToShares({

 contract,

 assets: ...,

});

`

##### Signature

`function convertToShares(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ConvertToSharesParams](https://portal.thirdweb.com/references/typescript/v5/ConvertToSharesParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the convertToShares function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ConvertToSharesParams](https://portal.thirdweb.com/references/typescript/v5/ConvertToSharesParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## maxMint

 Calls the "maxMint" function on the contract.

### Example

`import { maxMint } from "thirdweb/extensions/erc4626";

const result = await maxMint({

 contract,

 receiver: ...,

});

`

##### Signature

`function maxMint(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MaxMintParams](https://portal.thirdweb.com/references/typescript/v5/MaxMintParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the maxMint function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MaxMintParams](https://portal.thirdweb.com/references/typescript/v5/MaxMintParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## maxRedeem

 Calls the "maxRedeem" function on the contract.

### Example

`import { maxRedeem } from "thirdweb/extensions/erc4626";

const result = await maxRedeem({

 contract,

 owner: ...,

});

`

##### Signature

`function maxRedeem(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MaxRedeemParams](https://portal.thirdweb.com/references/typescript/v5/MaxRedeemParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the maxRedeem function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MaxRedeemParams](https://portal.thirdweb.com/references/typescript/v5/MaxRedeemParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## maxWithdraw

 Calls the "maxWithdraw" function on the contract.

### Example

`import { maxWithdraw } from "thirdweb/extensions/erc4626";

const result = await maxWithdraw({

 contract,

 owner: ...,

});

`

##### Signature

`function maxWithdraw(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MaxWithdrawParams](https://portal.thirdweb.com/references/typescript/v5/MaxWithdrawParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the maxWithdraw function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MaxWithdrawParams](https://portal.thirdweb.com/references/typescript/v5/MaxWithdrawParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## mint

 Prepares a transaction to call the "mint" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { mint } from "thirdweb/extensions/erc4626";

const transaction = mint({

 contract,

 shares: ...,

 receiver: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function mint(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[MintParams](https://portal.thirdweb.com/references/typescript/v5/MintParams) | { asyncParams: () => Promise<[MintParams](https://portal.thirdweb.com/references/typescript/v5/MintParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "mint" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[MintParams](https://portal.thirdweb.com/references/typescript/v5/MintParams) | { asyncParams: () => Promise<[MintParams](https://portal.thirdweb.com/references/typescript/v5/MintParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## previewMint

 Calls the "previewMint" function on the contract.

### Example

`import { previewMint } from "thirdweb/extensions/erc4626";

const result = await previewMint({

 contract,

 shares: ...,

});

`

##### Signature

`function previewMint(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[PreviewMintParams](https://portal.thirdweb.com/references/typescript/v5/PreviewMintParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the previewMint function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[PreviewMintParams](https://portal.thirdweb.com/references/typescript/v5/PreviewMintParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## previewRedeem

 Calls the "previewRedeem" function on the contract.

### Example

`import { previewRedeem } from "thirdweb/extensions/erc4626";

const result = await previewRedeem({

 contract,

 shares: ...,

});

`

##### Signature

`function previewRedeem(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[PreviewRedeemParams](https://portal.thirdweb.com/references/typescript/v5/PreviewRedeemParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the previewRedeem function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[PreviewRedeemParams](https://portal.thirdweb.com/references/typescript/v5/PreviewRedeemParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## previewDeposit

 Calls the "previewDeposit" function on the contract.

### Example

`import { previewDeposit } from "thirdweb/extensions/erc4626";

const result = await previewDeposit({

 contract,

 assets: ...,

});

`

##### Signature

`function previewDeposit(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[PreviewDepositParams](https://portal.thirdweb.com/references/typescript/v5/PreviewDepositParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the previewDeposit function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[PreviewDepositParams](https://portal.thirdweb.com/references/typescript/v5/PreviewDepositParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## previewWithdraw

 Calls the "previewWithdraw" function on the contract.

### Example

`import { previewWithdraw } from "thirdweb/extensions/erc4626";

const result = await previewWithdraw({

 contract,

 assets: ...,

});

`

##### Signature

`function previewWithdraw(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[PreviewWithdrawParams](https://portal.thirdweb.com/references/typescript/v5/PreviewWithdrawParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the previewWithdraw function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[PreviewWithdrawParams](https://portal.thirdweb.com/references/typescript/v5/PreviewWithdrawParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## redeem

 Prepares a transaction to call the "redeem" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { redeem } from "thirdweb/extensions/erc4626";

const transaction = redeem({

 contract,

 shares: ...,

 receiver: ...,

 owner: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function redeem(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[RedeemParams](https://portal.thirdweb.com/references/typescript/v5/RedeemParams) | { asyncParams: () => Promise<[RedeemParams](https://portal.thirdweb.com/references/typescript/v5/RedeemParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "redeem" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[RedeemParams](https://portal.thirdweb.com/references/typescript/v5/RedeemParams) | { asyncParams: () => Promise<[RedeemParams](https://portal.thirdweb.com/references/typescript/v5/RedeemParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## withdraw

 Prepares a transaction to call the "withdraw" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { withdraw } from "thirdweb/extensions/erc4626";

const transaction = withdraw({

 contract,

 assets: ...,

 receiver: ...,

 owner: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function withdraw(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[WithdrawParams](https://portal.thirdweb.com/references/typescript/v5/WithdrawParams) | { asyncParams: () => Promise<[WithdrawParams](https://portal.thirdweb.com/references/typescript/v5/WithdrawParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "withdraw" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[WithdrawParams](https://portal.thirdweb.com/references/typescript/v5/WithdrawParams) | { asyncParams: () => Promise<[WithdrawParams](https://portal.thirdweb.com/references/typescript/v5/WithdrawParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## withdrawEvent

 Creates an event object for the Withdraw event.

### Example

`import { getContractEvents } from "thirdweb";

import { withdrawEvent } from "thirdweb/extensions/erc4626";

const events = await getContractEvents({

contract,

events: [

withdrawEvent({

 caller: ...,

 receiver: ...,

 owner: ...,

})

],

});

`

##### Signature

`function withdrawEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "caller";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "receiver";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "owner";

readonly type: "address";

 },

 { readonly name: "assets"; readonly type: "uint256" },

 { readonly name: "shares"; readonly type: "uint256" },

 ];

readonly name: "Withdraw";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "caller";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "receiver";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "owner";

readonly type: "address";

 },

 { readonly name: "assets"; readonly type: "uint256" },

 { readonly name: "shares"; readonly type: "uint256" },

 ];

readonly name: "Withdraw";

readonly type: "event";

}>;

`

 The prepared event object.
## approvalEvent

 Creates an event object for the Approval event.

### Example

`import { getContractEvents } from "thirdweb";

import { approvalEvent } from "thirdweb/extensions/erc721";

const events = await getContractEvents({

contract,

events: [

approvalEvent({

 owner: ...,

 approved: ...,

 tokenId: ...,

})

],

});

`

##### Signature

`function approvalEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "owner";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "approved";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "tokenId";

readonly type: "uint256";

 },

 ];

readonly name: "Approval";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "owner";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "approved";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "tokenId";

readonly type: "uint256";

 },

 ];

readonly name: "Approval";

readonly type: "event";

}>;

`

 The prepared event object.
## totalAssets

 Calls the "totalAssets" function on the contract.

### Example

`import { totalAssets } from "thirdweb/extensions/erc4626";

const result = await totalAssets({

 contract,

});

`

##### Signature

`function totalAssets(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the totalAssets function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## maxDeposit

 Calls the "maxDeposit" function on the contract.

### Example

`import { maxDeposit } from "thirdweb/extensions/erc4626";

const result = await maxDeposit({

 contract,

 receiver: ...,

});

`

##### Signature

`function maxDeposit(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MaxDepositParams](https://portal.thirdweb.com/references/typescript/v5/MaxDepositParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the maxDeposit function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MaxDepositParams](https://portal.thirdweb.com/references/typescript/v5/MaxDepositParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## approve

 Prepares a transaction to call the "approve" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { approve } from "thirdweb/extensions/erc721";

const transaction = approve({

 contract,

 to: ...,

 tokenId: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function approve(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[ApproveParams](https://portal.thirdweb.com/references/typescript/v5/ApproveParams) | { asyncParams: () => Promise<[ApproveParams](https://portal.thirdweb.com/references/typescript/v5/ApproveParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "approve" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[ApproveParams](https://portal.thirdweb.com/references/typescript/v5/ApproveParams) | { asyncParams: () => Promise<[ApproveParams](https://portal.thirdweb.com/references/typescript/v5/ApproveParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## balanceOf

 Calls the "balanceOf" function on the contract.

### Example

`import { balanceOf } from "thirdweb/extensions/erc721";

const result = await balanceOf({

 contract,

 owner: ...,

});

`

##### Signature

`function balanceOf(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[BalanceOfParams](https://portal.thirdweb.com/references/typescript/v5/BalanceOfParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the balanceOf function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[BalanceOfParams](https://portal.thirdweb.com/references/typescript/v5/BalanceOfParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## approvalForAllEvent

 Creates an event object for the ApprovalForAll event.

### Example

`import { getContractEvents } from "thirdweb";

import { approvalForAllEvent } from "thirdweb/extensions/erc721";

const events = await getContractEvents({

contract,

events: [

approvalForAllEvent({

 owner: ...,

 operator: ...,

})

],

});

`

##### Signature

`function approvalForAllEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "owner";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "operator";

readonly type: "address";

 },

 { readonly name: "approved"; readonly type: "bool" },

 ];

readonly name: "ApprovalForAll";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "owner";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "operator";

readonly type: "address";

 },

 { readonly name: "approved"; readonly type: "bool" },

 ];

readonly name: "ApprovalForAll";

readonly type: "event";

}>;

`

 The prepared event object.
## canClaim

 Check if a user can claim a drop.

### Example

`const claimResult = await canClaim({

 contract: contract,

 claimer: "0x1234567890123456789012345678901234567890",

 quantity: "1",

});

`

##### Signature

`function canClaim(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[CanClaimParams](https://portal.thirdweb.com/references/typescript/v5/CanClaimParams)>,

): Promise<[CanClaimResult](https://portal.thirdweb.com/references/typescript/v5/CanClaimResult)>;

`

### Parameters

##### options

 The options for the transaction.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[CanClaimParams](https://portal.thirdweb.com/references/typescript/v5/CanClaimParams)>;

`

### Returns

##### Return Type

`let returnType: { reason?: string; result: boolean };

`

 Whether the user can claim the drop.
## claimConditionsUpdatedEvent

 Creates an event object for the ClaimConditionsUpdated event.

### Example

`import { getContractEvents } from "thirdweb";

import { claimConditionsUpdatedEvent } from "thirdweb/extensions/erc721";

const events = await getContractEvents({

 contract,

 events: [claimConditionsUpdatedEvent()],

});

`

##### Signature

`function claimConditionsUpdatedEvent(): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly components: readonly [

 { readonly name: "startTimestamp"; readonly type: "uint256" },

 {

readonly name: "maxClaimableSupply";

readonly type: "uint256";

 },

 { readonly name: "supplyClaimed"; readonly type: "uint256" },

 {

readonly name: "quantityLimitPerWallet";

readonly type: "uint256";

 },

 { readonly name: "merkleRoot"; readonly type: "bytes32" },

 { readonly name: "pricePerToken"; readonly type: "uint256" },

 { readonly name: "currency"; readonly type: "address" },

 { readonly name: "metadata"; readonly type: "string" },

 ];

readonly name: "claimConditions";

readonly type: "tuple[]";

 },

 { readonly name: "resetEligibility"; readonly type: "bool" },

 ];

readonly name: "ClaimConditionsUpdated";

readonly type: "event";

}>;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly components: readonly [

 { readonly name: "startTimestamp"; readonly type: "uint256" },

 {

readonly name: "maxClaimableSupply";

readonly type: "uint256";

 },

 { readonly name: "supplyClaimed"; readonly type: "uint256" },

 {

readonly name: "quantityLimitPerWallet";

readonly type: "uint256";

 },

 { readonly name: "merkleRoot"; readonly type: "bytes32" },

 { readonly name: "pricePerToken"; readonly type: "uint256" },

 { readonly name: "currency"; readonly type: "address" },

 { readonly name: "metadata"; readonly type: "string" },

 ];

readonly name: "claimConditions";

readonly type: "tuple[]";

 },

 { readonly name: "resetEligibility"; readonly type: "bool" },

 ];

readonly name: "ClaimConditionsUpdated";

readonly type: "event";

}>;

`

 The prepared event object.
## burn

 Prepares a transaction to call the "burn" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { burn } from "thirdweb/extensions/erc721";

const transaction = burn({

 contract,

 tokenId: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function burn(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[BurnParams](https://portal.thirdweb.com/references/typescript/v5/BurnParams) | { asyncParams: () => Promise<[BurnParams](https://portal.thirdweb.com/references/typescript/v5/BurnParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "burn" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[BurnParams](https://portal.thirdweb.com/references/typescript/v5/BurnParams) | { asyncParams: () => Promise<[BurnParams](https://portal.thirdweb.com/references/typescript/v5/BurnParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## claimTo

 Claim ERC721 NFTs to a specified address

### Example

####  Basic usage

`import { claimTo } from "thirdweb/extensions/erc721";

import { sendTransaction } from "thirdweb";

const transaction = claimTo({

 contract,

 to: "0x...",

 quantity: 1n,

});

await sendTransaction({ transaction, account });

`

####  For Drops with allowlists

 You need to specify the claimer address as the `from` param to avoid any issue with the allowlist

`const transaction = claimTo({

 contract,

 to: "0x...",

 quantity: 1n,

 from: "0x...", // address of the one claiming

});

`

##### Signature

`function claimTo(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ClaimToParams](https://portal.thirdweb.com/references/typescript/v5/ClaimToParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the transaction

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ClaimToParams](https://portal.thirdweb.com/references/typescript/v5/ClaimToParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A promise that resolves with the submitted transaction hash.
## claimToBatch

 This extension batches multiple `claimTo` extensions into one single multicall. Keep in mind that there is a limit of how many NFTs you can claim per transaction. This limit varies depends on the network that you are transacting on.

 You are recommended to experiment with the number to figure out the best number for your chain of choice.

### Example

`import { claimToBatch } from "thirdweb/extensions/erc721";

const transaction = claimToBatch({

 contract: nftDropContract,

 from: claimer.address, // address of the one calling this transaction

 content: [

 { to: "0x...1", quantity: 1n },

 { to: "0x...2", quantity: 12n },

 { to: "0x...3", quantity: 2n },

 ],

});

`

##### Signature

`function claimToBatch(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ClaimToBatchParams](https://portal.thirdweb.com/references/typescript/v5/ClaimToBatchParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 the transaction options

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ClaimToBatchParams](https://portal.thirdweb.com/references/typescript/v5/ClaimToBatchParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A promise that resolves to the transaction result.
## createDelayedRevealBatch

 Creates a batch of encrypted NFTs that can be revealed at a later time.

### Example

`import { createDelayedRevealBatch } from "thirdweb/extensions/erc721";

const placeholderNFT = {

 name: "Hidden NFT",

 description: "Will be revealed next week!"

};

const realNFTs = [{

 name: "Common NFT #1",

 description: "Common NFT, one of many.",

 image: ipfs://...,

}, {

 name: "Super Rare NFT #2",

 description: "You got a Super Rare NFT!",

 image: ipfs://...,

}];

const transaction = createDelayedRevealBatch({

 contract,

 placeholderMetadata: placeholderNFT,

 metadata: realNFTs,

 password: "password123",

});

const { transactionHash } = await sendTransaction({ transaction, account });

`

##### Signature

`function createDelayedRevealBatch(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[CreateDelayedRevealBatchParams](https://portal.thirdweb.com/references/typescript/v5/CreateDelayedRevealBatchParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 {CreateDelayedRevealBatchParams} - The delayed reveal options.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[CreateDelayedRevealBatchParams](https://portal.thirdweb.com/references/typescript/v5/CreateDelayedRevealBatchParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 The prepared transaction to send.
## generateMintSignature

 Generates the payload and signature for minting an ERC721 token.

### Example

`import {

 mintWithSignature,

 generateMintSignature,

} from "thirdweb/extensions/erc721";

const { payload, signature } = await generateMintSignature({

 account,

 contract,

 mintRequest: {

 to: "0x...",

 metadata: {

 name: "My NFT",

 description: "This is my NFT",

 image: "https://example.com/image.png",

 },

 },

});

const transaction = mintWithSignature({

 contract,

 payload,

 signature,

});

await sendTransaction({ transaction, account });

`

##### Signature

`function generateMintSignature(

options: [GenerateMintSignatureOptions](https://portal.thirdweb.com/references/typescript/v5/GenerateMintSignatureOptions)<T>,

): Promise<SignPayloadResult<T>>;

`

### Parameters

##### options

 The options for the minting process.

#### Type

`let options: [GenerateMintSignatureOptions](https://portal.thirdweb.com/references/typescript/v5/GenerateMintSignatureOptions)<T>;

`

### Returns

##### Return Type

`let returnType: Promise<SignPayloadResult<T>>;

`

 A promise that resolves to the payload and signature.
## getActiveClaimCondition

 Retrieves the active claim condition.

### Example

`import { getActiveClaimCondition } from "thirdweb/extensions/erc721";

const activeClaimCondition = await getActiveClaimCondition({

 contract,

});

`

##### Signature

`function getActiveClaimCondition(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<ClaimCondition>;

`

### Parameters

##### options

 The transaction options.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<ClaimCondition>;

`

 A promise that resolves to the active claim condition.
## getActiveClaimConditionId

 Calls the "getActiveClaimConditionId" function on the contract.

### Example

`import { getActiveClaimConditionId } from "thirdweb/extensions/erc721";

const result = await getActiveClaimConditionId({

 contract,

});

`

##### Signature

`function getActiveClaimConditionId(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the getActiveClaimConditionId function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## getBatchesToReveal

 Retrieves the batches available to reveal in an NFT contract.

### Example

`import { getBatchesToReveal } from "thirdweb/extensions/erc721";

const batches = await getBatchesToReveal({ contract: contract });

const { transactionHash } = await sendTransaction({

 transaction,

 account,

});

`

##### Signature

`function getBatchesToReveal(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<Array<[BatchToReveal](https://portal.thirdweb.com/references/typescript/v5/BatchToReveal)>>;

`

### Parameters

##### options

 {BaseTransactionOptions} - The transaction options.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: {

batchId: bigint;

batchUri: string;

placeholderMetadata: undefined | NFTMetadata;

};

`

 A promise resolving to an array of unrevealed batches.

 Use the `batchId` and corresponding password for each batch to reveal it with `reveal` . reveal
## getAllOwners

 Retrieves the owners of all ERC721 tokens within a specified range.

### Example

`import { getAllOwners } from "thirdweb/extensions/erc721";

const owners = await getAllOwners({

 contract,

 start: 0,

 count: 10,

});

`

##### Signature

`function getAllOwners(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetAllOwnersParams](https://portal.thirdweb.com/references/typescript/v5/GetAllOwnersParams)>,

): Promise<Array<{ owner: string; tokenId: bigint }>>;

`

### Parameters

##### options

 The options for retrieving the owners.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetAllOwnersParams](https://portal.thirdweb.com/references/typescript/v5/GetAllOwnersParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<Array<{ owner: string; tokenId: bigint }>>;

`

 A promise that resolves to an array of objects containing the token ID and owner address.
## getClaimConditionById

 Calls the "getClaimConditionById" function on the contract.

### Example

`import { getClaimConditionById } from "thirdweb/extensions/erc721";

const result = await getClaimConditionById({

 contract,

 conditionId: ...,

});

`

##### Signature

`` function getClaimConditionById(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetClaimConditionByIdParams](https://portal.thirdweb.com/references/typescript/v5/GetClaimConditionByIdParams)>,

): Promise<{

currency: string;

maxClaimableSupply: bigint;

merkleRoot: `0x${string}`;

metadata: string;

pricePerToken: bigint;

quantityLimitPerWallet: bigint;

startTimestamp: bigint;

supplyClaimed: bigint;

}>;

 ``

### Parameters

##### options

 The options for the getClaimConditionById function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetClaimConditionByIdParams](https://portal.thirdweb.com/references/typescript/v5/GetClaimConditionByIdParams)>;

`

### Returns

##### Return Type

`` let returnType: Promise<{

currency: string;

maxClaimableSupply: bigint;

merkleRoot: `0x${string}`;

metadata: string;

pricePerToken: bigint;

quantityLimitPerWallet: bigint;

startTimestamp: bigint;

supplyClaimed: bigint;

}>;

 ``

 The parsed result of the function call.
## getNFT

 Retrieves information about a specific ERC721 non-fungible token (NFT).

### Example

`import { getNFT } from "thirdweb/extensions/erc721";

const nft = await getNFT({

 contract,

 tokenId: 1n,

});

`

##### Signature

`function getNFT(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<{

includeOwner?: boolean;

tokenByIndex?: boolean;

tokenId: bigint;

 }>,

): Promise<[NFT](https://portal.thirdweb.com/references/typescript/v5/NFT)>;

`

### Parameters

##### options

 The options for retrieving the NFT.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<{

includeOwner?: boolean;

tokenByIndex?: boolean;

tokenId: bigint;

}>;

`

### Returns

##### Return Type

`let returnType:

| {

id: bigint;

metadata: [NFTMetadata](https://portal.thirdweb.com/references/typescript/v5/NFTMetadata);

owner: string | null;

tokenURI: string;

type: "ERC721";

 }

| {

id: bigint;

metadata: [NFTMetadata](https://portal.thirdweb.com/references/typescript/v5/NFTMetadata);

owner: string | null;

supply: bigint;

tokenURI: string;

type: "ERC1155";

 };

`

 A promise that resolves to the NFT object.
## getClaimConditions

 Retrieves all claim conditions.

### Example

`import { getClaimConditions } from "thirdweb/extensions/erc721";

const conditions = await getClaimConditions({ contract });

`

##### Signature

`function getClaimConditions(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<Array<ClaimCondition>>;

`

### Parameters

##### options

 The transaction options.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<Array<ClaimCondition>>;

`

 A promise that resolves to all claim conditions.
## getNFTs

 Retrieves an array of NFTs ("ERC721") based on the provided options.

### Example

`import { getNFTs } from "thirdweb/extensions/erc721";

const nfts = await getNFTs({

 contract,

 start: 0,

 count: 10,

});

`

##### Signature

`function getNFTs(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetNFTsParams](https://portal.thirdweb.com/references/typescript/v5/GetNFTsParams)>,

): Promise<Array<[NFT](https://portal.thirdweb.com/references/typescript/v5/NFT)>>;

`

### Parameters

##### options

 The options for retrieving the NFTs.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetNFTsParams](https://portal.thirdweb.com/references/typescript/v5/GetNFTsParams)>;

`

### Returns

##### Return Type

`let returnType:

| {

id: bigint;

metadata: [NFTMetadata](https://portal.thirdweb.com/references/typescript/v5/NFTMetadata);

owner: string | null;

tokenURI: string;

type: "ERC721";

 }

| {

id: bigint;

metadata: [NFTMetadata](https://portal.thirdweb.com/references/typescript/v5/NFTMetadata);

owner: string | null;

supply: bigint;

tokenURI: string;

type: "ERC1155";

 };

`

 A promise that resolves to an array of NFTs.
## getOwnedNFTs

 Retrieves the owned NFTs for a given owner. This extension only works with ERC721 contracts that support the [tokenOfOwnerByIndex](https://portal.thirdweb.com/references/typescript/v5/erc721/tokenOfOwnerByIndex) method

### Example

`import { getOwnedNFTs } from "thirdweb/extensions/erc721";

const ownedNFTs = await getOwnedNFTs({

 contract,

 owner: "0x1234...",

});

`

##### Signature

`function getOwnedNFTs(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[BalanceOfParams](https://portal.thirdweb.com/references/typescript/v5/BalanceOfParams)>,

): Promise<Array<[NFT](https://portal.thirdweb.com/references/typescript/v5/NFT)>>;

`

### Parameters

##### options

 The options for retrieving the owned NFTs.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[BalanceOfParams](https://portal.thirdweb.com/references/typescript/v5/BalanceOfParams)>;

`

### Returns

##### Return Type

`let returnType:

| {

id: bigint;

metadata: [NFTMetadata](https://portal.thirdweb.com/references/typescript/v5/NFTMetadata);

owner: string | null;

tokenURI: string;

type: "ERC721";

 }

| {

id: bigint;

metadata: [NFTMetadata](https://portal.thirdweb.com/references/typescript/v5/NFTMetadata);

owner: string | null;

supply: bigint;

tokenURI: string;

type: "ERC1155";

 };

`

 A promise that resolves to an array of NFTs owned by the specified owner.
## getOwnedTokenIds

 Retrieves the token IDs owned by a specific address.

### Example

`import { getOwnedTokenIds } from "thirdweb/extensions/erc721";

const ownedTokenIds = await getOwnedTokenIds({

 contract,

 owner: "0x1234...",

});

`

##### Signature

`function getOwnedTokenIds(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[BalanceOfParams](https://portal.thirdweb.com/references/typescript/v5/BalanceOfParams)>,

): Promise<Array<bigint>>;

`

### Parameters

##### options

 The options for retrieving the owned token IDs.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[BalanceOfParams](https://portal.thirdweb.com/references/typescript/v5/BalanceOfParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<Array<bigint>>;

`

 A promise that resolves to an array of bigint representing the owned token IDs.
## getTotalUnclaimedSupply

 Retrieves the total unclaimed supply of ERC721 tokens.

### Example

`import { getTotalUnclaimedSupply } from "thirdweb/extensions/erc721";

const totalUnclaimedSupply = await getTotalUnclaimedSupply({

 contract,

});

`

##### Signature

`function getTotalUnclaimedSupply(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The base transaction options.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 A promise that resolves to the total unclaimed supply as a bigint.
## getTotalClaimedSupply

 Retrieves the total claimed supply of ERC721 tokens.

### Example

`import { getTotalClaimedSupply } from "thirdweb/extensions/erc721";

const totalClaimedSupply = await getTotalClaimedSupply({

 contract,

});

`

##### Signature

`function getTotalClaimedSupply(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The base transaction options.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 A promise that resolves to the total claimed supply as a bigint.
## isApprovedForAll

 Calls the "isApprovedForAll" function on the contract.

### Example

`import { isApprovedForAll } from "thirdweb/extensions/erc721";

const result = await isApprovedForAll({

 contract,

 owner: ...,

 operator: ...,

});

`

##### Signature

`function isApprovedForAll(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsApprovedForAllParams](https://portal.thirdweb.com/references/typescript/v5/IsApprovedForAllParams)>,

): Promise<boolean>;

`

### Parameters

##### options

 The options for the isApprovedForAll function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsApprovedForAllParams](https://portal.thirdweb.com/references/typescript/v5/IsApprovedForAllParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 The parsed result of the function call.
## isBurnSupported

 Checks if the `burn` method is supported by the given contract.

### Example

`import { isBurnSupported } from "thirdweb/extensions/erc721";

const supported = isBurnSupported(["0x..."]);

`

##### Signature

`function isBurnSupported(availableSelectors: Array<string>): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `burn` method is supported.
## isClaimToSupported

 Checks if the `claimTo` method is supported by the given contract.

### Example

`import { isClaimToSupported } from "thirdweb/extensions/erc721";

const supported = isClaimToSupported(["0x..."]);

`

##### Signature

`function isClaimToSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `claimTo` method is supported.
## isCreateDelayedRevealBatchSupported

 Checks if the `createDelayedRevealBatch` method is supported by the given contract.

### Example

`import { isCreateDelayedRevealBatchSupported } from "thirdweb/extensions/erc721";

const supported = isCreateDelayedRevealBatchSupported(["0x..."]);

`

##### Signature

`function isCreateDelayedRevealBatchSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `createDelayedRevealBatch` method is supported.
## isERC721

 Check if a contract supports the ERC721 interface.

### Example

`import { isERC721 } from "thirdweb/extensions/erc721";

const result = await isERC721({ contract });

`

##### Signature

`function isERC721(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)): Promise<boolean>;

`

### Parameters

##### options

 The transaction options.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 A boolean indicating whether the contract supports the ERC721 interface.
## isGetActiveClaimConditionIdSupported

 Checks if the `getActiveClaimConditionId` method is supported by the given contract.

### Example

`import { isGetActiveClaimConditionIdSupported } from "thirdweb/extensions/erc721";

const supported = isGetActiveClaimConditionIdSupported(["0x..."]);

`

##### Signature

`function isGetActiveClaimConditionIdSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getActiveClaimConditionId` method is supported.
## isGetBatchesToRevealSupported

 Checks if the `getBatchesToReveal` method is supported by the given contract.

### Example

`import { isGetBatchesToRevealSupported } from "thirdweb/extensions/erc721";

const supported = isGetBatchesToRevealSupported(["0x..."]);

`

##### Signature

`function isGetBatchesToRevealSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getBatchesToReveal` method is supported.
## isGetActiveClaimConditionSupported

 Checks if the `getActiveClaimCondition` method is supported by the given contract.

### Example

`import { isGetActiveClaimConditionSupported } from "thirdweb/extensions/erc721";

const supported = isGetActiveClaimConditionSupported(["0x..."]);

`

##### Signature

`function isGetActiveClaimConditionSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getActiveClaimCondition` method is supported.
## isGetClaimConditionByIdSupported

 Checks if the `getClaimConditionById` method is supported by the given contract.

### Example

`import { isGetClaimConditionByIdSupported } from "thirdweb/extensions/erc721";

const supported = isGetClaimConditionByIdSupported(["0x..."]);

`

##### Signature

`function isGetClaimConditionByIdSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getClaimConditionById` method is supported.
## isGetClaimConditionsSupported

 Checks if the `getClaimConditions` method is supported by the given contract.

### Example

`import { isGetClaimConditionsSupported } from "thirdweb/extensions/erc721";

const supported = isGetClaimConditionsSupported(["0x..."]);

`

##### Signature

`function isGetClaimConditionsSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getClaimConditions` method is supported.
## isGetNFTSupported

 Checks if the `tokenURI` method is supported by the given contract.

### Example

`import { isTokenURISupported } from "thirdweb/extensions/erc721";

const supported = isTokenURISupported(["0x..."]);

`

##### Signature

`function isGetNFTSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `tokenURI` method is supported.
## isGetClaimConditionsSupported

 Checks if the `getClaimConditions` method is supported by the given contract.

### Example

`import { isGetClaimConditionsSupported } from "thirdweb/extensions/erc721";

const supported = isGetClaimConditionsSupported(["0x..."]);

`

##### Signature

`function isGetClaimConditionsSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getClaimConditions` method is supported.
## isLazyMintSupported

 Checks if the `lazyMint` method is supported by the given contract.

### Example

`import { isLazyMintSupported } from "thirdweb/extensions/erc721";

const supported = isLazyMintSupported(["0x..."]);

`

##### Signature

`function isLazyMintSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `lazyMint` method is supported.
## isGetNFTsSupported

 Checks if the `getNFTs` method is supported by the given contract.

### Example

`import { isGetNFTsSupported } from "thirdweb/extensions/erc721";

const supported = isGetNFTsSupported(["0x..."]);

`

##### Signature

`function isGetNFTsSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getNFTs` method is supported.
## isMintToSupported

 Checks if the `mintTo` method is supported by the given contract.

### Example

`import { isMintToSupported } from "thirdweb/extensions/erc721";

const supported = isMintToSupported(["0x..."]);

`

##### Signature

`function isMintToSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `mintTo` method is supported.
## isNextTokenIdToMintSupported

 Checks if the `nextTokenIdToMint` method is supported by the given contract.

### Example

`import { isNextTokenIdToMintSupported } from "thirdweb/extensions/erc721";

const supported = isNextTokenIdToMintSupported(["0x..."]);

`

##### Signature

`function isNextTokenIdToMintSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `nextTokenIdToMint` method is supported.
## isResetClaimEligibilitySupported

 Checks if the `resetClaimEligibility` method is supported by the given contract.

### Example

`import { isResetClaimEligibilitySupported } from "thirdweb/extensions/erc721";

const supported = isResetClaimEligibilitySupported(["0x..."]);

`

##### Signature

`function isResetClaimEligibilitySupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `resetClaimEligibility` method is supported.
## isTokenByIndexSupported

 Checks if the `tokenByIndex` method is supported by the given contract.

### Example

`import { isTokenByIndexSupported } from "thirdweb/extensions/erc721";

const supported = isTokenByIndexSupported(["0x..."]);

`

##### Signature

`function isTokenByIndexSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `tokenByIndex` method is supported.
## isSetClaimConditionsSupported

 Checks if the `setClaimConditions` method is supported by the given contract.

### Example

`import { isSetClaimConditionsSupported } from "thirdweb/extensions/erc721";

const supported = isSetClaimConditionsSupported(["0x..."]);

`

##### Signature

`function isSetClaimConditionsSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `setClaimConditions` method is supported.
## isSetSharedMetadataSupported

 Checks if the `setSharedMetadata` method is supported by the given contract.

### Example

`import { isSetSharedMetadataSupported } from "thirdweb/extensions/erc721";

const supported = isSetSharedMetadataSupported(["0x..."]);

`

##### Signature

`function isSetSharedMetadataSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `setSharedMetadata` method is supported.
## isSharedMetadataSupported

 Checks if the `sharedMetadata` method is supported by the given contract.

### Example

`import { isSharedMetadataSupported } from "thirdweb/extensions/erc721";

const supported = isSharedMetadataSupported(["0x..."]);

`

##### Signature

`function isSharedMetadataSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `sharedMetadata` method is supported.
## isTotalSupplySupported

 Checks if the `totalSupply` method is supported by the given contract.

### Example

`import { isTotalSupplySupported } from "thirdweb/extensions/erc721";

const supported = isTotalSupplySupported(["0x..."]);

`

##### Signature

`function isTotalSupplySupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `totalSupply` method is supported.
## isUpdateMetadataSupported

 Checks if the `updateMetadata` method is supported by the given contract.

### Example

`import { isUpdateMetadataSupported } from "thirdweb/extensions/erc721";

const supported = isUpdateMetadataSupported(["0x..."]);

`

##### Signature

`function isUpdateMetadataSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `updateMetadata` method is supported.
## isUpdateMetadataSupported

 Checks if the `updateMetadata` method is supported by the given contract.

### Example

`import { isUpdateMetadataSupported } from "thirdweb/extensions/erc721";

const supported = isUpdateMetadataSupported(["0x..."]);

`

##### Signature

`function isUpdateMetadataSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `updateMetadata` method is supported.
## isUpdateTokenURISupported

 Checks if the `setTokenURI` method is supported by the given contract.

### Example

`import { isSetTokenURISupported } from "thirdweb/extensions/erc721";

const supported = isSetTokenURISupported(["0x..."]);

`

##### Signature

`function isUpdateTokenURISupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `setTokenURI` method is supported.
## mintTo

 Mints a new ERC721 token and assigns it to the specified address. If the `nft` parameter is a string, it will be used as the token URI. If the `nft` parameter is a file, it will be uploaded to the storage server and the resulting URI will be used as the token URI.

### Example

`import { mintTo } from "thirdweb/extensions/erc721";

import { sendTransaction } from "thirdweb";

const transaction = mintTo({

 contract,

 to: "0x...",

 nft: {

 name: "My NFT",

 description: "This is my NFT",

 image: "https://example.com/image.png",

 },

});

await sendTransaction({ transaction, account });

`

##### Signature

`function mintTo(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MintToParams](https://portal.thirdweb.com/references/typescript/v5/MintToParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The transaction options.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MintToParams](https://portal.thirdweb.com/references/typescript/v5/MintToParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A promise that resolves to the transaction result.
## lazyMint

 Lazily mints ERC721 tokens.

### Example

`import { lazyMint } from "thirdweb/extensions/erc721";

import { sendTransaction } from "thirdweb";

const transaction = lazyMint({

 contract,

 nfts: [

 {

 name: "My NFT",

 description: "This is my NFT",

 image: "https://example.com/image.png",

 },

 ],

});

await sendTransaction({ transaction, account });

`

##### Signature

`function lazyMint(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[LazyMintParams](https://portal.thirdweb.com/references/typescript/v5/LazyMintParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the lazy minting process.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[LazyMintParams](https://portal.thirdweb.com/references/typescript/v5/LazyMintParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A promise that resolves to the prepared contract call.
## mintWithSignature

 Mints a new ERC721 token with the given minter signature

### Example

`import { mintWithSignature, generateMintSignature } from "thirdweb/extensions/erc721";

import { sendTransaction } from "thirdweb";

const { payload, signature } = await generateMintSignature(...)

const transaction = mintWithSignature({

 contract,

 payload,

 signature,

});

await sendTransaction({ transaction, account });

`

##### Signature

`` function mintWithSignature(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| {

payload: {

currency: string;

pricePerToken: bigint;

primarySaleRecipient: string;

quantity: bigint;

royaltyBps: bigint;

royaltyRecipient: string;

to: string;

uid: `0x${string}`;

uri: string;

validityEndTimestamp: bigint;

validityStartTimestamp: bigint;

 };

signature: `0x${string}`;

 }

| {

payload: {

currency: string;

price: bigint;

primarySaleRecipient: string;

royaltyBps: bigint;

royaltyRecipient: string;

to: string;

uid: `0x${string}`;

uri: string;

validityEndTimestamp: bigint;

validityStartTimestamp: bigint;

 };

signature: `0x${string}`;

 }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

 ``

### Parameters

##### options

 The transaction options.

#### Type

`` let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| {

payload: {

currency: string;

pricePerToken: bigint;

primarySaleRecipient: string;

quantity: bigint;

royaltyBps: bigint;

royaltyRecipient: string;

to: string;

uid: `0x${string}`;

uri: string;

validityEndTimestamp: bigint;

validityStartTimestamp: bigint;

 };

signature: `0x${string}`;

 }

| {

payload: {

currency: string;

price: bigint;

primarySaleRecipient: string;

royaltyBps: bigint;

royaltyRecipient: string;

to: string;

uid: `0x${string}`;

uri: string;

validityEndTimestamp: bigint;

validityStartTimestamp: bigint;

 };

signature: `0x${string}`;

 }

>;

 ``

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A promise that resolves to the transaction result.
## nextTokenIdToMint

 Calls the "nextTokenIdToMint" function on the contract.

### Example

`import { nextTokenIdToMint } from "thirdweb/extensions/erc721";

const result = await nextTokenIdToMint({

 contract,

});

`

##### Signature

`function nextTokenIdToMint(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the nextTokenIdToMint function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## resetClaimEligibility

 Reset the claim eligibility for all users.

### Example

`import { resetClaimEligibility } from "thirdweb/extensions/erc721";

import { sendTransaction } from "thirdweb";

const transaction = resetClaimEligibility({

 contract,

});

await sendTransaction({ transaction, account });

`

##### Signature

`function resetClaimEligibility(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 the prepared transaction
## reveal

 Reveals a previously lazy minted batch of NFTs.

### Example

`import { reveal } from "thirdweb/extensions/erc721";

const transaction = await reveal({

 contract: contract,

 batchId: 0,

 password: "password",

});

const { transactionHash } = await sendTransaction({

 transaction,

 account,

});

`

##### Signature

`function reveal(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[RevealParams](https://portal.thirdweb.com/references/typescript/v5/RevealParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 {RevealParams} - The reveal parameters.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[RevealParams](https://portal.thirdweb.com/references/typescript/v5/RevealParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 The prepared transaction to send.
## ownerOf

 Calls the "ownerOf" function on the contract.

### Example

`import { ownerOf } from "thirdweb/extensions/erc721";

const result = await ownerOf({

 contract,

 tokenId: ...,

});

`

##### Signature

`function ownerOf(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[OwnerOfParams](https://portal.thirdweb.com/references/typescript/v5/OwnerOfParams)>,

): Promise<string>;

`

### Parameters

##### options

 The options for the ownerOf function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[OwnerOfParams](https://portal.thirdweb.com/references/typescript/v5/OwnerOfParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## setApprovalForAll

 Prepares a transaction to call the "setApprovalForAll" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { setApprovalForAll } from "thirdweb/extensions/erc721";

const transaction = setApprovalForAll({

 contract,

 operator: ...,

 approved: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setApprovalForAll(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetApprovalForAllParams](https://portal.thirdweb.com/references/typescript/v5/SetApprovalForAllParams)

| { asyncParams: () => Promise<[SetApprovalForAllParams](https://portal.thirdweb.com/references/typescript/v5/SetApprovalForAllParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setApprovalForAll" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetApprovalForAllParams](https://portal.thirdweb.com/references/typescript/v5/SetApprovalForAllParams)

| { asyncParams: () => Promise<[SetApprovalForAllParams](https://portal.thirdweb.com/references/typescript/v5/SetApprovalForAllParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## setClaimConditions

 Set the claim conditions for a ERC721 drop

### Example

`import { setClaimConditions } from "thirdweb/extensions/erc721";

import { sendTransaction } from "thirdweb";

const transaction = setClaimConditions({

 contract,

 phases: [

 {

 maxClaimableSupply: 100n,

 maxClaimablePerWallet: 1n,

 currencyAddress: "0x...",

 price: 0.1,

 startTime: new Date(),

 },

 ],

});

await sendTransaction({ transaction, account });

`

##### Signature

`function setClaimConditions(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[SetClaimConditionsParams](https://portal.thirdweb.com/references/typescript/v5/SetClaimConditionsParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[SetClaimConditionsParams](https://portal.thirdweb.com/references/typescript/v5/SetClaimConditionsParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 the prepared transaction
## setSharedMetadata

 Sets the shared metadata for a OpenEdition contract.

##### Signature

`function setSharedMetadata(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[SetSharedMetadataParams](https://portal.thirdweb.com/references/typescript/v5/SetSharedMetadataParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the transaction.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[SetSharedMetadataParams](https://portal.thirdweb.com/references/typescript/v5/SetSharedMetadataParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 The prepared transaction.
## setTokenURI

 Prepares a transaction to call the "setTokenURI" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { setTokenURI } from "thirdweb/extensions/erc721";

const transaction = setTokenURI({

 contract,

 tokenId: ...,

 uri: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setTokenURI(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetTokenURIParams](https://portal.thirdweb.com/references/typescript/v5/SetTokenURIParams)

| { asyncParams: () => Promise<[SetTokenURIParams](https://portal.thirdweb.com/references/typescript/v5/SetTokenURIParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setTokenURI" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetTokenURIParams](https://portal.thirdweb.com/references/typescript/v5/SetTokenURIParams)

| { asyncParams: () => Promise<[SetTokenURIParams](https://portal.thirdweb.com/references/typescript/v5/SetTokenURIParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## sharedMetadataUpdatedEvent

 Creates an event object for the SharedMetadataUpdated event.

### Example

`import { getContractEvents } from "thirdweb";

import { sharedMetadataUpdatedEvent } from "thirdweb/extensions/erc721";

const events = await getContractEvents({

 contract,

 events: [sharedMetadataUpdatedEvent()],

});

`

##### Signature

`function sharedMetadataUpdatedEvent(): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "name"; readonly type: "string" },

 { readonly name: "description"; readonly type: "string" },

 { readonly name: "imageURI"; readonly type: "string" },

 { readonly name: "animationURI"; readonly type: "string" },

 ];

readonly name: "SharedMetadataUpdated";

readonly type: "event";

}>;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "name"; readonly type: "string" },

 { readonly name: "description"; readonly type: "string" },

 { readonly name: "imageURI"; readonly type: "string" },

 { readonly name: "animationURI"; readonly type: "string" },

 ];

readonly name: "SharedMetadataUpdated";

readonly type: "event";

}>;

`

 The prepared event object.
## sharedMetadata

 Calls the "sharedMetadata" function on the contract.

### Example

`import { sharedMetadata } from "thirdweb/extensions/erc721";

const result = await sharedMetadata({

 contract,

});

`

##### Signature

`function sharedMetadata(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<readonly [string, string, string, string]>;

`

### Parameters

##### options

 The options for the sharedMetadata function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<readonly [string, string, string, string]>;

`

 The parsed result of the function call.
## tokenOfOwnerByIndex

 Calls the "tokenOfOwnerByIndex" function on the contract.

### Example

`import { tokenOfOwnerByIndex } from "thirdweb/extensions/erc721";

const result = await tokenOfOwnerByIndex({

 contract,

 owner: ...,

 index: ...,

});

`

##### Signature

`function tokenOfOwnerByIndex(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[TokenOfOwnerByIndexParams](https://portal.thirdweb.com/references/typescript/v5/TokenOfOwnerByIndexParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the tokenOfOwnerByIndex function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[TokenOfOwnerByIndexParams](https://portal.thirdweb.com/references/typescript/v5/TokenOfOwnerByIndexParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## startTokenId

 Calls the "startTokenId" function on the contract.

### Example

`import { startTokenId } from "thirdweb/extensions/erc721";

const result = await startTokenId({

 contract,

});

`

##### Signature

`function startTokenId(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the startTokenId function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## tokenURIRevealedEvent

 Creates an event object for the TokenURIRevealed event.

### Example

`import { getContractEvents } from "thirdweb";

import { tokenURIRevealedEvent } from "thirdweb/extensions/erc721";

const events = await getContractEvents({

contract,

events: [

tokenURIRevealedEvent({

 index: ...,

})

],

});

`

##### Signature

`function tokenURIRevealedEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "index";

readonly type: "uint256";

 },

 { readonly name: "revealedURI"; readonly type: "string" },

 ];

readonly name: "TokenURIRevealed";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "index";

readonly type: "uint256";

 },

 { readonly name: "revealedURI"; readonly type: "string" },

 ];

readonly name: "TokenURIRevealed";

readonly type: "event";

}>;

`

 The prepared event object.
## tokensClaimedEvent

 Creates an event object for the TokensClaimed event.

### Example

`import { getContractEvents } from "thirdweb";

import { tokensClaimedEvent } from "thirdweb/extensions/erc721";

const events = await getContractEvents({

contract,

events: [

tokensClaimedEvent({

 claimConditionIndex: ...,

 claimer: ...,

 receiver: ...,

})

],

});

`

##### Signature

`function tokensClaimedEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "claimConditionIndex";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "claimer";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "receiver";

readonly type: "address";

 },

 { readonly name: "startTokenId"; readonly type: "uint256" },

 { readonly name: "quantityClaimed"; readonly type: "uint256" },

 ];

readonly name: "TokensClaimed";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "claimConditionIndex";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "claimer";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "receiver";

readonly type: "address";

 },

 { readonly name: "startTokenId"; readonly type: "uint256" },

 { readonly name: "quantityClaimed"; readonly type: "uint256" },

 ];

readonly name: "TokensClaimed";

readonly type: "event";

}>;

`

 The prepared event object.
## tokenURI

 Calls the "tokenURI" function on the contract.

### Example

`import { tokenURI } from "thirdweb/extensions/erc721";

const result = await tokenURI({

 contract,

 tokenId: ...,

});

`

##### Signature

`function tokenURI(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[TokenURIParams](https://portal.thirdweb.com/references/typescript/v5/TokenURIParams)>,

): Promise<string>;

`

### Parameters

##### options

 The options for the tokenURI function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[TokenURIParams](https://portal.thirdweb.com/references/typescript/v5/TokenURIParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## tokensLazyMintedEvent

 Creates an event object for the TokensLazyMinted event.

### Example

`import { getContractEvents } from "thirdweb";

import { tokensLazyMintedEvent } from "thirdweb/extensions/erc721";

const events = await getContractEvents({

contract,

events: [

tokensLazyMintedEvent({

 startTokenId: ...,

})

],

});

`

##### Signature

`function tokensLazyMintedEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "startTokenId";

readonly type: "uint256";

 },

 { readonly name: "endTokenId"; readonly type: "uint256" },

 { readonly name: "baseURI"; readonly type: "string" },

 { readonly name: "encryptedBaseURI"; readonly type: "bytes" },

 ];

readonly name: "TokensLazyMinted";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "startTokenId";

readonly type: "uint256";

 },

 { readonly name: "endTokenId"; readonly type: "uint256" },

 { readonly name: "baseURI"; readonly type: "string" },

 { readonly name: "encryptedBaseURI"; readonly type: "bytes" },

 ];

readonly name: "TokensLazyMinted";

readonly type: "event";

}>;

`

 The prepared event object.
## tokensMintedWithSignatureEvent

 Creates an event object for the TokensMintedWithSignature event.

### Example

`import { getContractEvents } from "thirdweb";

import { tokensMintedWithSignatureEvent } from "thirdweb/extensions/erc721";

const events = await getContractEvents({

contract,

events: [

tokensMintedWithSignatureEvent({

 signer: ...,

 mintedTo: ...,

 tokenIdMinted: ...,

})

],

});

`

##### Signature

`function tokensMintedWithSignatureEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "signer";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "mintedTo";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "tokenIdMinted";

readonly type: "uint256";

 },

 {

readonly components: readonly [

 { readonly name: "to"; readonly type: "address" },

 {

readonly name: "royaltyRecipient";

readonly type: "address";

 },

 { readonly name: "royaltyBps"; readonly type: "uint256" },

 {

readonly name: "primarySaleRecipient";

readonly type: "address";

 },

 { readonly name: "uri"; readonly type: "string" },

 { readonly name: "price"; readonly type: "uint256" },

 { readonly name: "currency"; readonly type: "address" },

 {

readonly name: "validityStartTimestamp";

readonly type: "uint128";

 },

 {

readonly name: "validityEndTimestamp";

readonly type: "uint128";

 },

 { readonly name: "uid"; readonly type: "bytes32" },

 ];

readonly name: "mintpayload";

readonly type: "tuple";

 },

 ];

readonly name: "TokensMintedWithSignature";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "signer";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "mintedTo";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "tokenIdMinted";

readonly type: "uint256";

 },

 {

readonly components: readonly [

 { readonly name: "to"; readonly type: "address" },

 {

readonly name: "royaltyRecipient";

readonly type: "address";

 },

 { readonly name: "royaltyBps"; readonly type: "uint256" },

 {

readonly name: "primarySaleRecipient";

readonly type: "address";

 },

 { readonly name: "uri"; readonly type: "string" },

 { readonly name: "price"; readonly type: "uint256" },

 { readonly name: "currency"; readonly type: "address" },

 {

readonly name: "validityStartTimestamp";

readonly type: "uint128";

 },

 {

readonly name: "validityEndTimestamp";

readonly type: "uint128";

 },

 { readonly name: "uid"; readonly type: "bytes32" },

 ];

readonly name: "mintpayload";

readonly type: "tuple";

 },

 ];

readonly name: "TokensMintedWithSignature";

readonly type: "event";

}>;

`

 The prepared event object.
## tokensOfOwner

 Calls the "tokensOfOwner" function on the contract.

### Example

`import { tokensOfOwner } from "thirdweb/extensions/erc721";

const result = await tokensOfOwner({

 contract,

 owner: ...,

});

`

##### Signature

`function tokensOfOwner(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[TokensOfOwnerParams](https://portal.thirdweb.com/references/typescript/v5/TokensOfOwnerParams)>) : Promise<readonly Array<bigint>>

`

### Parameters

##### options

 The options for the tokensOfOwner function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[TokensOfOwnerParams](https://portal.thirdweb.com/references/typescript/v5/TokensOfOwnerParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<readonly Array<bigint>>

`

 The parsed result of the function call.
## transferEvent

 Creates an event object for the Transfer event.

### Example

`import { getContractEvents } from "thirdweb";

import { transferEvent } from "thirdweb/extensions/erc721";

const events = await getContractEvents({

contract,

events: [

transferEvent({

 from: ...,

 to: ...,

 tokenId: ...,

})

],

});

`

##### Signature

`function transferEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "from";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "to";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "tokenId";

readonly type: "uint256";

 },

 ];

readonly name: "Transfer";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "from";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "to";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "tokenId";

readonly type: "uint256";

 },

 ];

readonly name: "Transfer";

readonly type: "event";

}>;

`

 The prepared event object.
## isRevealSupported

 Checks if the `reveal` method is supported by the given contract.

### Example

`import { isRevealSupported } from "thirdweb/extensions/erc721";

const supported = isRevealSupported(["0x..."]);

`

##### Signature

`function isRevealSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `reveal` method is supported.
## updateMetadata

 Update the metadata of the single token in an NFT Drop (DropERC721) collection For NFT Collection, please use `setTokenURI`

### Example

`import { updateMetadata } from "thirdweb/extensions/erc721";

const transaction = updateMetadata({

 contract,

 targetTokenId: 0n,

 client: thirdwebClient,

 newMetadata: {

 name: "this is the new nft name",

 description: "...",

 image: "new image uri",

// ...

 },

});

`

##### Signature

`function updateMetadata(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[UpdateMetadataParams](https://portal.thirdweb.com/references/typescript/v5/UpdateMetadataParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[UpdateMetadataParams](https://portal.thirdweb.com/references/typescript/v5/UpdateMetadataParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 the prepared transaction
## updateTokenURI

 This function is an abstracted layer of the [setTokenURI extension](https://portal.thirdweb.com/references/typescript/v5/erc721/setTokenURI) , which means it uses `setTokenURI` under the hood. While the `setTokenURI` method only takes in a uri string, this extension takes in a user-friendly [NFTInput](https://portal.thirdweb.com/references/typescript/v5/NFTInput) , upload that content to IPFS and pass the IPFS URI (of said `NFTInput` ) to the underlying `setTokenURI` method.

 This extension does not validate the NFTInput so make sure you are passing the proper content that you want to update.

### Example

`import { updateTokenURI } from "thirdweb/extensions/erc721";

const transaction = updateTokenURI({

 tokenId: 0n,

 nft: {

 name: "new name",

 description: "new description",

 image: "https://image-host.com/new-image.png",

 },

});

`

##### Signature

`function updateTokenURI(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[UpdateTokenURIParams](https://portal.thirdweb.com/references/typescript/v5/UpdateTokenURIParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[UpdateTokenURIParams](https://portal.thirdweb.com/references/typescript/v5/UpdateTokenURIParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 the prepared transaction from `setTokenURI`
## estimateGas

 Estimates the gas required to execute a transaction. The gas is returned as a `bigint` and in gwei units.

### Example

`import { estimateGas } from "thirdweb";

const gas = await estimateGas({

 transaction,

 from: "0x...",

});

`

##### Signature

`function estimateGas(options: [EstimateGasOptions](https://portal.thirdweb.com/references/typescript/v5/EstimateGasOptions)): Promise<bigint>;

`

### Parameters

##### options

 The options for estimating gas.

#### Type

`let options: Prettify<

 { transaction: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any> } & (

| { account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account); from?: never }

| { account?: never; from?: string | [Account](https://portal.thirdweb.com/references/typescript/v5/Account) }

 )

>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 A promise that resolves to the estimated gas as a bigint.
## estimateGasCost

 Estimate the gas cost of a transaction in ether and wei.

### Example

`import { estimateGasCost } from "thirdweb";

const gasCost = await estimateGasCost({ transaction });

`

##### Signature

`function estimateGasCost(

options: [EstimateGasOptions](https://portal.thirdweb.com/references/typescript/v5/EstimateGasOptions),

): Promise<[EstimateGasCostResult](https://portal.thirdweb.com/references/typescript/v5/EstimateGasCostResult)>;

`

### Parameters

##### options

#### Type

`let options: Prettify<

 { transaction: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any> } & (

| { account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account); from?: never }

| { account?: never; from?: string | [Account](https://portal.thirdweb.com/references/typescript/v5/Account) }

 )

>;

`

### Returns

##### Return Type

`let returnType: { ether: string; wei: bigint };

`
## erc7579

 Config for a ERC7579 modular smart wallet.

 This configuration is in BETA, expect breaking changes.

### Example

`import { sepolia } from "thirdweb/chains";

import { smartWallet, Config } from "thirdweb/wallets/smart";

const modularSmartWallet = smartWallet(

 Config.erc7579({

 chain: sepolia,

 sponsorGas: true,

 factoryAddress: "0x...", // the 7579 factory address

 validatorAddress: "0x...", // the default validator module address

 }),

});

`

##### Signature

`function erc7579(options: [ERC7579Config](https://portal.thirdweb.com/references/typescript/v5/ERC7579Config)): [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions);

`

### Parameters

##### options

 Optional overrides for the smart wallet.

#### Type

`let options: [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions) & {

factoryAddress: string;

validatorAddress: string;

};

`

### Returns

##### Return Type

`let returnType: Prettify<

 {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

factoryAddress?: string;

overrides?: {

accountAddress?: string;

accountSalt?: string;

bundlerUrl?: string;

createAccount?: (

factoryContract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract),

admin: string,

 ) => [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

entrypointAddress?: string;

execute?: (

accountContract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract),

transaction: SendTransactionOption,

 ) => [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

executeBatch?: (

accountContract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract),

transactions: Array<SendTransactionOption>,

 ) => [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

getAccountNonce?: (

accountContract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract),

 ) => Promise<bigint>;

paymaster?: (

userOp: UserOperationV06 | UserOperationV07,

 ) => Promise<[PaymasterResult](https://portal.thirdweb.com/references/typescript/v5/PaymasterResult)>;

predictAddress?: (

factoryContract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract),

admin: string,

 ) => Promise<string>;

signMessage?: (options: {

accountContract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

adminAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

factoryContract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

message: SignableMessage;

 }) => Promise<[Hex](https://portal.thirdweb.com/references/typescript/v5/Hex)>;

signTypedData?: (options: {

accountContract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

adminAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

factoryContract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

typedData: ox__TypedData.Definition<typedData, primaryType>;

 }) => Promise<[Hex](https://portal.thirdweb.com/references/typescript/v5/Hex)>;

tokenPaymaster?: TokenPaymasterConfig;

 };

sessionKey?: { address: string; permissions: AccountPermissions };

 } & ({ gasless: boolean } | { sponsorGas: boolean })

>;

`

 The smart wallet options.
## estimateUserOpGas

 Estimate the gas cost of a user operation.

### Example

`import { estimateUserOpGas } from "thirdweb/wallets/smart";

const gasCost = await estimateUserOpGas({

 userOp,

 options,

});

`

##### Signature

`function estimateUserOpGas(

args: {

options: BundlerOptions;

userOp: UserOperationV06 | UserOperationV07;

 },

stateOverrides?: {},

): Promise<EstimationResult>;

`

### Parameters

##### args

 The options for estimating the gas cost of a user operation.

#### Type

`let args: {

options: BundlerOptions;

userOp: UserOperationV06 | UserOperationV07;

};

`

##### stateOverrides

optional

### Returns

##### Return Type

`let returnType: Promise<EstimationResult>;

`

 The estimated gas cost of the user operation.
## estimateUserOpGasCost

 Estimate the gas cost of a user operation.

### Example

`import { estimateUserOpGasCost } from "thirdweb/wallets/smart";

const gasCost = await estimateUserOpGasCost({

 transactions,

 adminAccount,

 client,

 smartWalletOptions,

});

`

##### Signature

`function estimateUserOpGasCost(args: {

adminAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

smartWalletOptions: [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions);

transactions: Array<[PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)>;

}): Promise<{ ether: string; wei: bigint }>;

`

### Parameters

##### args

 The options for estimating the gas cost of a user operation.

#### Type

`let args: {

adminAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

smartWalletOptions: [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions);

transactions: Array<[PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)>;

};

`

### Returns

##### Return Type

`let returnType: Promise<{ ether: string; wei: bigint }>;

`

 The estimated gas cost of the user operation.
## eth\_blockNumber

 Retrieves the current block number from the Ethereum blockchain.

### Example

`import { getRpcClient, eth_blockNumber } from "thirdweb/rpc";

const rpcRequest = getRpcClient({ client, chain });

const blockNumber = await eth_blockNumber(rpcRequest);

`

##### Signature

`` function eth_blockNumber(

request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

 >,

): Promise<bigint>;

 ``

### Parameters

##### request

 The EIP1193 request function.

#### Type

`` let request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

>;

 ``

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 A promise that resolves to the current block number as a bigint.
## totalSupply

 Calls the "totalSupply" function on the contract.

### Example

`import { totalSupply } from "thirdweb/extensions/erc721";

const result = await totalSupply({

 contract,

});

`

##### Signature

`function totalSupply(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the totalSupply function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## eth\_estimateGas

 Estimates the gas required to execute a transaction on the Ethereum network.

### Example

`import { getRpcClient, eth_estimateGas } from "thirdweb/rpc";

const rpcRequest = getRpcClient({ client, chain });

const gas = await eth_estimateGas(rpcRequest, {

 to: "0x...",

...

});

`

##### Signature

`` function eth_estimateGas(

request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

 >,

transactionRequest: RpcTransactionRequest,

): Promise<bigint>;

 ``

### Parameters

##### request

 The EIP1193 request function.

#### Type

`` let request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

>;

 ``

##### transactionRequest

 The transaction request object.

#### Type

`let transactionRequest: RpcTransactionRequest;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 A promise that resolves to the estimated gas as a bigint.
## eth\_getBalance

 Retrieves the balance of the specified Ethereum address.

### Example

`import { getRpcClient, eth_getBalance } from "thirdweb/rpc";

const rpcRequest = getRpcClient({ client, chain });

const balance = await eth_getBalance(rpcRequest, {

 address: "0x...",

});

`

##### Signature

`` function eth_getBalance(

request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

 >,

params: [GetBalanceParams](https://portal.thirdweb.com/references/typescript/v5/GetBalanceParams),

): Promise<bigint>;

 ``

### Parameters

##### request

 The EIP1193 request function.

#### Type

`` let request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

>;

 ``

##### params

 The parameters for retrieving the balance.

#### Type

`let params: { address: string };

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 A promise that resolves to the balance of the address in wei as bigint.
## eth\_call

 Executes a call or a transaction on the Ethereum network.

### Example

`import { getRpcClient, eth_call } from "thirdweb/rpc";

const rpcRequest = getRpcClient({ client, chain });

const result = await eth_call(rpcRequest, {

 to: "0x...",

...

});

`

##### Signature

`` function eth_call(

request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

 >,

params: Partial<RpcTransactionRequest> & {

blockNumber?: number | bigint;

blockTag?: BlockTag | undefined;

stateOverrides?: StateOverride;

 },

): Promise<`0x${string}`>;

 ``

### Parameters

##### request

 The EIP1193 request function.

#### Type

`` let request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

>;

 ``

##### params

 The parameters for the call or transaction.

#### Type

`let params: Partial<RpcTransactionRequest> & {

blockNumber?: number | bigint;

blockTag?: BlockTag | undefined;

stateOverrides?: StateOverride;

};

`

### Returns

##### Return Type

`` let returnType: Promise<`0x${string}`>;

 ``

 A promise that resolves to the result of the call or transaction.
## eth\_getStorageAt

 Retrieves the value stored at a specific position in the storage of a contract.

### Example

`import { getRpcClient, eth_getStorageAt } from "thirdweb/rpc";

const rpcRequest = getRpcClient({ client, chain });

const storageValue = await eth_getStorageAt(rpcRequest, {

 address: "0x...",

 position: 0n,

});

`

##### Signature

`` function eth_getStorageAt(

request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

 >,

params: GetStorageAtParams,

): Promise<`0x${string}`>;

 ``

### Parameters

##### request

 The EIP1193 request function.

#### Type

`` let request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

>;

 ``

##### params

 The parameters for the eth\_getStorageAt method.

#### Type

`let params: GetStorageAtParams;

`

### Returns

##### Return Type

`` let returnType: Promise<`0x${string}`>;

 ``

 A promise that resolves to the value stored at the specified position.
## eth\_getLogs

 Retrieves logs from the Ethereum blockchain based on the specified parameters.

### Example

`import { getRpcClient, eth_getLogs } from "thirdweb/rpc";

const rpcRequest = getRpcClient({ client, chain });

const logs = await eth_getLogs(rpcRequest, {

 address: "0x...",

 fromBlock: 123456n,

 toBlock: 123456n,

});

`

##### Signature

`` function eth_getLogs(

request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

 >,

params: GetLogsParams,

): Promise<Array<Log>>;

 ``

### Parameters

##### request

 The EIP1193 request function.

#### Type

`` let request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

>;

 ``

##### params

 The parameters for retrieving logs.

#### Type

`let params: GetLogsParams;

`

### Returns

##### Return Type

`let returnType: Promise<Array<Log>>;

`

 A promise that resolves to the retrieved logs.
## eth\_getCode

 Retrieves the bytecode of a smart contract at the specified address.

### Example

`import { getRpcClient, eth_getCode } from "thirdweb/rpc";

const rpcRequest = getRpcClient({ client, chain });

const bytecode = await eth_getCode(rpcRequest, {

 address: "0x...",

});

`

##### Signature

`` function eth_getCode(

request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

 >,

params: GetCodeParams,

): Promise<`0x${string}`>;

 ``

### Parameters

##### request

 The EIP1193 request function.

#### Type

`` let request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

>;

 ``

##### params

 The parameters for the eth\_getCode method.

#### Type

`let params: GetCodeParams;

`

### Returns

##### Return Type

`` let returnType: Promise<`0x${string}`>;

 ``

 A promise that resolves to the bytecode of the smart contract.
## eth\_getTransactionByHash

 Retrieves a transaction by its hash.

### Example

`import { getRpcClient, eth_getTransactionByHash } from "thirdweb/rpc";

const rpcRequest = getRpcClient({ client, chain });

const transaction = await eth_getTransactionByHash(rpcRequest, {

 hash: "0x...",

});

`

##### Signature

`` function eth_getTransactionByHash(

request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

 >,

params: GetTransactionByHashParameters,

): Promise<Transaction>;

 ``

### Parameters

##### request

 The EIP1193 request function.

#### Type

`` let request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

>;

 ``

##### params

 The parameters for retrieving the transaction.

#### Type

`let params: GetTransactionByHashParameters;

`

### Returns

##### Return Type

`let returnType: Promise<Transaction>;

`

 A promise that resolves to the transaction.
## eth\_gasPrice

 Retrieves the current gas price from the Ethereum network.

### Example

`import { getRpcClient, eth_gasPrice } from "thirdweb/rpc";

const rpcRequest = getRpcClient({ client, chain });

const gasPrice = await eth_gasPrice(rpcRequest);

`

##### Signature

`` function eth_gasPrice(

request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

 >,

): Promise<bigint>;

 ``

### Parameters

##### request

 The EIP1193 request function.

#### Type

`` let request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

>;

 ``

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 A promise that resolves to the gas price as a bigint.
## eth\_getTransactionCount

 Retrieves the transaction count (nonce) for a given Ethereum address.

### Example

`import { getRpcClient, eth_getTransactionCount } from "thirdweb/rpc";

const rpcRequest = getRpcClient({ client, chain });

const transactionCount = await eth_getTransactionCount(rpcRequest, {

 address: "0x...",

});

`

##### Signature

`` function eth_getTransactionCount(

request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

 >,

params: GetTransactionCountParameters,

): Promise<number>;

 ``

### Parameters

##### request

 The EIP1193 request function.

#### Type

`` let request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

>;

 ``

##### params

 The parameters for retrieving the transaction count.

#### Type

`let params: GetTransactionCountParameters;

`

### Returns

##### Return Type

`let returnType: Promise<number>;

`

 A promise that resolves to the transaction count as a number.
## eth\_sendRawTransaction

 Sends a raw transaction to the Ethereum network.

### Example

`import { getRpcClient, eth_sendRawTransaction } from "thirdweb/rpc";

const rpcRequest = getRpcClient({ client, chain });

const transactionHash = await eth_sendRawTransaction(

 rpcRequest,

"0x...",

);

`

##### Signature

`` function eth_sendRawTransaction(

request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

 >,

signedTransaction: `0x${string}`,

): Promise<`0x${string}`>;

 ``

### Parameters

##### request

 The EIP1193 request function.

#### Type

`` let request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

>;

 ``

##### signedTransaction

 The signed transaction in hex format.

#### Type

`` let signedTransaction: `0x${string}`;

 ``

### Returns

##### Return Type

`` let returnType: Promise<`0x${string}`>;

 ``

 A promise that resolves to the transaction hash.
## eth\_maxPriorityFeePerGas

 Retrieves the maximum priority fee per gas from the Ethereum network.

### Example

`import { getRpcClient, eth_maxPriorityFeePerGas } from "thirdweb/rpc";

const rpcRequest = getRpcClient({ client, chain });

const maxPriorityFeePerGas =

await eth_maxPriorityFeePerGas(rpcRequest);

`

##### Signature

`` function eth_maxPriorityFeePerGas(

request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

 >,

): Promise<bigint>;

 ``

### Parameters

##### request

 The EIP1193 request function.

#### Type

`` let request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

>;

 ``

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 A promise that resolves to a bigint representing the maximum priority fee per gas.
## eth\_getTransactionReceipt

 Retrieves the transaction receipt for a given transaction hash. Throws an error if the receipt is not found.

### Example

`import {

 getRpcClient,

 eth_getTransactionReceipt,

} from "thirdweb/rpc";

const rpcRequest = getRpcClient({ client, chain });

const transactionReceipt = await eth_getTransactionReceipt(

 rpcRequest,

 {

 hash: "0x...",

 },

);

`

##### Signature

`` function eth_getTransactionReceipt(

request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

 >,

params: GetTransactionReceiptParameters,

): Promise<TransactionReceipt>;

 ``

### Parameters

##### request

 The EIP1193 request function.

#### Type

`` let request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

>;

 ``

##### params

 The parameters for retrieving the transaction receipt.

#### Type

`let params: GetTransactionReceiptParameters;

`

### Returns

##### Return Type

`let returnType: {

blobGasPrice?: quantity;

blobGasUsed?: quantity;

blockHash: Hash;

blockNumber: quantity;

contractAddress: Address | null | undefined;

cumulativeGasUsed: quantity;

effectiveGasPrice: quantity;

from: Address;

gasUsed: quantity;

logs: Array<Log<quantity, index, false>>;

logsBloom: Hex;

root?: Hash;

status: status;

to: Address | null;

transactionHash: Hash;

transactionIndex: index;

type: type;

};

`

 A promise that resolves to the transaction receipt.
## transferFrom

 Prepares a transaction to call the "transferFrom" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { transferFrom } from "thirdweb/extensions/erc721";

const transaction = transferFrom({

 contract,

 from: ...,

 to: ...,

 tokenId: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function transferFrom(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [TransferFromParams](https://portal.thirdweb.com/references/typescript/v5/TransferFromParams)

| { asyncParams: () => Promise<[TransferFromParams](https://portal.thirdweb.com/references/typescript/v5/TransferFromParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "transferFrom" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [TransferFromParams](https://portal.thirdweb.com/references/typescript/v5/TransferFromParams)

| { asyncParams: () => Promise<[TransferFromParams](https://portal.thirdweb.com/references/typescript/v5/TransferFromParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## extractMinimalProxyImplementationAddress

 Extracts the implementation address from a given bytecode string if it matches any of the known minimal proxy patterns.

### Example

`import { extractMinimalProxyImplementationAddress } from "thirdweb/utils";

const bytecode = "0x363d3d373d3d3d363d73...";

const implementationAddress =

extractMinimalProxyImplementationAddress(bytecode);

`

##### Signature

`function extractMinimalProxyImplementationAddress(

bytecode: string,

): undefined | string;

`

### Parameters

##### bytecode

 The bytecode string to extract the implementation address from.

#### Type

`let bytecode: string;

`

### Returns

##### Return Type

`let returnType: undefined | string;

`

 The implementation address as a string if a match is found, otherwise undefined.
## extractIPFSUri

 Extracts the IPFS URI from the given bytecode.

### Example

`import { extractIPFSUri } from "thirdweb/utils/bytecode/extractIPFS";

const bytecode =

"0x363d3d373d3d3d363d30545af43d82803e903d91601857fd5bf3";

const ipfsHash = extractIPFSUri(bytecode);

console.log(ipfsHash);

`

##### Signature

`function extractIPFSUri(bytecode: string): undefined | string;

`

### Parameters

##### bytecode

 The bytecode to extract the IPFS URI from.

#### Type

`let bytecode: string;

`

### Returns

##### Return Type

`let returnType: undefined | string;

`

 The IPFS URI if found, otherwise undefined.
## execute

 Execute a transaction based on a prompt.

### Example

`import { Nebula } from "thirdweb/ai";

const wallet = createWallet("io.metamask");

const account = wallet.connect({ client });

const result = await Nebula.execute({

 client,

 account, // transactions will be sent from this account

 message: "send 0.0001 ETH to vitalik.eth",

 contextFilter: {

 chains: [sepolia],

 },

});

`

 Multi message prompt:

`Nebula.execute({

 client,

 account,

 messages: [

 { role: "user", content: "What's the address of vitalik.eth" },

 {

 role: "assistant",

 content:

"The address of vitalik.eth is 0xd8dA6BF26964aF8E437eEa5e3616511D7G3a3298",

 },

 { role: "user", content: "Send them 0.0001 ETH" },

 ],

 contextFilter: {

 chains: [sepolia],

 },

});

`

##### Signature

`function execute(

input: [Input](https://portal.thirdweb.com/references/typescript/v5/Input) & { account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account) },

): Promise<SendTransactionResult>;

`

### Parameters

##### input

 The input for the transaction.

#### Type

`let input: [Input](https://portal.thirdweb.com/references/typescript/v5/Input) & { account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account) };

`

### Returns

##### Return Type

`let returnType: Promise<SendTransactionResult>;

`

 The transaction hash. This API is in early access and might change in the future.
## ethers6Adapter

 The ethers6 adapter provides a way to convert between Thirdweb contracts, accounts, and providers.

`` let ethers6Adapter: {

contract: {

fromEthers: (

options: FromEthersContractOptions,

 ) => Promise<Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<Abi, `0x${string}`>>>;

toEthers: (options: {

account?: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

thirdwebContract: Readonly;

 }) => Promise<Contract>;

 };

provider: {

toEthers: (options: {

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

 }) => JsonRpcProvider;

 };

signer: {

fromEthers: (options: { signer: Signer }) => Promise<[Account](https://portal.thirdweb.com/references/typescript/v5/Account)>;

toEthers: (options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

 }) => Signer;

 };

};

 ``

##### contract

 Converts a ThirdwebContract to an ethers.js Contract or the other way around.

`` type contract = {

fromEthers: (

options: FromEthersContractOptions,

 ) => Promise<Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<Abi, `0x${string}`>>>;

toEthers: (options: {

account?: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

thirdwebContract: Readonly;

 }) => Promise<Contract>;

};

 ``

### Example

####  toEthers

`import { ethers6Adapter } from "thirdweb/adapters/ethers6";

const ethersContract = await ethers6Adapter.contract.toEthers({

 thirdwebContract,

 account,

});

`

####  fromEthers

`import { ethers6Adapter } from "thirdweb/adapters";

const contract = ethers6Adapter.contract.fromEthers({

 client,

 chain,

 ethersContract,

});

`

##### provider

 Converts a Thirdweb client and chain ID into an ethers.js provider.

`type provider = {

toEthers: (options: {

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

 }) => JsonRpcProvider;

};

`

### Example

`import { ethers6Adapter } from "thirdweb/adapters/ethers6";

const provider = ethers6Adapter.provider.toEthers({ client, chain });

`

##### signer

 Converts an ethers6 Signer into a Wallet object or the other way around.

`type signer = {

fromEthers: (options: { signer: Signer }) => Promise<[Account](https://portal.thirdweb.com/references/typescript/v5/Account)>;

toEthers: (options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

 }) => Signer;

};

`

### Example

####  fromEthersSigner

`import { ethers6Adapter } from "thirdweb/adapters/ethers6";

const signer = ethers6Adapter.signer.fromEthersSigner({ signer });

`

####  toEthersSigner

`import { ethers6Adapter } from "thirdweb/adapters/ethers6";

const signer = await ethers6Adapter.signer.toEthers({

 client,

 chain,

 account,

});

`
## ethers5Adapter

 The ethers5 adapter provides a way to convert between Thirdweb contracts, accounts, and providers.

`` let ethers5Adapter: {

contract: {

fromEthers: (

options: FromEthersContractOptions,

 ) => Promise<Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<Abi, `0x${string}`>>>;

toEthers: (options: {

thirdwebContract: Readonly;

 }) => Promise<Contract>;

 };

provider: {

toEthers: (options: {

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

 }) => Provider;

 };

signer: {

fromEthers: (options: { signer: Signer }) => Promise<[Account](https://portal.thirdweb.com/references/typescript/v5/Account)>;

toEthers: (options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

 }) => Promise<ThirdwebAdapterSigner>;

 };

};

 ``

##### contract

 Converts a ThirdwebContract to an ethers.js Contract or the other way around.

`` type contract = {

fromEthers: (

options: FromEthersContractOptions,

 ) => Promise<Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<Abi, `0x${string}`>>>;

toEthers: (options: {

thirdwebContract: Readonly;

 }) => Promise<Contract>;

};

 ``

### Example

####  toEthers

`import { ethers5Adapter } from "thirdweb/adapters/ethers5";

const ethersContract = await ethers5Adapter.contract.toEthers({

 thirdwebContract,

});

`

####  fromEthers

`import { ethers5Adapter } from "thirdweb/adapters/ethers5";

const twContract = await ethers5Adapter.contract.fromEthers({

 client,

 ethersContract,

 chain: defineChain(1), // Replace with your chain

});

`

##### provider

 Converts a Thirdweb client and chain ID into an ethers.js provider.

`type provider = {

toEthers: (options: {

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

 }) => Provider;

};

`

### Example

`import { ethers5Adapter } from "thirdweb/adapters/ethers5";

const provider = ethers5Adapter.provider.toEthers({

 client,

 chainId,

});

`

 Once you have converted a thirdweb Client to ethers Provider, you can use it like any other ethers provider:

`const blockNumber = await provider.getBlockNumber();

`

##### signer

 Converts an ethers5 Signer into a Wallet object or the other way around.

`type signer = {

fromEthers: (options: { signer: Signer }) => Promise<[Account](https://portal.thirdweb.com/references/typescript/v5/Account)>;

toEthers: (options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

 }) => Promise<ThirdwebAdapterSigner>;

};

`

### Example

####  fromEthers

`import { ethers5Adapter } from "thirdweb/adapters/ethers5";

const wallet = await ethers5Adapter.signer.fromEthers({ signer });

`

####  toEthers

`import { ethers5Adapter } from "thirdweb/adapters/ethers5";

const signer = await ethers5Adapter.signer.toEthers({

 client,

 chain,

 account,

});

`
## CHANGE\_RECOVERY\_ADDRESS\_TYPEHASH

 Calls the "CHANGE\_RECOVERY\_ADDRESS\_TYPEHASH" function on the contract.

### Example

`import { CHANGE_RECOVERY_ADDRESS_TYPEHASH } from "thirdweb/extensions/farcaster";

const result = await CHANGE_RECOVERY_ADDRESS_TYPEHASH({

 contract,

});

`

##### Signature

`` function CHANGE_RECOVERY_ADDRESS_TYPEHASH(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<`0x${string}`>;

 ``

### Parameters

##### options

 The options for the CHANGE\_RECOVERY\_ADDRESS\_TYPEHASH function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`` let returnType: Promise<`0x${string}`>;

 ``

 The parsed result of the function call.
## ADD\_TYPEHASH

 Calls the "ADD\_TYPEHASH" function on the contract.

### Example

`import { ADD_TYPEHASH } from "thirdweb/extensions/farcaster";

const result = await ADD_TYPEHASH({

 contract,

});

`

##### Signature

`` function ADD_TYPEHASH(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<`0x${string}`>;

 ``

### Parameters

##### options

 The options for the ADD\_TYPEHASH function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`` let returnType: Promise<`0x${string}`>;

 ``

 The parsed result of the function call.
## TRANSFER\_TYPEHASH

 Calls the "TRANSFER\_TYPEHASH" function on the contract.

### Example

`import { TRANSFER_TYPEHASH } from "thirdweb/extensions/farcaster";

const result = await TRANSFER_TYPEHASH({

 contract,

});

`

##### Signature

`` function TRANSFER_TYPEHASH(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<`0x${string}`>;

 ``

### Parameters

##### options

 The options for the TRANSFER\_TYPEHASH function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`` let returnType: Promise<`0x${string}`>;

 ``

 The parsed result of the function call.
## add

 Prepares a transaction to call the "add" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { add } from "thirdweb/extensions/farcaster";

const transaction = add({

 contract,

 keyType: ...,

 key: ...,

 metadataType: ...,

 metadata: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function add(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[AddParams](https://portal.thirdweb.com/references/typescript/v5/AddParams) | { asyncParams: () => Promise<[AddParams](https://portal.thirdweb.com/references/typescript/v5/AddParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "add" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[AddParams](https://portal.thirdweb.com/references/typescript/v5/AddParams) | { asyncParams: () => Promise<[AddParams](https://portal.thirdweb.com/references/typescript/v5/AddParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## addEvent

 Creates an event object for the Add event.

### Example

`import { getContractEvents } from "thirdweb";

import { addEvent } from "thirdweb/extensions/farcaster";

const events = await getContractEvents({

contract,

events: [

addEvent({

 fid: ...,

 keyType: ...,

 key: ...,

})

],

});

`

##### Signature

`function addEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "fid";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "keyType";

readonly type: "uint32";

 },

 {

readonly indexed: true;

readonly name: "key";

readonly type: "bytes";

 },

 { readonly name: "keyBytes"; readonly type: "bytes" },

 { readonly name: "metadataType"; readonly type: "uint8" },

 { readonly name: "metadata"; readonly type: "bytes" },

 ];

readonly name: "Add";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "fid";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "keyType";

readonly type: "uint32";

 },

 {

readonly indexed: true;

readonly name: "key";

readonly type: "bytes";

 },

 { readonly name: "keyBytes"; readonly type: "bytes" },

 { readonly name: "metadataType"; readonly type: "uint8" },

 { readonly name: "metadata"; readonly type: "bytes" },

 ];

readonly name: "Add";

readonly type: "event";

}>;

`

 The prepared event object.
## REGISTER\_TYPEHASH

 Calls the "REGISTER\_TYPEHASH" function on the contract.

### Example

`import { REGISTER_TYPEHASH } from "thirdweb/extensions/farcaster";

const result = await REGISTER_TYPEHASH({

 contract,

});

`

##### Signature

`` function REGISTER_TYPEHASH(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<`0x${string}`>;

 ``

### Parameters

##### options

 The options for the REGISTER\_TYPEHASH function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`` let returnType: Promise<`0x${string}`>;

 ``

 The parsed result of the function call.
## TRANSFER\_AND\_CHANGE\_RECOVERY\_TYPEHASH

 Calls the "TRANSFER\_AND\_CHANGE\_RECOVERY\_TYPEHASH" function on the contract.

### Example

`import { TRANSFER_AND_CHANGE_RECOVERY_TYPEHASH } from "thirdweb/extensions/farcaster";

const result = await TRANSFER_AND_CHANGE_RECOVERY_TYPEHASH({

 contract,

});

`

##### Signature

`` function TRANSFER_AND_CHANGE_RECOVERY_TYPEHASH(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<`0x${string}`>;

 ``

### Parameters

##### options

 The options for the TRANSFER\_AND\_CHANGE\_RECOVERY\_TYPEHASH function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`` let returnType: Promise<`0x${string}`>;

 ``

 The parsed result of the function call.
## addFor

 Prepares a transaction to call the "addFor" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { addFor } from "thirdweb/extensions/farcaster";

const transaction = addFor({

 contract,

 fidOwner: ...,

 keyType: ...,

 key: ...,

 metadataType: ...,

 metadata: ...,

 deadline: ...,

 sig: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function addFor(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

AddForParams | { asyncParams: () => Promise<AddForParams> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "addFor" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

AddForParams | { asyncParams: () => Promise<AddForParams> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## adminResetEvent

 Creates an event object for the AdminReset event.

### Example

`import { getContractEvents } from "thirdweb";

import { adminResetEvent } from "thirdweb/extensions/farcaster";

const events = await getContractEvents({

contract,

events: [

adminResetEvent({

 fid: ...,

 key: ...,

})

],

});

`

##### Signature

`function adminResetEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "fid";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "key";

readonly type: "bytes";

 },

 { readonly name: "keyBytes"; readonly type: "bytes" },

 ];

readonly name: "AdminReset";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "fid";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "key";

readonly type: "bytes";

 },

 { readonly name: "keyBytes"; readonly type: "bytes" },

 ];

readonly name: "AdminReset";

readonly type: "event";

}>;

`

 The prepared event object.
## addSignerFor

 Adds farcaster signer for a given user. Helpful if you want to cover the gas fee for a user.

### Example

`import { addSignerFor } from "thirdweb/extensions/farcaster";

import { sendTransaction } from "thirdweb";

const transaction = addSignerFor({

 client,

 appAccount,

 userAccount,

 signerPublicKey,

});

await sendTransaction({ transaction, account });

`

##### Signature

`function addSignerFor(

options: [AddSignerForParams](https://portal.thirdweb.com/references/typescript/v5/AddSignerForParams),

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<[], AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for adding the signer.

#### Type

`let options: Prettify<

 {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

disableCache?: boolean;

signerPublicKey: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

 } & (

| { appAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account) }

| {

appAccountAddress: Address;

deadline: bigint;

signedKeyRequestMetadata: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

 }

 ) &

 (

| { userAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account) }

| { addSignature: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex); deadline: bigint; userAddress: Address }

 )

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

 [],

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object to add the signer to the account.
## REMOVE\_TYPEHASH

 Calls the "REMOVE\_TYPEHASH" function on the contract.

### Example

`import { REMOVE_TYPEHASH } from "thirdweb/extensions/farcaster";

const result = await REMOVE_TYPEHASH({

 contract,

});

`

##### Signature

`` function REMOVE_TYPEHASH(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<`0x${string}`>;

 ``

### Parameters

##### options

 The options for the REMOVE\_TYPEHASH function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`` let returnType: Promise<`0x${string}`>;

 ``

 The parsed result of the function call.
## adminResetEvent

 Creates an event object for the AdminReset event.

### Example

`import { getContractEvents } from "thirdweb";

import { adminResetEvent } from "thirdweb/extensions/farcaster";

const events = await getContractEvents({

contract,

events: [

adminResetEvent({

 fid: ...,

})

],

});

`

##### Signature

`function adminResetEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "fid";

readonly type: "uint256";

 },

 ];

readonly name: "AdminReset";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "fid";

readonly type: "uint256";

 },

 ];

readonly name: "AdminReset";

readonly type: "event";

}>;

`

 The prepared event object.
## addSigner

 Adds farcaster signer for the given account.

### Example

`import { addSigner } from "thirdweb/extensions/farcaster";

import { sendTransaction } from "thirdweb";

const transaction = addSigner({

 client,

 appAccount,

 signerPublicKey,

});

await sendTransaction({ transaction, account });

`

##### Signature

`function addSigner(

options: [AddSignerParams](https://portal.thirdweb.com/references/typescript/v5/AddSignerParams),

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<[], AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for adding the signer.

#### Type

`let options: Prettify<

 {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

disableCache?: boolean;

signerPublicKey: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

 } & (

| { appAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account) }

| {

appAccountAddress: Address;

deadline: bigint;

signedKeyRequestMetadata: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

 }

 )

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

 [],

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object to add the signer to the account.
## createEd25519Keypair

 Generates an Ed25519 keypair to be used as an account signer.

### Example

`createSigner();

`

##### Signature

`function createEd25519Keypair(): Promise<[Ed25519Keypair](https://portal.thirdweb.com/references/typescript/v5/Ed25519Keypair)>;

`

### Returns

##### Return Type

`let returnType: { privateKey: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex); publicKey: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex) };

`

 A promise resolving to the generated keypair.
## changeRecoveryAddressEvent

 Creates an event object for the ChangeRecoveryAddress event.

### Example

`import { getContractEvents } from "thirdweb";

import { changeRecoveryAddressEvent } from "thirdweb/extensions/farcaster";

const events = await getContractEvents({

contract,

events: [

changeRecoveryAddressEvent({

 id: ...,

 recovery: ...,

})

],

});

`

##### Signature

`function changeRecoveryAddressEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "id";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "recovery";

readonly type: "address";

 },

 ];

readonly name: "ChangeRecoveryAddress";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "id";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "recovery";

readonly type: "address";

 },

 ];

readonly name: "ChangeRecoveryAddress";

readonly type: "event";

}>;

`

 The prepared event object.
## custodyOf

 Calls the "custodyOf" function on the contract.

### Example

`import { custodyOf } from "thirdweb/extensions/farcaster";

const result = await custodyOf({

 contract,

 fid: ...,

});

`

##### Signature

`function custodyOf(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[CustodyOfParams](https://portal.thirdweb.com/references/typescript/v5/CustodyOfParams)>,

): Promise<string>;

`

### Parameters

##### options

 The options for the custodyOf function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[CustodyOfParams](https://portal.thirdweb.com/references/typescript/v5/CustodyOfParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## changeRecoveryAddress

 Prepares a transaction to call the "changeRecoveryAddress" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { changeRecoveryAddress } from "thirdweb/extensions/farcaster";

const transaction = changeRecoveryAddress({

 contract,

 recovery: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function changeRecoveryAddress(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [ChangeRecoveryAddressParams](https://portal.thirdweb.com/references/typescript/v5/ChangeRecoveryAddressParams)

| { asyncParams: () => Promise<[ChangeRecoveryAddressParams](https://portal.thirdweb.com/references/typescript/v5/ChangeRecoveryAddressParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "changeRecoveryAddress" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [ChangeRecoveryAddressParams](https://portal.thirdweb.com/references/typescript/v5/ChangeRecoveryAddressParams)

| { asyncParams: () => Promise<[ChangeRecoveryAddressParams](https://portal.thirdweb.com/references/typescript/v5/ChangeRecoveryAddressParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## encodeSignedKeyRequestMetadata

 Encodes the signed key request metadata into a hexadecimal string. This function takes in the request signer's address, the key request signature, the request Fid, and the deadline, and returns the encoded ABI parameters as a hexadecimal string. It's used to prepare the metadata for transactions involving signed key requests.

### Example

`const encodedMetadata = encodeSignedKeyRequestMetadata({

 requestSigner: "0x123...",

 keyRequestSignature: "0xabcd...",

 requestFid: 123456789n,

 deadline: 1657758061n,

});

`

##### Signature

`` function encodeSignedKeyRequestMetadata(options: {

deadline: bigint;

keyRequestSignature: `0x${string}`;

requestFid: bigint;

requestSigner: string;

}): `0x${string}`;

 ``

### Parameters

##### options

 The options for encoding the signed key request metadata.

#### Type

`` let options: {

deadline: bigint;

keyRequestSignature: `0x${string}`;

requestFid: bigint;

requestSigner: string;

};

 ``

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

 The encoded ABI parameters as a hexadecimal string.
## gatewayFrozen

 Calls the "gatewayFrozen" function on the contract.

### Example

`import { gatewayFrozen } from "thirdweb/extensions/farcaster";

const result = await gatewayFrozen({

 contract,

});

`

##### Signature

`function gatewayFrozen(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<boolean>;

`

### Parameters

##### options

 The options for the gatewayFrozen function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 The parsed result of the function call.
## freezeIdGatewayEvent

 Creates an event object for the FreezeIdGateway event.

### Example

`import { getContractEvents } from "thirdweb";

import { freezeIdGatewayEvent } from "thirdweb/extensions/farcaster";

const events = await getContractEvents({

 contract,

 events: [freezeIdGatewayEvent()],

});

`

##### Signature

`function freezeIdGatewayEvent(): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "idGateway"; readonly type: "address" },

 ];

readonly name: "FreezeIdGateway";

readonly type: "event";

}>;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "idGateway"; readonly type: "address" },

 ];

readonly name: "FreezeIdGateway";

readonly type: "event";

}>;

`

 The prepared event object.
## freezeKeyGatewayEvent

 Creates an event object for the FreezeKeyGateway event.

### Example

`import { getContractEvents } from "thirdweb";

import { freezeKeyGatewayEvent } from "thirdweb/extensions/farcaster";

const events = await getContractEvents({

 contract,

 events: [freezeKeyGatewayEvent()],

});

`

##### Signature

`function freezeKeyGatewayEvent(): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "keyGateway"; readonly type: "address" },

 ];

readonly name: "FreezeKeyGateway";

readonly type: "event";

}>;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "keyGateway"; readonly type: "address" },

 ];

readonly name: "FreezeKeyGateway";

readonly type: "event";

}>;

`

 The prepared event object.
## gatewayFrozen

 Calls the "gatewayFrozen" function on the contract.

### Example

`import { gatewayFrozen } from "thirdweb/extensions/farcaster";

const result = await gatewayFrozen({

 contract,

});

`

##### Signature

`function gatewayFrozen(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<boolean>;

`

### Parameters

##### options

 The options for the gatewayFrozen function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 The parsed result of the function call.
## deprecationTimestamp

 Calls the "deprecationTimestamp" function on the contract.

### Example

`import { deprecationTimestamp } from "thirdweb/extensions/farcaster";

const result = await deprecationTimestamp({

 contract,

});

`

##### Signature

`function deprecationTimestamp(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the deprecationTimestamp function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## getAddData

 Prepares the data required for signing an Add message according to EIP-712.

### Example

`const message: AddMessage = {

 owner: "0xYourAddress",

 keyType: 1,

 key: "0xYourPublicKey",

 metadataType: 1,

 metadata: "0xYourMetadata",

 nonce: BigInt("YourNonce"),

 deadline: BigInt("YourDeadline"),

};

const data = getAddData(message);

`

##### Signature

`function getAddData(message: [AddMessage](https://portal.thirdweb.com/references/typescript/v5/AddMessage)): {

domain: {

readonly chainId: 10;

readonly name: "Farcaster KeyGateway";

readonly verifyingContract: "0x00000000fC56947c7E7183f8Ca4B62398CaAdf0B";

readonly version: "1";

 };

message: [AddMessage](https://portal.thirdweb.com/references/typescript/v5/AddMessage);

primaryType: "Add";

types: {

readonly Add: readonly [

 { readonly name: "owner"; readonly type: "address" },

 { readonly name: "keyType"; readonly type: "uint32" },

 { readonly name: "key"; readonly type: "bytes" },

 { readonly name: "metadataType"; readonly type: "uint8" },

 { readonly name: "metadata"; readonly type: "bytes" },

 { readonly name: "nonce"; readonly type: "uint256" },

 { readonly name: "deadline"; readonly type: "uint256" },

 ];

 };

};

`

### Parameters

##### message

 The AddMessage object containing the message to be signed.

#### Type

`let message: {

deadline: bigint;

key: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

keyType: number;

metadata: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

metadataType: number;

nonce: bigint;

owner: Address;

};

`

### Returns

##### Return Type

`let returnType: {

domain: {

readonly chainId: 10;

readonly name: "Farcaster KeyGateway";

readonly verifyingContract: "0x00000000fC56947c7E7183f8Ca4B62398CaAdf0B";

readonly version: "1";

 };

message: [AddMessage](https://portal.thirdweb.com/references/typescript/v5/AddMessage);

primaryType: "Add";

types: {

readonly Add: readonly [

 { readonly name: "owner"; readonly type: "address" },

 { readonly name: "keyType"; readonly type: "uint32" },

 { readonly name: "key"; readonly type: "bytes" },

 { readonly name: "metadataType"; readonly type: "uint8" },

 { readonly name: "metadata"; readonly type: "bytes" },

 { readonly name: "nonce"; readonly type: "uint256" },

 { readonly name: "deadline"; readonly type: "uint256" },

 ];

 };

};

`

 The data object structured according to EIP-712, ready for signing.
## getFid

 Retrieves the current fid for an account.

### Example

`import { getFid } from "thirdweb/extensions/farcaster";

const price = await getFid({

 client,

 address,

});

`

##### Signature

`function getFid(options: [GetFidParams](https://portal.thirdweb.com/references/typescript/v5/GetFidParams)): Promise<bigint>;

`

### Parameters

##### options

 Parameters to pass to the function.

#### Type

`let options: {

address: Address;

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

disableCache?: boolean;

};

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 A promise that resolves to the account's fid, if one exists, otherwise 0.
## getIdGateway

 Retrieves the IdGateway contract.

### Example

`import { getIdGatway } from "thirdweb/extensions/farcaster";

const idGateway = await getIdGateway({

 client,

});

`

##### Signature

`function getIdGateway(options: [FarcasterContractOptions](https://portal.thirdweb.com/references/typescript/v5/FarcasterContractOptions)): Readonly;

`

### Parameters

##### options

 The thirdweb client and an optional custom chain.

#### Type

`let options: { chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain); client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient) };

`

### Returns

##### Return Type

`let returnType: Readonly;

`

 The IdGateway contract instance.
## getBundler

 Retrieves the Bundler contract.

### Example

`import { getBundler } from "thirdweb/extensions/farcaster";

const bundler = await getBundler({

 client,

});

`

##### Signature

`function getBundler(options: [FarcasterContractOptions](https://portal.thirdweb.com/references/typescript/v5/FarcasterContractOptions)): Readonly;

`

### Parameters

##### options

 The thirdweb client and an optional custom chain.

#### Type

`let options: { chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain); client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient) };

`

### Returns

##### Return Type

`let returnType: Readonly;

`

 The Bundler contract instance.
## getKeyGateway

 Retrieves the KeyGateway contract.

### Example

`import { getKeyGateway } from "thirdweb/extensions/farcaster";

const keyGateway = await getKeyGateway({

 client,

});

`

##### Signature

`function getKeyGateway(options: [FarcasterContractOptions](https://portal.thirdweb.com/references/typescript/v5/FarcasterContractOptions)): Readonly;

`

### Parameters

##### options

 The thirdweb client and an optional custom chain.

#### Type

`let options: { chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain); client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient) };

`

### Returns

##### Return Type

`let returnType: Readonly;

`

 The KeyGateway contract instance.
## getNonce

 Retrieves the current key gateway nonce for an account.

### Example

`import { getNonce } from "thirdweb/extensions/farcaster";

const nonce = await getNonce({

 client,

 address,

});

`

##### Signature

`function getNonce(options: [GetNonceParams](https://portal.thirdweb.com/references/typescript/v5/GetNonceParams)): Promise<bigint>;

`

### Parameters

##### options

 Parameters to pass to the function.

#### Type

`let options: {

address: Address;

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

disableCache?: boolean;

};

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 A promise that resolves to the current nonce.
## getRegisterData

 Constructs the data required for signing a register message in the Farcaster ID Gateway. This includes the EIP-712 domain, types, and the message to be signed.

### Example

`import { getRegisterData } from "thirdweb/extensions/farcaster";

const data = getRegisterData(message);

`

##### Signature

`function getRegisterData(message: [RegisterMessage](https://portal.thirdweb.com/references/typescript/v5/RegisterMessage)): {

domain: {

readonly chainId: 10;

readonly name: "Farcaster IdGateway";

readonly verifyingContract: "0x00000000Fc25870C6eD6b6c7E41Fb078b7656f69";

readonly version: "1";

 };

message: [RegisterMessage](https://portal.thirdweb.com/references/typescript/v5/RegisterMessage);

primaryType: "Register";

types: {

readonly Register: readonly [

 { readonly name: "to"; readonly type: "address" },

 { readonly name: "recovery"; readonly type: "address" },

 { readonly name: "nonce"; readonly type: "uint256" },

 { readonly name: "deadline"; readonly type: "uint256" },

 ];

 };

};

`

### Parameters

##### message

 The register message containing the necessary information for the signature.

#### Type

`let message: {

deadline: bigint;

nonce: bigint;

recovery: Address;

to: Address;

};

`

### Returns

##### Return Type

`let returnType: {

domain: {

readonly chainId: 10;

readonly name: "Farcaster IdGateway";

readonly verifyingContract: "0x00000000Fc25870C6eD6b6c7E41Fb078b7656f69";

readonly version: "1";

 };

message: [RegisterMessage](https://portal.thirdweb.com/references/typescript/v5/RegisterMessage);

primaryType: "Register";

types: {

readonly Register: readonly [

 { readonly name: "to"; readonly type: "address" },

 { readonly name: "recovery"; readonly type: "address" },

 { readonly name: "nonce"; readonly type: "uint256" },

 { readonly name: "deadline"; readonly type: "uint256" },

 ];

 };

};

`

 An object containing the EIP-712 domain, types, and the message, ready to be signed.
## getRegistrationPrice

 Retrieves the current cost to register a Farcaster fid in wei.

### Example

`import { getRegistrationPrice } from "thirdweb/extensions/farcaster";

const price = await getRegistrationPrice({

 client,

});

`

##### Signature

`function getRegistrationPrice(

options: [GetRegistrationPriceParams](https://portal.thirdweb.com/references/typescript/v5/GetRegistrationPriceParams),

): Promise<bigint>;

`

### Parameters

##### options

 An object containing a client to use to fetch the price and the amount of extra storage to include in the returned price.

#### Type

`let options: {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

disableCache?: boolean;

extraStorage?: bigint | number | string;

};

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 A promise that resolves to the current cost of a Farcaster fid in wei.
## getKeyRequestData

 Prepares the data required for signing a key request using EIP-712 typed data signing. This includes the domain, types, primary type, and the message to be signed.

### Example

`const message = {

 requestFid: 123456789n,

 key: "0x04bfc...",

 deadline: 1657758061n,

};

const eip712Data = getKeyRequestData(message);

`

##### Signature

`function getKeyRequestData(message: [SignedKeyRequestMessage](https://portal.thirdweb.com/references/typescript/v5/SignedKeyRequestMessage)): {

domain: {

readonly chainId: 10;

readonly name: "Farcaster SignedKeyRequestValidator";

readonly verifyingContract: "0x00000000FC700472606ED4fA22623Acf62c60553";

readonly version: "1";

 };

message: [SignedKeyRequestMessage](https://portal.thirdweb.com/references/typescript/v5/SignedKeyRequestMessage);

primaryType: "SignedKeyRequest";

types: {

readonly SignedKeyRequest: Array<{ name: string; type: string }>;

 };

};

`

### Parameters

##### message

 The message to be signed, containing the request FID, key, and deadline.

#### Type

`let message: { deadline: bigint; key: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex); requestFid: bigint };

`

### Returns

##### Return Type

`let returnType: {

domain: {

readonly chainId: 10;

readonly name: "Farcaster SignedKeyRequestValidator";

readonly verifyingContract: "0x00000000FC700472606ED4fA22623Acf62c60553";

readonly version: "1";

 };

message: [SignedKeyRequestMessage](https://portal.thirdweb.com/references/typescript/v5/SignedKeyRequestMessage);

primaryType: "SignedKeyRequest";

types: {

readonly SignedKeyRequest: Array<{ name: string; type: string }>;

 };

};

`

 An object containing the domain, types, primary type, and the message for EIP-712 signing.
## getSignedKeyRequestMetadata

 Generates the signed key request metadata to add a signer to an account. This function can either sign a new key request using an account object or use an existing key request signature. It prepares the metadata necessary for transactions involving signed key requests.

### Example

`import { getSignedKeyRequestMetadata } from "thirdweb/extensions/farcaster";

// Using an existing signature

const signedMetadata = await getSignedKeyRequestMetadata({

 keyRequestSignature: "0xabcd...",

 accountAddress: "0x123...",

 message: {

 requestFid: 123456789n,

 deadline: 1657758061n,

 },

});

// Signing a new key request

const signedMetadata = await getSignedKeyRequestMetadata({

 account,

 message: {

 requestFid: 123456789n,

 deadline: 1657758061n,

 },

});

`

##### Signature

`` function getSignedKeyRequestMetadata(

options: [SignedKeyRequestMetadataOptions](https://portal.thirdweb.com/references/typescript/v5/SignedKeyRequestMetadataOptions),

): Promise<`0x${string}`>;

 ``

### Parameters

##### options

 The options for signing the key request or using an existing signature.

#### Type

`let options: Prettify<

 { message: [SignedKeyRequestMessage](https://portal.thirdweb.com/references/typescript/v5/SignedKeyRequestMessage) } & (

| { account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account) }

| { accountAddress: Address; keyRequestSignature: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex) }

 )

>;

`

### Returns

##### Return Type

`` let returnType: Promise<`0x${string}`>;

 ``

 A promise that resolves to the hexadecimal string of the encoded ABI parameters.
## getStoragePrice

 Retrieves the current cost to register a Farcaster fid in wei.

### Example

`import { getStoragePrice } from "thirdweb/extensions/farcaster";

const price = await getStoragePrice({

 client,

});

`

##### Signature

`function getStoragePrice(

options: [GetStoragePriceParams](https://portal.thirdweb.com/references/typescript/v5/GetStoragePriceParams),

): Promise<bigint>;

`

### Parameters

##### options

 An object containing a client to use to fetch the price and the amount of extra storage to include in the returned price.

#### Type

`let options: {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

disableCache?: boolean;

units?: bigint | number | string;

};

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 A promise that resolves to the current cost of a Farcaster fid in USD.
## batchRent

 Prepares a transaction to call the "batchRent" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { batchRent } from "thirdweb/extensions/farcaster";

const transaction = batchRent({

 contract,

 fids: ...,

 units: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function batchRent(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

BatchRentParams | { asyncParams: () => Promise<BatchRentParams> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "batchRent" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

BatchRentParams | { asyncParams: () => Promise<BatchRentParams> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## getStorageRegistry

 Retrieves the StorageRegistry contract.

### Example

`import { getStorageRegistry } from "thirdweb/extensions/farcaster";

const storageRegistry = await getStorageRegistry({

 client,

});

`

##### Signature

`function getStorageRegistry(

options: [FarcasterContractOptions](https://portal.thirdweb.com/references/typescript/v5/FarcasterContractOptions),

): Readonly;

`

### Parameters

##### options

 The thirdweb client and an optional custom chain.

#### Type

`let options: { chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain); client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient) };

`

### Returns

##### Return Type

`let returnType: Readonly;

`

 The StorageRegistry contract instance.
## idGateway

 Calls the "idGateway" function on the contract.

### Example

`import { idGateway } from "thirdweb/extensions/farcaster";

const result = await idGateway({

 contract,

});

`

##### Signature

`function idGateway(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)): Promise<string>;

`

### Parameters

##### options

 The options for the idGateway function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## idCounter

 Calls the "idCounter" function on the contract.

### Example

`import { idCounter } from "thirdweb/extensions/farcaster";

const result = await idCounter({

 contract,

});

`

##### Signature

`function idCounter(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)): Promise<bigint>;

`

### Parameters

##### options

 The options for the idCounter function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## getUsdRegistrationPrice

 Retrieves the current cost to register a Farcaster fid in USD.

### Example

`import { getUsdRegistrationPrice } from "thirdweb/extensions/farcaster";

const price = await getUsdRegistrationPrice({

 client,

});

`

##### Signature

`function getUsdRegistrationPrice(

options: [GetUsdRegistrationPriceParams](https://portal.thirdweb.com/references/typescript/v5/GetUsdRegistrationPriceParams),

): Promise<number>;

`

### Parameters

##### options

 An object containing a client to use to fetch the price and the amount of extra storage to include in the returned price.

#### Type

`let options: {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

disableCache?: boolean;

extraStorage?: bigint | number | string;

};

`

### Returns

##### Return Type

`let returnType: Promise<number>;

`

 A promise that resolves to the current cost of a Farcaster fid in USD.
## idGateway

 Calls the "idGateway" function on the contract.

### Example

`import { idGateway } from "thirdweb/extensions/farcaster";

const result = await idGateway({

 contract,

});

`

##### Signature

`function idGateway(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)): Promise<string>;

`

### Parameters

##### options

 The options for the idGateway function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## idOf

 Calls the "idOf" function on the contract.

### Example

`import { idOf } from "thirdweb/extensions/farcaster";

const result = await idOf({

 contract,

 owner: ...,

});

`

##### Signature

`function idOf(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IdOfParams](https://portal.thirdweb.com/references/typescript/v5/IdOfParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the idOf function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IdOfParams](https://portal.thirdweb.com/references/typescript/v5/IdOfParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## getUsdStoragePrice

 Retrieves the current cost to register a Farcaster fid in USD.

### Example

`import { getUsdStoragePrice } from "thirdweb/extensions/farcaster";

const price = await getUsdStoragePrice({

 client,

});

`

##### Signature

`function getUsdStoragePrice(

options: [GetUsdStoragePriceParams](https://portal.thirdweb.com/references/typescript/v5/GetUsdStoragePriceParams),

): Promise<number>;

`

### Parameters

##### options

 An object containing a client to use to fetch the price and the amount of extra storage to include in the returned price.

#### Type

`let options: {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

disableCache?: boolean;

units?: bigint | number | string;

};

`

### Returns

##### Return Type

`let returnType: Promise<number>;

`

 A promise that resolves to the current cost of a Farcaster fid in USD.
## getIdRegistry

 Retrieves the IdRegistry contract.

### Example

`import { getIdRegistry } from "thirdweb/extensions/farcaster";

const idRegistry = await getIdRegistry({

 client,

});

`

##### Signature

`function getIdRegistry(options: [FarcasterContractOptions](https://portal.thirdweb.com/references/typescript/v5/FarcasterContractOptions)): Readonly;

`

### Parameters

##### options

 The thirdweb client and an optional custom chain.

#### Type

`let options: { chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain); client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient) };

`

### Returns

##### Return Type

`let returnType: Readonly;

`

 The IdRegistry contract instance.
## keyDataOf

 Calls the "keyDataOf" function on the contract.

### Example

`import { keyDataOf } from "thirdweb/extensions/farcaster";

const result = await keyDataOf({

 contract,

 fid: ...,

 key: ...,

});

`

##### Signature

`function keyDataOf(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<KeyDataOfParams>,

): Promise<string>;

`

### Parameters

##### options

 The options for the keyDataOf function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<KeyDataOfParams>;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## idRegistry

 Calls the "idRegistry" function on the contract.

### Example

`import { idRegistry } from "thirdweb/extensions/farcaster";

const result = await idRegistry({

 contract,

});

`

##### Signature

`function idRegistry(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)): Promise<string>;

`

### Parameters

##### options

 The options for the idRegistry function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## keyGateway

 Calls the "keyGateway" function on the contract.

### Example

`import { keyGateway } from "thirdweb/extensions/farcaster";

const result = await keyGateway({

 contract,

});

`

##### Signature

`function keyGateway(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)): Promise<string>;

`

### Parameters

##### options

 The options for the keyGateway function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## keyRegistry

 Calls the "keyRegistry" function on the contract.

### Example

`import { keyRegistry } from "thirdweb/extensions/farcaster";

const result = await keyRegistry({

 contract,

});

`

##### Signature

`function keyRegistry(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<string>;

`

### Parameters

##### options

 The options for the keyRegistry function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## keyAt

 Calls the "keyAt" function on the contract.

### Example

`import { keyAt } from "thirdweb/extensions/farcaster";

const result = await keyAt({

 contract,

 fid: ...,

 state: ...,

 index: ...,

});

`

##### Signature

`` function keyAt(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<KeyAtParams>,

): Promise<`0x${string}`>;

 ``

### Parameters

##### options

 The options for the keyAt function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<KeyAtParams>;

`

### Returns

##### Return Type

`` let returnType: Promise<`0x${string}`>;

 ``

 The parsed result of the function call.
## keyGateway

 Calls the "keyGateway" function on the contract.

### Example

`import { keyGateway } from "thirdweb/extensions/farcaster";

const result = await keyGateway({

 contract,

});

`

##### Signature

`function keyGateway(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)): Promise<string>;

`

### Parameters

##### options

 The options for the keyGateway function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## keysOf

 Calls the "keysOf" function on the contract.

### Example

`import { keysOf } from "thirdweb/extensions/farcaster";

const result = await keysOf({

 contract,

 fid: ...,

 state: ...,

});

`

##### Signature

`` function keysOf(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<KeysOfParams>) : Promise<readonly Array<`0x${string}`>>

 ``

### Parameters

##### options

 The options for the keysOf function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<KeysOfParams>;

`

### Returns

##### Return Type

`` let returnType: Promise<readonly Array<`0x${string}`>>

 ``

 The parsed result of the function call.
## nonces

 Calls the "nonces" function on the contract.

### Example

`import { nonces } from "thirdweb/extensions/farcaster";

const result = await nonces({

 contract,

 account: ...,

});

`

##### Signature

`function nonces(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[NoncesParams](https://portal.thirdweb.com/references/typescript/v5/NoncesParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the nonces function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[NoncesParams](https://portal.thirdweb.com/references/typescript/v5/NoncesParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## maxUnits

 Calls the "maxUnits" function on the contract.

### Example

`import { maxUnits } from "thirdweb/extensions/farcaster";

const result = await maxUnits({

 contract,

});

`

##### Signature

`function maxUnits(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)): Promise<bigint>;

`

### Parameters

##### options

 The options for the maxUnits function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## maxKeysPerFid

 Calls the "maxKeysPerFid" function on the contract.

### Example

`import { maxKeysPerFid } from "thirdweb/extensions/farcaster";

const result = await maxKeysPerFid({

 contract,

});

`

##### Signature

`function maxKeysPerFid(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the maxKeysPerFid function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## price

 Calls the "price" function on the contract.

### Example

`import { price } from "thirdweb/extensions/farcaster";

const result = await price({

 contract,

 extraStorage: ...,

});

`

##### Signature

`function price(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[PriceParams](https://portal.thirdweb.com/references/typescript/v5/PriceParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the price function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[PriceParams](https://portal.thirdweb.com/references/typescript/v5/PriceParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## price

 Calls the "price" function on the contract.

### Example

`import { price } from "thirdweb/extensions/farcaster";

const result = await price({

 contract,

 units: ...,

});

`

##### Signature

`function price(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[PriceParams](https://portal.thirdweb.com/references/typescript/v5/PriceParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the price function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[PriceParams](https://portal.thirdweb.com/references/typescript/v5/PriceParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## price

 Calls the "price" function on the contract.

### Example

`import { price } from "thirdweb/extensions/farcaster";

const result = await price({

 contract,

 extraStorage: ...,

});

`

##### Signature

`function price(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[PriceParams](https://portal.thirdweb.com/references/typescript/v5/PriceParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the price function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[PriceParams](https://portal.thirdweb.com/references/typescript/v5/PriceParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## recoverEvent

 Creates an event object for the Recover event.

### Example

`import { getContractEvents } from "thirdweb";

import { recoverEvent } from "thirdweb/extensions/farcaster";

const events = await getContractEvents({

contract,

events: [

recoverEvent({

 from: ...,

 to: ...,

 id: ...,

})

],

});

`

##### Signature

`function recoverEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "from";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "to";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "id";

readonly type: "uint256";

 },

 ];

readonly name: "Recover";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "from";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "to";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "id";

readonly type: "uint256";

 },

 ];

readonly name: "Recover";

readonly type: "event";

}>;

`

 The prepared event object.
## idRegistry

 Calls the "idRegistry" function on the contract.

### Example

`import { idRegistry } from "thirdweb/extensions/farcaster";

const result = await idRegistry({

 contract,

});

`

##### Signature

`function idRegistry(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)): Promise<string>;

`

### Parameters

##### options

 The options for the idRegistry function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## recover

 Prepares a transaction to call the "recover" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { recover } from "thirdweb/extensions/farcaster";

const transaction = recover({

 contract,

 from: ...,

 to: ...,

 deadline: ...,

 sig: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function recover(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[RecoverParams](https://portal.thirdweb.com/references/typescript/v5/RecoverParams) | { asyncParams: () => Promise<[RecoverParams](https://portal.thirdweb.com/references/typescript/v5/RecoverParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "recover" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[RecoverParams](https://portal.thirdweb.com/references/typescript/v5/RecoverParams) | { asyncParams: () => Promise<[RecoverParams](https://portal.thirdweb.com/references/typescript/v5/RecoverParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## register

 Prepares a transaction to call the "register" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { register } from "thirdweb/extensions/farcaster";

const transaction = register({

 contract,

 recovery: ...,

 extraStorage: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function register(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[RegisterParams](https://portal.thirdweb.com/references/typescript/v5/RegisterParams) | { asyncParams: () => Promise<[RegisterParams](https://portal.thirdweb.com/references/typescript/v5/RegisterParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "register" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[RegisterParams](https://portal.thirdweb.com/references/typescript/v5/RegisterParams) | { asyncParams: () => Promise<[RegisterParams](https://portal.thirdweb.com/references/typescript/v5/RegisterParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## register

 Prepares a transaction to call the "register" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { register } from "thirdweb/extensions/farcaster";

const transaction = register({

 contract,

 registerParams: ...,

 signerParams: ...,

 extraStorage: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function register(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[RegisterParams](https://portal.thirdweb.com/references/typescript/v5/RegisterParams) | { asyncParams: () => Promise<[RegisterParams](https://portal.thirdweb.com/references/typescript/v5/RegisterParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "register" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[RegisterParams](https://portal.thirdweb.com/references/typescript/v5/RegisterParams) | { asyncParams: () => Promise<[RegisterParams](https://portal.thirdweb.com/references/typescript/v5/RegisterParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## recoverFor

 Prepares a transaction to call the "recoverFor" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { recoverFor } from "thirdweb/extensions/farcaster";

const transaction = recoverFor({

 contract,

 from: ...,

 to: ...,

 recoveryDeadline: ...,

 recoverySig: ...,

 toDeadline: ...,

 toSig: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function recoverFor(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [RecoverForParams](https://portal.thirdweb.com/references/typescript/v5/RecoverForParams)

| { asyncParams: () => Promise<[RecoverForParams](https://portal.thirdweb.com/references/typescript/v5/RecoverForParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "recoverFor" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[RecoverForParams](https://portal.thirdweb.com/references/typescript/v5/RecoverForParams) | { asyncParams: () => Promise<[RecoverForParams](https://portal.thirdweb.com/references/typescript/v5/RecoverForParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## recoveryOf

 Calls the "recoveryOf" function on the contract.

### Example

`import { recoveryOf } from "thirdweb/extensions/farcaster";

const result = await recoveryOf({

 contract,

 fid: ...,

});

`

##### Signature

`function recoveryOf(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[RecoveryOfParams](https://portal.thirdweb.com/references/typescript/v5/RecoveryOfParams)>,

): Promise<string>;

`

### Parameters

##### options

 The options for the recoveryOf function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[RecoveryOfParams](https://portal.thirdweb.com/references/typescript/v5/RecoveryOfParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## registerFid

 Registers a Farcaster fid for the given wallet.

### Example

`import { registerFid } from "thirdweb/extensions/farcaster";

import { sendTransaction } from "thirdweb";

const transaction = registerFid({

 client,

 recoveryAddress,

});

await sendTransaction({ transaction, account });

`

##### Signature

`function registerFid(

options: [RegisterFidParams](https://portal.thirdweb.com/references/typescript/v5/RegisterFidParams),

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<[], AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for registering an account.

#### Type

`let options: {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

disableCache?: boolean;

extraStorage?: bigint | string | number;

recoveryAddress: Address;

};

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

 [],

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object to register the account.
## registerFidAndSigner

 Registers a Farcaster fid and signer for the given wallet using the provided app account.

### Example

`import { registerFidAndSigner } from "thirdweb/extensions/farcaster";

import { sendTransaction } from "thirdweb";

const transaction = registerFidAndSigner({

 client,

 userAccount,

 appAccount,

 recoveryAddress,

 signerPublicKey,

});

await sendTransaction({ transaction, account });

`

##### Signature

`function registerFidAndSigner(

options: [RegisterFidAndSignerParams](https://portal.thirdweb.com/references/typescript/v5/RegisterFidAndSignerParams),

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<[], AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for registering an account.

#### Type

`let options: Prettify<

 {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

disableCache?: boolean;

extraStorage?: bigint | number;

recoveryAddress: Address;

signerPublicKey: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

 } & (

| { userAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account) }

| {

addSignature: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

deadline: bigint;

registerSignature: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

userAddress: Address;

 }

 ) &

 (

| { appAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account) }

| {

appAccountAddress: Address;

deadline: bigint;

signedKeyRequestMetadata: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

 }

 )

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

 [],

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object to register the account.
## registerEvent

 Creates an event object for the Register event.

### Example

`import { getContractEvents } from "thirdweb";

import { registerEvent } from "thirdweb/extensions/farcaster";

const events = await getContractEvents({

contract,

events: [

registerEvent({

 to: ...,

 id: ...,

})

],

});

`

##### Signature

`function registerEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "to";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "id";

readonly type: "uint256";

 },

 { readonly name: "recovery"; readonly type: "address" },

 ];

readonly name: "Register";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "to";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "id";

readonly type: "uint256";

 },

 { readonly name: "recovery"; readonly type: "address" },

 ];

readonly name: "Register";

readonly type: "event";

}>;

`

 The prepared event object.
## registerFor

 Prepares a transaction to call the "registerFor" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { registerFor } from "thirdweb/extensions/farcaster";

const transaction = registerFor({

 contract,

 to: ...,

 recovery: ...,

 deadline: ...,

 sig: ...,

 extraStorage: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function registerFor(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [RegisterForParams](https://portal.thirdweb.com/references/typescript/v5/RegisterForParams)

| { asyncParams: () => Promise<[RegisterForParams](https://portal.thirdweb.com/references/typescript/v5/RegisterForParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "registerFor" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [RegisterForParams](https://portal.thirdweb.com/references/typescript/v5/RegisterForParams)

| { asyncParams: () => Promise<[RegisterForParams](https://portal.thirdweb.com/references/typescript/v5/RegisterForParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## remove

 Prepares a transaction to call the "remove" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { remove } from "thirdweb/extensions/farcaster";

const transaction = remove({

 contract,

 key: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function remove(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[RemoveParams](https://portal.thirdweb.com/references/typescript/v5/RemoveParams) | { asyncParams: () => Promise<[RemoveParams](https://portal.thirdweb.com/references/typescript/v5/RemoveParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "remove" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[RemoveParams](https://portal.thirdweb.com/references/typescript/v5/RemoveParams) | { asyncParams: () => Promise<[RemoveParams](https://portal.thirdweb.com/references/typescript/v5/RemoveParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## removeEvent

 Creates an event object for the Remove event.

### Example

`import { getContractEvents } from "thirdweb";

import { removeEvent } from "thirdweb/extensions/farcaster";

const events = await getContractEvents({

contract,

events: [

removeEvent({

 fid: ...,

 key: ...,

})

],

});

`

##### Signature

`function removeEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "fid";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "key";

readonly type: "bytes";

 },

 { readonly name: "keyBytes"; readonly type: "bytes" },

 ];

readonly name: "Remove";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "fid";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "key";

readonly type: "bytes";

 },

 { readonly name: "keyBytes"; readonly type: "bytes" },

 ];

readonly name: "Remove";

readonly type: "event";

}>;

`

 The prepared event object.
## rent

 Prepares a transaction to call the "rent" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { rent } from "thirdweb/extensions/farcaster";

const transaction = rent({

 contract,

 fid: ...,

 units: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function rent(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

RentParams | { asyncParams: () => Promise<RentParams> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "rent" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

RentParams | { asyncParams: () => Promise<RentParams> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## removeFor

 Prepares a transaction to call the "removeFor" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { removeFor } from "thirdweb/extensions/farcaster";

const transaction = removeFor({

 contract,

 fidOwner: ...,

 key: ...,

 deadline: ...,

 sig: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function removeFor(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

RemoveForParams | { asyncParams: () => Promise<RemoveForParams> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "removeFor" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

RemoveForParams | { asyncParams: () => Promise<RemoveForParams> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## rentStorage

 Rent storage for the provided farcaster fid.

### Example

`import { rentStorage } from "thirdweb/extensions/farcaster";

import { sendTransaction } from "thirdweb";

const transaction = rentStorage({

 client,

 fid,

 units,

});

await sendTransaction({ transaction, account });

`

##### Signature

`function rentStorage(

options: [RentStorageParams](https://portal.thirdweb.com/references/typescript/v5/RentStorageParams),

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<[], AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for calling the `rentStorage` function.

#### Type

`let options: {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

disableCache?: boolean;

fid: bigint | number | string;

units?: bigint | number | string;

};

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

 [],

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object to rent the storage.
## setIdCounterEvent

 Creates an event object for the SetIdCounter event.

### Example

`import { getContractEvents } from "thirdweb";

import { setIdCounterEvent } from "thirdweb/extensions/farcaster";

const events = await getContractEvents({

 contract,

 events: [setIdCounterEvent()],

});

`

##### Signature

`function setIdCounterEvent(): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "oldCounter"; readonly type: "uint256" },

 { readonly name: "newCounter"; readonly type: "uint256" },

 ];

readonly name: "SetIdCounter";

readonly type: "event";

}>;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "oldCounter"; readonly type: "uint256" },

 { readonly name: "newCounter"; readonly type: "uint256" },

 ];

readonly name: "SetIdCounter";

readonly type: "event";

}>;

`

 The prepared event object.
## setIdRegistryEvent

 Creates an event object for the SetIdRegistry event.

### Example

`import { getContractEvents } from "thirdweb";

import { setIdRegistryEvent } from "thirdweb/extensions/farcaster";

const events = await getContractEvents({

 contract,

 events: [setIdRegistryEvent()],

});

`

##### Signature

`function setIdRegistryEvent(): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "oldIdRegistry"; readonly type: "address" },

 { readonly name: "newIdRegistry"; readonly type: "address" },

 ];

readonly name: "SetIdRegistry";

readonly type: "event";

}>;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "oldIdRegistry"; readonly type: "address" },

 { readonly name: "newIdRegistry"; readonly type: "address" },

 ];

readonly name: "SetIdRegistry";

readonly type: "event";

}>;

`

 The prepared event object.
## setIdGatewayEvent

 Creates an event object for the SetIdGateway event.

### Example

`import { getContractEvents } from "thirdweb";

import { setIdGatewayEvent } from "thirdweb/extensions/farcaster";

const events = await getContractEvents({

 contract,

 events: [setIdGatewayEvent()],

});

`

##### Signature

`function setIdGatewayEvent(): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "oldIdGateway"; readonly type: "address" },

 { readonly name: "newIdGateway"; readonly type: "address" },

 ];

readonly name: "SetIdGateway";

readonly type: "event";

}>;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "oldIdGateway"; readonly type: "address" },

 { readonly name: "newIdGateway"; readonly type: "address" },

 ];

readonly name: "SetIdGateway";

readonly type: "event";

}>;

`

 The prepared event object.
## setKeyGatewayEvent

 Creates an event object for the SetKeyGateway event.

### Example

`import { getContractEvents } from "thirdweb";

import { setKeyGatewayEvent } from "thirdweb/extensions/farcaster";

const events = await getContractEvents({

 contract,

 events: [setKeyGatewayEvent()],

});

`

##### Signature

`function setKeyGatewayEvent(): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "oldKeyGateway"; readonly type: "address" },

 { readonly name: "newKeyGateway"; readonly type: "address" },

 ];

readonly name: "SetKeyGateway";

readonly type: "event";

}>;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "oldKeyGateway"; readonly type: "address" },

 { readonly name: "newKeyGateway"; readonly type: "address" },

 ];

readonly name: "SetKeyGateway";

readonly type: "event";

}>;

`

 The prepared event object.
## rentedUnits

 Calls the "rentedUnits" function on the contract.

### Example

`import { rentedUnits } from "thirdweb/extensions/farcaster";

const result = await rentedUnits({

 contract,

});

`

##### Signature

`function rentedUnits(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the rentedUnits function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## setValidatorEvent

 Creates an event object for the SetValidator event.

### Example

`import { getContractEvents } from "thirdweb";

import { setValidatorEvent } from "thirdweb/extensions/farcaster";

const events = await getContractEvents({

 contract,

 events: [setValidatorEvent()],

});

`

##### Signature

`function setValidatorEvent(): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "keyType"; readonly type: "uint32" },

 { readonly name: "metadataType"; readonly type: "uint8" },

 { readonly name: "oldValidator"; readonly type: "address" },

 { readonly name: "newValidator"; readonly type: "address" },

 ];

readonly name: "SetValidator";

readonly type: "event";

}>;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "keyType"; readonly type: "uint32" },

 { readonly name: "metadataType"; readonly type: "uint8" },

 { readonly name: "oldValidator"; readonly type: "address" },

 { readonly name: "newValidator"; readonly type: "address" },

 ];

readonly name: "SetValidator";

readonly type: "event";

}>;

`

 The prepared event object.
## setStorageRegistryEvent

 Creates an event object for the SetStorageRegistry event.

### Example

`import { getContractEvents } from "thirdweb";

import { setStorageRegistryEvent } from "thirdweb/extensions/farcaster";

const events = await getContractEvents({

 contract,

 events: [setStorageRegistryEvent()],

});

`

##### Signature

`function setStorageRegistryEvent(): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "oldStorageRegistry"; readonly type: "address" },

 { readonly name: "newStorageRegistry"; readonly type: "address" },

 ];

readonly name: "SetStorageRegistry";

readonly type: "event";

}>;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "oldStorageRegistry"; readonly type: "address" },

 { readonly name: "newStorageRegistry"; readonly type: "address" },

 ];

readonly name: "SetStorageRegistry";

readonly type: "event";

}>;

`

 The prepared event object.
## signAdd

 Signs an Add message using the account's signTypedData method.

### Example

`const signedMessage = await signAdd({

 account: yourAccount,

 message: yourAddMessage,

});

`

##### Signature

`` function signAdd(options: [SignAddOptions](https://portal.thirdweb.com/references/typescript/v5/SignAddOptions)): Promise<`0x${string}`>;

 ``

### Parameters

##### options

 The options for signing the Add message.

#### Type

`let options: { account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account); message: [AddMessage](https://portal.thirdweb.com/references/typescript/v5/AddMessage) };

`

### Returns

##### Return Type

`` let returnType: Promise<`0x${string}`>;

 ``

 A promise that resolves to the signature of the Add message.
## signRegister

 Signs the register message for Farcaster ID Gateway.

### Example

`const signature = await signRegister({ account, message });

`

##### Signature

`` function signRegister(

options: [SignRegisterOptions](https://portal.thirdweb.com/references/typescript/v5/SignRegisterOptions),

): Promise<`0x${string}`>;

 ``

### Parameters

##### options

 The signing options.

#### Type

`let options: { account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account); message: [RegisterMessage](https://portal.thirdweb.com/references/typescript/v5/RegisterMessage) };

`

### Returns

##### Return Type

`` let returnType: Promise<`0x${string}`>;

 ``

 A promise that resolves to the signature.
## setMaxKeysPerFidEvent

 Creates an event object for the SetMaxKeysPerFid event.

### Example

`import { getContractEvents } from "thirdweb";

import { setMaxKeysPerFidEvent } from "thirdweb/extensions/farcaster";

const events = await getContractEvents({

 contract,

 events: [setMaxKeysPerFidEvent()],

});

`

##### Signature

`function setMaxKeysPerFidEvent(): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "oldMax"; readonly type: "uint256" },

 { readonly name: "newMax"; readonly type: "uint256" },

 ];

readonly name: "SetMaxKeysPerFid";

readonly type: "event";

}>;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "oldMax"; readonly type: "uint256" },

 { readonly name: "newMax"; readonly type: "uint256" },

 ];

readonly name: "SetMaxKeysPerFid";

readonly type: "event";

}>;

`

 The prepared event object.
## storageRegistry

 Calls the "storageRegistry" function on the contract.

### Example

`import { storageRegistry } from "thirdweb/extensions/farcaster";

const result = await storageRegistry({

 contract,

});

`

##### Signature

`function storageRegistry(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<string>;

`

### Parameters

##### options

 The options for the storageRegistry function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## transferAndChangeRecovery

 Prepares a transaction to call the "transferAndChangeRecovery" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { transferAndChangeRecovery } from "thirdweb/extensions/farcaster";

const transaction = transferAndChangeRecovery({

 contract,

 to: ...,

 recovery: ...,

 deadline: ...,

 sig: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function transferAndChangeRecovery(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [TransferAndChangeRecoveryParams](https://portal.thirdweb.com/references/typescript/v5/TransferAndChangeRecoveryParams)

| { asyncParams: () => Promise<[TransferAndChangeRecoveryParams](https://portal.thirdweb.com/references/typescript/v5/TransferAndChangeRecoveryParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "transferAndChangeRecovery" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [TransferAndChangeRecoveryParams](https://portal.thirdweb.com/references/typescript/v5/TransferAndChangeRecoveryParams)

| { asyncParams: () => Promise<[TransferAndChangeRecoveryParams](https://portal.thirdweb.com/references/typescript/v5/TransferAndChangeRecoveryParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## totalKeys

 Calls the "totalKeys" function on the contract.

### Example

`import { totalKeys } from "thirdweb/extensions/farcaster";

const result = await totalKeys({

 contract,

 fid: ...,

 state: ...,

});

`

##### Signature

`function totalKeys(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<TotalKeysParams>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the totalKeys function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<TotalKeysParams>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## transfer

 Prepares a transaction to call the "transfer" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { transfer } from "thirdweb/extensions/farcaster";

const transaction = transfer({

 contract,

 to: ...,

 deadline: ...,

 sig: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function transfer(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[TransferParams](https://portal.thirdweb.com/references/typescript/v5/TransferParams) | { asyncParams: () => Promise<[TransferParams](https://portal.thirdweb.com/references/typescript/v5/TransferParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "transfer" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[TransferParams](https://portal.thirdweb.com/references/typescript/v5/TransferParams) | { asyncParams: () => Promise<[TransferParams](https://portal.thirdweb.com/references/typescript/v5/TransferParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## signKeyRequest

 Signs a key request message using EIP-712 typed data signing. This function prepares the data for signing, signs it with the provided account, and returns the signature.

### Example

`const message = {

 requestFid: 123456789n,

 key: "0x04bfc...",

 deadline: 1657758061n,

};

const signature = signKeyRequest({ account: signerAccount, message });

`

##### Signature

`` function signKeyRequest(

options: [SignKeyRequestOptions](https://portal.thirdweb.com/references/typescript/v5/SignKeyRequestOptions),

): Promise<`0x${string}`>;

 ``

### Parameters

##### options

 The options for signing the key request, including the account and the message.

#### Type

`let options: { account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account); message: [SignedKeyRequestMessage](https://portal.thirdweb.com/references/typescript/v5/SignedKeyRequestMessage) };

`

### Returns

##### Return Type

`` let returnType: Promise<`0x${string}`>;

 ``

 A promise that resolves to the signature of the key request.
## unitPrice

 Calls the "unitPrice" function on the contract.

### Example

`import { unitPrice } from "thirdweb/extensions/farcaster";

const result = await unitPrice({

 contract,

});

`

##### Signature

`function unitPrice(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)): Promise<bigint>;

`

### Parameters

##### options

 The options for the unitPrice function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## transferEvent

 Creates an event object for the Transfer event.

### Example

`import { getContractEvents } from "thirdweb";

import { transferEvent } from "thirdweb/extensions/farcaster";

const events = await getContractEvents({

contract,

events: [

transferEvent({

 from: ...,

 to: ...,

})

],

});

`

##### Signature

`function transferEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "from";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "to";

readonly type: "address";

 },

 { readonly name: "id"; readonly type: "uint256" },

 ];

readonly name: "Transfer";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "from";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "to";

readonly type: "address";

 },

 { readonly name: "id"; readonly type: "uint256" },

 ];

readonly name: "Transfer";

readonly type: "event";

}>;

`

 The prepared event object.
## transferFor

 Prepares a transaction to call the "transferFor" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { transferFor } from "thirdweb/extensions/farcaster";

const transaction = transferFor({

 contract,

 from: ...,

 to: ...,

 fromDeadline: ...,

 fromSig: ...,

 toDeadline: ...,

 toSig: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function transferFor(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [TransferForParams](https://portal.thirdweb.com/references/typescript/v5/TransferForParams)

| { asyncParams: () => Promise<[TransferForParams](https://portal.thirdweb.com/references/typescript/v5/TransferForParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "transferFor" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [TransferForParams](https://portal.thirdweb.com/references/typescript/v5/TransferForParams)

| { asyncParams: () => Promise<[TransferForParams](https://portal.thirdweb.com/references/typescript/v5/TransferForParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## verifyFidSignature

 Calls the "verifyFidSignature" function on the contract.

### Example

`import { verifyFidSignature } from "thirdweb/extensions/farcaster";

const result = await verifyFidSignature({

 contract,

 custodyAddress: ...,

 fid: ...,

 digest: ...,

 sig: ...,

});

`

##### Signature

`function verifyFidSignature(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[VerifyFidSignatureParams](https://portal.thirdweb.com/references/typescript/v5/VerifyFidSignatureParams)>,

): Promise<boolean>;

`

### Parameters

##### options

 The options for the verifyFidSignature function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[VerifyFidSignatureParams](https://portal.thirdweb.com/references/typescript/v5/VerifyFidSignatureParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 The parsed result of the function call.
## formatNumber

 Round up a number to a certain decimal place

### Example

`import { formatNumber } from "thirdweb/utils";

const value = formatNumber(12.1214141, 1); // 12.1

`

##### Signature

`function formatNumber(value: number, decimalPlaces: number): number;

`

### Parameters

##### value

#### Type

`let value: number;

`

##### decimalPlaces

#### Type

`let decimalPlaces: number;

`

### Returns

##### Return Type

`let returnType: number;

`
## fetchPublishedContract

 Fetches the published contract based on the provided options.

### Example

`const publishedContract = await fetchPublishedContract({

 publisherAddress: "0x1234",

 contractName: "MyContract",

 version: "1.0.0",

 client: client,

});

`

##### Signature

`` function fetchPublishedContract(

options: FetchPublishedContractOptions,

): Promise<{

bytecodeHash: `0x${string}`;

contractId: string;

implementation: string;

publishMetadataUri: string;

publishTimestamp: bigint;

}>;

 ``

### Parameters

##### options

 The options for fetching the published contract.

#### Type

`let options: FetchPublishedContractOptions;

`

### Returns

##### Return Type

`` let returnType: Promise<{

bytecodeHash: `0x${string}`;

contractId: string;

implementation: string;

publishMetadataUri: string;

publishTimestamp: bigint;

}>;

 ``

 The published contract.
## usdUnitPrice

 Calls the "usdUnitPrice" function on the contract.

### Example

`import { usdUnitPrice } from "thirdweb/extensions/farcaster";

const result = await usdUnitPrice({

 contract,

});

`

##### Signature

`function usdUnitPrice(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the usdUnitPrice function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## fromGwei

 Converts the specified number from gwei to wei.

### Example

`import { fromGwei } from "thirdweb/utils";

fromGwei("1");

// 1000000000n

`

##### Signature

`function fromGwei(gwei: string): bigint;

`

### Parameters

##### gwei

 The number of gwei to convert.

#### Type

`let gwei: string;

`

### Returns

##### Return Type

`let returnType: bigint;

`

 The converted value in wei.
## fromBytes

 Converts a Uint8Array to the specified type.

### Example

`import { fromBytes } from "thirdweb/utils";

const bytes = new Uint8Array([1, 164]);

const number = fromBytes(bytes, "number");

console.log(number); // 420

`

##### Signature

`function fromBytes(

bytes: Uint8Array,

toOrOpts: [FromBytesParameters](https://portal.thirdweb.com/references/typescript/v5/FromBytesParameters)<TTo>,

): [FromBytesReturnType](https://portal.thirdweb.com/references/typescript/v5/FromBytesReturnType)<TTo>;

`

### Parameters

##### bytes

 The Uint8Array to convert.

#### Type

`let bytes: Uint8Array;

`

##### toOrOpts

 The target type or conversion options.

#### Type

`let toOrOpts: [FromBytesParameters](https://portal.thirdweb.com/references/typescript/v5/FromBytesParameters)<TTo>;

`

### Returns

##### Return Type

`let returnType: [FromBytesReturnType](https://portal.thirdweb.com/references/typescript/v5/FromBytesReturnType)<TTo>;

`

 The converted value of the specified type.
## fromHex

 Converts a hexadecimal string to the specified type.

### Example

`import { fromHex } from "thirdweb/utils";

const string = fromHex("0x48656c6c6f2c20776f726c6421", "string");

console.log(string); // "Hello, world!"

`

##### Signature

`` function fromHex(

hex: `0x${string}`,

toOrOpts: [FromHexParameters](https://portal.thirdweb.com/references/typescript/v5/FromHexParameters)<TTo>,

): [FromHexReturnType](https://portal.thirdweb.com/references/typescript/v5/FromHexReturnType)<TTo>;

 ``

### Parameters

##### hex

 The hexadecimal string to convert.

#### Type

`` let hex: `0x${string}`;

 ``

##### toOrOpts

 The target type or conversion options.

#### Type

`let toOrOpts: [FromHexParameters](https://portal.thirdweb.com/references/typescript/v5/FromHexParameters)<TTo>;

`

### Returns

##### Return Type

`let returnType: [FromHexReturnType](https://portal.thirdweb.com/references/typescript/v5/FromHexReturnType)<TTo>;

`

 The converted value of the specified type.
## getActiveWalletConnectSessions

 Retrieves all active WalletConnect sessions.

### Example

`import { getActiveWalletConnectSessions } from "thirdweb/wallets";

const sessions = await getActiveWalletConnectSessions();

`

##### Signature

`function getActiveWalletConnectSessions(): Promise<

Array<[WalletConnectSession](https://portal.thirdweb.com/references/typescript/v5/WalletConnectSession)>

>;

`

### Returns

##### Return Type

`let returnType: { origin?: string; topic: string };

`

 All active WalletConnect sessions.
## getApprovalForTransaction

 When dealing with transactions that involve ERC20 tokens (Airdropping ERC20, buy NFTs with ERC20, etc.) you often have to do a pre-check to see if the targeted contract has the sufficient allowance to "take" the ERC20 tokens from the caller's wallet.

 This extension is a handy method that checks for the allowance and requests to approve for more if current allowance is insufficient

### Example

`import { getApprovalForTransaction } from "thirdweb/extensions/erc20";

import { sendAndConfirmTransaction } from "thirdweb";

async function buyNFT() {

const buyTransaction = ... // could be a marketplacev3's buyFromListing

// Check if you need to approve spending for the involved ERC20 contract

const approveTx = await getApprovalForTransaction({

 transaction: buyTransaction,

 account, // the connected account

 });

if (approveTx) {

await sendAndConfirmTransaction({

 transaction: approveTx,

 account,

 })

 }

// Once approved, you can finally perform the buy transaction

await sendAndConfirmTransaction({

 transaction: buyTransaction,

 account,

 });

}

`

##### Signature

`function getApprovalForTransaction(

options: [GetApprovalForTransactionParams](https://portal.thirdweb.com/references/typescript/v5/GetApprovalForTransactionParams),

): Promise<null | [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)>;

`

### Parameters

##### options

 GetApprovalForTransactionParams

#### Type

`let options: { account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account); transaction: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction) };

`

### Returns

##### Return Type

`let returnType: Readonly<options> & {

__contract?: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi>;

__preparedMethod?: () => Promise<PreparedMethod<abiFn>>;

};

`

 a PreparedTransaction
## generateAccount

 Generates a new account with a random private key.

### Example

`import { generateAccount } from "thirdweb/wallets";

const account = await generateAccount({ client });

`

##### Signature

`function generateAccount(

options: [GenerateAccountOptions](https://portal.thirdweb.com/references/typescript/v5/GenerateAccountOptions),

): Promise<[Account](https://portal.thirdweb.com/references/typescript/v5/Account)>;

`

### Parameters

##### options

 The options for generating the account.

#### Type

`let options: { client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient) };

`

### Returns

##### Return Type

`let returnType: {

address: Address;

estimateGas?: (tx: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)) => Promise<bigint>;

onTransactionRequested?: (

transaction: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any>,

 ) => Promise<void>;

sendBatchTransaction?: (

txs: Array<SendTransactionOption>,

 ) => Promise<SendTransactionResult>;

sendRawTransaction?: (

tx: SendRawTransactionOptions,

 ) => Promise<SendTransactionResult>;

sendTransaction: (

tx: SendTransactionOption,

 ) => Promise<SendTransactionResult>;

signAuthorization?: (

authorization: [AuthorizationRequest](https://portal.thirdweb.com/references/typescript/v5/AuthorizationRequest),

 ) => Promise<[SignedAuthorization](https://portal.thirdweb.com/references/typescript/v5/SignedAuthorization)>;

signMessage: ({

message,

originalMessage,

chainId,

 }: {

chainId?: number;

message: SignableMessage;

originalMessage?: string;

 }) => Promise<Hex>;

signTransaction?: (tx: SerializableTransaction) => Promise<Hex>;

signTypedData: (

_typedData: ox__TypedData.Definition<typedData, primaryType>,

 ) => Promise<Hex>;

watchAsset?: (asset: WatchAssetParams) => Promise<boolean>;

};

`

 A Thirdweb account.
## getBuyWithCryptoHistory

 Gets the History of purchases for a given wallet address

### Example

`import { createThirdwebClient } from "thirdweb";

import { BuyWithCryptoHistoryData } from "thirdweb/pay";

const client = createThirdwebClient({ clientId: "..." });

const walletAddress = "0x...";

const params = {

 client,

 walletAddress,

};

// grabs the history of purchase transactions for the wallet address

const status = await getBuyWithCryptoHistory(params);

`

##### Signature

`function getBuyWithCryptoHistory(

params: [BuyWithCryptoHistoryParams](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoHistoryParams),

): Promise<[BuyWithCryptoHistoryData](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoHistoryData)>;

`

### Parameters

##### params

 Object of type [BuyWithCryptoHistoryParams](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoHistoryParams)

#### Type

`let params: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

count: number;

start: number;

walletAddress: string;

};

`

### Returns

##### Return Type

`let returnType: {

hasNextPage: boolean;

page: Array<[BuyWithCryptoStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoStatus)>;

};

`

 Object of type [BuyWithCryptoHistoryData](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoHistoryData)
## getAddress

 Retrieves the address after performing validation and checksumming.

### Example

`import { getAddress } from "thirdweb/utils";

getAddress("0x5aAeb6053F3E94C9b9A09f33669435E7Ef1BeAed");

//=> '0x5aAeb6053F3E94C9b9A09f33669435E7Ef1BeAed'

`

##### Signature

`` function getAddress(address: string): `0x${string}`;

 ``

### Parameters

##### address

 The address to be validated and checksummed.

#### Type

`let address: string;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

 The validated and checksummed address.
## getBuyWithCryptoStatus

 Gets the status of a buy with crypto transaction

### Example

`import { sendTransaction } from "thirdweb";

import { getBuyWithCryptoStatus, getBuyWithCryptoQuote } from "thirdweb/pay";

// get a quote between two tokens

const quote = await getBuyWithCryptoQuote(quoteParams);

// if approval is required, send the approval transaction

if (quote.approval) {

const txResult = await sendTransaction({

 transaction: quote.approval,

 account: account, // account from connected wallet

 });

await waitForReceipt(txResult);

}

// send the quoted transaction

const swapTxResult = await sendTransaction({

 transaction: quote.transactionRequest,

 account: account, // account from connected wallet

 });

await waitForReceipt(swapTxResult);

// keep polling the status of the quoted transaction until it returns a success or failure status

const status = await getBuyWithCryptoStatus({

 client,

 transactionHash: swapTxResult.transactionHash,

}});

`

##### Signature

`function getBuyWithCryptoStatus(

buyWithCryptoTransaction: [BuyWithCryptoTransaction](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoTransaction),

): Promise<[BuyWithCryptoStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoStatus)>;

`

### Parameters

##### buyWithCryptoTransaction

 Object of type [BuyWithCryptoTransaction](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoTransaction)

#### Type

`let buyWithCryptoTransaction: {

chainId: number;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

transactionHash: string;

};

`

### Returns

##### Return Type

`let returnType:

| { status: "NOT_FOUND" }

| {

bridge?: string;

destination?: [PayOnChainTransactionDetails](https://portal.thirdweb.com/references/typescript/v5/PayOnChainTransactionDetails);

failureMessage?: string;

fromAddress: string;

purchaseData?: object;

quote: BuyWithCryptoQuoteSummary;

source?: [PayOnChainTransactionDetails](https://portal.thirdweb.com/references/typescript/v5/PayOnChainTransactionDetails);

status: BuyWithCryptoStatuses;

subStatus: BuyWithCryptoSubStatuses;

swapType: SwapType;

toAddress: string;

 };

`

 Object of type [BuyWithCryptoStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoStatus)
## getBuyWithCryptoTransfer

 Get a quote of type [BuyWithCryptoTransfer](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoTransfer) to facilitate a token transfer transaction. Using this instead of a native transfer allows you to receive status and webhooks about successful or failed payments.

 Once you have the quote, you can use `prepareTransaction` and prepare the transaction for submission.

### Example

`import { getBuyWithCryptoTransfer } from "thirdweb/pay";

const transfer = await getBuyWithCryptoTransfer({

 client,

 fromAddress: "0x...", // wallet address

 toAddress: "0x...", // recipient address - likely to be your wallet

 chainId: 10, // chain id of the token

 tokenAddress: "0x...", // address of the token

 amount: "10", // amount of token to transfer

 purchaseData: {

// any metadata for you to attribute this purchase

 customerId: "yourId",

 },

});

`

##### Signature

`function getBuyWithCryptoTransfer(

params: [GetBuyWithCryptoTransferParams](https://portal.thirdweb.com/references/typescript/v5/GetBuyWithCryptoTransferParams),

): Promise<[BuyWithCryptoTransfer](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoTransfer)>;

`

### Parameters

##### params

 object of type [GetBuyWithCryptoTransferParams](https://portal.thirdweb.com/references/typescript/v5/GetBuyWithCryptoTransferParams)

#### Type

`let params: {

amount: string;

chainId: number;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

fromAddress: string;

purchaseData?: object;

toAddress: string;

tokenAddress: string;

};

`

### Returns

##### Return Type

`let returnType: {

approvalData?: QuoteApprovalInfo;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

estimatedGasCostUSDCents: number;

fromAddress: string;

paymentToken: QuotePaymentToken;

processingFee: QuotePaymentToken;

toAddress: string;

transactionRequest: [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions);

};

`

 Object of type [BuyWithCryptoTransfer](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoTransfer) which contains the information about the transfer
## getBuyWithFiatQuote

 Get a quote of type [BuyWithFiatQuote](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatQuote) to buy given token with fiat currency. This quote contains the information about the swap such as token amounts, processing fees, estimated time etc.

####  Rendering the On-Ramp provider UI

 Once you have the `quote` , you can open the `quote.onRampLink` in a new tab - This will prompt the user to buy the token with fiat currency

####  Determining the steps required

 If `quote.onRampToken.token` is same as `quote.toToken` ( same chain + same token address ) - This means that the token can be directly bought from the on-ramp provider. But if they are different, On-ramp provider will send the `quote.onRampToken` to the user's wallet address and a swap is required to swap it to the desired token onchain.

 You can use the [isSwapRequiredPostOnramp](https://portal.thirdweb.com/references/typescript/v5/isSwapRequiredPostOnramp) utility function to check if a swap is required after the on-ramp is done.

####  Polling for the status

 Once you open the `quote.onRampLink` in a new tab, you can start polling for the status using [getBuyWithFiatStatus](https://portal.thirdweb.com/references/typescript/v5/getBuyWithFiatStatus) to get the status of the transaction.

`getBuyWithFiatStatus` returns a status object of type [BuyWithFiatStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatStatus) .

* If no swap is required - the status will become `"ON_RAMP_TRANSFER_COMPLETED"` once the on-ramp provider has sent the desired token to the user's wallet address. Once you receive this status, the process is complete.
* If a swap is required - the status will become `"CRYPTO_SWAP_REQUIRED"` once the on-ramp provider has sent the tokens to the user's wallet address. Once you receive this status, you need to start the swap process.

####  Swap Process

 On receiving the `"CRYPTO_SWAP_REQUIRED"` status, you can use the [getPostOnRampQuote](https://portal.thirdweb.com/references/typescript/v5/getPostOnRampQuote) function to get the quote for the swap of type [BuyWithCryptoQuote](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoQuote) .

 Once you have this quote - You can follow the same steps as mentioned in the [getBuyWithCryptoQuote](https://portal.thirdweb.com/references/typescript/v5/getBuyWithCryptoQuote) documentation to perform the swap.

### Example

 Get a quote for buying 10 USDC on polygon chain (chainId: 137) with USD fiat currency:

`import { getBuyWithFiatQuote } from "thirdweb/pay";

const quote = await getBuyWithFiatQuote({

 client: client, // thirdweb client

 fromCurrencySymbol: "USD", // fiat currency symbol

 toChainId: 137, // polygon chain id

 toAmount: "10", // amount of USDC to buy

 toTokenAddress: "0x3c499c542cEF5E3811e1192ce70d8cC03d5c3359" // USDC token address in polygon chain

 toAddress: "0x...", // user's wallet address

 isTestMode: false, // whether to use onramp in test mode for testing purpose (defaults to false)

});

window.open(quote.onRampLink, "_blank");

`

##### Signature

`function getBuyWithFiatQuote(

params: [GetBuyWithFiatQuoteParams](https://portal.thirdweb.com/references/typescript/v5/GetBuyWithFiatQuoteParams),

): Promise<[BuyWithFiatQuote](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatQuote)>;

`

### Parameters

##### params

 object of type [GetBuyWithFiatQuoteParams](https://portal.thirdweb.com/references/typescript/v5/GetBuyWithFiatQuoteParams)

#### Type

`let params: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

fromAddress: string;

fromAmount?: string;

fromCurrencySymbol: CurrencyMeta["shorthand"];

isTestMode?: boolean;

maxSlippageBPS?: number;

preferredProvider?: FiatProvider;

purchaseData?: object;

toAddress: string;

toAmount?: string;

toChainId: number;

toGasAmountWei?: string;

toTokenAddress: string;

};

`

### Returns

##### Return Type

`let returnType: {

estimatedDurationSeconds: number;

estimatedToAmountMin: string;

estimatedToAmountMinWei: string;

fromAddress: string;

fromCurrency: {

amount: string;

amountUnits: string;

currencySymbol: string;

decimals: number;

 };

fromCurrencyWithFees: {

amount: string;

amountUnits: string;

currencySymbol: string;

decimals: number;

 };

intentId: string;

maxSlippageBPS: number;

onRampLink: string;

onRampToken: {

amount: string;

amountUSDCents: number;

amountWei: string;

token: [PayTokenInfo](https://portal.thirdweb.com/references/typescript/v5/PayTokenInfo);

 };

processingFees: Array<{

amount: string;

amountUnits: string;

currencySymbol: string;

decimals: number;

feeType: "ON_RAMP" | "NETWORK";

 }>;

provider: FiatProvider;

routingToken?: {

amount: string;

amountUSDCents: number;

amountWei: string;

token: [PayTokenInfo](https://portal.thirdweb.com/references/typescript/v5/PayTokenInfo);

 };

toAddress: string;

toAmountMin: string;

toAmountMinWei: string;

toToken: [PayTokenInfo](https://portal.thirdweb.com/references/typescript/v5/PayTokenInfo);

};

`

 Object of type [BuyWithFiatQuote](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatQuote) which contains the information about the quote such as processing fees, estimated time, converted token amounts, etc.
## getBuyWithFiatHistory

 Get the "Buy with fiat" transaction history for a given wallet address

### Example

`import { createThirdwebClient } from "thirdweb";

import { getBuyWithFiatHistory } from "thirdweb/pay";

const client = createThirdwebClient({ clientId: "..." });

// get the 10 latest "Buy with fiat" transactions dony by the wallet

const history = await getBuyWithFiatHistory({

 client: client,

 walletAddress: "0x...",

 start: 0,

 count: 10,

});

`

##### Signature

`function getBuyWithFiatHistory(

params: [BuyWithFiatHistoryParams](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatHistoryParams),

): Promise<[BuyWithFiatHistoryData](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatHistoryData)>;

`

### Parameters

##### params

 Object of type [BuyWithFiatHistoryParams](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatHistoryParams)

#### Type

`let params: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

count: number;

start: number;

walletAddress: string;

};

`

### Returns

##### Return Type

`let returnType: {

hasNextPage: boolean;

page: Array<[BuyWithFiatStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatStatus)>;

};

`

 Object of type [BuyWithFiatHistoryData](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatHistoryData)
## getBuyHistory

 Get Buy transaction history for a given wallet address.

 This includes both "Buy with Cryto" and "Buy with Fiat" transactions

### Example

`import { createThirdwebClient } from "thirdweb";

import { getBuyHistory } from "thirdweb/pay";

const client = createThirdwebClient({ clientId: "..." });

const history = await getBuyHistory({

 client,

 walletAddress: "0x...",

});

`

##### Signature

`function getBuyHistory(

params: [BuyHistoryParams](https://portal.thirdweb.com/references/typescript/v5/BuyHistoryParams),

): Promise<[BuyHistoryData](https://portal.thirdweb.com/references/typescript/v5/BuyHistoryData)>;

`

### Parameters

##### params

 Object of type [BuyHistoryParams](https://portal.thirdweb.com/references/typescript/v5/BuyHistoryParams)

#### Type

`let params: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

count: number;

start: number;

walletAddress: string;

};

`

### Returns

##### Return Type

`let returnType: {

hasNextPage: boolean;

page: Array<

| { buyWithFiatStatus: [BuyWithFiatStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatStatus) }

| { buyWithCryptoStatus: [BuyWithCryptoStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoStatus) }

 >;

};

`
## getBuyWithCryptoQuote

 Get a quote of type [BuyWithCryptoQuote](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoQuote) to buy any given token with crypto. This quote contains the information about the swap such as token amounts, processing fees, estimated time etc.

 Once you have the quote, you can use `prepareTransaction` and prepare the transaction for submission.

### Example

`` import { getBuyWithCryptoQuote } from "thirdweb/pay";

const quote = await getBuyWithCryptoQuote({

 client,

 fromAddress: "0x...", // wallet address

 fromChainId: 137, // chain id of the source token

 fromTokenAddress: "0x...", // token address of the source token

 fromAmount: "10", // amount of source token to swap

// optionally, you can use `toAmount` instead if you only want a certain amount of destination token

 toChainId: 10, // chain id of the destination token

 toTokenAddress: "0x...", // token address of the destination token

 toAddress: "0x...", // optional: send the tokens to a different address

 maxSlippageBPS: 50, // optional: max 0.5% slippage

});

 ``

##### Signature

`function getBuyWithCryptoQuote(

params: [GetBuyWithCryptoQuoteParams](https://portal.thirdweb.com/references/typescript/v5/GetBuyWithCryptoQuoteParams),

): Promise<[BuyWithCryptoQuote](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoQuote)>;

`

### Parameters

##### params

 object of type [GetBuyWithCryptoQuoteParams](https://portal.thirdweb.com/references/typescript/v5/GetBuyWithCryptoQuoteParams)

#### Type

`let params: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

fromAddress: string;

fromChainId: number;

fromTokenAddress: string;

intentId?: string;

maxSlippageBPS?: number;

purchaseData?: object;

toAddress: string;

toChainId: number;

toTokenAddress: string;

} & (

| { fromAmount: string; toAmount?: never }

| { fromAmount?: never; toAmount: string }

);

`

### Returns

##### Return Type

`let returnType: {

approvalData?: QuoteApprovalInfo;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

paymentTokens: Array<QuotePaymentToken>;

processingFees: Array<QuotePaymentToken>;

swapDetails: {

estimated: {

durationSeconds?: number;

feesUSDCents: number;

fromAmountUSDCents: number;

gasCostUSDCents?: number;

slippageBPS: number;

toAmountMinUSDCents: number;

toAmountUSDCents: number;

 };

fromAddress: string;

fromAmount: string;

fromAmountWei: string;

fromToken: [QuoteTokenInfo](https://portal.thirdweb.com/references/typescript/v5/QuoteTokenInfo);

maxSlippageBPS: number;

toAddress: string;

toAmount: string;

toAmountMin: string;

toAmountMinWei: string;

toAmountWei: string;

toToken: [QuoteTokenInfo](https://portal.thirdweb.com/references/typescript/v5/QuoteTokenInfo);

 };

transactionRequest: [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions);

};

`

 Object of type [BuyWithCryptoQuote](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoQuote) which contains the information about the quote such as processing fees, estimated time, converted token amounts, etc.
## getChainMetadata

 Retrieves chain data for a given chain.

### Example

`const chain = defineChain({ id: 1 });

const chainData = await getChainMetadata(chain);

console.log(chainData);

`

##### Signature

`function getChainMetadata(chain: Readonly): Promise<[ChainMetadata](https://portal.thirdweb.com/references/typescript/v5/ChainMetadata)>;

`

### Parameters

##### chain

 The chain object containing the chain ID.

#### Type

`let chain: Readonly;

`

### Returns

##### Return Type

`let returnType: { chain: string; chainId: number; ens?: { registry: string }; explorers?: Readonly<Array<ChainExplorer>>; faucets?: readonly Array<string>; features?: Readonly<Array<{ name: string }>>; icon?: Icon; infoURL?: string; name: string; nativeCurrency: { decimals: number; name: string; symbol: string }; networkId?: number; parent?: { bridges?: Readonly<Array<{ url: string }>>; chain: string; type: string }; redFlags?: readonly Array<string>; rpc: readonly Array<string>; shortName: string; slip44?: number; slug: string; stackType: string; status?: string; testnet: boolean; title?: string }

`

 A Promise that resolves to the chain data.
## getClaimParams

 Get the claim parameters for a given drop

### Example

`import { getClaimParams } from "thirdweb/utils";

const claimParams = await getClaimParams({

 contract,

 to: "0x...",

 quantity: 1n,

 type: "erc1155",

 tokenId: 0n,

});

`

##### Signature

`` function getClaimParams(

options: [GetClaimParamsOptions](https://portal.thirdweb.com/references/typescript/v5/GetClaimParamsOptions),

): Promise<{

allowlistProof: OverrideProof;

currency: string;

data: `0x${string}`;

overrides: {

erc20Value:

| undefined

| { amountWei: bigint; tokenAddress: string };

value: bigint;

 };

pricePerToken: bigint;

quantity: bigint;

receiver: string;

tokenId: undefined | bigint;

}>;

 ``

### Parameters

##### options

 The options for getting the claim parameters

#### Type

`let options: {

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

from?: string;

quantity: bigint;

singlePhaseDrop?: boolean;

to: string;

} & (

| { type: "erc721" }

| { tokenDecimals: number; type: "erc20" }

| { tokenId: bigint; type: "erc1155" }

);

`

### Returns

##### Return Type

`` let returnType: Promise<{

allowlistProof: OverrideProof;

currency: string;

data: `0x${string}`;

overrides: {

erc20Value:

| undefined

| { amountWei: bigint; tokenAddress: string };

value: bigint;

 };

pricePerToken: bigint;

quantity: bigint;

receiver: string;

tokenId: undefined | bigint;

}>;

 ``

 The claim parameters
## getContract

 Creates a Thirdweb contract by combining the Thirdweb client and contract options.

### Example

`import { createThirdwebClient, getContract } from "thirdweb";

import { sepolia } from "thirdweb/chains";

const client = createThirdwebClient({ clientId: "..." });

const contract = getContract({

 client,

 chain: sepolia,

 address: "0x123...",

// optional ABI

 abi: [...],

});

`

##### Signature

`` function getContract(

options: [ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<abi>,

): Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<abi, `0x${string}`>>;

 ``

### Parameters

##### options

 The options for creating the contract.

#### Type

`let options: [ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<abi>;

`

### Returns

##### Return Type

`` let returnType: Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<abi, `0x${string}`>>;

 ``

 The Thirdweb contract.
## getCompilerMetadata

 Down the compiled metadata from thirdweb contract api and format it

### Example

`import { getCompilerMetadata, getContract } from "thirdweb/contracts";

const contract = getContract({

 address: "0x...",

 chain: ethereum,

 client: "",

});

const metadata = await getCompilerMetadata(contract);

`

##### Signature

`function getCompilerMetadata(

contract: Readonly,

): Promise<CompilerMetadata>;

`

### Parameters

##### contract

#### Type

`let contract: Readonly;

`

### Returns

##### Return Type

`let returnType: Promise<CompilerMetadata>;

`

 The compiler metadata for the contract
## getContractEvents

 Retrieves events from a contract based on the provided options.

### Example

`import { getContractEvents } from "thirdweb";

const events = await getContractEvents({

 contract: myContract,

 fromBlock: 123456n,

 toBlock: 123456n,

 events: [preparedEvent, preparedEvent2],

});

`

##### Signature

`function getContractEvents(

options: [GetContractEventsOptions](https://portal.thirdweb.com/references/typescript/v5/GetContractEventsOptions)<abi, abiEvents, TStrict>,

): Promise<[GetContractEventsResult](https://portal.thirdweb.com/references/typescript/v5/GetContractEventsResult)<abiEvents, TStrict>>;

`

### Parameters

##### options

 The options for retrieving events.

#### Type

`let options: [GetContractEventsOptions](https://portal.thirdweb.com/references/typescript/v5/GetContractEventsOptions)<abi, abiEvents, TStrict>;

`

### Returns

##### Return Type

`let returnType: [ParseEventLogsResult](https://portal.thirdweb.com/references/typescript/v5/ParseEventLogsResult)<abiEvents, TStrict>;

`

 A promise that resolves to an array of parsed event logs. Note: toBlock and fromBlock are both inclusive.
## getBytecode

 Retrieves the bytecode of a contract.

### Example

`import { getBytecode } from "thirdweb/contract";

const bytecode = await getBytecode(contract);

`

##### Signature

`` function getBytecode(contract: Readonly): Promise<`0x${string}`>;

 ``

### Parameters

##### contract

 The ThirdwebContract instance.

#### Type

`let contract: Readonly;

`

### Returns

##### Return Type

`` let returnType: Promise<`0x${string}`>;

 ``

 A Promise that resolves to the bytecode of the contract.
## getContractPublisher

 Returns the default publisher contract on polygon

##### Signature

`` function getContractPublisher(

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient),

): Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<[], `0x${string}`>>;

 ``

### Parameters

##### client

#### Type

`let client: {

readonly clientId: string;

readonly secretKey: string | undefined;

} & Readonly<ClientOptions>;

`

### Returns

##### Return Type

`` let returnType: Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<[], `0x${string}`>>;

 ``
## getGasPrice

 Retrieves the gas price for a transaction on a specific chain.

### Example

`import { getGasPrice } from "thirdweb";

const gasPrice = await getGasPrice({ client, chain });

`

##### Signature

`function getGasPrice(options: [GetGasPriceOptions](https://portal.thirdweb.com/references/typescript/v5/GetGasPriceOptions)): Promise<bigint>;

`

### Parameters

##### options

#### Type

`let options: {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

percentMultiplier?: number;

};

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 A promise that resolves to the gas price as a bigint.
## getBuyWithFiatStatus

 Once you get a `quote` from [getBuyWithFiatQuote](https://portal.thirdweb.com/references/typescript/v5/getBuyWithFiatQuote)and open the `quote.onRampLink` in a new tab, you can start polling for the transaction status using `getBuyWithFiatStatus`

 You should keep calling this function at regular intervals while the status is in one of the pending states such as - "PENDING\_PAYMENT", "PENDING\_ON\_RAMP\_TRANSFER", "ON\_RAMP\_TRANSFER\_IN\_PROGRESS", "CRYPTO\_SWAP\_IN\_PROGRESS" etc..

 If `quote.onRampToken` is same as `quote.toToken` (same chain + same token address) - This means that the token can be directly bought from the on-ramp provider. But if they are different - On-ramp provider will send the `quote.onRampToken` to the user's wallet address and a swap is required to convert it to the desired token. You can use the [isSwapRequiredPostOnramp](https://portal.thirdweb.com/references/typescript/v5/isSwapRequiredPostOnramp) utility function to check if a swap is required after the on-ramp is done.

#####  When no swap is required

 If there is no swap required - the status will become `"ON_RAMP_TRANSFER_COMPLETED"` once the on-ramp provider has sent the tokens to the user's wallet address. Once you receive this status, the process is complete.

####  When a swap is required

 If a swap is required - the status will become `"CRYPTO_SWAP_REQUIRED"` once the on-ramp provider has sent the tokens to the user's wallet address. Once you receive this status, you need to start the swap process.

 On receiving the `"CRYPTO_SWAP_REQUIRED"` status, you can use the [getPostOnRampQuote](https://portal.thirdweb.com/references/typescript/v5/getPostOnRampQuote) function to get the quote for the swap of type [BuyWithCryptoQuote](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoQuote) .

 Once you have this quote - You can follow the same steps as mentioned in the [getBuyWithCryptoQuote](https://portal.thirdweb.com/references/typescript/v5/getBuyWithCryptoQuote) documentation to perform the swap.

### Example

`// step 1 - get a quote

const fiatQuote = await getBuyWithFiatQuote(fiatQuoteParams);

// step 2 - open the on-ramp provider UI

window.open(quote.onRampLink, "_blank");

// step 3 - keep calling getBuyWithFiatStatus while the status is in one of the pending states

const fiatStatus = await getBuyWithFiatStatus({

 client,

 intentId: fiatQuote.intentId,

});

// when the fiatStatus.status is "ON_RAMP_TRANSFER_COMPLETED" - the process is complete

// when the fiatStatus.status is "CRYPTO_SWAP_REQUIRED" - start the swap process

`

##### Signature

`function getBuyWithFiatStatus(

params: [GetBuyWithFiatStatusParams](https://portal.thirdweb.com/references/typescript/v5/GetBuyWithFiatStatusParams),

): Promise<[BuyWithFiatStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatStatus)>;

`

### Parameters

##### params

 Object of type [GetBuyWithFiatStatusParams](https://portal.thirdweb.com/references/typescript/v5/GetBuyWithFiatStatusParams)

#### Type

`let params: { client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient); intentId: string };

`

### Returns

##### Return Type

`let returnType:

| { status: "NOT_FOUND" }

| {

destination?: [PayOnChainTransactionDetails](https://portal.thirdweb.com/references/typescript/v5/PayOnChainTransactionDetails);

failureMessage?: string;

fromAddress: string;

intentId: string;

purchaseData?: object;

quote: {

createdAt: string;

estimatedDurationSeconds?: number;

estimatedOnRampAmount: string;

estimatedOnRampAmountWei: string;

estimatedToTokenAmount: string;

estimatedToTokenAmountWei: string;

fromCurrency: {

amount: string;

amountUnits: string;

currencySymbol: string;

decimals: number;

 };

fromCurrencyWithFees: {

amount: string;

amountUnits: string;

currencySymbol: string;

decimals: number;

 };

onRampToken: [PayTokenInfo](https://portal.thirdweb.com/references/typescript/v5/PayTokenInfo);

toToken: [PayTokenInfo](https://portal.thirdweb.com/references/typescript/v5/PayTokenInfo);

 };

source?: [PayOnChainTransactionDetails](https://portal.thirdweb.com/references/typescript/v5/PayOnChainTransactionDetails);

status:

| "NONE"

| "PENDING_PAYMENT"

| "PAYMENT_FAILED"

| "PENDING_ON_RAMP_TRANSFER"

| "ON_RAMP_TRANSFER_IN_PROGRESS"

| "ON_RAMP_TRANSFER_COMPLETED"

| "ON_RAMP_TRANSFER_FAILED"

| "CRYPTO_SWAP_REQUIRED"

| "CRYPTO_SWAP_COMPLETED"

| "CRYPTO_SWAP_FALLBACK"

| "CRYPTO_SWAP_IN_PROGRESS"

| "CRYPTO_SWAP_FAILED";

toAddress: string;

 };

`
## getOrDeployInfraForPublishedContract

 Gets or deploys the infrastructure contracts needed for a published contract deployment

##### Signature

`function getOrDeployInfraForPublishedContract(

args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

 } & {

constructorParams?: Record<string, unknown>;

contractId: string;

publisher?: string;

version?: string;

 },

): Promise<{

cloneFactoryContract: Readonly;

implementationContract: Readonly;

}>;

`

### Parameters

##### args

 The arguments object

#### Type

`let args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

} & {

constructorParams?: Record<string, unknown>;

contractId: string;

publisher?: string;

version?: string;

};

`

### Returns

##### Return Type

`let returnType: Promise<{

cloneFactoryContract: Readonly;

implementationContract: Readonly;

}>;

`

 An object containing:

* cloneFactoryContract: The factory contract used for creating clones
* implementationContract: The deployed implementation contract
## getLastAuthProvider

 Retrieves the last authentication provider used from local storage.

 This function is designed to work only in a browser environment.

### Example

`import { getLastAuthProvider } from "thirdweb/react";

const lastAuthProvider = await getLastAuthProvider();

`

##### Signature

`function getLastAuthProvider(): Promise<

| null

| OAuthOption

| "backend"

| "email"

| "phone"

| "passkey"

| "wallet"

| "jwt"

| "auth_endpoint"

| "iframe_email_verification"

| "iframe"

>;

`

### Returns

##### Return Type

`let returnType: Promise<

| null

| OAuthOption

| "backend"

| "email"

| "phone"

| "passkey"

| "wallet"

| "jwt"

| "auth_endpoint"

| "iframe_email_verification"

| "iframe"

>;

`

 A promise that resolves to the last authentication provider strategy used, or `null` if none is found.
## getPaymasterAndData

 Get paymaster and data details for a user operation.

### Example

`import { getPaymasterAndData } from "thirdweb/wallets/smart";

const userOp = createUnsignedUserOp(...);

const paymasterAndData = await getPaymasterAndData({

 userOp,

 client,

 chain,

});

`

##### Signature

`function getPaymasterAndData(args: {

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

entrypointAddress?: string;

paymasterOverride?: (

userOp: UserOperationV06 | UserOperationV07,

 ) => Promise<[PaymasterResult](https://portal.thirdweb.com/references/typescript/v5/PaymasterResult)>;

userOp: UserOperationV06 | UserOperationV07;

}): Promise<[PaymasterResult](https://portal.thirdweb.com/references/typescript/v5/PaymasterResult)>;

`

### Parameters

##### args

 The userOp and options

#### Type

`let args: {

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

entrypointAddress?: string;

paymasterOverride?: (

userOp: UserOperationV06 | UserOperationV07,

 ) => Promise<[PaymasterResult](https://portal.thirdweb.com/references/typescript/v5/PaymasterResult)>;

userOp: UserOperationV06 | UserOperationV07;

};

`

### Returns

##### Return Type

`let returnType: {

callGasLimit?: bigint;

preVerificationGas?: bigint;

verificationGasLimit?: bigint;

} & (

| { paymasterAndData: string }

| {

paymaster: string;

paymasterData: string;

paymasterPostOpGasLimit?: bigint;

paymasterVerificationGasLimit?: bigint;

 }

);

`

* The paymaster and data details for the user operation.
## getProfiles

 Gets the linked profiles for the connected in-app or ecosystem wallet.

### Example

`import { getProfiles } from "thirdweb/wallets";

const profiles = await getProfiles({

 client,

});

console.log(profiles[0].type); // will be "email", "phone", "google", "discord", etc

console.log(profiles[0].details.email);

console.log(profiles[0].details.phone);

`

####  Getting profiles for a ecosystem user

`import { getProfiles } from "thirdweb/wallets/in-app";

const profiles = await getProfiles({

 client,

 ecosystem: {

 id: "ecosystem.your-ecosystem-id",

 },

});

`

##### Signature

`function getProfiles(

args: [GetAuthenticatedUserParams](https://portal.thirdweb.com/references/typescript/v5/GetAuthenticatedUserParams),

): Promise<Array<[Profile](https://portal.thirdweb.com/references/typescript/v5/Profile)>>;

`

### Parameters

##### args

#### Type

`let args: { client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient); ecosystem?: Ecosystem };

`

### Returns

##### Return Type

`let returnType: {

details: {

address?: [Address](https://portal.thirdweb.com/references/typescript/v5/Address);

email?: string;

id?: string;

phone?: string;

 };

type: AuthOption;

};

`

 An array of accounts user profiles linked to the connected wallet.
## getPostOnRampQuote

 When buying a token with fiat currency - It only involes doing on-ramp if the on-ramp provider supports buying the given destination token directly.

 If the on-ramp provider does not support buying the destination token directly, user can be sent an intermediate token with fiat currency from the on-ramp provider which can be swapped to destination token onchain.

`getPostOnRampQuote` function is used to get the quote for swapping the on-ramp token to destination token.

 When you get a "Buy with Fiat" status of type "CRYPTO\_SWAP\_REQUIRED" from the [getBuyWithFiatStatus](https://portal.thirdweb.com/references/typescript/v5/getBuyWithFiatStatus) function, you can use `getPostOnRampQuote` function to get the quote of type [BuyWithCryptoQuote](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoQuote) for swapping the on-ramp token to destination token

 Once you have the quote, you can start the Swap process by following the same steps as mentioned in the [getBuyWithCryptoQuote](https://portal.thirdweb.com/references/typescript/v5/getBuyWithCryptoQuote) documentation.

### Example

`import {

 getPostOnRampQuote,

 getBuyWithFiatStatus,

} from "thirdweb/pay";

// previous steps

const fiatQuote = await getBuyWithFiatQuote(fiatQuoteParams);

window.open(fiatQuote.onRampLink, "_blank");

const buyWithFiatStatus = await getBuyWithFiatStatus({

 client,

 intentId,

}); // keep calling this until status is "settled" state

// when a swap is required after onramp

if (buyWithFiatStatus.status === "CRYPTO_SWAP_REQUIRED") {

const buyWithCryptoQuote = await getPostOnRampQuote({

 client,

 buyWithFiatStatus,

 });

}

`

##### Signature

`function getPostOnRampQuote(

params: [GetPostOnRampQuoteParams](https://portal.thirdweb.com/references/typescript/v5/GetPostOnRampQuoteParams),

): Promise<[BuyWithCryptoQuote](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoQuote)>;

`

### Parameters

##### params

 object of type [GetPostOnRampQuoteParams](https://portal.thirdweb.com/references/typescript/v5/GetPostOnRampQuoteParams)

#### Type

`let params: {

buyWithFiatStatus: [BuyWithFiatStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatStatus);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

};

`

### Returns

##### Return Type

`let returnType: {

approvalData?: QuoteApprovalInfo;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

paymentTokens: Array<QuotePaymentToken>;

processingFees: Array<QuotePaymentToken>;

swapDetails: {

estimated: {

durationSeconds?: number;

feesUSDCents: number;

fromAmountUSDCents: number;

gasCostUSDCents?: number;

slippageBPS: number;

toAmountMinUSDCents: number;

toAmountUSDCents: number;

 };

fromAddress: string;

fromAmount: string;

fromAmountWei: string;

fromToken: [QuoteTokenInfo](https://portal.thirdweb.com/references/typescript/v5/QuoteTokenInfo);

maxSlippageBPS: number;

toAddress: string;

toAmount: string;

toAmountMin: string;

toAmountMinWei: string;

toAmountWei: string;

toToken: [QuoteTokenInfo](https://portal.thirdweb.com/references/typescript/v5/QuoteTokenInfo);

 };

transactionRequest: [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions);

};

`

 Object of type [BuyWithCryptoQuote](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoQuote) which contains the information about the quote such as processing fees, estimated time, converted token amounts, etc.
## getRpcClient

 Returns an RPC request that can be used to make JSON-RPC requests.

### Example

`import { createThirdwebClient } from "thirdweb";

import { getRpcClient } from "thirdweb/rpc";

import { ethereum } from "thirdweb/chains";

const client = createThirdwebClient({ clientId: "..." });

const rpcRequest = getRpcClient({ client, chain: ethereum });

const blockNumber = await rpcRequest({

 method: "eth_blockNumber",

});

`

##### Signature

`` function getRpcClient(

options: Readonly,

): EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

>;

 ``

### Parameters

##### options

 The RPC options.

#### Type

`let options: Readonly;

`

### Returns

##### Return Type

`` let returnType: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

>;

 ``

 The RPC request function.
## getSaltHash

 Calculates the salt hash for a given bytecode.

### Example

`import { getSaltHash } from "thirdweb";

const saltHash = getSaltHash(bytecode);

`

##### Signature

`` function getSaltHash(bytecode: string): `0x${string}`;

 ``

### Parameters

##### bytecode

 The bytecode to calculate the salt hash for.

#### Type

`let bytecode: string;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

 The salt hash of the bytecode.
## getRpcUrlForChain

 Retrieves the RPC URL for the specified chain. If a custom RPC URL is defined in the options, it will be used. Otherwise, a thirdweb RPC URL will be constructed using the chain ID and client ID.

### Example

`import { getRpcUrlForChain } from "thirdweb/chains";

const rpcUrl = getRpcUrlForChain({ chain: 1, client });

console.log(rpcUrl); // "https://1.rpc.thirdweb.com/...

`

##### Signature

`function getRpcUrlForChain(options: GetRpcUrlForChainOptions): string;

`

### Parameters

##### options

 The options object containing the chain and client information.

#### Type

`let options: GetRpcUrlForChainOptions;

`

### Returns

##### Return Type

`let returnType: string;

`

 The RPC URL for the specified chain.
## getSocialIcon

 Gets the icon URI for a given social authentication provider

### Example

`const googleIcon = getSocialIcon("google");

const appleIcon = getSocialIcon("apple");

`

##### Signature

`function getSocialIcon(

provider:

| "google"

| "apple"

| "facebook"

| "discord"

| "line"

| "x"

| "coinbase"

| "farcaster"

| "telegram"

| "github"

| "twitch"

| "steam"

| "guest"

| "backend"

| "email"

| "phone"

| "passkey"

| "wallet"

| ({} & string),

): string;

`

### Parameters

##### provider

 The authentication provider to get the icon for

#### Type

`let provider:

| "google"

| "apple"

| "facebook"

| "discord"

| "line"

| "x"

| "coinbase"

| "farcaster"

| "telegram"

| "github"

| "twitch"

| "steam"

| "guest"

| "backend"

| "email"

| "phone"

| "passkey"

| "wallet"

| ({} & string);

`

### Returns

##### Return Type

`let returnType: string;

`

 A data URI containing the SVG icon for the provider, or a generic wallet icon if the provider is not recognized
## getSocialProfiles

 Fetches the wallet's available social profiles.

### Example

`import { getSocialProfiles } from "thirdweb/social";

const profiles = await getSocialProfiles({

 address: "0x...",

 client,

});

`

##### Signature

`function getSocialProfiles(args: {

address: string;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}): Promise<Array<[SocialProfile](https://portal.thirdweb.com/references/typescript/v5/SocialProfile)>>;

`

### Parameters

##### args

 The arguments to use when fetching the social profiles.

#### Type

`let args: { address: string; client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient) };

`

### Returns

##### Return Type

`let returnType: {

avatar?: string;

bio?: string;

metadata?: [FarcasterProfile](https://portal.thirdweb.com/references/typescript/v5/FarcasterProfile) | [LensProfile](https://portal.thirdweb.com/references/typescript/v5/LensProfile) | [EnsProfile](https://portal.thirdweb.com/references/typescript/v5/EnsProfile);

name?: string;

type: "farcaster" | "lens" | "ens";

};

`

 A promise resolving to the array of social profiles for the given address.
## getUser

 Gets user based on the provided query parameters. This function is only available on the server (a secret key is required in the client).

### Example

`import { getUser } from "thirdweb/wallets";

const user = await getUser({

 client,

 walletAddress: "0x123...",

});

`

##### Signature

`function getUser(options: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

ecosystem?: Ecosystem;

email?: string;

externalWalletAddress?: string;

id?: string;

phone?: string;

walletAddress?: string;

}): Promise<null | [GetUserResult](https://portal.thirdweb.com/references/typescript/v5/GetUserResult)>;

`

### Parameters

##### options

 The options for the get user function.

#### Type

`let options: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

ecosystem?: Ecosystem;

email?: string;

externalWalletAddress?: string;

id?: string;

phone?: string;

walletAddress?: string;

};

`

### Returns

##### Return Type

`let returnType: {

createdAt: string;

email?: string;

phone?: string;

profiles: Array<[Profile](https://portal.thirdweb.com/references/typescript/v5/Profile)>;

userId: string;

walletAddress: string;

};

`

 A user object or null if not found.
## getUserEmail

 Retrieves the authenticated user email for the active in-app wallet.

### Example

`import { getUserEmail } from "thirdweb/wallets/in-app";

const email = await getUserEmail({ client });

console.log(email);

`

##### Signature

`function getUserEmail(

options: [GetAuthenticatedUserParams](https://portal.thirdweb.com/references/typescript/v5/GetAuthenticatedUserParams),

): Promise<undefined | string>;

`

### Parameters

##### options

 The arguments for retrieving the authenticated user.

#### Type

`let options: { client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient); ecosystem?: Ecosystem };

`

### Returns

##### Return Type

`let returnType: Promise<undefined | string>;

`

 The authenticated user email if logged in and wallet initialized, otherwise undefined.
## getTransactionStore

 Retrieve the transaction store for a given address.

### Example

`import { getTransactionStore } from "thirdweb/transaction";

const store = getTransactionStore("0x...");

store.subscribe((transactions) => {

 console.log(transactions);

});

`

##### Signature

`function getTransactionStore(

address: string,

): Store<Array<[StoredTransaction](https://portal.thirdweb.com/references/typescript/v5/StoredTransaction)>>;

`

### Parameters

##### address

 The address to retrieve the transaction store for.

#### Type

`let address: string;

`

### Returns

##### Return Type

`let returnType: Store<Array<[StoredTransaction](https://portal.thirdweb.com/references/typescript/v5/StoredTransaction)>>;

`

 A store of transactions for the given account to subscribe to.
## getUserOpGasFees

 Get the gas fees of a user operation.

### Example

`import { getUserOpGasPrice } from "thirdweb/wallets/smart";

const fees = await getUserOpGasPrice({

 options,

});

`

##### Signature

`function getUserOpGasFees(args: {

options: BundlerOptions;

}): Promise<GasPriceResult>;

`

### Parameters

##### args

 The options for getting the gas price of a user operation.

#### Type

`let args: { options: BundlerOptions };

`

### Returns

##### Return Type

`let returnType: Promise<GasPriceResult>;

`

 The gas price of the user operation.
## getUserOpHash

 Get the hash of a user operation.

### Example

`import { getUserOpHash } from "thirdweb/wallets/smart";

const userOp = await createUnsignedUserOp(...);

const userOpHash = await getUserOpHash({

 client,

 userOp,

 chain,

});

`

##### Signature

`` function getUserOpHash(args: {

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

entrypointAddress?: string;

userOp: UserOperationV06 | UserOperationV07;

}): Promise<`0x${string}`>;

 ``

### Parameters

##### args

 The options for getting the user operation hash

#### Type

`let args: {

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

entrypointAddress?: string;

userOp: UserOperationV06 | UserOperationV07;

};

`

### Returns

##### Return Type

`` let returnType: Promise<`0x${string}`>;

 ``

* The user operation hash
## getUserOpReceipt

 Get the receipt of a user operation.

### Example

`import { getUserOpReceipt } from "thirdweb/wallets/smart";

const receipt = await getUserOpReceipt({

 client,

 chain,

 userOpHash,

});

`

##### Signature

`` function getUserOpReceipt(

args: BundlerOptions & { userOpHash: `0x${string}` },

): Promise<undefined | [TransactionReceipt](https://portal.thirdweb.com/references/typescript/v5/TransactionReceipt)>;

 ``

### Parameters

##### args

 The options for getting the receipt of a user operation.

#### Type

`` let args: BundlerOptions & { userOpHash: `0x${string}` };

 ``

### Returns

##### Return Type

`let returnType: {

blobGasPrice?: quantity;

blobGasUsed?: quantity;

blockHash: Hash;

blockNumber: quantity;

contractAddress: Address | null | undefined;

cumulativeGasUsed: quantity;

effectiveGasPrice: quantity;

from: Address;

gasUsed: quantity;

logs: Array<Log<quantity, index, false>>;

logsBloom: Hex;

root?: Hash;

status: status;

to: Address | null;

transactionHash: Hash;

transactionIndex: index;

type: type;

};

`

 The receipt of the user operation.
## getDefaultToken

 Get the default token for a given chain and symbol

### Example

`import { getDefaultToken } from "thirdweb/react";

import { ethereum } from "thirdweb/chains";

const token = getDefaultToken(ethereum, "USDC");

`

##### Signature

`function getDefaultToken(

chain: Readonly,

symbol:

| "WETH"

| "USDT"

| "USDC"

| "WBTC"

| "WMATIC"

| "WBNB"

| "BUSD"

| "WFTM"

| "WAVAX",

): undefined | [TokenInfo](https://portal.thirdweb.com/references/typescript/v5/TokenInfo);

`

### Parameters

##### chain

 The chain to get the token for

#### Type

`let chain: Readonly;

`

##### symbol

 The symbol of the token to get

#### Type

`let symbol:

| "WETH"

| "USDT"

| "USDC"

| "WBTC"

| "WMATIC"

| "WBNB"

| "BUSD"

| "WFTM"

| "WAVAX";

`

### Returns

##### Return Type

`let returnType: undefined | [TokenInfo](https://portal.thirdweb.com/references/typescript/v5/TokenInfo);

`

 The default token for the given chain and symbol
## getUserOpReceiptRaw

 Get the receipt of a user operation.

### Example

`import { getUserOpReceiptRaw } from "thirdweb/wallets/smart";

const receipt = await getUserOpReceiptRaw({

 client,

 chain,

 userOpHash,

});

`

##### Signature

`` function getUserOpReceiptRaw(

args: BundlerOptions & { userOpHash: `0x${string}` },

): Promise<undefined | UserOperationReceipt>;

 ``

### Parameters

##### args

 The options for getting the receipt of a user operation.

#### Type

`` let args: BundlerOptions & { userOpHash: `0x${string}` };

 ``

### Returns

##### Return Type

`let returnType: Promise<undefined | UserOperationReceipt>;

`

 The raw receipt of the user operation.
## getUserPhoneNumber

 Retrieves the authenticated user phone number for the active embedded wallet.

### Example

`import { getUserPhoneNumber } from "thirdweb/wallets/embedded";

const phoneNumber = await getUserPhoneNumber({ client });

console.log(phoneNumber);

`

##### Signature

`function getUserPhoneNumber(

options: [GetAuthenticatedUserParams](https://portal.thirdweb.com/references/typescript/v5/GetAuthenticatedUserParams),

): Promise<undefined | string>;

`

### Parameters

##### options

 The arguments for retrieving the authenticated user.

#### Type

`let options: { client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient); ecosystem?: Ecosystem };

`

### Returns

##### Return Type

`let returnType: Promise<undefined | string>;

`

 The authenticated user phone number if authenticated with phone number, otherwise undefined.
## getWalletBalance

 Retrieves the balance of a token or native currency for a given wallet.

### Example

`import { getWalletBalance } from "thirdweb/wallets";

const balance = await getWalletBalance({

 address,

 client,

 chain,

 tokenAddress,

});

`

##### Signature

`function getWalletBalance(

options: [GetWalletBalanceOptions](https://portal.thirdweb.com/references/typescript/v5/GetWalletBalanceOptions),

): Promise<GetWalletBalanceResult>;

`

### Parameters

##### options

 The options for retrieving the token balance.

#### Type

`let options: {

address: string;

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

tokenAddress?: string;

};

`

### Returns

##### Return Type

`let returnType: Promise<GetWalletBalanceResult>;

`

 A promise that resolves to the token balance result.
## getInitBytecodeWithSalt

 Generates the initialization bytecode with salt for a contract deployment.

### Example

`import { getInitBytecodeWithSalt } from "thirdweb/utils";

const initBytecodeWithSalt = getInitBytecodeWithSalt({

 bytecode,

 encodedArgs,

 salt,

});

`

##### Signature

`` function getInitBytecodeWithSalt(

options: GetInitiBytecodeWithSaltOptions,

): `0x${string}`;

 ``

### Parameters

##### options

 The options for generating the initialization bytecode.

#### Type

`let options: GetInitiBytecodeWithSaltOptions;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

 The initialization bytecode with salt.
## hasStoredPasskey

 Returns whether this device has a stored passkey ready to be used for sign-in

##### Signature

`` function hasStoredPasskey(

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient),

ecosystemId?: `ecosystem.${string}`,

storage?: [AsyncStorage](https://portal.thirdweb.com/references/typescript/v5/AsyncStorage),

): Promise<boolean>;

 ``

### Parameters

##### client

 the thirdweb client

#### Type

`let client: {

readonly clientId: string;

readonly secretKey: string | undefined;

} & Readonly<ClientOptions>;

`

##### ecosystemId

optional

#### Type

`` let ecosystemId: `ecosystem.${string}`;

 ``

##### storage

optional

#### Type

`let storage: {

getItem: (key: string) => Promise<null | string>;

removeItem: (key: string) => Promise<void>;

setItem: (key: string, value: string) => Promise<void>;

};

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 whether the device has a stored passkey
## hashMessage

 Ethereum Signed Message hashing

### Example

`import { hashMessage } from "thirdweb/utils";

const hash = hashMessage("hello world");

`

##### Signature

`function hashMessage(

message: SignableMessage,

to_?: TTo,

): HashMessage<TTo>;

`

### Parameters

##### message

 The message to hash, either as a string, a Uint8Array, or an object with a `raw` property containing a Uint8Array.

#### Type

`let message: SignableMessage;

`

##### to\_

optional

 The desired output format of the hash (optional). Defaults to 'hex'.

#### Type

`let to_: TTo;

`

### Returns

##### Return Type

`let returnType: HashMessage<TTo>;

`

 The Ethereum Signed Message hash of the message in the specified format.
## hexToBool

 Converts a hexadecimal string to a boolean value.

### Example

`import { hexToBool } from "thirdweb/utils";

const bool = hexToBool("0x01");

console.log(bool); // true

`

##### Signature

`` function hexToBool(hex: `0x${string}`, opts: Options): boolean;

 ``

### Parameters

##### hex

 The hexadecimal string to convert.

#### Type

`` let hex: `0x${string}`;

 ``

##### opts

 Optional options for the conversion.

#### Type

`let opts: Options;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 The boolean value corresponding to the hexadecimal string.
## hexToBigInt

 Converts a hexadecimal string to a BigInt.

### Example

`import { hexToBigInt } from "thirdweb/utils";

const bigInt = hexToBigInt("0x1a4");

console.log(bigInt); // 420n

`

##### Signature

`` function hexToBigInt(hex: `0x${string}`, opts: Options): bigint;

 ``

### Parameters

##### hex

 The hexadecimal string to convert.

#### Type

`` let hex: `0x${string}`;

 ``

##### opts

 Optional parameters for the conversion.

#### Type

`let opts: Options;

`

### Returns

##### Return Type

`let returnType: bigint;

`

 The BigInt representation of the hexadecimal string.
## hexToBytes

 Converts a hexadecimal string to a Uint8Array of bytes.

### Example

`import { hexToBytes } from "thirdweb/utils";

const bytes = hexToBytes("0x1a4");

console.log(bytes); // Uint8Array(2) [ 1, 164 ]

`

##### Signature

`` function hexToBytes(hex_: `0x${string}`, opts: Options): Uint8Array;

 ``

### Parameters

##### hex\_

 The hexadecimal string to convert.

#### Type

`` let hex_: `0x${string}`;

 ``

##### opts

 Options for converting the hexadecimal string.

#### Type

`let opts: Options;

`

### Returns

##### Return Type

`let returnType: Uint8Array;

`

 The Uint8Array of bytes.
## hexToNumber

 Converts a hexadecimal string to a number.

### Example

`import { hexToNumber } from "thirdweb/utils";

const number = hexToNumber("0x1a4");

console.log(number); // 420

`

##### Signature

`` function hexToNumber(hex: `0x${string}`, opts: Options): number;

 ``

### Parameters

##### hex

 The hexadecimal string to convert.

#### Type

`` let hex: `0x${string}`;

 ``

##### opts

 Optional options for the conversion.

#### Type

`let opts: Options;

`

### Returns

##### Return Type

`let returnType: number;

`

 The converted number.
## hexToString

 Converts a hexadecimal string to a UTF-8 string.

### Example

`import { hexToString } from "thirdweb/utils";

const string = hexToString("0x48656c6c6f2c20776f726c6421");

console.log(string); // "Hello, world!"

`

##### Signature

`` function hexToString(hex: `0x${string}`, opts: Options): string;

 ``

### Parameters

##### hex

 The hexadecimal string to convert.

#### Type

`` let hex: `0x${string}`;

 ``

##### opts

 The options for the conversion.

#### Type

`let opts: Options;

`

### Returns

##### Return Type

`let returnType: string;

`

 The UTF-8 string representation of the hexadecimal string.
## hexToUint8Array

 Converts a hexadecimal string to a Uint8Array.

### Example

`import { hexToUint8Array } from "thirdweb/utils";

const bytes = hexToUint8Array("0x48656c6c6f2c20776f726c6421");

console.log(bytes); // Uint8Array([72, 101, 108, 108, 111, 44, 32, 119, 111, 114, 108, 100, 33])

`

##### Signature

`` function hexToUint8Array(

hex: `0x${string}`,

opts: Options,

): Uint8Array;

 ``

### Parameters

##### hex

 The hexadecimal string to convert.

#### Type

`` let hex: `0x${string}`;

 ``

##### opts

 Options for the conversion.

#### Type

`let opts: Options;

`

### Returns

##### Return Type

`let returnType: Uint8Array;

`

 The Uint8Array representation of the hexadecimal string.
## React Hooks

##### Extensions

##### EIP5792

##### ENS

##### Wallets

##### Wallet Connection

##### Chain

##### Contract

##### Transactions

##### Social API

##### Buy Crypto

##### Utils
## inAppWallet

 Creates an app scoped wallet for users based on various authentication methods. Full list of available authentication methods [ here](https://portal.thirdweb.com/connect/wallet/sign-in-methods/configure) .

 Can also be configured to use Account Abstraction to directly connect to a ERC4337 smart account based on those authentication methods.

### Example

####  Login with socials

`import { inAppWallet } from "thirdweb/wallets";

const wallet = inAppWallet();

const account = await wallet.connect({

 client,

 chain,

 strategy: "google",

});

`

[ View all available social auth methods](https://portal.thirdweb.com/connect/wallet/sign-in-methods/configure)

####  Enable smart accounts and sponsor gas for your users:

`import { inAppWallet } from "thirdweb/wallets";

import { sepolia } from "thirdweb/chains";

const wallet = inAppWallet({

 smartAccount: {

 chain: sepolia,

 sponsorGas: true,

 },

});

// account will be a smart account with sponsored gas enabled

const account = await wallet.connect({

 client,

 strategy: "google",

});

`

####  Login with email

`import {

 inAppWallet,

 preAuthenticate,

} from "thirdweb/wallets/in-app";

const wallet = inAppWallet();

// sends a verification code to the provided email

await preAuthenticate({

 client,

 strategy: "email",

 email: "example@example.com",

});

// login with the verification code

const account = await wallet.connect({

 client,

 chain,

 strategy: "email",

 email: "example@example.com",

 verificationCode: "123456",

});

`

####  Login with SIWE

`import { inAppWallet, createWallet } from "thirdweb/wallets";

const rabby = createWallet("io.rabby");

const inAppWallet = inAppWallet();

const account = await inAppWallet.connect({

 strategy: "wallet",

 chain: mainnet,

 wallet: rabby,

 client: MY_CLIENT,

});

`

####  Login with phone number

`import {

 inAppWallet,

 preAuthenticate,

} from "thirdweb/wallets/in-app";

const wallet = inAppWallet();

// sends a verification code to the provided phone number

await preAuthenticate({

 client,

 strategy: "phone",

 phoneNumber: "+1234567890",

});

// login with the verification code

const account = await wallet.connect({

 client,

 chain,

 strategy: "phone",

 honeNumber: "+1234567890",

 verificationCode: "123456",

});

`

####  Login with passkey

`import {

 inAppWallet,

 hasStoredPasskey,

} from "thirdweb/wallets/in-app";

const wallet = inAppWallet();

const wallet = inAppWallet();

const hasPasskey = await hasStoredPasskey(client);

await wallet.connect({

 client,

 strategy: "passkey",

 type: hasPasskey ? "sign-in" : "sign-up",

});

`

####  Connect to a guest account

`import { inAppWallet } from "thirdweb/wallets";

const wallet = inAppWallet();

const account = await wallet.connect({

 client,

 strategy: "guest",

});

`

####  Connect to a backend account

`import { inAppWallet } from "thirdweb/wallets";

const wallet = inAppWallet();

const account = await wallet.connect({

 client,

 strategy: "backend",

 walletSecret: "...", // Provided by your app

});

`

####  Connect with custom JWT (any OIDC provider)

 You can use any OIDC provider to authenticate your users. Make sure to configure it in your dashboard under in-app wallet settings.

`import { inAppWallet } from "thirdweb/wallets";

const wallet = inAppWallet();

const account = await wallet.connect({

 client,

 strategy: "jwt",

 jwt: "your_jwt_here",

});

`

####  Connect with custom endpoint

 You can also use your own endpoint to authenticate your users. Make sure to configure it in your dashboard under in-app wallet settings.

`import { inAppWallet } from "thirdweb/wallets";

const wallet = inAppWallet();

const account = await wallet.connect({

 client,

 strategy: "auth_endpoint",

 payload: "your_auth_payload_here",

});

`

####  Specify a logo for your login page (Connect UI)

`import { inAppWallet } from "thirdweb/wallets";

const wallet = inAppWallet({

 metadata: {

 image: {

 src: "https://example.com/logo.png",

 alt: "My logo",

 width: 100,

 height: 100,

 },

 },

});

`

####  Hide the ability to export the private key within the Connect Modal UI

`import { inAppWallet } from "thirdweb/wallets";

const wallet = inAppWallet({

 hidePrivateKeyExport: true,

});

`

####  Open the Oauth window in the same tab

 By default, the Oauth window will open in a popup window. You can change this behavior by setting the `auth.mode` option to `"redirect"` .

`import { inAppWallet } from "thirdweb/wallets";

const wallet = inAppWallet({

 auth: {

 mode: "redirect",

 },

});

`

####  Override storage for the wallet state

 By default, wallet state is stored in the browser's local storage. You can override this behavior by providing a custom storage object, useful for server side integrations.

`` import { inAppWallet } from "thirdweb/wallets";

import { AsyncStorage } from "thirdweb/storage";

const myStorage: AsyncStorage = {

getItem: async (key) => {

return customGet(`CUSTOM_STORAGE_KEY${key}`);

 },

setItem: async (key, value) => {

return customSet(`CUSTOM_STORAGE_KEY${key}`, value);

 },

removeItem: async (key) => {

return customRemove(`CUSTOM_STORAGE_KEY${key}`);

 },

};

const wallet = inAppWallet({

 storage: myStorage,

});

 ``

##### Signature

`function inAppWallet(

createOptions?: [InAppWalletCreationOptions](https://portal.thirdweb.com/references/typescript/v5/InAppWalletCreationOptions),

): [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)<"inApp">;

`

### Parameters

##### createOptions

optional

 configuration options Refer to [ InAppWalletCreationOptions](https://portal.thirdweb.com/references/typescript/v5/InAppWalletCreationOptions) to see the available options.

#### Type

`let createOptions:

| {

auth?: {

defaultSmsCountryCode?: SupportedSmsCountry;

mode?: "popup" | "redirect" | "window";

options: Array<[InAppWalletAuth](https://portal.thirdweb.com/references/typescript/v5/InAppWalletAuth)>;

passkeyDomain?: string;

redirectUrl?: string;

 };

hidePrivateKeyExport?: boolean;

metadata?: {

image?: {

alt?: string;

height?: number;

src: string;

width?: number;

 };

 };

partnerId?: string;

smartAccount?: [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions);

storage?: [AsyncStorage](https://portal.thirdweb.com/references/typescript/v5/AsyncStorage);

 }

| undefined;

`

### Returns

##### Return Type

`let returnType: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)<"inApp">;

`

 The created in-app wallet.
## injectedProvider

 Get Injected Provider for given wallet by passing a wallet ID (rdns) using [ EIP-6963](https://eips.ethereum.org/EIPS/eip-6963) Provider Discovery.

### Example

`import { injectedProvider } from "thirdweb/wallets";

const metamaskProvider = injectedProvider("io.metamask");

if (metamaskProvider) {

 console.log("Metamask is installed");

}

`

##### Signature

`function injectedProvider(walletId: [WalletId](https://portal.thirdweb.com/references/typescript/v5/WalletId)): undefined | Ethereum;

`

### Parameters

##### walletId

 The Wallet Id (rdns) to check.

#### Type

`let walletId:

| "walletConnect"

| "inApp"

| "embedded"

| "smart"

| "adapter"

| EcosystemWalletId

| [WCSupportedWalletIds](https://portal.thirdweb.com/references/typescript/v5/WCSupportedWalletIds)

| [InjectedSupportedWalletIds](https://portal.thirdweb.com/references/typescript/v5/InjectedSupportedWalletIds);

`

### Returns

##### Return Type

`let returnType: undefined | Ethereum;

`

 The details of the Injected Provider if it exists. `undefined` otherwise.
## isAddress

 Checks if a given string is a valid address.

### Example

`import { isAddress } from "thirdweb/utils";

isAddress("0x5aAeb6053F3E94C9b9A09f33669435E7Ef1BeAed");

//=> true

`

##### Signature

`` function isAddress(address: string): address is `0x${string}`;

 ``

### Parameters

##### address

 The address to check.

#### Type

`let address: string;

`

### Returns

##### Return Type

`` let returnType: address is (`0x${string}`)

 ``

 True if the address is valid, false otherwise.
## isContractDeployed

 Checks if a contract is deployed by verifying its bytecode.

### Example

`import { getContract } from "thirdweb/contract";

import { isContractDeployed } from "thirdweb/contract/utils";

const contract = getContract({ ... });

const isDeployed = await isContractDeployed(contract);

console.log(isDeployed);

`

##### Signature

`function isContractDeployed(contract: Readonly): Promise<boolean>;

`

### Parameters

##### contract

 The contract to check.

#### Type

`let contract: Readonly;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 A promise that resolves to a boolean indicating whether the contract is deployed or not.
## isBytes

##### Signature

`function isBytes(value: unknown): value is ByteArray;

`

### Parameters

##### value

#### Type

`let value: unknown;

`

### Returns

##### Return Type

`let returnType: value is (ByteArray)

`
## isEIP155Enforced

 Checks whether EIP-155 is enforced by sending a random transaction of legacy type (pre-EIP-155) and parsing the error message.

### Example

`import { isEIP155Enforced } from "thirdweb/utils";

const isEIP155 = await isEIP155Enforced({ chain, client });

`

##### Signature

`function isEIP155Enforced(

options: IsEIP155EnforcedOptions,

): Promise<boolean>;

`

### Parameters

##### options

 The options for checking EIP-155 enforcement.

#### Type

`let options: IsEIP155EnforcedOptions;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 A promise that resolves to a boolean indicating whether EIP-155 is enforced.
## isHex

 Checks if a value is a valid hexadecimal string.

### Example

`import { isHex } from "thirdweb/utils";

const result = isHex("0x1a4");

console.log(result); // true

`

##### Signature

`` function isHex(

value: unknown,

options: Options,

): value is `0x${string}`;

 ``

### Parameters

##### value

 The value to be checked.

#### Type

`let value: unknown;

`

##### options

 Optional configuration for the validation.

#### Type

`let options: Options;

`

### Returns

##### Return Type

`` let returnType: value is (`0x${string}`)

 ``

 True if the value is a valid hexadecimal string, false otherwise.
## isSwapRequiredPostOnramp

 Check if a Swap is required after on-ramp when buying a token with fiat currency.

 If `quote.toToken` and `quote.onRampToken` are the same (same token and chain), it means on-ramp provider can directly send the desired token to the user's wallet and no swap is required.

 If `quote.toToken` and `quote.onRampToken` are different (different token or chain), A swap is required to swap the on-ramp token to the desired token.

##### Signature

`function isSwapRequiredPostOnramp(

buyWithFiatQuote: Pick<[BuyWithFiatQuote](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatQuote), "toToken" | "onRampToken">,

): boolean;

`

### Parameters

##### buyWithFiatQuote

 The quote of type [BuyWithFiatQuote](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatQuote) returned by the [getBuyWithFiatQuote](https://portal.thirdweb.com/references/typescript/v5/getBuyWithFiatQuote) function.

#### Type

`let buyWithFiatQuote: Pick<

[BuyWithFiatQuote](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatQuote),

"toToken" | "onRampToken"

>;

`

### Returns

##### Return Type

`let returnType: boolean;

`
## isValidENSName

 Checks if a string is a valid ENS name. It does not check if the ENS name is currently registered or resolves to an address - it only validates the string format.

### Example

`isValidENSName("thirdweb.eth"); // true

isValidENSName("foo.bar.com"); // true

isValidENSName("xyz"); // false

`

##### Signature

`function isValidENSName(name: string): boolean;

`

### Parameters

##### name

 The ENS name to check.

#### Type

`let name: string;

`

### Returns

##### Return Type

`let returnType: boolean;

`
## isZkSyncChain

 Checks whether the given chain is part of the zksync stack

##### Signature

`function isZkSyncChain(chain: Readonly): Promise<boolean>;

`

### Parameters

##### chain

#### Type

`let chain: Readonly;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`
## isErc6492Signature

### Example

`import { isErc6492Signature } from "thirdweb/auth";

const isErc6492 = isErc6492Signature(

"0x1234567890123456789012345678901234567890",

);

`

##### Signature

`` function isErc6492Signature(signature: `0x${string}`): boolean;

 ``

### Parameters

##### signature

 The signature to check for ERC6492 compatibility

#### Type

`` let signature: `0x${string}`;

 ``

### Returns

##### Return Type

`let returnType: boolean;

`

 True if the signature is compatible with ERC6492, false otherwise
## exists

 Calls the "exists" function on the contract.

### Example

`import { exists } from "thirdweb/extensions/lens";

const result = await exists({

 contract,

 tokenId: ...,

});

`

##### Signature

`function exists(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ExistsParams](https://portal.thirdweb.com/references/typescript/v5/ExistsParams)>,

): Promise<boolean>;

`

### Parameters

##### options

 The options for the exists function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ExistsParams](https://portal.thirdweb.com/references/typescript/v5/ExistsParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 The parsed result of the function call.
## keccakId

 Calculates the keccak ID of the given input.

### Example

`import { keccackId } from "thirdweb/utils";

const keccakId = keccackId(input);

`

##### Signature

`` function keccakId(input: string): `0x${string}`;

 ``

### Parameters

##### input

 The input value to calculate the keccak ID for.

#### Type

`let input: string;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

 The keccak ID as a Hex string.
## keccak256

 Calculates the Keccak-256 hash of the given value.

### Example

`import { keccak256 } from "thirdweb/utils";

const hash = keccak256("0x1234");

`

##### Signature

`` function keccak256(

value: `0x${string}` | Uint8Array<ArrayBufferLike>,

to?: TTo,

): Keccak256Hash<TTo>;

 ``

### Parameters

##### value

 The value to hash, either as a hexadecimal string or a Uint8Array.

#### Type

`` let value: `0x${string}` | Uint8Array<ArrayBufferLike>;

 ``

##### to

optional

 The desired output format of the hash (optional). Defaults to 'hex'.

#### Type

`let to: TTo;

`

### Returns

##### Return Type

`let returnType: Keccak256Hash<TTo>;

`

 The Keccak-256 hash of the value in the specified format.
## getContentURI

 Calls the "getContentURI" function on the contract.

### Example

`import { getContentURI } from "thirdweb/extensions/lens";

const result = await getContentURI({

 contract,

 profileId: ...,

 pubId: ...,

});

`

##### Signature

`function getContentURI(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetContentURIParams](https://portal.thirdweb.com/references/typescript/v5/GetContentURIParams)>,

): Promise<string>;

`

### Parameters

##### options

 The options for the getContentURI function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetContentURIParams](https://portal.thirdweb.com/references/typescript/v5/GetContentURIParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## getFollowData

 Calls the "getFollowData" function on the contract.

### Example

`import { getFollowData } from "thirdweb/extensions/lens";

const result = await getFollowData({

 contract,

 followTokenId: ...,

});

`

##### Signature

`function getFollowData(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetFollowDataParams](https://portal.thirdweb.com/references/typescript/v5/GetFollowDataParams)>,

): Promise<{

followerProfileId: bigint;

followTimestamp: number;

originalFollowTimestamp: number;

profileIdAllowedToRecover: bigint;

}>;

`

### Parameters

##### options

 The options for the getFollowData function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetFollowDataParams](https://portal.thirdweb.com/references/typescript/v5/GetFollowDataParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<{

followerProfileId: bigint;

followTimestamp: number;

originalFollowTimestamp: number;

profileIdAllowedToRecover: bigint;

}>;

`

 The parsed result of the function call.
## getFollowTokenId

 Calls the "getFollowTokenId" function on the contract.

### Example

`import { getFollowTokenId } from "thirdweb/extensions/lens";

const result = await getFollowTokenId({

 contract,

 followerProfileId: ...,

});

`

##### Signature

`function getFollowTokenId(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetFollowTokenIdParams](https://portal.thirdweb.com/references/typescript/v5/GetFollowTokenIdParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the getFollowTokenId function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetFollowTokenIdParams](https://portal.thirdweb.com/references/typescript/v5/GetFollowTokenIdParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## getFollowerProfileId

 Calls the "getFollowerProfileId" function on the contract.

### Example

`import { getFollowerProfileId } from "thirdweb/extensions/lens";

const result = await getFollowerProfileId({

 contract,

 followTokenId: ...,

});

`

##### Signature

`function getFollowerProfileId(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetFollowerProfileIdParams](https://portal.thirdweb.com/references/typescript/v5/GetFollowerProfileIdParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the getFollowerProfileId function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetFollowerProfileIdParams](https://portal.thirdweb.com/references/typescript/v5/GetFollowerProfileIdParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## getFullProfile

 Return the profile data   _with Lens handle_ and optional join date

 In Lens Protocol, each profile is associated with an ERC721 token, thus, the tokenId represent profileId and the 2 terms can be used interchangeably

### Example

`import { getFullProfile } from "thirdweb/extension/lens";

const profileId = 10000n; // profileId is the tokenId of the NFT

const lensProfile = await getFullProfile({ profileId, client });

`

##### Signature

`function getFullProfile(

options: [GetFullProfileParams](https://portal.thirdweb.com/references/typescript/v5/GetFullProfileParams),

): Promise<[FullProfileResponse](https://portal.thirdweb.com/references/typescript/v5/FullProfileResponse)>;

`

### Parameters

##### options

#### Type

`let options: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

includeJoinDate?: boolean;

overrides?: {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

lensHandleAddress?: string;

lensHubAddress?: string;

tokenHandleRegistryAddress?: string;

 };

profileId: bigint;

};

`

### Returns

##### Return Type

`let returnType: {

handle: string;

joinDate: bigint | null;

profileData: [LensProfileSchema](https://portal.thirdweb.com/references/typescript/v5/LensProfileSchema) | null;

} | null;

`
## getFollowerCount

 Calls the "getFollowerCount" function on the contract.

### Example

`import { getFollowerCount } from "thirdweb/extensions/lens";

const result = await getFollowerCount({

 contract,

});

`

##### Signature

`function getFollowerCount(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the getFollowerCount function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## getHandle

 Calls the "getHandle" function on the contract.

### Example

`import { getHandle } from "thirdweb/extensions/lens";

const result = await getHandle({

 contract,

 tokenId: ...,

});

`

##### Signature

`function getHandle(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetHandleParams](https://portal.thirdweb.com/references/typescript/v5/GetHandleParams)>,

): Promise<string>;

`

### Parameters

##### options

 The options for the getHandle function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetHandleParams](https://portal.thirdweb.com/references/typescript/v5/GetHandleParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## getHandleFromProfileId

 Return the Lens handle of a profile in the format: lens/@`<name-of-user>`

### Example

`import { getHandleFromProfileId } from "thirdweb/extensions/lens";

const profileId = 461662n;

const handle = await getHandleFromProfileId({ profileId, client }); // "lens/@captain_jack"

`

##### Signature

`function getHandleFromProfileId(

options: [GetHandleFromProfileIdParams](https://portal.thirdweb.com/references/typescript/v5/GetHandleFromProfileIdParams),

): Promise<null | string>;

`

### Parameters

##### options

#### Type

`let options: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

overrides?: {

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

lensHandleAddress?: string;

tokenHandleRegistryAddress?: string;

 };

profileId: bigint;

};

`

### Returns

##### Return Type

`let returnType: Promise<null | string>;

`
## getHandleTokenURIContract

 Calls the "getHandleTokenURIContract" function on the contract.

### Example

`import { getHandleTokenURIContract } from "thirdweb/extensions/lens";

const result = await getHandleTokenURIContract({

 contract,

});

`

##### Signature

`function getHandleTokenURIContract(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<string>;

`

### Parameters

##### options

 The options for the getHandleTokenURIContract function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## getLocalName

 Calls the "getLocalName" function on the contract.

### Example

`import { getLocalName } from "thirdweb/extensions/lens";

const result = await getLocalName({

 contract,

 tokenId: ...,

});

`

##### Signature

`function getLocalName(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetLocalNameParams](https://portal.thirdweb.com/references/typescript/v5/GetLocalNameParams)>,

): Promise<string>;

`

### Parameters

##### options

 The options for the getLocalName function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetLocalNameParams](https://portal.thirdweb.com/references/typescript/v5/GetLocalNameParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## getModuleTypes

 Calls the "getModuleTypes" function on the contract.

### Example

`import { getModuleTypes } from "thirdweb/extensions/lens";

const result = await getModuleTypes({

 contract,

 moduleAddress: ...,

});

`

##### Signature

`function getModuleTypes(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetModuleTypesParams](https://portal.thirdweb.com/references/typescript/v5/GetModuleTypesParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the getModuleTypes function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetModuleTypesParams](https://portal.thirdweb.com/references/typescript/v5/GetModuleTypesParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## getProfile

 Calls the "getProfile" function on the contract.

### Example

`import { getProfile } from "thirdweb/extensions/lens";

const result = await getProfile({

 contract,

 profileId: ...,

});

`

##### Signature

`function getProfile(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetProfileParams](https://portal.thirdweb.com/references/typescript/v5/GetProfileParams)>,

): Promise<{

__DEPRECATED__followNFTURI: string;

__DEPRECATED__handle: string;

__DEPRECATED__imageURI: string;

followModule: string;

followNFT: string;

metadataURI: string;

pubCount: bigint;

}>;

`

### Parameters

##### options

 The options for the getProfile function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetProfileParams](https://portal.thirdweb.com/references/typescript/v5/GetProfileParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<{

__DEPRECATED__followNFTURI: string;

__DEPRECATED__handle: string;

__DEPRECATED__imageURI: string;

followModule: string;

followNFT: string;

metadataURI: string;

pubCount: bigint;

}>;

`

 The parsed result of the function call.
## getOriginalFollowTimestamp

 Calls the "getOriginalFollowTimestamp" function on the contract.

### Example

`import { getOriginalFollowTimestamp } from "thirdweb/extensions/lens";

const result = await getOriginalFollowTimestamp({

 contract,

 followTokenId: ...,

});

`

##### Signature

`function getOriginalFollowTimestamp(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetOriginalFollowTimestampParams](https://portal.thirdweb.com/references/typescript/v5/GetOriginalFollowTimestampParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the getOriginalFollowTimestamp function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetOriginalFollowTimestampParams](https://portal.thirdweb.com/references/typescript/v5/GetOriginalFollowTimestampParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## getProfileIdAllowedToRecover

 Calls the "getProfileIdAllowedToRecover" function on the contract.

### Example

`import { getProfileIdAllowedToRecover } from "thirdweb/extensions/lens";

const result = await getProfileIdAllowedToRecover({

 contract,

 followTokenId: ...,

});

`

##### Signature

`function getProfileIdAllowedToRecover(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetProfileIdAllowedToRecoverParams](https://portal.thirdweb.com/references/typescript/v5/GetProfileIdAllowedToRecoverParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the getProfileIdAllowedToRecover function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetProfileIdAllowedToRecoverParams](https://portal.thirdweb.com/references/typescript/v5/GetProfileIdAllowedToRecoverParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## getProfileIdByHandleHash

 Calls the "getProfileIdByHandleHash" function on the contract.

### Example

`import { getProfileIdByHandleHash } from "thirdweb/extensions/lens";

const result = await getProfileIdByHandleHash({

 contract,

 handleHash: ...,

});

`

##### Signature

`function getProfileIdByHandleHash(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetProfileIdByHandleHashParams](https://portal.thirdweb.com/references/typescript/v5/GetProfileIdByHandleHashParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the getProfileIdByHandleHash function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetProfileIdByHandleHashParams](https://portal.thirdweb.com/references/typescript/v5/GetProfileIdByHandleHashParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## getProfileMetadata

 Download user lens profile from Arweave This method does NOT give you the user handle & join-time - consider using `getFullProfileData` instead It is useful & cost efficient if you only want to get user's name, bio, picture, coverPicture etc.

### Example

`import { getProfileMetadata } from "thirdweb/extensions/lens";

const profileData = await getProfileMetadata({ profileId, client });

if (profileData) {

 console.log("Display name: ", profileData.lens.name);

 console.log("Bio: ", profileData.lens.bio);

}

`

##### Signature

`function getProfileMetadata(

options: [GetProfileMetadataParams](https://portal.thirdweb.com/references/typescript/v5/GetProfileMetadataParams),

): Promise<null | [LensProfileSchema](https://portal.thirdweb.com/references/typescript/v5/LensProfileSchema)>;

`

### Parameters

##### options

#### Type

`let options: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

overrides?: { chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain); lensHubAddress?: string };

profileId: bigint;

};

`

### Returns

##### Return Type

`let returnType: {

lens: {

appId?: string;

attributes: Array<MetadataAttribute>;

bio: string;

coverPicture: string;

id: string;

name: string;

picture: string;

 };

signature: string;

};

`

 LensProfileSchema | null
## getTokenId

 Calls the "getTokenId" function on the contract.

### Example

`import { getTokenId } from "thirdweb/extensions/lens";

const result = await getTokenId({

 contract,

 localName: ...,

});

`

##### Signature

`function getTokenId(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetTokenIdParams](https://portal.thirdweb.com/references/typescript/v5/GetTokenIdParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the getTokenId function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetTokenIdParams](https://portal.thirdweb.com/references/typescript/v5/GetTokenIdParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## getPublication

 Calls the "getPublication" function on the contract.

### Example

`import { getPublication } from "thirdweb/extensions/lens";

const result = await getPublication({

 contract,

 profileId: ...,

 pubId: ...,

});

`

##### Signature

`function getPublication(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetPublicationParams](https://portal.thirdweb.com/references/typescript/v5/GetPublicationParams)>,

): Promise<{

__DEPRECATED__collectModule: string;

__DEPRECATED__collectNFT: string;

contentURI: string;

pointedProfileId: bigint;

pointedPubId: bigint;

pubType: number;

referenceModule: string;

rootProfileId: bigint;

rootPubId: bigint;

}>;

`

### Parameters

##### options

 The options for the getPublication function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetPublicationParams](https://portal.thirdweb.com/references/typescript/v5/GetPublicationParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<{

__DEPRECATED__collectModule: string;

__DEPRECATED__collectNFT: string;

contentURI: string;

pointedProfileId: bigint;

pointedPubId: bigint;

pubType: number;

referenceModule: string;

rootProfileId: bigint;

rootPubId: bigint;

}>;

`

 The parsed result of the function call.
## isFollowing

 Calls the "isFollowing" function on the contract.

### Example

`import { isFollowing } from "thirdweb/extensions/lens";

const result = await isFollowing({

 contract,

 followerProfileId: ...,

});

`

##### Signature

`function isFollowing(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsFollowingParams](https://portal.thirdweb.com/references/typescript/v5/IsFollowingParams)>,

): Promise<boolean>;

`

### Parameters

##### options

 The options for the isFollowing function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsFollowingParams](https://portal.thirdweb.com/references/typescript/v5/IsFollowingParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 The parsed result of the function call.
## isErc20CurrencyRegistered

 Calls the "isErc20CurrencyRegistered" function on the contract.

### Example

`import { isErc20CurrencyRegistered } from "thirdweb/extensions/lens";

const result = await isErc20CurrencyRegistered({

 contract,

 currencyAddress: ...,

});

`

##### Signature

`function isErc20CurrencyRegistered(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsErc20CurrencyRegisteredParams](https://portal.thirdweb.com/references/typescript/v5/IsErc20CurrencyRegisteredParams)>,

): Promise<boolean>;

`

### Parameters

##### options

 The options for the isErc20CurrencyRegistered function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsErc20CurrencyRegisteredParams](https://portal.thirdweb.com/references/typescript/v5/IsErc20CurrencyRegisteredParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 The parsed result of the function call.
## isModuleRegistered

 Calls the "isModuleRegistered" function on the contract.

### Example

`import { isModuleRegistered } from "thirdweb/extensions/lens";

const result = await isModuleRegistered({

 contract,

 moduleAddress: ...,

});

`

##### Signature

`function isModuleRegistered(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsModuleRegisteredParams](https://portal.thirdweb.com/references/typescript/v5/IsModuleRegisteredParams)>,

): Promise<boolean>;

`

### Parameters

##### options

 The options for the isModuleRegistered function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsModuleRegisteredParams](https://portal.thirdweb.com/references/typescript/v5/IsModuleRegisteredParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 The parsed result of the function call.
## isModuleRegisteredAs

 Calls the "isModuleRegisteredAs" function on the contract.

### Example

`import { isModuleRegisteredAs } from "thirdweb/extensions/lens";

const result = await isModuleRegisteredAs({

 contract,

 moduleAddress: ...,

 moduleType: ...,

});

`

##### Signature

`function isModuleRegisteredAs(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsModuleRegisteredAsParams](https://portal.thirdweb.com/references/typescript/v5/IsModuleRegisteredAsParams)>,

): Promise<boolean>;

`

### Parameters

##### options

 The options for the isModuleRegisteredAs function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsModuleRegisteredAsParams](https://portal.thirdweb.com/references/typescript/v5/IsModuleRegisteredAsParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 The parsed result of the function call.
## mintTimestampOf

 Calls the "mintTimestampOf" function on the contract.

### Example

`import { mintTimestampOf } from "thirdweb/extensions/lens";

const result = await mintTimestampOf({

 contract,

 tokenId: ...,

});

`

##### Signature

`function mintTimestampOf(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MintTimestampOfParams](https://portal.thirdweb.com/references/typescript/v5/MintTimestampOfParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the mintTimestampOf function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MintTimestampOfParams](https://portal.thirdweb.com/references/typescript/v5/MintTimestampOfParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## mintTimestampOfFollowNFT

 Calls the "mintTimestampOf" function on the contract.

### Example

`import { mintTimestampOf } from "thirdweb/extensions/lens";

const result = await mintTimestampOf({

 contract,

 tokenId: ...,

});

`

##### Signature

`function mintTimestampOfFollowNFT(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MintTimestampOfParams](https://portal.thirdweb.com/references/typescript/v5/MintTimestampOfParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the mintTimestampOf function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MintTimestampOfParams](https://portal.thirdweb.com/references/typescript/v5/MintTimestampOfParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## resolveAddress

 Take in a Lens handle or local-name and return the wallet address behind that handle/local-name. For example, "lens/vitalik" is a handle, with "lens" being the namespace and "vitalik" being the local name

### Example

`import { resolveAddress } from "thirdweb/extensions/lens";

const walletAddress = await resolveAddress({

 name: "vitalik",

 client,

});

`

##### Signature

`function resolveAddress(

options: [ResolveLensAddressParams](https://portal.thirdweb.com/references/typescript/v5/ResolveLensAddressParams),

): Promise<string>;

`

### Parameters

##### options

#### Type

`let options: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

name: string;

overrides?: { chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain); lensHandleContractAddress?: string };

};

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`
## nonces

 Calls the "nonces" function on the contract.

### Example

`import { nonces } from "thirdweb/extensions/lens";

const result = await nonces({

 contract,

 signer: ...,

});

`

##### Signature

`function nonces(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[NoncesParams](https://portal.thirdweb.com/references/typescript/v5/NoncesParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the nonces function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[NoncesParams](https://portal.thirdweb.com/references/typescript/v5/NoncesParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## resolve

 Calls the "resolve" function on the contract.

### Example

`import { resolve } from "thirdweb/extensions/lens";

const result = await resolve({

 contract,

 handleId: ...,

});

`

##### Signature

`function resolve(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ResolveParams](https://portal.thirdweb.com/references/typescript/v5/ResolveParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the resolve function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ResolveParams](https://portal.thirdweb.com/references/typescript/v5/ResolveParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## tokenDataOf

 Calls the "tokenDataOf" function on the contract.

### Example

`import { tokenDataOf } from "thirdweb/extensions/lens";

const result = await tokenDataOf({

 contract,

 tokenId: ...,

});

`

##### Signature

`function tokenDataOf(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[TokenDataOfParams](https://portal.thirdweb.com/references/typescript/v5/TokenDataOfParams)>,

): Promise<{ mintTimestamp: bigint; owner: string }>;

`

### Parameters

##### options

 The options for the tokenDataOf function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[TokenDataOfParams](https://portal.thirdweb.com/references/typescript/v5/TokenDataOfParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<{ mintTimestamp: bigint; owner: string }>;

`

 The parsed result of the function call.
## lightTheme

 Create a custom light theme object by using the default dark theme as a base and applying overrides.

### Example

####  Get the default light theme

`const defaultLightTheme = lightTheme();

`

####  Create a custom light theme

`const customTheme = lightTheme({

 colors: {

 modalBg: "red",

 },

});

`

##### Signature

`function lightTheme(overrides?: [ThemeOverrides](https://portal.thirdweb.com/references/typescript/v5/ThemeOverrides)): [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme);

`

### Parameters

##### overrides

optional

 The overrides to apply to the default light theme.

#### Type

`let overrides: {

 [key in Exclude<keyof [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme), "type">]: Partial<[Theme](https://portal.thirdweb.com/references/typescript/v5/Theme)[key]>;

};

`

### Returns

##### Return Type

`let returnType: {

colors: {

accentButtonBg: string;

accentButtonText: string;

accentText: string;

borderColor: string;

connectedButtonBg: string;

connectedButtonBgHover: string;

danger: string;

inputAutofillBg: string;

modalBg: string;

modalOverlayBg: string;

primaryButtonBg: string;

primaryButtonText: string;

primaryText: string;

scrollbarBg: string;

secondaryButtonBg: string;

secondaryButtonHoverBg: string;

secondaryButtonText: string;

secondaryIconColor: string;

secondaryIconHoverBg: string;

secondaryIconHoverColor: string;

secondaryText: string;

selectedTextBg: string;

selectedTextColor: string;

separatorLine: string;

skeletonBg: string;

success: string;

tertiaryBg: string;

tooltipBg: string;

tooltipText: string;

 };

fontFamily: string;

type: "light" | "dark";

};

`

 Theme object
## linkProfile

 Connects a new profile (and new authentication method) to the current user.

 Requires a connected in-app or ecosystem account.

 _When a profile is linked to the account, that profile can then be used to sign into the same account._

### Example

`import { linkProfile } from "thirdweb/wallets";

// optionally specify the ecosystem if you're linking an ecosystem wallet

await linkProfile({ client, strategy: "discord" });

`

##### Signature

`function linkProfile(args: AuthArgsType): Promise<Array<[Profile](https://portal.thirdweb.com/references/typescript/v5/Profile)>>;

`

### Parameters

##### args

#### Type

`let args: AuthArgsType;

`

### Returns

##### Return Type

`let returnType: {

details: {

address?: [Address](https://portal.thirdweb.com/references/typescript/v5/Address);

email?: string;

id?: string;

phone?: string;

 };

type: AuthOption;

};

`

 A promise that resolves to the currently linked profiles when the connection is successful.
## acceptOffer

 Accepts an offer after performing necessary checks and validations. Throws an error if the offer is not active, the offeror's balance is insufficient, or the offeror's allowance is insufficient.

### Example

`import { acceptOffer } from "thirdweb/extensions/marketplace";

import { sendTransaction } from "thirdweb";

const acceptOfferTx = acceptOffer({

 contract,

 offerId: 1n,

});

await sendTransaction({ transaction, account });

`

##### Signature

`function acceptOffer(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[AcceptOfferParams](https://portal.thirdweb.com/references/typescript/v5/AcceptOfferParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for accepting the offer.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[AcceptOfferParams](https://portal.thirdweb.com/references/typescript/v5/AcceptOfferParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A transaction object that can be sent to accept the offer.
## approveBuyerForListing

 Prepares a transaction to call the "approveBuyerForListing" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { approveBuyerForListing } from "thirdweb/extensions/marketplace";

const transaction = approveBuyerForListing({

 contract,

 listingId: ...,

 buyer: ...,

 toApprove: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function approveBuyerForListing(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [ApproveBuyerForListingParams](https://portal.thirdweb.com/references/typescript/v5/ApproveBuyerForListingParams)

| { asyncParams: () => Promise<[ApproveBuyerForListingParams](https://portal.thirdweb.com/references/typescript/v5/ApproveBuyerForListingParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "approveBuyerForListing" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [ApproveBuyerForListingParams](https://portal.thirdweb.com/references/typescript/v5/ApproveBuyerForListingParams)

| { asyncParams: () => Promise<[ApproveBuyerForListingParams](https://portal.thirdweb.com/references/typescript/v5/ApproveBuyerForListingParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## acceptedOfferEvent

 Creates an event object for the AcceptedOffer event.

### Example

`import { getContractEvents } from "thirdweb";

import { acceptedOfferEvent } from "thirdweb/extensions/marketplace";

const events = await getContractEvents({

contract,

events: [

acceptedOfferEvent({

 offeror: ...,

 offerId: ...,

 assetContract: ...,

})

],

});

`

##### Signature

`function acceptedOfferEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "offeror";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "offerId";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "assetContract";

readonly type: "address";

 },

 { readonly name: "tokenId"; readonly type: "uint256" },

 { readonly name: "seller"; readonly type: "address" },

 { readonly name: "quantityBought"; readonly type: "uint256" },

 { readonly name: "totalPricePaid"; readonly type: "uint256" },

 ];

readonly name: "AcceptedOffer";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "offeror";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "offerId";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "assetContract";

readonly type: "address";

 },

 { readonly name: "tokenId"; readonly type: "uint256" },

 { readonly name: "seller"; readonly type: "address" },

 { readonly name: "quantityBought"; readonly type: "uint256" },

 { readonly name: "totalPricePaid"; readonly type: "uint256" },

 ];

readonly name: "AcceptedOffer";

readonly type: "event";

}>;

`

 The prepared event object.
## approveCurrencyForListing

 Prepares a transaction to call the "approveCurrencyForListing" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { approveCurrencyForListing } from "thirdweb/extensions/marketplace";

const transaction = approveCurrencyForListing({

 contract,

 listingId: ...,

 currency: ...,

 pricePerTokenInCurrency: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function approveCurrencyForListing(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [ApproveCurrencyForListingParams](https://portal.thirdweb.com/references/typescript/v5/ApproveCurrencyForListingParams)

| { asyncParams: () => Promise<[ApproveCurrencyForListingParams](https://portal.thirdweb.com/references/typescript/v5/ApproveCurrencyForListingParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "approveCurrencyForListing" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [ApproveCurrencyForListingParams](https://portal.thirdweb.com/references/typescript/v5/ApproveCurrencyForListingParams)

| { asyncParams: () => Promise<[ApproveCurrencyForListingParams](https://portal.thirdweb.com/references/typescript/v5/ApproveCurrencyForListingParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## bidInAuction

 Places a bid in an English auction.

### Example

`import { bidInAuction } from "thirdweb/extensions/marketplace";

import { sendTransaction } from "thirdweb";

const transaction = bidInAuction({

 contract,

 auctionId: 0n,

 bidAmount: "100",

});

await sendTransaction({ transaction, account });

`

##### Signature

`function bidInAuction(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[BidInAuctionParams](https://portal.thirdweb.com/references/typescript/v5/BidInAuctionParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for placing the bid.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[BidInAuctionParams](https://portal.thirdweb.com/references/typescript/v5/BidInAuctionParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A transaction that can be sent to place the bid.
## auctionClosedEvent

 Creates an event object for the AuctionClosed event.

### Example

`import { getContractEvents } from "thirdweb";

import { auctionClosedEvent } from "thirdweb/extensions/marketplace";

const events = await getContractEvents({

contract,

events: [

auctionClosedEvent({

 auctionId: ...,

 assetContract: ...,

 closer: ...,

})

],

});

`

##### Signature

`function auctionClosedEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "auctionId";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "assetContract";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "closer";

readonly type: "address";

 },

 { readonly name: "tokenId"; readonly type: "uint256" },

 { readonly name: "auctionCreator"; readonly type: "address" },

 { readonly name: "winningBidder"; readonly type: "address" },

 ];

readonly name: "AuctionClosed";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "auctionId";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "assetContract";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "closer";

readonly type: "address";

 },

 { readonly name: "tokenId"; readonly type: "uint256" },

 { readonly name: "auctionCreator"; readonly type: "address" },

 { readonly name: "winningBidder"; readonly type: "address" },

 ];

readonly name: "AuctionClosed";

readonly type: "event";

}>;

`

 The prepared event object.
## buyoutAuction

 Buys out an English auction.

### Example

`import { buyoutAuction } from "thirdweb/extensions/marketplace";

import { sendTransaction } from "thirdweb";

const transaction = buyoutAuction({

 contract,

 auctionId: 0n,

});

await sendTransaction({ transaction, account });

`

##### Signature

`function buyoutAuction(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[BuyoutAuctionParams](https://portal.thirdweb.com/references/typescript/v5/BuyoutAuctionParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for buying out the auction.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[BuyoutAuctionParams](https://portal.thirdweb.com/references/typescript/v5/BuyoutAuctionParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A transaction that can be sent to buy out the auction.
## cancelListing

 Prepares a transaction to call the "cancelListing" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { cancelListing } from "thirdweb/extensions/marketplace";

const transaction = cancelListing({

 contract,

 listingId: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function cancelListing(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [CancelListingParams](https://portal.thirdweb.com/references/typescript/v5/CancelListingParams)

| { asyncParams: () => Promise<[CancelListingParams](https://portal.thirdweb.com/references/typescript/v5/CancelListingParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "cancelListing" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [CancelListingParams](https://portal.thirdweb.com/references/typescript/v5/CancelListingParams)

| { asyncParams: () => Promise<[CancelListingParams](https://portal.thirdweb.com/references/typescript/v5/CancelListingParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## getInitializeTransaction

 Prepares the initialization transaction for a contract deployment

##### Signature

`function getInitializeTransaction(options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

deployMetadata: [FetchDeployMetadataResult](https://portal.thirdweb.com/references/typescript/v5/FetchDeployMetadataResult);

implementationContract: Readonly;

initializeParams?: Record<string, unknown>;

modules?: Array<{

deployMetadata: [FetchDeployMetadataResult](https://portal.thirdweb.com/references/typescript/v5/FetchDeployMetadataResult);

initializeParams?: Record<string, unknown>;

 }>;

}): Promise<

[PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<[], AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>

>;

`

### Parameters

##### options

 The options for generating the initialize transaction

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

deployMetadata: [FetchDeployMetadataResult](https://portal.thirdweb.com/references/typescript/v5/FetchDeployMetadataResult);

implementationContract: Readonly;

initializeParams?: Record<string, unknown>;

modules?: Array<{

deployMetadata: [FetchDeployMetadataResult](https://portal.thirdweb.com/references/typescript/v5/FetchDeployMetadataResult);

initializeParams?: Record<string, unknown>;

 }>;

};

`

### Returns

##### Return Type

`let returnType: Readonly<options> & {

__contract?: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi>;

__preparedMethod?: () => Promise<PreparedMethod<abiFn>>;

};

`

 The prepared transaction for contract initialization
## cancelAuction

 Cancels an auction by providing the necessary options.

### Example

`import { cancelAuction } from "thirdweb/extensions/marketplace";

import { sendTransaction } from "thirdweb";

const transaction = cancelAuction({

 contract,

 auctionId: 0n,

});

await sendTransaction({ transaction, account });

`

##### Signature

`function cancelAuction(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[CancelAuctionParams](https://portal.thirdweb.com/references/typescript/v5/CancelAuctionParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for canceling the auction.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[CancelAuctionParams](https://portal.thirdweb.com/references/typescript/v5/CancelAuctionParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A transaction that can be sent to cancel the auction.
## cancelOffer

 Prepares a transaction to call the "cancelOffer" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { cancelOffer } from "thirdweb/extensions/marketplace";

const transaction = cancelOffer({

 contract,

 offerId: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function cancelOffer(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [CancelOfferParams](https://portal.thirdweb.com/references/typescript/v5/CancelOfferParams)

| { asyncParams: () => Promise<[CancelOfferParams](https://portal.thirdweb.com/references/typescript/v5/CancelOfferParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "cancelOffer" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [CancelOfferParams](https://portal.thirdweb.com/references/typescript/v5/CancelOfferParams)

| { asyncParams: () => Promise<[CancelOfferParams](https://portal.thirdweb.com/references/typescript/v5/CancelOfferParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## cancelledAuctionEvent

 Creates an event object for the CancelledAuction event.

### Example

`import { getContractEvents } from "thirdweb";

import { cancelledAuctionEvent } from "thirdweb/extensions/marketplace";

const events = await getContractEvents({

contract,

events: [

cancelledAuctionEvent({

 auctionCreator: ...,

 auctionId: ...,

})

],

});

`

##### Signature

`function cancelledAuctionEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "auctionCreator";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "auctionId";

readonly type: "uint256";

 },

 ];

readonly name: "CancelledAuction";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "auctionCreator";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "auctionId";

readonly type: "uint256";

 },

 ];

readonly name: "CancelledAuction";

readonly type: "event";

}>;

`

 The prepared event object.
## cancelledOfferEvent

 Creates an event object for the CancelledOffer event.

### Example

`import { getContractEvents } from "thirdweb";

import { cancelledOfferEvent } from "thirdweb/extensions/marketplace";

const events = await getContractEvents({

contract,

events: [

cancelledOfferEvent({

 offeror: ...,

 offerId: ...,

})

],

});

`

##### Signature

`function cancelledOfferEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "offeror";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "offerId";

readonly type: "uint256";

 },

 ];

readonly name: "CancelledOffer";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "offeror";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "offerId";

readonly type: "uint256";

 },

 ];

readonly name: "CancelledOffer";

readonly type: "event";

}>;

`

 The prepared event object.
## cancelledListingEvent

 Creates an event object for the CancelledListing event.

### Example

`import { getContractEvents } from "thirdweb";

import { cancelledListingEvent } from "thirdweb/extensions/marketplace";

const events = await getContractEvents({

contract,

events: [

cancelledListingEvent({

 listingCreator: ...,

 listingId: ...,

})

],

});

`

##### Signature

`function cancelledListingEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "listingCreator";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "listingId";

readonly type: "uint256";

 },

 ];

readonly name: "CancelledListing";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "listingCreator";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "listingId";

readonly type: "uint256";

 },

 ];

readonly name: "CancelledListing";

readonly type: "event";

}>;

`

 The prepared event object.
## collectAuctionTokens

 Prepares a transaction to call the "collectAuctionTokens" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { collectAuctionTokens } from "thirdweb/extensions/marketplace";

const transaction = collectAuctionTokens({

 contract,

 auctionId: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function collectAuctionTokens(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [CollectAuctionTokensParams](https://portal.thirdweb.com/references/typescript/v5/CollectAuctionTokensParams)

| { asyncParams: () => Promise<[CollectAuctionTokensParams](https://portal.thirdweb.com/references/typescript/v5/CollectAuctionTokensParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "collectAuctionTokens" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [CollectAuctionTokensParams](https://portal.thirdweb.com/references/typescript/v5/CollectAuctionTokensParams)

| { asyncParams: () => Promise<[CollectAuctionTokensParams](https://portal.thirdweb.com/references/typescript/v5/CollectAuctionTokensParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## createAuction

 Creates an auction.

### Example

`import { createAuction } from "thirdweb/extensions/marketplace";

import { sendTransaction } from "thirdweb";

const transaction = createAuction({...});

await sendTransaction({ transaction, account });

`

##### Signature

`function createAuction(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[CreateAuctionParams](https://portal.thirdweb.com/references/typescript/v5/CreateAuctionParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for creating the auction.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[CreateAuctionParams](https://portal.thirdweb.com/references/typescript/v5/CreateAuctionParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 The result of creating the auction.
## createListing

 Creates a direct listing.

### Example

`import { createListing } from "thirdweb/extensions/marketplace";

import { sendTransaction } from "thirdweb";

const transaction = createListing({

 assetContractAddress: "0x...", // the NFT contract address that you want to sell

 tokenId={0n}, // the token id you want to sell

 pricePerToken="0.1" // sell for 0.1 <native token>

});

await sendTransaction({ transaction, account });

`

##### Signature

`function createListing(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[CreateListingParams](https://portal.thirdweb.com/references/typescript/v5/CreateListingParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for creating the direct listing.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[CreateListingParams](https://portal.thirdweb.com/references/typescript/v5/CreateListingParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 The result of creating the direct listing.
## collectAuctionPayout

 Prepares a transaction to call the "collectAuctionPayout" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { collectAuctionPayout } from "thirdweb/extensions/marketplace";

const transaction = collectAuctionPayout({

 contract,

 auctionId: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function collectAuctionPayout(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [CollectAuctionPayoutParams](https://portal.thirdweb.com/references/typescript/v5/CollectAuctionPayoutParams)

| { asyncParams: () => Promise<[CollectAuctionPayoutParams](https://portal.thirdweb.com/references/typescript/v5/CollectAuctionPayoutParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "collectAuctionPayout" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [CollectAuctionPayoutParams](https://portal.thirdweb.com/references/typescript/v5/CollectAuctionPayoutParams)

| { asyncParams: () => Promise<[CollectAuctionPayoutParams](https://portal.thirdweb.com/references/typescript/v5/CollectAuctionPayoutParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## currencyApprovedForListingEvent

 Creates an event object for the CurrencyApprovedForListing event.

### Example

`import { getContractEvents } from "thirdweb";

import { currencyApprovedForListingEvent } from "thirdweb/extensions/marketplace";

const events = await getContractEvents({

contract,

events: [

currencyApprovedForListingEvent({

 listingId: ...,

 currency: ...,

})

],

});

`

##### Signature

`function currencyApprovedForListingEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "listingId";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "currency";

readonly type: "address";

 },

 { readonly name: "pricePerToken"; readonly type: "uint256" },

 ];

readonly name: "CurrencyApprovedForListing";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "listingId";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "currency";

readonly type: "address";

 },

 { readonly name: "pricePerToken"; readonly type: "uint256" },

 ];

readonly name: "CurrencyApprovedForListing";

readonly type: "event";

}>;

`

 The prepared event object.
## currencyPriceForListing

 Retrieves the currency price for a listing.

### Example

`import { currencyPriceForListing } from "thirdweb/extensions/marketplace";

const price = await currencyPriceForListing({

 contract,

 listingId: 1n,

 currency: "0x...",

});

`

##### Signature

`function currencyPriceForListing(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[CurrencyPriceForListingParams](https://portal.thirdweb.com/references/typescript/v5/CurrencyPriceForListingParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for retrieving the currency price.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[CurrencyPriceForListingParams](https://portal.thirdweb.com/references/typescript/v5/CurrencyPriceForListingParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 A promise that resolves to the currency price as a bigint.
## deployMarketplaceContract

 Deploys a marketplace contract.

### Example

`import { deployMarketplaceContract } from "thirdweb/deploys";

const address = await deployMarketplaceContract({

 client,

 chain,

 account,

 params: {

 name: "MarketplaceV3",

 description: "MarketplaceV3 deployed using thirdweb SDK",

 platformFeeRecipient:

"0x21d514c90ee4E4e4Cd16Ce9185BF01F0F1eE4A04",

 platformFeeBps: 1000,

 },

});

`

##### Signature

`function deployMarketplaceContract(options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

params: [MarketplaceContractParams](https://portal.thirdweb.com/references/typescript/v5/MarketplaceContractParams);

version?: string;

}): Promise<string>;

`

### Parameters

##### options

 The options for deploying the marketplace contract.

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

params: [MarketplaceContractParams](https://portal.thirdweb.com/references/typescript/v5/MarketplaceContractParams);

version?: string;

};

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`
## executeSale

 Executes a sale for an English auction.

### Example

`import { executeSale } from "thirdweb/extensions/marketplace";

import { sendTransaction } from "thirdweb";

const transaction = executeSale({

 contract,

 auctionId: 0n,

});

await sendTransaction({ transaction, account });

`

##### Signature

`function executeSale(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ExecuteSaleParams](https://portal.thirdweb.com/references/typescript/v5/ExecuteSaleParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for executing the sale.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ExecuteSaleParams](https://portal.thirdweb.com/references/typescript/v5/ExecuteSaleParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A transaction that can be sent to execute the sale.
## getAllAuctions

 Retrieves all auctions based on the provided options.

### Example

`import { getAllAuctions } from "thirdweb/extensions/marketplace";

const listings = await getAllAuctions({

 contract,

 start: 0,

 count: 10,

});

`

##### Signature

`function getAllAuctions(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetAllAuctionParams](https://portal.thirdweb.com/references/typescript/v5/GetAllAuctionParams)>,

): Promise<Array<[EnglishAuction](https://portal.thirdweb.com/references/typescript/v5/EnglishAuction)>>;

`

### Parameters

##### options

 The options for retrieving the auctions.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetAllAuctionParams](https://portal.thirdweb.com/references/typescript/v5/GetAllAuctionParams)>;

`

### Returns

##### Return Type

`let returnType: {

asset: [NFT](https://portal.thirdweb.com/references/typescript/v5/NFT);

assetContractAddress: Address;

bidBufferBps: bigint;

buyoutBidAmount: bigint;

buyoutCurrencyValue: [GetBalanceResult](https://portal.thirdweb.com/references/typescript/v5/GetBalanceResult);

creatorAddress: Address;

currencyContractAddress: Address;

endTimeInSeconds: bigint;

id: bigint;

minimumBidAmount: bigint;

minimumBidCurrencyValue: [GetBalanceResult](https://portal.thirdweb.com/references/typescript/v5/GetBalanceResult);

quantity: bigint;

startTimeInSeconds: bigint;

status: ListingStatus;

timeBufferInSeconds: bigint;

tokenId: bigint;

type: "english-auction";

};

`

 A promise that resolves to the auctions array.
## buyFromListing

 Buys a listing from the marketplace.

### Example

`import { buyFromListing } from "thirdweb/extensions/marketplace";

import { sendTransaction } from "thirdweb";

const transaction = buyFromListing({

 contract,

 listingId: 1n,

 quantity: 1n,

 recipient: "0x...",

});

await sendTransaction({ transaction, account });

`

 When using `buyFromListing` with Pay, the `erc20Value` will be automatically set to the listing currency.

##### Signature

`function buyFromListing(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[BuyFromListingParams](https://portal.thirdweb.com/references/typescript/v5/BuyFromListingParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for buying from a listing.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[BuyFromListingParams](https://portal.thirdweb.com/references/typescript/v5/BuyFromListingParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A promise that resolves to the transaction result.
## getAllListings

 Retrieves all direct listings based on the provided options.

### Example

`import { getAllListings } from "thirdweb/extensions/marketplace";

const listings = await getAllListings({

 contract,

 start: 0,

 count: 10,

});

`

##### Signature

`function getAllListings(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetAllListingParams](https://portal.thirdweb.com/references/typescript/v5/GetAllListingParams)>,

): Promise<Array<[DirectListing](https://portal.thirdweb.com/references/typescript/v5/DirectListing)>>;

`

### Parameters

##### options

 The options for retrieving the listing.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetAllListingParams](https://portal.thirdweb.com/references/typescript/v5/GetAllListingParams)>;

`

### Returns

##### Return Type

`let returnType: {

asset: [NFT](https://portal.thirdweb.com/references/typescript/v5/NFT);

assetContractAddress: Address;

creatorAddress: Address;

currencyContractAddress: Address;

currencyValuePerToken: [GetBalanceResult](https://portal.thirdweb.com/references/typescript/v5/GetBalanceResult);

endTimeInSeconds: bigint;

id: bigint;

isReservedListing: boolean;

pricePerToken: bigint;

quantity: bigint;

startTimeInSeconds: bigint;

status: ListingStatus;

tokenId: bigint;

type: "direct-listing";

};

`

 A promise that resolves to the direct listings array.
## getAllOffers

 Retrieves all offers based on the provided options.

### Example

`import { getAllOffers } from "thirdweb/extensions/marketplace";

const listings = await getAllOffers({

 contract,

 start: 0,

 count: 10,

});

`

##### Signature

`function getAllOffers(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetAllOffersParams](https://portal.thirdweb.com/references/typescript/v5/GetAllOffersParams)>,

): Promise<Array<[Offer](https://portal.thirdweb.com/references/typescript/v5/Offer)>>;

`

### Parameters

##### options

 The options for retrieving the offers.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetAllOffersParams](https://portal.thirdweb.com/references/typescript/v5/GetAllOffersParams)>;

`

### Returns

##### Return Type

`let returnType: {

asset: [NFT](https://portal.thirdweb.com/references/typescript/v5/NFT);

assetContractAddress: Address;

currencyContractAddress: Address;

currencyValue: [GetBalanceResult](https://portal.thirdweb.com/references/typescript/v5/GetBalanceResult);

endTimeInSeconds: bigint;

id: bigint;

offerorAddress: Address;

quantity: bigint;

status: ListingStatus;

tokenId: bigint;

totalPrice: bigint;

};

`

 A promise that resolves to the offers array.
## getAllValidAuctions

 Retrieves all valid auctions based on the provided options.

### Example

`import { getAllValidAuctions } from "thirdweb/extensions/marketplace";

const validAuctions = await getAllValidAuctions({

 contract,

 start: 0,

 count: 10,

});

`

##### Signature

`function getAllValidAuctions(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetAllValidAuctionParams](https://portal.thirdweb.com/references/typescript/v5/GetAllValidAuctionParams)>,

): Promise<Array<[EnglishAuction](https://portal.thirdweb.com/references/typescript/v5/EnglishAuction)>>;

`

### Parameters

##### options

 The options for retrieving the listing.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetAllValidAuctionParams](https://portal.thirdweb.com/references/typescript/v5/GetAllValidAuctionParams)>;

`

### Returns

##### Return Type

`let returnType: {

asset: [NFT](https://portal.thirdweb.com/references/typescript/v5/NFT);

assetContractAddress: Address;

bidBufferBps: bigint;

buyoutBidAmount: bigint;

buyoutCurrencyValue: [GetBalanceResult](https://portal.thirdweb.com/references/typescript/v5/GetBalanceResult);

creatorAddress: Address;

currencyContractAddress: Address;

endTimeInSeconds: bigint;

id: bigint;

minimumBidAmount: bigint;

minimumBidCurrencyValue: [GetBalanceResult](https://portal.thirdweb.com/references/typescript/v5/GetBalanceResult);

quantity: bigint;

startTimeInSeconds: bigint;

status: ListingStatus;

timeBufferInSeconds: bigint;

tokenId: bigint;

type: "english-auction";

};

`

 A promise that resolves to the valid auctions array.
## getAllValidListings

 Retrieves all valid direct listings based on the provided options.

### Example

`import { getAllValidListings } from "thirdweb/extensions/marketplace";

const validListings = await getAllValidListings({

 contract,

 start: 0,

 count: 10,

});

`

##### Signature

`function getAllValidListings(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetAllValidListingParams](https://portal.thirdweb.com/references/typescript/v5/GetAllValidListingParams)>,

): Promise<Array<[DirectListing](https://portal.thirdweb.com/references/typescript/v5/DirectListing)>>;

`

### Parameters

##### options

 The options for retrieving the valid listing.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetAllValidListingParams](https://portal.thirdweb.com/references/typescript/v5/GetAllValidListingParams)>;

`

### Returns

##### Return Type

`let returnType: {

asset: [NFT](https://portal.thirdweb.com/references/typescript/v5/NFT);

assetContractAddress: Address;

creatorAddress: Address;

currencyContractAddress: Address;

currencyValuePerToken: [GetBalanceResult](https://portal.thirdweb.com/references/typescript/v5/GetBalanceResult);

endTimeInSeconds: bigint;

id: bigint;

isReservedListing: boolean;

pricePerToken: bigint;

quantity: bigint;

startTimeInSeconds: bigint;

status: ListingStatus;

tokenId: bigint;

type: "direct-listing";

};

`

 A promise that resolves to the direct listings array.
## getAllValidOffers

 Retrieves all valid offers based on the provided options.

### Example

`import { getAllValidOffers } from "thirdweb/extensions/marketplace";

const validOffers = await getAllValidOffers({

 contract,

 start: 0,

 count: 10,

});

`

##### Signature

`function getAllValidOffers(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetAllValidOffersParams](https://portal.thirdweb.com/references/typescript/v5/GetAllValidOffersParams)>,

): Promise<Array<[Offer](https://portal.thirdweb.com/references/typescript/v5/Offer)>>;

`

### Parameters

##### options

 The options for retrieving the valid offers.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetAllValidOffersParams](https://portal.thirdweb.com/references/typescript/v5/GetAllValidOffersParams)>;

`

### Returns

##### Return Type

`let returnType: {

asset: [NFT](https://portal.thirdweb.com/references/typescript/v5/NFT);

assetContractAddress: Address;

currencyContractAddress: Address;

currencyValue: [GetBalanceResult](https://portal.thirdweb.com/references/typescript/v5/GetBalanceResult);

endTimeInSeconds: bigint;

id: bigint;

offerorAddress: Address;

quantity: bigint;

status: ListingStatus;

tokenId: bigint;

totalPrice: bigint;

};

`

 A promise that resolves to the offers array.
## getAuction

 Retrieves an auction listing based on the provided options.

### Example

`import { getListing } from "thirdweb/extensions/marketplace";

const listing = await getListing({ contract, listingId: 1n });

`

##### Signature

`function getAuction(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetAuctionParams](https://portal.thirdweb.com/references/typescript/v5/GetAuctionParams)>,

): Promise<[EnglishAuction](https://portal.thirdweb.com/references/typescript/v5/EnglishAuction)>;

`

### Parameters

##### options

 The options for retrieving the listing.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetAuctionParams](https://portal.thirdweb.com/references/typescript/v5/GetAuctionParams)>;

`

### Returns

##### Return Type

`let returnType: {

asset: [NFT](https://portal.thirdweb.com/references/typescript/v5/NFT);

assetContractAddress: Address;

bidBufferBps: bigint;

buyoutBidAmount: bigint;

buyoutCurrencyValue: [GetBalanceResult](https://portal.thirdweb.com/references/typescript/v5/GetBalanceResult);

creatorAddress: Address;

currencyContractAddress: Address;

endTimeInSeconds: bigint;

id: bigint;

minimumBidAmount: bigint;

minimumBidCurrencyValue: [GetBalanceResult](https://portal.thirdweb.com/references/typescript/v5/GetBalanceResult);

quantity: bigint;

startTimeInSeconds: bigint;

status: ListingStatus;

timeBufferInSeconds: bigint;

tokenId: bigint;

type: "english-auction";

};

`

 A promise that resolves to the direct listing.
## getListing

 Retrieves a direct listing based on the provided options.

### Example

`import { getListing } from "thirdweb/extensions/marketplace";

const listing = await getListing({ contract, listingId: 1n });

`

##### Signature

`function getListing(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetListingParams](https://portal.thirdweb.com/references/typescript/v5/GetListingParams)>,

): Promise<[DirectListing](https://portal.thirdweb.com/references/typescript/v5/DirectListing)>;

`

### Parameters

##### options

 The options for retrieving the listing.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetListingParams](https://portal.thirdweb.com/references/typescript/v5/GetListingParams)>;

`

### Returns

##### Return Type

`let returnType: {

asset: [NFT](https://portal.thirdweb.com/references/typescript/v5/NFT);

assetContractAddress: Address;

creatorAddress: Address;

currencyContractAddress: Address;

currencyValuePerToken: [GetBalanceResult](https://portal.thirdweb.com/references/typescript/v5/GetBalanceResult);

endTimeInSeconds: bigint;

id: bigint;

isReservedListing: boolean;

pricePerToken: bigint;

quantity: bigint;

startTimeInSeconds: bigint;

status: ListingStatus;

tokenId: bigint;

type: "direct-listing";

};

`

 A promise that resolves to the direct listing.
## getWinningBid

 Retrieves the winning bid information for a given auction.

### Example

`import { getWinningBid } from "thirdweb/extensions/marketplace";

const winningBid = await getWinningBid({

 contract,

 auctionId: 0n,

});

`

##### Signature

`function getWinningBid(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetWinningBidParams](https://portal.thirdweb.com/references/typescript/v5/GetWinningBidParams)>,

): Promise<

| undefined

| {

bidAmountWei: bigint;

bidderAddress: string;

currencyAddress: string;

currencyValue: CurrencyValue;

 }

>;

`

### Parameters

##### options

 The options for retrieving the winning bid.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetWinningBidParams](https://portal.thirdweb.com/references/typescript/v5/GetWinningBidParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<

| undefined

| {

bidAmountWei: bigint;

bidderAddress: string;

currencyAddress: string;

currencyValue: CurrencyValue;

 }

>;

`

 The winning bid information, or undefined if there is no winning bid.
## isBidInAuctionSupported

 Checks if the `bidInAuction` method is supported by the given contract.

### Example

`import { isBidInAuctionSupported } from "thirdweb/extensions/marketplace";

const supported = isBidInAuctionSupported(["0x..."]);

`

##### Signature

`function isBidInAuctionSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `bidInAuction` method is supported.
## isBuyFromListingSupported

 Checks if the `buyFromListing` method is supported by the given contract.

### Example

`import { isBuyFromListingSupported } from "thirdweb/extensions/marketplace";

const supported = isBuyFromListingSupported(["0x..."]);

`

##### Signature

`function isBuyFromListingSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `buyFromListing` method is supported.
## isCancelListingSupported

 Checks if the `cancelListing` method is supported by the given contract.

### Example

`import { isCancelListingSupported } from "thirdweb/extensions/marketplace";

const supported = isCancelListingSupported(["0x..."]);

`

##### Signature

`function isCancelListingSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `cancelListing` method is supported.
## isBuyerApprovedForListing

 Checks if the buyer is approved for a listing.

### Example

`import { isBuyerApprovedForListing } from "thirdweb/extensions/marketplace";

const isApproved = await isBuyerApprovedForListing({

 contract,

 listingId: 1n,

 buyer: "0x...",

});

`

##### Signature

`function isBuyerApprovedForListing(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsBuyerApprovedForListingParams](https://portal.thirdweb.com/references/typescript/v5/IsBuyerApprovedForListingParams)>,

): Promise<boolean>;

`

### Parameters

##### options

 The options for checking buyer approval.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsBuyerApprovedForListingParams](https://portal.thirdweb.com/references/typescript/v5/IsBuyerApprovedForListingParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 A promise that resolves to a boolean indicating whether the buyer is approved for the listing.
## isCancelAuctionSupported

 Checks if the `cancelAuction` method is supported by the given contract.

### Example

`import { isCancelAuctionSupported } from "thirdweb/extensions/marketplace";

const supported = isCancelAuctionSupported(["0x..."]);

`

##### Signature

`function isCancelAuctionSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `cancelAuction` method is supported.
## isCreateAuctionSupported

 Checks if the `createAuction` method is supported by the given contract.

### Example

`import { isCreateAuctionSupported } from "thirdweb/extensions/marketplace";

const supported = isCreateAuctionSupported(["0x..."]);

`

##### Signature

`function isCreateAuctionSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `createAuction` method is supported.
## isCreateListingSupported

 Checks if the `createListing` method is supported by the given contract.

### Example

`import { isCreateAuctionSupported } from "thirdweb/extensions/marketplace";

const supported = isCreateAuctionSupported(["0x..."]);

`

##### Signature

`function isCreateListingSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `createListing` method is supported.
## isCurrencyApprovedForListing

 Calls the "isCurrencyApprovedForListing" function on the contract.

### Example

`import { isCurrencyApprovedForListing } from "thirdweb/extensions/marketplace";

const result = await isCurrencyApprovedForListing({

 contract,

 listingId: ...,

 currency: ...,

});

`

##### Signature

`function isCurrencyApprovedForListing(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsCurrencyApprovedForListingParams](https://portal.thirdweb.com/references/typescript/v5/IsCurrencyApprovedForListingParams)>,

): Promise<boolean>;

`

### Parameters

##### options

 The options for the isCurrencyApprovedForListing function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsCurrencyApprovedForListingParams](https://portal.thirdweb.com/references/typescript/v5/IsCurrencyApprovedForListingParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 The parsed result of the function call.
## isGetListingSupported

 Checks if the `isGetListingSupported` method is supported by the given contract.

### Example

`import { isGetListingSupported } from "thirdweb/extensions/marketplace";

const supported = isGetListingSupported(["0x..."]);

`

##### Signature

`function isGetListingSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `isGetListingSupported` method is supported.
## isGetAuctionSupported

 Checks if the `getAuction` method is supported by the given contract.

### Example

`import { isGetAuctionSupported } from "thirdweb/extensions/marketplace";

const supported = isGetAuctionSupported(["0x..."]);

`

##### Signature

`function isGetAuctionSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getAuction` method is supported.
## isGetWinningBidSupported

 Checks if the `getWinningBid` method is supported by the given contract.

### Example

`import { isGetWinningBidSupported } from "thirdweb/extensions/marketplace";

const supported = isGetWinningBidSupported(["0x..."]);

`

##### Signature

`function isGetWinningBidSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getWinningBid` method is supported.
## isNewWinningBid

 Calls the "isNewWinningBid" function on the contract.

### Example

`import { isNewWinningBid } from "thirdweb/extensions/marketplace";

const result = await isNewWinningBid({

 contract,

 auctionId: ...,

 bidAmount: ...,

});

`

##### Signature

`function isNewWinningBid(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsNewWinningBidParams](https://portal.thirdweb.com/references/typescript/v5/IsNewWinningBidParams)>,

): Promise<boolean>;

`

### Parameters

##### options

 The options for the isNewWinningBid function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsNewWinningBidParams](https://portal.thirdweb.com/references/typescript/v5/IsNewWinningBidParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 The parsed result of the function call.
## buyerApprovedForListingEvent

 Creates an event object for the BuyerApprovedForListing event.

### Example

`import { getContractEvents } from "thirdweb";

import { buyerApprovedForListingEvent } from "thirdweb/extensions/marketplace";

const events = await getContractEvents({

contract,

events: [

buyerApprovedForListingEvent({

 listingId: ...,

 buyer: ...,

})

],

});

`

##### Signature

`function buyerApprovedForListingEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "listingId";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "buyer";

readonly type: "address";

 },

 { readonly name: "approved"; readonly type: "bool" },

 ];

readonly name: "BuyerApprovedForListing";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "listingId";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "buyer";

readonly type: "address";

 },

 { readonly name: "approved"; readonly type: "bool" },

 ];

readonly name: "BuyerApprovedForListing";

readonly type: "event";

}>;

`

 The prepared event object.
## newAuctionEvent

 Creates an event object for the NewAuction event.

### Example

`import { getContractEvents } from "thirdweb";

import { newAuctionEvent } from "thirdweb/extensions/marketplace";

const events = await getContractEvents({

contract,

events: [

newAuctionEvent({

 auctionCreator: ...,

 auctionId: ...,

 assetContract: ...,

})

],

});

`

##### Signature

`function newAuctionEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "auctionCreator";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "auctionId";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "assetContract";

readonly type: "address";

 },

 {

readonly components: readonly [

 { readonly name: "auctionId"; readonly type: "uint256" },

 { readonly name: "tokenId"; readonly type: "uint256" },

 { readonly name: "quantity"; readonly type: "uint256" },

 {

readonly name: "minimumBidAmount";

readonly type: "uint256";

 },

 {

readonly name: "buyoutBidAmount";

readonly type: "uint256";

 },

 {

readonly name: "timeBufferInSeconds";

readonly type: "uint64";

 },

 { readonly name: "bidBufferBps"; readonly type: "uint64" },

 { readonly name: "startTimestamp"; readonly type: "uint64" },

 { readonly name: "endTimestamp"; readonly type: "uint64" },

 { readonly name: "auctionCreator"; readonly type: "address" },

 { readonly name: "assetContract"; readonly type: "address" },

 { readonly name: "currency"; readonly type: "address" },

 { readonly name: "tokenType"; readonly type: "uint8" },

 { readonly name: "status"; readonly type: "uint8" },

 ];

readonly name: "auction";

readonly type: "tuple";

 },

 ];

readonly name: "NewAuction";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "auctionCreator";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "auctionId";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "assetContract";

readonly type: "address";

 },

 {

readonly components: readonly [

 { readonly name: "auctionId"; readonly type: "uint256" },

 { readonly name: "tokenId"; readonly type: "uint256" },

 { readonly name: "quantity"; readonly type: "uint256" },

 {

readonly name: "minimumBidAmount";

readonly type: "uint256";

 },

 {

readonly name: "buyoutBidAmount";

readonly type: "uint256";

 },

 {

readonly name: "timeBufferInSeconds";

readonly type: "uint64";

 },

 { readonly name: "bidBufferBps"; readonly type: "uint64" },

 { readonly name: "startTimestamp"; readonly type: "uint64" },

 { readonly name: "endTimestamp"; readonly type: "uint64" },

 { readonly name: "auctionCreator"; readonly type: "address" },

 { readonly name: "assetContract"; readonly type: "address" },

 { readonly name: "currency"; readonly type: "address" },

 { readonly name: "tokenType"; readonly type: "uint8" },

 { readonly name: "status"; readonly type: "uint8" },

 ];

readonly name: "auction";

readonly type: "tuple";

 },

 ];

readonly name: "NewAuction";

readonly type: "event";

}>;

`

 The prepared event object.
## getOffer

 Retrieves an offer based on the provided options.

### Example

`import { getOffer } from "thirdweb/extensions/marketplace";

const listing = await getOffer({ contract, listingId: 1n });

`

##### Signature

`function getOffer(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetOfferParams](https://portal.thirdweb.com/references/typescript/v5/GetOfferParams)>,

): Promise<[Offer](https://portal.thirdweb.com/references/typescript/v5/Offer)>;

`

### Parameters

##### options

 The options for retrieving the offer.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetOfferParams](https://portal.thirdweb.com/references/typescript/v5/GetOfferParams)>;

`

### Returns

##### Return Type

`let returnType: {

asset: [NFT](https://portal.thirdweb.com/references/typescript/v5/NFT);

assetContractAddress: Address;

currencyContractAddress: Address;

currencyValue: [GetBalanceResult](https://portal.thirdweb.com/references/typescript/v5/GetBalanceResult);

endTimeInSeconds: bigint;

id: bigint;

offerorAddress: Address;

quantity: bigint;

status: ListingStatus;

tokenId: bigint;

totalPrice: bigint;

};

`

 A promise that resolves to the offer.
## newListingEvent

 Creates an event object for the NewListing event.

### Example

`import { getContractEvents } from "thirdweb";

import { newListingEvent } from "thirdweb/extensions/marketplace";

const events = await getContractEvents({

contract,

events: [

newListingEvent({

 listingCreator: ...,

 listingId: ...,

 assetContract: ...,

})

],

});

`

##### Signature

`function newListingEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "listingCreator";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "listingId";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "assetContract";

readonly type: "address";

 },

 {

readonly components: readonly [

 { readonly name: "listingId"; readonly type: "uint256" },

 { readonly name: "tokenId"; readonly type: "uint256" },

 { readonly name: "quantity"; readonly type: "uint256" },

 { readonly name: "pricePerToken"; readonly type: "uint256" },

 { readonly name: "startTimestamp"; readonly type: "uint128" },

 { readonly name: "endTimestamp"; readonly type: "uint128" },

 { readonly name: "listingCreator"; readonly type: "address" },

 { readonly name: "assetContract"; readonly type: "address" },

 { readonly name: "currency"; readonly type: "address" },

 { readonly name: "tokenType"; readonly type: "uint8" },

 { readonly name: "status"; readonly type: "uint8" },

 { readonly name: "reserved"; readonly type: "bool" },

 ];

readonly name: "listing";

readonly type: "tuple";

 },

 ];

readonly name: "NewListing";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "listingCreator";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "listingId";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "assetContract";

readonly type: "address";

 },

 {

readonly components: readonly [

 { readonly name: "listingId"; readonly type: "uint256" },

 { readonly name: "tokenId"; readonly type: "uint256" },

 { readonly name: "quantity"; readonly type: "uint256" },

 { readonly name: "pricePerToken"; readonly type: "uint256" },

 { readonly name: "startTimestamp"; readonly type: "uint128" },

 { readonly name: "endTimestamp"; readonly type: "uint128" },

 { readonly name: "listingCreator"; readonly type: "address" },

 { readonly name: "assetContract"; readonly type: "address" },

 { readonly name: "currency"; readonly type: "address" },

 { readonly name: "tokenType"; readonly type: "uint8" },

 { readonly name: "status"; readonly type: "uint8" },

 { readonly name: "reserved"; readonly type: "bool" },

 ];

readonly name: "listing";

readonly type: "tuple";

 },

 ];

readonly name: "NewListing";

readonly type: "event";

}>;

`

 The prepared event object.
## newBidEvent

 Creates an event object for the NewBid event.

### Example

`import { getContractEvents } from "thirdweb";

import { newBidEvent } from "thirdweb/extensions/marketplace";

const events = await getContractEvents({

contract,

events: [

newBidEvent({

 auctionId: ...,

 bidder: ...,

 assetContract: ...,

})

],

});

`

##### Signature

`function newBidEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "auctionId";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "bidder";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "assetContract";

readonly type: "address";

 },

 { readonly name: "bidAmount"; readonly type: "uint256" },

 {

readonly components: readonly [

 { readonly name: "auctionId"; readonly type: "uint256" },

 { readonly name: "tokenId"; readonly type: "uint256" },

 { readonly name: "quantity"; readonly type: "uint256" },

 {

readonly name: "minimumBidAmount";

readonly type: "uint256";

 },

 {

readonly name: "buyoutBidAmount";

readonly type: "uint256";

 },

 {

readonly name: "timeBufferInSeconds";

readonly type: "uint64";

 },

 { readonly name: "bidBufferBps"; readonly type: "uint64" },

 { readonly name: "startTimestamp"; readonly type: "uint64" },

 { readonly name: "endTimestamp"; readonly type: "uint64" },

 { readonly name: "auctionCreator"; readonly type: "address" },

 { readonly name: "assetContract"; readonly type: "address" },

 { readonly name: "currency"; readonly type: "address" },

 { readonly name: "tokenType"; readonly type: "uint8" },

 { readonly name: "status"; readonly type: "uint8" },

 ];

readonly name: "auction";

readonly type: "tuple";

 },

 ];

readonly name: "NewBid";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "auctionId";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "bidder";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "assetContract";

readonly type: "address";

 },

 { readonly name: "bidAmount"; readonly type: "uint256" },

 {

readonly components: readonly [

 { readonly name: "auctionId"; readonly type: "uint256" },

 { readonly name: "tokenId"; readonly type: "uint256" },

 { readonly name: "quantity"; readonly type: "uint256" },

 {

readonly name: "minimumBidAmount";

readonly type: "uint256";

 },

 {

readonly name: "buyoutBidAmount";

readonly type: "uint256";

 },

 {

readonly name: "timeBufferInSeconds";

readonly type: "uint64";

 },

 { readonly name: "bidBufferBps"; readonly type: "uint64" },

 { readonly name: "startTimestamp"; readonly type: "uint64" },

 { readonly name: "endTimestamp"; readonly type: "uint64" },

 { readonly name: "auctionCreator"; readonly type: "address" },

 { readonly name: "assetContract"; readonly type: "address" },

 { readonly name: "currency"; readonly type: "address" },

 { readonly name: "tokenType"; readonly type: "uint8" },

 { readonly name: "status"; readonly type: "uint8" },

 ];

readonly name: "auction";

readonly type: "tuple";

 },

 ];

readonly name: "NewBid";

readonly type: "event";

}>;

`

 The prepared event object.
## newSaleEvent

 Creates an event object for the NewSale event.

### Example

`import { getContractEvents } from "thirdweb";

import { newSaleEvent } from "thirdweb/extensions/marketplace";

const events = await getContractEvents({

contract,

events: [

newSaleEvent({

 listingCreator: ...,

 listingId: ...,

 assetContract: ...,

})

],

});

`

##### Signature

`function newSaleEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "listingCreator";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "listingId";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "assetContract";

readonly type: "address";

 },

 { readonly name: "tokenId"; readonly type: "uint256" },

 { readonly name: "buyer"; readonly type: "address" },

 { readonly name: "quantityBought"; readonly type: "uint256" },

 { readonly name: "totalPricePaid"; readonly type: "uint256" },

 ];

readonly name: "NewSale";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "listingCreator";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "listingId";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "assetContract";

readonly type: "address";

 },

 { readonly name: "tokenId"; readonly type: "uint256" },

 { readonly name: "buyer"; readonly type: "address" },

 { readonly name: "quantityBought"; readonly type: "uint256" },

 { readonly name: "totalPricePaid"; readonly type: "uint256" },

 ];

readonly name: "NewSale";

readonly type: "event";

}>;

`

 The prepared event object.
## newOfferEvent

 Creates an event object for the NewOffer event.

### Example

`import { getContractEvents } from "thirdweb";

import { newOfferEvent } from "thirdweb/extensions/marketplace";

const events = await getContractEvents({

contract,

events: [

newOfferEvent({

 offeror: ...,

 offerId: ...,

 assetContract: ...,

})

],

});

`

##### Signature

`function newOfferEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "offeror";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "offerId";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "assetContract";

readonly type: "address";

 },

 {

readonly components: readonly [

 { readonly name: "offerId"; readonly type: "uint256" },

 { readonly name: "tokenId"; readonly type: "uint256" },

 { readonly name: "quantity"; readonly type: "uint256" },

 { readonly name: "totalPrice"; readonly type: "uint256" },

 {

readonly name: "expirationTimestamp";

readonly type: "uint256";

 },

 { readonly name: "offeror"; readonly type: "address" },

 { readonly name: "assetContract"; readonly type: "address" },

 { readonly name: "currency"; readonly type: "address" },

 { readonly name: "tokenType"; readonly type: "uint8" },

 { readonly name: "status"; readonly type: "uint8" },

 ];

readonly name: "offer";

readonly type: "tuple";

 },

 ];

readonly name: "NewOffer";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "offeror";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "offerId";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "assetContract";

readonly type: "address";

 },

 {

readonly components: readonly [

 { readonly name: "offerId"; readonly type: "uint256" },

 { readonly name: "tokenId"; readonly type: "uint256" },

 { readonly name: "quantity"; readonly type: "uint256" },

 { readonly name: "totalPrice"; readonly type: "uint256" },

 {

readonly name: "expirationTimestamp";

readonly type: "uint256";

 },

 { readonly name: "offeror"; readonly type: "address" },

 { readonly name: "assetContract"; readonly type: "address" },

 { readonly name: "currency"; readonly type: "address" },

 { readonly name: "tokenType"; readonly type: "uint8" },

 { readonly name: "status"; readonly type: "uint8" },

 ];

readonly name: "offer";

readonly type: "tuple";

 },

 ];

readonly name: "NewOffer";

readonly type: "event";

}>;

`

 The prepared event object.
## makeOffer

 Makes an offer for any asset (ERC721 or ERC1155).

### Example

`import { makeOffer } from "thirdweb/extensions/marketplace";

import { sendTransaction } from "thirdweb";

const offerTx = makeOffer({

 contract,

 assetContractAddress: "0x1234567890123456789012345678901234567890",

 tokenId: 1n,

 currencyContractAddress:

"0x1234567890123456789012345678901234567890",

 offerExpiresAt: new Date(Date.now() + 1000 * 60 * 60 * 24),

 totalOffer: "1.0",

});

await sendTransaction({ transaction, account });

`

##### Signature

`function makeOffer(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MakeOfferParams](https://portal.thirdweb.com/references/typescript/v5/MakeOfferParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for making the offer.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[MakeOfferParams](https://portal.thirdweb.com/references/typescript/v5/MakeOfferParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A transaction object that can be sent to make the offer.
## totalAuctions

 Calls the "totalAuctions" function on the contract.

### Example

`import { totalAuctions } from "thirdweb/extensions/marketplace";

const result = await totalAuctions({

 contract,

});

`

##### Signature

`function totalAuctions(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the totalAuctions function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## totalListings

 Calls the "totalListings" function on the contract.

### Example

`import { totalListings } from "thirdweb/extensions/marketplace";

const result = await totalListings({

 contract,

});

`

##### Signature

`function totalListings(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the totalListings function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## updatedListingEvent

 Creates an event object for the UpdatedListing event.

### Example

`import { getContractEvents } from "thirdweb";

import { updatedListingEvent } from "thirdweb/extensions/marketplace";

const events = await getContractEvents({

contract,

events: [

updatedListingEvent({

 listingCreator: ...,

 listingId: ...,

 assetContract: ...,

})

],

});

`

##### Signature

`function updatedListingEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "listingCreator";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "listingId";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "assetContract";

readonly type: "address";

 },

 {

readonly components: readonly [

 { readonly name: "listingId"; readonly type: "uint256" },

 { readonly name: "tokenId"; readonly type: "uint256" },

 { readonly name: "quantity"; readonly type: "uint256" },

 { readonly name: "pricePerToken"; readonly type: "uint256" },

 { readonly name: "startTimestamp"; readonly type: "uint128" },

 { readonly name: "endTimestamp"; readonly type: "uint128" },

 { readonly name: "listingCreator"; readonly type: "address" },

 { readonly name: "assetContract"; readonly type: "address" },

 { readonly name: "currency"; readonly type: "address" },

 { readonly name: "tokenType"; readonly type: "uint8" },

 { readonly name: "status"; readonly type: "uint8" },

 { readonly name: "reserved"; readonly type: "bool" },

 ];

readonly name: "listing";

readonly type: "tuple";

 },

 ];

readonly name: "UpdatedListing";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "listingCreator";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "listingId";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "assetContract";

readonly type: "address";

 },

 {

readonly components: readonly [

 { readonly name: "listingId"; readonly type: "uint256" },

 { readonly name: "tokenId"; readonly type: "uint256" },

 { readonly name: "quantity"; readonly type: "uint256" },

 { readonly name: "pricePerToken"; readonly type: "uint256" },

 { readonly name: "startTimestamp"; readonly type: "uint128" },

 { readonly name: "endTimestamp"; readonly type: "uint128" },

 { readonly name: "listingCreator"; readonly type: "address" },

 { readonly name: "assetContract"; readonly type: "address" },

 { readonly name: "currency"; readonly type: "address" },

 { readonly name: "tokenType"; readonly type: "uint8" },

 { readonly name: "status"; readonly type: "uint8" },

 { readonly name: "reserved"; readonly type: "bool" },

 ];

readonly name: "listing";

readonly type: "tuple";

 },

 ];

readonly name: "UpdatedListing";

readonly type: "event";

}>;

`

 The prepared event object.
## max

 Returns the maximum of two BigInt values.

### Example

`max(1n, 2n);

// 2n

`

##### Signature

`function max(a: bigint, b: bigint): bigint;

`

### Parameters

##### a

 The first BigInt value.

#### Type

`let a: bigint;

`

##### b

 The second BigInt value.

#### Type

`let b: bigint;

`

### Returns

##### Return Type

`let returnType: bigint;

`

 The larger of the two BigInt values.
## totalOffers

 Calls the "totalOffers" function on the contract.

### Example

`import { totalOffers } from "thirdweb/extensions/marketplace";

const result = await totalOffers({

 contract,

});

`

##### Signature

`function totalOffers(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the totalOffers function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## updateListing

 Updates an existing direct listing.

### Example

`import { updateListing } from "thirdweb/extensions/marketplace";

import { sendTransaction } from "thirdweb";

const transaction = updateListing({...});

await sendTransaction({ transaction, account });

`

##### Signature

`function updateListing(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[UpdateListingParams](https://portal.thirdweb.com/references/typescript/v5/UpdateListingParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for updating the direct listing.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[UpdateListingParams](https://portal.thirdweb.com/references/typescript/v5/UpdateListingParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 The result of updating the direct listing.
## getDefaultHandle

 Calls the "getDefaultHandle" function on the contract.

### Example

`import { getDefaultHandle } from "thirdweb/extensions/lens";

const result = await getDefaultHandle({

 contract,

 profileId: ...,

});

`

##### Signature

`function getDefaultHandle(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetDefaultHandleParams](https://portal.thirdweb.com/references/typescript/v5/GetDefaultHandleParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the getDefaultHandle function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetDefaultHandleParams](https://portal.thirdweb.com/references/typescript/v5/GetDefaultHandleParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## getSaleConfig

 Calls the "getSaleConfig" function on the contract.

### Example

`import { MintableERC1155 } from "thirdweb/modules";

const result = await MintableERC1155.getSaleConfig({

 contract,

});

`

##### Signature

`function getSaleConfig(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<string>;

`

### Parameters

##### options

 The options for the getSaleConfig function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## generateMintSignature

 Generates a payload and signature for minting ERC1155 tokens with a signature.

### Example

`import { MintableERC1155 } from "thirdweb/modules";

// generate the payload and signature, this is typically done on the server

// requires to be generated with a wallet that has the MINTER_ROLE

const { payload, signature } =

await MintableERC1155.generateMintSignature({

 account,

 contract,

 nft: {

 name: "My NFT",

 description: "This is my NFT",

 image: "ipfs://...",

 },

 mintRequest: {

 recipient: "0x...",

 quantity: "10",

 },

 });

// prepare the transaction, this is typically done on the client

// can be executed by any wallet

const transaction = MintableERC1155.mintWithSignature({

 contract,

 payload,

 signature,

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`` function generateMintSignature(

options: [GenerateMintSignatureOptions](https://portal.thirdweb.com/references/typescript/v5/GenerateMintSignatureOptions),

): Promise<{

payload: {

amount: bigint;

baseURI: string;

data: `0x${string}`;

to: `0x${string}`;

tokenId: bigint;

 };

signature: `0x${string}`;

}>;

 ``

### Parameters

##### options

 The options for generating the payload and signature.

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

contractType?: "TokenERC1155" | "SignatureMintERC1155";

mintRequest: GeneratePayloadInput;

};

`

### Returns

##### Return Type

`` let returnType: Promise<{

payload: {

amount: bigint;

baseURI: string;

data: `0x${string}`;

to: `0x${string}`;

tokenId: bigint;

 };

signature: `0x${string}`;

}>;

 ``

 The payload and signature.
## encodeInstall

 Encodes the install data for the MintableERC1155 module.

##### Signature

`` function encodeInstall(

params: EncodeBytesOnInstallParams,

): `0x${string}`;

 ``

### Parameters

##### params

 The parameters for the module.

#### Type

`let params: EncodeBytesOnInstallParams;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

* The encoded data.
## min

 Returns the minimum of two BigInt values.

### Example

`min(1n, 2n);

// 1n

`

##### Signature

`function min(a: bigint, b: bigint): bigint;

`

### Parameters

##### a

 The first BigInt value.

#### Type

`let a: bigint;

`

##### b

 The second BigInt value.

#### Type

`let b: bigint;

`

### Returns

##### Return Type

`let returnType: bigint;

`

 The smaller of the two BigInt values.
## mintWithRole

 Mints ERC1155 tokens to a specified address via a MintableERC1155 module.

### Example

`import { MintableERC1155 } from "thirdweb/modules";

const transaction = MintableERC1155.mintWithRole({

 contract,

 to: "0x...", // Address to mint tokens to

 amount: 2, // Amount of tokens to mint

 nft: {

 name: "My NFT",

 description: "This is my NFT",

 image: "ipfs://...",

 },

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function mintWithRole(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[EditionMintParams](https://portal.thirdweb.com/references/typescript/v5/EditionMintParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for minting tokens.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[EditionMintParams](https://portal.thirdweb.com/references/typescript/v5/EditionMintParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A transaction to mint tokens.
## mintWithSignature

 Mints ERC1155 tokens to a specified address with a signature via a MintableERC1155 module.

### Example

`import { MintableERC1155 } from "thirdweb/modules";

// generate the payload and signature, this is typically done on the server

// requires to be generated with a wallet that has the MINTER_ROLE

const { payload, signature } =

await MintableERC1155.generateMintSignature({

 account,

 contract,

 nft: {

 name: "My NFT",

 description: "This is my NFT",

 image: "ipfs://...",

 },

 mintRequest: {

 recipient: "0x...",

 quantity: "10",

 },

 });

// prepare the transaction, this is typically done on the client

// can be executed by any wallet

const transaction = MintableERC1155.mintWithSignature({

 contract,

 payload,

 signature,

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`` function mintWithSignature(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<{

payload: {

amount: bigint;

baseURI: string;

data: `0x${string}`;

to: `0x${string}`;

tokenId: bigint;

 };

signature: `0x${string}`;

 }>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

 ``

### Parameters

##### options

 The options for minting tokens.

#### Type

`` let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<{

payload: {

amount: bigint;

baseURI: string;

data: `0x${string}`;

to: `0x${string}`;

tokenId: bigint;

 };

signature: `0x${string}`;

}>;

 ``

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A transaction to mint tokens.
## setSaleConfig

 Prepares a transaction to call the "setSaleConfig" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { MintableERC1155 } from "thirdweb/modules";

const transaction = MintableERC1155.setSaleConfig({

 contract,

 primarySaleRecipient: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setSaleConfig(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| SetSaleConfigParams

| { asyncParams: () => Promise<SetSaleConfigParams> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setSaleConfig" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| SetSaleConfigParams

| { asyncParams: () => Promise<SetSaleConfigParams> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## encodeInstall

 Encodes the install data for the MintableERC20 module.

##### Signature

`` function encodeInstall(

params: EncodeBytesOnInstallParams,

): `0x${string}`;

 ``

### Parameters

##### params

 The parameters for the module.

#### Type

`let params: EncodeBytesOnInstallParams;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

* The encoded data.
## generateMintSignature

 Generates a mint signature for a given mint request to be used with a MintableERC20 module.

### Example

`import { MintableERC20 } from "thirdweb/modules";

// generate the payload and signature, this is typically done on the server

// requires to be generated with a wallet that has the MINTER_ROLE

const { payload, signature } =

await MintableERC20.generateMintSignature({

 account,

 contract,

 mintRequest: {

 recipient: "0x...",

 quantity: "10",

 },

 });

// prepare the transaction, this is typically done on the client

// can be executed by any wallet

const transaction = MintableERC20.mintWithSignature({

 contract,

 payload,

 signature,

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`` function generateMintSignature(

options: [GenerateMintSignatureOptions](https://portal.thirdweb.com/references/typescript/v5/GenerateMintSignatureOptions),

): Promise<{

payload: { amount: bigint; data: `0x${string}`; to: `0x${string}` };

signature: `0x${string}`;

}>;

 ``

### Parameters

##### options

 The options for minting tokens.

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

contractType?: "TokenERC1155" | "SignatureMintERC1155";

mintRequest: GeneratePayloadInput;

};

`

### Returns

##### Return Type

`` let returnType: Promise<{

payload: { amount: bigint; data: `0x${string}`; to: `0x${string}` };

signature: `0x${string}`;

}>;

 ``

 A transaction to mint tokens.
## getSaleConfig

 Calls the "getSaleConfig" function on the contract.

### Example

`import { MintableERC20 } from "thirdweb/modules";

const result = await MintableERC20.getSaleConfig({

 contract,

});

`

##### Signature

`function getSaleConfig(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<string>;

`

### Parameters

##### options

 The options for the getSaleConfig function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## module

 Convenience function to add the MintableERC1155 module as a default module on a core contract.

### Example

`import { MintableERC1155, deployModularContract } from "thirdweb/modules";

const deployed = deployModularContract({

 client,

 chain,

 account,

 core: "ERC1155",

 params: {

 name: "My Modular Contract",

 },

 modules: [

 MintableERC1155.module({

 primarySaleRecipient: ...,

 }),

 ],

});

`

##### Signature

`` function module(

params: EncodeBytesOnInstallParams & { publisher?: string },

): (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: `0x${string}`; module: `0x${string}` }>;

 ``

### Parameters

##### params

 The parameters for the module.

#### Type

`let params: EncodeBytesOnInstallParams & { publisher?: string };

`

### Returns

##### Return Type

`` let returnType: (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: `0x${string}`; module: `0x${string}` }>;

 ``

* The module function.
## install

 Installs the MintableERC20 module on a core contract.

### Example

`import { MintableERC20 } from "thirdweb/modules";

const transaction = MintableERC20.install({

 contract: coreContract,

 account: account,

 params: {

 primarySaleRecipient: ...,

 },

});

await sendTransaction({

 transaction,

 account,

});

`

##### Signature

`function install(options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params: EncodeBytesOnInstallParams & { publisher?: string };

}): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

`

### Parameters

##### options

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params: EncodeBytesOnInstallParams & { publisher?: string };

};

`

### Returns

##### Return Type

`let returnType: Readonly<options> & {

__contract?: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi>;

__preparedMethod?: () => Promise<PreparedMethod<abiFn>>;

};

`

 the transaction to install the module
## mintWithRole

 Mints ERC20 tokens to a specified address via a MintableERC20 module.

### Example

`import { MintableERC20 } from "thirdweb/modules";

const transaction = MintableERC20.mintWithRole({

 contract,

 to: "0x...", // Address to mint tokens to

 quantity: 2, // Amount of tokens to mint (in decimals)

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function mintWithRole(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[TokenMintParams](https://portal.thirdweb.com/references/typescript/v5/TokenMintParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for minting tokens.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[TokenMintParams](https://portal.thirdweb.com/references/typescript/v5/TokenMintParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A transaction to mint tokens.
## encodeInstall

 Encodes the install data for the MintableERC721 module.

##### Signature

`` function encodeInstall(

params: EncodeBytesOnInstallParams,

): `0x${string}`;

 ``

### Parameters

##### params

 The parameters for the module.

#### Type

`let params: EncodeBytesOnInstallParams;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

* The encoded data.
## module

 Convenience function to add the MintableERC20 module as a default module on a core contract.

### Example

`import { MintableERC20, deployModularContract } from "thirdweb/modules";

const deployed = deployModularContract({

 client,

 chain,

 account,

 core: "ERC20",

 params: {

 name: "My Modular Contract",

 },

 modules: [

 MintableERC20.module({

 primarySaleRecipient: ...,

 }),

 ],

});

`

##### Signature

`` function module(

params: EncodeBytesOnInstallParams & { publisher?: string },

): (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: `0x${string}`; module: `0x${string}` }>;

 ``

### Parameters

##### params

 The parameters for the module.

#### Type

`let params: EncodeBytesOnInstallParams & { publisher?: string };

`

### Returns

##### Return Type

`` let returnType: (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: `0x${string}`; module: `0x${string}` }>;

 ``

* The module function.
## generateMintSignature

 Generates a payload and signature for minting ERC721 tokens via a MintableERC721 module.

### Example

`import { MintableERC20 } from "thirdweb/modules";

// generate the payload and signature, this is typically done on the server

// requires to be generated with a wallet that has the MINTER_ROLE

const { payload, signature } =

await MintableERC721.generateMintSignature({

 account,

 contract,

 nfts: [

 {

 name: "My NFT",

 description: "My NFT",

 image: "https://example.com/image.png",

 },

 ],

 mintRequest: {

 recipient: "0x...",

 },

 });

// prepare the transaction, this is typically done on the client

// can be executed by any wallet

const transaction = MintableERC20.mintWithSignature({

 contract,

 payload,

 signature,

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`` function generateMintSignature(

options: [GenerateMintSignatureOptions](https://portal.thirdweb.com/references/typescript/v5/GenerateMintSignatureOptions),

): Promise<{

payload: {

amount: bigint;

baseURI: string;

data: `0x${string}`;

to: `0x${string}`;

 };

signature: `0x${string}`;

}>;

 ``

### Parameters

##### options

 The options for generating the payload and signature.

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

contractType?: "TokenERC1155" | "SignatureMintERC1155";

mintRequest: GeneratePayloadInput;

};

`

### Returns

##### Return Type

`` let returnType: Promise<{

payload: {

amount: bigint;

baseURI: string;

data: `0x${string}`;

to: `0x${string}`;

 };

signature: `0x${string}`;

}>;

 ``

 The payload and signature.
## mintWithSignature

 Mints ERC20 tokens to a specified address with a signature via a MintableERC20 module.

### Example

`import { MintableERC20 } from "thirdweb/modules";

// generate the payload and signature, this is typically done on the server

// requires to be generated with a wallet that has the MINTER_ROLE

const { payload, signature } =

await MintableERC20.generateMintSignature({

 account,

 contract,

 mintRequest: {

 recipient: "0x...",

 quantity: "10",

 },

 });

// prepare the transaction, this is typically done on the client

// can be executed by any wallet

const transaction = MintableERC20.mintWithSignature({

 contract,

 payload,

 signature,

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`` function mintWithSignature(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<{

payload: {

amount: bigint;

data: `0x${string}`;

to: `0x${string}`;

 };

signature: `0x${string}`;

 }>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

 ``

### Parameters

##### options

 The options for minting tokens.

#### Type

`` let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<{

payload: { amount: bigint; data: `0x${string}`; to: `0x${string}` };

signature: `0x${string}`;

}>;

 ``

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A transaction to mint tokens.
## getSaleConfig

 Calls the "getSaleConfig" function on the contract.

### Example

`import { MintableERC721 } from "thirdweb/modules";

const result = await MintableERC721.getSaleConfig({

 contract,

});

`

##### Signature

`function getSaleConfig(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<string>;

`

### Parameters

##### options

 The options for the getSaleConfig function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## setSaleConfig

 Prepares a transaction to call the "setSaleConfig" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { MintableERC20 } from "thirdweb/modules";

const transaction = MintableERC20.setSaleConfig({

 contract,

 primarySaleRecipient: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setSaleConfig(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| SetSaleConfigParams

| { asyncParams: () => Promise<SetSaleConfigParams> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setSaleConfig" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| SetSaleConfigParams

| { asyncParams: () => Promise<SetSaleConfigParams> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## install

 Installs the MintableERC721 module on a core contract.

### Example

`import { MintableERC721 } from "thirdweb/modules";

const transaction = MintableERC721.install({

 contract: coreContract,

 account: account,

 params: {

 primarySaleRecipient: ...,

 },

});

await sendTransaction({

 transaction,

 account,

});

`

##### Signature

`function install(options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params: EncodeBytesOnInstallParams & { publisher?: string };

}): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

`

### Parameters

##### options

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params: EncodeBytesOnInstallParams & { publisher?: string };

};

`

### Returns

##### Return Type

`let returnType: Readonly<options> & {

__contract?: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi>;

__preparedMethod?: () => Promise<PreparedMethod<abiFn>>;

};

`

 the transaction to install the module
## mintWithRole

 Mints ERC721 tokens to a specified address via a MintableERC721 module.

### Example

`import { MintableERC721 } from "thirdweb/modules";

const transaction = MintableERC721.mintWithRole({

 contract,

 to: "0x...", // Address to mint tokens to

 nfts: [

 {

 name: "My NFT",

 description: "This is my NFT",

 image: "ipfs://...",

 },

 ],

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function mintWithRole(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[NFTMintParams](https://portal.thirdweb.com/references/typescript/v5/NFTMintParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for minting tokens.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[NFTMintParams](https://portal.thirdweb.com/references/typescript/v5/NFTMintParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A transaction to mint tokens.
## module

 Convenience function to add the MintableERC721 module as a default module on a core contract.

### Example

`import { MintableERC721, deployModularContract } from "thirdweb/modules";

const deployed = deployModularContract({

 client,

 chain,

 account,

 core: "ERC721",

 params: {

 name: "My Modular Contract",

 },

 modules: [

 MintableERC721.module({

 primarySaleRecipient: ...,

 }),

 ],

});

`

##### Signature

`` function module(

params: EncodeBytesOnInstallParams & { publisher?: string },

): (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: `0x${string}`; module: `0x${string}` }>;

 ``

### Parameters

##### params

 The parameters for the module.

#### Type

`let params: EncodeBytesOnInstallParams & { publisher?: string };

`

### Returns

##### Return Type

`` let returnType: (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: `0x${string}`; module: `0x${string}` }>;

 ``

* The module function.
## setSaleConfig

 Prepares a transaction to call the "setSaleConfig" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { MintableERC721 } from "thirdweb/modules";

const transaction = MintableERC721.setSaleConfig({

 contract,

 primarySaleRecipient: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setSaleConfig(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| SetSaleConfigParams

| { asyncParams: () => Promise<SetSaleConfigParams> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setSaleConfig" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| SetSaleConfigParams

| { asyncParams: () => Promise<SetSaleConfigParams> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## cancelOwnershipHandover

 Prepares a transaction to call the "cancelOwnershipHandover" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { cancelOwnershipHandover } from "thirdweb/extensions/modules";

const transaction = cancelOwnershipHandover();

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function cancelOwnershipHandover(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "cancelOwnershipHandover" function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## completeOwnershipHandover

 Prepares a transaction to call the "completeOwnershipHandover" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { completeOwnershipHandover } from "thirdweb/extensions/modules";

const transaction = completeOwnershipHandover({

 contract,

 pendingOwner: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function completeOwnershipHandover(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [CompleteOwnershipHandoverParams](https://portal.thirdweb.com/references/typescript/v5/CompleteOwnershipHandoverParams)

| { asyncParams: () => Promise<[CompleteOwnershipHandoverParams](https://portal.thirdweb.com/references/typescript/v5/CompleteOwnershipHandoverParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "completeOwnershipHandover" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [CompleteOwnershipHandoverParams](https://portal.thirdweb.com/references/typescript/v5/CompleteOwnershipHandoverParams)

| { asyncParams: () => Promise<[CompleteOwnershipHandoverParams](https://portal.thirdweb.com/references/typescript/v5/CompleteOwnershipHandoverParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## encodeMintParams

 Encodes the parameters for the "encodeBytesBeforeMintERC721" function.

### Example

`import { encodeEncodeBytesBeforeMintERC721Params } "thirdweb/extensions/modules";

const result = encodeEncodeBytesBeforeMintERC721Params({

 params: ...,

});

`

##### Signature

`` function encodeMintParams(

options: EncodeBytesBeforeMintERC721Params,

): `0x${string}`;

 ``

### Parameters

##### options

 The options for the encodeBytesBeforeMintERC721 function.

#### Type

`let options: EncodeBytesBeforeMintERC721Params;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

 The encoded ABI parameters.
## encodeMintParams

 Encodes the parameters for the "encodeBytesBeforeMintERC20" function.

### Example

`import { encodeEncodeBytesBeforeMintERC20Params } "thirdweb/extensions/modules";

const result = encodeEncodeBytesBeforeMintERC20Params({

 params: ...,

});

`

##### Signature

`` function encodeMintParams(

options: EncodeBytesBeforeMintERC20Params,

): `0x${string}`;

 ``

### Parameters

##### options

 The options for the encodeBytesBeforeMintERC20 function.

#### Type

`let options: EncodeBytesBeforeMintERC20Params;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

 The encoded ABI parameters.
## encodeMintParams

 Encodes the parameters for the "encodeBytesBeforeMintERC1155" function.

### Example

`import { encodeEncodeBytesBeforeMintERC1155Params } "thirdweb/extensions/modules";

const result = encodeEncodeBytesBeforeMintERC1155Params({

 params: ...,

});

`

##### Signature

`` function encodeMintParams(

options: EncodeBytesBeforeMintERC1155Params,

): `0x${string}`;

 ``

### Parameters

##### options

 The options for the encodeBytesBeforeMintERC1155 function.

#### Type

`let options: EncodeBytesBeforeMintERC1155Params;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

 The encoded ABI parameters.
## getInstalledModules

 Calls the "getInstalledModules" function on the contract.

### Example

`import { getInstalledModules } from "thirdweb/extensions/modules";

const result = await getInstalledModules({

 contract,

});

`

##### Signature

`` function getInstalledModules(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)) : Promise<readonly Array<{ config: { callbackFunctions: readonly Array<{ selector: `0x${string}` }>; fallbackFunctions: readonly Array<{ permissionBits: bigint; selector: `0x${string}` }>; registerInstallationCallback: boolean; requiredInterfaces: readonly Array<`0x${string}`>; supportedInterfaces: readonly Array<`0x${string}`> }; implementation: string }>>

 ``

### Parameters

##### options

 The options for the getInstalledModules function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`` let returnType: Promise<readonly Array<{ config: { callbackFunctions: readonly Array<{ selector: `0x${string}` }>; fallbackFunctions: readonly Array<{ permissionBits: bigint; selector: `0x${string}` }>; registerInstallationCallback: boolean; requiredInterfaces: readonly Array<`0x${string}`>; supportedInterfaces: readonly Array<`0x${string}`> }; implementation: string }>>

 ``

 The parsed result of the function call.
## getSupportedCallbackFunctions

 Calls the "getSupportedCallbackFunctions" function on the contract.

### Example

`import { getSupportedCallbackFunctions } from "thirdweb/extensions/modules";

const result = await getSupportedCallbackFunctions({

 contract,

});

`

##### Signature

`` function getSupportedCallbackFunctions(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)) : Promise<readonly Array<{ mode: number; selector: `0x${string}` }>>

 ``

### Parameters

##### options

 The options for the getSupportedCallbackFunctions function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`` let returnType: Promise<readonly Array<{ mode: number; selector: `0x${string}` }>>

 ``

 The parsed result of the function call.
## getModuleConfig

 Calls the "getModuleConfig" function on the contract.

### Example

`import { getModuleConfig } from "thirdweb/extensions/modules";

const result = await getModuleConfig({

 contract,

});

`

##### Signature

`` function getModuleConfig(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)) : Promise<{ callbackFunctions: readonly Array<{ selector: `0x${string}` }>; fallbackFunctions: readonly Array<{ permissionBits: bigint; selector: `0x${string}` }>; registerInstallationCallback: boolean; requiredInterfaces: readonly Array<`0x${string}`>; supportedInterfaces: readonly Array<`0x${string}`> }>

 ``

### Parameters

##### options

 The options for the getModuleConfig function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`` let returnType: Promise<{ callbackFunctions: readonly Array<{ selector: `0x${string}` }>; fallbackFunctions: readonly Array<{ permissionBits: bigint; selector: `0x${string}` }>; registerInstallationCallback: boolean; requiredInterfaces: readonly Array<`0x${string}`>; supportedInterfaces: readonly Array<`0x${string}`> }>

 ``

 The parsed result of the function call.
## hasAnyRole

 Calls the "hasAnyRole" function on the contract.

### Example

`import { hasAnyRole } from "thirdweb/extensions/modules";

const result = await hasAnyRole({

 contract,

 user: ...,

 roles: ...,

});

`

##### Signature

`function hasAnyRole(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[HasAnyRoleParams](https://portal.thirdweb.com/references/typescript/v5/HasAnyRoleParams)>,

): Promise<boolean>;

`

### Parameters

##### options

 The options for the hasAnyRole function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[HasAnyRoleParams](https://portal.thirdweb.com/references/typescript/v5/HasAnyRoleParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 The parsed result of the function call.
## grantRoles

 Prepares a transaction to call the "grantRoles" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { grantRoles } from "thirdweb/extensions/modules";

const transaction = grantRoles({

 contract,

 user: ...,

 roles: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function grantRoles(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [GrantRolesParams](https://portal.thirdweb.com/references/typescript/v5/GrantRolesParams)

| { asyncParams: () => Promise<[GrantRolesParams](https://portal.thirdweb.com/references/typescript/v5/GrantRolesParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "grantRoles" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[GrantRolesParams](https://portal.thirdweb.com/references/typescript/v5/GrantRolesParams) | { asyncParams: () => Promise<[GrantRolesParams](https://portal.thirdweb.com/references/typescript/v5/GrantRolesParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## hasAllRoles

 Calls the "hasAllRoles" function on the contract.

### Example

`import { hasAllRoles } from "thirdweb/extensions/modules";

const result = await hasAllRoles({

 contract,

 user: ...,

 roles: ...,

});

`

##### Signature

`function hasAllRoles(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[HasAllRolesParams](https://portal.thirdweb.com/references/typescript/v5/HasAllRolesParams)>,

): Promise<boolean>;

`

### Parameters

##### options

 The options for the hasAllRoles function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[HasAllRolesParams](https://portal.thirdweb.com/references/typescript/v5/HasAllRolesParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 The parsed result of the function call.
## installModule

 Prepares a transaction to call the "installModule" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { installModule } from "thirdweb/extensions/modules";

const transaction = installModule({

 contract,

 moduleContract: ...,

 data: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function installModule(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [InstallModuleParams](https://portal.thirdweb.com/references/typescript/v5/InstallModuleParams)

| { asyncParams: () => Promise<[InstallModuleParams](https://portal.thirdweb.com/references/typescript/v5/InstallModuleParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "installModule" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [InstallModuleParams](https://portal.thirdweb.com/references/typescript/v5/InstallModuleParams)

| { asyncParams: () => Promise<[InstallModuleParams](https://portal.thirdweb.com/references/typescript/v5/InstallModuleParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## isGetSupportedCallbackFunctionsSupported

 Checks if the `getSupportedCallbackFunctions` method is supported by the given contract.

### Example

`import { isGetSupportedCallbackFunctionsSupported } from "thirdweb/extensions/modules";

const supported = isGetSupportedCallbackFunctionsSupported(["0x..."]);

`

##### Signature

`function isGetSupportedCallbackFunctionsSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getSupportedCallbackFunctions` method is supported.
## isGetModuleConfigSupported

 Checks if the `getModuleConfig` method is supported by the given contract.

### Example

`import { isGetModuleConfigSupported } from "thirdweb/extensions/modules";

const supported = isGetModuleConfigSupported(["0x..."]);

`

##### Signature

`function isGetModuleConfigSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getModuleConfig` method is supported.
## isInstallModuleSupported

 Checks if the `installModule` method is supported by the given contract.

### Example

`import { isInstallModuleSupported } from "thirdweb/extensions/modules";

const supported = isInstallModuleSupported(["0x..."]);

`

##### Signature

`function isInstallModuleSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `installModule` method is supported.
## isUninstallModuleSupported

 Checks if the `uninstallModule` method is supported by the given contract.

### Example

`import { isUninstallModuleSupported } from "thirdweb/extensions/modules";

const supported = isUninstallModuleSupported(["0x..."]);

`

##### Signature

`function isUninstallModuleSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `uninstallModule` method is supported.
## owner

 Calls the "owner" function on the contract.

### Example

`import { owner } from "thirdweb/extensions/modules";

const result = await owner({

 contract,

});

`

##### Signature

`function owner(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)): Promise<string>;

`

### Parameters

##### options

 The options for the owner function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## moduleInstalledEvent

 Creates an event object for the ModuleInstalled event.

### Example

`import { getContractEvents } from "thirdweb";

import { moduleInstalledEvent } from "thirdweb/extensions/modules";

const events = await getContractEvents({

 contract,

 events: [moduleInstalledEvent()],

});

`

##### Signature

`function moduleInstalledEvent(): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "caller"; readonly type: "address" },

 { readonly name: "implementation"; readonly type: "address" },

 { readonly name: "installedModule"; readonly type: "address" },

 ];

readonly name: "ModuleInstalled";

readonly type: "event";

}>;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "caller"; readonly type: "address" },

 { readonly name: "implementation"; readonly type: "address" },

 { readonly name: "installedModule"; readonly type: "address" },

 ];

readonly name: "ModuleInstalled";

readonly type: "event";

}>;

`

 The prepared event object.
## isGetInstalledModulesSupported

 Checks if the `getInstalledModules` method is supported by the given contract.

### Example

`import { isGetInstalledModulesSupported } from "thirdweb/extensions/modules";

const supported = isGetInstalledModulesSupported(["0x..."]);

`

##### Signature

`function isGetInstalledModulesSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getInstalledModules` method is supported.
## ownershipHandoverExpiresAt

 Calls the "ownershipHandoverExpiresAt" function on the contract.

### Example

`import { ownershipHandoverExpiresAt } from "thirdweb/extensions/modules";

const result = await ownershipHandoverExpiresAt({

 contract,

 pendingOwner: ...,

});

`

##### Signature

`function ownershipHandoverExpiresAt(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[OwnershipHandoverExpiresAtParams](https://portal.thirdweb.com/references/typescript/v5/OwnershipHandoverExpiresAtParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the ownershipHandoverExpiresAt function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[OwnershipHandoverExpiresAtParams](https://portal.thirdweb.com/references/typescript/v5/OwnershipHandoverExpiresAtParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## renounceRoles

 Prepares a transaction to call the "renounceRoles" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { renounceRoles } from "thirdweb/extensions/modules";

const transaction = renounceRoles({

 contract,

 roles: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function renounceRoles(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [RenounceRolesParams](https://portal.thirdweb.com/references/typescript/v5/RenounceRolesParams)

| { asyncParams: () => Promise<[RenounceRolesParams](https://portal.thirdweb.com/references/typescript/v5/RenounceRolesParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "renounceRoles" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [RenounceRolesParams](https://portal.thirdweb.com/references/typescript/v5/RenounceRolesParams)

| { asyncParams: () => Promise<[RenounceRolesParams](https://portal.thirdweb.com/references/typescript/v5/RenounceRolesParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## requestOwnershipHandover

 Prepares a transaction to call the "requestOwnershipHandover" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { requestOwnershipHandover } from "thirdweb/extensions/modules";

const transaction = requestOwnershipHandover();

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function requestOwnershipHandover(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "requestOwnershipHandover" function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## renounceOwnership

 Prepares a transaction to call the "renounceOwnership" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { renounceOwnership } from "thirdweb/extensions/modules";

const transaction = renounceOwnership();

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function renounceOwnership(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "renounceOwnership" function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## revokeRoles

 Prepares a transaction to call the "revokeRoles" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { revokeRoles } from "thirdweb/extensions/modules";

const transaction = revokeRoles({

 contract,

 user: ...,

 roles: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function revokeRoles(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [RevokeRolesParams](https://portal.thirdweb.com/references/typescript/v5/RevokeRolesParams)

| { asyncParams: () => Promise<[RevokeRolesParams](https://portal.thirdweb.com/references/typescript/v5/RevokeRolesParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "revokeRoles" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [RevokeRolesParams](https://portal.thirdweb.com/references/typescript/v5/RevokeRolesParams)

| { asyncParams: () => Promise<[RevokeRolesParams](https://portal.thirdweb.com/references/typescript/v5/RevokeRolesParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## transferOwnership

 Prepares a transaction to call the "transferOwnership" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { transferOwnership } from "thirdweb/extensions/modules";

const transaction = transferOwnership({

 contract,

 newOwner: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function transferOwnership(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [TransferOwnershipParams](https://portal.thirdweb.com/references/typescript/v5/TransferOwnershipParams)

| { asyncParams: () => Promise<[TransferOwnershipParams](https://portal.thirdweb.com/references/typescript/v5/TransferOwnershipParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "transferOwnership" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [TransferOwnershipParams](https://portal.thirdweb.com/references/typescript/v5/TransferOwnershipParams)

| { asyncParams: () => Promise<[TransferOwnershipParams](https://portal.thirdweb.com/references/typescript/v5/TransferOwnershipParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## rolesOf

 Calls the "rolesOf" function on the contract.

### Example

`import { rolesOf } from "thirdweb/extensions/modules";

const result = await rolesOf({

 contract,

 user: ...,

});

`

##### Signature

`function rolesOf(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[RolesOfParams](https://portal.thirdweb.com/references/typescript/v5/RolesOfParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the rolesOf function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[RolesOfParams](https://portal.thirdweb.com/references/typescript/v5/RolesOfParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## uninstallModule

 Prepares a transaction to call the "uninstallModule" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { uninstallModule } from "thirdweb/extensions/modules";

const transaction = uninstallModule({

 contract,

 moduleContract: ...,

 data: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function uninstallModule(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [UninstallModuleParams](https://portal.thirdweb.com/references/typescript/v5/UninstallModuleParams)

| { asyncParams: () => Promise<[UninstallModuleParams](https://portal.thirdweb.com/references/typescript/v5/UninstallModuleParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "uninstallModule" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [UninstallModuleParams](https://portal.thirdweb.com/references/typescript/v5/UninstallModuleParams)

| { asyncParams: () => Promise<[UninstallModuleParams](https://portal.thirdweb.com/references/typescript/v5/UninstallModuleParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## blockAndAggregate

 Prepares a transaction to call the "blockAndAggregate" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { blockAndAggregate } from "thirdweb/extensions/multicall3";

const transaction = blockAndAggregate({

 contract,

 calls: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function blockAndAggregate(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [BlockAndAggregateParams](https://portal.thirdweb.com/references/typescript/v5/BlockAndAggregateParams)

| { asyncParams: () => Promise<[BlockAndAggregateParams](https://portal.thirdweb.com/references/typescript/v5/BlockAndAggregateParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "blockAndAggregate" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [BlockAndAggregateParams](https://portal.thirdweb.com/references/typescript/v5/BlockAndAggregateParams)

| { asyncParams: () => Promise<[BlockAndAggregateParams](https://portal.thirdweb.com/references/typescript/v5/BlockAndAggregateParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## mintWithSignature

 Mints ERC721 tokens to a specified address with a signature via a MintableERC721 module.

### Example

`import { MintableERC721 } from "thirdweb/modules";

// generate the payload and signature, this is typically done on the server

// requires to be generated with a wallet that has the MINTER_ROLE

const { payload, signature } =

await MintableERC721.generateMintSignature({

 account,

 contract,

 nfts: [

 {

 name: "My NFT",

 description: "My NFT",

 image: "https://example.com/image.png",

 },

 ],

 mintRequest: {

 recipient: "0x...",

 },

 });

// prepare the transaction, this is typically done on the client

// can be executed by any wallet

const transaction = MintableERC721.mintWithSignature({

 contract,

 payload,

 signature,

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`` function mintWithSignature(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<{

payload: {

amount: bigint;

baseURI: string;

data: `0x${string}`;

to: `0x${string}`;

 };

signature: `0x${string}`;

 }>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

 ``

### Parameters

##### options

 The options for minting tokens.

#### Type

`` let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<{

payload: {

amount: bigint;

baseURI: string;

data: `0x${string}`;

to: `0x${string}`;

 };

signature: `0x${string}`;

}>;

 ``

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A transaction to mint tokens.
## aggregate3Value

 Prepares a transaction to call the "aggregate3Value" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { aggregate3Value } from "thirdweb/extensions/multicall3";

const transaction = aggregate3Value({

 contract,

 calls: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function aggregate3Value(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [Aggregate3ValueParams](https://portal.thirdweb.com/references/typescript/v5/Aggregate3ValueParams)

| { asyncParams: () => Promise<[Aggregate3ValueParams](https://portal.thirdweb.com/references/typescript/v5/Aggregate3ValueParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "aggregate3Value" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [Aggregate3ValueParams](https://portal.thirdweb.com/references/typescript/v5/Aggregate3ValueParams)

| { asyncParams: () => Promise<[Aggregate3ValueParams](https://portal.thirdweb.com/references/typescript/v5/Aggregate3ValueParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## install

 Installs the MintableERC1155 module on a core contract.

### Example

`import { MintableERC1155 } from "thirdweb/modules";

const transaction = MintableERC1155.install({

 contract: coreContract,

 account: account,

 params: {

 primarySaleRecipient: ...,

 },

});

await sendTransaction({

 transaction,

 account,

});

`

##### Signature

`function install(options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params: EncodeBytesOnInstallParams & { publisher?: string };

}): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

`

### Parameters

##### options

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params: EncodeBytesOnInstallParams & { publisher?: string };

};

`

### Returns

##### Return Type

`let returnType: Readonly<options> & {

__contract?: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi>;

__preparedMethod?: () => Promise<PreparedMethod<abiFn>>;

};

`

 the transaction to install the module
## aggregate3

 Prepares a transaction to call the "aggregate3" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { aggregate3 } from "thirdweb/extensions/multicall3";

const transaction = aggregate3({

 contract,

 calls: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function aggregate3(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [Aggregate3Params](https://portal.thirdweb.com/references/typescript/v5/Aggregate3Params)

| { asyncParams: () => Promise<[Aggregate3Params](https://portal.thirdweb.com/references/typescript/v5/Aggregate3Params)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "aggregate3" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[Aggregate3Params](https://portal.thirdweb.com/references/typescript/v5/Aggregate3Params) | { asyncParams: () => Promise<[Aggregate3Params](https://portal.thirdweb.com/references/typescript/v5/Aggregate3Params)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## getBasefee

 Calls the "getBasefee" function on the contract.

### Example

`import { getBasefee } from "thirdweb/extensions/multicall3";

const result = await getBasefee({

 contract,

});

`

##### Signature

`function getBasefee(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)): Promise<bigint>;

`

### Parameters

##### options

 The options for the getBasefee function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## getBlockHash

 Calls the "getBlockHash" function on the contract.

### Example

`import { getBlockHash } from "thirdweb/extensions/multicall3";

const result = await getBlockHash({

 contract,

 blockNumber: ...,

});

`

##### Signature

`` function getBlockHash(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetBlockHashParams](https://portal.thirdweb.com/references/typescript/v5/GetBlockHashParams)>,

): Promise<`0x${string}`>;

 ``

### Parameters

##### options

 The options for the getBlockHash function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetBlockHashParams](https://portal.thirdweb.com/references/typescript/v5/GetBlockHashParams)>;

`

### Returns

##### Return Type

`` let returnType: Promise<`0x${string}`>;

 ``

 The parsed result of the function call.
## getBlockNumber

 Calls the "getBlockNumber" function on the contract.

### Example

`import { getBlockNumber } from "thirdweb/extensions/multicall3";

const result = await getBlockNumber({

 contract,

});

`

##### Signature

`function getBlockNumber(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the getBlockNumber function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## getCurrentBlockCoinbase

 Calls the "getCurrentBlockCoinbase" function on the contract.

### Example

`import { getCurrentBlockCoinbase } from "thirdweb/extensions/multicall3";

const result = await getCurrentBlockCoinbase({

 contract,

});

`

##### Signature

`function getCurrentBlockCoinbase(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<string>;

`

### Parameters

##### options

 The options for the getCurrentBlockCoinbase function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## getCurrentBlockDifficulty

 Calls the "getCurrentBlockDifficulty" function on the contract.

### Example

`import { getCurrentBlockDifficulty } from "thirdweb/extensions/multicall3";

const result = await getCurrentBlockDifficulty({

 contract,

});

`

##### Signature

`function getCurrentBlockDifficulty(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the getCurrentBlockDifficulty function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## getCurrentBlockTimestamp

 Calls the "getCurrentBlockTimestamp" function on the contract.

### Example

`import { getCurrentBlockTimestamp } from "thirdweb/extensions/multicall3";

const result = await getCurrentBlockTimestamp({

 contract,

});

`

##### Signature

`function getCurrentBlockTimestamp(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the getCurrentBlockTimestamp function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## getChainId

 Calls the "getChainId" function on the contract.

### Example

`import { getChainId } from "thirdweb/extensions/multicall3";

const result = await getChainId({

 contract,

});

`

##### Signature

`function getChainId(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)): Promise<bigint>;

`

### Parameters

##### options

 The options for the getChainId function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## getCurrentBlockGasLimit

 Calls the "getCurrentBlockGasLimit" function on the contract.

### Example

`import { getCurrentBlockGasLimit } from "thirdweb/extensions/multicall3";

const result = await getCurrentBlockGasLimit({

 contract,

});

`

##### Signature

`function getCurrentBlockGasLimit(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the getCurrentBlockGasLimit function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## getLastBlockHash

 Calls the "getLastBlockHash" function on the contract.

### Example

`import { getLastBlockHash } from "thirdweb/extensions/multicall3";

const result = await getLastBlockHash({

 contract,

});

`

##### Signature

`` function getLastBlockHash(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<`0x${string}`>;

 ``

### Parameters

##### options

 The options for the getLastBlockHash function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`` let returnType: Promise<`0x${string}`>;

 ``

 The parsed result of the function call.
## getEthBalance

 Calls the "getEthBalance" function on the contract.

### Example

`import { getEthBalance } from "thirdweb/extensions/multicall3";

const result = await getEthBalance({

 contract,

 addr: ...,

});

`

##### Signature

`function getEthBalance(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetEthBalanceParams](https://portal.thirdweb.com/references/typescript/v5/GetEthBalanceParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the getEthBalance function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetEthBalanceParams](https://portal.thirdweb.com/references/typescript/v5/GetEthBalanceParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## numberToBytes

 Converts a number to bytes.

### Example

`import { numberToBytes } from "thirdweb/utils";

const bytes = numberToBytes(420);

console.log(bytes); // Uint8Array(2) [ 1, 164 ]

`

##### Signature

`function numberToBytes(

value: number | bigint,

opts?: Options,

): Uint8Array<ArrayBufferLike>;

`

### Parameters

##### value

 The number to convert.

#### Type

`let value: number | bigint;

`

##### opts

optional

 Options for converting the number to hex.

#### Type

`let opts: Options;

`

### Returns

##### Return Type

`let returnType: Uint8Array<ArrayBufferLike>;

`

 The bytes representation of the number.
## numberToHex

 Converts a number or bigint to a hexadecimal string.

### Example

`import { numberToHex } from "thirdweb/utils";

const hex = numberToHex(420);

console.log(hex); // "0x1a4"

`

##### Signature

`` function numberToHex(

value_: number | bigint,

opts: Options,

): `0x${string}`;

 ``

### Parameters

##### value\_

 The number or bigint value to convert.

#### Type

`let value_: number | bigint;

`

##### opts

 Optional configuration options.

#### Type

`let opts: Options;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

 The hexadecimal representation of the input value.
## tryBlockAndAggregate

 Prepares a transaction to call the "tryBlockAndAggregate" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { tryBlockAndAggregate } from "thirdweb/extensions/multicall3";

const transaction = tryBlockAndAggregate({

 contract,

 requireSuccess: ...,

 calls: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function tryBlockAndAggregate(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [TryBlockAndAggregateParams](https://portal.thirdweb.com/references/typescript/v5/TryBlockAndAggregateParams)

| { asyncParams: () => Promise<[TryBlockAndAggregateParams](https://portal.thirdweb.com/references/typescript/v5/TryBlockAndAggregateParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "tryBlockAndAggregate" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [TryBlockAndAggregateParams](https://portal.thirdweb.com/references/typescript/v5/TryBlockAndAggregateParams)

| { asyncParams: () => Promise<[TryBlockAndAggregateParams](https://portal.thirdweb.com/references/typescript/v5/TryBlockAndAggregateParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## tryAggregate

 Prepares a transaction to call the "tryAggregate" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { tryAggregate } from "thirdweb/extensions/multicall3";

const transaction = tryAggregate({

 contract,

 requireSuccess: ...,

 calls: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function tryAggregate(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [TryAggregateParams](https://portal.thirdweb.com/references/typescript/v5/TryAggregateParams)

| { asyncParams: () => Promise<[TryAggregateParams](https://portal.thirdweb.com/references/typescript/v5/TryAggregateParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "tryAggregate" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [TryAggregateParams](https://portal.thirdweb.com/references/typescript/v5/TryAggregateParams)

| { asyncParams: () => Promise<[TryAggregateParams](https://portal.thirdweb.com/references/typescript/v5/TryAggregateParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## batchMetadataUpdateEvent

 Creates an event object for the BatchMetadataUpdate event.

### Example

`import { getContractEvents } from "thirdweb";

import { OpenEditionMetadataERC721 } from "thirdweb/modules";

const events = await getContractEvents({

 contract,

 events: [OpenEditionMetadataERC721.batchMetadataUpdateEvent()],

});

`

##### Signature

`function batchMetadataUpdateEvent(): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "_fromTokenId"; readonly type: "uint256" },

 { readonly name: "_toTokenId"; readonly type: "uint256" },

 ];

readonly name: "BatchMetadataUpdate";

readonly type: "event";

}>;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "_fromTokenId"; readonly type: "uint256" },

 { readonly name: "_toTokenId"; readonly type: "uint256" },

 ];

readonly name: "BatchMetadataUpdate";

readonly type: "event";

}>;

`

 The prepared event object.
## install

 Installs the OpenEditionMetadataERC721 module on a core contract.

### Example

`import { OpenEditionMetadataERC721 } from "thirdweb/modules";

const transaction = OpenEditionMetadataERC721.install({

 contract: coreContract,

 account: account,

});

await sendTransaction({

 transaction,

 account,

});

`

##### Signature

`function install(options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params?: { publisher?: string };

}): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

`

### Parameters

##### options

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params?: { publisher?: string };

};

`

### Returns

##### Return Type

`let returnType: Readonly<options> & {

__contract?: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi>;

__preparedMethod?: () => Promise<PreparedMethod<abiFn>>;

};

`

 the transaction to install the module
## setSharedMetadata

 Prepares a transaction to call the "setSharedMetadata" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { OpenEditionMetadataERC721 } from "thirdweb/modules";

const transaction = OpenEditionMetadataERC721.setSharedMetadata({

 contract,

 metadata: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setSharedMetadata(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetSharedMetadataParams](https://portal.thirdweb.com/references/typescript/v5/SetSharedMetadataParams)

| { asyncParams: () => Promise<[SetSharedMetadataParams](https://portal.thirdweb.com/references/typescript/v5/SetSharedMetadataParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setSharedMetadata" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetSharedMetadataParams](https://portal.thirdweb.com/references/typescript/v5/SetSharedMetadataParams)

| { asyncParams: () => Promise<[SetSharedMetadataParams](https://portal.thirdweb.com/references/typescript/v5/SetSharedMetadataParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## sharedMetadataUpdatedEvent

 Creates an event object for the SharedMetadataUpdated event.

### Example

`import { getContractEvents } from "thirdweb";

import { OpenEditionMetadataERC721 } from "thirdweb/modules";

const events = await getContractEvents({

 contract,

 events: [OpenEditionMetadataERC721.sharedMetadataUpdatedEvent()],

});

`

##### Signature

`function sharedMetadataUpdatedEvent(): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "name"; readonly type: "string" },

 { readonly name: "description"; readonly type: "string" },

 { readonly name: "imageURI"; readonly type: "string" },

 { readonly name: "animationURI"; readonly type: "string" },

 ];

readonly name: "SharedMetadataUpdated";

readonly type: "event";

}>;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "name"; readonly type: "string" },

 { readonly name: "description"; readonly type: "string" },

 { readonly name: "imageURI"; readonly type: "string" },

 { readonly name: "animationURI"; readonly type: "string" },

 ];

readonly name: "SharedMetadataUpdated";

readonly type: "event";

}>;

`

 The prepared event object.
## module

 Convenience function to add the OpenEditionMetadataERC721 module as a default module on a core contract.

### Example

`import {

 OpenEditionMetadataERC721,

 deployModularContract,

} from "thirdweb/modules";

const deployed = deployModularContract({

 client,

 chain,

 account,

 core: "ERC721",

 params: {

 name: "My Modular Contract",

 },

 modules: [OpenEditionMetadataERC721.module()],

});

`

##### Signature

`` function module(params?: {

publisher?: string;

}): (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: "0x"; module: `0x${string}` }>;

 ``

### Parameters

##### params

optional

 The parameters for the module.

#### Type

`let params: { publisher?: string };

`

### Returns

##### Return Type

`` let returnType: (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: "0x"; module: `0x${string}` }>;

 ``

* The module function.
## createNewPack

### Example

`import { createNewPack } from "thirdweb/extensions/pack";

const transaction = createNewPack({

 contract: packContract,

 client,

 recipient: "0x...",

 tokenOwner: "0x...",

 packMetadata: {

 name: "Pack #1",

 image: "image-of-pack-1",

 },

 openStartTimestamp: new Date(),

 erc20Rewards: [

 {

 contractAddress: "0x...",

 quantityPerReward: 1,

 totalRewards: 1,

 },

 ],

 erc721Rewards: [

 {

 contractAddress: "0x...",

 tokenId: 0n,

 },

 ],

 erc1155Rewards: [

 {

 contractAddress: "0x...",

 tokenId: 0n,

 quantityPerReward: 1,

 totalRewards: 1,

 },

 ],

});

`

##### Signature

`function createNewPack(

options: WithOverrides<[BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[CreateNewPackParams](https://portal.thirdweb.com/references/typescript/v5/CreateNewPackParams)>>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

#### Type

`let options: WithOverrides<

[BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[CreateNewPackParams](https://portal.thirdweb.com/references/typescript/v5/CreateNewPackParams)>

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`
## createPack

 Prepares a transaction to call the "createPack" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { createPack } from "thirdweb/extensions/pack";

const transaction = createPack({

 contract,

 contents: ...,

 numOfRewardUnits: ...,

 packUri: ...,

 openStartTimestamp: ...,

 amountDistributedPerOpen: ...,

 recipient: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function createPack(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [CreatePackParams](https://portal.thirdweb.com/references/typescript/v5/CreatePackParams)

| { asyncParams: () => Promise<[CreatePackParams](https://portal.thirdweb.com/references/typescript/v5/CreatePackParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "createPack" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[CreatePackParams](https://portal.thirdweb.com/references/typescript/v5/CreatePackParams) | { asyncParams: () => Promise<[CreatePackParams](https://portal.thirdweb.com/references/typescript/v5/CreatePackParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## getPackContents

 Calls the "getPackContents" function on the contract.

### Example

`import { getPackContents } from "thirdweb/extensions/pack";

const result = await getPackContents({

 contract,

 packId: ...,

});

`

##### Signature

`function getPackContents(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetPackContentsParams](https://portal.thirdweb.com/references/typescript/v5/GetPackContentsParams)>) : Promise<readonly [readonly Array<{ assetContract: string; tokenId: bigint; tokenType: number; totalAmount: bigint }>, readonly Array<bigint>]>

`

### Parameters

##### options

 The options for the getPackContents function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetPackContentsParams](https://portal.thirdweb.com/references/typescript/v5/GetPackContentsParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<readonly [readonly Array<{ assetContract: string; tokenId: bigint; tokenType: number; totalAmount: bigint }>, readonly Array<bigint>]>

`

 The parsed result of the function call.
## openPack

 Prepares a transaction to call the "openPack" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { openPack } from "thirdweb/extensions/pack";

const transaction = openPack({

 contract,

 packId: ...,

 amountToOpen: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function openPack(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[OpenPackParams](https://portal.thirdweb.com/references/typescript/v5/OpenPackParams) | { asyncParams: () => Promise<[OpenPackParams](https://portal.thirdweb.com/references/typescript/v5/OpenPackParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "openPack" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[OpenPackParams](https://portal.thirdweb.com/references/typescript/v5/OpenPackParams) | { asyncParams: () => Promise<[OpenPackParams](https://portal.thirdweb.com/references/typescript/v5/OpenPackParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## getTokenCountOfBundle

 Calls the "getTokenCountOfBundle" function on the contract.

### Example

`import { getTokenCountOfBundle } from "thirdweb/extensions/pack";

const result = await getTokenCountOfBundle({

 contract,

 bundleId: ...,

});

`

##### Signature

`function getTokenCountOfBundle(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetTokenCountOfBundleParams](https://portal.thirdweb.com/references/typescript/v5/GetTokenCountOfBundleParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the getTokenCountOfBundle function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetTokenCountOfBundleParams](https://portal.thirdweb.com/references/typescript/v5/GetTokenCountOfBundleParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## packCreatedEvent

 Creates an event object for the PackCreated event.

### Example

`import { getContractEvents } from "thirdweb";

import { packCreatedEvent } from "thirdweb/extensions/pack";

const events = await getContractEvents({

contract,

events: [

packCreatedEvent({

 packId: ...,

})

],

});

`

##### Signature

`function packCreatedEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "packId";

readonly type: "uint256";

 },

 { readonly name: "recipient"; readonly type: "address" },

 { readonly name: "totalPacksCreated"; readonly type: "uint256" },

 ];

readonly name: "PackCreated";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "packId";

readonly type: "uint256";

 },

 { readonly name: "recipient"; readonly type: "address" },

 { readonly name: "totalPacksCreated"; readonly type: "uint256" },

 ];

readonly name: "PackCreated";

readonly type: "event";

}>;

`

 The prepared event object.
## packOpenedEvent

 Creates an event object for the PackOpened event.

### Example

`import { getContractEvents } from "thirdweb";

import { packOpenedEvent } from "thirdweb/extensions/pack";

const events = await getContractEvents({

contract,

events: [

packOpenedEvent({

 packId: ...,

 opener: ...,

})

],

});

`

##### Signature

`function packOpenedEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "packId";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "opener";

readonly type: "address";

 },

 { readonly name: "numOfPacksOpened"; readonly type: "uint256" },

 {

readonly components: readonly [

 { readonly name: "assetContract"; readonly type: "address" },

 { readonly name: "tokenType"; readonly type: "uint8" },

 { readonly name: "tokenId"; readonly type: "uint256" },

 { readonly name: "totalAmount"; readonly type: "uint256" },

 ];

readonly name: "rewardUnitsDistributed";

readonly type: "tuple[]";

 },

 ];

readonly name: "PackOpened";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "packId";

readonly type: "uint256";

 },

 {

readonly indexed: true;

readonly name: "opener";

readonly type: "address";

 },

 { readonly name: "numOfPacksOpened"; readonly type: "uint256" },

 {

readonly components: readonly [

 { readonly name: "assetContract"; readonly type: "address" },

 { readonly name: "tokenType"; readonly type: "uint8" },

 { readonly name: "tokenId"; readonly type: "uint256" },

 { readonly name: "totalAmount"; readonly type: "uint256" },

 ];

readonly name: "rewardUnitsDistributed";

readonly type: "tuple[]";

 },

 ];

readonly name: "PackOpened";

readonly type: "event";

}>;

`

 The prepared event object.
## packUpdatedEvent

 Creates an event object for the PackUpdated event.

### Example

`import { getContractEvents } from "thirdweb";

import { packUpdatedEvent } from "thirdweb/extensions/pack";

const events = await getContractEvents({

contract,

events: [

packUpdatedEvent({

 packId: ...,

})

],

});

`

##### Signature

`function packUpdatedEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "packId";

readonly type: "uint256";

 },

 { readonly name: "recipient"; readonly type: "address" },

 { readonly name: "totalPacksCreated"; readonly type: "uint256" },

 ];

readonly name: "PackUpdated";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "packId";

readonly type: "uint256";

 },

 { readonly name: "recipient"; readonly type: "address" },

 { readonly name: "totalPacksCreated"; readonly type: "uint256" },

 ];

readonly name: "PackUpdated";

readonly type: "event";

}>;

`

 The prepared event object.
## encodeInstall

 Encodes the install data for the OpenEditionMetadataERC721 module.

##### Signature

`function encodeInstall(): string;

`

### Returns

##### Return Type

`let returnType: string;

`

* The encoded data.
## parseErc6492Signature

### Example

`import { parseErc6492Signature } from "thirdweb/auth";

const parsedSignature = parseErc6492Signature(

"0x1234567890123456789012345678901234567890",

);

`

##### Signature

`` function parseErc6492Signature(

signature: `0x${string}`,

): [ParseErc6492SignatureReturnType](https://portal.thirdweb.com/references/typescript/v5/ParseErc6492SignatureReturnType);

 ``

### Parameters

##### signature

 The signature to parse

#### Type

`` let signature: `0x${string}`;

 ``

### Returns

##### Return Type

`let returnType: OneOf<[Erc6492Signature](https://portal.thirdweb.com/references/typescript/v5/Erc6492Signature) | { signature: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex) }>;

`

 ParseErc6492SignatureReturnType The parsed (or original) signature
## parseEventLogs

 Parses logs and returns the corresponding events.

### Example

`import { parseEventLogs } from "thirdweb";

const events = parseEventLogs({

 logs,

 events: [preparedEvent, preparedEvent2],

});

`

##### Signature

`function parseEventLogs(

options: [ParseEventLogsOptions](https://portal.thirdweb.com/references/typescript/v5/ParseEventLogsOptions)<abiEvents, TStrict>,

): [ParseEventLogsResult](https://portal.thirdweb.com/references/typescript/v5/ParseEventLogsResult)<abiEvents, TStrict>;

`

### Parameters

##### options

 The options for parsing logs.

#### Type

`let options: [ParseEventLogsOptions](https://portal.thirdweb.com/references/typescript/v5/ParseEventLogsOptions)<abiEvents, TStrict>;

`

### Returns

##### Return Type

`let returnType: [ParseEventLogsResult](https://portal.thirdweb.com/references/typescript/v5/ParseEventLogsResult)<abiEvents, TStrict>;

`

 The parsed events.
## getAllRoleMembers

 Retrieves all members of a specific role.

### Example

`import { getAllRoleMembers } from "thirdweb/extensions/permissions";

const result = await getAllRoleMembers({

 contract,

 role: "admin",

});

`

##### Signature

`function getAllRoleMembers(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetAllRoleMembersParams](https://portal.thirdweb.com/references/typescript/v5/GetAllRoleMembersParams)>,

): Promise<Array<string>>;

`

### Parameters

##### options

 The options for retrieving role members.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetAllRoleMembersParams](https://portal.thirdweb.com/references/typescript/v5/GetAllRoleMembersParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<Array<string>>;

`

 A promise that resolves to an array of strings representing the role members.
## getRoleHash

 Get a hex value of a smart contract role You need the hex value to interact with the smart contracts.

### Example

`const adminRoleHash = getRoleHash("admin"); // 0x0000000...000000

`

##### Signature

`` function getRoleHash(role: RoleInput): `0x${string}`;

 ``

### Parameters

##### role

 string

#### Type

`let role: RoleInput;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

 hex value of the contract role
## getRoleAdmin

 Gets the admin of a role.

### Example

`import { getRoleAdmin } from "thirdweb/extensions/permissions";

const result = await getRoleAdmin({

 contract,

 role: "admin",

});

`

##### Signature

`function getRoleAdmin(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetRoleAdminParams](https://portal.thirdweb.com/references/typescript/v5/GetRoleAdminParams)>,

): Promise<string>;

`

### Parameters

##### options

 The options for getting the role's admin.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetRoleAdminParams](https://portal.thirdweb.com/references/typescript/v5/GetRoleAdminParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The address of the role's admin.
## getRoleMemberCount

 Retrieves the number of members of a specific role.

### Example

`import { getRoleMemberCount } from "thirdweb/extensions/permissions";

const result = await getRoleMemberCount({

 contract,

 role: "admin",

});

`

##### Signature

`function getRoleMemberCount(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetRoleMemberCountParams](https://portal.thirdweb.com/references/typescript/v5/GetRoleMemberCountParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for retrieving role member count.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetRoleMemberCountParams](https://portal.thirdweb.com/references/typescript/v5/GetRoleMemberCountParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 A promise that resolves to the number of members of the role.
## parseAbiParams

 Converts an array of parameter values to their respective types based on the provided type array.

 This utility function is particularly useful for ensuring that parameter values are correctly formatted according to the expected types before they are used in further processing or passed to a Solidity smart contract.

### Example

`import { parseAbiParams } from "thirdweb/utils";

const example1 = parseAbiParams(

 ["address", "uint256"],

 ["0x.....", "1200000"],

); // result: ["0x......", 1200000n]

const example2 = parseAbiParams(

 ["address", "bool"],

 ["0x.....", "true"],

); // result: ["0x......", true]

`

##### Signature

`function parseAbiParams(

constructorParamTypes: Array<string>,

constructorParamValues: Array<unknown>,

): Array<string | bigint | boolean>;

`

### Parameters

##### constructorParamTypes

 An array of type strings indicating the expected types of the values, following Solidity type conventions (e.g., "address", "uint256", "bool").

#### Type

`let constructorParamTypes: Array<string>;

`

##### constructorParamValues

 An array of values to be converted according to the types.

#### Type

`let constructorParamValues: Array<unknown>;

`

### Returns

##### Return Type

`let returnType: Array<string | bigint | boolean>;

`

* An array of values converted to their respective types.
## padHex

 Pads a hexadecimal string with zeros to a specified size.

### Example

`import { padHex } from "thirdweb/utils";

const paddedHex = padHex("0x1a4", { size: 32 });

console.log(paddedHex); // "0x000000000000000000000000000001a4"

`

##### Signature

`` function padHex(

hex_: `0x${string}`,

options: PadOptions,

): `0x${string}`;

 ``

### Parameters

##### hex\_

 The hexadecimal string to pad.

#### Type

`` let hex_: `0x${string}`;

 ``

##### options

 The padding options.

#### Type

`let options: PadOptions;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

 The padded hexadecimal string.
## getRoleMember

 Retrieves a specific member of a specific role.

### Example

`import { getRoleMember } from "thirdweb/extensions/permissions";

const address = await getRoleMember({

 contract,

 role: "admin",

 index: 0n,

});

`

##### Signature

`function getRoleMember(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetRoleMemberParams](https://portal.thirdweb.com/references/typescript/v5/GetRoleMemberParams)>,

): Promise<string>;

`

### Parameters

##### options

 The options for retrieving the role member.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetRoleMemberParams](https://portal.thirdweb.com/references/typescript/v5/GetRoleMemberParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 A promise that resolves to the address of the role member.
## hasRole

 Checks if the target account has the role.

### Example

`import { hasRole } from "thirdweb/extensions/permissions";

const result = await hasRole({

 contract,

 role: "admin",

 targetAccountAddress: "0x1234567890123456789012345678901234567890",

});

`

##### Signature

`function hasRole(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[HasRoleParams](https://portal.thirdweb.com/references/typescript/v5/HasRoleParams)>,

): Promise<boolean>;

`

### Parameters

##### options

 The options for checking the role.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[HasRoleParams](https://portal.thirdweb.com/references/typescript/v5/HasRoleParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 A boolean that is true if the target account has the role.
## grantRole

 Grants a role to a target account.

### Example

`import { grantRole } from "thirdweb/extensions/permissions";

import { sendTransaction } from "thirdweb";

const transaction = grantRole({

 contract,

 role: "admin",

 targetAccountAddress: "0x1234567890123456789012345678901234567890",

});

await sendTransaction({ transaction, account });

`

##### Signature

`function grantRole(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GrantRoleParams](https://portal.thirdweb.com/references/typescript/v5/GrantRoleParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for granting the role.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GrantRoleParams](https://portal.thirdweb.com/references/typescript/v5/GrantRoleParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A transaction that grants the role when sent.
## isGetRoleMemberCountSupported

 Checks if the `getRoleMemberCount` method is supported by the given contract.

### Example

`import { isGetRoleMemberCountSupported } from "thirdweb/extensions/permissions";

const supported = isGetRoleMemberCountSupported(["0x..."]);

`

##### Signature

`function isGetRoleMemberCountSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getRoleMemberCount` method is supported.
## isGetRoleAdminSupported

 Checks if the `getRoleAdmin` method is supported by the given contract.

### Example

`import { isGetRoleAdminSupported } from "thirdweb/extensions/permissions";

const supported = isGetRoleAdminSupported(["0x..."]);

`

##### Signature

`function isGetRoleAdminSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getRoleAdmin` method is supported.
## isGrantRoleSupported

 Checks if the `grantRole` method is supported by the given contract.

### Example

`import { isGrantRoleSupported } from "thirdweb/extensions/permissions";

const supported = isGrantRoleSupported(["0x..."]);

`

##### Signature

`function isGrantRoleSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `grantRole` method is supported.
## isGetRoleMemberSupported

 Checks if the `getRoleMember` method is supported by the given contract.

### Example

`import { isGetRoleMemberSupported } from "thirdweb/extensions/permissions";

const supported = isGetRoleMemberSupported(["0x..."]);

`

##### Signature

`function isGetRoleMemberSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getRoleMember` method is supported.
## isHasRoleSupported

 Checks if the `hasRole` method is supported by the given contract.

### Example

`import { isHasRoleSupported } from "thirdweb/extensions/permissions";

const supported = isHasRoleSupported(["0x..."]);

`

##### Signature

`function isHasRoleSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `hasRole` method is supported.
## isRenounceRoleSupported

 Checks if the `renounceRole` method is supported by the given contract.

### Example

`import { isRenounceRoleSupported } from "thirdweb/extensions/permissions";

const supported = isRenounceRoleSupported(["0x..."]);

`

##### Signature

`function isRenounceRoleSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `renounceRole` method is supported.
## renounceRole

 Lets the target account renounce the role. (The target account must be the sender of the transaction.)

### Example

`import { renounceRole } from "thirdweb/extensions/permissions";

import { sendTransaction } from "thirdweb";

const transaction = renounceRole({

 contract,

 role: "admin",

 targetAccountAddress: "0x1234567890123456789012345678901234567890",

});

await sendTransaction({ transaction, account });

`

##### Signature

`function renounceRole(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[RenounceRoleParams](https://portal.thirdweb.com/references/typescript/v5/RenounceRoleParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for renouncing the role.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[RenounceRoleParams](https://portal.thirdweb.com/references/typescript/v5/RenounceRoleParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A transaction that revokes the role when sent.
## isRevokeRoleSupported

 Checks if the `revokeRole` method is supported by the given contract.

### Example

`import { isRevokeRoleSupported } from "thirdweb/extensions/permissions";

const supported = isRevokeRoleSupported(["0x..."]);

`

##### Signature

`function isRevokeRoleSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `revokeRole` method is supported.
## roleAdminChangedEvent

 Creates an event object for the RoleAdminChanged event.

### Example

`import { getContractEvents } from "thirdweb";

import { roleAdminChangedEvent } from "thirdweb/extensions/permissions";

const events = await getContractEvents({

contract,

events: [

roleAdminChangedEvent({

 role: ...,

 previousAdminRole: ...,

 newAdminRole: ...,

})

],

});

`

##### Signature

`function roleAdminChangedEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "role";

readonly type: "bytes32";

 },

 {

readonly indexed: true;

readonly name: "previousAdminRole";

readonly type: "bytes32";

 },

 {

readonly indexed: true;

readonly name: "newAdminRole";

readonly type: "bytes32";

 },

 ];

readonly name: "RoleAdminChanged";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "role";

readonly type: "bytes32";

 },

 {

readonly indexed: true;

readonly name: "previousAdminRole";

readonly type: "bytes32";

 },

 {

readonly indexed: true;

readonly name: "newAdminRole";

readonly type: "bytes32";

 },

 ];

readonly name: "RoleAdminChanged";

readonly type: "event";

}>;

`

 The prepared event object.
## revokeRole

 Revokes a role from a target account.

### Example

`import { revokeRole } from "thirdweb/extensions/permissions";

import { sendTransaction } from "thirdweb";

const transaction = revokeRole({

 contract,

 role: "admin",

 targetAccountAddress: "0x1234567890123456789012345678901234567890",

});

await sendTransaction({ transaction, account });

`

##### Signature

`function revokeRole(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[RevokeRoleParams](https://portal.thirdweb.com/references/typescript/v5/RevokeRoleParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for revoking the role.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[RevokeRoleParams](https://portal.thirdweb.com/references/typescript/v5/RevokeRoleParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A transaction that revokes the role when sent.
## roleGrantedEvent

 Creates an event object for the RoleGranted event.

### Example

`import { getContractEvents } from "thirdweb";

import { roleGrantedEvent } from "thirdweb/extensions/permissions";

const events = await getContractEvents({

contract,

events: [

roleGrantedEvent({

 role: ...,

 account: ...,

 sender: ...,

})

],

});

`

##### Signature

`function roleGrantedEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "role";

readonly type: "bytes32";

 },

 {

readonly indexed: true;

readonly name: "account";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "sender";

readonly type: "address";

 },

 ];

readonly name: "RoleGranted";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "role";

readonly type: "bytes32";

 },

 {

readonly indexed: true;

readonly name: "account";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "sender";

readonly type: "address";

 },

 ];

readonly name: "RoleGranted";

readonly type: "event";

}>;

`

 The prepared event object.
## roleRevokedEvent

 Creates an event object for the RoleRevoked event.

### Example

`import { getContractEvents } from "thirdweb";

import { roleRevokedEvent } from "thirdweb/extensions/permissions";

const events = await getContractEvents({

contract,

events: [

roleRevokedEvent({

 role: ...,

 account: ...,

 sender: ...,

})

],

});

`

##### Signature

`function roleRevokedEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "role";

readonly type: "bytes32";

 },

 {

readonly indexed: true;

readonly name: "account";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "sender";

readonly type: "address";

 },

 ];

readonly name: "RoleRevoked";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "role";

readonly type: "bytes32";

 },

 {

readonly indexed: true;

readonly name: "account";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "sender";

readonly type: "address";

 },

 ];

readonly name: "RoleRevoked";

readonly type: "event";

}>;

`

 The prepared event object.
## isGetAllRoleMembersSupported

 Checks if the `getAllRoleMembers` method is supported by the given contract.

### Example

`import { isGetAllRoleMembersSupported } from "thirdweb/extensions/permissions";

const supported = isGetAllRoleMembersSupported(["0x..."]);

`

##### Signature

`function isGetAllRoleMembersSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `getAllRoleMembers` method is supported.
## predictAddress

Deprecated

 Use `predictSmartAccountAddress` instead.

 Predict the address of a smart account.

### Example

`import { predictAddress } from "thirdweb/wallets/smart";

const predictedAddress = await predictAddress({

 factoryContract,

 adminAddress,

 accountSalt,

});

`

##### Signature

`function predictAddress(args: {

accountAddress?: string;

accountSalt?: string;

adminAddress: string;

factoryContract: Readonly;

predictAddressOverride?: (

factoryContract: Readonly,

admin: string,

 ) => Promise<string>;

}): Promise<string>;

`

### Parameters

##### args

 The options for predicting the address of a smart account.

#### Type

`let args: {

accountAddress?: string;

accountSalt?: string;

adminAddress: string;

factoryContract: Readonly;

predictAddressOverride?: (

factoryContract: Readonly,

admin: string,

 ) => Promise<string>;

};

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The predicted address of the smart account.
## preAuthenticate

 Pre-authenticates the user based on the provided authentication strategy. Use this function to send a verification code to the user's email or phone number.

### Example

`import { preAuthenticate } from "thirdweb/wallets/in-app";

const result = await preAuthenticate({

 client,

 strategy: "email",

 email: "example@example.org",

});

`

##### Signature

`function preAuthenticate(args: PreAuthArgsType): Promise<void>;

`

### Parameters

##### args

 The arguments required for pre-authentication.

#### Type

`let args: PreAuthArgsType;

`

### Returns

##### Return Type

`let returnType: Promise<void>;

`

 A promise that resolves to the pre-authentication result.
## predictSmartAccountAddress

 Predict the address of a smart account.

### Example

`import { predictSmartAccountAddress } from "thirdweb/wallets/smart";

const predictedAddress = await predictSmartAccountAddress({

 client,

 chain,

 adminAddress,

});

`

##### Signature

`function predictSmartAccountAddress(args: {

accountSalt?: string;

adminAddress: string;

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

factoryAddress?: string;

}): Promise<string>;

`

### Parameters

##### args

 The options for predicting the address of a smart account.

#### Type

`let args: {

accountSalt?: string;

adminAddress: string;

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

factoryAddress?: string;

};

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The predicted address of the smart account.
## prepareEvent

 Prepares an event by parsing the signature, generating the event hash, and encoding the event topics.

### Example

`import { prepareEvent } from "thirdweb";

const myEvent = prepareEvent({

 signature: "event MyEvent(uint256 myArg)",

});

`

##### Signature

`function prepareEvent(

options: [PrepareEventOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareEventOptions)<TSignature>,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<ParseEvent<TSignature>>;

`

### Parameters

##### options

 The options for preparing the event.

#### Type

`let options: [PrepareEventOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareEventOptions)<TSignature>;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<ParseEvent<TSignature>>;

`

 The prepared event object.
## prepareMethod

 Prepares a method for usage by converting it into a prepared method object.

### Example

`import { prepareMethod } from "thirdweb/utils";

const method = "function transfer(address to, uint256 value)";

const preparedMethod = prepareMethod(method);

`

##### Signature

`function prepareMethod(method: TMethod): PreparedMethod<TMethod>;

`

### Parameters

##### method

 The method to prepare.

#### Type

`let method: TMethod;

`

### Returns

##### Return Type

`let returnType: PreparedMethod<TMethod>;

`

 The prepared method object.
## privateKeyToAccount

 Get an `Account` object from a private key.

### Example

`import { privateKeyToAccount } from "thirdweb/wallets";

const wallet = privateKeyToAccount({

 client,

 privateKey: "...",

});

`

##### Signature

`function privateKeyToAccount(

options: [PrivateKeyToAccountOptions](https://portal.thirdweb.com/references/typescript/v5/PrivateKeyToAccountOptions),

): [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

### Parameters

##### options

 The options for `privateKeyToAccount`Refer to the type [PrivateKeyToAccountOptions](https://portal.thirdweb.com/references/typescript/v5/PrivateKeyToAccountOptions)

#### Type

`let options: { client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient); privateKey: string };

`

### Returns

##### Return Type

`let returnType: {

address: Address;

estimateGas?: (tx: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)) => Promise<bigint>;

onTransactionRequested?: (

transaction: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any>,

 ) => Promise<void>;

sendBatchTransaction?: (

txs: Array<SendTransactionOption>,

 ) => Promise<SendTransactionResult>;

sendRawTransaction?: (

tx: SendRawTransactionOptions,

 ) => Promise<SendTransactionResult>;

sendTransaction: (

tx: SendTransactionOption,

 ) => Promise<SendTransactionResult>;

signAuthorization?: (

authorization: [AuthorizationRequest](https://portal.thirdweb.com/references/typescript/v5/AuthorizationRequest),

 ) => Promise<[SignedAuthorization](https://portal.thirdweb.com/references/typescript/v5/SignedAuthorization)>;

signMessage: ({

message,

originalMessage,

chainId,

 }: {

chainId?: number;

message: SignableMessage;

originalMessage?: string;

 }) => Promise<Hex>;

signTransaction?: (tx: SerializableTransaction) => Promise<Hex>;

signTypedData: (

_typedData: ox__TypedData.Definition<typedData, primaryType>,

 ) => Promise<Hex>;

watchAsset?: (asset: WatchAssetParams) => Promise<boolean>;

};

`

 The `Account` object that represents the private key
## aggregate

 Prepares a transaction to call the "aggregate" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { aggregate } from "thirdweb/extensions/multicall3";

const transaction = aggregate({

 contract,

 calls: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function aggregate(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[AggregateParams](https://portal.thirdweb.com/references/typescript/v5/AggregateParams) | { asyncParams: () => Promise<[AggregateParams](https://portal.thirdweb.com/references/typescript/v5/AggregateParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "aggregate" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[AggregateParams](https://portal.thirdweb.com/references/typescript/v5/AggregateParams) | { asyncParams: () => Promise<[AggregateParams](https://portal.thirdweb.com/references/typescript/v5/AggregateParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## randomPrivateKey

 Generates a random ECDSA private key on the secp256k1 curve.

### Example

`import { Secp256k1 } from "ox";

const privateKey = Secp256k1.randomPrivateKey();

`

##### Signature

`function randomPrivateKey(options?: Options<as>): ReturnType<as>;

`

### Parameters

##### options

optional

 The options to generate the private key.

#### Type

`let options: Options<as>;

`

### Returns

##### Return Type

`let returnType: ReturnType<as>;

`

 The generated private key.
## readContract

####  Reads state from a deployed smart contract.

 Use this for raw read calls from a contract, but you can also use read [ extensions](https://portal.thirdweb.com/typescript/v5/extensions/use) for predefined methods for common standards.

### Example

####  Raw contract call (recommended)

 You can read from any contract by using the solidity signature of the function you want to call.

`import { getContract } from "thirdweb";

import { sepolia } from "thirdweb/chains";

import { useReadContract } from "thirdweb/react";

const contract = getContract({

 client,

 address: "0x...",

 chain: sepolia,

});

const { data, isLoading } = useReadContract({

 contract,

 method: "function tokenURI(uint256 tokenId) returns (string)",

 params: [1n],

});

`

 Note that this is type safe, the params types will be enforced based on the signature.

####  Raw contract call with `resolveMethod`

 If you don't have the solidity signature of the function you want to call, you can use the `resolveMethod` helper to resolve the method from any deployed contract.

 Note that this is not type safe, and will also have a 1 time overhead of resolving the contract ABI.

`import { getContract, resolveMethod } from "thirdweb";

import { sepolia } from "thirdweb/chains";

import { useReadContract } from "thirdweb/react";

const contract = getContract({

 client,

 address: "0x...",

 chain: sepolia,

});

const { data, isLoading } = useReadContract({

 contract,

 method: resolveMethod("tokenURI"),

 params: [1n],

});

`

##### Signature

`function readContract(

options: [ReadContractOptions](https://portal.thirdweb.com/references/typescript/v5/ReadContractOptions)<TAbi, TMethod, TPreparedMethod>,

): Promise<[ReadContractResult](https://portal.thirdweb.com/references/typescript/v5/ReadContractResult)<TPreparedMethod[2]>>;

`

### Parameters

##### options

 The transaction options.

#### Type

`let options: [ReadContractOptions](https://portal.thirdweb.com/references/typescript/v5/ReadContractOptions)<TAbi, TMethod, TPreparedMethod>;

`

### Returns

##### Return Type

`let returnType: outputs extends { length: 0 }

? never

: outputs extends { length: 1 }

? AbiParametersToPrimitiveTypes<outputs>[0]

: AbiParametersToPrimitiveTypes<outputs>;

`

 A promise that resolves with the result of the read call.
## prepareContractCall

 Prepares a contract call by resolving the ABI function, parameters and encoded data. Optionally specify other properties such as value or gas price.

### Example

####  Usage with a human-readable method signature:

`import { prepareContractCall } from "thirdweb";

const transaction = prepareContractCall({

 contract,

 method: "function transfer(address to, uint256 value)",

 params: [to, value],

});

`

####  Usage with explicit gas price and/or value:

`import { prepareContractCall } from "thirdweb";

import { toWei } from "thirdweb/utils";

const transaction = prepareContractCall({

 contract,

 method: "function transfer(address to, uint256 value)",

 params: [to, value],

 maxFeePerGas: 30n,

 maxPriorityFeePerGas: 1n,

 value: toWei("0.01"),

});

`

####  Usage with ERC20 value:

 For transactions that transfer ERC20 tokens, you can specify the value as the amount of tokens to transfer.

 You can use this in conjuction with the [getApprovalForTransaction](https://portal.thirdweb.com/references/typescript/v5/getApprovalForTransaction) function to easily create approval transactions for ERC20 tokens.

 This value will also be read by the react hooks and UI components to present to total cost to the user.

`import { prepareContractCall } from "thirdweb";

import { toWei } from "thirdweb/utils";

const transaction = prepareContractCall({

 contract,

 method: "function payWithCoin()",

 params: [],

 erc20Value: {

 tokenAddress: "0x...", // the address of the ERC20 token

 amountWei: toWei("0.1"), // the amount of tokens to transfer in wei

 },

});

`

####  Usage with a JSON ABI function object:

`import { prepareContractCall } from "thirdweb";

const transaction = prepareContractCall({

 contract,

 method: {

 name: "transfer",

 type: "function",

 inputs: [

 { name: "to", type: "address" },

 { name: "value", type: "uint256" },

 ],

 outputs: [],

 stateMutability: "payable",

 },

 params: [to, value],

});

`

####  Usage with the ABI defined on the contract:

`import { getContract, prepareContractCall } from "thirdweb";

const contract = getContract({

..., // chain, address, client

 abi: [...] // ABI with a "transfer" method

});

const transaction = prepareContractCall({

 contract,

 method: "transfer", // <- this gets inferred from the contract

 params: [to, value],

});

`

####  Passing extra call data to the transaction

`import { getContract, prepareContractCall } from "thirdweb";

const contract = getContract({

..., // chain, address, client

});

const transaction = prepareContractCall({

 contract,

 method: "function transfer(address to, uint256 value)",

 params: [...],

// The extra call data MUST be encoded to hex before passing

 extraCallData: "0x......."

});

`

##### Signature

`function prepareContractCall(

options: [PrepareContractCallOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareContractCallOptions)<TAbi, TMethod, TPreparedMethod>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

TAbi,

ParseMethod<TAbi, TMethod>,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

### Parameters

##### options

 The options for preparing the contract call.

#### Type

`let options: [PrepareContractCallOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareContractCallOptions)<

TAbi,

TMethod,

TPreparedMethod

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

TAbi,

ParseMethod<TAbi, TMethod>,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A promise that resolves to the prepared transaction.
## refreshJWT

 Refreshes a JSON Web Token (JWT) by encoding a new payload with updated expiration time.

### Example

`import { refreshJWT } from "thirdweb/utils";

const jwt = await refreshJWT({

 account,

 jwt,

 expirationTime: 1000 * 60 * 60,

});

`

##### Signature

`function refreshJWT(options: [RefreshJWTParams](https://portal.thirdweb.com/references/typescript/v5/RefreshJWTParams)): Promise<string>;

`

### Parameters

##### options

 The options for refreshing the JWT.

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

expirationTime?: number;

jwt: string;

};

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 A Promise that resolves to the refreshed JWT.
## resolveAbiFromBytecode

 Resolves the ABI (Application Binary Interface) from the bytecode of a contract.

### Example

`import { createThirdwebClient, getContract } from "thirdweb";

import { resolveAbiFromBytecode } from "thirdweb/contract";

import { ethereum } from "thirdweb/chains";

const client = createThirdwebClient({ clientId: "..." });

const myContract = getContract({

 client,

 address: "...",

 chain: ethereum,

});

const abi = await resolveAbiFromBytecode(myContract);

`

##### Signature

`` function resolveAbiFromBytecode(

contract: Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<any, `0x${string}`>>,

): Promise<Abi>;

 ``

### Parameters

##### contract

 The ThirdwebContract instance.

#### Type

`` let contract: Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<any, `0x${string}`>>;

 ``

### Returns

##### Return Type

`let returnType: readonly Array<(AbiConstructor) | (AbiError) | (AbiEvent) | (AbiFallback) | (AbiFunction) | (AbiReceive)>

`

 The resolved ABI as a generic type.
## resolveArweaveScheme

 Resolves the scheme of a given Arweave URI and returns the corresponding URL.

### Example

`import { resolveArweaveScheme } from "thirdweb/storage";

const url = resolveArweaveScheme({ uri: "ar://<fileId>" });

`

##### Signature

`function resolveArweaveScheme(

options: [ResolveArweaveSchemeOptions](https://portal.thirdweb.com/references/typescript/v5/ResolveArweaveSchemeOptions),

): string;

`

### Parameters

##### options

 The options object containing the Arweave URI

#### Type

`let options: { gatewayUrl?: string; uri: string };

`

### Returns

##### Return Type

`let returnType: string;

`

 The resolved URL
## resolveCompositeAbi

 Resolves the ABI for a contract based on its bytecode. If the contract follows the plugin-pattern or dynamic pattern, it resolves the ABIs for the plugins and merges them with the root ABI. If the contract follows the base router pattern, it resolves the ABIs for the plugins and merges them with the root ABI. If the contract follows the diamond pattern, it resolves the ABIs for the facets and merges them with the root ABI.

### Example

`import { createThirdwebClient, getContract } from "thirdweb";

import { resolveCompositeAbiFromBytecode } from "thirdweb/contract";

import { ethereum } from "thirdweb/chains";

const client = createThirdwebClient({ clientId: "..." });

const myContract = getContract({

 client,

 address: "...",

 chain: ethereum,

});

const abi = await resolveCompositeAbiFromBytecode(myContract);

`

##### Signature

`function resolveCompositeAbi(

contract: Readonly,

rootAbi?: Abi,

resolveSubAbi?: (contract: Readonly) => Promise<Abi>,

): Promise<Abi>;

`

### Parameters

##### contract

 The contract for which to resolve the ABI.

#### Type

`let contract: Readonly;

`

##### rootAbi

optional

 The root ABI to use for the contract. If not provided, it resolves the ABI from the contract's bytecode.

#### Type

`let rootAbi: readonly Array<(AbiConstructor) | (AbiError) | (AbiEvent) | (AbiFallback) | (AbiFunction) | (AbiReceive)>

`

##### resolveSubAbi

optional

 A function to resolve the ABI for a sub-contract. If not provided, it uses the default ABI resolution logic.

#### Type

`let resolveSubAbi: (contract: Readonly) => Promise<Abi>;

`

### Returns

##### Return Type

`let returnType: readonly Array<(AbiConstructor) | (AbiError) | (AbiEvent) | (AbiFallback) | (AbiFunction) | (AbiReceive)>

`

 The resolved ABI for the contract.
## resolveContractAbi

 Resolves the ABI (Application Binary Interface) for a given contract. If the ABI is already cached, it returns the cached value. Otherwise, it tries to resolve the ABI from the contract's API. If that fails, it resolves the ABI from the contract's bytecode.

### Example

`import { createThirdwebClient, getContract } from "thirdweb";

import { resolveContractAbi } from "thirdweb/contract";

import { ethereum } from "thirdweb/chains";

const client = createThirdwebClient({ clientId: "..." });

const myContract = getContract({

 client,

 address: "...",

 chain: ethereum,

});

const abi = await resolveContractAbi(myContract);

`

##### Signature

`` function resolveContractAbi(

contract: Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<abi, `0x${string}`>>,

contractApiBaseUrl: string,

): Promise<abi>;

 ``

### Parameters

##### contract

 The contract for which to resolve the ABI.

#### Type

`` let contract: Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<abi, `0x${string}`>>;

 ``

##### contractApiBaseUrl

 The base URL of the contract API. Defaults to "https://contract.thirdweb.com/abi".

#### Type

`let contractApiBaseUrl: string;

`

### Returns

##### Return Type

`let returnType: Promise<abi>;

`

 A promise that resolves to the ABI of the contract.
## resolveImplementation

 Resolves the implementation address and bytecode for a given proxy contract.

### Example

`import { resolveImplementation } from "thirdweb";

const implementation = await resolveImplementation(contract);

`

##### Signature

`` function resolveImplementation(

contract: Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<any, `0x${string}`>>,

): Promise<{ address: string; bytecode: `0x${string}` }>;

 ``

### Parameters

##### contract

 The contract to resolve the implementation for.

#### Type

`` let contract: Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<any, `0x${string}`>>;

 ``

### Returns

##### Return Type

`` let returnType: Promise<{ address: string; bytecode: `0x${string}` }>;

 ``

 A promise that resolves to an object containing the implementation address and bytecode.
## resolveAbiFromContractApi

 Resolves the ABI (Application Binary Interface) for a contract from the contract API.

### Example

`import { createThirdwebClient, getContract } from "thirdweb";

import { resolveAbiFromContractApi } from "thirdweb/contract";

import { ethereum } from "thirdweb/chains";

const client = createThirdwebClient({ clientId: "..." });

const myContract = getContract({

 client,

 address: "...",

 chain: ethereum,

});

const abi = await resolveAbiFromContractApi(myContract);

`

##### Signature

`` function resolveAbiFromContractApi(

contract: Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<any, `0x${string}`>>,

contractApiBaseUrl: string,

): Promise<Abi>;

 ``

### Parameters

##### contract

 The ThirdwebContract instance representing the contract.

#### Type

`` let contract: Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<any, `0x${string}`>>;

 ``

##### contractApiBaseUrl

 The base URL of the contract API. Defaults to "https://contract.thirdweb.com/abi".

#### Type

`let contractApiBaseUrl: string;

`

### Returns

##### Return Type

`let returnType: readonly Array<(AbiConstructor) | (AbiError) | (AbiEvent) | (AbiFallback) | (AbiFunction) | (AbiReceive)>

`

 A promise that resolves to the ABI of the contract.
## resolveScheme

 Resolves the scheme of a given URI and returns the corresponding URL. If the URI starts with "ipfs://", it constructs a URL using the IPFS client ID and the IPFS gateway. If the URI starts with "http", it returns the URI as is. Otherwise, it throws an error indicating an invalid URI scheme.

### Example

`import { resolveScheme } from "thirdweb/storage";

const url = resolveScheme({

 client,

 uri: "ipfs://Qm...",

});

`

##### Signature

`function resolveScheme(options: [ResolveSchemeOptions](https://portal.thirdweb.com/references/typescript/v5/ResolveSchemeOptions)): string;

`

### Parameters

##### options

 The options object containing the URI and the IPFS client.

#### Type

`let options: { client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient); uri: string };

`

### Returns

##### Return Type

`let returnType: string;

`

 The resolved URL.
## resolveSignatures

 Resolves the signatures of the given hexadecimal signatures.

### Example

`import { resolveSignatures } from "thirdweb/utils";

const res = await resolveSignatures(["0x1f931c1c", "0x1f931c1c"]);

console.log(res);

`

##### Signature

`` function resolveSignatures(

hexSigs: Array<string>,

): Promise<{

events: Array<`event ${string}`>;

functions: Array<`function ${string}`>;

}>;

 ``

### Parameters

##### hexSigs

 An array of hexadecimal signatures.

#### Type

`let hexSigs: Array<string>;

`

### Returns

##### Return Type

`` let returnType: Promise<{

events: Array<`event ${string}`>;

functions: Array<`function ${string}`>;

}>;

 ``

 A promise that resolves to an object containing the resolved functions and events.
## encodeInstall

 Encodes the install data for the RoyaltyERC1155 module.

##### Signature

`` function encodeInstall(

params: EncodeBytesOnInstallParams,

): `0x${string}`;

 ``

### Parameters

##### params

 The parameters for the module.

#### Type

`let params: EncodeBytesOnInstallParams;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

* The encoded data.
## roleMap

 A map of all current thirdweb's smart contract roles

`let roleMap: {

readonly admin: "";

readonly asset: "ASSET_ROLE";

readonly factory: "FACTORY_ROLE";

readonly lister: "LISTER_ROLE";

readonly metadata: "METADATA_ROLE";

readonly migration: "MIGRATION_ROLE";

readonly minter: "MINTER_ROLE";

readonly pauser: "PAUSER_ROLE";

readonly revoke: "REVOKE_ROLE";

readonly signer: "SIGNER_ROLE";

readonly transfer: "TRANSFER_ROLE";

readonly unwrap: "UNWRAP_ROLE";

};

`

##### admin

`type admin = "";

`

##### asset

`type asset = "ASSET_ROLE";

`

##### factory

`type factory = "FACTORY_ROLE";

`

##### lister

`type lister = "LISTER_ROLE";

`

##### metadata

`type metadata = "METADATA_ROLE";

`

##### migration

`type migration = "MIGRATION_ROLE";

`

##### minter

`type minter = "MINTER_ROLE";

`

##### pauser

`type pauser = "PAUSER_ROLE";

`

##### revoke

`type revoke = "REVOKE_ROLE";

`

##### signer

`type signer = "SIGNER_ROLE";

`

##### transfer

`type transfer = "TRANSFER_ROLE";

`

##### unwrap

`type unwrap = "UNWRAP_ROLE";

`
## getDefaultRoyaltyInfo

 Calls the "getDefaultRoyaltyInfo" function on the contract.

### Example

`import { RoyaltyERC1155 } from "thirdweb/modules";

const result = await RoyaltyERC1155.getDefaultRoyaltyInfo({

 contract,

});

`

##### Signature

`function getDefaultRoyaltyInfo(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<readonly [string, number]>;

`

### Parameters

##### options

 The options for the getDefaultRoyaltyInfo function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<readonly [string, number]>;

`

 The parsed result of the function call.
## getRoyaltyInfoForToken

 Calls the "getRoyaltyInfoForToken" function on the contract.

### Example

`import { RoyaltyERC1155 } from "thirdweb/modules";

const result = await RoyaltyERC1155.getRoyaltyInfoForToken({

 contract,

 tokenId: ...,

});

`

##### Signature

`function getRoyaltyInfoForToken(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetRoyaltyInfoForTokenParams](https://portal.thirdweb.com/references/typescript/v5/GetRoyaltyInfoForTokenParams)>,

): Promise<readonly [string, number]>;

`

### Parameters

##### options

 The options for the getRoyaltyInfoForToken function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetRoyaltyInfoForTokenParams](https://portal.thirdweb.com/references/typescript/v5/GetRoyaltyInfoForTokenParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<readonly [string, number]>;

`

 The parsed result of the function call.
## getTransferValidator

 Calls the "getTransferValidator" function on the contract.

### Example

`import { RoyaltyERC1155 } from "thirdweb/modules";

const result = await RoyaltyERC1155.getTransferValidator({

 contract,

});

`

##### Signature

`function getTransferValidator(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<string>;

`

### Parameters

##### options

 The options for the getTransferValidator function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## getTransferValidationFunction

 Calls the "getTransferValidationFunction" function on the contract.

### Example

`import { RoyaltyERC1155 } from "thirdweb/modules";

const result = await RoyaltyERC1155.getTransferValidationFunction({

 contract,

});

`

##### Signature

`` function getTransferValidationFunction(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<readonly [`0x${string}`, boolean]>;

 ``

### Parameters

##### options

 The options for the getTransferValidationFunction function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`` let returnType: Promise<readonly [`0x${string}`, boolean]>;

 ``

 The parsed result of the function call.
## install

 Installs the RoyaltyERC1155 module on a core contract.

### Example

`import { RoyaltyERC1155 } from "thirdweb/modules";

const transaction = RoyaltyERC1155.install({

 contract: coreContract,

 account: account,

 params: {

 royaltyRecipient: ...,

 royaltyBps: ...,

 transferValidator: ...,

 },

});

await sendTransaction({

 transaction,

 account,

});

`

##### Signature

`function install(options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params: EncodeBytesOnInstallParams & { publisher?: string };

}): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

`

### Parameters

##### options

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params: EncodeBytesOnInstallParams & { publisher?: string };

};

`

### Returns

##### Return Type

`let returnType: Readonly<options> & {

__contract?: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi>;

__preparedMethod?: () => Promise<PreparedMethod<abiFn>>;

};

`

 the transaction to install the module
## royaltyInfo

 Calls the "royaltyInfo" function on the contract.

### Example

`import { RoyaltyERC1155 } from "thirdweb/modules";

const result = await RoyaltyERC1155.royaltyInfo({

 contract,

 tokenId: ...,

 salePrice: ...,

});

`

##### Signature

`function royaltyInfo(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[RoyaltyInfoParams](https://portal.thirdweb.com/references/typescript/v5/RoyaltyInfoParams)>,

): Promise<readonly [string, bigint]>;

`

### Parameters

##### options

 The options for the royaltyInfo function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[RoyaltyInfoParams](https://portal.thirdweb.com/references/typescript/v5/RoyaltyInfoParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<readonly [string, bigint]>;

`

 The parsed result of the function call.
## setDefaultRoyaltyInfo

 Prepares a transaction to call the "setDefaultRoyaltyInfo" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { RoyaltyERC1155 } from "thirdweb/modules";

const transaction = RoyaltyERC1155.setDefaultRoyaltyInfo({

 contract,

 royaltyRecipient: ...,

 royaltyBps: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setDefaultRoyaltyInfo(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetDefaultRoyaltyInfoParams](https://portal.thirdweb.com/references/typescript/v5/SetDefaultRoyaltyInfoParams)

| { asyncParams: () => Promise<[SetDefaultRoyaltyInfoParams](https://portal.thirdweb.com/references/typescript/v5/SetDefaultRoyaltyInfoParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setDefaultRoyaltyInfo" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetDefaultRoyaltyInfoParams](https://portal.thirdweb.com/references/typescript/v5/SetDefaultRoyaltyInfoParams)

| { asyncParams: () => Promise<[SetDefaultRoyaltyInfoParams](https://portal.thirdweb.com/references/typescript/v5/SetDefaultRoyaltyInfoParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## module

 Convenience function to add the RoyaltyERC1155 module as a default module on a core contract.

### Example

`import { RoyaltyERC1155, deployModularContract } from "thirdweb/modules";

const deployed = deployModularContract({

 client,

 chain,

 account,

 core: "ERC1155",

 params: {

 name: "My Modular Contract",

 },

 modules: [

 RoyaltyERC1155.module({

 royaltyRecipient: ...,

 royaltyBps: ...,

 transferValidator: ...,

 }),

 ],

});

`

##### Signature

`` function module(

params: EncodeBytesOnInstallParams & { publisher?: string },

): (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: `0x${string}`; module: `0x${string}` }>;

 ``

### Parameters

##### params

 The parameters for the module.

#### Type

`let params: EncodeBytesOnInstallParams & { publisher?: string };

`

### Returns

##### Return Type

`` let returnType: (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: `0x${string}`; module: `0x${string}` }>;

 ``

* The module function.
## setRoyaltyInfoForToken

 Prepares a transaction to call the "setRoyaltyInfoForToken" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { RoyaltyERC1155 } from "thirdweb/modules";

const transaction = RoyaltyERC1155.setRoyaltyInfoForToken({

 contract,

 tokenId: ...,

 recipient: ...,

 bps: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setRoyaltyInfoForToken(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetRoyaltyInfoForTokenParams](https://portal.thirdweb.com/references/typescript/v5/SetRoyaltyInfoForTokenParams)

| { asyncParams: () => Promise<[SetRoyaltyInfoForTokenParams](https://portal.thirdweb.com/references/typescript/v5/SetRoyaltyInfoForTokenParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setRoyaltyInfoForToken" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetRoyaltyInfoForTokenParams](https://portal.thirdweb.com/references/typescript/v5/SetRoyaltyInfoForTokenParams)

| { asyncParams: () => Promise<[SetRoyaltyInfoForTokenParams](https://portal.thirdweb.com/references/typescript/v5/SetRoyaltyInfoForTokenParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## setTransferValidator

 Prepares a transaction to call the "setTransferValidator" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { RoyaltyERC1155 } from "thirdweb/modules";

const transaction = RoyaltyERC1155.setTransferValidator({

 contract,

 validator: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setTransferValidator(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetTransferValidatorParams](https://portal.thirdweb.com/references/typescript/v5/SetTransferValidatorParams)

| { asyncParams: () => Promise<[SetTransferValidatorParams](https://portal.thirdweb.com/references/typescript/v5/SetTransferValidatorParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setTransferValidator" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetTransferValidatorParams](https://portal.thirdweb.com/references/typescript/v5/SetTransferValidatorParams)

| { asyncParams: () => Promise<[SetTransferValidatorParams](https://portal.thirdweb.com/references/typescript/v5/SetTransferValidatorParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## encodeInstall

 Encodes the install data for the RoyaltyERC721 module.

##### Signature

`` function encodeInstall(

params: EncodeBytesOnInstallParams,

): `0x${string}`;

 ``

### Parameters

##### params

 The parameters for the module.

#### Type

`let params: EncodeBytesOnInstallParams;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

* The encoded data.
## getDefaultRoyaltyInfo

 Calls the "getDefaultRoyaltyInfo" function on the contract.

### Example

`import { RoyaltyERC721 } from "thirdweb/modules";

const result = await RoyaltyERC721.getDefaultRoyaltyInfo({

 contract,

});

`

##### Signature

`function getDefaultRoyaltyInfo(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<readonly [string, number]>;

`

### Parameters

##### options

 The options for the getDefaultRoyaltyInfo function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<readonly [string, number]>;

`

 The parsed result of the function call.
## getRoyaltyInfoForToken

 Calls the "getRoyaltyInfoForToken" function on the contract.

### Example

`import { RoyaltyERC721 } from "thirdweb/modules";

const result = await RoyaltyERC721.getRoyaltyInfoForToken({

 contract,

 tokenId: ...,

});

`

##### Signature

`function getRoyaltyInfoForToken(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetRoyaltyInfoForTokenParams](https://portal.thirdweb.com/references/typescript/v5/GetRoyaltyInfoForTokenParams)>,

): Promise<readonly [string, number]>;

`

### Parameters

##### options

 The options for the getRoyaltyInfoForToken function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetRoyaltyInfoForTokenParams](https://portal.thirdweb.com/references/typescript/v5/GetRoyaltyInfoForTokenParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<readonly [string, number]>;

`

 The parsed result of the function call.
## getTransferValidationFunction

 Calls the "getTransferValidationFunction" function on the contract.

### Example

`import { RoyaltyERC721 } from "thirdweb/modules";

const result = await RoyaltyERC721.getTransferValidationFunction({

 contract,

});

`

##### Signature

`` function getTransferValidationFunction(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<readonly [`0x${string}`, boolean]>;

 ``

### Parameters

##### options

 The options for the getTransferValidationFunction function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`` let returnType: Promise<readonly [`0x${string}`, boolean]>;

 ``

 The parsed result of the function call.
## getTransferValidator

 Calls the "getTransferValidator" function on the contract.

### Example

`import { RoyaltyERC721 } from "thirdweb/modules";

const result = await RoyaltyERC721.getTransferValidator({

 contract,

});

`

##### Signature

`function getTransferValidator(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<string>;

`

### Parameters

##### options

 The options for the getTransferValidator function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## install

 Installs the RoyaltyERC721 module on a core contract.

### Example

`import { RoyaltyERC721 } from "thirdweb/modules";

const transaction = RoyaltyERC721.install({

 contract: coreContract,

 account: account,

 params: {

 royaltyRecipient: ...,

 royaltyBps: ...,

 transferValidator: ...,

 },

});

await sendTransaction({

 transaction,

 account,

});

`

##### Signature

`function install(options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params: EncodeBytesOnInstallParams & { publisher?: string };

}): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

`

### Parameters

##### options

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params: EncodeBytesOnInstallParams & { publisher?: string };

};

`

### Returns

##### Return Type

`let returnType: Readonly<options> & {

__contract?: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi>;

__preparedMethod?: () => Promise<PreparedMethod<abiFn>>;

};

`

 the transaction to install the module
## module

 Convenience function to add the RoyaltyERC721 module as a default module on a core contract.

### Example

`import { RoyaltyERC721, deployModularContract } from "thirdweb/modules";

const deployed = deployModularContract({

 client,

 chain,

 account,

 core: "ERC721",

 params: {

 name: "My Modular Contract",

 },

 modules: [

 RoyaltyERC721.module({

 royaltyRecipient: ...,

 royaltyBps: ...,

 transferValidator: ...,

 }),

 ],

});

`

##### Signature

`` function module(

params: EncodeBytesOnInstallParams & { publisher?: string },

): (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: `0x${string}`; module: `0x${string}` }>;

 ``

### Parameters

##### params

 The parameters for the module.

#### Type

`let params: EncodeBytesOnInstallParams & { publisher?: string };

`

### Returns

##### Return Type

`` let returnType: (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: `0x${string}`; module: `0x${string}` }>;

 ``

* The module function.
## setDefaultRoyaltyInfo

 Prepares a transaction to call the "setDefaultRoyaltyInfo" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { RoyaltyERC721 } from "thirdweb/modules";

const transaction = RoyaltyERC721.setDefaultRoyaltyInfo({

 contract,

 royaltyRecipient: ...,

 royaltyBps: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setDefaultRoyaltyInfo(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetDefaultRoyaltyInfoParams](https://portal.thirdweb.com/references/typescript/v5/SetDefaultRoyaltyInfoParams)

| { asyncParams: () => Promise<[SetDefaultRoyaltyInfoParams](https://portal.thirdweb.com/references/typescript/v5/SetDefaultRoyaltyInfoParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setDefaultRoyaltyInfo" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetDefaultRoyaltyInfoParams](https://portal.thirdweb.com/references/typescript/v5/SetDefaultRoyaltyInfoParams)

| { asyncParams: () => Promise<[SetDefaultRoyaltyInfoParams](https://portal.thirdweb.com/references/typescript/v5/SetDefaultRoyaltyInfoParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## royaltyInfo

 Calls the "royaltyInfo" function on the contract.

### Example

`import { RoyaltyERC721 } from "thirdweb/modules";

const result = await RoyaltyERC721.royaltyInfo({

 contract,

 tokenId: ...,

 salePrice: ...,

});

`

##### Signature

`function royaltyInfo(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[RoyaltyInfoParams](https://portal.thirdweb.com/references/typescript/v5/RoyaltyInfoParams)>,

): Promise<readonly [string, bigint]>;

`

### Parameters

##### options

 The options for the royaltyInfo function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[RoyaltyInfoParams](https://portal.thirdweb.com/references/typescript/v5/RoyaltyInfoParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<readonly [string, bigint]>;

`

 The parsed result of the function call.
## setTransferValidator

 Prepares a transaction to call the "setTransferValidator" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { RoyaltyERC721 } from "thirdweb/modules";

const transaction = RoyaltyERC721.setTransferValidator({

 contract,

 validator: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setTransferValidator(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetTransferValidatorParams](https://portal.thirdweb.com/references/typescript/v5/SetTransferValidatorParams)

| { asyncParams: () => Promise<[SetTransferValidatorParams](https://portal.thirdweb.com/references/typescript/v5/SetTransferValidatorParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setTransferValidator" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetTransferValidatorParams](https://portal.thirdweb.com/references/typescript/v5/SetTransferValidatorParams)

| { asyncParams: () => Promise<[SetTransferValidatorParams](https://portal.thirdweb.com/references/typescript/v5/SetTransferValidatorParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## setRoyaltyInfoForToken

 Prepares a transaction to call the "setRoyaltyInfoForToken" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { RoyaltyERC721 } from "thirdweb/modules";

const transaction = RoyaltyERC721.setRoyaltyInfoForToken({

 contract,

 tokenId: ...,

 recipient: ...,

 bps: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setRoyaltyInfoForToken(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetRoyaltyInfoForTokenParams](https://portal.thirdweb.com/references/typescript/v5/SetRoyaltyInfoForTokenParams)

| { asyncParams: () => Promise<[SetRoyaltyInfoForTokenParams](https://portal.thirdweb.com/references/typescript/v5/SetRoyaltyInfoForTokenParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setRoyaltyInfoForToken" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetRoyaltyInfoForTokenParams](https://portal.thirdweb.com/references/typescript/v5/SetRoyaltyInfoForTokenParams)

| { asyncParams: () => Promise<[SetRoyaltyInfoForTokenParams](https://portal.thirdweb.com/references/typescript/v5/SetRoyaltyInfoForTokenParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## sendAndConfirmTransaction

 Sends a transaction using the provided wallet.

### Example

####  Basic usage

`import { sendAndConfirmTransaction } from "thirdweb";

const transactionReceipt = await sendAndConfirmTransaction({

 account,

 transaction,

});

`

####  Gasless usage with [ thirdweb Engine](https://portal.thirdweb.com/engine)

`const transactionReceipt = await sendAndConfirmTransaction({

 account,

 transaction,

 gasless: {

 provider: "engine",

 relayerUrl:

"https://thirdweb.engine-***.thirdweb.com/relayer/***",

 relayerForwarderAddress: "0x...",

 },

});

`

####  Gasless usage with OpenZeppelin

`const transactionReceipt = await sendAndConfirmTransaction({

 account,

 transaction,

 gasless: {

 provider: "openzeppelin",

 relayerUrl: "https://...",

 relayerForwarderAddress: "0x...",

 },

});

`

##### Signature

`function sendAndConfirmTransaction(

options: [SendTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/SendTransactionOptions),

): Promise<[TransactionReceipt](https://portal.thirdweb.com/references/typescript/v5/TransactionReceipt)>;

`

### Parameters

##### options

 The options for sending the transaction.

#### Type

`let options: {

account: Account;

gasless: GaslessOptions;

transaction: PreparedTransaction<any>;

};

`

### Returns

##### Return Type

`let returnType: {

blobGasPrice?: quantity;

blobGasUsed?: quantity;

blockHash: Hash;

blockNumber: quantity;

contractAddress: Address | null | undefined;

cumulativeGasUsed: quantity;

effectiveGasPrice: quantity;

from: Address;

gasUsed: quantity;

logs: Array<Log<quantity, index, false>>;

logsBloom: Hex;

root?: Hash;

status: status;

to: Address | null;

transactionHash: Hash;

transactionIndex: index;

type: type;

};

`

 A promise that resolves to the confirmed transaction receipt.
## sendBatchTransaction

 Sends a batch transaction using the provided options.

### Example

`import { sendBatchTransaction } from "thirdweb";

const waitForReceiptOptions = await sendBatchTransaction({

 account,

 transactions,

});

`

##### Signature

`` function sendBatchTransaction(

options: [SendBatchTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/SendBatchTransactionOptions),

): Promise<{

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

maxBlocksWaitTime?: number;

readonly transactionHash: `0x${string}`;

}>;

 ``

### Parameters

##### options

 The options for sending the batch transaction.

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

transactions: Array<[PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)>;

};

`

### Returns

##### Return Type

`` let returnType: Promise<{

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

maxBlocksWaitTime?: number;

readonly transactionHash: `0x${string}`;

}>;

 ``

 A promise that resolves to the options for waiting for the receipt of the first transaction in the batch.
## sendTransaction

 Sends a transaction using the provided account.

 You can send a transaction with a [ prepared contract call](https://portal.thirdweb.com/references/typescript/v5/prepareContractCall) , a [ prepared transaction](https://portal.thirdweb.com/references/typescript/v5/prepareTransaction) , or using a write [ Extension](https://portal.thirdweb.com/typescript/v5/extensions/use) .

### Example

####  Using a prepared contract call

`import {

 sendTransaction,

 getContract,

 prepareContractCall,

} from "thirdweb";

import { sepolia } from "thirdweb/chains";

const contract = getContract({

 address: "0x...",

 chain: sepolia,

 client,

});

const transaction = prepareContractCall({

 contract,

 method: "function transfer(address to, uint256 value)",

 params: [to, value],

});

const { transactionHash } = await sendTransaction({

 account,

 transaction,

});

`

####  Using a write extension

`import { sendTransaction, getContract } from "thirdweb";

import { sepolia } from "thirdweb/chains";

import { mintTo } from "thirdweb/extensions/erc721";

const contract = getContract({

 address: "0x...",

 chain: sepolia,

 client,

});

const transaction = mintTo({

 contract,

 to: "0x...",

 nft: {

 name: "NFT Name",

 description: "NFT Description",

 image: "https://example.com/image.png",

 },

});

const { transactionHash } = await sendTransaction({

 account,

 transaction,

});

`

####  Using a prepared transaction

`import {

 sendTransaction,

 getContract,

 prepareTransaction,

} from "thirdweb";

import { sepolia } from "thirdweb/chains";

const contract = getContract({

 address: "0x...",

 chain: sepolia,

 client,

});

const transaction = prepareTransaction({

 contract,

 to: "0x...",

 value: toWei("0.1"),

});

const { transactionHash } = await sendTransaction({

 account,

 transaction,

});

`

####  Send an EIP-7702 Transaction

 _Note: This feature is in beta and is subject to breaking changes_

`import {

 sendTransaction,

 prepareTransaction,

 signAuthorization,

} from "thirdweb";

import { sepolia } from "thirdweb/chains";

const authorization = await signAuthorization({

 request: {

 address: "0x...",

 chainId: 1,

 nonce: 0n,

 },

 account: myAccount,

});

const transaction = prepareTransaction({

 chain: sepolia,

 client: client,

 to: "0x...",

 value: 0n,

 authorizationList: [authorization],

});

const { transactionHash } = await sendTransaction({

 account,

 transaction,

});

`

####  Gasless usage with [ thirdweb Engine](https://portal.thirdweb.com/engine)

`const { transactionHash } = await sendTransaction({

 account,

 transaction,

 gasless: {

 provider: "engine",

 relayerUrl:

"https://thirdweb.engine-***.thirdweb.com/relayer/***",

 relayerForwarderAddress: "0x...",

 },

});

`

####  Gasless usage with OpenZeppelin

`const { transactionHash } = await sendTransaction({

 account,

 transaction,

 gasless: {

 provider: "openzeppelin",

 relayerUrl: "https://...",

 relayerForwarderAddress: "0x...",

 },

});

`

##### Signature

`` function sendTransaction(

options: [SendTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/SendTransactionOptions),

): Promise<{

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

maxBlocksWaitTime?: number;

readonly transactionHash: `0x${string}`;

}>;

 ``

### Parameters

##### options

 The options for sending the transaction.

#### Type

`let options: {

account: Account;

gasless: GaslessOptions;

transaction: PreparedTransaction<any>;

};

`

### Returns

##### Return Type

`` let returnType: Promise<{

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

maxBlocksWaitTime?: number;

readonly transactionHash: `0x${string}`;

}>;

 ``

 A promise that resolves to the transaction result.
## resolveMethod

 Resolves and returns the ABI function with the specified method name. Throws an error if the function is not found in the ABI.

### Example

`import { resolveMethod, prepareContractCall } from "thirdweb";

const tx = prepareContractCall({

 contract,

// automatically resolves the necessary abi to encode the transaction

 method: resolveMethod("transfer"),

// however there is no type completion for params in this case (as the resolution is async and happens at runtime)

 params: [to, value],

});

`

##### Signature

`` function resolveMethod(

method: string,

): (

contract: Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<TAbi, `0x${string}`>>,

) => Promise<AbiFunction>;

 ``

### Parameters

##### method

 The name of the method to resolve.

#### Type

`let method: string;

`

### Returns

##### Return Type

`` let returnType: (

contract: Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<TAbi, `0x${string}`>>,

) => Promise<AbiFunction>;

 ``

 The resolved ABI function.
## resolveSignature

 Resolves a signature by converting a hexadecimal string into a function or event signature.

### Example

`import { resolveSignature } from "thirdweb/utils";

const res = await resolveSignature("0x1f931c1c");

console.log(res);

`

##### Signature

`` function resolveSignature(

hexSig: string,

): Promise<{

event: null | `event ${string}`;

function: null | `function ${string}`;

}>;

 ``

### Parameters

##### hexSig

 The hexadecimal signature to resolve.

#### Type

`let hexSig: string;

`

### Returns

##### Return Type

`` let returnType: Promise<{

event: null | `event ${string}`;

function: null | `function ${string}`;

}>;

 ``

 A promise that resolves to an object containing the function and event signatures.
## encodeInstall

 Encodes the install data for the SequentialTokenIdERC1155 module.

##### Signature

`` function encodeInstall(

params: EncodeBytesOnInstallParams,

): `0x${string}`;

 ``

### Parameters

##### params

 The parameters for the module.

#### Type

`let params: EncodeBytesOnInstallParams;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

* The encoded data.
## install

 Installs the SequentialTokenIdERC1155 module on a core contract.

### Example

`import { SequentialTokenIdERC1155 } from "thirdweb/modules";

const transaction = SequentialTokenIdERC1155.install({

 contract: coreContract,

 account: account,

 params: {

 startTokenId: ...,

 },

});

await sendTransaction({

 transaction,

 account,

});

`

##### Signature

`function install(options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params: EncodeBytesOnInstallParams & { publisher?: string };

}): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

`

### Parameters

##### options

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params: EncodeBytesOnInstallParams & { publisher?: string };

};

`

### Returns

##### Return Type

`let returnType: Readonly<options> & {

__contract?: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi>;

__preparedMethod?: () => Promise<PreparedMethod<abiFn>>;

};

`

 the transaction to install the module
## module

 Convenience function to add the SequentialTokenIdERC1155 module as a default module on a core contract.

### Example

`import { SequentialTokenIdERC1155, deployModularContract } from "thirdweb/modules";

const deployed = deployModularContract({

 client,

 chain,

 account,

 core: "ERC1155",

 params: {

 name: "My Modular Contract",

 },

 modules: [

 SequentialTokenIdERC1155.module({

 startTokenId: ...,

 }),

 ],

});

`

##### Signature

`` function module(

params: EncodeBytesOnInstallParams & { publisher?: string },

): (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: `0x${string}`; module: `0x${string}` }>;

 ``

### Parameters

##### params

 The parameters for the module.

#### Type

`let params: EncodeBytesOnInstallParams & { publisher?: string };

`

### Returns

##### Return Type

`` let returnType: (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: `0x${string}`; module: `0x${string}` }>;

 ``

* The module function.
## serializeErc6492Signature

### Example

`import { serializeErc6492Signature } from "thirdweb/auth";

const serializedSignature = serializeErc6492Signature({

 address: "0x...",

 data: "0x...",

 signature: "0x...",

});

// 0x000000000000000000000000cafebabecafebabecafebabecafebabecafebabe000000000000000000000000000000000000000000000000000000000000006000000000000000000000000000000000000000000000000000000000000000a00000000000000000000000000000000000000000000000000000000000000004deadbeef000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000041a461f509887bd19e312c0c58467ce8ff8e300d3c1a90b608a760c5b80318eaf15fe57c96f9175d6cd4daad4663763baa7e78836e067d0163e9a2ccf2ff753f5b1b000000000000000000000000000000000000000000000000000000000000006492649264926492649264926492649264926492649264926492649264926492

`

##### Signature

`` function serializeErc6492Signature(

__namedParameters: [Erc6492Signature](https://portal.thirdweb.com/references/typescript/v5/Erc6492Signature),

): `0x${string}`;

 ``

### Parameters

##### \_\_namedParameters

#### Type

`let __namedParameters: { address: string; data: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex); signature: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex) };

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

 The serialized signature
## serializeTransaction

 Serializes a legacy, EIP-1559, EIP-2930, EIP-4844, or EIP-7702 transaction object.

### Example

`import { serializeTransaction } from "thirdweb";

const serializedTransaction = serializeTransaction({

 transaction: {

 to: "0x",

 value: 0n,

 },

});

`

##### Signature

`` function serializeTransaction(

options: [SerializeTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/SerializeTransactionOptions),

): `0x${string}`;

 ``

### Parameters

##### options

 The serialization options.

#### Type

`let options: {

signature?:

| ox__Signature.Signature<true, [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex)>

| ox__Signature.Legacy<[Hex](https://portal.thirdweb.com/references/typescript/v5/Hex), bigint>;

transaction: SerializableTransaction;

};

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

 The serialized transaction.
## sha256

 Calculates the SHA256 hash of the given value.

### Example

`import { sha256 } from "thirdweb/utils";

const hash = sha256("0x1234");

`

##### Signature

`` function sha256(

value: `0x${string}` | Uint8Array<ArrayBufferLike>,

to?: TTo,

): Sha256Hash<TTo>;

 ``

### Parameters

##### value

 The value to hash. It can be either a hexadecimal string or a Uint8Array.

#### Type

`` let value: `0x${string}` | Uint8Array<ArrayBufferLike>;

 ``

##### to

optional

 (Optional) The desired output format of the hash. Defaults to 'hex'.

#### Type

`let to: TTo;

`

### Returns

##### Return Type

`let returnType: Sha256Hash<TTo>;

`

 The SHA256 hash of the value in the specified format.
## prepareTransaction

 Prepares a transaction with the given options.

### Example

`import { prepareTransaction, toWei } from "thirdweb";

import { ethereum } from "thirdweb/chains";

const transaction = prepareTransaction({

 to: "0x1234567890123456789012345678901234567890",

 chain: ethereum,

 client: thirdwebClient,

 value: toWei("1.0"),

 gasPrice: 30n,

});

`

##### Signature

`function prepareTransaction(

options: [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions),

info?: Additional<abi, abiFn>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<abi, abiFn, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for preparing the transaction.

#### Type

`let options: {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

} & PromisedObject<

Omit<StaticPrepareTransactionOptions, "chain" | "client">

>;

`

##### info

optional

 Additional information about the ABI function.

#### Type

`let info: Additional<abi, abiFn>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

abi,

abiFn,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 The prepared transaction.
## shortenAddress

 Checksums and formats an address if valid. Note this function does not check if the provided address is an ENS.

### Example

`import { shortenAddress } from "thirdweb/utils";

shortenAddress("0xa0cf798816d4b9b9866b5330eea46a18382f251e");

//=> '0xA0Cf...251e'

`

##### Signature

`function shortenAddress(address: string, length: number): string;

`

### Parameters

##### address

 The address to shorten.

#### Type

`let address: string;

`

##### length

 The number of characters to keep from the start and end of the address.

#### Type

`let length: number;

`

### Returns

##### Return Type

`let returnType: string;

`

 The shortened address.
## shortenHex

 Shortens a hexadecimal string without performing any validation or checksumming.

### Example

`import { shortenHex } from "thirdweb/utils";

shortenHex("0xa0cf798816d4b9b9866b5330eea46a18382f251e");

//=> '0xa0cf...251e'

`

##### Signature

`function shortenHex(hex: string, length: number): string;

`

### Parameters

##### hex

 The hexadecimal string to shorten.

#### Type

`let hex: string;

`

##### length

 The number of characters to keep from the start and end of the string.

#### Type

`let length: number;

`

### Returns

##### Return Type

`let returnType: string;

`

 The shortened hexadecimal string.
## shortenLargeNumber

 Shorten the string for large value Mainly used for Examples: 10\_000 -> 10k 1\_000\_000 -> 1M 1\_000\_000\_000 -> 1B

### Example

`import { shortenLargeNumber } from "thirdweb/utils";

const numStr = shortenLargeNumber(1_000_000_000);

`

##### Signature

`function shortenLargeNumber(value: number): string;

`

### Parameters

##### value

#### Type

`let value: number;

`

### Returns

##### Return Type

`let returnType: string;

`
## shouldUpdateSessionKey

 Checks if the session key should be updated.

##### Signature

`function shouldUpdateSessionKey(args: {

accountContract: Readonly;

newPermissions: AccountPermissions;

sessionKeyAddress: string;

}): Promise<boolean>;

`

### Parameters

##### args

#### Type

`let args: {

accountContract: Readonly;

newPermissions: AccountPermissions;

sessionKeyAddress: string;

};

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 A boolean indicating if the session key should be updated.
## sign

 Generates the signature for the provided transaction hash.

### Example

`import { sign } from "thirdweb/utils";

const signature = sign({

 hash: "0x",

 privateKey: "0x",

});

`

##### Signature

`` function sign(options: [SignOptions](https://portal.thirdweb.com/references/typescript/v5/SignOptions)): {

r: `0x${string}`;

s: `0x${string}`;

v: bigint;

yParity: number;

};

 ``

### Parameters

##### options

 The options for signing.

#### Type

`let options: { hash: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex); privateKey: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex) };

`

### Returns

##### Return Type

`` let returnType: {

r: `0x${string}`;

s: `0x${string}`;

v: bigint;

yParity: number;

};

 ``

 The transaction signature.
## signAuthorization

 Sign the given EIP-7702 authorization object.

##### Signature

`function signAuthorization(options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

request: [AuthorizationRequest](https://portal.thirdweb.com/references/typescript/v5/AuthorizationRequest);

}): Promise<{

address: string;

chainId: number;

nonce: bigint;

r: bigint;

s: bigint;

yParity: number;

}>;

`

### Parameters

##### options

 The options for `signAuthorization`Refer to the type [SignAuthorizationOptions](https://portal.thirdweb.com/references/typescript/v5/SignAuthorizationOptions)

#### Type

`let options: { account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account); request: [AuthorizationRequest](https://portal.thirdweb.com/references/typescript/v5/AuthorizationRequest) };

`

### Returns

##### Return Type

`let returnType: Promise<{

address: string;

chainId: number;

nonce: bigint;

r: bigint;

s: bigint;

yParity: number;

}>;

`

 The signed authorization object

`import { signAuthorization } from "thirdweb";

const authorization = await signAuthorization({

 request: {

 address: "0x...",

 chainId: 911867,

 nonce: 100n,

 },

 account: myAccount,

});

`
## signLoginPayload

 Signs the login payload using the provided account.

### Example

`import { signLoginPayload } from "thirdweb/auth";

const { signature, payload } = await signLoginPayload({

 payload: loginPayload,

 account: account,

});

`

##### Signature

`` function signLoginPayload(

options: [SignLoginPayloadParams](https://portal.thirdweb.com/references/typescript/v5/SignLoginPayloadParams),

): Promise<{ payload: [LoginPayload](https://portal.thirdweb.com/references/typescript/v5/LoginPayload); signature: `0x${string}` }>;

 ``

### Parameters

##### options

 The options for signing the login payload.

#### Type

`let options: { account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account); payload: [LoginPayload](https://portal.thirdweb.com/references/typescript/v5/LoginPayload) };

`

### Returns

##### Return Type

`let returnType: {

address: string;

chain_id?: string;

domain: string;

expiration_time: string;

invalid_before: string;

issued_at: string;

nonce: string;

resources?: Array<string>;

statement: string;

uri?: string;

version: string;

};

`

 An object containing the signature and the payload.
## signMessage

### Signature#1

 Signs a string message with a given private key.

#### Example

`import { signMessage } from "thirdweb/utils";

signMessage({

 message: "Hello, world!",

 privateKey: "0x...",

});

`

##### Signature

`` function signMessage(options: [SignMessageOptions](https://portal.thirdweb.com/references/typescript/v5/SignMessageOptions)): `0x${string}`;

 ``

#### Parameters

##### options

 The options for signing.

##### Type

`let options: { message: Message; privateKey: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex) };

`

#### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

 The signature as a hex string

### Signature#2

 Signs a string message with a given account.

#### Example

`import { signMessage } from "thirdweb/utils";

await signMessage({

 message: "Hello, world!",

 account,

});

`

##### Signature

`` function signMessage(options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

message: Message;

}): Promise<`0x${string}`>;

 ``

#### Parameters

##### options

 The options for signing.

##### Type

`let options: { account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account); message: Message };

`

#### Returns

##### Return Type

`` let returnType: Promise<`0x${string}`>;

 ``

 The signature as a hex string
## signTransaction

 Signs a transaction to be sent to a node.

### Example

`import { signTransaction } from "thirdweb";

signTransaction({

 transaction: {

...

 },

 privateKey: "0x...",

});

`

##### Signature

`` function signTransaction(

options: [SignTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/SignTransactionOptions),

): `0x${string}`;

 ``

### Parameters

##### options

 The options for signing.

#### Type

`let options: {

privateKey: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex);

transaction: SerializableTransaction;

};

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

 The signed transaction as a hex string
## signTypedData

 Signs a typed data object with a given private key according to EIP712.

### Example

`import { signTypedData } from "thirdweb/utils";

signTypedData({

 privateKey: "0x...",

...typedData,

});

`

##### Signature

`` function signTypedData(

options: [SignTypedDataOptions](https://portal.thirdweb.com/references/typescript/v5/SignTypedDataOptions)<typedData, primaryType>,

): `0x${string}`;

 ``

### Parameters

##### options

 The typed data is passed within options alongside the private key

#### Type

`let options: [SignTypedDataOptions](https://portal.thirdweb.com/references/typescript/v5/SignTypedDataOptions)<typedData, primaryType>;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

 The signature as a hex string
## signatureToHex

 Converts a signature to a hex string.

### Example

`import { signatureToHex } from "thirdweb/utils";

const hex = signatureToHex({

 r: toHex(

49782753348462494199823712700004552394425719014458918871452329774910450607807n,

 ),

 s: toHex(

33726695977844476214676913201140481102225469284307016937915595756355928419768n,

 ),

 v: 28n,

});

console.log(hex);

// "0x6e100a352ec6ad1b70802290e18aeed190704973570f3b8ed42cb9808e2ea6bf4a90a229a244495b41890987806fcbd2d5d23fc0dbe5f5256c2613c039d76db81c"

`

##### Signature

`` function signatureToHex(signature: {

r: `0x${string}`;

s: `0x${string}`;

v?: number | bigint | `0x${string}`;

yParity?: number | bigint | `0x${string}`;

}): `0x${string}`;

 ``

### Parameters

##### signature

 The signature to convert.

#### Type

`` let signature: {

r: `0x${string}`;

s: `0x${string}`;

v?: number | bigint | `0x${string}`;

yParity?: number | bigint | `0x${string}`;

};

 ``

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

 The hex string representation of the signature.
## signUserOp

 Sign a user operation.

### Example

`import { signUserOp } from "thirdweb/wallets/smart";

const userOp = await createUnsignedUserOp(...);

const signedUserOp = await signUserOp({

 client,

 userOp,

 chain,

 adminAccount,

});

`

##### Signature

`function signUserOp(args: {

adminAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

entrypointAddress?: string;

userOp: UserOperationV06 | UserOperationV07;

}): Promise<UserOperationV06 | UserOperationV07>;

`

### Parameters

##### args

#### Type

`let args: {

adminAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

entrypointAddress?: string;

userOp: UserOperationV06 | UserOperationV07;

};

`

### Returns

##### Return Type

`let returnType: Promise<UserOperationV06 | UserOperationV07>;

`

* The user operation with the signature field populated
## simulateTransaction

 Simulates the execution of a transaction.

### Example

`import { simulateTransaction } from "thirdweb";

const result = await simulateTransaction({

 transaction,

});

`

##### Signature

`function simulateTransaction(

options: [SimulateOptions](https://portal.thirdweb.com/references/typescript/v5/SimulateOptions)<abi, abiFn>,

): Promise<any>;

`

### Parameters

##### options

 The options for simulating the transaction.

#### Type

`let options: [SimulateOptions](https://portal.thirdweb.com/references/typescript/v5/SimulateOptions)<abi, abiFn>;

`

### Returns

##### Return Type

`let returnType: Promise<any>;

`

 A promise that resolves to the result of the simulation.
## smartWallet

 Creates a ERC4337 smart wallet based on a admin account.

 Smart wallets are smart contract wallets that enable multiple benefits for users:

* Sponsor gas fees for transactions
* Multiple owners
* Session keys
* Batch transactions
* Predictable addresses
* Programmable features

[ Learn more about account abstraction](https://portal.thirdweb.com/connect/account-abstraction/how-it-works)

### Example

###  Connect to a smart wallet

 To connect to a smart wallet, you need to provide an admin account as the `personalAccount` option.

 Any wallet can be used as an admin account, including an in-app wallets.

 The `sponsorGas` option is used to enable sponsored gas for transactions automatically.

`import { smartWallet, inAppWallet } from "thirdweb/wallets";

import { sepolia } from "thirdweb/chains";

import { sendTransaction } from "thirdweb";

const wallet = smartWallet({

 chain: sepolia,

 sponsorGas: true, // enable sponsored transactions

});

// any wallet can be used as an admin account

// in this example we use an in-app wallet

const adminWallet = inAppWallet();

const personalAccount = await adminWallet.connect({

 client,

 chain: sepolia,

 strategy: "google",

});

const smartAccount = await wallet.connect({

 client,

 personalAccount, // pass the admin account

});

// sending sponsored transactions with the smartAccount

await sendTransaction({

 account: smartAccount,

 transaction,

});

`

###  Using a custom account factory

 You can pass a custom account factory to the `smartWallet` function to use a your own account factory.

`import { smartWallet } from "thirdweb/wallets";

import { sepolia } from "thirdweb/chains";

const wallet = smartWallet({

 chain: sepolia,

 sponsorGas: true, // enable sponsored transactions

 factoryAddress: "0x...", // custom factory address

});

`

###  Using v0.7 Entrypoint

 Both v0.6 (default) and v0.7 ERC4337 Entrypoints are supported. To use the v0.7 Entrypoint, simply pass in a compatible account factory.

 You can use the predeployed `DEFAULT_ACCOUNT_FACTORY_V0_7` or deploy your own [ AccountFactory v0.7](https://thirdweb.com/thirdweb.eth/AccountFactory%5F0%5F7) .

`import {

 smartWallet,

 DEFAULT_ACCOUNT_FACTORY_V0_7,

} from "thirdweb/wallets/smart";

import { sepolia } from "thirdweb/chains";

const wallet = smartWallet({

 chain: sepolia,

 sponsorGas: true, // enable sponsored transactions

 factoryAddress: DEFAULT_ACCOUNT_FACTORY_V0_7, // 0.7 factory address

});

`

###  Configuring the smart wallet

 You can pass options to the `smartWallet` function to configure the smart wallet.

`import { smartWallet } from "thirdweb/wallets";

import { sepolia } from "thirdweb/chains";

const wallet = smartWallet({

 chain: sepolia,

 sponsorGas: true, // enable sponsored transactions

 factoryAddress: "0x...", // custom factory address

 overrides: {

 accountAddress: "0x...", // override account address

 accountSalt: "0x...", // override account salt

 entrypointAddress: "0x...", // override entrypoint address

 tokenPaymaster: TokenPaymaster.BASE_USDC, // enable erc20 paymaster

 bundlerUrl: "https://...", // override bundler url

paymaster: (userOp) => { ... }, // override paymaster

...

 }

});

`

 Refer to [ SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions) for more details.

##### Signature

`function smartWallet(

createOptions: [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions),

): [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)<"smart">;

`

### Parameters

##### createOptions

 The options for creating the wallet. Refer to [ SmartWalletCreationOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletCreationOptions) for more details.

#### Type

`let createOptions: Prettify<

 {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

factoryAddress?: string;

overrides?: {

accountAddress?: string;

accountSalt?: string;

bundlerUrl?: string;

createAccount?: (

factoryContract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract),

admin: string,

 ) => [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

entrypointAddress?: string;

execute?: (

accountContract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract),

transaction: SendTransactionOption,

 ) => [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

executeBatch?: (

accountContract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract),

transactions: Array<SendTransactionOption>,

 ) => [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

getAccountNonce?: (

accountContract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract),

 ) => Promise<bigint>;

paymaster?: (

userOp: UserOperationV06 | UserOperationV07,

 ) => Promise<[PaymasterResult](https://portal.thirdweb.com/references/typescript/v5/PaymasterResult)>;

predictAddress?: (

factoryContract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract),

admin: string,

 ) => Promise<string>;

signMessage?: (options: {

accountContract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

adminAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

factoryContract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

message: SignableMessage;

 }) => Promise<[Hex](https://portal.thirdweb.com/references/typescript/v5/Hex)>;

signTypedData?: (options: {

accountContract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

adminAccount: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

factoryContract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract);

typedData: ox__TypedData.Definition<typedData, primaryType>;

 }) => Promise<[Hex](https://portal.thirdweb.com/references/typescript/v5/Hex)>;

tokenPaymaster?: TokenPaymasterConfig;

 };

sessionKey?: { address: string; permissions: AccountPermissions };

 } & ({ gasless: boolean } | { sponsorGas: boolean })

>;

`

### Returns

##### Return Type

`let returnType: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)<"smart">;

`

 The created smart wallet.
## distributeByToken

 This extension is similar to the `distribute` extension, however it require you to specify the token (address) that you want to distribute

### Example

`import { distributeByToken } from "thirdweb/extensions/split";

const transaction = distributeByToken();

// Send the transaction

...

`

##### Signature

`function distributeByToken(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<{ tokenAddress: string }>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

 {

readonly inputs: readonly [

 { readonly name: "token"; readonly type: "address" },

 ];

readonly name: "distribute";

readonly outputs: readonly [];

readonly stateMutability: "nonpayable";

readonly type: "function";

 },

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

### Parameters

##### options

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<{ tokenAddress: string }>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

 {

readonly inputs: readonly [

 { readonly name: "token"; readonly type: "address" },

 ];

readonly name: "distribute";

readonly outputs: readonly [];

readonly stateMutability: "nonpayable";

readonly type: "function";

 },

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## distribute

 Prepares a transaction to call the "distribute" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { distribute } from "thirdweb/extensions/split";

const transaction = distribute();

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function distribute(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "distribute" function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## getAllRecipientsAddresses

 Get the addresses of all recipients of a [thirdweb Split contract](https://thirdweb.com/thirdweb.eth/Split)

### Example

`import { getAllRecipientsAddresses } from "thirdweb/extensions/split";

const addresses = await getAllRecipientsAddresses({ contract });

`

##### Signature

`function getAllRecipientsAddresses(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<Array<string>>;

`

### Parameters

##### options

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<Array<string>>;

`

 an array of wallet addresses
## getRecipientSplitPercentage

 Get the split percentage of a recipient

### Example

`import { getRecipientSplitPercentage } from "thirdweb/extensions/split";

const percentage = await getRecipientSplitPercentage({

 recipientAddress: "0x...",

});

`

##### Signature

`function getRecipientSplitPercentage(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<{ recipientAddress: string }>,

): Promise<[SplitRecipient](https://portal.thirdweb.com/references/typescript/v5/SplitRecipient)>;

`

### Parameters

##### options

 The options for the transaction

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<{ recipientAddress: string }>;

`

### Returns

##### Return Type

`let returnType: { address: string; splitPercentage: number };

`

 The split percentage of the recipient
## payee

 Calls the "payee" function on the contract.

### Example

`import { payee } from "thirdweb/extensions/split";

const result = await payee({

 contract,

 index: ...,

});

`

##### Signature

`function payee(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[PayeeParams](https://portal.thirdweb.com/references/typescript/v5/PayeeParams)>,

): Promise<string>;

`

### Parameters

##### options

 The options for the payee function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[PayeeParams](https://portal.thirdweb.com/references/typescript/v5/PayeeParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## getAllRecipientsPercentages

 Get all the recipients of a Split contracts

### Example

`import { getAllRecipientsPercentages } from "thirdweb/extensions/split";

const allRecipients = await getAllRecipientsPercentages({ contract });

// Example result:

[

 {

 address: "0x1...",

 splitPercentage: 25, // 25%

 },

 {

 address: "0x2...",

 splitPercentage: 75, // 75%

 },

];

`

##### Signature

`function getAllRecipientsPercentages(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<Array<[SplitRecipient](https://portal.thirdweb.com/references/typescript/v5/SplitRecipient)>>;

`

### Parameters

##### options

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: { address: string; splitPercentage: number };

`

 an array of recipients' addresses and split percentage of each
## releasable

 Calls the "releasable" function on the contract.

### Example

`import { releasable } from "thirdweb/extensions/split";

const result = await releasable({

 contract,

 account: ...,

});

`

##### Signature

`function releasable(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ReleasableParams](https://portal.thirdweb.com/references/typescript/v5/ReleasableParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the releasable function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ReleasableParams](https://portal.thirdweb.com/references/typescript/v5/ReleasableParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## payeeCount

 Calls the "payeeCount" function on the contract.

### Example

`import { payeeCount } from "thirdweb/extensions/split";

const result = await payeeCount({

 contract,

});

`

##### Signature

`function payeeCount(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)): Promise<bigint>;

`

### Parameters

##### options

 The options for the payeeCount function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## releasableByToken

 Calls the "releasable" function on the contract.

### Example

`import { releasableByToken } from "thirdweb/extensions/split";

const result = await releasableByToken({

 contract,

 account: ...,

});

`

##### Signature

`function releasableByToken(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ReleasableByTokenParams](https://portal.thirdweb.com/references/typescript/v5/ReleasableByTokenParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the releasable function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ReleasableByTokenParams](https://portal.thirdweb.com/references/typescript/v5/ReleasableByTokenParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## releaseByToken

 Similar to the `release` extension, however this one requires you to specify a tokenAddress to release

### Example

`import { releaseByToken } from "thirdweb/extensions/split";

const transaction = releaseByToken({

 contract,

 account: ...,

 overrides: {

...

 }

});

// Send the transaction

...

`

##### Signature

`function releaseByToken(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ReleaseByTokenParams](https://portal.thirdweb.com/references/typescript/v5/ReleaseByTokenParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

 {

readonly inputs: readonly [

 { readonly name: "token"; readonly type: "address" },

 { readonly name: "account"; readonly type: "address" },

 ];

readonly name: "release";

readonly outputs: readonly [];

readonly stateMutability: "nonpayable";

readonly type: "function";

 },

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

### Parameters

##### options

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ReleaseByTokenParams](https://portal.thirdweb.com/references/typescript/v5/ReleaseByTokenParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

 {

readonly inputs: readonly [

 { readonly name: "token"; readonly type: "address" },

 { readonly name: "account"; readonly type: "address" },

 ];

readonly name: "release";

readonly outputs: readonly [];

readonly stateMutability: "nonpayable";

readonly type: "function";

 },

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`
## release

 Prepares a transaction to call the "release" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { release } from "thirdweb/extensions/split";

const transaction = release({

 contract,

 account: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function release(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[ReleaseParams](https://portal.thirdweb.com/references/typescript/v5/ReleaseParams) | { asyncParams: () => Promise<[ReleaseParams](https://portal.thirdweb.com/references/typescript/v5/ReleaseParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "release" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[ReleaseParams](https://portal.thirdweb.com/references/typescript/v5/ReleaseParams) | { asyncParams: () => Promise<[ReleaseParams](https://portal.thirdweb.com/references/typescript/v5/ReleaseParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## released

 Calls the "released" function on the contract.

### Example

`import { released } from "thirdweb/extensions/split";

const result = await released({

 contract,

 account: ...,

});

`

##### Signature

`function released(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ReleasedParams](https://portal.thirdweb.com/references/typescript/v5/ReleasedParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the released function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ReleasedParams](https://portal.thirdweb.com/references/typescript/v5/ReleasedParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## releasedByToken

 Calls the "released" function on the contract. Similar to the `released` extension, however this one requires you to specify a tokenAddress

### Example

`import { releasedByToken } from "thirdweb/extensions/split";

const result = await releasedByToken({

 contract,

 account: "0x...",

 tokenAddress: "0x...",

});

`

##### Signature

`function releasedByToken(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[ReleasedParams](https://portal.thirdweb.com/references/typescript/v5/ReleasedParams) & { tokenAddress: string }

 >,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the released function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[ReleasedParams](https://portal.thirdweb.com/references/typescript/v5/ReleasedParams) & { tokenAddress: string }

>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## shares

 Calls the "shares" function on the contract.

### Example

`import { shares } from "thirdweb/extensions/split";

const result = await shares({

 contract,

 account: ...,

});

`

##### Signature

`function shares(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[SharesParams](https://portal.thirdweb.com/references/typescript/v5/SharesParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the shares function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[SharesParams](https://portal.thirdweb.com/references/typescript/v5/SharesParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## totalReleased

 Calls the "totalReleased" function on the contract.

### Example

`import { totalReleased } from "thirdweb/extensions/split";

const result = await totalReleased({

 contract,

});

`

##### Signature

`function totalReleased(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the totalReleased function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## stringToBytes

 Converts a string to an array of bytes.

### Example

`import { stringToBytes } from "thirdweb/utils";

const bytes = stringToBytes("Hello, world!");

console.log(bytes); // Uint8Array(13) [ 72, 101, 108, 108, 111, 44, 32, 119, 111, 114, 108, 100, 33 ]

`

##### Signature

`function stringToBytes(

value: string,

opts: [StringToBytesOpts](https://portal.thirdweb.com/references/typescript/v5/StringToBytesOpts),

): Uint8Array;

`

### Parameters

##### value

 The string to convert.

#### Type

`let value: string;

`

##### opts

 Optional parameters for the conversion.

#### Type

`let opts: { size?: number };

`

### Returns

##### Return Type

`let returnType: Uint8Array;

`

 The array of bytes representing the string.
## stringToHex

 Converts a string to its hexadecimal representation.

### Example

`import { stringToHex } from "thirdweb/utils";

const hex = stringToHex("Hello, world!");

console.log(hex); // "0x48656c6c6f2c20776f726c6421"

`

##### Signature

`` function stringToHex(value_: string, opts: Options): `0x${string}`;

 ``

### Parameters

##### value\_

 The string to convert to hexadecimal.

#### Type

`let value_: string;

`

##### opts

 Options for the conversion.

#### Type

`let opts: Options;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

 The hexadecimal representation of the input string.
## totalReleasedByToken

 Calls the "totalReleased" function on the contract. Similar to the `release` extension, however this one requires you to specify a tokenAddress

### Example

`import { totalReleasedByToken } from "thirdweb/extensions/split";

const result = await totalReleasedByToken({

 contract,

 tokenAddress: "0x...",

});

`

##### Signature

`function totalReleasedByToken(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<{ tokenAddress: string }>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the totalReleased function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<{ tokenAddress: string }>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## contractType

 Calls the "contractType" function on the contract.

### Example

`import { contractType } from "thirdweb/extensions/thirdweb";

const result = await contractType({

 contract,

});

`

##### Signature

`function contractType(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<string>;

`

### Parameters

##### options

 The options for the contractType function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## add

 Prepares a transaction to call the "add" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { add } from "thirdweb/extensions/thirdweb";

const transaction = add({

 contract,

 deployer: ...,

 deployment: ...,

 chainId: ...,

 metadataUri: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function add(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[AddParams](https://portal.thirdweb.com/references/typescript/v5/AddParams) | { asyncParams: () => Promise<[AddParams](https://portal.thirdweb.com/references/typescript/v5/AddParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "add" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[AddParams](https://portal.thirdweb.com/references/typescript/v5/AddParams) | { asyncParams: () => Promise<[AddParams](https://portal.thirdweb.com/references/typescript/v5/AddParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## stringify

 Stringify a JSON object and convert all bigint values to string

 If you are getting this error: "Exception: Do not know how to serialize a BigInt", you probably can use this function to parse the data. Because bigint is not an accepted value of the JSON format.

### Example

`import { stringify } from "thirdweb/utils";

const obj = { tokenId: 0n };

const str = stringify(obj); // "{"tokenId":"0"}"

`

##### Signature

`function stringify(

value: any,

replacer?: null | ((this: any, key: string, value: any) => any),

space?: string | number,

): string;

`

### Parameters

##### value

#### Type

`let value: any;

`

##### replacer

optional

#### Type

`let replacer: null | ((this: any, key: string, value: any) => any);

`

##### space

optional

#### Type

`let space: string | number;

`

### Returns

##### Return Type

`let returnType: string;

`

 An object with all bigint values converted to string
## deployProxyByImplementation

 Prepares a transaction to call the "deployProxyByImplementation" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { deployProxyByImplementation } from "thirdweb/extensions/thirdweb";

const transaction = deployProxyByImplementation({

 contract,

 implementation: ...,

 data: ...,

 salt: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function deployProxyByImplementation(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [DeployProxyByImplementationParams](https://portal.thirdweb.com/references/typescript/v5/DeployProxyByImplementationParams)

| {

asyncParams: () => Promise<[DeployProxyByImplementationParams](https://portal.thirdweb.com/references/typescript/v5/DeployProxyByImplementationParams)>;

 }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "deployProxyByImplementation" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [DeployProxyByImplementationParams](https://portal.thirdweb.com/references/typescript/v5/DeployProxyByImplementationParams)

| { asyncParams: () => Promise<[DeployProxyByImplementationParams](https://portal.thirdweb.com/references/typescript/v5/DeployProxyByImplementationParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## count

 Calls the "count" function on the contract.

### Example

`import { count } from "thirdweb/extensions/thirdweb";

const result = await count({

 contract,

 deployer: ...,

});

`

##### Signature

`function count(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[CountParams](https://portal.thirdweb.com/references/typescript/v5/CountParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the count function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[CountParams](https://portal.thirdweb.com/references/typescript/v5/CountParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## getAll

 Calls the "getAll" function on the contract.

### Example

`import { getAll } from "thirdweb/extensions/thirdweb";

const result = await getAll({

 contract,

 deployer: ...,

});

`

##### Signature

`function getAll(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetAllParams](https://portal.thirdweb.com/references/typescript/v5/GetAllParams)>) : Promise<readonly Array<{ chainId: bigint; deploymentAddress: string; metadataURI: string }>>

`

### Parameters

##### options

 The options for the getAll function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetAllParams](https://portal.thirdweb.com/references/typescript/v5/GetAllParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<readonly Array<{ chainId: bigint; deploymentAddress: string; metadataURI: string }>>

`

 The parsed result of the function call.
## getPublishedContractVersions

 Calls the "getPublishedContractVersions" function on the contract.

### Example

`import { getPublishedContractVersions } from "thirdweb/extensions/thirdweb";

const result = await getPublishedContractVersions({

 contract,

 publisher: ...,

 contractId: ...,

});

`

##### Signature

`` function getPublishedContractVersions(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetPublishedContractVersionsParams](https://portal.thirdweb.com/references/typescript/v5/GetPublishedContractVersionsParams)>) : Promise<readonly Array<{ bytecodeHash: `0x${string}`; contractId: string; implementation: string; publishMetadataUri: string; publishTimestamp: bigint }>>

 ``

### Parameters

##### options

 The options for the getPublishedContractVersions function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetPublishedContractVersionsParams](https://portal.thirdweb.com/references/typescript/v5/GetPublishedContractVersionsParams)>;

`

### Returns

##### Return Type

`` let returnType: Promise<readonly Array<{ bytecodeHash: `0x${string}`; contractId: string; implementation: string; publishMetadataUri: string; publishTimestamp: bigint }>>

 ``

 The parsed result of the function call.
## getAllPublishedContracts

 Calls the "getAllPublishedContracts" function on the contract.

### Example

`import { getAllPublishedContracts } from "thirdweb/extensions/thirdweb";

const result = await getAllPublishedContracts({

 contract,

 publisher: ...,

});

`

##### Signature

`` function getAllPublishedContracts(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetAllPublishedContractsParams](https://portal.thirdweb.com/references/typescript/v5/GetAllPublishedContractsParams)>) : Promise<readonly Array<{ bytecodeHash: `0x${string}`; contractId: string; implementation: string; publishMetadataUri: string; publishTimestamp: bigint }>>

 ``

### Parameters

##### options

 The options for the getAllPublishedContracts function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetAllPublishedContractsParams](https://portal.thirdweb.com/references/typescript/v5/GetAllPublishedContractsParams)>;

`

### Returns

##### Return Type

`` let returnType: Promise<readonly Array<{ bytecodeHash: `0x${string}`; contractId: string; implementation: string; publishMetadataUri: string; publishTimestamp: bigint }>>

 ``

 The parsed result of the function call.
## getPublishedContract

 Calls the "getPublishedContract" function on the contract.

### Example

`import { getPublishedContract } from "thirdweb/extensions/thirdweb";

const result = await getPublishedContract({

 contract,

 publisher: ...,

 contractId: ...,

});

`

##### Signature

`` function getPublishedContract(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetPublishedContractParams](https://portal.thirdweb.com/references/typescript/v5/GetPublishedContractParams)>,

): Promise<{

bytecodeHash: `0x${string}`;

contractId: string;

implementation: string;

publishMetadataUri: string;

publishTimestamp: bigint;

}>;

 ``

### Parameters

##### options

 The options for the getPublishedContract function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetPublishedContractParams](https://portal.thirdweb.com/references/typescript/v5/GetPublishedContractParams)>;

`

### Returns

##### Return Type

`` let returnType: Promise<{

bytecodeHash: `0x${string}`;

contractId: string;

implementation: string;

publishMetadataUri: string;

publishTimestamp: bigint;

}>;

 ``

 The parsed result of the function call.
## getPublishedUriFromCompilerUri

 Calls the "getPublishedUriFromCompilerUri" function on the contract.

### Example

`import { getPublishedUriFromCompilerUri } from "thirdweb/extensions/thirdweb";

const result = await getPublishedUriFromCompilerUri({

 contract,

 compilerMetadataUri: ...,

});

`

##### Signature

`function getPublishedUriFromCompilerUri(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetPublishedUriFromCompilerUriParams](https://portal.thirdweb.com/references/typescript/v5/GetPublishedUriFromCompilerUriParams)>) : Promise<readonly Array<string>>

`

### Parameters

##### options

 The options for the getPublishedUriFromCompilerUri function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetPublishedUriFromCompilerUriParams](https://portal.thirdweb.com/references/typescript/v5/GetPublishedUriFromCompilerUriParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<readonly Array<string>>

`

 The parsed result of the function call.
## getPublisherProfileUri

 Calls the "getPublisherProfileUri" function on the contract.

### Example

`import { getPublisherProfileUri } from "thirdweb/extensions/thirdweb";

const result = await getPublisherProfileUri({

 contract,

 publisher: ...,

});

`

##### Signature

`function getPublisherProfileUri(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetPublisherProfileUriParams](https://portal.thirdweb.com/references/typescript/v5/GetPublisherProfileUriParams)>,

): Promise<string>;

`

### Parameters

##### options

 The options for the getPublisherProfileUri function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetPublisherProfileUriParams](https://portal.thirdweb.com/references/typescript/v5/GetPublisherProfileUriParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## publishContract

 Publish a contract to the contract publisher.

### Example

`const tx = publishContract({

 contract,

 account,

 metadata,

});

`

##### Signature

`function publishContract(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[PublishContractParams](https://portal.thirdweb.com/references/typescript/v5/PublishContractParams)>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for publishing the contract.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[PublishContractParams](https://portal.thirdweb.com/references/typescript/v5/PublishContractParams)>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 The transaction to publish the contract.
## remove

 Prepares a transaction to call the "remove" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { remove } from "thirdweb/extensions/thirdweb";

const transaction = remove({

 contract,

 deployer: ...,

 deployment: ...,

 chainId: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function remove(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[RemoveParams](https://portal.thirdweb.com/references/typescript/v5/RemoveParams) | { asyncParams: () => Promise<[RemoveParams](https://portal.thirdweb.com/references/typescript/v5/RemoveParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "remove" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[RemoveParams](https://portal.thirdweb.com/references/typescript/v5/RemoveParams) | { asyncParams: () => Promise<[RemoveParams](https://portal.thirdweb.com/references/typescript/v5/RemoveParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## setPublisherProfileUri

 Prepares a transaction to call the "setPublisherProfileUri" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { setPublisherProfileUri } from "thirdweb/extensions/thirdweb";

const transaction = setPublisherProfileUri({

 contract,

 publisher: ...,

 uri: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setPublisherProfileUri(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetPublisherProfileUriParams](https://portal.thirdweb.com/references/typescript/v5/SetPublisherProfileUriParams)

| { asyncParams: () => Promise<[SetPublisherProfileUriParams](https://portal.thirdweb.com/references/typescript/v5/SetPublisherProfileUriParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setPublisherProfileUri" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetPublisherProfileUriParams](https://portal.thirdweb.com/references/typescript/v5/SetPublisherProfileUriParams)

| { asyncParams: () => Promise<[SetPublisherProfileUriParams](https://portal.thirdweb.com/references/typescript/v5/SetPublisherProfileUriParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## isContractTypeSupported

 Checks if the `contractType` method is supported by the given contract.

### Example

`import { isContractTypeSupported } from "thirdweb/extensions/thirdweb";

const supported = isContractTypeSupported(["0x..."]);

`

##### Signature

`function isContractTypeSupported(

availableSelectors: Array<string>,

): boolean;

`

### Parameters

##### availableSelectors

 An array of 4byte function selectors of the contract. You can get this in various ways, such as using "whatsabi" or if you have the ABI of the contract available you can use it to generate the selectors.

#### Type

`let availableSelectors: Array<string>;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the `contractType` method is supported.
## unpublishContract

 Prepares a transaction to call the "unpublishContract" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { unpublishContract } from "thirdweb/extensions/thirdweb";

const transaction = unpublishContract({

 contract,

 publisher: ...,

 contractId: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function unpublishContract(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [UnpublishContractParams](https://portal.thirdweb.com/references/typescript/v5/UnpublishContractParams)

| { asyncParams: () => Promise<[UnpublishContractParams](https://portal.thirdweb.com/references/typescript/v5/UnpublishContractParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "unpublishContract" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [UnpublishContractParams](https://portal.thirdweb.com/references/typescript/v5/UnpublishContractParams)

| { asyncParams: () => Promise<[UnpublishContractParams](https://portal.thirdweb.com/references/typescript/v5/UnpublishContractParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## toBytes

 Converts a value to an array of bytes.

### Example

`import { toBytes } from "thirdweb/utils";

const bytes = toBytes("0x1a4");

console.log(bytes); // Uint8Array(2) [ 1, 164 ]

`

##### Signature

`function toBytes(

value: string | number | bigint | boolean,

opts: [ToBytesParameters](https://portal.thirdweb.com/references/typescript/v5/ToBytesParameters),

): Uint8Array;

`

### Parameters

##### value

 The value to convert.

#### Type

`let value: string | number | bigint | boolean;

`

##### opts

 Optional parameters for the conversion.

#### Type

`let opts: { size?: number };

`

### Returns

##### Return Type

`let returnType: Uint8Array;

`

 The array of bytes representing the value.
## toEther

 Converts a value from wei to ether.

### Example

`import { toEther } from "thirdweb/utils";

toEther(1000000000000000000n);

// '1'

`

##### Signature

`function toEther(wei: bigint): string;

`

### Parameters

##### wei

 The value in wei to be converted.

#### Type

`let wei: bigint;

`

### Returns

##### Return Type

`let returnType: string;

`

 The converted value in ether.
## toEventSelector

 Returns the hash (of the function/event signature) for a given event or function definition.

##### Signature

`` function toEventSelector(

fn: string | AbiEvent | AbiFunction,

): `0x${string}`;

 ``

### Parameters

##### fn

#### Type

`let fn: string | AbiEvent | AbiFunction;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``
## toFunctionSelector

##### Signature

`` function toFunctionSelector(fn: string | AbiFunction): `0x${string}`;

 ``

### Parameters

##### fn

#### Type

`let fn: string | AbiFunction;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``
## toHex

 Converts a value to its hexadecimal representation.

### Example

`import { toHex } from "thirdweb/utils";

const hex = toHex(420);

console.log(hex); // "0x1a4"

`

##### Signature

`` function toHex(

value:

| string

| number

| bigint

| boolean

| Uint8Array<ArrayBufferLike>,

opts: [ToHexParameters](https://portal.thirdweb.com/references/typescript/v5/ToHexParameters),

): `0x${string}`;

 ``

### Parameters

##### value

 The value to convert to hexadecimal.

#### Type

`let value:

| string

| number

| bigint

| boolean

| Uint8Array<ArrayBufferLike>;

`

##### opts

 Optional parameters for the conversion.

#### Type

`let opts: { size?: number };

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

 The hexadecimal representation of the value.
## toSerializableTransaction

 Converts a prepared transaction to a transaction with populated options.

### Example

`import {

 prepareTransaction,

 toSerializableTransaction,

} from "thirdweb";

const transaction = await prepareTransaction({

 transaction: {

 to: "0x...",

 value: 100,

 },

});

const finalTx = await toSerializableTransaction({

 transaction,

});

account.sendTransaction(finalTx);

`

##### Signature

`` function toSerializableTransaction(

options: [ToSerializableTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/ToSerializableTransactionOptions),

): Promise<

| {

accessList: undefined | AccessList;

authorizationList:

| undefined

| Array<{

address: string;

chainId: number;

nonce: bigint;

r: bigint;

s: bigint;

yParity: number;

 }>;

chainId: number;

data: `0x${string}`;

gas: bigint;

gasPrice?: undefined;

maxFeePerGas?: bigint;

maxPriorityFeePerGas?: bigint;

nonce: undefined | number;

to: undefined | string;

type: undefined | TransactionType;

value: undefined | bigint;

 }

| {

accessList: undefined | AccessList;

authorizationList:

| undefined

| Array<{

address: string;

chainId: number;

nonce: bigint;

r: bigint;

s: bigint;

yParity: number;

 }>;

chainId: number;

data: `0x${string}`;

gas: bigint;

gasPrice?: bigint;

maxFeePerGas?: undefined;

maxPriorityFeePerGas?: undefined;

nonce: undefined | number;

to: undefined | string;

type: undefined | TransactionType;

value: undefined | bigint;

 }

>;

 ``

### Parameters

##### options

 The transaction and additional options for conversion

#### Type

`let options: {

from?: string | [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

transaction: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any>;

};

`

### Returns

##### Return Type

`` let returnType: Promise<

| {

accessList: undefined | AccessList;

authorizationList:

| undefined

| Array<{

address: string;

chainId: number;

nonce: bigint;

r: bigint;

s: bigint;

yParity: number;

 }>;

chainId: number;

data: `0x${string}`;

gas: bigint;

gasPrice?: undefined;

maxFeePerGas?: bigint;

maxPriorityFeePerGas?: bigint;

nonce: undefined | number;

to: undefined | string;

type: undefined | TransactionType;

value: undefined | bigint;

 }

| {

accessList: undefined | AccessList;

authorizationList:

| undefined

| Array<{

address: string;

chainId: number;

nonce: bigint;

r: bigint;

s: bigint;

yParity: number;

 }>;

chainId: number;

data: `0x${string}`;

gas: bigint;

gasPrice?: bigint;

maxFeePerGas?: undefined;

maxPriorityFeePerGas?: undefined;

nonce: undefined | number;

to: undefined | string;

type: undefined | TransactionType;

value: undefined | bigint;

 }

>;

 ``

 A serializable transaction for inspection or submission to an account.

 For easier transaction sending, sendTransaction
## toTokens

 Converts a given number of units to a string representation with a specified number of decimal places.

### Example

`import { toTokens } from "thirdweb/utils";

toTokens(1000000000000000000n, 18);

// '1'

`

##### Signature

`function toTokens(units: bigint, decimals: number): string;

`

### Parameters

##### units

 The number of units to convert.

#### Type

`let units: bigint;

`

##### decimals

 The number of decimal places to include in the string representation.

#### Type

`let decimals: number;

`

### Returns

##### Return Type

`let returnType: string;

`

 The string representation of the converted units.
## toUnits

 Converts a string representation of a number with decimal places to a BigInt representation.

### Example

`import { toUnits } from "thirdweb/utils";

toUnits("1", 18);

// 1000000000000000000n

`

##### Signature

`function toUnits(tokens: string, decimals: number): bigint;

`

### Parameters

##### tokens

 The string representation of the number, including the integer and fraction parts.

#### Type

`let tokens: string;

`

##### decimals

 The number of decimal places to include in the BigInt representation.

#### Type

`let decimals: number;

`

### Returns

##### Return Type

`let returnType: bigint;

`

 The BigInt representation of the number.
## toWei

 Converts the specified number of tokens to Wei.

### Example

`import { toWei } from "thirdweb/utils";

toWei("1");

// 1000000000000000000n

`

##### Signature

`function toWei(tokens: string): bigint;

`

### Parameters

##### tokens

 The number of tokens to convert.

#### Type

`let tokens: string;

`

### Returns

##### Return Type

`let returnType: bigint;

`

 The converted value in Wei.
## encodeInstall

 Encodes the install data for the TransferableERC1155 module.

##### Signature

`function encodeInstall(): string;

`

### Returns

##### Return Type

`let returnType: string;

`

* The encoded data.
## isTransferEnabled

 Calls the "isTransferEnabled" function on the contract.

### Example

`import { TransferableERC1155 } from "thirdweb/modules";

const result = await TransferableERC1155.isTransferEnabled({

 contract,

});

`

##### Signature

`function isTransferEnabled(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<boolean>;

`

### Parameters

##### options

 The options for the isTransferEnabled function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 The parsed result of the function call.
## install

 Installs the TransferableERC1155 module on a core contract.

### Example

`import { TransferableERC1155 } from "thirdweb/modules";

const transaction = TransferableERC1155.install({

 contract: coreContract,

 account: account,

});

await sendTransaction({

 transaction,

 account,

});

`

##### Signature

`function install(options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params?: { publisher?: string };

}): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

`

### Parameters

##### options

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params?: { publisher?: string };

};

`

### Returns

##### Return Type

`let returnType: Readonly<options> & {

__contract?: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi>;

__preparedMethod?: () => Promise<PreparedMethod<abiFn>>;

};

`

 the transaction to install the module
## module

 Convenience function to add the TransferableERC1155 module as a default module on a core contract.

### Example

`import {

 TransferableERC1155,

 deployModularContract,

} from "thirdweb/modules";

const deployed = deployModularContract({

 client,

 chain,

 account,

 core: "ERC1155",

 params: {

 name: "My Modular Contract",

 },

 modules: [TransferableERC1155.module()],

});

`

##### Signature

`` function module(params?: {

publisher?: string;

}): (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: "0x"; module: `0x${string}` }>;

 ``

### Parameters

##### params

optional

 The parameters for the module.

#### Type

`let params: { publisher?: string };

`

### Returns

##### Return Type

`` let returnType: (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: "0x"; module: `0x${string}` }>;

 ``

* The module function.
## isTransferEnabledFor

 Calls the "isTransferEnabledFor" function on the contract.

### Example

`import { TransferableERC1155 } from "thirdweb/modules";

const result = await TransferableERC1155.isTransferEnabledFor({

 contract,

 target: ...,

});

`

##### Signature

`function isTransferEnabledFor(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsTransferEnabledForParams](https://portal.thirdweb.com/references/typescript/v5/IsTransferEnabledForParams)>,

): Promise<boolean>;

`

### Parameters

##### options

 The options for the isTransferEnabledFor function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsTransferEnabledForParams](https://portal.thirdweb.com/references/typescript/v5/IsTransferEnabledForParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 The parsed result of the function call.
## getMetadataUri

 Calls the "getMetadataUri" function on the contract.

### Example

`import { getMetadataUri } from "thirdweb/extensions/thirdweb";

const result = await getMetadataUri({

 contract,

 chainId: ...,

 deployment: ...,

});

`

##### Signature

`function getMetadataUri(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetMetadataUriParams](https://portal.thirdweb.com/references/typescript/v5/GetMetadataUriParams)>,

): Promise<string>;

`

### Parameters

##### options

 The options for the getMetadataUri function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetMetadataUriParams](https://portal.thirdweb.com/references/typescript/v5/GetMetadataUriParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## setTransferable

 Prepares a transaction to call the "setTransferable" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { TransferableERC1155 } from "thirdweb/modules";

const transaction = TransferableERC1155.setTransferable({

 contract,

 enableTransfer: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setTransferable(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| SetTransferableParams

| { asyncParams: () => Promise<SetTransferableParams> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setTransferable" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| SetTransferableParams

| { asyncParams: () => Promise<SetTransferableParams> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## encodeInstall

 Encodes the install data for the TransferableERC20 module.

##### Signature

`function encodeInstall(): string;

`

### Returns

##### Return Type

`let returnType: string;

`

* The encoded data.
## setTransferableFor

 Prepares a transaction to call the "setTransferableFor" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { TransferableERC1155 } from "thirdweb/modules";

const transaction = TransferableERC1155.setTransferableFor({

 contract,

 target: ...,

 enableTransfer: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setTransferableFor(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetTransferableForParams](https://portal.thirdweb.com/references/typescript/v5/SetTransferableForParams)

| { asyncParams: () => Promise<[SetTransferableForParams](https://portal.thirdweb.com/references/typescript/v5/SetTransferableForParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setTransferableFor" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetTransferableForParams](https://portal.thirdweb.com/references/typescript/v5/SetTransferableForParams)

| { asyncParams: () => Promise<[SetTransferableForParams](https://portal.thirdweb.com/references/typescript/v5/SetTransferableForParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## install

 Installs the TransferableERC20 module on a core contract.

### Example

`import { TransferableERC20 } from "thirdweb/modules";

const transaction = TransferableERC20.install({

 contract: coreContract,

 account: account,

});

await sendTransaction({

 transaction,

 account,

});

`

##### Signature

`function install(options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params?: { publisher?: string };

}): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

`

### Parameters

##### options

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params?: { publisher?: string };

};

`

### Returns

##### Return Type

`let returnType: Readonly<options> & {

__contract?: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi>;

__preparedMethod?: () => Promise<PreparedMethod<abiFn>>;

};

`

 the transaction to install the module
## isTransferEnabled

 Calls the "isTransferEnabled" function on the contract.

### Example

`import { TransferableERC20 } from "thirdweb/modules";

const result = await TransferableERC20.isTransferEnabled({

 contract,

});

`

##### Signature

`function isTransferEnabled(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<boolean>;

`

### Parameters

##### options

 The options for the isTransferEnabled function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 The parsed result of the function call.
## isTransferEnabledFor

 Calls the "isTransferEnabledFor" function on the contract.

### Example

`import { TransferableERC20 } from "thirdweb/modules";

const result = await TransferableERC20.isTransferEnabledFor({

 contract,

 target: ...,

});

`

##### Signature

`function isTransferEnabledFor(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsTransferEnabledForParams](https://portal.thirdweb.com/references/typescript/v5/IsTransferEnabledForParams)>,

): Promise<boolean>;

`

### Parameters

##### options

 The options for the isTransferEnabledFor function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsTransferEnabledForParams](https://portal.thirdweb.com/references/typescript/v5/IsTransferEnabledForParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 The parsed result of the function call.
## module

 Convenience function to add the TransferableERC20 module as a default module on a core contract.

### Example

`import {

 TransferableERC20,

 deployModularContract,

} from "thirdweb/modules";

const deployed = deployModularContract({

 client,

 chain,

 account,

 core: "ERC20",

 params: {

 name: "My Modular Contract",

 },

 modules: [TransferableERC20.module()],

});

`

##### Signature

`` function module(params?: {

publisher?: string;

}): (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: "0x"; module: `0x${string}` }>;

 ``

### Parameters

##### params

optional

 The parameters for the module.

#### Type

`let params: { publisher?: string };

`

### Returns

##### Return Type

`` let returnType: (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: "0x"; module: `0x${string}` }>;

 ``

* The module function.
## setTransferable

 Prepares a transaction to call the "setTransferable" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { TransferableERC20 } from "thirdweb/modules";

const transaction = TransferableERC20.setTransferable({

 contract,

 enableTransfer: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setTransferable(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| SetTransferableParams

| { asyncParams: () => Promise<SetTransferableParams> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setTransferable" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| SetTransferableParams

| { asyncParams: () => Promise<SetTransferableParams> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## setTransferableFor

 Prepares a transaction to call the "setTransferableFor" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { TransferableERC20 } from "thirdweb/modules";

const transaction = TransferableERC20.setTransferableFor({

 contract,

 target: ...,

 enableTransfer: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setTransferableFor(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetTransferableForParams](https://portal.thirdweb.com/references/typescript/v5/SetTransferableForParams)

| { asyncParams: () => Promise<[SetTransferableForParams](https://portal.thirdweb.com/references/typescript/v5/SetTransferableForParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setTransferableFor" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetTransferableForParams](https://portal.thirdweb.com/references/typescript/v5/SetTransferableForParams)

| { asyncParams: () => Promise<[SetTransferableForParams](https://portal.thirdweb.com/references/typescript/v5/SetTransferableForParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## encodeInstall

 Encodes the install data for the TransferableERC721 module.

##### Signature

`function encodeInstall(): string;

`

### Returns

##### Return Type

`let returnType: string;

`

* The encoded data.
## install

 Installs the TransferableERC721 module on a core contract.

### Example

`import { TransferableERC721 } from "thirdweb/modules";

const transaction = TransferableERC721.install({

 contract: coreContract,

 account: account,

});

await sendTransaction({

 transaction,

 account,

});

`

##### Signature

`function install(options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params?: { publisher?: string };

}): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction);

`

### Parameters

##### options

#### Type

`let options: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

contract: Readonly;

params?: { publisher?: string };

};

`

### Returns

##### Return Type

`let returnType: Readonly<options> & {

__contract?: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi>;

__preparedMethod?: () => Promise<PreparedMethod<abiFn>>;

};

`

 the transaction to install the module
## isTransferEnabledFor

 Calls the "isTransferEnabledFor" function on the contract.

### Example

`import { TransferableERC721 } from "thirdweb/modules";

const result = await TransferableERC721.isTransferEnabledFor({

 contract,

 target: ...,

});

`

##### Signature

`function isTransferEnabledFor(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsTransferEnabledForParams](https://portal.thirdweb.com/references/typescript/v5/IsTransferEnabledForParams)>,

): Promise<boolean>;

`

### Parameters

##### options

 The options for the isTransferEnabledFor function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[IsTransferEnabledForParams](https://portal.thirdweb.com/references/typescript/v5/IsTransferEnabledForParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 The parsed result of the function call.
## isTransferEnabled

 Calls the "isTransferEnabled" function on the contract.

### Example

`import { TransferableERC721 } from "thirdweb/modules";

const result = await TransferableERC721.isTransferEnabled({

 contract,

});

`

##### Signature

`function isTransferEnabled(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<boolean>;

`

### Parameters

##### options

 The options for the isTransferEnabled function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 The parsed result of the function call.
## setTransferable

 Prepares a transaction to call the "setTransferable" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { TransferableERC721 } from "thirdweb/modules";

const transaction = TransferableERC721.setTransferable({

 contract,

 enableTransfer: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setTransferable(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| SetTransferableParams

| { asyncParams: () => Promise<SetTransferableParams> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setTransferable" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| SetTransferableParams

| { asyncParams: () => Promise<SetTransferableParams> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## setTransferableFor

 Prepares a transaction to call the "setTransferableFor" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { TransferableERC721 } from "thirdweb/modules";

const transaction = TransferableERC721.setTransferableFor({

 contract,

 target: ...,

 enableTransfer: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setTransferableFor(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetTransferableForParams](https://portal.thirdweb.com/references/typescript/v5/SetTransferableForParams)

| { asyncParams: () => Promise<[SetTransferableForParams](https://portal.thirdweb.com/references/typescript/v5/SetTransferableForParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setTransferableFor" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetTransferableForParams](https://portal.thirdweb.com/references/typescript/v5/SetTransferableForParams)

| { asyncParams: () => Promise<[SetTransferableForParams](https://portal.thirdweb.com/references/typescript/v5/SetTransferableForParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## module

 Convenience function to add the TransferableERC721 module as a default module on a core contract.

### Example

`import {

 TransferableERC721,

 deployModularContract,

} from "thirdweb/modules";

const deployed = deployModularContract({

 client,

 chain,

 account,

 core: "ERC721",

 params: {

 name: "My Modular Contract",

 },

 modules: [TransferableERC721.module()],

});

`

##### Signature

`` function module(params?: {

publisher?: string;

}): (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: "0x"; module: `0x${string}` }>;

 ``

### Parameters

##### params

optional

 The parameters for the module.

#### Type

`let params: { publisher?: string };

`

### Returns

##### Return Type

`` let returnType: (args: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}) => Promise<{ data: "0x"; module: `0x${string}` }>;

 ``

* The module function.
## uint8ArrayToHex

 Converts an array of bytes to a hexadecimal string.

### Example

`import { uint8arrayToHex } from "thirdweb/utils";

const hex = uint8arrayToHex(

new Uint8Array([

72, 101, 108, 108, 111, 44, 32, 119, 111, 114, 108, 100,

 ]),

);

console.log(hex); // "0x48656c6c6f2c20776f726c64"

`

##### Signature

`` function uint8ArrayToHex(

value: Uint8Array,

opts: Options,

): `0x${string}`;

 ``

### Parameters

##### value

 The array of bytes to convert.

#### Type

`let value: Uint8Array;

`

##### opts

 Optional parameters for the conversion.

#### Type

`let opts: Options;

`

### Returns

##### Return Type

`` let returnType: `0x${string}`;

 ``

 The hexadecimal string representation of the bytes.
## createPool

 Prepares a transaction to call the "createPool" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { createPool } from "thirdweb/extensions/uniswap";

const transaction = createPool({

 contract,

 tokenA: ...,

 tokenB: ...,

 fee: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function createPool(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [CreatePoolParams](https://portal.thirdweb.com/references/typescript/v5/CreatePoolParams)

| { asyncParams: () => Promise<[CreatePoolParams](https://portal.thirdweb.com/references/typescript/v5/CreatePoolParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "createPool" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[CreatePoolParams](https://portal.thirdweb.com/references/typescript/v5/CreatePoolParams) | { asyncParams: () => Promise<[CreatePoolParams](https://portal.thirdweb.com/references/typescript/v5/CreatePoolParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## exactInput

 Prepares a transaction to call the "exactInput" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { exactInput } from "thirdweb/extensions/uniswap";

const transaction = exactInput({

 contract,

 params: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function exactInput(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [ExactInputParams](https://portal.thirdweb.com/references/typescript/v5/ExactInputParams)

| { asyncParams: () => Promise<[ExactInputParams](https://portal.thirdweb.com/references/typescript/v5/ExactInputParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "exactInput" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[ExactInputParams](https://portal.thirdweb.com/references/typescript/v5/ExactInputParams) | { asyncParams: () => Promise<[ExactInputParams](https://portal.thirdweb.com/references/typescript/v5/ExactInputParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## enableFeeAmount

 Prepares a transaction to call the "enableFeeAmount" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { enableFeeAmount } from "thirdweb/extensions/uniswap";

const transaction = enableFeeAmount({

 contract,

 fee: ...,

 tickSpacing: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function enableFeeAmount(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [EnableFeeAmountParams](https://portal.thirdweb.com/references/typescript/v5/EnableFeeAmountParams)

| { asyncParams: () => Promise<[EnableFeeAmountParams](https://portal.thirdweb.com/references/typescript/v5/EnableFeeAmountParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "enableFeeAmount" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [EnableFeeAmountParams](https://portal.thirdweb.com/references/typescript/v5/EnableFeeAmountParams)

| { asyncParams: () => Promise<[EnableFeeAmountParams](https://portal.thirdweb.com/references/typescript/v5/EnableFeeAmountParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## exactInputSingle

 Prepares a transaction to call the "exactInputSingle" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { exactInputSingle } from "thirdweb/extensions/uniswap";

const transaction = exactInputSingle({

 contract,

 params: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function exactInputSingle(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [ExactInputSingleParams](https://portal.thirdweb.com/references/typescript/v5/ExactInputSingleParams)

| { asyncParams: () => Promise<[ExactInputSingleParams](https://portal.thirdweb.com/references/typescript/v5/ExactInputSingleParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "exactInputSingle" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [ExactInputSingleParams](https://portal.thirdweb.com/references/typescript/v5/ExactInputSingleParams)

| { asyncParams: () => Promise<[ExactInputSingleParams](https://portal.thirdweb.com/references/typescript/v5/ExactInputSingleParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## exactOutput

 Prepares a transaction to call the "exactOutput" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { exactOutput } from "thirdweb/extensions/uniswap";

const transaction = exactOutput({

 contract,

 params: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function exactOutput(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [ExactOutputParams](https://portal.thirdweb.com/references/typescript/v5/ExactOutputParams)

| { asyncParams: () => Promise<[ExactOutputParams](https://portal.thirdweb.com/references/typescript/v5/ExactOutputParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "exactOutput" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [ExactOutputParams](https://portal.thirdweb.com/references/typescript/v5/ExactOutputParams)

| { asyncParams: () => Promise<[ExactOutputParams](https://portal.thirdweb.com/references/typescript/v5/ExactOutputParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## exactOutputSingle

 Prepares a transaction to call the "exactOutputSingle" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { exactOutputSingle } from "thirdweb/extensions/uniswap";

const transaction = exactOutputSingle({

 contract,

 params: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function exactOutputSingle(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [ExactOutputSingleParams](https://portal.thirdweb.com/references/typescript/v5/ExactOutputSingleParams)

| { asyncParams: () => Promise<[ExactOutputSingleParams](https://portal.thirdweb.com/references/typescript/v5/ExactOutputSingleParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "exactOutputSingle" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [ExactOutputSingleParams](https://portal.thirdweb.com/references/typescript/v5/ExactOutputSingleParams)

| { asyncParams: () => Promise<[ExactOutputSingleParams](https://portal.thirdweb.com/references/typescript/v5/ExactOutputSingleParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## feeAmountEnabledEvent

 Creates an event object for the FeeAmountEnabled event.

### Example

`import { getContractEvents } from "thirdweb";

import { feeAmountEnabledEvent } from "thirdweb/extensions/uniswap";

const events = await getContractEvents({

 contract,

 events: [feeAmountEnabledEvent()],

});

`

##### Signature

`function feeAmountEnabledEvent(): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "fee"; readonly type: "uint24" },

 { readonly name: "tickSpacing"; readonly type: "int24" },

 ];

readonly name: "FeeAmountEnabled";

readonly type: "event";

}>;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 { readonly name: "fee"; readonly type: "uint24" },

 { readonly name: "tickSpacing"; readonly type: "int24" },

 ];

readonly name: "FeeAmountEnabled";

readonly type: "event";

}>;

`

 The prepared event object.
## feeAmountTickSpacing

 Calls the "feeAmountTickSpacing" function on the contract.

### Example

`import { feeAmountTickSpacing } from "thirdweb/extensions/uniswap";

const result = await feeAmountTickSpacing({

 contract,

 fee: ...,

});

`

##### Signature

`function feeAmountTickSpacing(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[FeeAmountTickSpacingParams](https://portal.thirdweb.com/references/typescript/v5/FeeAmountTickSpacingParams)>,

): Promise<number>;

`

### Parameters

##### options

 The options for the feeAmountTickSpacing function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[FeeAmountTickSpacingParams](https://portal.thirdweb.com/references/typescript/v5/FeeAmountTickSpacingParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<number>;

`

 The parsed result of the function call.
## getPool

 Calls the "getPool" function on the contract.

### Example

`import { getPool } from "thirdweb/extensions/uniswap";

const result = await getPool({

 contract,

 tokenA: ...,

 tokenB: ...,

 fee: ...,

});

`

##### Signature

`function getPool(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetPoolParams](https://portal.thirdweb.com/references/typescript/v5/GetPoolParams)>,

): Promise<string>;

`

### Parameters

##### options

 The options for the getPool function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetPoolParams](https://portal.thirdweb.com/references/typescript/v5/GetPoolParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## getUniswapV3Pool

 Finds the Uniswap V3 pools for the two tokens.

### Example

`import { getUniswapV3Pool } from "thirdweb/extensions/uniswap";

const pools = await getUniswapV3Pool({

 tokenA: "0x...",

 tokenB: "0x...",

 contract: factoryContract,

});

`

##### Signature

`function getUniswapV3Pool(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetUniswapV3PoolParams](https://portal.thirdweb.com/references/typescript/v5/GetUniswapV3PoolParams)>,

): Promise<Array<[GetUniswapV3PoolResult](https://portal.thirdweb.com/references/typescript/v5/GetUniswapV3PoolResult)>>;

`

### Parameters

##### options

 The token pair to find any pools for any Uniswap contract that implements getPool.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetUniswapV3PoolParams](https://portal.thirdweb.com/references/typescript/v5/GetUniswapV3PoolParams)>;

`

### Returns

##### Return Type

`let returnType: {

poolAddress: Address;

poolFee: (typeof UniswapFee)[keyof typeof UniswapFee];

};

`

 The pools' addresses and fees.
## owner

 Calls the "owner" function on the contract.

### Example

`import { owner } from "thirdweb/extensions/uniswap";

const result = await owner({

 contract,

});

`

##### Signature

`function owner(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)): Promise<string>;

`

### Parameters

##### options

 The options for the owner function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## ownerChangedEvent

 Creates an event object for the OwnerChanged event.

### Example

`import { getContractEvents } from "thirdweb";

import { ownerChangedEvent } from "thirdweb/extensions/uniswap";

const events = await getContractEvents({

contract,

events: [

ownerChangedEvent({

 oldOwner: ...,

 newOwner: ...,

})

],

});

`

##### Signature

`function ownerChangedEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "oldOwner";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "newOwner";

readonly type: "address";

 },

 ];

readonly name: "OwnerChanged";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "oldOwner";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "newOwner";

readonly type: "address";

 },

 ];

readonly name: "OwnerChanged";

readonly type: "event";

}>;

`

 The prepared event object.
## quoteExactInput

 Prepares a transaction to call the "quoteExactInput" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { quoteExactInput } from "thirdweb/extensions/uniswap";

const transaction = quoteExactInput({

 contract,

 path: ...,

 amountIn: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function quoteExactInput(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [QuoteExactInputParams](https://portal.thirdweb.com/references/typescript/v5/QuoteExactInputParams)

| { asyncParams: () => Promise<[QuoteExactInputParams](https://portal.thirdweb.com/references/typescript/v5/QuoteExactInputParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "quoteExactInput" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [QuoteExactInputParams](https://portal.thirdweb.com/references/typescript/v5/QuoteExactInputParams)

| { asyncParams: () => Promise<[QuoteExactInputParams](https://portal.thirdweb.com/references/typescript/v5/QuoteExactInputParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## poolCreatedEvent

 Creates an event object for the PoolCreated event.

### Example

`import { getContractEvents } from "thirdweb";

import { poolCreatedEvent } from "thirdweb/extensions/uniswap";

const events = await getContractEvents({

contract,

events: [

poolCreatedEvent({

 token0: ...,

 token1: ...,

 sender: ...,

})

],

});

`

##### Signature

`function poolCreatedEvent(

filters: Partial,

): [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "token0";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "token1";

readonly type: "address";

 },

 { readonly name: "fee"; readonly type: "uint24" },

 { readonly name: "tickLower"; readonly type: "int24" },

 { readonly name: "tickUpper"; readonly type: "int24" },

 { readonly name: "liquidity"; readonly type: "uint128" },

 {

readonly indexed: true;

readonly name: "sender";

readonly type: "address";

 },

 ];

readonly name: "PoolCreated";

readonly type: "event";

}>;

`

### Parameters

##### filters

 Optional filters to apply to the event.

#### Type

`let filters: Partial;

`

### Returns

##### Return Type

`let returnType: [PreparedEvent](https://portal.thirdweb.com/references/typescript/v5/PreparedEvent)<{

readonly inputs: readonly [

 {

readonly indexed: true;

readonly name: "token0";

readonly type: "address";

 },

 {

readonly indexed: true;

readonly name: "token1";

readonly type: "address";

 },

 { readonly name: "fee"; readonly type: "uint24" },

 { readonly name: "tickLower"; readonly type: "int24" },

 { readonly name: "tickUpper"; readonly type: "int24" },

 { readonly name: "liquidity"; readonly type: "uint128" },

 {

readonly indexed: true;

readonly name: "sender";

readonly type: "address";

 },

 ];

readonly name: "PoolCreated";

readonly type: "event";

}>;

`

 The prepared event object.
## quoteExactOutput

 Prepares a transaction to call the "quoteExactOutput" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { quoteExactOutput } from "thirdweb/extensions/uniswap";

const transaction = quoteExactOutput({

 contract,

 path: ...,

 amountOut: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function quoteExactOutput(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [QuoteExactOutputParams](https://portal.thirdweb.com/references/typescript/v5/QuoteExactOutputParams)

| { asyncParams: () => Promise<[QuoteExactOutputParams](https://portal.thirdweb.com/references/typescript/v5/QuoteExactOutputParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "quoteExactOutput" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [QuoteExactOutputParams](https://portal.thirdweb.com/references/typescript/v5/QuoteExactOutputParams)

| { asyncParams: () => Promise<[QuoteExactOutputParams](https://portal.thirdweb.com/references/typescript/v5/QuoteExactOutputParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## quoteExactInputSingle

 Prepares a transaction to call the "quoteExactInputSingle" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { quoteExactInputSingle } from "thirdweb/extensions/uniswap";

const transaction = quoteExactInputSingle({

 contract,

 tokenIn: ...,

 tokenOut: ...,

 fee: ...,

 amountIn: ...,

 sqrtPriceLimitX96: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function quoteExactInputSingle(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [QuoteExactInputSingleParams](https://portal.thirdweb.com/references/typescript/v5/QuoteExactInputSingleParams)

| { asyncParams: () => Promise<[QuoteExactInputSingleParams](https://portal.thirdweb.com/references/typescript/v5/QuoteExactInputSingleParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "quoteExactInputSingle" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [QuoteExactInputSingleParams](https://portal.thirdweb.com/references/typescript/v5/QuoteExactInputSingleParams)

| { asyncParams: () => Promise<[QuoteExactInputSingleParams](https://portal.thirdweb.com/references/typescript/v5/QuoteExactInputSingleParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## quoteExactOutputSingle

 Prepares a transaction to call the "quoteExactOutputSingle" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { quoteExactOutputSingle } from "thirdweb/extensions/uniswap";

const transaction = quoteExactOutputSingle({

 contract,

 tokenIn: ...,

 tokenOut: ...,

 fee: ...,

 amountOut: ...,

 sqrtPriceLimitX96: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function quoteExactOutputSingle(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [QuoteExactOutputSingleParams](https://portal.thirdweb.com/references/typescript/v5/QuoteExactOutputSingleParams)

| { asyncParams: () => Promise<[QuoteExactOutputSingleParams](https://portal.thirdweb.com/references/typescript/v5/QuoteExactOutputSingleParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "quoteExactOutputSingle" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [QuoteExactOutputSingleParams](https://portal.thirdweb.com/references/typescript/v5/QuoteExactOutputSingleParams)

| { asyncParams: () => Promise<[QuoteExactOutputSingleParams](https://portal.thirdweb.com/references/typescript/v5/QuoteExactOutputSingleParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## setOwner

 Prepares a transaction to call the "setOwner" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { setOwner } from "thirdweb/extensions/uniswap";

const transaction = setOwner({

 contract,

 newOwner: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setOwner(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[SetOwnerParams](https://portal.thirdweb.com/references/typescript/v5/SetOwnerParams) | { asyncParams: () => Promise<[SetOwnerParams](https://portal.thirdweb.com/references/typescript/v5/SetOwnerParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setOwner" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[SetOwnerParams](https://portal.thirdweb.com/references/typescript/v5/SetOwnerParams) | { asyncParams: () => Promise<[SetOwnerParams](https://portal.thirdweb.com/references/typescript/v5/SetOwnerParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## unpin

 Unpins a file from IPFS. For security purposes, this method requires a secret key to be set in the ThirdwebClient instance.

### Example

`import { unpin } from "thirdweb";

const result = await unpin({

 client: thirdwebClient,

 cid: "QmTzQ1N1z1Q1N1z1Q1N1z1Q1N1z1Q1N1z1Q1N1z1Q1N1z1",

});

`

##### Signature

`function unpin(options: [UnpinOptions](https://portal.thirdweb.com/references/typescript/v5/UnpinOptions)): Promise<void>;

`

### Parameters

##### options

 The options for unpinning the file.

#### Type

`let options: { cid: string; client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient) };

`

### Returns

##### Return Type

`let returnType: Promise<void>;

`
## unlinkProfile

 Disconnects an existing profile (authentication method) from the current user. Once disconnected, that profile can no longer be used to sign into the account.

### Example

`import { inAppWallet } from "thirdweb/wallets";

const wallet = inAppWallet();

wallet.connect({ strategy: "google" });

const profiles = await getProfiles({

 client,

});

const updatedProfiles = await unlinkProfile({

 client,

 profileToUnlink: profiles[0],

});

`

##### Signature

`function unlinkProfile(args: UnlinkParams): Promise<Array<[Profile](https://portal.thirdweb.com/references/typescript/v5/Profile)>>;

`

### Parameters

##### args

 The object containing the profile that we want to unlink.

#### Type

`let args: UnlinkParams;

`

### Returns

##### Return Type

`let returnType: {

details: {

address?: [Address](https://portal.thirdweb.com/references/typescript/v5/Address);

email?: string;

id?: string;

phone?: string;

 };

type: AuthOption;

};

`

 A promise that resolves to the updated linked profiles.
## namehash

 Calls the "namehash" function on the contract.

### Example

`import { namehash } from "thirdweb/extensions/unstoppable-domains";

const result = await namehash({

 contract,

 labels: ...,

});

`

##### Signature

`function namehash(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[NamehashParams](https://portal.thirdweb.com/references/typescript/v5/NamehashParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the namehash function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[NamehashParams](https://portal.thirdweb.com/references/typescript/v5/NamehashParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## resolveAddress

 Resolve an Unstoppable-Domain domain to an Ethereum address

### Example

####  Basic usage

`import { resolveAddress } from "thirdweb/extension/unstoppable-domains";

const address = await resolveAddress({

 client,

 name: "thirdweb.crypto",

});

`

####  Custom resolver

 By default this extension will try to resolve the name on Polygon mainnet, you can decide to customize the resolver contract by specifying `resolverAddress` and `resolverChain`

`import { ethereum } from "thirdweb/chains";

const address = await resolveAddress({

 client,

 name: "thirdweb.crypto",

 resolverAddress: "0x...",

 resolverChain: ethereum,

});

`

##### Signature

`function resolveAddress(

options: [ResolveAddressOptions](https://portal.thirdweb.com/references/typescript/v5/ResolveAddressOptions),

): Promise<string>;

`

### Parameters

##### options

 The options for resolving an UD domain

#### Type

`let options: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

name: string;

resolverAddress?: string;

resolverChain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

};

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The Ethereum address associated with the domain name. [ Learn more](https://docs.unstoppabledomains.com/reverse-resolution/)
## resolveName

 Resolves the primary Untoppable-Domains name for a specified address.

### Example

####  Basic usage

`import { resolveName } from "thirdweb/extension/unstoppable-domains";

const name = await resolveName({

 client,

 address: "0x...",

});

`

####  Custom resolver

 By default this extension will try to resolve the address on Polygon mainnet, you can decide to customize the resolver contract by specifying `resolverAddress` and `resolverChain`

`import { ethereum } from "thirdweb/chains";

const address = await resolveName({

 client,

 address: "0x...",

 resolverAddress: "0x...",

 resolverChain: ethereum,

});

`

##### Signature

`function resolveName(options: [ResolveUDNameOptions](https://portal.thirdweb.com/references/typescript/v5/ResolveUDNameOptions)): Promise<string>;

`

### Parameters

##### options

 The options for resolving an UD domain

#### Type

`let options: {

address: string;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

resolverAddress?: string;

resolverChain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

};

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`
## reverseNameOf

 Calls the "reverseNameOf" function on the contract.

### Example

`import { reverseNameOf } from "thirdweb/extensions/unstoppable-domains";

const result = await reverseNameOf({

 contract,

 addr: ...,

});

`

##### Signature

`function reverseNameOf(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ReverseNameOfParams](https://portal.thirdweb.com/references/typescript/v5/ReverseNameOfParams)>,

): Promise<string>;

`

### Parameters

##### options

 The options for the reverseNameOf function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ReverseNameOfParams](https://portal.thirdweb.com/references/typescript/v5/ReverseNameOfParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## uploadMobile

 Batch upload arbitrary file or JSON data using the configured decentralized storage system. Automatically uploads any file data within JSON objects and replaces them with hashes.

### Example

`// Upload an image

launchImageLibrary({ mediaType: "photo" }, async (response) => {

if (response.assets?.[0]) {

const { fileName, type, uri } = response.assets[0];

if (!uri) {

throw new Error("No uri");

 }

const resp = await uploadMobile({

 uri,

 type,

 name: fileName,

 });

 }

});

// Upload an array of JSON objects

const objects = [

 { name: "JSON 1", text: "Hello World" },

 { name: "JSON 2", trait: "Awesome" },

];

const jsonUris = await uploadMobile(objects);

`

##### Signature

`function uploadMobile(

options: [UploadMobileOptions](https://portal.thirdweb.com/references/typescript/v5/UploadMobileOptions),

): Promise<Array<string>>;

`

### Parameters

##### options

 Options to pass through to the storage uploader class

#### Type

`let options: InternalUploadMobileOptions & { client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient) };

`

### Returns

##### Return Type

`let returnType: Promise<Array<string>>;

`

 The URIs of the uploaded data
## upload

 Uploads files based on the provided options.

### Example

####  Uploading JSON objects

`import { upload } from "thirdweb/storage";

const uri = await upload({

 client,

 files: [

 {

 name: "something",

 data: {

 hello: "world",

 },

 },

 ],

});

`

####  Uploading files

`import { upload } from "thirdweb/storage";

const uri = await upload({

 client,

 files: [new File(["hello world"], "hello.txt")],

});

`

##### Signature

`function upload(

options: [UploadOptions](https://portal.thirdweb.com/references/typescript/v5/UploadOptions)<TFiles>,

): Promise<UploadReturnType<TFiles>>;

`

### Parameters

##### options

 The upload options.

#### Type

`let options: [UploadOptions](https://portal.thirdweb.com/references/typescript/v5/UploadOptions)<TFiles>;

`

### Returns

##### Return Type

`let returnType: Promise<UploadReturnType<TFiles>>;

`

 A promise that resolves to the uploaded file URI or URIs (when passing multiple files).
## useActiveAccount

 A hook that returns the active account

### Example

`import { useActiveAccount } from "thirdweb/react";

const activeAccount = useActiveAccount();

console.log("address", activeAccount?.address);

`

##### Signature

`function useActiveAccount(): undefined | [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

### Returns

##### Return Type

`let returnType: undefined | [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

`

 The active `Account` or `undefined` if no active account is set.
## useActiveWallet

 A hook that returns the active wallet

### Example

####  Basic usage

`import { useActiveWallet } from "thirdweb/react";

const wallet = useActiveWallet();

`

####  Listen to account change event

`const wallet = useActiveWallet();

wallet?.subscribe("accountChanged", (account) => {

 console.log(account);

});

`

####  Listen to multiple accounts changed event

`const wallet = useActiveWallet();

wallet?.subscribe("accountsChanged", (addresses) => {

 console.log(addresses);

});

`

####  Listen to network change event

`const wallet = useActiveWallet();

wallet?.subscribe("chainChanged", (chain) => {

 console.log(chain);

});

`

##### Signature

`function useActiveWallet(): undefined | [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

`

### Returns

##### Return Type

`let returnType: undefined | [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

`

 The active `Wallet` or `undefined` if no active wallet is set.
## useActiveWalletChain

 A hook that returns the chain the active wallet is connected to

### Example

`import { useActiveWalletChain } from "thirdweb/react";

const activeChain = useActiveWalletChain();

`

##### Signature

`function useActiveWalletChain():

| undefined

 | Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`

### Returns

##### Return Type

`let returnType: undefined | Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`

 The chain the active wallet is connected to or null if no active wallet.
## useActiveWalletConnectionStatus

 A hook that returns the active account's connection status.

### Example

`import { useActiveWalletConnectionStatus } from "thirdweb/react";

function Example() {

const status = useActiveWalletConnectionStatus();

 console.log(status);

return <div> ... </div>;

}

`

##### Signature

`function useActiveWalletConnectionStatus(): [ConnectionStatus](https://portal.thirdweb.com/references/typescript/v5/ConnectionStatus);

`

### Returns

##### Return Type

`let returnType:

| "connected"

| "disconnected"

| "connecting"

| "unknown";

`

 The active wallet's connection status.
## useAutoConnect

 Autoconnect the last previously connected wallet.

### Example

`import { useAutoConnect } from "thirdweb/react";

const { data: autoConnected, isLoading } = useAutoConnect({

 client,

 accountAbstraction,

 wallets,

 onConnect,

 timeout,

});

`

##### Signature

`function useAutoConnect(

props: [AutoConnectProps](https://portal.thirdweb.com/references/typescript/v5/AutoConnectProps),

): UseQueryResult<boolean, Error>;

`

### Parameters

##### props

 The props for auto connect.

#### Type

`let props: {

accountAbstraction?: [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions);

appMetadata?: AppMetadata;

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

onConnect?: (wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)) => void;

onTimeout?: () => void;

timeout?: number;

wallets?: Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

};

`

### Returns

##### Return Type

`let returnType: UseQueryResult<boolean, Error>;

`

 whether the auto connect was successful.
## useAdminWallet

 Get the admin wallet for the active wallet Useful for smart wallets to get the underlying personal account

##### Signature

`function useAdminWallet(): undefined | [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

`

### Returns

##### Return Type

`let returnType: undefined | [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

`

 The admin wallet for the active wallet, or the active wallet if it doesn't have an admin account
## useBlockNumber

 Hook that watches for changes in the block number on a given chain.

### Example

`import { useBlockNumber } from "thirdweb/react";

const blockNumber = useBlockNumber({ client, chain });

`

##### Signature

`function useBlockNumber(

options: [UseBlockNumberOptions](https://portal.thirdweb.com/references/typescript/v5/UseBlockNumberOptions),

): undefined | bigint;

`

### Parameters

##### options

 The options for the hook.

#### Type

`let options: {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

enabled?: boolean;

watch?: boolean;

};

`

### Returns

##### Return Type

`let returnType: undefined | bigint;

`

 The latest block number.
## useBuyHistory

 Hook to get the history of Buy transactions for a given wallet - This includes both "buy with crypto" and "buy with fiat" transactions.

 This hook is a React Query wrapper of the [getBuyHistory](https://portal.thirdweb.com/references/typescript/v5/getBuyHistory) function. You can also use that function directly

### Example

`import { useBuyHistory } from "thirdweb/react";

function Component() {

const buyHistoryQuery = useBuyHistory(params);

return <div> ... </div>;

}

`

##### Signature

`function useBuyHistory(

params?: [BuyHistoryParams](https://portal.thirdweb.com/references/typescript/v5/BuyHistoryParams),

queryParams?: BuyHistoryQueryOptions,

): UseQueryResult<[BuyHistoryData](https://portal.thirdweb.com/references/typescript/v5/BuyHistoryData)>;

`

### Parameters

##### params

optional

 object of type [BuyHistoryParams](https://portal.thirdweb.com/references/typescript/v5/BuyHistoryParams)

#### Type

`let params: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

count: number;

start: number;

walletAddress: string;

};

`

##### queryParams

optional

 options to configure the react query

#### Type

`let queryParams: BuyHistoryQueryOptions;

`

### Returns

##### Return Type

`let returnType: UseQueryResult<[BuyHistoryData](https://portal.thirdweb.com/references/typescript/v5/BuyHistoryData)>;

`

 A React Query object which contains the data of type [BuyHistoryData](https://portal.thirdweb.com/references/typescript/v5/BuyHistoryData)
## useBuyWithCryptoQuote

 Hook to get a price quote for performing a "Buy with crypto" transaction that allows users to buy a token with another token - aka a swap.

 The price quote is an object of type [BuyWithCryptoQuote](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoQuote) . This quote contains the information about the purchase such as token amounts, processing fees, estimated time etc.

 This hook is a React Query wrapper of the [getBuyWithCryptoQuote](https://portal.thirdweb.com/references/typescript/v5/getBuyWithCryptoQuote) function. You can also use that function directly

 Once you have the quote, you can use the [useSendTransaction](https://portal.thirdweb.com/references/typescript/v5/useSendTransaction) function to send the purchase and [useBuyWithCryptoStatus](https://portal.thirdweb.com/references/typescript/v5/useBuyWithCryptoStatus) function to get the status of the swap transaction.

### Example

`import {

 useBuyWithCryptoQuote,

 useBuyWithCryptoStatus,

type BuyWithCryptoStatusQueryParams,

 useActiveAccount,

} from "thirdweb/react";

import { sendTransaction } from "thirdweb";

function Component() {

const buyWithCryptoQuoteQuery = useBuyWithCryptoQuote(swapParams);

const [buyTxHash, setBuyTxHash] = useState<

 BuyWithCryptoStatusQueryParams | undefined

>();

const buyWithCryptoStatusQuery = useBuyWithCryptoStatus(

 buyTxHash

? {

 client,

 transactionHash: buyTxHash,

 }

: undefined,

 );

async function handleBuyWithCrypto() {

const account = useActiveAccount();

// if approval is required

if (buyWithCryptoQuoteQuery.data.approval) {

const approveTx = await sendTransaction({

 transaction: swapQuote.data.approval,

 account: account,

 });

await waitForApproval(approveTx);

 }

// send the transaction to buy crypto

// this promise is resolved when user confirms the transaction in the wallet and the transaction is sent to the blockchain

const buyTx = await sendTransaction({

 transaction: swapQuote.data.transactionRequest,

 account: account,

 });

await waitForApproval(buyTx);

// set buyTx.transactionHash to poll the status of the swap transaction

setBuyWithCryptoTx(buyTx.transactionHash);

 }

return <button onClick={handleBuyWithCrypto}>Swap</button>;

}

`

##### Signature

`function useBuyWithCryptoQuote(

params?: [GetBuyWithCryptoQuoteParams](https://portal.thirdweb.com/references/typescript/v5/GetBuyWithCryptoQuoteParams),

queryParams?: BuyWithCryptoQuoteQueryOptions,

): UseQueryResult<[BuyWithCryptoQuote](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoQuote)>;

`

### Parameters

##### params

optional

 object of type [BuyWithCryptoQuoteQueryParams](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoQuoteQueryParams)

#### Type

`let params: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

fromAddress: string;

fromChainId: number;

fromTokenAddress: string;

intentId?: string;

maxSlippageBPS?: number;

purchaseData?: object;

toAddress: string;

toChainId: number;

toTokenAddress: string;

} & (

| { fromAmount: string; toAmount?: never }

| { fromAmount?: never; toAmount: string }

);

`

##### queryParams

optional

 options to configure the react query

#### Type

`let queryParams: BuyWithCryptoQuoteQueryOptions;

`

### Returns

##### Return Type

`let returnType: UseQueryResult<[BuyWithCryptoQuote](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoQuote)>;

`

 A React Query object which contains the data of type [BuyWithCryptoQuote](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoQuote)
## useBuyWithCryptoHistory

 Hook to get the "Buy with crypto" transaction history for a given wallet address.

 This hook is a React Query wrapper of the [getBuyWithCryptoHistory](https://portal.thirdweb.com/references/typescript/v5/getBuyWithCryptoHistory) function. You can also use that function directly

### Example

`import { useBuyWithCryptoHistory } from "thirdweb/react";

function Component() {

const buyWithCryptoHistory = useBuyWithCryptoHistory(params);

return <div> ... </div>;

}

`

##### Signature

`function useBuyWithCryptoHistory(

params?: [BuyWithCryptoHistoryParams](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoHistoryParams),

queryParams?: BuyWithCryptoHistoryQueryOptions,

): UseQueryResult<[BuyWithCryptoHistoryData](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoHistoryData)>;

`

### Parameters

##### params

optional

 object of type [BuyWithCryptoHistoryParams](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoHistoryParams)

#### Type

`let params: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

count: number;

start: number;

walletAddress: string;

};

`

##### queryParams

optional

 options to configure the react query

#### Type

`let queryParams: BuyWithCryptoHistoryQueryOptions;

`

### Returns

##### Return Type

`let returnType: UseQueryResult<[BuyWithCryptoHistoryData](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoHistoryData)>;

`

 A React Query object which contains the data of type [BuyWithCryptoHistoryData](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoHistoryData)
## useBuyWithCryptoStatus

 A hook to get a status of a "Buy with crypto" transaction to determine if the transaction is completed, failed or pending.

 This hook is a React Query wrapper of the [getBuyWithCryptoStatus](https://portal.thirdweb.com/references/typescript/v5/getBuyWithCryptoStatus) function. You can also use that function directly.

### Example

`import {

 useSendTransaction,

 useBuyWithCryptoQuote,

 useBuyWithCryptoStatus,

type BuyWithCryptoStatusQueryParams,

 useActiveAccount,

} from "thirdweb/react";

import { sendTransaction } from "thirdweb";

function Component() {

const buyWithCryptoQuoteQuery = useBuyWithCryptoQuote(swapParams);

const [buyTxHash, setBuyTxHash] = useState<

 BuyWithCryptoStatusQueryParams | undefined

>();

const buyWithCryptoStatusQuery = useBuyWithCryptoStatus(

 buyTxHash

? {

 client,

 transactionHash: buyTxHash,

 }

: undefined,

 );

const account = useActiveAccount();

async function handleBuyWithCrypto() {

// if approval is required

if (buyWithCryptoQuoteQuery.data.approval) {

const approveTx = await sendTransaction({

 account: account,

 transaction: swapQuote.data.approval,

 });

await waitForApproval(approveTx);

 }

// send the transaction to buy crypto

// this promise is resolved when user confirms the transaction in the wallet and the transaction is sent to the blockchain

const buyTx = await sendTransactionMutation.mutateAsync({

 transaction: swapQuote.data.transactionRequest,

 account: account,

 });

await waitForApproval(buyTx);

// set buyTx.transactionHash to poll the status of the swap transaction

setBuyWithCryptoTx(buyTx.transactionHash);

 }

return <button onClick={handleBuyWithCrypto}>Swap</button>;

}

`

##### Signature

`function useBuyWithCryptoStatus(

params?: [BuyWithCryptoTransaction](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoTransaction),

): UseQueryResult<[BuyWithCryptoStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoStatus), Error>;

`

### Parameters

##### params

optional

 object of type [BuyWithCryptoTransaction](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoTransaction)

#### Type

`let params: {

chainId: number;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

transactionHash: string;

};

`

### Returns

##### Return Type

`let returnType: UseQueryResult<[BuyWithCryptoStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoStatus), Error>;

`

 A react query object which contains the data of type [BuyWithCryptoStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoStatus)
## useBuyWithFiatHistory

 Hook to get the "Buy with Fiat" transaction history for a given wallet address.

 This hook is a React Query wrapper of the [getBuyWithFiatHistory](https://portal.thirdweb.com/references/typescript/v5/getBuyWithFiatHistory) function. You can also use that function directly

### Example

`import { useBuyWithFiatHistory } from "thirdweb/react";

function Component() {

const historyQuery = useBuyWithFiatHistory(params);

return <div> ... </div>;

}

`

##### Signature

`function useBuyWithFiatHistory(

params?: [BuyWithFiatHistoryParams](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatHistoryParams),

queryParams?: BuyWithFiatHistoryQueryOptions,

): UseQueryResult<[BuyWithFiatHistoryData](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatHistoryData)>;

`

### Parameters

##### params

optional

 object of type [BuyWithFiatHistoryParams](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatHistoryParams)

#### Type

`let params: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

count: number;

start: number;

walletAddress: string;

};

`

##### queryParams

optional

 options to configure the react query

#### Type

`let queryParams: BuyWithFiatHistoryQueryOptions;

`

### Returns

##### Return Type

`let returnType: UseQueryResult<[BuyWithFiatHistoryData](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatHistoryData)>;

`

 A React Query object which contains the data of type [BuyWithFiatHistoryData](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatHistoryData)
## useBuyWithFiatQuote

 Hook to get a price quote for performing a "Buy with Fiat" transaction that allows users to buy a token with fiat currency.

 The price quote is an object of type [BuyWithFiatQuote](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatQuote) . This quote contains the information about the purchase such as token amounts, processing fees, estimated time etc.

 This hook is a React Query wrapper of the [getBuyWithFiatQuote](https://portal.thirdweb.com/references/typescript/v5/getBuyWithFiatQuote) function. You can also use that function directly

 Once you have the `quote` , you can open a new window with `quote.onRampLink` to allow the user to buy the token with fiat currency. and [useBuyWithFiatStatus](https://portal.thirdweb.com/references/typescript/v5/useBuyWithFiatStatus) function to start polling for the status of this transaction.

### Example

`import { NATIVE_TOKEN_ADDRESS } from "thirdweb";

import { base } from "thirdweb/chains";

import { useBuyWithFiatQuote } from "thirdweb/react";

// get a quote for buying 0.01 base native token with USD fiat currency

function Example() {

const quote = useBuyWithFiatQuote({

 client: client, // thirdweb client

 fromCurrencySymbol: "USD", // fiat currency symbol

 toChainId: base.id, // base chain id

 toAmount: "0.01", // amount of token to buy

 toTokenAddress: NATIVE_TOKEN_ADDRESS, // native token

 toAddress: "0x...", // user's wallet address

 });

return (

 <div>

 {quote.data && (

 <a href={quote.data.onRampLink} target="_blank">

open onramp provider

 </a>

 )}

</div>

 );

}

`

##### Signature

`function useBuyWithFiatQuote(

params?: [GetBuyWithFiatQuoteParams](https://portal.thirdweb.com/references/typescript/v5/GetBuyWithFiatQuoteParams),

queryOptions?: BuyWithFiatQuoteQueryOptions,

): UseQueryResult<[BuyWithFiatQuote](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatQuote)>;

`

### Parameters

##### params

optional

 object of type [GetBuyWithFiatQuoteParams](https://portal.thirdweb.com/references/typescript/v5/GetBuyWithFiatQuoteParams)

#### Type

`let params: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

fromAddress: string;

fromAmount?: string;

fromCurrencySymbol: CurrencyMeta["shorthand"];

isTestMode?: boolean;

maxSlippageBPS?: number;

preferredProvider?: FiatProvider;

purchaseData?: object;

toAddress: string;

toAmount?: string;

toChainId: number;

toGasAmountWei?: string;

toTokenAddress: string;

};

`

##### queryOptions

optional

#### Type

`let queryOptions: BuyWithFiatQuoteQueryOptions;

`

### Returns

##### Return Type

`let returnType: UseQueryResult<[BuyWithFiatQuote](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatQuote)>;

`

 A React Query object which contains the data of type [BuyWithFiatQuote](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatQuote)
## useBuyWithFiatStatus

 A hook to get a status of a "Buy with Fiat" transaction to determine if the transaction is completed, failed or pending.

 This hook is a React Query wrapper of the [getBuyWithFiatStatus](https://portal.thirdweb.com/references/typescript/v5/getBuyWithCryptoStatus) function. You can also use that function directly.

`useBuyWithFiatStatus` refetches the status using `getBuyWithFiatStatus` every 5 seconds.

### Example

`import { useBuyWithFiatStatus } from "thirdweb/react";

import { client } from "./client";

function Example() {

const fiatStatus = useBuyWithFiatStatus({

 client: client, // thirdweb client

 intentId: "....", // get the intentId from quote ( quote.intentId )

 });

 console.log(fiatStatus.data);

return <div>...</div>;

}

`

##### Signature

`function useBuyWithFiatStatus(

params?: WithPickedOnceQueryOptions<[GetBuyWithFiatStatusParams](https://portal.thirdweb.com/references/typescript/v5/GetBuyWithFiatStatusParams)>,

): UseQueryResult<[BuyWithFiatStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatStatus)>;

`

### Parameters

##### params

optional

 object of type [GetBuyWithFiatStatusParams](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoTransaction)

#### Type

`let params: WithPickedOnceQueryOptions<[GetBuyWithFiatStatusParams](https://portal.thirdweb.com/references/typescript/v5/GetBuyWithFiatStatusParams)>;

`

### Returns

##### Return Type

`let returnType: UseQueryResult<[BuyWithFiatStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatStatus)>;

`

 A react query object which contains the data of type [BuyWithFiatStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoStatus)
## useChainMetadata

 Retrieves metadata for a chain such as name, icon, available faucets, block explorers, etc.

### Example

`import { useChainMetadata } from "thirdweb/react";

const { data: chainMetadata } = useChainMetadata(defineChain(11155111));

console.log("Name:", chainMetadata.name); // Sepolia

console.log("Faucets:", chainMetadata.faucets); // ["https://thirdweb.com/sepolia/faucet"]

console.log("Explorers:", chainMetadata.explorers); // ["https://sepolia.etherscan.io/"]

`

##### Signature

`function useChainMetadata(

chain?: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>,

): UseQueryResult<[ChainMetadata](https://portal.thirdweb.com/references/typescript/v5/ChainMetadata)>;

`

### Parameters

##### chain

optional

 Chain to retrieve metadata for, see [ defineChain](https://portal.thirdweb.com/references/typescript/v5/defineChain) for how to create a chain from a chain ID.

#### Type

`let chain: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`

### Returns

##### Return Type

`let returnType: UseQueryResult<[ChainMetadata](https://portal.thirdweb.com/references/typescript/v5/ChainMetadata)>;

`

 A React Query result containing the chain metadata
## useConnectModal

 hook that allows you to open the Connect UI in a Modal to prompt the user to connect wallet.

### Example

`import { createThirdwebClient } from "thirdweb";

import { useConnectModal } from "thirdweb/react";

const client = createThirdwebClient({

 clientId: "<your_client_id>",

});

function Example() {

const { connect, isConnecting } = useConnectModal();

async function handleConnect() {

const wallet = await connect({ client }); // opens the connect modal

 console.log("connected to", wallet);

 }

return <button onClick={handleConnect}> Connect </button>;

}

`

 The returned `connect` method takes an object of type [ UseConnectModalOptions](https://portal.thirdweb.com/references/typescript/v5/ConnectButtonProps)as an argument to customize the Connect Modal UI. Refer to [ UseConnectModalOptions](https://portal.thirdweb.com/references/typescript/v5/ConnectButtonProps) to see the available options.

##### Signature

`function useConnectModal(): {

connect: (props: [UseConnectModalOptions](https://portal.thirdweb.com/references/typescript/v5/UseConnectModalOptions)) => Promise<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

isConnecting: boolean;

};

`

### Returns

##### Return Type

`let returnType: {

connect: (props: [UseConnectModalOptions](https://portal.thirdweb.com/references/typescript/v5/UseConnectModalOptions)) => Promise<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

isConnecting: boolean;

};

`
## useConnect

 A hook to set a wallet as active wallet

### Example

`import { createThirdwebClient } from "thirdweb";

import { useConnect } from "thirdweb/react";

import { createWallet } from "thirdweb/wallets";

const client = createThirdwebClient({

 clientId: "YOUR_CLIENT_ID",

});

function Example() {

const { connect, isConnecting, error } = useConnect();

return (

 <button

onClick={() =>

connect(async () => {

// instantiate wallet

const wallet = createWallet("io.metamask");

// connect wallet

await wallet.connect({

 client,

 });

// return the wallet

return wallet;

 })

}

 >

 Connect

 </button>

 );

}

`

##### Signature

`function useConnect(options?: [ConnectManagerOptions](https://portal.thirdweb.com/references/typescript/v5/ConnectManagerOptions)): {

readonly connect: (

walletOrFn: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet) | (() => Promise<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>),

 ) => Promise<null | [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

error: null | Error;

isConnecting: boolean;

};

`

### Parameters

##### options

optional

#### Type

`let options: {

accountAbstraction?: [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

onConnect?: (wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)) => void;

setWalletAsActive?: boolean;

};

`

### Returns

##### Return Type

`let returnType: {

readonly connect: (

walletOrFn: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet) | (() => Promise<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>),

 ) => Promise<null | [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

error: null | Error;

isConnecting: boolean;

};

`

 A function that lets you connect a wallet.
## useConnectedWallets

 A hook that returns all connected wallets

### Example

`import { useConnectedWallets } from "thirdweb/react";

const wallets = useConnectedWallets();

`

##### Signature

`function useConnectedWallets(): Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

`

### Returns

##### Return Type

`let returnType: Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

`

 An array of all connected wallets
## useContractEvents

 Watches contract events and returns the parsed logs.

### Example

####  Using event extensions

 The `thirdweb/extesions` export contains event definitions for many popular contracts. You can use these event definitions to watch for specific events with a type-safe API.

`import { useContractEvents } from "thirdweb/react";

import { tokensClaimedEvent } from "thirdweb/extensions/erc721";

const account = useActiveAccount();

const contractEvents = useContractEvents({

 contract,

 events: [tokensClaimedEvent({ claimer: account?.address })],

});

`

####  Using custom events

 You can also watch for custom events by passing an array of [ prepared events](https://portal.thirdweb.com/references/typescript/v5/prepareEvent) .

`import { useContractEvents } from "thirdweb/react";

import { prepareEvent } from "thirdweb";

const myEvent = prepareEvent({

 signature: "event MyEvent(uint256 myArg)",

});

const contractEvents = useContractEvents({

 contract,

 events: [myEvent],

});

`

##### Signature

`function useContractEvents(

options: UseContractEventsOptions<abi, abiEvents>,

): UseQueryResult<[ParseEventLogsResult](https://portal.thirdweb.com/references/typescript/v5/ParseEventLogsResult)<abiEvents, true>, Error>;

`

### Parameters

##### options

 The options for watching contract events.

#### Type

`let options: UseContractEventsOptions<abi, abiEvents>;

`

### Returns

##### Return Type

`let returnType: UseQueryResult<

[ParseEventLogsResult](https://portal.thirdweb.com/references/typescript/v5/ParseEventLogsResult)<abiEvents, true>,

Error

>;

`

 The contract events of the watched contract events.
## useDisconnect

 Disconnect from given account

### Example

`import { useDisconnect, useActiveWallet } from "thirdweb/react";

function Example() {

const { disconnect } = useDisconnect();

const wallet = useActiveWallet();

return (

 <button onClick={() => disconnect(wallet)}>Disconnect</button>

 );

}

`

##### Signature

`function useDisconnect(): { disconnect: (wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)) => void };

`

### Returns

##### Return Type

`let returnType: { disconnect: (wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)) => void };

`

 An object with a function to disconnect an account
## useEstimateGas

 A hook to estimate the gas for a given transaction.

### Example

`import { useEstimateGas } from "thirdweb/react";

const { mutate: estimateGas, data: gasEstimate } = useEstimateGas();

// later

const estimatedGas = await estimateGas(tx);

`

##### Signature

`function useEstimateGas(): UseMutationResult<

bigint,

Error,

[PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)

>;

`

### Returns

##### Return Type

`let returnType: UseMutationResult<bigint, Error, [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)>;

`

 A mutation object to estimate gas.
## useEstimateGasCost

 A hook to estimate the gas cost in ether and wei for a given transaction.

### Example

`import { useEstimateGasCost } from "thirdweb/react";

const { mutate: estimateGasCost, data: gasEstimate } =

useEstimateGas();

// later

const estimatedGas = await estimateGasCost(tx);

console.log("gas cost in ether", estimatedGas.ether);

`

##### Signature

`function useEstimateGasCost(): UseMutationResult<

[EstimateGasCostResult](https://portal.thirdweb.com/references/typescript/v5/EstimateGasCostResult),

Error,

[PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)

>;

`

### Returns

##### Return Type

`let returnType: UseMutationResult<

[EstimateGasCostResult](https://portal.thirdweb.com/references/typescript/v5/EstimateGasCostResult),

Error,

[PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)

>;

`

 A mutation object to estimate gas cost.
## useLinkProfile

 Links a web2 or web3 profile to the connected in-app or ecosystem account. _When a profile is linked to the account, that profile can then be used to sign into the same account._

### Example

####  Linking a social profile

`import { useLinkProfile } from "thirdweb/react";

const { mutate: linkProfile } = useLinkProfile();

const onClick = () => {

linkProfile({

 client,

 strategy: "discord", // or "google", "x", "telegram", etc

 });

};

`

####  Linking an email

`import { useLinkProfile } from "thirdweb/react";

import { preAuthenticate } from "thirdweb/wallets";

const { mutate: linkProfile } = useLinkProfile();

// send a verification email first

const sendEmail = async () => {

const email = await preAuthenticate({

 client,

 strategy: "email",

 email: "john.doe@example.com",

 });

};

// then link the profile with the verification code

const onClick = (code: string) => {

linkProfile({

 client,

 strategy: "email",

 email: "john.doe@example.com",

 verificationCode: code,

 });

};

`

 The same process can be used for phone and email, simply swap out the `strategy` parameter.

####  Linking a wallet

`import { useLinkProfile } from "thirdweb/react";

const { mutate: linkProfile } = useLinkProfile();

const onClick = () => {

linkProfile({

 client,

 strategy: "wallet",

 wallet: createWallet("io.metamask"), // autocompletion for 400+ wallet ids

 chain: sepolia, // any chain works, needed for SIWE signature

 });

};

`

##### Signature

`function useLinkProfile(): UseMutationResult<

Array<[Profile](https://portal.thirdweb.com/references/typescript/v5/Profile)>,

Error,

AuthArgsType,

unknown

>;

`

### Returns

##### Return Type

`let returnType: UseMutationResult<

Array<[Profile](https://portal.thirdweb.com/references/typescript/v5/Profile)>,

Error,

AuthArgsType,

unknown

>;

`
## useIsAutoConnecting

 A hook to check if the auto connect is in progress.

### Example

`function Example() {

const isAutoConnecting = useIsAutoConnecting();

return <div> ... </div>;

}

`

##### Signature

`function useIsAutoConnecting(): boolean;

`

### Returns

##### Return Type

`let returnType: boolean;

`

 A boolean indicating if the auto connect is in progress.
## useNetworkSwitcherModal

 Hook to open the Wallet Network Switcher Modal that shows allows users to switch to different network.

### Example

`import { createThirdwebClient } from "thirdweb";

import { useNetworkSwitcherModal } from "thirdweb/react";

import { base, ethereum, polygon, sepolia, arbitrum } from "thirdweb/chains";

const client = createThirdwebClient({

 clientId: "<your_client_id>",

});

function Example() {

const networkSwitcher = useNetworkSwitcherModal();

function handleClick() {

 networkSwitcher.open({

 client,

 theme: 'light'

 sections: [

 { label: 'Recently used', chains: [arbitrum, polygon] },

 { label: 'Popular', chains: [base, ethereum, sepolia] },

 ]

 });

 }

return <button onClick={handleClick}> Switch Network </button>

}

`

##### Signature

`function useNetworkSwitcherModal(): {

close: () => void;

open: (props: [UseNetworkSwitcherModalOptions](https://portal.thirdweb.com/references/typescript/v5/UseNetworkSwitcherModalOptions)) => Promise<void>;

};

`

### Returns

##### Return Type

`let returnType: {

close: () => void;

open: (props: [UseNetworkSwitcherModalOptions](https://portal.thirdweb.com/references/typescript/v5/UseNetworkSwitcherModalOptions)) => Promise<void>;

};

`
## useProfiles

 Retrieves all linked profiles of the connected in-app or ecosystem account.

### Example

`import { useProfiles } from "thirdweb/react";

const { data: profiles } = useProfiles({

 client,

});

console.log("Type:", profiles[0].type); // "discord"

console.log("Email:", profiles[0].details.email); // "john.doe@example.com"

`

##### Signature

`function useProfiles(args: {

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}): UseQueryResult<Array<[Profile](https://portal.thirdweb.com/references/typescript/v5/Profile)>>;

`

### Parameters

##### args

#### Type

`let args: { client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient) };

`

### Returns

##### Return Type

`let returnType: UseQueryResult<Array<[Profile](https://portal.thirdweb.com/references/typescript/v5/Profile)>>;

`

 A React Query result containing the linked profiles for the connected in-app account. This hook will only run if the connected wallet supports account linking.
## usePostOnRampQuote

 When buying a token with fiat currency - It only involes doing on-ramp if the on-ramp provider supports buying the given destination token directly.

 If the on-ramp provider does not support buying the destination token directly, user can be sent an intermediate token with fiat currency from the on-ramp provider which can be swapped to destination token onchain.

`usePostOnRampQuote` hook is used to get the quote for swapping the on-ramp token to destination token.

 When you get a "Buy with Fiat" status of type `"CRYPTO_SWAP_REQUIRED"` from the [useBuyWithFiatStatus](https://portal.thirdweb.com/references/typescript/v5/useBuyWithFiatStatus) hook, you can use `usePostOnRampQuote` hook to get the quote of type [BuyWithCryptoQuote](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoQuote) for swapping the on-ramp token to destination token to complete the step-2 of the process.

 Once you have the quote, you can start the Swap process by following the same steps as mentioned in the [useBuyWithCryptoQuote](https://portal.thirdweb.com/references/typescript/v5/useBuyWithCryptoQuote) documentation.

##### Signature

`function usePostOnRampQuote(

params?: [GetPostOnRampQuoteParams](https://portal.thirdweb.com/references/typescript/v5/GetPostOnRampQuoteParams),

queryOptions?: PostOnRampQuoteQueryOptions,

): UseQueryResult<[BuyWithCryptoQuote](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoQuote)>;

`

### Parameters

##### params

optional

 object of type [GetPostOnRampQuoteParams](https://portal.thirdweb.com/references/typescript/v5/GetPostOnRampQuoteParams)

#### Type

`let params: {

buyWithFiatStatus: [BuyWithFiatStatus](https://portal.thirdweb.com/references/typescript/v5/BuyWithFiatStatus);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

};

`

##### queryOptions

optional

#### Type

`let queryOptions: PostOnRampQuoteQueryOptions;

`

### Returns

##### Return Type

`let returnType: UseQueryResult<[BuyWithCryptoQuote](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoQuote)>;

`

 Object of type [BuyWithCryptoQuote](https://portal.thirdweb.com/references/typescript/v5/BuyWithCryptoQuote) which contains the information about the quote such as processing fees, estimated time, converted token amounts, etc.
## useReadContract

### Signature#1

 A hook to read state from a contract that automatically updates when the contract changes.

 You can use raw read calls or read [ extensions](https://portal.thirdweb.com/react/v5/extensions) to read from a contract.

#### Example

`import { getContract } from "thirdweb";

import { sepolia } from "thirdweb/chains";

import { useReadContract } from "thirdweb/react";

const contract = getContract({

 client,

 address: "0x...",

 chain: sepolia,

});

const { data, isLoading } = useReadContract({

 contract,

 method: "function tokenURI(uint256 tokenId) returns (string)"

 params: [1n],

});

`

##### Signature

`function useReadContract(

options: WithPickedOnceQueryOptions<

[ReadContractOptions](https://portal.thirdweb.com/references/typescript/v5/ReadContractOptions)<TAbi, TMethod>

 >,

): UseQueryResult<

[ReadContractResult](https://portal.thirdweb.com/references/typescript/v5/ReadContractResult)<

ParseMethod<ParseMethod<TAbi, TMethod>>["outputs"]

 >

>;

`

#### Parameters

##### options

 The options for reading from a contract

##### Type

`let options: WithPickedOnceQueryOptions<

[ReadContractOptions](https://portal.thirdweb.com/references/typescript/v5/ReadContractOptions)<TAbi, TMethod>

>;

`

#### Returns

##### Return Type

`let returnType: UseQueryResult<

[ReadContractResult](https://portal.thirdweb.com/references/typescript/v5/ReadContractResult)<

ParseMethod<ParseMethod<TAbi, TMethod>>["outputs"]

 >

>;

`

 a UseQueryResult object.

### Signature#2

 A hook to read state from a contract that automatically updates when the contract changes. You can use raw read calls or read [ extensions](https://portal.thirdweb.com/react/v5/extensions) to read from a contract.

#### Example

 Read a contract extension let you do complex contract queries with less code.

`import { useReadContract } from "thirdweb/react";

import { getOwnedNFTs } form "thirdweb/extensions/erc721";

const { data, isLoading } = useReadContract(getOwnedNFTs, { contract, owner: address });

`

##### Signature

`function useReadContract(

extension: Extension<TAbi, TParams, TResult>,

options: WithPickedOnceQueryOptions<

[BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<TParams, TAbi>

 >,

): UseQueryResult<TResult>;

`

#### Parameters

##### extension

 An extension to call.

##### Type

`let extension: Extension<TAbi, TParams, TResult>;

`

##### options

 The read extension params.

##### Type

`let options: WithPickedOnceQueryOptions<

[BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<TParams, TAbi>

>;

`

#### Returns

##### Return Type

`let returnType: UseQueryResult<TResult>;

`

 a UseQueryResult object.
## useSendBatchTransaction

 A hook to send a transaction.

### Example

`import { useSendBatchTransaction } from "thirdweb/react";

const { mutate: sendBatch, data: transactionResult } =

useSendBatchTransaction();

// later

sendBatch([tx1, tx2]);

`

##### Signature

`` function useSendBatchTransaction(): UseMutationResult<

 {

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

maxBlocksWaitTime?: number;

readonly transactionHash: `0x${string}`;

 },

Error,

Array<[PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)>

>;

 ``

### Returns

##### Return Type

`` let returnType: UseMutationResult<

 {

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

maxBlocksWaitTime?: number;

readonly transactionHash: `0x${string}`;

 },

Error,

Array<[PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)>

>;

 ``

 A mutation object to send a transaction.
## useSendAndConfirmTransaction

 A hook to send a transaction.

### Example

`import { useSendAndConfirmTransaction } from "thirdweb/react";

const { mutate: sendAndConfirmTx, data: transactionReceipt } =

useSendAndConfirmTransaction();

// later

sendAndConfirmTx(tx);

`

####  Gasless usage with [ thirdweb Engine](https://portal.thirdweb.com/engine)

`import { useSendAndConfirmTransaction } from "thirdweb/react";

const mutation = useSendAndConfirmTransaction({

 gasless: {

 provider: "engine",

 relayerUrl:

"https://thirdweb.engine-***.thirdweb.com/relayer/***",

 relayerForwarderAddress: "0x...",

 },

});

`

####  Gasless usage with OpenZeppelin

`import { useSendAndConfirmTransaction } from "thirdweb/react";

const mutation = useSendAndConfirmTransaction({

 gasless: {

 provider: "openzeppelin",

 relayerUrl: "https://...",

 relayerForwarderAddress: "0x...",

 },

});

`

##### Signature

`function useSendAndConfirmTransaction(

config: SendAndConfirmTransactionConfig,

): UseMutationResult<[TransactionReceipt](https://portal.thirdweb.com/references/typescript/v5/TransactionReceipt), Error, [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)>;

`

### Parameters

##### config

#### Type

`let config: SendAndConfirmTransactionConfig;

`

### Returns

##### Return Type

`let returnType: UseMutationResult<

[TransactionReceipt](https://portal.thirdweb.com/references/typescript/v5/TransactionReceipt),

Error,

[PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)

>;

`

 A mutation object to send a transaction.
## useSendTransaction

 A hook to send a transaction with from the user's connected wallet.

 You can send a transaction with a [ prepared contract call](https://portal.thirdweb.com/references/typescript/v5/prepareContractCall) , a [ prepared transaction](https://portal.thirdweb.com/references/typescript/v5/prepareTransaction) , or using a write [ Extension](https://portal.thirdweb.com/react/v5/extensions) .

### Example

####  Sending a prepared contract call

`import { useSendTransaction } from "thirdweb/react";

import { getContract, prepareContractCall } from "thirdweb";

import { sepolia } from "thirdweb/chains";

const contract = getContract({

 address: "0x...",

 chain: sepolia,

 client,

});

const { mutate: sendTx, data: transactionResult } =

useSendTransaction();

const onClick = () => {

const transaction = prepareContractCall({

 contract,

 method: "function transfer(address to, uint256 value)",

 params: [to, value],

 });

sendTx(transaction);

};

`

####  Using a write extension

`import { useSendTransaction } from "thirdweb/react";

import { mintTo } from "thirdweb/extensions/erc721";

const { mutate: sendTx, data: transactionResult } =

useSendTransaction();

const onClick = () => {

const transaction = mintTo({

 contract,

 to: "0x...",

 nft: {

 name: "NFT Name",

 description: "NFT Description",

 image: "https://example.com/image.png",

 },

 });

sendTx(transaction);

};

`

####  Sending a prepared transaction

`import { useSendTransaction } from "thirdweb/react";

import { prepareTransaction } from "thirdweb";

import { sepolia } from "thirdweb/chains";

const { mutate: sendTx, data: transactionResult } =

useSendTransaction();

const onClick = () => {

// Send 0.1 SepoliaETH to an address

const transaction = prepareTransaction({

 to: "0x...",

 value: toWei("0.1"),

 chain: sepolia,

 client: thirdwebClient,

 });

sendTx(transaction);

};

`

##### Signature

`` function useSendTransaction(

config: [SendTransactionConfig](https://portal.thirdweb.com/references/typescript/v5/SendTransactionConfig),

): UseMutationResult<

 {

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

maxBlocksWaitTime?: number;

readonly transactionHash: `0x${string}`;

 },

Error,

[PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)

>;

 ``

### Parameters

##### config

 Configuration for the `useSendTransaction` hook. Refer to [SendTransactionConfig](https://portal.thirdweb.com/references/typescript/v5/SendTransactionConfig) for more details.

#### Type

`let config: {

gasless?: [GaslessOptions](https://portal.thirdweb.com/references/typescript/v5/GaslessOptions);

payModal?: [SendTransactionPayModalConfig](https://portal.thirdweb.com/references/typescript/v5/SendTransactionPayModalConfig);

};

`

### Returns

##### Return Type

`` let returnType: UseMutationResult<

 {

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

maxBlocksWaitTime?: number;

readonly transactionHash: `0x${string}`;

 },

Error,

[PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)

>;

 ``

 A UseMutationResult object to send a transaction.
## useSimulateTransaction

 A hook to simulate a transaction.

### Example

`import { useSimulateTransaction } from "thirdweb/react";

const { mutate: simulateTx } = useSimulateTransaction();

// later

const result = await simulateTx(tx);

`

##### Signature

`function useSimulateTransaction(): UseMutationResult<

any,

Error,

[SimulateOptions](https://portal.thirdweb.com/references/typescript/v5/SimulateOptions)<abi, abiFn>

>;

`

### Returns

##### Return Type

`let returnType: UseMutationResult<

any,

Error,

[SimulateOptions](https://portal.thirdweb.com/references/typescript/v5/SimulateOptions)<abi, abiFn>

>;

`

 A mutation object to simulate a transaction.
## useSetActiveWallet

 A hook that lets you set the active wallet.

### Example

`import { useSetActiveWallet } from "thirdweb/react";

const setActiveWallet = useSetActiveWallet();

// later in your code

await setActiveWallet(wallet);

`

##### Signature

`function useSetActiveWallet(): (

activeWallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet),

) => Promise<void>;

`

### Returns

##### Return Type

`let returnType: (activeWallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)) => Promise<void>;

`

 A function that lets you set the active wallet.
## useSocialProfiles

 Fetches the wallet's available social profiles.

### Example

`import { useSocialProfiles } from "thirdweb/react";

const { data: profiles } = useSocialProfiles({

 client,

 address: "0x...",

});

`

##### Signature

`function useSocialProfiles(options: {

address: undefined | string;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

}): UseQueryResult<Array<[SocialProfile](https://portal.thirdweb.com/references/typescript/v5/SocialProfile)>, Error>;

`

### Parameters

##### options

 The options to use when fetching the social profiles.

#### Type

`let options: { address: undefined | string; client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient) };

`

### Returns

##### Return Type

`let returnType: UseQueryResult<Array<[SocialProfile](https://portal.thirdweb.com/references/typescript/v5/SocialProfile)>, Error>;

`

 A React Query result containing the social profiles.
## useSwitchActiveWalletChain

 Switch to blockchain with given chain id in the active wallet.

### Example

`import { useSwitchActiveWalletChain } from "thirdweb/react";

import { sepolia } from "thirdweb/chains";

const switchChain = useSwitchActiveWalletChain();

// later in your code

<button onClick={() => switchChain(sepolia)}>Switch Chain</button>;

`

##### Signature

`function useSwitchActiveWalletChain(): (

chain: Readonly,

) => Promise<void>;

`

### Returns

##### Return Type

`let returnType: (chain: Readonly) => Promise<void>;

`

 A function to switch to blockchain with given chain id in the active wallet.
## useUnlinkProfile

 Unlinks a web2 or web3 profile currently connected in-app or ecosystem account. _When a profile is unlinked from the account, it will no longer be able to be used to sign into the account._

### Example

####  Unlinking an email account

`import { useUnlinkProfile } from "thirdweb/react";

const { data: connectedProfiles, isLoading } = useProfiles({

 client: props.client,

});

const { mutate: unlinkProfile } = useUnlinkProfile();

const onClick = () => {

unlinkProfile({

 client,

// Select any other profile you want to unlink

 profileToUnlink: connectedProfiles[1],

 });

};

`

##### Signature

`function useUnlinkProfile(): UseMutationResult<

void,

Error,

 { client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient); profileToUnlink: [Profile](https://portal.thirdweb.com/references/typescript/v5/Profile) },

unknown

>;

`

### Returns

##### Return Type

`let returnType: UseMutationResult<

void,

Error,

 { client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient); profileToUnlink: [Profile](https://portal.thirdweb.com/references/typescript/v5/Profile) },

unknown

>;

`
## useWaitForReceipt

 A hook to wait for a transaction receipt.

### Example

`import { useWaitForReceipt } from "thirdweb/react";

const { data: receipt, isLoading } = useWaitForReceipt({

 client,

 chain,

 transactionHash,

});

`

##### Signature

`` function useWaitForReceipt(

options:

| undefined

| {

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

maxBlocksWaitTime?: number;

readonly transactionHash: `0x${string}`;

 },

): UseQueryResult<TransactionReceipt>;

 ``

### Parameters

##### options

 The options for waiting for a transaction receipt.

#### Type

`` let options:

| undefined

| {

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

maxBlocksWaitTime?: number;

readonly transactionHash: `0x${string}`;

 };

 ``

### Returns

##### Return Type

`let returnType: UseQueryResult<TransactionReceipt>;

`

 a query object.
## useWalletImage

 Returns the wallet icon for the provided wallet id.

### Example

`import { useWalletImage } from "thirdweb/react";

const { data: walletImage } = useWalletImage("io.metamask");

return <img src={walletImage} alt="MetaMask logo" />;

`

##### Signature

`function useWalletImage(

id: undefined | [WalletId](https://portal.thirdweb.com/references/typescript/v5/WalletId),

): UseQueryResult<string, Error>;

`

### Parameters

##### id

#### Type

`let id: undefined | [WalletId](https://portal.thirdweb.com/references/typescript/v5/WalletId);

`

### Returns

##### Return Type

`let returnType: UseQueryResult<string, Error>;

`
## useWalletDetailsModal

 Hook to open the Wallet Details Modal that shows various information about the connected wallet and allows users to perform various actions like sending funds, receiving funds, switching networks, Buying tokens, etc.

### Example

####  Basic usage

`import { createThirdwebClient } from "thirdweb";

import { useWalletDetailsModal } from "thirdweb/react";

const client = createThirdwebClient({

 clientId: "<your_client_id>",

});

function Example() {

const detailsModal = useWalletDetailsModal();

function handleClick() {

 detailsModal.open({ client, theme: "light" });

 }

return <button onClick={handleClick}> Show Wallet Details </button>;

}

`

####  Callback for when the modal is closed

`detailsModal.open({

 client,

onClose: (screen: string) => console.log({ screen }),

});

`

##### Signature

`function useWalletDetailsModal(): {

open: (props: [UseWalletDetailsModalOptions](https://portal.thirdweb.com/references/typescript/v5/UseWalletDetailsModalOptions)) => void;

};

`

### Returns

##### Return Type

`let returnType: {

open: (props: [UseWalletDetailsModalOptions](https://portal.thirdweb.com/references/typescript/v5/UseWalletDetailsModalOptions)) => void;

};

`
## useWalletBalance

 Fetch the balance of a wallet in native currency or for a specific token. Leave `tokenAddress` undefined to fetch the native token balance.

### Example

####  Fetching the native token balance

`import { useWalletBalance } from "thirdweb/react";

const { data, isLoading, isError } = useWalletBalance({

 chain,

 address,

 client,

});

console.log("balance", data?.displayValue, data?.symbol);

`

####  Fetching a specific token balance

`import { useWalletBalance } from "thirdweb/react";

const tokenAddress = "0x..."; // the ERC20 token address

const { data, isLoading, isError } = useWalletBalance({

 chain,

 address,

 client,

 tokenAddress,

});

console.log("balance", data?.displayValue, data?.symbol);

`

##### Signature

`function useWalletBalance(

options: {

address: undefined | string;

chain: undefined | Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

tokenAddress?: string;

 },

queryOptions?: UseWalletBalanceQueryOptions,

): UseQueryResult<GetWalletBalanceResult>;

`

### Parameters

##### options

 GetWalletBalanceOptions - The options for fetching the wallet balance.

#### Type

`let options: {

address: undefined | string;

chain: undefined | Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

tokenAddress?: string;

};

`

##### queryOptions

optional

#### Type

`let queryOptions: UseWalletBalanceQueryOptions;

`

### Returns

##### Return Type

`let returnType: UseQueryResult<GetWalletBalanceResult>;

`

 GetWalletBalanceResult The result of the query.
## useWalletInfo

 Returns the wallet info for the provided wallet id.

### Example

`import { useWalletInfo } from "thirdweb/react";

const { data: walletInfo } = useWalletInfo("io.metamask");

console.log("wallet name", walletInfo?.name);

`

##### Signature

`function useWalletInfo(

id: undefined | [WalletId](https://portal.thirdweb.com/references/typescript/v5/WalletId),

): UseQueryResult<[WalletInfo](https://portal.thirdweb.com/references/typescript/v5/WalletInfo), Error>;

`

### Parameters

##### id

#### Type

`let id: undefined | [WalletId](https://portal.thirdweb.com/references/typescript/v5/WalletId);

`

### Returns

##### Return Type

`let returnType: UseQueryResult<[WalletInfo](https://portal.thirdweb.com/references/typescript/v5/WalletInfo), Error>;

`
## verifyContractWalletSignature

### Example

`import { verifyContractWalletSignature } from 'thirdweb/auth';

const isValid = await verifyContractWalletSignature({

 message: '0x..',

 signature: '0x..',

 address: '0x...',

 chain: ...,

 client: ...,

});

`

##### Signature

`` function verifyContractWalletSignature(__namedParameters: {

accountFactory?: {

address: string;

verificationCalldata: `0x${string}`;

 };

address: string;

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

message: Message;

signature: string | Uint8Array<ArrayBufferLike>;

}): Promise<boolean>;

 ``

### Parameters

##### \_\_namedParameters

#### Type

`` let __namedParameters: {

accountFactory?: {

address: string;

verificationCalldata: `0x${string}`;

 };

address: string;

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

message: Message;

signature: string | Uint8Array<ArrayBufferLike>;

};

 ``

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 A boolean indicating whether the signature is valid.
## verifyEOASignature

 Verifies the signature of a message using an Ethereum account's EOA (Externally Owned Account).

### Example

`import { verifyEOASignature } from "thirdweb/auth";

const isValid = await verifyEOASignature({

 message: "0x1234567890123456789012345678901234567890",

 signature: "0x1234567890123456789012345678901234567890",

 address: "0x1234567890123456789012345678901234567890",

});

`

##### Signature

`function verifyEOASignature(

options: [VerifyEOASignatureParams](https://portal.thirdweb.com/references/typescript/v5/VerifyEOASignatureParams),

): Promise<boolean>;

`

### Parameters

##### options

 The options for verifying the signature.

#### Type

`let options: {

address: string;

message: string | Message;

signature: string | Uint8Array;

};

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 A boolean indicating whether the signature is valid.
## verifySignature

 Verifies the signature based on the provided options. Handles smart contract wallet signatures and EOA signatures. _IMPORTANT: in order to check smart contract signatures, a chain and client must be provided. Or, you can use the `verifyContractWalletSignature` function directly if all signatures will be from smart accounts._

 verifyContractWalletSignature

### Example

`import { verifySignature } from "thirdweb/auth";

const isValid = await verifySignature({

 message: "Your message to sign",

 signature:

"0x91db0222ec371a8c18d3b187a6d2e77789bffca1b96826ef6b8708e0d4a66c80312fc3ae95b8fbc147265abf539bb6f360152be61a0e1411d7f5771a599e769a1c",

 address: "0xda9C7A86AeE76701FC1c23ae548e8E93Ba3e42A5",

 client: thirdwebClient,

 chain: chain,

});

`

##### Signature

`` function verifySignature(options: {

accountFactory?: {

address: string;

verificationCalldata: `0x${string}`;

 };

address: string;

chain?: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

client?: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

message: Message & (Message | undefined);

signature: (string | Uint8Array<ArrayBufferLike>) &

 (undefined | string | Uint8Array<ArrayBufferLike>);

}): Promise<boolean>;

 ``

### Parameters

##### options

 The options for signature verification.

#### Type

`` let options: {

accountFactory?: {

address: string;

verificationCalldata: `0x${string}`;

 };

address: string;

chain?: Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

client?: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

message: Message & (Message | undefined);

signature: (string | Uint8Array<ArrayBufferLike>) &

 (undefined | string | Uint8Array<ArrayBufferLike>);

};

 ``

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 A boolean indicating whether the signature is valid or not.
## verifyTypedData

### Example

`import { verifyTypedData } from "thirdweb/utils";

const isValid = await verifyTypedData({

 address: "0x...",

 signature: "0x...",

 client,

 chain,

 domain: {

 name: "Ether Mail",

 version: "1",

 chainId: 1,

 verifyingContract: "0x0000000000000000000000000000000000000000",

 },

 primaryType: "Mail",

 types: {

 Person: [

 { name: "name", type: "string" },

 { name: "wallet", type: "address" },

 ],

 Mail: [

 { name: "from", type: "Person" },

 { name: "to", type: "Person" },

 { name: "contents", type: "string" },

 ],

 },

 message: {

 from: {

 name: "Cow",

 wallet: "0xCD2a3d9F938E13CD947Ec05AbC7FE734Df8DD826",

 },

 to: {

 name: "Bob",

 wallet: "0xbBbBBBBbbBBBbbbBbbBbbbbBBbBbbbbBbBbbBBbB",

 },

 contents: "Hello, Bob!",

 },

});

`

##### Signature

`function verifyTypedData(

__namedParameters: [VerifyTypedDataParams](https://portal.thirdweb.com/references/typescript/v5/VerifyTypedDataParams)<typedData, primaryType>,

): Promise<boolean>;

`

### Parameters

##### \_\_namedParameters

#### Type

`let __namedParameters: [VerifyTypedDataParams](https://portal.thirdweb.com/references/typescript/v5/VerifyTypedDataParams)<typedData, primaryType>;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 A promise that resolves to `true` if the signature is valid, or `false` otherwise.
## verifyContract

 Verifies a contract by performing the following steps:

* Resolves the implementation of the contract.
* Extracts the IPFS URI from the contract bytecode.
* Downloads the contract source code from the IPFS URI.
* Fetches the source files from the compiler metadata.
* Compiles the contract source code using the Solidity compiler.
* Fetches the constructor parameters if not provided.
* Sends a request to the contract verification API to verify the contract source code.

### Example

`import { getContract } from "thirdweb/contract";

import { verifyContract } from "thirdweb/contract";

const contract = getContract({ ... });

const verificationResult = await verifyContract({

 contract,

 explorerApiUrl: "https://api.polygonscan.com/api",

 explorerApiKey: "YOUR_API_KEY",

});

console.log(verificationResult);

`

##### Signature

`function verifyContract(

options: VerifyContractOptions,

): Promise<string | Array<string>>;

`

### Parameters

##### options

 The options for contract verification.

#### Type

`let options: VerifyContractOptions;

`

### Returns

##### Return Type

`let returnType: Promise<string | Array<string>>;

`

 A promise that resolves to the verification result.
## canExecute

 Simulate the `execute` method of the Vote contract, to check if you can execute a proposal

### Example

`import { canExecute } from "thirdweb/extensions/vote";

const executable = await canExecute({ contract, proposalId });

`

##### Signature

`function canExecute(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<{ proposalId: bigint }>,

): Promise<boolean>;

`

### Parameters

##### options

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<{ proposalId: bigint }>;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 boolean - `true` if the proposal is executable, else `false`
## castVoteBySig

 Prepares a transaction to call the "castVoteBySig" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { castVoteBySig } from "thirdweb/extensions/vote";

const transaction = castVoteBySig({

 contract,

 proposalId: ...,

 support: ...,

 v: ...,

 r: ...,

 s: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function castVoteBySig(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [CastVoteBySigParams](https://portal.thirdweb.com/references/typescript/v5/CastVoteBySigParams)

| { asyncParams: () => Promise<[CastVoteBySigParams](https://portal.thirdweb.com/references/typescript/v5/CastVoteBySigParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "castVoteBySig" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [CastVoteBySigParams](https://portal.thirdweb.com/references/typescript/v5/CastVoteBySigParams)

| { asyncParams: () => Promise<[CastVoteBySigParams](https://portal.thirdweb.com/references/typescript/v5/CastVoteBySigParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## castVote

 Prepares a transaction to call the "castVote" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { castVote } from "thirdweb/extensions/vote";

const transaction = castVote({

 contract,

 proposalId: ...,

 support: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function castVote(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[CastVoteParams](https://portal.thirdweb.com/references/typescript/v5/CastVoteParams) | { asyncParams: () => Promise<[CastVoteParams](https://portal.thirdweb.com/references/typescript/v5/CastVoteParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "castVote" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[CastVoteParams](https://portal.thirdweb.com/references/typescript/v5/CastVoteParams) | { asyncParams: () => Promise<[CastVoteParams](https://portal.thirdweb.com/references/typescript/v5/CastVoteParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## castVoteWithReason

 Prepares a transaction to call the "castVoteWithReason" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { castVoteWithReason } from "thirdweb/extensions/vote";

const transaction = castVoteWithReason({

 contract,

 proposalId: ...,

 support: ...,

 reason: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function castVoteWithReason(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [CastVoteWithReasonParams](https://portal.thirdweb.com/references/typescript/v5/CastVoteWithReasonParams)

| { asyncParams: () => Promise<[CastVoteWithReasonParams](https://portal.thirdweb.com/references/typescript/v5/CastVoteWithReasonParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "castVoteWithReason" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [CastVoteWithReasonParams](https://portal.thirdweb.com/references/typescript/v5/CastVoteWithReasonParams)

| { asyncParams: () => Promise<[CastVoteWithReasonParams](https://portal.thirdweb.com/references/typescript/v5/CastVoteWithReasonParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## execute

 Prepares a transaction to call the "execute" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { execute } from "thirdweb/extensions/vote";

const transaction = execute({

 contract,

 targets: ...,

 values: ...,

 calldatas: ...,

 descriptionHash: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function execute(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[ExecuteParams](https://portal.thirdweb.com/references/typescript/v5/ExecuteParams) | { asyncParams: () => Promise<[ExecuteParams](https://portal.thirdweb.com/references/typescript/v5/ExecuteParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "execute" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[ExecuteParams](https://portal.thirdweb.com/references/typescript/v5/ExecuteParams) | { asyncParams: () => Promise<[ExecuteParams](https://portal.thirdweb.com/references/typescript/v5/ExecuteParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## castVoteWithReasonAndParamsBySig

 Prepares a transaction to call the "castVoteWithReasonAndParamsBySig" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { castVoteWithReasonAndParamsBySig } from "thirdweb/extensions/vote";

const transaction = castVoteWithReasonAndParamsBySig({

 contract,

 proposalId: ...,

 support: ...,

 reason: ...,

 params: ...,

 v: ...,

 r: ...,

 s: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function castVoteWithReasonAndParamsBySig(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [CastVoteWithReasonAndParamsBySigParams](https://portal.thirdweb.com/references/typescript/v5/CastVoteWithReasonAndParamsBySigParams)

| {

asyncParams: () => Promise<[CastVoteWithReasonAndParamsBySigParams](https://portal.thirdweb.com/references/typescript/v5/CastVoteWithReasonAndParamsBySigParams)>;

 }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "castVoteWithReasonAndParamsBySig" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [CastVoteWithReasonAndParamsBySigParams](https://portal.thirdweb.com/references/typescript/v5/CastVoteWithReasonAndParamsBySigParams)

| {

asyncParams: () => Promise<[CastVoteWithReasonAndParamsBySigParams](https://portal.thirdweb.com/references/typescript/v5/CastVoteWithReasonAndParamsBySigParams)>;

 }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## castVoteWithReasonAndParams

 Prepares a transaction to call the "castVoteWithReasonAndParams" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { castVoteWithReasonAndParams } from "thirdweb/extensions/vote";

const transaction = castVoteWithReasonAndParams({

 contract,

 proposalId: ...,

 support: ...,

 reason: ...,

 params: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function castVoteWithReasonAndParams(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [CastVoteWithReasonAndParamsParams](https://portal.thirdweb.com/references/typescript/v5/CastVoteWithReasonAndParamsParams)

| {

asyncParams: () => Promise<[CastVoteWithReasonAndParamsParams](https://portal.thirdweb.com/references/typescript/v5/CastVoteWithReasonAndParamsParams)>;

 }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "castVoteWithReasonAndParams" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [CastVoteWithReasonAndParamsParams](https://portal.thirdweb.com/references/typescript/v5/CastVoteWithReasonAndParamsParams)

| { asyncParams: () => Promise<[CastVoteWithReasonAndParamsParams](https://portal.thirdweb.com/references/typescript/v5/CastVoteWithReasonAndParamsParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## getAll

 Get all proposals from a Vote contract with some extra info attached for each proposal (current state and votes)

### Example

`import { getAll } from "thirdweb/extension/getAll";

const allProposals = await getAll({ contract });

`

##### Signature

`function getAll(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<Array<[ProposalItem](https://portal.thirdweb.com/references/typescript/v5/ProposalItem)>>;

`

### Parameters

##### options

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: {

description: string;

endBlock: bigint;

executions: Array<{

nativeTokenValue: bigint | undefined;

toAddress: string | undefined;

transactionData: [Hex](https://portal.thirdweb.com/references/typescript/v5/Hex) | undefined;

 }>;

proposalId: bigint;

proposer: string;

startBlock: bigint;

state: number;

stateLabel: string | undefined;

votes: ProposalVoteInfo;

};

`

 An array containing proposals data
## getAllProposals

 Calls the "getAllProposals" function on the contract.

### Example

`import { getAllProposals } from "thirdweb/extensions/vote";

const result = await getAllProposals({

 contract,

});

`

##### Signature

`` function getAllProposals(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)) : Promise<readonly Array<{ calldatas: readonly Array<`0x${string}`>; description: string; endBlock: bigint; proposalId: bigint; proposer: string; signatures: readonly Array<string>; startBlock: bigint; targets: readonly Array<string>; values: readonly Array<bigint> }>>

 ``

### Parameters

##### options

 The options for the getAllProposals function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`` let returnType: Promise<readonly Array<{ calldatas: readonly Array<`0x${string}`>; description: string; endBlock: bigint; proposalId: bigint; proposer: string; signatures: readonly Array<string>; startBlock: bigint; targets: readonly Array<string>; values: readonly Array<bigint> }>>

 ``

 The parsed result of the function call.
## executeProposal

 Execute a Proposal

### Example

`import { executeProposal } from "thirdweb/extensions/vote";

const transaction = executeProposal({ contract, proposalId });

const tx = await sendTransaction({ transaction, account });

`

##### Signature

`function executeProposal(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<{ proposalId: bigint }>,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<{ proposalId: bigint }>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 a prepared transaction for the `execute` method
## getProposalVoteCounts

 Get the info about Against, For and Abstain votes of a proposal

### Example

`import { getProposalVoteCounts } from "thirdweb/extensions/vote";

const data = await getProposalVoteCounts({ contract, proposalId });

// Example result

{

for: 12000000000000000000n, // 12 tokens (with a decimals of 18) were used to vote "for"

against: 7000000000000000000n, // 7 tokens (with a decimals of 18) were used to vote "against"

abstain: 0n, // no user has voted abstain on this proposal

}

`

##### Signature

`function getProposalVoteCounts(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ProposalVotesParams](https://portal.thirdweb.com/references/typescript/v5/ProposalVotesParams)>,

): Promise<ProposalVoteInfo>;

`

### Parameters

##### options

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ProposalVotesParams](https://portal.thirdweb.com/references/typescript/v5/ProposalVotesParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<ProposalVoteInfo>;

`

 the object containing the info about Against, For and Abstain votes of a proposal Note: the count is displayed in "wei"
## getVotes

 Calls the "getVotes" function on the contract.

### Example

`import { getVotes } from "thirdweb/extensions/vote";

const result = await getVotes({

 contract,

 account: ...,

 blockNumber: ...,

});

`

##### Signature

`function getVotes(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetVotesParams](https://portal.thirdweb.com/references/typescript/v5/GetVotesParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the getVotes function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetVotesParams](https://portal.thirdweb.com/references/typescript/v5/GetVotesParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## getVotesWithParams

 Calls the "getVotesWithParams" function on the contract.

### Example

`import { getVotesWithParams } from "thirdweb/extensions/vote";

const result = await getVotesWithParams({

 contract,

 account: ...,

 blockNumber: ...,

 params: ...,

});

`

##### Signature

`function getVotesWithParams(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetVotesWithParamsParams](https://portal.thirdweb.com/references/typescript/v5/GetVotesWithParamsParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the getVotesWithParams function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[GetVotesWithParamsParams](https://portal.thirdweb.com/references/typescript/v5/GetVotesWithParamsParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## hashProposal

 Calls the "hashProposal" function on the contract.

### Example

`import { hashProposal } from "thirdweb/extensions/vote";

const result = await hashProposal({

 contract,

 targets: ...,

 values: ...,

 calldatas: ...,

 descriptionHash: ...,

});

`

##### Signature

`function hashProposal(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[HashProposalParams](https://portal.thirdweb.com/references/typescript/v5/HashProposalParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the hashProposal function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[HashProposalParams](https://portal.thirdweb.com/references/typescript/v5/HashProposalParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## hasVoted

 Calls the "hasVoted" function on the contract.

### Example

`import { hasVoted } from "thirdweb/extensions/vote";

const result = await hasVoted({

 contract,

 proposalId: ...,

 account: ...,

});

`

##### Signature

`function hasVoted(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[HasVotedParams](https://portal.thirdweb.com/references/typescript/v5/HasVotedParams)>,

): Promise<boolean>;

`

### Parameters

##### options

 The options for the hasVoted function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[HasVotedParams](https://portal.thirdweb.com/references/typescript/v5/HasVotedParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

 The parsed result of the function call.
## proposalDeadline

 Calls the "proposalDeadline" function on the contract.

### Example

`import { proposalDeadline } from "thirdweb/extensions/vote";

const result = await proposalDeadline({

 contract,

 proposalId: ...,

});

`

##### Signature

`function proposalDeadline(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ProposalDeadlineParams](https://portal.thirdweb.com/references/typescript/v5/ProposalDeadlineParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the proposalDeadline function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ProposalDeadlineParams](https://portal.thirdweb.com/references/typescript/v5/ProposalDeadlineParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## proposalIndex

 Calls the "proposalIndex" function on the contract.

### Example

`import { proposalIndex } from "thirdweb/extensions/vote";

const result = await proposalIndex({

 contract,

});

`

##### Signature

`function proposalIndex(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the proposalIndex function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## proposalExists

 Check if a proposal exists based on a given proposalId

### Example

`` import { proposalExists } from "thirdweb/extensions/vote";

// Check if the proposal with proposalId `4` exists

const exists = await proposalExists({ contract, proposalId: 4n }); // either `true` or `false`

 ``

##### Signature

`function proposalExists(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[StateParams](https://portal.thirdweb.com/references/typescript/v5/StateParams)>,

): Promise<boolean>;

`

### Parameters

##### options

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[StateParams](https://portal.thirdweb.com/references/typescript/v5/StateParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<boolean>;

`

`true` if the proposal exists, else `false`
## proposalSnapshot

 Calls the "proposalSnapshot" function on the contract.

### Example

`import { proposalSnapshot } from "thirdweb/extensions/vote";

const result = await proposalSnapshot({

 contract,

 proposalId: ...,

});

`

##### Signature

`function proposalSnapshot(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ProposalSnapshotParams](https://portal.thirdweb.com/references/typescript/v5/ProposalSnapshotParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the proposalSnapshot function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ProposalSnapshotParams](https://portal.thirdweb.com/references/typescript/v5/ProposalSnapshotParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## proposalVotes

 Calls the "proposalVotes" function on the contract.

### Example

`import { proposalVotes } from "thirdweb/extensions/vote";

const result = await proposalVotes({

 contract,

 proposalId: ...,

});

`

##### Signature

`function proposalVotes(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ProposalVotesParams](https://portal.thirdweb.com/references/typescript/v5/ProposalVotesParams)>,

): Promise<readonly [bigint, bigint, bigint]>;

`

### Parameters

##### options

 The options for the proposalVotes function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ProposalVotesParams](https://portal.thirdweb.com/references/typescript/v5/ProposalVotesParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<readonly [bigint, bigint, bigint]>;

`

 The parsed result of the function call.
## proposalThreshold

 Calls the "proposalThreshold" function on the contract.

### Example

`import { proposalThreshold } from "thirdweb/extensions/vote";

const result = await proposalThreshold({

 contract,

});

`

##### Signature

`function proposalThreshold(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the proposalThreshold function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## proposals

 Calls the "proposals" function on the contract.

### Example

`import { proposals } from "thirdweb/extensions/vote";

const result = await proposals({

 contract,

 key: ...,

});

`

##### Signature

`function proposals(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ProposalsParams](https://portal.thirdweb.com/references/typescript/v5/ProposalsParams)>,

): Promise<readonly [bigint, string, bigint, bigint, string]>;

`

### Parameters

##### options

 The options for the proposals function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[ProposalsParams](https://portal.thirdweb.com/references/typescript/v5/ProposalsParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<

readonly [bigint, string, bigint, bigint, string]

>;

`

 The parsed result of the function call.
## propose

 Prepares a transaction to call the "propose" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { propose } from "thirdweb/extensions/vote";

const transaction = propose({

 contract,

 targets: ...,

 values: ...,

 calldatas: ...,

 description: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function propose(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[ProposeParams](https://portal.thirdweb.com/references/typescript/v5/ProposeParams) | { asyncParams: () => Promise<[ProposeParams](https://portal.thirdweb.com/references/typescript/v5/ProposeParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "propose" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[ProposeParams](https://portal.thirdweb.com/references/typescript/v5/ProposeParams) | { asyncParams: () => Promise<[ProposeParams](https://portal.thirdweb.com/references/typescript/v5/ProposeParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## quorumDenominator

 Calls the "quorumDenominator" function on the contract.

### Example

`import { quorumDenominator } from "thirdweb/extensions/vote";

const result = await quorumDenominator({

 contract,

});

`

##### Signature

`function quorumDenominator(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the quorumDenominator function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## quorumNumeratorByBlockNumber

 Calls the "quorumDenominator" function on the contract with an extra param called `blockNumber` . This extension is similar to the `quorumDenominator` extension, except that it takes in a bigint (blockNumber)

### Example

`import { quorumNumeratorByBlockNumber } from "thirdweb/extensions/vote";

const result = await quorumNumeratorByBlockNumber({

 contract,

 blockNumber: 13232234232n,

});

`

##### Signature

`function quorumNumeratorByBlockNumber(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<{ blockNumber: bigint }>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the quorumDenominator function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<{ blockNumber: bigint }>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## relay

 Prepares a transaction to call the "relay" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { relay } from "thirdweb/extensions/vote";

const transaction = relay({

 contract,

 target: ...,

 value: ...,

 data: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function relay(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[RelayParams](https://portal.thirdweb.com/references/typescript/v5/RelayParams) | { asyncParams: () => Promise<[RelayParams](https://portal.thirdweb.com/references/typescript/v5/RelayParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "relay" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

[RelayParams](https://portal.thirdweb.com/references/typescript/v5/RelayParams) | { asyncParams: () => Promise<[RelayParams](https://portal.thirdweb.com/references/typescript/v5/RelayParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## setProposalThreshold

 Prepares a transaction to call the "setProposalThreshold" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { setProposalThreshold } from "thirdweb/extensions/vote";

const transaction = setProposalThreshold({

 contract,

 newProposalThreshold: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setProposalThreshold(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetProposalThresholdParams](https://portal.thirdweb.com/references/typescript/v5/SetProposalThresholdParams)

| { asyncParams: () => Promise<[SetProposalThresholdParams](https://portal.thirdweb.com/references/typescript/v5/SetProposalThresholdParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setProposalThreshold" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetProposalThresholdParams](https://portal.thirdweb.com/references/typescript/v5/SetProposalThresholdParams)

| { asyncParams: () => Promise<[SetProposalThresholdParams](https://portal.thirdweb.com/references/typescript/v5/SetProposalThresholdParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## setVotingDelay

 Prepares a transaction to call the "setVotingDelay" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { setVotingDelay } from "thirdweb/extensions/vote";

const transaction = setVotingDelay({

 contract,

 newVotingDelay: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setVotingDelay(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetVotingDelayParams](https://portal.thirdweb.com/references/typescript/v5/SetVotingDelayParams)

| { asyncParams: () => Promise<[SetVotingDelayParams](https://portal.thirdweb.com/references/typescript/v5/SetVotingDelayParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setVotingDelay" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetVotingDelayParams](https://portal.thirdweb.com/references/typescript/v5/SetVotingDelayParams)

| { asyncParams: () => Promise<[SetVotingDelayParams](https://portal.thirdweb.com/references/typescript/v5/SetVotingDelayParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## state

 Calls the "state" function on the contract.

### Example

`import { state } from "thirdweb/extensions/vote";

const result = await state({

 contract,

 proposalId: ...,

});

`

##### Signature

`function state(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[StateParams](https://portal.thirdweb.com/references/typescript/v5/StateParams)>,

): Promise<number>;

`

### Parameters

##### options

 The options for the state function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[StateParams](https://portal.thirdweb.com/references/typescript/v5/StateParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<number>;

`

 The parsed result of the function call.
## setVotingPeriod

 Prepares a transaction to call the "setVotingPeriod" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { setVotingPeriod } from "thirdweb/extensions/vote";

const transaction = setVotingPeriod({

 contract,

 newVotingPeriod: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function setVotingPeriod(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetVotingPeriodParams](https://portal.thirdweb.com/references/typescript/v5/SetVotingPeriodParams)

| { asyncParams: () => Promise<[SetVotingPeriodParams](https://portal.thirdweb.com/references/typescript/v5/SetVotingPeriodParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "setVotingPeriod" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [SetVotingPeriodParams](https://portal.thirdweb.com/references/typescript/v5/SetVotingPeriodParams)

| { asyncParams: () => Promise<[SetVotingPeriodParams](https://portal.thirdweb.com/references/typescript/v5/SetVotingPeriodParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## token

 Calls the "token" function on the contract.

### Example

`import { token } from "thirdweb/extensions/vote";

const result = await token({

 contract,

});

`

##### Signature

`function token(options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)): Promise<string>;

`

### Parameters

##### options

 The options for the token function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<string>;

`

 The parsed result of the function call.
## quorum

 Calls the "quorum" function on the contract.

### Example

`import { quorum } from "thirdweb/extensions/vote";

const result = await quorum({

 contract,

 blockNumber: ...,

});

`

##### Signature

`function quorum(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[QuorumParams](https://portal.thirdweb.com/references/typescript/v5/QuorumParams)>,

): Promise<bigint>;

`

### Parameters

##### options

 The options for the quorum function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<[QuorumParams](https://portal.thirdweb.com/references/typescript/v5/QuorumParams)>;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## votingDelay

 Calls the "votingDelay" function on the contract.

### Example

`import { votingDelay } from "thirdweb/extensions/vote";

const result = await votingDelay({

 contract,

});

`

##### Signature

`function votingDelay(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the votingDelay function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## updateQuorumNumerator

 Prepares a transaction to call the "updateQuorumNumerator" function on the contract.

### Example

`import { sendTransaction } from "thirdweb";

import { updateQuorumNumerator } from "thirdweb/extensions/vote";

const transaction = updateQuorumNumerator({

 contract,

 newQuorumNumerator: ...,

 overrides: {

...

 }

});

// Send the transaction

await sendTransaction({ transaction, account });

`

##### Signature

`function updateQuorumNumerator(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [UpdateQuorumNumeratorParams](https://portal.thirdweb.com/references/typescript/v5/UpdateQuorumNumeratorParams)

| { asyncParams: () => Promise<[UpdateQuorumNumeratorParams](https://portal.thirdweb.com/references/typescript/v5/UpdateQuorumNumeratorParams)> }

 >,

): [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<any, AbiFunction, [PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)>;

`

### Parameters

##### options

 The options for the "updateQuorumNumerator" function.

#### Type

`let options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions)<

| [UpdateQuorumNumeratorParams](https://portal.thirdweb.com/references/typescript/v5/UpdateQuorumNumeratorParams)

| { asyncParams: () => Promise<[UpdateQuorumNumeratorParams](https://portal.thirdweb.com/references/typescript/v5/UpdateQuorumNumeratorParams)> }

>;

`

### Returns

##### Return Type

`let returnType: [PreparedTransaction](https://portal.thirdweb.com/references/typescript/v5/PreparedTransaction)<

any,

AbiFunction,

[PrepareTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/PrepareTransactionOptions)

>;

`

 A prepared transaction object.
## votingPeriod

 Calls the "votingPeriod" function on the contract.

### Example

`import { votingPeriod } from "thirdweb/extensions/vote";

const result = await votingPeriod({

 contract,

});

`

##### Signature

`function votingPeriod(

options: [BaseTransactionOptions](https://portal.thirdweb.com/references/typescript/v5/BaseTransactionOptions),

): Promise<bigint>;

`

### Parameters

##### options

 The options for the votingPeriod function.

#### Type

`let options: { contract: [ThirdwebContract](https://portal.thirdweb.com/references/typescript/v5/ThirdwebContract)<abi> } & T;

`

### Returns

##### Return Type

`let returnType: Promise<bigint>;

`

 The parsed result of the function call.
## waitForReceipt

 Waits for the transaction receipt of a given transaction hash on a specific contract.

### Example

`import { waitForReceipt } from "thirdweb";

const receipt = await waitForReceipt({

 client,

 chain,

 transactionHash: "0x123...",

});

`

##### Signature

`` function waitForReceipt(options: {

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

maxBlocksWaitTime?: number;

readonly transactionHash: `0x${string}`;

}): Promise<[TransactionReceipt](https://portal.thirdweb.com/references/typescript/v5/TransactionReceipt)>;

 ``

### Parameters

##### options

 The options for waiting for the receipt. By default, it's 100 blocks.

#### Type

`` let options: {

chain: Readonly;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

maxBlocksWaitTime?: number;

readonly transactionHash: `0x${string}`;

};

 ``

### Returns

##### Return Type

`let returnType: {

blobGasPrice?: quantity;

blobGasUsed?: quantity;

blockHash: Hash;

blockNumber: quantity;

contractAddress: Address | null | undefined;

cumulativeGasUsed: quantity;

effectiveGasPrice: quantity;

from: Address;

gasUsed: quantity;

logs: Array<Log<quantity, index, false>>;

logsBloom: Hex;

root?: Hash;

status: status;

to: Address | null;

transactionHash: Hash;

transactionIndex: index;

type: type;

};

`

 A promise that resolves with the transaction receipt.
## walletConnect

 Creates a wallet that allows connecting to any wallet that supports the WalletConnect protocol.

### Example

`import { walletConnect } from "thirdweb/wallets";

const wallet = walletConnect();

const account = await wallet.connect({

 client,

});

`

##### Signature

`function walletConnect(): [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)<"walletConnect">;

`

### Returns

##### Return Type

`let returnType: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)<"walletConnect">;

`

 The created smart wallet.
## waitForUserOpReceipt

 Wait for the user operation to be mined.

### Example

`import { waitForUserOpReceipt } from "thirdweb/wallets/smart";

const receipt = await waitForUserOpReceipt({

 chain,

 client,

 userOpHash,

});

`

##### Signature

`` function waitForUserOpReceipt(

args: BundlerOptions & {

intervalMs?: number;

timeoutMs?: number;

userOpHash: `0x${string}`;

 },

): Promise<[TransactionReceipt](https://portal.thirdweb.com/references/typescript/v5/TransactionReceipt)>;

 ``

### Parameters

##### args

 The options and user operation hash

#### Type

`` let args: BundlerOptions & {

intervalMs?: number;

timeoutMs?: number;

userOpHash: `0x${string}`;

};

 ``

### Returns

##### Return Type

`let returnType: {

blobGasPrice?: quantity;

blobGasUsed?: quantity;

blockHash: Hash;

blockNumber: quantity;

contractAddress: Address | null | undefined;

cumulativeGasUsed: quantity;

effectiveGasPrice: quantity;

from: Address;

gasUsed: quantity;

logs: Array<Log<quantity, index, false>>;

logsBloom: Hex;

root?: Hash;

status: status;

to: Address | null;

transactionHash: Hash;

transactionIndex: index;

type: type;

};

`

* The transaction receipt
## watchBlockNumber

 Watches the block number for a specific chain.

### Example

`import { watchBlockNumber } from "thirdweb";

const unwatch = watchBlockNumber({

 client,

 chainId,

onNewBlockNumber: (blockNumber) => {

// do something with the block number

 },

onError: (err) => {

// do something if getting the block number fails

 },

});

// later stop watching

unwatch();

`

##### Signature

`function watchBlockNumber(opts: [WatchBlockNumberOptions](https://portal.thirdweb.com/references/typescript/v5/WatchBlockNumberOptions)): () => void;

`

### Parameters

##### opts

 The options for watching the block number.

#### Type

`let opts: {

chain: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

latestBlockNumber?: bigint;

onError?: (error: Error) => void;

onNewBlockNumber: (blockNumber: bigint) => void;

overPollRatio?: number;

};

`

### Returns

##### Return Type

`let returnType: () => void;

`

 The unwatch function.
## watchContractEvents

 Listens for contract events from the blockchain.

### Example

####  Listen to all events for a contract

`import { watchContractEvents } from "thirdweb";

const unwatch = watchContractEvents({

 contract: myContract,

onEvents: (events) => {

// do something with the events

 },

});

`

####  Listen to specific events for a contract

`import { prepareEvent, watchContractEvents } from "thirdweb";

const myEvent = prepareEvent({

 event: "event MyEvent(uint256 myArg)",

});

const events = await watchContractEvents({

 contract: myContract,

 events: [myEvent],

onEvents: (events) => {

// do something with the events

 },

});

`

##### Signature

`` function watchContractEvents(options: {

contract: Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<abi, `0x${string}`>>;

events?: abiEvents;

latestBlockNumber?: bigint;

onEvents: (

events: [ParseEventLogsResult](https://portal.thirdweb.com/references/typescript/v5/ParseEventLogsResult)<abiEvents, TStrict>,

 ) => void;

strict?: TStrict;

}): () => void;

 ``

### Parameters

##### options

 The options for retrieving contract events.

#### Type

`` let options: {

contract: Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<abi, `0x${string}`>>;

events?: abiEvents;

latestBlockNumber?: bigint;

onEvents: (

events: [ParseEventLogsResult](https://portal.thirdweb.com/references/typescript/v5/ParseEventLogsResult)<abiEvents, TStrict>,

 ) => void;

strict?: TStrict;

};

 ``

### Returns

##### Return Type

`let returnType: () => void;

`

 The unwatch function.
## AccountAddress

### Example

####  Basic usage

`import { AccountProvider, AccountAddress } from "thirdweb/react";

<AccountProvider

address="0x12345674b599ce99958242b3D3741e7b01841DF3"

client={TW_CLIENT}

>

 <AccountAddress />

</AccountProvider>;

`

 Result:

`<span>0x12345674b599ce99958242b3D3741e7b01841DF3</span>

`

####  Shorten the address

`import { AccountProvider, AccountAddress } from "thirdweb/react";

import { shortenAddress } from "thirdweb/utils";

<AccountProvider

address="0x12345674b599ce99958242b3D3741e7b01841DF3"

client={TW_CLIENT}

>

 <AccountAddress formatFn={shortenAddress} />

</AccountProvider>;

`

 Result:

`<span>0x1234...1DF3</span>

`

##### Signature

`function AccountAddress(

__namedParameters: [AccountAddressProps](https://portal.thirdweb.com/references/typescript/v5/AccountAddressProps),

): Element;

`

### Parameters

##### \_\_namedParameters

#### Type

`let __namedParameters: {about : string,accessKey : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,className : string,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",formatFn : (str: string) => string,hidden : boolean,id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,nonce : string,onAbort : ReactEventHandler<HTMLSpanElement>,onAbortCapture : ReactEventHandler<HTMLSpanElement>,onAnimationEnd : AnimationEventHandler<HTMLSpanElement>,onAnimationEndCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationIteration : AnimationEventHandler<HTMLSpanElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationStart : AnimationEventHandler<HTMLSpanElement>,onAnimationStartCapture : AnimationEventHandler<HTMLSpanElement>,onAuxClick : MouseEventHandler<HTMLSpanElement>,onAuxClickCapture : MouseEventHandler<HTMLSpanElement>,onBeforeInput : FormEventHandler<HTMLSpanElement>,onBeforeInputCapture : FormEventHandler<HTMLSpanElement>,onBeforeToggle : ToggleEventHandler<HTMLSpanElement>,onBlur : FocusEventHandler<HTMLSpanElement>,onBlurCapture : FocusEventHandler<HTMLSpanElement>,onCanPlay : ReactEventHandler<HTMLSpanElement>,onCanPlayCapture : ReactEventHandler<HTMLSpanElement>,onCanPlayThrough : ReactEventHandler<HTMLSpanElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLSpanElement>,onChange : FormEventHandler<HTMLSpanElement>,onChangeCapture : FormEventHandler<HTMLSpanElement>,onClick : MouseEventHandler<HTMLSpanElement>,onClickCapture : MouseEventHandler<HTMLSpanElement>,onCompositionEnd : CompositionEventHandler<HTMLSpanElement>,onCompositionEndCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionStart : CompositionEventHandler<HTMLSpanElement>,onCompositionStartCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdate : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLSpanElement>,onContextMenu : MouseEventHandler<HTMLSpanElement>,onContextMenuCapture : MouseEventHandler<HTMLSpanElement>,onCopy : ClipboardEventHandler<HTMLSpanElement>,onCopyCapture : ClipboardEventHandler<HTMLSpanElement>,onCut : ClipboardEventHandler<HTMLSpanElement>,onCutCapture : ClipboardEventHandler<HTMLSpanElement>,onDoubleClick : MouseEventHandler<HTMLSpanElement>,onDoubleClickCapture : MouseEventHandler<HTMLSpanElement>,onDrag : DragEventHandler<HTMLSpanElement>,onDragCapture : DragEventHandler<HTMLSpanElement>,onDragEnd : DragEventHandler<HTMLSpanElement>,onDragEndCapture : DragEventHandler<HTMLSpanElement>,onDragEnter : DragEventHandler<HTMLSpanElement>,onDragEnterCapture : DragEventHandler<HTMLSpanElement>,onDragExit : DragEventHandler<HTMLSpanElement>,onDragExitCapture : DragEventHandler<HTMLSpanElement>,onDragLeave : DragEventHandler<HTMLSpanElement>,onDragLeaveCapture : DragEventHandler<HTMLSpanElement>,onDragOver : DragEventHandler<HTMLSpanElement>,onDragOverCapture : DragEventHandler<HTMLSpanElement>,onDragStart : DragEventHandler<HTMLSpanElement>,onDragStartCapture : DragEventHandler<HTMLSpanElement>,onDrop : DragEventHandler<HTMLSpanElement>,onDropCapture : DragEventHandler<HTMLSpanElement>,onDurationChange : ReactEventHandler<HTMLSpanElement>,onDurationChangeCapture : ReactEventHandler<HTMLSpanElement>,onEmptied : ReactEventHandler<HTMLSpanElement>,onEmptiedCapture : ReactEventHandler<HTMLSpanElement>,onEncrypted : ReactEventHandler<HTMLSpanElement>,onEncryptedCapture : ReactEventHandler<HTMLSpanElement>,onEnded : ReactEventHandler<HTMLSpanElement>,onEndedCapture : ReactEventHandler<HTMLSpanElement>,onError : ReactEventHandler<HTMLSpanElement>,onErrorCapture : ReactEventHandler<HTMLSpanElement>,onFocus : FocusEventHandler<HTMLSpanElement>,onFocusCapture : FocusEventHandler<HTMLSpanElement>,onGotPointerCapture : PointerEventHandler<HTMLSpanElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onInput : FormEventHandler<HTMLSpanElement>,onInputCapture : FormEventHandler<HTMLSpanElement>,onInvalid : FormEventHandler<HTMLSpanElement>,onInvalidCapture : FormEventHandler<HTMLSpanElement>,onKeyDown : KeyboardEventHandler<HTMLSpanElement>,onKeyDownCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyPress : KeyboardEventHandler<HTMLSpanElement>,onKeyPressCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyUp : KeyboardEventHandler<HTMLSpanElement>,onKeyUpCapture : KeyboardEventHandler<HTMLSpanElement>,onLoad : ReactEventHandler<HTMLSpanElement>,onLoadCapture : ReactEventHandler<HTMLSpanElement>,onLoadedData : ReactEventHandler<HTMLSpanElement>,onLoadedDataCapture : ReactEventHandler<HTMLSpanElement>,onLoadedMetadata : ReactEventHandler<HTMLSpanElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLSpanElement>,onLoadStart : ReactEventHandler<HTMLSpanElement>,onLoadStartCapture : ReactEventHandler<HTMLSpanElement>,onLostPointerCapture : PointerEventHandler<HTMLSpanElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onMouseDown : MouseEventHandler<HTMLSpanElement>,onMouseDownCapture : MouseEventHandler<HTMLSpanElement>,onMouseEnter : MouseEventHandler<HTMLSpanElement>,onMouseLeave : MouseEventHandler<HTMLSpanElement>,onMouseMove : MouseEventHandler<HTMLSpanElement>,onMouseMoveCapture : MouseEventHandler<HTMLSpanElement>,onMouseOut : MouseEventHandler<HTMLSpanElement>,onMouseOutCapture : MouseEventHandler<HTMLSpanElement>,onMouseOver : MouseEventHandler<HTMLSpanElement>,onMouseOverCapture : MouseEventHandler<HTMLSpanElement>,onMouseUp : MouseEventHandler<HTMLSpanElement>,onMouseUpCapture : MouseEventHandler<HTMLSpanElement>,onPaste : ClipboardEventHandler<HTMLSpanElement>,onPasteCapture : ClipboardEventHandler<HTMLSpanElement>,onPause : ReactEventHandler<HTMLSpanElement>,onPauseCapture : ReactEventHandler<HTMLSpanElement>,onPlay : ReactEventHandler<HTMLSpanElement>,onPlayCapture : ReactEventHandler<HTMLSpanElement>,onPlaying : ReactEventHandler<HTMLSpanElement>,onPlayingCapture : ReactEventHandler<HTMLSpanElement>,onPointerCancel : PointerEventHandler<HTMLSpanElement>,onPointerCancelCapture : PointerEventHandler<HTMLSpanElement>,onPointerDown : PointerEventHandler<HTMLSpanElement>,onPointerDownCapture : PointerEventHandler<HTMLSpanElement>,onPointerEnter : PointerEventHandler<HTMLSpanElement>,onPointerLeave : PointerEventHandler<HTMLSpanElement>,onPointerMove : PointerEventHandler<HTMLSpanElement>,onPointerMoveCapture : PointerEventHandler<HTMLSpanElement>,onPointerOut : PointerEventHandler<HTMLSpanElement>,onPointerOutCapture : PointerEventHandler<HTMLSpanElement>,onPointerOver : PointerEventHandler<HTMLSpanElement>,onPointerOverCapture : PointerEventHandler<HTMLSpanElement>,onPointerUp : PointerEventHandler<HTMLSpanElement>,onPointerUpCapture : PointerEventHandler<HTMLSpanElement>,onProgress : ReactEventHandler<HTMLSpanElement>,onProgressCapture : ReactEventHandler<HTMLSpanElement>,onRateChange : ReactEventHandler<HTMLSpanElement>,onRateChangeCapture : ReactEventHandler<HTMLSpanElement>,onReset : FormEventHandler<HTMLSpanElement>,onResetCapture : FormEventHandler<HTMLSpanElement>,onResize : ReactEventHandler<HTMLSpanElement>,onResizeCapture : ReactEventHandler<HTMLSpanElement>,onScroll : UIEventHandler<HTMLSpanElement>,onScrollCapture : UIEventHandler<HTMLSpanElement>,onSeeked : ReactEventHandler<HTMLSpanElement>,onSeekedCapture : ReactEventHandler<HTMLSpanElement>,onSeeking : ReactEventHandler<HTMLSpanElement>,onSeekingCapture : ReactEventHandler<HTMLSpanElement>,onSelect : ReactEventHandler<HTMLSpanElement>,onSelectCapture : ReactEventHandler<HTMLSpanElement>,onStalled : ReactEventHandler<HTMLSpanElement>,onStalledCapture : ReactEventHandler<HTMLSpanElement>,onSubmit : FormEventHandler<HTMLSpanElement>,onSubmitCapture : FormEventHandler<HTMLSpanElement>,onSuspend : ReactEventHandler<HTMLSpanElement>,onSuspendCapture : ReactEventHandler<HTMLSpanElement>,onTimeUpdate : ReactEventHandler<HTMLSpanElement>,onTimeUpdateCapture : ReactEventHandler<HTMLSpanElement>,onToggle : ToggleEventHandler<HTMLSpanElement>,onTouchCancel : TouchEventHandler<HTMLSpanElement>,onTouchCancelCapture : TouchEventHandler<HTMLSpanElement>,onTouchEnd : TouchEventHandler<HTMLSpanElement>,onTouchEndCapture : TouchEventHandler<HTMLSpanElement>,onTouchMove : TouchEventHandler<HTMLSpanElement>,onTouchMoveCapture : TouchEventHandler<HTMLSpanElement>,onTouchStart : TouchEventHandler<HTMLSpanElement>,onTouchStartCapture : TouchEventHandler<HTMLSpanElement>,onTransitionCancel : TransitionEventHandler<HTMLSpanElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionEnd : TransitionEventHandler<HTMLSpanElement>,onTransitionEndCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionRun : TransitionEventHandler<HTMLSpanElement>,onTransitionRunCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionStart : TransitionEventHandler<HTMLSpanElement>,onTransitionStartCapture : TransitionEventHandler<HTMLSpanElement>,onVolumeChange : ReactEventHandler<HTMLSpanElement>,onVolumeChangeCapture : ReactEventHandler<HTMLSpanElement>,onWaiting : ReactEventHandler<HTMLSpanElement>,onWaitingCapture : ReactEventHandler<HTMLSpanElement>,onWheel : WheelEventHandler<HTMLSpanElement>,onWheelCapture : WheelEventHandler<HTMLSpanElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,radioGroup : string,rel : string,resource : string,results : number,rev : string,role : AriaRole,security : string,slot : string,spellCheck : Booleanish,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,tabIndex : number,title : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",vocab : string}

`

### Returns

##### Return Type

`let returnType: Element;

`

 a `<span>` containing the full wallet address of the account
## AccountAvatar

 The component for showing the avatar of the account. If fetches all the social profiles linked to your wallet, including: Farcaster, ENS, Lens (more to be added) You can choose which social profile you want to display. Defaults to the first item in the list.

### Example

####  Basic usage

`import { AccountProvider, AccountAvatar } from "thirdweb/react";

<AccountProvider address="0x...">

 <AccountAvatar />

</AccountProvider>;

`

 Result: An `<img />` component, if the avatar is resolved successfully

`<img alt="" src="resolved-url-for-the-avatar" />

`

####  Show a loading sign when the avatar is being resolved

`import { AccountProvider, AccountAvatar } from "thirdweb/react";

<AccountProvider address="0x...">

 <AccountAvatar loadingComponent={<YourLoadingComponent />} />

</AccountProvider>;

`

####  Fallback to something when the avatar fails to resolve

`import { AccountProvider, AccountAvatar } from "thirdweb/react";

<AccountProvider address="0x...">

 <AccountAvatar fallbackComponent={<DummyImage />} />

</AccountProvider>;

`

####  Select a social profile to display

 If you wallet associates with more than one social profiles (Lens, Farcaster, ENS, etc.) You can specify which service you want to prioritize using the `socialType` props

`import { AccountProvider, AccountAvatar } from "thirdweb/react";

<AccountProvider address="0x...">

 <AccountAvatar

// Choose between: "farcaster" | "lens" | "ens"

socialType={"ens"}

 />

</AccountProvider>;

`

####  Custom ENS resolver chain

 This component shares the same props with the ENS extension `resolveAvatar`

`import { AccountProvider, AccountAvatar } from "thirdweb/react";

import { base } from "thirdweb/chains";

<AccountProvider address="0x...">

 <AccountAvatar resolverAddress={"0x..."} resolverChain={base} />

</AccountProvider>;

`

####  Custom query options for useQuery

 This component uses `@tanstack-query` 's useQuery internally. You can use the `queryOptions` prop for more fine-grained control

`<AccountAvatar

queryOptions={{

 enabled: isEnabled,

 retry: 3,

 }}

/>;

`

##### Signature

`function AccountAvatar(

__namedParameters: [AccountAvatarProps](https://portal.thirdweb.com/references/typescript/v5/AccountAvatarProps),

): null | Element;

`

### Parameters

##### \_\_namedParameters

#### Type

`let __namedParameters: {about : string,accessKey : string,alt : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,children : ReactNode,className : string,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,crossOrigin : CrossOrigin,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,decoding : "auto" | "async" | "sync",defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",fallbackComponent : Element,fetchPriority : "auto" | "high" | "low",height : string | number,hidden : boolean,id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,loading : "eager" | "lazy",loadingComponent : Element,nonce : string,onAbort : ReactEventHandler<HTMLImageElement>,onAbortCapture : ReactEventHandler<HTMLImageElement>,onAnimationEnd : AnimationEventHandler<HTMLImageElement>,onAnimationEndCapture : AnimationEventHandler<HTMLImageElement>,onAnimationIteration : AnimationEventHandler<HTMLImageElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLImageElement>,onAnimationStart : AnimationEventHandler<HTMLImageElement>,onAnimationStartCapture : AnimationEventHandler<HTMLImageElement>,onAuxClick : MouseEventHandler<HTMLImageElement>,onAuxClickCapture : MouseEventHandler<HTMLImageElement>,onBeforeInput : FormEventHandler<HTMLImageElement>,onBeforeInputCapture : FormEventHandler<HTMLImageElement>,onBeforeToggle : ToggleEventHandler<HTMLImageElement>,onBlur : FocusEventHandler<HTMLImageElement>,onBlurCapture : FocusEventHandler<HTMLImageElement>,onCanPlay : ReactEventHandler<HTMLImageElement>,onCanPlayCapture : ReactEventHandler<HTMLImageElement>,onCanPlayThrough : ReactEventHandler<HTMLImageElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLImageElement>,onChange : FormEventHandler<HTMLImageElement>,onChangeCapture : FormEventHandler<HTMLImageElement>,onClick : MouseEventHandler<HTMLImageElement>,onClickCapture : MouseEventHandler<HTMLImageElement>,onCompositionEnd : CompositionEventHandler<HTMLImageElement>,onCompositionEndCapture : CompositionEventHandler<HTMLImageElement>,onCompositionStart : CompositionEventHandler<HTMLImageElement>,onCompositionStartCapture : CompositionEventHandler<HTMLImageElement>,onCompositionUpdate : CompositionEventHandler<HTMLImageElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLImageElement>,onContextMenu : MouseEventHandler<HTMLImageElement>,onContextMenuCapture : MouseEventHandler<HTMLImageElement>,onCopy : ClipboardEventHandler<HTMLImageElement>,onCopyCapture : ClipboardEventHandler<HTMLImageElement>,onCut : ClipboardEventHandler<HTMLImageElement>,onCutCapture : ClipboardEventHandler<HTMLImageElement>,onDoubleClick : MouseEventHandler<HTMLImageElement>,onDoubleClickCapture : MouseEventHandler<HTMLImageElement>,onDrag : DragEventHandler<HTMLImageElement>,onDragCapture : DragEventHandler<HTMLImageElement>,onDragEnd : DragEventHandler<HTMLImageElement>,onDragEndCapture : DragEventHandler<HTMLImageElement>,onDragEnter : DragEventHandler<HTMLImageElement>,onDragEnterCapture : DragEventHandler<HTMLImageElement>,onDragExit : DragEventHandler<HTMLImageElement>,onDragExitCapture : DragEventHandler<HTMLImageElement>,onDragLeave : DragEventHandler<HTMLImageElement>,onDragLeaveCapture : DragEventHandler<HTMLImageElement>,onDragOver : DragEventHandler<HTMLImageElement>,onDragOverCapture : DragEventHandler<HTMLImageElement>,onDragStart : DragEventHandler<HTMLImageElement>,onDragStartCapture : DragEventHandler<HTMLImageElement>,onDrop : DragEventHandler<HTMLImageElement>,onDropCapture : DragEventHandler<HTMLImageElement>,onDurationChange : ReactEventHandler<HTMLImageElement>,onDurationChangeCapture : ReactEventHandler<HTMLImageElement>,onEmptied : ReactEventHandler<HTMLImageElement>,onEmptiedCapture : ReactEventHandler<HTMLImageElement>,onEncrypted : ReactEventHandler<HTMLImageElement>,onEncryptedCapture : ReactEventHandler<HTMLImageElement>,onEnded : ReactEventHandler<HTMLImageElement>,onEndedCapture : ReactEventHandler<HTMLImageElement>,onError : ReactEventHandler<HTMLImageElement>,onErrorCapture : ReactEventHandler<HTMLImageElement>,onFocus : FocusEventHandler<HTMLImageElement>,onFocusCapture : FocusEventHandler<HTMLImageElement>,onGotPointerCapture : PointerEventHandler<HTMLImageElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLImageElement>,onInput : FormEventHandler<HTMLImageElement>,onInputCapture : FormEventHandler<HTMLImageElement>,onInvalid : FormEventHandler<HTMLImageElement>,onInvalidCapture : FormEventHandler<HTMLImageElement>,onKeyDown : KeyboardEventHandler<HTMLImageElement>,onKeyDownCapture : KeyboardEventHandler<HTMLImageElement>,onKeyPress : KeyboardEventHandler<HTMLImageElement>,onKeyPressCapture : KeyboardEventHandler<HTMLImageElement>,onKeyUp : KeyboardEventHandler<HTMLImageElement>,onKeyUpCapture : KeyboardEventHandler<HTMLImageElement>,onLoad : ReactEventHandler<HTMLImageElement>,onLoadCapture : ReactEventHandler<HTMLImageElement>,onLoadedData : ReactEventHandler<HTMLImageElement>,onLoadedDataCapture : ReactEventHandler<HTMLImageElement>,onLoadedMetadata : ReactEventHandler<HTMLImageElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLImageElement>,onLoadStart : ReactEventHandler<HTMLImageElement>,onLoadStartCapture : ReactEventHandler<HTMLImageElement>,onLostPointerCapture : PointerEventHandler<HTMLImageElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLImageElement>,onMouseDown : MouseEventHandler<HTMLImageElement>,onMouseDownCapture : MouseEventHandler<HTMLImageElement>,onMouseEnter : MouseEventHandler<HTMLImageElement>,onMouseLeave : MouseEventHandler<HTMLImageElement>,onMouseMove : MouseEventHandler<HTMLImageElement>,onMouseMoveCapture : MouseEventHandler<HTMLImageElement>,onMouseOut : MouseEventHandler<HTMLImageElement>,onMouseOutCapture : MouseEventHandler<HTMLImageElement>,onMouseOver : MouseEventHandler<HTMLImageElement>,onMouseOverCapture : MouseEventHandler<HTMLImageElement>,onMouseUp : MouseEventHandler<HTMLImageElement>,onMouseUpCapture : MouseEventHandler<HTMLImageElement>,onPaste : ClipboardEventHandler<HTMLImageElement>,onPasteCapture : ClipboardEventHandler<HTMLImageElement>,onPause : ReactEventHandler<HTMLImageElement>,onPauseCapture : ReactEventHandler<HTMLImageElement>,onPlay : ReactEventHandler<HTMLImageElement>,onPlayCapture : ReactEventHandler<HTMLImageElement>,onPlaying : ReactEventHandler<HTMLImageElement>,onPlayingCapture : ReactEventHandler<HTMLImageElement>,onPointerCancel : PointerEventHandler<HTMLImageElement>,onPointerCancelCapture : PointerEventHandler<HTMLImageElement>,onPointerDown : PointerEventHandler<HTMLImageElement>,onPointerDownCapture : PointerEventHandler<HTMLImageElement>,onPointerEnter : PointerEventHandler<HTMLImageElement>,onPointerLeave : PointerEventHandler<HTMLImageElement>,onPointerMove : PointerEventHandler<HTMLImageElement>,onPointerMoveCapture : PointerEventHandler<HTMLImageElement>,onPointerOut : PointerEventHandler<HTMLImageElement>,onPointerOutCapture : PointerEventHandler<HTMLImageElement>,onPointerOver : PointerEventHandler<HTMLImageElement>,onPointerOverCapture : PointerEventHandler<HTMLImageElement>,onPointerUp : PointerEventHandler<HTMLImageElement>,onPointerUpCapture : PointerEventHandler<HTMLImageElement>,onProgress : ReactEventHandler<HTMLImageElement>,onProgressCapture : ReactEventHandler<HTMLImageElement>,onRateChange : ReactEventHandler<HTMLImageElement>,onRateChangeCapture : ReactEventHandler<HTMLImageElement>,onReset : FormEventHandler<HTMLImageElement>,onResetCapture : FormEventHandler<HTMLImageElement>,onResize : ReactEventHandler<HTMLImageElement>,onResizeCapture : ReactEventHandler<HTMLImageElement>,onScroll : UIEventHandler<HTMLImageElement>,onScrollCapture : UIEventHandler<HTMLImageElement>,onSeeked : ReactEventHandler<HTMLImageElement>,onSeekedCapture : ReactEventHandler<HTMLImageElement>,onSeeking : ReactEventHandler<HTMLImageElement>,onSeekingCapture : ReactEventHandler<HTMLImageElement>,onSelect : ReactEventHandler<HTMLImageElement>,onSelectCapture : ReactEventHandler<HTMLImageElement>,onStalled : ReactEventHandler<HTMLImageElement>,onStalledCapture : ReactEventHandler<HTMLImageElement>,onSubmit : FormEventHandler<HTMLImageElement>,onSubmitCapture : FormEventHandler<HTMLImageElement>,onSuspend : ReactEventHandler<HTMLImageElement>,onSuspendCapture : ReactEventHandler<HTMLImageElement>,onTimeUpdate : ReactEventHandler<HTMLImageElement>,onTimeUpdateCapture : ReactEventHandler<HTMLImageElement>,onToggle : ToggleEventHandler<HTMLImageElement>,onTouchCancel : TouchEventHandler<HTMLImageElement>,onTouchCancelCapture : TouchEventHandler<HTMLImageElement>,onTouchEnd : TouchEventHandler<HTMLImageElement>,onTouchEndCapture : TouchEventHandler<HTMLImageElement>,onTouchMove : TouchEventHandler<HTMLImageElement>,onTouchMoveCapture : TouchEventHandler<HTMLImageElement>,onTouchStart : TouchEventHandler<HTMLImageElement>,onTouchStartCapture : TouchEventHandler<HTMLImageElement>,onTransitionCancel : TransitionEventHandler<HTMLImageElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLImageElement>,onTransitionEnd : TransitionEventHandler<HTMLImageElement>,onTransitionEndCapture : TransitionEventHandler<HTMLImageElement>,onTransitionRun : TransitionEventHandler<HTMLImageElement>,onTransitionRunCapture : TransitionEventHandler<HTMLImageElement>,onTransitionStart : TransitionEventHandler<HTMLImageElement>,onTransitionStartCapture : TransitionEventHandler<HTMLImageElement>,onVolumeChange : ReactEventHandler<HTMLImageElement>,onVolumeChangeCapture : ReactEventHandler<HTMLImageElement>,onWaiting : ReactEventHandler<HTMLImageElement>,onWaitingCapture : ReactEventHandler<HTMLImageElement>,onWheel : WheelEventHandler<HTMLImageElement>,onWheelCapture : WheelEventHandler<HTMLImageElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,queryOptions : Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">,radioGroup : string,referrerPolicy : HTMLAttributeReferrerPolicy,rel : string,resolverAddress : string,resolverChain : Readonly<(ChainOptions) & ({ rpc: string })>,resource : string,results : number,rev : string,role : AriaRole,security : string,sizes : string,slot : string,socialType : "farcaster" | "ens" | "lens",spellCheck : Booleanish,srcSet : string,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,tabIndex : number,title : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",useMap : string,vocab : string,width : string | number}

`

### Returns

##### Return Type

`let returnType: null | Element;

`

 An `<img />` if the avatar is resolved successfully
## AccountBalance

 This component fetches and shows the balance of the wallet address on a given chain. It inherits all the attributes of a HTML `<span>` component, hence you can style it just like how you would style a normal `<span>`

### Example

####  Basic usage

`import { AccountProvider, AccountBalance } from "thirdweb/react";

import { ethereum } from "thirdweb/chains";

<AccountProvider address="0x...">

 <AccountBalance chain={ethereum} />

</AccountProvider>;

`

 Result:

`<span>1.091435 ETH</span>

`

####  Format the balance (round up, shorten etc.)

 The AccountBalance component accepts a `formatFn` which takes in an object of type `AccountBalanceInfo` and outputs a string The function is used to modify the display value of the wallet balance (either in crypto or fiat)

`` import type { AccountBalanceInfo } from "thirdweb/react";

import { formatNumber } from "thirdweb/utils";

const format = (props: AccountInfoBalance):string => `${formatNumber(props.balance, 1)} ${props.symbol.toLowerCase()}`

<AccountBalance formatFn={format} />

 ``

 Result:

`<span>1.1 eth</span> // the balance is rounded up to 1 decimal and the symbol is lowercased

`

####  Show a loading sign when the balance is being fetched

`import { AccountProvider, AccountBalance } from "thirdweb/react";

<AccountProvider address="0x...">

 <AccountBalance chain={ethereum} loadingComponent={<Spinner />} />

</AccountProvider>;

`

####  Fallback to something when the balance fails to resolve

`<AccountProvider address="0x...">

 <AccountBalance

chain={nonExistentChain}

fallbackComponent={"Failed to load"}

 />

</AccountProvider>;

`

####  Custom query options for useQuery

 This component uses `@tanstack-query` 's useQuery internally. You can use the `queryOptions` prop for more fine-grained control

`<AccountBalance

queryOptions={{

 enabled: isEnabled,

 retry: 4,

 }}

/>;

`

##### Signature

`function AccountBalance(

__namedParameters: [AccountBalanceProps](https://portal.thirdweb.com/references/typescript/v5/AccountBalanceProps),

): null | Element;

`

### Parameters

##### \_\_namedParameters

#### Type

`let __namedParameters: {about : string,accessKey : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,chain : Readonly<(ChainOptions) & ({ rpc: string })>,className : string,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",fallbackComponent : Element,formatFn : (props: AccountBalanceInfo) => string,hidden : boolean,id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,loadingComponent : Element,nonce : string,onAbort : ReactEventHandler<HTMLSpanElement>,onAbortCapture : ReactEventHandler<HTMLSpanElement>,onAnimationEnd : AnimationEventHandler<HTMLSpanElement>,onAnimationEndCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationIteration : AnimationEventHandler<HTMLSpanElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationStart : AnimationEventHandler<HTMLSpanElement>,onAnimationStartCapture : AnimationEventHandler<HTMLSpanElement>,onAuxClick : MouseEventHandler<HTMLSpanElement>,onAuxClickCapture : MouseEventHandler<HTMLSpanElement>,onBeforeInput : FormEventHandler<HTMLSpanElement>,onBeforeInputCapture : FormEventHandler<HTMLSpanElement>,onBeforeToggle : ToggleEventHandler<HTMLSpanElement>,onBlur : FocusEventHandler<HTMLSpanElement>,onBlurCapture : FocusEventHandler<HTMLSpanElement>,onCanPlay : ReactEventHandler<HTMLSpanElement>,onCanPlayCapture : ReactEventHandler<HTMLSpanElement>,onCanPlayThrough : ReactEventHandler<HTMLSpanElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLSpanElement>,onChange : FormEventHandler<HTMLSpanElement>,onChangeCapture : FormEventHandler<HTMLSpanElement>,onClick : MouseEventHandler<HTMLSpanElement>,onClickCapture : MouseEventHandler<HTMLSpanElement>,onCompositionEnd : CompositionEventHandler<HTMLSpanElement>,onCompositionEndCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionStart : CompositionEventHandler<HTMLSpanElement>,onCompositionStartCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdate : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLSpanElement>,onContextMenu : MouseEventHandler<HTMLSpanElement>,onContextMenuCapture : MouseEventHandler<HTMLSpanElement>,onCopy : ClipboardEventHandler<HTMLSpanElement>,onCopyCapture : ClipboardEventHandler<HTMLSpanElement>,onCut : ClipboardEventHandler<HTMLSpanElement>,onCutCapture : ClipboardEventHandler<HTMLSpanElement>,onDoubleClick : MouseEventHandler<HTMLSpanElement>,onDoubleClickCapture : MouseEventHandler<HTMLSpanElement>,onDrag : DragEventHandler<HTMLSpanElement>,onDragCapture : DragEventHandler<HTMLSpanElement>,onDragEnd : DragEventHandler<HTMLSpanElement>,onDragEndCapture : DragEventHandler<HTMLSpanElement>,onDragEnter : DragEventHandler<HTMLSpanElement>,onDragEnterCapture : DragEventHandler<HTMLSpanElement>,onDragExit : DragEventHandler<HTMLSpanElement>,onDragExitCapture : DragEventHandler<HTMLSpanElement>,onDragLeave : DragEventHandler<HTMLSpanElement>,onDragLeaveCapture : DragEventHandler<HTMLSpanElement>,onDragOver : DragEventHandler<HTMLSpanElement>,onDragOverCapture : DragEventHandler<HTMLSpanElement>,onDragStart : DragEventHandler<HTMLSpanElement>,onDragStartCapture : DragEventHandler<HTMLSpanElement>,onDrop : DragEventHandler<HTMLSpanElement>,onDropCapture : DragEventHandler<HTMLSpanElement>,onDurationChange : ReactEventHandler<HTMLSpanElement>,onDurationChangeCapture : ReactEventHandler<HTMLSpanElement>,onEmptied : ReactEventHandler<HTMLSpanElement>,onEmptiedCapture : ReactEventHandler<HTMLSpanElement>,onEncrypted : ReactEventHandler<HTMLSpanElement>,onEncryptedCapture : ReactEventHandler<HTMLSpanElement>,onEnded : ReactEventHandler<HTMLSpanElement>,onEndedCapture : ReactEventHandler<HTMLSpanElement>,onError : ReactEventHandler<HTMLSpanElement>,onErrorCapture : ReactEventHandler<HTMLSpanElement>,onFocus : FocusEventHandler<HTMLSpanElement>,onFocusCapture : FocusEventHandler<HTMLSpanElement>,onGotPointerCapture : PointerEventHandler<HTMLSpanElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onInput : FormEventHandler<HTMLSpanElement>,onInputCapture : FormEventHandler<HTMLSpanElement>,onInvalid : FormEventHandler<HTMLSpanElement>,onInvalidCapture : FormEventHandler<HTMLSpanElement>,onKeyDown : KeyboardEventHandler<HTMLSpanElement>,onKeyDownCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyPress : KeyboardEventHandler<HTMLSpanElement>,onKeyPressCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyUp : KeyboardEventHandler<HTMLSpanElement>,onKeyUpCapture : KeyboardEventHandler<HTMLSpanElement>,onLoad : ReactEventHandler<HTMLSpanElement>,onLoadCapture : ReactEventHandler<HTMLSpanElement>,onLoadedData : ReactEventHandler<HTMLSpanElement>,onLoadedDataCapture : ReactEventHandler<HTMLSpanElement>,onLoadedMetadata : ReactEventHandler<HTMLSpanElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLSpanElement>,onLoadStart : ReactEventHandler<HTMLSpanElement>,onLoadStartCapture : ReactEventHandler<HTMLSpanElement>,onLostPointerCapture : PointerEventHandler<HTMLSpanElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onMouseDown : MouseEventHandler<HTMLSpanElement>,onMouseDownCapture : MouseEventHandler<HTMLSpanElement>,onMouseEnter : MouseEventHandler<HTMLSpanElement>,onMouseLeave : MouseEventHandler<HTMLSpanElement>,onMouseMove : MouseEventHandler<HTMLSpanElement>,onMouseMoveCapture : MouseEventHandler<HTMLSpanElement>,onMouseOut : MouseEventHandler<HTMLSpanElement>,onMouseOutCapture : MouseEventHandler<HTMLSpanElement>,onMouseOver : MouseEventHandler<HTMLSpanElement>,onMouseOverCapture : MouseEventHandler<HTMLSpanElement>,onMouseUp : MouseEventHandler<HTMLSpanElement>,onMouseUpCapture : MouseEventHandler<HTMLSpanElement>,onPaste : ClipboardEventHandler<HTMLSpanElement>,onPasteCapture : ClipboardEventHandler<HTMLSpanElement>,onPause : ReactEventHandler<HTMLSpanElement>,onPauseCapture : ReactEventHandler<HTMLSpanElement>,onPlay : ReactEventHandler<HTMLSpanElement>,onPlayCapture : ReactEventHandler<HTMLSpanElement>,onPlaying : ReactEventHandler<HTMLSpanElement>,onPlayingCapture : ReactEventHandler<HTMLSpanElement>,onPointerCancel : PointerEventHandler<HTMLSpanElement>,onPointerCancelCapture : PointerEventHandler<HTMLSpanElement>,onPointerDown : PointerEventHandler<HTMLSpanElement>,onPointerDownCapture : PointerEventHandler<HTMLSpanElement>,onPointerEnter : PointerEventHandler<HTMLSpanElement>,onPointerLeave : PointerEventHandler<HTMLSpanElement>,onPointerMove : PointerEventHandler<HTMLSpanElement>,onPointerMoveCapture : PointerEventHandler<HTMLSpanElement>,onPointerOut : PointerEventHandler<HTMLSpanElement>,onPointerOutCapture : PointerEventHandler<HTMLSpanElement>,onPointerOver : PointerEventHandler<HTMLSpanElement>,onPointerOverCapture : PointerEventHandler<HTMLSpanElement>,onPointerUp : PointerEventHandler<HTMLSpanElement>,onPointerUpCapture : PointerEventHandler<HTMLSpanElement>,onProgress : ReactEventHandler<HTMLSpanElement>,onProgressCapture : ReactEventHandler<HTMLSpanElement>,onRateChange : ReactEventHandler<HTMLSpanElement>,onRateChangeCapture : ReactEventHandler<HTMLSpanElement>,onReset : FormEventHandler<HTMLSpanElement>,onResetCapture : FormEventHandler<HTMLSpanElement>,onResize : ReactEventHandler<HTMLSpanElement>,onResizeCapture : ReactEventHandler<HTMLSpanElement>,onScroll : UIEventHandler<HTMLSpanElement>,onScrollCapture : UIEventHandler<HTMLSpanElement>,onSeeked : ReactEventHandler<HTMLSpanElement>,onSeekedCapture : ReactEventHandler<HTMLSpanElement>,onSeeking : ReactEventHandler<HTMLSpanElement>,onSeekingCapture : ReactEventHandler<HTMLSpanElement>,onSelect : ReactEventHandler<HTMLSpanElement>,onSelectCapture : ReactEventHandler<HTMLSpanElement>,onStalled : ReactEventHandler<HTMLSpanElement>,onStalledCapture : ReactEventHandler<HTMLSpanElement>,onSubmit : FormEventHandler<HTMLSpanElement>,onSubmitCapture : FormEventHandler<HTMLSpanElement>,onSuspend : ReactEventHandler<HTMLSpanElement>,onSuspendCapture : ReactEventHandler<HTMLSpanElement>,onTimeUpdate : ReactEventHandler<HTMLSpanElement>,onTimeUpdateCapture : ReactEventHandler<HTMLSpanElement>,onToggle : ToggleEventHandler<HTMLSpanElement>,onTouchCancel : TouchEventHandler<HTMLSpanElement>,onTouchCancelCapture : TouchEventHandler<HTMLSpanElement>,onTouchEnd : TouchEventHandler<HTMLSpanElement>,onTouchEndCapture : TouchEventHandler<HTMLSpanElement>,onTouchMove : TouchEventHandler<HTMLSpanElement>,onTouchMoveCapture : TouchEventHandler<HTMLSpanElement>,onTouchStart : TouchEventHandler<HTMLSpanElement>,onTouchStartCapture : TouchEventHandler<HTMLSpanElement>,onTransitionCancel : TransitionEventHandler<HTMLSpanElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionEnd : TransitionEventHandler<HTMLSpanElement>,onTransitionEndCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionRun : TransitionEventHandler<HTMLSpanElement>,onTransitionRunCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionStart : TransitionEventHandler<HTMLSpanElement>,onTransitionStartCapture : TransitionEventHandler<HTMLSpanElement>,onVolumeChange : ReactEventHandler<HTMLSpanElement>,onVolumeChangeCapture : ReactEventHandler<HTMLSpanElement>,onWaiting : ReactEventHandler<HTMLSpanElement>,onWaitingCapture : ReactEventHandler<HTMLSpanElement>,onWheel : WheelEventHandler<HTMLSpanElement>,onWheelCapture : WheelEventHandler<HTMLSpanElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,queryOptions : Omit<UseQueryOptions<AccountBalanceInfo, Error, AccountBalanceInfo, readonly Array<unknown>>, "queryKey" | "queryFn">,radioGroup : string,rel : string,resource : string,results : number,rev : string,role : AriaRole,security : string,showBalanceInFiat : "USD" | "CAD" | "GBP" | "EUR" | "JPY" | "AUD" | "NZD",slot : string,spellCheck : Booleanish,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,tabIndex : number,title : string,tokenAddress : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",vocab : string}

`

### Returns

##### Return Type

`let returnType: null | Element;

`
## AccountName

 This component is used to display the name of the account. A "name" in this context is the username, or account of the social profiles that the wallet may have. In case a name is not found or failed to resolve, you can always fallback to displaying the wallet address instead by using the `fallbackComponent` prop.

 This component inherits all attribute of a native HTML `<span>` element, so you can style it just like how you would style a `<span>` .

### Example

####  Basic usage

`import { AccountProvider, AccountName } from "thirdweb/react";

<AccountProvider address="0x1234...3f3f" client={client}>

 <AccountName />

</AccountProvider>;

`

####  Show wallet address while social name is being loaded

`<AccountName loadingComponent={<AccountAddress />} />;

`

####  Fallback to showing wallet address if fail to resolve social name

`<AccountName fallbackComponent={<AccountAddress />} />;

`

####  Transform the account name using `formatFn` prop

`import { isAddress, shortenAddress } from "thirdweb/utils";

import { AccountProvider, AccountName } from "thirdweb/react";

// Let's say we want the name to be capitalized without using CSS

const formatName = (name: string) => name.toUpperCase();

return <AccountName formatFn={formatName} />;

`

####  Custom query options for useQuery

 This component uses `@tanstack-query` 's useQuery internally. You can use the `queryOptions` prop for more fine-grained control

`<AccountName

queryOptions={{

 enabled: isEnabled,

 retry: 3,

 }}

/>;

`

##### Signature

`function AccountName(props: [AccountNameProps](https://portal.thirdweb.com/references/typescript/v5/AccountNameProps)): null | Element;

`

### Parameters

##### props

#### Type

`let props: {about : string,accessKey : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,className : string,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",fallbackComponent : Element,formatFn : (str: string) => string,hidden : boolean,id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,loadingComponent : Element,nonce : string,onAbort : ReactEventHandler<HTMLSpanElement>,onAbortCapture : ReactEventHandler<HTMLSpanElement>,onAnimationEnd : AnimationEventHandler<HTMLSpanElement>,onAnimationEndCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationIteration : AnimationEventHandler<HTMLSpanElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationStart : AnimationEventHandler<HTMLSpanElement>,onAnimationStartCapture : AnimationEventHandler<HTMLSpanElement>,onAuxClick : MouseEventHandler<HTMLSpanElement>,onAuxClickCapture : MouseEventHandler<HTMLSpanElement>,onBeforeInput : FormEventHandler<HTMLSpanElement>,onBeforeInputCapture : FormEventHandler<HTMLSpanElement>,onBeforeToggle : ToggleEventHandler<HTMLSpanElement>,onBlur : FocusEventHandler<HTMLSpanElement>,onBlurCapture : FocusEventHandler<HTMLSpanElement>,onCanPlay : ReactEventHandler<HTMLSpanElement>,onCanPlayCapture : ReactEventHandler<HTMLSpanElement>,onCanPlayThrough : ReactEventHandler<HTMLSpanElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLSpanElement>,onChange : FormEventHandler<HTMLSpanElement>,onChangeCapture : FormEventHandler<HTMLSpanElement>,onClick : MouseEventHandler<HTMLSpanElement>,onClickCapture : MouseEventHandler<HTMLSpanElement>,onCompositionEnd : CompositionEventHandler<HTMLSpanElement>,onCompositionEndCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionStart : CompositionEventHandler<HTMLSpanElement>,onCompositionStartCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdate : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLSpanElement>,onContextMenu : MouseEventHandler<HTMLSpanElement>,onContextMenuCapture : MouseEventHandler<HTMLSpanElement>,onCopy : ClipboardEventHandler<HTMLSpanElement>,onCopyCapture : ClipboardEventHandler<HTMLSpanElement>,onCut : ClipboardEventHandler<HTMLSpanElement>,onCutCapture : ClipboardEventHandler<HTMLSpanElement>,onDoubleClick : MouseEventHandler<HTMLSpanElement>,onDoubleClickCapture : MouseEventHandler<HTMLSpanElement>,onDrag : DragEventHandler<HTMLSpanElement>,onDragCapture : DragEventHandler<HTMLSpanElement>,onDragEnd : DragEventHandler<HTMLSpanElement>,onDragEndCapture : DragEventHandler<HTMLSpanElement>,onDragEnter : DragEventHandler<HTMLSpanElement>,onDragEnterCapture : DragEventHandler<HTMLSpanElement>,onDragExit : DragEventHandler<HTMLSpanElement>,onDragExitCapture : DragEventHandler<HTMLSpanElement>,onDragLeave : DragEventHandler<HTMLSpanElement>,onDragLeaveCapture : DragEventHandler<HTMLSpanElement>,onDragOver : DragEventHandler<HTMLSpanElement>,onDragOverCapture : DragEventHandler<HTMLSpanElement>,onDragStart : DragEventHandler<HTMLSpanElement>,onDragStartCapture : DragEventHandler<HTMLSpanElement>,onDrop : DragEventHandler<HTMLSpanElement>,onDropCapture : DragEventHandler<HTMLSpanElement>,onDurationChange : ReactEventHandler<HTMLSpanElement>,onDurationChangeCapture : ReactEventHandler<HTMLSpanElement>,onEmptied : ReactEventHandler<HTMLSpanElement>,onEmptiedCapture : ReactEventHandler<HTMLSpanElement>,onEncrypted : ReactEventHandler<HTMLSpanElement>,onEncryptedCapture : ReactEventHandler<HTMLSpanElement>,onEnded : ReactEventHandler<HTMLSpanElement>,onEndedCapture : ReactEventHandler<HTMLSpanElement>,onError : ReactEventHandler<HTMLSpanElement>,onErrorCapture : ReactEventHandler<HTMLSpanElement>,onFocus : FocusEventHandler<HTMLSpanElement>,onFocusCapture : FocusEventHandler<HTMLSpanElement>,onGotPointerCapture : PointerEventHandler<HTMLSpanElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onInput : FormEventHandler<HTMLSpanElement>,onInputCapture : FormEventHandler<HTMLSpanElement>,onInvalid : FormEventHandler<HTMLSpanElement>,onInvalidCapture : FormEventHandler<HTMLSpanElement>,onKeyDown : KeyboardEventHandler<HTMLSpanElement>,onKeyDownCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyPress : KeyboardEventHandler<HTMLSpanElement>,onKeyPressCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyUp : KeyboardEventHandler<HTMLSpanElement>,onKeyUpCapture : KeyboardEventHandler<HTMLSpanElement>,onLoad : ReactEventHandler<HTMLSpanElement>,onLoadCapture : ReactEventHandler<HTMLSpanElement>,onLoadedData : ReactEventHandler<HTMLSpanElement>,onLoadedDataCapture : ReactEventHandler<HTMLSpanElement>,onLoadedMetadata : ReactEventHandler<HTMLSpanElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLSpanElement>,onLoadStart : ReactEventHandler<HTMLSpanElement>,onLoadStartCapture : ReactEventHandler<HTMLSpanElement>,onLostPointerCapture : PointerEventHandler<HTMLSpanElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onMouseDown : MouseEventHandler<HTMLSpanElement>,onMouseDownCapture : MouseEventHandler<HTMLSpanElement>,onMouseEnter : MouseEventHandler<HTMLSpanElement>,onMouseLeave : MouseEventHandler<HTMLSpanElement>,onMouseMove : MouseEventHandler<HTMLSpanElement>,onMouseMoveCapture : MouseEventHandler<HTMLSpanElement>,onMouseOut : MouseEventHandler<HTMLSpanElement>,onMouseOutCapture : MouseEventHandler<HTMLSpanElement>,onMouseOver : MouseEventHandler<HTMLSpanElement>,onMouseOverCapture : MouseEventHandler<HTMLSpanElement>,onMouseUp : MouseEventHandler<HTMLSpanElement>,onMouseUpCapture : MouseEventHandler<HTMLSpanElement>,onPaste : ClipboardEventHandler<HTMLSpanElement>,onPasteCapture : ClipboardEventHandler<HTMLSpanElement>,onPause : ReactEventHandler<HTMLSpanElement>,onPauseCapture : ReactEventHandler<HTMLSpanElement>,onPlay : ReactEventHandler<HTMLSpanElement>,onPlayCapture : ReactEventHandler<HTMLSpanElement>,onPlaying : ReactEventHandler<HTMLSpanElement>,onPlayingCapture : ReactEventHandler<HTMLSpanElement>,onPointerCancel : PointerEventHandler<HTMLSpanElement>,onPointerCancelCapture : PointerEventHandler<HTMLSpanElement>,onPointerDown : PointerEventHandler<HTMLSpanElement>,onPointerDownCapture : PointerEventHandler<HTMLSpanElement>,onPointerEnter : PointerEventHandler<HTMLSpanElement>,onPointerLeave : PointerEventHandler<HTMLSpanElement>,onPointerMove : PointerEventHandler<HTMLSpanElement>,onPointerMoveCapture : PointerEventHandler<HTMLSpanElement>,onPointerOut : PointerEventHandler<HTMLSpanElement>,onPointerOutCapture : PointerEventHandler<HTMLSpanElement>,onPointerOver : PointerEventHandler<HTMLSpanElement>,onPointerOverCapture : PointerEventHandler<HTMLSpanElement>,onPointerUp : PointerEventHandler<HTMLSpanElement>,onPointerUpCapture : PointerEventHandler<HTMLSpanElement>,onProgress : ReactEventHandler<HTMLSpanElement>,onProgressCapture : ReactEventHandler<HTMLSpanElement>,onRateChange : ReactEventHandler<HTMLSpanElement>,onRateChangeCapture : ReactEventHandler<HTMLSpanElement>,onReset : FormEventHandler<HTMLSpanElement>,onResetCapture : FormEventHandler<HTMLSpanElement>,onResize : ReactEventHandler<HTMLSpanElement>,onResizeCapture : ReactEventHandler<HTMLSpanElement>,onScroll : UIEventHandler<HTMLSpanElement>,onScrollCapture : UIEventHandler<HTMLSpanElement>,onSeeked : ReactEventHandler<HTMLSpanElement>,onSeekedCapture : ReactEventHandler<HTMLSpanElement>,onSeeking : ReactEventHandler<HTMLSpanElement>,onSeekingCapture : ReactEventHandler<HTMLSpanElement>,onSelect : ReactEventHandler<HTMLSpanElement>,onSelectCapture : ReactEventHandler<HTMLSpanElement>,onStalled : ReactEventHandler<HTMLSpanElement>,onStalledCapture : ReactEventHandler<HTMLSpanElement>,onSubmit : FormEventHandler<HTMLSpanElement>,onSubmitCapture : FormEventHandler<HTMLSpanElement>,onSuspend : ReactEventHandler<HTMLSpanElement>,onSuspendCapture : ReactEventHandler<HTMLSpanElement>,onTimeUpdate : ReactEventHandler<HTMLSpanElement>,onTimeUpdateCapture : ReactEventHandler<HTMLSpanElement>,onToggle : ToggleEventHandler<HTMLSpanElement>,onTouchCancel : TouchEventHandler<HTMLSpanElement>,onTouchCancelCapture : TouchEventHandler<HTMLSpanElement>,onTouchEnd : TouchEventHandler<HTMLSpanElement>,onTouchEndCapture : TouchEventHandler<HTMLSpanElement>,onTouchMove : TouchEventHandler<HTMLSpanElement>,onTouchMoveCapture : TouchEventHandler<HTMLSpanElement>,onTouchStart : TouchEventHandler<HTMLSpanElement>,onTouchStartCapture : TouchEventHandler<HTMLSpanElement>,onTransitionCancel : TransitionEventHandler<HTMLSpanElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionEnd : TransitionEventHandler<HTMLSpanElement>,onTransitionEndCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionRun : TransitionEventHandler<HTMLSpanElement>,onTransitionRunCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionStart : TransitionEventHandler<HTMLSpanElement>,onTransitionStartCapture : TransitionEventHandler<HTMLSpanElement>,onVolumeChange : ReactEventHandler<HTMLSpanElement>,onVolumeChangeCapture : ReactEventHandler<HTMLSpanElement>,onWaiting : ReactEventHandler<HTMLSpanElement>,onWaitingCapture : ReactEventHandler<HTMLSpanElement>,onWheel : WheelEventHandler<HTMLSpanElement>,onWheelCapture : WheelEventHandler<HTMLSpanElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,queryOptions : Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">,radioGroup : string,rel : string,resolverAddress : string,resolverChain : Readonly<(ChainOptions) & ({ rpc: string })>,resource : string,results : number,rev : string,role : AriaRole,security : string,slot : string,socialType : "farcaster" | "ens" | "lens",spellCheck : Booleanish,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,tabIndex : number,title : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",vocab : string}

`

### Returns

##### Return Type

`let returnType: null | Element;

`

 A `<span>` containing the name of the account

`<span>{name}</span>

`
## ChainIcon

 This component tries to resolve the icon of a given chain, then return an image.

### Example

####  Basic usage

`import { ChainProvider, ChainIcon } from "thirdweb/react";

<ChainProvider chain={chain}>

 <ChainIcon />

</ChainProvider>;

`

 Result: An `<img />` component with the src of the icon

`<img src="chain-icon.png" />

`

####  Override the icon with the `iconResolver` prop

 If you already have the icon url, you can skip the network requests and pass it directly to the ChainIcon

`<ChainIcon iconResolver="/ethereum-icon.png" />;

`

 You can also pass in your own custom (async) function that retrieves the icon url

`const getIcon = async () => {

const icon = getIconFromCoinMarketCap(chainId, etc);

return icon;

};

<ChainIcon iconResolver={getIcon} />;

`

####  Show a loading sign while the icon is being loaded

`<ChainIcon loadingComponent={<Spinner />} />;

`

####  Fallback to a dummy image if the chain icon fails to resolve

`<ChainIcon fallbackComponent={<img src="blank-image.png" />} />;

`

####  Usage with queryOptions

 ChainIcon uses useQuery() from tanstack query internally. It allows you to pass a custom queryOptions of your choice for more control of the internal fetching logic

`<ChainIcon queryOptions={{ enabled: someLogic, retry: 3 }} />;

`

##### Signature

`function ChainIcon(__namedParameters: [ChainIconProps](https://portal.thirdweb.com/references/typescript/v5/ChainIconProps)): null | Element;

`

### Parameters

##### \_\_namedParameters

#### Type

`let __namedParameters: {about : string,accessKey : string,alt : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,children : ReactNode,className : string,client : ThirdwebClient,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,crossOrigin : CrossOrigin,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,decoding : "auto" | "async" | "sync",defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",fallbackComponent : Element,fetchPriority : "auto" | "high" | "low",height : string | number,hidden : boolean,iconResolver : string | (() => string) | (() => Promise<string>),id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,loading : "eager" | "lazy",loadingComponent : Element,nonce : string,onAbort : ReactEventHandler<HTMLImageElement>,onAbortCapture : ReactEventHandler<HTMLImageElement>,onAnimationEnd : AnimationEventHandler<HTMLImageElement>,onAnimationEndCapture : AnimationEventHandler<HTMLImageElement>,onAnimationIteration : AnimationEventHandler<HTMLImageElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLImageElement>,onAnimationStart : AnimationEventHandler<HTMLImageElement>,onAnimationStartCapture : AnimationEventHandler<HTMLImageElement>,onAuxClick : MouseEventHandler<HTMLImageElement>,onAuxClickCapture : MouseEventHandler<HTMLImageElement>,onBeforeInput : FormEventHandler<HTMLImageElement>,onBeforeInputCapture : FormEventHandler<HTMLImageElement>,onBeforeToggle : ToggleEventHandler<HTMLImageElement>,onBlur : FocusEventHandler<HTMLImageElement>,onBlurCapture : FocusEventHandler<HTMLImageElement>,onCanPlay : ReactEventHandler<HTMLImageElement>,onCanPlayCapture : ReactEventHandler<HTMLImageElement>,onCanPlayThrough : ReactEventHandler<HTMLImageElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLImageElement>,onChange : FormEventHandler<HTMLImageElement>,onChangeCapture : FormEventHandler<HTMLImageElement>,onClick : MouseEventHandler<HTMLImageElement>,onClickCapture : MouseEventHandler<HTMLImageElement>,onCompositionEnd : CompositionEventHandler<HTMLImageElement>,onCompositionEndCapture : CompositionEventHandler<HTMLImageElement>,onCompositionStart : CompositionEventHandler<HTMLImageElement>,onCompositionStartCapture : CompositionEventHandler<HTMLImageElement>,onCompositionUpdate : CompositionEventHandler<HTMLImageElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLImageElement>,onContextMenu : MouseEventHandler<HTMLImageElement>,onContextMenuCapture : MouseEventHandler<HTMLImageElement>,onCopy : ClipboardEventHandler<HTMLImageElement>,onCopyCapture : ClipboardEventHandler<HTMLImageElement>,onCut : ClipboardEventHandler<HTMLImageElement>,onCutCapture : ClipboardEventHandler<HTMLImageElement>,onDoubleClick : MouseEventHandler<HTMLImageElement>,onDoubleClickCapture : MouseEventHandler<HTMLImageElement>,onDrag : DragEventHandler<HTMLImageElement>,onDragCapture : DragEventHandler<HTMLImageElement>,onDragEnd : DragEventHandler<HTMLImageElement>,onDragEndCapture : DragEventHandler<HTMLImageElement>,onDragEnter : DragEventHandler<HTMLImageElement>,onDragEnterCapture : DragEventHandler<HTMLImageElement>,onDragExit : DragEventHandler<HTMLImageElement>,onDragExitCapture : DragEventHandler<HTMLImageElement>,onDragLeave : DragEventHandler<HTMLImageElement>,onDragLeaveCapture : DragEventHandler<HTMLImageElement>,onDragOver : DragEventHandler<HTMLImageElement>,onDragOverCapture : DragEventHandler<HTMLImageElement>,onDragStart : DragEventHandler<HTMLImageElement>,onDragStartCapture : DragEventHandler<HTMLImageElement>,onDrop : DragEventHandler<HTMLImageElement>,onDropCapture : DragEventHandler<HTMLImageElement>,onDurationChange : ReactEventHandler<HTMLImageElement>,onDurationChangeCapture : ReactEventHandler<HTMLImageElement>,onEmptied : ReactEventHandler<HTMLImageElement>,onEmptiedCapture : ReactEventHandler<HTMLImageElement>,onEncrypted : ReactEventHandler<HTMLImageElement>,onEncryptedCapture : ReactEventHandler<HTMLImageElement>,onEnded : ReactEventHandler<HTMLImageElement>,onEndedCapture : ReactEventHandler<HTMLImageElement>,onError : ReactEventHandler<HTMLImageElement>,onErrorCapture : ReactEventHandler<HTMLImageElement>,onFocus : FocusEventHandler<HTMLImageElement>,onFocusCapture : FocusEventHandler<HTMLImageElement>,onGotPointerCapture : PointerEventHandler<HTMLImageElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLImageElement>,onInput : FormEventHandler<HTMLImageElement>,onInputCapture : FormEventHandler<HTMLImageElement>,onInvalid : FormEventHandler<HTMLImageElement>,onInvalidCapture : FormEventHandler<HTMLImageElement>,onKeyDown : KeyboardEventHandler<HTMLImageElement>,onKeyDownCapture : KeyboardEventHandler<HTMLImageElement>,onKeyPress : KeyboardEventHandler<HTMLImageElement>,onKeyPressCapture : KeyboardEventHandler<HTMLImageElement>,onKeyUp : KeyboardEventHandler<HTMLImageElement>,onKeyUpCapture : KeyboardEventHandler<HTMLImageElement>,onLoad : ReactEventHandler<HTMLImageElement>,onLoadCapture : ReactEventHandler<HTMLImageElement>,onLoadedData : ReactEventHandler<HTMLImageElement>,onLoadedDataCapture : ReactEventHandler<HTMLImageElement>,onLoadedMetadata : ReactEventHandler<HTMLImageElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLImageElement>,onLoadStart : ReactEventHandler<HTMLImageElement>,onLoadStartCapture : ReactEventHandler<HTMLImageElement>,onLostPointerCapture : PointerEventHandler<HTMLImageElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLImageElement>,onMouseDown : MouseEventHandler<HTMLImageElement>,onMouseDownCapture : MouseEventHandler<HTMLImageElement>,onMouseEnter : MouseEventHandler<HTMLImageElement>,onMouseLeave : MouseEventHandler<HTMLImageElement>,onMouseMove : MouseEventHandler<HTMLImageElement>,onMouseMoveCapture : MouseEventHandler<HTMLImageElement>,onMouseOut : MouseEventHandler<HTMLImageElement>,onMouseOutCapture : MouseEventHandler<HTMLImageElement>,onMouseOver : MouseEventHandler<HTMLImageElement>,onMouseOverCapture : MouseEventHandler<HTMLImageElement>,onMouseUp : MouseEventHandler<HTMLImageElement>,onMouseUpCapture : MouseEventHandler<HTMLImageElement>,onPaste : ClipboardEventHandler<HTMLImageElement>,onPasteCapture : ClipboardEventHandler<HTMLImageElement>,onPause : ReactEventHandler<HTMLImageElement>,onPauseCapture : ReactEventHandler<HTMLImageElement>,onPlay : ReactEventHandler<HTMLImageElement>,onPlayCapture : ReactEventHandler<HTMLImageElement>,onPlaying : ReactEventHandler<HTMLImageElement>,onPlayingCapture : ReactEventHandler<HTMLImageElement>,onPointerCancel : PointerEventHandler<HTMLImageElement>,onPointerCancelCapture : PointerEventHandler<HTMLImageElement>,onPointerDown : PointerEventHandler<HTMLImageElement>,onPointerDownCapture : PointerEventHandler<HTMLImageElement>,onPointerEnter : PointerEventHandler<HTMLImageElement>,onPointerLeave : PointerEventHandler<HTMLImageElement>,onPointerMove : PointerEventHandler<HTMLImageElement>,onPointerMoveCapture : PointerEventHandler<HTMLImageElement>,onPointerOut : PointerEventHandler<HTMLImageElement>,onPointerOutCapture : PointerEventHandler<HTMLImageElement>,onPointerOver : PointerEventHandler<HTMLImageElement>,onPointerOverCapture : PointerEventHandler<HTMLImageElement>,onPointerUp : PointerEventHandler<HTMLImageElement>,onPointerUpCapture : PointerEventHandler<HTMLImageElement>,onProgress : ReactEventHandler<HTMLImageElement>,onProgressCapture : ReactEventHandler<HTMLImageElement>,onRateChange : ReactEventHandler<HTMLImageElement>,onRateChangeCapture : ReactEventHandler<HTMLImageElement>,onReset : FormEventHandler<HTMLImageElement>,onResetCapture : FormEventHandler<HTMLImageElement>,onResize : ReactEventHandler<HTMLImageElement>,onResizeCapture : ReactEventHandler<HTMLImageElement>,onScroll : UIEventHandler<HTMLImageElement>,onScrollCapture : UIEventHandler<HTMLImageElement>,onSeeked : ReactEventHandler<HTMLImageElement>,onSeekedCapture : ReactEventHandler<HTMLImageElement>,onSeeking : ReactEventHandler<HTMLImageElement>,onSeekingCapture : ReactEventHandler<HTMLImageElement>,onSelect : ReactEventHandler<HTMLImageElement>,onSelectCapture : ReactEventHandler<HTMLImageElement>,onStalled : ReactEventHandler<HTMLImageElement>,onStalledCapture : ReactEventHandler<HTMLImageElement>,onSubmit : FormEventHandler<HTMLImageElement>,onSubmitCapture : FormEventHandler<HTMLImageElement>,onSuspend : ReactEventHandler<HTMLImageElement>,onSuspendCapture : ReactEventHandler<HTMLImageElement>,onTimeUpdate : ReactEventHandler<HTMLImageElement>,onTimeUpdateCapture : ReactEventHandler<HTMLImageElement>,onToggle : ToggleEventHandler<HTMLImageElement>,onTouchCancel : TouchEventHandler<HTMLImageElement>,onTouchCancelCapture : TouchEventHandler<HTMLImageElement>,onTouchEnd : TouchEventHandler<HTMLImageElement>,onTouchEndCapture : TouchEventHandler<HTMLImageElement>,onTouchMove : TouchEventHandler<HTMLImageElement>,onTouchMoveCapture : TouchEventHandler<HTMLImageElement>,onTouchStart : TouchEventHandler<HTMLImageElement>,onTouchStartCapture : TouchEventHandler<HTMLImageElement>,onTransitionCancel : TransitionEventHandler<HTMLImageElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLImageElement>,onTransitionEnd : TransitionEventHandler<HTMLImageElement>,onTransitionEndCapture : TransitionEventHandler<HTMLImageElement>,onTransitionRun : TransitionEventHandler<HTMLImageElement>,onTransitionRunCapture : TransitionEventHandler<HTMLImageElement>,onTransitionStart : TransitionEventHandler<HTMLImageElement>,onTransitionStartCapture : TransitionEventHandler<HTMLImageElement>,onVolumeChange : ReactEventHandler<HTMLImageElement>,onVolumeChangeCapture : ReactEventHandler<HTMLImageElement>,onWaiting : ReactEventHandler<HTMLImageElement>,onWaitingCapture : ReactEventHandler<HTMLImageElement>,onWheel : WheelEventHandler<HTMLImageElement>,onWheelCapture : WheelEventHandler<HTMLImageElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,queryOptions : Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">,radioGroup : string,referrerPolicy : HTMLAttributeReferrerPolicy,rel : string,resource : string,results : number,rev : string,role : AriaRole,security : string,sizes : string,slot : string,spellCheck : Booleanish,srcSet : string,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,tabIndex : number,title : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",useMap : string,vocab : string,width : string | number}

`

### Returns

##### Return Type

`let returnType: null | Element;

`

 an `<img />` with the src of the chain icon
## ChainName

 This component fetches then shows the name of a chain. It inherits all the attributes of a HTML `<span>` component, hence you can style it just like how you would style a normal `<span>`

### Example

####  Basic usage

`import { ChainProvider, ChainName } from "thirdweb/react";

import { ethereum } from "thirdweb/chains";

<ChainProvider {...props}>

 <ChainName />

</ChainProvider>;

`

 Result:

`<span>Ethereum Mainnet</span>

`

####  Custom name resolver

 By default ChainName will call the thirdweb API to retrieve the chain name. However if you have a different way to fetch the name, you can pass the function to the `nameResolver` prop. Note: nameResolver should either be a string or a function (async) that returns a string.

`async function fetchNameMethod() {

// your own fetching logic

return "the chain name";

}

<ChainName nameResolver={fetchNameMethod} />;

`

 Alternatively you can also pass in a string directly:

`<ChainName nameResolver="ETH Mainnet" />;

`

####  Format the name (capitalize, truncate, etc.)

 The ChainName component accepts a `formatFn` which takes in a string and outputs a string The function is used to modify the name of the chain

`const concatStr = (str: string):string => str + "Network"

<ChainProvider {...props}>

 <ChainName formatFn={concatStr} />

</ChainProvider>

`

 Result:

`<span>Ethereum Mainnet Network</span>

`

####  Show a loading sign when the name is being fetched

`import { ChainProvider, ChainName } from "thirdweb/react";

<ChainProvider {...props}>

 <ChainName loadingComponent={<Spinner />} />

</ChainProvider>;

`

####  Fallback to something when the name fails to resolve

`<ChainProvider {...props}>

 <ChainName fallbackComponent={"Failed to load"} />

</ChainProvider>;

`

####  Custom query options for useQuery

 This component uses `@tanstack-query` 's useQuery internally. You can use the `queryOptions` prop for more fine-grained control

`<ChainName

queryOptions={{

 enabled: isEnabled,

 retry: 4,

 }}

/>;

`

##### Signature

`function ChainName(__namedParameters: [ChainNameProps](https://portal.thirdweb.com/references/typescript/v5/ChainNameProps)): null | Element;

`

### Parameters

##### \_\_namedParameters

#### Type

`let __namedParameters: {about : string,accessKey : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,className : string,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",fallbackComponent : Element,formatFn : (str: string) => string,hidden : boolean,id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,loadingComponent : Element,nameResolver : string | (() => string) | (() => Promise<string>),nonce : string,onAbort : ReactEventHandler<HTMLSpanElement>,onAbortCapture : ReactEventHandler<HTMLSpanElement>,onAnimationEnd : AnimationEventHandler<HTMLSpanElement>,onAnimationEndCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationIteration : AnimationEventHandler<HTMLSpanElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationStart : AnimationEventHandler<HTMLSpanElement>,onAnimationStartCapture : AnimationEventHandler<HTMLSpanElement>,onAuxClick : MouseEventHandler<HTMLSpanElement>,onAuxClickCapture : MouseEventHandler<HTMLSpanElement>,onBeforeInput : FormEventHandler<HTMLSpanElement>,onBeforeInputCapture : FormEventHandler<HTMLSpanElement>,onBeforeToggle : ToggleEventHandler<HTMLSpanElement>,onBlur : FocusEventHandler<HTMLSpanElement>,onBlurCapture : FocusEventHandler<HTMLSpanElement>,onCanPlay : ReactEventHandler<HTMLSpanElement>,onCanPlayCapture : ReactEventHandler<HTMLSpanElement>,onCanPlayThrough : ReactEventHandler<HTMLSpanElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLSpanElement>,onChange : FormEventHandler<HTMLSpanElement>,onChangeCapture : FormEventHandler<HTMLSpanElement>,onClick : MouseEventHandler<HTMLSpanElement>,onClickCapture : MouseEventHandler<HTMLSpanElement>,onCompositionEnd : CompositionEventHandler<HTMLSpanElement>,onCompositionEndCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionStart : CompositionEventHandler<HTMLSpanElement>,onCompositionStartCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdate : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLSpanElement>,onContextMenu : MouseEventHandler<HTMLSpanElement>,onContextMenuCapture : MouseEventHandler<HTMLSpanElement>,onCopy : ClipboardEventHandler<HTMLSpanElement>,onCopyCapture : ClipboardEventHandler<HTMLSpanElement>,onCut : ClipboardEventHandler<HTMLSpanElement>,onCutCapture : ClipboardEventHandler<HTMLSpanElement>,onDoubleClick : MouseEventHandler<HTMLSpanElement>,onDoubleClickCapture : MouseEventHandler<HTMLSpanElement>,onDrag : DragEventHandler<HTMLSpanElement>,onDragCapture : DragEventHandler<HTMLSpanElement>,onDragEnd : DragEventHandler<HTMLSpanElement>,onDragEndCapture : DragEventHandler<HTMLSpanElement>,onDragEnter : DragEventHandler<HTMLSpanElement>,onDragEnterCapture : DragEventHandler<HTMLSpanElement>,onDragExit : DragEventHandler<HTMLSpanElement>,onDragExitCapture : DragEventHandler<HTMLSpanElement>,onDragLeave : DragEventHandler<HTMLSpanElement>,onDragLeaveCapture : DragEventHandler<HTMLSpanElement>,onDragOver : DragEventHandler<HTMLSpanElement>,onDragOverCapture : DragEventHandler<HTMLSpanElement>,onDragStart : DragEventHandler<HTMLSpanElement>,onDragStartCapture : DragEventHandler<HTMLSpanElement>,onDrop : DragEventHandler<HTMLSpanElement>,onDropCapture : DragEventHandler<HTMLSpanElement>,onDurationChange : ReactEventHandler<HTMLSpanElement>,onDurationChangeCapture : ReactEventHandler<HTMLSpanElement>,onEmptied : ReactEventHandler<HTMLSpanElement>,onEmptiedCapture : ReactEventHandler<HTMLSpanElement>,onEncrypted : ReactEventHandler<HTMLSpanElement>,onEncryptedCapture : ReactEventHandler<HTMLSpanElement>,onEnded : ReactEventHandler<HTMLSpanElement>,onEndedCapture : ReactEventHandler<HTMLSpanElement>,onError : ReactEventHandler<HTMLSpanElement>,onErrorCapture : ReactEventHandler<HTMLSpanElement>,onFocus : FocusEventHandler<HTMLSpanElement>,onFocusCapture : FocusEventHandler<HTMLSpanElement>,onGotPointerCapture : PointerEventHandler<HTMLSpanElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onInput : FormEventHandler<HTMLSpanElement>,onInputCapture : FormEventHandler<HTMLSpanElement>,onInvalid : FormEventHandler<HTMLSpanElement>,onInvalidCapture : FormEventHandler<HTMLSpanElement>,onKeyDown : KeyboardEventHandler<HTMLSpanElement>,onKeyDownCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyPress : KeyboardEventHandler<HTMLSpanElement>,onKeyPressCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyUp : KeyboardEventHandler<HTMLSpanElement>,onKeyUpCapture : KeyboardEventHandler<HTMLSpanElement>,onLoad : ReactEventHandler<HTMLSpanElement>,onLoadCapture : ReactEventHandler<HTMLSpanElement>,onLoadedData : ReactEventHandler<HTMLSpanElement>,onLoadedDataCapture : ReactEventHandler<HTMLSpanElement>,onLoadedMetadata : ReactEventHandler<HTMLSpanElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLSpanElement>,onLoadStart : ReactEventHandler<HTMLSpanElement>,onLoadStartCapture : ReactEventHandler<HTMLSpanElement>,onLostPointerCapture : PointerEventHandler<HTMLSpanElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onMouseDown : MouseEventHandler<HTMLSpanElement>,onMouseDownCapture : MouseEventHandler<HTMLSpanElement>,onMouseEnter : MouseEventHandler<HTMLSpanElement>,onMouseLeave : MouseEventHandler<HTMLSpanElement>,onMouseMove : MouseEventHandler<HTMLSpanElement>,onMouseMoveCapture : MouseEventHandler<HTMLSpanElement>,onMouseOut : MouseEventHandler<HTMLSpanElement>,onMouseOutCapture : MouseEventHandler<HTMLSpanElement>,onMouseOver : MouseEventHandler<HTMLSpanElement>,onMouseOverCapture : MouseEventHandler<HTMLSpanElement>,onMouseUp : MouseEventHandler<HTMLSpanElement>,onMouseUpCapture : MouseEventHandler<HTMLSpanElement>,onPaste : ClipboardEventHandler<HTMLSpanElement>,onPasteCapture : ClipboardEventHandler<HTMLSpanElement>,onPause : ReactEventHandler<HTMLSpanElement>,onPauseCapture : ReactEventHandler<HTMLSpanElement>,onPlay : ReactEventHandler<HTMLSpanElement>,onPlayCapture : ReactEventHandler<HTMLSpanElement>,onPlaying : ReactEventHandler<HTMLSpanElement>,onPlayingCapture : ReactEventHandler<HTMLSpanElement>,onPointerCancel : PointerEventHandler<HTMLSpanElement>,onPointerCancelCapture : PointerEventHandler<HTMLSpanElement>,onPointerDown : PointerEventHandler<HTMLSpanElement>,onPointerDownCapture : PointerEventHandler<HTMLSpanElement>,onPointerEnter : PointerEventHandler<HTMLSpanElement>,onPointerLeave : PointerEventHandler<HTMLSpanElement>,onPointerMove : PointerEventHandler<HTMLSpanElement>,onPointerMoveCapture : PointerEventHandler<HTMLSpanElement>,onPointerOut : PointerEventHandler<HTMLSpanElement>,onPointerOutCapture : PointerEventHandler<HTMLSpanElement>,onPointerOver : PointerEventHandler<HTMLSpanElement>,onPointerOverCapture : PointerEventHandler<HTMLSpanElement>,onPointerUp : PointerEventHandler<HTMLSpanElement>,onPointerUpCapture : PointerEventHandler<HTMLSpanElement>,onProgress : ReactEventHandler<HTMLSpanElement>,onProgressCapture : ReactEventHandler<HTMLSpanElement>,onRateChange : ReactEventHandler<HTMLSpanElement>,onRateChangeCapture : ReactEventHandler<HTMLSpanElement>,onReset : FormEventHandler<HTMLSpanElement>,onResetCapture : FormEventHandler<HTMLSpanElement>,onResize : ReactEventHandler<HTMLSpanElement>,onResizeCapture : ReactEventHandler<HTMLSpanElement>,onScroll : UIEventHandler<HTMLSpanElement>,onScrollCapture : UIEventHandler<HTMLSpanElement>,onSeeked : ReactEventHandler<HTMLSpanElement>,onSeekedCapture : ReactEventHandler<HTMLSpanElement>,onSeeking : ReactEventHandler<HTMLSpanElement>,onSeekingCapture : ReactEventHandler<HTMLSpanElement>,onSelect : ReactEventHandler<HTMLSpanElement>,onSelectCapture : ReactEventHandler<HTMLSpanElement>,onStalled : ReactEventHandler<HTMLSpanElement>,onStalledCapture : ReactEventHandler<HTMLSpanElement>,onSubmit : FormEventHandler<HTMLSpanElement>,onSubmitCapture : FormEventHandler<HTMLSpanElement>,onSuspend : ReactEventHandler<HTMLSpanElement>,onSuspendCapture : ReactEventHandler<HTMLSpanElement>,onTimeUpdate : ReactEventHandler<HTMLSpanElement>,onTimeUpdateCapture : ReactEventHandler<HTMLSpanElement>,onToggle : ToggleEventHandler<HTMLSpanElement>,onTouchCancel : TouchEventHandler<HTMLSpanElement>,onTouchCancelCapture : TouchEventHandler<HTMLSpanElement>,onTouchEnd : TouchEventHandler<HTMLSpanElement>,onTouchEndCapture : TouchEventHandler<HTMLSpanElement>,onTouchMove : TouchEventHandler<HTMLSpanElement>,onTouchMoveCapture : TouchEventHandler<HTMLSpanElement>,onTouchStart : TouchEventHandler<HTMLSpanElement>,onTouchStartCapture : TouchEventHandler<HTMLSpanElement>,onTransitionCancel : TransitionEventHandler<HTMLSpanElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionEnd : TransitionEventHandler<HTMLSpanElement>,onTransitionEndCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionRun : TransitionEventHandler<HTMLSpanElement>,onTransitionRunCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionStart : TransitionEventHandler<HTMLSpanElement>,onTransitionStartCapture : TransitionEventHandler<HTMLSpanElement>,onVolumeChange : ReactEventHandler<HTMLSpanElement>,onVolumeChangeCapture : ReactEventHandler<HTMLSpanElement>,onWaiting : ReactEventHandler<HTMLSpanElement>,onWaitingCapture : ReactEventHandler<HTMLSpanElement>,onWheel : WheelEventHandler<HTMLSpanElement>,onWheelCapture : WheelEventHandler<HTMLSpanElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,queryOptions : Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">,radioGroup : string,rel : string,resource : string,results : number,rev : string,role : AriaRole,security : string,slot : string,spellCheck : Booleanish,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,tabIndex : number,title : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",vocab : string}

`

### Returns

##### Return Type

`let returnType: null | Element;

`
## ConnectButtonProps

 Props for the [ConnectButton](https://portal.thirdweb.com/references/typescript/v5/ConnectButton) component

`type ConnectButtonProps = {

accountAbstraction?: [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions);

appMetadata?: AppMetadata;

auth?: [SiweAuthOptions](https://portal.thirdweb.com/references/typescript/v5/SiweAuthOptions);

autoConnect?: { timeout: number } | boolean;

chain?: [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

chains?: Array<[Chain](https://portal.thirdweb.com/references/typescript/v5/Chain)>;

client: [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

connectButton?: [ConnectButton_connectButtonOptions](https://portal.thirdweb.com/references/typescript/v5/ConnectButton%5FconnectButtonOptions);

connectModal?: [ConnectButton_connectModalOptions](https://portal.thirdweb.com/references/typescript/v5/ConnectButton%5FconnectModalOptions);

detailsButton?: [ConnectButton_detailsButtonOptions](https://portal.thirdweb.com/references/typescript/v5/ConnectButton%5FdetailsButtonOptions);

detailsModal?: [ConnectButton_detailsModalOptions](https://portal.thirdweb.com/references/typescript/v5/ConnectButton%5FdetailsModalOptions);

locale?: [LocaleId](https://portal.thirdweb.com/references/typescript/v5/LocaleId);

onConnect?: (wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)) => void;

onDisconnect?: (info: { account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account); wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet) }) => void;

recommendedWallets?: Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

showAllWallets?: boolean;

signInButton?: {

className?: string;

label?: string;

style?: React.CSSProperties;

 };

supportedNFTs?: SupportedNFTs;

supportedTokens?: [SupportedTokens](https://portal.thirdweb.com/references/typescript/v5/SupportedTokens);

switchButton?: {

className?: string;

label?: string;

style?: React.CSSProperties;

 };

theme?: "dark" | "light" | [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme);

walletConnect?: { projectId?: string };

wallets?: Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

};

`

##### accountAbstraction

 Enable Account abstraction for all wallets. This will connect to the users's smart account based on the connected personal wallet and the given options.

 This allows to sponsor gas fees for your user's transaction using the thirdweb account abstraction infrastructure.

`<ConnectButton

accountAbstraction={{

 factoryAddress: "0x123...",

 chain: sepolia,

 gasless: true;

 }}

/>

`

`type accountAbstraction = [SmartWalletOptions](https://portal.thirdweb.com/references/typescript/v5/SmartWalletOptions);

`

##### appMetadata

 Metadata of the app that will be passed to connected wallet. Setting this is highly recommended.

 Some wallets display this information to the user when they connect to your app.

`type appMetadata = AppMetadata;

`

### Example

`{

name: "My App",

url: "https://my-app.com",

description: "some description about your app",

logoUrl: "https://path/to/my-app/logo.svg",

};

`

##### auth

 Enable SIWE (Sign in with Ethererum) by passing an object of type `SiweAuthOptions` to enforce the users to sign a message after connecting their wallet to authenticate themselves.

 Refer to the [SiweAuthOptions](https://portal.thirdweb.com/references/typescript/v5/SiweAuthOptions) for more details

`type auth = [SiweAuthOptions](https://portal.thirdweb.com/references/typescript/v5/SiweAuthOptions);

`

##### autoConnect

 When the user has connected their wallet to your site, this configuration determines whether or not you want to automatically connect to the last connected wallet when user visits your site again in the future.

 By default it is set to `{ timeout: 15000 }` meaning that autoConnect is enabled and if the autoConnection does not succeed within 15 seconds, it will be cancelled.

 If you want to disable autoConnect, set this prop to `false` .

 If you want to customize the timeout, you can assign an object with a `timeout` key to this prop.

`<ConnectButton client={client} autoConnect={{ timeout: 10000 }} />;

`

`type autoConnect = { timeout: number } | boolean;

`

##### chain

 The [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain) object of the blockchain you want the wallet to connect to

 If a `chain` is not specified, Wallet will be connected to whatever is the default set in the wallet.

 If a `chain` is specified, Wallet will be prompted to switch to given chain after connection if it is not already connected to it. This ensures that the wallet is connected to the correct blockchain before interacting with your app.

 The `ConnectButton` also shows a "Switch Network" button until the wallet is connected to the specified chain. Clicking on the "Switch Network" button triggers the wallet to switch to the specified chain.

 You can create a `Chain` object using the [defineChain](https://portal.thirdweb.com/references/typescript/v5/defineChain) function. At minimum, you need to pass the `id` of the blockchain to `defineChain` function to create a `Chain` object.

`type chain = [Chain](https://portal.thirdweb.com/references/typescript/v5/Chain);

`

### Example

`import { polygon } from "thirdweb/chains";

function Example() {

return (

 <div>

{" "}

 <ConnectButton chain={polygon} />{" "}

 </div>

 );

}

`

##### chains

 Array of chains that your app supports.

 This is only relevant if your app is a multi-chain app and works across multiple blockchains. If your app only works on a single blockchain, you should only specify the `chain` prop.

 Given list of chains will used in various ways:

* They will be displayed in the network selector in the `ConnectButton` 's details modal post connection
* They will be sent to wallet at the time of connection if the wallet supports requesting multiple chains ( example: WalletConnect ) so that users can switch between the chains post connection easily

`<ConnectButton chains={[ethereum, polygon, optimism]} />;

`

 You can create a `Chain` object using the [defineChain](https://portal.thirdweb.com/references/typescript/v5/defineChain) function. At minimum, you need to pass the `id` of the blockchain to `defineChain` function to create a `Chain` object.

`import { defineChain } from "thirdweb/chains";

const polygon = defineChain({

 id: 137,

});

`

`type chains = Array<[Chain](https://portal.thirdweb.com/references/typescript/v5/Chain)>;

`

##### client

 A client is the entry point to the thirdweb SDK. It is required for all other actions. You can create a client using the `createThirdwebClient` function. Refer to the [ Creating a Client](https://portal.thirdweb.com/typescript/v5/client) documentation for more information.

 You must provide a `clientId` or `secretKey` in order to initialize a client. Pass `clientId` if you want for client-side usage and `secretKey` for server-side usage.

`import { createThirdwebClient } from "thirdweb";

const client = createThirdwebClient({

 clientId: "<your_client_id>",

});

`

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### connectButton

 Configurations for the button element that is shown when wallet is not connected

`type connectButton = [ConnectButton_connectButtonOptions](https://portal.thirdweb.com/references/typescript/v5/ConnectButton%5FconnectButtonOptions);

`

### Example

`<ConnectButton

connectButton={{

 label: "Connect",

 className: "my-custom-class",

 style: {

 borderRadius: "10px",

 },

 }}

/>;

`

##### connectModal

 Configurations for the `ConnectButton` 's Modal that is shown for connecting a wallet Refer to the [ConnectButton\_connectModalOptions](https://portal.thirdweb.com/references/typescript/v5/ConnectButton%5FconnectModalOptions) type for more details

`type connectModal = [ConnectButton_connectModalOptions](https://portal.thirdweb.com/references/typescript/v5/ConnectButton%5FconnectModalOptions);

`

### Example

`<ConnectButton connectModal={{ size: "compact" }} />;

`

##### detailsButton

 Configurations for the Details Button that is shown when wallet is connected Refer to the [ConnectButton\_detailsButtonOptions](https://portal.thirdweb.com/references/typescript/v5/ConnectButton%5FdetailsButtonOptions) type for more details

`type detailsButton = [ConnectButton_detailsButtonOptions](https://portal.thirdweb.com/references/typescript/v5/ConnectButton%5FdetailsButtonOptions);

`

### Example

`<ConnectButton

detailsButton={{

 className: "my-custom-class",

 style: { borderRadius: "10px" },

 }}

/>;

`

##### detailsModal

 Configurations for the Details Modal that is shown when wallet is connected and user clicks on the details button to see the connected wallet details Refer to the [ConnectButton\_detailsModalOptions](https://portal.thirdweb.com/references/typescript/v5/ConnectButton%5FdetailsModalOptions) type for more details

`type detailsModal = [ConnectButton_detailsModalOptions](https://portal.thirdweb.com/references/typescript/v5/ConnectButton%5FdetailsModalOptions);

`

##### locale

 By default - ConnectButton UI uses the `en-US` locale for english language users.

 You can customize the language used in the ConnectButton UI by setting the `locale` prop.

 Refer to the [LocaleId](https://portal.thirdweb.com/references/typescript/v5/LocaleId) type for supported locales.

`type locale = [LocaleId](https://portal.thirdweb.com/references/typescript/v5/LocaleId);

`

##### onConnect

##### Signature

`function onConnect(wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)): void;

`

##### Parameters

##### wallet

###### Type

`let wallet: {

getAdminAccount?: () => [Account](https://portal.thirdweb.com/references/typescript/v5/Account) | undefined;

getConfig: () => [CreateWalletArgs](https://portal.thirdweb.com/references/typescript/v5/CreateWalletArgs)<TWalletId>[1];

id: TWalletId;

onConnectRequested?: () => Promise<void>;

subscribe: [WalletEmitter](https://portal.thirdweb.com/references/typescript/v5/WalletEmitter)<TWalletId>["subscribe"];

autoConnect: (

options: [WalletAutoConnectionOption](https://portal.thirdweb.com/references/typescript/v5/WalletAutoConnectionOption)<TWalletId>,

 ) => Promise<[Account](https://portal.thirdweb.com/references/typescript/v5/Account)>;

connect: (

options: [WalletConnectionOption](https://portal.thirdweb.com/references/typescript/v5/WalletConnectionOption)<TWalletId>,

 ) => Promise<[Account](https://portal.thirdweb.com/references/typescript/v5/Account)>;

disconnect: () => Promise<void>;

getAccount: () => undefined | [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

getChain: () =>

| undefined

| Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

switchChain: (chain: Readonly) => Promise<void>;

};

`

##### Returns

##### Return Type

`let returnType: void;

`

##### onDisconnect

##### Signature

`function onDisconnect(info: {

account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account);

wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet);

}): void;

`

##### Parameters

##### info

###### Type

`let info: { account: [Account](https://portal.thirdweb.com/references/typescript/v5/Account); wallet: [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet) };

`

##### Returns

##### Return Type

`let returnType: void;

`

##### recommendedWallets

 Wallets to show as recommended in the `ConnectButton` 's Modal

`type recommendedWallets = Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

`

##### showAllWallets

 By default, ConnectButton modal shows a "All Wallets" button that shows a list of 500+ wallets.

 You can disable this button by setting `showAllWallets` prop to `false`

`type showAllWallets = boolean;

`

##### signInButton

`type signInButton = {

className?: string;

label?: string;

style?: React.CSSProperties;

};

`

##### supportedNFTs

 Customize the NFTs shown in the "View Funds" screen in Details Modal for various networks.

 By default, The "View Funds" screen shows a few popular tokens for default chains and the native token. For other chains it only shows the native token.

`type supportedNFTs = SupportedNFTs;

`

### Example

 supportedTokens prop allows you to customize this list as shown below which shows "Pudgy Penguins" help when users wallet is connected to Ethereum mainnet.

`import { ConnectButton } from "thirdweb/react";

function Example() {

return (

 <ConnectButton

supportedNFTs={{

// when connected to Ethereum mainnet - show Pudgy Penguins

1: ["0xBd3531dA5CF5857e7CfAA92426877b022e612cf8"],

 }}

 />

 );

}

`

##### supportedTokens

 Customize the tokens shown in the "Send Funds" screen in Details Modal for various networks.

 By default, The "Send Funds" screen shows a few popular tokens for default chains and the native token. For other chains it only shows the native token.

`type supportedTokens = [SupportedTokens](https://portal.thirdweb.com/references/typescript/v5/SupportedTokens);

`

### Example

 supportedTokens prop allows you to customize this list as shown below which shows "Dai Stablecoin" when users wallet is connected to the "Base" mainnet.

`import { ConnectButton } from "thirdweb/react";

function Example() {

return (

 <ConnectButton

supportedTokens={{

// when connected to "Base" mainnet - show balance of DAI stablecoin

84532: [

 {

 address: "0x50c5725949A6F0c72E6C4a641F24049A917DB0Cb", // token contract address

 name: "Dai Stablecoin",

 symbol: "DAI",

 icon: "https://assets.coingecko.com/coins/images/9956/small/Badge_Dai.png?1687143508",

 },

 ],

 }}

 />

 );

}

`

##### switchButton

 Configuration for the "Switch Network" button. This button is rendered when the wallet is connected, but it is not connected to the `chain` prop provided in `ConnectButton` component

`type switchButton = {

className?: string;

label?: string;

style?: React.CSSProperties;

};

`

### Example

`<ConnectButton

switchButton={{

 label: "Wrong Network",

 className: "my-custom-class",

 style: {

 backgroundColor: "red",

 },

 }}

/>;

`

##### theme

 Set the theme for the `ConnectButton` component. By default it is set to `"dark"`

 theme can be set to either `"dark"` , `"light"` or a custom theme object. You can also import [lightTheme](https://portal.thirdweb.com/references/typescript/v5/lightTheme)or [darkTheme](https://portal.thirdweb.com/references/typescript/v5/darkTheme)functions from `thirdweb/react` to use the default themes as base and overrides parts of it.

`type theme = "dark" | "light" | [Theme](https://portal.thirdweb.com/references/typescript/v5/Theme);

`

### Example

`import { lightTheme } from "thirdweb/react";

const customTheme = lightTheme({

 colors: {

 modalBg: "red",

 },

});

function Example() {

return <ConnectButton theme={customTheme} />;

}

`

##### walletConnect

 Configure options for WalletConnect

 By default WalletConnect uses the thirdweb's default project id. Setting your own project id is recommended.

 You can create a project id by signing up on [ walletconnect.com](https://walletconnect.com/)

`type walletConnect = { projectId?: string };

`

##### wallets

 Array of supported wallets. If not provided, default wallets will be used.

`type wallets = Array<[Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet)>;

`

### Example

`import { AutoConnect } from "thirdweb/react";

import { createWallet, inAppWallet } from "thirdweb/wallets";

const wallets = [

inAppWallet(),

createWallet("io.metamask"),

createWallet("com.coinbase.wallet"),

createWallet("me.rainbow"),

];

function Example() {

return <ConnectButton client={client} wallets={wallets} />;

}

`

 If no wallets are specified. The component will show All the EIP-6963 compliant installed wallet extensions, as well as below default wallets:

`const defaultWallets = [

inAppWallet(),

createWallet("io.metamask"),

createWallet("com.coinbase.wallet"),

createWallet("me.rainbow"),

createWallet("io.zerion.wallet"),

];

`

 The `ConnectButton` also shows a "All wallets" button at the end of wallet list which allows user to connect to any of the 500+ wallets
## NFTDescription

 This component fetches and displays an NFT's description. It inherits all the attributes of a `<span>`so you can style it just like how you would style a `<span>` element.

### Example

####  Basic usage

`import { NFTProvider, NFTDescription } from "thirdweb/react";

<NFTProvider>

 <NFTDescription />

</NFTProvider>;

`

####  Show a loading sign while the description is being fetched

`import { NFTProvider, NFTDescription } from "thirdweb/react";

<NFTProvider>

 <NFTDescription loadingComponent={<YourLoadingSign />} />

</NFTProvider>;

`

####  Show something in case the description failed to resolve

`import { NFTProvider, NFTDescription } from "thirdweb/react";

<NFTProvider>

 <NFTDescription

fallbackComponent={<span>Failed to load description</span>}

 />

</NFTProvider>;

`

####  Custom query options for useQuery (tanstack-query)

`import { NFTProvider, NFTDescription } from "thirdweb/react";

<NFTProvider>

 <NFTDescription queryOptions={{ retry: 3, enabled: false }} />

</NFTProvider>;

`

####  Override the description with the `descriptionResolver` prop

 If you already have the url, you can skip the network requests and pass it directly to the NFTDescription

`<NFTDescription descriptionResolver="The desc of the NFT" />;

`

 You can also pass in your own custom (async) function that retrieves the description

`const getDescription = async () => {

// ...

return description;

};

<NFTDescription descriptionResolver={getDescription} />;

`

##### Signature

`function NFTDescription(

__namedParameters: [NFTDescriptionProps](https://portal.thirdweb.com/references/typescript/v5/NFTDescriptionProps),

): null | Element;

`

### Parameters

##### \_\_namedParameters

#### Type

`let __namedParameters: {about : string,accessKey : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,className : string,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),descriptionResolver : string | (() => string) | (() => Promise<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",fallbackComponent : Element,hidden : boolean,id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,loadingComponent : Element,nonce : string,onAbort : ReactEventHandler<HTMLSpanElement>,onAbortCapture : ReactEventHandler<HTMLSpanElement>,onAnimationEnd : AnimationEventHandler<HTMLSpanElement>,onAnimationEndCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationIteration : AnimationEventHandler<HTMLSpanElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationStart : AnimationEventHandler<HTMLSpanElement>,onAnimationStartCapture : AnimationEventHandler<HTMLSpanElement>,onAuxClick : MouseEventHandler<HTMLSpanElement>,onAuxClickCapture : MouseEventHandler<HTMLSpanElement>,onBeforeInput : FormEventHandler<HTMLSpanElement>,onBeforeInputCapture : FormEventHandler<HTMLSpanElement>,onBeforeToggle : ToggleEventHandler<HTMLSpanElement>,onBlur : FocusEventHandler<HTMLSpanElement>,onBlurCapture : FocusEventHandler<HTMLSpanElement>,onCanPlay : ReactEventHandler<HTMLSpanElement>,onCanPlayCapture : ReactEventHandler<HTMLSpanElement>,onCanPlayThrough : ReactEventHandler<HTMLSpanElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLSpanElement>,onChange : FormEventHandler<HTMLSpanElement>,onChangeCapture : FormEventHandler<HTMLSpanElement>,onClick : MouseEventHandler<HTMLSpanElement>,onClickCapture : MouseEventHandler<HTMLSpanElement>,onCompositionEnd : CompositionEventHandler<HTMLSpanElement>,onCompositionEndCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionStart : CompositionEventHandler<HTMLSpanElement>,onCompositionStartCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdate : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLSpanElement>,onContextMenu : MouseEventHandler<HTMLSpanElement>,onContextMenuCapture : MouseEventHandler<HTMLSpanElement>,onCopy : ClipboardEventHandler<HTMLSpanElement>,onCopyCapture : ClipboardEventHandler<HTMLSpanElement>,onCut : ClipboardEventHandler<HTMLSpanElement>,onCutCapture : ClipboardEventHandler<HTMLSpanElement>,onDoubleClick : MouseEventHandler<HTMLSpanElement>,onDoubleClickCapture : MouseEventHandler<HTMLSpanElement>,onDrag : DragEventHandler<HTMLSpanElement>,onDragCapture : DragEventHandler<HTMLSpanElement>,onDragEnd : DragEventHandler<HTMLSpanElement>,onDragEndCapture : DragEventHandler<HTMLSpanElement>,onDragEnter : DragEventHandler<HTMLSpanElement>,onDragEnterCapture : DragEventHandler<HTMLSpanElement>,onDragExit : DragEventHandler<HTMLSpanElement>,onDragExitCapture : DragEventHandler<HTMLSpanElement>,onDragLeave : DragEventHandler<HTMLSpanElement>,onDragLeaveCapture : DragEventHandler<HTMLSpanElement>,onDragOver : DragEventHandler<HTMLSpanElement>,onDragOverCapture : DragEventHandler<HTMLSpanElement>,onDragStart : DragEventHandler<HTMLSpanElement>,onDragStartCapture : DragEventHandler<HTMLSpanElement>,onDrop : DragEventHandler<HTMLSpanElement>,onDropCapture : DragEventHandler<HTMLSpanElement>,onDurationChange : ReactEventHandler<HTMLSpanElement>,onDurationChangeCapture : ReactEventHandler<HTMLSpanElement>,onEmptied : ReactEventHandler<HTMLSpanElement>,onEmptiedCapture : ReactEventHandler<HTMLSpanElement>,onEncrypted : ReactEventHandler<HTMLSpanElement>,onEncryptedCapture : ReactEventHandler<HTMLSpanElement>,onEnded : ReactEventHandler<HTMLSpanElement>,onEndedCapture : ReactEventHandler<HTMLSpanElement>,onError : ReactEventHandler<HTMLSpanElement>,onErrorCapture : ReactEventHandler<HTMLSpanElement>,onFocus : FocusEventHandler<HTMLSpanElement>,onFocusCapture : FocusEventHandler<HTMLSpanElement>,onGotPointerCapture : PointerEventHandler<HTMLSpanElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onInput : FormEventHandler<HTMLSpanElement>,onInputCapture : FormEventHandler<HTMLSpanElement>,onInvalid : FormEventHandler<HTMLSpanElement>,onInvalidCapture : FormEventHandler<HTMLSpanElement>,onKeyDown : KeyboardEventHandler<HTMLSpanElement>,onKeyDownCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyPress : KeyboardEventHandler<HTMLSpanElement>,onKeyPressCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyUp : KeyboardEventHandler<HTMLSpanElement>,onKeyUpCapture : KeyboardEventHandler<HTMLSpanElement>,onLoad : ReactEventHandler<HTMLSpanElement>,onLoadCapture : ReactEventHandler<HTMLSpanElement>,onLoadedData : ReactEventHandler<HTMLSpanElement>,onLoadedDataCapture : ReactEventHandler<HTMLSpanElement>,onLoadedMetadata : ReactEventHandler<HTMLSpanElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLSpanElement>,onLoadStart : ReactEventHandler<HTMLSpanElement>,onLoadStartCapture : ReactEventHandler<HTMLSpanElement>,onLostPointerCapture : PointerEventHandler<HTMLSpanElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onMouseDown : MouseEventHandler<HTMLSpanElement>,onMouseDownCapture : MouseEventHandler<HTMLSpanElement>,onMouseEnter : MouseEventHandler<HTMLSpanElement>,onMouseLeave : MouseEventHandler<HTMLSpanElement>,onMouseMove : MouseEventHandler<HTMLSpanElement>,onMouseMoveCapture : MouseEventHandler<HTMLSpanElement>,onMouseOut : MouseEventHandler<HTMLSpanElement>,onMouseOutCapture : MouseEventHandler<HTMLSpanElement>,onMouseOver : MouseEventHandler<HTMLSpanElement>,onMouseOverCapture : MouseEventHandler<HTMLSpanElement>,onMouseUp : MouseEventHandler<HTMLSpanElement>,onMouseUpCapture : MouseEventHandler<HTMLSpanElement>,onPaste : ClipboardEventHandler<HTMLSpanElement>,onPasteCapture : ClipboardEventHandler<HTMLSpanElement>,onPause : ReactEventHandler<HTMLSpanElement>,onPauseCapture : ReactEventHandler<HTMLSpanElement>,onPlay : ReactEventHandler<HTMLSpanElement>,onPlayCapture : ReactEventHandler<HTMLSpanElement>,onPlaying : ReactEventHandler<HTMLSpanElement>,onPlayingCapture : ReactEventHandler<HTMLSpanElement>,onPointerCancel : PointerEventHandler<HTMLSpanElement>,onPointerCancelCapture : PointerEventHandler<HTMLSpanElement>,onPointerDown : PointerEventHandler<HTMLSpanElement>,onPointerDownCapture : PointerEventHandler<HTMLSpanElement>,onPointerEnter : PointerEventHandler<HTMLSpanElement>,onPointerLeave : PointerEventHandler<HTMLSpanElement>,onPointerMove : PointerEventHandler<HTMLSpanElement>,onPointerMoveCapture : PointerEventHandler<HTMLSpanElement>,onPointerOut : PointerEventHandler<HTMLSpanElement>,onPointerOutCapture : PointerEventHandler<HTMLSpanElement>,onPointerOver : PointerEventHandler<HTMLSpanElement>,onPointerOverCapture : PointerEventHandler<HTMLSpanElement>,onPointerUp : PointerEventHandler<HTMLSpanElement>,onPointerUpCapture : PointerEventHandler<HTMLSpanElement>,onProgress : ReactEventHandler<HTMLSpanElement>,onProgressCapture : ReactEventHandler<HTMLSpanElement>,onRateChange : ReactEventHandler<HTMLSpanElement>,onRateChangeCapture : ReactEventHandler<HTMLSpanElement>,onReset : FormEventHandler<HTMLSpanElement>,onResetCapture : FormEventHandler<HTMLSpanElement>,onResize : ReactEventHandler<HTMLSpanElement>,onResizeCapture : ReactEventHandler<HTMLSpanElement>,onScroll : UIEventHandler<HTMLSpanElement>,onScrollCapture : UIEventHandler<HTMLSpanElement>,onSeeked : ReactEventHandler<HTMLSpanElement>,onSeekedCapture : ReactEventHandler<HTMLSpanElement>,onSeeking : ReactEventHandler<HTMLSpanElement>,onSeekingCapture : ReactEventHandler<HTMLSpanElement>,onSelect : ReactEventHandler<HTMLSpanElement>,onSelectCapture : ReactEventHandler<HTMLSpanElement>,onStalled : ReactEventHandler<HTMLSpanElement>,onStalledCapture : ReactEventHandler<HTMLSpanElement>,onSubmit : FormEventHandler<HTMLSpanElement>,onSubmitCapture : FormEventHandler<HTMLSpanElement>,onSuspend : ReactEventHandler<HTMLSpanElement>,onSuspendCapture : ReactEventHandler<HTMLSpanElement>,onTimeUpdate : ReactEventHandler<HTMLSpanElement>,onTimeUpdateCapture : ReactEventHandler<HTMLSpanElement>,onToggle : ToggleEventHandler<HTMLSpanElement>,onTouchCancel : TouchEventHandler<HTMLSpanElement>,onTouchCancelCapture : TouchEventHandler<HTMLSpanElement>,onTouchEnd : TouchEventHandler<HTMLSpanElement>,onTouchEndCapture : TouchEventHandler<HTMLSpanElement>,onTouchMove : TouchEventHandler<HTMLSpanElement>,onTouchMoveCapture : TouchEventHandler<HTMLSpanElement>,onTouchStart : TouchEventHandler<HTMLSpanElement>,onTouchStartCapture : TouchEventHandler<HTMLSpanElement>,onTransitionCancel : TransitionEventHandler<HTMLSpanElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionEnd : TransitionEventHandler<HTMLSpanElement>,onTransitionEndCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionRun : TransitionEventHandler<HTMLSpanElement>,onTransitionRunCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionStart : TransitionEventHandler<HTMLSpanElement>,onTransitionStartCapture : TransitionEventHandler<HTMLSpanElement>,onVolumeChange : ReactEventHandler<HTMLSpanElement>,onVolumeChangeCapture : ReactEventHandler<HTMLSpanElement>,onWaiting : ReactEventHandler<HTMLSpanElement>,onWaitingCapture : ReactEventHandler<HTMLSpanElement>,onWheel : WheelEventHandler<HTMLSpanElement>,onWheelCapture : WheelEventHandler<HTMLSpanElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,queryOptions : Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">,radioGroup : string,rel : string,resource : string,results : number,rev : string,role : AriaRole,security : string,slot : string,spellCheck : Booleanish,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,tabIndex : number,title : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",vocab : string}

`

### Returns

##### Return Type

`let returnType: null | Element;

`

 A `<span>` element containing the description of the NFT
## NFTName

 This component fetches and displays an NFT's name. It takes in a `className` and `style` props so you can style it just like how you would style a `<span>` element.

### Example

####  Basic usage

`import { NFTProvider, NFTName } from "thirdweb/react";

<NFTProvider>

 <NFTName />

</NFTProvider>;

`

####  Show a loading sign while the name is being fetched

`import { NFTProvider, NFTName } from "thirdweb/react";

<NFTProvider>

 <NFTName loadingComponent={<YourLoadingSign />} />

</NFTProvider>;

`

####  Show something in case the name failed to resolve

`import { NFTProvider, NFTName } from "thirdweb/react";

<NFTProvider>

 <NFTName fallbackComponent={<span>Failed to load name</span>} />

</NFTProvider>;

`

####  Custom query options for useQuery (tanstack-query)

`import { NFTProvider, NFTName } from "thirdweb/react";

<NFTProvider>

 <NFTName queryOptions={{ retry: 3, enabled: false }} />

</NFTProvider>;

`

####  Override the name with the `nameResolver` prop

 If you already have the name, you can skip the network requests and pass it directly to the NFTName

`<NFTName nameResolver="Doodles #1" />;

`

 You can also pass in your own custom (async) function that retrieves the name

`const getName = async () => {

// ...

return name;

};

<NFTName nameResolver={getName} />;

`

##### Signature

`function NFTName(__namedParameters: [NFTNameProps](https://portal.thirdweb.com/references/typescript/v5/NFTNameProps)): null | Element;

`

### Parameters

##### \_\_namedParameters

#### Type

`let __namedParameters: {about : string,accessKey : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,className : string,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",fallbackComponent : Element,hidden : boolean,id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,loadingComponent : Element,nameResolver : string | (() => string) | (() => Promise<string>),nonce : string,onAbort : ReactEventHandler<HTMLSpanElement>,onAbortCapture : ReactEventHandler<HTMLSpanElement>,onAnimationEnd : AnimationEventHandler<HTMLSpanElement>,onAnimationEndCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationIteration : AnimationEventHandler<HTMLSpanElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationStart : AnimationEventHandler<HTMLSpanElement>,onAnimationStartCapture : AnimationEventHandler<HTMLSpanElement>,onAuxClick : MouseEventHandler<HTMLSpanElement>,onAuxClickCapture : MouseEventHandler<HTMLSpanElement>,onBeforeInput : FormEventHandler<HTMLSpanElement>,onBeforeInputCapture : FormEventHandler<HTMLSpanElement>,onBeforeToggle : ToggleEventHandler<HTMLSpanElement>,onBlur : FocusEventHandler<HTMLSpanElement>,onBlurCapture : FocusEventHandler<HTMLSpanElement>,onCanPlay : ReactEventHandler<HTMLSpanElement>,onCanPlayCapture : ReactEventHandler<HTMLSpanElement>,onCanPlayThrough : ReactEventHandler<HTMLSpanElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLSpanElement>,onChange : FormEventHandler<HTMLSpanElement>,onChangeCapture : FormEventHandler<HTMLSpanElement>,onClick : MouseEventHandler<HTMLSpanElement>,onClickCapture : MouseEventHandler<HTMLSpanElement>,onCompositionEnd : CompositionEventHandler<HTMLSpanElement>,onCompositionEndCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionStart : CompositionEventHandler<HTMLSpanElement>,onCompositionStartCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdate : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLSpanElement>,onContextMenu : MouseEventHandler<HTMLSpanElement>,onContextMenuCapture : MouseEventHandler<HTMLSpanElement>,onCopy : ClipboardEventHandler<HTMLSpanElement>,onCopyCapture : ClipboardEventHandler<HTMLSpanElement>,onCut : ClipboardEventHandler<HTMLSpanElement>,onCutCapture : ClipboardEventHandler<HTMLSpanElement>,onDoubleClick : MouseEventHandler<HTMLSpanElement>,onDoubleClickCapture : MouseEventHandler<HTMLSpanElement>,onDrag : DragEventHandler<HTMLSpanElement>,onDragCapture : DragEventHandler<HTMLSpanElement>,onDragEnd : DragEventHandler<HTMLSpanElement>,onDragEndCapture : DragEventHandler<HTMLSpanElement>,onDragEnter : DragEventHandler<HTMLSpanElement>,onDragEnterCapture : DragEventHandler<HTMLSpanElement>,onDragExit : DragEventHandler<HTMLSpanElement>,onDragExitCapture : DragEventHandler<HTMLSpanElement>,onDragLeave : DragEventHandler<HTMLSpanElement>,onDragLeaveCapture : DragEventHandler<HTMLSpanElement>,onDragOver : DragEventHandler<HTMLSpanElement>,onDragOverCapture : DragEventHandler<HTMLSpanElement>,onDragStart : DragEventHandler<HTMLSpanElement>,onDragStartCapture : DragEventHandler<HTMLSpanElement>,onDrop : DragEventHandler<HTMLSpanElement>,onDropCapture : DragEventHandler<HTMLSpanElement>,onDurationChange : ReactEventHandler<HTMLSpanElement>,onDurationChangeCapture : ReactEventHandler<HTMLSpanElement>,onEmptied : ReactEventHandler<HTMLSpanElement>,onEmptiedCapture : ReactEventHandler<HTMLSpanElement>,onEncrypted : ReactEventHandler<HTMLSpanElement>,onEncryptedCapture : ReactEventHandler<HTMLSpanElement>,onEnded : ReactEventHandler<HTMLSpanElement>,onEndedCapture : ReactEventHandler<HTMLSpanElement>,onError : ReactEventHandler<HTMLSpanElement>,onErrorCapture : ReactEventHandler<HTMLSpanElement>,onFocus : FocusEventHandler<HTMLSpanElement>,onFocusCapture : FocusEventHandler<HTMLSpanElement>,onGotPointerCapture : PointerEventHandler<HTMLSpanElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onInput : FormEventHandler<HTMLSpanElement>,onInputCapture : FormEventHandler<HTMLSpanElement>,onInvalid : FormEventHandler<HTMLSpanElement>,onInvalidCapture : FormEventHandler<HTMLSpanElement>,onKeyDown : KeyboardEventHandler<HTMLSpanElement>,onKeyDownCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyPress : KeyboardEventHandler<HTMLSpanElement>,onKeyPressCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyUp : KeyboardEventHandler<HTMLSpanElement>,onKeyUpCapture : KeyboardEventHandler<HTMLSpanElement>,onLoad : ReactEventHandler<HTMLSpanElement>,onLoadCapture : ReactEventHandler<HTMLSpanElement>,onLoadedData : ReactEventHandler<HTMLSpanElement>,onLoadedDataCapture : ReactEventHandler<HTMLSpanElement>,onLoadedMetadata : ReactEventHandler<HTMLSpanElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLSpanElement>,onLoadStart : ReactEventHandler<HTMLSpanElement>,onLoadStartCapture : ReactEventHandler<HTMLSpanElement>,onLostPointerCapture : PointerEventHandler<HTMLSpanElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onMouseDown : MouseEventHandler<HTMLSpanElement>,onMouseDownCapture : MouseEventHandler<HTMLSpanElement>,onMouseEnter : MouseEventHandler<HTMLSpanElement>,onMouseLeave : MouseEventHandler<HTMLSpanElement>,onMouseMove : MouseEventHandler<HTMLSpanElement>,onMouseMoveCapture : MouseEventHandler<HTMLSpanElement>,onMouseOut : MouseEventHandler<HTMLSpanElement>,onMouseOutCapture : MouseEventHandler<HTMLSpanElement>,onMouseOver : MouseEventHandler<HTMLSpanElement>,onMouseOverCapture : MouseEventHandler<HTMLSpanElement>,onMouseUp : MouseEventHandler<HTMLSpanElement>,onMouseUpCapture : MouseEventHandler<HTMLSpanElement>,onPaste : ClipboardEventHandler<HTMLSpanElement>,onPasteCapture : ClipboardEventHandler<HTMLSpanElement>,onPause : ReactEventHandler<HTMLSpanElement>,onPauseCapture : ReactEventHandler<HTMLSpanElement>,onPlay : ReactEventHandler<HTMLSpanElement>,onPlayCapture : ReactEventHandler<HTMLSpanElement>,onPlaying : ReactEventHandler<HTMLSpanElement>,onPlayingCapture : ReactEventHandler<HTMLSpanElement>,onPointerCancel : PointerEventHandler<HTMLSpanElement>,onPointerCancelCapture : PointerEventHandler<HTMLSpanElement>,onPointerDown : PointerEventHandler<HTMLSpanElement>,onPointerDownCapture : PointerEventHandler<HTMLSpanElement>,onPointerEnter : PointerEventHandler<HTMLSpanElement>,onPointerLeave : PointerEventHandler<HTMLSpanElement>,onPointerMove : PointerEventHandler<HTMLSpanElement>,onPointerMoveCapture : PointerEventHandler<HTMLSpanElement>,onPointerOut : PointerEventHandler<HTMLSpanElement>,onPointerOutCapture : PointerEventHandler<HTMLSpanElement>,onPointerOver : PointerEventHandler<HTMLSpanElement>,onPointerOverCapture : PointerEventHandler<HTMLSpanElement>,onPointerUp : PointerEventHandler<HTMLSpanElement>,onPointerUpCapture : PointerEventHandler<HTMLSpanElement>,onProgress : ReactEventHandler<HTMLSpanElement>,onProgressCapture : ReactEventHandler<HTMLSpanElement>,onRateChange : ReactEventHandler<HTMLSpanElement>,onRateChangeCapture : ReactEventHandler<HTMLSpanElement>,onReset : FormEventHandler<HTMLSpanElement>,onResetCapture : FormEventHandler<HTMLSpanElement>,onResize : ReactEventHandler<HTMLSpanElement>,onResizeCapture : ReactEventHandler<HTMLSpanElement>,onScroll : UIEventHandler<HTMLSpanElement>,onScrollCapture : UIEventHandler<HTMLSpanElement>,onSeeked : ReactEventHandler<HTMLSpanElement>,onSeekedCapture : ReactEventHandler<HTMLSpanElement>,onSeeking : ReactEventHandler<HTMLSpanElement>,onSeekingCapture : ReactEventHandler<HTMLSpanElement>,onSelect : ReactEventHandler<HTMLSpanElement>,onSelectCapture : ReactEventHandler<HTMLSpanElement>,onStalled : ReactEventHandler<HTMLSpanElement>,onStalledCapture : ReactEventHandler<HTMLSpanElement>,onSubmit : FormEventHandler<HTMLSpanElement>,onSubmitCapture : FormEventHandler<HTMLSpanElement>,onSuspend : ReactEventHandler<HTMLSpanElement>,onSuspendCapture : ReactEventHandler<HTMLSpanElement>,onTimeUpdate : ReactEventHandler<HTMLSpanElement>,onTimeUpdateCapture : ReactEventHandler<HTMLSpanElement>,onToggle : ToggleEventHandler<HTMLSpanElement>,onTouchCancel : TouchEventHandler<HTMLSpanElement>,onTouchCancelCapture : TouchEventHandler<HTMLSpanElement>,onTouchEnd : TouchEventHandler<HTMLSpanElement>,onTouchEndCapture : TouchEventHandler<HTMLSpanElement>,onTouchMove : TouchEventHandler<HTMLSpanElement>,onTouchMoveCapture : TouchEventHandler<HTMLSpanElement>,onTouchStart : TouchEventHandler<HTMLSpanElement>,onTouchStartCapture : TouchEventHandler<HTMLSpanElement>,onTransitionCancel : TransitionEventHandler<HTMLSpanElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionEnd : TransitionEventHandler<HTMLSpanElement>,onTransitionEndCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionRun : TransitionEventHandler<HTMLSpanElement>,onTransitionRunCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionStart : TransitionEventHandler<HTMLSpanElement>,onTransitionStartCapture : TransitionEventHandler<HTMLSpanElement>,onVolumeChange : ReactEventHandler<HTMLSpanElement>,onVolumeChangeCapture : ReactEventHandler<HTMLSpanElement>,onWaiting : ReactEventHandler<HTMLSpanElement>,onWaitingCapture : ReactEventHandler<HTMLSpanElement>,onWheel : WheelEventHandler<HTMLSpanElement>,onWheelCapture : WheelEventHandler<HTMLSpanElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,queryOptions : Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">,radioGroup : string,rel : string,resource : string,results : number,rev : string,role : AriaRole,security : string,slot : string,spellCheck : Booleanish,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,tabIndex : number,title : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",vocab : string}

`

### Returns

##### Return Type

`let returnType: null | Element;

`

 A `<span>` element containing the name of the NFT
## SocialIcon

 Social auth provider icon

### Example

`import { SocialIcon } from "thirdweb/react";

<SocialIcon provider="google" />;

`

 Result: An `<img />` component with the src of the icon

`<img src="google-icon-svg" />

`

##### Signature

`function SocialIcon(__namedParameters: [SocialIconProps](https://portal.thirdweb.com/references/typescript/v5/SocialIconProps)): Element;

`

### Parameters

##### \_\_namedParameters

#### Type

`let __namedParameters: {about : string,accessKey : string,alt : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,children : ReactNode,className : string,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,crossOrigin : CrossOrigin,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,decoding : "auto" | "async" | "sync",defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",fetchPriority : "auto" | "high" | "low",height : string | number,hidden : boolean,id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,loading : "eager" | "lazy",nonce : string,onAbort : ReactEventHandler<HTMLImageElement>,onAbortCapture : ReactEventHandler<HTMLImageElement>,onAnimationEnd : AnimationEventHandler<HTMLImageElement>,onAnimationEndCapture : AnimationEventHandler<HTMLImageElement>,onAnimationIteration : AnimationEventHandler<HTMLImageElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLImageElement>,onAnimationStart : AnimationEventHandler<HTMLImageElement>,onAnimationStartCapture : AnimationEventHandler<HTMLImageElement>,onAuxClick : MouseEventHandler<HTMLImageElement>,onAuxClickCapture : MouseEventHandler<HTMLImageElement>,onBeforeInput : FormEventHandler<HTMLImageElement>,onBeforeInputCapture : FormEventHandler<HTMLImageElement>,onBeforeToggle : ToggleEventHandler<HTMLImageElement>,onBlur : FocusEventHandler<HTMLImageElement>,onBlurCapture : FocusEventHandler<HTMLImageElement>,onCanPlay : ReactEventHandler<HTMLImageElement>,onCanPlayCapture : ReactEventHandler<HTMLImageElement>,onCanPlayThrough : ReactEventHandler<HTMLImageElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLImageElement>,onChange : FormEventHandler<HTMLImageElement>,onChangeCapture : FormEventHandler<HTMLImageElement>,onClick : MouseEventHandler<HTMLImageElement>,onClickCapture : MouseEventHandler<HTMLImageElement>,onCompositionEnd : CompositionEventHandler<HTMLImageElement>,onCompositionEndCapture : CompositionEventHandler<HTMLImageElement>,onCompositionStart : CompositionEventHandler<HTMLImageElement>,onCompositionStartCapture : CompositionEventHandler<HTMLImageElement>,onCompositionUpdate : CompositionEventHandler<HTMLImageElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLImageElement>,onContextMenu : MouseEventHandler<HTMLImageElement>,onContextMenuCapture : MouseEventHandler<HTMLImageElement>,onCopy : ClipboardEventHandler<HTMLImageElement>,onCopyCapture : ClipboardEventHandler<HTMLImageElement>,onCut : ClipboardEventHandler<HTMLImageElement>,onCutCapture : ClipboardEventHandler<HTMLImageElement>,onDoubleClick : MouseEventHandler<HTMLImageElement>,onDoubleClickCapture : MouseEventHandler<HTMLImageElement>,onDrag : DragEventHandler<HTMLImageElement>,onDragCapture : DragEventHandler<HTMLImageElement>,onDragEnd : DragEventHandler<HTMLImageElement>,onDragEndCapture : DragEventHandler<HTMLImageElement>,onDragEnter : DragEventHandler<HTMLImageElement>,onDragEnterCapture : DragEventHandler<HTMLImageElement>,onDragExit : DragEventHandler<HTMLImageElement>,onDragExitCapture : DragEventHandler<HTMLImageElement>,onDragLeave : DragEventHandler<HTMLImageElement>,onDragLeaveCapture : DragEventHandler<HTMLImageElement>,onDragOver : DragEventHandler<HTMLImageElement>,onDragOverCapture : DragEventHandler<HTMLImageElement>,onDragStart : DragEventHandler<HTMLImageElement>,onDragStartCapture : DragEventHandler<HTMLImageElement>,onDrop : DragEventHandler<HTMLImageElement>,onDropCapture : DragEventHandler<HTMLImageElement>,onDurationChange : ReactEventHandler<HTMLImageElement>,onDurationChangeCapture : ReactEventHandler<HTMLImageElement>,onEmptied : ReactEventHandler<HTMLImageElement>,onEmptiedCapture : ReactEventHandler<HTMLImageElement>,onEncrypted : ReactEventHandler<HTMLImageElement>,onEncryptedCapture : ReactEventHandler<HTMLImageElement>,onEnded : ReactEventHandler<HTMLImageElement>,onEndedCapture : ReactEventHandler<HTMLImageElement>,onError : ReactEventHandler<HTMLImageElement>,onErrorCapture : ReactEventHandler<HTMLImageElement>,onFocus : FocusEventHandler<HTMLImageElement>,onFocusCapture : FocusEventHandler<HTMLImageElement>,onGotPointerCapture : PointerEventHandler<HTMLImageElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLImageElement>,onInput : FormEventHandler<HTMLImageElement>,onInputCapture : FormEventHandler<HTMLImageElement>,onInvalid : FormEventHandler<HTMLImageElement>,onInvalidCapture : FormEventHandler<HTMLImageElement>,onKeyDown : KeyboardEventHandler<HTMLImageElement>,onKeyDownCapture : KeyboardEventHandler<HTMLImageElement>,onKeyPress : KeyboardEventHandler<HTMLImageElement>,onKeyPressCapture : KeyboardEventHandler<HTMLImageElement>,onKeyUp : KeyboardEventHandler<HTMLImageElement>,onKeyUpCapture : KeyboardEventHandler<HTMLImageElement>,onLoad : ReactEventHandler<HTMLImageElement>,onLoadCapture : ReactEventHandler<HTMLImageElement>,onLoadedData : ReactEventHandler<HTMLImageElement>,onLoadedDataCapture : ReactEventHandler<HTMLImageElement>,onLoadedMetadata : ReactEventHandler<HTMLImageElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLImageElement>,onLoadStart : ReactEventHandler<HTMLImageElement>,onLoadStartCapture : ReactEventHandler<HTMLImageElement>,onLostPointerCapture : PointerEventHandler<HTMLImageElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLImageElement>,onMouseDown : MouseEventHandler<HTMLImageElement>,onMouseDownCapture : MouseEventHandler<HTMLImageElement>,onMouseEnter : MouseEventHandler<HTMLImageElement>,onMouseLeave : MouseEventHandler<HTMLImageElement>,onMouseMove : MouseEventHandler<HTMLImageElement>,onMouseMoveCapture : MouseEventHandler<HTMLImageElement>,onMouseOut : MouseEventHandler<HTMLImageElement>,onMouseOutCapture : MouseEventHandler<HTMLImageElement>,onMouseOver : MouseEventHandler<HTMLImageElement>,onMouseOverCapture : MouseEventHandler<HTMLImageElement>,onMouseUp : MouseEventHandler<HTMLImageElement>,onMouseUpCapture : MouseEventHandler<HTMLImageElement>,onPaste : ClipboardEventHandler<HTMLImageElement>,onPasteCapture : ClipboardEventHandler<HTMLImageElement>,onPause : ReactEventHandler<HTMLImageElement>,onPauseCapture : ReactEventHandler<HTMLImageElement>,onPlay : ReactEventHandler<HTMLImageElement>,onPlayCapture : ReactEventHandler<HTMLImageElement>,onPlaying : ReactEventHandler<HTMLImageElement>,onPlayingCapture : ReactEventHandler<HTMLImageElement>,onPointerCancel : PointerEventHandler<HTMLImageElement>,onPointerCancelCapture : PointerEventHandler<HTMLImageElement>,onPointerDown : PointerEventHandler<HTMLImageElement>,onPointerDownCapture : PointerEventHandler<HTMLImageElement>,onPointerEnter : PointerEventHandler<HTMLImageElement>,onPointerLeave : PointerEventHandler<HTMLImageElement>,onPointerMove : PointerEventHandler<HTMLImageElement>,onPointerMoveCapture : PointerEventHandler<HTMLImageElement>,onPointerOut : PointerEventHandler<HTMLImageElement>,onPointerOutCapture : PointerEventHandler<HTMLImageElement>,onPointerOver : PointerEventHandler<HTMLImageElement>,onPointerOverCapture : PointerEventHandler<HTMLImageElement>,onPointerUp : PointerEventHandler<HTMLImageElement>,onPointerUpCapture : PointerEventHandler<HTMLImageElement>,onProgress : ReactEventHandler<HTMLImageElement>,onProgressCapture : ReactEventHandler<HTMLImageElement>,onRateChange : ReactEventHandler<HTMLImageElement>,onRateChangeCapture : ReactEventHandler<HTMLImageElement>,onReset : FormEventHandler<HTMLImageElement>,onResetCapture : FormEventHandler<HTMLImageElement>,onResize : ReactEventHandler<HTMLImageElement>,onResizeCapture : ReactEventHandler<HTMLImageElement>,onScroll : UIEventHandler<HTMLImageElement>,onScrollCapture : UIEventHandler<HTMLImageElement>,onSeeked : ReactEventHandler<HTMLImageElement>,onSeekedCapture : ReactEventHandler<HTMLImageElement>,onSeeking : ReactEventHandler<HTMLImageElement>,onSeekingCapture : ReactEventHandler<HTMLImageElement>,onSelect : ReactEventHandler<HTMLImageElement>,onSelectCapture : ReactEventHandler<HTMLImageElement>,onStalled : ReactEventHandler<HTMLImageElement>,onStalledCapture : ReactEventHandler<HTMLImageElement>,onSubmit : FormEventHandler<HTMLImageElement>,onSubmitCapture : FormEventHandler<HTMLImageElement>,onSuspend : ReactEventHandler<HTMLImageElement>,onSuspendCapture : ReactEventHandler<HTMLImageElement>,onTimeUpdate : ReactEventHandler<HTMLImageElement>,onTimeUpdateCapture : ReactEventHandler<HTMLImageElement>,onToggle : ToggleEventHandler<HTMLImageElement>,onTouchCancel : TouchEventHandler<HTMLImageElement>,onTouchCancelCapture : TouchEventHandler<HTMLImageElement>,onTouchEnd : TouchEventHandler<HTMLImageElement>,onTouchEndCapture : TouchEventHandler<HTMLImageElement>,onTouchMove : TouchEventHandler<HTMLImageElement>,onTouchMoveCapture : TouchEventHandler<HTMLImageElement>,onTouchStart : TouchEventHandler<HTMLImageElement>,onTouchStartCapture : TouchEventHandler<HTMLImageElement>,onTransitionCancel : TransitionEventHandler<HTMLImageElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLImageElement>,onTransitionEnd : TransitionEventHandler<HTMLImageElement>,onTransitionEndCapture : TransitionEventHandler<HTMLImageElement>,onTransitionRun : TransitionEventHandler<HTMLImageElement>,onTransitionRunCapture : TransitionEventHandler<HTMLImageElement>,onTransitionStart : TransitionEventHandler<HTMLImageElement>,onTransitionStartCapture : TransitionEventHandler<HTMLImageElement>,onVolumeChange : ReactEventHandler<HTMLImageElement>,onVolumeChangeCapture : ReactEventHandler<HTMLImageElement>,onWaiting : ReactEventHandler<HTMLImageElement>,onWaitingCapture : ReactEventHandler<HTMLImageElement>,onWheel : WheelEventHandler<HTMLImageElement>,onWheelCapture : WheelEventHandler<HTMLImageElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,provider : string,radioGroup : string,referrerPolicy : HTMLAttributeReferrerPolicy,rel : string,resource : string,results : number,rev : string,role : AriaRole,security : string,sizes : string,slot : string,spellCheck : Booleanish,srcSet : string,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,tabIndex : number,title : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",useMap : string,vocab : string,width : string | number}

`

### Returns

##### Return Type

`let returnType: Element;

`

 an `<img />` component with the src set to the svg
## TokenIcon

 This component tries to resolve the icon of a given token, then return an image.

### Example

####  Basic usage

`import { TokenProvider, TokenIcon } from "thirdweb/react";

<TokenProvider

address="0x-token-address"

chain={chain}

client={client}

>

 <TokenIcon />

</TokenProvider>;

`

 Result: An `<img />` component with the src of the icon

`<img src="token-icon.png" />

`

####  Override the icon with the `iconResolver` prop

 If you already have the icon url, you can skip the network requests and pass it directly to the TokenIcon

`<TokenIcon iconResolver="/usdc.png" />;

`

 You can also pass in your own custom (async) function that retrieves the icon url

`const getIcon = async () => {

const icon = getIconFromCoinMarketCap(tokenAddress, etc);

return icon;

};

<TokenIcon iconResolver={getIcon} />;

`

####  Show a loading sign while the icon is being loaded

`<TokenIcon loadingComponent={<Spinner />} />;

`

####  Fallback to a dummy image if the token icon fails to resolve

`<TokenIcon fallbackComponent={<img src="blank-image.png" />} />;

`

####  Usage with queryOptions

 TokenIcon uses useQuery() from tanstack query internally. It allows you to pass a custom queryOptions of your choice for more control of the internal fetching logic

`<TokenIcon queryOptions={{ enabled: someLogic, retry: 3 }} />;

`

##### Signature

`function TokenIcon(__namedParameters: [TokenIconProps](https://portal.thirdweb.com/references/typescript/v5/TokenIconProps)): null | Element;

`

### Parameters

##### \_\_namedParameters

#### Type

`let __namedParameters: {about : string,accessKey : string,alt : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,children : ReactNode,className : string,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,crossOrigin : CrossOrigin,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,decoding : "auto" | "async" | "sync",defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",fallbackComponent : Element,fetchPriority : "auto" | "high" | "low",height : string | number,hidden : boolean,iconResolver : string | (() => string) | (() => Promise<string>),id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,loading : "eager" | "lazy",loadingComponent : Element,nonce : string,onAbort : ReactEventHandler<HTMLImageElement>,onAbortCapture : ReactEventHandler<HTMLImageElement>,onAnimationEnd : AnimationEventHandler<HTMLImageElement>,onAnimationEndCapture : AnimationEventHandler<HTMLImageElement>,onAnimationIteration : AnimationEventHandler<HTMLImageElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLImageElement>,onAnimationStart : AnimationEventHandler<HTMLImageElement>,onAnimationStartCapture : AnimationEventHandler<HTMLImageElement>,onAuxClick : MouseEventHandler<HTMLImageElement>,onAuxClickCapture : MouseEventHandler<HTMLImageElement>,onBeforeInput : FormEventHandler<HTMLImageElement>,onBeforeInputCapture : FormEventHandler<HTMLImageElement>,onBeforeToggle : ToggleEventHandler<HTMLImageElement>,onBlur : FocusEventHandler<HTMLImageElement>,onBlurCapture : FocusEventHandler<HTMLImageElement>,onCanPlay : ReactEventHandler<HTMLImageElement>,onCanPlayCapture : ReactEventHandler<HTMLImageElement>,onCanPlayThrough : ReactEventHandler<HTMLImageElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLImageElement>,onChange : FormEventHandler<HTMLImageElement>,onChangeCapture : FormEventHandler<HTMLImageElement>,onClick : MouseEventHandler<HTMLImageElement>,onClickCapture : MouseEventHandler<HTMLImageElement>,onCompositionEnd : CompositionEventHandler<HTMLImageElement>,onCompositionEndCapture : CompositionEventHandler<HTMLImageElement>,onCompositionStart : CompositionEventHandler<HTMLImageElement>,onCompositionStartCapture : CompositionEventHandler<HTMLImageElement>,onCompositionUpdate : CompositionEventHandler<HTMLImageElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLImageElement>,onContextMenu : MouseEventHandler<HTMLImageElement>,onContextMenuCapture : MouseEventHandler<HTMLImageElement>,onCopy : ClipboardEventHandler<HTMLImageElement>,onCopyCapture : ClipboardEventHandler<HTMLImageElement>,onCut : ClipboardEventHandler<HTMLImageElement>,onCutCapture : ClipboardEventHandler<HTMLImageElement>,onDoubleClick : MouseEventHandler<HTMLImageElement>,onDoubleClickCapture : MouseEventHandler<HTMLImageElement>,onDrag : DragEventHandler<HTMLImageElement>,onDragCapture : DragEventHandler<HTMLImageElement>,onDragEnd : DragEventHandler<HTMLImageElement>,onDragEndCapture : DragEventHandler<HTMLImageElement>,onDragEnter : DragEventHandler<HTMLImageElement>,onDragEnterCapture : DragEventHandler<HTMLImageElement>,onDragExit : DragEventHandler<HTMLImageElement>,onDragExitCapture : DragEventHandler<HTMLImageElement>,onDragLeave : DragEventHandler<HTMLImageElement>,onDragLeaveCapture : DragEventHandler<HTMLImageElement>,onDragOver : DragEventHandler<HTMLImageElement>,onDragOverCapture : DragEventHandler<HTMLImageElement>,onDragStart : DragEventHandler<HTMLImageElement>,onDragStartCapture : DragEventHandler<HTMLImageElement>,onDrop : DragEventHandler<HTMLImageElement>,onDropCapture : DragEventHandler<HTMLImageElement>,onDurationChange : ReactEventHandler<HTMLImageElement>,onDurationChangeCapture : ReactEventHandler<HTMLImageElement>,onEmptied : ReactEventHandler<HTMLImageElement>,onEmptiedCapture : ReactEventHandler<HTMLImageElement>,onEncrypted : ReactEventHandler<HTMLImageElement>,onEncryptedCapture : ReactEventHandler<HTMLImageElement>,onEnded : ReactEventHandler<HTMLImageElement>,onEndedCapture : ReactEventHandler<HTMLImageElement>,onError : ReactEventHandler<HTMLImageElement>,onErrorCapture : ReactEventHandler<HTMLImageElement>,onFocus : FocusEventHandler<HTMLImageElement>,onFocusCapture : FocusEventHandler<HTMLImageElement>,onGotPointerCapture : PointerEventHandler<HTMLImageElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLImageElement>,onInput : FormEventHandler<HTMLImageElement>,onInputCapture : FormEventHandler<HTMLImageElement>,onInvalid : FormEventHandler<HTMLImageElement>,onInvalidCapture : FormEventHandler<HTMLImageElement>,onKeyDown : KeyboardEventHandler<HTMLImageElement>,onKeyDownCapture : KeyboardEventHandler<HTMLImageElement>,onKeyPress : KeyboardEventHandler<HTMLImageElement>,onKeyPressCapture : KeyboardEventHandler<HTMLImageElement>,onKeyUp : KeyboardEventHandler<HTMLImageElement>,onKeyUpCapture : KeyboardEventHandler<HTMLImageElement>,onLoad : ReactEventHandler<HTMLImageElement>,onLoadCapture : ReactEventHandler<HTMLImageElement>,onLoadedData : ReactEventHandler<HTMLImageElement>,onLoadedDataCapture : ReactEventHandler<HTMLImageElement>,onLoadedMetadata : ReactEventHandler<HTMLImageElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLImageElement>,onLoadStart : ReactEventHandler<HTMLImageElement>,onLoadStartCapture : ReactEventHandler<HTMLImageElement>,onLostPointerCapture : PointerEventHandler<HTMLImageElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLImageElement>,onMouseDown : MouseEventHandler<HTMLImageElement>,onMouseDownCapture : MouseEventHandler<HTMLImageElement>,onMouseEnter : MouseEventHandler<HTMLImageElement>,onMouseLeave : MouseEventHandler<HTMLImageElement>,onMouseMove : MouseEventHandler<HTMLImageElement>,onMouseMoveCapture : MouseEventHandler<HTMLImageElement>,onMouseOut : MouseEventHandler<HTMLImageElement>,onMouseOutCapture : MouseEventHandler<HTMLImageElement>,onMouseOver : MouseEventHandler<HTMLImageElement>,onMouseOverCapture : MouseEventHandler<HTMLImageElement>,onMouseUp : MouseEventHandler<HTMLImageElement>,onMouseUpCapture : MouseEventHandler<HTMLImageElement>,onPaste : ClipboardEventHandler<HTMLImageElement>,onPasteCapture : ClipboardEventHandler<HTMLImageElement>,onPause : ReactEventHandler<HTMLImageElement>,onPauseCapture : ReactEventHandler<HTMLImageElement>,onPlay : ReactEventHandler<HTMLImageElement>,onPlayCapture : ReactEventHandler<HTMLImageElement>,onPlaying : ReactEventHandler<HTMLImageElement>,onPlayingCapture : ReactEventHandler<HTMLImageElement>,onPointerCancel : PointerEventHandler<HTMLImageElement>,onPointerCancelCapture : PointerEventHandler<HTMLImageElement>,onPointerDown : PointerEventHandler<HTMLImageElement>,onPointerDownCapture : PointerEventHandler<HTMLImageElement>,onPointerEnter : PointerEventHandler<HTMLImageElement>,onPointerLeave : PointerEventHandler<HTMLImageElement>,onPointerMove : PointerEventHandler<HTMLImageElement>,onPointerMoveCapture : PointerEventHandler<HTMLImageElement>,onPointerOut : PointerEventHandler<HTMLImageElement>,onPointerOutCapture : PointerEventHandler<HTMLImageElement>,onPointerOver : PointerEventHandler<HTMLImageElement>,onPointerOverCapture : PointerEventHandler<HTMLImageElement>,onPointerUp : PointerEventHandler<HTMLImageElement>,onPointerUpCapture : PointerEventHandler<HTMLImageElement>,onProgress : ReactEventHandler<HTMLImageElement>,onProgressCapture : ReactEventHandler<HTMLImageElement>,onRateChange : ReactEventHandler<HTMLImageElement>,onRateChangeCapture : ReactEventHandler<HTMLImageElement>,onReset : FormEventHandler<HTMLImageElement>,onResetCapture : FormEventHandler<HTMLImageElement>,onResize : ReactEventHandler<HTMLImageElement>,onResizeCapture : ReactEventHandler<HTMLImageElement>,onScroll : UIEventHandler<HTMLImageElement>,onScrollCapture : UIEventHandler<HTMLImageElement>,onSeeked : ReactEventHandler<HTMLImageElement>,onSeekedCapture : ReactEventHandler<HTMLImageElement>,onSeeking : ReactEventHandler<HTMLImageElement>,onSeekingCapture : ReactEventHandler<HTMLImageElement>,onSelect : ReactEventHandler<HTMLImageElement>,onSelectCapture : ReactEventHandler<HTMLImageElement>,onStalled : ReactEventHandler<HTMLImageElement>,onStalledCapture : ReactEventHandler<HTMLImageElement>,onSubmit : FormEventHandler<HTMLImageElement>,onSubmitCapture : FormEventHandler<HTMLImageElement>,onSuspend : ReactEventHandler<HTMLImageElement>,onSuspendCapture : ReactEventHandler<HTMLImageElement>,onTimeUpdate : ReactEventHandler<HTMLImageElement>,onTimeUpdateCapture : ReactEventHandler<HTMLImageElement>,onToggle : ToggleEventHandler<HTMLImageElement>,onTouchCancel : TouchEventHandler<HTMLImageElement>,onTouchCancelCapture : TouchEventHandler<HTMLImageElement>,onTouchEnd : TouchEventHandler<HTMLImageElement>,onTouchEndCapture : TouchEventHandler<HTMLImageElement>,onTouchMove : TouchEventHandler<HTMLImageElement>,onTouchMoveCapture : TouchEventHandler<HTMLImageElement>,onTouchStart : TouchEventHandler<HTMLImageElement>,onTouchStartCapture : TouchEventHandler<HTMLImageElement>,onTransitionCancel : TransitionEventHandler<HTMLImageElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLImageElement>,onTransitionEnd : TransitionEventHandler<HTMLImageElement>,onTransitionEndCapture : TransitionEventHandler<HTMLImageElement>,onTransitionRun : TransitionEventHandler<HTMLImageElement>,onTransitionRunCapture : TransitionEventHandler<HTMLImageElement>,onTransitionStart : TransitionEventHandler<HTMLImageElement>,onTransitionStartCapture : TransitionEventHandler<HTMLImageElement>,onVolumeChange : ReactEventHandler<HTMLImageElement>,onVolumeChangeCapture : ReactEventHandler<HTMLImageElement>,onWaiting : ReactEventHandler<HTMLImageElement>,onWaitingCapture : ReactEventHandler<HTMLImageElement>,onWheel : WheelEventHandler<HTMLImageElement>,onWheelCapture : WheelEventHandler<HTMLImageElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,queryOptions : Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">,radioGroup : string,referrerPolicy : HTMLAttributeReferrerPolicy,rel : string,resource : string,results : number,rev : string,role : AriaRole,security : string,sizes : string,slot : string,spellCheck : Booleanish,srcSet : string,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,tabIndex : number,title : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",useMap : string,vocab : string,width : string | number}

`

### Returns

##### Return Type

`let returnType: null | Element;

`

 an `<img />` with the src of the token icon
## TokenName

 This component fetches then shows the name of a token. For ERC20 tokens, it calls the `name` function in the ERC20 contract. It inherits all the attributes of a HTML `<span>` component, hence you can style it just like how you would style a normal `<span>`

### Example

####  Basic usage

`import { TokenProvider, TokenName } from "thirdweb/react";

import { ethereum } from "thirdweb/chains";

<TokenProvider {...props}>

 <TokenName />

</TokenProvider>;

`

 Result:

`<span>Ether</span>

`

####  Custom name resolver

 By default TokenName will call the `name` method of the token contract. However if you have a different way to fetch the name, you can pass the function to the `nameResolver` prop. Note: nameResolver should either be a string or a function (async) that returns a string.

`async function fetchNameMethod() {

// your own fetching logic

return "the token name";

}

<TokenName nameResolver={fetchNameMethod} />;

`

 Alternatively you can also pass in a string directly:

`<TokenName nameResolver="USD Coin Circle" />;

`

####  Format the name (capitalize, truncate, etc.)

 The TokenName component accepts a `formatFn` which takes in a string and outputs a string The function is used to modify the name of the token

`const concatStr = (str: string):string => str + "Token"

<TokenName formatFn={concatStr} />

`

 Result:

`<span>Ether Token</span>

`

####  Show a loading sign when the name is being fetched

`import { TokenProvider, TokenName } from "thirdweb/react";

<TokenProvider address="0x...">

 <TokenName loadingComponent={<Spinner />} />

</TokenProvider>;

`

####  Fallback to something when the name fails to resolve

`<TokenProvider address="0x...">

 <TokenName fallbackComponent={"Failed to load"} />

</TokenProvider>;

`

####  Custom query options for useQuery

 This component uses `@tanstack-query` 's useQuery internally. You can use the `queryOptions` prop for more fine-grained control

`<TokenName

queryOptions={{

 enabled: isEnabled,

 retry: 4,

 }}

/>;

`

##### Signature

`function TokenName(__namedParameters: [TokenNameProps](https://portal.thirdweb.com/references/typescript/v5/TokenNameProps)): null | Element;

`

### Parameters

##### \_\_namedParameters

#### Type

`let __namedParameters: {about : string,accessKey : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,className : string,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",fallbackComponent : Element,formatFn : (str: string) => string,hidden : boolean,id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,loadingComponent : Element,nameResolver : string | (() => string) | (() => Promise<string>),nonce : string,onAbort : ReactEventHandler<HTMLSpanElement>,onAbortCapture : ReactEventHandler<HTMLSpanElement>,onAnimationEnd : AnimationEventHandler<HTMLSpanElement>,onAnimationEndCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationIteration : AnimationEventHandler<HTMLSpanElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationStart : AnimationEventHandler<HTMLSpanElement>,onAnimationStartCapture : AnimationEventHandler<HTMLSpanElement>,onAuxClick : MouseEventHandler<HTMLSpanElement>,onAuxClickCapture : MouseEventHandler<HTMLSpanElement>,onBeforeInput : FormEventHandler<HTMLSpanElement>,onBeforeInputCapture : FormEventHandler<HTMLSpanElement>,onBeforeToggle : ToggleEventHandler<HTMLSpanElement>,onBlur : FocusEventHandler<HTMLSpanElement>,onBlurCapture : FocusEventHandler<HTMLSpanElement>,onCanPlay : ReactEventHandler<HTMLSpanElement>,onCanPlayCapture : ReactEventHandler<HTMLSpanElement>,onCanPlayThrough : ReactEventHandler<HTMLSpanElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLSpanElement>,onChange : FormEventHandler<HTMLSpanElement>,onChangeCapture : FormEventHandler<HTMLSpanElement>,onClick : MouseEventHandler<HTMLSpanElement>,onClickCapture : MouseEventHandler<HTMLSpanElement>,onCompositionEnd : CompositionEventHandler<HTMLSpanElement>,onCompositionEndCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionStart : CompositionEventHandler<HTMLSpanElement>,onCompositionStartCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdate : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLSpanElement>,onContextMenu : MouseEventHandler<HTMLSpanElement>,onContextMenuCapture : MouseEventHandler<HTMLSpanElement>,onCopy : ClipboardEventHandler<HTMLSpanElement>,onCopyCapture : ClipboardEventHandler<HTMLSpanElement>,onCut : ClipboardEventHandler<HTMLSpanElement>,onCutCapture : ClipboardEventHandler<HTMLSpanElement>,onDoubleClick : MouseEventHandler<HTMLSpanElement>,onDoubleClickCapture : MouseEventHandler<HTMLSpanElement>,onDrag : DragEventHandler<HTMLSpanElement>,onDragCapture : DragEventHandler<HTMLSpanElement>,onDragEnd : DragEventHandler<HTMLSpanElement>,onDragEndCapture : DragEventHandler<HTMLSpanElement>,onDragEnter : DragEventHandler<HTMLSpanElement>,onDragEnterCapture : DragEventHandler<HTMLSpanElement>,onDragExit : DragEventHandler<HTMLSpanElement>,onDragExitCapture : DragEventHandler<HTMLSpanElement>,onDragLeave : DragEventHandler<HTMLSpanElement>,onDragLeaveCapture : DragEventHandler<HTMLSpanElement>,onDragOver : DragEventHandler<HTMLSpanElement>,onDragOverCapture : DragEventHandler<HTMLSpanElement>,onDragStart : DragEventHandler<HTMLSpanElement>,onDragStartCapture : DragEventHandler<HTMLSpanElement>,onDrop : DragEventHandler<HTMLSpanElement>,onDropCapture : DragEventHandler<HTMLSpanElement>,onDurationChange : ReactEventHandler<HTMLSpanElement>,onDurationChangeCapture : ReactEventHandler<HTMLSpanElement>,onEmptied : ReactEventHandler<HTMLSpanElement>,onEmptiedCapture : ReactEventHandler<HTMLSpanElement>,onEncrypted : ReactEventHandler<HTMLSpanElement>,onEncryptedCapture : ReactEventHandler<HTMLSpanElement>,onEnded : ReactEventHandler<HTMLSpanElement>,onEndedCapture : ReactEventHandler<HTMLSpanElement>,onError : ReactEventHandler<HTMLSpanElement>,onErrorCapture : ReactEventHandler<HTMLSpanElement>,onFocus : FocusEventHandler<HTMLSpanElement>,onFocusCapture : FocusEventHandler<HTMLSpanElement>,onGotPointerCapture : PointerEventHandler<HTMLSpanElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onInput : FormEventHandler<HTMLSpanElement>,onInputCapture : FormEventHandler<HTMLSpanElement>,onInvalid : FormEventHandler<HTMLSpanElement>,onInvalidCapture : FormEventHandler<HTMLSpanElement>,onKeyDown : KeyboardEventHandler<HTMLSpanElement>,onKeyDownCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyPress : KeyboardEventHandler<HTMLSpanElement>,onKeyPressCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyUp : KeyboardEventHandler<HTMLSpanElement>,onKeyUpCapture : KeyboardEventHandler<HTMLSpanElement>,onLoad : ReactEventHandler<HTMLSpanElement>,onLoadCapture : ReactEventHandler<HTMLSpanElement>,onLoadedData : ReactEventHandler<HTMLSpanElement>,onLoadedDataCapture : ReactEventHandler<HTMLSpanElement>,onLoadedMetadata : ReactEventHandler<HTMLSpanElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLSpanElement>,onLoadStart : ReactEventHandler<HTMLSpanElement>,onLoadStartCapture : ReactEventHandler<HTMLSpanElement>,onLostPointerCapture : PointerEventHandler<HTMLSpanElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onMouseDown : MouseEventHandler<HTMLSpanElement>,onMouseDownCapture : MouseEventHandler<HTMLSpanElement>,onMouseEnter : MouseEventHandler<HTMLSpanElement>,onMouseLeave : MouseEventHandler<HTMLSpanElement>,onMouseMove : MouseEventHandler<HTMLSpanElement>,onMouseMoveCapture : MouseEventHandler<HTMLSpanElement>,onMouseOut : MouseEventHandler<HTMLSpanElement>,onMouseOutCapture : MouseEventHandler<HTMLSpanElement>,onMouseOver : MouseEventHandler<HTMLSpanElement>,onMouseOverCapture : MouseEventHandler<HTMLSpanElement>,onMouseUp : MouseEventHandler<HTMLSpanElement>,onMouseUpCapture : MouseEventHandler<HTMLSpanElement>,onPaste : ClipboardEventHandler<HTMLSpanElement>,onPasteCapture : ClipboardEventHandler<HTMLSpanElement>,onPause : ReactEventHandler<HTMLSpanElement>,onPauseCapture : ReactEventHandler<HTMLSpanElement>,onPlay : ReactEventHandler<HTMLSpanElement>,onPlayCapture : ReactEventHandler<HTMLSpanElement>,onPlaying : ReactEventHandler<HTMLSpanElement>,onPlayingCapture : ReactEventHandler<HTMLSpanElement>,onPointerCancel : PointerEventHandler<HTMLSpanElement>,onPointerCancelCapture : PointerEventHandler<HTMLSpanElement>,onPointerDown : PointerEventHandler<HTMLSpanElement>,onPointerDownCapture : PointerEventHandler<HTMLSpanElement>,onPointerEnter : PointerEventHandler<HTMLSpanElement>,onPointerLeave : PointerEventHandler<HTMLSpanElement>,onPointerMove : PointerEventHandler<HTMLSpanElement>,onPointerMoveCapture : PointerEventHandler<HTMLSpanElement>,onPointerOut : PointerEventHandler<HTMLSpanElement>,onPointerOutCapture : PointerEventHandler<HTMLSpanElement>,onPointerOver : PointerEventHandler<HTMLSpanElement>,onPointerOverCapture : PointerEventHandler<HTMLSpanElement>,onPointerUp : PointerEventHandler<HTMLSpanElement>,onPointerUpCapture : PointerEventHandler<HTMLSpanElement>,onProgress : ReactEventHandler<HTMLSpanElement>,onProgressCapture : ReactEventHandler<HTMLSpanElement>,onRateChange : ReactEventHandler<HTMLSpanElement>,onRateChangeCapture : ReactEventHandler<HTMLSpanElement>,onReset : FormEventHandler<HTMLSpanElement>,onResetCapture : FormEventHandler<HTMLSpanElement>,onResize : ReactEventHandler<HTMLSpanElement>,onResizeCapture : ReactEventHandler<HTMLSpanElement>,onScroll : UIEventHandler<HTMLSpanElement>,onScrollCapture : UIEventHandler<HTMLSpanElement>,onSeeked : ReactEventHandler<HTMLSpanElement>,onSeekedCapture : ReactEventHandler<HTMLSpanElement>,onSeeking : ReactEventHandler<HTMLSpanElement>,onSeekingCapture : ReactEventHandler<HTMLSpanElement>,onSelect : ReactEventHandler<HTMLSpanElement>,onSelectCapture : ReactEventHandler<HTMLSpanElement>,onStalled : ReactEventHandler<HTMLSpanElement>,onStalledCapture : ReactEventHandler<HTMLSpanElement>,onSubmit : FormEventHandler<HTMLSpanElement>,onSubmitCapture : FormEventHandler<HTMLSpanElement>,onSuspend : ReactEventHandler<HTMLSpanElement>,onSuspendCapture : ReactEventHandler<HTMLSpanElement>,onTimeUpdate : ReactEventHandler<HTMLSpanElement>,onTimeUpdateCapture : ReactEventHandler<HTMLSpanElement>,onToggle : ToggleEventHandler<HTMLSpanElement>,onTouchCancel : TouchEventHandler<HTMLSpanElement>,onTouchCancelCapture : TouchEventHandler<HTMLSpanElement>,onTouchEnd : TouchEventHandler<HTMLSpanElement>,onTouchEndCapture : TouchEventHandler<HTMLSpanElement>,onTouchMove : TouchEventHandler<HTMLSpanElement>,onTouchMoveCapture : TouchEventHandler<HTMLSpanElement>,onTouchStart : TouchEventHandler<HTMLSpanElement>,onTouchStartCapture : TouchEventHandler<HTMLSpanElement>,onTransitionCancel : TransitionEventHandler<HTMLSpanElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionEnd : TransitionEventHandler<HTMLSpanElement>,onTransitionEndCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionRun : TransitionEventHandler<HTMLSpanElement>,onTransitionRunCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionStart : TransitionEventHandler<HTMLSpanElement>,onTransitionStartCapture : TransitionEventHandler<HTMLSpanElement>,onVolumeChange : ReactEventHandler<HTMLSpanElement>,onVolumeChangeCapture : ReactEventHandler<HTMLSpanElement>,onWaiting : ReactEventHandler<HTMLSpanElement>,onWaitingCapture : ReactEventHandler<HTMLSpanElement>,onWheel : WheelEventHandler<HTMLSpanElement>,onWheelCapture : WheelEventHandler<HTMLSpanElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,queryOptions : Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">,radioGroup : string,rel : string,resource : string,results : number,rev : string,role : AriaRole,security : string,slot : string,spellCheck : Booleanish,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,tabIndex : number,title : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",vocab : string}

`

### Returns

##### Return Type

`let returnType: null | Element;

`
## TokenSymbol

 This component fetches then shows the symbol of a token. For ERC20 tokens, it calls the `symbol` function in the ERC20 contract. It inherits all the attributes of a HTML `<span>` component, hence you can style it just like how you would style a normal `<span>`

### Example

####  Basic usage

`import { TokenProvider, TokenSymbol } from "thirdweb/react";

import { ethereum } from "thirdweb/chains";

<TokenProvider {...props}>

 <TokenSymbol />

</TokenProvider>;

`

 Result:

`<span>ETH</span>

`

####  Custom symbol resolver

 By default, TokenSymbol calls the `symbol` function of your contract, however, if your token as an unconventional way to fetch the symbol, you can pass the custom logic to the `symbolResolver` prop. It can either be a string or a function (async) that returns or resolves to a string.

`async function getSymbol() {

// your own fetching logic

return "the symbol";

}

<TokenSymbol symbolResolver={getSymbol} />;

`

 Alternatively, you can pass in a string directly:

`<TokenSymbol symbolResolver="USDC.e" />;

`

####  Format the symbol (capitalize, truncate, etc.)

 The TokenSymbol component accepts a `formatFn` which takes in a string and outputs a string The function is used to modify the symbol of the token

`const concatStr = (str: string):string => str + "Token"

<TokenSymbol formatFn={concatStr} />

`

 Result:

`<span>Ether Token</span>

`

####  Show a loading sign when the symbol is being fetched

`import { TokenProvider, TokenSymbol } from "thirdweb/react";

<TokenProvider address="0x...">

 <TokenSymbol loadingComponent={<Spinner />} />

</TokenProvider>;

`

####  Fallback to something when the symbol fails to resolve

`<TokenProvider address="0x...">

 <TokenSymbol fallbackComponent={"Failed to load"} />

</TokenProvider>;

`

####  Custom query options for useQuery

 This component uses `@tanstack-query` 's useQuery internally. You can use the `queryOptions` prop for more fine-grained control

`<TokenSymbol

queryOptions={{

 enabled: isEnabled,

 retry: 4,

 }}

/>;

`

##### Signature

`function TokenSymbol(

__namedParameters: [TokenSymbolProps](https://portal.thirdweb.com/references/typescript/v5/TokenSymbolProps),

): null | Element;

`

### Parameters

##### \_\_namedParameters

#### Type

`let __namedParameters: {about : string,accessKey : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,className : string,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",fallbackComponent : Element,formatFn : (str: string) => string,hidden : boolean,id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,loadingComponent : Element,nonce : string,onAbort : ReactEventHandler<HTMLSpanElement>,onAbortCapture : ReactEventHandler<HTMLSpanElement>,onAnimationEnd : AnimationEventHandler<HTMLSpanElement>,onAnimationEndCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationIteration : AnimationEventHandler<HTMLSpanElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationStart : AnimationEventHandler<HTMLSpanElement>,onAnimationStartCapture : AnimationEventHandler<HTMLSpanElement>,onAuxClick : MouseEventHandler<HTMLSpanElement>,onAuxClickCapture : MouseEventHandler<HTMLSpanElement>,onBeforeInput : FormEventHandler<HTMLSpanElement>,onBeforeInputCapture : FormEventHandler<HTMLSpanElement>,onBeforeToggle : ToggleEventHandler<HTMLSpanElement>,onBlur : FocusEventHandler<HTMLSpanElement>,onBlurCapture : FocusEventHandler<HTMLSpanElement>,onCanPlay : ReactEventHandler<HTMLSpanElement>,onCanPlayCapture : ReactEventHandler<HTMLSpanElement>,onCanPlayThrough : ReactEventHandler<HTMLSpanElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLSpanElement>,onChange : FormEventHandler<HTMLSpanElement>,onChangeCapture : FormEventHandler<HTMLSpanElement>,onClick : MouseEventHandler<HTMLSpanElement>,onClickCapture : MouseEventHandler<HTMLSpanElement>,onCompositionEnd : CompositionEventHandler<HTMLSpanElement>,onCompositionEndCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionStart : CompositionEventHandler<HTMLSpanElement>,onCompositionStartCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdate : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLSpanElement>,onContextMenu : MouseEventHandler<HTMLSpanElement>,onContextMenuCapture : MouseEventHandler<HTMLSpanElement>,onCopy : ClipboardEventHandler<HTMLSpanElement>,onCopyCapture : ClipboardEventHandler<HTMLSpanElement>,onCut : ClipboardEventHandler<HTMLSpanElement>,onCutCapture : ClipboardEventHandler<HTMLSpanElement>,onDoubleClick : MouseEventHandler<HTMLSpanElement>,onDoubleClickCapture : MouseEventHandler<HTMLSpanElement>,onDrag : DragEventHandler<HTMLSpanElement>,onDragCapture : DragEventHandler<HTMLSpanElement>,onDragEnd : DragEventHandler<HTMLSpanElement>,onDragEndCapture : DragEventHandler<HTMLSpanElement>,onDragEnter : DragEventHandler<HTMLSpanElement>,onDragEnterCapture : DragEventHandler<HTMLSpanElement>,onDragExit : DragEventHandler<HTMLSpanElement>,onDragExitCapture : DragEventHandler<HTMLSpanElement>,onDragLeave : DragEventHandler<HTMLSpanElement>,onDragLeaveCapture : DragEventHandler<HTMLSpanElement>,onDragOver : DragEventHandler<HTMLSpanElement>,onDragOverCapture : DragEventHandler<HTMLSpanElement>,onDragStart : DragEventHandler<HTMLSpanElement>,onDragStartCapture : DragEventHandler<HTMLSpanElement>,onDrop : DragEventHandler<HTMLSpanElement>,onDropCapture : DragEventHandler<HTMLSpanElement>,onDurationChange : ReactEventHandler<HTMLSpanElement>,onDurationChangeCapture : ReactEventHandler<HTMLSpanElement>,onEmptied : ReactEventHandler<HTMLSpanElement>,onEmptiedCapture : ReactEventHandler<HTMLSpanElement>,onEncrypted : ReactEventHandler<HTMLSpanElement>,onEncryptedCapture : ReactEventHandler<HTMLSpanElement>,onEnded : ReactEventHandler<HTMLSpanElement>,onEndedCapture : ReactEventHandler<HTMLSpanElement>,onError : ReactEventHandler<HTMLSpanElement>,onErrorCapture : ReactEventHandler<HTMLSpanElement>,onFocus : FocusEventHandler<HTMLSpanElement>,onFocusCapture : FocusEventHandler<HTMLSpanElement>,onGotPointerCapture : PointerEventHandler<HTMLSpanElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onInput : FormEventHandler<HTMLSpanElement>,onInputCapture : FormEventHandler<HTMLSpanElement>,onInvalid : FormEventHandler<HTMLSpanElement>,onInvalidCapture : FormEventHandler<HTMLSpanElement>,onKeyDown : KeyboardEventHandler<HTMLSpanElement>,onKeyDownCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyPress : KeyboardEventHandler<HTMLSpanElement>,onKeyPressCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyUp : KeyboardEventHandler<HTMLSpanElement>,onKeyUpCapture : KeyboardEventHandler<HTMLSpanElement>,onLoad : ReactEventHandler<HTMLSpanElement>,onLoadCapture : ReactEventHandler<HTMLSpanElement>,onLoadedData : ReactEventHandler<HTMLSpanElement>,onLoadedDataCapture : ReactEventHandler<HTMLSpanElement>,onLoadedMetadata : ReactEventHandler<HTMLSpanElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLSpanElement>,onLoadStart : ReactEventHandler<HTMLSpanElement>,onLoadStartCapture : ReactEventHandler<HTMLSpanElement>,onLostPointerCapture : PointerEventHandler<HTMLSpanElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onMouseDown : MouseEventHandler<HTMLSpanElement>,onMouseDownCapture : MouseEventHandler<HTMLSpanElement>,onMouseEnter : MouseEventHandler<HTMLSpanElement>,onMouseLeave : MouseEventHandler<HTMLSpanElement>,onMouseMove : MouseEventHandler<HTMLSpanElement>,onMouseMoveCapture : MouseEventHandler<HTMLSpanElement>,onMouseOut : MouseEventHandler<HTMLSpanElement>,onMouseOutCapture : MouseEventHandler<HTMLSpanElement>,onMouseOver : MouseEventHandler<HTMLSpanElement>,onMouseOverCapture : MouseEventHandler<HTMLSpanElement>,onMouseUp : MouseEventHandler<HTMLSpanElement>,onMouseUpCapture : MouseEventHandler<HTMLSpanElement>,onPaste : ClipboardEventHandler<HTMLSpanElement>,onPasteCapture : ClipboardEventHandler<HTMLSpanElement>,onPause : ReactEventHandler<HTMLSpanElement>,onPauseCapture : ReactEventHandler<HTMLSpanElement>,onPlay : ReactEventHandler<HTMLSpanElement>,onPlayCapture : ReactEventHandler<HTMLSpanElement>,onPlaying : ReactEventHandler<HTMLSpanElement>,onPlayingCapture : ReactEventHandler<HTMLSpanElement>,onPointerCancel : PointerEventHandler<HTMLSpanElement>,onPointerCancelCapture : PointerEventHandler<HTMLSpanElement>,onPointerDown : PointerEventHandler<HTMLSpanElement>,onPointerDownCapture : PointerEventHandler<HTMLSpanElement>,onPointerEnter : PointerEventHandler<HTMLSpanElement>,onPointerLeave : PointerEventHandler<HTMLSpanElement>,onPointerMove : PointerEventHandler<HTMLSpanElement>,onPointerMoveCapture : PointerEventHandler<HTMLSpanElement>,onPointerOut : PointerEventHandler<HTMLSpanElement>,onPointerOutCapture : PointerEventHandler<HTMLSpanElement>,onPointerOver : PointerEventHandler<HTMLSpanElement>,onPointerOverCapture : PointerEventHandler<HTMLSpanElement>,onPointerUp : PointerEventHandler<HTMLSpanElement>,onPointerUpCapture : PointerEventHandler<HTMLSpanElement>,onProgress : ReactEventHandler<HTMLSpanElement>,onProgressCapture : ReactEventHandler<HTMLSpanElement>,onRateChange : ReactEventHandler<HTMLSpanElement>,onRateChangeCapture : ReactEventHandler<HTMLSpanElement>,onReset : FormEventHandler<HTMLSpanElement>,onResetCapture : FormEventHandler<HTMLSpanElement>,onResize : ReactEventHandler<HTMLSpanElement>,onResizeCapture : ReactEventHandler<HTMLSpanElement>,onScroll : UIEventHandler<HTMLSpanElement>,onScrollCapture : UIEventHandler<HTMLSpanElement>,onSeeked : ReactEventHandler<HTMLSpanElement>,onSeekedCapture : ReactEventHandler<HTMLSpanElement>,onSeeking : ReactEventHandler<HTMLSpanElement>,onSeekingCapture : ReactEventHandler<HTMLSpanElement>,onSelect : ReactEventHandler<HTMLSpanElement>,onSelectCapture : ReactEventHandler<HTMLSpanElement>,onStalled : ReactEventHandler<HTMLSpanElement>,onStalledCapture : ReactEventHandler<HTMLSpanElement>,onSubmit : FormEventHandler<HTMLSpanElement>,onSubmitCapture : FormEventHandler<HTMLSpanElement>,onSuspend : ReactEventHandler<HTMLSpanElement>,onSuspendCapture : ReactEventHandler<HTMLSpanElement>,onTimeUpdate : ReactEventHandler<HTMLSpanElement>,onTimeUpdateCapture : ReactEventHandler<HTMLSpanElement>,onToggle : ToggleEventHandler<HTMLSpanElement>,onTouchCancel : TouchEventHandler<HTMLSpanElement>,onTouchCancelCapture : TouchEventHandler<HTMLSpanElement>,onTouchEnd : TouchEventHandler<HTMLSpanElement>,onTouchEndCapture : TouchEventHandler<HTMLSpanElement>,onTouchMove : TouchEventHandler<HTMLSpanElement>,onTouchMoveCapture : TouchEventHandler<HTMLSpanElement>,onTouchStart : TouchEventHandler<HTMLSpanElement>,onTouchStartCapture : TouchEventHandler<HTMLSpanElement>,onTransitionCancel : TransitionEventHandler<HTMLSpanElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionEnd : TransitionEventHandler<HTMLSpanElement>,onTransitionEndCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionRun : TransitionEventHandler<HTMLSpanElement>,onTransitionRunCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionStart : TransitionEventHandler<HTMLSpanElement>,onTransitionStartCapture : TransitionEventHandler<HTMLSpanElement>,onVolumeChange : ReactEventHandler<HTMLSpanElement>,onVolumeChangeCapture : ReactEventHandler<HTMLSpanElement>,onWaiting : ReactEventHandler<HTMLSpanElement>,onWaitingCapture : ReactEventHandler<HTMLSpanElement>,onWheel : WheelEventHandler<HTMLSpanElement>,onWheelCapture : WheelEventHandler<HTMLSpanElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,queryOptions : Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">,radioGroup : string,rel : string,resource : string,results : number,rev : string,role : AriaRole,security : string,slot : string,spellCheck : Booleanish,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,symbolResolver : string | (() => string) | (() => Promise<string>),tabIndex : number,title : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",vocab : string}

`

### Returns

##### Return Type

`let returnType: null | Element;

`
## WalletIcon

 This component tries to resolve the icon of a given wallet, then return an image.

### Example

####  Basic usage

`import { WalletProvider, WalletIcon } from "thirdweb/react";

<WalletProvider id="io.metamask">

 <WalletIcon />

</WalletProvider>;

`

 Result: An `<img />` component with the src of the icon

`<img src="metamask-icon.png" />

`

####  Show a loading sign while the icon is being loaded

`<WalletIcon loadingComponent={<Spinner />} />;

`

####  Fallback to a dummy image if the wallet icon fails to resolve

`<WalletIcon fallbackComponent={<img src="blank-image.png" />} />;

`

####  Usage with queryOptions

 WalletIcon uses useQuery() from tanstack query internally. It allows you to pass a custom queryOptions of your choice for more control of the internal fetching logic

`<WalletIcon queryOptions={{ enabled: someLogic, retry: 3 }} />;

`

##### Signature

`function WalletIcon(

__namedParameters: [WalletIconProps](https://portal.thirdweb.com/references/typescript/v5/WalletIconProps),

): null | Element;

`

### Parameters

##### \_\_namedParameters

#### Type

`let __namedParameters: {about : string,accessKey : string,alt : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,children : ReactNode,className : string,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,crossOrigin : CrossOrigin,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,decoding : "auto" | "async" | "sync",defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",fallbackComponent : Element,fetchPriority : "auto" | "high" | "low",height : string | number,hidden : boolean,id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,loading : "eager" | "lazy",loadingComponent : Element,nonce : string,onAbort : ReactEventHandler<HTMLImageElement>,onAbortCapture : ReactEventHandler<HTMLImageElement>,onAnimationEnd : AnimationEventHandler<HTMLImageElement>,onAnimationEndCapture : AnimationEventHandler<HTMLImageElement>,onAnimationIteration : AnimationEventHandler<HTMLImageElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLImageElement>,onAnimationStart : AnimationEventHandler<HTMLImageElement>,onAnimationStartCapture : AnimationEventHandler<HTMLImageElement>,onAuxClick : MouseEventHandler<HTMLImageElement>,onAuxClickCapture : MouseEventHandler<HTMLImageElement>,onBeforeInput : FormEventHandler<HTMLImageElement>,onBeforeInputCapture : FormEventHandler<HTMLImageElement>,onBeforeToggle : ToggleEventHandler<HTMLImageElement>,onBlur : FocusEventHandler<HTMLImageElement>,onBlurCapture : FocusEventHandler<HTMLImageElement>,onCanPlay : ReactEventHandler<HTMLImageElement>,onCanPlayCapture : ReactEventHandler<HTMLImageElement>,onCanPlayThrough : ReactEventHandler<HTMLImageElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLImageElement>,onChange : FormEventHandler<HTMLImageElement>,onChangeCapture : FormEventHandler<HTMLImageElement>,onClick : MouseEventHandler<HTMLImageElement>,onClickCapture : MouseEventHandler<HTMLImageElement>,onCompositionEnd : CompositionEventHandler<HTMLImageElement>,onCompositionEndCapture : CompositionEventHandler<HTMLImageElement>,onCompositionStart : CompositionEventHandler<HTMLImageElement>,onCompositionStartCapture : CompositionEventHandler<HTMLImageElement>,onCompositionUpdate : CompositionEventHandler<HTMLImageElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLImageElement>,onContextMenu : MouseEventHandler<HTMLImageElement>,onContextMenuCapture : MouseEventHandler<HTMLImageElement>,onCopy : ClipboardEventHandler<HTMLImageElement>,onCopyCapture : ClipboardEventHandler<HTMLImageElement>,onCut : ClipboardEventHandler<HTMLImageElement>,onCutCapture : ClipboardEventHandler<HTMLImageElement>,onDoubleClick : MouseEventHandler<HTMLImageElement>,onDoubleClickCapture : MouseEventHandler<HTMLImageElement>,onDrag : DragEventHandler<HTMLImageElement>,onDragCapture : DragEventHandler<HTMLImageElement>,onDragEnd : DragEventHandler<HTMLImageElement>,onDragEndCapture : DragEventHandler<HTMLImageElement>,onDragEnter : DragEventHandler<HTMLImageElement>,onDragEnterCapture : DragEventHandler<HTMLImageElement>,onDragExit : DragEventHandler<HTMLImageElement>,onDragExitCapture : DragEventHandler<HTMLImageElement>,onDragLeave : DragEventHandler<HTMLImageElement>,onDragLeaveCapture : DragEventHandler<HTMLImageElement>,onDragOver : DragEventHandler<HTMLImageElement>,onDragOverCapture : DragEventHandler<HTMLImageElement>,onDragStart : DragEventHandler<HTMLImageElement>,onDragStartCapture : DragEventHandler<HTMLImageElement>,onDrop : DragEventHandler<HTMLImageElement>,onDropCapture : DragEventHandler<HTMLImageElement>,onDurationChange : ReactEventHandler<HTMLImageElement>,onDurationChangeCapture : ReactEventHandler<HTMLImageElement>,onEmptied : ReactEventHandler<HTMLImageElement>,onEmptiedCapture : ReactEventHandler<HTMLImageElement>,onEncrypted : ReactEventHandler<HTMLImageElement>,onEncryptedCapture : ReactEventHandler<HTMLImageElement>,onEnded : ReactEventHandler<HTMLImageElement>,onEndedCapture : ReactEventHandler<HTMLImageElement>,onError : ReactEventHandler<HTMLImageElement>,onErrorCapture : ReactEventHandler<HTMLImageElement>,onFocus : FocusEventHandler<HTMLImageElement>,onFocusCapture : FocusEventHandler<HTMLImageElement>,onGotPointerCapture : PointerEventHandler<HTMLImageElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLImageElement>,onInput : FormEventHandler<HTMLImageElement>,onInputCapture : FormEventHandler<HTMLImageElement>,onInvalid : FormEventHandler<HTMLImageElement>,onInvalidCapture : FormEventHandler<HTMLImageElement>,onKeyDown : KeyboardEventHandler<HTMLImageElement>,onKeyDownCapture : KeyboardEventHandler<HTMLImageElement>,onKeyPress : KeyboardEventHandler<HTMLImageElement>,onKeyPressCapture : KeyboardEventHandler<HTMLImageElement>,onKeyUp : KeyboardEventHandler<HTMLImageElement>,onKeyUpCapture : KeyboardEventHandler<HTMLImageElement>,onLoad : ReactEventHandler<HTMLImageElement>,onLoadCapture : ReactEventHandler<HTMLImageElement>,onLoadedData : ReactEventHandler<HTMLImageElement>,onLoadedDataCapture : ReactEventHandler<HTMLImageElement>,onLoadedMetadata : ReactEventHandler<HTMLImageElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLImageElement>,onLoadStart : ReactEventHandler<HTMLImageElement>,onLoadStartCapture : ReactEventHandler<HTMLImageElement>,onLostPointerCapture : PointerEventHandler<HTMLImageElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLImageElement>,onMouseDown : MouseEventHandler<HTMLImageElement>,onMouseDownCapture : MouseEventHandler<HTMLImageElement>,onMouseEnter : MouseEventHandler<HTMLImageElement>,onMouseLeave : MouseEventHandler<HTMLImageElement>,onMouseMove : MouseEventHandler<HTMLImageElement>,onMouseMoveCapture : MouseEventHandler<HTMLImageElement>,onMouseOut : MouseEventHandler<HTMLImageElement>,onMouseOutCapture : MouseEventHandler<HTMLImageElement>,onMouseOver : MouseEventHandler<HTMLImageElement>,onMouseOverCapture : MouseEventHandler<HTMLImageElement>,onMouseUp : MouseEventHandler<HTMLImageElement>,onMouseUpCapture : MouseEventHandler<HTMLImageElement>,onPaste : ClipboardEventHandler<HTMLImageElement>,onPasteCapture : ClipboardEventHandler<HTMLImageElement>,onPause : ReactEventHandler<HTMLImageElement>,onPauseCapture : ReactEventHandler<HTMLImageElement>,onPlay : ReactEventHandler<HTMLImageElement>,onPlayCapture : ReactEventHandler<HTMLImageElement>,onPlaying : ReactEventHandler<HTMLImageElement>,onPlayingCapture : ReactEventHandler<HTMLImageElement>,onPointerCancel : PointerEventHandler<HTMLImageElement>,onPointerCancelCapture : PointerEventHandler<HTMLImageElement>,onPointerDown : PointerEventHandler<HTMLImageElement>,onPointerDownCapture : PointerEventHandler<HTMLImageElement>,onPointerEnter : PointerEventHandler<HTMLImageElement>,onPointerLeave : PointerEventHandler<HTMLImageElement>,onPointerMove : PointerEventHandler<HTMLImageElement>,onPointerMoveCapture : PointerEventHandler<HTMLImageElement>,onPointerOut : PointerEventHandler<HTMLImageElement>,onPointerOutCapture : PointerEventHandler<HTMLImageElement>,onPointerOver : PointerEventHandler<HTMLImageElement>,onPointerOverCapture : PointerEventHandler<HTMLImageElement>,onPointerUp : PointerEventHandler<HTMLImageElement>,onPointerUpCapture : PointerEventHandler<HTMLImageElement>,onProgress : ReactEventHandler<HTMLImageElement>,onProgressCapture : ReactEventHandler<HTMLImageElement>,onRateChange : ReactEventHandler<HTMLImageElement>,onRateChangeCapture : ReactEventHandler<HTMLImageElement>,onReset : FormEventHandler<HTMLImageElement>,onResetCapture : FormEventHandler<HTMLImageElement>,onResize : ReactEventHandler<HTMLImageElement>,onResizeCapture : ReactEventHandler<HTMLImageElement>,onScroll : UIEventHandler<HTMLImageElement>,onScrollCapture : UIEventHandler<HTMLImageElement>,onSeeked : ReactEventHandler<HTMLImageElement>,onSeekedCapture : ReactEventHandler<HTMLImageElement>,onSeeking : ReactEventHandler<HTMLImageElement>,onSeekingCapture : ReactEventHandler<HTMLImageElement>,onSelect : ReactEventHandler<HTMLImageElement>,onSelectCapture : ReactEventHandler<HTMLImageElement>,onStalled : ReactEventHandler<HTMLImageElement>,onStalledCapture : ReactEventHandler<HTMLImageElement>,onSubmit : FormEventHandler<HTMLImageElement>,onSubmitCapture : FormEventHandler<HTMLImageElement>,onSuspend : ReactEventHandler<HTMLImageElement>,onSuspendCapture : ReactEventHandler<HTMLImageElement>,onTimeUpdate : ReactEventHandler<HTMLImageElement>,onTimeUpdateCapture : ReactEventHandler<HTMLImageElement>,onToggle : ToggleEventHandler<HTMLImageElement>,onTouchCancel : TouchEventHandler<HTMLImageElement>,onTouchCancelCapture : TouchEventHandler<HTMLImageElement>,onTouchEnd : TouchEventHandler<HTMLImageElement>,onTouchEndCapture : TouchEventHandler<HTMLImageElement>,onTouchMove : TouchEventHandler<HTMLImageElement>,onTouchMoveCapture : TouchEventHandler<HTMLImageElement>,onTouchStart : TouchEventHandler<HTMLImageElement>,onTouchStartCapture : TouchEventHandler<HTMLImageElement>,onTransitionCancel : TransitionEventHandler<HTMLImageElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLImageElement>,onTransitionEnd : TransitionEventHandler<HTMLImageElement>,onTransitionEndCapture : TransitionEventHandler<HTMLImageElement>,onTransitionRun : TransitionEventHandler<HTMLImageElement>,onTransitionRunCapture : TransitionEventHandler<HTMLImageElement>,onTransitionStart : TransitionEventHandler<HTMLImageElement>,onTransitionStartCapture : TransitionEventHandler<HTMLImageElement>,onVolumeChange : ReactEventHandler<HTMLImageElement>,onVolumeChangeCapture : ReactEventHandler<HTMLImageElement>,onWaiting : ReactEventHandler<HTMLImageElement>,onWaitingCapture : ReactEventHandler<HTMLImageElement>,onWheel : WheelEventHandler<HTMLImageElement>,onWheelCapture : WheelEventHandler<HTMLImageElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,queryOptions : Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">,radioGroup : string,referrerPolicy : HTMLAttributeReferrerPolicy,rel : string,resource : string,results : number,rev : string,role : AriaRole,security : string,sizes : string,slot : string,spellCheck : Booleanish,srcSet : string,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,tabIndex : number,title : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",useMap : string,vocab : string,width : string | number}

`

### Returns

##### Return Type

`let returnType: null | Element;

`

 an `<img />` with the src of the wallet icon
## WalletName

 This component fetches then shows the name of a wallet. It inherits all the attributes of a HTML `<span>` component, hence you can style it just like how you would style a normal `<span>`

### Example

####  Basic usage

`import { WalletProvider, WalletName } from "thirdweb/react";

<WalletProvider id="io.metamask">

 <WalletName />

</WalletProvider>;

`

 Result:

`<span>MetaMask</span>

`

####  Show a loading sign when the name is being fetched

`import { WalletProvider, WalletName } from "thirdweb/react";

<WalletProvider {...props}>

 <WalletName loadingComponent={<Spinner />} />

</WalletProvider>;

`

####  Fallback to something when the name fails to resolve

`<WalletProvider {...props}>

 <WalletName fallbackComponent={<span>Failed to load</span>} />

</WalletProvider>;

`

####  Custom query options for useQuery

 This component uses `@tanstack-query` 's useQuery internally. You can use the `queryOptions` prop for more fine-grained control

`<WalletName

queryOptions={{

 enabled: isEnabled,

 retry: 4,

 }}

/>

@component

@beta

@wallet

`

##### Signature

`function WalletName(

__namedParameters: [WalletNameProps](https://portal.thirdweb.com/references/typescript/v5/WalletNameProps),

): null | Element;

`

### Parameters

##### \_\_namedParameters

#### Type

`let __namedParameters: {about : string,accessKey : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,className : string,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",fallbackComponent : Element,formatFn : (str: string) => string,hidden : boolean,id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,loadingComponent : Element,nonce : string,onAbort : ReactEventHandler<HTMLSpanElement>,onAbortCapture : ReactEventHandler<HTMLSpanElement>,onAnimationEnd : AnimationEventHandler<HTMLSpanElement>,onAnimationEndCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationIteration : AnimationEventHandler<HTMLSpanElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationStart : AnimationEventHandler<HTMLSpanElement>,onAnimationStartCapture : AnimationEventHandler<HTMLSpanElement>,onAuxClick : MouseEventHandler<HTMLSpanElement>,onAuxClickCapture : MouseEventHandler<HTMLSpanElement>,onBeforeInput : FormEventHandler<HTMLSpanElement>,onBeforeInputCapture : FormEventHandler<HTMLSpanElement>,onBeforeToggle : ToggleEventHandler<HTMLSpanElement>,onBlur : FocusEventHandler<HTMLSpanElement>,onBlurCapture : FocusEventHandler<HTMLSpanElement>,onCanPlay : ReactEventHandler<HTMLSpanElement>,onCanPlayCapture : ReactEventHandler<HTMLSpanElement>,onCanPlayThrough : ReactEventHandler<HTMLSpanElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLSpanElement>,onChange : FormEventHandler<HTMLSpanElement>,onChangeCapture : FormEventHandler<HTMLSpanElement>,onClick : MouseEventHandler<HTMLSpanElement>,onClickCapture : MouseEventHandler<HTMLSpanElement>,onCompositionEnd : CompositionEventHandler<HTMLSpanElement>,onCompositionEndCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionStart : CompositionEventHandler<HTMLSpanElement>,onCompositionStartCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdate : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLSpanElement>,onContextMenu : MouseEventHandler<HTMLSpanElement>,onContextMenuCapture : MouseEventHandler<HTMLSpanElement>,onCopy : ClipboardEventHandler<HTMLSpanElement>,onCopyCapture : ClipboardEventHandler<HTMLSpanElement>,onCut : ClipboardEventHandler<HTMLSpanElement>,onCutCapture : ClipboardEventHandler<HTMLSpanElement>,onDoubleClick : MouseEventHandler<HTMLSpanElement>,onDoubleClickCapture : MouseEventHandler<HTMLSpanElement>,onDrag : DragEventHandler<HTMLSpanElement>,onDragCapture : DragEventHandler<HTMLSpanElement>,onDragEnd : DragEventHandler<HTMLSpanElement>,onDragEndCapture : DragEventHandler<HTMLSpanElement>,onDragEnter : DragEventHandler<HTMLSpanElement>,onDragEnterCapture : DragEventHandler<HTMLSpanElement>,onDragExit : DragEventHandler<HTMLSpanElement>,onDragExitCapture : DragEventHandler<HTMLSpanElement>,onDragLeave : DragEventHandler<HTMLSpanElement>,onDragLeaveCapture : DragEventHandler<HTMLSpanElement>,onDragOver : DragEventHandler<HTMLSpanElement>,onDragOverCapture : DragEventHandler<HTMLSpanElement>,onDragStart : DragEventHandler<HTMLSpanElement>,onDragStartCapture : DragEventHandler<HTMLSpanElement>,onDrop : DragEventHandler<HTMLSpanElement>,onDropCapture : DragEventHandler<HTMLSpanElement>,onDurationChange : ReactEventHandler<HTMLSpanElement>,onDurationChangeCapture : ReactEventHandler<HTMLSpanElement>,onEmptied : ReactEventHandler<HTMLSpanElement>,onEmptiedCapture : ReactEventHandler<HTMLSpanElement>,onEncrypted : ReactEventHandler<HTMLSpanElement>,onEncryptedCapture : ReactEventHandler<HTMLSpanElement>,onEnded : ReactEventHandler<HTMLSpanElement>,onEndedCapture : ReactEventHandler<HTMLSpanElement>,onError : ReactEventHandler<HTMLSpanElement>,onErrorCapture : ReactEventHandler<HTMLSpanElement>,onFocus : FocusEventHandler<HTMLSpanElement>,onFocusCapture : FocusEventHandler<HTMLSpanElement>,onGotPointerCapture : PointerEventHandler<HTMLSpanElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onInput : FormEventHandler<HTMLSpanElement>,onInputCapture : FormEventHandler<HTMLSpanElement>,onInvalid : FormEventHandler<HTMLSpanElement>,onInvalidCapture : FormEventHandler<HTMLSpanElement>,onKeyDown : KeyboardEventHandler<HTMLSpanElement>,onKeyDownCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyPress : KeyboardEventHandler<HTMLSpanElement>,onKeyPressCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyUp : KeyboardEventHandler<HTMLSpanElement>,onKeyUpCapture : KeyboardEventHandler<HTMLSpanElement>,onLoad : ReactEventHandler<HTMLSpanElement>,onLoadCapture : ReactEventHandler<HTMLSpanElement>,onLoadedData : ReactEventHandler<HTMLSpanElement>,onLoadedDataCapture : ReactEventHandler<HTMLSpanElement>,onLoadedMetadata : ReactEventHandler<HTMLSpanElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLSpanElement>,onLoadStart : ReactEventHandler<HTMLSpanElement>,onLoadStartCapture : ReactEventHandler<HTMLSpanElement>,onLostPointerCapture : PointerEventHandler<HTMLSpanElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onMouseDown : MouseEventHandler<HTMLSpanElement>,onMouseDownCapture : MouseEventHandler<HTMLSpanElement>,onMouseEnter : MouseEventHandler<HTMLSpanElement>,onMouseLeave : MouseEventHandler<HTMLSpanElement>,onMouseMove : MouseEventHandler<HTMLSpanElement>,onMouseMoveCapture : MouseEventHandler<HTMLSpanElement>,onMouseOut : MouseEventHandler<HTMLSpanElement>,onMouseOutCapture : MouseEventHandler<HTMLSpanElement>,onMouseOver : MouseEventHandler<HTMLSpanElement>,onMouseOverCapture : MouseEventHandler<HTMLSpanElement>,onMouseUp : MouseEventHandler<HTMLSpanElement>,onMouseUpCapture : MouseEventHandler<HTMLSpanElement>,onPaste : ClipboardEventHandler<HTMLSpanElement>,onPasteCapture : ClipboardEventHandler<HTMLSpanElement>,onPause : ReactEventHandler<HTMLSpanElement>,onPauseCapture : ReactEventHandler<HTMLSpanElement>,onPlay : ReactEventHandler<HTMLSpanElement>,onPlayCapture : ReactEventHandler<HTMLSpanElement>,onPlaying : ReactEventHandler<HTMLSpanElement>,onPlayingCapture : ReactEventHandler<HTMLSpanElement>,onPointerCancel : PointerEventHandler<HTMLSpanElement>,onPointerCancelCapture : PointerEventHandler<HTMLSpanElement>,onPointerDown : PointerEventHandler<HTMLSpanElement>,onPointerDownCapture : PointerEventHandler<HTMLSpanElement>,onPointerEnter : PointerEventHandler<HTMLSpanElement>,onPointerLeave : PointerEventHandler<HTMLSpanElement>,onPointerMove : PointerEventHandler<HTMLSpanElement>,onPointerMoveCapture : PointerEventHandler<HTMLSpanElement>,onPointerOut : PointerEventHandler<HTMLSpanElement>,onPointerOutCapture : PointerEventHandler<HTMLSpanElement>,onPointerOver : PointerEventHandler<HTMLSpanElement>,onPointerOverCapture : PointerEventHandler<HTMLSpanElement>,onPointerUp : PointerEventHandler<HTMLSpanElement>,onPointerUpCapture : PointerEventHandler<HTMLSpanElement>,onProgress : ReactEventHandler<HTMLSpanElement>,onProgressCapture : ReactEventHandler<HTMLSpanElement>,onRateChange : ReactEventHandler<HTMLSpanElement>,onRateChangeCapture : ReactEventHandler<HTMLSpanElement>,onReset : FormEventHandler<HTMLSpanElement>,onResetCapture : FormEventHandler<HTMLSpanElement>,onResize : ReactEventHandler<HTMLSpanElement>,onResizeCapture : ReactEventHandler<HTMLSpanElement>,onScroll : UIEventHandler<HTMLSpanElement>,onScrollCapture : UIEventHandler<HTMLSpanElement>,onSeeked : ReactEventHandler<HTMLSpanElement>,onSeekedCapture : ReactEventHandler<HTMLSpanElement>,onSeeking : ReactEventHandler<HTMLSpanElement>,onSeekingCapture : ReactEventHandler<HTMLSpanElement>,onSelect : ReactEventHandler<HTMLSpanElement>,onSelectCapture : ReactEventHandler<HTMLSpanElement>,onStalled : ReactEventHandler<HTMLSpanElement>,onStalledCapture : ReactEventHandler<HTMLSpanElement>,onSubmit : FormEventHandler<HTMLSpanElement>,onSubmitCapture : FormEventHandler<HTMLSpanElement>,onSuspend : ReactEventHandler<HTMLSpanElement>,onSuspendCapture : ReactEventHandler<HTMLSpanElement>,onTimeUpdate : ReactEventHandler<HTMLSpanElement>,onTimeUpdateCapture : ReactEventHandler<HTMLSpanElement>,onToggle : ToggleEventHandler<HTMLSpanElement>,onTouchCancel : TouchEventHandler<HTMLSpanElement>,onTouchCancelCapture : TouchEventHandler<HTMLSpanElement>,onTouchEnd : TouchEventHandler<HTMLSpanElement>,onTouchEndCapture : TouchEventHandler<HTMLSpanElement>,onTouchMove : TouchEventHandler<HTMLSpanElement>,onTouchMoveCapture : TouchEventHandler<HTMLSpanElement>,onTouchStart : TouchEventHandler<HTMLSpanElement>,onTouchStartCapture : TouchEventHandler<HTMLSpanElement>,onTransitionCancel : TransitionEventHandler<HTMLSpanElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionEnd : TransitionEventHandler<HTMLSpanElement>,onTransitionEndCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionRun : TransitionEventHandler<HTMLSpanElement>,onTransitionRunCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionStart : TransitionEventHandler<HTMLSpanElement>,onTransitionStartCapture : TransitionEventHandler<HTMLSpanElement>,onVolumeChange : ReactEventHandler<HTMLSpanElement>,onVolumeChangeCapture : ReactEventHandler<HTMLSpanElement>,onWaiting : ReactEventHandler<HTMLSpanElement>,onWaitingCapture : ReactEventHandler<HTMLSpanElement>,onWheel : WheelEventHandler<HTMLSpanElement>,onWheelCapture : WheelEventHandler<HTMLSpanElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,queryOptions : Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">,radioGroup : string,rel : string,resource : string,results : number,rev : string,role : AriaRole,security : string,slot : string,spellCheck : Booleanish,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,tabIndex : number,title : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",vocab : string}

`

### Returns

##### Return Type

`let returnType: null | Element;

`
## eth\_getBlockByHash

 Retrieves a block by its hash.

### Example

`import { getRpcClient, eth_getBlockByHash } from "thirdweb/rpc";

const rpcRequest = getRpcClient({ client, chain });

const block = await eth_getBlockByHash(rpcRequest, {

 blockHash: "0x...",

 includeTransactions: true,

});

`

##### Signature

`` function eth_getBlockByHash(request: EIP1193RequestFn<[{ Method: "web3_clientVersion"; Parameters?: undefined; ReturnType: string }, { Method: "web3_sha3"; Parameters: [data: `0x${string}`]; ReturnType: string }, { Method: "net_listening"; Parameters?: undefined; ReturnType: boolean }, { Method: "net_peerCount"; Parameters?: undefined; ReturnType: `0x${string}` }, { Method: "net_version"; Parameters?: undefined; ReturnType: `0x${string}` }]>, params: GetBlockByHashParams<TIncludeTransactions>) : Promise<{ baseFeePerGas: null | bigint; blobGasUsed: bigint; difficulty: bigint; excessBlobGas: bigint; extraData: `0x${string}`; gasLimit: bigint; gasUsed: bigint; hash: `0x${string}`; logsBloom: `0x${string}`; miner: string; mixHash: `0x${string}`; nonce: `0x${string}`; number: bigint; parentBeaconBlockRoot?: `0x${string}`; parentHash: `0x${string}`; receiptsRoot: `0x${string}`; sealFields: Array<`0x${string}`>; sha3Uncles: `0x${string}`; size: bigint; stateRoot: `0x${string}`; timestamp: bigint; totalDifficulty: null | bigint; transactions: TIncludeTransactions extends true ? Array<({ accessList?: undefined; authorizationList?: undefined; blobVersionedHashes?: undefined; blockHash: `0x${string}`; blockNumber: bigint; chainId?: number; from: string; gas: bigint; gasPrice: bigint; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas?: undefined; maxFeePerGas?: undefined; maxPriorityFeePerGas?: undefined; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: number; type: "legacy"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity?: undefined }) | ({ accessList: AccessList; authorizationList?: undefined; blobVersionedHashes?: undefined; blockHash: `0x${string}`; blockNumber: bigint; chainId: number; from: string; gas: bigint; gasPrice: bigint; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas?: undefined; maxFeePerGas?: undefined; maxPriorityFeePerGas?: undefined; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: number; type: "eip2930"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity: number }) | ({ accessList: AccessList; authorizationList?: undefined; blobVersionedHashes?: undefined; blockHash: `0x${string}`; blockNumber: bigint; chainId: number; from: string; gas: bigint; gasPrice?: undefined; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas?: undefined; maxFeePerGas: bigint; maxPriorityFeePerGas: bigint; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: number; type: "eip1559"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity: number }) | ({ accessList: AccessList; authorizationList?: undefined; blobVersionedHashes: readonly Array<`0x${string}`>; blockHash: `0x${string}`; blockNumber: bigint; chainId: number; from: string; gas: bigint; gasPrice?: undefined; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas: bigint; maxFeePerGas: bigint; maxPriorityFeePerGas: bigint; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: number; type: "eip4844"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity: number }) | ({ accessList: AccessList; authorizationList: SignedAuthorizationList; blobVersionedHashes?: undefined; blockHash: `0x${string}`; blockNumber: bigint; chainId: number; from: string; gas: bigint; gasPrice?: undefined; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas?: undefined; maxFeePerGas: bigint; maxPriorityFeePerGas: bigint; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: number; type: "eip7702"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity: number })> : Array<`0x${string}`>; transactionsRoot: `0x${string}`; uncles: Array<`0x${string}`>; withdrawals?: Array<Withdrawal>; withdrawalsRoot?: `0x${string}` }>

 ``

### Parameters

##### request

 The EIP1193 request function.

#### Type

`` let request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

>;

 ``

##### params

 The parameters for the block retrieval.

#### Type

`let params: GetBlockByHashParams<TIncludeTransactions>;

`

### Returns

##### Return Type

`` let returnType: Promise<{ baseFeePerGas: null | bigint; blobGasUsed: bigint; difficulty: bigint; excessBlobGas: bigint; extraData: `0x${string}`; gasLimit: bigint; gasUsed: bigint; hash: `0x${string}`; logsBloom: `0x${string}`; miner: string; mixHash: `0x${string}`; nonce: `0x${string}`; number: bigint; parentBeaconBlockRoot?: `0x${string}`; parentHash: `0x${string}`; receiptsRoot: `0x${string}`; sealFields: Array<`0x${string}`>; sha3Uncles: `0x${string}`; size: bigint; stateRoot: `0x${string}`; timestamp: bigint; totalDifficulty: null | bigint; transactions: TIncludeTransactions extends true ? Array<({ accessList?: undefined; authorizationList?: undefined; blobVersionedHashes?: undefined; blockHash: `0x${string}`; blockNumber: bigint; chainId?: number; from: string; gas: bigint; gasPrice: bigint; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas?: undefined; maxFeePerGas?: undefined; maxPriorityFeePerGas?: undefined; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: number; type: "legacy"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity?: undefined }) | ({ accessList: AccessList; authorizationList?: undefined; blobVersionedHashes?: undefined; blockHash: `0x${string}`; blockNumber: bigint; chainId: number; from: string; gas: bigint; gasPrice: bigint; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas?: undefined; maxFeePerGas?: undefined; maxPriorityFeePerGas?: undefined; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: number; type: "eip2930"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity: number }) | ({ accessList: AccessList; authorizationList?: undefined; blobVersionedHashes?: undefined; blockHash: `0x${string}`; blockNumber: bigint; chainId: number; from: string; gas: bigint; gasPrice?: undefined; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas?: undefined; maxFeePerGas: bigint; maxPriorityFeePerGas: bigint; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: number; type: "eip1559"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity: number }) | ({ accessList: AccessList; authorizationList?: undefined; blobVersionedHashes: readonly Array<`0x${string}`>; blockHash: `0x${string}`; blockNumber: bigint; chainId: number; from: string; gas: bigint; gasPrice?: undefined; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas: bigint; maxFeePerGas: bigint; maxPriorityFeePerGas: bigint; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: number; type: "eip4844"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity: number }) | ({ accessList: AccessList; authorizationList: SignedAuthorizationList; blobVersionedHashes?: undefined; blockHash: `0x${string}`; blockNumber: bigint; chainId: number; from: string; gas: bigint; gasPrice?: undefined; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas?: undefined; maxFeePerGas: bigint; maxPriorityFeePerGas: bigint; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: number; type: "eip7702"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity: number })> : Array<`0x${string}`>; transactionsRoot: `0x${string}`; uncles: Array<`0x${string}`>; withdrawals?: Array<Withdrawal>; withdrawalsRoot?: `0x${string}` }>

 ``

 A promise that resolves to the retrieved block.
## eth\_getBlockByNumber

 Retrieves a block by its number or tag from the Ethereum blockchain.

### Example

`import { getRpcClient, eth_getBlockByNumber } from "thirdweb/rpc";

const rpcRequest = getRpcClient({ client, chain });

const block = await eth_getBlockByNumber(rpcRequest, {

 blockNumber: 123456,

 includeTransactions: true,

});

`

##### Signature

`` function eth_getBlockByNumber(request: EIP1193RequestFn<[{ Method: "web3_clientVersion"; Parameters?: undefined; ReturnType: string }, { Method: "web3_sha3"; Parameters: [data: `0x${string}`]; ReturnType: string }, { Method: "net_listening"; Parameters?: undefined; ReturnType: boolean }, { Method: "net_peerCount"; Parameters?: undefined; ReturnType: `0x${string}` }, { Method: "net_version"; Parameters?: undefined; ReturnType: `0x${string}` }]>, params: GetBlockParameters<TIncludeTransactions, TBlockTag>) : Promise<{ baseFeePerGas: null | bigint; blobGasUsed: bigint; difficulty: bigint; excessBlobGas: bigint; extraData: `0x${string}`; gasLimit: bigint; gasUsed: bigint; hash: TBlockTag extends "pending" ? null : `0x${string}`; logsBloom: TBlockTag extends "pending" ? null : `0x${string}`; miner: string; mixHash: `0x${string}`; nonce: TBlockTag extends "pending" ? null : `0x${string}`; number: TBlockTag extends "pending" ? null : bigint; parentBeaconBlockRoot?: `0x${string}`; parentHash: `0x${string}`; receiptsRoot: `0x${string}`; sealFields: Array<`0x${string}`>; sha3Uncles: `0x${string}`; size: bigint; stateRoot: `0x${string}`; timestamp: bigint; totalDifficulty: null | bigint; transactions: TIncludeTransactions extends true ? Array<({ accessList?: undefined; authorizationList?: undefined; blobVersionedHashes?: undefined; blockHash: TBlockTag extends "pending" ? true : false extends true ? null : `0x${string}`; blockNumber: TBlockTag extends "pending" ? true : false extends true ? null : bigint; chainId?: number; from: string; gas: bigint; gasPrice: bigint; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas?: undefined; maxFeePerGas?: undefined; maxPriorityFeePerGas?: undefined; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: TBlockTag extends "pending" ? true : false extends true ? null : number; type: "legacy"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity?: undefined }) | ({ accessList: AccessList; authorizationList?: undefined; blobVersionedHashes?: undefined; blockHash: TBlockTag extends "pending" ? true : false extends true ? null : `0x${string}`; blockNumber: TBlockTag extends "pending" ? true : false extends true ? null : bigint; chainId: number; from: string; gas: bigint; gasPrice: bigint; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas?: undefined; maxFeePerGas?: undefined; maxPriorityFeePerGas?: undefined; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: TBlockTag extends "pending" ? true : false extends true ? null : number; type: "eip2930"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity: number }) | ({ accessList: AccessList; authorizationList?: undefined; blobVersionedHashes?: undefined; blockHash: TBlockTag extends "pending" ? true : false extends true ? null : `0x${string}`; blockNumber: TBlockTag extends "pending" ? true : false extends true ? null : bigint; chainId: number; from: string; gas: bigint; gasPrice?: undefined; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas?: undefined; maxFeePerGas: bigint; maxPriorityFeePerGas: bigint; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: TBlockTag extends "pending" ? true : false extends true ? null : number; type: "eip1559"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity: number }) | ({ accessList: AccessList; authorizationList?: undefined; blobVersionedHashes: readonly Array<`0x${string}`>; blockHash: TBlockTag extends "pending" ? true : false extends true ? null : `0x${string}`; blockNumber: TBlockTag extends "pending" ? true : false extends true ? null : bigint; chainId: number; from: string; gas: bigint; gasPrice?: undefined; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas: bigint; maxFeePerGas: bigint; maxPriorityFeePerGas: bigint; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: TBlockTag extends "pending" ? true : false extends true ? null : number; type: "eip4844"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity: number }) | ({ accessList: AccessList; authorizationList: SignedAuthorizationList; blobVersionedHashes?: undefined; blockHash: TBlockTag extends "pending" ? true : false extends true ? null : `0x${string}`; blockNumber: TBlockTag extends "pending" ? true : false extends true ? null : bigint; chainId: number; from: string; gas: bigint; gasPrice?: undefined; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas?: undefined; maxFeePerGas: bigint; maxPriorityFeePerGas: bigint; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: TBlockTag extends "pending" ? true : false extends true ? null : number; type: "eip7702"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity: number })> : Array<`0x${string}`>; transactionsRoot: `0x${string}`; uncles: Array<`0x${string}`>; withdrawals?: Array<Withdrawal>; withdrawalsRoot?: `0x${string}` }>

 ``

### Parameters

##### request

 The EIP1193 request function.

#### Type

`` let request: EIP1193RequestFn<

 [

 {

Method: "web3_clientVersion";

Parameters?: undefined;

ReturnType: string;

 },

 {

Method: "web3_sha3";

Parameters: [data: `0x${string}`];

ReturnType: string;

 },

 {

Method: "net_listening";

Parameters?: undefined;

ReturnType: boolean;

 },

 {

Method: "net_peerCount";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 {

Method: "net_version";

Parameters?: undefined;

ReturnType: `0x${string}`;

 },

 ]

>;

 ``

##### params

 The parameters for retrieving the block.

#### Type

`let params: GetBlockParameters<TIncludeTransactions, TBlockTag>;

`

### Returns

##### Return Type

`` let returnType: Promise<{ baseFeePerGas: null | bigint; blobGasUsed: bigint; difficulty: bigint; excessBlobGas: bigint; extraData: `0x${string}`; gasLimit: bigint; gasUsed: bigint; hash: TBlockTag extends "pending" ? null : `0x${string}`; logsBloom: TBlockTag extends "pending" ? null : `0x${string}`; miner: string; mixHash: `0x${string}`; nonce: TBlockTag extends "pending" ? null : `0x${string}`; number: TBlockTag extends "pending" ? null : bigint; parentBeaconBlockRoot?: `0x${string}`; parentHash: `0x${string}`; receiptsRoot: `0x${string}`; sealFields: Array<`0x${string}`>; sha3Uncles: `0x${string}`; size: bigint; stateRoot: `0x${string}`; timestamp: bigint; totalDifficulty: null | bigint; transactions: TIncludeTransactions extends true ? Array<({ accessList?: undefined; authorizationList?: undefined; blobVersionedHashes?: undefined; blockHash: TBlockTag extends "pending" ? true : false extends true ? null : `0x${string}`; blockNumber: TBlockTag extends "pending" ? true : false extends true ? null : bigint; chainId?: number; from: string; gas: bigint; gasPrice: bigint; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas?: undefined; maxFeePerGas?: undefined; maxPriorityFeePerGas?: undefined; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: TBlockTag extends "pending" ? true : false extends true ? null : number; type: "legacy"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity?: undefined }) | ({ accessList: AccessList; authorizationList?: undefined; blobVersionedHashes?: undefined; blockHash: TBlockTag extends "pending" ? true : false extends true ? null : `0x${string}`; blockNumber: TBlockTag extends "pending" ? true : false extends true ? null : bigint; chainId: number; from: string; gas: bigint; gasPrice: bigint; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas?: undefined; maxFeePerGas?: undefined; maxPriorityFeePerGas?: undefined; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: TBlockTag extends "pending" ? true : false extends true ? null : number; type: "eip2930"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity: number }) | ({ accessList: AccessList; authorizationList?: undefined; blobVersionedHashes?: undefined; blockHash: TBlockTag extends "pending" ? true : false extends true ? null : `0x${string}`; blockNumber: TBlockTag extends "pending" ? true : false extends true ? null : bigint; chainId: number; from: string; gas: bigint; gasPrice?: undefined; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas?: undefined; maxFeePerGas: bigint; maxPriorityFeePerGas: bigint; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: TBlockTag extends "pending" ? true : false extends true ? null : number; type: "eip1559"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity: number }) | ({ accessList: AccessList; authorizationList?: undefined; blobVersionedHashes: readonly Array<`0x${string}`>; blockHash: TBlockTag extends "pending" ? true : false extends true ? null : `0x${string}`; blockNumber: TBlockTag extends "pending" ? true : false extends true ? null : bigint; chainId: number; from: string; gas: bigint; gasPrice?: undefined; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas: bigint; maxFeePerGas: bigint; maxPriorityFeePerGas: bigint; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: TBlockTag extends "pending" ? true : false extends true ? null : number; type: "eip4844"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity: number }) | ({ accessList: AccessList; authorizationList: SignedAuthorizationList; blobVersionedHashes?: undefined; blockHash: TBlockTag extends "pending" ? true : false extends true ? null : `0x${string}`; blockNumber: TBlockTag extends "pending" ? true : false extends true ? null : bigint; chainId: number; from: string; gas: bigint; gasPrice?: undefined; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas?: undefined; maxFeePerGas: bigint; maxPriorityFeePerGas: bigint; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: TBlockTag extends "pending" ? true : false extends true ? null : number; type: "eip7702"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity: number })> : Array<`0x${string}`>; transactionsRoot: `0x${string}`; uncles: Array<`0x${string}`>; withdrawals?: Array<Withdrawal>; withdrawalsRoot?: `0x${string}` }>

 ``

 A promise that resolves to the requested block.
## viemAdapter

 Converts thirdweb accounts and contracts to viem wallet clients and contract objects or the other way around.

`` let viemAdapter: { contract: { fromViem: (options: FromViemContractOptions<TAbi>) => Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<TAbi, `0x${string}`>>; toViem: { } }; publicClient: { toViem: (options: ToViemPublicClientOptions) => { account: undefined; batch?: { multicall?: boolean | ({ batchSize?: number; wait?: number }) }; cacheTime: number; call: (parameters: CallParameters<undefined | (Chain)>) => Promise<CallReturnType>; ccipRead?: false | ({ request?: (parameters: CcipRequestParameters) => Promise<`0x${string}`> }); chain: undefined | (Chain); createAccessList: (parameters: CreateAccessListParameters<undefined | (Chain)>) => Promise<{ accessList: AccessList; gasUsed: bigint }>; createBlockFilter: () => Promise<{ id: `0x${string}`; request: EIP1193RequestFn<readonly [{ Method: "eth_getFilterChanges"; Parameters: [filterId: ...]; ReturnType: (...) | (...) }, { Method: "eth_getFilterLogs"; Parameters: [filterId: ...]; ReturnType: Array<...> }, { Method: "eth_uninstallFilter"; Parameters: [filterId: ...]; ReturnType: boolean }]>; type: "block" }>; createContractEventFilter: (args: CreateContractEventFilterParameters<abi, eventName, args, strict, fromBlock, toBlock>) => Promise<CreateContractEventFilterReturnType<abi, eventName, args, strict, fromBlock, toBlock>>; createEventFilter: (args?: CreateEventFilterParameters<abiEvent, abiEvents, strict, fromBlock, toBlock, _EventName, _Args>) => Promise<{[K in string | number | symbol] : Filter<"event", abiEvents, _EventName, _Args, strict, fromBlock, toBlock>[K]}>; createPendingTransactionFilter: () => Promise<{ id: `0x${string}`; request: EIP1193RequestFn<readonly [{ Method: "eth_getFilterChanges"; Parameters: [filterId: ...]; ReturnType: (...) | (...) }, { Method: "eth_getFilterLogs"; Parameters: [filterId: ...]; ReturnType: Array<...> }, { Method: "eth_uninstallFilter"; Parameters: [filterId: ...]; ReturnType: boolean }]>; type: "transaction" }>; estimateContractGas: (args: EstimateContractGasParameters<abi, functionName, args, chain>) => Promise<bigint>; estimateFeesPerGas: (args?: EstimateFeesPerGasParameters<undefined | (Chain), chainOverride, type>) => Promise<EstimateFeesPerGasReturnType<type>>; estimateGas: (args: EstimateGasParameters<undefined | (Chain)>) => Promise<bigint>; estimateMaxPriorityFeePerGas: (args?: { chain: null | (chainOverride) }) => Promise<bigint>; extend: (fn: (client: Client<Transport, undefined | (Chain), undefined, PublicRpcSchema, PublicActions<Transport, undefined | (Chain)>>) => client) => Client<Transport, undefined | (Chain), undefined, PublicRpcSchema, ({[K in string | number | symbol] : client[K]}) & (PublicActions<Transport, undefined | (Chain)>)>; getBalance: (args: GetBalanceParameters) => Promise<bigint>; getBlobBaseFee: () => Promise<bigint>; getBlock: (args?: GetBlockParameters<includeTransactions, blockTag>) => Promise<{ baseFeePerGas: null | bigint; blobGasUsed: bigint; difficulty: bigint; excessBlobGas: bigint; extraData: `0x${string}`; gasLimit: bigint; gasUsed: bigint; hash: blockTag extends "pending" ? null : `0x${string}`; logsBloom: blockTag extends "pending" ? null : `0x${string}`; miner: string; mixHash: `0x${string}`; nonce: blockTag extends "pending" ? null : `0x${string}`; number: blockTag extends "pending" ? null : bigint; parentBeaconBlockRoot?: `0x${string}`; parentHash: `0x${string}`; receiptsRoot: `0x${string}`; sealFields: Array<`0x${string}`>; sha3Uncles: `0x${string}`; size: bigint; stateRoot: `0x${string}`; timestamp: bigint; totalDifficulty: null | bigint; transactions: includeTransactions extends true ? Array<({ accessList?: ...; authorizationList?: ...; blobVersionedHashes?: ...; blockHash: ...; blockNumber: ...; chainId?: ...; from: ...; gas: ...; gasPrice: ...; hash: ...; input: ...; maxFeePerBlobGas?: ...; maxFeePerGas?: ...; maxPriorityFeePerGas?: ...; nonce: ...; r: ...; s: ...; to: ...; transactionIndex: ...; type: ...; typeHex: ...; v: ...; value: ...; yParity?: ... }) | ({ accessList: ...; authorizationList?: ...; blobVersionedHashes?: ...; blockHash: ...; blockNumber: ...; chainId: ...; from: ...; gas: ...; gasPrice: ...; hash: ...; input: ...; maxFeePerBlobGas?: ...; maxFeePerGas?: ...; maxPriorityFeePerGas?: ...; nonce: ...; r: ...; s: ...; to: ...; transactionIndex: ...; type: ...; typeHex: ...; v: ...; value: ...; yParity: ... }) | ({ accessList: ...; authorizationList?: ...; blobVersionedHashes?: ...; blockHash: ...; blockNumber: ...; chainId: ...; from: ...; gas: ...; gasPrice?: ...; hash: ...; input: ...; maxFeePerBlobGas?: ...; maxFeePerGas: ...; maxPriorityFeePerGas: ...; nonce: ...; r: ...; s: ...; to: ...; transactionIndex: ...; type: ...; typeHex: ...; v: ...; value: ...; yParity: ... }) | ({ accessList: ...; authorizationList?: ...; blobVersionedHashes: ...; blockHash: ...; blockNumber: ...; chainId: ...; from: ...; gas: ...; gasPrice?: ...; hash: ...; input: ...; maxFeePerBlobGas: ...; maxFeePerGas: ...; maxPriorityFeePerGas: ...; nonce: ...; r: ...; s: ...; to: ...; transactionIndex: ...; type: ...; typeHex: ...; v: ...; value: ...; yParity: ... }) | ({ accessList: ...; authorizationList: ...; blobVersionedHashes?: ...; blockHash: ...; blockNumber: ...; chainId: ...; from: ...; gas: ...; gasPrice?: ...; hash: ...; input: ...; maxFeePerBlobGas?: ...; maxFeePerGas: ...; maxPriorityFeePerGas: ...; nonce: ...; r: ...; s: ...; to: ...; transactionIndex: ...; type: ...; typeHex: ...; v: ...; value: ...; yParity: ... })> : Array<`0x${string}`>; transactionsRoot: `0x${string}`; uncles: Array<`0x${string}`>; withdrawals?: Array<Withdrawal>; withdrawalsRoot?: `0x${string}` }>; getBlockNumber: (args?: GetBlockNumberParameters) => Promise<bigint>; getBlockTransactionCount: (args?: GetBlockTransactionCountParameters) => Promise<number>; getBytecode: (args: GetCodeParameters) => Promise<GetCodeReturnType>; getChainId: () => Promise<number>; getCode: (args: GetCodeParameters) => Promise<GetCodeReturnType>; getContractEvents: (args: GetContractEventsParameters<abi, eventName, strict, fromBlock, toBlock>) => Promise<GetContractEventsReturnType<abi, eventName, strict, fromBlock, toBlock>>; getEip712Domain: (args: GetEip712DomainParameters) => Promise<GetEip712DomainReturnType>; getEnsAddress: (args: { blockNumber?: bigint; blockTag?: BlockTag; coinType?: number; gatewayUrls?: Array<string>; name: string; strict?: boolean; universalResolverAddress?: string }) => Promise<GetEnsAddressReturnType>; getEnsAvatar: (args: { assetGatewayUrls?: AssetGatewayUrls; blockNumber?: bigint; blockTag?: BlockTag; gatewayUrls?: Array<string>; name: string; strict?: boolean; universalResolverAddress?: string }) => Promise<GetEnsAvatarReturnType>; getEnsName: (args: { address: string; blockNumber?: bigint; blockTag?: BlockTag; gatewayUrls?: Array<string>; strict?: boolean; universalResolverAddress?: string }) => Promise<GetEnsNameReturnType>; getEnsResolver: (args: { blockNumber?: bigint; blockTag?: BlockTag; name: string; universalResolverAddress?: string }) => Promise<string>; getEnsText: (args: { blockNumber?: bigint; blockTag?: BlockTag; gatewayUrls?: Array<string>; key: string; name: string; strict?: boolean; universalResolverAddress?: string }) => Promise<GetEnsTextReturnType>; getFeeHistory: (args: GetFeeHistoryParameters) => Promise<GetFeeHistoryReturnType>; getFilterChanges: (args: GetFilterChangesParameters<filterType, abi, eventName, strict, fromBlock, toBlock>) => Promise<GetFilterChangesReturnType<filterType, abi, eventName, strict, fromBlock, toBlock>>; getFilterLogs: (args: GetFilterLogsParameters<abi, eventName, strict, fromBlock, toBlock>) => Promise<GetFilterLogsReturnType<abi, eventName, strict, fromBlock, toBlock>>; getGasPrice: () => Promise<bigint>; getLogs: (args?: GetLogsParameters<abiEvent, abiEvents, strict, fromBlock, toBlock>) => Promise<GetLogsReturnType<abiEvent, abiEvents, strict, fromBlock, toBlock>>; getProof: (args: GetProofParameters) => Promise<GetProofReturnType>; getStorageAt: (args: GetStorageAtParameters) => Promise<GetStorageAtReturnType>; getTransaction: (args: GetTransactionParameters<blockTag>) => Promise<({ accessList?: undefined; authorizationList?: undefined; blobVersionedHashes?: undefined; blockHash: blockTag extends "pending" ? true : false extends true ? null : `0x${string}`; blockNumber: blockTag extends "pending" ? true : false extends true ? null : bigint; chainId?: number; from: string; gas: bigint; gasPrice: bigint; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas?: undefined; maxFeePerGas?: undefined; maxPriorityFeePerGas?: undefined; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: blockTag extends "pending" ? true : false extends true ? null : number; type: "legacy"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity?: undefined }) | ({ accessList: AccessList; authorizationList?: undefined; blobVersionedHashes?: undefined; blockHash: blockTag extends "pending" ? true : false extends true ? null : `0x${string}`; blockNumber: blockTag extends "pending" ? true : false extends true ? null : bigint; chainId: number; from: string; gas: bigint; gasPrice: bigint; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas?: undefined; maxFeePerGas?: undefined; maxPriorityFeePerGas?: undefined; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: blockTag extends "pending" ? true : false extends true ? null : number; type: "eip2930"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity: number }) | ({ accessList: AccessList; authorizationList?: undefined; blobVersionedHashes?: undefined; blockHash: blockTag extends "pending" ? true : false extends true ? null : `0x${string}`; blockNumber: blockTag extends "pending" ? true : false extends true ? null : bigint; chainId: number; from: string; gas: bigint; gasPrice?: undefined; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas?: undefined; maxFeePerGas: bigint; maxPriorityFeePerGas: bigint; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: blockTag extends "pending" ? true : false extends true ? null : number; type: "eip1559"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity: number }) | ({ accessList: AccessList; authorizationList?: undefined; blobVersionedHashes: readonly Array<`0x${string}`>; blockHash: blockTag extends "pending" ? true : false extends true ? null : `0x${string}`; blockNumber: blockTag extends "pending" ? true : false extends true ? null : bigint; chainId: number; from: string; gas: bigint; gasPrice?: undefined; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas: bigint; maxFeePerGas: bigint; maxPriorityFeePerGas: bigint; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: blockTag extends "pending" ? true : false extends true ? null : number; type: "eip4844"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity: number }) | ({ accessList: AccessList; authorizationList: SignedAuthorizationList; blobVersionedHashes?: undefined; blockHash: blockTag extends "pending" ? true : false extends true ? null : `0x${string}`; blockNumber: blockTag extends "pending" ? true : false extends true ? null : bigint; chainId: number; from: string; gas: bigint; gasPrice?: undefined; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas?: undefined; maxFeePerGas: bigint; maxPriorityFeePerGas: bigint; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: blockTag extends "pending" ? true : false extends true ? null : number; type: "eip7702"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity: number })>; getTransactionConfirmations: (args: GetTransactionConfirmationsParameters<undefined | (Chain)>) => Promise<bigint>; getTransactionCount: (args: GetTransactionCountParameters) => Promise<number>; getTransactionReceipt: (args: GetTransactionReceiptParameters) => Promise<TransactionReceipt>; key: string; multicall: (args: MulticallParameters<contracts, allowFailure>) => Promise<MulticallReturnType<contracts, allowFailure>>; name: string; pollingInterval: number; prepareTransactionRequest: (args: PrepareTransactionRequestParameters<undefined | (Chain), undefined | (Account), chainOverride, accountOverride, request>) => Promise<{[K in string | number | symbol] : (UnionRequiredBy<(...) & (...), ParameterTypeToParameters<...>>) & (unknown extends ...[...] ? { } : Pick<..., ...>)[K]}>; readContract: (args: ReadContractParameters<abi, functionName, args>) => Promise<ReadContractReturnType<abi, functionName, args>>; request: EIP1193RequestFn<PublicRpcSchema>; sendRawTransaction: (args: SendRawTransactionParameters) => Promise<`0x${string}`>; simulate: (args: SimulateBlocksParameters<calls>) => Promise<SimulateBlocksReturnType<calls>>; simulateBlocks: (args: SimulateBlocksParameters<calls>) => Promise<SimulateBlocksReturnType<calls>>; simulateCalls: (args: SimulateCallsParameters<calls>) => Promise<SimulateCallsReturnType<calls>>; simulateContract: (args: SimulateContractParameters<abi, functionName, args, undefined | (Chain), chainOverride, accountOverride>) => Promise<SimulateContractReturnType<abi, functionName, args, undefined | (Chain), undefined | (Account), chainOverride, accountOverride>>; transport: (TransportConfig<string, EIP1193RequestFn>) & (Record<string, any>); type: string; uid: string; uninstallFilter: (args: UninstallFilterParameters) => Promise<boolean>; verifyMessage: (args: { address: string; blockNumber?: bigint; blockTag?: BlockTag; factory?: string; factoryData?: `0x${string}`; message: SignableMessage; signature: (`0x${string}`) | (ByteArray) | (Signature); universalSignatureVerifierAddress?: string }) => Promise<boolean>; verifySiweMessage: (args: { address?: string; blockNumber?: bigint; blockTag?: BlockTag; domain?: string; message: string; nonce?: string; scheme?: string; signature: `0x${string}`; time?: Date }) => Promise<boolean>; verifyTypedData: (args: VerifyTypedDataParameters) => Promise<boolean>; waitForTransactionReceipt: (args: WaitForTransactionReceiptParameters<undefined | (Chain)>) => Promise<TransactionReceipt>; watchBlockNumber: (args: WatchBlockNumberParameters) => WatchBlockNumberReturnType; watchBlocks: (args: WatchBlocksParameters<Transport, undefined | (Chain), includeTransactions, blockTag>) => WatchBlocksReturnType; watchContractEvent: (args: WatchContractEventParameters<abi, eventName, strict, Transport>) => WatchContractEventReturnType; watchEvent: (args: WatchEventParameters<abiEvent, abiEvents, strict, Transport>) => WatchEventReturnType; watchPendingTransactions: (args: WatchPendingTransactionsParameters<Transport>) => WatchPendingTransactionsReturnType } }; wallet: { fromViem: (options: { walletClient: { account: undefined | (Account); addChain: (args: AddChainParameters) => Promise<void>; batch?: { multicall?: boolean | ({ batchSize?: number; wait?: number }) }; cacheTime: number; ccipRead?: false | ({ request?: (parameters: CcipRequestParameters) => Promise<`0x${...}`> }); chain: undefined | (Chain); deployContract: (args: DeployContractParameters<abi, undefined | (Chain), undefined | (Account), chainOverride>) => Promise<`0x${string}`>; extend: (fn: (client: Client<Transport, undefined | (Chain), undefined | (Account), WalletRpcSchema, WalletActions<undefined | (Chain), undefined | (Account)>>) => client) => Client<Transport, undefined | (Chain), undefined | (Account), WalletRpcSchema, ({[K in string | number | symbol] : client[K]}) & (WalletActions<undefined | (Chain), undefined | (Account)>)>; getAddresses: () => Promise<GetAddressesReturnType>; getChainId: () => Promise<number>; getPermissions: () => Promise<GetPermissionsReturnType>; key: string; name: string; pollingInterval: number; prepareTransactionRequest: (args: PrepareTransactionRequestParameters<undefined | (Chain), undefined | (Account), chainOverride, accountOverride, request>) => Promise<{[K in string | number | symbol] : (UnionRequiredBy<..., ...>) & (... extends ... ? ... : ...)[K]}>; request: EIP1193RequestFn<WalletRpcSchema>; requestAddresses: () => Promise<RequestAddressesReturnType>; requestPermissions: (args: { eth_accounts: Record<string, any> }) => Promise<RequestPermissionsReturnType>; sendRawTransaction: (args: SendRawTransactionParameters) => Promise<`0x${string}`>; sendTransaction: (args: SendTransactionParameters<undefined | (Chain), undefined | (Account), chainOverride, request>) => Promise<`0x${string}`>; signMessage: (args: SignMessageParameters<undefined | (Account)>) => Promise<`0x${string}`>; signTransaction: (args: SignTransactionParameters<undefined | (Chain), undefined | (Account), chainOverride, request>) => Promise<TransactionSerialized<GetTransactionType<request, (... extends ... ? ... : ...) | (... extends ... ? ... : ...) | (... extends ... ? ... : ...) | (... extends ... ? ... : ...) | (... extends ... ? ... : ...) | (... extends ... ? ... : ...)>, (GetTransactionType<..., ...> extends "eip1559" ? `0x02${...}` : never) | (GetTransactionType<..., ...> extends "eip2930" ? `0x01${...}` : never) | (GetTransactionType<..., ...> extends "eip4844" ? `0x03${...}` : never) | (GetTransactionType<..., ...> extends "eip7702" ? `0x04${...}` : never) | (GetTransactionType<..., ...> extends "legacy" ? TransactionSerializedLegacy : never)>>; signTypedData: (args: SignTypedDataParameters<typedData, primaryType, undefined | (Account)>) => Promise<`0x${string}`>; switchChain: (args: SwitchChainParameters) => Promise<void>; transport: (TransportConfig<string, EIP1193RequestFn>) & (Record<string, any>); type: string; uid: string; watchAsset: (args: WatchAssetParams) => Promise<boolean>; writeContract: (args: WriteContractParameters<abi, functionName, args, undefined | (Chain), undefined | (Account), chainOverride>) => Promise<`0x${string}`> } }) => Wallet; toViem: (options: WalletToViemOptions) => { account: undefined | (Account); addChain: (args: AddChainParameters) => Promise<void>; batch?: { multicall?: boolean | ({ batchSize?: number; wait?: number }) }; cacheTime: number; ccipRead?: false | ({ request?: (parameters: CcipRequestParameters) => Promise<`0x${string}`> }); chain: undefined | (Chain); deployContract: (args: DeployContractParameters<abi, undefined | (Chain), undefined | (Account), chainOverride>) => Promise<`0x${string}`>; extend: (fn: (client: Client<Transport, undefined | (Chain), undefined | (Account), WalletRpcSchema, WalletActions<undefined | (Chain), undefined | (Account)>>) => client) => Client<Transport, undefined | (Chain), undefined | (Account), WalletRpcSchema, ({[K in string | number | symbol] : client[K]}) & (WalletActions<undefined | (Chain), undefined | (Account)>)>; getAddresses: () => Promise<GetAddressesReturnType>; getChainId: () => Promise<number>; getPermissions: () => Promise<GetPermissionsReturnType>; key: string; name: string; pollingInterval: number; prepareTransactionRequest: (args: PrepareTransactionRequestParameters<undefined | (Chain), undefined | (Account), chainOverride, accountOverride, request>) => Promise<{[K in string | number | symbol] : (UnionRequiredBy<(...) & (...), ParameterTypeToParameters<...>>) & (unknown extends ...[...] ? { } : Pick<..., ...>)[K]}>; request: EIP1193RequestFn<WalletRpcSchema>; requestAddresses: () => Promise<RequestAddressesReturnType>; requestPermissions: (args: { eth_accounts: Record<string, any> }) => Promise<RequestPermissionsReturnType>; sendRawTransaction: (args: SendRawTransactionParameters) => Promise<`0x${string}`>; sendTransaction: (args: SendTransactionParameters<undefined | (Chain), undefined | (Account), chainOverride, request>) => Promise<`0x${string}`>; signMessage: (args: SignMessageParameters<undefined | (Account)>) => Promise<`0x${string}`>; signTransaction: (args: SignTransactionParameters<undefined | (Chain), undefined | (Account), chainOverride, request>) => Promise<TransactionSerialized<GetTransactionType<request, (request extends LegacyProperties ? "legacy" : never) | (request extends EIP1559Properties ? "eip1559" : never) | (request extends EIP2930Properties ? "eip2930" : never) | (request extends EIP4844Properties ? "eip4844" : never) | (request extends EIP7702Properties ? "eip7702" : never) | (...[...] extends (...) | (...) ? Extract<..., ...> : never)>, (GetTransactionType<request, (...) | (...) | (...) | (...) | (...) | (...)> extends "eip1559" ? `0x02${string}` : never) | (GetTransactionType<request, (...) | (...) | (...) | (...) | (...) | (...)> extends "eip2930" ? `0x01${string}` : never) | (GetTransactionType<request, (...) | (...) | (...) | (...) | (...) | (...)> extends "eip4844" ? `0x03${string}` : never) | (GetTransactionType<request, (...) | (...) | (...) | (...) | (...) | (...)> extends "eip7702" ? `0x04${string}` : never) | (GetTransactionType<request, (...) | (...) | (...) | (...) | (...) | (...)> extends "legacy" ? TransactionSerializedLegacy : never)>>; signTypedData: (args: SignTypedDataParameters<typedData, primaryType, undefined | (Account)>) => Promise<`0x${string}`>; switchChain: (args: SwitchChainParameters) => Promise<void>; transport: (TransportConfig<string, EIP1193RequestFn>) & (Record<string, any>); type: string; uid: string; watchAsset: (args: WatchAssetParams) => Promise<boolean>; writeContract: (args: WriteContractParameters<abi, functionName, args, undefined | (Chain), undefined | (Account), chainOverride>) => Promise<`0x${string}`> } }; walletClient: { fromViem: (options: { walletClient: { account: undefined | (Account); addChain: (args: AddChainParameters) => Promise<void>; batch?: { multicall?: boolean | ({ batchSize?: number; wait?: number }) }; cacheTime: number; ccipRead?: false | ({ request?: (parameters: CcipRequestParameters) => Promise<`0x${...}`> }); chain: undefined | (Chain); deployContract: (args: DeployContractParameters<abi, undefined | (Chain), undefined | (Account), chainOverride>) => Promise<`0x${string}`>; extend: (fn: (client: Client<Transport, undefined | (Chain), undefined | (Account), WalletRpcSchema, WalletActions<undefined | (Chain), undefined | (Account)>>) => client) => Client<Transport, undefined | (Chain), undefined | (Account), WalletRpcSchema, ({[K in string | number | symbol] : client[K]}) & (WalletActions<undefined | (Chain), undefined | (Account)>)>; getAddresses: () => Promise<GetAddressesReturnType>; getChainId: () => Promise<number>; getPermissions: () => Promise<GetPermissionsReturnType>; key: string; name: string; pollingInterval: number; prepareTransactionRequest: (args: PrepareTransactionRequestParameters<undefined | (Chain), undefined | (Account), chainOverride, accountOverride, request>) => Promise<{[K in string | number | symbol] : (UnionRequiredBy<..., ...>) & (... extends ... ? ... : ...)[K]}>; request: EIP1193RequestFn<WalletRpcSchema>; requestAddresses: () => Promise<RequestAddressesReturnType>; requestPermissions: (args: { eth_accounts: Record<string, any> }) => Promise<RequestPermissionsReturnType>; sendRawTransaction: (args: SendRawTransactionParameters) => Promise<`0x${string}`>; sendTransaction: (args: SendTransactionParameters<undefined | (Chain), undefined | (Account), chainOverride, request>) => Promise<`0x${string}`>; signMessage: (args: SignMessageParameters<undefined | (Account)>) => Promise<`0x${string}`>; signTransaction: (args: SignTransactionParameters<undefined | (Chain), undefined | (Account), chainOverride, request>) => Promise<TransactionSerialized<GetTransactionType<request, (... extends ... ? ... : ...) | (... extends ... ? ... : ...) | (... extends ... ? ... : ...) | (... extends ... ? ... : ...) | (... extends ... ? ... : ...) | (... extends ... ? ... : ...)>, (GetTransactionType<..., ...> extends "eip1559" ? `0x02${...}` : never) | (GetTransactionType<..., ...> extends "eip2930" ? `0x01${...}` : never) | (GetTransactionType<..., ...> extends "eip4844" ? `0x03${...}` : never) | (GetTransactionType<..., ...> extends "eip7702" ? `0x04${...}` : never) | (GetTransactionType<..., ...> extends "legacy" ? TransactionSerializedLegacy : never)>>; signTypedData: (args: SignTypedDataParameters<typedData, primaryType, undefined | (Account)>) => Promise<`0x${string}`>; switchChain: (args: SwitchChainParameters) => Promise<void>; transport: (TransportConfig<string, EIP1193RequestFn>) & (Record<string, any>); type: string; uid: string; watchAsset: (args: WatchAssetParams) => Promise<boolean>; writeContract: (args: WriteContractParameters<abi, functionName, args, undefined | (Chain), undefined | (Account), chainOverride>) => Promise<`0x${string}`> } }) => Account; toViem: (options: ToViemWalletClientOptions) => { account: undefined | (Account); addChain: (args: AddChainParameters) => Promise<void>; batch?: { multicall?: boolean | ({ batchSize?: number; wait?: number }) }; cacheTime: number; ccipRead?: false | ({ request?: (parameters: CcipRequestParameters) => Promise<`0x${string}`> }); chain: undefined | (Chain); deployContract: (args: DeployContractParameters<abi, undefined | (Chain), undefined | (Account), chainOverride>) => Promise<`0x${string}`>; extend: (fn: (client: Client<Transport, undefined | (Chain), undefined | (Account), WalletRpcSchema, WalletActions<undefined | (Chain), undefined | (Account)>>) => client) => Client<Transport, undefined | (Chain), undefined | (Account), WalletRpcSchema, ({[K in string | number | symbol] : client[K]}) & (WalletActions<undefined | (Chain), undefined | (Account)>)>; getAddresses: () => Promise<GetAddressesReturnType>; getChainId: () => Promise<number>; getPermissions: () => Promise<GetPermissionsReturnType>; key: string; name: string; pollingInterval: number; prepareTransactionRequest: (args: PrepareTransactionRequestParameters<undefined | (Chain), undefined | (Account), chainOverride, accountOverride, request>) => Promise<{[K in string | number | symbol] : (UnionRequiredBy<(...) & (...), ParameterTypeToParameters<...>>) & (unknown extends ...[...] ? { } : Pick<..., ...>)[K]}>; request: EIP1193RequestFn<WalletRpcSchema>; requestAddresses: () => Promise<RequestAddressesReturnType>; requestPermissions: (args: { eth_accounts: Record<string, any> }) => Promise<RequestPermissionsReturnType>; sendRawTransaction: (args: SendRawTransactionParameters) => Promise<`0x${string}`>; sendTransaction: (args: SendTransactionParameters<undefined | (Chain), undefined | (Account), chainOverride, request>) => Promise<`0x${string}`>; signMessage: (args: SignMessageParameters<undefined | (Account)>) => Promise<`0x${string}`>; signTransaction: (args: SignTransactionParameters<undefined | (Chain), undefined | (Account), chainOverride, request>) => Promise<TransactionSerialized<GetTransactionType<request, (request extends LegacyProperties ? "legacy" : never) | (request extends EIP1559Properties ? "eip1559" : never) | (request extends EIP2930Properties ? "eip2930" : never) | (request extends EIP4844Properties ? "eip4844" : never) | (request extends EIP7702Properties ? "eip7702" : never) | (...[...] extends (...) | (...) ? Extract<..., ...> : never)>, (GetTransactionType<request, (...) | (...) | (...) | (...) | (...) | (...)> extends "eip1559" ? `0x02${string}` : never) | (GetTransactionType<request, (...) | (...) | (...) | (...) | (...) | (...)> extends "eip2930" ? `0x01${string}` : never) | (GetTransactionType<request, (...) | (...) | (...) | (...) | (...) | (...)> extends "eip4844" ? `0x03${string}` : never) | (GetTransactionType<request, (...) | (...) | (...) | (...) | (...) | (...)> extends "eip7702" ? `0x04${string}` : never) | (GetTransactionType<request, (...) | (...) | (...) | (...) | (...) | (...)> extends "legacy" ? TransactionSerializedLegacy : never)>>; signTypedData: (args: SignTypedDataParameters<typedData, primaryType, undefined | (Account)>) => Promise<`0x${string}`>; switchChain: (args: SwitchChainParameters) => Promise<void>; transport: (TransportConfig<string, EIP1193RequestFn>) & (Record<string, any>); type: string; uid: string; watchAsset: (args: WatchAssetParams) => Promise<boolean>; writeContract: (args: WriteContractParameters<abi, functionName, args, undefined | (Chain), undefined | (Account), chainOverride>) => Promise<`0x${string}`> } } }

 ``

##### contract

 Creates a ThirdwebContract from a Viem contract or the other way around.

`` type contract = {

fromViem: (

options: FromViemContractOptions<TAbi>,

 ) => Readonly<[ContractOptions](https://portal.thirdweb.com/references/typescript/v5/ContractOptions)<TAbi, `0x${string}`>>;

toViem: {};

};

 ``

### Example

####  fromViem

`import { viemAdapter } from "thirdweb/adapters/viem";

const contract = viemAdapter.contract.fromViem({

 viemContract: viemContract,

 chain: ethereum,

 client,

});

`

####  toViem

`import { viemAdapter } from "thirdweb/adapters";

const viemContract = await viemAdapter.contract.toViem({

 thirdwebContract,

});

`

##### publicClient

 Converts options to a Viem public client.

`` type publicClient = { toViem: (options: ToViemPublicClientOptions) => { account: undefined; batch?: { multicall?: boolean | ({ batchSize?: number; wait?: number }) }; cacheTime: number; call: (parameters: CallParameters<undefined | (Chain)>) => Promise<CallReturnType>; ccipRead?: false | ({ request?: (parameters: CcipRequestParameters) => Promise<`0x${string}`> }); chain: undefined | (Chain); createAccessList: (parameters: CreateAccessListParameters<undefined | (Chain)>) => Promise<{ accessList: AccessList; gasUsed: bigint }>; createBlockFilter: () => Promise<{ id: `0x${string}`; request: EIP1193RequestFn<readonly [{ Method: "eth_getFilterChanges"; Parameters: [filterId: ...]; ReturnType: (...) | (...) }, { Method: "eth_getFilterLogs"; Parameters: [filterId: ...]; ReturnType: Array<...> }, { Method: "eth_uninstallFilter"; Parameters: [filterId: ...]; ReturnType: boolean }]>; type: "block" }>; createContractEventFilter: (args: CreateContractEventFilterParameters<abi, eventName, args, strict, fromBlock, toBlock>) => Promise<CreateContractEventFilterReturnType<abi, eventName, args, strict, fromBlock, toBlock>>; createEventFilter: (args?: CreateEventFilterParameters<abiEvent, abiEvents, strict, fromBlock, toBlock, _EventName, _Args>) => Promise<{[K in string | number | symbol] : Filter<"event", abiEvents, _EventName, _Args, strict, fromBlock, toBlock>[K]}>; createPendingTransactionFilter: () => Promise<{ id: `0x${string}`; request: EIP1193RequestFn<readonly [{ Method: "eth_getFilterChanges"; Parameters: [filterId: ...]; ReturnType: (...) | (...) }, { Method: "eth_getFilterLogs"; Parameters: [filterId: ...]; ReturnType: Array<...> }, { Method: "eth_uninstallFilter"; Parameters: [filterId: ...]; ReturnType: boolean }]>; type: "transaction" }>; estimateContractGas: (args: EstimateContractGasParameters<abi, functionName, args, chain>) => Promise<bigint>; estimateFeesPerGas: (args?: EstimateFeesPerGasParameters<undefined | (Chain), chainOverride, type>) => Promise<EstimateFeesPerGasReturnType<type>>; estimateGas: (args: EstimateGasParameters<undefined | (Chain)>) => Promise<bigint>; estimateMaxPriorityFeePerGas: (args?: { chain: null | (chainOverride) }) => Promise<bigint>; extend: (fn: (client: Client<Transport, undefined | (Chain), undefined, PublicRpcSchema, PublicActions<Transport, undefined | (Chain)>>) => client) => Client<Transport, undefined | (Chain), undefined, PublicRpcSchema, ({[K in string | number | symbol] : client[K]}) & (PublicActions<Transport, undefined | (Chain)>)>; getBalance: (args: GetBalanceParameters) => Promise<bigint>; getBlobBaseFee: () => Promise<bigint>; getBlock: (args?: GetBlockParameters<includeTransactions, blockTag>) => Promise<{ baseFeePerGas: null | bigint; blobGasUsed: bigint; difficulty: bigint; excessBlobGas: bigint; extraData: `0x${string}`; gasLimit: bigint; gasUsed: bigint; hash: blockTag extends "pending" ? null : `0x${string}`; logsBloom: blockTag extends "pending" ? null : `0x${string}`; miner: string; mixHash: `0x${string}`; nonce: blockTag extends "pending" ? null : `0x${string}`; number: blockTag extends "pending" ? null : bigint; parentBeaconBlockRoot?: `0x${string}`; parentHash: `0x${string}`; receiptsRoot: `0x${string}`; sealFields: Array<`0x${string}`>; sha3Uncles: `0x${string}`; size: bigint; stateRoot: `0x${string}`; timestamp: bigint; totalDifficulty: null | bigint; transactions: includeTransactions extends true ? Array<({ accessList?: ...; authorizationList?: ...; blobVersionedHashes?: ...; blockHash: ...; blockNumber: ...; chainId?: ...; from: ...; gas: ...; gasPrice: ...; hash: ...; input: ...; maxFeePerBlobGas?: ...; maxFeePerGas?: ...; maxPriorityFeePerGas?: ...; nonce: ...; r: ...; s: ...; to: ...; transactionIndex: ...; type: ...; typeHex: ...; v: ...; value: ...; yParity?: ... }) | ({ accessList: ...; authorizationList?: ...; blobVersionedHashes?: ...; blockHash: ...; blockNumber: ...; chainId: ...; from: ...; gas: ...; gasPrice: ...; hash: ...; input: ...; maxFeePerBlobGas?: ...; maxFeePerGas?: ...; maxPriorityFeePerGas?: ...; nonce: ...; r: ...; s: ...; to: ...; transactionIndex: ...; type: ...; typeHex: ...; v: ...; value: ...; yParity: ... }) | ({ accessList: ...; authorizationList?: ...; blobVersionedHashes?: ...; blockHash: ...; blockNumber: ...; chainId: ...; from: ...; gas: ...; gasPrice?: ...; hash: ...; input: ...; maxFeePerBlobGas?: ...; maxFeePerGas: ...; maxPriorityFeePerGas: ...; nonce: ...; r: ...; s: ...; to: ...; transactionIndex: ...; type: ...; typeHex: ...; v: ...; value: ...; yParity: ... }) | ({ accessList: ...; authorizationList?: ...; blobVersionedHashes: ...; blockHash: ...; blockNumber: ...; chainId: ...; from: ...; gas: ...; gasPrice?: ...; hash: ...; input: ...; maxFeePerBlobGas: ...; maxFeePerGas: ...; maxPriorityFeePerGas: ...; nonce: ...; r: ...; s: ...; to: ...; transactionIndex: ...; type: ...; typeHex: ...; v: ...; value: ...; yParity: ... }) | ({ accessList: ...; authorizationList: ...; blobVersionedHashes?: ...; blockHash: ...; blockNumber: ...; chainId: ...; from: ...; gas: ...; gasPrice?: ...; hash: ...; input: ...; maxFeePerBlobGas?: ...; maxFeePerGas: ...; maxPriorityFeePerGas: ...; nonce: ...; r: ...; s: ...; to: ...; transactionIndex: ...; type: ...; typeHex: ...; v: ...; value: ...; yParity: ... })> : Array<`0x${string}`>; transactionsRoot: `0x${string}`; uncles: Array<`0x${string}`>; withdrawals?: Array<Withdrawal>; withdrawalsRoot?: `0x${string}` }>; getBlockNumber: (args?: GetBlockNumberParameters) => Promise<bigint>; getBlockTransactionCount: (args?: GetBlockTransactionCountParameters) => Promise<number>; getBytecode: (args: GetCodeParameters) => Promise<GetCodeReturnType>; getChainId: () => Promise<number>; getCode: (args: GetCodeParameters) => Promise<GetCodeReturnType>; getContractEvents: (args: GetContractEventsParameters<abi, eventName, strict, fromBlock, toBlock>) => Promise<GetContractEventsReturnType<abi, eventName, strict, fromBlock, toBlock>>; getEip712Domain: (args: GetEip712DomainParameters) => Promise<GetEip712DomainReturnType>; getEnsAddress: (args: { blockNumber?: bigint; blockTag?: BlockTag; coinType?: number; gatewayUrls?: Array<string>; name: string; strict?: boolean; universalResolverAddress?: string }) => Promise<GetEnsAddressReturnType>; getEnsAvatar: (args: { assetGatewayUrls?: AssetGatewayUrls; blockNumber?: bigint; blockTag?: BlockTag; gatewayUrls?: Array<string>; name: string; strict?: boolean; universalResolverAddress?: string }) => Promise<GetEnsAvatarReturnType>; getEnsName: (args: { address: string; blockNumber?: bigint; blockTag?: BlockTag; gatewayUrls?: Array<string>; strict?: boolean; universalResolverAddress?: string }) => Promise<GetEnsNameReturnType>; getEnsResolver: (args: { blockNumber?: bigint; blockTag?: BlockTag; name: string; universalResolverAddress?: string }) => Promise<string>; getEnsText: (args: { blockNumber?: bigint; blockTag?: BlockTag; gatewayUrls?: Array<string>; key: string; name: string; strict?: boolean; universalResolverAddress?: string }) => Promise<GetEnsTextReturnType>; getFeeHistory: (args: GetFeeHistoryParameters) => Promise<GetFeeHistoryReturnType>; getFilterChanges: (args: GetFilterChangesParameters<filterType, abi, eventName, strict, fromBlock, toBlock>) => Promise<GetFilterChangesReturnType<filterType, abi, eventName, strict, fromBlock, toBlock>>; getFilterLogs: (args: GetFilterLogsParameters<abi, eventName, strict, fromBlock, toBlock>) => Promise<GetFilterLogsReturnType<abi, eventName, strict, fromBlock, toBlock>>; getGasPrice: () => Promise<bigint>; getLogs: (args?: GetLogsParameters<abiEvent, abiEvents, strict, fromBlock, toBlock>) => Promise<GetLogsReturnType<abiEvent, abiEvents, strict, fromBlock, toBlock>>; getProof: (args: GetProofParameters) => Promise<GetProofReturnType>; getStorageAt: (args: GetStorageAtParameters) => Promise<GetStorageAtReturnType>; getTransaction: (args: GetTransactionParameters<blockTag>) => Promise<({ accessList?: undefined; authorizationList?: undefined; blobVersionedHashes?: undefined; blockHash: blockTag extends "pending" ? true : false extends true ? null : `0x${string}`; blockNumber: blockTag extends "pending" ? true : false extends true ? null : bigint; chainId?: number; from: string; gas: bigint; gasPrice: bigint; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas?: undefined; maxFeePerGas?: undefined; maxPriorityFeePerGas?: undefined; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: blockTag extends "pending" ? true : false extends true ? null : number; type: "legacy"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity?: undefined }) | ({ accessList: AccessList; authorizationList?: undefined; blobVersionedHashes?: undefined; blockHash: blockTag extends "pending" ? true : false extends true ? null : `0x${string}`; blockNumber: blockTag extends "pending" ? true : false extends true ? null : bigint; chainId: number; from: string; gas: bigint; gasPrice: bigint; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas?: undefined; maxFeePerGas?: undefined; maxPriorityFeePerGas?: undefined; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: blockTag extends "pending" ? true : false extends true ? null : number; type: "eip2930"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity: number }) | ({ accessList: AccessList; authorizationList?: undefined; blobVersionedHashes?: undefined; blockHash: blockTag extends "pending" ? true : false extends true ? null : `0x${string}`; blockNumber: blockTag extends "pending" ? true : false extends true ? null : bigint; chainId: number; from: string; gas: bigint; gasPrice?: undefined; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas?: undefined; maxFeePerGas: bigint; maxPriorityFeePerGas: bigint; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: blockTag extends "pending" ? true : false extends true ? null : number; type: "eip1559"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity: number }) | ({ accessList: AccessList; authorizationList?: undefined; blobVersionedHashes: readonly Array<`0x${string}`>; blockHash: blockTag extends "pending" ? true : false extends true ? null : `0x${string}`; blockNumber: blockTag extends "pending" ? true : false extends true ? null : bigint; chainId: number; from: string; gas: bigint; gasPrice?: undefined; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas: bigint; maxFeePerGas: bigint; maxPriorityFeePerGas: bigint; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: blockTag extends "pending" ? true : false extends true ? null : number; type: "eip4844"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity: number }) | ({ accessList: AccessList; authorizationList: SignedAuthorizationList; blobVersionedHashes?: undefined; blockHash: blockTag extends "pending" ? true : false extends true ? null : `0x${string}`; blockNumber: blockTag extends "pending" ? true : false extends true ? null : bigint; chainId: number; from: string; gas: bigint; gasPrice?: undefined; hash: `0x${string}`; input: `0x${string}`; maxFeePerBlobGas?: undefined; maxFeePerGas: bigint; maxPriorityFeePerGas: bigint; nonce: number; r: `0x${string}`; s: `0x${string}`; to: null | string; transactionIndex: blockTag extends "pending" ? true : false extends true ? null : number; type: "eip7702"; typeHex: null | (`0x${string}`); v: bigint; value: bigint; yParity: number })>; getTransactionConfirmations: (args: GetTransactionConfirmationsParameters<undefined | (Chain)>) => Promise<bigint>; getTransactionCount: (args: GetTransactionCountParameters) => Promise<number>; getTransactionReceipt: (args: GetTransactionReceiptParameters) => Promise<TransactionReceipt>; key: string; multicall: (args: MulticallParameters<contracts, allowFailure>) => Promise<MulticallReturnType<contracts, allowFailure>>; name: string; pollingInterval: number; prepareTransactionRequest: (args: PrepareTransactionRequestParameters<undefined | (Chain), undefined | (Account), chainOverride, accountOverride, request>) => Promise<{[K in string | number | symbol] : (UnionRequiredBy<(...) & (...), ParameterTypeToParameters<...>>) & (unknown extends ...[...] ? { } : Pick<..., ...>)[K]}>; readContract: (args: ReadContractParameters<abi, functionName, args>) => Promise<ReadContractReturnType<abi, functionName, args>>; request: EIP1193RequestFn<PublicRpcSchema>; sendRawTransaction: (args: SendRawTransactionParameters) => Promise<`0x${string}`>; simulate: (args: SimulateBlocksParameters<calls>) => Promise<SimulateBlocksReturnType<calls>>; simulateBlocks: (args: SimulateBlocksParameters<calls>) => Promise<SimulateBlocksReturnType<calls>>; simulateCalls: (args: SimulateCallsParameters<calls>) => Promise<SimulateCallsReturnType<calls>>; simulateContract: (args: SimulateContractParameters<abi, functionName, args, undefined | (Chain), chainOverride, accountOverride>) => Promise<SimulateContractReturnType<abi, functionName, args, undefined | (Chain), undefined | (Account), chainOverride, accountOverride>>; transport: (TransportConfig<string, EIP1193RequestFn>) & (Record<string, any>); type: string; uid: string; uninstallFilter: (args: UninstallFilterParameters) => Promise<boolean>; verifyMessage: (args: { address: string; blockNumber?: bigint; blockTag?: BlockTag; factory?: string; factoryData?: `0x${string}`; message: SignableMessage; signature: (`0x${string}`) | (ByteArray) | (Signature); universalSignatureVerifierAddress?: string }) => Promise<boolean>; verifySiweMessage: (args: { address?: string; blockNumber?: bigint; blockTag?: BlockTag; domain?: string; message: string; nonce?: string; scheme?: string; signature: `0x${string}`; time?: Date }) => Promise<boolean>; verifyTypedData: (args: VerifyTypedDataParameters) => Promise<boolean>; waitForTransactionReceipt: (args: WaitForTransactionReceiptParameters<undefined | (Chain)>) => Promise<TransactionReceipt>; watchBlockNumber: (args: WatchBlockNumberParameters) => WatchBlockNumberReturnType; watchBlocks: (args: WatchBlocksParameters<Transport, undefined | (Chain), includeTransactions, blockTag>) => WatchBlocksReturnType; watchContractEvent: (args: WatchContractEventParameters<abi, eventName, strict, Transport>) => WatchContractEventReturnType; watchEvent: (args: WatchEventParameters<abiEvent, abiEvents, strict, Transport>) => WatchEventReturnType; watchPendingTransactions: (args: WatchPendingTransactionsParameters<Transport>) => WatchPendingTransactionsReturnType } }

 ``

### Example

`import { viemAdapter } from "thirdweb/adapters/viem";

const publicClient = viemAdapter.publicClient.toViem({

 chain: ethereum,

 client,

});

`

##### wallet

 Converts a thirdweb account to a Viem Wallet client or the other way around.

`` type wallet = { fromViem: (options: { walletClient: { account: undefined | (Account); addChain: (args: AddChainParameters) => Promise<void>; batch?: { multicall?: boolean | ({ batchSize?: number; wait?: number }) }; cacheTime: number; ccipRead?: false | ({ request?: (parameters: CcipRequestParameters) => Promise<`0x${...}`> }); chain: undefined | (Chain); deployContract: (args: DeployContractParameters<abi, undefined | (Chain), undefined | (Account), chainOverride>) => Promise<`0x${string}`>; extend: (fn: (client: Client<Transport, undefined | (Chain), undefined | (Account), WalletRpcSchema, WalletActions<undefined | (Chain), undefined | (Account)>>) => client) => Client<Transport, undefined | (Chain), undefined | (Account), WalletRpcSchema, ({[K in string | number | symbol] : client[K]}) & (WalletActions<undefined | (Chain), undefined | (Account)>)>; getAddresses: () => Promise<GetAddressesReturnType>; getChainId: () => Promise<number>; getPermissions: () => Promise<GetPermissionsReturnType>; key: string; name: string; pollingInterval: number; prepareTransactionRequest: (args: PrepareTransactionRequestParameters<undefined | (Chain), undefined | (Account), chainOverride, accountOverride, request>) => Promise<{[K in string | number | symbol] : (UnionRequiredBy<..., ...>) & (... extends ... ? ... : ...)[K]}>; request: EIP1193RequestFn<WalletRpcSchema>; requestAddresses: () => Promise<RequestAddressesReturnType>; requestPermissions: (args: { eth_accounts: Record<string, any> }) => Promise<RequestPermissionsReturnType>; sendRawTransaction: (args: SendRawTransactionParameters) => Promise<`0x${string}`>; sendTransaction: (args: SendTransactionParameters<undefined | (Chain), undefined | (Account), chainOverride, request>) => Promise<`0x${string}`>; signMessage: (args: SignMessageParameters<undefined | (Account)>) => Promise<`0x${string}`>; signTransaction: (args: SignTransactionParameters<undefined | (Chain), undefined | (Account), chainOverride, request>) => Promise<TransactionSerialized<GetTransactionType<request, (... extends ... ? ... : ...) | (... extends ... ? ... : ...) | (... extends ... ? ... : ...) | (... extends ... ? ... : ...) | (... extends ... ? ... : ...) | (... extends ... ? ... : ...)>, (GetTransactionType<..., ...> extends "eip1559" ? `0x02${...}` : never) | (GetTransactionType<..., ...> extends "eip2930" ? `0x01${...}` : never) | (GetTransactionType<..., ...> extends "eip4844" ? `0x03${...}` : never) | (GetTransactionType<..., ...> extends "eip7702" ? `0x04${...}` : never) | (GetTransactionType<..., ...> extends "legacy" ? TransactionSerializedLegacy : never)>>; signTypedData: (args: SignTypedDataParameters<typedData, primaryType, undefined | (Account)>) => Promise<`0x${string}`>; switchChain: (args: SwitchChainParameters) => Promise<void>; transport: (TransportConfig<string, EIP1193RequestFn>) & (Record<string, any>); type: string; uid: string; watchAsset: (args: WatchAssetParams) => Promise<boolean>; writeContract: (args: WriteContractParameters<abi, functionName, args, undefined | (Chain), undefined | (Account), chainOverride>) => Promise<`0x${string}`> } }) => [Wallet](https://portal.thirdweb.com/references/typescript/v5/Wallet); toViem: (options: WalletToViemOptions) => { account: undefined | (Account); addChain: (args: AddChainParameters) => Promise<void>; batch?: { multicall?: boolean | ({ batchSize?: number; wait?: number }) }; cacheTime: number; ccipRead?: false | ({ request?: (parameters: CcipRequestParameters) => Promise<`0x${string}`> }); chain: undefined | (Chain); deployContract: (args: DeployContractParameters<abi, undefined | (Chain), undefined | (Account), chainOverride>) => Promise<`0x${string}`>; extend: (fn: (client: Client<Transport, undefined | (Chain), undefined | (Account), WalletRpcSchema, WalletActions<undefined | (Chain), undefined | (Account)>>) => client) => Client<Transport, undefined | (Chain), undefined | (Account), WalletRpcSchema, ({[K in string | number | symbol] : client[K]}) & (WalletActions<undefined | (Chain), undefined | (Account)>)>; getAddresses: () => Promise<GetAddressesReturnType>; getChainId: () => Promise<number>; getPermissions: () => Promise<GetPermissionsReturnType>; key: string; name: string; pollingInterval: number; prepareTransactionRequest: (args: PrepareTransactionRequestParameters<undefined | (Chain), undefined | (Account), chainOverride, accountOverride, request>) => Promise<{[K in string | number | symbol] : (UnionRequiredBy<(...) & (...), ParameterTypeToParameters<...>>) & (unknown extends ...[...] ? { } : Pick<..., ...>)[K]}>; request: EIP1193RequestFn<WalletRpcSchema>; requestAddresses: () => Promise<RequestAddressesReturnType>; requestPermissions: (args: { eth_accounts: Record<string, any> }) => Promise<RequestPermissionsReturnType>; sendRawTransaction: (args: SendRawTransactionParameters) => Promise<`0x${string}`>; sendTransaction: (args: SendTransactionParameters<undefined | (Chain), undefined | (Account), chainOverride, request>) => Promise<`0x${string}`>; signMessage: (args: SignMessageParameters<undefined | (Account)>) => Promise<`0x${string}`>; signTransaction: (args: SignTransactionParameters<undefined | (Chain), undefined | (Account), chainOverride, request>) => Promise<TransactionSerialized<GetTransactionType<request, (request extends LegacyProperties ? "legacy" : never) | (request extends EIP1559Properties ? "eip1559" : never) | (request extends EIP2930Properties ? "eip2930" : never) | (request extends EIP4844Properties ? "eip4844" : never) | (request extends EIP7702Properties ? "eip7702" : never) | (...[...] extends (...) | (...) ? Extract<..., ...> : never)>, (GetTransactionType<request, (...) | (...) | (...) | (...) | (...) | (...)> extends "eip1559" ? `0x02${string}` : never) | (GetTransactionType<request, (...) | (...) | (...) | (...) | (...) | (...)> extends "eip2930" ? `0x01${string}` : never) | (GetTransactionType<request, (...) | (...) | (...) | (...) | (...) | (...)> extends "eip4844" ? `0x03${string}` : never) | (GetTransactionType<request, (...) | (...) | (...) | (...) | (...) | (...)> extends "eip7702" ? `0x04${string}` : never) | (GetTransactionType<request, (...) | (...) | (...) | (...) | (...) | (...)> extends "legacy" ? TransactionSerializedLegacy : never)>>; signTypedData: (args: SignTypedDataParameters<typedData, primaryType, undefined | (Account)>) => Promise<`0x${string}`>; switchChain: (args: SwitchChainParameters) => Promise<void>; transport: (TransportConfig<string, EIP1193RequestFn>) & (Record<string, any>); type: string; uid: string; watchAsset: (args: WatchAssetParams) => Promise<boolean>; writeContract: (args: WriteContractParameters<abi, functionName, args, undefined | (Chain), undefined | (Account), chainOverride>) => Promise<`0x${string}`> } }

 ``

### Example

####  toViem

`import { viemAdapter } from "thirdweb/adapters/viem";

const walletClient = viemAdapter.wallet.toViem({

 wallet,

 client,

 chain: ethereum,

});

`

####  fromViem

`import { viemAdapter } from "thirdweb/adapters";

const wallet = viemAdapter.wallet.fromViem({

 walletClient,

});

`

##### walletClient

Deprecated

 use viemAdapter.wallet instead

 Converts a thirdweb account to a Viem Wallet client or the other way around.

`` type walletClient = { fromViem: (options: { walletClient: { account: undefined | ([Account](https://portal.thirdweb.com/references/typescript/v5/Account)); addChain: (args: AddChainParameters) => Promise<void>; batch?: { multicall?: boolean | ({ batchSize?: number; wait?: number }) }; cacheTime: number; ccipRead?: false | ({ request?: (parameters: CcipRequestParameters) => Promise<`0x${...}`> }); chain: undefined | (Chain); deployContract: (args: DeployContractParameters<abi, undefined | (Chain), undefined | ([Account](https://portal.thirdweb.com/references/typescript/v5/Account)), chainOverride>) => Promise<`0x${string}`>; extend: (fn: (client: Client<Transport, undefined | (Chain), undefined | ([Account](https://portal.thirdweb.com/references/typescript/v5/Account)), WalletRpcSchema, WalletActions<undefined | (Chain), undefined | ([Account](https://portal.thirdweb.com/references/typescript/v5/Account))>>) => client) => Client<Transport, undefined | (Chain), undefined | ([Account](https://portal.thirdweb.com/references/typescript/v5/Account)), WalletRpcSchema, ({[K in string | number | symbol] : client[K]}) & (WalletActions<undefined | (Chain), undefined | ([Account](https://portal.thirdweb.com/references/typescript/v5/Account))>)>; getAddresses: () => Promise<GetAddressesReturnType>; getChainId: () => Promise<number>; getPermissions: () => Promise<GetPermissionsReturnType>; key: string; name: string; pollingInterval: number; prepareTransactionRequest: (args: PrepareTransactionRequestParameters<undefined | (Chain), undefined | ([Account](https://portal.thirdweb.com/references/typescript/v5/Account)), chainOverride, accountOverride, request>) => Promise<{[K in string | number | symbol] : (UnionRequiredBy<..., ...>) & (... extends ... ? ... : ...)[K]}>; request: EIP1193RequestFn<WalletRpcSchema>; requestAddresses: () => Promise<RequestAddressesReturnType>; requestPermissions: (args: { eth_accounts: Record<string, any> }) => Promise<RequestPermissionsReturnType>; sendRawTransaction: (args: SendRawTransactionParameters) => Promise<`0x${string}`>; sendTransaction: (args: SendTransactionParameters<undefined | (Chain), undefined | ([Account](https://portal.thirdweb.com/references/typescript/v5/Account)), chainOverride, request>) => Promise<`0x${string}`>; signMessage: (args: SignMessageParameters<undefined | ([Account](https://portal.thirdweb.com/references/typescript/v5/Account))>) => Promise<`0x${string}`>; signTransaction: (args: SignTransactionParameters<undefined | (Chain), undefined | ([Account](https://portal.thirdweb.com/references/typescript/v5/Account)), chainOverride, request>) => Promise<TransactionSerialized<GetTransactionType<request, (... extends ... ? ... : ...) | (... extends ... ? ... : ...) | (... extends ... ? ... : ...) | (... extends ... ? ... : ...) | (... extends ... ? ... : ...) | (... extends ... ? ... : ...)>, (GetTransactionType<..., ...> extends "eip1559" ? `0x02${...}` : never) | (GetTransactionType<..., ...> extends "eip2930" ? `0x01${...}` : never) | (GetTransactionType<..., ...> extends "eip4844" ? `0x03${...}` : never) | (GetTransactionType<..., ...> extends "eip7702" ? `0x04${...}` : never) | (GetTransactionType<..., ...> extends "legacy" ? TransactionSerializedLegacy : never)>>; signTypedData: (args: SignTypedDataParameters<typedData, primaryType, undefined | ([Account](https://portal.thirdweb.com/references/typescript/v5/Account))>) => Promise<`0x${string}`>; switchChain: (args: SwitchChainParameters) => Promise<void>; transport: (TransportConfig<string, EIP1193RequestFn>) & (Record<string, any>); type: string; uid: string; watchAsset: (args: WatchAssetParams) => Promise<boolean>; writeContract: (args: WriteContractParameters<abi, functionName, args, undefined | (Chain), undefined | ([Account](https://portal.thirdweb.com/references/typescript/v5/Account)), chainOverride>) => Promise<`0x${string}`> } }) => [Account](https://portal.thirdweb.com/references/typescript/v5/Account); toViem: (options: ToViemWalletClientOptions) => { account: undefined | ([Account](https://portal.thirdweb.com/references/typescript/v5/Account)); addChain: (args: AddChainParameters) => Promise<void>; batch?: { multicall?: boolean | ({ batchSize?: number; wait?: number }) }; cacheTime: number; ccipRead?: false | ({ request?: (parameters: CcipRequestParameters) => Promise<`0x${string}`> }); chain: undefined | (Chain); deployContract: (args: DeployContractParameters<abi, undefined | (Chain), undefined | ([Account](https://portal.thirdweb.com/references/typescript/v5/Account)), chainOverride>) => Promise<`0x${string}`>; extend: (fn: (client: Client<Transport, undefined | (Chain), undefined | ([Account](https://portal.thirdweb.com/references/typescript/v5/Account)), WalletRpcSchema, WalletActions<undefined | (Chain), undefined | ([Account](https://portal.thirdweb.com/references/typescript/v5/Account))>>) => client) => Client<Transport, undefined | (Chain), undefined | ([Account](https://portal.thirdweb.com/references/typescript/v5/Account)), WalletRpcSchema, ({[K in string | number | symbol] : client[K]}) & (WalletActions<undefined | (Chain), undefined | ([Account](https://portal.thirdweb.com/references/typescript/v5/Account))>)>; getAddresses: () => Promise<GetAddressesReturnType>; getChainId: () => Promise<number>; getPermissions: () => Promise<GetPermissionsReturnType>; key: string; name: string; pollingInterval: number; prepareTransactionRequest: (args: PrepareTransactionRequestParameters<undefined | (Chain), undefined | ([Account](https://portal.thirdweb.com/references/typescript/v5/Account)), chainOverride, accountOverride, request>) => Promise<{[K in string | number | symbol] : (UnionRequiredBy<(...) & (...), ParameterTypeToParameters<...>>) & (unknown extends ...[...] ? { } : Pick<..., ...>)[K]}>; request: EIP1193RequestFn<WalletRpcSchema>; requestAddresses: () => Promise<RequestAddressesReturnType>; requestPermissions: (args: { eth_accounts: Record<string, any> }) => Promise<RequestPermissionsReturnType>; sendRawTransaction: (args: SendRawTransactionParameters) => Promise<`0x${string}`>; sendTransaction: (args: SendTransactionParameters<undefined | (Chain), undefined | ([Account](https://portal.thirdweb.com/references/typescript/v5/Account)), chainOverride, request>) => Promise<`0x${string}`>; signMessage: (args: SignMessageParameters<undefined | ([Account](https://portal.thirdweb.com/references/typescript/v5/Account))>) => Promise<`0x${string}`>; signTransaction: (args: SignTransactionParameters<undefined | (Chain), undefined | ([Account](https://portal.thirdweb.com/references/typescript/v5/Account)), chainOverride, request>) => Promise<TransactionSerialized<GetTransactionType<request, (request extends LegacyProperties ? "legacy" : never) | (request extends EIP1559Properties ? "eip1559" : never) | (request extends EIP2930Properties ? "eip2930" : never) | (request extends EIP4844Properties ? "eip4844" : never) | (request extends EIP7702Properties ? "eip7702" : never) | (...[...] extends (...) | (...) ? Extract<..., ...> : never)>, (GetTransactionType<request, (...) | (...) | (...) | (...) | (...) | (...)> extends "eip1559" ? `0x02${string}` : never) | (GetTransactionType<request, (...) | (...) | (...) | (...) | (...) | (...)> extends "eip2930" ? `0x01${string}` : never) | (GetTransactionType<request, (...) | (...) | (...) | (...) | (...) | (...)> extends "eip4844" ? `0x03${string}` : never) | (GetTransactionType<request, (...) | (...) | (...) | (...) | (...) | (...)> extends "eip7702" ? `0x04${string}` : never) | (GetTransactionType<request, (...) | (...) | (...) | (...) | (...) | (...)> extends "legacy" ? TransactionSerializedLegacy : never)>>; signTypedData: (args: SignTypedDataParameters<typedData, primaryType, undefined | ([Account](https://portal.thirdweb.com/references/typescript/v5/Account))>) => Promise<`0x${string}`>; switchChain: (args: SwitchChainParameters) => Promise<void>; transport: (TransportConfig<string, EIP1193RequestFn>) & (Record<string, any>); type: string; uid: string; watchAsset: (args: WatchAssetParams) => Promise<boolean>; writeContract: (args: WriteContractParameters<abi, functionName, args, undefined | (Chain), undefined | ([Account](https://portal.thirdweb.com/references/typescript/v5/Account)), chainOverride>) => Promise<`0x${string}`> } }

 ``

### Example

####  toViem

`import { viemAdapter } from "thirdweb/adapters/viem";

const walletClient = viemAdapter.walletClient.toViem({

 account,

 client,

 chain: ethereum,

});

`

####  fromViem

`import { viemAdapter } from "thirdweb/adapters";

const account = viemAdapter.walletClient.fromViem({

 walletClient,

});

`
## Core Functions

##### Extensions

##### EIP1193

##### DEPLOY

##### MARKETPLACE

##### AIRDROP

##### COMMON

##### ENS

##### ERC1155

##### ERC721

##### ERC1271

##### ERC20

##### ERC4337

##### ERC4626

##### FARCASTER

##### LENS

##### MULTICALL3

##### PACK

##### PERMISSIONS

##### SPLIT

##### THIRDWEB

##### thirdweb

##### UNISWAP

##### UNSTOPPABLE-DOMAINS

##### VOTE

##### MODULES

##### EIP5792

##### Modules

##### Common

##### BatchMetadataERC1155

##### BatchMetadataERC721

##### ClaimableERC1155

##### ClaimableERC20

##### ClaimableERC721

##### MintableERC1155

##### MintableERC20

##### MintableERC721

##### OpenEditionMetadataERC721

##### RoyaltyERC1155

##### RoyaltyERC721

##### SequentialTokenIdERC1155

##### TransferableERC1155

##### TransferableERC20

##### TransferableERC721

##### Client

##### Wallets

##### Wallet Connection

##### Wallet Utilities

##### Chain

##### Contract

##### Transactions

##### Nebula

##### Social API

##### Auth

##### NFT

##### Buy Crypto

##### Tokens

##### Storage

##### RPC

##### Theme

##### Utils

##### Miscellaneous
## Supported Wallets

### thirdweb first-party wallets

[](https://portal.thirdweb.com/references/typescript/v5/smartWallet)![](/_next/static/media/smartwallet.eaa43e0b.svg)

#### Smart Wallet

[](https://portal.thirdweb.com/references/typescript/v5/inAppWallet)![](/_next/static/media/embeddedwallet.3f910150.svg)

#### In App Wallet

[](https://portal.thirdweb.com/references/typescript/v5/ecosystemWallet)![](/_next/static/media/embeddedwallet.3f910150.svg)

#### Ecosystem Wallet

### Other wallets

| Wallet                                                                                                                   | ID                           |
| ------------------------------------------------------------------------------------------------------------------------ | ---------------------------- |
| [MetaMask](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.metamask)                                      | "io.metamask"                |
| [Trust Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.trustwallet.app)                          | "com.trustwallet.app"        |
| [OKX Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.okex.wallet)                                | "com.okex.wallet"            |
| [Bitget Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.bitget.web3)                             | "com.bitget.web3"            |
| [Binance Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.binance)                                | "com.binance"                |
| [Uniswap Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/org.uniswap)                                | "org.uniswap"                |
| [SafePal](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.safepal)                                       | "com.safepal"                |
| [Rainbow](https://portal.thirdweb.com/typescript/v5/supported-wallets/me.rainbow)                                        | "me.rainbow"                 |
| [Bybit Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.bybit)                                    | "com.bybit"                  |
| [TokenPocket](https://portal.thirdweb.com/typescript/v5/supported-wallets/pro.tokenpocket)                               | "pro.tokenpocket"            |
| [Ledger Live](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.ledger)                                    | "com.ledger"                 |
| [Timeless X](https://portal.thirdweb.com/typescript/v5/supported-wallets/xyz.timelesswallet)                             | "xyz.timelesswallet"         |
| [Safe](https://portal.thirdweb.com/typescript/v5/supported-wallets/global.safe)                                          | "global.safe"                |
| [Zerion](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.zerion.wallet)                                   | "io.zerion.wallet"           |
| [Robinhood Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.robinhood.wallet)                     | "com.robinhood.wallet"       |
| [1inch Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.1inch.wallet)                              | "io.1inch.wallet"            |
| [Crypto.com Onchain](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.crypto.wallet)                      | "com.crypto.wallet"          |
| [Exodus](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.exodus)                                         | "com.exodus"                 |
| [Argent](https://portal.thirdweb.com/typescript/v5/supported-wallets/xyz.argent)                                         | "xyz.argent"                 |
| [imToken](https://portal.thirdweb.com/typescript/v5/supported-wallets/im.token)                                          | "im.token"                   |
| [Blockchain.com](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.blockchain)                             | "com.blockchain"             |
| [Magic Eden](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.magiceden.wallet)                            | "io.magiceden.wallet"        |
| [Kraken Wallet ](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.kraken)                                 | "com.kraken"                 |
| [Backpack](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.backpack)                                     | "app.backpack"               |
| [Zengo Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.zengo)                                    | "com.zengo"                  |
| [MEW wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.mewwallet)                                  | "com.mewwallet"              |
| [Phantom](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.phantom)                                       | "app.phantom"                |
| [Fireblocks](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.fireblocks)                                 | "com.fireblocks"             |
| [MathWallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/org.mathwallet)                                 | "org.mathwallet"             |
| [AlphaWallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.alphawallet)                               | "com.alphawallet"            |
| [Ronin Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.roninchain.wallet)                        | "com.roninchain.wallet"      |
| [Unstoppable Domains](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.unstoppabledomains)                | "com.unstoppabledomains"     |
| [KEYRING PRO](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.keyring)                                   | "app.keyring"                |
| [Frontier](https://portal.thirdweb.com/typescript/v5/supported-wallets/xyz.frontier.wallet)                              | "xyz.frontier.wallet"        |
| [Omni](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.omni)                                             | "app.omni"                   |
| [Obvious](https://portal.thirdweb.com/typescript/v5/supported-wallets/technology.obvious)                                | "technology.obvious"         |
| [Ambire Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.ambire)                                  | "com.ambire"                 |
| [Bridge Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.mtpelerin)                               | "com.mtpelerin"              |
| [Internet Money Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.internetmoney)                    | "io.internetmoney"           |
| [NOW Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.walletnow)                                  | "app.walletnow"              |
| [Bitcoin.com Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.bitcoin)                            | "com.bitcoin"                |
| [αU wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.alpha-u.wallet.web)                           | "io.alpha-u.wallet.web"      |
| [Coin98 Super Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.coin98)                            | "com.coin98"                 |
| [ABC Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.myabcwallet)                                 | "io.myabcwallet"             |
| [Arculus Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/co.arculus)                                 | "co.arculus"                 |
| [Opera Crypto Browser](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.opera)                            | "com.opera"                  |
| [Chain](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.chain)                                           | "com.chain"                  |
| [Huddln](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.huddln)                                          | "io.huddln"                  |
| [Verso](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.get-verso)                                       | "com.get-verso"              |
| [HaHa](https://portal.thirdweb.com/typescript/v5/supported-wallets/me.haha)                                              | "me.haha"                    |
| [Modular Wallet Prod](https://portal.thirdweb.com/typescript/v5/supported-wallets/pk.modular)                            | "pk.modular"                 |
| [Kelp](https://portal.thirdweb.com/typescript/v5/supported-wallets/org.kelp)                                             | "org.kelp"                   |
| [Cling Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.clingon)                                   | "io.clingon"                 |
| [Broearn Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.broearn)                                | "com.broearn"                |
| [Coinomi](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.coinomi)                                       | "com.coinomi"                |
| [Ripio Portal](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.ripio)                                    | "com.ripio"                  |
| [Sabay Wallet App](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.sabay.wallet)                         | "com.sabay.wallet"           |
| [Tokoin \| My-T Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.tokoin)                           | "io.tokoin"                  |
| [Fncy Mobile Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/world.fncy)                             | "world.fncy"                 |
| [Copiosa](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.copiosa)                                        | "io.copiosa"                 |
| [Libera](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.liberawallet)                                   | "com.liberawallet"           |
| [Certhis](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.certhis)                                        | "io.certhis"                 |
| [Burrito](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.burritowallet)                                 | "com.burritowallet"          |
| [Ancrypto](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.ancrypto)                                      | "io.ancrypto"                |
| [CVL Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/network.cvl)                                    | "network.cvl"                |
| [Cypher Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.cypherhq)                                 | "io.cypherhq"                |
| [Status](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.status)                                         | "app.status"                 |
| [Enjin Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.enjin)                                     | "io.enjin"                   |
| [Essentials](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.trinity-tech)                                | "io.trinity-tech"            |
| [Everspace](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.everspace)                                   | "app.everspace"              |
| [Kriptomat](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.kriptomat)                                    | "io.kriptomat"               |
| [Oxalus Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.oxalus)                                   | "io.oxalus"                  |
| [Theta Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/org.thetatoken)                               | "org.thetatoken"             |
| [Leap Cosmos Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.leapwallet)                          | "io.leapwallet"              |
| [ISLAMIwallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/finance.islamicoin)                           | "finance.islamicoin"         |
| [COCA Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/xyz.coca)                                      | "xyz.coca"                   |
| [Monarch Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.monarchwallet)                          | "com.monarchwallet"          |
| [FILWallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/co.filwallet)                                    | "co.filwallet"               |
| [Valora](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.valoraapp)                                      | "com.valoraapp"              |
| [CoinCircle](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.coincircle)                                 | "com.coincircle"             |
| [Snowball](https://portal.thirdweb.com/typescript/v5/supported-wallets/money.snowball)                                   | "money.snowball"             |
| [ParaSwap Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.paraswap)                               | "io.paraswap"                |
| [Sahal Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/network.mrhb)                                 | "network.mrhb"               |
| [ApolloX](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.apollox)                                       | "com.apollox"                |
| [Enno Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.ennowallet)                                | "com.ennowallet"             |
| [Loopring](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.loopring.wallet)                               | "io.loopring.wallet"         |
| [BeeWallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.bee)                                         | "com.bee"                    |
| [LocalTrade Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/cc.localtrade.lab)                       | "cc.localtrade.lab"          |
| [Xcapit](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.xcapit)                                         | "com.xcapit"                 |
| [Safematrix](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.safematrix)                                  | "io.safematrix"              |
| [Neon Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.neonwallet)                                | "com.neonwallet"             |
| [Sequence Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/xyz.sequence)                              | "xyz.sequence"               |
| [Linen](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.linen)                                           | "app.linen"                  |
| [Nabox](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.nabox)                                            | "io.nabox"                   |
| [Spatium](https://portal.thirdweb.com/typescript/v5/supported-wallets/net.spatium)                                       | "net.spatium"                |
| [Cryptnox Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.cryptnox)                              | "com.cryptnox"               |
| [ID Pocket](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.rktechworks)                                 | "com.rktechworks"            |
| [Assure](https://portal.thirdweb.com/typescript/v5/supported-wallets/pro.assure)                                         | "pro.assure"                 |
| [Flooz](https://portal.thirdweb.com/typescript/v5/supported-wallets/trade.flooz.wallet)                                  | "trade.flooz.wallet"         |
| [Keplr](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.keplr)                                           | "app.keplr"                  |
| [Crossmint](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.crossmint)                                   | "com.crossmint"              |
| [pier](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.pierwallet)                                       | "com.pierwallet"             |
| [Core](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.core)                                             | "app.core"                   |
| [Keeper](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.keeper-wallet)                                  | "app.keeper-wallet"          |
| [D'CENT Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.dcentwallet)                             | "com.dcentwallet"            |
| [Paper](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.withpaper)                                       | "com.withpaper"              |
| [Klever Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/finance.klever)                              | "finance.klever"             |
| [Edge Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.edge)                                      | "app.edge"                   |
| [NeftiWallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.neftipedia)                                | "com.neftipedia"             |
| [GoldBit](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.goldbit)                                        | "io.goldbit"                 |
| [Coingrig](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.coingrig)                                     | "com.coingrig"               |
| [XFUN Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.xfun)                                       | "io.xfun"                    |
| [RiceWallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.ricewallet)                                  | "io.ricewallet"              |
| [Ancrypto Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.antiersolutions)                       | "com.antiersolutions"        |
| [Okse Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.okse)                                       | "io.okse"                    |
| [Aktionariat](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.aktionariat)                               | "com.aktionariat"            |
| [iToken Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.itoken)                                  | "com.itoken"                 |
| [Zelus](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.zelus)                                            | "io.zelus"                   |
| [Card Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.cardstack)                                 | "com.cardstack"              |
| [PayBolt](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.paybolt)                                       | "com.paybolt"                |
| [Arianee Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/org.arianee)                                | "org.arianee"                |
| [Slavi Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.slavi)                                     | "io.slavi"                   |
| [Plasma Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.plasma-wallet)                           | "com.plasma-wallet"          |
| [Defiant](https://portal.thirdweb.com/typescript/v5/supported-wallets/tech.defiantapp)                                   | "tech.defiantapp"            |
| [Avacus](https://portal.thirdweb.com/typescript/v5/supported-wallets/cc.avacus)                                          | "cc.avacus"                  |
| [ByteBank](https://portal.thirdweb.com/typescript/v5/supported-wallets/org.bytebank)                                     | "org.bytebank"               |
| [CoolWallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.coolbitx.cwsapp)                            | "com.coolbitx.cwsapp"        |
| [Opto Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.optowallet)                                | "com.optowallet"             |
| [TK Finance](https://portal.thirdweb.com/typescript/v5/supported-wallets/network.trustkeys)                              | "network.trustkeys"          |
| [Bee Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.beewallet)                                  | "app.beewallet"              |
| [MDAO Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.ttmwallet)                                  | "io.ttmwallet"               |
| [PLTwallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.pltwallet)                                    | "io.pltwallet"               |
| [helix id](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.helixid)                                       | "io.helixid"                 |
| [AirGap Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/it.airgap)                                   | "it.airgap"                  |
| [Qubic Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.qubic.wallet)                             | "app.qubic.wallet"           |
| [Holdstation Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.holdstation)                        | "com.holdstation"            |
| [Saakuru All-in-One crypto App](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.saakuru.app)             | "com.saakuru.app"            |
| [3S Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.3swallet)                                    | "com.3swallet"               |
| [Payperless](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.payperless)                                 | "com.payperless"             |
| [Minerva Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/digital.minerva)                            | "digital.minerva"            |
| [Volt: DeFi](https://portal.thirdweb.com/typescript/v5/supported-wallets/finance.voltage)                                | "finance.voltage"            |
| [Lif3 Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.lif3)                                      | "com.lif3"                   |
| [Shinobi-Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/net.shinobi-wallet)                         | "net.shinobi-wallet"         |
| [KryptoGO Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.kryptogo)                              | "com.kryptogo"               |
| [Feral File](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.feralfile.app)                              | "com.feralfile.app"          |
| [Bifrost Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.bifrostwallet)                          | "com.bifrostwallet"          |
| [Nufinetes](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.nufinetes)                                   | "com.nufinetes"              |
| [Wallet 3](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.wallet3)                                       | "io.wallet3"                 |
| [Abra Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.abra)                                      | "com.abra"                   |
| [iMe](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.imem)                                              | "app.imem"                   |
| [PREMA Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.premanft)                                 | "com.premanft"               |
| [OneKey](https://portal.thirdweb.com/typescript/v5/supported-wallets/so.onekey.app.wallet)                               | "so.onekey.app.wallet"       |
| [Slingshot Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/finance.slingshot)                        | "finance.slingshot"          |
| [Kriptonio](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.kriptonio)                                   | "com.kriptonio"              |
| [Ctrl Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/xyz.ctrl)                                      | "xyz.ctrl"                   |
| [Streakk Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.streakk)                                 | "io.streakk"                 |
| [SaitaPro](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.saitamatoken)                                 | "com.saitamatoken"           |
| [Flow Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.flowfoundation.wallet)                     | "com.flowfoundation.wallet"  |
| [Hippo Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.hippowallet)                               | "io.hippowallet"             |
| [Cosmostation](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.cosmostation)                              | "io.cosmostation"            |
| [Bitizen](https://portal.thirdweb.com/typescript/v5/supported-wallets/org.bitizen)                                       | "org.bitizen"                |
| [Blocto](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.blocto)                                          | "io.blocto"                  |
| [HUMBL WALLET](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.humbl)                                    | "com.humbl"                  |
| [PassPay Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.passpay)                                 | "io.passpay"                 |
| [Ultimate](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.ultimate)                                     | "app.ultimate"               |
| [Me Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/me.astrox)                                       | "me.astrox"                  |
| [THORWallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/org.thorwallet)                                 | "org.thorwallet"             |
| [Fizz](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.fizzwallet)                                       | "app.fizzwallet"             |
| [Stickey Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.stickey)                                | "app.stickey"                |
| [Klip](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.klipwallet)                                       | "com.klipwallet"             |
| [CoinStats](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.coinstats)                                   | "app.coinstats"              |
| [LikerLand App](https://portal.thirdweb.com/typescript/v5/supported-wallets/land.liker)                                  | "land.liker"                 |
| [Krystal](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.krystal)                                       | "app.krystal"                |
| [Pillar](https://portal.thirdweb.com/typescript/v5/supported-wallets/fi.pillar)                                          | "fi.pillar"                  |
| [HARTi Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.harti)                                     | "io.harti"                   |
| [Stasis Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/net.stasis)                                  | "net.stasis"                 |
| [Nova Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.novawallet)                                 | "io.novawallet"              |
| [DTTD](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.dttd)                                              | "io.dttd"                    |
| [FoxWallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.foxwallet)                                   | "com.foxwallet"              |
| [HAQQ Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/network.haqq)                                  | "network.haqq"               |
| [tomi Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.tomi)                                      | "com.tomi"                   |
| [StrikeX Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.tradestrike)                             | "io.tradestrike"             |
| [SubWallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.subwallet)                                   | "app.subwallet"              |
| [Okto](https://portal.thirdweb.com/typescript/v5/supported-wallets/tech.okto)                                            | "tech.okto"                  |
| [Catecoin Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.catecoin)                              | "app.catecoin"               |
| [UKISS Hub](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.ukiss)                                        | "io.ukiss"                   |
| [Tellaw Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.tellaw)                                  | "com.tellaw"                 |
| [Tangem Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.tangem)                                  | "com.tangem"                 |
| [Callback](https://portal.thirdweb.com/typescript/v5/supported-wallets/is.callback)                                      | "is.callback"                |
| [SA ASSISTANT](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.summonersarena)                            | "io.summonersarena"          |
| [Xellar](https://portal.thirdweb.com/typescript/v5/supported-wallets/co.xellar)                                          | "co.xellar"                  |
| [Talken Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.talken)                                   | "io.talken"                  |
| [U2U Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/xyz.uniultra.wallet)                            | "xyz.uniultra.wallet"        |
| [OzoneWallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.ozonewallet)                                | "io.ozonewallet"             |
| [Tidus Wallet ](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.tiduswallet)                             | "com.tiduswallet"            |
| [Impact Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/world.ixo)                                   | "world.ixo"                  |
| [Zelcore](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.zelcore)                                        | "io.zelcore"                 |
| [DOSI Vault](https://portal.thirdweb.com/typescript/v5/supported-wallets/world.dosi.vault)                               | "world.dosi.vault"           |
| [WOW EARN](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.ullapay)                                      | "com.ullapay"                |
| [ELLIPAL](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.ellipal)                                       | "com.ellipal"                |
| [Unstoppable Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/money.unstoppable)                      | "money.unstoppable"          |
| [Aurora Pass](https://portal.thirdweb.com/typescript/v5/supported-wallets/dev.auroracloud)                               | "dev.auroracloud"            |
| [Bitverse](https://portal.thirdweb.com/typescript/v5/supported-wallets/zone.bitverse)                                    | "zone.bitverse"              |
| [Konio](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.konio)                                            | "io.konio"                   |
| [GateWallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/net.gateweb3)                                   | "net.gateweb3"               |
| [UTORG](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.utorg)                                           | "app.utorg"                  |
| [CoinWallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.coinsdo)                                    | "com.coinsdo"                |
| [Ammer Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.ammer)                                    | "app.ammer"                  |
| [Binance.US](https://portal.thirdweb.com/typescript/v5/supported-wallets/us.binance)                                     | "us.binance"                 |
| [MUZA](https://portal.thirdweb.com/typescript/v5/supported-wallets/co.muza)                                              | "co.muza"                    |
| [FxWallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.fxwallet)                                     | "com.fxwallet"               |
| [RYIPAY](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.ryipay)                                         | "app.ryipay"                 |
| [MetaWallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/org.dota168)                                    | "org.dota168"                |
| [Altme](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.altme)                                            | "io.altme"                   |
| [Bitpie](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.bitpie)                                         | "com.bitpie"                 |
| [MOONSTAKE](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.moonstake)                                    | "io.moonstake"               |
| [IndiGG](https://portal.thirdweb.com/typescript/v5/supported-wallets/gg.indi)                                            | "gg.indi"                    |
| [Yuse Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.yusetoken)                                  | "io.yusetoken"               |
| [Coininn Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.coininn)                                | "com.coininn"                |
| [f(x)Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.functionx)                                   | "io.functionx"               |
| [pockie](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.pockie)                                          | "io.pockie"                  |
| [AmazeWallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.amazewallet)                               | "com.amazewallet"            |
| [Pali Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.paliwallet)                                | "com.paliwallet"             |
| [EASY](https://portal.thirdweb.com/typescript/v5/supported-wallets/me.easy)                                              | "me.easy"                    |
| [SuperWallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/live.superex)                                  | "live.superex"               |
| [SecuX](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.secuxtech)                                       | "com.secuxtech"              |
| [DIDWallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.didwallet)                                    | "io.didwallet"               |
| [Halo Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/social.halo)                                   | "social.halo"                |
| [Sinohope](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.sinohope)                                     | "com.sinohope"               |
| [Ballet Crypto](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.ballet)                                  | "com.ballet"                 |
| [OPZ Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.opz)                                        | "com.opz"                    |
| [Fizen Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.fizen)                                     | "io.fizen"                   |
| [Kresus SuperApp](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.kresus)                                | "com.kresus"                 |
| [midoin](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.midoin)                                         | "com.midoin"                 |
| [ONTO](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.onto)                                             | "app.onto"                   |
| [Oasys Passport](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.oasys-wallet)                           | "com.oasys-wallet"           |
| [GoodDollar](https://portal.thirdweb.com/typescript/v5/supported-wallets/org.gooddollar)                                 | "org.gooddollar"             |
| [Competence.id](https://portal.thirdweb.com/typescript/v5/supported-wallets/id.competence)                               | "id.competence"              |
| [Spot On Chain App](https://portal.thirdweb.com/typescript/v5/supported-wallets/ai.spotonchain.platform)                 | "ai.spotonchain.platform"    |
| [DGG Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/network.dgg)                                    | "network.dgg"                |
| [BeanBag](https://portal.thirdweb.com/typescript/v5/supported-wallets/llc.besc)                                          | "llc.besc"                   |
| [Gamic](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.gamic)                                           | "app.gamic"                  |
| [Smart.Baby](https://portal.thirdweb.com/typescript/v5/supported-wallets/baby.smart)                                     | "baby.smart"                 |
| [Gridlock Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/network.gridlock)                          | "network.gridlock"           |
| [Zeal](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.zeal)                                             | "app.zeal"                   |
| [IApp](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.ivirse)                                           | "com.ivirse"                 |
| [DS Security SA](https://portal.thirdweb.com/typescript/v5/supported-wallets/ch.dssecurity)                              | "ch.dssecurity"              |
| [Concordium](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.concordium)                                 | "com.concordium"             |
| [Ape Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.zkape)                                       | "io.zkape"                   |
| [thirdweb](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.thirdweb)                                     | "com.thirdweb"               |
| [Pitaka](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.pitaka)                                          | "io.pitaka"                  |
| [Trustee Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.trusteeglobal)                          | "com.trusteeglobal"          |
| [rss wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/org.mugambo)                                    | "org.mugambo"                |
| [Dropp](https://portal.thirdweb.com/typescript/v5/supported-wallets/cc.dropp)                                            | "cc.dropp"                   |
| [Roam](https://portal.thirdweb.com/typescript/v5/supported-wallets/xyz.roam.wallet)                                      | "xyz.roam.wallet"            |
| [Qoin Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/world.qoin)                                    | "world.qoin"                 |
| [MELDapp](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.meld.app)                                      | "com.meld.app"               |
| [Best Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.bestwallet)                                | "com.bestwallet"             |
| [HyperPay](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.hyperpay)                                      | "io.hyperpay"                |
| [Xucre](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.xucre)                                            | "io.xucre"                   |
| [HERE Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.herewallet)                                | "app.herewallet"             |
| [Cake Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.cakewallet)                                | "com.cakewallet"             |
| [una Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.unagi.unawallet)                             | "io.unagi.unawallet"         |
| [Ethos Self-Custody Vault](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.ethos)                         | "io.ethos"                   |
| [Plus Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.pluswallet)                                | "app.pluswallet"             |
| [AT.Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.authentrend)                                 | "com.authentrend"            |
| [Plena-App](https://portal.thirdweb.com/typescript/v5/supported-wallets/finance.plena)                                   | "finance.plena"              |
| [WemixWallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.wemix)                                     | "com.wemix"                  |
| [Gem Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.gemwallet)                                  | "com.gemwallet"              |
| [Caesium](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.caesiumlab)                                    | "com.caesiumlab"             |
| [FINTOKEN](https://portal.thirdweb.com/typescript/v5/supported-wallets/pro.fintoken)                                     | "pro.fintoken"               |
| [PEAKDEFI](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.peakdefi)                                     | "com.peakdefi"               |
| [Nodle](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.nodle)                                           | "com.nodle"                  |
| [Cryptokara](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.cryptokara)                                 | "com.cryptokara"             |
| [poolswallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.poolsmobility.wallet)                      | "com.poolsmobility.wallet"   |
| [VeWorld Mobile](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.veworld)                                | "com.veworld"                |
| [AZCoiner](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.azcoiner)                                     | "com.azcoiner"               |
| [Jambo](https://portal.thirdweb.com/typescript/v5/supported-wallets/technology.jambo)                                    | "technology.jambo"           |
| [UIIC](https://portal.thirdweb.com/typescript/v5/supported-wallets/vc.uincubator.api)                                    | "vc.uincubator.api"          |
| [M1NTY](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.m1nty)                                           | "app.m1nty"                  |
| [Noone Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.noone)                                     | "io.noone"                   |
| [Bitso Web3 Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.bitso)                               | "com.bitso"                  |
| [Puzzle Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/online.puzzle)                               | "online.puzzle"              |
| [BlackFort Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/network.blackfort)                        | "network.blackfort"          |
| [Armana Portal](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.armana.portal)                            | "io.armana.portal"           |
| [BharatBox App](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.bharatbox)                                | "io.bharatbox"               |
| [Blockaura](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.greengloryglobal)                            | "com.greengloryglobal"       |
| [X9Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.x9wallet)                                     | "com.x9wallet"               |
| [Mirai App](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.miraiapp)                                     | "io.miraiapp"                |
| [Kigo](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.kigo)                                              | "io.kigo"                    |
| [Cogni ](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.getcogni)                                       | "com.getcogni"               |
| [Fastex Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.fastex.wallet)                           | "com.fastex.wallet"          |
| [Wallacy](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.wallacy)                                        | "io.wallacy"                 |
| [T+ Wallet ](https://portal.thirdweb.com/typescript/v5/supported-wallets/org.talkapp)                                    | "org.talkapp"                |
| [Capsule](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.usecapsule)                                    | "com.usecapsule"             |
| [Unity Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.unitywallet)                              | "com.unitywallet"            |
| [Sinum](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.sinum)                                           | "app.sinum"                  |
| [SoulSwap](https://portal.thirdweb.com/typescript/v5/supported-wallets/finance.soulswap.app)                             | "finance.soulswap.app"       |
| [ShapeShift](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.shapeshift)                                 | "com.shapeshift"             |
| [Panaroma Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/finance.panaroma)                          | "finance.panaroma"           |
| [NEOPIN](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.neopin)                                          | "io.neopin"                  |
| [Alicebob Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.alicebob)                              | "com.alicebob"               |
| [CyberWallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/co.cyber.wallet)                               | "co.cyber.wallet"            |
| [DexTrade](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.dextrade)                                     | "com.dextrade"               |
| [HashPack](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.hashpack.wallet)                              | "com.hashpack.wallet"        |
| [The Pulse Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/org.thepulsewallet)                       | "org.thepulsewallet"         |
| [Pintu](https://portal.thirdweb.com/typescript/v5/supported-wallets/id.co.pintu)                                         | "id.co.pintu"                |
| [Blade Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.bladewallet)                               | "io.bladewallet"             |
| [Pandoshi Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.pandoshi)                              | "com.pandoshi"               |
| [Keychain](https://portal.thirdweb.com/typescript/v5/supported-wallets/money.keychain)                                   | "money.keychain"             |
| [MPCVault \| Team crypto wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.mpcvault.broswerplugin) | "com.mpcvault.broswerplugin" |
| [Legacy Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.legacynetwork)                            | "io.legacynetwork"           |
| [Clave](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.getclave)                                         | "io.getclave"                |
| [ioPay](https://portal.thirdweb.com/typescript/v5/supported-wallets/me.iopay)                                            | "me.iopay"                   |
| [Kabila Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.kabila)                                  | "app.kabila"                 |
| [Mixin Messenger](https://portal.thirdweb.com/typescript/v5/supported-wallets/one.mixin.messenger)                       | "one.mixin.messenger"        |
| [Bettatrade](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.bettatrade)                                 | "com.bettatrade"             |
| [ScramberryWallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.scramberry)                            | "io.scramberry"              |
| [Earth Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.earthwallet)                               | "io.earthwallet"             |
| [Nest Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/xyz.nestwallet)                                | "xyz.nestwallet"             |
| [Echooo Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/xyz.echooo)                                  | "xyz.echooo"                 |
| [Renegade](https://portal.thirdweb.com/typescript/v5/supported-wallets/net.myrenegade)                                   | "net.myrenegade"             |
| [Ready](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.ready)                                            | "io.ready"                   |
| [hAI by Hacken](https://portal.thirdweb.com/typescript/v5/supported-wallets/ai.hacken)                                   | "ai.hacken"                  |
| [Plutope](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.plutope)                                        | "io.plutope"                 |
| [Trust Asset Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.trustasset)                          | "io.trustasset"              |
| [Dfinn Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.dfinnwallet)                              | "app.dfinnwallet"            |
| [BMA Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.bmawallet)                                  | "com.bmawallet"              |
| [Spatium](https://portal.thirdweb.com/typescript/v5/supported-wallets/net.spatium.wallet)                                | "net.spatium.wallet"         |
| [Transi](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.transi)                                          | "io.transi"                  |
| [Dollet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.dolletwallet)                                   | "com.dolletwallet"           |
| [Wombat](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.wombat)                                         | "app.wombat"                 |
| [Dropmate](https://portal.thirdweb.com/typescript/v5/supported-wallets/fi.dropmate)                                      | "fi.dropmate"                |
| [DGPub App](https://portal.thirdweb.com/typescript/v5/supported-wallets/pub.dg)                                          | "pub.dg"                     |
| [icewal](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.icewal)                                         | "com.icewal"                 |
| [metapro wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/one.metapro.wallet)                         | "one.metapro.wallet"         |
| [Bonuz Social Smart Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/xyz.bonuz)                       | "xyz.bonuz"                  |
| [Shido App](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.shido)                                        | "io.shido"                   |
| [Life DeFi](https://portal.thirdweb.com/typescript/v5/supported-wallets/co.lifedefi)                                     | "co.lifedefi"                |
| [Tobi](https://portal.thirdweb.com/typescript/v5/supported-wallets/fun.tobi)                                             | "fun.tobi"                   |
| [Tomo Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/inc.tomo)                                      | "inc.tomo"                   |
| [Clot](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.clot)                                             | "app.clot"                   |
| [Komet](https://portal.thirdweb.com/typescript/v5/supported-wallets/me.komet.app)                                        | "me.komet.app"               |
| [GUARDIIAN Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.guardiianwallet)                       | "io.guardiianwallet"         |
| [Wallypto](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.wallypto)                                      | "io.wallypto"                |
| [SafeMoon](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.safemoon)                                     | "com.safemoon"               |
| [xPortal](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.elrond.maiar.wallet)                           | "com.elrond.maiar.wallet"    |
| [SWOP](https://portal.thirdweb.com/typescript/v5/supported-wallets/co.swopme)                                            | "co.swopme"                  |
| [BitPay Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.bitpay)                                  | "com.bitpay"                 |
| [Tofee Wallet Official](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.tofee)                           | "app.tofee"                  |
| [Zypto](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.zypto)                                           | "com.zypto"                  |
| [Orion](https://portal.thirdweb.com/typescript/v5/supported-wallets/xyz.orion)                                           | "xyz.orion"                  |
| [UPTN](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.uptn.dapp-web)                                     | "io.uptn.dapp-web"           |
| [Compass Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.compasswallet)                           | "io.compasswallet"           |
| [Nicegram Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.nicegram)                              | "app.nicegram"               |
| [Open Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/finance.openwallet)                            | "finance.openwallet"         |
| [tastycrypto](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.tastycrypto)                               | "com.tastycrypto"            |
| [IPMB Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.ipmb)                                      | "com.ipmb"                   |
| [DaffiOne](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.daffione)                                     | "com.daffione"               |
| [OWallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.owallet)                                        | "io.owallet"                 |
| [Beexo](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.beexo)                                           | "com.beexo"                  |
| [WebAuth](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.webauth)                                       | "com.webauth"                |
| [Plumaa ID](https://portal.thirdweb.com/typescript/v5/supported-wallets/id.plumaa)                                       | "id.plumaa"                  |
| [GM² Social](https://portal.thirdweb.com/typescript/v5/supported-wallets/social.gm2)                                     | "social.gm2"                 |
| [Greenhood](https://portal.thirdweb.com/typescript/v5/supported-wallets/nl.greenhood.wallet)                             | "nl.greenhood.wallet"        |
| [TobeWallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.companyname.swaptobe)                       | "com.companyname.swaptobe"   |
| [PortaWallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/finance.porta)                                 | "finance.porta"              |
| [Alephium Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/org.alephium)                              | "org.alephium"               |
| [OverFlex](https://portal.thirdweb.com/typescript/v5/supported-wallets/network.over)                                     | "network.over"               |
| [Walletverse](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.walletverse)                                | "io.walletverse"             |
| [BeraSig](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.berasig)                                       | "com.berasig"                |
| [SheFi](https://portal.thirdweb.com/typescript/v5/supported-wallets/org.shefi)                                           | "org.shefi"                  |
| [WEMIX Play](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.wemixplay)                                  | "com.wemixplay"              |
| [Family](https://portal.thirdweb.com/typescript/v5/supported-wallets/co.family.wallet)                                   | "co.family.wallet"           |
| [LegionNetwork](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.legionnetwork)                            | "io.legionnetwork"           |
| [Bitnovo Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.bitnovo)                                | "com.bitnovo"                |
| [SafeWallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.safecryptowallet)                            | "io.safecryptowallet"        |
| [Jupiter](https://portal.thirdweb.com/typescript/v5/supported-wallets/ag.jup)                                            | "ag.jup"                     |
| [Koala Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.koalawallet)                               | "io.koalawallet"             |
| [NonBank](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.nonbank)                                        | "io.nonbank"                 |
| [UniversalProfiles](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.universaleverything)                  | "io.universaleverything"     |
| [Coinbase Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.coinbase.wallet)                       | "com.coinbase.wallet"        |
| [Rabby](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.rabby)                                            | "io.rabby"                   |
| [Brave Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.brave.wallet)                             | "com.brave.wallet"           |
| [MG](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.moongate.one)                                       | "com.moongate.one"           |
| [Blanq](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.blanqlabs.wallet)                                | "com.blanqlabs.wallet"       |
| [Levain](https://portal.thirdweb.com/typescript/v5/supported-wallets/tech.levain)                                        | "tech.levain"                |
| [Enkrypt](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.enkrypt)                                       | "com.enkrypt"                |
| [Scramble](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.scramble)                                     | "com.scramble"               |
| [FinoaConnect](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.finoa)                                     | "io.finoa"                   |
| [SampleW](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.walletconnect.com)                             | "com.walletconnect.com"      |
| [Nightly](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.nightly)                                       | "app.nightly"                |
| [Blazpay](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.blazpay.wallet)                                | "com.blazpay.wallet"         |
| [JOIN MOBILE APP](https://portal.thirdweb.com/typescript/v5/supported-wallets/io.getjoin.prd)                            | "io.getjoin.prd"             |
| [Talisman Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/xyz.talisman)                              | "xyz.talisman"               |
| [clear-wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/eu.flashsoft.clear-wallet)                    | "eu.flashsoft.clear-wallet"  |
| [BeraSig](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.berasig)                                       | "app.berasig"                |
| [LootRush](https://portal.thirdweb.com/typescript/v5/supported-wallets/com.lootrush)                                     | "com.lootrush"               |
| [Core](https://portal.thirdweb.com/typescript/v5/supported-wallets/app.core.extension)                                   | "app.core.extension"         |
| [Dawn Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/xyz.dawnwallet)                                | "xyz.dawnwallet"             |
| [Abstract Global Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/xyz.abs)                            | "xyz.abs"                    |
| [In-App Wallet](https://portal.thirdweb.com/typescript/v5/supported-wallets/embedded)                                    | "embedded"                   |
| [WalletConnect](https://portal.thirdweb.com/typescript/v5/supported-wallets/walletConnect)                               | "walletConnect"              |
## AccountAddressProps

`interface AccountAddressProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, "children"> {about : string,accessKey : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,className : string,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",formatFn : (str: string) => string,hidden : boolean,id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,nonce : string,onAbort : ReactEventHandler<HTMLSpanElement>,onAbortCapture : ReactEventHandler<HTMLSpanElement>,onAnimationEnd : AnimationEventHandler<HTMLSpanElement>,onAnimationEndCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationIteration : AnimationEventHandler<HTMLSpanElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationStart : AnimationEventHandler<HTMLSpanElement>,onAnimationStartCapture : AnimationEventHandler<HTMLSpanElement>,onAuxClick : MouseEventHandler<HTMLSpanElement>,onAuxClickCapture : MouseEventHandler<HTMLSpanElement>,onBeforeInput : FormEventHandler<HTMLSpanElement>,onBeforeInputCapture : FormEventHandler<HTMLSpanElement>,onBeforeToggle : ToggleEventHandler<HTMLSpanElement>,onBlur : FocusEventHandler<HTMLSpanElement>,onBlurCapture : FocusEventHandler<HTMLSpanElement>,onCanPlay : ReactEventHandler<HTMLSpanElement>,onCanPlayCapture : ReactEventHandler<HTMLSpanElement>,onCanPlayThrough : ReactEventHandler<HTMLSpanElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLSpanElement>,onChange : FormEventHandler<HTMLSpanElement>,onChangeCapture : FormEventHandler<HTMLSpanElement>,onClick : MouseEventHandler<HTMLSpanElement>,onClickCapture : MouseEventHandler<HTMLSpanElement>,onCompositionEnd : CompositionEventHandler<HTMLSpanElement>,onCompositionEndCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionStart : CompositionEventHandler<HTMLSpanElement>,onCompositionStartCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdate : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLSpanElement>,onContextMenu : MouseEventHandler<HTMLSpanElement>,onContextMenuCapture : MouseEventHandler<HTMLSpanElement>,onCopy : ClipboardEventHandler<HTMLSpanElement>,onCopyCapture : ClipboardEventHandler<HTMLSpanElement>,onCut : ClipboardEventHandler<HTMLSpanElement>,onCutCapture : ClipboardEventHandler<HTMLSpanElement>,onDoubleClick : MouseEventHandler<HTMLSpanElement>,onDoubleClickCapture : MouseEventHandler<HTMLSpanElement>,onDrag : DragEventHandler<HTMLSpanElement>,onDragCapture : DragEventHandler<HTMLSpanElement>,onDragEnd : DragEventHandler<HTMLSpanElement>,onDragEndCapture : DragEventHandler<HTMLSpanElement>,onDragEnter : DragEventHandler<HTMLSpanElement>,onDragEnterCapture : DragEventHandler<HTMLSpanElement>,onDragExit : DragEventHandler<HTMLSpanElement>,onDragExitCapture : DragEventHandler<HTMLSpanElement>,onDragLeave : DragEventHandler<HTMLSpanElement>,onDragLeaveCapture : DragEventHandler<HTMLSpanElement>,onDragOver : DragEventHandler<HTMLSpanElement>,onDragOverCapture : DragEventHandler<HTMLSpanElement>,onDragStart : DragEventHandler<HTMLSpanElement>,onDragStartCapture : DragEventHandler<HTMLSpanElement>,onDrop : DragEventHandler<HTMLSpanElement>,onDropCapture : DragEventHandler<HTMLSpanElement>,onDurationChange : ReactEventHandler<HTMLSpanElement>,onDurationChangeCapture : ReactEventHandler<HTMLSpanElement>,onEmptied : ReactEventHandler<HTMLSpanElement>,onEmptiedCapture : ReactEventHandler<HTMLSpanElement>,onEncrypted : ReactEventHandler<HTMLSpanElement>,onEncryptedCapture : ReactEventHandler<HTMLSpanElement>,onEnded : ReactEventHandler<HTMLSpanElement>,onEndedCapture : ReactEventHandler<HTMLSpanElement>,onError : ReactEventHandler<HTMLSpanElement>,onErrorCapture : ReactEventHandler<HTMLSpanElement>,onFocus : FocusEventHandler<HTMLSpanElement>,onFocusCapture : FocusEventHandler<HTMLSpanElement>,onGotPointerCapture : PointerEventHandler<HTMLSpanElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onInput : FormEventHandler<HTMLSpanElement>,onInputCapture : FormEventHandler<HTMLSpanElement>,onInvalid : FormEventHandler<HTMLSpanElement>,onInvalidCapture : FormEventHandler<HTMLSpanElement>,onKeyDown : KeyboardEventHandler<HTMLSpanElement>,onKeyDownCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyPress : KeyboardEventHandler<HTMLSpanElement>,onKeyPressCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyUp : KeyboardEventHandler<HTMLSpanElement>,onKeyUpCapture : KeyboardEventHandler<HTMLSpanElement>,onLoad : ReactEventHandler<HTMLSpanElement>,onLoadCapture : ReactEventHandler<HTMLSpanElement>,onLoadedData : ReactEventHandler<HTMLSpanElement>,onLoadedDataCapture : ReactEventHandler<HTMLSpanElement>,onLoadedMetadata : ReactEventHandler<HTMLSpanElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLSpanElement>,onLoadStart : ReactEventHandler<HTMLSpanElement>,onLoadStartCapture : ReactEventHandler<HTMLSpanElement>,onLostPointerCapture : PointerEventHandler<HTMLSpanElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onMouseDown : MouseEventHandler<HTMLSpanElement>,onMouseDownCapture : MouseEventHandler<HTMLSpanElement>,onMouseEnter : MouseEventHandler<HTMLSpanElement>,onMouseLeave : MouseEventHandler<HTMLSpanElement>,onMouseMove : MouseEventHandler<HTMLSpanElement>,onMouseMoveCapture : MouseEventHandler<HTMLSpanElement>,onMouseOut : MouseEventHandler<HTMLSpanElement>,onMouseOutCapture : MouseEventHandler<HTMLSpanElement>,onMouseOver : MouseEventHandler<HTMLSpanElement>,onMouseOverCapture : MouseEventHandler<HTMLSpanElement>,onMouseUp : MouseEventHandler<HTMLSpanElement>,onMouseUpCapture : MouseEventHandler<HTMLSpanElement>,onPaste : ClipboardEventHandler<HTMLSpanElement>,onPasteCapture : ClipboardEventHandler<HTMLSpanElement>,onPause : ReactEventHandler<HTMLSpanElement>,onPauseCapture : ReactEventHandler<HTMLSpanElement>,onPlay : ReactEventHandler<HTMLSpanElement>,onPlayCapture : ReactEventHandler<HTMLSpanElement>,onPlaying : ReactEventHandler<HTMLSpanElement>,onPlayingCapture : ReactEventHandler<HTMLSpanElement>,onPointerCancel : PointerEventHandler<HTMLSpanElement>,onPointerCancelCapture : PointerEventHandler<HTMLSpanElement>,onPointerDown : PointerEventHandler<HTMLSpanElement>,onPointerDownCapture : PointerEventHandler<HTMLSpanElement>,onPointerEnter : PointerEventHandler<HTMLSpanElement>,onPointerLeave : PointerEventHandler<HTMLSpanElement>,onPointerMove : PointerEventHandler<HTMLSpanElement>,onPointerMoveCapture : PointerEventHandler<HTMLSpanElement>,onPointerOut : PointerEventHandler<HTMLSpanElement>,onPointerOutCapture : PointerEventHandler<HTMLSpanElement>,onPointerOver : PointerEventHandler<HTMLSpanElement>,onPointerOverCapture : PointerEventHandler<HTMLSpanElement>,onPointerUp : PointerEventHandler<HTMLSpanElement>,onPointerUpCapture : PointerEventHandler<HTMLSpanElement>,onProgress : ReactEventHandler<HTMLSpanElement>,onProgressCapture : ReactEventHandler<HTMLSpanElement>,onRateChange : ReactEventHandler<HTMLSpanElement>,onRateChangeCapture : ReactEventHandler<HTMLSpanElement>,onReset : FormEventHandler<HTMLSpanElement>,onResetCapture : FormEventHandler<HTMLSpanElement>,onResize : ReactEventHandler<HTMLSpanElement>,onResizeCapture : ReactEventHandler<HTMLSpanElement>,onScroll : UIEventHandler<HTMLSpanElement>,onScrollCapture : UIEventHandler<HTMLSpanElement>,onSeeked : ReactEventHandler<HTMLSpanElement>,onSeekedCapture : ReactEventHandler<HTMLSpanElement>,onSeeking : ReactEventHandler<HTMLSpanElement>,onSeekingCapture : ReactEventHandler<HTMLSpanElement>,onSelect : ReactEventHandler<HTMLSpanElement>,onSelectCapture : ReactEventHandler<HTMLSpanElement>,onStalled : ReactEventHandler<HTMLSpanElement>,onStalledCapture : ReactEventHandler<HTMLSpanElement>,onSubmit : FormEventHandler<HTMLSpanElement>,onSubmitCapture : FormEventHandler<HTMLSpanElement>,onSuspend : ReactEventHandler<HTMLSpanElement>,onSuspendCapture : ReactEventHandler<HTMLSpanElement>,onTimeUpdate : ReactEventHandler<HTMLSpanElement>,onTimeUpdateCapture : ReactEventHandler<HTMLSpanElement>,onToggle : ToggleEventHandler<HTMLSpanElement>,onTouchCancel : TouchEventHandler<HTMLSpanElement>,onTouchCancelCapture : TouchEventHandler<HTMLSpanElement>,onTouchEnd : TouchEventHandler<HTMLSpanElement>,onTouchEndCapture : TouchEventHandler<HTMLSpanElement>,onTouchMove : TouchEventHandler<HTMLSpanElement>,onTouchMoveCapture : TouchEventHandler<HTMLSpanElement>,onTouchStart : TouchEventHandler<HTMLSpanElement>,onTouchStartCapture : TouchEventHandler<HTMLSpanElement>,onTransitionCancel : TransitionEventHandler<HTMLSpanElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionEnd : TransitionEventHandler<HTMLSpanElement>,onTransitionEndCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionRun : TransitionEventHandler<HTMLSpanElement>,onTransitionRunCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionStart : TransitionEventHandler<HTMLSpanElement>,onTransitionStartCapture : TransitionEventHandler<HTMLSpanElement>,onVolumeChange : ReactEventHandler<HTMLSpanElement>,onVolumeChangeCapture : ReactEventHandler<HTMLSpanElement>,onWaiting : ReactEventHandler<HTMLSpanElement>,onWaitingCapture : ReactEventHandler<HTMLSpanElement>,onWheel : WheelEventHandler<HTMLSpanElement>,onWheelCapture : WheelEventHandler<HTMLSpanElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,radioGroup : string,rel : string,resource : string,results : number,rev : string,role : AriaRole,security : string,slot : string,spellCheck : Booleanish,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,tabIndex : number,title : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",vocab : string}

`

##### about

`type about = string;

`

##### accessKey

`type accessKey = string;

`

##### aria-activedescendant

 Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application.

`type aria-activedescendant = string

`

##### aria-atomic

 Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute.

`type aria-atomic = Booleanish

`

##### aria-autocomplete

 Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be presented if they are made.

`type aria-autocomplete = "inline" | "none" | "list" | "both"

`

##### aria-braillelabel

 Defines a string value that labels the current element, which is intended to be converted into Braille.

 aria-label.

`type aria-braillelabel = string

`

##### aria-brailleroledescription

 Defines a human-readable, author-localized abbreviated description for the role of an element, which is intended to be converted into Braille.

 aria-roledescription.

`type aria-brailleroledescription = string

`

##### aria-busy

`type aria-busy = Booleanish

`

##### aria-checked

 Indicates the current "checked" state of checkboxes, radio buttons, and other widgets.

* aria-pressed
* aria-selected.

`type aria-checked = boolean | "false" | "true" | "mixed"

`

##### aria-colcount

 Defines the total number of columns in a table, grid, or treegrid.

 aria-colindex.

`type aria-colcount = number

`

##### aria-colindex

 Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid.

* aria-colcount
* aria-colspan.

`type aria-colindex = number

`

##### aria-colindextext

 Defines a human readable text alternative of aria-colindex.

 aria-rowindextext.

`type aria-colindextext = string

`

##### aria-colspan

 Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-colindex
* aria-rowspan.

`type aria-colspan = number

`

##### aria-controls

 Identifies the element (or elements) whose contents or presence are controlled by the current element.

 aria-owns.

`type aria-controls = string

`

##### aria-current

 Indicates the element that represents the current item within a container or set of related elements.

`type aria-current = boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date"

`

##### aria-describedby

 Identifies the element (or elements) that describes the object.

 aria-labelledby

`type aria-describedby = string

`

##### aria-description

 Defines a string value that describes or annotates the current element.

 related aria-describedby.

`type aria-description = string

`

##### aria-details

 Identifies the element that provides a detailed, extended description for the object.

 aria-describedby.

`type aria-details = string

`

##### aria-disabled

 Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable.

* aria-hidden
* aria-readonly.

`type aria-disabled = Booleanish

`

##### aria-dropeffect

Deprecated

 in ARIA 1.1

 Indicates what functions can be performed when a dragged object is released on the drop target.

`type aria-dropeffect = "link" | "popup" | "execute" | "none" | "copy" | "move"

`

##### aria-errormessage

 Identifies the element that provides an error message for the object.

* aria-invalid
* aria-describedby.

`type aria-errormessage = string

`

##### aria-expanded

 Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed.

`type aria-expanded = Booleanish

`

##### aria-flowto

 Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion, allows assistive technology to override the general default of reading in document source order.

`type aria-flowto = string

`

##### aria-grabbed

Deprecated

 in ARIA 1.1

 Indicates an element's "grabbed" state in a drag-and-drop operation.

`type aria-grabbed = Booleanish

`

##### aria-haspopup

 Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element.

`type aria-haspopup = boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree"

`

##### aria-hidden

 Indicates whether the element is exposed to an accessibility API.

 aria-disabled.

`type aria-hidden = Booleanish

`

##### aria-invalid

 Indicates the entered value does not conform to the format expected by the application.

 aria-errormessage.

`type aria-invalid = boolean | "false" | "true" | "grammar" | "spelling"

`

##### aria-keyshortcuts

 Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element.

`type aria-keyshortcuts = string

`

##### aria-label

 Defines a string value that labels the current element.

 aria-labelledby.

`type aria-label = string

`

##### aria-labelledby

 Identifies the element (or elements) that labels the current element.

 aria-describedby.

`type aria-labelledby = string

`

##### aria-level

 Defines the hierarchical level of an element within a structure.

`type aria-level = number

`

##### aria-live

 Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region.

`type aria-live = "off" | "polite" | "assertive"

`

##### aria-modal

 Indicates whether an element is modal when displayed.

`type aria-modal = Booleanish

`

##### aria-multiline

 Indicates whether a text box accepts multiple lines of input or only a single line.

`type aria-multiline = Booleanish

`

##### aria-multiselectable

 Indicates that the user may select more than one item from the current selectable descendants.

`type aria-multiselectable = Booleanish

`

##### aria-orientation

 Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous.

`type aria-orientation = "horizontal" | "vertical"

`

##### aria-owns

 Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship between DOM elements where the DOM hierarchy cannot be used to represent the relationship.

 aria-controls.

`type aria-owns = string

`

##### aria-placeholder

 Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value. A hint could be a sample value or a brief description of the expected format.

`type aria-placeholder = string

`

##### aria-posinset

 Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-setsize.

`type aria-posinset = number

`

##### aria-pressed

 Indicates the current "pressed" state of toggle buttons.

* aria-checked
* aria-selected.

`type aria-pressed = boolean | "false" | "true" | "mixed"

`

##### aria-readonly

 Indicates that the element is not editable, but is otherwise operable.

 aria-disabled.

`type aria-readonly = Booleanish

`

##### aria-relevant

 Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified.

 aria-atomic.

`type aria-relevant = "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals"

`

##### aria-required

 Indicates that user input is required on the element before a form may be submitted.

`type aria-required = Booleanish

`

##### aria-roledescription

 Defines a human-readable, author-localized description for the role of an element.

`type aria-roledescription = string

`

##### aria-rowcount

 Defines the total number of rows in a table, grid, or treegrid.

 aria-rowindex.

`type aria-rowcount = number

`

##### aria-rowindex

 Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid.

* aria-rowcount
* aria-rowspan.

`type aria-rowindex = number

`

##### aria-rowindextext

 Defines a human readable text alternative of aria-rowindex.

 aria-colindextext.

`type aria-rowindextext = string

`

##### aria-rowspan

 Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-rowindex
* aria-colspan.

`type aria-rowspan = number

`

##### aria-selected

 Indicates the current "selected" state of various widgets.

* aria-checked
* aria-pressed.

`type aria-selected = Booleanish

`

##### aria-setsize

 Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-posinset.

`type aria-setsize = number

`

##### aria-sort

 Indicates if items in a table or grid are sorted in ascending or descending order.

`type aria-sort = "none" | "ascending" | "descending" | "other"

`

##### aria-valuemax

 Defines the maximum allowed value for a range widget.

`type aria-valuemax = number

`

##### aria-valuemin

 Defines the minimum allowed value for a range widget.

`type aria-valuemin = number

`

##### aria-valuenow

 Defines the current value for a range widget.

 aria-valuetext.

`type aria-valuenow = number

`

##### aria-valuetext

 Defines the human readable text alternative of aria-valuenow for a range widget.

`type aria-valuetext = string

`

##### autoCapitalize

`type autoCapitalize =

| (string & {})

| "on"

| "off"

| "none"

| "sentences"

| "words"

| "characters";

`

##### autoCorrect

`type autoCorrect = string;

`

##### autoFocus

`type autoFocus = boolean;

`

##### autoSave

`type autoSave = string;

`

##### className

`type className = string;

`

##### color

`type color = string;

`

##### content

`type content = string;

`

##### contentEditable

`type contentEditable = "inherit" | Booleanish | "plaintext-only";

`

##### contextMenu

`type contextMenu = string;

`

##### dangerouslySetInnerHTML

`type dangerouslySetInnerHTML = { __html: string | TrustedHTML };

`

##### datatype

`type datatype = string;

`

##### defaultChecked

`type defaultChecked = boolean;

`

##### defaultValue

`type defaultValue = string | number | (readonly Array<string>)

`

##### dir

`type dir = string;

`

##### draggable

`type draggable = Booleanish;

`

##### enterKeyHint

`type enterKeyHint =

| "search"

| "done"

| "next"

| "send"

| "enter"

| "go"

| "previous";

`

##### formatFn

##### Signature

`function formatFn(str: string): string;

`

##### Parameters

##### str

###### Type

`let str: string;

`

##### Returns

##### Return Type

`let returnType: string;

`

##### hidden

`type hidden = boolean;

`

##### id

`type id = string;

`

##### inert

 https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert

`type inert = boolean;

`

##### inlist

`type inlist = any;

`

##### inputMode

 Hints at the type of data that might be entered by the user while editing the element or its contents

[ https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute](https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute)

`type inputMode =

| "search"

| "email"

| "url"

| "text"

| "none"

| "tel"

| "numeric"

| "decimal";

`

##### is

 Specify that a standard HTML element should behave like a defined custom built-in element

[ https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is](https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is)

`type is = string;

`

##### itemID

`type itemID = string;

`

##### itemProp

`type itemProp = string;

`

##### itemRef

`type itemRef = string;

`

##### itemScope

`type itemScope = boolean;

`

##### itemType

`type itemType = string;

`

##### lang

`type lang = string;

`

##### nonce

`type nonce = string;

`

##### onAbort

`type onAbort = ReactEventHandler<HTMLSpanElement>;

`

##### onAbortCapture

`type onAbortCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onAnimationEnd

`type onAnimationEnd = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationEndCapture

`type onAnimationEndCapture = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationIteration

`type onAnimationIteration = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationIterationCapture

`type onAnimationIterationCapture =

AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationStart

`type onAnimationStart = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationStartCapture

`type onAnimationStartCapture = AnimationEventHandler<HTMLSpanElement>;

`

##### onAuxClick

`type onAuxClick = MouseEventHandler<HTMLSpanElement>;

`

##### onAuxClickCapture

`type onAuxClickCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onBeforeInput

`type onBeforeInput = FormEventHandler<HTMLSpanElement>;

`

##### onBeforeInputCapture

`type onBeforeInputCapture = FormEventHandler<HTMLSpanElement>;

`

##### onBeforeToggle

`type onBeforeToggle = ToggleEventHandler<HTMLSpanElement>;

`

##### onBlur

`type onBlur = FocusEventHandler<HTMLSpanElement>;

`

##### onBlurCapture

`type onBlurCapture = FocusEventHandler<HTMLSpanElement>;

`

##### onCanPlay

`type onCanPlay = ReactEventHandler<HTMLSpanElement>;

`

##### onCanPlayCapture

`type onCanPlayCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onCanPlayThrough

`type onCanPlayThrough = ReactEventHandler<HTMLSpanElement>;

`

##### onCanPlayThroughCapture

`type onCanPlayThroughCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onChange

`type onChange = FormEventHandler<HTMLSpanElement>;

`

##### onChangeCapture

`type onChangeCapture = FormEventHandler<HTMLSpanElement>;

`

##### onClick

`type onClick = MouseEventHandler<HTMLSpanElement>;

`

##### onClickCapture

`type onClickCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onCompositionEnd

`type onCompositionEnd = CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionEndCapture

`type onCompositionEndCapture =

CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionStart

`type onCompositionStart = CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionStartCapture

`type onCompositionStartCapture =

CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionUpdate

`type onCompositionUpdate = CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionUpdateCapture

`type onCompositionUpdateCapture =

CompositionEventHandler<HTMLSpanElement>;

`

##### onContextMenu

`type onContextMenu = MouseEventHandler<HTMLSpanElement>;

`

##### onContextMenuCapture

`type onContextMenuCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onCopy

`type onCopy = ClipboardEventHandler<HTMLSpanElement>;

`

##### onCopyCapture

`type onCopyCapture = ClipboardEventHandler<HTMLSpanElement>;

`

##### onCut

`type onCut = ClipboardEventHandler<HTMLSpanElement>;

`

##### onCutCapture

`type onCutCapture = ClipboardEventHandler<HTMLSpanElement>;

`

##### onDoubleClick

`type onDoubleClick = MouseEventHandler<HTMLSpanElement>;

`

##### onDoubleClickCapture

`type onDoubleClickCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onDrag

`type onDrag = DragEventHandler<HTMLSpanElement>;

`

##### onDragCapture

`type onDragCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragEnd

`type onDragEnd = DragEventHandler<HTMLSpanElement>;

`

##### onDragEndCapture

`type onDragEndCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragEnter

`type onDragEnter = DragEventHandler<HTMLSpanElement>;

`

##### onDragEnterCapture

`type onDragEnterCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragExit

`type onDragExit = DragEventHandler<HTMLSpanElement>;

`

##### onDragExitCapture

`type onDragExitCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragLeave

`type onDragLeave = DragEventHandler<HTMLSpanElement>;

`

##### onDragLeaveCapture

`type onDragLeaveCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragOver

`type onDragOver = DragEventHandler<HTMLSpanElement>;

`

##### onDragOverCapture

`type onDragOverCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragStart

`type onDragStart = DragEventHandler<HTMLSpanElement>;

`

##### onDragStartCapture

`type onDragStartCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDrop

`type onDrop = DragEventHandler<HTMLSpanElement>;

`

##### onDropCapture

`type onDropCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDurationChange

`type onDurationChange = ReactEventHandler<HTMLSpanElement>;

`

##### onDurationChangeCapture

`type onDurationChangeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onEmptied

`type onEmptied = ReactEventHandler<HTMLSpanElement>;

`

##### onEmptiedCapture

`type onEmptiedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onEncrypted

`type onEncrypted = ReactEventHandler<HTMLSpanElement>;

`

##### onEncryptedCapture

`type onEncryptedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onEnded

`type onEnded = ReactEventHandler<HTMLSpanElement>;

`

##### onEndedCapture

`type onEndedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onError

`type onError = ReactEventHandler<HTMLSpanElement>;

`

##### onErrorCapture

`type onErrorCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onFocus

`type onFocus = FocusEventHandler<HTMLSpanElement>;

`

##### onFocusCapture

`type onFocusCapture = FocusEventHandler<HTMLSpanElement>;

`

##### onGotPointerCapture

`type onGotPointerCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onGotPointerCaptureCapture

`type onGotPointerCaptureCapture =

PointerEventHandler<HTMLSpanElement>;

`

##### onInput

`type onInput = FormEventHandler<HTMLSpanElement>;

`

##### onInputCapture

`type onInputCapture = FormEventHandler<HTMLSpanElement>;

`

##### onInvalid

`type onInvalid = FormEventHandler<HTMLSpanElement>;

`

##### onInvalidCapture

`type onInvalidCapture = FormEventHandler<HTMLSpanElement>;

`

##### onKeyDown

`type onKeyDown = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyDownCapture

`type onKeyDownCapture = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyPress

Deprecated

 Use `onKeyUp` or `onKeyDown` instead

`type onKeyPress = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyPressCapture

Deprecated

 Use `onKeyUpCapture` or `onKeyDownCapture` instead

`type onKeyPressCapture = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyUp

`type onKeyUp = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyUpCapture

`type onKeyUpCapture = KeyboardEventHandler<HTMLSpanElement>;

`

##### onLoad

`type onLoad = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadCapture

`type onLoadCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedData

`type onLoadedData = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedDataCapture

`type onLoadedDataCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedMetadata

`type onLoadedMetadata = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedMetadataCapture

`type onLoadedMetadataCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadStart

`type onLoadStart = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadStartCapture

`type onLoadStartCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLostPointerCapture

`type onLostPointerCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onLostPointerCaptureCapture

`type onLostPointerCaptureCapture =

PointerEventHandler<HTMLSpanElement>;

`

##### onMouseDown

`type onMouseDown = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseDownCapture

`type onMouseDownCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseEnter

`type onMouseEnter = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseLeave

`type onMouseLeave = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseMove

`type onMouseMove = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseMoveCapture

`type onMouseMoveCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOut

`type onMouseOut = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOutCapture

`type onMouseOutCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOver

`type onMouseOver = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOverCapture

`type onMouseOverCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseUp

`type onMouseUp = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseUpCapture

`type onMouseUpCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onPaste

`type onPaste = ClipboardEventHandler<HTMLSpanElement>;

`

##### onPasteCapture

`type onPasteCapture = ClipboardEventHandler<HTMLSpanElement>;

`

##### onPause

`type onPause = ReactEventHandler<HTMLSpanElement>;

`

##### onPauseCapture

`type onPauseCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onPlay

`type onPlay = ReactEventHandler<HTMLSpanElement>;

`

##### onPlayCapture

`type onPlayCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onPlaying

`type onPlaying = ReactEventHandler<HTMLSpanElement>;

`

##### onPlayingCapture

`type onPlayingCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onPointerCancel

`type onPointerCancel = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerCancelCapture

`type onPointerCancelCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerDown

`type onPointerDown = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerDownCapture

`type onPointerDownCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerEnter

`type onPointerEnter = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerLeave

`type onPointerLeave = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerMove

`type onPointerMove = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerMoveCapture

`type onPointerMoveCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOut

`type onPointerOut = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOutCapture

`type onPointerOutCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOver

`type onPointerOver = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOverCapture

`type onPointerOverCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerUp

`type onPointerUp = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerUpCapture

`type onPointerUpCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onProgress

`type onProgress = ReactEventHandler<HTMLSpanElement>;

`

##### onProgressCapture

`type onProgressCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onRateChange

`type onRateChange = ReactEventHandler<HTMLSpanElement>;

`

##### onRateChangeCapture

`type onRateChangeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onReset

`type onReset = FormEventHandler<HTMLSpanElement>;

`

##### onResetCapture

`type onResetCapture = FormEventHandler<HTMLSpanElement>;

`

##### onResize

`type onResize = ReactEventHandler<HTMLSpanElement>;

`

##### onResizeCapture

`type onResizeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onScroll

`type onScroll = UIEventHandler<HTMLSpanElement>;

`

##### onScrollCapture

`type onScrollCapture = UIEventHandler<HTMLSpanElement>;

`

##### onSeeked

`type onSeeked = ReactEventHandler<HTMLSpanElement>;

`

##### onSeekedCapture

`type onSeekedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onSeeking

`type onSeeking = ReactEventHandler<HTMLSpanElement>;

`

##### onSeekingCapture

`type onSeekingCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onSelect

`type onSelect = ReactEventHandler<HTMLSpanElement>;

`

##### onSelectCapture

`type onSelectCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onStalled

`type onStalled = ReactEventHandler<HTMLSpanElement>;

`

##### onStalledCapture

`type onStalledCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onSubmit

`type onSubmit = FormEventHandler<HTMLSpanElement>;

`

##### onSubmitCapture

`type onSubmitCapture = FormEventHandler<HTMLSpanElement>;

`

##### onSuspend

`type onSuspend = ReactEventHandler<HTMLSpanElement>;

`

##### onSuspendCapture

`type onSuspendCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onTimeUpdate

`type onTimeUpdate = ReactEventHandler<HTMLSpanElement>;

`

##### onTimeUpdateCapture

`type onTimeUpdateCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onToggle

`type onToggle = ToggleEventHandler<HTMLSpanElement>;

`

##### onTouchCancel

`type onTouchCancel = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchCancelCapture

`type onTouchCancelCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchEnd

`type onTouchEnd = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchEndCapture

`type onTouchEndCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchMove

`type onTouchMove = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchMoveCapture

`type onTouchMoveCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchStart

`type onTouchStart = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchStartCapture

`type onTouchStartCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTransitionCancel

`type onTransitionCancel = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionCancelCapture

`type onTransitionCancelCapture =

TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionEnd

`type onTransitionEnd = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionEndCapture

`type onTransitionEndCapture = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionRun

`type onTransitionRun = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionRunCapture

`type onTransitionRunCapture = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionStart

`type onTransitionStart = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionStartCapture

`type onTransitionStartCapture =

TransitionEventHandler<HTMLSpanElement>;

`

##### onVolumeChange

`type onVolumeChange = ReactEventHandler<HTMLSpanElement>;

`

##### onVolumeChangeCapture

`type onVolumeChangeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onWaiting

`type onWaiting = ReactEventHandler<HTMLSpanElement>;

`

##### onWaitingCapture

`type onWaitingCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onWheel

`type onWheel = WheelEventHandler<HTMLSpanElement>;

`

##### onWheelCapture

`type onWheelCapture = WheelEventHandler<HTMLSpanElement>;

`

##### popover

`type popover = "" | "auto" | "manual";

`

##### popoverTarget

`type popoverTarget = string;

`

##### popoverTargetAction

`type popoverTargetAction = "toggle" | "hide" | "show";

`

##### prefix

`type prefix = string;

`

##### property

`type property = string;

`

##### radioGroup

`type radioGroup = string;

`

##### rel

`type rel = string;

`

##### resource

`type resource = string;

`

##### results

`type results = number;

`

##### rev

`type rev = string;

`

##### role

`type role = AriaRole;

`

##### security

`type security = string;

`

##### slot

`type slot = string;

`

##### spellCheck

`type spellCheck = Booleanish;

`

##### style

`type style = CSSProperties;

`

##### suppressContentEditableWarning

`type suppressContentEditableWarning = boolean;

`

##### suppressHydrationWarning

`type suppressHydrationWarning = boolean;

`

##### tabIndex

`type tabIndex = number;

`

##### title

`type title = string;

`

##### translate

`type translate = "yes" | "no";

`

##### typeof

`type typeof = string

`

##### unselectable

`type unselectable = "on" | "off";

`

##### vocab

`type vocab = string;

`
## AccountAvatarProps

 Props for the AccountAvatar component

`interface AccountAvatarProps extends Omit<React.ImgHTMLAttributes<HTMLImageElement>, "src">, Omit<[ResolveNameOptions](https://portal.thirdweb.com/references/typescript/v5/ResolveNameOptions), "client" | "address"> {about : string,accessKey : string,alt : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,children : ReactNode,className : string,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,crossOrigin : CrossOrigin,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,decoding : "auto" | "async" | "sync",defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",fallbackComponent : Element,fetchPriority : "auto" | "high" | "low",height : string | number,hidden : boolean,id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,loading : "eager" | "lazy",loadingComponent : Element,nonce : string,onAbort : ReactEventHandler<HTMLImageElement>,onAbortCapture : ReactEventHandler<HTMLImageElement>,onAnimationEnd : AnimationEventHandler<HTMLImageElement>,onAnimationEndCapture : AnimationEventHandler<HTMLImageElement>,onAnimationIteration : AnimationEventHandler<HTMLImageElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLImageElement>,onAnimationStart : AnimationEventHandler<HTMLImageElement>,onAnimationStartCapture : AnimationEventHandler<HTMLImageElement>,onAuxClick : MouseEventHandler<HTMLImageElement>,onAuxClickCapture : MouseEventHandler<HTMLImageElement>,onBeforeInput : FormEventHandler<HTMLImageElement>,onBeforeInputCapture : FormEventHandler<HTMLImageElement>,onBeforeToggle : ToggleEventHandler<HTMLImageElement>,onBlur : FocusEventHandler<HTMLImageElement>,onBlurCapture : FocusEventHandler<HTMLImageElement>,onCanPlay : ReactEventHandler<HTMLImageElement>,onCanPlayCapture : ReactEventHandler<HTMLImageElement>,onCanPlayThrough : ReactEventHandler<HTMLImageElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLImageElement>,onChange : FormEventHandler<HTMLImageElement>,onChangeCapture : FormEventHandler<HTMLImageElement>,onClick : MouseEventHandler<HTMLImageElement>,onClickCapture : MouseEventHandler<HTMLImageElement>,onCompositionEnd : CompositionEventHandler<HTMLImageElement>,onCompositionEndCapture : CompositionEventHandler<HTMLImageElement>,onCompositionStart : CompositionEventHandler<HTMLImageElement>,onCompositionStartCapture : CompositionEventHandler<HTMLImageElement>,onCompositionUpdate : CompositionEventHandler<HTMLImageElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLImageElement>,onContextMenu : MouseEventHandler<HTMLImageElement>,onContextMenuCapture : MouseEventHandler<HTMLImageElement>,onCopy : ClipboardEventHandler<HTMLImageElement>,onCopyCapture : ClipboardEventHandler<HTMLImageElement>,onCut : ClipboardEventHandler<HTMLImageElement>,onCutCapture : ClipboardEventHandler<HTMLImageElement>,onDoubleClick : MouseEventHandler<HTMLImageElement>,onDoubleClickCapture : MouseEventHandler<HTMLImageElement>,onDrag : DragEventHandler<HTMLImageElement>,onDragCapture : DragEventHandler<HTMLImageElement>,onDragEnd : DragEventHandler<HTMLImageElement>,onDragEndCapture : DragEventHandler<HTMLImageElement>,onDragEnter : DragEventHandler<HTMLImageElement>,onDragEnterCapture : DragEventHandler<HTMLImageElement>,onDragExit : DragEventHandler<HTMLImageElement>,onDragExitCapture : DragEventHandler<HTMLImageElement>,onDragLeave : DragEventHandler<HTMLImageElement>,onDragLeaveCapture : DragEventHandler<HTMLImageElement>,onDragOver : DragEventHandler<HTMLImageElement>,onDragOverCapture : DragEventHandler<HTMLImageElement>,onDragStart : DragEventHandler<HTMLImageElement>,onDragStartCapture : DragEventHandler<HTMLImageElement>,onDrop : DragEventHandler<HTMLImageElement>,onDropCapture : DragEventHandler<HTMLImageElement>,onDurationChange : ReactEventHandler<HTMLImageElement>,onDurationChangeCapture : ReactEventHandler<HTMLImageElement>,onEmptied : ReactEventHandler<HTMLImageElement>,onEmptiedCapture : ReactEventHandler<HTMLImageElement>,onEncrypted : ReactEventHandler<HTMLImageElement>,onEncryptedCapture : ReactEventHandler<HTMLImageElement>,onEnded : ReactEventHandler<HTMLImageElement>,onEndedCapture : ReactEventHandler<HTMLImageElement>,onError : ReactEventHandler<HTMLImageElement>,onErrorCapture : ReactEventHandler<HTMLImageElement>,onFocus : FocusEventHandler<HTMLImageElement>,onFocusCapture : FocusEventHandler<HTMLImageElement>,onGotPointerCapture : PointerEventHandler<HTMLImageElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLImageElement>,onInput : FormEventHandler<HTMLImageElement>,onInputCapture : FormEventHandler<HTMLImageElement>,onInvalid : FormEventHandler<HTMLImageElement>,onInvalidCapture : FormEventHandler<HTMLImageElement>,onKeyDown : KeyboardEventHandler<HTMLImageElement>,onKeyDownCapture : KeyboardEventHandler<HTMLImageElement>,onKeyPress : KeyboardEventHandler<HTMLImageElement>,onKeyPressCapture : KeyboardEventHandler<HTMLImageElement>,onKeyUp : KeyboardEventHandler<HTMLImageElement>,onKeyUpCapture : KeyboardEventHandler<HTMLImageElement>,onLoad : ReactEventHandler<HTMLImageElement>,onLoadCapture : ReactEventHandler<HTMLImageElement>,onLoadedData : ReactEventHandler<HTMLImageElement>,onLoadedDataCapture : ReactEventHandler<HTMLImageElement>,onLoadedMetadata : ReactEventHandler<HTMLImageElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLImageElement>,onLoadStart : ReactEventHandler<HTMLImageElement>,onLoadStartCapture : ReactEventHandler<HTMLImageElement>,onLostPointerCapture : PointerEventHandler<HTMLImageElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLImageElement>,onMouseDown : MouseEventHandler<HTMLImageElement>,onMouseDownCapture : MouseEventHandler<HTMLImageElement>,onMouseEnter : MouseEventHandler<HTMLImageElement>,onMouseLeave : MouseEventHandler<HTMLImageElement>,onMouseMove : MouseEventHandler<HTMLImageElement>,onMouseMoveCapture : MouseEventHandler<HTMLImageElement>,onMouseOut : MouseEventHandler<HTMLImageElement>,onMouseOutCapture : MouseEventHandler<HTMLImageElement>,onMouseOver : MouseEventHandler<HTMLImageElement>,onMouseOverCapture : MouseEventHandler<HTMLImageElement>,onMouseUp : MouseEventHandler<HTMLImageElement>,onMouseUpCapture : MouseEventHandler<HTMLImageElement>,onPaste : ClipboardEventHandler<HTMLImageElement>,onPasteCapture : ClipboardEventHandler<HTMLImageElement>,onPause : ReactEventHandler<HTMLImageElement>,onPauseCapture : ReactEventHandler<HTMLImageElement>,onPlay : ReactEventHandler<HTMLImageElement>,onPlayCapture : ReactEventHandler<HTMLImageElement>,onPlaying : ReactEventHandler<HTMLImageElement>,onPlayingCapture : ReactEventHandler<HTMLImageElement>,onPointerCancel : PointerEventHandler<HTMLImageElement>,onPointerCancelCapture : PointerEventHandler<HTMLImageElement>,onPointerDown : PointerEventHandler<HTMLImageElement>,onPointerDownCapture : PointerEventHandler<HTMLImageElement>,onPointerEnter : PointerEventHandler<HTMLImageElement>,onPointerLeave : PointerEventHandler<HTMLImageElement>,onPointerMove : PointerEventHandler<HTMLImageElement>,onPointerMoveCapture : PointerEventHandler<HTMLImageElement>,onPointerOut : PointerEventHandler<HTMLImageElement>,onPointerOutCapture : PointerEventHandler<HTMLImageElement>,onPointerOver : PointerEventHandler<HTMLImageElement>,onPointerOverCapture : PointerEventHandler<HTMLImageElement>,onPointerUp : PointerEventHandler<HTMLImageElement>,onPointerUpCapture : PointerEventHandler<HTMLImageElement>,onProgress : ReactEventHandler<HTMLImageElement>,onProgressCapture : ReactEventHandler<HTMLImageElement>,onRateChange : ReactEventHandler<HTMLImageElement>,onRateChangeCapture : ReactEventHandler<HTMLImageElement>,onReset : FormEventHandler<HTMLImageElement>,onResetCapture : FormEventHandler<HTMLImageElement>,onResize : ReactEventHandler<HTMLImageElement>,onResizeCapture : ReactEventHandler<HTMLImageElement>,onScroll : UIEventHandler<HTMLImageElement>,onScrollCapture : UIEventHandler<HTMLImageElement>,onSeeked : ReactEventHandler<HTMLImageElement>,onSeekedCapture : ReactEventHandler<HTMLImageElement>,onSeeking : ReactEventHandler<HTMLImageElement>,onSeekingCapture : ReactEventHandler<HTMLImageElement>,onSelect : ReactEventHandler<HTMLImageElement>,onSelectCapture : ReactEventHandler<HTMLImageElement>,onStalled : ReactEventHandler<HTMLImageElement>,onStalledCapture : ReactEventHandler<HTMLImageElement>,onSubmit : FormEventHandler<HTMLImageElement>,onSubmitCapture : FormEventHandler<HTMLImageElement>,onSuspend : ReactEventHandler<HTMLImageElement>,onSuspendCapture : ReactEventHandler<HTMLImageElement>,onTimeUpdate : ReactEventHandler<HTMLImageElement>,onTimeUpdateCapture : ReactEventHandler<HTMLImageElement>,onToggle : ToggleEventHandler<HTMLImageElement>,onTouchCancel : TouchEventHandler<HTMLImageElement>,onTouchCancelCapture : TouchEventHandler<HTMLImageElement>,onTouchEnd : TouchEventHandler<HTMLImageElement>,onTouchEndCapture : TouchEventHandler<HTMLImageElement>,onTouchMove : TouchEventHandler<HTMLImageElement>,onTouchMoveCapture : TouchEventHandler<HTMLImageElement>,onTouchStart : TouchEventHandler<HTMLImageElement>,onTouchStartCapture : TouchEventHandler<HTMLImageElement>,onTransitionCancel : TransitionEventHandler<HTMLImageElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLImageElement>,onTransitionEnd : TransitionEventHandler<HTMLImageElement>,onTransitionEndCapture : TransitionEventHandler<HTMLImageElement>,onTransitionRun : TransitionEventHandler<HTMLImageElement>,onTransitionRunCapture : TransitionEventHandler<HTMLImageElement>,onTransitionStart : TransitionEventHandler<HTMLImageElement>,onTransitionStartCapture : TransitionEventHandler<HTMLImageElement>,onVolumeChange : ReactEventHandler<HTMLImageElement>,onVolumeChangeCapture : ReactEventHandler<HTMLImageElement>,onWaiting : ReactEventHandler<HTMLImageElement>,onWaitingCapture : ReactEventHandler<HTMLImageElement>,onWheel : WheelEventHandler<HTMLImageElement>,onWheelCapture : WheelEventHandler<HTMLImageElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,queryOptions : Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">,radioGroup : string,referrerPolicy : HTMLAttributeReferrerPolicy,rel : string,resolverAddress : string,resolverChain : Readonly<(ChainOptions) & ({ rpc: string })>,resource : string,results : number,rev : string,role : AriaRole,security : string,sizes : string,slot : string,socialType : "farcaster" | "ens" | "lens",spellCheck : Booleanish,srcSet : string,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,tabIndex : number,title : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",useMap : string,vocab : string,width : string | number}

`

##### about

`type about = string;

`

##### accessKey

`type accessKey = string;

`

##### alt

`type alt = string;

`

##### aria-activedescendant

 Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application.

`type aria-activedescendant = string

`

##### aria-atomic

 Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute.

`type aria-atomic = Booleanish

`

##### aria-autocomplete

 Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be presented if they are made.

`type aria-autocomplete = "inline" | "none" | "list" | "both"

`

##### aria-braillelabel

 Defines a string value that labels the current element, which is intended to be converted into Braille.

 aria-label.

`type aria-braillelabel = string

`

##### aria-brailleroledescription

 Defines a human-readable, author-localized abbreviated description for the role of an element, which is intended to be converted into Braille.

 aria-roledescription.

`type aria-brailleroledescription = string

`

##### aria-busy

`type aria-busy = Booleanish

`

##### aria-checked

 Indicates the current "checked" state of checkboxes, radio buttons, and other widgets.

* aria-pressed
* aria-selected.

`type aria-checked = boolean | "false" | "true" | "mixed"

`

##### aria-colcount

 Defines the total number of columns in a table, grid, or treegrid.

 aria-colindex.

`type aria-colcount = number

`

##### aria-colindex

 Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid.

* aria-colcount
* aria-colspan.

`type aria-colindex = number

`

##### aria-colindextext

 Defines a human readable text alternative of aria-colindex.

 aria-rowindextext.

`type aria-colindextext = string

`

##### aria-colspan

 Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-colindex
* aria-rowspan.

`type aria-colspan = number

`

##### aria-controls

 Identifies the element (or elements) whose contents or presence are controlled by the current element.

 aria-owns.

`type aria-controls = string

`

##### aria-current

 Indicates the element that represents the current item within a container or set of related elements.

`type aria-current = boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date"

`

##### aria-describedby

 Identifies the element (or elements) that describes the object.

 aria-labelledby

`type aria-describedby = string

`

##### aria-description

 Defines a string value that describes or annotates the current element.

 related aria-describedby.

`type aria-description = string

`

##### aria-details

 Identifies the element that provides a detailed, extended description for the object.

 aria-describedby.

`type aria-details = string

`

##### aria-disabled

 Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable.

* aria-hidden
* aria-readonly.

`type aria-disabled = Booleanish

`

##### aria-dropeffect

Deprecated

 in ARIA 1.1

 Indicates what functions can be performed when a dragged object is released on the drop target.

`type aria-dropeffect = "link" | "popup" | "execute" | "none" | "copy" | "move"

`

##### aria-errormessage

 Identifies the element that provides an error message for the object.

* aria-invalid
* aria-describedby.

`type aria-errormessage = string

`

##### aria-expanded

 Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed.

`type aria-expanded = Booleanish

`

##### aria-flowto

 Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion, allows assistive technology to override the general default of reading in document source order.

`type aria-flowto = string

`

##### aria-grabbed

Deprecated

 in ARIA 1.1

 Indicates an element's "grabbed" state in a drag-and-drop operation.

`type aria-grabbed = Booleanish

`

##### aria-haspopup

 Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element.

`type aria-haspopup = boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree"

`

##### aria-hidden

 Indicates whether the element is exposed to an accessibility API.

 aria-disabled.

`type aria-hidden = Booleanish

`

##### aria-invalid

 Indicates the entered value does not conform to the format expected by the application.

 aria-errormessage.

`type aria-invalid = boolean | "false" | "true" | "grammar" | "spelling"

`

##### aria-keyshortcuts

 Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element.

`type aria-keyshortcuts = string

`

##### aria-label

 Defines a string value that labels the current element.

 aria-labelledby.

`type aria-label = string

`

##### aria-labelledby

 Identifies the element (or elements) that labels the current element.

 aria-describedby.

`type aria-labelledby = string

`

##### aria-level

 Defines the hierarchical level of an element within a structure.

`type aria-level = number

`

##### aria-live

 Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region.

`type aria-live = "off" | "polite" | "assertive"

`

##### aria-modal

 Indicates whether an element is modal when displayed.

`type aria-modal = Booleanish

`

##### aria-multiline

 Indicates whether a text box accepts multiple lines of input or only a single line.

`type aria-multiline = Booleanish

`

##### aria-multiselectable

 Indicates that the user may select more than one item from the current selectable descendants.

`type aria-multiselectable = Booleanish

`

##### aria-orientation

 Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous.

`type aria-orientation = "horizontal" | "vertical"

`

##### aria-owns

 Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship between DOM elements where the DOM hierarchy cannot be used to represent the relationship.

 aria-controls.

`type aria-owns = string

`

##### aria-placeholder

 Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value. A hint could be a sample value or a brief description of the expected format.

`type aria-placeholder = string

`

##### aria-posinset

 Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-setsize.

`type aria-posinset = number

`

##### aria-pressed

 Indicates the current "pressed" state of toggle buttons.

* aria-checked
* aria-selected.

`type aria-pressed = boolean | "false" | "true" | "mixed"

`

##### aria-readonly

 Indicates that the element is not editable, but is otherwise operable.

 aria-disabled.

`type aria-readonly = Booleanish

`

##### aria-relevant

 Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified.

 aria-atomic.

`type aria-relevant = "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals"

`

##### aria-required

 Indicates that user input is required on the element before a form may be submitted.

`type aria-required = Booleanish

`

##### aria-roledescription

 Defines a human-readable, author-localized description for the role of an element.

`type aria-roledescription = string

`

##### aria-rowcount

 Defines the total number of rows in a table, grid, or treegrid.

 aria-rowindex.

`type aria-rowcount = number

`

##### aria-rowindex

 Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid.

* aria-rowcount
* aria-rowspan.

`type aria-rowindex = number

`

##### aria-rowindextext

 Defines a human readable text alternative of aria-rowindex.

 aria-colindextext.

`type aria-rowindextext = string

`

##### aria-rowspan

 Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-rowindex
* aria-colspan.

`type aria-rowspan = number

`

##### aria-selected

 Indicates the current "selected" state of various widgets.

* aria-checked
* aria-pressed.

`type aria-selected = Booleanish

`

##### aria-setsize

 Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-posinset.

`type aria-setsize = number

`

##### aria-sort

 Indicates if items in a table or grid are sorted in ascending or descending order.

`type aria-sort = "none" | "ascending" | "descending" | "other"

`

##### aria-valuemax

 Defines the maximum allowed value for a range widget.

`type aria-valuemax = number

`

##### aria-valuemin

 Defines the minimum allowed value for a range widget.

`type aria-valuemin = number

`

##### aria-valuenow

 Defines the current value for a range widget.

 aria-valuetext.

`type aria-valuenow = number

`

##### aria-valuetext

 Defines the human readable text alternative of aria-valuenow for a range widget.

`type aria-valuetext = string

`

##### autoCapitalize

`type autoCapitalize =

| (string & {})

| "on"

| "off"

| "none"

| "sentences"

| "words"

| "characters";

`

##### autoCorrect

`type autoCorrect = string;

`

##### autoFocus

`type autoFocus = boolean;

`

##### autoSave

`type autoSave = string;

`

##### children

`type children = ReactNode;

`

##### className

`type className = string;

`

##### color

`type color = string;

`

##### content

`type content = string;

`

##### contentEditable

`type contentEditable = "inherit" | Booleanish | "plaintext-only";

`

##### contextMenu

`type contextMenu = string;

`

##### crossOrigin

`type crossOrigin = CrossOrigin;

`

##### dangerouslySetInnerHTML

`type dangerouslySetInnerHTML = { __html: string | TrustedHTML };

`

##### datatype

`type datatype = string;

`

##### decoding

`type decoding = "auto" | "async" | "sync";

`

##### defaultChecked

`type defaultChecked = boolean;

`

##### defaultValue

`type defaultValue = string | number | (readonly Array<string>)

`

##### dir

`type dir = string;

`

##### draggable

`type draggable = Booleanish;

`

##### enterKeyHint

`type enterKeyHint =

| "search"

| "done"

| "next"

| "send"

| "enter"

| "go"

| "previous";

`

##### fallbackComponent

 This component will be shown if the request for fetching the avatar is done but could not retreive any result. You can pass a dummy avatar/image to this prop.

 If not passed, the component will return `null`

`type fallbackComponent = Element;

`

### Example

`<AccountAvatar fallbackComponent={<DummyImage />} />;

`

##### fetchPriority

`type fetchPriority = "auto" | "high" | "low";

`

##### height

`type height = string | number;

`

##### hidden

`type hidden = boolean;

`

##### id

`type id = string;

`

##### inert

 https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert

`type inert = boolean;

`

##### inlist

`type inlist = any;

`

##### inputMode

 Hints at the type of data that might be entered by the user while editing the element or its contents

[ https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute](https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute)

`type inputMode =

| "search"

| "email"

| "url"

| "text"

| "none"

| "tel"

| "numeric"

| "decimal";

`

##### is

 Specify that a standard HTML element should behave like a defined custom built-in element

[ https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is](https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is)

`type is = string;

`

##### itemID

`type itemID = string;

`

##### itemProp

`type itemProp = string;

`

##### itemRef

`type itemRef = string;

`

##### itemScope

`type itemScope = boolean;

`

##### itemType

`type itemType = string;

`

##### lang

`type lang = string;

`

##### loading

`type loading = "eager" | "lazy";

`

##### loadingComponent

 This component will be shown while the avatar of the account is being fetched If not passed, the component will return `null` .

 You can pass a loading sign or spinner to this prop.

`type loadingComponent = Element;

`

### Example

`<AccountAvatar loadingComponent={<Spinner />} />;

`

##### nonce

`type nonce = string;

`

##### onAbort

`type onAbort = ReactEventHandler<HTMLImageElement>;

`

##### onAbortCapture

`type onAbortCapture = ReactEventHandler<HTMLImageElement>;

`

##### onAnimationEnd

`type onAnimationEnd = AnimationEventHandler<HTMLImageElement>;

`

##### onAnimationEndCapture

`type onAnimationEndCapture = AnimationEventHandler<HTMLImageElement>;

`

##### onAnimationIteration

`type onAnimationIteration = AnimationEventHandler<HTMLImageElement>;

`

##### onAnimationIterationCapture

`type onAnimationIterationCapture =

AnimationEventHandler<HTMLImageElement>;

`

##### onAnimationStart

`type onAnimationStart = AnimationEventHandler<HTMLImageElement>;

`

##### onAnimationStartCapture

`type onAnimationStartCapture =

AnimationEventHandler<HTMLImageElement>;

`

##### onAuxClick

`type onAuxClick = MouseEventHandler<HTMLImageElement>;

`

##### onAuxClickCapture

`type onAuxClickCapture = MouseEventHandler<HTMLImageElement>;

`

##### onBeforeInput

`type onBeforeInput = FormEventHandler<HTMLImageElement>;

`

##### onBeforeInputCapture

`type onBeforeInputCapture = FormEventHandler<HTMLImageElement>;

`

##### onBeforeToggle

`type onBeforeToggle = ToggleEventHandler<HTMLImageElement>;

`

##### onBlur

`type onBlur = FocusEventHandler<HTMLImageElement>;

`

##### onBlurCapture

`type onBlurCapture = FocusEventHandler<HTMLImageElement>;

`

##### onCanPlay

`type onCanPlay = ReactEventHandler<HTMLImageElement>;

`

##### onCanPlayCapture

`type onCanPlayCapture = ReactEventHandler<HTMLImageElement>;

`

##### onCanPlayThrough

`type onCanPlayThrough = ReactEventHandler<HTMLImageElement>;

`

##### onCanPlayThroughCapture

`type onCanPlayThroughCapture = ReactEventHandler<HTMLImageElement>;

`

##### onChange

`type onChange = FormEventHandler<HTMLImageElement>;

`

##### onChangeCapture

`type onChangeCapture = FormEventHandler<HTMLImageElement>;

`

##### onClick

`type onClick = MouseEventHandler<HTMLImageElement>;

`

##### onClickCapture

`type onClickCapture = MouseEventHandler<HTMLImageElement>;

`

##### onCompositionEnd

`type onCompositionEnd = CompositionEventHandler<HTMLImageElement>;

`

##### onCompositionEndCapture

`type onCompositionEndCapture =

CompositionEventHandler<HTMLImageElement>;

`

##### onCompositionStart

`type onCompositionStart = CompositionEventHandler<HTMLImageElement>;

`

##### onCompositionStartCapture

`type onCompositionStartCapture =

CompositionEventHandler<HTMLImageElement>;

`

##### onCompositionUpdate

`type onCompositionUpdate = CompositionEventHandler<HTMLImageElement>;

`

##### onCompositionUpdateCapture

`type onCompositionUpdateCapture =

CompositionEventHandler<HTMLImageElement>;

`

##### onContextMenu

`type onContextMenu = MouseEventHandler<HTMLImageElement>;

`

##### onContextMenuCapture

`type onContextMenuCapture = MouseEventHandler<HTMLImageElement>;

`

##### onCopy

`type onCopy = ClipboardEventHandler<HTMLImageElement>;

`

##### onCopyCapture

`type onCopyCapture = ClipboardEventHandler<HTMLImageElement>;

`

##### onCut

`type onCut = ClipboardEventHandler<HTMLImageElement>;

`

##### onCutCapture

`type onCutCapture = ClipboardEventHandler<HTMLImageElement>;

`

##### onDoubleClick

`type onDoubleClick = MouseEventHandler<HTMLImageElement>;

`

##### onDoubleClickCapture

`type onDoubleClickCapture = MouseEventHandler<HTMLImageElement>;

`

##### onDrag

`type onDrag = DragEventHandler<HTMLImageElement>;

`

##### onDragCapture

`type onDragCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragEnd

`type onDragEnd = DragEventHandler<HTMLImageElement>;

`

##### onDragEndCapture

`type onDragEndCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragEnter

`type onDragEnter = DragEventHandler<HTMLImageElement>;

`

##### onDragEnterCapture

`type onDragEnterCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragExit

`type onDragExit = DragEventHandler<HTMLImageElement>;

`

##### onDragExitCapture

`type onDragExitCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragLeave

`type onDragLeave = DragEventHandler<HTMLImageElement>;

`

##### onDragLeaveCapture

`type onDragLeaveCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragOver

`type onDragOver = DragEventHandler<HTMLImageElement>;

`

##### onDragOverCapture

`type onDragOverCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragStart

`type onDragStart = DragEventHandler<HTMLImageElement>;

`

##### onDragStartCapture

`type onDragStartCapture = DragEventHandler<HTMLImageElement>;

`

##### onDrop

`type onDrop = DragEventHandler<HTMLImageElement>;

`

##### onDropCapture

`type onDropCapture = DragEventHandler<HTMLImageElement>;

`

##### onDurationChange

`type onDurationChange = ReactEventHandler<HTMLImageElement>;

`

##### onDurationChangeCapture

`type onDurationChangeCapture = ReactEventHandler<HTMLImageElement>;

`

##### onEmptied

`type onEmptied = ReactEventHandler<HTMLImageElement>;

`

##### onEmptiedCapture

`type onEmptiedCapture = ReactEventHandler<HTMLImageElement>;

`

##### onEncrypted

`type onEncrypted = ReactEventHandler<HTMLImageElement>;

`

##### onEncryptedCapture

`type onEncryptedCapture = ReactEventHandler<HTMLImageElement>;

`

##### onEnded

`type onEnded = ReactEventHandler<HTMLImageElement>;

`

##### onEndedCapture

`type onEndedCapture = ReactEventHandler<HTMLImageElement>;

`

##### onError

`type onError = ReactEventHandler<HTMLImageElement>;

`

##### onErrorCapture

`type onErrorCapture = ReactEventHandler<HTMLImageElement>;

`

##### onFocus

`type onFocus = FocusEventHandler<HTMLImageElement>;

`

##### onFocusCapture

`type onFocusCapture = FocusEventHandler<HTMLImageElement>;

`

##### onGotPointerCapture

`type onGotPointerCapture = PointerEventHandler<HTMLImageElement>;

`

##### onGotPointerCaptureCapture

`type onGotPointerCaptureCapture =

PointerEventHandler<HTMLImageElement>;

`

##### onInput

`type onInput = FormEventHandler<HTMLImageElement>;

`

##### onInputCapture

`type onInputCapture = FormEventHandler<HTMLImageElement>;

`

##### onInvalid

`type onInvalid = FormEventHandler<HTMLImageElement>;

`

##### onInvalidCapture

`type onInvalidCapture = FormEventHandler<HTMLImageElement>;

`

##### onKeyDown

`type onKeyDown = KeyboardEventHandler<HTMLImageElement>;

`

##### onKeyDownCapture

`type onKeyDownCapture = KeyboardEventHandler<HTMLImageElement>;

`

##### onKeyPress

Deprecated

 Use `onKeyUp` or `onKeyDown` instead

`type onKeyPress = KeyboardEventHandler<HTMLImageElement>;

`

##### onKeyPressCapture

Deprecated

 Use `onKeyUpCapture` or `onKeyDownCapture` instead

`type onKeyPressCapture = KeyboardEventHandler<HTMLImageElement>;

`

##### onKeyUp

`type onKeyUp = KeyboardEventHandler<HTMLImageElement>;

`

##### onKeyUpCapture

`type onKeyUpCapture = KeyboardEventHandler<HTMLImageElement>;

`

##### onLoad

`type onLoad = ReactEventHandler<HTMLImageElement>;

`

##### onLoadCapture

`type onLoadCapture = ReactEventHandler<HTMLImageElement>;

`

##### onLoadedData

`type onLoadedData = ReactEventHandler<HTMLImageElement>;

`

##### onLoadedDataCapture

`type onLoadedDataCapture = ReactEventHandler<HTMLImageElement>;

`

##### onLoadedMetadata

`type onLoadedMetadata = ReactEventHandler<HTMLImageElement>;

`

##### onLoadedMetadataCapture

`type onLoadedMetadataCapture = ReactEventHandler<HTMLImageElement>;

`

##### onLoadStart

`type onLoadStart = ReactEventHandler<HTMLImageElement>;

`

##### onLoadStartCapture

`type onLoadStartCapture = ReactEventHandler<HTMLImageElement>;

`

##### onLostPointerCapture

`type onLostPointerCapture = PointerEventHandler<HTMLImageElement>;

`

##### onLostPointerCaptureCapture

`type onLostPointerCaptureCapture =

PointerEventHandler<HTMLImageElement>;

`

##### onMouseDown

`type onMouseDown = MouseEventHandler<HTMLImageElement>;

`

##### onMouseDownCapture

`type onMouseDownCapture = MouseEventHandler<HTMLImageElement>;

`

##### onMouseEnter

`type onMouseEnter = MouseEventHandler<HTMLImageElement>;

`

##### onMouseLeave

`type onMouseLeave = MouseEventHandler<HTMLImageElement>;

`

##### onMouseMove

`type onMouseMove = MouseEventHandler<HTMLImageElement>;

`

##### onMouseMoveCapture

`type onMouseMoveCapture = MouseEventHandler<HTMLImageElement>;

`

##### onMouseOut

`type onMouseOut = MouseEventHandler<HTMLImageElement>;

`

##### onMouseOutCapture

`type onMouseOutCapture = MouseEventHandler<HTMLImageElement>;

`

##### onMouseOver

`type onMouseOver = MouseEventHandler<HTMLImageElement>;

`

##### onMouseOverCapture

`type onMouseOverCapture = MouseEventHandler<HTMLImageElement>;

`

##### onMouseUp

`type onMouseUp = MouseEventHandler<HTMLImageElement>;

`

##### onMouseUpCapture

`type onMouseUpCapture = MouseEventHandler<HTMLImageElement>;

`

##### onPaste

`type onPaste = ClipboardEventHandler<HTMLImageElement>;

`

##### onPasteCapture

`type onPasteCapture = ClipboardEventHandler<HTMLImageElement>;

`

##### onPause

`type onPause = ReactEventHandler<HTMLImageElement>;

`

##### onPauseCapture

`type onPauseCapture = ReactEventHandler<HTMLImageElement>;

`

##### onPlay

`type onPlay = ReactEventHandler<HTMLImageElement>;

`

##### onPlayCapture

`type onPlayCapture = ReactEventHandler<HTMLImageElement>;

`

##### onPlaying

`type onPlaying = ReactEventHandler<HTMLImageElement>;

`

##### onPlayingCapture

`type onPlayingCapture = ReactEventHandler<HTMLImageElement>;

`

##### onPointerCancel

`type onPointerCancel = PointerEventHandler<HTMLImageElement>;

`

##### onPointerCancelCapture

`type onPointerCancelCapture = PointerEventHandler<HTMLImageElement>;

`

##### onPointerDown

`type onPointerDown = PointerEventHandler<HTMLImageElement>;

`

##### onPointerDownCapture

`type onPointerDownCapture = PointerEventHandler<HTMLImageElement>;

`

##### onPointerEnter

`type onPointerEnter = PointerEventHandler<HTMLImageElement>;

`

##### onPointerLeave

`type onPointerLeave = PointerEventHandler<HTMLImageElement>;

`

##### onPointerMove

`type onPointerMove = PointerEventHandler<HTMLImageElement>;

`

##### onPointerMoveCapture

`type onPointerMoveCapture = PointerEventHandler<HTMLImageElement>;

`

##### onPointerOut

`type onPointerOut = PointerEventHandler<HTMLImageElement>;

`

##### onPointerOutCapture

`type onPointerOutCapture = PointerEventHandler<HTMLImageElement>;

`

##### onPointerOver

`type onPointerOver = PointerEventHandler<HTMLImageElement>;

`

##### onPointerOverCapture

`type onPointerOverCapture = PointerEventHandler<HTMLImageElement>;

`

##### onPointerUp

`type onPointerUp = PointerEventHandler<HTMLImageElement>;

`

##### onPointerUpCapture

`type onPointerUpCapture = PointerEventHandler<HTMLImageElement>;

`

##### onProgress

`type onProgress = ReactEventHandler<HTMLImageElement>;

`

##### onProgressCapture

`type onProgressCapture = ReactEventHandler<HTMLImageElement>;

`

##### onRateChange

`type onRateChange = ReactEventHandler<HTMLImageElement>;

`

##### onRateChangeCapture

`type onRateChangeCapture = ReactEventHandler<HTMLImageElement>;

`

##### onReset

`type onReset = FormEventHandler<HTMLImageElement>;

`

##### onResetCapture

`type onResetCapture = FormEventHandler<HTMLImageElement>;

`

##### onResize

`type onResize = ReactEventHandler<HTMLImageElement>;

`

##### onResizeCapture

`type onResizeCapture = ReactEventHandler<HTMLImageElement>;

`

##### onScroll

`type onScroll = UIEventHandler<HTMLImageElement>;

`

##### onScrollCapture

`type onScrollCapture = UIEventHandler<HTMLImageElement>;

`

##### onSeeked

`type onSeeked = ReactEventHandler<HTMLImageElement>;

`

##### onSeekedCapture

`type onSeekedCapture = ReactEventHandler<HTMLImageElement>;

`

##### onSeeking

`type onSeeking = ReactEventHandler<HTMLImageElement>;

`

##### onSeekingCapture

`type onSeekingCapture = ReactEventHandler<HTMLImageElement>;

`

##### onSelect

`type onSelect = ReactEventHandler<HTMLImageElement>;

`

##### onSelectCapture

`type onSelectCapture = ReactEventHandler<HTMLImageElement>;

`

##### onStalled

`type onStalled = ReactEventHandler<HTMLImageElement>;

`

##### onStalledCapture

`type onStalledCapture = ReactEventHandler<HTMLImageElement>;

`

##### onSubmit

`type onSubmit = FormEventHandler<HTMLImageElement>;

`

##### onSubmitCapture

`type onSubmitCapture = FormEventHandler<HTMLImageElement>;

`

##### onSuspend

`type onSuspend = ReactEventHandler<HTMLImageElement>;

`

##### onSuspendCapture

`type onSuspendCapture = ReactEventHandler<HTMLImageElement>;

`

##### onTimeUpdate

`type onTimeUpdate = ReactEventHandler<HTMLImageElement>;

`

##### onTimeUpdateCapture

`type onTimeUpdateCapture = ReactEventHandler<HTMLImageElement>;

`

##### onToggle

`type onToggle = ToggleEventHandler<HTMLImageElement>;

`

##### onTouchCancel

`type onTouchCancel = TouchEventHandler<HTMLImageElement>;

`

##### onTouchCancelCapture

`type onTouchCancelCapture = TouchEventHandler<HTMLImageElement>;

`

##### onTouchEnd

`type onTouchEnd = TouchEventHandler<HTMLImageElement>;

`

##### onTouchEndCapture

`type onTouchEndCapture = TouchEventHandler<HTMLImageElement>;

`

##### onTouchMove

`type onTouchMove = TouchEventHandler<HTMLImageElement>;

`

##### onTouchMoveCapture

`type onTouchMoveCapture = TouchEventHandler<HTMLImageElement>;

`

##### onTouchStart

`type onTouchStart = TouchEventHandler<HTMLImageElement>;

`

##### onTouchStartCapture

`type onTouchStartCapture = TouchEventHandler<HTMLImageElement>;

`

##### onTransitionCancel

`type onTransitionCancel = TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionCancelCapture

`type onTransitionCancelCapture =

TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionEnd

`type onTransitionEnd = TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionEndCapture

`type onTransitionEndCapture =

TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionRun

`type onTransitionRun = TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionRunCapture

`type onTransitionRunCapture =

TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionStart

`type onTransitionStart = TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionStartCapture

`type onTransitionStartCapture =

TransitionEventHandler<HTMLImageElement>;

`

##### onVolumeChange

`type onVolumeChange = ReactEventHandler<HTMLImageElement>;

`

##### onVolumeChangeCapture

`type onVolumeChangeCapture = ReactEventHandler<HTMLImageElement>;

`

##### onWaiting

`type onWaiting = ReactEventHandler<HTMLImageElement>;

`

##### onWaitingCapture

`type onWaitingCapture = ReactEventHandler<HTMLImageElement>;

`

##### onWheel

`type onWheel = WheelEventHandler<HTMLImageElement>;

`

##### onWheelCapture

`type onWheelCapture = WheelEventHandler<HTMLImageElement>;

`

##### popover

`type popover = "" | "auto" | "manual";

`

##### popoverTarget

`type popoverTarget = string;

`

##### popoverTargetAction

`type popoverTargetAction = "toggle" | "hide" | "show";

`

##### prefix

`type prefix = string;

`

##### property

`type property = string;

`

##### queryOptions

 Optional query options for `useQuery`

`type queryOptions = Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">

`

##### radioGroup

`type radioGroup = string;

`

##### referrerPolicy

`type referrerPolicy = HTMLAttributeReferrerPolicy;

`

##### rel

`type rel = string;

`

##### resolverAddress

`type resolverAddress = string;

`

##### resolverChain

`type resolverChain = Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`

##### resource

`type resource = string;

`

##### results

`type results = number;

`

##### rev

`type rev = string;

`

##### role

`type role = AriaRole;

`

##### security

`type security = string;

`

##### sizes

`type sizes = string;

`

##### slot

`type slot = string;

`

##### socialType

 Use this prop to prioritize the social profile that you want to display This is useful for a wallet containing multiple social profiles. This component inherits all attributes of a HTML's `<img />` , so you can interact with it just like a normal `<img />`

`type socialType = "farcaster" | "ens" | "lens";

`

### Example

 If you have ENS, Lens and Farcaster profiles linked to your wallet you can prioritize showing the image for Lens by:

`<AccountAvatar

socialType="lens" // Choose between: "farcaster" | "lens" | "ens"

/>;

`

##### spellCheck

`type spellCheck = Booleanish;

`

##### srcSet

`type srcSet = string;

`

##### style

`type style = CSSProperties;

`

##### suppressContentEditableWarning

`type suppressContentEditableWarning = boolean;

`

##### suppressHydrationWarning

`type suppressHydrationWarning = boolean;

`

##### tabIndex

`type tabIndex = number;

`

##### title

`type title = string;

`

##### translate

`type translate = "yes" | "no";

`

##### typeof

`type typeof = string

`

##### unselectable

`type unselectable = "on" | "off";

`

##### useMap

`type useMap = string;

`

##### vocab

`type vocab = string;

`

##### width

`type width = string | number;

`
## AccountBalanceProps

 Props for the AccountBalance component

`interface AccountBalanceProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, "children"> {about : string,accessKey : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,chain : Readonly<(ChainOptions) & ({ rpc: string })>,className : string,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",fallbackComponent : Element,formatFn : (props: AccountBalanceInfo) => string,hidden : boolean,id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,loadingComponent : Element,nonce : string,onAbort : ReactEventHandler<HTMLSpanElement>,onAbortCapture : ReactEventHandler<HTMLSpanElement>,onAnimationEnd : AnimationEventHandler<HTMLSpanElement>,onAnimationEndCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationIteration : AnimationEventHandler<HTMLSpanElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationStart : AnimationEventHandler<HTMLSpanElement>,onAnimationStartCapture : AnimationEventHandler<HTMLSpanElement>,onAuxClick : MouseEventHandler<HTMLSpanElement>,onAuxClickCapture : MouseEventHandler<HTMLSpanElement>,onBeforeInput : FormEventHandler<HTMLSpanElement>,onBeforeInputCapture : FormEventHandler<HTMLSpanElement>,onBeforeToggle : ToggleEventHandler<HTMLSpanElement>,onBlur : FocusEventHandler<HTMLSpanElement>,onBlurCapture : FocusEventHandler<HTMLSpanElement>,onCanPlay : ReactEventHandler<HTMLSpanElement>,onCanPlayCapture : ReactEventHandler<HTMLSpanElement>,onCanPlayThrough : ReactEventHandler<HTMLSpanElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLSpanElement>,onChange : FormEventHandler<HTMLSpanElement>,onChangeCapture : FormEventHandler<HTMLSpanElement>,onClick : MouseEventHandler<HTMLSpanElement>,onClickCapture : MouseEventHandler<HTMLSpanElement>,onCompositionEnd : CompositionEventHandler<HTMLSpanElement>,onCompositionEndCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionStart : CompositionEventHandler<HTMLSpanElement>,onCompositionStartCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdate : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLSpanElement>,onContextMenu : MouseEventHandler<HTMLSpanElement>,onContextMenuCapture : MouseEventHandler<HTMLSpanElement>,onCopy : ClipboardEventHandler<HTMLSpanElement>,onCopyCapture : ClipboardEventHandler<HTMLSpanElement>,onCut : ClipboardEventHandler<HTMLSpanElement>,onCutCapture : ClipboardEventHandler<HTMLSpanElement>,onDoubleClick : MouseEventHandler<HTMLSpanElement>,onDoubleClickCapture : MouseEventHandler<HTMLSpanElement>,onDrag : DragEventHandler<HTMLSpanElement>,onDragCapture : DragEventHandler<HTMLSpanElement>,onDragEnd : DragEventHandler<HTMLSpanElement>,onDragEndCapture : DragEventHandler<HTMLSpanElement>,onDragEnter : DragEventHandler<HTMLSpanElement>,onDragEnterCapture : DragEventHandler<HTMLSpanElement>,onDragExit : DragEventHandler<HTMLSpanElement>,onDragExitCapture : DragEventHandler<HTMLSpanElement>,onDragLeave : DragEventHandler<HTMLSpanElement>,onDragLeaveCapture : DragEventHandler<HTMLSpanElement>,onDragOver : DragEventHandler<HTMLSpanElement>,onDragOverCapture : DragEventHandler<HTMLSpanElement>,onDragStart : DragEventHandler<HTMLSpanElement>,onDragStartCapture : DragEventHandler<HTMLSpanElement>,onDrop : DragEventHandler<HTMLSpanElement>,onDropCapture : DragEventHandler<HTMLSpanElement>,onDurationChange : ReactEventHandler<HTMLSpanElement>,onDurationChangeCapture : ReactEventHandler<HTMLSpanElement>,onEmptied : ReactEventHandler<HTMLSpanElement>,onEmptiedCapture : ReactEventHandler<HTMLSpanElement>,onEncrypted : ReactEventHandler<HTMLSpanElement>,onEncryptedCapture : ReactEventHandler<HTMLSpanElement>,onEnded : ReactEventHandler<HTMLSpanElement>,onEndedCapture : ReactEventHandler<HTMLSpanElement>,onError : ReactEventHandler<HTMLSpanElement>,onErrorCapture : ReactEventHandler<HTMLSpanElement>,onFocus : FocusEventHandler<HTMLSpanElement>,onFocusCapture : FocusEventHandler<HTMLSpanElement>,onGotPointerCapture : PointerEventHandler<HTMLSpanElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onInput : FormEventHandler<HTMLSpanElement>,onInputCapture : FormEventHandler<HTMLSpanElement>,onInvalid : FormEventHandler<HTMLSpanElement>,onInvalidCapture : FormEventHandler<HTMLSpanElement>,onKeyDown : KeyboardEventHandler<HTMLSpanElement>,onKeyDownCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyPress : KeyboardEventHandler<HTMLSpanElement>,onKeyPressCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyUp : KeyboardEventHandler<HTMLSpanElement>,onKeyUpCapture : KeyboardEventHandler<HTMLSpanElement>,onLoad : ReactEventHandler<HTMLSpanElement>,onLoadCapture : ReactEventHandler<HTMLSpanElement>,onLoadedData : ReactEventHandler<HTMLSpanElement>,onLoadedDataCapture : ReactEventHandler<HTMLSpanElement>,onLoadedMetadata : ReactEventHandler<HTMLSpanElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLSpanElement>,onLoadStart : ReactEventHandler<HTMLSpanElement>,onLoadStartCapture : ReactEventHandler<HTMLSpanElement>,onLostPointerCapture : PointerEventHandler<HTMLSpanElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onMouseDown : MouseEventHandler<HTMLSpanElement>,onMouseDownCapture : MouseEventHandler<HTMLSpanElement>,onMouseEnter : MouseEventHandler<HTMLSpanElement>,onMouseLeave : MouseEventHandler<HTMLSpanElement>,onMouseMove : MouseEventHandler<HTMLSpanElement>,onMouseMoveCapture : MouseEventHandler<HTMLSpanElement>,onMouseOut : MouseEventHandler<HTMLSpanElement>,onMouseOutCapture : MouseEventHandler<HTMLSpanElement>,onMouseOver : MouseEventHandler<HTMLSpanElement>,onMouseOverCapture : MouseEventHandler<HTMLSpanElement>,onMouseUp : MouseEventHandler<HTMLSpanElement>,onMouseUpCapture : MouseEventHandler<HTMLSpanElement>,onPaste : ClipboardEventHandler<HTMLSpanElement>,onPasteCapture : ClipboardEventHandler<HTMLSpanElement>,onPause : ReactEventHandler<HTMLSpanElement>,onPauseCapture : ReactEventHandler<HTMLSpanElement>,onPlay : ReactEventHandler<HTMLSpanElement>,onPlayCapture : ReactEventHandler<HTMLSpanElement>,onPlaying : ReactEventHandler<HTMLSpanElement>,onPlayingCapture : ReactEventHandler<HTMLSpanElement>,onPointerCancel : PointerEventHandler<HTMLSpanElement>,onPointerCancelCapture : PointerEventHandler<HTMLSpanElement>,onPointerDown : PointerEventHandler<HTMLSpanElement>,onPointerDownCapture : PointerEventHandler<HTMLSpanElement>,onPointerEnter : PointerEventHandler<HTMLSpanElement>,onPointerLeave : PointerEventHandler<HTMLSpanElement>,onPointerMove : PointerEventHandler<HTMLSpanElement>,onPointerMoveCapture : PointerEventHandler<HTMLSpanElement>,onPointerOut : PointerEventHandler<HTMLSpanElement>,onPointerOutCapture : PointerEventHandler<HTMLSpanElement>,onPointerOver : PointerEventHandler<HTMLSpanElement>,onPointerOverCapture : PointerEventHandler<HTMLSpanElement>,onPointerUp : PointerEventHandler<HTMLSpanElement>,onPointerUpCapture : PointerEventHandler<HTMLSpanElement>,onProgress : ReactEventHandler<HTMLSpanElement>,onProgressCapture : ReactEventHandler<HTMLSpanElement>,onRateChange : ReactEventHandler<HTMLSpanElement>,onRateChangeCapture : ReactEventHandler<HTMLSpanElement>,onReset : FormEventHandler<HTMLSpanElement>,onResetCapture : FormEventHandler<HTMLSpanElement>,onResize : ReactEventHandler<HTMLSpanElement>,onResizeCapture : ReactEventHandler<HTMLSpanElement>,onScroll : UIEventHandler<HTMLSpanElement>,onScrollCapture : UIEventHandler<HTMLSpanElement>,onSeeked : ReactEventHandler<HTMLSpanElement>,onSeekedCapture : ReactEventHandler<HTMLSpanElement>,onSeeking : ReactEventHandler<HTMLSpanElement>,onSeekingCapture : ReactEventHandler<HTMLSpanElement>,onSelect : ReactEventHandler<HTMLSpanElement>,onSelectCapture : ReactEventHandler<HTMLSpanElement>,onStalled : ReactEventHandler<HTMLSpanElement>,onStalledCapture : ReactEventHandler<HTMLSpanElement>,onSubmit : FormEventHandler<HTMLSpanElement>,onSubmitCapture : FormEventHandler<HTMLSpanElement>,onSuspend : ReactEventHandler<HTMLSpanElement>,onSuspendCapture : ReactEventHandler<HTMLSpanElement>,onTimeUpdate : ReactEventHandler<HTMLSpanElement>,onTimeUpdateCapture : ReactEventHandler<HTMLSpanElement>,onToggle : ToggleEventHandler<HTMLSpanElement>,onTouchCancel : TouchEventHandler<HTMLSpanElement>,onTouchCancelCapture : TouchEventHandler<HTMLSpanElement>,onTouchEnd : TouchEventHandler<HTMLSpanElement>,onTouchEndCapture : TouchEventHandler<HTMLSpanElement>,onTouchMove : TouchEventHandler<HTMLSpanElement>,onTouchMoveCapture : TouchEventHandler<HTMLSpanElement>,onTouchStart : TouchEventHandler<HTMLSpanElement>,onTouchStartCapture : TouchEventHandler<HTMLSpanElement>,onTransitionCancel : TransitionEventHandler<HTMLSpanElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionEnd : TransitionEventHandler<HTMLSpanElement>,onTransitionEndCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionRun : TransitionEventHandler<HTMLSpanElement>,onTransitionRunCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionStart : TransitionEventHandler<HTMLSpanElement>,onTransitionStartCapture : TransitionEventHandler<HTMLSpanElement>,onVolumeChange : ReactEventHandler<HTMLSpanElement>,onVolumeChangeCapture : ReactEventHandler<HTMLSpanElement>,onWaiting : ReactEventHandler<HTMLSpanElement>,onWaitingCapture : ReactEventHandler<HTMLSpanElement>,onWheel : WheelEventHandler<HTMLSpanElement>,onWheelCapture : WheelEventHandler<HTMLSpanElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,queryOptions : Omit<UseQueryOptions<AccountBalanceInfo, Error, AccountBalanceInfo, readonly Array<unknown>>, "queryKey" | "queryFn">,radioGroup : string,rel : string,resource : string,results : number,rev : string,role : AriaRole,security : string,showBalanceInFiat : "USD" | "CAD" | "GBP" | "EUR" | "JPY" | "AUD" | "NZD",slot : string,spellCheck : Booleanish,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,tabIndex : number,title : string,tokenAddress : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",vocab : string}

`

##### about

`type about = string;

`

##### accessKey

`type accessKey = string;

`

##### aria-activedescendant

 Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application.

`type aria-activedescendant = string

`

##### aria-atomic

 Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute.

`type aria-atomic = Booleanish

`

##### aria-autocomplete

 Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be presented if they are made.

`type aria-autocomplete = "inline" | "none" | "list" | "both"

`

##### aria-braillelabel

 Defines a string value that labels the current element, which is intended to be converted into Braille.

 aria-label.

`type aria-braillelabel = string

`

##### aria-brailleroledescription

 Defines a human-readable, author-localized abbreviated description for the role of an element, which is intended to be converted into Braille.

 aria-roledescription.

`type aria-brailleroledescription = string

`

##### aria-busy

`type aria-busy = Booleanish

`

##### aria-checked

 Indicates the current "checked" state of checkboxes, radio buttons, and other widgets.

* aria-pressed
* aria-selected.

`type aria-checked = boolean | "false" | "true" | "mixed"

`

##### aria-colcount

 Defines the total number of columns in a table, grid, or treegrid.

 aria-colindex.

`type aria-colcount = number

`

##### aria-colindex

 Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid.

* aria-colcount
* aria-colspan.

`type aria-colindex = number

`

##### aria-colindextext

 Defines a human readable text alternative of aria-colindex.

 aria-rowindextext.

`type aria-colindextext = string

`

##### aria-colspan

 Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-colindex
* aria-rowspan.

`type aria-colspan = number

`

##### aria-controls

 Identifies the element (or elements) whose contents or presence are controlled by the current element.

 aria-owns.

`type aria-controls = string

`

##### aria-current

 Indicates the element that represents the current item within a container or set of related elements.

`type aria-current = boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date"

`

##### aria-describedby

 Identifies the element (or elements) that describes the object.

 aria-labelledby

`type aria-describedby = string

`

##### aria-description

 Defines a string value that describes or annotates the current element.

 related aria-describedby.

`type aria-description = string

`

##### aria-details

 Identifies the element that provides a detailed, extended description for the object.

 aria-describedby.

`type aria-details = string

`

##### aria-disabled

 Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable.

* aria-hidden
* aria-readonly.

`type aria-disabled = Booleanish

`

##### aria-dropeffect

Deprecated

 in ARIA 1.1

 Indicates what functions can be performed when a dragged object is released on the drop target.

`type aria-dropeffect = "link" | "popup" | "execute" | "none" | "copy" | "move"

`

##### aria-errormessage

 Identifies the element that provides an error message for the object.

* aria-invalid
* aria-describedby.

`type aria-errormessage = string

`

##### aria-expanded

 Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed.

`type aria-expanded = Booleanish

`

##### aria-flowto

 Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion, allows assistive technology to override the general default of reading in document source order.

`type aria-flowto = string

`

##### aria-grabbed

Deprecated

 in ARIA 1.1

 Indicates an element's "grabbed" state in a drag-and-drop operation.

`type aria-grabbed = Booleanish

`

##### aria-haspopup

 Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element.

`type aria-haspopup = boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree"

`

##### aria-hidden

 Indicates whether the element is exposed to an accessibility API.

 aria-disabled.

`type aria-hidden = Booleanish

`

##### aria-invalid

 Indicates the entered value does not conform to the format expected by the application.

 aria-errormessage.

`type aria-invalid = boolean | "false" | "true" | "grammar" | "spelling"

`

##### aria-keyshortcuts

 Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element.

`type aria-keyshortcuts = string

`

##### aria-label

 Defines a string value that labels the current element.

 aria-labelledby.

`type aria-label = string

`

##### aria-labelledby

 Identifies the element (or elements) that labels the current element.

 aria-describedby.

`type aria-labelledby = string

`

##### aria-level

 Defines the hierarchical level of an element within a structure.

`type aria-level = number

`

##### aria-live

 Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region.

`type aria-live = "off" | "polite" | "assertive"

`

##### aria-modal

 Indicates whether an element is modal when displayed.

`type aria-modal = Booleanish

`

##### aria-multiline

 Indicates whether a text box accepts multiple lines of input or only a single line.

`type aria-multiline = Booleanish

`

##### aria-multiselectable

 Indicates that the user may select more than one item from the current selectable descendants.

`type aria-multiselectable = Booleanish

`

##### aria-orientation

 Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous.

`type aria-orientation = "horizontal" | "vertical"

`

##### aria-owns

 Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship between DOM elements where the DOM hierarchy cannot be used to represent the relationship.

 aria-controls.

`type aria-owns = string

`

##### aria-placeholder

 Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value. A hint could be a sample value or a brief description of the expected format.

`type aria-placeholder = string

`

##### aria-posinset

 Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-setsize.

`type aria-posinset = number

`

##### aria-pressed

 Indicates the current "pressed" state of toggle buttons.

* aria-checked
* aria-selected.

`type aria-pressed = boolean | "false" | "true" | "mixed"

`

##### aria-readonly

 Indicates that the element is not editable, but is otherwise operable.

 aria-disabled.

`type aria-readonly = Booleanish

`

##### aria-relevant

 Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified.

 aria-atomic.

`type aria-relevant = "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals"

`

##### aria-required

 Indicates that user input is required on the element before a form may be submitted.

`type aria-required = Booleanish

`

##### aria-roledescription

 Defines a human-readable, author-localized description for the role of an element.

`type aria-roledescription = string

`

##### aria-rowcount

 Defines the total number of rows in a table, grid, or treegrid.

 aria-rowindex.

`type aria-rowcount = number

`

##### aria-rowindex

 Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid.

* aria-rowcount
* aria-rowspan.

`type aria-rowindex = number

`

##### aria-rowindextext

 Defines a human readable text alternative of aria-rowindex.

 aria-colindextext.

`type aria-rowindextext = string

`

##### aria-rowspan

 Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-rowindex
* aria-colspan.

`type aria-rowspan = number

`

##### aria-selected

 Indicates the current "selected" state of various widgets.

* aria-checked
* aria-pressed.

`type aria-selected = Booleanish

`

##### aria-setsize

 Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-posinset.

`type aria-setsize = number

`

##### aria-sort

 Indicates if items in a table or grid are sorted in ascending or descending order.

`type aria-sort = "none" | "ascending" | "descending" | "other"

`

##### aria-valuemax

 Defines the maximum allowed value for a range widget.

`type aria-valuemax = number

`

##### aria-valuemin

 Defines the minimum allowed value for a range widget.

`type aria-valuemin = number

`

##### aria-valuenow

 Defines the current value for a range widget.

 aria-valuetext.

`type aria-valuenow = number

`

##### aria-valuetext

 Defines the human readable text alternative of aria-valuenow for a range widget.

`type aria-valuetext = string

`

##### autoCapitalize

`type autoCapitalize =

| (string & {})

| "on"

| "off"

| "none"

| "sentences"

| "words"

| "characters";

`

##### autoCorrect

`type autoCorrect = string;

`

##### autoFocus

`type autoFocus = boolean;

`

##### autoSave

`type autoSave = string;

`

##### chain

 The network to fetch balance on If not passed, the component will use the current chain that the wallet is connected to (`useActiveWalletChain()` )

`type chain = Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`

##### className

`type className = string;

`

##### color

`type color = string;

`

##### content

`type content = string;

`

##### contentEditable

`type contentEditable = "inherit" | Booleanish | "plaintext-only";

`

##### contextMenu

`type contextMenu = string;

`

##### dangerouslySetInnerHTML

`type dangerouslySetInnerHTML = { __html: string | TrustedHTML };

`

##### datatype

`type datatype = string;

`

##### defaultChecked

`type defaultChecked = boolean;

`

##### defaultValue

`type defaultValue = string | number | (readonly Array<string>)

`

##### dir

`type dir = string;

`

##### draggable

`type draggable = Booleanish;

`

##### enterKeyHint

`type enterKeyHint =

| "search"

| "done"

| "next"

| "send"

| "enter"

| "go"

| "previous";

`

##### fallbackComponent

 This component will be shown if the balance fails to be retreived If not passed, the component will return `null` .

 You can/should pass a descriptive text/component to this prop, indicating that the balance was not fetched succesfully

`type fallbackComponent = Element;

`

### Example

`<AccountBalance

chain={nonExistentChain}

fallbackComponent={"Failed to load"}

/>;

`

##### formatFn

##### Signature

`function formatFn(props: [AccountBalanceInfo](https://portal.thirdweb.com/references/typescript/v5/AccountBalanceInfo)): string;

`

##### Parameters

##### props

###### Type

`let props: { balance: number; symbol: string };

`

##### Returns

##### Return Type

`let returnType: string;

`

##### hidden

`type hidden = boolean;

`

##### id

`type id = string;

`

##### inert

 https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert

`type inert = boolean;

`

##### inlist

`type inlist = any;

`

##### inputMode

 Hints at the type of data that might be entered by the user while editing the element or its contents

[ https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute](https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute)

`type inputMode =

| "search"

| "email"

| "url"

| "text"

| "none"

| "tel"

| "numeric"

| "decimal";

`

##### is

 Specify that a standard HTML element should behave like a defined custom built-in element

[ https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is](https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is)

`type is = string;

`

##### itemID

`type itemID = string;

`

##### itemProp

`type itemProp = string;

`

##### itemRef

`type itemRef = string;

`

##### itemScope

`type itemScope = boolean;

`

##### itemType

`type itemType = string;

`

##### lang

`type lang = string;

`

##### loadingComponent

 This component will be shown while the balance of the account is being fetched If not passed, the component will return `null` .

 You can/should pass a loading sign or spinner to this prop.

`type loadingComponent = Element;

`

### Example

`<AccountBalance chain={ethereum} loadingComponent={<Spinner />} />;

`

##### nonce

`type nonce = string;

`

##### onAbort

`type onAbort = ReactEventHandler<HTMLSpanElement>;

`

##### onAbortCapture

`type onAbortCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onAnimationEnd

`type onAnimationEnd = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationEndCapture

`type onAnimationEndCapture = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationIteration

`type onAnimationIteration = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationIterationCapture

`type onAnimationIterationCapture =

AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationStart

`type onAnimationStart = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationStartCapture

`type onAnimationStartCapture = AnimationEventHandler<HTMLSpanElement>;

`

##### onAuxClick

`type onAuxClick = MouseEventHandler<HTMLSpanElement>;

`

##### onAuxClickCapture

`type onAuxClickCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onBeforeInput

`type onBeforeInput = FormEventHandler<HTMLSpanElement>;

`

##### onBeforeInputCapture

`type onBeforeInputCapture = FormEventHandler<HTMLSpanElement>;

`

##### onBeforeToggle

`type onBeforeToggle = ToggleEventHandler<HTMLSpanElement>;

`

##### onBlur

`type onBlur = FocusEventHandler<HTMLSpanElement>;

`

##### onBlurCapture

`type onBlurCapture = FocusEventHandler<HTMLSpanElement>;

`

##### onCanPlay

`type onCanPlay = ReactEventHandler<HTMLSpanElement>;

`

##### onCanPlayCapture

`type onCanPlayCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onCanPlayThrough

`type onCanPlayThrough = ReactEventHandler<HTMLSpanElement>;

`

##### onCanPlayThroughCapture

`type onCanPlayThroughCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onChange

`type onChange = FormEventHandler<HTMLSpanElement>;

`

##### onChangeCapture

`type onChangeCapture = FormEventHandler<HTMLSpanElement>;

`

##### onClick

`type onClick = MouseEventHandler<HTMLSpanElement>;

`

##### onClickCapture

`type onClickCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onCompositionEnd

`type onCompositionEnd = CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionEndCapture

`type onCompositionEndCapture =

CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionStart

`type onCompositionStart = CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionStartCapture

`type onCompositionStartCapture =

CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionUpdate

`type onCompositionUpdate = CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionUpdateCapture

`type onCompositionUpdateCapture =

CompositionEventHandler<HTMLSpanElement>;

`

##### onContextMenu

`type onContextMenu = MouseEventHandler<HTMLSpanElement>;

`

##### onContextMenuCapture

`type onContextMenuCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onCopy

`type onCopy = ClipboardEventHandler<HTMLSpanElement>;

`

##### onCopyCapture

`type onCopyCapture = ClipboardEventHandler<HTMLSpanElement>;

`

##### onCut

`type onCut = ClipboardEventHandler<HTMLSpanElement>;

`

##### onCutCapture

`type onCutCapture = ClipboardEventHandler<HTMLSpanElement>;

`

##### onDoubleClick

`type onDoubleClick = MouseEventHandler<HTMLSpanElement>;

`

##### onDoubleClickCapture

`type onDoubleClickCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onDrag

`type onDrag = DragEventHandler<HTMLSpanElement>;

`

##### onDragCapture

`type onDragCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragEnd

`type onDragEnd = DragEventHandler<HTMLSpanElement>;

`

##### onDragEndCapture

`type onDragEndCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragEnter

`type onDragEnter = DragEventHandler<HTMLSpanElement>;

`

##### onDragEnterCapture

`type onDragEnterCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragExit

`type onDragExit = DragEventHandler<HTMLSpanElement>;

`

##### onDragExitCapture

`type onDragExitCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragLeave

`type onDragLeave = DragEventHandler<HTMLSpanElement>;

`

##### onDragLeaveCapture

`type onDragLeaveCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragOver

`type onDragOver = DragEventHandler<HTMLSpanElement>;

`

##### onDragOverCapture

`type onDragOverCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragStart

`type onDragStart = DragEventHandler<HTMLSpanElement>;

`

##### onDragStartCapture

`type onDragStartCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDrop

`type onDrop = DragEventHandler<HTMLSpanElement>;

`

##### onDropCapture

`type onDropCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDurationChange

`type onDurationChange = ReactEventHandler<HTMLSpanElement>;

`

##### onDurationChangeCapture

`type onDurationChangeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onEmptied

`type onEmptied = ReactEventHandler<HTMLSpanElement>;

`

##### onEmptiedCapture

`type onEmptiedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onEncrypted

`type onEncrypted = ReactEventHandler<HTMLSpanElement>;

`

##### onEncryptedCapture

`type onEncryptedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onEnded

`type onEnded = ReactEventHandler<HTMLSpanElement>;

`

##### onEndedCapture

`type onEndedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onError

`type onError = ReactEventHandler<HTMLSpanElement>;

`

##### onErrorCapture

`type onErrorCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onFocus

`type onFocus = FocusEventHandler<HTMLSpanElement>;

`

##### onFocusCapture

`type onFocusCapture = FocusEventHandler<HTMLSpanElement>;

`

##### onGotPointerCapture

`type onGotPointerCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onGotPointerCaptureCapture

`type onGotPointerCaptureCapture =

PointerEventHandler<HTMLSpanElement>;

`

##### onInput

`type onInput = FormEventHandler<HTMLSpanElement>;

`

##### onInputCapture

`type onInputCapture = FormEventHandler<HTMLSpanElement>;

`

##### onInvalid

`type onInvalid = FormEventHandler<HTMLSpanElement>;

`

##### onInvalidCapture

`type onInvalidCapture = FormEventHandler<HTMLSpanElement>;

`

##### onKeyDown

`type onKeyDown = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyDownCapture

`type onKeyDownCapture = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyPress

Deprecated

 Use `onKeyUp` or `onKeyDown` instead

`type onKeyPress = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyPressCapture

Deprecated

 Use `onKeyUpCapture` or `onKeyDownCapture` instead

`type onKeyPressCapture = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyUp

`type onKeyUp = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyUpCapture

`type onKeyUpCapture = KeyboardEventHandler<HTMLSpanElement>;

`

##### onLoad

`type onLoad = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadCapture

`type onLoadCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedData

`type onLoadedData = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedDataCapture

`type onLoadedDataCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedMetadata

`type onLoadedMetadata = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedMetadataCapture

`type onLoadedMetadataCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadStart

`type onLoadStart = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadStartCapture

`type onLoadStartCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLostPointerCapture

`type onLostPointerCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onLostPointerCaptureCapture

`type onLostPointerCaptureCapture =

PointerEventHandler<HTMLSpanElement>;

`

##### onMouseDown

`type onMouseDown = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseDownCapture

`type onMouseDownCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseEnter

`type onMouseEnter = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseLeave

`type onMouseLeave = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseMove

`type onMouseMove = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseMoveCapture

`type onMouseMoveCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOut

`type onMouseOut = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOutCapture

`type onMouseOutCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOver

`type onMouseOver = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOverCapture

`type onMouseOverCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseUp

`type onMouseUp = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseUpCapture

`type onMouseUpCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onPaste

`type onPaste = ClipboardEventHandler<HTMLSpanElement>;

`

##### onPasteCapture

`type onPasteCapture = ClipboardEventHandler<HTMLSpanElement>;

`

##### onPause

`type onPause = ReactEventHandler<HTMLSpanElement>;

`

##### onPauseCapture

`type onPauseCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onPlay

`type onPlay = ReactEventHandler<HTMLSpanElement>;

`

##### onPlayCapture

`type onPlayCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onPlaying

`type onPlaying = ReactEventHandler<HTMLSpanElement>;

`

##### onPlayingCapture

`type onPlayingCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onPointerCancel

`type onPointerCancel = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerCancelCapture

`type onPointerCancelCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerDown

`type onPointerDown = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerDownCapture

`type onPointerDownCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerEnter

`type onPointerEnter = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerLeave

`type onPointerLeave = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerMove

`type onPointerMove = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerMoveCapture

`type onPointerMoveCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOut

`type onPointerOut = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOutCapture

`type onPointerOutCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOver

`type onPointerOver = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOverCapture

`type onPointerOverCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerUp

`type onPointerUp = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerUpCapture

`type onPointerUpCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onProgress

`type onProgress = ReactEventHandler<HTMLSpanElement>;

`

##### onProgressCapture

`type onProgressCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onRateChange

`type onRateChange = ReactEventHandler<HTMLSpanElement>;

`

##### onRateChangeCapture

`type onRateChangeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onReset

`type onReset = FormEventHandler<HTMLSpanElement>;

`

##### onResetCapture

`type onResetCapture = FormEventHandler<HTMLSpanElement>;

`

##### onResize

`type onResize = ReactEventHandler<HTMLSpanElement>;

`

##### onResizeCapture

`type onResizeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onScroll

`type onScroll = UIEventHandler<HTMLSpanElement>;

`

##### onScrollCapture

`type onScrollCapture = UIEventHandler<HTMLSpanElement>;

`

##### onSeeked

`type onSeeked = ReactEventHandler<HTMLSpanElement>;

`

##### onSeekedCapture

`type onSeekedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onSeeking

`type onSeeking = ReactEventHandler<HTMLSpanElement>;

`

##### onSeekingCapture

`type onSeekingCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onSelect

`type onSelect = ReactEventHandler<HTMLSpanElement>;

`

##### onSelectCapture

`type onSelectCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onStalled

`type onStalled = ReactEventHandler<HTMLSpanElement>;

`

##### onStalledCapture

`type onStalledCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onSubmit

`type onSubmit = FormEventHandler<HTMLSpanElement>;

`

##### onSubmitCapture

`type onSubmitCapture = FormEventHandler<HTMLSpanElement>;

`

##### onSuspend

`type onSuspend = ReactEventHandler<HTMLSpanElement>;

`

##### onSuspendCapture

`type onSuspendCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onTimeUpdate

`type onTimeUpdate = ReactEventHandler<HTMLSpanElement>;

`

##### onTimeUpdateCapture

`type onTimeUpdateCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onToggle

`type onToggle = ToggleEventHandler<HTMLSpanElement>;

`

##### onTouchCancel

`type onTouchCancel = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchCancelCapture

`type onTouchCancelCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchEnd

`type onTouchEnd = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchEndCapture

`type onTouchEndCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchMove

`type onTouchMove = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchMoveCapture

`type onTouchMoveCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchStart

`type onTouchStart = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchStartCapture

`type onTouchStartCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTransitionCancel

`type onTransitionCancel = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionCancelCapture

`type onTransitionCancelCapture =

TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionEnd

`type onTransitionEnd = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionEndCapture

`type onTransitionEndCapture = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionRun

`type onTransitionRun = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionRunCapture

`type onTransitionRunCapture = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionStart

`type onTransitionStart = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionStartCapture

`type onTransitionStartCapture =

TransitionEventHandler<HTMLSpanElement>;

`

##### onVolumeChange

`type onVolumeChange = ReactEventHandler<HTMLSpanElement>;

`

##### onVolumeChangeCapture

`type onVolumeChangeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onWaiting

`type onWaiting = ReactEventHandler<HTMLSpanElement>;

`

##### onWaitingCapture

`type onWaitingCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onWheel

`type onWheel = WheelEventHandler<HTMLSpanElement>;

`

##### onWheelCapture

`type onWheelCapture = WheelEventHandler<HTMLSpanElement>;

`

##### popover

`type popover = "" | "auto" | "manual";

`

##### popoverTarget

`type popoverTarget = string;

`

##### popoverTargetAction

`type popoverTargetAction = "toggle" | "hide" | "show";

`

##### prefix

`type prefix = string;

`

##### property

`type property = string;

`

##### queryOptions

 Optional `useQuery` params

`type queryOptions = Omit<UseQueryOptions<[AccountBalanceInfo](https://portal.thirdweb.com/references/typescript/v5/AccountBalanceInfo), Error, [AccountBalanceInfo](https://portal.thirdweb.com/references/typescript/v5/AccountBalanceInfo), readonly Array<unknown>>, "queryKey" | "queryFn">

`

##### radioGroup

`type radioGroup = string;

`

##### rel

`type rel = string;

`

##### resource

`type resource = string;

`

##### results

`type results = number;

`

##### rev

`type rev = string;

`

##### role

`type role = AriaRole;

`

##### security

`type security = string;

`

##### showBalanceInFiat

 Show the token balance in a supported fiat currency (e.g "USD")

`type showBalanceInFiat =

| "USD"

| "CAD"

| "GBP"

| "EUR"

| "JPY"

| "AUD"

| "NZD";

`

##### slot

`type slot = string;

`

##### spellCheck

`type spellCheck = Booleanish;

`

##### style

`type style = CSSProperties;

`

##### suppressContentEditableWarning

`type suppressContentEditableWarning = boolean;

`

##### suppressHydrationWarning

`type suppressHydrationWarning = boolean;

`

##### tabIndex

`type tabIndex = number;

`

##### title

`type title = string;

`

##### tokenAddress

 By default this component will fetch the balance for the native token on a given chain If you want to fetch balance for an ERC20 token, use the `tokenAddress` props

`type tokenAddress = string;

`

##### translate

`type translate = "yes" | "no";

`

##### typeof

`type typeof = string

`

##### unselectable

`type unselectable = "on" | "off";

`

##### vocab

`type vocab = string;

`
## AccountNameProps

 Props for the AccountName component

`interface AccountNameProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, "children">, Omit<[ResolveNameOptions](https://portal.thirdweb.com/references/typescript/v5/ResolveNameOptions), "client" | "address"> {about : string,accessKey : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,className : string,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",fallbackComponent : Element,formatFn : (str: string) => string,hidden : boolean,id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,loadingComponent : Element,nonce : string,onAbort : ReactEventHandler<HTMLSpanElement>,onAbortCapture : ReactEventHandler<HTMLSpanElement>,onAnimationEnd : AnimationEventHandler<HTMLSpanElement>,onAnimationEndCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationIteration : AnimationEventHandler<HTMLSpanElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationStart : AnimationEventHandler<HTMLSpanElement>,onAnimationStartCapture : AnimationEventHandler<HTMLSpanElement>,onAuxClick : MouseEventHandler<HTMLSpanElement>,onAuxClickCapture : MouseEventHandler<HTMLSpanElement>,onBeforeInput : FormEventHandler<HTMLSpanElement>,onBeforeInputCapture : FormEventHandler<HTMLSpanElement>,onBeforeToggle : ToggleEventHandler<HTMLSpanElement>,onBlur : FocusEventHandler<HTMLSpanElement>,onBlurCapture : FocusEventHandler<HTMLSpanElement>,onCanPlay : ReactEventHandler<HTMLSpanElement>,onCanPlayCapture : ReactEventHandler<HTMLSpanElement>,onCanPlayThrough : ReactEventHandler<HTMLSpanElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLSpanElement>,onChange : FormEventHandler<HTMLSpanElement>,onChangeCapture : FormEventHandler<HTMLSpanElement>,onClick : MouseEventHandler<HTMLSpanElement>,onClickCapture : MouseEventHandler<HTMLSpanElement>,onCompositionEnd : CompositionEventHandler<HTMLSpanElement>,onCompositionEndCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionStart : CompositionEventHandler<HTMLSpanElement>,onCompositionStartCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdate : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLSpanElement>,onContextMenu : MouseEventHandler<HTMLSpanElement>,onContextMenuCapture : MouseEventHandler<HTMLSpanElement>,onCopy : ClipboardEventHandler<HTMLSpanElement>,onCopyCapture : ClipboardEventHandler<HTMLSpanElement>,onCut : ClipboardEventHandler<HTMLSpanElement>,onCutCapture : ClipboardEventHandler<HTMLSpanElement>,onDoubleClick : MouseEventHandler<HTMLSpanElement>,onDoubleClickCapture : MouseEventHandler<HTMLSpanElement>,onDrag : DragEventHandler<HTMLSpanElement>,onDragCapture : DragEventHandler<HTMLSpanElement>,onDragEnd : DragEventHandler<HTMLSpanElement>,onDragEndCapture : DragEventHandler<HTMLSpanElement>,onDragEnter : DragEventHandler<HTMLSpanElement>,onDragEnterCapture : DragEventHandler<HTMLSpanElement>,onDragExit : DragEventHandler<HTMLSpanElement>,onDragExitCapture : DragEventHandler<HTMLSpanElement>,onDragLeave : DragEventHandler<HTMLSpanElement>,onDragLeaveCapture : DragEventHandler<HTMLSpanElement>,onDragOver : DragEventHandler<HTMLSpanElement>,onDragOverCapture : DragEventHandler<HTMLSpanElement>,onDragStart : DragEventHandler<HTMLSpanElement>,onDragStartCapture : DragEventHandler<HTMLSpanElement>,onDrop : DragEventHandler<HTMLSpanElement>,onDropCapture : DragEventHandler<HTMLSpanElement>,onDurationChange : ReactEventHandler<HTMLSpanElement>,onDurationChangeCapture : ReactEventHandler<HTMLSpanElement>,onEmptied : ReactEventHandler<HTMLSpanElement>,onEmptiedCapture : ReactEventHandler<HTMLSpanElement>,onEncrypted : ReactEventHandler<HTMLSpanElement>,onEncryptedCapture : ReactEventHandler<HTMLSpanElement>,onEnded : ReactEventHandler<HTMLSpanElement>,onEndedCapture : ReactEventHandler<HTMLSpanElement>,onError : ReactEventHandler<HTMLSpanElement>,onErrorCapture : ReactEventHandler<HTMLSpanElement>,onFocus : FocusEventHandler<HTMLSpanElement>,onFocusCapture : FocusEventHandler<HTMLSpanElement>,onGotPointerCapture : PointerEventHandler<HTMLSpanElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onInput : FormEventHandler<HTMLSpanElement>,onInputCapture : FormEventHandler<HTMLSpanElement>,onInvalid : FormEventHandler<HTMLSpanElement>,onInvalidCapture : FormEventHandler<HTMLSpanElement>,onKeyDown : KeyboardEventHandler<HTMLSpanElement>,onKeyDownCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyPress : KeyboardEventHandler<HTMLSpanElement>,onKeyPressCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyUp : KeyboardEventHandler<HTMLSpanElement>,onKeyUpCapture : KeyboardEventHandler<HTMLSpanElement>,onLoad : ReactEventHandler<HTMLSpanElement>,onLoadCapture : ReactEventHandler<HTMLSpanElement>,onLoadedData : ReactEventHandler<HTMLSpanElement>,onLoadedDataCapture : ReactEventHandler<HTMLSpanElement>,onLoadedMetadata : ReactEventHandler<HTMLSpanElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLSpanElement>,onLoadStart : ReactEventHandler<HTMLSpanElement>,onLoadStartCapture : ReactEventHandler<HTMLSpanElement>,onLostPointerCapture : PointerEventHandler<HTMLSpanElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onMouseDown : MouseEventHandler<HTMLSpanElement>,onMouseDownCapture : MouseEventHandler<HTMLSpanElement>,onMouseEnter : MouseEventHandler<HTMLSpanElement>,onMouseLeave : MouseEventHandler<HTMLSpanElement>,onMouseMove : MouseEventHandler<HTMLSpanElement>,onMouseMoveCapture : MouseEventHandler<HTMLSpanElement>,onMouseOut : MouseEventHandler<HTMLSpanElement>,onMouseOutCapture : MouseEventHandler<HTMLSpanElement>,onMouseOver : MouseEventHandler<HTMLSpanElement>,onMouseOverCapture : MouseEventHandler<HTMLSpanElement>,onMouseUp : MouseEventHandler<HTMLSpanElement>,onMouseUpCapture : MouseEventHandler<HTMLSpanElement>,onPaste : ClipboardEventHandler<HTMLSpanElement>,onPasteCapture : ClipboardEventHandler<HTMLSpanElement>,onPause : ReactEventHandler<HTMLSpanElement>,onPauseCapture : ReactEventHandler<HTMLSpanElement>,onPlay : ReactEventHandler<HTMLSpanElement>,onPlayCapture : ReactEventHandler<HTMLSpanElement>,onPlaying : ReactEventHandler<HTMLSpanElement>,onPlayingCapture : ReactEventHandler<HTMLSpanElement>,onPointerCancel : PointerEventHandler<HTMLSpanElement>,onPointerCancelCapture : PointerEventHandler<HTMLSpanElement>,onPointerDown : PointerEventHandler<HTMLSpanElement>,onPointerDownCapture : PointerEventHandler<HTMLSpanElement>,onPointerEnter : PointerEventHandler<HTMLSpanElement>,onPointerLeave : PointerEventHandler<HTMLSpanElement>,onPointerMove : PointerEventHandler<HTMLSpanElement>,onPointerMoveCapture : PointerEventHandler<HTMLSpanElement>,onPointerOut : PointerEventHandler<HTMLSpanElement>,onPointerOutCapture : PointerEventHandler<HTMLSpanElement>,onPointerOver : PointerEventHandler<HTMLSpanElement>,onPointerOverCapture : PointerEventHandler<HTMLSpanElement>,onPointerUp : PointerEventHandler<HTMLSpanElement>,onPointerUpCapture : PointerEventHandler<HTMLSpanElement>,onProgress : ReactEventHandler<HTMLSpanElement>,onProgressCapture : ReactEventHandler<HTMLSpanElement>,onRateChange : ReactEventHandler<HTMLSpanElement>,onRateChangeCapture : ReactEventHandler<HTMLSpanElement>,onReset : FormEventHandler<HTMLSpanElement>,onResetCapture : FormEventHandler<HTMLSpanElement>,onResize : ReactEventHandler<HTMLSpanElement>,onResizeCapture : ReactEventHandler<HTMLSpanElement>,onScroll : UIEventHandler<HTMLSpanElement>,onScrollCapture : UIEventHandler<HTMLSpanElement>,onSeeked : ReactEventHandler<HTMLSpanElement>,onSeekedCapture : ReactEventHandler<HTMLSpanElement>,onSeeking : ReactEventHandler<HTMLSpanElement>,onSeekingCapture : ReactEventHandler<HTMLSpanElement>,onSelect : ReactEventHandler<HTMLSpanElement>,onSelectCapture : ReactEventHandler<HTMLSpanElement>,onStalled : ReactEventHandler<HTMLSpanElement>,onStalledCapture : ReactEventHandler<HTMLSpanElement>,onSubmit : FormEventHandler<HTMLSpanElement>,onSubmitCapture : FormEventHandler<HTMLSpanElement>,onSuspend : ReactEventHandler<HTMLSpanElement>,onSuspendCapture : ReactEventHandler<HTMLSpanElement>,onTimeUpdate : ReactEventHandler<HTMLSpanElement>,onTimeUpdateCapture : ReactEventHandler<HTMLSpanElement>,onToggle : ToggleEventHandler<HTMLSpanElement>,onTouchCancel : TouchEventHandler<HTMLSpanElement>,onTouchCancelCapture : TouchEventHandler<HTMLSpanElement>,onTouchEnd : TouchEventHandler<HTMLSpanElement>,onTouchEndCapture : TouchEventHandler<HTMLSpanElement>,onTouchMove : TouchEventHandler<HTMLSpanElement>,onTouchMoveCapture : TouchEventHandler<HTMLSpanElement>,onTouchStart : TouchEventHandler<HTMLSpanElement>,onTouchStartCapture : TouchEventHandler<HTMLSpanElement>,onTransitionCancel : TransitionEventHandler<HTMLSpanElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionEnd : TransitionEventHandler<HTMLSpanElement>,onTransitionEndCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionRun : TransitionEventHandler<HTMLSpanElement>,onTransitionRunCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionStart : TransitionEventHandler<HTMLSpanElement>,onTransitionStartCapture : TransitionEventHandler<HTMLSpanElement>,onVolumeChange : ReactEventHandler<HTMLSpanElement>,onVolumeChangeCapture : ReactEventHandler<HTMLSpanElement>,onWaiting : ReactEventHandler<HTMLSpanElement>,onWaitingCapture : ReactEventHandler<HTMLSpanElement>,onWheel : WheelEventHandler<HTMLSpanElement>,onWheelCapture : WheelEventHandler<HTMLSpanElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,queryOptions : Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">,radioGroup : string,rel : string,resolverAddress : string,resolverChain : Readonly<(ChainOptions) & ({ rpc: string })>,resource : string,results : number,rev : string,role : AriaRole,security : string,slot : string,socialType : "farcaster" | "ens" | "lens",spellCheck : Booleanish,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,tabIndex : number,title : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",vocab : string}

`

##### about

`type about = string;

`

##### accessKey

`type accessKey = string;

`

##### aria-activedescendant

 Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application.

`type aria-activedescendant = string

`

##### aria-atomic

 Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute.

`type aria-atomic = Booleanish

`

##### aria-autocomplete

 Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be presented if they are made.

`type aria-autocomplete = "inline" | "none" | "list" | "both"

`

##### aria-braillelabel

 Defines a string value that labels the current element, which is intended to be converted into Braille.

 aria-label.

`type aria-braillelabel = string

`

##### aria-brailleroledescription

 Defines a human-readable, author-localized abbreviated description for the role of an element, which is intended to be converted into Braille.

 aria-roledescription.

`type aria-brailleroledescription = string

`

##### aria-busy

`type aria-busy = Booleanish

`

##### aria-checked

 Indicates the current "checked" state of checkboxes, radio buttons, and other widgets.

* aria-pressed
* aria-selected.

`type aria-checked = boolean | "false" | "true" | "mixed"

`

##### aria-colcount

 Defines the total number of columns in a table, grid, or treegrid.

 aria-colindex.

`type aria-colcount = number

`

##### aria-colindex

 Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid.

* aria-colcount
* aria-colspan.

`type aria-colindex = number

`

##### aria-colindextext

 Defines a human readable text alternative of aria-colindex.

 aria-rowindextext.

`type aria-colindextext = string

`

##### aria-colspan

 Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-colindex
* aria-rowspan.

`type aria-colspan = number

`

##### aria-controls

 Identifies the element (or elements) whose contents or presence are controlled by the current element.

 aria-owns.

`type aria-controls = string

`

##### aria-current

 Indicates the element that represents the current item within a container or set of related elements.

`type aria-current = boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date"

`

##### aria-describedby

 Identifies the element (or elements) that describes the object.

 aria-labelledby

`type aria-describedby = string

`

##### aria-description

 Defines a string value that describes or annotates the current element.

 related aria-describedby.

`type aria-description = string

`

##### aria-details

 Identifies the element that provides a detailed, extended description for the object.

 aria-describedby.

`type aria-details = string

`

##### aria-disabled

 Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable.

* aria-hidden
* aria-readonly.

`type aria-disabled = Booleanish

`

##### aria-dropeffect

Deprecated

 in ARIA 1.1

 Indicates what functions can be performed when a dragged object is released on the drop target.

`type aria-dropeffect = "link" | "popup" | "execute" | "none" | "copy" | "move"

`

##### aria-errormessage

 Identifies the element that provides an error message for the object.

* aria-invalid
* aria-describedby.

`type aria-errormessage = string

`

##### aria-expanded

 Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed.

`type aria-expanded = Booleanish

`

##### aria-flowto

 Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion, allows assistive technology to override the general default of reading in document source order.

`type aria-flowto = string

`

##### aria-grabbed

Deprecated

 in ARIA 1.1

 Indicates an element's "grabbed" state in a drag-and-drop operation.

`type aria-grabbed = Booleanish

`

##### aria-haspopup

 Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element.

`type aria-haspopup = boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree"

`

##### aria-hidden

 Indicates whether the element is exposed to an accessibility API.

 aria-disabled.

`type aria-hidden = Booleanish

`

##### aria-invalid

 Indicates the entered value does not conform to the format expected by the application.

 aria-errormessage.

`type aria-invalid = boolean | "false" | "true" | "grammar" | "spelling"

`

##### aria-keyshortcuts

 Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element.

`type aria-keyshortcuts = string

`

##### aria-label

 Defines a string value that labels the current element.

 aria-labelledby.

`type aria-label = string

`

##### aria-labelledby

 Identifies the element (or elements) that labels the current element.

 aria-describedby.

`type aria-labelledby = string

`

##### aria-level

 Defines the hierarchical level of an element within a structure.

`type aria-level = number

`

##### aria-live

 Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region.

`type aria-live = "off" | "polite" | "assertive"

`

##### aria-modal

 Indicates whether an element is modal when displayed.

`type aria-modal = Booleanish

`

##### aria-multiline

 Indicates whether a text box accepts multiple lines of input or only a single line.

`type aria-multiline = Booleanish

`

##### aria-multiselectable

 Indicates that the user may select more than one item from the current selectable descendants.

`type aria-multiselectable = Booleanish

`

##### aria-orientation

 Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous.

`type aria-orientation = "horizontal" | "vertical"

`

##### aria-owns

 Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship between DOM elements where the DOM hierarchy cannot be used to represent the relationship.

 aria-controls.

`type aria-owns = string

`

##### aria-placeholder

 Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value. A hint could be a sample value or a brief description of the expected format.

`type aria-placeholder = string

`

##### aria-posinset

 Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-setsize.

`type aria-posinset = number

`

##### aria-pressed

 Indicates the current "pressed" state of toggle buttons.

* aria-checked
* aria-selected.

`type aria-pressed = boolean | "false" | "true" | "mixed"

`

##### aria-readonly

 Indicates that the element is not editable, but is otherwise operable.

 aria-disabled.

`type aria-readonly = Booleanish

`

##### aria-relevant

 Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified.

 aria-atomic.

`type aria-relevant = "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals"

`

##### aria-required

 Indicates that user input is required on the element before a form may be submitted.

`type aria-required = Booleanish

`

##### aria-roledescription

 Defines a human-readable, author-localized description for the role of an element.

`type aria-roledescription = string

`

##### aria-rowcount

 Defines the total number of rows in a table, grid, or treegrid.

 aria-rowindex.

`type aria-rowcount = number

`

##### aria-rowindex

 Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid.

* aria-rowcount
* aria-rowspan.

`type aria-rowindex = number

`

##### aria-rowindextext

 Defines a human readable text alternative of aria-rowindex.

 aria-colindextext.

`type aria-rowindextext = string

`

##### aria-rowspan

 Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-rowindex
* aria-colspan.

`type aria-rowspan = number

`

##### aria-selected

 Indicates the current "selected" state of various widgets.

* aria-checked
* aria-pressed.

`type aria-selected = Booleanish

`

##### aria-setsize

 Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-posinset.

`type aria-setsize = number

`

##### aria-sort

 Indicates if items in a table or grid are sorted in ascending or descending order.

`type aria-sort = "none" | "ascending" | "descending" | "other"

`

##### aria-valuemax

 Defines the maximum allowed value for a range widget.

`type aria-valuemax = number

`

##### aria-valuemin

 Defines the minimum allowed value for a range widget.

`type aria-valuemin = number

`

##### aria-valuenow

 Defines the current value for a range widget.

 aria-valuetext.

`type aria-valuenow = number

`

##### aria-valuetext

 Defines the human readable text alternative of aria-valuenow for a range widget.

`type aria-valuetext = string

`

##### autoCapitalize

`type autoCapitalize =

| (string & {})

| "on"

| "off"

| "none"

| "sentences"

| "words"

| "characters";

`

##### autoCorrect

`type autoCorrect = string;

`

##### autoFocus

`type autoFocus = boolean;

`

##### autoSave

`type autoSave = string;

`

##### className

`type className = string;

`

##### color

`type color = string;

`

##### content

`type content = string;

`

##### contentEditable

`type contentEditable = "inherit" | Booleanish | "plaintext-only";

`

##### contextMenu

`type contextMenu = string;

`

##### dangerouslySetInnerHTML

`type dangerouslySetInnerHTML = { __html: string | TrustedHTML };

`

##### datatype

`type datatype = string;

`

##### defaultChecked

`type defaultChecked = boolean;

`

##### defaultValue

`type defaultValue = string | number | (readonly Array<string>)

`

##### dir

`type dir = string;

`

##### draggable

`type draggable = Booleanish;

`

##### enterKeyHint

`type enterKeyHint =

| "search"

| "done"

| "next"

| "send"

| "enter"

| "go"

| "previous";

`

##### fallbackComponent

 This component will be shown if the request for fetching the name is done but could not retreive any result. You can pass the wallet address as the fallback option if that's the case.

 If not passed, the component will return `null`

`type fallbackComponent = Element;

`

### Example

`<AccountName fallbackComponent={"0x1234....3f3f"} />;

`

##### formatFn

##### Signature

`function formatFn(str: string): string;

`

##### Parameters

##### str

###### Type

`let str: string;

`

##### Returns

##### Return Type

`let returnType: string;

`

##### hidden

`type hidden = boolean;

`

##### id

`type id = string;

`

##### inert

 https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert

`type inert = boolean;

`

##### inlist

`type inlist = any;

`

##### inputMode

 Hints at the type of data that might be entered by the user while editing the element or its contents

[ https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute](https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute)

`type inputMode =

| "search"

| "email"

| "url"

| "text"

| "none"

| "tel"

| "numeric"

| "decimal";

`

##### is

 Specify that a standard HTML element should behave like a defined custom built-in element

[ https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is](https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is)

`type is = string;

`

##### itemID

`type itemID = string;

`

##### itemProp

`type itemProp = string;

`

##### itemRef

`type itemRef = string;

`

##### itemScope

`type itemScope = boolean;

`

##### itemType

`type itemType = string;

`

##### lang

`type lang = string;

`

##### loadingComponent

 This component will be shown while the name of the account is being fetched If not passed, the component will return `null` .

 You can pass a loading sign or spinner to this prop.

`type loadingComponent = Element;

`

### Example

`<AccountName loadingComponent={<Spinner />} />;

`

##### nonce

`type nonce = string;

`

##### onAbort

`type onAbort = ReactEventHandler<HTMLSpanElement>;

`

##### onAbortCapture

`type onAbortCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onAnimationEnd

`type onAnimationEnd = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationEndCapture

`type onAnimationEndCapture = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationIteration

`type onAnimationIteration = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationIterationCapture

`type onAnimationIterationCapture =

AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationStart

`type onAnimationStart = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationStartCapture

`type onAnimationStartCapture = AnimationEventHandler<HTMLSpanElement>;

`

##### onAuxClick

`type onAuxClick = MouseEventHandler<HTMLSpanElement>;

`

##### onAuxClickCapture

`type onAuxClickCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onBeforeInput

`type onBeforeInput = FormEventHandler<HTMLSpanElement>;

`

##### onBeforeInputCapture

`type onBeforeInputCapture = FormEventHandler<HTMLSpanElement>;

`

##### onBeforeToggle

`type onBeforeToggle = ToggleEventHandler<HTMLSpanElement>;

`

##### onBlur

`type onBlur = FocusEventHandler<HTMLSpanElement>;

`

##### onBlurCapture

`type onBlurCapture = FocusEventHandler<HTMLSpanElement>;

`

##### onCanPlay

`type onCanPlay = ReactEventHandler<HTMLSpanElement>;

`

##### onCanPlayCapture

`type onCanPlayCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onCanPlayThrough

`type onCanPlayThrough = ReactEventHandler<HTMLSpanElement>;

`

##### onCanPlayThroughCapture

`type onCanPlayThroughCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onChange

`type onChange = FormEventHandler<HTMLSpanElement>;

`

##### onChangeCapture

`type onChangeCapture = FormEventHandler<HTMLSpanElement>;

`

##### onClick

`type onClick = MouseEventHandler<HTMLSpanElement>;

`

##### onClickCapture

`type onClickCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onCompositionEnd

`type onCompositionEnd = CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionEndCapture

`type onCompositionEndCapture =

CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionStart

`type onCompositionStart = CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionStartCapture

`type onCompositionStartCapture =

CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionUpdate

`type onCompositionUpdate = CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionUpdateCapture

`type onCompositionUpdateCapture =

CompositionEventHandler<HTMLSpanElement>;

`

##### onContextMenu

`type onContextMenu = MouseEventHandler<HTMLSpanElement>;

`

##### onContextMenuCapture

`type onContextMenuCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onCopy

`type onCopy = ClipboardEventHandler<HTMLSpanElement>;

`

##### onCopyCapture

`type onCopyCapture = ClipboardEventHandler<HTMLSpanElement>;

`

##### onCut

`type onCut = ClipboardEventHandler<HTMLSpanElement>;

`

##### onCutCapture

`type onCutCapture = ClipboardEventHandler<HTMLSpanElement>;

`

##### onDoubleClick

`type onDoubleClick = MouseEventHandler<HTMLSpanElement>;

`

##### onDoubleClickCapture

`type onDoubleClickCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onDrag

`type onDrag = DragEventHandler<HTMLSpanElement>;

`

##### onDragCapture

`type onDragCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragEnd

`type onDragEnd = DragEventHandler<HTMLSpanElement>;

`

##### onDragEndCapture

`type onDragEndCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragEnter

`type onDragEnter = DragEventHandler<HTMLSpanElement>;

`

##### onDragEnterCapture

`type onDragEnterCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragExit

`type onDragExit = DragEventHandler<HTMLSpanElement>;

`

##### onDragExitCapture

`type onDragExitCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragLeave

`type onDragLeave = DragEventHandler<HTMLSpanElement>;

`

##### onDragLeaveCapture

`type onDragLeaveCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragOver

`type onDragOver = DragEventHandler<HTMLSpanElement>;

`

##### onDragOverCapture

`type onDragOverCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragStart

`type onDragStart = DragEventHandler<HTMLSpanElement>;

`

##### onDragStartCapture

`type onDragStartCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDrop

`type onDrop = DragEventHandler<HTMLSpanElement>;

`

##### onDropCapture

`type onDropCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDurationChange

`type onDurationChange = ReactEventHandler<HTMLSpanElement>;

`

##### onDurationChangeCapture

`type onDurationChangeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onEmptied

`type onEmptied = ReactEventHandler<HTMLSpanElement>;

`

##### onEmptiedCapture

`type onEmptiedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onEncrypted

`type onEncrypted = ReactEventHandler<HTMLSpanElement>;

`

##### onEncryptedCapture

`type onEncryptedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onEnded

`type onEnded = ReactEventHandler<HTMLSpanElement>;

`

##### onEndedCapture

`type onEndedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onError

`type onError = ReactEventHandler<HTMLSpanElement>;

`

##### onErrorCapture

`type onErrorCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onFocus

`type onFocus = FocusEventHandler<HTMLSpanElement>;

`

##### onFocusCapture

`type onFocusCapture = FocusEventHandler<HTMLSpanElement>;

`

##### onGotPointerCapture

`type onGotPointerCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onGotPointerCaptureCapture

`type onGotPointerCaptureCapture =

PointerEventHandler<HTMLSpanElement>;

`

##### onInput

`type onInput = FormEventHandler<HTMLSpanElement>;

`

##### onInputCapture

`type onInputCapture = FormEventHandler<HTMLSpanElement>;

`

##### onInvalid

`type onInvalid = FormEventHandler<HTMLSpanElement>;

`

##### onInvalidCapture

`type onInvalidCapture = FormEventHandler<HTMLSpanElement>;

`

##### onKeyDown

`type onKeyDown = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyDownCapture

`type onKeyDownCapture = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyPress

Deprecated

 Use `onKeyUp` or `onKeyDown` instead

`type onKeyPress = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyPressCapture

Deprecated

 Use `onKeyUpCapture` or `onKeyDownCapture` instead

`type onKeyPressCapture = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyUp

`type onKeyUp = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyUpCapture

`type onKeyUpCapture = KeyboardEventHandler<HTMLSpanElement>;

`

##### onLoad

`type onLoad = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadCapture

`type onLoadCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedData

`type onLoadedData = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedDataCapture

`type onLoadedDataCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedMetadata

`type onLoadedMetadata = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedMetadataCapture

`type onLoadedMetadataCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadStart

`type onLoadStart = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadStartCapture

`type onLoadStartCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLostPointerCapture

`type onLostPointerCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onLostPointerCaptureCapture

`type onLostPointerCaptureCapture =

PointerEventHandler<HTMLSpanElement>;

`

##### onMouseDown

`type onMouseDown = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseDownCapture

`type onMouseDownCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseEnter

`type onMouseEnter = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseLeave

`type onMouseLeave = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseMove

`type onMouseMove = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseMoveCapture

`type onMouseMoveCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOut

`type onMouseOut = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOutCapture

`type onMouseOutCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOver

`type onMouseOver = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOverCapture

`type onMouseOverCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseUp

`type onMouseUp = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseUpCapture

`type onMouseUpCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onPaste

`type onPaste = ClipboardEventHandler<HTMLSpanElement>;

`

##### onPasteCapture

`type onPasteCapture = ClipboardEventHandler<HTMLSpanElement>;

`

##### onPause

`type onPause = ReactEventHandler<HTMLSpanElement>;

`

##### onPauseCapture

`type onPauseCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onPlay

`type onPlay = ReactEventHandler<HTMLSpanElement>;

`

##### onPlayCapture

`type onPlayCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onPlaying

`type onPlaying = ReactEventHandler<HTMLSpanElement>;

`

##### onPlayingCapture

`type onPlayingCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onPointerCancel

`type onPointerCancel = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerCancelCapture

`type onPointerCancelCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerDown

`type onPointerDown = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerDownCapture

`type onPointerDownCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerEnter

`type onPointerEnter = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerLeave

`type onPointerLeave = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerMove

`type onPointerMove = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerMoveCapture

`type onPointerMoveCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOut

`type onPointerOut = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOutCapture

`type onPointerOutCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOver

`type onPointerOver = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOverCapture

`type onPointerOverCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerUp

`type onPointerUp = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerUpCapture

`type onPointerUpCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onProgress

`type onProgress = ReactEventHandler<HTMLSpanElement>;

`

##### onProgressCapture

`type onProgressCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onRateChange

`type onRateChange = ReactEventHandler<HTMLSpanElement>;

`

##### onRateChangeCapture

`type onRateChangeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onReset

`type onReset = FormEventHandler<HTMLSpanElement>;

`

##### onResetCapture

`type onResetCapture = FormEventHandler<HTMLSpanElement>;

`

##### onResize

`type onResize = ReactEventHandler<HTMLSpanElement>;

`

##### onResizeCapture

`type onResizeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onScroll

`type onScroll = UIEventHandler<HTMLSpanElement>;

`

##### onScrollCapture

`type onScrollCapture = UIEventHandler<HTMLSpanElement>;

`

##### onSeeked

`type onSeeked = ReactEventHandler<HTMLSpanElement>;

`

##### onSeekedCapture

`type onSeekedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onSeeking

`type onSeeking = ReactEventHandler<HTMLSpanElement>;

`

##### onSeekingCapture

`type onSeekingCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onSelect

`type onSelect = ReactEventHandler<HTMLSpanElement>;

`

##### onSelectCapture

`type onSelectCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onStalled

`type onStalled = ReactEventHandler<HTMLSpanElement>;

`

##### onStalledCapture

`type onStalledCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onSubmit

`type onSubmit = FormEventHandler<HTMLSpanElement>;

`

##### onSubmitCapture

`type onSubmitCapture = FormEventHandler<HTMLSpanElement>;

`

##### onSuspend

`type onSuspend = ReactEventHandler<HTMLSpanElement>;

`

##### onSuspendCapture

`type onSuspendCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onTimeUpdate

`type onTimeUpdate = ReactEventHandler<HTMLSpanElement>;

`

##### onTimeUpdateCapture

`type onTimeUpdateCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onToggle

`type onToggle = ToggleEventHandler<HTMLSpanElement>;

`

##### onTouchCancel

`type onTouchCancel = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchCancelCapture

`type onTouchCancelCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchEnd

`type onTouchEnd = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchEndCapture

`type onTouchEndCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchMove

`type onTouchMove = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchMoveCapture

`type onTouchMoveCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchStart

`type onTouchStart = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchStartCapture

`type onTouchStartCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTransitionCancel

`type onTransitionCancel = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionCancelCapture

`type onTransitionCancelCapture =

TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionEnd

`type onTransitionEnd = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionEndCapture

`type onTransitionEndCapture = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionRun

`type onTransitionRun = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionRunCapture

`type onTransitionRunCapture = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionStart

`type onTransitionStart = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionStartCapture

`type onTransitionStartCapture =

TransitionEventHandler<HTMLSpanElement>;

`

##### onVolumeChange

`type onVolumeChange = ReactEventHandler<HTMLSpanElement>;

`

##### onVolumeChangeCapture

`type onVolumeChangeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onWaiting

`type onWaiting = ReactEventHandler<HTMLSpanElement>;

`

##### onWaitingCapture

`type onWaitingCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onWheel

`type onWheel = WheelEventHandler<HTMLSpanElement>;

`

##### onWheelCapture

`type onWheelCapture = WheelEventHandler<HTMLSpanElement>;

`

##### popover

`type popover = "" | "auto" | "manual";

`

##### popoverTarget

`type popoverTarget = string;

`

##### popoverTargetAction

`type popoverTargetAction = "toggle" | "hide" | "show";

`

##### prefix

`type prefix = string;

`

##### property

`type property = string;

`

##### queryOptions

 Optional `useQuery` params

`type queryOptions = Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">

`

##### radioGroup

`type radioGroup = string;

`

##### rel

`type rel = string;

`

##### resolverAddress

`type resolverAddress = string;

`

##### resolverChain

`type resolverChain = Readonly<[ChainOptions](https://portal.thirdweb.com/references/typescript/v5/ChainOptions) & { rpc: string }>;

`

##### resource

`type resource = string;

`

##### results

`type results = number;

`

##### rev

`type rev = string;

`

##### role

`type role = AriaRole;

`

##### security

`type security = string;

`

##### slot

`type slot = string;

`

##### socialType

 Use this prop to prioritize the social profile that you want to display This is useful for a wallet containing multiple social profiles

`type socialType = "farcaster" | "ens" | "lens";

`

##### spellCheck

`type spellCheck = Booleanish;

`

##### style

`type style = CSSProperties;

`

##### suppressContentEditableWarning

`type suppressContentEditableWarning = boolean;

`

##### suppressHydrationWarning

`type suppressHydrationWarning = boolean;

`

##### tabIndex

`type tabIndex = number;

`

##### title

`type title = string;

`

##### translate

`type translate = "yes" | "no";

`

##### typeof

`type typeof = string

`

##### unselectable

`type unselectable = "on" | "off";

`

##### vocab

`type vocab = string;

`
## ChainIconProps

 Props for the ChainIcon component

`interface ChainIconProps extends Omit<React.ImgHTMLAttributes<HTMLImageElement>, "src"> {about : string,accessKey : string,alt : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,children : ReactNode,className : string,client : ThirdwebClient,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,crossOrigin : CrossOrigin,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,decoding : "auto" | "async" | "sync",defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",fallbackComponent : Element,fetchPriority : "auto" | "high" | "low",height : string | number,hidden : boolean,iconResolver : string | (() => string) | (() => Promise<string>),id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,loading : "eager" | "lazy",loadingComponent : Element,nonce : string,onAbort : ReactEventHandler<HTMLImageElement>,onAbortCapture : ReactEventHandler<HTMLImageElement>,onAnimationEnd : AnimationEventHandler<HTMLImageElement>,onAnimationEndCapture : AnimationEventHandler<HTMLImageElement>,onAnimationIteration : AnimationEventHandler<HTMLImageElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLImageElement>,onAnimationStart : AnimationEventHandler<HTMLImageElement>,onAnimationStartCapture : AnimationEventHandler<HTMLImageElement>,onAuxClick : MouseEventHandler<HTMLImageElement>,onAuxClickCapture : MouseEventHandler<HTMLImageElement>,onBeforeInput : FormEventHandler<HTMLImageElement>,onBeforeInputCapture : FormEventHandler<HTMLImageElement>,onBeforeToggle : ToggleEventHandler<HTMLImageElement>,onBlur : FocusEventHandler<HTMLImageElement>,onBlurCapture : FocusEventHandler<HTMLImageElement>,onCanPlay : ReactEventHandler<HTMLImageElement>,onCanPlayCapture : ReactEventHandler<HTMLImageElement>,onCanPlayThrough : ReactEventHandler<HTMLImageElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLImageElement>,onChange : FormEventHandler<HTMLImageElement>,onChangeCapture : FormEventHandler<HTMLImageElement>,onClick : MouseEventHandler<HTMLImageElement>,onClickCapture : MouseEventHandler<HTMLImageElement>,onCompositionEnd : CompositionEventHandler<HTMLImageElement>,onCompositionEndCapture : CompositionEventHandler<HTMLImageElement>,onCompositionStart : CompositionEventHandler<HTMLImageElement>,onCompositionStartCapture : CompositionEventHandler<HTMLImageElement>,onCompositionUpdate : CompositionEventHandler<HTMLImageElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLImageElement>,onContextMenu : MouseEventHandler<HTMLImageElement>,onContextMenuCapture : MouseEventHandler<HTMLImageElement>,onCopy : ClipboardEventHandler<HTMLImageElement>,onCopyCapture : ClipboardEventHandler<HTMLImageElement>,onCut : ClipboardEventHandler<HTMLImageElement>,onCutCapture : ClipboardEventHandler<HTMLImageElement>,onDoubleClick : MouseEventHandler<HTMLImageElement>,onDoubleClickCapture : MouseEventHandler<HTMLImageElement>,onDrag : DragEventHandler<HTMLImageElement>,onDragCapture : DragEventHandler<HTMLImageElement>,onDragEnd : DragEventHandler<HTMLImageElement>,onDragEndCapture : DragEventHandler<HTMLImageElement>,onDragEnter : DragEventHandler<HTMLImageElement>,onDragEnterCapture : DragEventHandler<HTMLImageElement>,onDragExit : DragEventHandler<HTMLImageElement>,onDragExitCapture : DragEventHandler<HTMLImageElement>,onDragLeave : DragEventHandler<HTMLImageElement>,onDragLeaveCapture : DragEventHandler<HTMLImageElement>,onDragOver : DragEventHandler<HTMLImageElement>,onDragOverCapture : DragEventHandler<HTMLImageElement>,onDragStart : DragEventHandler<HTMLImageElement>,onDragStartCapture : DragEventHandler<HTMLImageElement>,onDrop : DragEventHandler<HTMLImageElement>,onDropCapture : DragEventHandler<HTMLImageElement>,onDurationChange : ReactEventHandler<HTMLImageElement>,onDurationChangeCapture : ReactEventHandler<HTMLImageElement>,onEmptied : ReactEventHandler<HTMLImageElement>,onEmptiedCapture : ReactEventHandler<HTMLImageElement>,onEncrypted : ReactEventHandler<HTMLImageElement>,onEncryptedCapture : ReactEventHandler<HTMLImageElement>,onEnded : ReactEventHandler<HTMLImageElement>,onEndedCapture : ReactEventHandler<HTMLImageElement>,onError : ReactEventHandler<HTMLImageElement>,onErrorCapture : ReactEventHandler<HTMLImageElement>,onFocus : FocusEventHandler<HTMLImageElement>,onFocusCapture : FocusEventHandler<HTMLImageElement>,onGotPointerCapture : PointerEventHandler<HTMLImageElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLImageElement>,onInput : FormEventHandler<HTMLImageElement>,onInputCapture : FormEventHandler<HTMLImageElement>,onInvalid : FormEventHandler<HTMLImageElement>,onInvalidCapture : FormEventHandler<HTMLImageElement>,onKeyDown : KeyboardEventHandler<HTMLImageElement>,onKeyDownCapture : KeyboardEventHandler<HTMLImageElement>,onKeyPress : KeyboardEventHandler<HTMLImageElement>,onKeyPressCapture : KeyboardEventHandler<HTMLImageElement>,onKeyUp : KeyboardEventHandler<HTMLImageElement>,onKeyUpCapture : KeyboardEventHandler<HTMLImageElement>,onLoad : ReactEventHandler<HTMLImageElement>,onLoadCapture : ReactEventHandler<HTMLImageElement>,onLoadedData : ReactEventHandler<HTMLImageElement>,onLoadedDataCapture : ReactEventHandler<HTMLImageElement>,onLoadedMetadata : ReactEventHandler<HTMLImageElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLImageElement>,onLoadStart : ReactEventHandler<HTMLImageElement>,onLoadStartCapture : ReactEventHandler<HTMLImageElement>,onLostPointerCapture : PointerEventHandler<HTMLImageElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLImageElement>,onMouseDown : MouseEventHandler<HTMLImageElement>,onMouseDownCapture : MouseEventHandler<HTMLImageElement>,onMouseEnter : MouseEventHandler<HTMLImageElement>,onMouseLeave : MouseEventHandler<HTMLImageElement>,onMouseMove : MouseEventHandler<HTMLImageElement>,onMouseMoveCapture : MouseEventHandler<HTMLImageElement>,onMouseOut : MouseEventHandler<HTMLImageElement>,onMouseOutCapture : MouseEventHandler<HTMLImageElement>,onMouseOver : MouseEventHandler<HTMLImageElement>,onMouseOverCapture : MouseEventHandler<HTMLImageElement>,onMouseUp : MouseEventHandler<HTMLImageElement>,onMouseUpCapture : MouseEventHandler<HTMLImageElement>,onPaste : ClipboardEventHandler<HTMLImageElement>,onPasteCapture : ClipboardEventHandler<HTMLImageElement>,onPause : ReactEventHandler<HTMLImageElement>,onPauseCapture : ReactEventHandler<HTMLImageElement>,onPlay : ReactEventHandler<HTMLImageElement>,onPlayCapture : ReactEventHandler<HTMLImageElement>,onPlaying : ReactEventHandler<HTMLImageElement>,onPlayingCapture : ReactEventHandler<HTMLImageElement>,onPointerCancel : PointerEventHandler<HTMLImageElement>,onPointerCancelCapture : PointerEventHandler<HTMLImageElement>,onPointerDown : PointerEventHandler<HTMLImageElement>,onPointerDownCapture : PointerEventHandler<HTMLImageElement>,onPointerEnter : PointerEventHandler<HTMLImageElement>,onPointerLeave : PointerEventHandler<HTMLImageElement>,onPointerMove : PointerEventHandler<HTMLImageElement>,onPointerMoveCapture : PointerEventHandler<HTMLImageElement>,onPointerOut : PointerEventHandler<HTMLImageElement>,onPointerOutCapture : PointerEventHandler<HTMLImageElement>,onPointerOver : PointerEventHandler<HTMLImageElement>,onPointerOverCapture : PointerEventHandler<HTMLImageElement>,onPointerUp : PointerEventHandler<HTMLImageElement>,onPointerUpCapture : PointerEventHandler<HTMLImageElement>,onProgress : ReactEventHandler<HTMLImageElement>,onProgressCapture : ReactEventHandler<HTMLImageElement>,onRateChange : ReactEventHandler<HTMLImageElement>,onRateChangeCapture : ReactEventHandler<HTMLImageElement>,onReset : FormEventHandler<HTMLImageElement>,onResetCapture : FormEventHandler<HTMLImageElement>,onResize : ReactEventHandler<HTMLImageElement>,onResizeCapture : ReactEventHandler<HTMLImageElement>,onScroll : UIEventHandler<HTMLImageElement>,onScrollCapture : UIEventHandler<HTMLImageElement>,onSeeked : ReactEventHandler<HTMLImageElement>,onSeekedCapture : ReactEventHandler<HTMLImageElement>,onSeeking : ReactEventHandler<HTMLImageElement>,onSeekingCapture : ReactEventHandler<HTMLImageElement>,onSelect : ReactEventHandler<HTMLImageElement>,onSelectCapture : ReactEventHandler<HTMLImageElement>,onStalled : ReactEventHandler<HTMLImageElement>,onStalledCapture : ReactEventHandler<HTMLImageElement>,onSubmit : FormEventHandler<HTMLImageElement>,onSubmitCapture : FormEventHandler<HTMLImageElement>,onSuspend : ReactEventHandler<HTMLImageElement>,onSuspendCapture : ReactEventHandler<HTMLImageElement>,onTimeUpdate : ReactEventHandler<HTMLImageElement>,onTimeUpdateCapture : ReactEventHandler<HTMLImageElement>,onToggle : ToggleEventHandler<HTMLImageElement>,onTouchCancel : TouchEventHandler<HTMLImageElement>,onTouchCancelCapture : TouchEventHandler<HTMLImageElement>,onTouchEnd : TouchEventHandler<HTMLImageElement>,onTouchEndCapture : TouchEventHandler<HTMLImageElement>,onTouchMove : TouchEventHandler<HTMLImageElement>,onTouchMoveCapture : TouchEventHandler<HTMLImageElement>,onTouchStart : TouchEventHandler<HTMLImageElement>,onTouchStartCapture : TouchEventHandler<HTMLImageElement>,onTransitionCancel : TransitionEventHandler<HTMLImageElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLImageElement>,onTransitionEnd : TransitionEventHandler<HTMLImageElement>,onTransitionEndCapture : TransitionEventHandler<HTMLImageElement>,onTransitionRun : TransitionEventHandler<HTMLImageElement>,onTransitionRunCapture : TransitionEventHandler<HTMLImageElement>,onTransitionStart : TransitionEventHandler<HTMLImageElement>,onTransitionStartCapture : TransitionEventHandler<HTMLImageElement>,onVolumeChange : ReactEventHandler<HTMLImageElement>,onVolumeChangeCapture : ReactEventHandler<HTMLImageElement>,onWaiting : ReactEventHandler<HTMLImageElement>,onWaitingCapture : ReactEventHandler<HTMLImageElement>,onWheel : WheelEventHandler<HTMLImageElement>,onWheelCapture : WheelEventHandler<HTMLImageElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,queryOptions : Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">,radioGroup : string,referrerPolicy : HTMLAttributeReferrerPolicy,rel : string,resource : string,results : number,rev : string,role : AriaRole,security : string,sizes : string,slot : string,spellCheck : Booleanish,srcSet : string,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,tabIndex : number,title : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",useMap : string,vocab : string,width : string | number}

`

##### about

`type about = string;

`

##### accessKey

`type accessKey = string;

`

##### alt

`type alt = string;

`

##### aria-activedescendant

 Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application.

`type aria-activedescendant = string

`

##### aria-atomic

 Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute.

`type aria-atomic = Booleanish

`

##### aria-autocomplete

 Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be presented if they are made.

`type aria-autocomplete = "inline" | "none" | "list" | "both"

`

##### aria-braillelabel

 Defines a string value that labels the current element, which is intended to be converted into Braille.

 aria-label.

`type aria-braillelabel = string

`

##### aria-brailleroledescription

 Defines a human-readable, author-localized abbreviated description for the role of an element, which is intended to be converted into Braille.

 aria-roledescription.

`type aria-brailleroledescription = string

`

##### aria-busy

`type aria-busy = Booleanish

`

##### aria-checked

 Indicates the current "checked" state of checkboxes, radio buttons, and other widgets.

* aria-pressed
* aria-selected.

`type aria-checked = boolean | "false" | "true" | "mixed"

`

##### aria-colcount

 Defines the total number of columns in a table, grid, or treegrid.

 aria-colindex.

`type aria-colcount = number

`

##### aria-colindex

 Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid.

* aria-colcount
* aria-colspan.

`type aria-colindex = number

`

##### aria-colindextext

 Defines a human readable text alternative of aria-colindex.

 aria-rowindextext.

`type aria-colindextext = string

`

##### aria-colspan

 Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-colindex
* aria-rowspan.

`type aria-colspan = number

`

##### aria-controls

 Identifies the element (or elements) whose contents or presence are controlled by the current element.

 aria-owns.

`type aria-controls = string

`

##### aria-current

 Indicates the element that represents the current item within a container or set of related elements.

`type aria-current = boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date"

`

##### aria-describedby

 Identifies the element (or elements) that describes the object.

 aria-labelledby

`type aria-describedby = string

`

##### aria-description

 Defines a string value that describes or annotates the current element.

 related aria-describedby.

`type aria-description = string

`

##### aria-details

 Identifies the element that provides a detailed, extended description for the object.

 aria-describedby.

`type aria-details = string

`

##### aria-disabled

 Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable.

* aria-hidden
* aria-readonly.

`type aria-disabled = Booleanish

`

##### aria-dropeffect

Deprecated

 in ARIA 1.1

 Indicates what functions can be performed when a dragged object is released on the drop target.

`type aria-dropeffect = "link" | "popup" | "execute" | "none" | "copy" | "move"

`

##### aria-errormessage

 Identifies the element that provides an error message for the object.

* aria-invalid
* aria-describedby.

`type aria-errormessage = string

`

##### aria-expanded

 Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed.

`type aria-expanded = Booleanish

`

##### aria-flowto

 Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion, allows assistive technology to override the general default of reading in document source order.

`type aria-flowto = string

`

##### aria-grabbed

Deprecated

 in ARIA 1.1

 Indicates an element's "grabbed" state in a drag-and-drop operation.

`type aria-grabbed = Booleanish

`

##### aria-haspopup

 Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element.

`type aria-haspopup = boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree"

`

##### aria-hidden

 Indicates whether the element is exposed to an accessibility API.

 aria-disabled.

`type aria-hidden = Booleanish

`

##### aria-invalid

 Indicates the entered value does not conform to the format expected by the application.

 aria-errormessage.

`type aria-invalid = boolean | "false" | "true" | "grammar" | "spelling"

`

##### aria-keyshortcuts

 Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element.

`type aria-keyshortcuts = string

`

##### aria-label

 Defines a string value that labels the current element.

 aria-labelledby.

`type aria-label = string

`

##### aria-labelledby

 Identifies the element (or elements) that labels the current element.

 aria-describedby.

`type aria-labelledby = string

`

##### aria-level

 Defines the hierarchical level of an element within a structure.

`type aria-level = number

`

##### aria-live

 Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region.

`type aria-live = "off" | "polite" | "assertive"

`

##### aria-modal

 Indicates whether an element is modal when displayed.

`type aria-modal = Booleanish

`

##### aria-multiline

 Indicates whether a text box accepts multiple lines of input or only a single line.

`type aria-multiline = Booleanish

`

##### aria-multiselectable

 Indicates that the user may select more than one item from the current selectable descendants.

`type aria-multiselectable = Booleanish

`

##### aria-orientation

 Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous.

`type aria-orientation = "horizontal" | "vertical"

`

##### aria-owns

 Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship between DOM elements where the DOM hierarchy cannot be used to represent the relationship.

 aria-controls.

`type aria-owns = string

`

##### aria-placeholder

 Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value. A hint could be a sample value or a brief description of the expected format.

`type aria-placeholder = string

`

##### aria-posinset

 Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-setsize.

`type aria-posinset = number

`

##### aria-pressed

 Indicates the current "pressed" state of toggle buttons.

* aria-checked
* aria-selected.

`type aria-pressed = boolean | "false" | "true" | "mixed"

`

##### aria-readonly

 Indicates that the element is not editable, but is otherwise operable.

 aria-disabled.

`type aria-readonly = Booleanish

`

##### aria-relevant

 Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified.

 aria-atomic.

`type aria-relevant = "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals"

`

##### aria-required

 Indicates that user input is required on the element before a form may be submitted.

`type aria-required = Booleanish

`

##### aria-roledescription

 Defines a human-readable, author-localized description for the role of an element.

`type aria-roledescription = string

`

##### aria-rowcount

 Defines the total number of rows in a table, grid, or treegrid.

 aria-rowindex.

`type aria-rowcount = number

`

##### aria-rowindex

 Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid.

* aria-rowcount
* aria-rowspan.

`type aria-rowindex = number

`

##### aria-rowindextext

 Defines a human readable text alternative of aria-rowindex.

 aria-colindextext.

`type aria-rowindextext = string

`

##### aria-rowspan

 Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-rowindex
* aria-colspan.

`type aria-rowspan = number

`

##### aria-selected

 Indicates the current "selected" state of various widgets.

* aria-checked
* aria-pressed.

`type aria-selected = Booleanish

`

##### aria-setsize

 Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-posinset.

`type aria-setsize = number

`

##### aria-sort

 Indicates if items in a table or grid are sorted in ascending or descending order.

`type aria-sort = "none" | "ascending" | "descending" | "other"

`

##### aria-valuemax

 Defines the maximum allowed value for a range widget.

`type aria-valuemax = number

`

##### aria-valuemin

 Defines the minimum allowed value for a range widget.

`type aria-valuemin = number

`

##### aria-valuenow

 Defines the current value for a range widget.

 aria-valuetext.

`type aria-valuenow = number

`

##### aria-valuetext

 Defines the human readable text alternative of aria-valuenow for a range widget.

`type aria-valuetext = string

`

##### autoCapitalize

`type autoCapitalize =

| (string & {})

| "on"

| "off"

| "none"

| "sentences"

| "words"

| "characters";

`

##### autoCorrect

`type autoCorrect = string;

`

##### autoFocus

`type autoFocus = boolean;

`

##### autoSave

`type autoSave = string;

`

##### children

`type children = ReactNode;

`

##### className

`type className = string;

`

##### client

 You need a ThirdwebClient to resolve the icon which is hosted on IPFS. (since most chain icons are hosted on IPFS, loading them via thirdweb gateway will ensure better performance)

`type client = [ThirdwebClient](https://portal.thirdweb.com/references/typescript/v5/ThirdwebClient);

`

##### color

`type color = string;

`

##### content

`type content = string;

`

##### contentEditable

`type contentEditable = "inherit" | Booleanish | "plaintext-only";

`

##### contextMenu

`type contextMenu = string;

`

##### crossOrigin

`type crossOrigin = CrossOrigin;

`

##### dangerouslySetInnerHTML

`type dangerouslySetInnerHTML = { __html: string | TrustedHTML };

`

##### datatype

`type datatype = string;

`

##### decoding

`type decoding = "auto" | "async" | "sync";

`

##### defaultChecked

`type defaultChecked = boolean;

`

##### defaultValue

`type defaultValue = string | number | (readonly Array<string>)

`

##### dir

`type dir = string;

`

##### draggable

`type draggable = Booleanish;

`

##### enterKeyHint

`type enterKeyHint =

| "search"

| "done"

| "next"

| "send"

| "enter"

| "go"

| "previous";

`

##### fallbackComponent

 This component will be shown if the request for fetching the avatar is done but could not retreive any result. You can pass a dummy avatar/image to this prop.

 If not passed, the component will return `null`

`type fallbackComponent = Element;

`

### Example

`<ChainIcon fallbackComponent={<DummyImage />} />;

`

##### fetchPriority

`type fetchPriority = "auto" | "high" | "low";

`

##### height

`type height = string | number;

`

##### hidden

`type hidden = boolean;

`

##### iconResolver

 This prop can be a string or a (async) function that resolves to a string, representing the icon url of the chain This is particularly useful if you already have a way to fetch the chain icon.

`type iconResolver = string | (() => string) | (() => Promise<string>);

`

##### id

`type id = string;

`

##### inert

 https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert

`type inert = boolean;

`

##### inlist

`type inlist = any;

`

##### inputMode

 Hints at the type of data that might be entered by the user while editing the element or its contents

[ https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute](https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute)

`type inputMode =

| "search"

| "email"

| "url"

| "text"

| "none"

| "tel"

| "numeric"

| "decimal";

`

##### is

 Specify that a standard HTML element should behave like a defined custom built-in element

[ https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is](https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is)

`type is = string;

`

##### itemID

`type itemID = string;

`

##### itemProp

`type itemProp = string;

`

##### itemRef

`type itemRef = string;

`

##### itemScope

`type itemScope = boolean;

`

##### itemType

`type itemType = string;

`

##### lang

`type lang = string;

`

##### loading

`type loading = "eager" | "lazy";

`

##### loadingComponent

 This component will be shown while the avatar of the icon is being fetched If not passed, the component will return `null` .

 You can pass a loading sign or spinner to this prop.

`type loadingComponent = Element;

`

### Example

`<ChainIcon loadingComponent={<Spinner />} />;

`

##### nonce

`type nonce = string;

`

##### onAbort

`type onAbort = ReactEventHandler<HTMLImageElement>;

`

##### onAbortCapture

`type onAbortCapture = ReactEventHandler<HTMLImageElement>;

`

##### onAnimationEnd

`type onAnimationEnd = AnimationEventHandler<HTMLImageElement>;

`

##### onAnimationEndCapture

`type onAnimationEndCapture = AnimationEventHandler<HTMLImageElement>;

`

##### onAnimationIteration

`type onAnimationIteration = AnimationEventHandler<HTMLImageElement>;

`

##### onAnimationIterationCapture

`type onAnimationIterationCapture =

AnimationEventHandler<HTMLImageElement>;

`

##### onAnimationStart

`type onAnimationStart = AnimationEventHandler<HTMLImageElement>;

`

##### onAnimationStartCapture

`type onAnimationStartCapture =

AnimationEventHandler<HTMLImageElement>;

`

##### onAuxClick

`type onAuxClick = MouseEventHandler<HTMLImageElement>;

`

##### onAuxClickCapture

`type onAuxClickCapture = MouseEventHandler<HTMLImageElement>;

`

##### onBeforeInput

`type onBeforeInput = FormEventHandler<HTMLImageElement>;

`

##### onBeforeInputCapture

`type onBeforeInputCapture = FormEventHandler<HTMLImageElement>;

`

##### onBeforeToggle

`type onBeforeToggle = ToggleEventHandler<HTMLImageElement>;

`

##### onBlur

`type onBlur = FocusEventHandler<HTMLImageElement>;

`

##### onBlurCapture

`type onBlurCapture = FocusEventHandler<HTMLImageElement>;

`

##### onCanPlay

`type onCanPlay = ReactEventHandler<HTMLImageElement>;

`

##### onCanPlayCapture

`type onCanPlayCapture = ReactEventHandler<HTMLImageElement>;

`

##### onCanPlayThrough

`type onCanPlayThrough = ReactEventHandler<HTMLImageElement>;

`

##### onCanPlayThroughCapture

`type onCanPlayThroughCapture = ReactEventHandler<HTMLImageElement>;

`

##### onChange

`type onChange = FormEventHandler<HTMLImageElement>;

`

##### onChangeCapture

`type onChangeCapture = FormEventHandler<HTMLImageElement>;

`

##### onClick

`type onClick = MouseEventHandler<HTMLImageElement>;

`

##### onClickCapture

`type onClickCapture = MouseEventHandler<HTMLImageElement>;

`

##### onCompositionEnd

`type onCompositionEnd = CompositionEventHandler<HTMLImageElement>;

`

##### onCompositionEndCapture

`type onCompositionEndCapture =

CompositionEventHandler<HTMLImageElement>;

`

##### onCompositionStart

`type onCompositionStart = CompositionEventHandler<HTMLImageElement>;

`

##### onCompositionStartCapture

`type onCompositionStartCapture =

CompositionEventHandler<HTMLImageElement>;

`

##### onCompositionUpdate

`type onCompositionUpdate = CompositionEventHandler<HTMLImageElement>;

`

##### onCompositionUpdateCapture

`type onCompositionUpdateCapture =

CompositionEventHandler<HTMLImageElement>;

`

##### onContextMenu

`type onContextMenu = MouseEventHandler<HTMLImageElement>;

`

##### onContextMenuCapture

`type onContextMenuCapture = MouseEventHandler<HTMLImageElement>;

`

##### onCopy

`type onCopy = ClipboardEventHandler<HTMLImageElement>;

`

##### onCopyCapture

`type onCopyCapture = ClipboardEventHandler<HTMLImageElement>;

`

##### onCut

`type onCut = ClipboardEventHandler<HTMLImageElement>;

`

##### onCutCapture

`type onCutCapture = ClipboardEventHandler<HTMLImageElement>;

`

##### onDoubleClick

`type onDoubleClick = MouseEventHandler<HTMLImageElement>;

`

##### onDoubleClickCapture

`type onDoubleClickCapture = MouseEventHandler<HTMLImageElement>;

`

##### onDrag

`type onDrag = DragEventHandler<HTMLImageElement>;

`

##### onDragCapture

`type onDragCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragEnd

`type onDragEnd = DragEventHandler<HTMLImageElement>;

`

##### onDragEndCapture

`type onDragEndCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragEnter

`type onDragEnter = DragEventHandler<HTMLImageElement>;

`

##### onDragEnterCapture

`type onDragEnterCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragExit

`type onDragExit = DragEventHandler<HTMLImageElement>;

`

##### onDragExitCapture

`type onDragExitCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragLeave

`type onDragLeave = DragEventHandler<HTMLImageElement>;

`

##### onDragLeaveCapture

`type onDragLeaveCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragOver

`type onDragOver = DragEventHandler<HTMLImageElement>;

`

##### onDragOverCapture

`type onDragOverCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragStart

`type onDragStart = DragEventHandler<HTMLImageElement>;

`

##### onDragStartCapture

`type onDragStartCapture = DragEventHandler<HTMLImageElement>;

`

##### onDrop

`type onDrop = DragEventHandler<HTMLImageElement>;

`

##### onDropCapture

`type onDropCapture = DragEventHandler<HTMLImageElement>;

`

##### onDurationChange

`type onDurationChange = ReactEventHandler<HTMLImageElement>;

`

##### onDurationChangeCapture

`type onDurationChangeCapture = ReactEventHandler<HTMLImageElement>;

`

##### onEmptied

`type onEmptied = ReactEventHandler<HTMLImageElement>;

`

##### onEmptiedCapture

`type onEmptiedCapture = ReactEventHandler<HTMLImageElement>;

`

##### onEncrypted

`type onEncrypted = ReactEventHandler<HTMLImageElement>;

`

##### onEncryptedCapture

`type onEncryptedCapture = ReactEventHandler<HTMLImageElement>;

`

##### onEnded

`type onEnded = ReactEventHandler<HTMLImageElement>;

`

##### onEndedCapture

`type onEndedCapture = ReactEventHandler<HTMLImageElement>;

`

##### onError

`type onError = ReactEventHandler<HTMLImageElement>;

`

##### onErrorCapture

`type onErrorCapture = ReactEventHandler<HTMLImageElement>;

`

##### onFocus

`type onFocus = FocusEventHandler<HTMLImageElement>;

`

##### onFocusCapture

`type onFocusCapture = FocusEventHandler<HTMLImageElement>;

`

##### onGotPointerCapture

`type onGotPointerCapture = PointerEventHandler<HTMLImageElement>;

`

##### onGotPointerCaptureCapture

`type onGotPointerCaptureCapture =

PointerEventHandler<HTMLImageElement>;

`

##### onInput

`type onInput = FormEventHandler<HTMLImageElement>;

`

##### onInputCapture

`type onInputCapture = FormEventHandler<HTMLImageElement>;

`

##### onInvalid

`type onInvalid = FormEventHandler<HTMLImageElement>;

`

##### onInvalidCapture

`type onInvalidCapture = FormEventHandler<HTMLImageElement>;

`

##### onKeyDown

`type onKeyDown = KeyboardEventHandler<HTMLImageElement>;

`

##### onKeyDownCapture

`type onKeyDownCapture = KeyboardEventHandler<HTMLImageElement>;

`

##### onKeyPress

Deprecated

 Use `onKeyUp` or `onKeyDown` instead

`type onKeyPress = KeyboardEventHandler<HTMLImageElement>;

`

##### onKeyPressCapture

Deprecated

 Use `onKeyUpCapture` or `onKeyDownCapture` instead

`type onKeyPressCapture = KeyboardEventHandler<HTMLImageElement>;

`

##### onKeyUp

`type onKeyUp = KeyboardEventHandler<HTMLImageElement>;

`

##### onKeyUpCapture

`type onKeyUpCapture = KeyboardEventHandler<HTMLImageElement>;

`

##### onLoad

`type onLoad = ReactEventHandler<HTMLImageElement>;

`

##### onLoadCapture

`type onLoadCapture = ReactEventHandler<HTMLImageElement>;

`

##### onLoadedData

`type onLoadedData = ReactEventHandler<HTMLImageElement>;

`

##### onLoadedDataCapture

`type onLoadedDataCapture = ReactEventHandler<HTMLImageElement>;

`

##### onLoadedMetadata

`type onLoadedMetadata = ReactEventHandler<HTMLImageElement>;

`

##### onLoadedMetadataCapture

`type onLoadedMetadataCapture = ReactEventHandler<HTMLImageElement>;

`

##### onLoadStart

`type onLoadStart = ReactEventHandler<HTMLImageElement>;

`

##### onLoadStartCapture

`type onLoadStartCapture = ReactEventHandler<HTMLImageElement>;

`

##### onLostPointerCapture

`type onLostPointerCapture = PointerEventHandler<HTMLImageElement>;

`

##### onLostPointerCaptureCapture

`type onLostPointerCaptureCapture =

PointerEventHandler<HTMLImageElement>;

`

##### onMouseDown

`type onMouseDown = MouseEventHandler<HTMLImageElement>;

`

##### onMouseDownCapture

`type onMouseDownCapture = MouseEventHandler<HTMLImageElement>;

`

##### onMouseEnter

`type onMouseEnter = MouseEventHandler<HTMLImageElement>;

`

##### onMouseLeave

`type onMouseLeave = MouseEventHandler<HTMLImageElement>;

`

##### onMouseMove

`type onMouseMove = MouseEventHandler<HTMLImageElement>;

`

##### onMouseMoveCapture

`type onMouseMoveCapture = MouseEventHandler<HTMLImageElement>;

`

##### onMouseOut

`type onMouseOut = MouseEventHandler<HTMLImageElement>;

`

##### onMouseOutCapture

`type onMouseOutCapture = MouseEventHandler<HTMLImageElement>;

`

##### onMouseOver

`type onMouseOver = MouseEventHandler<HTMLImageElement>;

`

##### onMouseOverCapture

`type onMouseOverCapture = MouseEventHandler<HTMLImageElement>;

`

##### onMouseUp

`type onMouseUp = MouseEventHandler<HTMLImageElement>;

`

##### onMouseUpCapture

`type onMouseUpCapture = MouseEventHandler<HTMLImageElement>;

`

##### onPaste

`type onPaste = ClipboardEventHandler<HTMLImageElement>;

`

##### onPasteCapture

`type onPasteCapture = ClipboardEventHandler<HTMLImageElement>;

`

##### onPause

`type onPause = ReactEventHandler<HTMLImageElement>;

`

##### onPauseCapture

`type onPauseCapture = ReactEventHandler<HTMLImageElement>;

`

##### onPlay

`type onPlay = ReactEventHandler<HTMLImageElement>;

`

##### onPlayCapture

`type onPlayCapture = ReactEventHandler<HTMLImageElement>;

`

##### onPlaying

`type onPlaying = ReactEventHandler<HTMLImageElement>;

`

##### onPlayingCapture

`type onPlayingCapture = ReactEventHandler<HTMLImageElement>;

`

##### onPointerCancel

`type onPointerCancel = PointerEventHandler<HTMLImageElement>;

`

##### onPointerCancelCapture

`type onPointerCancelCapture = PointerEventHandler<HTMLImageElement>;

`

##### onPointerDown

`type onPointerDown = PointerEventHandler<HTMLImageElement>;

`

##### onPointerDownCapture

`type onPointerDownCapture = PointerEventHandler<HTMLImageElement>;

`

##### onPointerEnter

`type onPointerEnter = PointerEventHandler<HTMLImageElement>;

`

##### onPointerLeave

`type onPointerLeave = PointerEventHandler<HTMLImageElement>;

`

##### onPointerMove

`type onPointerMove = PointerEventHandler<HTMLImageElement>;

`

##### onPointerMoveCapture

`type onPointerMoveCapture = PointerEventHandler<HTMLImageElement>;

`

##### onPointerOut

`type onPointerOut = PointerEventHandler<HTMLImageElement>;

`

##### onPointerOutCapture

`type onPointerOutCapture = PointerEventHandler<HTMLImageElement>;

`

##### onPointerOver

`type onPointerOver = PointerEventHandler<HTMLImageElement>;

`

##### onPointerOverCapture

`type onPointerOverCapture = PointerEventHandler<HTMLImageElement>;

`

##### onPointerUp

`type onPointerUp = PointerEventHandler<HTMLImageElement>;

`

##### onPointerUpCapture

`type onPointerUpCapture = PointerEventHandler<HTMLImageElement>;

`

##### onProgress

`type onProgress = ReactEventHandler<HTMLImageElement>;

`

##### onProgressCapture

`type onProgressCapture = ReactEventHandler<HTMLImageElement>;

`

##### onRateChange

`type onRateChange = ReactEventHandler<HTMLImageElement>;

`

##### onRateChangeCapture

`type onRateChangeCapture = ReactEventHandler<HTMLImageElement>;

`

##### onReset

`type onReset = FormEventHandler<HTMLImageElement>;

`

##### onResetCapture

`type onResetCapture = FormEventHandler<HTMLImageElement>;

`

##### onResize

`type onResize = ReactEventHandler<HTMLImageElement>;

`

##### onResizeCapture

`type onResizeCapture = ReactEventHandler<HTMLImageElement>;

`

##### onScroll

`type onScroll = UIEventHandler<HTMLImageElement>;

`

##### onScrollCapture

`type onScrollCapture = UIEventHandler<HTMLImageElement>;

`

##### onSeeked

`type onSeeked = ReactEventHandler<HTMLImageElement>;

`

##### onSeekedCapture

`type onSeekedCapture = ReactEventHandler<HTMLImageElement>;

`

##### onSeeking

`type onSeeking = ReactEventHandler<HTMLImageElement>;

`

##### onSeekingCapture

`type onSeekingCapture = ReactEventHandler<HTMLImageElement>;

`

##### onSelect

`type onSelect = ReactEventHandler<HTMLImageElement>;

`

##### onSelectCapture

`type onSelectCapture = ReactEventHandler<HTMLImageElement>;

`

##### onStalled

`type onStalled = ReactEventHandler<HTMLImageElement>;

`

##### onStalledCapture

`type onStalledCapture = ReactEventHandler<HTMLImageElement>;

`

##### onSubmit

`type onSubmit = FormEventHandler<HTMLImageElement>;

`

##### onSubmitCapture

`type onSubmitCapture = FormEventHandler<HTMLImageElement>;

`

##### onSuspend

`type onSuspend = ReactEventHandler<HTMLImageElement>;

`

##### onSuspendCapture

`type onSuspendCapture = ReactEventHandler<HTMLImageElement>;

`

##### onTimeUpdate

`type onTimeUpdate = ReactEventHandler<HTMLImageElement>;

`

##### onTimeUpdateCapture

`type onTimeUpdateCapture = ReactEventHandler<HTMLImageElement>;

`

##### onToggle

`type onToggle = ToggleEventHandler<HTMLImageElement>;

`

##### onTouchCancel

`type onTouchCancel = TouchEventHandler<HTMLImageElement>;

`

##### onTouchCancelCapture

`type onTouchCancelCapture = TouchEventHandler<HTMLImageElement>;

`

##### onTouchEnd

`type onTouchEnd = TouchEventHandler<HTMLImageElement>;

`

##### onTouchEndCapture

`type onTouchEndCapture = TouchEventHandler<HTMLImageElement>;

`

##### onTouchMove

`type onTouchMove = TouchEventHandler<HTMLImageElement>;

`

##### onTouchMoveCapture

`type onTouchMoveCapture = TouchEventHandler<HTMLImageElement>;

`

##### onTouchStart

`type onTouchStart = TouchEventHandler<HTMLImageElement>;

`

##### onTouchStartCapture

`type onTouchStartCapture = TouchEventHandler<HTMLImageElement>;

`

##### onTransitionCancel

`type onTransitionCancel = TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionCancelCapture

`type onTransitionCancelCapture =

TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionEnd

`type onTransitionEnd = TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionEndCapture

`type onTransitionEndCapture =

TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionRun

`type onTransitionRun = TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionRunCapture

`type onTransitionRunCapture =

TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionStart

`type onTransitionStart = TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionStartCapture

`type onTransitionStartCapture =

TransitionEventHandler<HTMLImageElement>;

`

##### onVolumeChange

`type onVolumeChange = ReactEventHandler<HTMLImageElement>;

`

##### onVolumeChangeCapture

`type onVolumeChangeCapture = ReactEventHandler<HTMLImageElement>;

`

##### onWaiting

`type onWaiting = ReactEventHandler<HTMLImageElement>;

`

##### onWaitingCapture

`type onWaitingCapture = ReactEventHandler<HTMLImageElement>;

`

##### onWheel

`type onWheel = WheelEventHandler<HTMLImageElement>;

`

##### onWheelCapture

`type onWheelCapture = WheelEventHandler<HTMLImageElement>;

`

##### popover

`type popover = "" | "auto" | "manual";

`

##### popoverTarget

`type popoverTarget = string;

`

##### popoverTargetAction

`type popoverTargetAction = "toggle" | "hide" | "show";

`

##### prefix

`type prefix = string;

`

##### property

`type property = string;

`

##### queryOptions

 Optional query options for `useQuery`

`type queryOptions = Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">

`

##### radioGroup

`type radioGroup = string;

`

##### referrerPolicy

`type referrerPolicy = HTMLAttributeReferrerPolicy;

`

##### rel

`type rel = string;

`

##### resource

`type resource = string;

`

##### results

`type results = number;

`

##### rev

`type rev = string;

`

##### role

`type role = AriaRole;

`

##### security

`type security = string;

`

##### sizes

`type sizes = string;

`

##### slot

`type slot = string;

`

##### spellCheck

`type spellCheck = Booleanish;

`

##### srcSet

`type srcSet = string;

`

##### style

`type style = CSSProperties;

`

##### suppressContentEditableWarning

`type suppressContentEditableWarning = boolean;

`

##### suppressHydrationWarning

`type suppressHydrationWarning = boolean;

`

##### tabIndex

`type tabIndex = number;

`

##### title

`type title = string;

`

##### translate

`type translate = "yes" | "no";

`

##### typeof

`type typeof = string

`

##### unselectable

`type unselectable = "on" | "off";

`

##### useMap

`type useMap = string;

`

##### vocab

`type vocab = string;

`

##### width

`type width = string | number;

`
## ChainNameProps

 Props for the ChainName component

`interface ChainNameProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, "children"> {about : string,accessKey : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,className : string,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",fallbackComponent : Element,formatFn : (str: string) => string,hidden : boolean,id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,loadingComponent : Element,nameResolver : string | (() => string) | (() => Promise<string>),nonce : string,onAbort : ReactEventHandler<HTMLSpanElement>,onAbortCapture : ReactEventHandler<HTMLSpanElement>,onAnimationEnd : AnimationEventHandler<HTMLSpanElement>,onAnimationEndCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationIteration : AnimationEventHandler<HTMLSpanElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationStart : AnimationEventHandler<HTMLSpanElement>,onAnimationStartCapture : AnimationEventHandler<HTMLSpanElement>,onAuxClick : MouseEventHandler<HTMLSpanElement>,onAuxClickCapture : MouseEventHandler<HTMLSpanElement>,onBeforeInput : FormEventHandler<HTMLSpanElement>,onBeforeInputCapture : FormEventHandler<HTMLSpanElement>,onBeforeToggle : ToggleEventHandler<HTMLSpanElement>,onBlur : FocusEventHandler<HTMLSpanElement>,onBlurCapture : FocusEventHandler<HTMLSpanElement>,onCanPlay : ReactEventHandler<HTMLSpanElement>,onCanPlayCapture : ReactEventHandler<HTMLSpanElement>,onCanPlayThrough : ReactEventHandler<HTMLSpanElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLSpanElement>,onChange : FormEventHandler<HTMLSpanElement>,onChangeCapture : FormEventHandler<HTMLSpanElement>,onClick : MouseEventHandler<HTMLSpanElement>,onClickCapture : MouseEventHandler<HTMLSpanElement>,onCompositionEnd : CompositionEventHandler<HTMLSpanElement>,onCompositionEndCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionStart : CompositionEventHandler<HTMLSpanElement>,onCompositionStartCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdate : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLSpanElement>,onContextMenu : MouseEventHandler<HTMLSpanElement>,onContextMenuCapture : MouseEventHandler<HTMLSpanElement>,onCopy : ClipboardEventHandler<HTMLSpanElement>,onCopyCapture : ClipboardEventHandler<HTMLSpanElement>,onCut : ClipboardEventHandler<HTMLSpanElement>,onCutCapture : ClipboardEventHandler<HTMLSpanElement>,onDoubleClick : MouseEventHandler<HTMLSpanElement>,onDoubleClickCapture : MouseEventHandler<HTMLSpanElement>,onDrag : DragEventHandler<HTMLSpanElement>,onDragCapture : DragEventHandler<HTMLSpanElement>,onDragEnd : DragEventHandler<HTMLSpanElement>,onDragEndCapture : DragEventHandler<HTMLSpanElement>,onDragEnter : DragEventHandler<HTMLSpanElement>,onDragEnterCapture : DragEventHandler<HTMLSpanElement>,onDragExit : DragEventHandler<HTMLSpanElement>,onDragExitCapture : DragEventHandler<HTMLSpanElement>,onDragLeave : DragEventHandler<HTMLSpanElement>,onDragLeaveCapture : DragEventHandler<HTMLSpanElement>,onDragOver : DragEventHandler<HTMLSpanElement>,onDragOverCapture : DragEventHandler<HTMLSpanElement>,onDragStart : DragEventHandler<HTMLSpanElement>,onDragStartCapture : DragEventHandler<HTMLSpanElement>,onDrop : DragEventHandler<HTMLSpanElement>,onDropCapture : DragEventHandler<HTMLSpanElement>,onDurationChange : ReactEventHandler<HTMLSpanElement>,onDurationChangeCapture : ReactEventHandler<HTMLSpanElement>,onEmptied : ReactEventHandler<HTMLSpanElement>,onEmptiedCapture : ReactEventHandler<HTMLSpanElement>,onEncrypted : ReactEventHandler<HTMLSpanElement>,onEncryptedCapture : ReactEventHandler<HTMLSpanElement>,onEnded : ReactEventHandler<HTMLSpanElement>,onEndedCapture : ReactEventHandler<HTMLSpanElement>,onError : ReactEventHandler<HTMLSpanElement>,onErrorCapture : ReactEventHandler<HTMLSpanElement>,onFocus : FocusEventHandler<HTMLSpanElement>,onFocusCapture : FocusEventHandler<HTMLSpanElement>,onGotPointerCapture : PointerEventHandler<HTMLSpanElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onInput : FormEventHandler<HTMLSpanElement>,onInputCapture : FormEventHandler<HTMLSpanElement>,onInvalid : FormEventHandler<HTMLSpanElement>,onInvalidCapture : FormEventHandler<HTMLSpanElement>,onKeyDown : KeyboardEventHandler<HTMLSpanElement>,onKeyDownCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyPress : KeyboardEventHandler<HTMLSpanElement>,onKeyPressCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyUp : KeyboardEventHandler<HTMLSpanElement>,onKeyUpCapture : KeyboardEventHandler<HTMLSpanElement>,onLoad : ReactEventHandler<HTMLSpanElement>,onLoadCapture : ReactEventHandler<HTMLSpanElement>,onLoadedData : ReactEventHandler<HTMLSpanElement>,onLoadedDataCapture : ReactEventHandler<HTMLSpanElement>,onLoadedMetadata : ReactEventHandler<HTMLSpanElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLSpanElement>,onLoadStart : ReactEventHandler<HTMLSpanElement>,onLoadStartCapture : ReactEventHandler<HTMLSpanElement>,onLostPointerCapture : PointerEventHandler<HTMLSpanElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onMouseDown : MouseEventHandler<HTMLSpanElement>,onMouseDownCapture : MouseEventHandler<HTMLSpanElement>,onMouseEnter : MouseEventHandler<HTMLSpanElement>,onMouseLeave : MouseEventHandler<HTMLSpanElement>,onMouseMove : MouseEventHandler<HTMLSpanElement>,onMouseMoveCapture : MouseEventHandler<HTMLSpanElement>,onMouseOut : MouseEventHandler<HTMLSpanElement>,onMouseOutCapture : MouseEventHandler<HTMLSpanElement>,onMouseOver : MouseEventHandler<HTMLSpanElement>,onMouseOverCapture : MouseEventHandler<HTMLSpanElement>,onMouseUp : MouseEventHandler<HTMLSpanElement>,onMouseUpCapture : MouseEventHandler<HTMLSpanElement>,onPaste : ClipboardEventHandler<HTMLSpanElement>,onPasteCapture : ClipboardEventHandler<HTMLSpanElement>,onPause : ReactEventHandler<HTMLSpanElement>,onPauseCapture : ReactEventHandler<HTMLSpanElement>,onPlay : ReactEventHandler<HTMLSpanElement>,onPlayCapture : ReactEventHandler<HTMLSpanElement>,onPlaying : ReactEventHandler<HTMLSpanElement>,onPlayingCapture : ReactEventHandler<HTMLSpanElement>,onPointerCancel : PointerEventHandler<HTMLSpanElement>,onPointerCancelCapture : PointerEventHandler<HTMLSpanElement>,onPointerDown : PointerEventHandler<HTMLSpanElement>,onPointerDownCapture : PointerEventHandler<HTMLSpanElement>,onPointerEnter : PointerEventHandler<HTMLSpanElement>,onPointerLeave : PointerEventHandler<HTMLSpanElement>,onPointerMove : PointerEventHandler<HTMLSpanElement>,onPointerMoveCapture : PointerEventHandler<HTMLSpanElement>,onPointerOut : PointerEventHandler<HTMLSpanElement>,onPointerOutCapture : PointerEventHandler<HTMLSpanElement>,onPointerOver : PointerEventHandler<HTMLSpanElement>,onPointerOverCapture : PointerEventHandler<HTMLSpanElement>,onPointerUp : PointerEventHandler<HTMLSpanElement>,onPointerUpCapture : PointerEventHandler<HTMLSpanElement>,onProgress : ReactEventHandler<HTMLSpanElement>,onProgressCapture : ReactEventHandler<HTMLSpanElement>,onRateChange : ReactEventHandler<HTMLSpanElement>,onRateChangeCapture : ReactEventHandler<HTMLSpanElement>,onReset : FormEventHandler<HTMLSpanElement>,onResetCapture : FormEventHandler<HTMLSpanElement>,onResize : ReactEventHandler<HTMLSpanElement>,onResizeCapture : ReactEventHandler<HTMLSpanElement>,onScroll : UIEventHandler<HTMLSpanElement>,onScrollCapture : UIEventHandler<HTMLSpanElement>,onSeeked : ReactEventHandler<HTMLSpanElement>,onSeekedCapture : ReactEventHandler<HTMLSpanElement>,onSeeking : ReactEventHandler<HTMLSpanElement>,onSeekingCapture : ReactEventHandler<HTMLSpanElement>,onSelect : ReactEventHandler<HTMLSpanElement>,onSelectCapture : ReactEventHandler<HTMLSpanElement>,onStalled : ReactEventHandler<HTMLSpanElement>,onStalledCapture : ReactEventHandler<HTMLSpanElement>,onSubmit : FormEventHandler<HTMLSpanElement>,onSubmitCapture : FormEventHandler<HTMLSpanElement>,onSuspend : ReactEventHandler<HTMLSpanElement>,onSuspendCapture : ReactEventHandler<HTMLSpanElement>,onTimeUpdate : ReactEventHandler<HTMLSpanElement>,onTimeUpdateCapture : ReactEventHandler<HTMLSpanElement>,onToggle : ToggleEventHandler<HTMLSpanElement>,onTouchCancel : TouchEventHandler<HTMLSpanElement>,onTouchCancelCapture : TouchEventHandler<HTMLSpanElement>,onTouchEnd : TouchEventHandler<HTMLSpanElement>,onTouchEndCapture : TouchEventHandler<HTMLSpanElement>,onTouchMove : TouchEventHandler<HTMLSpanElement>,onTouchMoveCapture : TouchEventHandler<HTMLSpanElement>,onTouchStart : TouchEventHandler<HTMLSpanElement>,onTouchStartCapture : TouchEventHandler<HTMLSpanElement>,onTransitionCancel : TransitionEventHandler<HTMLSpanElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionEnd : TransitionEventHandler<HTMLSpanElement>,onTransitionEndCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionRun : TransitionEventHandler<HTMLSpanElement>,onTransitionRunCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionStart : TransitionEventHandler<HTMLSpanElement>,onTransitionStartCapture : TransitionEventHandler<HTMLSpanElement>,onVolumeChange : ReactEventHandler<HTMLSpanElement>,onVolumeChangeCapture : ReactEventHandler<HTMLSpanElement>,onWaiting : ReactEventHandler<HTMLSpanElement>,onWaitingCapture : ReactEventHandler<HTMLSpanElement>,onWheel : WheelEventHandler<HTMLSpanElement>,onWheelCapture : WheelEventHandler<HTMLSpanElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,queryOptions : Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">,radioGroup : string,rel : string,resource : string,results : number,rev : string,role : AriaRole,security : string,slot : string,spellCheck : Booleanish,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,tabIndex : number,title : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",vocab : string}

`

##### about

`type about = string;

`

##### accessKey

`type accessKey = string;

`

##### aria-activedescendant

 Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application.

`type aria-activedescendant = string

`

##### aria-atomic

 Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute.

`type aria-atomic = Booleanish

`

##### aria-autocomplete

 Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be presented if they are made.

`type aria-autocomplete = "inline" | "none" | "list" | "both"

`

##### aria-braillelabel

 Defines a string value that labels the current element, which is intended to be converted into Braille.

 aria-label.

`type aria-braillelabel = string

`

##### aria-brailleroledescription

 Defines a human-readable, author-localized abbreviated description for the role of an element, which is intended to be converted into Braille.

 aria-roledescription.

`type aria-brailleroledescription = string

`

##### aria-busy

`type aria-busy = Booleanish

`

##### aria-checked

 Indicates the current "checked" state of checkboxes, radio buttons, and other widgets.

* aria-pressed
* aria-selected.

`type aria-checked = boolean | "false" | "true" | "mixed"

`

##### aria-colcount

 Defines the total number of columns in a table, grid, or treegrid.

 aria-colindex.

`type aria-colcount = number

`

##### aria-colindex

 Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid.

* aria-colcount
* aria-colspan.

`type aria-colindex = number

`

##### aria-colindextext

 Defines a human readable text alternative of aria-colindex.

 aria-rowindextext.

`type aria-colindextext = string

`

##### aria-colspan

 Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-colindex
* aria-rowspan.

`type aria-colspan = number

`

##### aria-controls

 Identifies the element (or elements) whose contents or presence are controlled by the current element.

 aria-owns.

`type aria-controls = string

`

##### aria-current

 Indicates the element that represents the current item within a container or set of related elements.

`type aria-current = boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date"

`

##### aria-describedby

 Identifies the element (or elements) that describes the object.

 aria-labelledby

`type aria-describedby = string

`

##### aria-description

 Defines a string value that describes or annotates the current element.

 related aria-describedby.

`type aria-description = string

`

##### aria-details

 Identifies the element that provides a detailed, extended description for the object.

 aria-describedby.

`type aria-details = string

`

##### aria-disabled

 Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable.

* aria-hidden
* aria-readonly.

`type aria-disabled = Booleanish

`

##### aria-dropeffect

Deprecated

 in ARIA 1.1

 Indicates what functions can be performed when a dragged object is released on the drop target.

`type aria-dropeffect = "link" | "popup" | "execute" | "none" | "copy" | "move"

`

##### aria-errormessage

 Identifies the element that provides an error message for the object.

* aria-invalid
* aria-describedby.

`type aria-errormessage = string

`

##### aria-expanded

 Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed.

`type aria-expanded = Booleanish

`

##### aria-flowto

 Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion, allows assistive technology to override the general default of reading in document source order.

`type aria-flowto = string

`

##### aria-grabbed

Deprecated

 in ARIA 1.1

 Indicates an element's "grabbed" state in a drag-and-drop operation.

`type aria-grabbed = Booleanish

`

##### aria-haspopup

 Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element.

`type aria-haspopup = boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree"

`

##### aria-hidden

 Indicates whether the element is exposed to an accessibility API.

 aria-disabled.

`type aria-hidden = Booleanish

`

##### aria-invalid

 Indicates the entered value does not conform to the format expected by the application.

 aria-errormessage.

`type aria-invalid = boolean | "false" | "true" | "grammar" | "spelling"

`

##### aria-keyshortcuts

 Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element.

`type aria-keyshortcuts = string

`

##### aria-label

 Defines a string value that labels the current element.

 aria-labelledby.

`type aria-label = string

`

##### aria-labelledby

 Identifies the element (or elements) that labels the current element.

 aria-describedby.

`type aria-labelledby = string

`

##### aria-level

 Defines the hierarchical level of an element within a structure.

`type aria-level = number

`

##### aria-live

 Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region.

`type aria-live = "off" | "polite" | "assertive"

`

##### aria-modal

 Indicates whether an element is modal when displayed.

`type aria-modal = Booleanish

`

##### aria-multiline

 Indicates whether a text box accepts multiple lines of input or only a single line.

`type aria-multiline = Booleanish

`

##### aria-multiselectable

 Indicates that the user may select more than one item from the current selectable descendants.

`type aria-multiselectable = Booleanish

`

##### aria-orientation

 Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous.

`type aria-orientation = "horizontal" | "vertical"

`

##### aria-owns

 Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship between DOM elements where the DOM hierarchy cannot be used to represent the relationship.

 aria-controls.

`type aria-owns = string

`

##### aria-placeholder

 Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value. A hint could be a sample value or a brief description of the expected format.

`type aria-placeholder = string

`

##### aria-posinset

 Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-setsize.

`type aria-posinset = number

`

##### aria-pressed

 Indicates the current "pressed" state of toggle buttons.

* aria-checked
* aria-selected.

`type aria-pressed = boolean | "false" | "true" | "mixed"

`

##### aria-readonly

 Indicates that the element is not editable, but is otherwise operable.

 aria-disabled.

`type aria-readonly = Booleanish

`

##### aria-relevant

 Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified.

 aria-atomic.

`type aria-relevant = "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals"

`

##### aria-required

 Indicates that user input is required on the element before a form may be submitted.

`type aria-required = Booleanish

`

##### aria-roledescription

 Defines a human-readable, author-localized description for the role of an element.

`type aria-roledescription = string

`

##### aria-rowcount

 Defines the total number of rows in a table, grid, or treegrid.

 aria-rowindex.

`type aria-rowcount = number

`

##### aria-rowindex

 Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid.

* aria-rowcount
* aria-rowspan.

`type aria-rowindex = number

`

##### aria-rowindextext

 Defines a human readable text alternative of aria-rowindex.

 aria-colindextext.

`type aria-rowindextext = string

`

##### aria-rowspan

 Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-rowindex
* aria-colspan.

`type aria-rowspan = number

`

##### aria-selected

 Indicates the current "selected" state of various widgets.

* aria-checked
* aria-pressed.

`type aria-selected = Booleanish

`

##### aria-setsize

 Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-posinset.

`type aria-setsize = number

`

##### aria-sort

 Indicates if items in a table or grid are sorted in ascending or descending order.

`type aria-sort = "none" | "ascending" | "descending" | "other"

`

##### aria-valuemax

 Defines the maximum allowed value for a range widget.

`type aria-valuemax = number

`

##### aria-valuemin

 Defines the minimum allowed value for a range widget.

`type aria-valuemin = number

`

##### aria-valuenow

 Defines the current value for a range widget.

 aria-valuetext.

`type aria-valuenow = number

`

##### aria-valuetext

 Defines the human readable text alternative of aria-valuenow for a range widget.

`type aria-valuetext = string

`

##### autoCapitalize

`type autoCapitalize =

| (string & {})

| "on"

| "off"

| "none"

| "sentences"

| "words"

| "characters";

`

##### autoCorrect

`type autoCorrect = string;

`

##### autoFocus

`type autoFocus = boolean;

`

##### autoSave

`type autoSave = string;

`

##### className

`type className = string;

`

##### color

`type color = string;

`

##### content

`type content = string;

`

##### contentEditable

`type contentEditable = "inherit" | Booleanish | "plaintext-only";

`

##### contextMenu

`type contextMenu = string;

`

##### dangerouslySetInnerHTML

`type dangerouslySetInnerHTML = { __html: string | TrustedHTML };

`

##### datatype

`type datatype = string;

`

##### defaultChecked

`type defaultChecked = boolean;

`

##### defaultValue

`type defaultValue = string | number | (readonly Array<string>)

`

##### dir

`type dir = string;

`

##### draggable

`type draggable = Booleanish;

`

##### enterKeyHint

`type enterKeyHint =

| "search"

| "done"

| "next"

| "send"

| "enter"

| "go"

| "previous";

`

##### fallbackComponent

 This component will be shown if the name fails to be retreived If not passed, the component will return `null` .

 You can/should pass a descriptive text/component to this prop, indicating that the name was not fetched succesfully

`type fallbackComponent = Element;

`

### Example

`<ChainName fallbackComponent={<span>Failed to load</span>} />;

`

##### formatFn

##### Signature

`function formatFn(str: string): string;

`

##### Parameters

##### str

###### Type

`let str: string;

`

##### Returns

##### Return Type

`let returnType: string;

`

##### hidden

`type hidden = boolean;

`

##### id

`type id = string;

`

##### inert

 https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert

`type inert = boolean;

`

##### inlist

`type inlist = any;

`

##### inputMode

 Hints at the type of data that might be entered by the user while editing the element or its contents

[ https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute](https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute)

`type inputMode =

| "search"

| "email"

| "url"

| "text"

| "none"

| "tel"

| "numeric"

| "decimal";

`

##### is

 Specify that a standard HTML element should behave like a defined custom built-in element

[ https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is](https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is)

`type is = string;

`

##### itemID

`type itemID = string;

`

##### itemProp

`type itemProp = string;

`

##### itemRef

`type itemRef = string;

`

##### itemScope

`type itemScope = boolean;

`

##### itemType

`type itemType = string;

`

##### lang

`type lang = string;

`

##### loadingComponent

 This component will be shown while the name of the chain is being fetched If not passed, the component will return `null` .

 You can/should pass a loading sign or spinner to this prop.

`type loadingComponent = Element;

`

### Example

`<ChainName loadingComponent={<Spinner />} />;

`

##### nameResolver

 This prop can be a string or a (async) function that resolves to a string, representing the name of the chain This is particularly useful if you already have a way to fetch the chain name.

`type nameResolver = string | (() => string) | (() => Promise<string>);

`

##### nonce

`type nonce = string;

`

##### onAbort

`type onAbort = ReactEventHandler<HTMLSpanElement>;

`

##### onAbortCapture

`type onAbortCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onAnimationEnd

`type onAnimationEnd = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationEndCapture

`type onAnimationEndCapture = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationIteration

`type onAnimationIteration = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationIterationCapture

`type onAnimationIterationCapture =

AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationStart

`type onAnimationStart = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationStartCapture

`type onAnimationStartCapture = AnimationEventHandler<HTMLSpanElement>;

`

##### onAuxClick

`type onAuxClick = MouseEventHandler<HTMLSpanElement>;

`

##### onAuxClickCapture

`type onAuxClickCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onBeforeInput

`type onBeforeInput = FormEventHandler<HTMLSpanElement>;

`

##### onBeforeInputCapture

`type onBeforeInputCapture = FormEventHandler<HTMLSpanElement>;

`

##### onBeforeToggle

`type onBeforeToggle = ToggleEventHandler<HTMLSpanElement>;

`

##### onBlur

`type onBlur = FocusEventHandler<HTMLSpanElement>;

`

##### onBlurCapture

`type onBlurCapture = FocusEventHandler<HTMLSpanElement>;

`

##### onCanPlay

`type onCanPlay = ReactEventHandler<HTMLSpanElement>;

`

##### onCanPlayCapture

`type onCanPlayCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onCanPlayThrough

`type onCanPlayThrough = ReactEventHandler<HTMLSpanElement>;

`

##### onCanPlayThroughCapture

`type onCanPlayThroughCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onChange

`type onChange = FormEventHandler<HTMLSpanElement>;

`

##### onChangeCapture

`type onChangeCapture = FormEventHandler<HTMLSpanElement>;

`

##### onClick

`type onClick = MouseEventHandler<HTMLSpanElement>;

`

##### onClickCapture

`type onClickCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onCompositionEnd

`type onCompositionEnd = CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionEndCapture

`type onCompositionEndCapture =

CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionStart

`type onCompositionStart = CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionStartCapture

`type onCompositionStartCapture =

CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionUpdate

`type onCompositionUpdate = CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionUpdateCapture

`type onCompositionUpdateCapture =

CompositionEventHandler<HTMLSpanElement>;

`

##### onContextMenu

`type onContextMenu = MouseEventHandler<HTMLSpanElement>;

`

##### onContextMenuCapture

`type onContextMenuCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onCopy

`type onCopy = ClipboardEventHandler<HTMLSpanElement>;

`

##### onCopyCapture

`type onCopyCapture = ClipboardEventHandler<HTMLSpanElement>;

`

##### onCut

`type onCut = ClipboardEventHandler<HTMLSpanElement>;

`

##### onCutCapture

`type onCutCapture = ClipboardEventHandler<HTMLSpanElement>;

`

##### onDoubleClick

`type onDoubleClick = MouseEventHandler<HTMLSpanElement>;

`

##### onDoubleClickCapture

`type onDoubleClickCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onDrag

`type onDrag = DragEventHandler<HTMLSpanElement>;

`

##### onDragCapture

`type onDragCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragEnd

`type onDragEnd = DragEventHandler<HTMLSpanElement>;

`

##### onDragEndCapture

`type onDragEndCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragEnter

`type onDragEnter = DragEventHandler<HTMLSpanElement>;

`

##### onDragEnterCapture

`type onDragEnterCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragExit

`type onDragExit = DragEventHandler<HTMLSpanElement>;

`

##### onDragExitCapture

`type onDragExitCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragLeave

`type onDragLeave = DragEventHandler<HTMLSpanElement>;

`

##### onDragLeaveCapture

`type onDragLeaveCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragOver

`type onDragOver = DragEventHandler<HTMLSpanElement>;

`

##### onDragOverCapture

`type onDragOverCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragStart

`type onDragStart = DragEventHandler<HTMLSpanElement>;

`

##### onDragStartCapture

`type onDragStartCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDrop

`type onDrop = DragEventHandler<HTMLSpanElement>;

`

##### onDropCapture

`type onDropCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDurationChange

`type onDurationChange = ReactEventHandler<HTMLSpanElement>;

`

##### onDurationChangeCapture

`type onDurationChangeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onEmptied

`type onEmptied = ReactEventHandler<HTMLSpanElement>;

`

##### onEmptiedCapture

`type onEmptiedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onEncrypted

`type onEncrypted = ReactEventHandler<HTMLSpanElement>;

`

##### onEncryptedCapture

`type onEncryptedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onEnded

`type onEnded = ReactEventHandler<HTMLSpanElement>;

`

##### onEndedCapture

`type onEndedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onError

`type onError = ReactEventHandler<HTMLSpanElement>;

`

##### onErrorCapture

`type onErrorCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onFocus

`type onFocus = FocusEventHandler<HTMLSpanElement>;

`

##### onFocusCapture

`type onFocusCapture = FocusEventHandler<HTMLSpanElement>;

`

##### onGotPointerCapture

`type onGotPointerCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onGotPointerCaptureCapture

`type onGotPointerCaptureCapture =

PointerEventHandler<HTMLSpanElement>;

`

##### onInput

`type onInput = FormEventHandler<HTMLSpanElement>;

`

##### onInputCapture

`type onInputCapture = FormEventHandler<HTMLSpanElement>;

`

##### onInvalid

`type onInvalid = FormEventHandler<HTMLSpanElement>;

`

##### onInvalidCapture

`type onInvalidCapture = FormEventHandler<HTMLSpanElement>;

`

##### onKeyDown

`type onKeyDown = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyDownCapture

`type onKeyDownCapture = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyPress

Deprecated

 Use `onKeyUp` or `onKeyDown` instead

`type onKeyPress = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyPressCapture

Deprecated

 Use `onKeyUpCapture` or `onKeyDownCapture` instead

`type onKeyPressCapture = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyUp

`type onKeyUp = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyUpCapture

`type onKeyUpCapture = KeyboardEventHandler<HTMLSpanElement>;

`

##### onLoad

`type onLoad = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadCapture

`type onLoadCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedData

`type onLoadedData = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedDataCapture

`type onLoadedDataCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedMetadata

`type onLoadedMetadata = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedMetadataCapture

`type onLoadedMetadataCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadStart

`type onLoadStart = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadStartCapture

`type onLoadStartCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLostPointerCapture

`type onLostPointerCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onLostPointerCaptureCapture

`type onLostPointerCaptureCapture =

PointerEventHandler<HTMLSpanElement>;

`

##### onMouseDown

`type onMouseDown = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseDownCapture

`type onMouseDownCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseEnter

`type onMouseEnter = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseLeave

`type onMouseLeave = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseMove

`type onMouseMove = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseMoveCapture

`type onMouseMoveCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOut

`type onMouseOut = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOutCapture

`type onMouseOutCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOver

`type onMouseOver = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOverCapture

`type onMouseOverCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseUp

`type onMouseUp = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseUpCapture

`type onMouseUpCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onPaste

`type onPaste = ClipboardEventHandler<HTMLSpanElement>;

`

##### onPasteCapture

`type onPasteCapture = ClipboardEventHandler<HTMLSpanElement>;

`

##### onPause

`type onPause = ReactEventHandler<HTMLSpanElement>;

`

##### onPauseCapture

`type onPauseCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onPlay

`type onPlay = ReactEventHandler<HTMLSpanElement>;

`

##### onPlayCapture

`type onPlayCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onPlaying

`type onPlaying = ReactEventHandler<HTMLSpanElement>;

`

##### onPlayingCapture

`type onPlayingCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onPointerCancel

`type onPointerCancel = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerCancelCapture

`type onPointerCancelCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerDown

`type onPointerDown = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerDownCapture

`type onPointerDownCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerEnter

`type onPointerEnter = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerLeave

`type onPointerLeave = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerMove

`type onPointerMove = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerMoveCapture

`type onPointerMoveCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOut

`type onPointerOut = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOutCapture

`type onPointerOutCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOver

`type onPointerOver = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOverCapture

`type onPointerOverCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerUp

`type onPointerUp = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerUpCapture

`type onPointerUpCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onProgress

`type onProgress = ReactEventHandler<HTMLSpanElement>;

`

##### onProgressCapture

`type onProgressCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onRateChange

`type onRateChange = ReactEventHandler<HTMLSpanElement>;

`

##### onRateChangeCapture

`type onRateChangeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onReset

`type onReset = FormEventHandler<HTMLSpanElement>;

`

##### onResetCapture

`type onResetCapture = FormEventHandler<HTMLSpanElement>;

`

##### onResize

`type onResize = ReactEventHandler<HTMLSpanElement>;

`

##### onResizeCapture

`type onResizeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onScroll

`type onScroll = UIEventHandler<HTMLSpanElement>;

`

##### onScrollCapture

`type onScrollCapture = UIEventHandler<HTMLSpanElement>;

`

##### onSeeked

`type onSeeked = ReactEventHandler<HTMLSpanElement>;

`

##### onSeekedCapture

`type onSeekedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onSeeking

`type onSeeking = ReactEventHandler<HTMLSpanElement>;

`

##### onSeekingCapture

`type onSeekingCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onSelect

`type onSelect = ReactEventHandler<HTMLSpanElement>;

`

##### onSelectCapture

`type onSelectCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onStalled

`type onStalled = ReactEventHandler<HTMLSpanElement>;

`

##### onStalledCapture

`type onStalledCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onSubmit

`type onSubmit = FormEventHandler<HTMLSpanElement>;

`

##### onSubmitCapture

`type onSubmitCapture = FormEventHandler<HTMLSpanElement>;

`

##### onSuspend

`type onSuspend = ReactEventHandler<HTMLSpanElement>;

`

##### onSuspendCapture

`type onSuspendCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onTimeUpdate

`type onTimeUpdate = ReactEventHandler<HTMLSpanElement>;

`

##### onTimeUpdateCapture

`type onTimeUpdateCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onToggle

`type onToggle = ToggleEventHandler<HTMLSpanElement>;

`

##### onTouchCancel

`type onTouchCancel = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchCancelCapture

`type onTouchCancelCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchEnd

`type onTouchEnd = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchEndCapture

`type onTouchEndCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchMove

`type onTouchMove = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchMoveCapture

`type onTouchMoveCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchStart

`type onTouchStart = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchStartCapture

`type onTouchStartCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTransitionCancel

`type onTransitionCancel = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionCancelCapture

`type onTransitionCancelCapture =

TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionEnd

`type onTransitionEnd = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionEndCapture

`type onTransitionEndCapture = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionRun

`type onTransitionRun = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionRunCapture

`type onTransitionRunCapture = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionStart

`type onTransitionStart = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionStartCapture

`type onTransitionStartCapture =

TransitionEventHandler<HTMLSpanElement>;

`

##### onVolumeChange

`type onVolumeChange = ReactEventHandler<HTMLSpanElement>;

`

##### onVolumeChangeCapture

`type onVolumeChangeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onWaiting

`type onWaiting = ReactEventHandler<HTMLSpanElement>;

`

##### onWaitingCapture

`type onWaitingCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onWheel

`type onWheel = WheelEventHandler<HTMLSpanElement>;

`

##### onWheelCapture

`type onWheelCapture = WheelEventHandler<HTMLSpanElement>;

`

##### popover

`type popover = "" | "auto" | "manual";

`

##### popoverTarget

`type popoverTarget = string;

`

##### popoverTargetAction

`type popoverTargetAction = "toggle" | "hide" | "show";

`

##### prefix

`type prefix = string;

`

##### property

`type property = string;

`

##### queryOptions

 Optional `useQuery` params

`type queryOptions = Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">

`

##### radioGroup

`type radioGroup = string;

`

##### rel

`type rel = string;

`

##### resource

`type resource = string;

`

##### results

`type results = number;

`

##### rev

`type rev = string;

`

##### role

`type role = AriaRole;

`

##### security

`type security = string;

`

##### slot

`type slot = string;

`

##### spellCheck

`type spellCheck = Booleanish;

`

##### style

`type style = CSSProperties;

`

##### suppressContentEditableWarning

`type suppressContentEditableWarning = boolean;

`

##### suppressHydrationWarning

`type suppressHydrationWarning = boolean;

`

##### tabIndex

`type tabIndex = number;

`

##### title

`type title = string;

`

##### translate

`type translate = "yes" | "no";

`

##### typeof

`type typeof = string

`

##### unselectable

`type unselectable = "on" | "off";

`

##### vocab

`type vocab = string;

`
## NFTNameProps

`interface NFTNameProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, "children"> {about : string,accessKey : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,className : string,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",fallbackComponent : Element,hidden : boolean,id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,loadingComponent : Element,nameResolver : string | (() => string) | (() => Promise<string>),nonce : string,onAbort : ReactEventHandler<HTMLSpanElement>,onAbortCapture : ReactEventHandler<HTMLSpanElement>,onAnimationEnd : AnimationEventHandler<HTMLSpanElement>,onAnimationEndCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationIteration : AnimationEventHandler<HTMLSpanElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationStart : AnimationEventHandler<HTMLSpanElement>,onAnimationStartCapture : AnimationEventHandler<HTMLSpanElement>,onAuxClick : MouseEventHandler<HTMLSpanElement>,onAuxClickCapture : MouseEventHandler<HTMLSpanElement>,onBeforeInput : FormEventHandler<HTMLSpanElement>,onBeforeInputCapture : FormEventHandler<HTMLSpanElement>,onBeforeToggle : ToggleEventHandler<HTMLSpanElement>,onBlur : FocusEventHandler<HTMLSpanElement>,onBlurCapture : FocusEventHandler<HTMLSpanElement>,onCanPlay : ReactEventHandler<HTMLSpanElement>,onCanPlayCapture : ReactEventHandler<HTMLSpanElement>,onCanPlayThrough : ReactEventHandler<HTMLSpanElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLSpanElement>,onChange : FormEventHandler<HTMLSpanElement>,onChangeCapture : FormEventHandler<HTMLSpanElement>,onClick : MouseEventHandler<HTMLSpanElement>,onClickCapture : MouseEventHandler<HTMLSpanElement>,onCompositionEnd : CompositionEventHandler<HTMLSpanElement>,onCompositionEndCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionStart : CompositionEventHandler<HTMLSpanElement>,onCompositionStartCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdate : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLSpanElement>,onContextMenu : MouseEventHandler<HTMLSpanElement>,onContextMenuCapture : MouseEventHandler<HTMLSpanElement>,onCopy : ClipboardEventHandler<HTMLSpanElement>,onCopyCapture : ClipboardEventHandler<HTMLSpanElement>,onCut : ClipboardEventHandler<HTMLSpanElement>,onCutCapture : ClipboardEventHandler<HTMLSpanElement>,onDoubleClick : MouseEventHandler<HTMLSpanElement>,onDoubleClickCapture : MouseEventHandler<HTMLSpanElement>,onDrag : DragEventHandler<HTMLSpanElement>,onDragCapture : DragEventHandler<HTMLSpanElement>,onDragEnd : DragEventHandler<HTMLSpanElement>,onDragEndCapture : DragEventHandler<HTMLSpanElement>,onDragEnter : DragEventHandler<HTMLSpanElement>,onDragEnterCapture : DragEventHandler<HTMLSpanElement>,onDragExit : DragEventHandler<HTMLSpanElement>,onDragExitCapture : DragEventHandler<HTMLSpanElement>,onDragLeave : DragEventHandler<HTMLSpanElement>,onDragLeaveCapture : DragEventHandler<HTMLSpanElement>,onDragOver : DragEventHandler<HTMLSpanElement>,onDragOverCapture : DragEventHandler<HTMLSpanElement>,onDragStart : DragEventHandler<HTMLSpanElement>,onDragStartCapture : DragEventHandler<HTMLSpanElement>,onDrop : DragEventHandler<HTMLSpanElement>,onDropCapture : DragEventHandler<HTMLSpanElement>,onDurationChange : ReactEventHandler<HTMLSpanElement>,onDurationChangeCapture : ReactEventHandler<HTMLSpanElement>,onEmptied : ReactEventHandler<HTMLSpanElement>,onEmptiedCapture : ReactEventHandler<HTMLSpanElement>,onEncrypted : ReactEventHandler<HTMLSpanElement>,onEncryptedCapture : ReactEventHandler<HTMLSpanElement>,onEnded : ReactEventHandler<HTMLSpanElement>,onEndedCapture : ReactEventHandler<HTMLSpanElement>,onError : ReactEventHandler<HTMLSpanElement>,onErrorCapture : ReactEventHandler<HTMLSpanElement>,onFocus : FocusEventHandler<HTMLSpanElement>,onFocusCapture : FocusEventHandler<HTMLSpanElement>,onGotPointerCapture : PointerEventHandler<HTMLSpanElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onInput : FormEventHandler<HTMLSpanElement>,onInputCapture : FormEventHandler<HTMLSpanElement>,onInvalid : FormEventHandler<HTMLSpanElement>,onInvalidCapture : FormEventHandler<HTMLSpanElement>,onKeyDown : KeyboardEventHandler<HTMLSpanElement>,onKeyDownCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyPress : KeyboardEventHandler<HTMLSpanElement>,onKeyPressCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyUp : KeyboardEventHandler<HTMLSpanElement>,onKeyUpCapture : KeyboardEventHandler<HTMLSpanElement>,onLoad : ReactEventHandler<HTMLSpanElement>,onLoadCapture : ReactEventHandler<HTMLSpanElement>,onLoadedData : ReactEventHandler<HTMLSpanElement>,onLoadedDataCapture : ReactEventHandler<HTMLSpanElement>,onLoadedMetadata : ReactEventHandler<HTMLSpanElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLSpanElement>,onLoadStart : ReactEventHandler<HTMLSpanElement>,onLoadStartCapture : ReactEventHandler<HTMLSpanElement>,onLostPointerCapture : PointerEventHandler<HTMLSpanElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onMouseDown : MouseEventHandler<HTMLSpanElement>,onMouseDownCapture : MouseEventHandler<HTMLSpanElement>,onMouseEnter : MouseEventHandler<HTMLSpanElement>,onMouseLeave : MouseEventHandler<HTMLSpanElement>,onMouseMove : MouseEventHandler<HTMLSpanElement>,onMouseMoveCapture : MouseEventHandler<HTMLSpanElement>,onMouseOut : MouseEventHandler<HTMLSpanElement>,onMouseOutCapture : MouseEventHandler<HTMLSpanElement>,onMouseOver : MouseEventHandler<HTMLSpanElement>,onMouseOverCapture : MouseEventHandler<HTMLSpanElement>,onMouseUp : MouseEventHandler<HTMLSpanElement>,onMouseUpCapture : MouseEventHandler<HTMLSpanElement>,onPaste : ClipboardEventHandler<HTMLSpanElement>,onPasteCapture : ClipboardEventHandler<HTMLSpanElement>,onPause : ReactEventHandler<HTMLSpanElement>,onPauseCapture : ReactEventHandler<HTMLSpanElement>,onPlay : ReactEventHandler<HTMLSpanElement>,onPlayCapture : ReactEventHandler<HTMLSpanElement>,onPlaying : ReactEventHandler<HTMLSpanElement>,onPlayingCapture : ReactEventHandler<HTMLSpanElement>,onPointerCancel : PointerEventHandler<HTMLSpanElement>,onPointerCancelCapture : PointerEventHandler<HTMLSpanElement>,onPointerDown : PointerEventHandler<HTMLSpanElement>,onPointerDownCapture : PointerEventHandler<HTMLSpanElement>,onPointerEnter : PointerEventHandler<HTMLSpanElement>,onPointerLeave : PointerEventHandler<HTMLSpanElement>,onPointerMove : PointerEventHandler<HTMLSpanElement>,onPointerMoveCapture : PointerEventHandler<HTMLSpanElement>,onPointerOut : PointerEventHandler<HTMLSpanElement>,onPointerOutCapture : PointerEventHandler<HTMLSpanElement>,onPointerOver : PointerEventHandler<HTMLSpanElement>,onPointerOverCapture : PointerEventHandler<HTMLSpanElement>,onPointerUp : PointerEventHandler<HTMLSpanElement>,onPointerUpCapture : PointerEventHandler<HTMLSpanElement>,onProgress : ReactEventHandler<HTMLSpanElement>,onProgressCapture : ReactEventHandler<HTMLSpanElement>,onRateChange : ReactEventHandler<HTMLSpanElement>,onRateChangeCapture : ReactEventHandler<HTMLSpanElement>,onReset : FormEventHandler<HTMLSpanElement>,onResetCapture : FormEventHandler<HTMLSpanElement>,onResize : ReactEventHandler<HTMLSpanElement>,onResizeCapture : ReactEventHandler<HTMLSpanElement>,onScroll : UIEventHandler<HTMLSpanElement>,onScrollCapture : UIEventHandler<HTMLSpanElement>,onSeeked : ReactEventHandler<HTMLSpanElement>,onSeekedCapture : ReactEventHandler<HTMLSpanElement>,onSeeking : ReactEventHandler<HTMLSpanElement>,onSeekingCapture : ReactEventHandler<HTMLSpanElement>,onSelect : ReactEventHandler<HTMLSpanElement>,onSelectCapture : ReactEventHandler<HTMLSpanElement>,onStalled : ReactEventHandler<HTMLSpanElement>,onStalledCapture : ReactEventHandler<HTMLSpanElement>,onSubmit : FormEventHandler<HTMLSpanElement>,onSubmitCapture : FormEventHandler<HTMLSpanElement>,onSuspend : ReactEventHandler<HTMLSpanElement>,onSuspendCapture : ReactEventHandler<HTMLSpanElement>,onTimeUpdate : ReactEventHandler<HTMLSpanElement>,onTimeUpdateCapture : ReactEventHandler<HTMLSpanElement>,onToggle : ToggleEventHandler<HTMLSpanElement>,onTouchCancel : TouchEventHandler<HTMLSpanElement>,onTouchCancelCapture : TouchEventHandler<HTMLSpanElement>,onTouchEnd : TouchEventHandler<HTMLSpanElement>,onTouchEndCapture : TouchEventHandler<HTMLSpanElement>,onTouchMove : TouchEventHandler<HTMLSpanElement>,onTouchMoveCapture : TouchEventHandler<HTMLSpanElement>,onTouchStart : TouchEventHandler<HTMLSpanElement>,onTouchStartCapture : TouchEventHandler<HTMLSpanElement>,onTransitionCancel : TransitionEventHandler<HTMLSpanElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionEnd : TransitionEventHandler<HTMLSpanElement>,onTransitionEndCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionRun : TransitionEventHandler<HTMLSpanElement>,onTransitionRunCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionStart : TransitionEventHandler<HTMLSpanElement>,onTransitionStartCapture : TransitionEventHandler<HTMLSpanElement>,onVolumeChange : ReactEventHandler<HTMLSpanElement>,onVolumeChangeCapture : ReactEventHandler<HTMLSpanElement>,onWaiting : ReactEventHandler<HTMLSpanElement>,onWaitingCapture : ReactEventHandler<HTMLSpanElement>,onWheel : WheelEventHandler<HTMLSpanElement>,onWheelCapture : WheelEventHandler<HTMLSpanElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,queryOptions : Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">,radioGroup : string,rel : string,resource : string,results : number,rev : string,role : AriaRole,security : string,slot : string,spellCheck : Booleanish,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,tabIndex : number,title : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",vocab : string}

`

##### about

`type about = string;

`

##### accessKey

`type accessKey = string;

`

##### aria-activedescendant

 Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application.

`type aria-activedescendant = string

`

##### aria-atomic

 Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute.

`type aria-atomic = Booleanish

`

##### aria-autocomplete

 Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be presented if they are made.

`type aria-autocomplete = "inline" | "none" | "list" | "both"

`

##### aria-braillelabel

 Defines a string value that labels the current element, which is intended to be converted into Braille.

 aria-label.

`type aria-braillelabel = string

`

##### aria-brailleroledescription

 Defines a human-readable, author-localized abbreviated description for the role of an element, which is intended to be converted into Braille.

 aria-roledescription.

`type aria-brailleroledescription = string

`

##### aria-busy

`type aria-busy = Booleanish

`

##### aria-checked

 Indicates the current "checked" state of checkboxes, radio buttons, and other widgets.

* aria-pressed
* aria-selected.

`type aria-checked = boolean | "false" | "true" | "mixed"

`

##### aria-colcount

 Defines the total number of columns in a table, grid, or treegrid.

 aria-colindex.

`type aria-colcount = number

`

##### aria-colindex

 Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid.

* aria-colcount
* aria-colspan.

`type aria-colindex = number

`

##### aria-colindextext

 Defines a human readable text alternative of aria-colindex.

 aria-rowindextext.

`type aria-colindextext = string

`

##### aria-colspan

 Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-colindex
* aria-rowspan.

`type aria-colspan = number

`

##### aria-controls

 Identifies the element (or elements) whose contents or presence are controlled by the current element.

 aria-owns.

`type aria-controls = string

`

##### aria-current

 Indicates the element that represents the current item within a container or set of related elements.

`type aria-current = boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date"

`

##### aria-describedby

 Identifies the element (or elements) that describes the object.

 aria-labelledby

`type aria-describedby = string

`

##### aria-description

 Defines a string value that describes or annotates the current element.

 related aria-describedby.

`type aria-description = string

`

##### aria-details

 Identifies the element that provides a detailed, extended description for the object.

 aria-describedby.

`type aria-details = string

`

##### aria-disabled

 Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable.

* aria-hidden
* aria-readonly.

`type aria-disabled = Booleanish

`

##### aria-dropeffect

Deprecated

 in ARIA 1.1

 Indicates what functions can be performed when a dragged object is released on the drop target.

`type aria-dropeffect = "link" | "popup" | "execute" | "none" | "copy" | "move"

`

##### aria-errormessage

 Identifies the element that provides an error message for the object.

* aria-invalid
* aria-describedby.

`type aria-errormessage = string

`

##### aria-expanded

 Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed.

`type aria-expanded = Booleanish

`

##### aria-flowto

 Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion, allows assistive technology to override the general default of reading in document source order.

`type aria-flowto = string

`

##### aria-grabbed

Deprecated

 in ARIA 1.1

 Indicates an element's "grabbed" state in a drag-and-drop operation.

`type aria-grabbed = Booleanish

`

##### aria-haspopup

 Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element.

`type aria-haspopup = boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree"

`

##### aria-hidden

 Indicates whether the element is exposed to an accessibility API.

 aria-disabled.

`type aria-hidden = Booleanish

`

##### aria-invalid

 Indicates the entered value does not conform to the format expected by the application.

 aria-errormessage.

`type aria-invalid = boolean | "false" | "true" | "grammar" | "spelling"

`

##### aria-keyshortcuts

 Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element.

`type aria-keyshortcuts = string

`

##### aria-label

 Defines a string value that labels the current element.

 aria-labelledby.

`type aria-label = string

`

##### aria-labelledby

 Identifies the element (or elements) that labels the current element.

 aria-describedby.

`type aria-labelledby = string

`

##### aria-level

 Defines the hierarchical level of an element within a structure.

`type aria-level = number

`

##### aria-live

 Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region.

`type aria-live = "off" | "polite" | "assertive"

`

##### aria-modal

 Indicates whether an element is modal when displayed.

`type aria-modal = Booleanish

`

##### aria-multiline

 Indicates whether a text box accepts multiple lines of input or only a single line.

`type aria-multiline = Booleanish

`

##### aria-multiselectable

 Indicates that the user may select more than one item from the current selectable descendants.

`type aria-multiselectable = Booleanish

`

##### aria-orientation

 Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous.

`type aria-orientation = "horizontal" | "vertical"

`

##### aria-owns

 Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship between DOM elements where the DOM hierarchy cannot be used to represent the relationship.

 aria-controls.

`type aria-owns = string

`

##### aria-placeholder

 Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value. A hint could be a sample value or a brief description of the expected format.

`type aria-placeholder = string

`

##### aria-posinset

 Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-setsize.

`type aria-posinset = number

`

##### aria-pressed

 Indicates the current "pressed" state of toggle buttons.

* aria-checked
* aria-selected.

`type aria-pressed = boolean | "false" | "true" | "mixed"

`

##### aria-readonly

 Indicates that the element is not editable, but is otherwise operable.

 aria-disabled.

`type aria-readonly = Booleanish

`

##### aria-relevant

 Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified.

 aria-atomic.

`type aria-relevant = "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals"

`

##### aria-required

 Indicates that user input is required on the element before a form may be submitted.

`type aria-required = Booleanish

`

##### aria-roledescription

 Defines a human-readable, author-localized description for the role of an element.

`type aria-roledescription = string

`

##### aria-rowcount

 Defines the total number of rows in a table, grid, or treegrid.

 aria-rowindex.

`type aria-rowcount = number

`

##### aria-rowindex

 Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid.

* aria-rowcount
* aria-rowspan.

`type aria-rowindex = number

`

##### aria-rowindextext

 Defines a human readable text alternative of aria-rowindex.

 aria-colindextext.

`type aria-rowindextext = string

`

##### aria-rowspan

 Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-rowindex
* aria-colspan.

`type aria-rowspan = number

`

##### aria-selected

 Indicates the current "selected" state of various widgets.

* aria-checked
* aria-pressed.

`type aria-selected = Booleanish

`

##### aria-setsize

 Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-posinset.

`type aria-setsize = number

`

##### aria-sort

 Indicates if items in a table or grid are sorted in ascending or descending order.

`type aria-sort = "none" | "ascending" | "descending" | "other"

`

##### aria-valuemax

 Defines the maximum allowed value for a range widget.

`type aria-valuemax = number

`

##### aria-valuemin

 Defines the minimum allowed value for a range widget.

`type aria-valuemin = number

`

##### aria-valuenow

 Defines the current value for a range widget.

 aria-valuetext.

`type aria-valuenow = number

`

##### aria-valuetext

 Defines the human readable text alternative of aria-valuenow for a range widget.

`type aria-valuetext = string

`

##### autoCapitalize

`type autoCapitalize =

| (string & {})

| "on"

| "off"

| "none"

| "sentences"

| "words"

| "characters";

`

##### autoCorrect

`type autoCorrect = string;

`

##### autoFocus

`type autoFocus = boolean;

`

##### autoSave

`type autoSave = string;

`

##### className

`type className = string;

`

##### color

`type color = string;

`

##### content

`type content = string;

`

##### contentEditable

`type contentEditable = "inherit" | Booleanish | "plaintext-only";

`

##### contextMenu

`type contextMenu = string;

`

##### dangerouslySetInnerHTML

`type dangerouslySetInnerHTML = { __html: string | TrustedHTML };

`

##### datatype

`type datatype = string;

`

##### defaultChecked

`type defaultChecked = boolean;

`

##### defaultValue

`type defaultValue = string | number | (readonly Array<string>)

`

##### dir

`type dir = string;

`

##### draggable

`type draggable = Booleanish;

`

##### enterKeyHint

`type enterKeyHint =

| "search"

| "done"

| "next"

| "send"

| "enter"

| "go"

| "previous";

`

##### fallbackComponent

`type fallbackComponent = Element;

`

##### hidden

`type hidden = boolean;

`

##### id

`type id = string;

`

##### inert

 https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert

`type inert = boolean;

`

##### inlist

`type inlist = any;

`

##### inputMode

 Hints at the type of data that might be entered by the user while editing the element or its contents

[ https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute](https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute)

`type inputMode =

| "search"

| "email"

| "url"

| "text"

| "none"

| "tel"

| "numeric"

| "decimal";

`

##### is

 Specify that a standard HTML element should behave like a defined custom built-in element

[ https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is](https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is)

`type is = string;

`

##### itemID

`type itemID = string;

`

##### itemProp

`type itemProp = string;

`

##### itemRef

`type itemRef = string;

`

##### itemScope

`type itemScope = boolean;

`

##### itemType

`type itemType = string;

`

##### lang

`type lang = string;

`

##### loadingComponent

`type loadingComponent = Element;

`

##### nameResolver

 This prop can be a string or a (async) function that resolves to a string, representing the name of the NFT This is particularly useful if you already have a way to fetch the name of the NFT.

`type nameResolver = string | (() => string) | (() => Promise<string>);

`

##### nonce

`type nonce = string;

`

##### onAbort

`type onAbort = ReactEventHandler<HTMLSpanElement>;

`

##### onAbortCapture

`type onAbortCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onAnimationEnd

`type onAnimationEnd = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationEndCapture

`type onAnimationEndCapture = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationIteration

`type onAnimationIteration = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationIterationCapture

`type onAnimationIterationCapture =

AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationStart

`type onAnimationStart = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationStartCapture

`type onAnimationStartCapture = AnimationEventHandler<HTMLSpanElement>;

`

##### onAuxClick

`type onAuxClick = MouseEventHandler<HTMLSpanElement>;

`

##### onAuxClickCapture

`type onAuxClickCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onBeforeInput

`type onBeforeInput = FormEventHandler<HTMLSpanElement>;

`

##### onBeforeInputCapture

`type onBeforeInputCapture = FormEventHandler<HTMLSpanElement>;

`

##### onBeforeToggle

`type onBeforeToggle = ToggleEventHandler<HTMLSpanElement>;

`

##### onBlur

`type onBlur = FocusEventHandler<HTMLSpanElement>;

`

##### onBlurCapture

`type onBlurCapture = FocusEventHandler<HTMLSpanElement>;

`

##### onCanPlay

`type onCanPlay = ReactEventHandler<HTMLSpanElement>;

`

##### onCanPlayCapture

`type onCanPlayCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onCanPlayThrough

`type onCanPlayThrough = ReactEventHandler<HTMLSpanElement>;

`

##### onCanPlayThroughCapture

`type onCanPlayThroughCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onChange

`type onChange = FormEventHandler<HTMLSpanElement>;

`

##### onChangeCapture

`type onChangeCapture = FormEventHandler<HTMLSpanElement>;

`

##### onClick

`type onClick = MouseEventHandler<HTMLSpanElement>;

`

##### onClickCapture

`type onClickCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onCompositionEnd

`type onCompositionEnd = CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionEndCapture

`type onCompositionEndCapture =

CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionStart

`type onCompositionStart = CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionStartCapture

`type onCompositionStartCapture =

CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionUpdate

`type onCompositionUpdate = CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionUpdateCapture

`type onCompositionUpdateCapture =

CompositionEventHandler<HTMLSpanElement>;

`

##### onContextMenu

`type onContextMenu = MouseEventHandler<HTMLSpanElement>;

`

##### onContextMenuCapture

`type onContextMenuCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onCopy

`type onCopy = ClipboardEventHandler<HTMLSpanElement>;

`

##### onCopyCapture

`type onCopyCapture = ClipboardEventHandler<HTMLSpanElement>;

`

##### onCut

`type onCut = ClipboardEventHandler<HTMLSpanElement>;

`

##### onCutCapture

`type onCutCapture = ClipboardEventHandler<HTMLSpanElement>;

`

##### onDoubleClick

`type onDoubleClick = MouseEventHandler<HTMLSpanElement>;

`

##### onDoubleClickCapture

`type onDoubleClickCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onDrag

`type onDrag = DragEventHandler<HTMLSpanElement>;

`

##### onDragCapture

`type onDragCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragEnd

`type onDragEnd = DragEventHandler<HTMLSpanElement>;

`

##### onDragEndCapture

`type onDragEndCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragEnter

`type onDragEnter = DragEventHandler<HTMLSpanElement>;

`

##### onDragEnterCapture

`type onDragEnterCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragExit

`type onDragExit = DragEventHandler<HTMLSpanElement>;

`

##### onDragExitCapture

`type onDragExitCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragLeave

`type onDragLeave = DragEventHandler<HTMLSpanElement>;

`

##### onDragLeaveCapture

`type onDragLeaveCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragOver

`type onDragOver = DragEventHandler<HTMLSpanElement>;

`

##### onDragOverCapture

`type onDragOverCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragStart

`type onDragStart = DragEventHandler<HTMLSpanElement>;

`

##### onDragStartCapture

`type onDragStartCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDrop

`type onDrop = DragEventHandler<HTMLSpanElement>;

`

##### onDropCapture

`type onDropCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDurationChange

`type onDurationChange = ReactEventHandler<HTMLSpanElement>;

`

##### onDurationChangeCapture

`type onDurationChangeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onEmptied

`type onEmptied = ReactEventHandler<HTMLSpanElement>;

`

##### onEmptiedCapture

`type onEmptiedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onEncrypted

`type onEncrypted = ReactEventHandler<HTMLSpanElement>;

`

##### onEncryptedCapture

`type onEncryptedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onEnded

`type onEnded = ReactEventHandler<HTMLSpanElement>;

`

##### onEndedCapture

`type onEndedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onError

`type onError = ReactEventHandler<HTMLSpanElement>;

`

##### onErrorCapture

`type onErrorCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onFocus

`type onFocus = FocusEventHandler<HTMLSpanElement>;

`

##### onFocusCapture

`type onFocusCapture = FocusEventHandler<HTMLSpanElement>;

`

##### onGotPointerCapture

`type onGotPointerCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onGotPointerCaptureCapture

`type onGotPointerCaptureCapture =

PointerEventHandler<HTMLSpanElement>;

`

##### onInput

`type onInput = FormEventHandler<HTMLSpanElement>;

`

##### onInputCapture

`type onInputCapture = FormEventHandler<HTMLSpanElement>;

`

##### onInvalid

`type onInvalid = FormEventHandler<HTMLSpanElement>;

`

##### onInvalidCapture

`type onInvalidCapture = FormEventHandler<HTMLSpanElement>;

`

##### onKeyDown

`type onKeyDown = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyDownCapture

`type onKeyDownCapture = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyPress

Deprecated

 Use `onKeyUp` or `onKeyDown` instead

`type onKeyPress = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyPressCapture

Deprecated

 Use `onKeyUpCapture` or `onKeyDownCapture` instead

`type onKeyPressCapture = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyUp

`type onKeyUp = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyUpCapture

`type onKeyUpCapture = KeyboardEventHandler<HTMLSpanElement>;

`

##### onLoad

`type onLoad = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadCapture

`type onLoadCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedData

`type onLoadedData = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedDataCapture

`type onLoadedDataCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedMetadata

`type onLoadedMetadata = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedMetadataCapture

`type onLoadedMetadataCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadStart

`type onLoadStart = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadStartCapture

`type onLoadStartCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLostPointerCapture

`type onLostPointerCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onLostPointerCaptureCapture

`type onLostPointerCaptureCapture =

PointerEventHandler<HTMLSpanElement>;

`

##### onMouseDown

`type onMouseDown = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseDownCapture

`type onMouseDownCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseEnter

`type onMouseEnter = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseLeave

`type onMouseLeave = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseMove

`type onMouseMove = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseMoveCapture

`type onMouseMoveCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOut

`type onMouseOut = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOutCapture

`type onMouseOutCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOver

`type onMouseOver = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOverCapture

`type onMouseOverCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseUp

`type onMouseUp = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseUpCapture

`type onMouseUpCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onPaste

`type onPaste = ClipboardEventHandler<HTMLSpanElement>;

`

##### onPasteCapture

`type onPasteCapture = ClipboardEventHandler<HTMLSpanElement>;

`

##### onPause

`type onPause = ReactEventHandler<HTMLSpanElement>;

`

##### onPauseCapture

`type onPauseCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onPlay

`type onPlay = ReactEventHandler<HTMLSpanElement>;

`

##### onPlayCapture

`type onPlayCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onPlaying

`type onPlaying = ReactEventHandler<HTMLSpanElement>;

`

##### onPlayingCapture

`type onPlayingCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onPointerCancel

`type onPointerCancel = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerCancelCapture

`type onPointerCancelCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerDown

`type onPointerDown = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerDownCapture

`type onPointerDownCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerEnter

`type onPointerEnter = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerLeave

`type onPointerLeave = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerMove

`type onPointerMove = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerMoveCapture

`type onPointerMoveCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOut

`type onPointerOut = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOutCapture

`type onPointerOutCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOver

`type onPointerOver = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOverCapture

`type onPointerOverCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerUp

`type onPointerUp = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerUpCapture

`type onPointerUpCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onProgress

`type onProgress = ReactEventHandler<HTMLSpanElement>;

`

##### onProgressCapture

`type onProgressCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onRateChange

`type onRateChange = ReactEventHandler<HTMLSpanElement>;

`

##### onRateChangeCapture

`type onRateChangeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onReset

`type onReset = FormEventHandler<HTMLSpanElement>;

`

##### onResetCapture

`type onResetCapture = FormEventHandler<HTMLSpanElement>;

`

##### onResize

`type onResize = ReactEventHandler<HTMLSpanElement>;

`

##### onResizeCapture

`type onResizeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onScroll

`type onScroll = UIEventHandler<HTMLSpanElement>;

`

##### onScrollCapture

`type onScrollCapture = UIEventHandler<HTMLSpanElement>;

`

##### onSeeked

`type onSeeked = ReactEventHandler<HTMLSpanElement>;

`

##### onSeekedCapture

`type onSeekedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onSeeking

`type onSeeking = ReactEventHandler<HTMLSpanElement>;

`

##### onSeekingCapture

`type onSeekingCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onSelect

`type onSelect = ReactEventHandler<HTMLSpanElement>;

`

##### onSelectCapture

`type onSelectCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onStalled

`type onStalled = ReactEventHandler<HTMLSpanElement>;

`

##### onStalledCapture

`type onStalledCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onSubmit

`type onSubmit = FormEventHandler<HTMLSpanElement>;

`

##### onSubmitCapture

`type onSubmitCapture = FormEventHandler<HTMLSpanElement>;

`

##### onSuspend

`type onSuspend = ReactEventHandler<HTMLSpanElement>;

`

##### onSuspendCapture

`type onSuspendCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onTimeUpdate

`type onTimeUpdate = ReactEventHandler<HTMLSpanElement>;

`

##### onTimeUpdateCapture

`type onTimeUpdateCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onToggle

`type onToggle = ToggleEventHandler<HTMLSpanElement>;

`

##### onTouchCancel

`type onTouchCancel = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchCancelCapture

`type onTouchCancelCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchEnd

`type onTouchEnd = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchEndCapture

`type onTouchEndCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchMove

`type onTouchMove = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchMoveCapture

`type onTouchMoveCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchStart

`type onTouchStart = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchStartCapture

`type onTouchStartCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTransitionCancel

`type onTransitionCancel = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionCancelCapture

`type onTransitionCancelCapture =

TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionEnd

`type onTransitionEnd = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionEndCapture

`type onTransitionEndCapture = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionRun

`type onTransitionRun = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionRunCapture

`type onTransitionRunCapture = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionStart

`type onTransitionStart = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionStartCapture

`type onTransitionStartCapture =

TransitionEventHandler<HTMLSpanElement>;

`

##### onVolumeChange

`type onVolumeChange = ReactEventHandler<HTMLSpanElement>;

`

##### onVolumeChangeCapture

`type onVolumeChangeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onWaiting

`type onWaiting = ReactEventHandler<HTMLSpanElement>;

`

##### onWaitingCapture

`type onWaitingCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onWheel

`type onWheel = WheelEventHandler<HTMLSpanElement>;

`

##### onWheelCapture

`type onWheelCapture = WheelEventHandler<HTMLSpanElement>;

`

##### popover

`type popover = "" | "auto" | "manual";

`

##### popoverTarget

`type popoverTarget = string;

`

##### popoverTargetAction

`type popoverTargetAction = "toggle" | "hide" | "show";

`

##### prefix

`type prefix = string;

`

##### property

`type property = string;

`

##### queryOptions

 Optional `useQuery` params

`type queryOptions = Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">

`

##### radioGroup

`type radioGroup = string;

`

##### rel

`type rel = string;

`

##### resource

`type resource = string;

`

##### results

`type results = number;

`

##### rev

`type rev = string;

`

##### role

`type role = AriaRole;

`

##### security

`type security = string;

`

##### slot

`type slot = string;

`

##### spellCheck

`type spellCheck = Booleanish;

`

##### style

`type style = CSSProperties;

`

##### suppressContentEditableWarning

`type suppressContentEditableWarning = boolean;

`

##### suppressHydrationWarning

`type suppressHydrationWarning = boolean;

`

##### tabIndex

`type tabIndex = number;

`

##### title

`type title = string;

`

##### translate

`type translate = "yes" | "no";

`

##### typeof

`type typeof = string

`

##### unselectable

`type unselectable = "on" | "off";

`

##### vocab

`type vocab = string;

`
## NFTDescriptionProps

`interface NFTDescriptionProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, "children"> {about : string,accessKey : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,className : string,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),descriptionResolver : string | (() => string) | (() => Promise<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",fallbackComponent : Element,hidden : boolean,id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,loadingComponent : Element,nonce : string,onAbort : ReactEventHandler<HTMLSpanElement>,onAbortCapture : ReactEventHandler<HTMLSpanElement>,onAnimationEnd : AnimationEventHandler<HTMLSpanElement>,onAnimationEndCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationIteration : AnimationEventHandler<HTMLSpanElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationStart : AnimationEventHandler<HTMLSpanElement>,onAnimationStartCapture : AnimationEventHandler<HTMLSpanElement>,onAuxClick : MouseEventHandler<HTMLSpanElement>,onAuxClickCapture : MouseEventHandler<HTMLSpanElement>,onBeforeInput : FormEventHandler<HTMLSpanElement>,onBeforeInputCapture : FormEventHandler<HTMLSpanElement>,onBeforeToggle : ToggleEventHandler<HTMLSpanElement>,onBlur : FocusEventHandler<HTMLSpanElement>,onBlurCapture : FocusEventHandler<HTMLSpanElement>,onCanPlay : ReactEventHandler<HTMLSpanElement>,onCanPlayCapture : ReactEventHandler<HTMLSpanElement>,onCanPlayThrough : ReactEventHandler<HTMLSpanElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLSpanElement>,onChange : FormEventHandler<HTMLSpanElement>,onChangeCapture : FormEventHandler<HTMLSpanElement>,onClick : MouseEventHandler<HTMLSpanElement>,onClickCapture : MouseEventHandler<HTMLSpanElement>,onCompositionEnd : CompositionEventHandler<HTMLSpanElement>,onCompositionEndCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionStart : CompositionEventHandler<HTMLSpanElement>,onCompositionStartCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdate : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLSpanElement>,onContextMenu : MouseEventHandler<HTMLSpanElement>,onContextMenuCapture : MouseEventHandler<HTMLSpanElement>,onCopy : ClipboardEventHandler<HTMLSpanElement>,onCopyCapture : ClipboardEventHandler<HTMLSpanElement>,onCut : ClipboardEventHandler<HTMLSpanElement>,onCutCapture : ClipboardEventHandler<HTMLSpanElement>,onDoubleClick : MouseEventHandler<HTMLSpanElement>,onDoubleClickCapture : MouseEventHandler<HTMLSpanElement>,onDrag : DragEventHandler<HTMLSpanElement>,onDragCapture : DragEventHandler<HTMLSpanElement>,onDragEnd : DragEventHandler<HTMLSpanElement>,onDragEndCapture : DragEventHandler<HTMLSpanElement>,onDragEnter : DragEventHandler<HTMLSpanElement>,onDragEnterCapture : DragEventHandler<HTMLSpanElement>,onDragExit : DragEventHandler<HTMLSpanElement>,onDragExitCapture : DragEventHandler<HTMLSpanElement>,onDragLeave : DragEventHandler<HTMLSpanElement>,onDragLeaveCapture : DragEventHandler<HTMLSpanElement>,onDragOver : DragEventHandler<HTMLSpanElement>,onDragOverCapture : DragEventHandler<HTMLSpanElement>,onDragStart : DragEventHandler<HTMLSpanElement>,onDragStartCapture : DragEventHandler<HTMLSpanElement>,onDrop : DragEventHandler<HTMLSpanElement>,onDropCapture : DragEventHandler<HTMLSpanElement>,onDurationChange : ReactEventHandler<HTMLSpanElement>,onDurationChangeCapture : ReactEventHandler<HTMLSpanElement>,onEmptied : ReactEventHandler<HTMLSpanElement>,onEmptiedCapture : ReactEventHandler<HTMLSpanElement>,onEncrypted : ReactEventHandler<HTMLSpanElement>,onEncryptedCapture : ReactEventHandler<HTMLSpanElement>,onEnded : ReactEventHandler<HTMLSpanElement>,onEndedCapture : ReactEventHandler<HTMLSpanElement>,onError : ReactEventHandler<HTMLSpanElement>,onErrorCapture : ReactEventHandler<HTMLSpanElement>,onFocus : FocusEventHandler<HTMLSpanElement>,onFocusCapture : FocusEventHandler<HTMLSpanElement>,onGotPointerCapture : PointerEventHandler<HTMLSpanElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onInput : FormEventHandler<HTMLSpanElement>,onInputCapture : FormEventHandler<HTMLSpanElement>,onInvalid : FormEventHandler<HTMLSpanElement>,onInvalidCapture : FormEventHandler<HTMLSpanElement>,onKeyDown : KeyboardEventHandler<HTMLSpanElement>,onKeyDownCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyPress : KeyboardEventHandler<HTMLSpanElement>,onKeyPressCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyUp : KeyboardEventHandler<HTMLSpanElement>,onKeyUpCapture : KeyboardEventHandler<HTMLSpanElement>,onLoad : ReactEventHandler<HTMLSpanElement>,onLoadCapture : ReactEventHandler<HTMLSpanElement>,onLoadedData : ReactEventHandler<HTMLSpanElement>,onLoadedDataCapture : ReactEventHandler<HTMLSpanElement>,onLoadedMetadata : ReactEventHandler<HTMLSpanElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLSpanElement>,onLoadStart : ReactEventHandler<HTMLSpanElement>,onLoadStartCapture : ReactEventHandler<HTMLSpanElement>,onLostPointerCapture : PointerEventHandler<HTMLSpanElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onMouseDown : MouseEventHandler<HTMLSpanElement>,onMouseDownCapture : MouseEventHandler<HTMLSpanElement>,onMouseEnter : MouseEventHandler<HTMLSpanElement>,onMouseLeave : MouseEventHandler<HTMLSpanElement>,onMouseMove : MouseEventHandler<HTMLSpanElement>,onMouseMoveCapture : MouseEventHandler<HTMLSpanElement>,onMouseOut : MouseEventHandler<HTMLSpanElement>,onMouseOutCapture : MouseEventHandler<HTMLSpanElement>,onMouseOver : MouseEventHandler<HTMLSpanElement>,onMouseOverCapture : MouseEventHandler<HTMLSpanElement>,onMouseUp : MouseEventHandler<HTMLSpanElement>,onMouseUpCapture : MouseEventHandler<HTMLSpanElement>,onPaste : ClipboardEventHandler<HTMLSpanElement>,onPasteCapture : ClipboardEventHandler<HTMLSpanElement>,onPause : ReactEventHandler<HTMLSpanElement>,onPauseCapture : ReactEventHandler<HTMLSpanElement>,onPlay : ReactEventHandler<HTMLSpanElement>,onPlayCapture : ReactEventHandler<HTMLSpanElement>,onPlaying : ReactEventHandler<HTMLSpanElement>,onPlayingCapture : ReactEventHandler<HTMLSpanElement>,onPointerCancel : PointerEventHandler<HTMLSpanElement>,onPointerCancelCapture : PointerEventHandler<HTMLSpanElement>,onPointerDown : PointerEventHandler<HTMLSpanElement>,onPointerDownCapture : PointerEventHandler<HTMLSpanElement>,onPointerEnter : PointerEventHandler<HTMLSpanElement>,onPointerLeave : PointerEventHandler<HTMLSpanElement>,onPointerMove : PointerEventHandler<HTMLSpanElement>,onPointerMoveCapture : PointerEventHandler<HTMLSpanElement>,onPointerOut : PointerEventHandler<HTMLSpanElement>,onPointerOutCapture : PointerEventHandler<HTMLSpanElement>,onPointerOver : PointerEventHandler<HTMLSpanElement>,onPointerOverCapture : PointerEventHandler<HTMLSpanElement>,onPointerUp : PointerEventHandler<HTMLSpanElement>,onPointerUpCapture : PointerEventHandler<HTMLSpanElement>,onProgress : ReactEventHandler<HTMLSpanElement>,onProgressCapture : ReactEventHandler<HTMLSpanElement>,onRateChange : ReactEventHandler<HTMLSpanElement>,onRateChangeCapture : ReactEventHandler<HTMLSpanElement>,onReset : FormEventHandler<HTMLSpanElement>,onResetCapture : FormEventHandler<HTMLSpanElement>,onResize : ReactEventHandler<HTMLSpanElement>,onResizeCapture : ReactEventHandler<HTMLSpanElement>,onScroll : UIEventHandler<HTMLSpanElement>,onScrollCapture : UIEventHandler<HTMLSpanElement>,onSeeked : ReactEventHandler<HTMLSpanElement>,onSeekedCapture : ReactEventHandler<HTMLSpanElement>,onSeeking : ReactEventHandler<HTMLSpanElement>,onSeekingCapture : ReactEventHandler<HTMLSpanElement>,onSelect : ReactEventHandler<HTMLSpanElement>,onSelectCapture : ReactEventHandler<HTMLSpanElement>,onStalled : ReactEventHandler<HTMLSpanElement>,onStalledCapture : ReactEventHandler<HTMLSpanElement>,onSubmit : FormEventHandler<HTMLSpanElement>,onSubmitCapture : FormEventHandler<HTMLSpanElement>,onSuspend : ReactEventHandler<HTMLSpanElement>,onSuspendCapture : ReactEventHandler<HTMLSpanElement>,onTimeUpdate : ReactEventHandler<HTMLSpanElement>,onTimeUpdateCapture : ReactEventHandler<HTMLSpanElement>,onToggle : ToggleEventHandler<HTMLSpanElement>,onTouchCancel : TouchEventHandler<HTMLSpanElement>,onTouchCancelCapture : TouchEventHandler<HTMLSpanElement>,onTouchEnd : TouchEventHandler<HTMLSpanElement>,onTouchEndCapture : TouchEventHandler<HTMLSpanElement>,onTouchMove : TouchEventHandler<HTMLSpanElement>,onTouchMoveCapture : TouchEventHandler<HTMLSpanElement>,onTouchStart : TouchEventHandler<HTMLSpanElement>,onTouchStartCapture : TouchEventHandler<HTMLSpanElement>,onTransitionCancel : TransitionEventHandler<HTMLSpanElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionEnd : TransitionEventHandler<HTMLSpanElement>,onTransitionEndCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionRun : TransitionEventHandler<HTMLSpanElement>,onTransitionRunCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionStart : TransitionEventHandler<HTMLSpanElement>,onTransitionStartCapture : TransitionEventHandler<HTMLSpanElement>,onVolumeChange : ReactEventHandler<HTMLSpanElement>,onVolumeChangeCapture : ReactEventHandler<HTMLSpanElement>,onWaiting : ReactEventHandler<HTMLSpanElement>,onWaitingCapture : ReactEventHandler<HTMLSpanElement>,onWheel : WheelEventHandler<HTMLSpanElement>,onWheelCapture : WheelEventHandler<HTMLSpanElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,queryOptions : Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">,radioGroup : string,rel : string,resource : string,results : number,rev : string,role : AriaRole,security : string,slot : string,spellCheck : Booleanish,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,tabIndex : number,title : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",vocab : string}

`

##### about

`type about = string;

`

##### accessKey

`type accessKey = string;

`

##### aria-activedescendant

 Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application.

`type aria-activedescendant = string

`

##### aria-atomic

 Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute.

`type aria-atomic = Booleanish

`

##### aria-autocomplete

 Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be presented if they are made.

`type aria-autocomplete = "inline" | "none" | "list" | "both"

`

##### aria-braillelabel

 Defines a string value that labels the current element, which is intended to be converted into Braille.

 aria-label.

`type aria-braillelabel = string

`

##### aria-brailleroledescription

 Defines a human-readable, author-localized abbreviated description for the role of an element, which is intended to be converted into Braille.

 aria-roledescription.

`type aria-brailleroledescription = string

`

##### aria-busy

`type aria-busy = Booleanish

`

##### aria-checked

 Indicates the current "checked" state of checkboxes, radio buttons, and other widgets.

* aria-pressed
* aria-selected.

`type aria-checked = boolean | "false" | "true" | "mixed"

`

##### aria-colcount

 Defines the total number of columns in a table, grid, or treegrid.

 aria-colindex.

`type aria-colcount = number

`

##### aria-colindex

 Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid.

* aria-colcount
* aria-colspan.

`type aria-colindex = number

`

##### aria-colindextext

 Defines a human readable text alternative of aria-colindex.

 aria-rowindextext.

`type aria-colindextext = string

`

##### aria-colspan

 Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-colindex
* aria-rowspan.

`type aria-colspan = number

`

##### aria-controls

 Identifies the element (or elements) whose contents or presence are controlled by the current element.

 aria-owns.

`type aria-controls = string

`

##### aria-current

 Indicates the element that represents the current item within a container or set of related elements.

`type aria-current = boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date"

`

##### aria-describedby

 Identifies the element (or elements) that describes the object.

 aria-labelledby

`type aria-describedby = string

`

##### aria-description

 Defines a string value that describes or annotates the current element.

 related aria-describedby.

`type aria-description = string

`

##### aria-details

 Identifies the element that provides a detailed, extended description for the object.

 aria-describedby.

`type aria-details = string

`

##### aria-disabled

 Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable.

* aria-hidden
* aria-readonly.

`type aria-disabled = Booleanish

`

##### aria-dropeffect

Deprecated

 in ARIA 1.1

 Indicates what functions can be performed when a dragged object is released on the drop target.

`type aria-dropeffect = "link" | "popup" | "execute" | "none" | "copy" | "move"

`

##### aria-errormessage

 Identifies the element that provides an error message for the object.

* aria-invalid
* aria-describedby.

`type aria-errormessage = string

`

##### aria-expanded

 Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed.

`type aria-expanded = Booleanish

`

##### aria-flowto

 Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion, allows assistive technology to override the general default of reading in document source order.

`type aria-flowto = string

`

##### aria-grabbed

Deprecated

 in ARIA 1.1

 Indicates an element's "grabbed" state in a drag-and-drop operation.

`type aria-grabbed = Booleanish

`

##### aria-haspopup

 Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element.

`type aria-haspopup = boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree"

`

##### aria-hidden

 Indicates whether the element is exposed to an accessibility API.

 aria-disabled.

`type aria-hidden = Booleanish

`

##### aria-invalid

 Indicates the entered value does not conform to the format expected by the application.

 aria-errormessage.

`type aria-invalid = boolean | "false" | "true" | "grammar" | "spelling"

`

##### aria-keyshortcuts

 Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element.

`type aria-keyshortcuts = string

`

##### aria-label

 Defines a string value that labels the current element.

 aria-labelledby.

`type aria-label = string

`

##### aria-labelledby

 Identifies the element (or elements) that labels the current element.

 aria-describedby.

`type aria-labelledby = string

`

##### aria-level

 Defines the hierarchical level of an element within a structure.

`type aria-level = number

`

##### aria-live

 Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region.

`type aria-live = "off" | "polite" | "assertive"

`

##### aria-modal

 Indicates whether an element is modal when displayed.

`type aria-modal = Booleanish

`

##### aria-multiline

 Indicates whether a text box accepts multiple lines of input or only a single line.

`type aria-multiline = Booleanish

`

##### aria-multiselectable

 Indicates that the user may select more than one item from the current selectable descendants.

`type aria-multiselectable = Booleanish

`

##### aria-orientation

 Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous.

`type aria-orientation = "horizontal" | "vertical"

`

##### aria-owns

 Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship between DOM elements where the DOM hierarchy cannot be used to represent the relationship.

 aria-controls.

`type aria-owns = string

`

##### aria-placeholder

 Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value. A hint could be a sample value or a brief description of the expected format.

`type aria-placeholder = string

`

##### aria-posinset

 Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-setsize.

`type aria-posinset = number

`

##### aria-pressed

 Indicates the current "pressed" state of toggle buttons.

* aria-checked
* aria-selected.

`type aria-pressed = boolean | "false" | "true" | "mixed"

`

##### aria-readonly

 Indicates that the element is not editable, but is otherwise operable.

 aria-disabled.

`type aria-readonly = Booleanish

`

##### aria-relevant

 Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified.

 aria-atomic.

`type aria-relevant = "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals"

`

##### aria-required

 Indicates that user input is required on the element before a form may be submitted.

`type aria-required = Booleanish

`

##### aria-roledescription

 Defines a human-readable, author-localized description for the role of an element.

`type aria-roledescription = string

`

##### aria-rowcount

 Defines the total number of rows in a table, grid, or treegrid.

 aria-rowindex.

`type aria-rowcount = number

`

##### aria-rowindex

 Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid.

* aria-rowcount
* aria-rowspan.

`type aria-rowindex = number

`

##### aria-rowindextext

 Defines a human readable text alternative of aria-rowindex.

 aria-colindextext.

`type aria-rowindextext = string

`

##### aria-rowspan

 Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-rowindex
* aria-colspan.

`type aria-rowspan = number

`

##### aria-selected

 Indicates the current "selected" state of various widgets.

* aria-checked
* aria-pressed.

`type aria-selected = Booleanish

`

##### aria-setsize

 Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-posinset.

`type aria-setsize = number

`

##### aria-sort

 Indicates if items in a table or grid are sorted in ascending or descending order.

`type aria-sort = "none" | "ascending" | "descending" | "other"

`

##### aria-valuemax

 Defines the maximum allowed value for a range widget.

`type aria-valuemax = number

`

##### aria-valuemin

 Defines the minimum allowed value for a range widget.

`type aria-valuemin = number

`

##### aria-valuenow

 Defines the current value for a range widget.

 aria-valuetext.

`type aria-valuenow = number

`

##### aria-valuetext

 Defines the human readable text alternative of aria-valuenow for a range widget.

`type aria-valuetext = string

`

##### autoCapitalize

`type autoCapitalize =

| (string & {})

| "on"

| "off"

| "none"

| "sentences"

| "words"

| "characters";

`

##### autoCorrect

`type autoCorrect = string;

`

##### autoFocus

`type autoFocus = boolean;

`

##### autoSave

`type autoSave = string;

`

##### className

`type className = string;

`

##### color

`type color = string;

`

##### content

`type content = string;

`

##### contentEditable

`type contentEditable = "inherit" | Booleanish | "plaintext-only";

`

##### contextMenu

`type contextMenu = string;

`

##### dangerouslySetInnerHTML

`type dangerouslySetInnerHTML = { __html: string | TrustedHTML };

`

##### datatype

`type datatype = string;

`

##### defaultChecked

`type defaultChecked = boolean;

`

##### defaultValue

`type defaultValue = string | number | (readonly Array<string>)

`

##### descriptionResolver

 This prop can be a string or a (async) function that resolves to a string, representing the description of the NFT This is particularly useful if you already have a way to fetch the data.

`type descriptionResolver =

| string

| (() => string)

| (() => Promise<string>);

`

##### dir

`type dir = string;

`

##### draggable

`type draggable = Booleanish;

`

##### enterKeyHint

`type enterKeyHint =

| "search"

| "done"

| "next"

| "send"

| "enter"

| "go"

| "previous";

`

##### fallbackComponent

`type fallbackComponent = Element;

`

##### hidden

`type hidden = boolean;

`

##### id

`type id = string;

`

##### inert

 https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert

`type inert = boolean;

`

##### inlist

`type inlist = any;

`

##### inputMode

 Hints at the type of data that might be entered by the user while editing the element or its contents

[ https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute](https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute)

`type inputMode =

| "search"

| "email"

| "url"

| "text"

| "none"

| "tel"

| "numeric"

| "decimal";

`

##### is

 Specify that a standard HTML element should behave like a defined custom built-in element

[ https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is](https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is)

`type is = string;

`

##### itemID

`type itemID = string;

`

##### itemProp

`type itemProp = string;

`

##### itemRef

`type itemRef = string;

`

##### itemScope

`type itemScope = boolean;

`

##### itemType

`type itemType = string;

`

##### lang

`type lang = string;

`

##### loadingComponent

`type loadingComponent = Element;

`

##### nonce

`type nonce = string;

`

##### onAbort

`type onAbort = ReactEventHandler<HTMLSpanElement>;

`

##### onAbortCapture

`type onAbortCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onAnimationEnd

`type onAnimationEnd = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationEndCapture

`type onAnimationEndCapture = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationIteration

`type onAnimationIteration = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationIterationCapture

`type onAnimationIterationCapture =

AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationStart

`type onAnimationStart = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationStartCapture

`type onAnimationStartCapture = AnimationEventHandler<HTMLSpanElement>;

`

##### onAuxClick

`type onAuxClick = MouseEventHandler<HTMLSpanElement>;

`

##### onAuxClickCapture

`type onAuxClickCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onBeforeInput

`type onBeforeInput = FormEventHandler<HTMLSpanElement>;

`

##### onBeforeInputCapture

`type onBeforeInputCapture = FormEventHandler<HTMLSpanElement>;

`

##### onBeforeToggle

`type onBeforeToggle = ToggleEventHandler<HTMLSpanElement>;

`

##### onBlur

`type onBlur = FocusEventHandler<HTMLSpanElement>;

`

##### onBlurCapture

`type onBlurCapture = FocusEventHandler<HTMLSpanElement>;

`

##### onCanPlay

`type onCanPlay = ReactEventHandler<HTMLSpanElement>;

`

##### onCanPlayCapture

`type onCanPlayCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onCanPlayThrough

`type onCanPlayThrough = ReactEventHandler<HTMLSpanElement>;

`

##### onCanPlayThroughCapture

`type onCanPlayThroughCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onChange

`type onChange = FormEventHandler<HTMLSpanElement>;

`

##### onChangeCapture

`type onChangeCapture = FormEventHandler<HTMLSpanElement>;

`

##### onClick

`type onClick = MouseEventHandler<HTMLSpanElement>;

`

##### onClickCapture

`type onClickCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onCompositionEnd

`type onCompositionEnd = CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionEndCapture

`type onCompositionEndCapture =

CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionStart

`type onCompositionStart = CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionStartCapture

`type onCompositionStartCapture =

CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionUpdate

`type onCompositionUpdate = CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionUpdateCapture

`type onCompositionUpdateCapture =

CompositionEventHandler<HTMLSpanElement>;

`

##### onContextMenu

`type onContextMenu = MouseEventHandler<HTMLSpanElement>;

`

##### onContextMenuCapture

`type onContextMenuCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onCopy

`type onCopy = ClipboardEventHandler<HTMLSpanElement>;

`

##### onCopyCapture

`type onCopyCapture = ClipboardEventHandler<HTMLSpanElement>;

`

##### onCut

`type onCut = ClipboardEventHandler<HTMLSpanElement>;

`

##### onCutCapture

`type onCutCapture = ClipboardEventHandler<HTMLSpanElement>;

`

##### onDoubleClick

`type onDoubleClick = MouseEventHandler<HTMLSpanElement>;

`

##### onDoubleClickCapture

`type onDoubleClickCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onDrag

`type onDrag = DragEventHandler<HTMLSpanElement>;

`

##### onDragCapture

`type onDragCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragEnd

`type onDragEnd = DragEventHandler<HTMLSpanElement>;

`

##### onDragEndCapture

`type onDragEndCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragEnter

`type onDragEnter = DragEventHandler<HTMLSpanElement>;

`

##### onDragEnterCapture

`type onDragEnterCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragExit

`type onDragExit = DragEventHandler<HTMLSpanElement>;

`

##### onDragExitCapture

`type onDragExitCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragLeave

`type onDragLeave = DragEventHandler<HTMLSpanElement>;

`

##### onDragLeaveCapture

`type onDragLeaveCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragOver

`type onDragOver = DragEventHandler<HTMLSpanElement>;

`

##### onDragOverCapture

`type onDragOverCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragStart

`type onDragStart = DragEventHandler<HTMLSpanElement>;

`

##### onDragStartCapture

`type onDragStartCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDrop

`type onDrop = DragEventHandler<HTMLSpanElement>;

`

##### onDropCapture

`type onDropCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDurationChange

`type onDurationChange = ReactEventHandler<HTMLSpanElement>;

`

##### onDurationChangeCapture

`type onDurationChangeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onEmptied

`type onEmptied = ReactEventHandler<HTMLSpanElement>;

`

##### onEmptiedCapture

`type onEmptiedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onEncrypted

`type onEncrypted = ReactEventHandler<HTMLSpanElement>;

`

##### onEncryptedCapture

`type onEncryptedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onEnded

`type onEnded = ReactEventHandler<HTMLSpanElement>;

`

##### onEndedCapture

`type onEndedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onError

`type onError = ReactEventHandler<HTMLSpanElement>;

`

##### onErrorCapture

`type onErrorCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onFocus

`type onFocus = FocusEventHandler<HTMLSpanElement>;

`

##### onFocusCapture

`type onFocusCapture = FocusEventHandler<HTMLSpanElement>;

`

##### onGotPointerCapture

`type onGotPointerCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onGotPointerCaptureCapture

`type onGotPointerCaptureCapture =

PointerEventHandler<HTMLSpanElement>;

`

##### onInput

`type onInput = FormEventHandler<HTMLSpanElement>;

`

##### onInputCapture

`type onInputCapture = FormEventHandler<HTMLSpanElement>;

`

##### onInvalid

`type onInvalid = FormEventHandler<HTMLSpanElement>;

`

##### onInvalidCapture

`type onInvalidCapture = FormEventHandler<HTMLSpanElement>;

`

##### onKeyDown

`type onKeyDown = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyDownCapture

`type onKeyDownCapture = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyPress

Deprecated

 Use `onKeyUp` or `onKeyDown` instead

`type onKeyPress = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyPressCapture

Deprecated

 Use `onKeyUpCapture` or `onKeyDownCapture` instead

`type onKeyPressCapture = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyUp

`type onKeyUp = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyUpCapture

`type onKeyUpCapture = KeyboardEventHandler<HTMLSpanElement>;

`

##### onLoad

`type onLoad = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadCapture

`type onLoadCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedData

`type onLoadedData = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedDataCapture

`type onLoadedDataCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedMetadata

`type onLoadedMetadata = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedMetadataCapture

`type onLoadedMetadataCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadStart

`type onLoadStart = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadStartCapture

`type onLoadStartCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLostPointerCapture

`type onLostPointerCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onLostPointerCaptureCapture

`type onLostPointerCaptureCapture =

PointerEventHandler<HTMLSpanElement>;

`

##### onMouseDown

`type onMouseDown = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseDownCapture

`type onMouseDownCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseEnter

`type onMouseEnter = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseLeave

`type onMouseLeave = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseMove

`type onMouseMove = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseMoveCapture

`type onMouseMoveCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOut

`type onMouseOut = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOutCapture

`type onMouseOutCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOver

`type onMouseOver = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOverCapture

`type onMouseOverCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseUp

`type onMouseUp = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseUpCapture

`type onMouseUpCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onPaste

`type onPaste = ClipboardEventHandler<HTMLSpanElement>;

`

##### onPasteCapture

`type onPasteCapture = ClipboardEventHandler<HTMLSpanElement>;

`

##### onPause

`type onPause = ReactEventHandler<HTMLSpanElement>;

`

##### onPauseCapture

`type onPauseCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onPlay

`type onPlay = ReactEventHandler<HTMLSpanElement>;

`

##### onPlayCapture

`type onPlayCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onPlaying

`type onPlaying = ReactEventHandler<HTMLSpanElement>;

`

##### onPlayingCapture

`type onPlayingCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onPointerCancel

`type onPointerCancel = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerCancelCapture

`type onPointerCancelCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerDown

`type onPointerDown = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerDownCapture

`type onPointerDownCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerEnter

`type onPointerEnter = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerLeave

`type onPointerLeave = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerMove

`type onPointerMove = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerMoveCapture

`type onPointerMoveCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOut

`type onPointerOut = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOutCapture

`type onPointerOutCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOver

`type onPointerOver = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOverCapture

`type onPointerOverCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerUp

`type onPointerUp = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerUpCapture

`type onPointerUpCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onProgress

`type onProgress = ReactEventHandler<HTMLSpanElement>;

`

##### onProgressCapture

`type onProgressCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onRateChange

`type onRateChange = ReactEventHandler<HTMLSpanElement>;

`

##### onRateChangeCapture

`type onRateChangeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onReset

`type onReset = FormEventHandler<HTMLSpanElement>;

`

##### onResetCapture

`type onResetCapture = FormEventHandler<HTMLSpanElement>;

`

##### onResize

`type onResize = ReactEventHandler<HTMLSpanElement>;

`

##### onResizeCapture

`type onResizeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onScroll

`type onScroll = UIEventHandler<HTMLSpanElement>;

`

##### onScrollCapture

`type onScrollCapture = UIEventHandler<HTMLSpanElement>;

`

##### onSeeked

`type onSeeked = ReactEventHandler<HTMLSpanElement>;

`

##### onSeekedCapture

`type onSeekedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onSeeking

`type onSeeking = ReactEventHandler<HTMLSpanElement>;

`

##### onSeekingCapture

`type onSeekingCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onSelect

`type onSelect = ReactEventHandler<HTMLSpanElement>;

`

##### onSelectCapture

`type onSelectCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onStalled

`type onStalled = ReactEventHandler<HTMLSpanElement>;

`

##### onStalledCapture

`type onStalledCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onSubmit

`type onSubmit = FormEventHandler<HTMLSpanElement>;

`

##### onSubmitCapture

`type onSubmitCapture = FormEventHandler<HTMLSpanElement>;

`

##### onSuspend

`type onSuspend = ReactEventHandler<HTMLSpanElement>;

`

##### onSuspendCapture

`type onSuspendCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onTimeUpdate

`type onTimeUpdate = ReactEventHandler<HTMLSpanElement>;

`

##### onTimeUpdateCapture

`type onTimeUpdateCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onToggle

`type onToggle = ToggleEventHandler<HTMLSpanElement>;

`

##### onTouchCancel

`type onTouchCancel = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchCancelCapture

`type onTouchCancelCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchEnd

`type onTouchEnd = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchEndCapture

`type onTouchEndCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchMove

`type onTouchMove = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchMoveCapture

`type onTouchMoveCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchStart

`type onTouchStart = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchStartCapture

`type onTouchStartCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTransitionCancel

`type onTransitionCancel = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionCancelCapture

`type onTransitionCancelCapture =

TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionEnd

`type onTransitionEnd = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionEndCapture

`type onTransitionEndCapture = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionRun

`type onTransitionRun = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionRunCapture

`type onTransitionRunCapture = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionStart

`type onTransitionStart = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionStartCapture

`type onTransitionStartCapture =

TransitionEventHandler<HTMLSpanElement>;

`

##### onVolumeChange

`type onVolumeChange = ReactEventHandler<HTMLSpanElement>;

`

##### onVolumeChangeCapture

`type onVolumeChangeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onWaiting

`type onWaiting = ReactEventHandler<HTMLSpanElement>;

`

##### onWaitingCapture

`type onWaitingCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onWheel

`type onWheel = WheelEventHandler<HTMLSpanElement>;

`

##### onWheelCapture

`type onWheelCapture = WheelEventHandler<HTMLSpanElement>;

`

##### popover

`type popover = "" | "auto" | "manual";

`

##### popoverTarget

`type popoverTarget = string;

`

##### popoverTargetAction

`type popoverTargetAction = "toggle" | "hide" | "show";

`

##### prefix

`type prefix = string;

`

##### property

`type property = string;

`

##### queryOptions

 Optional `useQuery` params

`type queryOptions = Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">

`

##### radioGroup

`type radioGroup = string;

`

##### rel

`type rel = string;

`

##### resource

`type resource = string;

`

##### results

`type results = number;

`

##### rev

`type rev = string;

`

##### role

`type role = AriaRole;

`

##### security

`type security = string;

`

##### slot

`type slot = string;

`

##### spellCheck

`type spellCheck = Booleanish;

`

##### style

`type style = CSSProperties;

`

##### suppressContentEditableWarning

`type suppressContentEditableWarning = boolean;

`

##### suppressHydrationWarning

`type suppressHydrationWarning = boolean;

`

##### tabIndex

`type tabIndex = number;

`

##### title

`type title = string;

`

##### translate

`type translate = "yes" | "no";

`

##### typeof

`type typeof = string

`

##### unselectable

`type unselectable = "on" | "off";

`

##### vocab

`type vocab = string;

`
## SocialIconProps

`interface SocialIconProps extends Omit<React.ImgHTMLAttributes<HTMLImageElement>, "src"> {about : string,accessKey : string,alt : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,children : ReactNode,className : string,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,crossOrigin : CrossOrigin,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,decoding : "auto" | "async" | "sync",defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",fetchPriority : "auto" | "high" | "low",height : string | number,hidden : boolean,id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,loading : "eager" | "lazy",nonce : string,onAbort : ReactEventHandler<HTMLImageElement>,onAbortCapture : ReactEventHandler<HTMLImageElement>,onAnimationEnd : AnimationEventHandler<HTMLImageElement>,onAnimationEndCapture : AnimationEventHandler<HTMLImageElement>,onAnimationIteration : AnimationEventHandler<HTMLImageElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLImageElement>,onAnimationStart : AnimationEventHandler<HTMLImageElement>,onAnimationStartCapture : AnimationEventHandler<HTMLImageElement>,onAuxClick : MouseEventHandler<HTMLImageElement>,onAuxClickCapture : MouseEventHandler<HTMLImageElement>,onBeforeInput : FormEventHandler<HTMLImageElement>,onBeforeInputCapture : FormEventHandler<HTMLImageElement>,onBeforeToggle : ToggleEventHandler<HTMLImageElement>,onBlur : FocusEventHandler<HTMLImageElement>,onBlurCapture : FocusEventHandler<HTMLImageElement>,onCanPlay : ReactEventHandler<HTMLImageElement>,onCanPlayCapture : ReactEventHandler<HTMLImageElement>,onCanPlayThrough : ReactEventHandler<HTMLImageElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLImageElement>,onChange : FormEventHandler<HTMLImageElement>,onChangeCapture : FormEventHandler<HTMLImageElement>,onClick : MouseEventHandler<HTMLImageElement>,onClickCapture : MouseEventHandler<HTMLImageElement>,onCompositionEnd : CompositionEventHandler<HTMLImageElement>,onCompositionEndCapture : CompositionEventHandler<HTMLImageElement>,onCompositionStart : CompositionEventHandler<HTMLImageElement>,onCompositionStartCapture : CompositionEventHandler<HTMLImageElement>,onCompositionUpdate : CompositionEventHandler<HTMLImageElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLImageElement>,onContextMenu : MouseEventHandler<HTMLImageElement>,onContextMenuCapture : MouseEventHandler<HTMLImageElement>,onCopy : ClipboardEventHandler<HTMLImageElement>,onCopyCapture : ClipboardEventHandler<HTMLImageElement>,onCut : ClipboardEventHandler<HTMLImageElement>,onCutCapture : ClipboardEventHandler<HTMLImageElement>,onDoubleClick : MouseEventHandler<HTMLImageElement>,onDoubleClickCapture : MouseEventHandler<HTMLImageElement>,onDrag : DragEventHandler<HTMLImageElement>,onDragCapture : DragEventHandler<HTMLImageElement>,onDragEnd : DragEventHandler<HTMLImageElement>,onDragEndCapture : DragEventHandler<HTMLImageElement>,onDragEnter : DragEventHandler<HTMLImageElement>,onDragEnterCapture : DragEventHandler<HTMLImageElement>,onDragExit : DragEventHandler<HTMLImageElement>,onDragExitCapture : DragEventHandler<HTMLImageElement>,onDragLeave : DragEventHandler<HTMLImageElement>,onDragLeaveCapture : DragEventHandler<HTMLImageElement>,onDragOver : DragEventHandler<HTMLImageElement>,onDragOverCapture : DragEventHandler<HTMLImageElement>,onDragStart : DragEventHandler<HTMLImageElement>,onDragStartCapture : DragEventHandler<HTMLImageElement>,onDrop : DragEventHandler<HTMLImageElement>,onDropCapture : DragEventHandler<HTMLImageElement>,onDurationChange : ReactEventHandler<HTMLImageElement>,onDurationChangeCapture : ReactEventHandler<HTMLImageElement>,onEmptied : ReactEventHandler<HTMLImageElement>,onEmptiedCapture : ReactEventHandler<HTMLImageElement>,onEncrypted : ReactEventHandler<HTMLImageElement>,onEncryptedCapture : ReactEventHandler<HTMLImageElement>,onEnded : ReactEventHandler<HTMLImageElement>,onEndedCapture : ReactEventHandler<HTMLImageElement>,onError : ReactEventHandler<HTMLImageElement>,onErrorCapture : ReactEventHandler<HTMLImageElement>,onFocus : FocusEventHandler<HTMLImageElement>,onFocusCapture : FocusEventHandler<HTMLImageElement>,onGotPointerCapture : PointerEventHandler<HTMLImageElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLImageElement>,onInput : FormEventHandler<HTMLImageElement>,onInputCapture : FormEventHandler<HTMLImageElement>,onInvalid : FormEventHandler<HTMLImageElement>,onInvalidCapture : FormEventHandler<HTMLImageElement>,onKeyDown : KeyboardEventHandler<HTMLImageElement>,onKeyDownCapture : KeyboardEventHandler<HTMLImageElement>,onKeyPress : KeyboardEventHandler<HTMLImageElement>,onKeyPressCapture : KeyboardEventHandler<HTMLImageElement>,onKeyUp : KeyboardEventHandler<HTMLImageElement>,onKeyUpCapture : KeyboardEventHandler<HTMLImageElement>,onLoad : ReactEventHandler<HTMLImageElement>,onLoadCapture : ReactEventHandler<HTMLImageElement>,onLoadedData : ReactEventHandler<HTMLImageElement>,onLoadedDataCapture : ReactEventHandler<HTMLImageElement>,onLoadedMetadata : ReactEventHandler<HTMLImageElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLImageElement>,onLoadStart : ReactEventHandler<HTMLImageElement>,onLoadStartCapture : ReactEventHandler<HTMLImageElement>,onLostPointerCapture : PointerEventHandler<HTMLImageElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLImageElement>,onMouseDown : MouseEventHandler<HTMLImageElement>,onMouseDownCapture : MouseEventHandler<HTMLImageElement>,onMouseEnter : MouseEventHandler<HTMLImageElement>,onMouseLeave : MouseEventHandler<HTMLImageElement>,onMouseMove : MouseEventHandler<HTMLImageElement>,onMouseMoveCapture : MouseEventHandler<HTMLImageElement>,onMouseOut : MouseEventHandler<HTMLImageElement>,onMouseOutCapture : MouseEventHandler<HTMLImageElement>,onMouseOver : MouseEventHandler<HTMLImageElement>,onMouseOverCapture : MouseEventHandler<HTMLImageElement>,onMouseUp : MouseEventHandler<HTMLImageElement>,onMouseUpCapture : MouseEventHandler<HTMLImageElement>,onPaste : ClipboardEventHandler<HTMLImageElement>,onPasteCapture : ClipboardEventHandler<HTMLImageElement>,onPause : ReactEventHandler<HTMLImageElement>,onPauseCapture : ReactEventHandler<HTMLImageElement>,onPlay : ReactEventHandler<HTMLImageElement>,onPlayCapture : ReactEventHandler<HTMLImageElement>,onPlaying : ReactEventHandler<HTMLImageElement>,onPlayingCapture : ReactEventHandler<HTMLImageElement>,onPointerCancel : PointerEventHandler<HTMLImageElement>,onPointerCancelCapture : PointerEventHandler<HTMLImageElement>,onPointerDown : PointerEventHandler<HTMLImageElement>,onPointerDownCapture : PointerEventHandler<HTMLImageElement>,onPointerEnter : PointerEventHandler<HTMLImageElement>,onPointerLeave : PointerEventHandler<HTMLImageElement>,onPointerMove : PointerEventHandler<HTMLImageElement>,onPointerMoveCapture : PointerEventHandler<HTMLImageElement>,onPointerOut : PointerEventHandler<HTMLImageElement>,onPointerOutCapture : PointerEventHandler<HTMLImageElement>,onPointerOver : PointerEventHandler<HTMLImageElement>,onPointerOverCapture : PointerEventHandler<HTMLImageElement>,onPointerUp : PointerEventHandler<HTMLImageElement>,onPointerUpCapture : PointerEventHandler<HTMLImageElement>,onProgress : ReactEventHandler<HTMLImageElement>,onProgressCapture : ReactEventHandler<HTMLImageElement>,onRateChange : ReactEventHandler<HTMLImageElement>,onRateChangeCapture : ReactEventHandler<HTMLImageElement>,onReset : FormEventHandler<HTMLImageElement>,onResetCapture : FormEventHandler<HTMLImageElement>,onResize : ReactEventHandler<HTMLImageElement>,onResizeCapture : ReactEventHandler<HTMLImageElement>,onScroll : UIEventHandler<HTMLImageElement>,onScrollCapture : UIEventHandler<HTMLImageElement>,onSeeked : ReactEventHandler<HTMLImageElement>,onSeekedCapture : ReactEventHandler<HTMLImageElement>,onSeeking : ReactEventHandler<HTMLImageElement>,onSeekingCapture : ReactEventHandler<HTMLImageElement>,onSelect : ReactEventHandler<HTMLImageElement>,onSelectCapture : ReactEventHandler<HTMLImageElement>,onStalled : ReactEventHandler<HTMLImageElement>,onStalledCapture : ReactEventHandler<HTMLImageElement>,onSubmit : FormEventHandler<HTMLImageElement>,onSubmitCapture : FormEventHandler<HTMLImageElement>,onSuspend : ReactEventHandler<HTMLImageElement>,onSuspendCapture : ReactEventHandler<HTMLImageElement>,onTimeUpdate : ReactEventHandler<HTMLImageElement>,onTimeUpdateCapture : ReactEventHandler<HTMLImageElement>,onToggle : ToggleEventHandler<HTMLImageElement>,onTouchCancel : TouchEventHandler<HTMLImageElement>,onTouchCancelCapture : TouchEventHandler<HTMLImageElement>,onTouchEnd : TouchEventHandler<HTMLImageElement>,onTouchEndCapture : TouchEventHandler<HTMLImageElement>,onTouchMove : TouchEventHandler<HTMLImageElement>,onTouchMoveCapture : TouchEventHandler<HTMLImageElement>,onTouchStart : TouchEventHandler<HTMLImageElement>,onTouchStartCapture : TouchEventHandler<HTMLImageElement>,onTransitionCancel : TransitionEventHandler<HTMLImageElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLImageElement>,onTransitionEnd : TransitionEventHandler<HTMLImageElement>,onTransitionEndCapture : TransitionEventHandler<HTMLImageElement>,onTransitionRun : TransitionEventHandler<HTMLImageElement>,onTransitionRunCapture : TransitionEventHandler<HTMLImageElement>,onTransitionStart : TransitionEventHandler<HTMLImageElement>,onTransitionStartCapture : TransitionEventHandler<HTMLImageElement>,onVolumeChange : ReactEventHandler<HTMLImageElement>,onVolumeChangeCapture : ReactEventHandler<HTMLImageElement>,onWaiting : ReactEventHandler<HTMLImageElement>,onWaitingCapture : ReactEventHandler<HTMLImageElement>,onWheel : WheelEventHandler<HTMLImageElement>,onWheelCapture : WheelEventHandler<HTMLImageElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,provider : string,radioGroup : string,referrerPolicy : HTMLAttributeReferrerPolicy,rel : string,resource : string,results : number,rev : string,role : AriaRole,security : string,sizes : string,slot : string,spellCheck : Booleanish,srcSet : string,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,tabIndex : number,title : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",useMap : string,vocab : string,width : string | number}

`

##### about

`type about = string;

`

##### accessKey

`type accessKey = string;

`

##### alt

`type alt = string;

`

##### aria-activedescendant

 Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application.

`type aria-activedescendant = string

`

##### aria-atomic

 Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute.

`type aria-atomic = Booleanish

`

##### aria-autocomplete

 Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be presented if they are made.

`type aria-autocomplete = "inline" | "none" | "list" | "both"

`

##### aria-braillelabel

 Defines a string value that labels the current element, which is intended to be converted into Braille.

 aria-label.

`type aria-braillelabel = string

`

##### aria-brailleroledescription

 Defines a human-readable, author-localized abbreviated description for the role of an element, which is intended to be converted into Braille.

 aria-roledescription.

`type aria-brailleroledescription = string

`

##### aria-busy

`type aria-busy = Booleanish

`

##### aria-checked

 Indicates the current "checked" state of checkboxes, radio buttons, and other widgets.

* aria-pressed
* aria-selected.

`type aria-checked = boolean | "false" | "true" | "mixed"

`

##### aria-colcount

 Defines the total number of columns in a table, grid, or treegrid.

 aria-colindex.

`type aria-colcount = number

`

##### aria-colindex

 Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid.

* aria-colcount
* aria-colspan.

`type aria-colindex = number

`

##### aria-colindextext

 Defines a human readable text alternative of aria-colindex.

 aria-rowindextext.

`type aria-colindextext = string

`

##### aria-colspan

 Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-colindex
* aria-rowspan.

`type aria-colspan = number

`

##### aria-controls

 Identifies the element (or elements) whose contents or presence are controlled by the current element.

 aria-owns.

`type aria-controls = string

`

##### aria-current

 Indicates the element that represents the current item within a container or set of related elements.

`type aria-current = boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date"

`

##### aria-describedby

 Identifies the element (or elements) that describes the object.

 aria-labelledby

`type aria-describedby = string

`

##### aria-description

 Defines a string value that describes or annotates the current element.

 related aria-describedby.

`type aria-description = string

`

##### aria-details

 Identifies the element that provides a detailed, extended description for the object.

 aria-describedby.

`type aria-details = string

`

##### aria-disabled

 Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable.

* aria-hidden
* aria-readonly.

`type aria-disabled = Booleanish

`

##### aria-dropeffect

Deprecated

 in ARIA 1.1

 Indicates what functions can be performed when a dragged object is released on the drop target.

`type aria-dropeffect = "link" | "popup" | "execute" | "none" | "copy" | "move"

`

##### aria-errormessage

 Identifies the element that provides an error message for the object.

* aria-invalid
* aria-describedby.

`type aria-errormessage = string

`

##### aria-expanded

 Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed.

`type aria-expanded = Booleanish

`

##### aria-flowto

 Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion, allows assistive technology to override the general default of reading in document source order.

`type aria-flowto = string

`

##### aria-grabbed

Deprecated

 in ARIA 1.1

 Indicates an element's "grabbed" state in a drag-and-drop operation.

`type aria-grabbed = Booleanish

`

##### aria-haspopup

 Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element.

`type aria-haspopup = boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree"

`

##### aria-hidden

 Indicates whether the element is exposed to an accessibility API.

 aria-disabled.

`type aria-hidden = Booleanish

`

##### aria-invalid

 Indicates the entered value does not conform to the format expected by the application.

 aria-errormessage.

`type aria-invalid = boolean | "false" | "true" | "grammar" | "spelling"

`

##### aria-keyshortcuts

 Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element.

`type aria-keyshortcuts = string

`

##### aria-label

 Defines a string value that labels the current element.

 aria-labelledby.

`type aria-label = string

`

##### aria-labelledby

 Identifies the element (or elements) that labels the current element.

 aria-describedby.

`type aria-labelledby = string

`

##### aria-level

 Defines the hierarchical level of an element within a structure.

`type aria-level = number

`

##### aria-live

 Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region.

`type aria-live = "off" | "polite" | "assertive"

`

##### aria-modal

 Indicates whether an element is modal when displayed.

`type aria-modal = Booleanish

`

##### aria-multiline

 Indicates whether a text box accepts multiple lines of input or only a single line.

`type aria-multiline = Booleanish

`

##### aria-multiselectable

 Indicates that the user may select more than one item from the current selectable descendants.

`type aria-multiselectable = Booleanish

`

##### aria-orientation

 Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous.

`type aria-orientation = "horizontal" | "vertical"

`

##### aria-owns

 Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship between DOM elements where the DOM hierarchy cannot be used to represent the relationship.

 aria-controls.

`type aria-owns = string

`

##### aria-placeholder

 Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value. A hint could be a sample value or a brief description of the expected format.

`type aria-placeholder = string

`

##### aria-posinset

 Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-setsize.

`type aria-posinset = number

`

##### aria-pressed

 Indicates the current "pressed" state of toggle buttons.

* aria-checked
* aria-selected.

`type aria-pressed = boolean | "false" | "true" | "mixed"

`

##### aria-readonly

 Indicates that the element is not editable, but is otherwise operable.

 aria-disabled.

`type aria-readonly = Booleanish

`

##### aria-relevant

 Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified.

 aria-atomic.

`type aria-relevant = "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals"

`

##### aria-required

 Indicates that user input is required on the element before a form may be submitted.

`type aria-required = Booleanish

`

##### aria-roledescription

 Defines a human-readable, author-localized description for the role of an element.

`type aria-roledescription = string

`

##### aria-rowcount

 Defines the total number of rows in a table, grid, or treegrid.

 aria-rowindex.

`type aria-rowcount = number

`

##### aria-rowindex

 Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid.

* aria-rowcount
* aria-rowspan.

`type aria-rowindex = number

`

##### aria-rowindextext

 Defines a human readable text alternative of aria-rowindex.

 aria-colindextext.

`type aria-rowindextext = string

`

##### aria-rowspan

 Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-rowindex
* aria-colspan.

`type aria-rowspan = number

`

##### aria-selected

 Indicates the current "selected" state of various widgets.

* aria-checked
* aria-pressed.

`type aria-selected = Booleanish

`

##### aria-setsize

 Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-posinset.

`type aria-setsize = number

`

##### aria-sort

 Indicates if items in a table or grid are sorted in ascending or descending order.

`type aria-sort = "none" | "ascending" | "descending" | "other"

`

##### aria-valuemax

 Defines the maximum allowed value for a range widget.

`type aria-valuemax = number

`

##### aria-valuemin

 Defines the minimum allowed value for a range widget.

`type aria-valuemin = number

`

##### aria-valuenow

 Defines the current value for a range widget.

 aria-valuetext.

`type aria-valuenow = number

`

##### aria-valuetext

 Defines the human readable text alternative of aria-valuenow for a range widget.

`type aria-valuetext = string

`

##### autoCapitalize

`type autoCapitalize =

| (string & {})

| "on"

| "off"

| "none"

| "sentences"

| "words"

| "characters";

`

##### autoCorrect

`type autoCorrect = string;

`

##### autoFocus

`type autoFocus = boolean;

`

##### autoSave

`type autoSave = string;

`

##### children

`type children = ReactNode;

`

##### className

`type className = string;

`

##### color

`type color = string;

`

##### content

`type content = string;

`

##### contentEditable

`type contentEditable = "inherit" | Booleanish | "plaintext-only";

`

##### contextMenu

`type contextMenu = string;

`

##### crossOrigin

`type crossOrigin = CrossOrigin;

`

##### dangerouslySetInnerHTML

`type dangerouslySetInnerHTML = { __html: string | TrustedHTML };

`

##### datatype

`type datatype = string;

`

##### decoding

`type decoding = "auto" | "async" | "sync";

`

##### defaultChecked

`type defaultChecked = boolean;

`

##### defaultValue

`type defaultValue = string | number | (readonly Array<string>)

`

##### dir

`type dir = string;

`

##### draggable

`type draggable = Booleanish;

`

##### enterKeyHint

`type enterKeyHint =

| "search"

| "done"

| "next"

| "send"

| "enter"

| "go"

| "previous";

`

##### fetchPriority

`type fetchPriority = "auto" | "high" | "low";

`

##### height

`type height = string | number;

`

##### hidden

`type hidden = boolean;

`

##### id

`type id = string;

`

##### inert

 https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert

`type inert = boolean;

`

##### inlist

`type inlist = any;

`

##### inputMode

 Hints at the type of data that might be entered by the user while editing the element or its contents

[ https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute](https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute)

`type inputMode =

| "search"

| "email"

| "url"

| "text"

| "none"

| "tel"

| "numeric"

| "decimal";

`

##### is

 Specify that a standard HTML element should behave like a defined custom built-in element

[ https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is](https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is)

`type is = string;

`

##### itemID

`type itemID = string;

`

##### itemProp

`type itemProp = string;

`

##### itemRef

`type itemRef = string;

`

##### itemScope

`type itemScope = boolean;

`

##### itemType

`type itemType = string;

`

##### lang

`type lang = string;

`

##### loading

`type loading = "eager" | "lazy";

`

##### nonce

`type nonce = string;

`

##### onAbort

`type onAbort = ReactEventHandler<HTMLImageElement>;

`

##### onAbortCapture

`type onAbortCapture = ReactEventHandler<HTMLImageElement>;

`

##### onAnimationEnd

`type onAnimationEnd = AnimationEventHandler<HTMLImageElement>;

`

##### onAnimationEndCapture

`type onAnimationEndCapture = AnimationEventHandler<HTMLImageElement>;

`

##### onAnimationIteration

`type onAnimationIteration = AnimationEventHandler<HTMLImageElement>;

`

##### onAnimationIterationCapture

`type onAnimationIterationCapture =

AnimationEventHandler<HTMLImageElement>;

`

##### onAnimationStart

`type onAnimationStart = AnimationEventHandler<HTMLImageElement>;

`

##### onAnimationStartCapture

`type onAnimationStartCapture =

AnimationEventHandler<HTMLImageElement>;

`

##### onAuxClick

`type onAuxClick = MouseEventHandler<HTMLImageElement>;

`

##### onAuxClickCapture

`type onAuxClickCapture = MouseEventHandler<HTMLImageElement>;

`

##### onBeforeInput

`type onBeforeInput = FormEventHandler<HTMLImageElement>;

`

##### onBeforeInputCapture

`type onBeforeInputCapture = FormEventHandler<HTMLImageElement>;

`

##### onBeforeToggle

`type onBeforeToggle = ToggleEventHandler<HTMLImageElement>;

`

##### onBlur

`type onBlur = FocusEventHandler<HTMLImageElement>;

`

##### onBlurCapture

`type onBlurCapture = FocusEventHandler<HTMLImageElement>;

`

##### onCanPlay

`type onCanPlay = ReactEventHandler<HTMLImageElement>;

`

##### onCanPlayCapture

`type onCanPlayCapture = ReactEventHandler<HTMLImageElement>;

`

##### onCanPlayThrough

`type onCanPlayThrough = ReactEventHandler<HTMLImageElement>;

`

##### onCanPlayThroughCapture

`type onCanPlayThroughCapture = ReactEventHandler<HTMLImageElement>;

`

##### onChange

`type onChange = FormEventHandler<HTMLImageElement>;

`

##### onChangeCapture

`type onChangeCapture = FormEventHandler<HTMLImageElement>;

`

##### onClick

`type onClick = MouseEventHandler<HTMLImageElement>;

`

##### onClickCapture

`type onClickCapture = MouseEventHandler<HTMLImageElement>;

`

##### onCompositionEnd

`type onCompositionEnd = CompositionEventHandler<HTMLImageElement>;

`

##### onCompositionEndCapture

`type onCompositionEndCapture =

CompositionEventHandler<HTMLImageElement>;

`

##### onCompositionStart

`type onCompositionStart = CompositionEventHandler<HTMLImageElement>;

`

##### onCompositionStartCapture

`type onCompositionStartCapture =

CompositionEventHandler<HTMLImageElement>;

`

##### onCompositionUpdate

`type onCompositionUpdate = CompositionEventHandler<HTMLImageElement>;

`

##### onCompositionUpdateCapture

`type onCompositionUpdateCapture =

CompositionEventHandler<HTMLImageElement>;

`

##### onContextMenu

`type onContextMenu = MouseEventHandler<HTMLImageElement>;

`

##### onContextMenuCapture

`type onContextMenuCapture = MouseEventHandler<HTMLImageElement>;

`

##### onCopy

`type onCopy = ClipboardEventHandler<HTMLImageElement>;

`

##### onCopyCapture

`type onCopyCapture = ClipboardEventHandler<HTMLImageElement>;

`

##### onCut

`type onCut = ClipboardEventHandler<HTMLImageElement>;

`

##### onCutCapture

`type onCutCapture = ClipboardEventHandler<HTMLImageElement>;

`

##### onDoubleClick

`type onDoubleClick = MouseEventHandler<HTMLImageElement>;

`

##### onDoubleClickCapture

`type onDoubleClickCapture = MouseEventHandler<HTMLImageElement>;

`

##### onDrag

`type onDrag = DragEventHandler<HTMLImageElement>;

`

##### onDragCapture

`type onDragCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragEnd

`type onDragEnd = DragEventHandler<HTMLImageElement>;

`

##### onDragEndCapture

`type onDragEndCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragEnter

`type onDragEnter = DragEventHandler<HTMLImageElement>;

`

##### onDragEnterCapture

`type onDragEnterCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragExit

`type onDragExit = DragEventHandler<HTMLImageElement>;

`

##### onDragExitCapture

`type onDragExitCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragLeave

`type onDragLeave = DragEventHandler<HTMLImageElement>;

`

##### onDragLeaveCapture

`type onDragLeaveCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragOver

`type onDragOver = DragEventHandler<HTMLImageElement>;

`

##### onDragOverCapture

`type onDragOverCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragStart

`type onDragStart = DragEventHandler<HTMLImageElement>;

`

##### onDragStartCapture

`type onDragStartCapture = DragEventHandler<HTMLImageElement>;

`

##### onDrop

`type onDrop = DragEventHandler<HTMLImageElement>;

`

##### onDropCapture

`type onDropCapture = DragEventHandler<HTMLImageElement>;

`

##### onDurationChange

`type onDurationChange = ReactEventHandler<HTMLImageElement>;

`

##### onDurationChangeCapture

`type onDurationChangeCapture = ReactEventHandler<HTMLImageElement>;

`

##### onEmptied

`type onEmptied = ReactEventHandler<HTMLImageElement>;

`

##### onEmptiedCapture

`type onEmptiedCapture = ReactEventHandler<HTMLImageElement>;

`

##### onEncrypted

`type onEncrypted = ReactEventHandler<HTMLImageElement>;

`

##### onEncryptedCapture

`type onEncryptedCapture = ReactEventHandler<HTMLImageElement>;

`

##### onEnded

`type onEnded = ReactEventHandler<HTMLImageElement>;

`

##### onEndedCapture

`type onEndedCapture = ReactEventHandler<HTMLImageElement>;

`

##### onError

`type onError = ReactEventHandler<HTMLImageElement>;

`

##### onErrorCapture

`type onErrorCapture = ReactEventHandler<HTMLImageElement>;

`

##### onFocus

`type onFocus = FocusEventHandler<HTMLImageElement>;

`

##### onFocusCapture

`type onFocusCapture = FocusEventHandler<HTMLImageElement>;

`

##### onGotPointerCapture

`type onGotPointerCapture = PointerEventHandler<HTMLImageElement>;

`

##### onGotPointerCaptureCapture

`type onGotPointerCaptureCapture =

PointerEventHandler<HTMLImageElement>;

`

##### onInput

`type onInput = FormEventHandler<HTMLImageElement>;

`

##### onInputCapture

`type onInputCapture = FormEventHandler<HTMLImageElement>;

`

##### onInvalid

`type onInvalid = FormEventHandler<HTMLImageElement>;

`

##### onInvalidCapture

`type onInvalidCapture = FormEventHandler<HTMLImageElement>;

`

##### onKeyDown

`type onKeyDown = KeyboardEventHandler<HTMLImageElement>;

`

##### onKeyDownCapture

`type onKeyDownCapture = KeyboardEventHandler<HTMLImageElement>;

`

##### onKeyPress

Deprecated

 Use `onKeyUp` or `onKeyDown` instead

`type onKeyPress = KeyboardEventHandler<HTMLImageElement>;

`

##### onKeyPressCapture

Deprecated

 Use `onKeyUpCapture` or `onKeyDownCapture` instead

`type onKeyPressCapture = KeyboardEventHandler<HTMLImageElement>;

`

##### onKeyUp

`type onKeyUp = KeyboardEventHandler<HTMLImageElement>;

`

##### onKeyUpCapture

`type onKeyUpCapture = KeyboardEventHandler<HTMLImageElement>;

`

##### onLoad

`type onLoad = ReactEventHandler<HTMLImageElement>;

`

##### onLoadCapture

`type onLoadCapture = ReactEventHandler<HTMLImageElement>;

`

##### onLoadedData

`type onLoadedData = ReactEventHandler<HTMLImageElement>;

`

##### onLoadedDataCapture

`type onLoadedDataCapture = ReactEventHandler<HTMLImageElement>;

`

##### onLoadedMetadata

`type onLoadedMetadata = ReactEventHandler<HTMLImageElement>;

`

##### onLoadedMetadataCapture

`type onLoadedMetadataCapture = ReactEventHandler<HTMLImageElement>;

`

##### onLoadStart

`type onLoadStart = ReactEventHandler<HTMLImageElement>;

`

##### onLoadStartCapture

`type onLoadStartCapture = ReactEventHandler<HTMLImageElement>;

`

##### onLostPointerCapture

`type onLostPointerCapture = PointerEventHandler<HTMLImageElement>;

`

##### onLostPointerCaptureCapture

`type onLostPointerCaptureCapture =

PointerEventHandler<HTMLImageElement>;

`

##### onMouseDown

`type onMouseDown = MouseEventHandler<HTMLImageElement>;

`

##### onMouseDownCapture

`type onMouseDownCapture = MouseEventHandler<HTMLImageElement>;

`

##### onMouseEnter

`type onMouseEnter = MouseEventHandler<HTMLImageElement>;

`

##### onMouseLeave

`type onMouseLeave = MouseEventHandler<HTMLImageElement>;

`

##### onMouseMove

`type onMouseMove = MouseEventHandler<HTMLImageElement>;

`

##### onMouseMoveCapture

`type onMouseMoveCapture = MouseEventHandler<HTMLImageElement>;

`

##### onMouseOut

`type onMouseOut = MouseEventHandler<HTMLImageElement>;

`

##### onMouseOutCapture

`type onMouseOutCapture = MouseEventHandler<HTMLImageElement>;

`

##### onMouseOver

`type onMouseOver = MouseEventHandler<HTMLImageElement>;

`

##### onMouseOverCapture

`type onMouseOverCapture = MouseEventHandler<HTMLImageElement>;

`

##### onMouseUp

`type onMouseUp = MouseEventHandler<HTMLImageElement>;

`

##### onMouseUpCapture

`type onMouseUpCapture = MouseEventHandler<HTMLImageElement>;

`

##### onPaste

`type onPaste = ClipboardEventHandler<HTMLImageElement>;

`

##### onPasteCapture

`type onPasteCapture = ClipboardEventHandler<HTMLImageElement>;

`

##### onPause

`type onPause = ReactEventHandler<HTMLImageElement>;

`

##### onPauseCapture

`type onPauseCapture = ReactEventHandler<HTMLImageElement>;

`

##### onPlay

`type onPlay = ReactEventHandler<HTMLImageElement>;

`

##### onPlayCapture

`type onPlayCapture = ReactEventHandler<HTMLImageElement>;

`

##### onPlaying

`type onPlaying = ReactEventHandler<HTMLImageElement>;

`

##### onPlayingCapture

`type onPlayingCapture = ReactEventHandler<HTMLImageElement>;

`

##### onPointerCancel

`type onPointerCancel = PointerEventHandler<HTMLImageElement>;

`

##### onPointerCancelCapture

`type onPointerCancelCapture = PointerEventHandler<HTMLImageElement>;

`

##### onPointerDown

`type onPointerDown = PointerEventHandler<HTMLImageElement>;

`

##### onPointerDownCapture

`type onPointerDownCapture = PointerEventHandler<HTMLImageElement>;

`

##### onPointerEnter

`type onPointerEnter = PointerEventHandler<HTMLImageElement>;

`

##### onPointerLeave

`type onPointerLeave = PointerEventHandler<HTMLImageElement>;

`

##### onPointerMove

`type onPointerMove = PointerEventHandler<HTMLImageElement>;

`

##### onPointerMoveCapture

`type onPointerMoveCapture = PointerEventHandler<HTMLImageElement>;

`

##### onPointerOut

`type onPointerOut = PointerEventHandler<HTMLImageElement>;

`

##### onPointerOutCapture

`type onPointerOutCapture = PointerEventHandler<HTMLImageElement>;

`

##### onPointerOver

`type onPointerOver = PointerEventHandler<HTMLImageElement>;

`

##### onPointerOverCapture

`type onPointerOverCapture = PointerEventHandler<HTMLImageElement>;

`

##### onPointerUp

`type onPointerUp = PointerEventHandler<HTMLImageElement>;

`

##### onPointerUpCapture

`type onPointerUpCapture = PointerEventHandler<HTMLImageElement>;

`

##### onProgress

`type onProgress = ReactEventHandler<HTMLImageElement>;

`

##### onProgressCapture

`type onProgressCapture = ReactEventHandler<HTMLImageElement>;

`

##### onRateChange

`type onRateChange = ReactEventHandler<HTMLImageElement>;

`

##### onRateChangeCapture

`type onRateChangeCapture = ReactEventHandler<HTMLImageElement>;

`

##### onReset

`type onReset = FormEventHandler<HTMLImageElement>;

`

##### onResetCapture

`type onResetCapture = FormEventHandler<HTMLImageElement>;

`

##### onResize

`type onResize = ReactEventHandler<HTMLImageElement>;

`

##### onResizeCapture

`type onResizeCapture = ReactEventHandler<HTMLImageElement>;

`

##### onScroll

`type onScroll = UIEventHandler<HTMLImageElement>;

`

##### onScrollCapture

`type onScrollCapture = UIEventHandler<HTMLImageElement>;

`

##### onSeeked

`type onSeeked = ReactEventHandler<HTMLImageElement>;

`

##### onSeekedCapture

`type onSeekedCapture = ReactEventHandler<HTMLImageElement>;

`

##### onSeeking

`type onSeeking = ReactEventHandler<HTMLImageElement>;

`

##### onSeekingCapture

`type onSeekingCapture = ReactEventHandler<HTMLImageElement>;

`

##### onSelect

`type onSelect = ReactEventHandler<HTMLImageElement>;

`

##### onSelectCapture

`type onSelectCapture = ReactEventHandler<HTMLImageElement>;

`

##### onStalled

`type onStalled = ReactEventHandler<HTMLImageElement>;

`

##### onStalledCapture

`type onStalledCapture = ReactEventHandler<HTMLImageElement>;

`

##### onSubmit

`type onSubmit = FormEventHandler<HTMLImageElement>;

`

##### onSubmitCapture

`type onSubmitCapture = FormEventHandler<HTMLImageElement>;

`

##### onSuspend

`type onSuspend = ReactEventHandler<HTMLImageElement>;

`

##### onSuspendCapture

`type onSuspendCapture = ReactEventHandler<HTMLImageElement>;

`

##### onTimeUpdate

`type onTimeUpdate = ReactEventHandler<HTMLImageElement>;

`

##### onTimeUpdateCapture

`type onTimeUpdateCapture = ReactEventHandler<HTMLImageElement>;

`

##### onToggle

`type onToggle = ToggleEventHandler<HTMLImageElement>;

`

##### onTouchCancel

`type onTouchCancel = TouchEventHandler<HTMLImageElement>;

`

##### onTouchCancelCapture

`type onTouchCancelCapture = TouchEventHandler<HTMLImageElement>;

`

##### onTouchEnd

`type onTouchEnd = TouchEventHandler<HTMLImageElement>;

`

##### onTouchEndCapture

`type onTouchEndCapture = TouchEventHandler<HTMLImageElement>;

`

##### onTouchMove

`type onTouchMove = TouchEventHandler<HTMLImageElement>;

`

##### onTouchMoveCapture

`type onTouchMoveCapture = TouchEventHandler<HTMLImageElement>;

`

##### onTouchStart

`type onTouchStart = TouchEventHandler<HTMLImageElement>;

`

##### onTouchStartCapture

`type onTouchStartCapture = TouchEventHandler<HTMLImageElement>;

`

##### onTransitionCancel

`type onTransitionCancel = TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionCancelCapture

`type onTransitionCancelCapture =

TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionEnd

`type onTransitionEnd = TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionEndCapture

`type onTransitionEndCapture =

TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionRun

`type onTransitionRun = TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionRunCapture

`type onTransitionRunCapture =

TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionStart

`type onTransitionStart = TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionStartCapture

`type onTransitionStartCapture =

TransitionEventHandler<HTMLImageElement>;

`

##### onVolumeChange

`type onVolumeChange = ReactEventHandler<HTMLImageElement>;

`

##### onVolumeChangeCapture

`type onVolumeChangeCapture = ReactEventHandler<HTMLImageElement>;

`

##### onWaiting

`type onWaiting = ReactEventHandler<HTMLImageElement>;

`

##### onWaitingCapture

`type onWaitingCapture = ReactEventHandler<HTMLImageElement>;

`

##### onWheel

`type onWheel = WheelEventHandler<HTMLImageElement>;

`

##### onWheelCapture

`type onWheelCapture = WheelEventHandler<HTMLImageElement>;

`

##### popover

`type popover = "" | "auto" | "manual";

`

##### popoverTarget

`type popoverTarget = string;

`

##### popoverTargetAction

`type popoverTargetAction = "toggle" | "hide" | "show";

`

##### prefix

`type prefix = string;

`

##### property

`type property = string;

`

##### provider

`type provider = string;

`

##### radioGroup

`type radioGroup = string;

`

##### referrerPolicy

`type referrerPolicy = HTMLAttributeReferrerPolicy;

`

##### rel

`type rel = string;

`

##### resource

`type resource = string;

`

##### results

`type results = number;

`

##### rev

`type rev = string;

`

##### role

`type role = AriaRole;

`

##### security

`type security = string;

`

##### sizes

`type sizes = string;

`

##### slot

`type slot = string;

`

##### spellCheck

`type spellCheck = Booleanish;

`

##### srcSet

`type srcSet = string;

`

##### style

`type style = CSSProperties;

`

##### suppressContentEditableWarning

`type suppressContentEditableWarning = boolean;

`

##### suppressHydrationWarning

`type suppressHydrationWarning = boolean;

`

##### tabIndex

`type tabIndex = number;

`

##### title

`type title = string;

`

##### translate

`type translate = "yes" | "no";

`

##### typeof

`type typeof = string

`

##### unselectable

`type unselectable = "on" | "off";

`

##### useMap

`type useMap = string;

`

##### vocab

`type vocab = string;

`

##### width

`type width = string | number;

`
## TokenIconProps

 Props for the TokenIcon component

`interface TokenIconProps extends Omit<React.ImgHTMLAttributes<HTMLImageElement>, "src"> {about : string,accessKey : string,alt : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,children : ReactNode,className : string,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,crossOrigin : CrossOrigin,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,decoding : "auto" | "async" | "sync",defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",fallbackComponent : Element,fetchPriority : "auto" | "high" | "low",height : string | number,hidden : boolean,iconResolver : string | (() => string) | (() => Promise<string>),id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,loading : "eager" | "lazy",loadingComponent : Element,nonce : string,onAbort : ReactEventHandler<HTMLImageElement>,onAbortCapture : ReactEventHandler<HTMLImageElement>,onAnimationEnd : AnimationEventHandler<HTMLImageElement>,onAnimationEndCapture : AnimationEventHandler<HTMLImageElement>,onAnimationIteration : AnimationEventHandler<HTMLImageElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLImageElement>,onAnimationStart : AnimationEventHandler<HTMLImageElement>,onAnimationStartCapture : AnimationEventHandler<HTMLImageElement>,onAuxClick : MouseEventHandler<HTMLImageElement>,onAuxClickCapture : MouseEventHandler<HTMLImageElement>,onBeforeInput : FormEventHandler<HTMLImageElement>,onBeforeInputCapture : FormEventHandler<HTMLImageElement>,onBeforeToggle : ToggleEventHandler<HTMLImageElement>,onBlur : FocusEventHandler<HTMLImageElement>,onBlurCapture : FocusEventHandler<HTMLImageElement>,onCanPlay : ReactEventHandler<HTMLImageElement>,onCanPlayCapture : ReactEventHandler<HTMLImageElement>,onCanPlayThrough : ReactEventHandler<HTMLImageElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLImageElement>,onChange : FormEventHandler<HTMLImageElement>,onChangeCapture : FormEventHandler<HTMLImageElement>,onClick : MouseEventHandler<HTMLImageElement>,onClickCapture : MouseEventHandler<HTMLImageElement>,onCompositionEnd : CompositionEventHandler<HTMLImageElement>,onCompositionEndCapture : CompositionEventHandler<HTMLImageElement>,onCompositionStart : CompositionEventHandler<HTMLImageElement>,onCompositionStartCapture : CompositionEventHandler<HTMLImageElement>,onCompositionUpdate : CompositionEventHandler<HTMLImageElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLImageElement>,onContextMenu : MouseEventHandler<HTMLImageElement>,onContextMenuCapture : MouseEventHandler<HTMLImageElement>,onCopy : ClipboardEventHandler<HTMLImageElement>,onCopyCapture : ClipboardEventHandler<HTMLImageElement>,onCut : ClipboardEventHandler<HTMLImageElement>,onCutCapture : ClipboardEventHandler<HTMLImageElement>,onDoubleClick : MouseEventHandler<HTMLImageElement>,onDoubleClickCapture : MouseEventHandler<HTMLImageElement>,onDrag : DragEventHandler<HTMLImageElement>,onDragCapture : DragEventHandler<HTMLImageElement>,onDragEnd : DragEventHandler<HTMLImageElement>,onDragEndCapture : DragEventHandler<HTMLImageElement>,onDragEnter : DragEventHandler<HTMLImageElement>,onDragEnterCapture : DragEventHandler<HTMLImageElement>,onDragExit : DragEventHandler<HTMLImageElement>,onDragExitCapture : DragEventHandler<HTMLImageElement>,onDragLeave : DragEventHandler<HTMLImageElement>,onDragLeaveCapture : DragEventHandler<HTMLImageElement>,onDragOver : DragEventHandler<HTMLImageElement>,onDragOverCapture : DragEventHandler<HTMLImageElement>,onDragStart : DragEventHandler<HTMLImageElement>,onDragStartCapture : DragEventHandler<HTMLImageElement>,onDrop : DragEventHandler<HTMLImageElement>,onDropCapture : DragEventHandler<HTMLImageElement>,onDurationChange : ReactEventHandler<HTMLImageElement>,onDurationChangeCapture : ReactEventHandler<HTMLImageElement>,onEmptied : ReactEventHandler<HTMLImageElement>,onEmptiedCapture : ReactEventHandler<HTMLImageElement>,onEncrypted : ReactEventHandler<HTMLImageElement>,onEncryptedCapture : ReactEventHandler<HTMLImageElement>,onEnded : ReactEventHandler<HTMLImageElement>,onEndedCapture : ReactEventHandler<HTMLImageElement>,onError : ReactEventHandler<HTMLImageElement>,onErrorCapture : ReactEventHandler<HTMLImageElement>,onFocus : FocusEventHandler<HTMLImageElement>,onFocusCapture : FocusEventHandler<HTMLImageElement>,onGotPointerCapture : PointerEventHandler<HTMLImageElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLImageElement>,onInput : FormEventHandler<HTMLImageElement>,onInputCapture : FormEventHandler<HTMLImageElement>,onInvalid : FormEventHandler<HTMLImageElement>,onInvalidCapture : FormEventHandler<HTMLImageElement>,onKeyDown : KeyboardEventHandler<HTMLImageElement>,onKeyDownCapture : KeyboardEventHandler<HTMLImageElement>,onKeyPress : KeyboardEventHandler<HTMLImageElement>,onKeyPressCapture : KeyboardEventHandler<HTMLImageElement>,onKeyUp : KeyboardEventHandler<HTMLImageElement>,onKeyUpCapture : KeyboardEventHandler<HTMLImageElement>,onLoad : ReactEventHandler<HTMLImageElement>,onLoadCapture : ReactEventHandler<HTMLImageElement>,onLoadedData : ReactEventHandler<HTMLImageElement>,onLoadedDataCapture : ReactEventHandler<HTMLImageElement>,onLoadedMetadata : ReactEventHandler<HTMLImageElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLImageElement>,onLoadStart : ReactEventHandler<HTMLImageElement>,onLoadStartCapture : ReactEventHandler<HTMLImageElement>,onLostPointerCapture : PointerEventHandler<HTMLImageElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLImageElement>,onMouseDown : MouseEventHandler<HTMLImageElement>,onMouseDownCapture : MouseEventHandler<HTMLImageElement>,onMouseEnter : MouseEventHandler<HTMLImageElement>,onMouseLeave : MouseEventHandler<HTMLImageElement>,onMouseMove : MouseEventHandler<HTMLImageElement>,onMouseMoveCapture : MouseEventHandler<HTMLImageElement>,onMouseOut : MouseEventHandler<HTMLImageElement>,onMouseOutCapture : MouseEventHandler<HTMLImageElement>,onMouseOver : MouseEventHandler<HTMLImageElement>,onMouseOverCapture : MouseEventHandler<HTMLImageElement>,onMouseUp : MouseEventHandler<HTMLImageElement>,onMouseUpCapture : MouseEventHandler<HTMLImageElement>,onPaste : ClipboardEventHandler<HTMLImageElement>,onPasteCapture : ClipboardEventHandler<HTMLImageElement>,onPause : ReactEventHandler<HTMLImageElement>,onPauseCapture : ReactEventHandler<HTMLImageElement>,onPlay : ReactEventHandler<HTMLImageElement>,onPlayCapture : ReactEventHandler<HTMLImageElement>,onPlaying : ReactEventHandler<HTMLImageElement>,onPlayingCapture : ReactEventHandler<HTMLImageElement>,onPointerCancel : PointerEventHandler<HTMLImageElement>,onPointerCancelCapture : PointerEventHandler<HTMLImageElement>,onPointerDown : PointerEventHandler<HTMLImageElement>,onPointerDownCapture : PointerEventHandler<HTMLImageElement>,onPointerEnter : PointerEventHandler<HTMLImageElement>,onPointerLeave : PointerEventHandler<HTMLImageElement>,onPointerMove : PointerEventHandler<HTMLImageElement>,onPointerMoveCapture : PointerEventHandler<HTMLImageElement>,onPointerOut : PointerEventHandler<HTMLImageElement>,onPointerOutCapture : PointerEventHandler<HTMLImageElement>,onPointerOver : PointerEventHandler<HTMLImageElement>,onPointerOverCapture : PointerEventHandler<HTMLImageElement>,onPointerUp : PointerEventHandler<HTMLImageElement>,onPointerUpCapture : PointerEventHandler<HTMLImageElement>,onProgress : ReactEventHandler<HTMLImageElement>,onProgressCapture : ReactEventHandler<HTMLImageElement>,onRateChange : ReactEventHandler<HTMLImageElement>,onRateChangeCapture : ReactEventHandler<HTMLImageElement>,onReset : FormEventHandler<HTMLImageElement>,onResetCapture : FormEventHandler<HTMLImageElement>,onResize : ReactEventHandler<HTMLImageElement>,onResizeCapture : ReactEventHandler<HTMLImageElement>,onScroll : UIEventHandler<HTMLImageElement>,onScrollCapture : UIEventHandler<HTMLImageElement>,onSeeked : ReactEventHandler<HTMLImageElement>,onSeekedCapture : ReactEventHandler<HTMLImageElement>,onSeeking : ReactEventHandler<HTMLImageElement>,onSeekingCapture : ReactEventHandler<HTMLImageElement>,onSelect : ReactEventHandler<HTMLImageElement>,onSelectCapture : ReactEventHandler<HTMLImageElement>,onStalled : ReactEventHandler<HTMLImageElement>,onStalledCapture : ReactEventHandler<HTMLImageElement>,onSubmit : FormEventHandler<HTMLImageElement>,onSubmitCapture : FormEventHandler<HTMLImageElement>,onSuspend : ReactEventHandler<HTMLImageElement>,onSuspendCapture : ReactEventHandler<HTMLImageElement>,onTimeUpdate : ReactEventHandler<HTMLImageElement>,onTimeUpdateCapture : ReactEventHandler<HTMLImageElement>,onToggle : ToggleEventHandler<HTMLImageElement>,onTouchCancel : TouchEventHandler<HTMLImageElement>,onTouchCancelCapture : TouchEventHandler<HTMLImageElement>,onTouchEnd : TouchEventHandler<HTMLImageElement>,onTouchEndCapture : TouchEventHandler<HTMLImageElement>,onTouchMove : TouchEventHandler<HTMLImageElement>,onTouchMoveCapture : TouchEventHandler<HTMLImageElement>,onTouchStart : TouchEventHandler<HTMLImageElement>,onTouchStartCapture : TouchEventHandler<HTMLImageElement>,onTransitionCancel : TransitionEventHandler<HTMLImageElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLImageElement>,onTransitionEnd : TransitionEventHandler<HTMLImageElement>,onTransitionEndCapture : TransitionEventHandler<HTMLImageElement>,onTransitionRun : TransitionEventHandler<HTMLImageElement>,onTransitionRunCapture : TransitionEventHandler<HTMLImageElement>,onTransitionStart : TransitionEventHandler<HTMLImageElement>,onTransitionStartCapture : TransitionEventHandler<HTMLImageElement>,onVolumeChange : ReactEventHandler<HTMLImageElement>,onVolumeChangeCapture : ReactEventHandler<HTMLImageElement>,onWaiting : ReactEventHandler<HTMLImageElement>,onWaitingCapture : ReactEventHandler<HTMLImageElement>,onWheel : WheelEventHandler<HTMLImageElement>,onWheelCapture : WheelEventHandler<HTMLImageElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,queryOptions : Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">,radioGroup : string,referrerPolicy : HTMLAttributeReferrerPolicy,rel : string,resource : string,results : number,rev : string,role : AriaRole,security : string,sizes : string,slot : string,spellCheck : Booleanish,srcSet : string,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,tabIndex : number,title : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",useMap : string,vocab : string,width : string | number}

`

##### about

`type about = string;

`

##### accessKey

`type accessKey = string;

`

##### alt

`type alt = string;

`

##### aria-activedescendant

 Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application.

`type aria-activedescendant = string

`

##### aria-atomic

 Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute.

`type aria-atomic = Booleanish

`

##### aria-autocomplete

 Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be presented if they are made.

`type aria-autocomplete = "inline" | "none" | "list" | "both"

`

##### aria-braillelabel

 Defines a string value that labels the current element, which is intended to be converted into Braille.

 aria-label.

`type aria-braillelabel = string

`

##### aria-brailleroledescription

 Defines a human-readable, author-localized abbreviated description for the role of an element, which is intended to be converted into Braille.

 aria-roledescription.

`type aria-brailleroledescription = string

`

##### aria-busy

`type aria-busy = Booleanish

`

##### aria-checked

 Indicates the current "checked" state of checkboxes, radio buttons, and other widgets.

* aria-pressed
* aria-selected.

`type aria-checked = boolean | "false" | "true" | "mixed"

`

##### aria-colcount

 Defines the total number of columns in a table, grid, or treegrid.

 aria-colindex.

`type aria-colcount = number

`

##### aria-colindex

 Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid.

* aria-colcount
* aria-colspan.

`type aria-colindex = number

`

##### aria-colindextext

 Defines a human readable text alternative of aria-colindex.

 aria-rowindextext.

`type aria-colindextext = string

`

##### aria-colspan

 Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-colindex
* aria-rowspan.

`type aria-colspan = number

`

##### aria-controls

 Identifies the element (or elements) whose contents or presence are controlled by the current element.

 aria-owns.

`type aria-controls = string

`

##### aria-current

 Indicates the element that represents the current item within a container or set of related elements.

`type aria-current = boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date"

`

##### aria-describedby

 Identifies the element (or elements) that describes the object.

 aria-labelledby

`type aria-describedby = string

`

##### aria-description

 Defines a string value that describes or annotates the current element.

 related aria-describedby.

`type aria-description = string

`

##### aria-details

 Identifies the element that provides a detailed, extended description for the object.

 aria-describedby.

`type aria-details = string

`

##### aria-disabled

 Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable.

* aria-hidden
* aria-readonly.

`type aria-disabled = Booleanish

`

##### aria-dropeffect

Deprecated

 in ARIA 1.1

 Indicates what functions can be performed when a dragged object is released on the drop target.

`type aria-dropeffect = "link" | "popup" | "execute" | "none" | "copy" | "move"

`

##### aria-errormessage

 Identifies the element that provides an error message for the object.

* aria-invalid
* aria-describedby.

`type aria-errormessage = string

`

##### aria-expanded

 Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed.

`type aria-expanded = Booleanish

`

##### aria-flowto

 Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion, allows assistive technology to override the general default of reading in document source order.

`type aria-flowto = string

`

##### aria-grabbed

Deprecated

 in ARIA 1.1

 Indicates an element's "grabbed" state in a drag-and-drop operation.

`type aria-grabbed = Booleanish

`

##### aria-haspopup

 Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element.

`type aria-haspopup = boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree"

`

##### aria-hidden

 Indicates whether the element is exposed to an accessibility API.

 aria-disabled.

`type aria-hidden = Booleanish

`

##### aria-invalid

 Indicates the entered value does not conform to the format expected by the application.

 aria-errormessage.

`type aria-invalid = boolean | "false" | "true" | "grammar" | "spelling"

`

##### aria-keyshortcuts

 Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element.

`type aria-keyshortcuts = string

`

##### aria-label

 Defines a string value that labels the current element.

 aria-labelledby.

`type aria-label = string

`

##### aria-labelledby

 Identifies the element (or elements) that labels the current element.

 aria-describedby.

`type aria-labelledby = string

`

##### aria-level

 Defines the hierarchical level of an element within a structure.

`type aria-level = number

`

##### aria-live

 Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region.

`type aria-live = "off" | "polite" | "assertive"

`

##### aria-modal

 Indicates whether an element is modal when displayed.

`type aria-modal = Booleanish

`

##### aria-multiline

 Indicates whether a text box accepts multiple lines of input or only a single line.

`type aria-multiline = Booleanish

`

##### aria-multiselectable

 Indicates that the user may select more than one item from the current selectable descendants.

`type aria-multiselectable = Booleanish

`

##### aria-orientation

 Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous.

`type aria-orientation = "horizontal" | "vertical"

`

##### aria-owns

 Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship between DOM elements where the DOM hierarchy cannot be used to represent the relationship.

 aria-controls.

`type aria-owns = string

`

##### aria-placeholder

 Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value. A hint could be a sample value or a brief description of the expected format.

`type aria-placeholder = string

`

##### aria-posinset

 Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-setsize.

`type aria-posinset = number

`

##### aria-pressed

 Indicates the current "pressed" state of toggle buttons.

* aria-checked
* aria-selected.

`type aria-pressed = boolean | "false" | "true" | "mixed"

`

##### aria-readonly

 Indicates that the element is not editable, but is otherwise operable.

 aria-disabled.

`type aria-readonly = Booleanish

`

##### aria-relevant

 Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified.

 aria-atomic.

`type aria-relevant = "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals"

`

##### aria-required

 Indicates that user input is required on the element before a form may be submitted.

`type aria-required = Booleanish

`

##### aria-roledescription

 Defines a human-readable, author-localized description for the role of an element.

`type aria-roledescription = string

`

##### aria-rowcount

 Defines the total number of rows in a table, grid, or treegrid.

 aria-rowindex.

`type aria-rowcount = number

`

##### aria-rowindex

 Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid.

* aria-rowcount
* aria-rowspan.

`type aria-rowindex = number

`

##### aria-rowindextext

 Defines a human readable text alternative of aria-rowindex.

 aria-colindextext.

`type aria-rowindextext = string

`

##### aria-rowspan

 Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-rowindex
* aria-colspan.

`type aria-rowspan = number

`

##### aria-selected

 Indicates the current "selected" state of various widgets.

* aria-checked
* aria-pressed.

`type aria-selected = Booleanish

`

##### aria-setsize

 Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-posinset.

`type aria-setsize = number

`

##### aria-sort

 Indicates if items in a table or grid are sorted in ascending or descending order.

`type aria-sort = "none" | "ascending" | "descending" | "other"

`

##### aria-valuemax

 Defines the maximum allowed value for a range widget.

`type aria-valuemax = number

`

##### aria-valuemin

 Defines the minimum allowed value for a range widget.

`type aria-valuemin = number

`

##### aria-valuenow

 Defines the current value for a range widget.

 aria-valuetext.

`type aria-valuenow = number

`

##### aria-valuetext

 Defines the human readable text alternative of aria-valuenow for a range widget.

`type aria-valuetext = string

`

##### autoCapitalize

`type autoCapitalize =

| (string & {})

| "on"

| "off"

| "none"

| "sentences"

| "words"

| "characters";

`

##### autoCorrect

`type autoCorrect = string;

`

##### autoFocus

`type autoFocus = boolean;

`

##### autoSave

`type autoSave = string;

`

##### children

`type children = ReactNode;

`

##### className

`type className = string;

`

##### color

`type color = string;

`

##### content

`type content = string;

`

##### contentEditable

`type contentEditable = "inherit" | Booleanish | "plaintext-only";

`

##### contextMenu

`type contextMenu = string;

`

##### crossOrigin

`type crossOrigin = CrossOrigin;

`

##### dangerouslySetInnerHTML

`type dangerouslySetInnerHTML = { __html: string | TrustedHTML };

`

##### datatype

`type datatype = string;

`

##### decoding

`type decoding = "auto" | "async" | "sync";

`

##### defaultChecked

`type defaultChecked = boolean;

`

##### defaultValue

`type defaultValue = string | number | (readonly Array<string>)

`

##### dir

`type dir = string;

`

##### draggable

`type draggable = Booleanish;

`

##### enterKeyHint

`type enterKeyHint =

| "search"

| "done"

| "next"

| "send"

| "enter"

| "go"

| "previous";

`

##### fallbackComponent

 This component will be shown if the request for fetching the avatar is done but could not retreive any result. You can pass a dummy avatar/image to this prop.

 If not passed, the component will return `null`

`type fallbackComponent = Element;

`

### Example

`<TokenIcon fallbackComponent={<DummyImage />} />;

`

##### fetchPriority

`type fetchPriority = "auto" | "high" | "low";

`

##### height

`type height = string | number;

`

##### hidden

`type hidden = boolean;

`

##### iconResolver

 This prop can be a string or a (async) function that resolves to a string, representing the icon url of the token This is particularly useful if you already have a way to fetch the token icon.

`type iconResolver = string | (() => string) | (() => Promise<string>);

`

##### id

`type id = string;

`

##### inert

 https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert

`type inert = boolean;

`

##### inlist

`type inlist = any;

`

##### inputMode

 Hints at the type of data that might be entered by the user while editing the element or its contents

[ https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute](https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute)

`type inputMode =

| "search"

| "email"

| "url"

| "text"

| "none"

| "tel"

| "numeric"

| "decimal";

`

##### is

 Specify that a standard HTML element should behave like a defined custom built-in element

[ https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is](https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is)

`type is = string;

`

##### itemID

`type itemID = string;

`

##### itemProp

`type itemProp = string;

`

##### itemRef

`type itemRef = string;

`

##### itemScope

`type itemScope = boolean;

`

##### itemType

`type itemType = string;

`

##### lang

`type lang = string;

`

##### loading

`type loading = "eager" | "lazy";

`

##### loadingComponent

 This component will be shown while the avatar of the icon is being fetched If not passed, the component will return `null` .

 You can pass a loading sign or spinner to this prop.

`type loadingComponent = Element;

`

### Example

`<TokenIcon loadingComponent={<Spinner />} />;

`

##### nonce

`type nonce = string;

`

##### onAbort

`type onAbort = ReactEventHandler<HTMLImageElement>;

`

##### onAbortCapture

`type onAbortCapture = ReactEventHandler<HTMLImageElement>;

`

##### onAnimationEnd

`type onAnimationEnd = AnimationEventHandler<HTMLImageElement>;

`

##### onAnimationEndCapture

`type onAnimationEndCapture = AnimationEventHandler<HTMLImageElement>;

`

##### onAnimationIteration

`type onAnimationIteration = AnimationEventHandler<HTMLImageElement>;

`

##### onAnimationIterationCapture

`type onAnimationIterationCapture =

AnimationEventHandler<HTMLImageElement>;

`

##### onAnimationStart

`type onAnimationStart = AnimationEventHandler<HTMLImageElement>;

`

##### onAnimationStartCapture

`type onAnimationStartCapture =

AnimationEventHandler<HTMLImageElement>;

`

##### onAuxClick

`type onAuxClick = MouseEventHandler<HTMLImageElement>;

`

##### onAuxClickCapture

`type onAuxClickCapture = MouseEventHandler<HTMLImageElement>;

`

##### onBeforeInput

`type onBeforeInput = FormEventHandler<HTMLImageElement>;

`

##### onBeforeInputCapture

`type onBeforeInputCapture = FormEventHandler<HTMLImageElement>;

`

##### onBeforeToggle

`type onBeforeToggle = ToggleEventHandler<HTMLImageElement>;

`

##### onBlur

`type onBlur = FocusEventHandler<HTMLImageElement>;

`

##### onBlurCapture

`type onBlurCapture = FocusEventHandler<HTMLImageElement>;

`

##### onCanPlay

`type onCanPlay = ReactEventHandler<HTMLImageElement>;

`

##### onCanPlayCapture

`type onCanPlayCapture = ReactEventHandler<HTMLImageElement>;

`

##### onCanPlayThrough

`type onCanPlayThrough = ReactEventHandler<HTMLImageElement>;

`

##### onCanPlayThroughCapture

`type onCanPlayThroughCapture = ReactEventHandler<HTMLImageElement>;

`

##### onChange

`type onChange = FormEventHandler<HTMLImageElement>;

`

##### onChangeCapture

`type onChangeCapture = FormEventHandler<HTMLImageElement>;

`

##### onClick

`type onClick = MouseEventHandler<HTMLImageElement>;

`

##### onClickCapture

`type onClickCapture = MouseEventHandler<HTMLImageElement>;

`

##### onCompositionEnd

`type onCompositionEnd = CompositionEventHandler<HTMLImageElement>;

`

##### onCompositionEndCapture

`type onCompositionEndCapture =

CompositionEventHandler<HTMLImageElement>;

`

##### onCompositionStart

`type onCompositionStart = CompositionEventHandler<HTMLImageElement>;

`

##### onCompositionStartCapture

`type onCompositionStartCapture =

CompositionEventHandler<HTMLImageElement>;

`

##### onCompositionUpdate

`type onCompositionUpdate = CompositionEventHandler<HTMLImageElement>;

`

##### onCompositionUpdateCapture

`type onCompositionUpdateCapture =

CompositionEventHandler<HTMLImageElement>;

`

##### onContextMenu

`type onContextMenu = MouseEventHandler<HTMLImageElement>;

`

##### onContextMenuCapture

`type onContextMenuCapture = MouseEventHandler<HTMLImageElement>;

`

##### onCopy

`type onCopy = ClipboardEventHandler<HTMLImageElement>;

`

##### onCopyCapture

`type onCopyCapture = ClipboardEventHandler<HTMLImageElement>;

`

##### onCut

`type onCut = ClipboardEventHandler<HTMLImageElement>;

`

##### onCutCapture

`type onCutCapture = ClipboardEventHandler<HTMLImageElement>;

`

##### onDoubleClick

`type onDoubleClick = MouseEventHandler<HTMLImageElement>;

`

##### onDoubleClickCapture

`type onDoubleClickCapture = MouseEventHandler<HTMLImageElement>;

`

##### onDrag

`type onDrag = DragEventHandler<HTMLImageElement>;

`

##### onDragCapture

`type onDragCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragEnd

`type onDragEnd = DragEventHandler<HTMLImageElement>;

`

##### onDragEndCapture

`type onDragEndCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragEnter

`type onDragEnter = DragEventHandler<HTMLImageElement>;

`

##### onDragEnterCapture

`type onDragEnterCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragExit

`type onDragExit = DragEventHandler<HTMLImageElement>;

`

##### onDragExitCapture

`type onDragExitCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragLeave

`type onDragLeave = DragEventHandler<HTMLImageElement>;

`

##### onDragLeaveCapture

`type onDragLeaveCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragOver

`type onDragOver = DragEventHandler<HTMLImageElement>;

`

##### onDragOverCapture

`type onDragOverCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragStart

`type onDragStart = DragEventHandler<HTMLImageElement>;

`

##### onDragStartCapture

`type onDragStartCapture = DragEventHandler<HTMLImageElement>;

`

##### onDrop

`type onDrop = DragEventHandler<HTMLImageElement>;

`

##### onDropCapture

`type onDropCapture = DragEventHandler<HTMLImageElement>;

`

##### onDurationChange

`type onDurationChange = ReactEventHandler<HTMLImageElement>;

`

##### onDurationChangeCapture

`type onDurationChangeCapture = ReactEventHandler<HTMLImageElement>;

`

##### onEmptied

`type onEmptied = ReactEventHandler<HTMLImageElement>;

`

##### onEmptiedCapture

`type onEmptiedCapture = ReactEventHandler<HTMLImageElement>;

`

##### onEncrypted

`type onEncrypted = ReactEventHandler<HTMLImageElement>;

`

##### onEncryptedCapture

`type onEncryptedCapture = ReactEventHandler<HTMLImageElement>;

`

##### onEnded

`type onEnded = ReactEventHandler<HTMLImageElement>;

`

##### onEndedCapture

`type onEndedCapture = ReactEventHandler<HTMLImageElement>;

`

##### onError

`type onError = ReactEventHandler<HTMLImageElement>;

`

##### onErrorCapture

`type onErrorCapture = ReactEventHandler<HTMLImageElement>;

`

##### onFocus

`type onFocus = FocusEventHandler<HTMLImageElement>;

`

##### onFocusCapture

`type onFocusCapture = FocusEventHandler<HTMLImageElement>;

`

##### onGotPointerCapture

`type onGotPointerCapture = PointerEventHandler<HTMLImageElement>;

`

##### onGotPointerCaptureCapture

`type onGotPointerCaptureCapture =

PointerEventHandler<HTMLImageElement>;

`

##### onInput

`type onInput = FormEventHandler<HTMLImageElement>;

`

##### onInputCapture

`type onInputCapture = FormEventHandler<HTMLImageElement>;

`

##### onInvalid

`type onInvalid = FormEventHandler<HTMLImageElement>;

`

##### onInvalidCapture

`type onInvalidCapture = FormEventHandler<HTMLImageElement>;

`

##### onKeyDown

`type onKeyDown = KeyboardEventHandler<HTMLImageElement>;

`

##### onKeyDownCapture

`type onKeyDownCapture = KeyboardEventHandler<HTMLImageElement>;

`

##### onKeyPress

Deprecated

 Use `onKeyUp` or `onKeyDown` instead

`type onKeyPress = KeyboardEventHandler<HTMLImageElement>;

`

##### onKeyPressCapture

Deprecated

 Use `onKeyUpCapture` or `onKeyDownCapture` instead

`type onKeyPressCapture = KeyboardEventHandler<HTMLImageElement>;

`

##### onKeyUp

`type onKeyUp = KeyboardEventHandler<HTMLImageElement>;

`

##### onKeyUpCapture

`type onKeyUpCapture = KeyboardEventHandler<HTMLImageElement>;

`

##### onLoad

`type onLoad = ReactEventHandler<HTMLImageElement>;

`

##### onLoadCapture

`type onLoadCapture = ReactEventHandler<HTMLImageElement>;

`

##### onLoadedData

`type onLoadedData = ReactEventHandler<HTMLImageElement>;

`

##### onLoadedDataCapture

`type onLoadedDataCapture = ReactEventHandler<HTMLImageElement>;

`

##### onLoadedMetadata

`type onLoadedMetadata = ReactEventHandler<HTMLImageElement>;

`

##### onLoadedMetadataCapture

`type onLoadedMetadataCapture = ReactEventHandler<HTMLImageElement>;

`

##### onLoadStart

`type onLoadStart = ReactEventHandler<HTMLImageElement>;

`

##### onLoadStartCapture

`type onLoadStartCapture = ReactEventHandler<HTMLImageElement>;

`

##### onLostPointerCapture

`type onLostPointerCapture = PointerEventHandler<HTMLImageElement>;

`

##### onLostPointerCaptureCapture

`type onLostPointerCaptureCapture =

PointerEventHandler<HTMLImageElement>;

`

##### onMouseDown

`type onMouseDown = MouseEventHandler<HTMLImageElement>;

`

##### onMouseDownCapture

`type onMouseDownCapture = MouseEventHandler<HTMLImageElement>;

`

##### onMouseEnter

`type onMouseEnter = MouseEventHandler<HTMLImageElement>;

`

##### onMouseLeave

`type onMouseLeave = MouseEventHandler<HTMLImageElement>;

`

##### onMouseMove

`type onMouseMove = MouseEventHandler<HTMLImageElement>;

`

##### onMouseMoveCapture

`type onMouseMoveCapture = MouseEventHandler<HTMLImageElement>;

`

##### onMouseOut

`type onMouseOut = MouseEventHandler<HTMLImageElement>;

`

##### onMouseOutCapture

`type onMouseOutCapture = MouseEventHandler<HTMLImageElement>;

`

##### onMouseOver

`type onMouseOver = MouseEventHandler<HTMLImageElement>;

`

##### onMouseOverCapture

`type onMouseOverCapture = MouseEventHandler<HTMLImageElement>;

`

##### onMouseUp

`type onMouseUp = MouseEventHandler<HTMLImageElement>;

`

##### onMouseUpCapture

`type onMouseUpCapture = MouseEventHandler<HTMLImageElement>;

`

##### onPaste

`type onPaste = ClipboardEventHandler<HTMLImageElement>;

`

##### onPasteCapture

`type onPasteCapture = ClipboardEventHandler<HTMLImageElement>;

`

##### onPause

`type onPause = ReactEventHandler<HTMLImageElement>;

`

##### onPauseCapture

`type onPauseCapture = ReactEventHandler<HTMLImageElement>;

`

##### onPlay

`type onPlay = ReactEventHandler<HTMLImageElement>;

`

##### onPlayCapture

`type onPlayCapture = ReactEventHandler<HTMLImageElement>;

`

##### onPlaying

`type onPlaying = ReactEventHandler<HTMLImageElement>;

`

##### onPlayingCapture

`type onPlayingCapture = ReactEventHandler<HTMLImageElement>;

`

##### onPointerCancel

`type onPointerCancel = PointerEventHandler<HTMLImageElement>;

`

##### onPointerCancelCapture

`type onPointerCancelCapture = PointerEventHandler<HTMLImageElement>;

`

##### onPointerDown

`type onPointerDown = PointerEventHandler<HTMLImageElement>;

`

##### onPointerDownCapture

`type onPointerDownCapture = PointerEventHandler<HTMLImageElement>;

`

##### onPointerEnter

`type onPointerEnter = PointerEventHandler<HTMLImageElement>;

`

##### onPointerLeave

`type onPointerLeave = PointerEventHandler<HTMLImageElement>;

`

##### onPointerMove

`type onPointerMove = PointerEventHandler<HTMLImageElement>;

`

##### onPointerMoveCapture

`type onPointerMoveCapture = PointerEventHandler<HTMLImageElement>;

`

##### onPointerOut

`type onPointerOut = PointerEventHandler<HTMLImageElement>;

`

##### onPointerOutCapture

`type onPointerOutCapture = PointerEventHandler<HTMLImageElement>;

`

##### onPointerOver

`type onPointerOver = PointerEventHandler<HTMLImageElement>;

`

##### onPointerOverCapture

`type onPointerOverCapture = PointerEventHandler<HTMLImageElement>;

`

##### onPointerUp

`type onPointerUp = PointerEventHandler<HTMLImageElement>;

`

##### onPointerUpCapture

`type onPointerUpCapture = PointerEventHandler<HTMLImageElement>;

`

##### onProgress

`type onProgress = ReactEventHandler<HTMLImageElement>;

`

##### onProgressCapture

`type onProgressCapture = ReactEventHandler<HTMLImageElement>;

`

##### onRateChange

`type onRateChange = ReactEventHandler<HTMLImageElement>;

`

##### onRateChangeCapture

`type onRateChangeCapture = ReactEventHandler<HTMLImageElement>;

`

##### onReset

`type onReset = FormEventHandler<HTMLImageElement>;

`

##### onResetCapture

`type onResetCapture = FormEventHandler<HTMLImageElement>;

`

##### onResize

`type onResize = ReactEventHandler<HTMLImageElement>;

`

##### onResizeCapture

`type onResizeCapture = ReactEventHandler<HTMLImageElement>;

`

##### onScroll

`type onScroll = UIEventHandler<HTMLImageElement>;

`

##### onScrollCapture

`type onScrollCapture = UIEventHandler<HTMLImageElement>;

`

##### onSeeked

`type onSeeked = ReactEventHandler<HTMLImageElement>;

`

##### onSeekedCapture

`type onSeekedCapture = ReactEventHandler<HTMLImageElement>;

`

##### onSeeking

`type onSeeking = ReactEventHandler<HTMLImageElement>;

`

##### onSeekingCapture

`type onSeekingCapture = ReactEventHandler<HTMLImageElement>;

`

##### onSelect

`type onSelect = ReactEventHandler<HTMLImageElement>;

`

##### onSelectCapture

`type onSelectCapture = ReactEventHandler<HTMLImageElement>;

`

##### onStalled

`type onStalled = ReactEventHandler<HTMLImageElement>;

`

##### onStalledCapture

`type onStalledCapture = ReactEventHandler<HTMLImageElement>;

`

##### onSubmit

`type onSubmit = FormEventHandler<HTMLImageElement>;

`

##### onSubmitCapture

`type onSubmitCapture = FormEventHandler<HTMLImageElement>;

`

##### onSuspend

`type onSuspend = ReactEventHandler<HTMLImageElement>;

`

##### onSuspendCapture

`type onSuspendCapture = ReactEventHandler<HTMLImageElement>;

`

##### onTimeUpdate

`type onTimeUpdate = ReactEventHandler<HTMLImageElement>;

`

##### onTimeUpdateCapture

`type onTimeUpdateCapture = ReactEventHandler<HTMLImageElement>;

`

##### onToggle

`type onToggle = ToggleEventHandler<HTMLImageElement>;

`

##### onTouchCancel

`type onTouchCancel = TouchEventHandler<HTMLImageElement>;

`

##### onTouchCancelCapture

`type onTouchCancelCapture = TouchEventHandler<HTMLImageElement>;

`

##### onTouchEnd

`type onTouchEnd = TouchEventHandler<HTMLImageElement>;

`

##### onTouchEndCapture

`type onTouchEndCapture = TouchEventHandler<HTMLImageElement>;

`

##### onTouchMove

`type onTouchMove = TouchEventHandler<HTMLImageElement>;

`

##### onTouchMoveCapture

`type onTouchMoveCapture = TouchEventHandler<HTMLImageElement>;

`

##### onTouchStart

`type onTouchStart = TouchEventHandler<HTMLImageElement>;

`

##### onTouchStartCapture

`type onTouchStartCapture = TouchEventHandler<HTMLImageElement>;

`

##### onTransitionCancel

`type onTransitionCancel = TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionCancelCapture

`type onTransitionCancelCapture =

TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionEnd

`type onTransitionEnd = TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionEndCapture

`type onTransitionEndCapture =

TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionRun

`type onTransitionRun = TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionRunCapture

`type onTransitionRunCapture =

TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionStart

`type onTransitionStart = TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionStartCapture

`type onTransitionStartCapture =

TransitionEventHandler<HTMLImageElement>;

`

##### onVolumeChange

`type onVolumeChange = ReactEventHandler<HTMLImageElement>;

`

##### onVolumeChangeCapture

`type onVolumeChangeCapture = ReactEventHandler<HTMLImageElement>;

`

##### onWaiting

`type onWaiting = ReactEventHandler<HTMLImageElement>;

`

##### onWaitingCapture

`type onWaitingCapture = ReactEventHandler<HTMLImageElement>;

`

##### onWheel

`type onWheel = WheelEventHandler<HTMLImageElement>;

`

##### onWheelCapture

`type onWheelCapture = WheelEventHandler<HTMLImageElement>;

`

##### popover

`type popover = "" | "auto" | "manual";

`

##### popoverTarget

`type popoverTarget = string;

`

##### popoverTargetAction

`type popoverTargetAction = "toggle" | "hide" | "show";

`

##### prefix

`type prefix = string;

`

##### property

`type property = string;

`

##### queryOptions

 Optional query options for `useQuery`

`type queryOptions = Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">

`

##### radioGroup

`type radioGroup = string;

`

##### referrerPolicy

`type referrerPolicy = HTMLAttributeReferrerPolicy;

`

##### rel

`type rel = string;

`

##### resource

`type resource = string;

`

##### results

`type results = number;

`

##### rev

`type rev = string;

`

##### role

`type role = AriaRole;

`

##### security

`type security = string;

`

##### sizes

`type sizes = string;

`

##### slot

`type slot = string;

`

##### spellCheck

`type spellCheck = Booleanish;

`

##### srcSet

`type srcSet = string;

`

##### style

`type style = CSSProperties;

`

##### suppressContentEditableWarning

`type suppressContentEditableWarning = boolean;

`

##### suppressHydrationWarning

`type suppressHydrationWarning = boolean;

`

##### tabIndex

`type tabIndex = number;

`

##### title

`type title = string;

`

##### translate

`type translate = "yes" | "no";

`

##### typeof

`type typeof = string

`

##### unselectable

`type unselectable = "on" | "off";

`

##### useMap

`type useMap = string;

`

##### vocab

`type vocab = string;

`

##### width

`type width = string | number;

`
## TokenNameProps

 Props for the TokenName component

`interface TokenNameProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, "children"> {about : string,accessKey : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,className : string,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",fallbackComponent : Element,formatFn : (str: string) => string,hidden : boolean,id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,loadingComponent : Element,nameResolver : string | (() => string) | (() => Promise<string>),nonce : string,onAbort : ReactEventHandler<HTMLSpanElement>,onAbortCapture : ReactEventHandler<HTMLSpanElement>,onAnimationEnd : AnimationEventHandler<HTMLSpanElement>,onAnimationEndCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationIteration : AnimationEventHandler<HTMLSpanElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationStart : AnimationEventHandler<HTMLSpanElement>,onAnimationStartCapture : AnimationEventHandler<HTMLSpanElement>,onAuxClick : MouseEventHandler<HTMLSpanElement>,onAuxClickCapture : MouseEventHandler<HTMLSpanElement>,onBeforeInput : FormEventHandler<HTMLSpanElement>,onBeforeInputCapture : FormEventHandler<HTMLSpanElement>,onBeforeToggle : ToggleEventHandler<HTMLSpanElement>,onBlur : FocusEventHandler<HTMLSpanElement>,onBlurCapture : FocusEventHandler<HTMLSpanElement>,onCanPlay : ReactEventHandler<HTMLSpanElement>,onCanPlayCapture : ReactEventHandler<HTMLSpanElement>,onCanPlayThrough : ReactEventHandler<HTMLSpanElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLSpanElement>,onChange : FormEventHandler<HTMLSpanElement>,onChangeCapture : FormEventHandler<HTMLSpanElement>,onClick : MouseEventHandler<HTMLSpanElement>,onClickCapture : MouseEventHandler<HTMLSpanElement>,onCompositionEnd : CompositionEventHandler<HTMLSpanElement>,onCompositionEndCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionStart : CompositionEventHandler<HTMLSpanElement>,onCompositionStartCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdate : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLSpanElement>,onContextMenu : MouseEventHandler<HTMLSpanElement>,onContextMenuCapture : MouseEventHandler<HTMLSpanElement>,onCopy : ClipboardEventHandler<HTMLSpanElement>,onCopyCapture : ClipboardEventHandler<HTMLSpanElement>,onCut : ClipboardEventHandler<HTMLSpanElement>,onCutCapture : ClipboardEventHandler<HTMLSpanElement>,onDoubleClick : MouseEventHandler<HTMLSpanElement>,onDoubleClickCapture : MouseEventHandler<HTMLSpanElement>,onDrag : DragEventHandler<HTMLSpanElement>,onDragCapture : DragEventHandler<HTMLSpanElement>,onDragEnd : DragEventHandler<HTMLSpanElement>,onDragEndCapture : DragEventHandler<HTMLSpanElement>,onDragEnter : DragEventHandler<HTMLSpanElement>,onDragEnterCapture : DragEventHandler<HTMLSpanElement>,onDragExit : DragEventHandler<HTMLSpanElement>,onDragExitCapture : DragEventHandler<HTMLSpanElement>,onDragLeave : DragEventHandler<HTMLSpanElement>,onDragLeaveCapture : DragEventHandler<HTMLSpanElement>,onDragOver : DragEventHandler<HTMLSpanElement>,onDragOverCapture : DragEventHandler<HTMLSpanElement>,onDragStart : DragEventHandler<HTMLSpanElement>,onDragStartCapture : DragEventHandler<HTMLSpanElement>,onDrop : DragEventHandler<HTMLSpanElement>,onDropCapture : DragEventHandler<HTMLSpanElement>,onDurationChange : ReactEventHandler<HTMLSpanElement>,onDurationChangeCapture : ReactEventHandler<HTMLSpanElement>,onEmptied : ReactEventHandler<HTMLSpanElement>,onEmptiedCapture : ReactEventHandler<HTMLSpanElement>,onEncrypted : ReactEventHandler<HTMLSpanElement>,onEncryptedCapture : ReactEventHandler<HTMLSpanElement>,onEnded : ReactEventHandler<HTMLSpanElement>,onEndedCapture : ReactEventHandler<HTMLSpanElement>,onError : ReactEventHandler<HTMLSpanElement>,onErrorCapture : ReactEventHandler<HTMLSpanElement>,onFocus : FocusEventHandler<HTMLSpanElement>,onFocusCapture : FocusEventHandler<HTMLSpanElement>,onGotPointerCapture : PointerEventHandler<HTMLSpanElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onInput : FormEventHandler<HTMLSpanElement>,onInputCapture : FormEventHandler<HTMLSpanElement>,onInvalid : FormEventHandler<HTMLSpanElement>,onInvalidCapture : FormEventHandler<HTMLSpanElement>,onKeyDown : KeyboardEventHandler<HTMLSpanElement>,onKeyDownCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyPress : KeyboardEventHandler<HTMLSpanElement>,onKeyPressCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyUp : KeyboardEventHandler<HTMLSpanElement>,onKeyUpCapture : KeyboardEventHandler<HTMLSpanElement>,onLoad : ReactEventHandler<HTMLSpanElement>,onLoadCapture : ReactEventHandler<HTMLSpanElement>,onLoadedData : ReactEventHandler<HTMLSpanElement>,onLoadedDataCapture : ReactEventHandler<HTMLSpanElement>,onLoadedMetadata : ReactEventHandler<HTMLSpanElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLSpanElement>,onLoadStart : ReactEventHandler<HTMLSpanElement>,onLoadStartCapture : ReactEventHandler<HTMLSpanElement>,onLostPointerCapture : PointerEventHandler<HTMLSpanElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onMouseDown : MouseEventHandler<HTMLSpanElement>,onMouseDownCapture : MouseEventHandler<HTMLSpanElement>,onMouseEnter : MouseEventHandler<HTMLSpanElement>,onMouseLeave : MouseEventHandler<HTMLSpanElement>,onMouseMove : MouseEventHandler<HTMLSpanElement>,onMouseMoveCapture : MouseEventHandler<HTMLSpanElement>,onMouseOut : MouseEventHandler<HTMLSpanElement>,onMouseOutCapture : MouseEventHandler<HTMLSpanElement>,onMouseOver : MouseEventHandler<HTMLSpanElement>,onMouseOverCapture : MouseEventHandler<HTMLSpanElement>,onMouseUp : MouseEventHandler<HTMLSpanElement>,onMouseUpCapture : MouseEventHandler<HTMLSpanElement>,onPaste : ClipboardEventHandler<HTMLSpanElement>,onPasteCapture : ClipboardEventHandler<HTMLSpanElement>,onPause : ReactEventHandler<HTMLSpanElement>,onPauseCapture : ReactEventHandler<HTMLSpanElement>,onPlay : ReactEventHandler<HTMLSpanElement>,onPlayCapture : ReactEventHandler<HTMLSpanElement>,onPlaying : ReactEventHandler<HTMLSpanElement>,onPlayingCapture : ReactEventHandler<HTMLSpanElement>,onPointerCancel : PointerEventHandler<HTMLSpanElement>,onPointerCancelCapture : PointerEventHandler<HTMLSpanElement>,onPointerDown : PointerEventHandler<HTMLSpanElement>,onPointerDownCapture : PointerEventHandler<HTMLSpanElement>,onPointerEnter : PointerEventHandler<HTMLSpanElement>,onPointerLeave : PointerEventHandler<HTMLSpanElement>,onPointerMove : PointerEventHandler<HTMLSpanElement>,onPointerMoveCapture : PointerEventHandler<HTMLSpanElement>,onPointerOut : PointerEventHandler<HTMLSpanElement>,onPointerOutCapture : PointerEventHandler<HTMLSpanElement>,onPointerOver : PointerEventHandler<HTMLSpanElement>,onPointerOverCapture : PointerEventHandler<HTMLSpanElement>,onPointerUp : PointerEventHandler<HTMLSpanElement>,onPointerUpCapture : PointerEventHandler<HTMLSpanElement>,onProgress : ReactEventHandler<HTMLSpanElement>,onProgressCapture : ReactEventHandler<HTMLSpanElement>,onRateChange : ReactEventHandler<HTMLSpanElement>,onRateChangeCapture : ReactEventHandler<HTMLSpanElement>,onReset : FormEventHandler<HTMLSpanElement>,onResetCapture : FormEventHandler<HTMLSpanElement>,onResize : ReactEventHandler<HTMLSpanElement>,onResizeCapture : ReactEventHandler<HTMLSpanElement>,onScroll : UIEventHandler<HTMLSpanElement>,onScrollCapture : UIEventHandler<HTMLSpanElement>,onSeeked : ReactEventHandler<HTMLSpanElement>,onSeekedCapture : ReactEventHandler<HTMLSpanElement>,onSeeking : ReactEventHandler<HTMLSpanElement>,onSeekingCapture : ReactEventHandler<HTMLSpanElement>,onSelect : ReactEventHandler<HTMLSpanElement>,onSelectCapture : ReactEventHandler<HTMLSpanElement>,onStalled : ReactEventHandler<HTMLSpanElement>,onStalledCapture : ReactEventHandler<HTMLSpanElement>,onSubmit : FormEventHandler<HTMLSpanElement>,onSubmitCapture : FormEventHandler<HTMLSpanElement>,onSuspend : ReactEventHandler<HTMLSpanElement>,onSuspendCapture : ReactEventHandler<HTMLSpanElement>,onTimeUpdate : ReactEventHandler<HTMLSpanElement>,onTimeUpdateCapture : ReactEventHandler<HTMLSpanElement>,onToggle : ToggleEventHandler<HTMLSpanElement>,onTouchCancel : TouchEventHandler<HTMLSpanElement>,onTouchCancelCapture : TouchEventHandler<HTMLSpanElement>,onTouchEnd : TouchEventHandler<HTMLSpanElement>,onTouchEndCapture : TouchEventHandler<HTMLSpanElement>,onTouchMove : TouchEventHandler<HTMLSpanElement>,onTouchMoveCapture : TouchEventHandler<HTMLSpanElement>,onTouchStart : TouchEventHandler<HTMLSpanElement>,onTouchStartCapture : TouchEventHandler<HTMLSpanElement>,onTransitionCancel : TransitionEventHandler<HTMLSpanElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionEnd : TransitionEventHandler<HTMLSpanElement>,onTransitionEndCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionRun : TransitionEventHandler<HTMLSpanElement>,onTransitionRunCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionStart : TransitionEventHandler<HTMLSpanElement>,onTransitionStartCapture : TransitionEventHandler<HTMLSpanElement>,onVolumeChange : ReactEventHandler<HTMLSpanElement>,onVolumeChangeCapture : ReactEventHandler<HTMLSpanElement>,onWaiting : ReactEventHandler<HTMLSpanElement>,onWaitingCapture : ReactEventHandler<HTMLSpanElement>,onWheel : WheelEventHandler<HTMLSpanElement>,onWheelCapture : WheelEventHandler<HTMLSpanElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,queryOptions : Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">,radioGroup : string,rel : string,resource : string,results : number,rev : string,role : AriaRole,security : string,slot : string,spellCheck : Booleanish,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,tabIndex : number,title : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",vocab : string}

`

##### about

`type about = string;

`

##### accessKey

`type accessKey = string;

`

##### aria-activedescendant

 Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application.

`type aria-activedescendant = string

`

##### aria-atomic

 Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute.

`type aria-atomic = Booleanish

`

##### aria-autocomplete

 Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be presented if they are made.

`type aria-autocomplete = "inline" | "none" | "list" | "both"

`

##### aria-braillelabel

 Defines a string value that labels the current element, which is intended to be converted into Braille.

 aria-label.

`type aria-braillelabel = string

`

##### aria-brailleroledescription

 Defines a human-readable, author-localized abbreviated description for the role of an element, which is intended to be converted into Braille.

 aria-roledescription.

`type aria-brailleroledescription = string

`

##### aria-busy

`type aria-busy = Booleanish

`

##### aria-checked

 Indicates the current "checked" state of checkboxes, radio buttons, and other widgets.

* aria-pressed
* aria-selected.

`type aria-checked = boolean | "false" | "true" | "mixed"

`

##### aria-colcount

 Defines the total number of columns in a table, grid, or treegrid.

 aria-colindex.

`type aria-colcount = number

`

##### aria-colindex

 Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid.

* aria-colcount
* aria-colspan.

`type aria-colindex = number

`

##### aria-colindextext

 Defines a human readable text alternative of aria-colindex.

 aria-rowindextext.

`type aria-colindextext = string

`

##### aria-colspan

 Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-colindex
* aria-rowspan.

`type aria-colspan = number

`

##### aria-controls

 Identifies the element (or elements) whose contents or presence are controlled by the current element.

 aria-owns.

`type aria-controls = string

`

##### aria-current

 Indicates the element that represents the current item within a container or set of related elements.

`type aria-current = boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date"

`

##### aria-describedby

 Identifies the element (or elements) that describes the object.

 aria-labelledby

`type aria-describedby = string

`

##### aria-description

 Defines a string value that describes or annotates the current element.

 related aria-describedby.

`type aria-description = string

`

##### aria-details

 Identifies the element that provides a detailed, extended description for the object.

 aria-describedby.

`type aria-details = string

`

##### aria-disabled

 Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable.

* aria-hidden
* aria-readonly.

`type aria-disabled = Booleanish

`

##### aria-dropeffect

Deprecated

 in ARIA 1.1

 Indicates what functions can be performed when a dragged object is released on the drop target.

`type aria-dropeffect = "link" | "popup" | "execute" | "none" | "copy" | "move"

`

##### aria-errormessage

 Identifies the element that provides an error message for the object.

* aria-invalid
* aria-describedby.

`type aria-errormessage = string

`

##### aria-expanded

 Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed.

`type aria-expanded = Booleanish

`

##### aria-flowto

 Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion, allows assistive technology to override the general default of reading in document source order.

`type aria-flowto = string

`

##### aria-grabbed

Deprecated

 in ARIA 1.1

 Indicates an element's "grabbed" state in a drag-and-drop operation.

`type aria-grabbed = Booleanish

`

##### aria-haspopup

 Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element.

`type aria-haspopup = boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree"

`

##### aria-hidden

 Indicates whether the element is exposed to an accessibility API.

 aria-disabled.

`type aria-hidden = Booleanish

`

##### aria-invalid

 Indicates the entered value does not conform to the format expected by the application.

 aria-errormessage.

`type aria-invalid = boolean | "false" | "true" | "grammar" | "spelling"

`

##### aria-keyshortcuts

 Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element.

`type aria-keyshortcuts = string

`

##### aria-label

 Defines a string value that labels the current element.

 aria-labelledby.

`type aria-label = string

`

##### aria-labelledby

 Identifies the element (or elements) that labels the current element.

 aria-describedby.

`type aria-labelledby = string

`

##### aria-level

 Defines the hierarchical level of an element within a structure.

`type aria-level = number

`

##### aria-live

 Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region.

`type aria-live = "off" | "polite" | "assertive"

`

##### aria-modal

 Indicates whether an element is modal when displayed.

`type aria-modal = Booleanish

`

##### aria-multiline

 Indicates whether a text box accepts multiple lines of input or only a single line.

`type aria-multiline = Booleanish

`

##### aria-multiselectable

 Indicates that the user may select more than one item from the current selectable descendants.

`type aria-multiselectable = Booleanish

`

##### aria-orientation

 Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous.

`type aria-orientation = "horizontal" | "vertical"

`

##### aria-owns

 Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship between DOM elements where the DOM hierarchy cannot be used to represent the relationship.

 aria-controls.

`type aria-owns = string

`

##### aria-placeholder

 Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value. A hint could be a sample value or a brief description of the expected format.

`type aria-placeholder = string

`

##### aria-posinset

 Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-setsize.

`type aria-posinset = number

`

##### aria-pressed

 Indicates the current "pressed" state of toggle buttons.

* aria-checked
* aria-selected.

`type aria-pressed = boolean | "false" | "true" | "mixed"

`

##### aria-readonly

 Indicates that the element is not editable, but is otherwise operable.

 aria-disabled.

`type aria-readonly = Booleanish

`

##### aria-relevant

 Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified.

 aria-atomic.

`type aria-relevant = "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals"

`

##### aria-required

 Indicates that user input is required on the element before a form may be submitted.

`type aria-required = Booleanish

`

##### aria-roledescription

 Defines a human-readable, author-localized description for the role of an element.

`type aria-roledescription = string

`

##### aria-rowcount

 Defines the total number of rows in a table, grid, or treegrid.

 aria-rowindex.

`type aria-rowcount = number

`

##### aria-rowindex

 Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid.

* aria-rowcount
* aria-rowspan.

`type aria-rowindex = number

`

##### aria-rowindextext

 Defines a human readable text alternative of aria-rowindex.

 aria-colindextext.

`type aria-rowindextext = string

`

##### aria-rowspan

 Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-rowindex
* aria-colspan.

`type aria-rowspan = number

`

##### aria-selected

 Indicates the current "selected" state of various widgets.

* aria-checked
* aria-pressed.

`type aria-selected = Booleanish

`

##### aria-setsize

 Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-posinset.

`type aria-setsize = number

`

##### aria-sort

 Indicates if items in a table or grid are sorted in ascending or descending order.

`type aria-sort = "none" | "ascending" | "descending" | "other"

`

##### aria-valuemax

 Defines the maximum allowed value for a range widget.

`type aria-valuemax = number

`

##### aria-valuemin

 Defines the minimum allowed value for a range widget.

`type aria-valuemin = number

`

##### aria-valuenow

 Defines the current value for a range widget.

 aria-valuetext.

`type aria-valuenow = number

`

##### aria-valuetext

 Defines the human readable text alternative of aria-valuenow for a range widget.

`type aria-valuetext = string

`

##### autoCapitalize

`type autoCapitalize =

| (string & {})

| "on"

| "off"

| "none"

| "sentences"

| "words"

| "characters";

`

##### autoCorrect

`type autoCorrect = string;

`

##### autoFocus

`type autoFocus = boolean;

`

##### autoSave

`type autoSave = string;

`

##### className

`type className = string;

`

##### color

`type color = string;

`

##### content

`type content = string;

`

##### contentEditable

`type contentEditable = "inherit" | Booleanish | "plaintext-only";

`

##### contextMenu

`type contextMenu = string;

`

##### dangerouslySetInnerHTML

`type dangerouslySetInnerHTML = { __html: string | TrustedHTML };

`

##### datatype

`type datatype = string;

`

##### defaultChecked

`type defaultChecked = boolean;

`

##### defaultValue

`type defaultValue = string | number | (readonly Array<string>)

`

##### dir

`type dir = string;

`

##### draggable

`type draggable = Booleanish;

`

##### enterKeyHint

`type enterKeyHint =

| "search"

| "done"

| "next"

| "send"

| "enter"

| "go"

| "previous";

`

##### fallbackComponent

 This component will be shown if the name fails to be retreived If not passed, the component will return `null` .

 You can/should pass a descriptive text/component to this prop, indicating that the name was not fetched succesfully

`type fallbackComponent = Element;

`

### Example

`<TokenName fallbackComponent={"Failed to load"} />;

`

##### formatFn

##### Signature

`function formatFn(str: string): string;

`

##### Parameters

##### str

###### Type

`let str: string;

`

##### Returns

##### Return Type

`let returnType: string;

`

##### hidden

`type hidden = boolean;

`

##### id

`type id = string;

`

##### inert

 https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert

`type inert = boolean;

`

##### inlist

`type inlist = any;

`

##### inputMode

 Hints at the type of data that might be entered by the user while editing the element or its contents

[ https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute](https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute)

`type inputMode =

| "search"

| "email"

| "url"

| "text"

| "none"

| "tel"

| "numeric"

| "decimal";

`

##### is

 Specify that a standard HTML element should behave like a defined custom built-in element

[ https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is](https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is)

`type is = string;

`

##### itemID

`type itemID = string;

`

##### itemProp

`type itemProp = string;

`

##### itemRef

`type itemRef = string;

`

##### itemScope

`type itemScope = boolean;

`

##### itemType

`type itemType = string;

`

##### lang

`type lang = string;

`

##### loadingComponent

 This component will be shown while the name of the token is being fetched If not passed, the component will return `null` .

 You can/should pass a loading sign or spinner to this prop.

`type loadingComponent = Element;

`

### Example

`<TokenName loadingComponent={<Spinner />} />;

`

##### nameResolver

 This prop can be a string or a (async) function that resolves to a string, representing the name of the token This is particularly useful if you already have a way to fetch the token name.

`type nameResolver = string | (() => string) | (() => Promise<string>);

`

##### nonce

`type nonce = string;

`

##### onAbort

`type onAbort = ReactEventHandler<HTMLSpanElement>;

`

##### onAbortCapture

`type onAbortCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onAnimationEnd

`type onAnimationEnd = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationEndCapture

`type onAnimationEndCapture = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationIteration

`type onAnimationIteration = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationIterationCapture

`type onAnimationIterationCapture =

AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationStart

`type onAnimationStart = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationStartCapture

`type onAnimationStartCapture = AnimationEventHandler<HTMLSpanElement>;

`

##### onAuxClick

`type onAuxClick = MouseEventHandler<HTMLSpanElement>;

`

##### onAuxClickCapture

`type onAuxClickCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onBeforeInput

`type onBeforeInput = FormEventHandler<HTMLSpanElement>;

`

##### onBeforeInputCapture

`type onBeforeInputCapture = FormEventHandler<HTMLSpanElement>;

`

##### onBeforeToggle

`type onBeforeToggle = ToggleEventHandler<HTMLSpanElement>;

`

##### onBlur

`type onBlur = FocusEventHandler<HTMLSpanElement>;

`

##### onBlurCapture

`type onBlurCapture = FocusEventHandler<HTMLSpanElement>;

`

##### onCanPlay

`type onCanPlay = ReactEventHandler<HTMLSpanElement>;

`

##### onCanPlayCapture

`type onCanPlayCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onCanPlayThrough

`type onCanPlayThrough = ReactEventHandler<HTMLSpanElement>;

`

##### onCanPlayThroughCapture

`type onCanPlayThroughCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onChange

`type onChange = FormEventHandler<HTMLSpanElement>;

`

##### onChangeCapture

`type onChangeCapture = FormEventHandler<HTMLSpanElement>;

`

##### onClick

`type onClick = MouseEventHandler<HTMLSpanElement>;

`

##### onClickCapture

`type onClickCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onCompositionEnd

`type onCompositionEnd = CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionEndCapture

`type onCompositionEndCapture =

CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionStart

`type onCompositionStart = CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionStartCapture

`type onCompositionStartCapture =

CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionUpdate

`type onCompositionUpdate = CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionUpdateCapture

`type onCompositionUpdateCapture =

CompositionEventHandler<HTMLSpanElement>;

`

##### onContextMenu

`type onContextMenu = MouseEventHandler<HTMLSpanElement>;

`

##### onContextMenuCapture

`type onContextMenuCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onCopy

`type onCopy = ClipboardEventHandler<HTMLSpanElement>;

`

##### onCopyCapture

`type onCopyCapture = ClipboardEventHandler<HTMLSpanElement>;

`

##### onCut

`type onCut = ClipboardEventHandler<HTMLSpanElement>;

`

##### onCutCapture

`type onCutCapture = ClipboardEventHandler<HTMLSpanElement>;

`

##### onDoubleClick

`type onDoubleClick = MouseEventHandler<HTMLSpanElement>;

`

##### onDoubleClickCapture

`type onDoubleClickCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onDrag

`type onDrag = DragEventHandler<HTMLSpanElement>;

`

##### onDragCapture

`type onDragCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragEnd

`type onDragEnd = DragEventHandler<HTMLSpanElement>;

`

##### onDragEndCapture

`type onDragEndCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragEnter

`type onDragEnter = DragEventHandler<HTMLSpanElement>;

`

##### onDragEnterCapture

`type onDragEnterCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragExit

`type onDragExit = DragEventHandler<HTMLSpanElement>;

`

##### onDragExitCapture

`type onDragExitCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragLeave

`type onDragLeave = DragEventHandler<HTMLSpanElement>;

`

##### onDragLeaveCapture

`type onDragLeaveCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragOver

`type onDragOver = DragEventHandler<HTMLSpanElement>;

`

##### onDragOverCapture

`type onDragOverCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragStart

`type onDragStart = DragEventHandler<HTMLSpanElement>;

`

##### onDragStartCapture

`type onDragStartCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDrop

`type onDrop = DragEventHandler<HTMLSpanElement>;

`

##### onDropCapture

`type onDropCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDurationChange

`type onDurationChange = ReactEventHandler<HTMLSpanElement>;

`

##### onDurationChangeCapture

`type onDurationChangeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onEmptied

`type onEmptied = ReactEventHandler<HTMLSpanElement>;

`

##### onEmptiedCapture

`type onEmptiedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onEncrypted

`type onEncrypted = ReactEventHandler<HTMLSpanElement>;

`

##### onEncryptedCapture

`type onEncryptedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onEnded

`type onEnded = ReactEventHandler<HTMLSpanElement>;

`

##### onEndedCapture

`type onEndedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onError

`type onError = ReactEventHandler<HTMLSpanElement>;

`

##### onErrorCapture

`type onErrorCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onFocus

`type onFocus = FocusEventHandler<HTMLSpanElement>;

`

##### onFocusCapture

`type onFocusCapture = FocusEventHandler<HTMLSpanElement>;

`

##### onGotPointerCapture

`type onGotPointerCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onGotPointerCaptureCapture

`type onGotPointerCaptureCapture =

PointerEventHandler<HTMLSpanElement>;

`

##### onInput

`type onInput = FormEventHandler<HTMLSpanElement>;

`

##### onInputCapture

`type onInputCapture = FormEventHandler<HTMLSpanElement>;

`

##### onInvalid

`type onInvalid = FormEventHandler<HTMLSpanElement>;

`

##### onInvalidCapture

`type onInvalidCapture = FormEventHandler<HTMLSpanElement>;

`

##### onKeyDown

`type onKeyDown = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyDownCapture

`type onKeyDownCapture = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyPress

Deprecated

 Use `onKeyUp` or `onKeyDown` instead

`type onKeyPress = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyPressCapture

Deprecated

 Use `onKeyUpCapture` or `onKeyDownCapture` instead

`type onKeyPressCapture = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyUp

`type onKeyUp = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyUpCapture

`type onKeyUpCapture = KeyboardEventHandler<HTMLSpanElement>;

`

##### onLoad

`type onLoad = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadCapture

`type onLoadCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedData

`type onLoadedData = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedDataCapture

`type onLoadedDataCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedMetadata

`type onLoadedMetadata = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedMetadataCapture

`type onLoadedMetadataCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadStart

`type onLoadStart = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadStartCapture

`type onLoadStartCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLostPointerCapture

`type onLostPointerCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onLostPointerCaptureCapture

`type onLostPointerCaptureCapture =

PointerEventHandler<HTMLSpanElement>;

`

##### onMouseDown

`type onMouseDown = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseDownCapture

`type onMouseDownCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseEnter

`type onMouseEnter = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseLeave

`type onMouseLeave = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseMove

`type onMouseMove = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseMoveCapture

`type onMouseMoveCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOut

`type onMouseOut = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOutCapture

`type onMouseOutCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOver

`type onMouseOver = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOverCapture

`type onMouseOverCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseUp

`type onMouseUp = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseUpCapture

`type onMouseUpCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onPaste

`type onPaste = ClipboardEventHandler<HTMLSpanElement>;

`

##### onPasteCapture

`type onPasteCapture = ClipboardEventHandler<HTMLSpanElement>;

`

##### onPause

`type onPause = ReactEventHandler<HTMLSpanElement>;

`

##### onPauseCapture

`type onPauseCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onPlay

`type onPlay = ReactEventHandler<HTMLSpanElement>;

`

##### onPlayCapture

`type onPlayCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onPlaying

`type onPlaying = ReactEventHandler<HTMLSpanElement>;

`

##### onPlayingCapture

`type onPlayingCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onPointerCancel

`type onPointerCancel = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerCancelCapture

`type onPointerCancelCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerDown

`type onPointerDown = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerDownCapture

`type onPointerDownCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerEnter

`type onPointerEnter = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerLeave

`type onPointerLeave = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerMove

`type onPointerMove = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerMoveCapture

`type onPointerMoveCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOut

`type onPointerOut = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOutCapture

`type onPointerOutCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOver

`type onPointerOver = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOverCapture

`type onPointerOverCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerUp

`type onPointerUp = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerUpCapture

`type onPointerUpCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onProgress

`type onProgress = ReactEventHandler<HTMLSpanElement>;

`

##### onProgressCapture

`type onProgressCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onRateChange

`type onRateChange = ReactEventHandler<HTMLSpanElement>;

`

##### onRateChangeCapture

`type onRateChangeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onReset

`type onReset = FormEventHandler<HTMLSpanElement>;

`

##### onResetCapture

`type onResetCapture = FormEventHandler<HTMLSpanElement>;

`

##### onResize

`type onResize = ReactEventHandler<HTMLSpanElement>;

`

##### onResizeCapture

`type onResizeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onScroll

`type onScroll = UIEventHandler<HTMLSpanElement>;

`

##### onScrollCapture

`type onScrollCapture = UIEventHandler<HTMLSpanElement>;

`

##### onSeeked

`type onSeeked = ReactEventHandler<HTMLSpanElement>;

`

##### onSeekedCapture

`type onSeekedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onSeeking

`type onSeeking = ReactEventHandler<HTMLSpanElement>;

`

##### onSeekingCapture

`type onSeekingCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onSelect

`type onSelect = ReactEventHandler<HTMLSpanElement>;

`

##### onSelectCapture

`type onSelectCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onStalled

`type onStalled = ReactEventHandler<HTMLSpanElement>;

`

##### onStalledCapture

`type onStalledCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onSubmit

`type onSubmit = FormEventHandler<HTMLSpanElement>;

`

##### onSubmitCapture

`type onSubmitCapture = FormEventHandler<HTMLSpanElement>;

`

##### onSuspend

`type onSuspend = ReactEventHandler<HTMLSpanElement>;

`

##### onSuspendCapture

`type onSuspendCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onTimeUpdate

`type onTimeUpdate = ReactEventHandler<HTMLSpanElement>;

`

##### onTimeUpdateCapture

`type onTimeUpdateCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onToggle

`type onToggle = ToggleEventHandler<HTMLSpanElement>;

`

##### onTouchCancel

`type onTouchCancel = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchCancelCapture

`type onTouchCancelCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchEnd

`type onTouchEnd = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchEndCapture

`type onTouchEndCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchMove

`type onTouchMove = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchMoveCapture

`type onTouchMoveCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchStart

`type onTouchStart = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchStartCapture

`type onTouchStartCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTransitionCancel

`type onTransitionCancel = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionCancelCapture

`type onTransitionCancelCapture =

TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionEnd

`type onTransitionEnd = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionEndCapture

`type onTransitionEndCapture = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionRun

`type onTransitionRun = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionRunCapture

`type onTransitionRunCapture = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionStart

`type onTransitionStart = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionStartCapture

`type onTransitionStartCapture =

TransitionEventHandler<HTMLSpanElement>;

`

##### onVolumeChange

`type onVolumeChange = ReactEventHandler<HTMLSpanElement>;

`

##### onVolumeChangeCapture

`type onVolumeChangeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onWaiting

`type onWaiting = ReactEventHandler<HTMLSpanElement>;

`

##### onWaitingCapture

`type onWaitingCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onWheel

`type onWheel = WheelEventHandler<HTMLSpanElement>;

`

##### onWheelCapture

`type onWheelCapture = WheelEventHandler<HTMLSpanElement>;

`

##### popover

`type popover = "" | "auto" | "manual";

`

##### popoverTarget

`type popoverTarget = string;

`

##### popoverTargetAction

`type popoverTargetAction = "toggle" | "hide" | "show";

`

##### prefix

`type prefix = string;

`

##### property

`type property = string;

`

##### queryOptions

 Optional `useQuery` params

`type queryOptions = Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">

`

##### radioGroup

`type radioGroup = string;

`

##### rel

`type rel = string;

`

##### resource

`type resource = string;

`

##### results

`type results = number;

`

##### rev

`type rev = string;

`

##### role

`type role = AriaRole;

`

##### security

`type security = string;

`

##### slot

`type slot = string;

`

##### spellCheck

`type spellCheck = Booleanish;

`

##### style

`type style = CSSProperties;

`

##### suppressContentEditableWarning

`type suppressContentEditableWarning = boolean;

`

##### suppressHydrationWarning

`type suppressHydrationWarning = boolean;

`

##### tabIndex

`type tabIndex = number;

`

##### title

`type title = string;

`

##### translate

`type translate = "yes" | "no";

`

##### typeof

`type typeof = string

`

##### unselectable

`type unselectable = "on" | "off";

`

##### vocab

`type vocab = string;

`
## TokenSymbolProps

 Props for the TokenSymbol component

`interface TokenSymbolProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, "children"> {about : string,accessKey : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,className : string,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",fallbackComponent : Element,formatFn : (str: string) => string,hidden : boolean,id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,loadingComponent : Element,nonce : string,onAbort : ReactEventHandler<HTMLSpanElement>,onAbortCapture : ReactEventHandler<HTMLSpanElement>,onAnimationEnd : AnimationEventHandler<HTMLSpanElement>,onAnimationEndCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationIteration : AnimationEventHandler<HTMLSpanElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationStart : AnimationEventHandler<HTMLSpanElement>,onAnimationStartCapture : AnimationEventHandler<HTMLSpanElement>,onAuxClick : MouseEventHandler<HTMLSpanElement>,onAuxClickCapture : MouseEventHandler<HTMLSpanElement>,onBeforeInput : FormEventHandler<HTMLSpanElement>,onBeforeInputCapture : FormEventHandler<HTMLSpanElement>,onBeforeToggle : ToggleEventHandler<HTMLSpanElement>,onBlur : FocusEventHandler<HTMLSpanElement>,onBlurCapture : FocusEventHandler<HTMLSpanElement>,onCanPlay : ReactEventHandler<HTMLSpanElement>,onCanPlayCapture : ReactEventHandler<HTMLSpanElement>,onCanPlayThrough : ReactEventHandler<HTMLSpanElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLSpanElement>,onChange : FormEventHandler<HTMLSpanElement>,onChangeCapture : FormEventHandler<HTMLSpanElement>,onClick : MouseEventHandler<HTMLSpanElement>,onClickCapture : MouseEventHandler<HTMLSpanElement>,onCompositionEnd : CompositionEventHandler<HTMLSpanElement>,onCompositionEndCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionStart : CompositionEventHandler<HTMLSpanElement>,onCompositionStartCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdate : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLSpanElement>,onContextMenu : MouseEventHandler<HTMLSpanElement>,onContextMenuCapture : MouseEventHandler<HTMLSpanElement>,onCopy : ClipboardEventHandler<HTMLSpanElement>,onCopyCapture : ClipboardEventHandler<HTMLSpanElement>,onCut : ClipboardEventHandler<HTMLSpanElement>,onCutCapture : ClipboardEventHandler<HTMLSpanElement>,onDoubleClick : MouseEventHandler<HTMLSpanElement>,onDoubleClickCapture : MouseEventHandler<HTMLSpanElement>,onDrag : DragEventHandler<HTMLSpanElement>,onDragCapture : DragEventHandler<HTMLSpanElement>,onDragEnd : DragEventHandler<HTMLSpanElement>,onDragEndCapture : DragEventHandler<HTMLSpanElement>,onDragEnter : DragEventHandler<HTMLSpanElement>,onDragEnterCapture : DragEventHandler<HTMLSpanElement>,onDragExit : DragEventHandler<HTMLSpanElement>,onDragExitCapture : DragEventHandler<HTMLSpanElement>,onDragLeave : DragEventHandler<HTMLSpanElement>,onDragLeaveCapture : DragEventHandler<HTMLSpanElement>,onDragOver : DragEventHandler<HTMLSpanElement>,onDragOverCapture : DragEventHandler<HTMLSpanElement>,onDragStart : DragEventHandler<HTMLSpanElement>,onDragStartCapture : DragEventHandler<HTMLSpanElement>,onDrop : DragEventHandler<HTMLSpanElement>,onDropCapture : DragEventHandler<HTMLSpanElement>,onDurationChange : ReactEventHandler<HTMLSpanElement>,onDurationChangeCapture : ReactEventHandler<HTMLSpanElement>,onEmptied : ReactEventHandler<HTMLSpanElement>,onEmptiedCapture : ReactEventHandler<HTMLSpanElement>,onEncrypted : ReactEventHandler<HTMLSpanElement>,onEncryptedCapture : ReactEventHandler<HTMLSpanElement>,onEnded : ReactEventHandler<HTMLSpanElement>,onEndedCapture : ReactEventHandler<HTMLSpanElement>,onError : ReactEventHandler<HTMLSpanElement>,onErrorCapture : ReactEventHandler<HTMLSpanElement>,onFocus : FocusEventHandler<HTMLSpanElement>,onFocusCapture : FocusEventHandler<HTMLSpanElement>,onGotPointerCapture : PointerEventHandler<HTMLSpanElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onInput : FormEventHandler<HTMLSpanElement>,onInputCapture : FormEventHandler<HTMLSpanElement>,onInvalid : FormEventHandler<HTMLSpanElement>,onInvalidCapture : FormEventHandler<HTMLSpanElement>,onKeyDown : KeyboardEventHandler<HTMLSpanElement>,onKeyDownCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyPress : KeyboardEventHandler<HTMLSpanElement>,onKeyPressCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyUp : KeyboardEventHandler<HTMLSpanElement>,onKeyUpCapture : KeyboardEventHandler<HTMLSpanElement>,onLoad : ReactEventHandler<HTMLSpanElement>,onLoadCapture : ReactEventHandler<HTMLSpanElement>,onLoadedData : ReactEventHandler<HTMLSpanElement>,onLoadedDataCapture : ReactEventHandler<HTMLSpanElement>,onLoadedMetadata : ReactEventHandler<HTMLSpanElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLSpanElement>,onLoadStart : ReactEventHandler<HTMLSpanElement>,onLoadStartCapture : ReactEventHandler<HTMLSpanElement>,onLostPointerCapture : PointerEventHandler<HTMLSpanElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onMouseDown : MouseEventHandler<HTMLSpanElement>,onMouseDownCapture : MouseEventHandler<HTMLSpanElement>,onMouseEnter : MouseEventHandler<HTMLSpanElement>,onMouseLeave : MouseEventHandler<HTMLSpanElement>,onMouseMove : MouseEventHandler<HTMLSpanElement>,onMouseMoveCapture : MouseEventHandler<HTMLSpanElement>,onMouseOut : MouseEventHandler<HTMLSpanElement>,onMouseOutCapture : MouseEventHandler<HTMLSpanElement>,onMouseOver : MouseEventHandler<HTMLSpanElement>,onMouseOverCapture : MouseEventHandler<HTMLSpanElement>,onMouseUp : MouseEventHandler<HTMLSpanElement>,onMouseUpCapture : MouseEventHandler<HTMLSpanElement>,onPaste : ClipboardEventHandler<HTMLSpanElement>,onPasteCapture : ClipboardEventHandler<HTMLSpanElement>,onPause : ReactEventHandler<HTMLSpanElement>,onPauseCapture : ReactEventHandler<HTMLSpanElement>,onPlay : ReactEventHandler<HTMLSpanElement>,onPlayCapture : ReactEventHandler<HTMLSpanElement>,onPlaying : ReactEventHandler<HTMLSpanElement>,onPlayingCapture : ReactEventHandler<HTMLSpanElement>,onPointerCancel : PointerEventHandler<HTMLSpanElement>,onPointerCancelCapture : PointerEventHandler<HTMLSpanElement>,onPointerDown : PointerEventHandler<HTMLSpanElement>,onPointerDownCapture : PointerEventHandler<HTMLSpanElement>,onPointerEnter : PointerEventHandler<HTMLSpanElement>,onPointerLeave : PointerEventHandler<HTMLSpanElement>,onPointerMove : PointerEventHandler<HTMLSpanElement>,onPointerMoveCapture : PointerEventHandler<HTMLSpanElement>,onPointerOut : PointerEventHandler<HTMLSpanElement>,onPointerOutCapture : PointerEventHandler<HTMLSpanElement>,onPointerOver : PointerEventHandler<HTMLSpanElement>,onPointerOverCapture : PointerEventHandler<HTMLSpanElement>,onPointerUp : PointerEventHandler<HTMLSpanElement>,onPointerUpCapture : PointerEventHandler<HTMLSpanElement>,onProgress : ReactEventHandler<HTMLSpanElement>,onProgressCapture : ReactEventHandler<HTMLSpanElement>,onRateChange : ReactEventHandler<HTMLSpanElement>,onRateChangeCapture : ReactEventHandler<HTMLSpanElement>,onReset : FormEventHandler<HTMLSpanElement>,onResetCapture : FormEventHandler<HTMLSpanElement>,onResize : ReactEventHandler<HTMLSpanElement>,onResizeCapture : ReactEventHandler<HTMLSpanElement>,onScroll : UIEventHandler<HTMLSpanElement>,onScrollCapture : UIEventHandler<HTMLSpanElement>,onSeeked : ReactEventHandler<HTMLSpanElement>,onSeekedCapture : ReactEventHandler<HTMLSpanElement>,onSeeking : ReactEventHandler<HTMLSpanElement>,onSeekingCapture : ReactEventHandler<HTMLSpanElement>,onSelect : ReactEventHandler<HTMLSpanElement>,onSelectCapture : ReactEventHandler<HTMLSpanElement>,onStalled : ReactEventHandler<HTMLSpanElement>,onStalledCapture : ReactEventHandler<HTMLSpanElement>,onSubmit : FormEventHandler<HTMLSpanElement>,onSubmitCapture : FormEventHandler<HTMLSpanElement>,onSuspend : ReactEventHandler<HTMLSpanElement>,onSuspendCapture : ReactEventHandler<HTMLSpanElement>,onTimeUpdate : ReactEventHandler<HTMLSpanElement>,onTimeUpdateCapture : ReactEventHandler<HTMLSpanElement>,onToggle : ToggleEventHandler<HTMLSpanElement>,onTouchCancel : TouchEventHandler<HTMLSpanElement>,onTouchCancelCapture : TouchEventHandler<HTMLSpanElement>,onTouchEnd : TouchEventHandler<HTMLSpanElement>,onTouchEndCapture : TouchEventHandler<HTMLSpanElement>,onTouchMove : TouchEventHandler<HTMLSpanElement>,onTouchMoveCapture : TouchEventHandler<HTMLSpanElement>,onTouchStart : TouchEventHandler<HTMLSpanElement>,onTouchStartCapture : TouchEventHandler<HTMLSpanElement>,onTransitionCancel : TransitionEventHandler<HTMLSpanElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionEnd : TransitionEventHandler<HTMLSpanElement>,onTransitionEndCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionRun : TransitionEventHandler<HTMLSpanElement>,onTransitionRunCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionStart : TransitionEventHandler<HTMLSpanElement>,onTransitionStartCapture : TransitionEventHandler<HTMLSpanElement>,onVolumeChange : ReactEventHandler<HTMLSpanElement>,onVolumeChangeCapture : ReactEventHandler<HTMLSpanElement>,onWaiting : ReactEventHandler<HTMLSpanElement>,onWaitingCapture : ReactEventHandler<HTMLSpanElement>,onWheel : WheelEventHandler<HTMLSpanElement>,onWheelCapture : WheelEventHandler<HTMLSpanElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,queryOptions : Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">,radioGroup : string,rel : string,resource : string,results : number,rev : string,role : AriaRole,security : string,slot : string,spellCheck : Booleanish,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,symbolResolver : string | (() => string) | (() => Promise<string>),tabIndex : number,title : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",vocab : string}

`

##### about

`type about = string;

`

##### accessKey

`type accessKey = string;

`

##### aria-activedescendant

 Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application.

`type aria-activedescendant = string

`

##### aria-atomic

 Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute.

`type aria-atomic = Booleanish

`

##### aria-autocomplete

 Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be presented if they are made.

`type aria-autocomplete = "inline" | "none" | "list" | "both"

`

##### aria-braillelabel

 Defines a string value that labels the current element, which is intended to be converted into Braille.

 aria-label.

`type aria-braillelabel = string

`

##### aria-brailleroledescription

 Defines a human-readable, author-localized abbreviated description for the role of an element, which is intended to be converted into Braille.

 aria-roledescription.

`type aria-brailleroledescription = string

`

##### aria-busy

`type aria-busy = Booleanish

`

##### aria-checked

 Indicates the current "checked" state of checkboxes, radio buttons, and other widgets.

* aria-pressed
* aria-selected.

`type aria-checked = boolean | "false" | "true" | "mixed"

`

##### aria-colcount

 Defines the total number of columns in a table, grid, or treegrid.

 aria-colindex.

`type aria-colcount = number

`

##### aria-colindex

 Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid.

* aria-colcount
* aria-colspan.

`type aria-colindex = number

`

##### aria-colindextext

 Defines a human readable text alternative of aria-colindex.

 aria-rowindextext.

`type aria-colindextext = string

`

##### aria-colspan

 Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-colindex
* aria-rowspan.

`type aria-colspan = number

`

##### aria-controls

 Identifies the element (or elements) whose contents or presence are controlled by the current element.

 aria-owns.

`type aria-controls = string

`

##### aria-current

 Indicates the element that represents the current item within a container or set of related elements.

`type aria-current = boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date"

`

##### aria-describedby

 Identifies the element (or elements) that describes the object.

 aria-labelledby

`type aria-describedby = string

`

##### aria-description

 Defines a string value that describes or annotates the current element.

 related aria-describedby.

`type aria-description = string

`

##### aria-details

 Identifies the element that provides a detailed, extended description for the object.

 aria-describedby.

`type aria-details = string

`

##### aria-disabled

 Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable.

* aria-hidden
* aria-readonly.

`type aria-disabled = Booleanish

`

##### aria-dropeffect

Deprecated

 in ARIA 1.1

 Indicates what functions can be performed when a dragged object is released on the drop target.

`type aria-dropeffect = "link" | "popup" | "execute" | "none" | "copy" | "move"

`

##### aria-errormessage

 Identifies the element that provides an error message for the object.

* aria-invalid
* aria-describedby.

`type aria-errormessage = string

`

##### aria-expanded

 Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed.

`type aria-expanded = Booleanish

`

##### aria-flowto

 Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion, allows assistive technology to override the general default of reading in document source order.

`type aria-flowto = string

`

##### aria-grabbed

Deprecated

 in ARIA 1.1

 Indicates an element's "grabbed" state in a drag-and-drop operation.

`type aria-grabbed = Booleanish

`

##### aria-haspopup

 Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element.

`type aria-haspopup = boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree"

`

##### aria-hidden

 Indicates whether the element is exposed to an accessibility API.

 aria-disabled.

`type aria-hidden = Booleanish

`

##### aria-invalid

 Indicates the entered value does not conform to the format expected by the application.

 aria-errormessage.

`type aria-invalid = boolean | "false" | "true" | "grammar" | "spelling"

`

##### aria-keyshortcuts

 Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element.

`type aria-keyshortcuts = string

`

##### aria-label

 Defines a string value that labels the current element.

 aria-labelledby.

`type aria-label = string

`

##### aria-labelledby

 Identifies the element (or elements) that labels the current element.

 aria-describedby.

`type aria-labelledby = string

`

##### aria-level

 Defines the hierarchical level of an element within a structure.

`type aria-level = number

`

##### aria-live

 Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region.

`type aria-live = "off" | "polite" | "assertive"

`

##### aria-modal

 Indicates whether an element is modal when displayed.

`type aria-modal = Booleanish

`

##### aria-multiline

 Indicates whether a text box accepts multiple lines of input or only a single line.

`type aria-multiline = Booleanish

`

##### aria-multiselectable

 Indicates that the user may select more than one item from the current selectable descendants.

`type aria-multiselectable = Booleanish

`

##### aria-orientation

 Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous.

`type aria-orientation = "horizontal" | "vertical"

`

##### aria-owns

 Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship between DOM elements where the DOM hierarchy cannot be used to represent the relationship.

 aria-controls.

`type aria-owns = string

`

##### aria-placeholder

 Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value. A hint could be a sample value or a brief description of the expected format.

`type aria-placeholder = string

`

##### aria-posinset

 Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-setsize.

`type aria-posinset = number

`

##### aria-pressed

 Indicates the current "pressed" state of toggle buttons.

* aria-checked
* aria-selected.

`type aria-pressed = boolean | "false" | "true" | "mixed"

`

##### aria-readonly

 Indicates that the element is not editable, but is otherwise operable.

 aria-disabled.

`type aria-readonly = Booleanish

`

##### aria-relevant

 Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified.

 aria-atomic.

`type aria-relevant = "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals"

`

##### aria-required

 Indicates that user input is required on the element before a form may be submitted.

`type aria-required = Booleanish

`

##### aria-roledescription

 Defines a human-readable, author-localized description for the role of an element.

`type aria-roledescription = string

`

##### aria-rowcount

 Defines the total number of rows in a table, grid, or treegrid.

 aria-rowindex.

`type aria-rowcount = number

`

##### aria-rowindex

 Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid.

* aria-rowcount
* aria-rowspan.

`type aria-rowindex = number

`

##### aria-rowindextext

 Defines a human readable text alternative of aria-rowindex.

 aria-colindextext.

`type aria-rowindextext = string

`

##### aria-rowspan

 Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-rowindex
* aria-colspan.

`type aria-rowspan = number

`

##### aria-selected

 Indicates the current "selected" state of various widgets.

* aria-checked
* aria-pressed.

`type aria-selected = Booleanish

`

##### aria-setsize

 Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-posinset.

`type aria-setsize = number

`

##### aria-sort

 Indicates if items in a table or grid are sorted in ascending or descending order.

`type aria-sort = "none" | "ascending" | "descending" | "other"

`

##### aria-valuemax

 Defines the maximum allowed value for a range widget.

`type aria-valuemax = number

`

##### aria-valuemin

 Defines the minimum allowed value for a range widget.

`type aria-valuemin = number

`

##### aria-valuenow

 Defines the current value for a range widget.

 aria-valuetext.

`type aria-valuenow = number

`

##### aria-valuetext

 Defines the human readable text alternative of aria-valuenow for a range widget.

`type aria-valuetext = string

`

##### autoCapitalize

`type autoCapitalize =

| (string & {})

| "on"

| "off"

| "none"

| "sentences"

| "words"

| "characters";

`

##### autoCorrect

`type autoCorrect = string;

`

##### autoFocus

`type autoFocus = boolean;

`

##### autoSave

`type autoSave = string;

`

##### className

`type className = string;

`

##### color

`type color = string;

`

##### content

`type content = string;

`

##### contentEditable

`type contentEditable = "inherit" | Booleanish | "plaintext-only";

`

##### contextMenu

`type contextMenu = string;

`

##### dangerouslySetInnerHTML

`type dangerouslySetInnerHTML = { __html: string | TrustedHTML };

`

##### datatype

`type datatype = string;

`

##### defaultChecked

`type defaultChecked = boolean;

`

##### defaultValue

`type defaultValue = string | number | (readonly Array<string>)

`

##### dir

`type dir = string;

`

##### draggable

`type draggable = Booleanish;

`

##### enterKeyHint

`type enterKeyHint =

| "search"

| "done"

| "next"

| "send"

| "enter"

| "go"

| "previous";

`

##### fallbackComponent

 This component will be shown if the symbol fails to be retreived If not passed, the component will return `null` .

 You can/should pass a descriptive text/component to this prop, indicating that the symbol was not fetched succesfully

`type fallbackComponent = Element;

`

### Example

`<TokenSymbol fallbackComponent={"Failed to load"} />;

`

##### formatFn

##### Signature

`function formatFn(str: string): string;

`

##### Parameters

##### str

###### Type

`let str: string;

`

##### Returns

##### Return Type

`let returnType: string;

`

##### hidden

`type hidden = boolean;

`

##### id

`type id = string;

`

##### inert

 https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert

`type inert = boolean;

`

##### inlist

`type inlist = any;

`

##### inputMode

 Hints at the type of data that might be entered by the user while editing the element or its contents

[ https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute](https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute)

`type inputMode =

| "search"

| "email"

| "url"

| "text"

| "none"

| "tel"

| "numeric"

| "decimal";

`

##### is

 Specify that a standard HTML element should behave like a defined custom built-in element

[ https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is](https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is)

`type is = string;

`

##### itemID

`type itemID = string;

`

##### itemProp

`type itemProp = string;

`

##### itemRef

`type itemRef = string;

`

##### itemScope

`type itemScope = boolean;

`

##### itemType

`type itemType = string;

`

##### lang

`type lang = string;

`

##### loadingComponent

 This component will be shown while the symbol of the token is being fetched If not passed, the component will return `null` .

 You can/should pass a loading sign or spinner to this prop.

`type loadingComponent = Element;

`

### Example

`<TokenSymbol loadingComponent={<Spinner />} />;

`

##### nonce

`type nonce = string;

`

##### onAbort

`type onAbort = ReactEventHandler<HTMLSpanElement>;

`

##### onAbortCapture

`type onAbortCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onAnimationEnd

`type onAnimationEnd = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationEndCapture

`type onAnimationEndCapture = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationIteration

`type onAnimationIteration = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationIterationCapture

`type onAnimationIterationCapture =

AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationStart

`type onAnimationStart = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationStartCapture

`type onAnimationStartCapture = AnimationEventHandler<HTMLSpanElement>;

`

##### onAuxClick

`type onAuxClick = MouseEventHandler<HTMLSpanElement>;

`

##### onAuxClickCapture

`type onAuxClickCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onBeforeInput

`type onBeforeInput = FormEventHandler<HTMLSpanElement>;

`

##### onBeforeInputCapture

`type onBeforeInputCapture = FormEventHandler<HTMLSpanElement>;

`

##### onBeforeToggle

`type onBeforeToggle = ToggleEventHandler<HTMLSpanElement>;

`

##### onBlur

`type onBlur = FocusEventHandler<HTMLSpanElement>;

`

##### onBlurCapture

`type onBlurCapture = FocusEventHandler<HTMLSpanElement>;

`

##### onCanPlay

`type onCanPlay = ReactEventHandler<HTMLSpanElement>;

`

##### onCanPlayCapture

`type onCanPlayCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onCanPlayThrough

`type onCanPlayThrough = ReactEventHandler<HTMLSpanElement>;

`

##### onCanPlayThroughCapture

`type onCanPlayThroughCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onChange

`type onChange = FormEventHandler<HTMLSpanElement>;

`

##### onChangeCapture

`type onChangeCapture = FormEventHandler<HTMLSpanElement>;

`

##### onClick

`type onClick = MouseEventHandler<HTMLSpanElement>;

`

##### onClickCapture

`type onClickCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onCompositionEnd

`type onCompositionEnd = CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionEndCapture

`type onCompositionEndCapture =

CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionStart

`type onCompositionStart = CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionStartCapture

`type onCompositionStartCapture =

CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionUpdate

`type onCompositionUpdate = CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionUpdateCapture

`type onCompositionUpdateCapture =

CompositionEventHandler<HTMLSpanElement>;

`

##### onContextMenu

`type onContextMenu = MouseEventHandler<HTMLSpanElement>;

`

##### onContextMenuCapture

`type onContextMenuCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onCopy

`type onCopy = ClipboardEventHandler<HTMLSpanElement>;

`

##### onCopyCapture

`type onCopyCapture = ClipboardEventHandler<HTMLSpanElement>;

`

##### onCut

`type onCut = ClipboardEventHandler<HTMLSpanElement>;

`

##### onCutCapture

`type onCutCapture = ClipboardEventHandler<HTMLSpanElement>;

`

##### onDoubleClick

`type onDoubleClick = MouseEventHandler<HTMLSpanElement>;

`

##### onDoubleClickCapture

`type onDoubleClickCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onDrag

`type onDrag = DragEventHandler<HTMLSpanElement>;

`

##### onDragCapture

`type onDragCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragEnd

`type onDragEnd = DragEventHandler<HTMLSpanElement>;

`

##### onDragEndCapture

`type onDragEndCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragEnter

`type onDragEnter = DragEventHandler<HTMLSpanElement>;

`

##### onDragEnterCapture

`type onDragEnterCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragExit

`type onDragExit = DragEventHandler<HTMLSpanElement>;

`

##### onDragExitCapture

`type onDragExitCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragLeave

`type onDragLeave = DragEventHandler<HTMLSpanElement>;

`

##### onDragLeaveCapture

`type onDragLeaveCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragOver

`type onDragOver = DragEventHandler<HTMLSpanElement>;

`

##### onDragOverCapture

`type onDragOverCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragStart

`type onDragStart = DragEventHandler<HTMLSpanElement>;

`

##### onDragStartCapture

`type onDragStartCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDrop

`type onDrop = DragEventHandler<HTMLSpanElement>;

`

##### onDropCapture

`type onDropCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDurationChange

`type onDurationChange = ReactEventHandler<HTMLSpanElement>;

`

##### onDurationChangeCapture

`type onDurationChangeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onEmptied

`type onEmptied = ReactEventHandler<HTMLSpanElement>;

`

##### onEmptiedCapture

`type onEmptiedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onEncrypted

`type onEncrypted = ReactEventHandler<HTMLSpanElement>;

`

##### onEncryptedCapture

`type onEncryptedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onEnded

`type onEnded = ReactEventHandler<HTMLSpanElement>;

`

##### onEndedCapture

`type onEndedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onError

`type onError = ReactEventHandler<HTMLSpanElement>;

`

##### onErrorCapture

`type onErrorCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onFocus

`type onFocus = FocusEventHandler<HTMLSpanElement>;

`

##### onFocusCapture

`type onFocusCapture = FocusEventHandler<HTMLSpanElement>;

`

##### onGotPointerCapture

`type onGotPointerCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onGotPointerCaptureCapture

`type onGotPointerCaptureCapture =

PointerEventHandler<HTMLSpanElement>;

`

##### onInput

`type onInput = FormEventHandler<HTMLSpanElement>;

`

##### onInputCapture

`type onInputCapture = FormEventHandler<HTMLSpanElement>;

`

##### onInvalid

`type onInvalid = FormEventHandler<HTMLSpanElement>;

`

##### onInvalidCapture

`type onInvalidCapture = FormEventHandler<HTMLSpanElement>;

`

##### onKeyDown

`type onKeyDown = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyDownCapture

`type onKeyDownCapture = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyPress

Deprecated

 Use `onKeyUp` or `onKeyDown` instead

`type onKeyPress = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyPressCapture

Deprecated

 Use `onKeyUpCapture` or `onKeyDownCapture` instead

`type onKeyPressCapture = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyUp

`type onKeyUp = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyUpCapture

`type onKeyUpCapture = KeyboardEventHandler<HTMLSpanElement>;

`

##### onLoad

`type onLoad = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadCapture

`type onLoadCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedData

`type onLoadedData = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedDataCapture

`type onLoadedDataCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedMetadata

`type onLoadedMetadata = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedMetadataCapture

`type onLoadedMetadataCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadStart

`type onLoadStart = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadStartCapture

`type onLoadStartCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLostPointerCapture

`type onLostPointerCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onLostPointerCaptureCapture

`type onLostPointerCaptureCapture =

PointerEventHandler<HTMLSpanElement>;

`

##### onMouseDown

`type onMouseDown = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseDownCapture

`type onMouseDownCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseEnter

`type onMouseEnter = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseLeave

`type onMouseLeave = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseMove

`type onMouseMove = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseMoveCapture

`type onMouseMoveCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOut

`type onMouseOut = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOutCapture

`type onMouseOutCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOver

`type onMouseOver = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOverCapture

`type onMouseOverCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseUp

`type onMouseUp = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseUpCapture

`type onMouseUpCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onPaste

`type onPaste = ClipboardEventHandler<HTMLSpanElement>;

`

##### onPasteCapture

`type onPasteCapture = ClipboardEventHandler<HTMLSpanElement>;

`

##### onPause

`type onPause = ReactEventHandler<HTMLSpanElement>;

`

##### onPauseCapture

`type onPauseCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onPlay

`type onPlay = ReactEventHandler<HTMLSpanElement>;

`

##### onPlayCapture

`type onPlayCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onPlaying

`type onPlaying = ReactEventHandler<HTMLSpanElement>;

`

##### onPlayingCapture

`type onPlayingCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onPointerCancel

`type onPointerCancel = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerCancelCapture

`type onPointerCancelCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerDown

`type onPointerDown = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerDownCapture

`type onPointerDownCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerEnter

`type onPointerEnter = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerLeave

`type onPointerLeave = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerMove

`type onPointerMove = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerMoveCapture

`type onPointerMoveCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOut

`type onPointerOut = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOutCapture

`type onPointerOutCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOver

`type onPointerOver = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOverCapture

`type onPointerOverCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerUp

`type onPointerUp = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerUpCapture

`type onPointerUpCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onProgress

`type onProgress = ReactEventHandler<HTMLSpanElement>;

`

##### onProgressCapture

`type onProgressCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onRateChange

`type onRateChange = ReactEventHandler<HTMLSpanElement>;

`

##### onRateChangeCapture

`type onRateChangeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onReset

`type onReset = FormEventHandler<HTMLSpanElement>;

`

##### onResetCapture

`type onResetCapture = FormEventHandler<HTMLSpanElement>;

`

##### onResize

`type onResize = ReactEventHandler<HTMLSpanElement>;

`

##### onResizeCapture

`type onResizeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onScroll

`type onScroll = UIEventHandler<HTMLSpanElement>;

`

##### onScrollCapture

`type onScrollCapture = UIEventHandler<HTMLSpanElement>;

`

##### onSeeked

`type onSeeked = ReactEventHandler<HTMLSpanElement>;

`

##### onSeekedCapture

`type onSeekedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onSeeking

`type onSeeking = ReactEventHandler<HTMLSpanElement>;

`

##### onSeekingCapture

`type onSeekingCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onSelect

`type onSelect = ReactEventHandler<HTMLSpanElement>;

`

##### onSelectCapture

`type onSelectCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onStalled

`type onStalled = ReactEventHandler<HTMLSpanElement>;

`

##### onStalledCapture

`type onStalledCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onSubmit

`type onSubmit = FormEventHandler<HTMLSpanElement>;

`

##### onSubmitCapture

`type onSubmitCapture = FormEventHandler<HTMLSpanElement>;

`

##### onSuspend

`type onSuspend = ReactEventHandler<HTMLSpanElement>;

`

##### onSuspendCapture

`type onSuspendCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onTimeUpdate

`type onTimeUpdate = ReactEventHandler<HTMLSpanElement>;

`

##### onTimeUpdateCapture

`type onTimeUpdateCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onToggle

`type onToggle = ToggleEventHandler<HTMLSpanElement>;

`

##### onTouchCancel

`type onTouchCancel = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchCancelCapture

`type onTouchCancelCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchEnd

`type onTouchEnd = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchEndCapture

`type onTouchEndCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchMove

`type onTouchMove = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchMoveCapture

`type onTouchMoveCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchStart

`type onTouchStart = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchStartCapture

`type onTouchStartCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTransitionCancel

`type onTransitionCancel = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionCancelCapture

`type onTransitionCancelCapture =

TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionEnd

`type onTransitionEnd = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionEndCapture

`type onTransitionEndCapture = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionRun

`type onTransitionRun = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionRunCapture

`type onTransitionRunCapture = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionStart

`type onTransitionStart = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionStartCapture

`type onTransitionStartCapture =

TransitionEventHandler<HTMLSpanElement>;

`

##### onVolumeChange

`type onVolumeChange = ReactEventHandler<HTMLSpanElement>;

`

##### onVolumeChangeCapture

`type onVolumeChangeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onWaiting

`type onWaiting = ReactEventHandler<HTMLSpanElement>;

`

##### onWaitingCapture

`type onWaitingCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onWheel

`type onWheel = WheelEventHandler<HTMLSpanElement>;

`

##### onWheelCapture

`type onWheelCapture = WheelEventHandler<HTMLSpanElement>;

`

##### popover

`type popover = "" | "auto" | "manual";

`

##### popoverTarget

`type popoverTarget = string;

`

##### popoverTargetAction

`type popoverTargetAction = "toggle" | "hide" | "show";

`

##### prefix

`type prefix = string;

`

##### property

`type property = string;

`

##### queryOptions

 Optional `useQuery` params

`type queryOptions = Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">

`

##### radioGroup

`type radioGroup = string;

`

##### rel

`type rel = string;

`

##### resource

`type resource = string;

`

##### results

`type results = number;

`

##### rev

`type rev = string;

`

##### role

`type role = AriaRole;

`

##### security

`type security = string;

`

##### slot

`type slot = string;

`

##### spellCheck

`type spellCheck = Booleanish;

`

##### style

`type style = CSSProperties;

`

##### suppressContentEditableWarning

`type suppressContentEditableWarning = boolean;

`

##### suppressHydrationWarning

`type suppressHydrationWarning = boolean;

`

##### symbolResolver

 This prop can be a string or a (async) function that resolves to a string, representing the symbol of the token This is particularly useful if you already have a way to fetch the token symbol.

`type symbolResolver =

| string

| (() => string)

| (() => Promise<string>);

`

##### tabIndex

`type tabIndex = number;

`

##### title

`type title = string;

`

##### translate

`type translate = "yes" | "no";

`

##### typeof

`type typeof = string

`

##### unselectable

`type unselectable = "on" | "off";

`

##### vocab

`type vocab = string;

`
## WalletIconProps

`interface WalletIconProps extends Omit<React.ImgHTMLAttributes<HTMLImageElement>, "src"> {about : string,accessKey : string,alt : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,children : ReactNode,className : string,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,crossOrigin : CrossOrigin,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,decoding : "auto" | "async" | "sync",defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",fallbackComponent : Element,fetchPriority : "auto" | "high" | "low",height : string | number,hidden : boolean,id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,loading : "eager" | "lazy",loadingComponent : Element,nonce : string,onAbort : ReactEventHandler<HTMLImageElement>,onAbortCapture : ReactEventHandler<HTMLImageElement>,onAnimationEnd : AnimationEventHandler<HTMLImageElement>,onAnimationEndCapture : AnimationEventHandler<HTMLImageElement>,onAnimationIteration : AnimationEventHandler<HTMLImageElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLImageElement>,onAnimationStart : AnimationEventHandler<HTMLImageElement>,onAnimationStartCapture : AnimationEventHandler<HTMLImageElement>,onAuxClick : MouseEventHandler<HTMLImageElement>,onAuxClickCapture : MouseEventHandler<HTMLImageElement>,onBeforeInput : FormEventHandler<HTMLImageElement>,onBeforeInputCapture : FormEventHandler<HTMLImageElement>,onBeforeToggle : ToggleEventHandler<HTMLImageElement>,onBlur : FocusEventHandler<HTMLImageElement>,onBlurCapture : FocusEventHandler<HTMLImageElement>,onCanPlay : ReactEventHandler<HTMLImageElement>,onCanPlayCapture : ReactEventHandler<HTMLImageElement>,onCanPlayThrough : ReactEventHandler<HTMLImageElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLImageElement>,onChange : FormEventHandler<HTMLImageElement>,onChangeCapture : FormEventHandler<HTMLImageElement>,onClick : MouseEventHandler<HTMLImageElement>,onClickCapture : MouseEventHandler<HTMLImageElement>,onCompositionEnd : CompositionEventHandler<HTMLImageElement>,onCompositionEndCapture : CompositionEventHandler<HTMLImageElement>,onCompositionStart : CompositionEventHandler<HTMLImageElement>,onCompositionStartCapture : CompositionEventHandler<HTMLImageElement>,onCompositionUpdate : CompositionEventHandler<HTMLImageElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLImageElement>,onContextMenu : MouseEventHandler<HTMLImageElement>,onContextMenuCapture : MouseEventHandler<HTMLImageElement>,onCopy : ClipboardEventHandler<HTMLImageElement>,onCopyCapture : ClipboardEventHandler<HTMLImageElement>,onCut : ClipboardEventHandler<HTMLImageElement>,onCutCapture : ClipboardEventHandler<HTMLImageElement>,onDoubleClick : MouseEventHandler<HTMLImageElement>,onDoubleClickCapture : MouseEventHandler<HTMLImageElement>,onDrag : DragEventHandler<HTMLImageElement>,onDragCapture : DragEventHandler<HTMLImageElement>,onDragEnd : DragEventHandler<HTMLImageElement>,onDragEndCapture : DragEventHandler<HTMLImageElement>,onDragEnter : DragEventHandler<HTMLImageElement>,onDragEnterCapture : DragEventHandler<HTMLImageElement>,onDragExit : DragEventHandler<HTMLImageElement>,onDragExitCapture : DragEventHandler<HTMLImageElement>,onDragLeave : DragEventHandler<HTMLImageElement>,onDragLeaveCapture : DragEventHandler<HTMLImageElement>,onDragOver : DragEventHandler<HTMLImageElement>,onDragOverCapture : DragEventHandler<HTMLImageElement>,onDragStart : DragEventHandler<HTMLImageElement>,onDragStartCapture : DragEventHandler<HTMLImageElement>,onDrop : DragEventHandler<HTMLImageElement>,onDropCapture : DragEventHandler<HTMLImageElement>,onDurationChange : ReactEventHandler<HTMLImageElement>,onDurationChangeCapture : ReactEventHandler<HTMLImageElement>,onEmptied : ReactEventHandler<HTMLImageElement>,onEmptiedCapture : ReactEventHandler<HTMLImageElement>,onEncrypted : ReactEventHandler<HTMLImageElement>,onEncryptedCapture : ReactEventHandler<HTMLImageElement>,onEnded : ReactEventHandler<HTMLImageElement>,onEndedCapture : ReactEventHandler<HTMLImageElement>,onError : ReactEventHandler<HTMLImageElement>,onErrorCapture : ReactEventHandler<HTMLImageElement>,onFocus : FocusEventHandler<HTMLImageElement>,onFocusCapture : FocusEventHandler<HTMLImageElement>,onGotPointerCapture : PointerEventHandler<HTMLImageElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLImageElement>,onInput : FormEventHandler<HTMLImageElement>,onInputCapture : FormEventHandler<HTMLImageElement>,onInvalid : FormEventHandler<HTMLImageElement>,onInvalidCapture : FormEventHandler<HTMLImageElement>,onKeyDown : KeyboardEventHandler<HTMLImageElement>,onKeyDownCapture : KeyboardEventHandler<HTMLImageElement>,onKeyPress : KeyboardEventHandler<HTMLImageElement>,onKeyPressCapture : KeyboardEventHandler<HTMLImageElement>,onKeyUp : KeyboardEventHandler<HTMLImageElement>,onKeyUpCapture : KeyboardEventHandler<HTMLImageElement>,onLoad : ReactEventHandler<HTMLImageElement>,onLoadCapture : ReactEventHandler<HTMLImageElement>,onLoadedData : ReactEventHandler<HTMLImageElement>,onLoadedDataCapture : ReactEventHandler<HTMLImageElement>,onLoadedMetadata : ReactEventHandler<HTMLImageElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLImageElement>,onLoadStart : ReactEventHandler<HTMLImageElement>,onLoadStartCapture : ReactEventHandler<HTMLImageElement>,onLostPointerCapture : PointerEventHandler<HTMLImageElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLImageElement>,onMouseDown : MouseEventHandler<HTMLImageElement>,onMouseDownCapture : MouseEventHandler<HTMLImageElement>,onMouseEnter : MouseEventHandler<HTMLImageElement>,onMouseLeave : MouseEventHandler<HTMLImageElement>,onMouseMove : MouseEventHandler<HTMLImageElement>,onMouseMoveCapture : MouseEventHandler<HTMLImageElement>,onMouseOut : MouseEventHandler<HTMLImageElement>,onMouseOutCapture : MouseEventHandler<HTMLImageElement>,onMouseOver : MouseEventHandler<HTMLImageElement>,onMouseOverCapture : MouseEventHandler<HTMLImageElement>,onMouseUp : MouseEventHandler<HTMLImageElement>,onMouseUpCapture : MouseEventHandler<HTMLImageElement>,onPaste : ClipboardEventHandler<HTMLImageElement>,onPasteCapture : ClipboardEventHandler<HTMLImageElement>,onPause : ReactEventHandler<HTMLImageElement>,onPauseCapture : ReactEventHandler<HTMLImageElement>,onPlay : ReactEventHandler<HTMLImageElement>,onPlayCapture : ReactEventHandler<HTMLImageElement>,onPlaying : ReactEventHandler<HTMLImageElement>,onPlayingCapture : ReactEventHandler<HTMLImageElement>,onPointerCancel : PointerEventHandler<HTMLImageElement>,onPointerCancelCapture : PointerEventHandler<HTMLImageElement>,onPointerDown : PointerEventHandler<HTMLImageElement>,onPointerDownCapture : PointerEventHandler<HTMLImageElement>,onPointerEnter : PointerEventHandler<HTMLImageElement>,onPointerLeave : PointerEventHandler<HTMLImageElement>,onPointerMove : PointerEventHandler<HTMLImageElement>,onPointerMoveCapture : PointerEventHandler<HTMLImageElement>,onPointerOut : PointerEventHandler<HTMLImageElement>,onPointerOutCapture : PointerEventHandler<HTMLImageElement>,onPointerOver : PointerEventHandler<HTMLImageElement>,onPointerOverCapture : PointerEventHandler<HTMLImageElement>,onPointerUp : PointerEventHandler<HTMLImageElement>,onPointerUpCapture : PointerEventHandler<HTMLImageElement>,onProgress : ReactEventHandler<HTMLImageElement>,onProgressCapture : ReactEventHandler<HTMLImageElement>,onRateChange : ReactEventHandler<HTMLImageElement>,onRateChangeCapture : ReactEventHandler<HTMLImageElement>,onReset : FormEventHandler<HTMLImageElement>,onResetCapture : FormEventHandler<HTMLImageElement>,onResize : ReactEventHandler<HTMLImageElement>,onResizeCapture : ReactEventHandler<HTMLImageElement>,onScroll : UIEventHandler<HTMLImageElement>,onScrollCapture : UIEventHandler<HTMLImageElement>,onSeeked : ReactEventHandler<HTMLImageElement>,onSeekedCapture : ReactEventHandler<HTMLImageElement>,onSeeking : ReactEventHandler<HTMLImageElement>,onSeekingCapture : ReactEventHandler<HTMLImageElement>,onSelect : ReactEventHandler<HTMLImageElement>,onSelectCapture : ReactEventHandler<HTMLImageElement>,onStalled : ReactEventHandler<HTMLImageElement>,onStalledCapture : ReactEventHandler<HTMLImageElement>,onSubmit : FormEventHandler<HTMLImageElement>,onSubmitCapture : FormEventHandler<HTMLImageElement>,onSuspend : ReactEventHandler<HTMLImageElement>,onSuspendCapture : ReactEventHandler<HTMLImageElement>,onTimeUpdate : ReactEventHandler<HTMLImageElement>,onTimeUpdateCapture : ReactEventHandler<HTMLImageElement>,onToggle : ToggleEventHandler<HTMLImageElement>,onTouchCancel : TouchEventHandler<HTMLImageElement>,onTouchCancelCapture : TouchEventHandler<HTMLImageElement>,onTouchEnd : TouchEventHandler<HTMLImageElement>,onTouchEndCapture : TouchEventHandler<HTMLImageElement>,onTouchMove : TouchEventHandler<HTMLImageElement>,onTouchMoveCapture : TouchEventHandler<HTMLImageElement>,onTouchStart : TouchEventHandler<HTMLImageElement>,onTouchStartCapture : TouchEventHandler<HTMLImageElement>,onTransitionCancel : TransitionEventHandler<HTMLImageElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLImageElement>,onTransitionEnd : TransitionEventHandler<HTMLImageElement>,onTransitionEndCapture : TransitionEventHandler<HTMLImageElement>,onTransitionRun : TransitionEventHandler<HTMLImageElement>,onTransitionRunCapture : TransitionEventHandler<HTMLImageElement>,onTransitionStart : TransitionEventHandler<HTMLImageElement>,onTransitionStartCapture : TransitionEventHandler<HTMLImageElement>,onVolumeChange : ReactEventHandler<HTMLImageElement>,onVolumeChangeCapture : ReactEventHandler<HTMLImageElement>,onWaiting : ReactEventHandler<HTMLImageElement>,onWaitingCapture : ReactEventHandler<HTMLImageElement>,onWheel : WheelEventHandler<HTMLImageElement>,onWheelCapture : WheelEventHandler<HTMLImageElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,queryOptions : Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">,radioGroup : string,referrerPolicy : HTMLAttributeReferrerPolicy,rel : string,resource : string,results : number,rev : string,role : AriaRole,security : string,sizes : string,slot : string,spellCheck : Booleanish,srcSet : string,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,tabIndex : number,title : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",useMap : string,vocab : string,width : string | number}

`

##### about

`type about = string;

`

##### accessKey

`type accessKey = string;

`

##### alt

`type alt = string;

`

##### aria-activedescendant

 Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application.

`type aria-activedescendant = string

`

##### aria-atomic

 Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute.

`type aria-atomic = Booleanish

`

##### aria-autocomplete

 Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be presented if they are made.

`type aria-autocomplete = "inline" | "none" | "list" | "both"

`

##### aria-braillelabel

 Defines a string value that labels the current element, which is intended to be converted into Braille.

 aria-label.

`type aria-braillelabel = string

`

##### aria-brailleroledescription

 Defines a human-readable, author-localized abbreviated description for the role of an element, which is intended to be converted into Braille.

 aria-roledescription.

`type aria-brailleroledescription = string

`

##### aria-busy

`type aria-busy = Booleanish

`

##### aria-checked

 Indicates the current "checked" state of checkboxes, radio buttons, and other widgets.

* aria-pressed
* aria-selected.

`type aria-checked = boolean | "false" | "true" | "mixed"

`

##### aria-colcount

 Defines the total number of columns in a table, grid, or treegrid.

 aria-colindex.

`type aria-colcount = number

`

##### aria-colindex

 Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid.

* aria-colcount
* aria-colspan.

`type aria-colindex = number

`

##### aria-colindextext

 Defines a human readable text alternative of aria-colindex.

 aria-rowindextext.

`type aria-colindextext = string

`

##### aria-colspan

 Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-colindex
* aria-rowspan.

`type aria-colspan = number

`

##### aria-controls

 Identifies the element (or elements) whose contents or presence are controlled by the current element.

 aria-owns.

`type aria-controls = string

`

##### aria-current

 Indicates the element that represents the current item within a container or set of related elements.

`type aria-current = boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date"

`

##### aria-describedby

 Identifies the element (or elements) that describes the object.

 aria-labelledby

`type aria-describedby = string

`

##### aria-description

 Defines a string value that describes or annotates the current element.

 related aria-describedby.

`type aria-description = string

`

##### aria-details

 Identifies the element that provides a detailed, extended description for the object.

 aria-describedby.

`type aria-details = string

`

##### aria-disabled

 Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable.

* aria-hidden
* aria-readonly.

`type aria-disabled = Booleanish

`

##### aria-dropeffect

Deprecated

 in ARIA 1.1

 Indicates what functions can be performed when a dragged object is released on the drop target.

`type aria-dropeffect = "link" | "popup" | "execute" | "none" | "copy" | "move"

`

##### aria-errormessage

 Identifies the element that provides an error message for the object.

* aria-invalid
* aria-describedby.

`type aria-errormessage = string

`

##### aria-expanded

 Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed.

`type aria-expanded = Booleanish

`

##### aria-flowto

 Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion, allows assistive technology to override the general default of reading in document source order.

`type aria-flowto = string

`

##### aria-grabbed

Deprecated

 in ARIA 1.1

 Indicates an element's "grabbed" state in a drag-and-drop operation.

`type aria-grabbed = Booleanish

`

##### aria-haspopup

 Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element.

`type aria-haspopup = boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree"

`

##### aria-hidden

 Indicates whether the element is exposed to an accessibility API.

 aria-disabled.

`type aria-hidden = Booleanish

`

##### aria-invalid

 Indicates the entered value does not conform to the format expected by the application.

 aria-errormessage.

`type aria-invalid = boolean | "false" | "true" | "grammar" | "spelling"

`

##### aria-keyshortcuts

 Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element.

`type aria-keyshortcuts = string

`

##### aria-label

 Defines a string value that labels the current element.

 aria-labelledby.

`type aria-label = string

`

##### aria-labelledby

 Identifies the element (or elements) that labels the current element.

 aria-describedby.

`type aria-labelledby = string

`

##### aria-level

 Defines the hierarchical level of an element within a structure.

`type aria-level = number

`

##### aria-live

 Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region.

`type aria-live = "off" | "polite" | "assertive"

`

##### aria-modal

 Indicates whether an element is modal when displayed.

`type aria-modal = Booleanish

`

##### aria-multiline

 Indicates whether a text box accepts multiple lines of input or only a single line.

`type aria-multiline = Booleanish

`

##### aria-multiselectable

 Indicates that the user may select more than one item from the current selectable descendants.

`type aria-multiselectable = Booleanish

`

##### aria-orientation

 Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous.

`type aria-orientation = "horizontal" | "vertical"

`

##### aria-owns

 Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship between DOM elements where the DOM hierarchy cannot be used to represent the relationship.

 aria-controls.

`type aria-owns = string

`

##### aria-placeholder

 Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value. A hint could be a sample value or a brief description of the expected format.

`type aria-placeholder = string

`

##### aria-posinset

 Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-setsize.

`type aria-posinset = number

`

##### aria-pressed

 Indicates the current "pressed" state of toggle buttons.

* aria-checked
* aria-selected.

`type aria-pressed = boolean | "false" | "true" | "mixed"

`

##### aria-readonly

 Indicates that the element is not editable, but is otherwise operable.

 aria-disabled.

`type aria-readonly = Booleanish

`

##### aria-relevant

 Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified.

 aria-atomic.

`type aria-relevant = "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals"

`

##### aria-required

 Indicates that user input is required on the element before a form may be submitted.

`type aria-required = Booleanish

`

##### aria-roledescription

 Defines a human-readable, author-localized description for the role of an element.

`type aria-roledescription = string

`

##### aria-rowcount

 Defines the total number of rows in a table, grid, or treegrid.

 aria-rowindex.

`type aria-rowcount = number

`

##### aria-rowindex

 Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid.

* aria-rowcount
* aria-rowspan.

`type aria-rowindex = number

`

##### aria-rowindextext

 Defines a human readable text alternative of aria-rowindex.

 aria-colindextext.

`type aria-rowindextext = string

`

##### aria-rowspan

 Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-rowindex
* aria-colspan.

`type aria-rowspan = number

`

##### aria-selected

 Indicates the current "selected" state of various widgets.

* aria-checked
* aria-pressed.

`type aria-selected = Booleanish

`

##### aria-setsize

 Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-posinset.

`type aria-setsize = number

`

##### aria-sort

 Indicates if items in a table or grid are sorted in ascending or descending order.

`type aria-sort = "none" | "ascending" | "descending" | "other"

`

##### aria-valuemax

 Defines the maximum allowed value for a range widget.

`type aria-valuemax = number

`

##### aria-valuemin

 Defines the minimum allowed value for a range widget.

`type aria-valuemin = number

`

##### aria-valuenow

 Defines the current value for a range widget.

 aria-valuetext.

`type aria-valuenow = number

`

##### aria-valuetext

 Defines the human readable text alternative of aria-valuenow for a range widget.

`type aria-valuetext = string

`

##### autoCapitalize

`type autoCapitalize =

| (string & {})

| "on"

| "off"

| "none"

| "sentences"

| "words"

| "characters";

`

##### autoCorrect

`type autoCorrect = string;

`

##### autoFocus

`type autoFocus = boolean;

`

##### autoSave

`type autoSave = string;

`

##### children

`type children = ReactNode;

`

##### className

`type className = string;

`

##### color

`type color = string;

`

##### content

`type content = string;

`

##### contentEditable

`type contentEditable = "inherit" | Booleanish | "plaintext-only";

`

##### contextMenu

`type contextMenu = string;

`

##### crossOrigin

`type crossOrigin = CrossOrigin;

`

##### dangerouslySetInnerHTML

`type dangerouslySetInnerHTML = { __html: string | TrustedHTML };

`

##### datatype

`type datatype = string;

`

##### decoding

`type decoding = "auto" | "async" | "sync";

`

##### defaultChecked

`type defaultChecked = boolean;

`

##### defaultValue

`type defaultValue = string | number | (readonly Array<string>)

`

##### dir

`type dir = string;

`

##### draggable

`type draggable = Booleanish;

`

##### enterKeyHint

`type enterKeyHint =

| "search"

| "done"

| "next"

| "send"

| "enter"

| "go"

| "previous";

`

##### fallbackComponent

 This component will be shown if the icon fails to be retrieved If not passed, the component will return `null` .

 You can/should pass a descriptive text/component to this prop, indicating that the icon was not fetched successfully

`type fallbackComponent = Element;

`

### Example

`<WalletIcon fallbackComponent={<span>Failed to load</span>} />;

`

##### fetchPriority

`type fetchPriority = "auto" | "high" | "low";

`

##### height

`type height = string | number;

`

##### hidden

`type hidden = boolean;

`

##### id

`type id = string;

`

##### inert

 https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert

`type inert = boolean;

`

##### inlist

`type inlist = any;

`

##### inputMode

 Hints at the type of data that might be entered by the user while editing the element or its contents

[ https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute](https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute)

`type inputMode =

| "search"

| "email"

| "url"

| "text"

| "none"

| "tel"

| "numeric"

| "decimal";

`

##### is

 Specify that a standard HTML element should behave like a defined custom built-in element

[ https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is](https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is)

`type is = string;

`

##### itemID

`type itemID = string;

`

##### itemProp

`type itemProp = string;

`

##### itemRef

`type itemRef = string;

`

##### itemScope

`type itemScope = boolean;

`

##### itemType

`type itemType = string;

`

##### lang

`type lang = string;

`

##### loading

`type loading = "eager" | "lazy";

`

##### loadingComponent

 This component will be shown while the icon of the wallet is being fetched If not passed, the component will return `null` .

 You can/should pass a loading sign or spinner to this prop.

`type loadingComponent = Element;

`

### Example

`<WalletIcon loadingComponent={<Spinner />} />;

`

##### nonce

`type nonce = string;

`

##### onAbort

`type onAbort = ReactEventHandler<HTMLImageElement>;

`

##### onAbortCapture

`type onAbortCapture = ReactEventHandler<HTMLImageElement>;

`

##### onAnimationEnd

`type onAnimationEnd = AnimationEventHandler<HTMLImageElement>;

`

##### onAnimationEndCapture

`type onAnimationEndCapture = AnimationEventHandler<HTMLImageElement>;

`

##### onAnimationIteration

`type onAnimationIteration = AnimationEventHandler<HTMLImageElement>;

`

##### onAnimationIterationCapture

`type onAnimationIterationCapture =

AnimationEventHandler<HTMLImageElement>;

`

##### onAnimationStart

`type onAnimationStart = AnimationEventHandler<HTMLImageElement>;

`

##### onAnimationStartCapture

`type onAnimationStartCapture =

AnimationEventHandler<HTMLImageElement>;

`

##### onAuxClick

`type onAuxClick = MouseEventHandler<HTMLImageElement>;

`

##### onAuxClickCapture

`type onAuxClickCapture = MouseEventHandler<HTMLImageElement>;

`

##### onBeforeInput

`type onBeforeInput = FormEventHandler<HTMLImageElement>;

`

##### onBeforeInputCapture

`type onBeforeInputCapture = FormEventHandler<HTMLImageElement>;

`

##### onBeforeToggle

`type onBeforeToggle = ToggleEventHandler<HTMLImageElement>;

`

##### onBlur

`type onBlur = FocusEventHandler<HTMLImageElement>;

`

##### onBlurCapture

`type onBlurCapture = FocusEventHandler<HTMLImageElement>;

`

##### onCanPlay

`type onCanPlay = ReactEventHandler<HTMLImageElement>;

`

##### onCanPlayCapture

`type onCanPlayCapture = ReactEventHandler<HTMLImageElement>;

`

##### onCanPlayThrough

`type onCanPlayThrough = ReactEventHandler<HTMLImageElement>;

`

##### onCanPlayThroughCapture

`type onCanPlayThroughCapture = ReactEventHandler<HTMLImageElement>;

`

##### onChange

`type onChange = FormEventHandler<HTMLImageElement>;

`

##### onChangeCapture

`type onChangeCapture = FormEventHandler<HTMLImageElement>;

`

##### onClick

`type onClick = MouseEventHandler<HTMLImageElement>;

`

##### onClickCapture

`type onClickCapture = MouseEventHandler<HTMLImageElement>;

`

##### onCompositionEnd

`type onCompositionEnd = CompositionEventHandler<HTMLImageElement>;

`

##### onCompositionEndCapture

`type onCompositionEndCapture =

CompositionEventHandler<HTMLImageElement>;

`

##### onCompositionStart

`type onCompositionStart = CompositionEventHandler<HTMLImageElement>;

`

##### onCompositionStartCapture

`type onCompositionStartCapture =

CompositionEventHandler<HTMLImageElement>;

`

##### onCompositionUpdate

`type onCompositionUpdate = CompositionEventHandler<HTMLImageElement>;

`

##### onCompositionUpdateCapture

`type onCompositionUpdateCapture =

CompositionEventHandler<HTMLImageElement>;

`

##### onContextMenu

`type onContextMenu = MouseEventHandler<HTMLImageElement>;

`

##### onContextMenuCapture

`type onContextMenuCapture = MouseEventHandler<HTMLImageElement>;

`

##### onCopy

`type onCopy = ClipboardEventHandler<HTMLImageElement>;

`

##### onCopyCapture

`type onCopyCapture = ClipboardEventHandler<HTMLImageElement>;

`

##### onCut

`type onCut = ClipboardEventHandler<HTMLImageElement>;

`

##### onCutCapture

`type onCutCapture = ClipboardEventHandler<HTMLImageElement>;

`

##### onDoubleClick

`type onDoubleClick = MouseEventHandler<HTMLImageElement>;

`

##### onDoubleClickCapture

`type onDoubleClickCapture = MouseEventHandler<HTMLImageElement>;

`

##### onDrag

`type onDrag = DragEventHandler<HTMLImageElement>;

`

##### onDragCapture

`type onDragCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragEnd

`type onDragEnd = DragEventHandler<HTMLImageElement>;

`

##### onDragEndCapture

`type onDragEndCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragEnter

`type onDragEnter = DragEventHandler<HTMLImageElement>;

`

##### onDragEnterCapture

`type onDragEnterCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragExit

`type onDragExit = DragEventHandler<HTMLImageElement>;

`

##### onDragExitCapture

`type onDragExitCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragLeave

`type onDragLeave = DragEventHandler<HTMLImageElement>;

`

##### onDragLeaveCapture

`type onDragLeaveCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragOver

`type onDragOver = DragEventHandler<HTMLImageElement>;

`

##### onDragOverCapture

`type onDragOverCapture = DragEventHandler<HTMLImageElement>;

`

##### onDragStart

`type onDragStart = DragEventHandler<HTMLImageElement>;

`

##### onDragStartCapture

`type onDragStartCapture = DragEventHandler<HTMLImageElement>;

`

##### onDrop

`type onDrop = DragEventHandler<HTMLImageElement>;

`

##### onDropCapture

`type onDropCapture = DragEventHandler<HTMLImageElement>;

`

##### onDurationChange

`type onDurationChange = ReactEventHandler<HTMLImageElement>;

`

##### onDurationChangeCapture

`type onDurationChangeCapture = ReactEventHandler<HTMLImageElement>;

`

##### onEmptied

`type onEmptied = ReactEventHandler<HTMLImageElement>;

`

##### onEmptiedCapture

`type onEmptiedCapture = ReactEventHandler<HTMLImageElement>;

`

##### onEncrypted

`type onEncrypted = ReactEventHandler<HTMLImageElement>;

`

##### onEncryptedCapture

`type onEncryptedCapture = ReactEventHandler<HTMLImageElement>;

`

##### onEnded

`type onEnded = ReactEventHandler<HTMLImageElement>;

`

##### onEndedCapture

`type onEndedCapture = ReactEventHandler<HTMLImageElement>;

`

##### onError

`type onError = ReactEventHandler<HTMLImageElement>;

`

##### onErrorCapture

`type onErrorCapture = ReactEventHandler<HTMLImageElement>;

`

##### onFocus

`type onFocus = FocusEventHandler<HTMLImageElement>;

`

##### onFocusCapture

`type onFocusCapture = FocusEventHandler<HTMLImageElement>;

`

##### onGotPointerCapture

`type onGotPointerCapture = PointerEventHandler<HTMLImageElement>;

`

##### onGotPointerCaptureCapture

`type onGotPointerCaptureCapture =

PointerEventHandler<HTMLImageElement>;

`

##### onInput

`type onInput = FormEventHandler<HTMLImageElement>;

`

##### onInputCapture

`type onInputCapture = FormEventHandler<HTMLImageElement>;

`

##### onInvalid

`type onInvalid = FormEventHandler<HTMLImageElement>;

`

##### onInvalidCapture

`type onInvalidCapture = FormEventHandler<HTMLImageElement>;

`

##### onKeyDown

`type onKeyDown = KeyboardEventHandler<HTMLImageElement>;

`

##### onKeyDownCapture

`type onKeyDownCapture = KeyboardEventHandler<HTMLImageElement>;

`

##### onKeyPress

Deprecated

 Use `onKeyUp` or `onKeyDown` instead

`type onKeyPress = KeyboardEventHandler<HTMLImageElement>;

`

##### onKeyPressCapture

Deprecated

 Use `onKeyUpCapture` or `onKeyDownCapture` instead

`type onKeyPressCapture = KeyboardEventHandler<HTMLImageElement>;

`

##### onKeyUp

`type onKeyUp = KeyboardEventHandler<HTMLImageElement>;

`

##### onKeyUpCapture

`type onKeyUpCapture = KeyboardEventHandler<HTMLImageElement>;

`

##### onLoad

`type onLoad = ReactEventHandler<HTMLImageElement>;

`

##### onLoadCapture

`type onLoadCapture = ReactEventHandler<HTMLImageElement>;

`

##### onLoadedData

`type onLoadedData = ReactEventHandler<HTMLImageElement>;

`

##### onLoadedDataCapture

`type onLoadedDataCapture = ReactEventHandler<HTMLImageElement>;

`

##### onLoadedMetadata

`type onLoadedMetadata = ReactEventHandler<HTMLImageElement>;

`

##### onLoadedMetadataCapture

`type onLoadedMetadataCapture = ReactEventHandler<HTMLImageElement>;

`

##### onLoadStart

`type onLoadStart = ReactEventHandler<HTMLImageElement>;

`

##### onLoadStartCapture

`type onLoadStartCapture = ReactEventHandler<HTMLImageElement>;

`

##### onLostPointerCapture

`type onLostPointerCapture = PointerEventHandler<HTMLImageElement>;

`

##### onLostPointerCaptureCapture

`type onLostPointerCaptureCapture =

PointerEventHandler<HTMLImageElement>;

`

##### onMouseDown

`type onMouseDown = MouseEventHandler<HTMLImageElement>;

`

##### onMouseDownCapture

`type onMouseDownCapture = MouseEventHandler<HTMLImageElement>;

`

##### onMouseEnter

`type onMouseEnter = MouseEventHandler<HTMLImageElement>;

`

##### onMouseLeave

`type onMouseLeave = MouseEventHandler<HTMLImageElement>;

`

##### onMouseMove

`type onMouseMove = MouseEventHandler<HTMLImageElement>;

`

##### onMouseMoveCapture

`type onMouseMoveCapture = MouseEventHandler<HTMLImageElement>;

`

##### onMouseOut

`type onMouseOut = MouseEventHandler<HTMLImageElement>;

`

##### onMouseOutCapture

`type onMouseOutCapture = MouseEventHandler<HTMLImageElement>;

`

##### onMouseOver

`type onMouseOver = MouseEventHandler<HTMLImageElement>;

`

##### onMouseOverCapture

`type onMouseOverCapture = MouseEventHandler<HTMLImageElement>;

`

##### onMouseUp

`type onMouseUp = MouseEventHandler<HTMLImageElement>;

`

##### onMouseUpCapture

`type onMouseUpCapture = MouseEventHandler<HTMLImageElement>;

`

##### onPaste

`type onPaste = ClipboardEventHandler<HTMLImageElement>;

`

##### onPasteCapture

`type onPasteCapture = ClipboardEventHandler<HTMLImageElement>;

`

##### onPause

`type onPause = ReactEventHandler<HTMLImageElement>;

`

##### onPauseCapture

`type onPauseCapture = ReactEventHandler<HTMLImageElement>;

`

##### onPlay

`type onPlay = ReactEventHandler<HTMLImageElement>;

`

##### onPlayCapture

`type onPlayCapture = ReactEventHandler<HTMLImageElement>;

`

##### onPlaying

`type onPlaying = ReactEventHandler<HTMLImageElement>;

`

##### onPlayingCapture

`type onPlayingCapture = ReactEventHandler<HTMLImageElement>;

`

##### onPointerCancel

`type onPointerCancel = PointerEventHandler<HTMLImageElement>;

`

##### onPointerCancelCapture

`type onPointerCancelCapture = PointerEventHandler<HTMLImageElement>;

`

##### onPointerDown

`type onPointerDown = PointerEventHandler<HTMLImageElement>;

`

##### onPointerDownCapture

`type onPointerDownCapture = PointerEventHandler<HTMLImageElement>;

`

##### onPointerEnter

`type onPointerEnter = PointerEventHandler<HTMLImageElement>;

`

##### onPointerLeave

`type onPointerLeave = PointerEventHandler<HTMLImageElement>;

`

##### onPointerMove

`type onPointerMove = PointerEventHandler<HTMLImageElement>;

`

##### onPointerMoveCapture

`type onPointerMoveCapture = PointerEventHandler<HTMLImageElement>;

`

##### onPointerOut

`type onPointerOut = PointerEventHandler<HTMLImageElement>;

`

##### onPointerOutCapture

`type onPointerOutCapture = PointerEventHandler<HTMLImageElement>;

`

##### onPointerOver

`type onPointerOver = PointerEventHandler<HTMLImageElement>;

`

##### onPointerOverCapture

`type onPointerOverCapture = PointerEventHandler<HTMLImageElement>;

`

##### onPointerUp

`type onPointerUp = PointerEventHandler<HTMLImageElement>;

`

##### onPointerUpCapture

`type onPointerUpCapture = PointerEventHandler<HTMLImageElement>;

`

##### onProgress

`type onProgress = ReactEventHandler<HTMLImageElement>;

`

##### onProgressCapture

`type onProgressCapture = ReactEventHandler<HTMLImageElement>;

`

##### onRateChange

`type onRateChange = ReactEventHandler<HTMLImageElement>;

`

##### onRateChangeCapture

`type onRateChangeCapture = ReactEventHandler<HTMLImageElement>;

`

##### onReset

`type onReset = FormEventHandler<HTMLImageElement>;

`

##### onResetCapture

`type onResetCapture = FormEventHandler<HTMLImageElement>;

`

##### onResize

`type onResize = ReactEventHandler<HTMLImageElement>;

`

##### onResizeCapture

`type onResizeCapture = ReactEventHandler<HTMLImageElement>;

`

##### onScroll

`type onScroll = UIEventHandler<HTMLImageElement>;

`

##### onScrollCapture

`type onScrollCapture = UIEventHandler<HTMLImageElement>;

`

##### onSeeked

`type onSeeked = ReactEventHandler<HTMLImageElement>;

`

##### onSeekedCapture

`type onSeekedCapture = ReactEventHandler<HTMLImageElement>;

`

##### onSeeking

`type onSeeking = ReactEventHandler<HTMLImageElement>;

`

##### onSeekingCapture

`type onSeekingCapture = ReactEventHandler<HTMLImageElement>;

`

##### onSelect

`type onSelect = ReactEventHandler<HTMLImageElement>;

`

##### onSelectCapture

`type onSelectCapture = ReactEventHandler<HTMLImageElement>;

`

##### onStalled

`type onStalled = ReactEventHandler<HTMLImageElement>;

`

##### onStalledCapture

`type onStalledCapture = ReactEventHandler<HTMLImageElement>;

`

##### onSubmit

`type onSubmit = FormEventHandler<HTMLImageElement>;

`

##### onSubmitCapture

`type onSubmitCapture = FormEventHandler<HTMLImageElement>;

`

##### onSuspend

`type onSuspend = ReactEventHandler<HTMLImageElement>;

`

##### onSuspendCapture

`type onSuspendCapture = ReactEventHandler<HTMLImageElement>;

`

##### onTimeUpdate

`type onTimeUpdate = ReactEventHandler<HTMLImageElement>;

`

##### onTimeUpdateCapture

`type onTimeUpdateCapture = ReactEventHandler<HTMLImageElement>;

`

##### onToggle

`type onToggle = ToggleEventHandler<HTMLImageElement>;

`

##### onTouchCancel

`type onTouchCancel = TouchEventHandler<HTMLImageElement>;

`

##### onTouchCancelCapture

`type onTouchCancelCapture = TouchEventHandler<HTMLImageElement>;

`

##### onTouchEnd

`type onTouchEnd = TouchEventHandler<HTMLImageElement>;

`

##### onTouchEndCapture

`type onTouchEndCapture = TouchEventHandler<HTMLImageElement>;

`

##### onTouchMove

`type onTouchMove = TouchEventHandler<HTMLImageElement>;

`

##### onTouchMoveCapture

`type onTouchMoveCapture = TouchEventHandler<HTMLImageElement>;

`

##### onTouchStart

`type onTouchStart = TouchEventHandler<HTMLImageElement>;

`

##### onTouchStartCapture

`type onTouchStartCapture = TouchEventHandler<HTMLImageElement>;

`

##### onTransitionCancel

`type onTransitionCancel = TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionCancelCapture

`type onTransitionCancelCapture =

TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionEnd

`type onTransitionEnd = TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionEndCapture

`type onTransitionEndCapture =

TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionRun

`type onTransitionRun = TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionRunCapture

`type onTransitionRunCapture =

TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionStart

`type onTransitionStart = TransitionEventHandler<HTMLImageElement>;

`

##### onTransitionStartCapture

`type onTransitionStartCapture =

TransitionEventHandler<HTMLImageElement>;

`

##### onVolumeChange

`type onVolumeChange = ReactEventHandler<HTMLImageElement>;

`

##### onVolumeChangeCapture

`type onVolumeChangeCapture = ReactEventHandler<HTMLImageElement>;

`

##### onWaiting

`type onWaiting = ReactEventHandler<HTMLImageElement>;

`

##### onWaitingCapture

`type onWaitingCapture = ReactEventHandler<HTMLImageElement>;

`

##### onWheel

`type onWheel = WheelEventHandler<HTMLImageElement>;

`

##### onWheelCapture

`type onWheelCapture = WheelEventHandler<HTMLImageElement>;

`

##### popover

`type popover = "" | "auto" | "manual";

`

##### popoverTarget

`type popoverTarget = string;

`

##### popoverTargetAction

`type popoverTargetAction = "toggle" | "hide" | "show";

`

##### prefix

`type prefix = string;

`

##### property

`type property = string;

`

##### queryOptions

 Optional `useQuery` params

`type queryOptions = Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">

`

##### radioGroup

`type radioGroup = string;

`

##### referrerPolicy

`type referrerPolicy = HTMLAttributeReferrerPolicy;

`

##### rel

`type rel = string;

`

##### resource

`type resource = string;

`

##### results

`type results = number;

`

##### rev

`type rev = string;

`

##### role

`type role = AriaRole;

`

##### security

`type security = string;

`

##### sizes

`type sizes = string;

`

##### slot

`type slot = string;

`

##### spellCheck

`type spellCheck = Booleanish;

`

##### srcSet

`type srcSet = string;

`

##### style

`type style = CSSProperties;

`

##### suppressContentEditableWarning

`type suppressContentEditableWarning = boolean;

`

##### suppressHydrationWarning

`type suppressHydrationWarning = boolean;

`

##### tabIndex

`type tabIndex = number;

`

##### title

`type title = string;

`

##### translate

`type translate = "yes" | "no";

`

##### typeof

`type typeof = string

`

##### unselectable

`type unselectable = "on" | "off";

`

##### useMap

`type useMap = string;

`

##### vocab

`type vocab = string;

`

##### width

`type width = string | number;

`
## WalletNameProps

 Props for the WalletName component

`interface WalletNameProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, "children"> {about : string,accessKey : string,aria-activedescendant : string,aria-atomic : Booleanish,aria-autocomplete : "inline" | "none" | "list" | "both",aria-braillelabel : string,aria-brailleroledescription : string,aria-busy : Booleanish,aria-checked : boolean | "false" | "true" | "mixed",aria-colcount : number,aria-colindex : number,aria-colindextext : string,aria-colspan : number,aria-controls : string,aria-current : boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date",aria-describedby : string,aria-description : string,aria-details : string,aria-disabled : Booleanish,aria-dropeffect : "link" | "popup" | "execute" | "none" | "copy" | "move",aria-errormessage : string,aria-expanded : Booleanish,aria-flowto : string,aria-grabbed : Booleanish,aria-haspopup : boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree",aria-hidden : Booleanish,aria-invalid : boolean | "false" | "true" | "grammar" | "spelling",aria-keyshortcuts : string,aria-label : string,aria-labelledby : string,aria-level : number,aria-live : "off" | "polite" | "assertive",aria-modal : Booleanish,aria-multiline : Booleanish,aria-multiselectable : Booleanish,aria-orientation : "horizontal" | "vertical",aria-owns : string,aria-placeholder : string,aria-posinset : number,aria-pressed : boolean | "false" | "true" | "mixed",aria-readonly : Booleanish,aria-relevant : "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals",aria-required : Booleanish,aria-roledescription : string,aria-rowcount : number,aria-rowindex : number,aria-rowindextext : string,aria-rowspan : number,aria-selected : Booleanish,aria-setsize : number,aria-sort : "none" | "ascending" | "descending" | "other",aria-valuemax : number,aria-valuemin : number,aria-valuenow : number,aria-valuetext : string,autoCapitalize : (string & ({ })) | "on" | "off" | "none" | "sentences" | "words" | "characters",autoCorrect : string,autoFocus : boolean,autoSave : string,className : string,color : string,content : string,contentEditable : "inherit" | (Booleanish) | "plaintext-only",contextMenu : string,dangerouslySetInnerHTML : { __html: string | (TrustedHTML) },datatype : string,defaultChecked : boolean,defaultValue : string | number | (readonly Array<string>),dir : string,draggable : Booleanish,enterKeyHint : "search" | "done" | "next" | "send" | "enter" | "go" | "previous",fallbackComponent : Element,formatFn : (str: string) => string,hidden : boolean,id : string,inert : boolean,inlist : any,inputMode : "search" | "email" | "url" | "text" | "none" | "tel" | "numeric" | "decimal",is : string,itemID : string,itemProp : string,itemRef : string,itemScope : boolean,itemType : string,lang : string,loadingComponent : Element,nonce : string,onAbort : ReactEventHandler<HTMLSpanElement>,onAbortCapture : ReactEventHandler<HTMLSpanElement>,onAnimationEnd : AnimationEventHandler<HTMLSpanElement>,onAnimationEndCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationIteration : AnimationEventHandler<HTMLSpanElement>,onAnimationIterationCapture : AnimationEventHandler<HTMLSpanElement>,onAnimationStart : AnimationEventHandler<HTMLSpanElement>,onAnimationStartCapture : AnimationEventHandler<HTMLSpanElement>,onAuxClick : MouseEventHandler<HTMLSpanElement>,onAuxClickCapture : MouseEventHandler<HTMLSpanElement>,onBeforeInput : FormEventHandler<HTMLSpanElement>,onBeforeInputCapture : FormEventHandler<HTMLSpanElement>,onBeforeToggle : ToggleEventHandler<HTMLSpanElement>,onBlur : FocusEventHandler<HTMLSpanElement>,onBlurCapture : FocusEventHandler<HTMLSpanElement>,onCanPlay : ReactEventHandler<HTMLSpanElement>,onCanPlayCapture : ReactEventHandler<HTMLSpanElement>,onCanPlayThrough : ReactEventHandler<HTMLSpanElement>,onCanPlayThroughCapture : ReactEventHandler<HTMLSpanElement>,onChange : FormEventHandler<HTMLSpanElement>,onChangeCapture : FormEventHandler<HTMLSpanElement>,onClick : MouseEventHandler<HTMLSpanElement>,onClickCapture : MouseEventHandler<HTMLSpanElement>,onCompositionEnd : CompositionEventHandler<HTMLSpanElement>,onCompositionEndCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionStart : CompositionEventHandler<HTMLSpanElement>,onCompositionStartCapture : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdate : CompositionEventHandler<HTMLSpanElement>,onCompositionUpdateCapture : CompositionEventHandler<HTMLSpanElement>,onContextMenu : MouseEventHandler<HTMLSpanElement>,onContextMenuCapture : MouseEventHandler<HTMLSpanElement>,onCopy : ClipboardEventHandler<HTMLSpanElement>,onCopyCapture : ClipboardEventHandler<HTMLSpanElement>,onCut : ClipboardEventHandler<HTMLSpanElement>,onCutCapture : ClipboardEventHandler<HTMLSpanElement>,onDoubleClick : MouseEventHandler<HTMLSpanElement>,onDoubleClickCapture : MouseEventHandler<HTMLSpanElement>,onDrag : DragEventHandler<HTMLSpanElement>,onDragCapture : DragEventHandler<HTMLSpanElement>,onDragEnd : DragEventHandler<HTMLSpanElement>,onDragEndCapture : DragEventHandler<HTMLSpanElement>,onDragEnter : DragEventHandler<HTMLSpanElement>,onDragEnterCapture : DragEventHandler<HTMLSpanElement>,onDragExit : DragEventHandler<HTMLSpanElement>,onDragExitCapture : DragEventHandler<HTMLSpanElement>,onDragLeave : DragEventHandler<HTMLSpanElement>,onDragLeaveCapture : DragEventHandler<HTMLSpanElement>,onDragOver : DragEventHandler<HTMLSpanElement>,onDragOverCapture : DragEventHandler<HTMLSpanElement>,onDragStart : DragEventHandler<HTMLSpanElement>,onDragStartCapture : DragEventHandler<HTMLSpanElement>,onDrop : DragEventHandler<HTMLSpanElement>,onDropCapture : DragEventHandler<HTMLSpanElement>,onDurationChange : ReactEventHandler<HTMLSpanElement>,onDurationChangeCapture : ReactEventHandler<HTMLSpanElement>,onEmptied : ReactEventHandler<HTMLSpanElement>,onEmptiedCapture : ReactEventHandler<HTMLSpanElement>,onEncrypted : ReactEventHandler<HTMLSpanElement>,onEncryptedCapture : ReactEventHandler<HTMLSpanElement>,onEnded : ReactEventHandler<HTMLSpanElement>,onEndedCapture : ReactEventHandler<HTMLSpanElement>,onError : ReactEventHandler<HTMLSpanElement>,onErrorCapture : ReactEventHandler<HTMLSpanElement>,onFocus : FocusEventHandler<HTMLSpanElement>,onFocusCapture : FocusEventHandler<HTMLSpanElement>,onGotPointerCapture : PointerEventHandler<HTMLSpanElement>,onGotPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onInput : FormEventHandler<HTMLSpanElement>,onInputCapture : FormEventHandler<HTMLSpanElement>,onInvalid : FormEventHandler<HTMLSpanElement>,onInvalidCapture : FormEventHandler<HTMLSpanElement>,onKeyDown : KeyboardEventHandler<HTMLSpanElement>,onKeyDownCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyPress : KeyboardEventHandler<HTMLSpanElement>,onKeyPressCapture : KeyboardEventHandler<HTMLSpanElement>,onKeyUp : KeyboardEventHandler<HTMLSpanElement>,onKeyUpCapture : KeyboardEventHandler<HTMLSpanElement>,onLoad : ReactEventHandler<HTMLSpanElement>,onLoadCapture : ReactEventHandler<HTMLSpanElement>,onLoadedData : ReactEventHandler<HTMLSpanElement>,onLoadedDataCapture : ReactEventHandler<HTMLSpanElement>,onLoadedMetadata : ReactEventHandler<HTMLSpanElement>,onLoadedMetadataCapture : ReactEventHandler<HTMLSpanElement>,onLoadStart : ReactEventHandler<HTMLSpanElement>,onLoadStartCapture : ReactEventHandler<HTMLSpanElement>,onLostPointerCapture : PointerEventHandler<HTMLSpanElement>,onLostPointerCaptureCapture : PointerEventHandler<HTMLSpanElement>,onMouseDown : MouseEventHandler<HTMLSpanElement>,onMouseDownCapture : MouseEventHandler<HTMLSpanElement>,onMouseEnter : MouseEventHandler<HTMLSpanElement>,onMouseLeave : MouseEventHandler<HTMLSpanElement>,onMouseMove : MouseEventHandler<HTMLSpanElement>,onMouseMoveCapture : MouseEventHandler<HTMLSpanElement>,onMouseOut : MouseEventHandler<HTMLSpanElement>,onMouseOutCapture : MouseEventHandler<HTMLSpanElement>,onMouseOver : MouseEventHandler<HTMLSpanElement>,onMouseOverCapture : MouseEventHandler<HTMLSpanElement>,onMouseUp : MouseEventHandler<HTMLSpanElement>,onMouseUpCapture : MouseEventHandler<HTMLSpanElement>,onPaste : ClipboardEventHandler<HTMLSpanElement>,onPasteCapture : ClipboardEventHandler<HTMLSpanElement>,onPause : ReactEventHandler<HTMLSpanElement>,onPauseCapture : ReactEventHandler<HTMLSpanElement>,onPlay : ReactEventHandler<HTMLSpanElement>,onPlayCapture : ReactEventHandler<HTMLSpanElement>,onPlaying : ReactEventHandler<HTMLSpanElement>,onPlayingCapture : ReactEventHandler<HTMLSpanElement>,onPointerCancel : PointerEventHandler<HTMLSpanElement>,onPointerCancelCapture : PointerEventHandler<HTMLSpanElement>,onPointerDown : PointerEventHandler<HTMLSpanElement>,onPointerDownCapture : PointerEventHandler<HTMLSpanElement>,onPointerEnter : PointerEventHandler<HTMLSpanElement>,onPointerLeave : PointerEventHandler<HTMLSpanElement>,onPointerMove : PointerEventHandler<HTMLSpanElement>,onPointerMoveCapture : PointerEventHandler<HTMLSpanElement>,onPointerOut : PointerEventHandler<HTMLSpanElement>,onPointerOutCapture : PointerEventHandler<HTMLSpanElement>,onPointerOver : PointerEventHandler<HTMLSpanElement>,onPointerOverCapture : PointerEventHandler<HTMLSpanElement>,onPointerUp : PointerEventHandler<HTMLSpanElement>,onPointerUpCapture : PointerEventHandler<HTMLSpanElement>,onProgress : ReactEventHandler<HTMLSpanElement>,onProgressCapture : ReactEventHandler<HTMLSpanElement>,onRateChange : ReactEventHandler<HTMLSpanElement>,onRateChangeCapture : ReactEventHandler<HTMLSpanElement>,onReset : FormEventHandler<HTMLSpanElement>,onResetCapture : FormEventHandler<HTMLSpanElement>,onResize : ReactEventHandler<HTMLSpanElement>,onResizeCapture : ReactEventHandler<HTMLSpanElement>,onScroll : UIEventHandler<HTMLSpanElement>,onScrollCapture : UIEventHandler<HTMLSpanElement>,onSeeked : ReactEventHandler<HTMLSpanElement>,onSeekedCapture : ReactEventHandler<HTMLSpanElement>,onSeeking : ReactEventHandler<HTMLSpanElement>,onSeekingCapture : ReactEventHandler<HTMLSpanElement>,onSelect : ReactEventHandler<HTMLSpanElement>,onSelectCapture : ReactEventHandler<HTMLSpanElement>,onStalled : ReactEventHandler<HTMLSpanElement>,onStalledCapture : ReactEventHandler<HTMLSpanElement>,onSubmit : FormEventHandler<HTMLSpanElement>,onSubmitCapture : FormEventHandler<HTMLSpanElement>,onSuspend : ReactEventHandler<HTMLSpanElement>,onSuspendCapture : ReactEventHandler<HTMLSpanElement>,onTimeUpdate : ReactEventHandler<HTMLSpanElement>,onTimeUpdateCapture : ReactEventHandler<HTMLSpanElement>,onToggle : ToggleEventHandler<HTMLSpanElement>,onTouchCancel : TouchEventHandler<HTMLSpanElement>,onTouchCancelCapture : TouchEventHandler<HTMLSpanElement>,onTouchEnd : TouchEventHandler<HTMLSpanElement>,onTouchEndCapture : TouchEventHandler<HTMLSpanElement>,onTouchMove : TouchEventHandler<HTMLSpanElement>,onTouchMoveCapture : TouchEventHandler<HTMLSpanElement>,onTouchStart : TouchEventHandler<HTMLSpanElement>,onTouchStartCapture : TouchEventHandler<HTMLSpanElement>,onTransitionCancel : TransitionEventHandler<HTMLSpanElement>,onTransitionCancelCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionEnd : TransitionEventHandler<HTMLSpanElement>,onTransitionEndCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionRun : TransitionEventHandler<HTMLSpanElement>,onTransitionRunCapture : TransitionEventHandler<HTMLSpanElement>,onTransitionStart : TransitionEventHandler<HTMLSpanElement>,onTransitionStartCapture : TransitionEventHandler<HTMLSpanElement>,onVolumeChange : ReactEventHandler<HTMLSpanElement>,onVolumeChangeCapture : ReactEventHandler<HTMLSpanElement>,onWaiting : ReactEventHandler<HTMLSpanElement>,onWaitingCapture : ReactEventHandler<HTMLSpanElement>,onWheel : WheelEventHandler<HTMLSpanElement>,onWheelCapture : WheelEventHandler<HTMLSpanElement>,popover : "" | "auto" | "manual",popoverTarget : string,popoverTargetAction : "toggle" | "hide" | "show",prefix : string,property : string,queryOptions : Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">,radioGroup : string,rel : string,resource : string,results : number,rev : string,role : AriaRole,security : string,slot : string,spellCheck : Booleanish,style : CSSProperties,suppressContentEditableWarning : boolean,suppressHydrationWarning : boolean,tabIndex : number,title : string,translate : "yes" | "no",typeof : string,unselectable : "on" | "off",vocab : string}

`

##### about

`type about = string;

`

##### accessKey

`type accessKey = string;

`

##### aria-activedescendant

 Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application.

`type aria-activedescendant = string

`

##### aria-atomic

 Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute.

`type aria-atomic = Booleanish

`

##### aria-autocomplete

 Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be presented if they are made.

`type aria-autocomplete = "inline" | "none" | "list" | "both"

`

##### aria-braillelabel

 Defines a string value that labels the current element, which is intended to be converted into Braille.

 aria-label.

`type aria-braillelabel = string

`

##### aria-brailleroledescription

 Defines a human-readable, author-localized abbreviated description for the role of an element, which is intended to be converted into Braille.

 aria-roledescription.

`type aria-brailleroledescription = string

`

##### aria-busy

`type aria-busy = Booleanish

`

##### aria-checked

 Indicates the current "checked" state of checkboxes, radio buttons, and other widgets.

* aria-pressed
* aria-selected.

`type aria-checked = boolean | "false" | "true" | "mixed"

`

##### aria-colcount

 Defines the total number of columns in a table, grid, or treegrid.

 aria-colindex.

`type aria-colcount = number

`

##### aria-colindex

 Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid.

* aria-colcount
* aria-colspan.

`type aria-colindex = number

`

##### aria-colindextext

 Defines a human readable text alternative of aria-colindex.

 aria-rowindextext.

`type aria-colindextext = string

`

##### aria-colspan

 Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-colindex
* aria-rowspan.

`type aria-colspan = number

`

##### aria-controls

 Identifies the element (or elements) whose contents or presence are controlled by the current element.

 aria-owns.

`type aria-controls = string

`

##### aria-current

 Indicates the element that represents the current item within a container or set of related elements.

`type aria-current = boolean | "false" | "true" | "time" | "step" | "page" | "location" | "date"

`

##### aria-describedby

 Identifies the element (or elements) that describes the object.

 aria-labelledby

`type aria-describedby = string

`

##### aria-description

 Defines a string value that describes or annotates the current element.

 related aria-describedby.

`type aria-description = string

`

##### aria-details

 Identifies the element that provides a detailed, extended description for the object.

 aria-describedby.

`type aria-details = string

`

##### aria-disabled

 Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable.

* aria-hidden
* aria-readonly.

`type aria-disabled = Booleanish

`

##### aria-dropeffect

Deprecated

 in ARIA 1.1

 Indicates what functions can be performed when a dragged object is released on the drop target.

`type aria-dropeffect = "link" | "popup" | "execute" | "none" | "copy" | "move"

`

##### aria-errormessage

 Identifies the element that provides an error message for the object.

* aria-invalid
* aria-describedby.

`type aria-errormessage = string

`

##### aria-expanded

 Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed.

`type aria-expanded = Booleanish

`

##### aria-flowto

 Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion, allows assistive technology to override the general default of reading in document source order.

`type aria-flowto = string

`

##### aria-grabbed

Deprecated

 in ARIA 1.1

 Indicates an element's "grabbed" state in a drag-and-drop operation.

`type aria-grabbed = Booleanish

`

##### aria-haspopup

 Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element.

`type aria-haspopup = boolean | "false" | "true" | "dialog" | "grid" | "listbox" | "menu" | "tree"

`

##### aria-hidden

 Indicates whether the element is exposed to an accessibility API.

 aria-disabled.

`type aria-hidden = Booleanish

`

##### aria-invalid

 Indicates the entered value does not conform to the format expected by the application.

 aria-errormessage.

`type aria-invalid = boolean | "false" | "true" | "grammar" | "spelling"

`

##### aria-keyshortcuts

 Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element.

`type aria-keyshortcuts = string

`

##### aria-label

 Defines a string value that labels the current element.

 aria-labelledby.

`type aria-label = string

`

##### aria-labelledby

 Identifies the element (or elements) that labels the current element.

 aria-describedby.

`type aria-labelledby = string

`

##### aria-level

 Defines the hierarchical level of an element within a structure.

`type aria-level = number

`

##### aria-live

 Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region.

`type aria-live = "off" | "polite" | "assertive"

`

##### aria-modal

 Indicates whether an element is modal when displayed.

`type aria-modal = Booleanish

`

##### aria-multiline

 Indicates whether a text box accepts multiple lines of input or only a single line.

`type aria-multiline = Booleanish

`

##### aria-multiselectable

 Indicates that the user may select more than one item from the current selectable descendants.

`type aria-multiselectable = Booleanish

`

##### aria-orientation

 Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous.

`type aria-orientation = "horizontal" | "vertical"

`

##### aria-owns

 Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship between DOM elements where the DOM hierarchy cannot be used to represent the relationship.

 aria-controls.

`type aria-owns = string

`

##### aria-placeholder

 Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value. A hint could be a sample value or a brief description of the expected format.

`type aria-placeholder = string

`

##### aria-posinset

 Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-setsize.

`type aria-posinset = number

`

##### aria-pressed

 Indicates the current "pressed" state of toggle buttons.

* aria-checked
* aria-selected.

`type aria-pressed = boolean | "false" | "true" | "mixed"

`

##### aria-readonly

 Indicates that the element is not editable, but is otherwise operable.

 aria-disabled.

`type aria-readonly = Booleanish

`

##### aria-relevant

 Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified.

 aria-atomic.

`type aria-relevant = "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals"

`

##### aria-required

 Indicates that user input is required on the element before a form may be submitted.

`type aria-required = Booleanish

`

##### aria-roledescription

 Defines a human-readable, author-localized description for the role of an element.

`type aria-roledescription = string

`

##### aria-rowcount

 Defines the total number of rows in a table, grid, or treegrid.

 aria-rowindex.

`type aria-rowcount = number

`

##### aria-rowindex

 Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid.

* aria-rowcount
* aria-rowspan.

`type aria-rowindex = number

`

##### aria-rowindextext

 Defines a human readable text alternative of aria-rowindex.

 aria-colindextext.

`type aria-rowindextext = string

`

##### aria-rowspan

 Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid.

* aria-rowindex
* aria-colspan.

`type aria-rowspan = number

`

##### aria-selected

 Indicates the current "selected" state of various widgets.

* aria-checked
* aria-pressed.

`type aria-selected = Booleanish

`

##### aria-setsize

 Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM.

 aria-posinset.

`type aria-setsize = number

`

##### aria-sort

 Indicates if items in a table or grid are sorted in ascending or descending order.

`type aria-sort = "none" | "ascending" | "descending" | "other"

`

##### aria-valuemax

 Defines the maximum allowed value for a range widget.

`type aria-valuemax = number

`

##### aria-valuemin

 Defines the minimum allowed value for a range widget.

`type aria-valuemin = number

`

##### aria-valuenow

 Defines the current value for a range widget.

 aria-valuetext.

`type aria-valuenow = number

`

##### aria-valuetext

 Defines the human readable text alternative of aria-valuenow for a range widget.

`type aria-valuetext = string

`

##### autoCapitalize

`type autoCapitalize =

| (string & {})

| "on"

| "off"

| "none"

| "sentences"

| "words"

| "characters";

`

##### autoCorrect

`type autoCorrect = string;

`

##### autoFocus

`type autoFocus = boolean;

`

##### autoSave

`type autoSave = string;

`

##### className

`type className = string;

`

##### color

`type color = string;

`

##### content

`type content = string;

`

##### contentEditable

`type contentEditable = "inherit" | Booleanish | "plaintext-only";

`

##### contextMenu

`type contextMenu = string;

`

##### dangerouslySetInnerHTML

`type dangerouslySetInnerHTML = { __html: string | TrustedHTML };

`

##### datatype

`type datatype = string;

`

##### defaultChecked

`type defaultChecked = boolean;

`

##### defaultValue

`type defaultValue = string | number | (readonly Array<string>)

`

##### dir

`type dir = string;

`

##### draggable

`type draggable = Booleanish;

`

##### enterKeyHint

`type enterKeyHint =

| "search"

| "done"

| "next"

| "send"

| "enter"

| "go"

| "previous";

`

##### fallbackComponent

 This component will be shown if the name fails to be retreived If not passed, the component will return `null` .

 You can/should pass a descriptive text/component to this prop, indicating that the name was not fetched succesfully

`type fallbackComponent = Element;

`

### Example

`<WalletName fallbackComponent={<span>Failed to load</span>} />;

`

##### formatFn

##### Signature

`function formatFn(str: string): string;

`

##### Parameters

##### str

###### Type

`let str: string;

`

##### Returns

##### Return Type

`let returnType: string;

`

##### hidden

`type hidden = boolean;

`

##### id

`type id = string;

`

##### inert

 https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert

`type inert = boolean;

`

##### inlist

`type inlist = any;

`

##### inputMode

 Hints at the type of data that might be entered by the user while editing the element or its contents

[ https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute](https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute)

`type inputMode =

| "search"

| "email"

| "url"

| "text"

| "none"

| "tel"

| "numeric"

| "decimal";

`

##### is

 Specify that a standard HTML element should behave like a defined custom built-in element

[ https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is](https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is)

`type is = string;

`

##### itemID

`type itemID = string;

`

##### itemProp

`type itemProp = string;

`

##### itemRef

`type itemRef = string;

`

##### itemScope

`type itemScope = boolean;

`

##### itemType

`type itemType = string;

`

##### lang

`type lang = string;

`

##### loadingComponent

 This component will be shown while the name of the wallet name is being fetched If not passed, the component will return `null` .

 You can/should pass a loading sign or spinner to this prop.

`type loadingComponent = Element;

`

### Example

`<WalletName loadingComponent={<Spinner />} />;

`

##### nonce

`type nonce = string;

`

##### onAbort

`type onAbort = ReactEventHandler<HTMLSpanElement>;

`

##### onAbortCapture

`type onAbortCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onAnimationEnd

`type onAnimationEnd = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationEndCapture

`type onAnimationEndCapture = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationIteration

`type onAnimationIteration = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationIterationCapture

`type onAnimationIterationCapture =

AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationStart

`type onAnimationStart = AnimationEventHandler<HTMLSpanElement>;

`

##### onAnimationStartCapture

`type onAnimationStartCapture = AnimationEventHandler<HTMLSpanElement>;

`

##### onAuxClick

`type onAuxClick = MouseEventHandler<HTMLSpanElement>;

`

##### onAuxClickCapture

`type onAuxClickCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onBeforeInput

`type onBeforeInput = FormEventHandler<HTMLSpanElement>;

`

##### onBeforeInputCapture

`type onBeforeInputCapture = FormEventHandler<HTMLSpanElement>;

`

##### onBeforeToggle

`type onBeforeToggle = ToggleEventHandler<HTMLSpanElement>;

`

##### onBlur

`type onBlur = FocusEventHandler<HTMLSpanElement>;

`

##### onBlurCapture

`type onBlurCapture = FocusEventHandler<HTMLSpanElement>;

`

##### onCanPlay

`type onCanPlay = ReactEventHandler<HTMLSpanElement>;

`

##### onCanPlayCapture

`type onCanPlayCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onCanPlayThrough

`type onCanPlayThrough = ReactEventHandler<HTMLSpanElement>;

`

##### onCanPlayThroughCapture

`type onCanPlayThroughCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onChange

`type onChange = FormEventHandler<HTMLSpanElement>;

`

##### onChangeCapture

`type onChangeCapture = FormEventHandler<HTMLSpanElement>;

`

##### onClick

`type onClick = MouseEventHandler<HTMLSpanElement>;

`

##### onClickCapture

`type onClickCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onCompositionEnd

`type onCompositionEnd = CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionEndCapture

`type onCompositionEndCapture =

CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionStart

`type onCompositionStart = CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionStartCapture

`type onCompositionStartCapture =

CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionUpdate

`type onCompositionUpdate = CompositionEventHandler<HTMLSpanElement>;

`

##### onCompositionUpdateCapture

`type onCompositionUpdateCapture =

CompositionEventHandler<HTMLSpanElement>;

`

##### onContextMenu

`type onContextMenu = MouseEventHandler<HTMLSpanElement>;

`

##### onContextMenuCapture

`type onContextMenuCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onCopy

`type onCopy = ClipboardEventHandler<HTMLSpanElement>;

`

##### onCopyCapture

`type onCopyCapture = ClipboardEventHandler<HTMLSpanElement>;

`

##### onCut

`type onCut = ClipboardEventHandler<HTMLSpanElement>;

`

##### onCutCapture

`type onCutCapture = ClipboardEventHandler<HTMLSpanElement>;

`

##### onDoubleClick

`type onDoubleClick = MouseEventHandler<HTMLSpanElement>;

`

##### onDoubleClickCapture

`type onDoubleClickCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onDrag

`type onDrag = DragEventHandler<HTMLSpanElement>;

`

##### onDragCapture

`type onDragCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragEnd

`type onDragEnd = DragEventHandler<HTMLSpanElement>;

`

##### onDragEndCapture

`type onDragEndCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragEnter

`type onDragEnter = DragEventHandler<HTMLSpanElement>;

`

##### onDragEnterCapture

`type onDragEnterCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragExit

`type onDragExit = DragEventHandler<HTMLSpanElement>;

`

##### onDragExitCapture

`type onDragExitCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragLeave

`type onDragLeave = DragEventHandler<HTMLSpanElement>;

`

##### onDragLeaveCapture

`type onDragLeaveCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragOver

`type onDragOver = DragEventHandler<HTMLSpanElement>;

`

##### onDragOverCapture

`type onDragOverCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDragStart

`type onDragStart = DragEventHandler<HTMLSpanElement>;

`

##### onDragStartCapture

`type onDragStartCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDrop

`type onDrop = DragEventHandler<HTMLSpanElement>;

`

##### onDropCapture

`type onDropCapture = DragEventHandler<HTMLSpanElement>;

`

##### onDurationChange

`type onDurationChange = ReactEventHandler<HTMLSpanElement>;

`

##### onDurationChangeCapture

`type onDurationChangeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onEmptied

`type onEmptied = ReactEventHandler<HTMLSpanElement>;

`

##### onEmptiedCapture

`type onEmptiedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onEncrypted

`type onEncrypted = ReactEventHandler<HTMLSpanElement>;

`

##### onEncryptedCapture

`type onEncryptedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onEnded

`type onEnded = ReactEventHandler<HTMLSpanElement>;

`

##### onEndedCapture

`type onEndedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onError

`type onError = ReactEventHandler<HTMLSpanElement>;

`

##### onErrorCapture

`type onErrorCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onFocus

`type onFocus = FocusEventHandler<HTMLSpanElement>;

`

##### onFocusCapture

`type onFocusCapture = FocusEventHandler<HTMLSpanElement>;

`

##### onGotPointerCapture

`type onGotPointerCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onGotPointerCaptureCapture

`type onGotPointerCaptureCapture =

PointerEventHandler<HTMLSpanElement>;

`

##### onInput

`type onInput = FormEventHandler<HTMLSpanElement>;

`

##### onInputCapture

`type onInputCapture = FormEventHandler<HTMLSpanElement>;

`

##### onInvalid

`type onInvalid = FormEventHandler<HTMLSpanElement>;

`

##### onInvalidCapture

`type onInvalidCapture = FormEventHandler<HTMLSpanElement>;

`

##### onKeyDown

`type onKeyDown = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyDownCapture

`type onKeyDownCapture = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyPress

Deprecated

 Use `onKeyUp` or `onKeyDown` instead

`type onKeyPress = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyPressCapture

Deprecated

 Use `onKeyUpCapture` or `onKeyDownCapture` instead

`type onKeyPressCapture = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyUp

`type onKeyUp = KeyboardEventHandler<HTMLSpanElement>;

`

##### onKeyUpCapture

`type onKeyUpCapture = KeyboardEventHandler<HTMLSpanElement>;

`

##### onLoad

`type onLoad = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadCapture

`type onLoadCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedData

`type onLoadedData = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedDataCapture

`type onLoadedDataCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedMetadata

`type onLoadedMetadata = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadedMetadataCapture

`type onLoadedMetadataCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadStart

`type onLoadStart = ReactEventHandler<HTMLSpanElement>;

`

##### onLoadStartCapture

`type onLoadStartCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onLostPointerCapture

`type onLostPointerCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onLostPointerCaptureCapture

`type onLostPointerCaptureCapture =

PointerEventHandler<HTMLSpanElement>;

`

##### onMouseDown

`type onMouseDown = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseDownCapture

`type onMouseDownCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseEnter

`type onMouseEnter = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseLeave

`type onMouseLeave = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseMove

`type onMouseMove = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseMoveCapture

`type onMouseMoveCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOut

`type onMouseOut = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOutCapture

`type onMouseOutCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOver

`type onMouseOver = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseOverCapture

`type onMouseOverCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseUp

`type onMouseUp = MouseEventHandler<HTMLSpanElement>;

`

##### onMouseUpCapture

`type onMouseUpCapture = MouseEventHandler<HTMLSpanElement>;

`

##### onPaste

`type onPaste = ClipboardEventHandler<HTMLSpanElement>;

`

##### onPasteCapture

`type onPasteCapture = ClipboardEventHandler<HTMLSpanElement>;

`

##### onPause

`type onPause = ReactEventHandler<HTMLSpanElement>;

`

##### onPauseCapture

`type onPauseCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onPlay

`type onPlay = ReactEventHandler<HTMLSpanElement>;

`

##### onPlayCapture

`type onPlayCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onPlaying

`type onPlaying = ReactEventHandler<HTMLSpanElement>;

`

##### onPlayingCapture

`type onPlayingCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onPointerCancel

`type onPointerCancel = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerCancelCapture

`type onPointerCancelCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerDown

`type onPointerDown = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerDownCapture

`type onPointerDownCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerEnter

`type onPointerEnter = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerLeave

`type onPointerLeave = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerMove

`type onPointerMove = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerMoveCapture

`type onPointerMoveCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOut

`type onPointerOut = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOutCapture

`type onPointerOutCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOver

`type onPointerOver = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerOverCapture

`type onPointerOverCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerUp

`type onPointerUp = PointerEventHandler<HTMLSpanElement>;

`

##### onPointerUpCapture

`type onPointerUpCapture = PointerEventHandler<HTMLSpanElement>;

`

##### onProgress

`type onProgress = ReactEventHandler<HTMLSpanElement>;

`

##### onProgressCapture

`type onProgressCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onRateChange

`type onRateChange = ReactEventHandler<HTMLSpanElement>;

`

##### onRateChangeCapture

`type onRateChangeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onReset

`type onReset = FormEventHandler<HTMLSpanElement>;

`

##### onResetCapture

`type onResetCapture = FormEventHandler<HTMLSpanElement>;

`

##### onResize

`type onResize = ReactEventHandler<HTMLSpanElement>;

`

##### onResizeCapture

`type onResizeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onScroll

`type onScroll = UIEventHandler<HTMLSpanElement>;

`

##### onScrollCapture

`type onScrollCapture = UIEventHandler<HTMLSpanElement>;

`

##### onSeeked

`type onSeeked = ReactEventHandler<HTMLSpanElement>;

`

##### onSeekedCapture

`type onSeekedCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onSeeking

`type onSeeking = ReactEventHandler<HTMLSpanElement>;

`

##### onSeekingCapture

`type onSeekingCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onSelect

`type onSelect = ReactEventHandler<HTMLSpanElement>;

`

##### onSelectCapture

`type onSelectCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onStalled

`type onStalled = ReactEventHandler<HTMLSpanElement>;

`

##### onStalledCapture

`type onStalledCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onSubmit

`type onSubmit = FormEventHandler<HTMLSpanElement>;

`

##### onSubmitCapture

`type onSubmitCapture = FormEventHandler<HTMLSpanElement>;

`

##### onSuspend

`type onSuspend = ReactEventHandler<HTMLSpanElement>;

`

##### onSuspendCapture

`type onSuspendCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onTimeUpdate

`type onTimeUpdate = ReactEventHandler<HTMLSpanElement>;

`

##### onTimeUpdateCapture

`type onTimeUpdateCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onToggle

`type onToggle = ToggleEventHandler<HTMLSpanElement>;

`

##### onTouchCancel

`type onTouchCancel = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchCancelCapture

`type onTouchCancelCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchEnd

`type onTouchEnd = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchEndCapture

`type onTouchEndCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchMove

`type onTouchMove = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchMoveCapture

`type onTouchMoveCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchStart

`type onTouchStart = TouchEventHandler<HTMLSpanElement>;

`

##### onTouchStartCapture

`type onTouchStartCapture = TouchEventHandler<HTMLSpanElement>;

`

##### onTransitionCancel

`type onTransitionCancel = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionCancelCapture

`type onTransitionCancelCapture =

TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionEnd

`type onTransitionEnd = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionEndCapture

`type onTransitionEndCapture = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionRun

`type onTransitionRun = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionRunCapture

`type onTransitionRunCapture = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionStart

`type onTransitionStart = TransitionEventHandler<HTMLSpanElement>;

`

##### onTransitionStartCapture

`type onTransitionStartCapture =

TransitionEventHandler<HTMLSpanElement>;

`

##### onVolumeChange

`type onVolumeChange = ReactEventHandler<HTMLSpanElement>;

`

##### onVolumeChangeCapture

`type onVolumeChangeCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onWaiting

`type onWaiting = ReactEventHandler<HTMLSpanElement>;

`

##### onWaitingCapture

`type onWaitingCapture = ReactEventHandler<HTMLSpanElement>;

`

##### onWheel

`type onWheel = WheelEventHandler<HTMLSpanElement>;

`

##### onWheelCapture

`type onWheelCapture = WheelEventHandler<HTMLSpanElement>;

`

##### popover

`type popover = "" | "auto" | "manual";

`

##### popoverTarget

`type popoverTarget = string;

`

##### popoverTargetAction

`type popoverTargetAction = "toggle" | "hide" | "show";

`

##### prefix

`type prefix = string;

`

##### property

`type property = string;

`

##### queryOptions

 Optional `useQuery` params

`type queryOptions = Omit<UseQueryOptions<string, Error, string, readonly Array<unknown>>, "queryKey" | "queryFn">

`

##### radioGroup

`type radioGroup = string;

`

##### rel

`type rel = string;

`

##### resource

`type resource = string;

`

##### results

`type results = number;

`

##### rev

`type rev = string;

`

##### role

`type role = AriaRole;

`

##### security

`type security = string;

`

##### slot

`type slot = string;

`

##### spellCheck

`type spellCheck = Booleanish;

`

##### style

`type style = CSSProperties;

`

##### suppressContentEditableWarning

`type suppressContentEditableWarning = boolean;

`

##### suppressHydrationWarning

`type suppressHydrationWarning = boolean;

`

##### tabIndex

`type tabIndex = number;

`

##### title

`type title = string;

`

##### translate

`type translate = "yes" | "no";

`

##### typeof

`type typeof = string

`

##### unselectable

`type unselectable = "on" | "off";

`

##### vocab

`type vocab = string;

`