Leap Wallet

https://docs.leapwallet.io/cosmos
Admin
Leap Wallet is a non-custodial super wallet for the Cosmos ecosystem that natively supports 80+...
Tokens:33,278
Snippets:274
Trust Score:9.2
Update:9 months ago
Show doc for...
Tokens:
Raw
### Installation and Connection

Source: https://docs.leapwallet.io/cosmos/leap-metamask-snap/integrating-snaps/metamask-cosmos-snap

This section details how to install and connect to the metamask-cosmos-snap using the wallet_requestSnaps method.

```APIDOC
## POST /wallet_requestSnaps

### Description
Installs or connects to the metamask-cosmos-snap.

### Method
POST

### Endpoint
wallet_requestSnaps

### Parameters
#### Request Body
- **"npm:@leapwallet/metamask-cosmos-snap"** (object) - Required - An object containing snap parameters. For installation, an empty object is typically used.

### Request Example
```json
{
  "method": "wallet_requestSnaps",
  "params": {
    "npm:@leapwallet/metamask-cosmos-snap": {}
  }
}
```

### Response
#### Success Response (200)
- **result** (object) - An object detailing the status of the snap installation or connection.

#### Response Example
```json
{
  "result": {
    "npm:@leapwallet/metamask-cosmos-snap": {
      "state": {},
      "id": "npm:@leapwallet/metamask-cosmos-snap",
      "version": "1.0.0"
    }
  }
}
```
```

--------------------------------

### Install and Connect Metamask Cosmos Snap

Source: https://docs.leapwallet.io/cosmos/leap-metamask-snap/integrating-snaps/metamask-cosmos-snap

Installs or connects to the Metamask Cosmos Snap. It uses the `wallet_requestSnaps` method to initiate the process. Ensure that the Metamask browser extension is installed and accessible.

```javascript
try {
  const result = await window.ethereum.request({
    method: 'wallet_requestSnaps',
    params: {
      'npm:@leapwallet/metamask-cosmos-snap': {},
    },
  });

  console.log(result);

} catch (error) {
  console.log(error);
}
```

--------------------------------

### Install Latest Leap Wallet SDK (npm)

Source: https://docs.leapwallet.io/cosmos/embedded-wallet-sdk/migration

Installs the latest version of the Leap Wallet embedded wallet SDK for React. This command ensures you have the most up-to-date features and bug fixes.

```bash
npm install @leapwallet/embedded-wallet-sdk-react@latest
```

--------------------------------

### Connect to or Install Leap Cosmos Snap

Source: https://docs.leapwallet.io/cosmos/leap-metamask-snap/integrating-snaps/cosmos-snap-provider

Connects to the Leap Cosmos Snap. If the snap is not installed, this function will trigger its installation and then establish a connection. It's recommended to check if the snap is installed first using `getSnap`.

```javascript
import { getSnap, connectSnap } from '@leapwallet/cosmos-snap-provider';

const snapInstalled = await getSnap();
if (!snapInstalled) {
  connectSnap(); // Initiates installation if not already present
}

```

--------------------------------

### Cosmos Snap Provider Installation

Source: https://docs.leapwallet.io/cosmos/leap-metamask-snap/integrating-snaps/cosmos-snap-provider

Instructions for installing the @leapwallet/cosmos-snap-provider package using npm or yarn.

```APIDOC
## Installation

### npm
```bash
npm install @leapwallet/cosmos-snap-provider
```

### yarn
```bash
yarn add @leapwallet/cosmos-snap-provider
```
```

--------------------------------

### Install Cosmos Snap Provider using npm or yarn

Source: https://docs.leapwallet.io/cosmos/leap-metamask-snap/integrating-snaps/cosmos-snap-provider

Installs the @leapwallet/cosmos-snap-provider package using either npm or yarn. This is the first step to integrate the Leap Cosmos Snap into your project.

```bash
npm install @leapwallet/cosmos-snap-provider
```

```bash
yarn add @leapwallet/cosmos-snap-provider
```

--------------------------------

### Import Leap Cosmos Snap Wallet for Cosmos Kit

Source: https://docs.leapwallet.io/cosmos/leap-metamask-snap/integrating-snaps/cosmos-kit

This snippet shows how to import the Leap Cosmos Snap wallet from the '@cosmos-kit/leap-metamask-cosmos-snap' package. This is the first step to include it in your Cosmos Kit setup.

```typescript
import { wallets as leap_cosmos_snap } from "@cosmos-kit/leap-metamask-cosmos-snap";
```

--------------------------------

### Usage Example: Embedded Wallet SDK React

Source: https://docs.leapwallet.io/cosmos/embedded-wallet-sdk/embedded-wallet-sdk-react

Demonstrates how to use the Embedded Wallet SDK within a React application. It shows setting up chain data, managing modal state, and integrating the AccountModal component with necessary providers. Assumes prior setup of cosmos-kit's useChain hook.

```tsx
import React from "react";
import { useChain } from "@cosmos-kit/react";
import { AccountModal, EmbeddedWalletProvider } from "@leapwallet/embedded-wallet-sdk-react";
import "@leapwallet/embedded-wallet-sdk-react/styles.css";

const chainId = "osmosis-1";
const chain = "osmosis";
const restUrl = "https://rest.cosmos.directory/osmosis";

const YourApp = () => {
  const { address } = useChain(chain);
  const [isModalOpen, setIsModalOpen] = React.useState(false);
  
  // trigger the dApp's connect and disconnect wallet flow
  const connectWallet = () => {}
  const disconnectWallet = () => {}
  
  const connectedWalletType = "wallet-type"

  const chainData = {
      [chainId]: {
        address: address ?? "",
        restURL: restURL
      },
  };

  const closeModal = () => setIsModalOpen(false);

  return (
    <div>
      {/* other components */}
      <button onClick={() => setIsModalOpen(true)}>Open Modal</button>
      
      {/* enclose component within provider */}
      <EmbeddedWalletProvider
      connectWallet={connectWallet}
      disconnectWallet={disconnectWallet}
      connectedWalletType={connectedWalletType}
      >
	  <AccountModal
	    theme="dark"
	    chainRecords={chainData}
	    isOpen={isModalOpen}
	    onClose={closeModal}
	  />
      </EmbeddedWalletProvider>
      {/* other components */}
    </div>
  );
};

```

--------------------------------

### Add Leap Cosmos Snap to Cosmos Kit Provider

Source: https://docs.leapwallet.io/cosmos/leap-metamask-snap/integrating-snaps/cosmos-kit

This React component example demonstrates how to add the imported Leap Cosmos Snap wallets to the `ChainProvider` in your Cosmos Kit application. Ensure `walletConnectOptions` are provided if mobile wallets are included.

```tsx
function MyCosmosApp({ Component, pageProps }: AppProps) {
  return (
      <ChainProvider
        chains={chains}
        assetLists={assets}
        wallets={[...leap_cosmos_snap]}
        walletConnectOptions={...} // required if `wallets` contains mobile wallets
      >
        <Component {...pageProps} />
      </ChainProvider>
  );
}
 
export default MyCosmosApp;
```

--------------------------------

### Install Leap Elements TypeScript Types

Source: https://docs.leapwallet.io/cosmos/elements/integrate-via-cdn-script-tag

Installs the `@leapwallet/elements-umd-types` package as a development dependency to enable TypeScript support, including auto-completion and type definitions for the Leap Elements library.

```bash
yarn add --save-dev @leapwallet/elements-umd-types
```

--------------------------------

### getSnap

Source: https://docs.leapwallet.io/cosmos/leap-metamask-snap/integrating-snaps/cosmos-snap-provider

Detects if the Leap Cosmos Snap is installed in the user's MetaMask browser instance.

```APIDOC
## GET /getSnap

### Description
Detects if the Leap Cosmos Snap is installed in the user's MetaMask browser instance.

### Method
GET

### Endpoint
/getSnap

### Parameters
None

### Request Example
None

### Response
#### Success Response (200)
- **snapInstalled** (boolean) - True if the snap is installed, false otherwise.

#### Response Example
```json
{
  "snapInstalled": true
}
```
```

--------------------------------

### Install Leap Wallet Cosmos SDK Core

Source: https://docs.leapwallet.io/cosmos/embedded-wallet-sdk/usage-without-ui

Installs the core Leap Wallet SDK package using yarn. This package provides the necessary functions to interact with the Leap Wallet without relying on the pre-built UI components.

```bash
yarn add @leapwallet/embedded-wallet-sdk-core
```

--------------------------------

### CosmJS Integration with Leap Wallet

Source: https://docs.leapwallet.io/cosmos/for-dapps-connect-to-leap/api-reference

Provides an example of integrating Leap Wallet with CosmJS's SigningStargateClient. Leap's API is designed to be similar to Keplr's for ease of integration. This example demonstrates enabling chains, getting an offline signer, and connecting to a Stargate client.

```javascript
import { GasPrice, SigningStargateClient } from '@cosmjs/stargate'

await window.leap.enable(chainId);

const signOptions = {
  // set this to true to prevent leap from overriding the fees.
  preferNoFeeSet: false
}

const offlineSigner = window.leap.getOfflineSigner(chainId, signOptions);
const accounts = await offlineSigner.getAccounts();
const rpcUrl = "" // Replace with a RPC URL for the given chainId
const signingStargateClient = await SigningStargateClient.connectWithSigner(
  rptycUrl,
  offlineSigner,
  {
    gasPrice: GasPrice.fromString("0.0025ujuno"),
  }
)
```

--------------------------------

### Check if Leap Cosmos Snap is Installed

Source: https://docs.leapwallet.io/cosmos/leap-metamask-snap/integrating-snaps/cosmos-snap-provider

Checks if the Leap Cosmos Snap is installed in the user's MetaMask browser instance using the `getSnap` function. This is useful for determining whether to prompt the user to install the snap.

```javascript
import { getSnap } from '@leapwallet/cosmos-snap-provider';

const snapInstalled = await getSnap(); // Returns true if the snap is already installed

```

--------------------------------

### Import Compass Wallet for RainbowKit

Source: https://docs.leapwallet.io/cosmos/for-sei-evm-dapps-connect-to-compass/connect-to-compass

This code snippet shows how to import the `compassWallet` option when using RainbowKit for wallet connections. Ensure you have RainbowKit installed in your project.

```javascript
import { compassWallet } from '@rainbow-me/rainbowkit/compassWallet';
```

--------------------------------

### CosmJS Integration with Leap Wallet (JavaScript)

Source: https://docs.leapwallet.io/cosmos/for-dapps-connect-to-leap/add-leap-to-a-new-dapp

This example demonstrates how to integrate Leap Wallet with CosmJS for interacting with Cosmos chains. It enables the wallet for a specific chain, gets an offline signer, retrieves accounts, and connects to a Stargate client for transaction signing. Ensure you replace the placeholder RPC URL with a valid one for your chain.

```javascript
import { SigningStargateClient } from '@cosmjs/cosmwasm-stargate'
import { GasPrice } from '@cosmjs/stargate'

await window.leap.enable(chainId);

const offlineSigner = window.leap.getOfflineSignerAuto(chainId);
const accounts = await offlineSigner.getAccounts();
const rpcUrl = "" // Replace with a RPC URL for the given chainId
const stargateClient = await SigningStargateClient.connectWithSigner(
  rpcUrl,
  offlineSigner,
  {
    gasPrice: GasPrice.fromString("0.0025ujuno"),
  }
)
```

--------------------------------

### Example Modal Configuration (React/TypeScript)

Source: https://docs.leapwallet.io/cosmos/embedded-wallet-sdk/embedded-wallet-sdk-react

Provides an example of how to configure the Leap Wallet modal in a React application using TypeScript. It demonstrates custom title rendering and action list configuration.

```tsx
import { Page, Actions } from '@leapwallet/snaps-sdk-react'

const config: Config = {
  title: (page) => {
    switch (page) {
      case Page.HOME:
        return "Assets";
      case Page.ADDRESSES:
        return "Addresses";
    }
  },
  closeOnBackdropClick: true,
  closeOnEscape: true,
  actionListConfig: {
    [Actions.Swap]: {
      label: "Swap",
      onClick: () => {
        console.log('Open Swap tab');
      },
      enabled: true,
    },
    [Actions.Bridge]: {
      enabled: false,
    },
  },
};
```

--------------------------------

### connectSnap

Source: https://docs.leapwallet.io/cosmos/leap-metamask-snap/integrating-snaps/cosmos-snap-provider

Facilitates connection to the Leap Cosmos Snap. If the Snap is not installed, this function initiates its installation and establishes a connection.

```APIDOC
## POST /connectSnap

### Description
Facilitates connection to the Leap Cosmos Snap. If the Snap is not installed, this function initiates its installation and establishes a connection.

### Method
POST

### Endpoint
/connectSnap

### Parameters
None

### Request Example
None

### Response
#### Success Response (200)
- **connected** (boolean) - True if the connection was successful or the snap is now installed and connected.

#### Response Example
```json
{
  "connected": true
}
```
```

--------------------------------

### Install Embedded Wallet SDK React

Source: https://docs.leapwallet.io/cosmos/embedded-wallet-sdk/embedded-wallet-sdk-react

Installs the Embedded Wallet SDK for React applications using npm. This is the first step to integrating the SDK into your project.

```bash
npm install @leapwallet/embedded-wallet-sdk-react
```

--------------------------------

### Get Supported Chains

Source: https://docs.leapwallet.io/cosmos/for-dapps-connect-to-leap/api-reference

Retrieves a list of all chains supported by the Leap Wallet.

```APIDOC
## Get Supported Chains

### Description
Retrieves a list of all chains supported by the Leap Wallet.

### Method
`window.leap.getSupportedChains

### Parameters
None

### Request Example
```javascript
const supportedChains = await window.leap.getSupportedChains()
```

### Response
#### Success Response (200)
*   **supportedChains** (Array<object>) - An array of supported chain objects.

#### Response Example
```json
[
  {
    "chainId": "cosmoshub-4",
    "chainName": "Cosmos Hub",
    "rpcUrl": "https://rpc.cosmoshub.example.com",
    "restUrl": "https://api.cosmoshub.example.com"
  },
  // ... more chains
]
```
```

--------------------------------

### Get Swap Quotes

Source: https://docs.leapwallet.io/cosmos/elements/use-elements-without-the-ui

Obtain a swap route quote based on selected amount, source, and destination chains/tokens.

```APIDOC
## Get Swap Quotes

### Description
Use the `useRoute` hook to get a swap route for a given amount, source chain/token, and destination chain/token pair. The response will contain the optimal route or an error message if a route cannot be found.

### Method
GET (Implicit via hook)

### Endpoint
N/A (Hook-based)

### Parameters
- **amount** (string) - Required - The amount to swap.
- **sourceChainId** (string) - Required - The chain ID of the source token.
- **sourceDenom** (string) - Required - The denom of the source token.
- **destinationChainId** (string) - Required - The chain ID of the destination token.
- **destinationDenom** (string) - Required - The denom of the destination token.

### Request Example
```json
// Example usage of hook (not a direct API call)
const { route, error } = useRoute({
  amount: "1000000",
  sourceChainId: "cosmoshub-4",
  sourceDenom: "uatom",
  destinationChainId: "osmosis-1",
  destinationDenom: "uosmo"
});
```

### Response
#### Success Response (200)
- **route** (object) - Contains information about the swap route, including steps, estimated amount, and fees.

#### Error Response
- **error** (string) - Description of the error if a route could not be found.

#### Response Example
```json
{
  "route": {
    "id": "route-123",
    "sourceChainId": "cosmoshub-4",
    "destinationChainId": "osmosis-1",
    "amountIn": "1000000",
    "amountOut": "950000",
    "estimatedAmount": "950000",
    "fees": [
      {
        "amount": "100",
        "denom": "uatom"
      }
    ],
    "steps": [
      {
        "type": "swap",
        "pool": "pool-1",
        "amountIn": "1000000",
        "amountOut": "950000"
      }
    ]
  }
}
```
```

--------------------------------

### HTML Setup for Leap Wallet Elements CDN Integration

Source: https://docs.leapwallet.io/cosmos/elements/integrate-via-cdn-script-tag

This HTML snippet demonstrates how to include the Leap Wallet Elements stylesheet and script from a CDN. It shows the placement of the script tag in the body and the addition of the 'leap-ui' class to a container element. The 'latest' tag can be replaced with a specific version number.

```html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Your Superb dApp</title>
  </head>
  <body>
    <!-- Your dApp's markup -->
    <div>
      Your dApp Here
    </div>

    <!-- Add the leap-ui class to a parent -->
    <div class="leap-ui" id="leap-elements-container"></div>
    <!-- Add this stylesheet to load styles -->
    <link
      rel="stylesheet"
      href="https://unpkg.com/@leapwallet/elements@latest/dist/umd/style.css"
    />
    <!-- Add this script to load elements -->
    <script
      defer
      src="https://unpkg.com/@leapwallet/elements@latest/dist/umd/main.js"
    ></script>
  </body>
</html>
```

--------------------------------

### Get Transaction Messages

Source: https://docs.leapwallet.io/cosmos/elements/use-elements-without-the-ui

Generate transaction messages required for executing a swap based on the provided route.

```APIDOC
## Get Transaction Messages

### Description
Use the `useMessages` hook to generate the necessary transaction messages for a swap, utilizing the route information and other relevant data. These messages are used to simulate the transaction and determine gas limits before proceeding.

### Method
GET (Implicit via hook)

### Endpoint
N/A (Hook-based)

### Parameters
- **route** (object) - Required - The route object obtained from the `useRoute` hook.
- **signerAddress** (string) - Required - The address of the transaction signer.
- **chainType** (string) - Required - The type of chain (e.g., 'cosmos').

### Request Example
```json
// Example usage of hook (not a direct API call)
const { messages, error } = useMessages({
  route: routeResponse,
  signerAddress: "cosmos1...",
  chainType: "cosmos"
});
```

### Response
#### Success Response (200)
- **messages** (Array) - An array of transaction messages ready to be signed and broadcast.

#### Response Example
```json
{
  "messages": [
    {
      "typeUrl": "/cosmos.bank.v1beta1.MsgSend",
      "value": {
        "fromAddress": "cosmos1...",
        "toAddress": "cosmos1...",
        "amount": [
          {
            "denom": "uatom",
            "amount": "1000000"
          }
        ]
      }
    }
  ]
}
```
```

--------------------------------

### Apply Custom Leap Wallet Theme with Additional Selector

Source: https://docs.leapwallet.io/cosmos/elements/theming/using-css-variables

This example shows how to apply custom Leap Wallet themes by adding an additional selector to your custom CSS. This method is effective when direct variable overrides are not sufficient, leveraging CSS specificity to apply custom styles.

```css
.leap-ui.my-dapp-class {
    --font-family: 'Helvetica', 'SF Pro', sans-serif;
}
```

--------------------------------

### Check Leap Provider Availability (JavaScript)

Source: https://docs.leapwallet.io/cosmos/for-dapps-connect-to-leap/add-leap-to-a-new-dapp

This snippet checks if the Leap Wallet provider is available in the browser's window object. If `window.leap` is not defined, it logs a message indicating the wallet is not installed. Otherwise, it proceeds with wallet initialization.

```javascript
if(!window.leap){
  console.log("leap wallet not installed")
}else{
  // initialise the app
}
```

--------------------------------

### Suggest Chain Configuration with Metamask Cosmos Snap

Source: https://docs.leapwallet.io/cosmos/leap-metamask-snap/integrating-snaps/metamask-cosmos-snap

Suggests a new chain configuration to the Metamask wallet using the `suggestChain` method. This is useful for adding support for custom or less common Cosmos chains. The method accepts detailed `chainInfo` object as a parameter.

```javascript
await window.ethereum.request({
  method: 'wallet_invokeSnap',
  params: {
    snapId: 'local:http://localhost:8000',
    request: {
      method: 'suggestChain',
      params: {
        chainInfo: {
          chainId: 'coreum-mainnet-1',
          chainName: 'coreum',
          bech32Config: {
            bech32PrefixAccAddr: 'core',
          },
          bip44: {
            coinType: 990,
          },
          feeCurrencies: [
          {
            coinDenom: "ucore",
            coinMinimalDenom: "ucore",
            coinDecimals: 6,
            coinGeckoId: "coreum",
            gasPriceStep: {
              low: 0.0625,
              average: 0.5,
              high: 62.5,
            },
          },
        ],
        }
      },
    },
  },
});
```

--------------------------------

### Suggest a Chain Configuration to MetaMask

Source: https://docs.leapwallet.io/cosmos/leap-metamask-snap/integrating-snaps/cosmos-snap-provider

Suggests a chain configuration to MetaMask using the `suggestChain` method. This is useful for adding custom Cosmos chains (coin type 118) to the user's wallet, including details like chain ID, name, bech32 prefix, coin type, and fee currencies.

```javascript
import { suggestChain } from '@leapwallet/cosmos-snap-provider';
await suggestChain({
  chainId: 'coreum-mainnet-1',
  chainName: 'coreum',
  bech32Config: {
    bech32PrefixAccAddr: 'core',
  },
  bip44: {
    coinType: 990,
  },
  feeCurrencies: [
    {
      coinDenom: "ucore",
      coinMinimalDenom: "ucore",
      coinDecimals: 6,
      coinGeckoId: "coreum",
      gasPriceStep: {
        low: 0.0625,
        average: 0.5,
        high: 62.5,
      },
    },
  ],
});

```

--------------------------------

### Suggest Chain

Source: https://docs.leapwallet.io/cosmos/leap-metamask-snap/integrating-snaps/metamask-cosmos-snap

Suggests a chain configuration to the Metamask wallet.

```APIDOC
## POST /wallet_invokeSnap (suggestChain)

### Description
Suggests a new chain configuration to the Metamask wallet, allowing users to interact with custom chains.

### Method
POST

### Endpoint
wallet_invokeSnap

### Parameters
#### Request Body
- **snapId** (string) - Required - The ID of the snap, e.g., 'local:http://localhost:8000' or 'npm:@leapwallet/metamask-cosmos-snap'.
- **request** (object) - Required - An object containing the method and parameters for the snap request.
  - **method** (string) - Required - Must be 'suggestChain'.
  - **params** (object) - Required - Parameters for the suggestChain method.
    - **chainInfo** (object) - Required - An object containing the details of the chain to suggest.
      - **chainId** (string) - Required - The unique identifier for the chain.
      - **chainName** (string) - Required - The human-readable name of the chain.
      - **bech32Config** (object) - Required - Bech32 address configuration.
        - **bech32PrefixAccAddr** (string) - Required - The address prefix for accounts.
      - **bip44** (object) - Required - BIP44 coin type configuration.
        - **coinType** (number) - Required - The coin type number.
      - **feeCurrencies** (array) - Required - An array of fee currency configurations.
        - **coinDenom** (string) - Required - The common denomination of the currency.
        - **coinMinimalDenom** (string) - Required - The minimal denomination of the currency.
        - **coinDecimals** (number) - Required - The number of decimal places for the currency.
        - **coinGeckoId** (string) - Optional - The CoinGecko ID for the currency.
        - **gasPriceStep** (object) - Required - Gas price step configuration.
          - **low** (number) - Required - The low gas price.
          - **average** (number) - Required - The average gas price.
          - **high** (number) - Required - The high gas price.

### Request Example
```json
{
  "method": "wallet_invokeSnap",
  "params": {
    "snapId": "npm:@leapwallet/metamask-cosmos-snap",
    "request": {
      "method": "suggestChain",
      "params": {
        "chainInfo": {
          "chainId": "coreum-mainnet-1",
          "chainName": "Coreum",
          "bech32Config": {
            "bech32PrefixAccAddr": "core"
          },
          "bip44": {
            "coinType": 990
          },
          "feeCurrencies": [
            {
              "coinDenom": "ucore",
              "coinMinimalDenom": "ucore",
              "coinDecimals": 6,
              "coinGeckoId": "coreum",
              "gasPriceStep": {
                "low": 0.0625,
                "average": 0.5,
                "high": 62.5
              }
            }
          ]
        }
      }
    }
  }
}
```

### Response
#### Success Response (200)
- **result** (boolean) - Indicates whether the chain suggestion was successful.

#### Response Example
```json
{
  "result": true
}
```
```

--------------------------------

### Suggest Chain Configuration for Cosmos

Source: https://docs.leapwallet.io/cosmos/for-dapps-connect-to-leap/suggest-chain-add-leap-to-a-non-native-chain

Demonstrates how to use the `experimentalSuggestChain` method to add a new Cosmos chain to the Leap Wallet. This includes specifying chain details, currency configurations, and visual themes.

```typescript
await window.leap.experimentalSuggestChain({
  chainId: "canto_7700-1",
  chainName: "canto",
  rest: "https://api.canto.nodestake.top",
  rpc: "https://rpc.canto.nodestake.top",
  bip44: {
    coinType: 60,
  },
  bech32Config: {
    bech32PrefixAccAddr: "canto",
    bech32PrefixAccPub: "canto" + "pub",
    bech32PrefixValAddr: "canto" + "valoper",
    bech32PrefixValPub: "canto" + "valoperpub",
    bech32PrefixConsAddr: "canto" + "valcons",
    bech32PrefixConsPub: "canto" + "valconspub",
  },
  currencies: [
    {
      coinDenom: "canto",
      coinMinimalDenom: "acanto",
      coinDecimals: 18,
      coinGeckoId: "canto",
    },
  ],
  feeCurrencies: [
    {
      coinDenom: "canto",
      coinMinimalDenom: "acanto",
      coinDecimals: 18,
      coinGeckoId: "canto",
      gasPriceStep: {
        low: 0.01,
        average: 0.025,
        high: 0.04,
      },
    },
  ],
  stakeCurrency: {
    coinDenom: "canto",
    coinMinimalDenom: "acanto",
    coinDecimals: 18,
    coinGeckoId: "cosmos",
  },
  image:
    "https://raw.githubusercontent.com/leapwallet/assets/2289486990e1eaf9395270fffd1c41ba344ef602/images/logo.svg",
  theme: {
    primaryColor: "#fff",
    gradient:
      "linear-gradient(180deg, rgba(255, 255, 255, 0.32) 0%, rgba(255, 255, 255, 0) 100%)",
  },
});
```

--------------------------------

### Import TypeScript Types

Source: https://docs.leapwallet.io/cosmos/elements/integrate-via-cdn-script-tag

Demonstrates how to import specific types like `WalletType` and `TabsConfig` from the `@leapwallet/elements-umd-types` package for use in TypeScript projects.

```typescript
import { WalletType, TabsConfig } from '@leapwallet/elements-umd-types'
```

--------------------------------

### Ethereum RPC Methods

Source: https://docs.leapwallet.io/cosmos/for-sei-evm-dapps-connect-to-compass/supported-rpc-methods

This section details the supported Ethereum-compatible JSON-RPC methods for interacting with the Leap Wallet.

```APIDOC
## Supported Ethereum RPC Methods

### Description
These methods provide compatibility with standard Ethereum JSON-RPC calls, allowing developers to use familiar tools and libraries with Leap Wallet on Cosmos.

### Methods

*   `eth_chainId`
*   `eth_accounts`
*   `wallet_requestPermissions`
*   `eth_requestAccounts`
*   `eth_sendTransaction`
*   `personal_sign`
*   `eth_sign`
*   `eth_signTypedData_v4`
*   `wallet_watchAsset`
*   `eth_call`
*   `eth_blockNumber`
*   `eth_getTransactionReceipt`
*   `wallet_switchEthereumChain`
*   `eth_getTransactionByHash`
*   `eth_estimateGas`
*   `wallet_revokePermissions`

### Further Information
For more details on these methods, refer to the [Ethereum wiki](https://ethereum.org/en/developers/docs/apis/json-rpc/#json-rpc-methods) or [Sei V2 docs](https://v2.docs.sei.io/evm-rpc-endpoints).

### Chain Switching
Sei EVM changes are live on `atlantic-2` and `arctic-1`. You can use the `wallet_switchEthereumChain` method to switch the chain on which the user will perform transactions. Refer to [MetaMask's documentation](https://docs.metamask.io/wallet/reference/wallet_switchethereumchain/) for more details.
```

--------------------------------

### Embed Swapfast URL with Pre-selected Tokens/Chains

Source: https://docs.leapwallet.io/cosmos/elements/integrate-as-an-embed

This URL demonstrates how to pre-select the source and destination chains and assets for a swap. It requires specifying the on-chain denom for assets. The parameters include sourceChainId, destinationChainId, sourceAsset, and destinationAsset.

```url
https://swapfast.app/embed/swaps?sourceChainId=osmosis-1&destinationChainId=neutron-1&sourceAsset=ibc/27394FB092D2ECCD56123C74F36E4C1F926001CEADA9CA97EA622B25F41E5EB2&destinationAsset=untrn
```

--------------------------------

### Chain and Token Information

Source: https://docs.leapwallet.io/cosmos/elements/use-elements-without-the-ui

Retrieve lists of supported chains and tokens for cross-chain operations.

```APIDOC
## Chain and Token Information

### Description
Use the `useSkipSupportedChains` hook to fetch a list of chains supported by Skip, including details like `chainId`, `chainName`, and `logoUri`. Use the `useSkipAssets` hook to get a list of supported tokens with information such as `name`, `symbol`, `denom`, and `originChainId`.

### Method
GET (Implicit via hooks)

### Endpoint
N/A (Hook-based)

### Parameters
None (Hook parameters may apply)

### Request Example
```json
// Example usage of hooks (not a direct API call)
const { chains } = useSkipSupportedChains();
const { assets } = useSkipAssets();
```

### Response
#### Success Response (200)
- **chains** (Array) - List of supported chain objects.
- **assets** (Array) - List of supported token objects.

#### Response Example
```json
{
  "chains": [
    {
      "chainId": "cosmoshub-4",
      "chainName": "Cosmos Hub",
      "logoUri": "https://example.com/cosmos.png",
      "chainType": "cosmos"
    }
  ],
  "assets": [
    {
      "name": "Cosmos",
      "symbol": "ATOM",
      "denom": "uatom",
      "logoUri": "https://example.com/atom.png",
      "trace": null,
      "originChainId": "cosmoshub-4"
    }
  ]
}
```
```

--------------------------------

### Render Dapp Component with Custom Leap Wallet Class

Source: https://docs.leapwallet.io/cosmos/elements/theming/using-css-variables

Illustrates how to wrap your Dapp component with a specific class that targets custom Leap Wallet styles. This is used in conjunction with the additional selector method for theme customization, ensuring your custom styles are applied correctly.

```jsx
const YourDapp = () => {
  return (
    <div className={`leap-ui my-dapp-class`}>
      <IBCSwaps />
    </div>
  )
}
```

--------------------------------

### Import Default Leap Wallet Styles

Source: https://docs.leapwallet.io/cosmos/elements/theming/using-css-variables

This code snippet shows the necessary CSS import to apply the default styles for Leap Wallet elements. Ensure this import is present in your application to render elements correctly.

```jsx
import '@leapwallet/elements/styles.css'
```

--------------------------------

### Get Keys

Source: https://docs.leapwallet.io/cosmos/leap-metamask-snap/integrating-snaps/metamask-cosmos-snap

Retrieves the wallet's public address for a specific chain ID (coin type 118).

```APIDOC
## POST /wallet_invokeSnap (getKey)

### Description
Retrieves the public address associated with a given chain ID from the Metamask Cosmos Snap.

### Method
POST

### Endpoint
wallet_invokeSnap

### Parameters
#### Request Body
- **snapId** (string) - Required - The ID of the snap, typically 'npm:@leapwallet/metamask-cosmos-snap'.
- **request** (object) - Required - An object containing the method and parameters for the snap request.
  - **method** (string) - Required - Must be 'getKey'.
  - **params** (object) - Required - Parameters for the getKey method.
    - **chainId** (string) - Required - The ID of the chain for which to retrieve the address.

### Request Example
```json
{
  "method": "wallet_invokeSnap",
  "params": {
    "snapId": "npm:@leapwallet/metamask-cosmos-snap",
    "request": {
      "method": "getKey",
      "params": {
        "chainId": "cosmoshub-4"
      }
    }
  }
}
```

### Response
#### Success Response (200)
- **accountData** (object) - An object containing the account information, including the public address.

#### Response Example
```json
{
  "accountData": {
    "address": "cosmos1...",
    "publicKey": "..."
  }
}
```
```

--------------------------------

### Fetch User Balances with Custom UI

Source: https://docs.leapwallet.io/cosmos/embedded-wallet-sdk/usage-without-ui

Demonstrates how to fetch a user's wallet balances using the `fetchBalance` function from the Leap Wallet core SDK. Requires the node's REST URL, the wallet address, and optional pagination parameters.

```typescript
const result = await fetchBalance(restUrl, address, params)

const params = {
    pagination: {
        limit: 1000, // results per page
        key: '' // key for pagination
    }
}

// Return Value - A list of object of the following type
// {
//   denom: string;
//   amount: string;
// }
```

--------------------------------

### Get Key

Source: https://docs.leapwallet.io/cosmos/for-dapps-connect-to-leap/api-reference

Retrieves the public key and address for a given chain ID, provided the webpage has permission and the Leap wallet is unlocked.

```APIDOC
## Get Key

### Description
Retrieves the public key and address for a given chain ID, provided the webpage has permission and the Leap wallet is unlocked.

### Method
`window.leap.getKey

### Parameters
#### Path Parameters
None

#### Query Parameters
None

#### Request Body
*   **chainId** (string) - Required - The ID of the chain for which to get the key.

### Request Example
```javascript
const key = await window.leap.getKey('chainId1')
```

### Response
#### Success Response (200)
*   **name** (string) - The name of the key.
*   **algo** (string) - The algorithm used for the key.
*   **pubKey** (Uint8Array) - The public key.
*   **address** (Uint8Array) - The address.
*   **bech32Address** (string) - The bech32 encoded address.
*   **isNanoLedger** (boolean) - Indicates if the key is from a Nano Ledger.

#### Response Example
```json
{
  "name": "my-key",
  "algo": "secp256k1",
  "pubKey": "...",
  "address": "...",
  "bech32Address": "cosmos1...",
  "isNanoLedger": false
}
```
```

--------------------------------

### Mount Fiat On-Ramp Component (TypeScript)

Source: https://docs.leapwallet.io/cosmos/elements/integrate-via-cdn-script-tag

Renders the Fiat On-ramp component with EUR as the source currency and NTRN as the destination token. This method requires the `elementsRoot`, `connectWallet` callback, and `connectedWalletType` to be provided.

```typescript
const { mountElements, WalletType, BRIDGES } = window.LeapElements;

// to render the elements component, call the mountElements method
mountElements({
  elementsRoot: "#leap-elements-container",
  connectWallet: () => {},
  connectedWalletType: WalletType.LEAP,
  element: {
    name: "fiat-on-ramp",
    props: {
      title: "Buy NTRN",
      defaultValues: {
        currency: "EUR",
        destinationChainId: "neutron-1",
        destinationAsset: "untrn"
      }
    }
  }
});
```

--------------------------------

### Get Supported Chains from Leap Wallet

Source: https://docs.leapwallet.io/cosmos/for-dapps-connect-to-leap/api-reference

Retrieves a list of all chains supported by the Leap wallet. This method returns an array of supported chain objects.

```javascript
const supportedChains = await window.leap.getSupportedChains()
```

--------------------------------

### Import Custom Leap Wallet Styles After Default

Source: https://docs.leapwallet.io/cosmos/elements/theming/using-css-variables

Demonstrates how to import custom styles for Leap Wallet elements after the default stylesheets. This ensures that your custom CSS variables and rules take precedence due to the cascading nature of CSS.

```jsx
import '@leapwallet/elements/styles.css'
import './styles/elements-customisations.css'
```

--------------------------------

### Get SNIP-20 Viewing Key from Leap (TypeScript)

Source: https://docs.leapwallet.io/cosmos/for-dapps-connect-to-leap/add-leap-to-a-secret-dapp

Retrieves the viewing key for a SNIP-20 token registered within Leap. An error is thrown if the SNIP-20 token does not exist for the given contract address.

```typescript
async getSecret20ViewingKey( chainId: string, contractAddress: string ): Promise<string>
```

--------------------------------

### mountElements Method

Source: https://docs.leapwallet.io/cosmos/elements/integrate-via-cdn-script-tag

The `mountElements` method is used to render Leap Elements components, such as the Fiat On-ramp, into your dApp. It accepts a configuration object to customize the component's behavior and appearance.

```APIDOC
## POST /mountElements

### Description
Renders Leap Elements components into a specified DOM element.

### Method
POST

### Endpoint
/

### Parameters
#### Request Body
- **`elementsRoot`** (string) - Optional - CSS selector for the DOM element where LeapElements will be mounted. Defaults to 'body'.
- **`connectWallet`** (() => void) - Required - A callback to trigger the wallet connection flow of your dApp.
- **`connectedWalletType`** (WalletType | undefined) - Required - The wallet that is currently connected to your dApp.
- **`primaryChainId`** (string) - Required - The primary chain your dApp's user will connect to.
- **`element`** (object) - Required - An object defining the element to render.
  - **`name`** (string) - Required - The name of the element. Can be one of: `"multi-view"`, `"aggregated-swaps"`, `"ibc-swaps"`, `"fiat-on-ramp"`, `"ibc-transfer"`.
  - **`props`** (object) - Required - Props specific to the element being rendered. Refer to the documentation for specific element props (e.g., Fiat On-ramp props include `title`, `defaultValues`).
- **`skipClientId`** (string) - Optional - A client ID to differentiate between various clients. Recommended to set.
- **`leapIntegratorId`** (string) - Optional - An integrator ID obtained from Leap. Recommended to set.
- **`enableCaching`** (boolean) - Optional - Enables data caching for a faster user experience. Defaults to true.
- **`bridges`** (Array<BRIDGES>) - Optional - Restricts bridges to the specified array. Refer to Skip.build documentation for details.
- **`swapVenues`** (Array<{ chain_id: string; name: string }>) - Optional - Restricts swap venues to the specified array. Refer to Skip.build documentation for details.
- **`enableSmartSwap`** (boolean) - Optional - Enables Skip's smart swap protocol for better rates and routes. Defaults to true.
- **`walletConnectOptions`** (object) - Optional - Wallet Connect (WC) options. Refer to Web3Auth documentation for structure.
- **`capsuleConfig`** (object) - Optional - Social Login options. Refer to Arc.net documentation for structure.
- **`enableGoFast`** (boolean) - Optional - Enables Skip's go fast transfer protocol. Defaults to true.

### Request Example
```json
{
  "elementsRoot": "#leap-elements-container",
  "connectWallet": () => { /* connect wallet logic */ },
  "connectedWalletType": "LEAP",
  "primaryChainId": "neutron-1",
  "element": {
    "name": "fiat-on-ramp",
    "props": {
      "title": "Buy NTRN",
      "defaultValues": {
        "currency": "EUR",
        "destinationChainId": "neutron-1",
        "destinationAsset": "untrn"
      }
    }
  },
  "skipClientId": "my-dapp-client-id",
  "leapIntegratorId": "leap-integrator-123"
}
```

### Response
#### Success Response (200)
- **`status`** (string) - Indicates the success of the operation.

#### Response Example
```json
{
  "status": "mounted"
}
```
```

--------------------------------

### Get Chain Address from Leap Cosmos Snap

Source: https://docs.leapwallet.io/cosmos/leap-metamask-snap/integrating-snaps/cosmos-snap-provider

Fetches the chain address associated with a specific `chainId` from the Leap Cosmos Snap using the `getKey` function. Ensure the snap is connected to the dapp before calling this function.

```javascript
const key = await getKey(chainId);

```

--------------------------------

### Inject Compass Provider using Wagmi

Source: https://docs.leapwallet.io/cosmos/for-sei-evm-dapps-connect-to-compass/connect-to-compass

Demonstrates how to inject the Compass EVM provider into Wagmi's `injected` connector. This allows Wagmi to recognize and connect to the Compass wallet. The `target` object specifies the wallet's ID, name, and provider instance.

```javascript
injected({
  target: {
    id: "compassWalletProvider",
    name: "Compass Wallet",
    provider: window.compassEvm,
  },
})
```

--------------------------------

### AccountModal Component Usage (React)

Source: https://docs.leapwallet.io/cosmos/embedded-wallet-sdk/migration

Demonstrates how to use the AccountModal component with updated props for chain records and REST URLs. The `chainRecords` prop is a record mapping chain-ids to their respective addresses and REST URLs.

```jsx
<AccountModal
  theme="dark"
  chainRecords={chainData}
  isOpen={isModalOpen}
  onClose={closeModal}
/>
```

--------------------------------

### Set Default Swap Values (JavaScript)

Source: https://docs.leapwallet.io/cosmos/elements/components/aggregated-swaps

This prop allows pre-filling swap details such as source/destination chain IDs, asset denominations, and input amounts. It's useful for guiding users or pre-configuring common swaps.

```javascript
const defaultValues = {
    sourceChainId: 'cosmoshub-4',
    sourceAsset: 'uatom',
    destinationChainId: '1',
    destinationAsset: 'eth',
    inputAmount: '1000000'
}
```

--------------------------------

### Get Wallet Public Address with Metamask Cosmos Snap

Source: https://docs.leapwallet.io/cosmos/leap-metamask-snap/integrating-snaps/metamask-cosmos-snap

Retrieves the public address of the wallet for a specific Cosmos chain ID using the `getKey` method. This method is essential for identifying the user's account on a given chain. It requires a valid `chainId` as input.

```javascript
const accountData = await window.ethereum.request({
  method: 'wallet_invokeSnap',
  params: {
    snapId: "npm:@leapwallet/metamask-cosmos-snap",
    request: {
      method: 'getKey',
      params: {
        chainId,
      },
    },
  },
});
```

--------------------------------

### Staking Currency Configuration

Source: https://docs.leapwallet.io/cosmos/for-dapps-connect-to-leap/suggest-chain-add-leap-to-a-non-native-chain

Defines the properties of the chain's staking token, including its display denomination (coinDenom), minimal denomination (coinMinimalDenom), number of decimal places (coinDecimals), and CoinGecko ID for price tracking.

```javascript
{
  coinDenom: "ATOM",
  coinMinimalDenom: "uatom",
  coinDecimals: 6,
  coinGeckoId: "cosmos",
}
```

--------------------------------

### Get User Account with Chain ID (JavaScript)

Source: https://docs.leapwallet.io/cosmos/for-dapps-connect-to-leap/add-leap-to-a-new-dapp

This asynchronous function retrieves a user's account information for a specific chain using its chain ID. It then logs the user's Bech32 address. This is useful for identifying the user and their associated address on a given blockchain.

```javascript
async function getKey(){
  const key = await window.leap.getKey('cosmoshub-4)
  console.log("cosmoshub address", key.bech32Address)
}
```

--------------------------------

### Import Embedded Wallet Provider SDK (React)

Source: https://docs.leapwallet.io/cosmos/embedded-wallet-sdk/embedded-wallet-provider

This snippet shows how to import the EmbeddedWalletProvider component from the '@leapwallet/embedded-wallet-sdk-react' package. This is the primary step to integrate the embedded wallet functionality into a React application.

```javascript
import { EmbeddedWalletProvider } from '@leapwallet/embedded-wallet-sdk-react'
```

--------------------------------

### Get Leap Wallet Key Information

Source: https://docs.leapwallet.io/cosmos/for-dapps-connect-to-leap/api-reference

Retrieves the user's public key and address from the Leap wallet for a given chain ID, provided the wallet is unlocked and the webpage has permission. Returns key details including name, algorithm, public key, address, bech32 address, and Nano Ledger status.

```typescript
interface Key {
  name: string;
  algo: string;
  pubKey: Uint8Array;
  address: Uint8Array;
  bech32Address: string;
  isNanoLedger: boolean;
}

window.leap.getKey(chainId: string): Promise<Key>
```

--------------------------------

### Suggest a New Chain to Leap Wallet

Source: https://docs.leapwallet.io/cosmos/for-dapps-connect-to-leap/suggest-chain-add-leap-to-a-non-native-chain

The `experimentalSuggestChain` function is used to request Leap Wallet to add a new Cosmos-SDK based blockchain. It takes a `SuggestingChainInfo` object as input and returns a Promise that resolves when the chain is added or rejects if the user denies the request or the chain is already present. Ensure the chain information is correctly formatted.

```typescript
experimentalSuggestChain(chainInfo: SuggestingChainInfo): Promise<void>

```
Tokens:
Raw