Skip to content

Commit 1cb33a9

Browse files
ZetazzzZetazzz
committed
refine the index doc
1 parent 4e74ef8 commit 1cb33a9

File tree

1 file changed

+273
-0
lines changed

1 file changed

+273
-0
lines changed

‎README copy.md

Lines changed: 273 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,273 @@
1+
# InterchainJS
2+
3+
<p align="center" style={{ marginBottom: "20px" }}>
4+
<img
5+
src="https://raw.githubusercontent.com/hyperweb-io/interchainjs/refs/heads/main/assets/logo.svg"
6+
width="280"
7+
/>
8+
</p>
9+
10+
<p
11+
align="center"
12+
width="100%"
13+
style={{
14+
display: "flex",
15+
justifyContent: "center",
16+
alignItems: "center",
17+
gap: "2px",
18+
}}
19+
>
20+
<a href="https://github.com/hyperweb-io/interchainjs/actions/workflows/run-tests.yaml">
21+
<img
22+
height="20"
23+
src="https://github.com/hyperweb-io/interchainjs/actions/workflows/run-tests.yaml/badge.svg"
24+
/>
25+
</a>
26+
<a href="https://github.com/hyperweb-io/interchainjs/blob/main/LICENSE-MIT">
27+
<img height="20" src="https://img.shields.io/badge/license-MIT-blue.svg" />
28+
</a>
29+
<a href="https://github.com/hyperweb-io/interchainjs/blob/main/LICENSE-Apache">
30+
<img
31+
height="20"
32+
src="https://img.shields.io/badge/license-Apache-blue.svg"
33+
/>
34+
</a>
35+
</p>
36+
37+
A single, universal signing interface for any network. Birthed from the interchain ecosystem for builders. Create adapters for any Web3 network.
38+
39+
## Table of Contents
40+
41+
- [Introduction](#interchainjs-universal-signing-for-web3)
42+
- [Overview](#overview)
43+
- [Installation](#installation)
44+
- [Quick Start](#quick-start)
45+
- [Create Interchain App](#quick-setup-with-create-interchain-app)
46+
- [Supported Networks](#supported-networks)
47+
- [Cosmos Network](#cosmos-network)
48+
- [Injective Network](#injective-network)
49+
- [Ethereum Network](#ethereum-network)
50+
- [Interchain JavaScript Stack ⚛️](#interchain-javascript-stack-️)
51+
- [Credits](#credits)
52+
- [Disclaimer](#disclaimer)
53+
54+
## InterchainJS: Universal Signing for Web3
55+
56+
[InterchainJS](https://hyperweb.io/stack/interchainjs) is a **universal signing interface** designed for seamless interoperability across blockchain networks. It is one of the **core libraries of the [Interchain JavaScript Stack](https://hyperweb.io/stack)**, a modular framework that brings Web3 development to millions of JavaScript developers.
57+
58+
At its core, InterchainJS provides a **flexible adapter pattern** that abstracts away blockchain signing complexities, making it easy to integrate new networks, manage accounts, and support diverse authentication protocols and signing algorithms—all in a unified, extensible framework.
59+
60+
## Overview
61+
62+
InterchainJS sits at the foundation of the **[Interchain JavaScript Stack](https://hyperweb.io/stack)**, a set of tools that work together like nested building blocks:
63+
64+
- **[InterchainJS](https://hyperweb.io/stack/interchainjs)** → Powers signing across Cosmos, Ethereum (EIP-712), and beyond.
65+
- **[Interchain Kit](https://hyperweb.io/stack/interchain-kit)** → Wallet adapters that connect dApps to multiple blockchain networks.
66+
- **[Interchain UI](https://hyperweb.io/stack/interchain-ui)** → A flexible UI component library for seamless app design.
67+
- **[Create Interchain App](https://hyperweb.io/stack/create-interchain-app)** → A developer-friendly starter kit for cross-chain applications.
68+
69+
This modular architecture ensures **compatibility, extensibility, and ease of use**, allowing developers to compose powerful blockchain applications without deep protocol-specific knowledge.
70+
71+
### Visualizing InterchainJS Components
72+
73+
The diagram below illustrates how InterchainJS connects different signer types to various network classes, showcasing its adaptability for a wide range of blockchain environments.
74+
75+
```mermaid
76+
graph LR
77+
signers --> cosmos_signer["Cosmos Network"]
78+
signers --> injective_signer["Injective Network"]
79+
signers --> ethereum_signer["Ethereum Network"]
80+
signers --> implement_signer["ANY Network"]
81+
82+
cosmos_signer --> cosmos_amino["Amino Signer"]
83+
cosmos_signer --> cosmos_direct["Direct Signer"]
84+
85+
ethereum_signer --> ethereum_eip712["EIP712 Signer"]
86+
87+
injective_signer --> injective_amino["Amino Signer"]
88+
injective_signer --> injective_direct["Direct Signer"]
89+
90+
implement_signer --> any_signer["Any Signer"]
91+
92+
style signers fill:#f9f,stroke:#333,stroke-width:2px
93+
```
94+
95+
```mermaid
96+
graph LR
97+
encoders[Encoders] --> auth["@interchainjs/auth"]
98+
encoders --> utils["@interchainjs/utils"]
99+
encoders --> cosmos_types["@interchainjs/cosmos-types"]
100+
101+
auth --> secp256k1_auth["Secp256k1 Auth"]
102+
auth --> ethSecp256k1_auth["EthSecp256k1 Auth"]
103+
104+
utils --> signer_utils["Signer Utilities"]
105+
utils --> crypto_utils["Crypto Utilities"]
106+
107+
style encoders fill:#f9f,stroke:#333,stroke-width:2px
108+
style auth fill:#ccf,stroke:#333,stroke-width:2px
109+
style utils fill:#ccf,stroke:#333,stroke-width:2px
110+
```
111+
112+
## Installation
113+
114+
This guide will walk you through the process of installing and setting up interchainjs for your project.
115+
116+
You can install interchainjs using Yarn:
117+
118+
```bash
119+
yarn add interchainjs
120+
yarn add @interchainjs/cosmos
121+
```
122+
123+
or npm
124+
125+
```bash
126+
npm i interchainjs
127+
npm i @interchainjs/cosmos
128+
```
129+
130+
## Quick Start
131+
132+
Get a signing client to send the trasactions:
133+
134+
```ts
135+
import { SigningClient as CosmosSigningClient } from "@interchainjs/cosmos";
136+
137+
const signingClient = await CosmosSigningClient.connectWithSigner(
138+
await getRpcEndpoint(),
139+
new DirectGenericOfflineSigner(directSigner),
140+
{
141+
registry: [
142+
// as many as possible encoders registered here.
143+
MsgDelegate,
144+
MsgSend,
145+
],
146+
broadcast: {
147+
checkTx: true,
148+
},
149+
}
150+
);
151+
152+
// sign and broadcast
153+
const result = await signingClient.signAndBroadcast(<MESSAGE>[]);
154+
console.log(result.hash); // the hash of TxRaw
155+
```
156+
157+
Use the tree shakable helper functions provided by interchainjs or generated by telescope for query or send the transctions:
158+
159+
```ts
160+
import { SigningClient as CosmosSigningClient } from "@interchainjs/cosmos/signing-client";
161+
import { getBalance } from "interchainjs/cosmos/bank/v1beta1/query.rpc.func";
162+
import { submitProposal } from "interchainjs/cosmos/gov/v1beta1/tx.rpc.func";
163+
164+
// query to get balance
165+
const { balance } = await getBalance(await getRpcEndpoint(), {
166+
address: directAddress,
167+
denom,
168+
});
169+
170+
const signingClient = await CosmosSigningClient.connectWithSigner(
171+
await getRpcEndpoint(),
172+
new DirectGenericOfflineSigner(directSigner),
173+
{
174+
// no registry needed here anymore
175+
// registry: [
176+
// ],
177+
broadcast: {
178+
checkTx: true,
179+
},
180+
}
181+
);
182+
183+
// Necessary typeurl and codecs will be registered automatically in the helper functions. Meaning users don't have to register them all at once.
184+
const result = await submitProposal(
185+
signingClient,
186+
directAddress,
187+
{
188+
proposer: directAddress,
189+
initialDeposit: [
190+
{
191+
amount: "1000000",
192+
denom: denom,
193+
},
194+
],
195+
content: {
196+
typeUrl: "/cosmos.gov.v1beta1.TextProposal",
197+
value: TextProposal.encode(contentMsg).finish(),
198+
},
199+
},
200+
fee,
201+
"submit proposal"
202+
);
203+
console.log(result.hash); // the hash of TxRaw
204+
```
205+
206+
207+
### Quick Setup with create-interchain-app
208+
209+
The easiest way to get started is by using the create-interchain-app tool, which sets up a complete project with all necessary dependencies:
210+
211+
```bash
212+
npm install -g create-interchain-app
213+
214+
cia --example authz
215+
```
216+
217+
Then an authz example website will be created and users can take a look how signing clients and helper functions are used.
218+
219+
---
220+
221+
## Supported Networks
222+
223+
### Cosmos Network
224+
225+
| Feature | Package |
226+
| ---------------------------- | ------------------------------------------------------------- |
227+
| **Transactions** | [@interchainjs/cosmos](https://docs.hyperweb.io/interchain-js/networks/cosmos) |
228+
| **Cosmos Types** | [@interchainjs/cosmos-types](https://docs.hyperweb.io/interchain-js/libs/cosmos-types) |
229+
| **Migration from `@cosmjs`** | [Migration Guide](https://docs.hyperweb.io/interchain-js/advanced/migration-from-cosmjs.mdx) |
230+
231+
---
232+
233+
### Injective Network
234+
235+
| Feature | Package |
236+
| ---------------- | -------------------------------------------------------- |
237+
| **Transactions** | [@interchainjs/injective](https://docs.hyperweb.io/interchain-js/networks/injective) |
238+
239+
---
240+
241+
### Ethereum Network
242+
243+
| Feature | Package |
244+
| ---------------- | ------------------------------------------------------ |
245+
| **Transactions** | [@interchainjs/ethereum](https://docs.hyperweb.io/interchain-js/networks/ethereum) |
246+
247+
---
248+
249+
## Interchain JavaScript Stack ⚛️
250+
251+
A unified toolkit for building applications and smart contracts in the Interchain ecosystem
252+
253+
| Category | Tools | Description |
254+
| ------------------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------- |
255+
| **Chain Information** | [**Chain Registry**](https://github.com/hyperweb-io/chain-registry), [**Utils**](https://www.npmjs.com/package/@chain-registry/utils), [**Client**](https://www.npmjs.com/package/@chain-registry/client) | Everything from token symbols, logos, and IBC denominations for all assets you want to support in your application. |
256+
| **Wallet Connectors** | [**Interchain Kit**](https://github.com/hyperweb-io/interchain-kit)<sup>beta</sup>, [**Cosmos Kit**](https://github.com/hyperweb-io/cosmos-kit) | Experience the convenience of connecting with a variety of web3 wallets through a single, streamlined interface. |
257+
| **Signing Clients** | [**InterchainJS**](https://github.com/hyperweb-io/interchainjs)<sup>beta</sup>, [**CosmJS**](https://github.com/cosmos/cosmjs) | A single, universal signing interface for any network |
258+
| **SDK Clients** | [**Telescope**](https://github.com/hyperweb-io/telescope) | Your Frontend Companion for Building with TypeScript with Cosmos SDK Modules. |
259+
| **Starter Kits** | [**Create Interchain App**](https://github.com/hyperweb-io/create-interchain-app)<sup>beta</sup>, [**Create Cosmos App**](https://github.com/hyperweb-io/create-cosmos-app) | Set up a modern Interchain app by running one command. |
260+
| **UI Kits** | [**Interchain UI**](https://github.com/hyperweb-io/interchain-ui) | The Interchain Design System, empowering developers with a flexible, easy-to-use UI kit. |
261+
| **Testing Frameworks** | [**Starship**](https://github.com/hyperweb-io/starship) | Unified Testing and Development for the Interchain. |
262+
| **TypeScript Smart Contracts** | [**Create Hyperweb App**](https://github.com/hyperweb-io/create-hyperweb-app) | Build and deploy full-stack blockchain applications with TypeScript |
263+
| **CosmWasm Contracts** | [**CosmWasm TS Codegen**](https://github.com/CosmWasm/ts-codegen) | Convert your CosmWasm smart contracts into dev-friendly TypeScript classes. |
264+
265+
## Credits
266+
267+
🛠 Built by Hyperweb (formerly Cosmology) — if you like our tools, please checkout and contribute to [our github ⚛️](https://github.com/hyperweb-io)
268+
269+
## Disclaimer
270+
271+
AS DESCRIBED IN THE LICENSES, THE SOFTWARE IS PROVIDED "AS IS", AT YOUR OWN RISK, AND WITHOUT WARRANTIES OF ANY KIND.
272+
273+
No developer or entity involved in creating this software will be liable for any claims or damages whatsoever associated with your use, inability to use, or your interaction with other users of the code, including any direct, indirect, incidental, special, exemplary, punitive or consequential damages, or loss of profits, cryptocurrencies, tokens, or anything else of value.

0 commit comments

Comments
 (0)