Typescript

Installation

The Cosmostation wallet package lives in npm. To install the latest stable version, run the following command:

npm install @cosmostation/extension

Or if you're using yarn:

yarn add @cosmostation/extension

Account

Request account

Get account information

example

import { cosmos } from '@cosmostation/extension';
 
<button
  onClick={async () => {
    try {
      const provider = await cosmos('cosmoshub-4');
      const account = await provider.requestAccount();
    } catch (e) {
      console.log(e.message);
    }
  }}
>
  Request Account
</button>;

Disconnect

Disconnect from the extension

example

import { cosmos } from '@cosmostation/extension';
 
<button
  onClick={async () => {
    try {
      const provider = await cosmos('cosmoshub-4');
      const account = await provider.requestAccount();
    } catch (e) {
      console.log(e.message);
    }
  }}
>
  Disconnect
</button>;

Sign

SignAmino

Signing with amino in the legacy way.

example

import { cosmos } from '@cosmostation/extension';
 
<button
  onClick={async () => {
    try {
      const provider = await cosmos('cosmoshub-4');
 
      const doc = {
        //  ...
      };
 
      const response = await provider.signAmino(doc);
 
      console.log(response.signatures);
    } catch (e) {
      console.log(e.message);
    }
  }}
>
  Sign Amino
</button>;

SignDirect

Signing based on protobuf

example

import { cosmos } from '@cosmostation/extension';
 
<button
  onClick={async () => {
    try {
      const provider = await cosmos('cosmoshub-4');
 
      const doc = {
        //  ...
      };
 
      const response = await provider.signDirect(doc);
 
      console.log(response.signatures);
    } catch (e) {
      console.log(e.message);
    }
  }}
>
  Sign Direct
</button>;

SignAndSendTransaction

A method that combines sign and send using signDirect
Receives message as json and automates creation of protobuf

JSON e.g.

example

import { cosmos } from '@cosmostation/extension';
 
<button
  onClick={async () => {
    try {
      const provider = await cosmos('cosmoshub-4');
      const account = await provider.requestAccount();
 
      const response = await provider.signAndSendTransaction({
        messages: [
          {
            type_url: '/cosmos.bank.v1beta1.MsgSend',
            value: {
              from_address: account.address,
              to_address: account.address,
              amount: [
                {
                  denom: 'uatom',
                  amount: '1',
                },
              ],
            },
          },
        ],
        memo: 'Test (Sign And Send Transaction)',
      });
 
      console.log(response);
    } catch (e) {
      console.log(e.message);
    }
  }}
>
  Sign And Send Transaction
</button>;

SignMessage

sign arbitrary bytes

example

import { cosmos } from '@cosmostation/extension';
 
<button
  onClick={async () => {
    try {
      const provider = await cosmos('cosmoshub-4');
 
      const response = await provider.signMessage('Test (Sign Message)');
 
      console.log(response.signature);
    } catch (e) {
      console.log(e.message);
    }
  }}
>
  Sign Message
</button>;

verifyMessage

verify arbitrary bytes

example

import { cosmos } from '@cosmostation/extension';
 
<button
  onClick={async () => {
    try {
      const provider = await cosmos('cosmoshub-4');
 
      const text = 'Test (Sign Message)';
 
      const signResponse = await provider.signMessage(text);
 
      const verifyResponse = await provider.verifyMessage(text, signResponse.signature);
 
      console.log(verifyResponse ? 'verified' : 'not verified');
    } catch (e) {
      console.log(e.message);
    }
  }}
>
  Sign & Verify Message
</button>;

Supported Chains

example

import { cosmosFunctions } from '@cosmostation/extension';
 
<button
  onClick={async () => {
    try {
      const response = cosmosFunctions.getSupportedChainIds();
 
      console.log(response);
    } catch (e) {
      console.log(e.message);
    }
  }}
>
  Request Supported Chain Ids
</button>;

AddCustomChain

Add a chain or testnet chain that is not officially provided by the extension.

example

import { cosmosFunctions } from '@cosmostation/extension';
 
<button
  onClick={async () => {
    try {
      const response = cosmosFunctions.addCosmosChain({
        chainId: 'custom-chain-1',
        chainName: 'custom-chain',
        addressPrefix: 'custom',
        baseDenom: 'ucustom',
        displayDenom: 'CUSTOM',
        restURL: 'https://rpc.custom-chain.com',
        decimals: 6, // optional
        coinType: "118'", // optional
      });
      console.log(response.tx_response.txhash);
    } catch (e) {
      console.log(e.message);
    }
  }}
>
  Add a custom chain
</button>;

Event

addEventListener

example

window.addEventListener('cosmostation_keystorechange', () => {
  console.log('Key store in Cosmostation is changed. You may need to refetch the account info.');
});

removeEventListener

example

window.removeEventListener('cosmostation_keystorechange', handler);

Vanilla React Hook