@interchain-kit/react 0.0.1-beta.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (60) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +60 -0
  3. package/enum/connection.d.ts +5 -0
  4. package/enum/connection.js +9 -0
  5. package/enum/index.d.ts +1 -0
  6. package/enum/index.js +17 -0
  7. package/esm/enum/connection.js +6 -0
  8. package/esm/enum/index.js +1 -0
  9. package/esm/hooks/index.js +6 -0
  10. package/esm/hooks/useAccount.js +25 -0
  11. package/esm/hooks/useActiveWallet.js +5 -0
  12. package/esm/hooks/useChain.js +30 -0
  13. package/esm/hooks/useChainWallet.js +36 -0
  14. package/esm/hooks/useConnect.js +11 -0
  15. package/esm/hooks/useWalletManager.js +5 -0
  16. package/esm/index.js +5 -0
  17. package/esm/modal/index.js +2 -0
  18. package/esm/modal/modal.js +16 -0
  19. package/esm/modal/provider.js +18 -0
  20. package/esm/provider.js +23 -0
  21. package/esm/types/account.js +1 -0
  22. package/esm/types/chain.js +1 -0
  23. package/esm/types/index.js +1 -0
  24. package/esm/types/wallet.js +1 -0
  25. package/esm/utils/index.js +1 -0
  26. package/hooks/index.d.ts +6 -0
  27. package/hooks/index.js +22 -0
  28. package/hooks/useAccount.d.ts +2 -0
  29. package/hooks/useAccount.js +29 -0
  30. package/hooks/useActiveWallet.d.ts +1 -0
  31. package/hooks/useActiveWallet.js +9 -0
  32. package/hooks/useChain.d.ts +2 -0
  33. package/hooks/useChain.js +34 -0
  34. package/hooks/useChainWallet.d.ts +15 -0
  35. package/hooks/useChainWallet.js +40 -0
  36. package/hooks/useConnect.d.ts +1 -0
  37. package/hooks/useConnect.js +15 -0
  38. package/hooks/useWalletManager.d.ts +2 -0
  39. package/hooks/useWalletManager.js +9 -0
  40. package/index.d.ts +5 -0
  41. package/index.js +21 -0
  42. package/modal/index.d.ts +2 -0
  43. package/modal/index.js +18 -0
  44. package/modal/modal.d.ts +1 -0
  45. package/modal/modal.js +20 -0
  46. package/modal/provider.d.ts +10 -0
  47. package/modal/provider.js +23 -0
  48. package/package.json +42 -0
  49. package/provider.d.ts +17 -0
  50. package/provider.js +28 -0
  51. package/types/account.d.ts +3 -0
  52. package/types/account.js +2 -0
  53. package/types/chain.d.ts +10 -0
  54. package/types/chain.js +2 -0
  55. package/types/index.d.ts +1 -0
  56. package/types/index.js +17 -0
  57. package/types/wallet.d.ts +11 -0
  58. package/types/wallet.js +2 -0
  59. package/utils/index.d.ts +0 -0
  60. package/utils/index.js +1 -0
package/LICENSE ADDED
@@ -0,0 +1,21 @@
1
+ The MIT License (MIT)
2
+
3
+ Copyright (c) 2024 Cosmology Developers <developers@cosmology.zone>
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
package/README.md ADDED
@@ -0,0 +1,60 @@
1
+ # react
2
+
3
+ <p align="center">
4
+ <img src="https://user-images.githubusercontent.com/545047/188804067-28e67e5e-0214-4449-ab04-2e0c564a6885.svg" width="80"><br />
5
+ interchain-kit wallet connector react package
6
+ </p>
7
+
8
+ ## install
9
+
10
+ ```sh
11
+ npm install react
12
+ ```
13
+ ## Table of contents
14
+
15
+ - [react](#react)
16
+ - [Install](#install)
17
+ - [Table of contents](#table-of-contents)
18
+ - [Developing](#developing)
19
+ - [Credits](#credits)
20
+
21
+ ## Developing
22
+
23
+ When first cloning the repo:
24
+
25
+ ```sh
26
+ yarn
27
+ # build the prod packages. When devs would like to navigate to the source code, this will only navigate from references to their definitions (.d.ts files) between packages.
28
+ yarn build
29
+ ```
30
+
31
+ Or if you want to make your dev process smoother, you can run:
32
+
33
+ ```sh
34
+ yarn
35
+ # build the dev packages with .map files, this enables navigation from references to their source code between packages.
36
+ yarn build:dev
37
+ ```
38
+
39
+ ## Related
40
+
41
+ Checkout these related projects:
42
+
43
+ * [@cosmology/telescope](https://github.com/cosmology-tech/telescope) Your Frontend Companion for Building with TypeScript with Cosmos SDK Modules.
44
+ * [@cosmwasm/ts-codegen](https://github.com/CosmWasm/ts-codegen) Convert your CosmWasm smart contracts into dev-friendly TypeScript classes.
45
+ * [chain-registry](https://github.com/cosmology-tech/chain-registry) Everything from token symbols, logos, and IBC denominations for all assets you want to support in your application.
46
+ * [cosmos-kit](https://github.com/cosmology-tech/cosmos-kit) Experience the convenience of connecting with a variety of web3 wallets through a single, streamlined interface.
47
+ * [create-cosmos-app](https://github.com/cosmology-tech/create-cosmos-app) Set up a modern Cosmos app by running one command.
48
+ * [interchain-ui](https://github.com/cosmology-tech/interchain-ui) The Interchain Design System, empowering developers with a flexible, easy-to-use UI kit.
49
+ * [starship](https://github.com/cosmology-tech/starship) Unified Testing and Development for the Interchain.
50
+
51
+ ## Credits
52
+
53
+ 🛠 Built by Cosmology — if you like our tools, please consider delegating to [our validator ⚛️](https://cosmology.zone/validator)
54
+
55
+
56
+ ## Disclaimer
57
+
58
+ AS DESCRIBED IN THE LICENSES, THE SOFTWARE IS PROVIDED “AS IS”, AT YOUR OWN RISK, AND WITHOUT WARRANTIES OF ANY KIND.
59
+
60
+ 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,0 +1,5 @@
1
+ export declare enum ConnectState {
2
+ CONNECTING = "connecting",
3
+ CONNECTED = "connected",
4
+ DISCONNECTED = "disconnected"
5
+ }
@@ -0,0 +1,9 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.ConnectState = void 0;
4
+ var ConnectState;
5
+ (function (ConnectState) {
6
+ ConnectState["CONNECTING"] = "connecting";
7
+ ConnectState["CONNECTED"] = "connected";
8
+ ConnectState["DISCONNECTED"] = "disconnected";
9
+ })(ConnectState || (exports.ConnectState = ConnectState = {}));
@@ -0,0 +1 @@
1
+ export * from './connection';
package/enum/index.js ADDED
@@ -0,0 +1,17 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __exportStar = (this && this.__exportStar) || function(m, exports) {
14
+ for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
15
+ };
16
+ Object.defineProperty(exports, "__esModule", { value: true });
17
+ __exportStar(require("./connection"), exports);
@@ -0,0 +1,6 @@
1
+ export var ConnectState;
2
+ (function (ConnectState) {
3
+ ConnectState["CONNECTING"] = "connecting";
4
+ ConnectState["CONNECTED"] = "connected";
5
+ ConnectState["DISCONNECTED"] = "disconnected";
6
+ })(ConnectState || (ConnectState = {}));
@@ -0,0 +1 @@
1
+ export * from './connection';
@@ -0,0 +1,6 @@
1
+ export * from './useWalletManager';
2
+ export * from './useActiveWallet';
3
+ export * from './useAccount';
4
+ export * from './useChain';
5
+ export * from './useConnect';
6
+ export * from './useChainWallet';
@@ -0,0 +1,25 @@
1
+ import { useEffect, useState } from "react";
2
+ import { useWalletManager } from './useWalletManager';
3
+ export const useAccount = (chainName, walletName) => {
4
+ const walletManager = useWalletManager();
5
+ const wallet = walletManager.wallets.find(w => w.option.name === walletName);
6
+ const [account, setAccount] = useState(null);
7
+ const chain = walletManager.chains.find(c => c.chainName === chainName);
8
+ const getAccount = async () => {
9
+ const account = await wallet.getAccount(chain.chainId);
10
+ setAccount(account);
11
+ };
12
+ useEffect(() => {
13
+ if (wallet) {
14
+ wallet.events.on('keystoreChange', getAccount);
15
+ }
16
+ }, [wallet]);
17
+ useEffect(() => {
18
+ if (!wallet) {
19
+ setAccount(null);
20
+ return;
21
+ }
22
+ getAccount();
23
+ }, [wallet, chainName, wallet?.walletState]);
24
+ return account;
25
+ };
@@ -0,0 +1,5 @@
1
+ import { useWalletManager } from "./useWalletManager";
2
+ export const useActiveWallet = () => {
3
+ const walletManager = useWalletManager();
4
+ return walletManager.getActiveWallet();
5
+ };
@@ -0,0 +1,30 @@
1
+ import { useWalletManager } from "./useWalletManager";
2
+ import { useAccount } from "./useAccount";
3
+ import { useActiveWallet } from './useActiveWallet';
4
+ import { useEffect, useState } from "react";
5
+ export const useChain = (chainName) => {
6
+ const walletManager = useWalletManager();
7
+ const chainToShow = walletManager.chains.find((c) => c.chainName === chainName);
8
+ const assetList = walletManager.assetLists.find((a) => a.chainName === chainName);
9
+ const activeWallet = useActiveWallet();
10
+ const account = useAccount(chainName, activeWallet.option.name);
11
+ const [clientFactory, setClientFactory] = useState();
12
+ useEffect(() => {
13
+ walletManager.createClientFactory(activeWallet, chainName).then(clientFactory => {
14
+ setClientFactory(clientFactory);
15
+ });
16
+ }, [chainName, activeWallet, account?.address]);
17
+ return {
18
+ chain: chainToShow,
19
+ assetList,
20
+ address: account?.address,
21
+ wallet: activeWallet,
22
+ getRpcEndpoint: () => walletManager.getRpcEndpoint(activeWallet, chainName),
23
+ getClient: () => clientFactory.getClient(),
24
+ getSigningClient: () => clientFactory.getSigningClient(),
25
+ getCosmwasmClient: () => clientFactory.getCosmwasmClient(),
26
+ getSigningCosmwasmClient: () => clientFactory.getSigningCosmwasmClient(),
27
+ getSigningStargateClient: () => clientFactory.getSigningStargateClient(),
28
+ getStargateClient: () => clientFactory.getStargateClient(),
29
+ };
30
+ };
@@ -0,0 +1,36 @@
1
+ import { useWalletManager } from "./useWalletManager";
2
+ import { useAccount } from "./useAccount";
3
+ import { useEffect, useState } from "react";
4
+ import { ChainNotExist, WalletNotExist } from "@interChain-kit/core";
5
+ export const useChainWallet = (chainName, walletName) => {
6
+ const walletManager = useWalletManager();
7
+ const chainToShow = walletManager.chains.find((c) => c.chainName === chainName);
8
+ const assetList = walletManager.assetLists.find((a) => a.chainName === chainName);
9
+ const wallet = walletManager.wallets.find((w) => w.option.name === walletName);
10
+ const account = useAccount(chainName, walletName);
11
+ const [clientFactory, setClientFactory] = useState();
12
+ useEffect(() => {
13
+ if (!wallet) {
14
+ throw new WalletNotExist(walletName);
15
+ }
16
+ if (!chainToShow) {
17
+ throw new ChainNotExist(chainName);
18
+ }
19
+ walletManager.createClientFactory(wallet, chainName).then(clientFactory => {
20
+ setClientFactory(clientFactory);
21
+ });
22
+ }, [chainName, walletName, account?.address]);
23
+ return {
24
+ chain: chainToShow,
25
+ assetList,
26
+ address: account?.address,
27
+ wallet,
28
+ getRpcEndpoint: () => walletManager.getRpcEndpoint(wallet, chainName),
29
+ getClient: () => clientFactory.getClient(),
30
+ getSigningClient: async () => clientFactory.getSigningClient(),
31
+ getCosmwasmClient: () => clientFactory.getCosmwasmClient(),
32
+ getSigningCosmwasmClient: () => clientFactory.getSigningCosmwasmClient(),
33
+ getSigningStargateClient: () => clientFactory.getSigningStargateClient(),
34
+ getStargateClient: () => clientFactory.getStargateClient(),
35
+ };
36
+ };
@@ -0,0 +1,11 @@
1
+ export const useConnect = () => {
2
+ // const { walletManager } = useInterChainWalletContext()
3
+ // const activeWallet = useCurrentWallet()
4
+ // const account = useAccount()
5
+ // return {
6
+ // connect: walletManager.connect,
7
+ // isConnected: activeWallet.walletState === WalletState.Connected,
8
+ // account
9
+ // }
10
+ return {};
11
+ };
@@ -0,0 +1,5 @@
1
+ import { useInterChainWalletContext } from "../provider";
2
+ export const useWalletManager = () => {
3
+ const { walletManager } = useInterChainWalletContext();
4
+ return walletManager;
5
+ };
package/esm/index.js ADDED
@@ -0,0 +1,5 @@
1
+ export * from './provider';
2
+ export * from './hooks';
3
+ export * from './types';
4
+ export * from './enum';
5
+ export * from './modal';
@@ -0,0 +1,2 @@
1
+ export * from './modal';
2
+ export * from './provider';
@@ -0,0 +1,16 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { useWalletManager } from "../hooks";
3
+ const style = {
4
+ position: 'absolute',
5
+ top: '50%',
6
+ left: '50%',
7
+ transform: 'translate(-50%,-50%)',
8
+ width: '500px',
9
+ backgroundColor: 'white',
10
+ };
11
+ export const WalletModal = () => {
12
+ const walletManager = useWalletManager();
13
+ return (_jsx("ul", { style: style, children: walletManager.wallets.map(wallet => {
14
+ return (_jsxs("li", { children: [_jsx("span", { children: wallet.option.prettyName }), _jsx("button", { onClick: () => walletManager.connect(wallet.option.name), children: "connect" })] }));
15
+ }) }));
16
+ };
@@ -0,0 +1,18 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { createContext, useContext, useState } from "react";
3
+ import { createPortal } from "react-dom";
4
+ import { WalletModal } from "./modal";
5
+ const WalletModalContext = createContext(null);
6
+ export const WalletModalProvider = ({ children }) => {
7
+ const [modalIsOpen, setModalIsOpen] = useState(false);
8
+ const open = () => setModalIsOpen(true);
9
+ const close = () => setModalIsOpen(false);
10
+ return (_jsxs(WalletModalContext.Provider, { value: { modalIsOpen, open, close }, children: [children, modalIsOpen && createPortal(_jsx(WalletModal, {}), document.body)] }));
11
+ };
12
+ export const useWalletModal = () => {
13
+ const context = useContext(WalletModalContext);
14
+ if (!context) {
15
+ throw new Error('useWalletModal must be used within a WalletModalProvider');
16
+ }
17
+ return context;
18
+ };
@@ -0,0 +1,23 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { useEffect, useMemo, useState } from 'react';
3
+ import { createContext, useContext } from "react";
4
+ import { WalletManager } from '@interChain-kit/core';
5
+ import { WalletModalProvider } from './modal';
6
+ const InterChainWalletContext = createContext(null);
7
+ export const ChainProvider = ({ chains, assetLists, wallets, signerOptions, endpointOptions, children }) => {
8
+ const [_, forceRender] = useState({});
9
+ const walletManager = useMemo(() => {
10
+ return new WalletManager(chains, assetLists, wallets, signerOptions, endpointOptions, () => forceRender({}));
11
+ }, []);
12
+ useEffect(() => {
13
+ walletManager.init();
14
+ }, []);
15
+ return (_jsx(InterChainWalletContext.Provider, { value: { walletManager }, children: _jsx(WalletModalProvider, { children: children }) }));
16
+ };
17
+ export const useInterChainWalletContext = () => {
18
+ const context = useContext(InterChainWalletContext);
19
+ if (!context) {
20
+ throw new Error('useInterChainWalletContext must be used within a InterChainProvider');
21
+ }
22
+ return context;
23
+ };
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1 @@
1
+ export * from './wallet';
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1 @@
1
+ "use strict";
@@ -0,0 +1,6 @@
1
+ export * from './useWalletManager';
2
+ export * from './useActiveWallet';
3
+ export * from './useAccount';
4
+ export * from './useChain';
5
+ export * from './useConnect';
6
+ export * from './useChainWallet';
package/hooks/index.js ADDED
@@ -0,0 +1,22 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __exportStar = (this && this.__exportStar) || function(m, exports) {
14
+ for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
15
+ };
16
+ Object.defineProperty(exports, "__esModule", { value: true });
17
+ __exportStar(require("./useWalletManager"), exports);
18
+ __exportStar(require("./useActiveWallet"), exports);
19
+ __exportStar(require("./useAccount"), exports);
20
+ __exportStar(require("./useChain"), exports);
21
+ __exportStar(require("./useConnect"), exports);
22
+ __exportStar(require("./useChainWallet"), exports);
@@ -0,0 +1,2 @@
1
+ import { WalletAccount } from "@interChain-kit/core";
2
+ export declare const useAccount: (chainName: string, walletName: string) => WalletAccount | null;
@@ -0,0 +1,29 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.useAccount = void 0;
4
+ const react_1 = require("react");
5
+ const useWalletManager_1 = require("./useWalletManager");
6
+ const useAccount = (chainName, walletName) => {
7
+ const walletManager = (0, useWalletManager_1.useWalletManager)();
8
+ const wallet = walletManager.wallets.find(w => w.option.name === walletName);
9
+ const [account, setAccount] = (0, react_1.useState)(null);
10
+ const chain = walletManager.chains.find(c => c.chainName === chainName);
11
+ const getAccount = async () => {
12
+ const account = await wallet.getAccount(chain.chainId);
13
+ setAccount(account);
14
+ };
15
+ (0, react_1.useEffect)(() => {
16
+ if (wallet) {
17
+ wallet.events.on('keystoreChange', getAccount);
18
+ }
19
+ }, [wallet]);
20
+ (0, react_1.useEffect)(() => {
21
+ if (!wallet) {
22
+ setAccount(null);
23
+ return;
24
+ }
25
+ getAccount();
26
+ }, [wallet, chainName, wallet?.walletState]);
27
+ return account;
28
+ };
29
+ exports.useAccount = useAccount;
@@ -0,0 +1 @@
1
+ export declare const useActiveWallet: () => import("@interChain-kit/core").BaseWallet;
@@ -0,0 +1,9 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.useActiveWallet = void 0;
4
+ const useWalletManager_1 = require("./useWalletManager");
5
+ const useActiveWallet = () => {
6
+ const walletManager = (0, useWalletManager_1.useWalletManager)();
7
+ return walletManager.getActiveWallet();
8
+ };
9
+ exports.useActiveWallet = useActiveWallet;
@@ -0,0 +1,2 @@
1
+ import { UseChainReturnType } from '../types/chain';
2
+ export declare const useChain: (chainName: string) => UseChainReturnType;
@@ -0,0 +1,34 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.useChain = void 0;
4
+ const useWalletManager_1 = require("./useWalletManager");
5
+ const useAccount_1 = require("./useAccount");
6
+ const useActiveWallet_1 = require("./useActiveWallet");
7
+ const react_1 = require("react");
8
+ const useChain = (chainName) => {
9
+ const walletManager = (0, useWalletManager_1.useWalletManager)();
10
+ const chainToShow = walletManager.chains.find((c) => c.chainName === chainName);
11
+ const assetList = walletManager.assetLists.find((a) => a.chainName === chainName);
12
+ const activeWallet = (0, useActiveWallet_1.useActiveWallet)();
13
+ const account = (0, useAccount_1.useAccount)(chainName, activeWallet.option.name);
14
+ const [clientFactory, setClientFactory] = (0, react_1.useState)();
15
+ (0, react_1.useEffect)(() => {
16
+ walletManager.createClientFactory(activeWallet, chainName).then(clientFactory => {
17
+ setClientFactory(clientFactory);
18
+ });
19
+ }, [chainName, activeWallet, account?.address]);
20
+ return {
21
+ chain: chainToShow,
22
+ assetList,
23
+ address: account?.address,
24
+ wallet: activeWallet,
25
+ getRpcEndpoint: () => walletManager.getRpcEndpoint(activeWallet, chainName),
26
+ getClient: () => clientFactory.getClient(),
27
+ getSigningClient: () => clientFactory.getSigningClient(),
28
+ getCosmwasmClient: () => clientFactory.getCosmwasmClient(),
29
+ getSigningCosmwasmClient: () => clientFactory.getSigningCosmwasmClient(),
30
+ getSigningStargateClient: () => clientFactory.getSigningStargateClient(),
31
+ getStargateClient: () => clientFactory.getStargateClient(),
32
+ };
33
+ };
34
+ exports.useChain = useChain;
@@ -0,0 +1,15 @@
1
+ import { AssetList, Chain } from "@chain-registry/v2-types";
2
+ import { BaseWallet } from "@interChain-kit/core";
3
+ export declare const useChainWallet: (chainName: string, walletName: string) => {
4
+ chain: Chain;
5
+ assetList: AssetList;
6
+ address: string;
7
+ wallet: BaseWallet;
8
+ getRpcEndpoint: () => Promise<string | import("@cosmjs/tendermint-rpc").HttpEndpoint>;
9
+ getClient: () => Promise<import("@cosmjs/stargate").StargateClient | import("@cosmjs/cosmwasm-stargate").CosmWasmClient>;
10
+ getSigningClient: () => Promise<import("@cosmjs/stargate").SigningStargateClient | import("@cosmjs/cosmwasm-stargate").SigningCosmWasmClient>;
11
+ getCosmwasmClient: () => Promise<import("@cosmjs/cosmwasm-stargate").CosmWasmClient>;
12
+ getSigningCosmwasmClient: () => Promise<import("@cosmjs/cosmwasm-stargate").SigningCosmWasmClient>;
13
+ getSigningStargateClient: () => Promise<import("@cosmjs/stargate").SigningStargateClient>;
14
+ getStargateClient: () => Promise<import("@cosmjs/stargate").StargateClient>;
15
+ };
@@ -0,0 +1,40 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.useChainWallet = void 0;
4
+ const useWalletManager_1 = require("./useWalletManager");
5
+ const useAccount_1 = require("./useAccount");
6
+ const react_1 = require("react");
7
+ const core_1 = require("@interChain-kit/core");
8
+ const useChainWallet = (chainName, walletName) => {
9
+ const walletManager = (0, useWalletManager_1.useWalletManager)();
10
+ const chainToShow = walletManager.chains.find((c) => c.chainName === chainName);
11
+ const assetList = walletManager.assetLists.find((a) => a.chainName === chainName);
12
+ const wallet = walletManager.wallets.find((w) => w.option.name === walletName);
13
+ const account = (0, useAccount_1.useAccount)(chainName, walletName);
14
+ const [clientFactory, setClientFactory] = (0, react_1.useState)();
15
+ (0, react_1.useEffect)(() => {
16
+ if (!wallet) {
17
+ throw new core_1.WalletNotExist(walletName);
18
+ }
19
+ if (!chainToShow) {
20
+ throw new core_1.ChainNotExist(chainName);
21
+ }
22
+ walletManager.createClientFactory(wallet, chainName).then(clientFactory => {
23
+ setClientFactory(clientFactory);
24
+ });
25
+ }, [chainName, walletName, account?.address]);
26
+ return {
27
+ chain: chainToShow,
28
+ assetList,
29
+ address: account?.address,
30
+ wallet,
31
+ getRpcEndpoint: () => walletManager.getRpcEndpoint(wallet, chainName),
32
+ getClient: () => clientFactory.getClient(),
33
+ getSigningClient: async () => clientFactory.getSigningClient(),
34
+ getCosmwasmClient: () => clientFactory.getCosmwasmClient(),
35
+ getSigningCosmwasmClient: () => clientFactory.getSigningCosmwasmClient(),
36
+ getSigningStargateClient: () => clientFactory.getSigningStargateClient(),
37
+ getStargateClient: () => clientFactory.getStargateClient(),
38
+ };
39
+ };
40
+ exports.useChainWallet = useChainWallet;
@@ -0,0 +1 @@
1
+ export declare const useConnect: () => {};
@@ -0,0 +1,15 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.useConnect = void 0;
4
+ const useConnect = () => {
5
+ // const { walletManager } = useInterChainWalletContext()
6
+ // const activeWallet = useCurrentWallet()
7
+ // const account = useAccount()
8
+ // return {
9
+ // connect: walletManager.connect,
10
+ // isConnected: activeWallet.walletState === WalletState.Connected,
11
+ // account
12
+ // }
13
+ return {};
14
+ };
15
+ exports.useConnect = useConnect;
@@ -0,0 +1,2 @@
1
+ import { WalletManager } from '@interchain-kit/core';
2
+ export declare const useWalletManager: () => WalletManager;
@@ -0,0 +1,9 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.useWalletManager = void 0;
4
+ const provider_1 = require("../provider");
5
+ const useWalletManager = () => {
6
+ const { walletManager } = (0, provider_1.useInterChainWalletContext)();
7
+ return walletManager;
8
+ };
9
+ exports.useWalletManager = useWalletManager;
package/index.d.ts ADDED
@@ -0,0 +1,5 @@
1
+ export * from './provider';
2
+ export * from './hooks';
3
+ export * from './types';
4
+ export * from './enum';
5
+ export * from './modal';
package/index.js ADDED
@@ -0,0 +1,21 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __exportStar = (this && this.__exportStar) || function(m, exports) {
14
+ for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
15
+ };
16
+ Object.defineProperty(exports, "__esModule", { value: true });
17
+ __exportStar(require("./provider"), exports);
18
+ __exportStar(require("./hooks"), exports);
19
+ __exportStar(require("./types"), exports);
20
+ __exportStar(require("./enum"), exports);
21
+ __exportStar(require("./modal"), exports);
@@ -0,0 +1,2 @@
1
+ export * from './modal';
2
+ export * from './provider';
package/modal/index.js ADDED
@@ -0,0 +1,18 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __exportStar = (this && this.__exportStar) || function(m, exports) {
14
+ for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
15
+ };
16
+ Object.defineProperty(exports, "__esModule", { value: true });
17
+ __exportStar(require("./modal"), exports);
18
+ __exportStar(require("./provider"), exports);
@@ -0,0 +1 @@
1
+ export declare const WalletModal: () => import("react/jsx-runtime").JSX.Element;
package/modal/modal.js ADDED
@@ -0,0 +1,20 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.WalletModal = void 0;
4
+ const jsx_runtime_1 = require("react/jsx-runtime");
5
+ const hooks_1 = require("../hooks");
6
+ const style = {
7
+ position: 'absolute',
8
+ top: '50%',
9
+ left: '50%',
10
+ transform: 'translate(-50%,-50%)',
11
+ width: '500px',
12
+ backgroundColor: 'white',
13
+ };
14
+ const WalletModal = () => {
15
+ const walletManager = (0, hooks_1.useWalletManager)();
16
+ return ((0, jsx_runtime_1.jsx)("ul", { style: style, children: walletManager.wallets.map(wallet => {
17
+ return ((0, jsx_runtime_1.jsxs)("li", { children: [(0, jsx_runtime_1.jsx)("span", { children: wallet.option.prettyName }), (0, jsx_runtime_1.jsx)("button", { onClick: () => walletManager.connect(wallet.option.name), children: "connect" })] }));
18
+ }) }));
19
+ };
20
+ exports.WalletModal = WalletModal;
@@ -0,0 +1,10 @@
1
+ type WalletModalContextType = {
2
+ modalIsOpen: boolean;
3
+ open: () => void;
4
+ close: () => void;
5
+ };
6
+ export declare const WalletModalProvider: ({ children }: {
7
+ children: React.ReactNode;
8
+ }) => import("react/jsx-runtime").JSX.Element;
9
+ export declare const useWalletModal: () => WalletModalContextType;
10
+ export {};
@@ -0,0 +1,23 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.useWalletModal = exports.WalletModalProvider = void 0;
4
+ const jsx_runtime_1 = require("react/jsx-runtime");
5
+ const react_1 = require("react");
6
+ const react_dom_1 = require("react-dom");
7
+ const modal_1 = require("./modal");
8
+ const WalletModalContext = (0, react_1.createContext)(null);
9
+ const WalletModalProvider = ({ children }) => {
10
+ const [modalIsOpen, setModalIsOpen] = (0, react_1.useState)(false);
11
+ const open = () => setModalIsOpen(true);
12
+ const close = () => setModalIsOpen(false);
13
+ return ((0, jsx_runtime_1.jsxs)(WalletModalContext.Provider, { value: { modalIsOpen, open, close }, children: [children, modalIsOpen && (0, react_dom_1.createPortal)((0, jsx_runtime_1.jsx)(modal_1.WalletModal, {}), document.body)] }));
14
+ };
15
+ exports.WalletModalProvider = WalletModalProvider;
16
+ const useWalletModal = () => {
17
+ const context = (0, react_1.useContext)(WalletModalContext);
18
+ if (!context) {
19
+ throw new Error('useWalletModal must be used within a WalletModalProvider');
20
+ }
21
+ return context;
22
+ };
23
+ exports.useWalletModal = useWalletModal;
package/package.json ADDED
@@ -0,0 +1,42 @@
1
+ {
2
+ "name": "@interchain-kit/react",
3
+ "version": "0.0.1-beta.1",
4
+ "author": "cosmology-tech <developers@cosmology.zone>",
5
+ "description": "interchain-kit wallet connector react package",
6
+ "main": "index.js",
7
+ "module": "esm/index.js",
8
+ "types": "index.d.ts",
9
+ "homepage": "https://github.com/interchain-kit/react",
10
+ "license": "SEE LICENSE IN LICENSE",
11
+ "publishConfig": {
12
+ "access": "public",
13
+ "directory": "dist"
14
+ },
15
+ "repository": {
16
+ "type": "git",
17
+ "url": "https://github.com/interchain-kit/react"
18
+ },
19
+ "bugs": {
20
+ "url": "https://github.com/interchain-kit/react/issues"
21
+ },
22
+ "scripts": {
23
+ "copy": "copyfiles -f ../../LICENSE README.md package.json dist",
24
+ "clean": "rimraf dist/**",
25
+ "prepare": "npm run build",
26
+ "build": "npm run clean; tsc; tsc -p tsconfig.esm.json; npm run copy",
27
+ "build:dev": "npm run clean; tsc --declarationMap; tsc -p tsconfig.esm.json; npm run copy",
28
+ "lint": "eslint . --fix",
29
+ "test": "jest",
30
+ "test:watch": "jest --watch"
31
+ },
32
+ "keywords": [],
33
+ "dependencies": {
34
+ "@chain-registry/v2-types": "^0.49.6",
35
+ "@interchain-kit/core": "0.0.1-beta.1",
36
+ "@types/react": "^18.3.3",
37
+ "@types/react-dom": "^18.3.0",
38
+ "react": "^18.3.1",
39
+ "react-dom": "^18.3.1"
40
+ },
41
+ "gitHead": "ddbd4f20f3dee91a506ea462608fc4c1a88c5483"
42
+ }
package/provider.d.ts ADDED
@@ -0,0 +1,17 @@
1
+ import React from 'react';
2
+ import { BaseWallet, SignerOptions, WalletManager, EndpointOptions } from '@interChain-kit/core';
3
+ import { AssetList, Chain } from '@chain-registry/v2-types';
4
+ type InterchainWalletContextType = {
5
+ walletManager: WalletManager;
6
+ };
7
+ type InterchianWalletProviderProps = {
8
+ chains: Chain[];
9
+ assetLists: AssetList[];
10
+ wallets: BaseWallet[];
11
+ signerOptions: SignerOptions;
12
+ endpointOptions: EndpointOptions;
13
+ children: React.ReactNode;
14
+ };
15
+ export declare const ChainProvider: ({ chains, assetLists, wallets, signerOptions, endpointOptions, children }: InterchianWalletProviderProps) => import("react/jsx-runtime").JSX.Element;
16
+ export declare const useInterChainWalletContext: () => InterchainWalletContextType;
17
+ export {};
package/provider.js ADDED
@@ -0,0 +1,28 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.useInterChainWalletContext = exports.ChainProvider = void 0;
4
+ const jsx_runtime_1 = require("react/jsx-runtime");
5
+ const react_1 = require("react");
6
+ const react_2 = require("react");
7
+ const core_1 = require("@interChain-kit/core");
8
+ const modal_1 = require("./modal");
9
+ const InterChainWalletContext = (0, react_2.createContext)(null);
10
+ const ChainProvider = ({ chains, assetLists, wallets, signerOptions, endpointOptions, children }) => {
11
+ const [_, forceRender] = (0, react_1.useState)({});
12
+ const walletManager = (0, react_1.useMemo)(() => {
13
+ return new core_1.WalletManager(chains, assetLists, wallets, signerOptions, endpointOptions, () => forceRender({}));
14
+ }, []);
15
+ (0, react_1.useEffect)(() => {
16
+ walletManager.init();
17
+ }, []);
18
+ return ((0, jsx_runtime_1.jsx)(InterChainWalletContext.Provider, { value: { walletManager }, children: (0, jsx_runtime_1.jsx)(modal_1.WalletModalProvider, { children: children }) }));
19
+ };
20
+ exports.ChainProvider = ChainProvider;
21
+ const useInterChainWalletContext = () => {
22
+ const context = (0, react_2.useContext)(InterChainWalletContext);
23
+ if (!context) {
24
+ throw new Error('useInterChainWalletContext must be used within a InterChainProvider');
25
+ }
26
+ return context;
27
+ };
28
+ exports.useInterChainWalletContext = useInterChainWalletContext;
@@ -0,0 +1,3 @@
1
+ export type UseAccountReturnType = {
2
+ address: string;
3
+ };
@@ -0,0 +1,2 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
@@ -0,0 +1,10 @@
1
+ import { HttpEndpoint } from '@cosmjs/stargate';
2
+ import { Chain, AssetList } from '@chain-registry/v2-types';
3
+ import { BaseWallet, CosmJsSigner } from '@interChain-kit/core';
4
+ export type UseChainReturnType = {
5
+ chain: Chain;
6
+ assetList: AssetList;
7
+ address: string;
8
+ wallet: BaseWallet;
9
+ getRpcEndpoint: () => Promise<string | HttpEndpoint>;
10
+ } & Omit<CosmJsSigner, 'rpcEndpoint' | 'offlineSigner' | 'signingCosmwasmOptions' | 'signingStargateOptions' | 'stargateOptions'>;
package/types/chain.js ADDED
@@ -0,0 +1,2 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
@@ -0,0 +1 @@
1
+ export * from './wallet';
package/types/index.js ADDED
@@ -0,0 +1,17 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __exportStar = (this && this.__exportStar) || function(m, exports) {
14
+ for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
15
+ };
16
+ Object.defineProperty(exports, "__esModule", { value: true });
17
+ __exportStar(require("./wallet"), exports);
@@ -0,0 +1,11 @@
1
+ import { BaseWallet } from "@interChain-kit/core";
2
+ import { ConnectState } from "../enum";
3
+ export type UseWalletReturnType = {
4
+ wallet: BaseWallet;
5
+ connect: (chainId: string | string[]) => void;
6
+ connectState: ConnectState;
7
+ };
8
+ export type WalletState = {
9
+ name: string;
10
+ connectState: ConnectState;
11
+ };
@@ -0,0 +1,2 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
File without changes
package/utils/index.js ADDED
@@ -0,0 +1 @@
1
+ "use strict";