Integrating Leap Wallet

This documentation provides a guide on integrating Leap Wallet into your Sui application. By following these steps, you can seamlessly detect, connect, and interact with Leap

Detecting Leap Wallet

To seamlessly integrate Leap Wallet into your SUI application, use the @mysten/wallet-standard package. This standardized approach ensures consistent wallet detection and interaction across different providers.

Prerequisites

Before you begin, install the required package using your preferred package manager:

# Using NPM
npm i @mysten/wallet-standard

# Using Yarn
yarn add @mysten/wallet-standard

Implementing Wallet Detection

After installing the package, use the following code snippet to detect SUI-compatible wallets, including Leap:

import { getWallets } from '@mysten/wallet-standard'

const { get } = getWallets()

const allWallets = get()

Next, filter out any wallets that are not compatible with the SUI standard.

import { isWalletWithRequiredFeatureSet } from '@mysten/wallet-standard'

const suiWallets = allWallets.filter(isWalletWithRequiredFeatureSet)

Once you've identified the Leap wallet within the suiWallets array, you'll gain access to various functions like connect, which we’ll cover in the next section.

Alternative Detection Method

You can also access the Leap wallet directly through the window object:

const leapWallet = window.leap?.sui

This method provides direct access to the Leap wallet interface when available in the browser environment.

Note: Make sure to implement proper error handling and wallet availability checks in your application to ensure a smooth user experience.

Enable Connection

The wallet connection can be established using the connect method. If the wallet is locked, it will redirect to the extension login page. If the user hasn't permitted the webpage, it will ask for permission.

import {StandardConnectOutput} from '@mysten/wallet-standard'

const accounts: StandardConnectOutput = await window.leap.sui.connect()

Disconnect

Disconnect the wallet from the dApp.

await window.leap.sui.disconnect() // void function

Sign Personal Message

Sign an arbitrary personal message.

import {SuiSignPersonalMessageInput, SignPersonalMessageOutput} from '@mysten/wallet-standard'
import type { WalletAccount, IdentifierString } from '@wallet-standard/base';

const input: SuiSignPersonalMessageInput = {
		message, // Uint8Array;
    account // WalletAccount;
    chain // (optional) IdentifierString;
}

const signed: SignPersonalMessageOutput = await window.leap.sui.signPersonalMessage(input)

Sign Transaction

Sign a transaction without executing it.

import {SuiSignTransactionInput, SignedTransaction} from '@mysten/wallet-standard'
import type { WalletAccount, IdentifierString } from '@wallet-standard/base';

const input: SuiSignTransactionInput = {
		transaction: {
        // toJSON: () => Promise<string>;
    },
    account, // WalletAccount
    chain //IdentifierString
}

const signed: SignedTransaction = await window.leap.sui.signTransaction(input)

Sign and Execute Transaction

Sign and execute a transaction in one step.

import {SuiSignAndExecuteTransactionInput, SignAndExecuteTransactionOutput} from '@mysten/wallet-standard'
import type { WalletAccount, IdentifierString } from '@wallet-standard/base';

const input: SuiSignAndExecuteTransactionInput = {
	transaction: {
        // toJSON: () => Promise<string>;
    },
    account, // WalletAccount
    chain //IdentifierString
}

const signedResult: SignAndExecuteTransactionOutput = await window.leap.sui.signAndExecuteTransaction(input)

Legacy Support (Transaction Blocks)

For backward compatibility, the wallet also supports transaction block operations:

Sign Transaction Block

import {SuiSignTransactionBlockInput, SuiSignTransactionBlockOutput} from '@mysten/wallet-standard'
import type { Transaction } from '@mysten/sui/transactions';
import type { WalletAccount, IdentifierString } from '@wallet-standard/base';

const input: SuiSignTransactionBlockInput = {
		transactionBlock, // Transaction
    account, // WalletAccount
    chain //IdentifierString
}

const signed: SuiSignTransactionBlockOutput = await window.leap.sui.signTransactionBlock(input)

Sign and Execute Transaction Block

import {SuiSignAndExecuteTransactionBlockInput, SuiSignAndExecuteTransactionBlockOutput} from '@mysten/wallet-standard'
import type { Transaction } from '@mysten/sui/transactions';
import type { WalletAccount, IdentifierString } from '@wallet-standard/base';

const input: SuiSignAndExecuteTransactionBlockInput = {
		transactionBlock, // Transaction
    account, // WalletAccount
    chain //IdentifierString
}

const signed: SuiSignAndExecuteTransactionBlockOutput = await window.leap.sui.signAndExecuteTransactionBlock(input)

Events

The wallet provider emits events that you can listen to:

window.leap.sui.on('change', ({ accounts }) => {
  // Handle account changes
});

Example Usage with Sui SDK

import { TransactionBlock } from '@mysten/sui';

// Connect to wallet
const response = await window.leap.sui.connect();
const account = response.accounts[0];

// Create a transaction
const txb = new TransactionBlock();
// Add your transaction instructions

// Sign and execute the transaction
const result = await window.leap.sui.signAndExecuteTransactionBlock({
  transactionBlock: txb,
  account,
  chain: 'sui:mainnet'
});

// Get the transaction digest
console.log('Transaction digest:', result.digest);

Supported Chains

The wallet supports the following Sui chains:

• sui:mainnet

• sui:testnet

Note: All methods may throw errors if the wallet is locked, user rejects the request, or if there are network issues. Make sure to implement proper error handling in your dApp.