# Sui Provider

After setting up your wallet, you can have access to the Sui provider:

```javascript
// react
const { providers } = useTomo()
const { suiProvider } = providers;

// pure js
const suiProvider = window.tomo_sui
```

### Get Sui Address

 The Sui address is from the wallet state or provider. In the React framework:

<pre class="language-tsx"><code class="lang-tsx">import { useTomo, getWalletState } from '@tomo-inc/tomo-web-sdk';
const { walletState, providers } = useTomo()

// get from wallet state
const suiAddress = walletState.suiAddress

// or get from provider
<strong>const suiAddress = await providers.suiProvider.getAddress()
</strong>
</code></pre>

Or Pure JS:

<pre class="language-javascript"><code class="lang-javascript"><strong>/** pure js */
</strong>import { getWalletState } from '@tomo-inc/tomo-web-sdk';

// get from wallet state
const suiAddress = getWalletState().suiAddress

// or get from provider
const suiAddress = await window.tomo_sui.getAddress()
</code></pre>

## Provider Functions

### **Signing a Message**

The Sui provider signs messages in bytes and outputs the message and signature:&#x20;

{% code overflow="wrap" %}

```tsx
// interface
signPersonalMessage(_input: { message: Uint8Array; }): Promise<
    string | 
    {
        bytes: string;
        signature: string;
    }
>;

// example
const encoder = new TextEncoder();
const message = encoder.encode("hello world sui");
const res = await provider?.signPersonalMessage({ message });
```

{% endcode %}

### **Sign Transaction**

We follow the standard from Mysten Lab for signing transactions. The user needs to provide a [`SuiSignTransactionInput` ](https://sdk.mystenlabs.com/typedoc/interfaces/_mysten_wallet-standard.SuiSignTransactionInput.html)and get a [`signedtransaction`](https://sdk.mystenlabs.com/typedoc/interfaces/_mysten_wallet-standard.SignedTransaction.html).&#x20;

{% code overflow="wrap" %}

```tsx
// interface
signTransaction: (input: SuiSignTransactionInput) => Promise<SignedTransaction>;

/** Input for signing transactions. */
interface SuiSignTransactionInput {
    transaction: {
        toJSON: () => Promise<string>;
    };
    account: WalletAccount;
    chain: IdentifierString;
    signal?: AbortSignal;
}
/** Output of signing transactions. */
interface SignedTransaction {
    /** Transaction as base64 encoded bcs. */
    bytes: string;
    /** Base64 encoded signature */
    signature: string;
}

// example
const input = {
  transaction,
  account: { address: walletState.suiAddress!, chain: "sui:mainnet" },
  chain: "sui:mainnet",
};

const signRes = await suiProvider.signTransaction(input);
```

{% endcode %}

### Sign and Execute Transaction

We support standard sign and execute a transaction through one call, which requires `SuiSignTransactionInput` as inputs.

{% code overflow="wrap" %}

```typescript
signAndExecuteTransaction: (input: SuiSignAndExecuteTransactionInput) => Promise<SuiSignAndExecuteTransactionOutput>;

/** Input for signing and sending transactions. */
interface SuiSignAndExecuteTransactionInput extends SuiSignTransactionInput {
}

/** Output of signing and sending transactions. */
interface SuiSignAndExecuteTransactionOutput extends SignedTransaction {
    digest: string;
    /** Transaction effects as base64 encoded bcs. */
    effects: string;
}

/** Input for signing transactions. */
interface SuiSignTransactionInput {
    transaction: {
        toJSON: () => Promise<string>;
    };
    account: WalletAccount;
    chain: IdentifierString;
    signal?: AbortSignal;
}

/** Output of signing transactions. */
interface SignedTransaction {
    /** Transaction as base64 encoded bcs. */
    bytes: string;
    /** Base64 encoded signature */
    signature: string;
}


// example
const input = {
  transaction,
  account: { address: walletState.suiAddress!, chain: "sui:mainnet" },
  chain: "sui:mainnet",
};

const sendRes = await suiProvider.signAndExecuteTransaction(input);
```

{% endcode %}

## Example

We provide an [example ](https://socialwallet-react-prod.tomo.inc/sui)of a transfer transaction as follows:

### React

```tsx
import { TomoContextProvider, useTomo } from '@tomo-inc/tomo-web-sdk'

const CLIENT_ID = 'Your client id'

enum Theme {
  Light = 'light',
  Dark = 'dark'
}

export default function SuiDemo() {
  return (
    <TomoContextProvider
      theme={Theme.Light}
      chainTypes={['sui']}
      clientId={CLIENT_ID}
    >
      <App />
    </TomoContextProvider>
  )
}
export function App() {
  const { providers, walletState, openConnectModal } = useTomo()
  const { suiProvider } = providers

  return (
    <div style={{ display: 'flex', gap: '10px' }}>
      <button
        onClick={() => {
          openConnectModal()
        }}
      >
        openConnectModal
      </button>

      <button
        onClick={async () => {
            if (!suiProvider) throw new Error("TronProvider not found");
            const transaction = await buildSuiTransaction({
              fromAddress: walletState.suiAddress!,
              toAddress: address,
              amount: String(amount),
              // coinType: "0x2::sui::SUI",
            });
            const input = {
              transaction,
              account: { address: walletState.suiAddress!, chain: "sui:mainnet" },
              chain: "sui:mainnet",
            };
            const signRes = await suiProvider.signTransaction(input);
            console.log("signRes", signRes);
        }}
      >
        sign transaction
      </button>

      <button
         onClick={async () => {
            if (!suiProvider) throw new Error("TronProvider not found");
            const transaction = await buildSuiTransaction({
              fromAddress: walletState.suiAddress!,
              toAddress: address,
              amount: String(amount),
              // coinType: "0x2::sui::SUI",
            });
            const input = {
              transaction,
              account: { address: walletState.suiAddress!, chain: "sui:mainnet" },
              chain: "sui:mainnet",
            };
            const sendRes = await suiProvider.signAndExecuteTransaction(input);
            console.log("sendRes", sendRes);
        }}
      >
        sign and submit transaction
      </button>
    </div>
  )
}


```

### Pure JS

```javascript

import { initTomoModal } from '@tomo-inc/tomo-web-sdk'

const CLIENT_ID = 'Your client id'

enum Theme {
  Light = 'light',
  Dark = 'dark'
}
initTomoModal({
  theme: Theme.Light,
  clientId: CLIENT_ID,
  chainTypes: ['sui']
})

export default function SuiDemo() {
  return (
    <div style={{ display: 'flex', gap: '10px' }}>
      <button
        onClick={() => {
          window.openTomoConnectModal?.()
        }}
      >
        openConnectModal
      </button>

      <button
        onClick={async () => {
            const suiProvider = window.tomo_sui
            if (!suiProvider) throw new Error("TronProvider not found");
            const transaction = await buildSuiTransaction({
              fromAddress: walletState.suiAddress!,
              toAddress: address,
              amount: String(amount),
              // coinType: "0x2::sui::SUI",
            });
            const input = {
              transaction,
              account: { address: walletState.suiAddress!, chain: "sui:mainnet" },
              chain: "sui:mainnet",
            };
            const signRes = await suiProvider.signTransaction(input);
            console.log("signRes", signRes);
        }}
      >
        sign transaction
      </button>

      <button
         onClick={async () => {
            const suiProvider = window.tomo_sui
            if (!suiProvider) throw new Error("TronProvider not found");
            const transaction = await buildSuiTransaction({
              fromAddress: walletState.suiAddress!,
              toAddress: address,
              amount: String(amount),
              // coinType: "0x2::sui::SUI",
            });
            const input = {
              transaction,
              account: { address: walletState.suiAddress!, chain: "sui:mainnet" },
              chain: "sui:mainnet",
            };
            const sendRes = await suiProvider.signAndExecuteTransaction(input);
            console.log("sendRes", sendRes);
        }}
      >
        sign and submit the transaction
      </button>
    </div>
  )
}
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.tomo.inc/tomo-sdk/tomo-web-sdk/sui-provider.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.