@interchain-kit/react 0.3.45 → 0.3.47
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.
- package/esm/hooks/useChain.js +4 -4
- package/esm/hooks/useChainWallet.js +5 -5
- package/esm/hooks/useForceUpdate.js +5 -0
- package/esm/hooks/useSigningClient.js +3 -3
- package/esm/hooks/useWalletManager.js +12 -4
- package/esm/hooks/useWalletModal.js +1 -1
- package/esm/index.js +3 -4
- package/esm/modal/modal.js +2 -2
- package/esm/provider.js +3 -4
- package/esm/utils/bindContext.js +54 -0
- package/hooks/useChain.js +4 -4
- package/hooks/useChainWallet.d.ts +1 -1
- package/hooks/useChainWallet.js +4 -4
- package/hooks/useForceUpdate.d.ts +1 -0
- package/hooks/useForceUpdate.js +9 -0
- package/hooks/useSigningClient.d.ts +1 -1
- package/hooks/useSigningClient.js +2 -2
- package/hooks/useWalletManager.d.ts +1 -1
- package/hooks/useWalletManager.js +11 -3
- package/index.d.ts +3 -4
- package/index.js +3 -4
- package/modal/modal.d.ts +7 -7
- package/modal/modal.js +8 -8
- package/modal/views/Error.d.ts +3 -3
- package/modal/views/NotExist.d.ts +3 -3
- package/modal/views/Reject.d.ts +3 -3
- package/package.json +8 -7
- package/provider.d.ts +4 -6
- package/provider.js +3 -4
- package/types/chain.d.ts +20 -3
- package/utils/bindContext.d.ts +21 -0
- package/utils/bindContext.js +57 -0
- package/esm/store/chain-wallet.js +0 -35
- package/esm/store/index.js +0 -2
- package/esm/store/stateful-wallet.js +0 -182
- package/esm/store/store.js +0 -262
- package/store/chain-wallet.d.ts +0 -17
- package/store/chain-wallet.js +0 -39
- package/store/index.d.ts +0 -2
- package/store/index.js +0 -18
- package/store/stateful-wallet.d.ts +0 -21
- package/store/stateful-wallet.js +0 -186
- package/store/store.d.ts +0 -51
- package/store/store.js +0 -266
package/esm/hooks/useChain.js
CHANGED
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
import { useWalletManager } from './useWalletManager';
|
|
2
1
|
import { ChainNameNotExist, WalletState } from '@interchain-kit/core';
|
|
3
2
|
import { useSigningClient } from './useSigningClient';
|
|
3
|
+
import { useWalletManager } from './useWalletManager';
|
|
4
4
|
import { useWalletModal } from './useWalletModal';
|
|
5
5
|
export const useChain = (chainName) => {
|
|
6
|
-
const {
|
|
6
|
+
const { currentWalletName, disconnect, setCurrentChainName, getChainByName, getChainWalletState, getChainLogoUrl, getSigningClient, getRpcEndpoint, getChainWalletByName, getAssetListByName } = useWalletManager();
|
|
7
7
|
const chain = getChainByName(chainName);
|
|
8
8
|
if (!chain) {
|
|
9
9
|
throw new ChainNameNotExist(chainName);
|
|
10
10
|
}
|
|
11
|
-
const assetList =
|
|
12
|
-
const wallet =
|
|
11
|
+
const assetList = getAssetListByName(chainName);
|
|
12
|
+
const wallet = getChainWalletByName(currentWalletName, chain.chainName);
|
|
13
13
|
const chainWalletStateToShow = getChainWalletState(currentWalletName, chainName);
|
|
14
14
|
const { open, close } = useWalletModal();
|
|
15
15
|
const { signingClient, isLoading: isSigningClientLoading, error: signingClientError } = useSigningClient(chainName, currentWalletName);
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
1
|
+
import { useSigningClient } from './useSigningClient';
|
|
2
|
+
import { useWalletManager } from './useWalletManager';
|
|
3
3
|
export const useChainWallet = (chainName, walletName) => {
|
|
4
|
-
const {
|
|
4
|
+
const { disconnect, setCurrentChainName, setCurrentWalletName, getChainByName, getChainWalletState, getChainLogoUrl, connect, getSigningClient, getRpcEndpoint, getChainWalletByName, getAssetListByName } = useWalletManager();
|
|
5
5
|
const chain = getChainByName(chainName);
|
|
6
|
-
const wallet =
|
|
7
|
-
const assetList =
|
|
6
|
+
const wallet = getChainWalletByName(walletName, chainName);
|
|
7
|
+
const assetList = getAssetListByName(chainName);
|
|
8
8
|
const chainWalletStateToShow = getChainWalletState(walletName, chainName);
|
|
9
9
|
const { signingClient, isLoading: isSigningClientLoading, error: signingClientError } = useSigningClient(chainName, walletName);
|
|
10
10
|
return {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { useAsync } from
|
|
3
|
-
import {
|
|
1
|
+
import { WalletState } from '@interchain-kit/core';
|
|
2
|
+
import { useAsync } from './useAsync';
|
|
3
|
+
import { useWalletManager } from './useWalletManager';
|
|
4
4
|
export const useSigningClient = (chainName, walletName) => {
|
|
5
5
|
const { getSigningClient, getChainWalletState, getRpcEndpoint, isReady } = useWalletManager();
|
|
6
6
|
const chainWalletState = getChainWalletState(walletName, chainName);
|
|
@@ -1,6 +1,14 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
1
|
+
import { useEffect } from 'react';
|
|
2
|
+
import { useInterchainWalletContext } from '../provider';
|
|
3
|
+
import { bindAllMethods } from '../utils/bindContext';
|
|
4
|
+
import { useForceUpdate } from './useForceUpdate';
|
|
3
5
|
export const useWalletManager = () => {
|
|
4
|
-
const
|
|
5
|
-
|
|
6
|
+
const walletManager = useInterchainWalletContext();
|
|
7
|
+
const forceUpdate = useForceUpdate();
|
|
8
|
+
useEffect(() => {
|
|
9
|
+
const unsubscribe = walletManager.subscribe(() => forceUpdate());
|
|
10
|
+
return () => unsubscribe();
|
|
11
|
+
}, []);
|
|
12
|
+
const wmToReturn = bindAllMethods(walletManager);
|
|
13
|
+
return wmToReturn;
|
|
6
14
|
};
|
package/esm/index.js
CHANGED
package/esm/modal/modal.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import { ConnectedContent, ConnectedHeader, ConnectingContent, ConnectingHeader, ErrorContent, ErrorHeader, NotExistContent, NotExistHeader, QRCodeContent, QRCodeHeader, RejectContent, RejectHeader, WalletListContent, WalletListHeader, } from "./views";
|
|
3
|
-
import { useMemo, useState } from "react";
|
|
4
2
|
import { WalletState } from "@interchain-kit/core";
|
|
5
3
|
import { ConnectModal, ThemeProvider, } from "@interchain-ui/react";
|
|
4
|
+
import { useMemo, useState } from "react";
|
|
6
5
|
import { useWalletManager } from "../hooks";
|
|
7
6
|
import { transferToWalletUISchema } from "../utils";
|
|
7
|
+
import { ConnectedContent, ConnectedHeader, ConnectingContent, ConnectingHeader, ErrorContent, ErrorHeader, NotExistContent, NotExistHeader, QRCodeContent, QRCodeHeader, RejectContent, RejectHeader, WalletListContent, WalletListHeader, } from "./views";
|
|
8
8
|
export const InterchainWalletModal = ({
|
|
9
9
|
// ==== Custom modal styles
|
|
10
10
|
modalContainerClassName, modalContentClassName, modalChildrenClassName, modalContentStyles, modalThemeProviderProps, }) => {
|
package/esm/provider.js
CHANGED
|
@@ -1,17 +1,16 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { WalletManagerStore } from "@interchain-kit/store";
|
|
2
3
|
import { useEffect, useRef } from "react";
|
|
3
4
|
import { createContext, useContext } from "react";
|
|
4
|
-
import { WalletManager, } from "@interchain-kit/core";
|
|
5
5
|
import { ModalRenderer } from "./modal";
|
|
6
|
-
import { createInterchainStore } from "./store";
|
|
7
6
|
const InterchainWalletContext = createContext(null);
|
|
8
7
|
export const ChainProvider = ({ chains, assetLists, wallets, signerOptions, endpointOptions, children, walletModal: ProviderWalletModal, }) => {
|
|
9
8
|
const store = useRef(null);
|
|
10
9
|
if (!store.current) {
|
|
11
|
-
store.current =
|
|
10
|
+
store.current = new WalletManagerStore(chains, assetLists, wallets, signerOptions, endpointOptions);
|
|
12
11
|
}
|
|
13
12
|
useEffect(() => {
|
|
14
|
-
store.current.
|
|
13
|
+
store.current.init();
|
|
15
14
|
}, []);
|
|
16
15
|
return (_jsxs(InterchainWalletContext.Provider, { value: store.current, children: [children, ProviderWalletModal && (_jsx(ModalRenderer, { walletModal: ProviderWalletModal }))] }));
|
|
17
16
|
};
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* 绑定上下文工具函数的类型定义
|
|
3
|
+
*/
|
|
4
|
+
/**
|
|
5
|
+
* 绑定对象的所有方法,确保 getter 属性能正确访问原始对象的上下文
|
|
6
|
+
* @param obj 要绑定方法的对象
|
|
7
|
+
* @returns 绑定后的对象副本
|
|
8
|
+
*/
|
|
9
|
+
export function bindAllMethods(obj) {
|
|
10
|
+
if (!obj)
|
|
11
|
+
return obj;
|
|
12
|
+
const boundObj = { ...obj };
|
|
13
|
+
// 处理原型链上的方法和 getter
|
|
14
|
+
Object.getOwnPropertyNames(Object.getPrototypeOf(obj)).forEach((key) => {
|
|
15
|
+
const descriptor = Object.getOwnPropertyDescriptor(Object.getPrototypeOf(obj), key);
|
|
16
|
+
if (descriptor) {
|
|
17
|
+
if (typeof descriptor.value === 'function' && key !== 'constructor') {
|
|
18
|
+
// 原型链上的方法
|
|
19
|
+
boundObj[key] = descriptor.value.bind(obj);
|
|
20
|
+
}
|
|
21
|
+
else if (descriptor.get) {
|
|
22
|
+
// 原型链上的 getter 属性 - 绑定 this 上下文到原始对象
|
|
23
|
+
Object.defineProperty(boundObj, key, {
|
|
24
|
+
get: function () {
|
|
25
|
+
return descriptor.get.call(obj);
|
|
26
|
+
},
|
|
27
|
+
enumerable: descriptor.enumerable,
|
|
28
|
+
configurable: descriptor.configurable
|
|
29
|
+
});
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
});
|
|
33
|
+
// 处理实例上的方法,包括 getter 属性
|
|
34
|
+
Object.getOwnPropertyNames(obj).forEach((key) => {
|
|
35
|
+
const descriptor = Object.getOwnPropertyDescriptor(obj, key);
|
|
36
|
+
if (descriptor) {
|
|
37
|
+
if (typeof descriptor.value === 'function') {
|
|
38
|
+
// 普通方法
|
|
39
|
+
boundObj[key] = descriptor.value.bind(obj);
|
|
40
|
+
}
|
|
41
|
+
else if (descriptor.get) {
|
|
42
|
+
// getter 属性 - 绑定 this 上下文到原始对象
|
|
43
|
+
Object.defineProperty(boundObj, key, {
|
|
44
|
+
get: function () {
|
|
45
|
+
return descriptor.get.call(obj);
|
|
46
|
+
},
|
|
47
|
+
enumerable: descriptor.enumerable,
|
|
48
|
+
configurable: descriptor.configurable
|
|
49
|
+
});
|
|
50
|
+
}
|
|
51
|
+
}
|
|
52
|
+
});
|
|
53
|
+
return boundObj;
|
|
54
|
+
}
|
package/hooks/useChain.js
CHANGED
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.useChain = void 0;
|
|
4
|
-
const useWalletManager_1 = require("./useWalletManager");
|
|
5
4
|
const core_1 = require("@interchain-kit/core");
|
|
6
5
|
const useSigningClient_1 = require("./useSigningClient");
|
|
6
|
+
const useWalletManager_1 = require("./useWalletManager");
|
|
7
7
|
const useWalletModal_1 = require("./useWalletModal");
|
|
8
8
|
const useChain = (chainName) => {
|
|
9
|
-
const {
|
|
9
|
+
const { currentWalletName, disconnect, setCurrentChainName, getChainByName, getChainWalletState, getChainLogoUrl, getSigningClient, getRpcEndpoint, getChainWalletByName, getAssetListByName } = (0, useWalletManager_1.useWalletManager)();
|
|
10
10
|
const chain = getChainByName(chainName);
|
|
11
11
|
if (!chain) {
|
|
12
12
|
throw new core_1.ChainNameNotExist(chainName);
|
|
13
13
|
}
|
|
14
|
-
const assetList =
|
|
15
|
-
const wallet =
|
|
14
|
+
const assetList = getAssetListByName(chainName);
|
|
15
|
+
const wallet = getChainWalletByName(currentWalletName, chain.chainName);
|
|
16
16
|
const chainWalletStateToShow = getChainWalletState(currentWalletName, chainName);
|
|
17
17
|
const { open, close } = (0, useWalletModal_1.useWalletModal)();
|
|
18
18
|
const { signingClient, isLoading: isSigningClientLoading, error: signingClientError } = (0, useSigningClient_1.useSigningClient)(chainName, currentWalletName);
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { UseChainWalletReturnType } from
|
|
1
|
+
import { UseChainWalletReturnType } from '../types/chain';
|
|
2
2
|
export declare const useChainWallet: (chainName: string, walletName: string) => UseChainWalletReturnType;
|
package/hooks/useChainWallet.js
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.useChainWallet = void 0;
|
|
4
|
-
const useWalletManager_1 = require("./useWalletManager");
|
|
5
4
|
const useSigningClient_1 = require("./useSigningClient");
|
|
5
|
+
const useWalletManager_1 = require("./useWalletManager");
|
|
6
6
|
const useChainWallet = (chainName, walletName) => {
|
|
7
|
-
const {
|
|
7
|
+
const { disconnect, setCurrentChainName, setCurrentWalletName, getChainByName, getChainWalletState, getChainLogoUrl, connect, getSigningClient, getRpcEndpoint, getChainWalletByName, getAssetListByName } = (0, useWalletManager_1.useWalletManager)();
|
|
8
8
|
const chain = getChainByName(chainName);
|
|
9
|
-
const wallet =
|
|
10
|
-
const assetList =
|
|
9
|
+
const wallet = getChainWalletByName(walletName, chainName);
|
|
10
|
+
const assetList = getAssetListByName(chainName);
|
|
11
11
|
const chainWalletStateToShow = getChainWalletState(walletName, chainName);
|
|
12
12
|
const { signingClient, isLoading: isSigningClientLoading, error: signingClientError } = (0, useSigningClient_1.useSigningClient)(chainName, walletName);
|
|
13
13
|
return {
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const useForceUpdate: () => () => void;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.useForceUpdate = void 0;
|
|
4
|
+
const react_1 = require("react");
|
|
5
|
+
const useForceUpdate = () => {
|
|
6
|
+
const [, setState] = (0, react_1.useState)(0);
|
|
7
|
+
return () => setState((prev) => prev + 1);
|
|
8
|
+
};
|
|
9
|
+
exports.useForceUpdate = useForceUpdate;
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.useSigningClient = void 0;
|
|
4
|
-
const useWalletManager_1 = require("./useWalletManager");
|
|
5
|
-
const useAsync_1 = require("./useAsync");
|
|
6
4
|
const core_1 = require("@interchain-kit/core");
|
|
5
|
+
const useAsync_1 = require("./useAsync");
|
|
6
|
+
const useWalletManager_1 = require("./useWalletManager");
|
|
7
7
|
const useSigningClient = (chainName, walletName) => {
|
|
8
8
|
const { getSigningClient, getChainWalletState, getRpcEndpoint, isReady } = (0, useWalletManager_1.useWalletManager)();
|
|
9
9
|
const chainWalletState = getChainWalletState(walletName, chainName);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const useWalletManager: () => import("
|
|
1
|
+
export declare const useWalletManager: () => import("../utils/bindContext").BoundObject<import("@interchain-kit/store").WalletManagerStore>;
|
|
@@ -1,10 +1,18 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.useWalletManager = void 0;
|
|
4
|
+
const react_1 = require("react");
|
|
4
5
|
const provider_1 = require("../provider");
|
|
5
|
-
const
|
|
6
|
+
const bindContext_1 = require("../utils/bindContext");
|
|
7
|
+
const useForceUpdate_1 = require("./useForceUpdate");
|
|
6
8
|
const useWalletManager = () => {
|
|
7
|
-
const
|
|
8
|
-
|
|
9
|
+
const walletManager = (0, provider_1.useInterchainWalletContext)();
|
|
10
|
+
const forceUpdate = (0, useForceUpdate_1.useForceUpdate)();
|
|
11
|
+
(0, react_1.useEffect)(() => {
|
|
12
|
+
const unsubscribe = walletManager.subscribe(() => forceUpdate());
|
|
13
|
+
return () => unsubscribe();
|
|
14
|
+
}, []);
|
|
15
|
+
const wmToReturn = (0, bindContext_1.bindAllMethods)(walletManager);
|
|
16
|
+
return wmToReturn;
|
|
9
17
|
};
|
|
10
18
|
exports.useWalletManager = useWalletManager;
|
package/index.d.ts
CHANGED
package/index.js
CHANGED
|
@@ -14,9 +14,8 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
|
14
14
|
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
15
15
|
};
|
|
16
16
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
-
__exportStar(require("./provider"), exports);
|
|
18
|
-
__exportStar(require("./hooks"), exports);
|
|
19
|
-
__exportStar(require("./types"), exports);
|
|
20
17
|
__exportStar(require("./enum"), exports);
|
|
18
|
+
__exportStar(require("./hooks"), exports);
|
|
21
19
|
__exportStar(require("./modal"), exports);
|
|
22
|
-
__exportStar(require("./
|
|
20
|
+
__exportStar(require("./provider"), exports);
|
|
21
|
+
__exportStar(require("./types"), exports);
|
package/modal/modal.d.ts
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
import { ReactElement } from "react";
|
|
2
1
|
import { DownloadInfo } from "@interchain-kit/core";
|
|
3
|
-
import { Wallet as InterchainUIWalletType
|
|
4
|
-
import {
|
|
2
|
+
import { ThemeProviderProps, Wallet as InterchainUIWalletType } from "@interchain-ui/react";
|
|
3
|
+
import { ReactElement } from "react";
|
|
4
|
+
import { WalletStore } from "@interchain-kit/store/wallet-manager/wallet-store";
|
|
5
5
|
export type WalletModalProps = {
|
|
6
6
|
isOpen: boolean;
|
|
7
|
-
wallets:
|
|
8
|
-
currentWallet?:
|
|
7
|
+
wallets: WalletStore[];
|
|
8
|
+
currentWallet?: WalletStore;
|
|
9
9
|
open: () => void;
|
|
10
10
|
close: () => void;
|
|
11
11
|
};
|
|
@@ -24,7 +24,7 @@ export type WalletModalElementProps = {
|
|
|
24
24
|
wallets: InterchainUIWalletType[];
|
|
25
25
|
username: string;
|
|
26
26
|
address: string;
|
|
27
|
-
currentWallet?:
|
|
27
|
+
currentWallet?: WalletStore;
|
|
28
28
|
isConnecting: boolean;
|
|
29
29
|
isConnected: boolean;
|
|
30
30
|
isRejected: boolean;
|
|
@@ -34,7 +34,7 @@ export type WalletModalElementProps = {
|
|
|
34
34
|
open: () => void;
|
|
35
35
|
close: () => void;
|
|
36
36
|
disconnect: () => void;
|
|
37
|
-
onSelectWallet: (wallet:
|
|
37
|
+
onSelectWallet: (wallet: WalletStore) => void;
|
|
38
38
|
onBack: () => void;
|
|
39
39
|
onReconnect: () => void;
|
|
40
40
|
getDownloadLink: (walletName: string) => DownloadInfo;
|
package/modal/modal.js
CHANGED
|
@@ -2,18 +2,18 @@
|
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.ModalRenderer = exports.WalletModalElement = exports.InterchainWalletModal = void 0;
|
|
4
4
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
|
-
const views_1 = require("./views");
|
|
6
|
-
const react_1 = require("react");
|
|
7
5
|
const core_1 = require("@interchain-kit/core");
|
|
8
|
-
const
|
|
6
|
+
const react_1 = require("@interchain-ui/react");
|
|
7
|
+
const react_2 = require("react");
|
|
9
8
|
const hooks_1 = require("../hooks");
|
|
10
9
|
const utils_1 = require("../utils");
|
|
10
|
+
const views_1 = require("./views");
|
|
11
11
|
const InterchainWalletModal = ({
|
|
12
12
|
// ==== Custom modal styles
|
|
13
13
|
modalContainerClassName, modalContentClassName, modalChildrenClassName, modalContentStyles, modalThemeProviderProps, }) => {
|
|
14
|
-
const [shouldShowList, setShouldShowList] = (0,
|
|
14
|
+
const [shouldShowList, setShouldShowList] = (0, react_2.useState)(false);
|
|
15
15
|
const { modalIsOpen: isOpen, walletConnectQRCodeUri, wallets: statefulWallets, getChainWalletState, currentWalletName, currentChainName, openModal: open, closeModal: close, chains, setCurrentWalletName, getDownloadLink, getEnv, } = (0, hooks_1.useWalletManager)();
|
|
16
|
-
const [walletToConnect, setWalletToConnect] = (0,
|
|
16
|
+
const [walletToConnect, setWalletToConnect] = (0, react_2.useState)(null);
|
|
17
17
|
const walletsForUI = statefulWallets.map((w) => (0, utils_1.transferToWalletUISchema)(w));
|
|
18
18
|
const chainNameToConnect = currentChainName || chains[0].chainName;
|
|
19
19
|
const chainToConnect = chains.find((chain) => chain.chainName === chainNameToConnect);
|
|
@@ -36,11 +36,11 @@ modalContainerClassName, modalContentClassName, modalChildrenClassName, modalCon
|
|
|
36
36
|
const onReconnect = () => {
|
|
37
37
|
currentWallet.connect(chainToConnect.chainId);
|
|
38
38
|
};
|
|
39
|
-
return ((0, jsx_runtime_1.jsx)(
|
|
39
|
+
return ((0, jsx_runtime_1.jsx)(react_1.ThemeProvider, { ...modalThemeProviderProps, children: (0, jsx_runtime_1.jsx)(exports.WalletModalElement, { shouldShowList: shouldShowList, username: account?.username, address: account?.address, disconnect: disconnect, isOpen: isOpen, open: open, close: handleCloseModal, wallets: walletsForUI, walletConnectQRCodeUri: walletConnectQRCodeUri, currentWallet: walletToShow, isConnecting: walletToShow?.walletState === core_1.WalletState.Connecting, isConnected: walletToShow?.walletState === core_1.WalletState.Connected, isRejected: walletToShow?.walletState === core_1.WalletState.Rejected, isDisconnected: walletToShow?.walletState === core_1.WalletState.Disconnected, isNotExist: walletToShow?.walletState === core_1.WalletState.NotExist, errorMessage: errorMessage, onSelectWallet: (w) => onSelectWallet(w), onBack: () => setShouldShowList(true), onReconnect: () => onSelectWallet(walletToShow), getDownloadLink: () => getDownloadLink(walletToShow?.info.name), getEnv: getEnv, modalContainerClassName: modalContainerClassName, modalContentClassName: modalContentClassName, modalChildrenClassName: modalChildrenClassName, modalContentStyles: modalContentStyles, modalThemeProviderProps: modalThemeProviderProps }) }));
|
|
40
40
|
};
|
|
41
41
|
exports.InterchainWalletModal = InterchainWalletModal;
|
|
42
42
|
const WalletModalElement = ({ shouldShowList, isOpen, walletConnectQRCodeUri, wallets, username, address, currentWallet, isConnecting, isConnected, isRejected, isDisconnected, isNotExist, errorMessage, open, close, disconnect, onSelectWallet, onBack, onReconnect, getDownloadLink, getEnv, modalThemeProviderProps, modalContainerClassName, modalContentClassName, modalChildrenClassName, modalContentStyles, }) => {
|
|
43
|
-
const { header, content } = (0,
|
|
43
|
+
const { header, content } = (0, react_2.useMemo)(() => {
|
|
44
44
|
if (shouldShowList ||
|
|
45
45
|
(isDisconnected && currentWallet.errorMessage === "")) {
|
|
46
46
|
return {
|
|
@@ -100,7 +100,7 @@ const WalletModalElement = ({ shouldShowList, isOpen, walletConnectQRCodeUri, wa
|
|
|
100
100
|
wallets,
|
|
101
101
|
isOpen,
|
|
102
102
|
]);
|
|
103
|
-
return ((0, jsx_runtime_1.jsx)(
|
|
103
|
+
return ((0, jsx_runtime_1.jsx)(react_1.ConnectModal, { isOpen: isOpen, header: header, onOpen: open, onClose: close, modalContainerClassName: modalContainerClassName, modalContentClassName: modalContentClassName, modalChildrenClassName: modalChildrenClassName, modalContentStyles: modalContentStyles, children: content }));
|
|
104
104
|
};
|
|
105
105
|
exports.WalletModalElement = WalletModalElement;
|
|
106
106
|
const ModalRenderer = ({ walletModal: ProvidedWalletModal, }) => {
|
package/modal/views/Error.d.ts
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { WalletStore } from "@interchain-kit/store";
|
|
2
2
|
export declare const ErrorHeader: ({ wallet, close, onBack, }: {
|
|
3
|
-
wallet:
|
|
3
|
+
wallet: WalletStore;
|
|
4
4
|
close: () => void;
|
|
5
5
|
onBack: () => void;
|
|
6
6
|
}) => import("react/jsx-runtime").JSX.Element;
|
|
7
7
|
export declare const ErrorContent: ({ wallet, onBack, }: {
|
|
8
|
-
wallet:
|
|
8
|
+
wallet: WalletStore;
|
|
9
9
|
onBack: () => void;
|
|
10
10
|
}) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { DownloadInfo } from "@interchain-kit/core";
|
|
2
|
-
import {
|
|
2
|
+
import { WalletStore } from "@interchain-kit/store";
|
|
3
3
|
export declare const NotExistHeader: ({ wallet, close, onBack, }: {
|
|
4
|
-
wallet:
|
|
4
|
+
wallet: WalletStore;
|
|
5
5
|
close: () => void;
|
|
6
6
|
onBack: () => void;
|
|
7
7
|
}) => import("react/jsx-runtime").JSX.Element;
|
|
8
8
|
export declare const NotExistContent: ({ wallet, getDownloadLink, getEnv, }: {
|
|
9
|
-
wallet:
|
|
9
|
+
wallet: WalletStore;
|
|
10
10
|
getDownloadLink: (walletName: string) => DownloadInfo;
|
|
11
11
|
getEnv: () => {
|
|
12
12
|
browser?: string;
|
package/modal/views/Reject.d.ts
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { WalletStore } from "@interchain-kit/store";
|
|
2
2
|
export declare const RejectHeader: ({ wallet, close, onBack, }: {
|
|
3
|
-
wallet:
|
|
3
|
+
wallet: WalletStore;
|
|
4
4
|
close: () => void;
|
|
5
5
|
onBack: () => void;
|
|
6
6
|
}) => import("react/jsx-runtime").JSX.Element;
|
|
7
7
|
export declare const RejectContent: ({ wallet, onReconnect, }: {
|
|
8
|
-
wallet:
|
|
8
|
+
wallet: WalletStore;
|
|
9
9
|
onReconnect: () => void;
|
|
10
10
|
}) => import("react/jsx-runtime").JSX.Element;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@interchain-kit/react",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.47",
|
|
4
4
|
"author": "Hyperweb <developers@hyperweb.io>",
|
|
5
5
|
"description": "interchain-kit wallet connector react package",
|
|
6
6
|
"main": "index.js",
|
|
@@ -35,14 +35,15 @@
|
|
|
35
35
|
"keywords": [],
|
|
36
36
|
"dependencies": {
|
|
37
37
|
"@chain-registry/types": "^2.0.1",
|
|
38
|
-
"@interchain-kit/core": "0.3.
|
|
38
|
+
"@interchain-kit/core": "0.3.47",
|
|
39
|
+
"@interchain-kit/store": "0.3.47",
|
|
39
40
|
"@interchain-ui/react": "^1.26.3",
|
|
40
|
-
"@interchainjs/cosmos": "1.
|
|
41
|
-
"@interchainjs/cosmos-types": "1.
|
|
42
|
-
"@interchainjs/types": "1.
|
|
41
|
+
"@interchainjs/cosmos": "1.17.3",
|
|
42
|
+
"@interchainjs/cosmos-types": "1.17.3",
|
|
43
|
+
"@interchainjs/types": "1.17.3",
|
|
43
44
|
"@react-icons/all-files": "^4.1.0",
|
|
44
45
|
"@walletconnect/types": "^2.17.3",
|
|
45
|
-
"interchainjs": "1.
|
|
46
|
+
"interchainjs": "1.17.3",
|
|
46
47
|
"jest-transform-stub": "^2.0.0",
|
|
47
48
|
"postcss": "^8.5.6",
|
|
48
49
|
"postcss-cli": "^11.0.1",
|
|
@@ -69,5 +70,5 @@
|
|
|
69
70
|
"react": "^19.0.0",
|
|
70
71
|
"react-dom": "^19.0.0"
|
|
71
72
|
},
|
|
72
|
-
"gitHead": "
|
|
73
|
+
"gitHead": "4583b572672abd85a0918f39f534a5bf9312c261"
|
|
73
74
|
}
|
package/provider.d.ts
CHANGED
|
@@ -1,10 +1,8 @@
|
|
|
1
|
-
import React, { ReactElement } from "react";
|
|
2
|
-
import { BaseWallet, SignerOptions, EndpointOptions } from "@interchain-kit/core";
|
|
3
1
|
import { AssetList, Chain } from "@chain-registry/types";
|
|
2
|
+
import { BaseWallet, EndpointOptions, SignerOptions } from "@interchain-kit/core";
|
|
3
|
+
import { WalletManagerStore } from "@interchain-kit/store";
|
|
4
|
+
import React, { ReactElement } from "react";
|
|
4
5
|
import { WalletModalProps } from "./modal";
|
|
5
|
-
import { InterchainStore } from "./store";
|
|
6
|
-
import { StoreApi } from "zustand";
|
|
7
|
-
type InterchainWalletContextType = StoreApi<InterchainStore>;
|
|
8
6
|
type InterchainWalletProviderProps = {
|
|
9
7
|
chains: Chain[];
|
|
10
8
|
assetLists: AssetList[];
|
|
@@ -15,5 +13,5 @@ type InterchainWalletProviderProps = {
|
|
|
15
13
|
walletModal?: (props: WalletModalProps) => ReactElement;
|
|
16
14
|
};
|
|
17
15
|
export declare const ChainProvider: ({ chains, assetLists, wallets, signerOptions, endpointOptions, children, walletModal: ProviderWalletModal, }: InterchainWalletProviderProps) => import("react/jsx-runtime").JSX.Element;
|
|
18
|
-
export declare const useInterchainWalletContext: () =>
|
|
16
|
+
export declare const useInterchainWalletContext: () => WalletManagerStore;
|
|
19
17
|
export {};
|
package/provider.js
CHANGED
|
@@ -2,19 +2,18 @@
|
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.useInterchainWalletContext = exports.ChainProvider = void 0;
|
|
4
4
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
|
+
const store_1 = require("@interchain-kit/store");
|
|
5
6
|
const react_1 = require("react");
|
|
6
7
|
const react_2 = require("react");
|
|
7
|
-
const core_1 = require("@interchain-kit/core");
|
|
8
8
|
const modal_1 = require("./modal");
|
|
9
|
-
const store_1 = require("./store");
|
|
10
9
|
const InterchainWalletContext = (0, react_2.createContext)(null);
|
|
11
10
|
const ChainProvider = ({ chains, assetLists, wallets, signerOptions, endpointOptions, children, walletModal: ProviderWalletModal, }) => {
|
|
12
11
|
const store = (0, react_1.useRef)(null);
|
|
13
12
|
if (!store.current) {
|
|
14
|
-
store.current =
|
|
13
|
+
store.current = new store_1.WalletManagerStore(chains, assetLists, wallets, signerOptions, endpointOptions);
|
|
15
14
|
}
|
|
16
15
|
(0, react_1.useEffect)(() => {
|
|
17
|
-
store.current.
|
|
16
|
+
store.current.init();
|
|
18
17
|
}, []);
|
|
19
18
|
return ((0, jsx_runtime_1.jsxs)(InterchainWalletContext.Provider, { value: store.current, children: [children, ProviderWalletModal && ((0, jsx_runtime_1.jsx)(modal_1.ModalRenderer, { walletModal: ProviderWalletModal }))] }));
|
|
20
19
|
};
|
package/types/chain.d.ts
CHANGED
|
@@ -2,7 +2,7 @@ import { HttpEndpoint } from '@interchainjs/types';
|
|
|
2
2
|
import { Chain, AssetList } from '@chain-registry/types';
|
|
3
3
|
import { WalletState } from '@interchain-kit/core';
|
|
4
4
|
import { SigningClient } from './sign-client';
|
|
5
|
-
import {
|
|
5
|
+
import { ChainWalletStore } from '@interchain-kit/store';
|
|
6
6
|
export type CosmosKitUseChainReturnType = {
|
|
7
7
|
connect: () => void;
|
|
8
8
|
disconnect: () => void;
|
|
@@ -18,14 +18,31 @@ export type UseChainReturnType = {
|
|
|
18
18
|
chain: Chain;
|
|
19
19
|
assetList: AssetList;
|
|
20
20
|
address: string;
|
|
21
|
-
wallet:
|
|
21
|
+
wallet: ChainWalletStore;
|
|
22
22
|
rpcEndpoint: string | HttpEndpoint | unknown;
|
|
23
23
|
getSigningClient: () => Promise<SigningClient>;
|
|
24
24
|
signingClient: SigningClient | null;
|
|
25
25
|
isSigningClientLoading: boolean;
|
|
26
26
|
signingClientError: Error | unknown | null;
|
|
27
27
|
} & CosmosKitUseChainReturnType;
|
|
28
|
-
export type UseChainWalletReturnType =
|
|
28
|
+
export type UseChainWalletReturnType = {
|
|
29
|
+
logoUrl: string | undefined;
|
|
30
|
+
chain: Chain;
|
|
31
|
+
assetList: AssetList;
|
|
32
|
+
address: string;
|
|
33
|
+
wallet: ChainWalletStore;
|
|
34
|
+
rpcEndpoint: string | HttpEndpoint | unknown;
|
|
35
|
+
getSigningClient: () => Promise<SigningClient>;
|
|
36
|
+
signingClient: SigningClient | null;
|
|
37
|
+
isSigningClientLoading: boolean;
|
|
38
|
+
signingClientError: Error | unknown | null;
|
|
39
|
+
connect: () => Promise<void>;
|
|
40
|
+
disconnect: () => Promise<void>;
|
|
41
|
+
getRpcEndpoint: () => Promise<string | HttpEndpoint>;
|
|
42
|
+
status: WalletState;
|
|
43
|
+
username: string;
|
|
44
|
+
message: string;
|
|
45
|
+
};
|
|
29
46
|
export type UseInterchainClientReturnType = {
|
|
30
47
|
signingClient: SigningClient | null;
|
|
31
48
|
error: string | unknown | null;
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* 绑定上下文工具函数的类型定义
|
|
3
|
+
*/
|
|
4
|
+
/**
|
|
5
|
+
* 可绑定方法的对象类型
|
|
6
|
+
*/
|
|
7
|
+
export interface BindableObject {
|
|
8
|
+
[key: string]: any;
|
|
9
|
+
}
|
|
10
|
+
/**
|
|
11
|
+
* 绑定后的对象类型,保持原始对象的类型结构
|
|
12
|
+
*/
|
|
13
|
+
export type BoundObject<T> = {
|
|
14
|
+
[K in keyof T]: T[K] extends (...args: infer A) => infer R ? (...args: A) => R : T[K];
|
|
15
|
+
};
|
|
16
|
+
/**
|
|
17
|
+
* 绑定对象的所有方法,确保 getter 属性能正确访问原始对象的上下文
|
|
18
|
+
* @param obj 要绑定方法的对象
|
|
19
|
+
* @returns 绑定后的对象副本
|
|
20
|
+
*/
|
|
21
|
+
export declare function bindAllMethods<T extends BindableObject>(obj: T): BoundObject<T>;
|