@xyo-network/react-wallet 2.60.10 → 2.60.12
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/dist/cjs/components/WalletAccountSelect/Select.js +7 -7
- package/dist/cjs/components/WalletAccountSelect/Select.js.map +1 -1
- package/dist/docs.json +147 -147
- package/dist/esm/components/WalletAccountSelect/Select.js +8 -8
- package/dist/esm/components/WalletAccountSelect/Select.js.map +1 -1
- package/dist/types/components/WalletAccountSelect/Select.d.ts +2 -2
- package/dist/types/components/WalletAccountSelect/Select.d.ts.map +1 -1
- package/package.json +12 -12
- package/src/components/WalletAccountSelect/Select.tsx +25 -18
|
@@ -3,27 +3,27 @@ import { CircularProgress, MenuItem } from '@mui/material';
|
|
|
3
3
|
import { SelectEx } from '@xylabs/react-select';
|
|
4
4
|
import { AddressRenderRowBox } from '@xyo-network/react-address-render';
|
|
5
5
|
import { useWalletContext } from '../../contexts';
|
|
6
|
-
import {
|
|
6
|
+
import { useWallet } from '../../hooks';
|
|
7
7
|
const arrayRange = (length, start = 0) => {
|
|
8
8
|
return Array.from(Array(length).keys()).map((x) => x + start);
|
|
9
9
|
};
|
|
10
10
|
export const WalletAccountSelect = ({ addressNames = {}, iconOnly, iconSize = 24, icons, maxAccounts = 1, showFavorite = false, size, ...props }) => {
|
|
11
11
|
const { activeAccountIndex = 0, setActiveAccountIndex, coinTypeWallet } = useWalletContext();
|
|
12
12
|
const disabled = !coinTypeWallet || activeAccountIndex === undefined;
|
|
13
|
-
return (_jsx(_Fragment, { children: coinTypeWallet ? (_jsx(SelectEx, { disabled: disabled, renderValue: (
|
|
13
|
+
return (_jsx(_Fragment, { children: coinTypeWallet ? (_jsx(SelectEx, { margin: "dense", disabled: disabled, renderValue: (selectedAccountIndex) => {
|
|
14
14
|
const Item = () => {
|
|
15
|
-
const [
|
|
16
|
-
const customName =
|
|
17
|
-
const favorite = !!
|
|
18
|
-
return (_jsx(AddressRenderRowBox, { address:
|
|
15
|
+
const [selectedAccount] = useWallet({ path: selectedAccountIndex.toString(), wallet: coinTypeWallet });
|
|
16
|
+
const customName = selectedAccount ? addressNames[selectedAccount.address] : undefined;
|
|
17
|
+
const favorite = !!selectedAccount && selectedAccount.address in addressNames;
|
|
18
|
+
return (_jsx(MenuItem, { value: selectedAccountIndex, sx: { minHeight: 0, paddingBottom: 0, paddingTop: 0 }, children: _jsx(AddressRenderRowBox, { disableSharedRef: true, flexGrow: 1, address: selectedAccount?.address, iconOnly: iconOnly, iconSize: iconSize, icons: icons, name: customName, favorite: favorite, showFavorite: showFavorite }) }));
|
|
19
19
|
};
|
|
20
20
|
return _jsx(Item, {});
|
|
21
21
|
}, value: activeAccountIndex, onChange: (event) => setActiveAccountIndex?.(parseInt(`${event.target.value}`)), size: size, variant: "outlined", ...props, children: arrayRange(maxAccounts).map((index) => {
|
|
22
22
|
const Item = () => {
|
|
23
|
-
const [account] =
|
|
23
|
+
const [account] = useWallet({ path: index.toString(), wallet: coinTypeWallet });
|
|
24
24
|
const customName = account ? addressNames[account.address] : undefined;
|
|
25
25
|
const favorite = !!account && account.address in addressNames;
|
|
26
|
-
return (_jsx(MenuItem, { value: index, children: _jsx(AddressRenderRowBox, { address: account?.address, favorite: favorite, iconOnly: iconOnly, iconSize: iconSize, icons: icons, name: customName, showFavorite: showFavorite }) }, account?.address));
|
|
26
|
+
return (_jsx(MenuItem, { value: index, sx: { minHeight: 0, paddingBottom: 0, paddingTop: 0 }, children: _jsx(AddressRenderRowBox, { disableSharedRef: true, flexGrow: 1, address: account?.address, favorite: favorite, iconOnly: iconOnly, iconSize: iconSize, icons: icons, name: customName, showFavorite: showFavorite }) }, account?.address));
|
|
27
27
|
};
|
|
28
28
|
return _jsx(Item, {}, index);
|
|
29
29
|
}) })) : (_jsx(CircularProgress, { size: 24 })) }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.js","sourceRoot":"","sources":["../../../../src/components/WalletAccountSelect/Select.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,gBAAgB,EAAE,QAAQ,EAAe,MAAM,eAAe,CAAA;AACvE,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAA;AAC/C,OAAO,EAAE,mBAAmB,
|
|
1
|
+
{"version":3,"file":"Select.js","sourceRoot":"","sources":["../../../../src/components/WalletAccountSelect/Select.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { SelectProps } from '@mui/material';
|
|
3
|
-
import {
|
|
4
|
-
type SharedAddressRenderRowBoxProps = Pick<
|
|
3
|
+
import { AddressRenderRowBoxProps } from '@xyo-network/react-address-render';
|
|
4
|
+
type SharedAddressRenderRowBoxProps = Pick<AddressRenderRowBoxProps, 'iconOnly' | 'iconSize' | 'icons' | 'showFavorite'>;
|
|
5
5
|
export interface WalletAccountSelectProps extends SharedAddressRenderRowBoxProps, SelectProps<number> {
|
|
6
6
|
addressNames?: Record<string, string | undefined>;
|
|
7
7
|
maxAccounts?: number;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../src/components/WalletAccountSelect/Select.tsx"],"names":[],"mappings":";AAAA,OAAO,EAA8B,WAAW,EAAE,MAAM,eAAe,CAAA;AAEvE,OAAO,EAAuB,
|
|
1
|
+
{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../src/components/WalletAccountSelect/Select.tsx"],"names":[],"mappings":";AAAA,OAAO,EAA8B,WAAW,EAAE,MAAM,eAAe,CAAA;AAEvE,OAAO,EAAuB,wBAAwB,EAAE,MAAM,mCAAmC,CAAA;AAKjG,KAAK,8BAA8B,GAAG,IAAI,CAAC,wBAAwB,EAAE,UAAU,GAAG,UAAU,GAAG,OAAO,GAAG,cAAc,CAAC,CAAA;AAExH,MAAM,WAAW,wBAAyB,SAAQ,8BAA8B,EAAE,WAAW,CAAC,MAAM,CAAC;IACnG,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,SAAS,CAAC,CAAA;IACjD,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB;AAMD,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,wBAAwB,CA8ElE,CAAA"}
|
package/package.json
CHANGED
|
@@ -20,14 +20,14 @@
|
|
|
20
20
|
"@xylabs/react-quick-tip-button": "~2.17.15",
|
|
21
21
|
"@xylabs/react-select": "~2.17.15",
|
|
22
22
|
"@xylabs/react-shared": "~2.17.15",
|
|
23
|
-
"@xyo-network/account": "^2.72.
|
|
24
|
-
"@xyo-network/account-model": "^2.72.
|
|
25
|
-
"@xyo-network/bip39": "^2.72.
|
|
26
|
-
"@xyo-network/core": "^2.72.
|
|
27
|
-
"@xyo-network/react-address-render": "~2.60.
|
|
28
|
-
"@xyo-network/react-network": "~2.60.
|
|
29
|
-
"@xyo-network/react-shared": "~2.60.
|
|
30
|
-
"@xyo-network/wallet-model": "^2.72.
|
|
23
|
+
"@xyo-network/account": "^2.72.9",
|
|
24
|
+
"@xyo-network/account-model": "^2.72.9",
|
|
25
|
+
"@xyo-network/bip39": "^2.72.9",
|
|
26
|
+
"@xyo-network/core": "^2.72.9",
|
|
27
|
+
"@xyo-network/react-address-render": "~2.60.12",
|
|
28
|
+
"@xyo-network/react-network": "~2.60.12",
|
|
29
|
+
"@xyo-network/react-shared": "~2.60.12",
|
|
30
|
+
"@xyo-network/wallet-model": "^2.72.9",
|
|
31
31
|
"async-mutex": "^0.4.0"
|
|
32
32
|
},
|
|
33
33
|
"peerDependencies": {
|
|
@@ -42,9 +42,9 @@
|
|
|
42
42
|
"description": "Common React library for all XYO projects that use React",
|
|
43
43
|
"devDependencies": {
|
|
44
44
|
"@storybook/react": "^7.4.0",
|
|
45
|
-
"@xylabs/ts-scripts-yarn3": "^2.19.
|
|
46
|
-
"@xylabs/tsconfig-react": "^2.19.
|
|
47
|
-
"@xyo-network/react-storybook": "~2.60.
|
|
45
|
+
"@xylabs/ts-scripts-yarn3": "^2.19.4",
|
|
46
|
+
"@xylabs/tsconfig-react": "^2.19.4",
|
|
47
|
+
"@xyo-network/react-storybook": "~2.60.12",
|
|
48
48
|
"typescript": "^5.2.2"
|
|
49
49
|
},
|
|
50
50
|
"browser": "dist/esm/index.js",
|
|
@@ -89,5 +89,5 @@
|
|
|
89
89
|
},
|
|
90
90
|
"sideEffects": false,
|
|
91
91
|
"types": "dist/types/index.d.ts",
|
|
92
|
-
"version": "2.60.
|
|
92
|
+
"version": "2.60.12"
|
|
93
93
|
}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { CircularProgress, MenuItem, SelectProps } from '@mui/material'
|
|
2
2
|
import { SelectEx } from '@xylabs/react-select'
|
|
3
|
-
import { AddressRenderRowBox,
|
|
3
|
+
import { AddressRenderRowBox, AddressRenderRowBoxProps } from '@xyo-network/react-address-render'
|
|
4
4
|
|
|
5
5
|
import { useWalletContext } from '../../contexts'
|
|
6
|
-
import {
|
|
6
|
+
import { useWallet } from '../../hooks'
|
|
7
7
|
|
|
8
|
-
type SharedAddressRenderRowBoxProps = Pick<
|
|
8
|
+
type SharedAddressRenderRowBoxProps = Pick<AddressRenderRowBoxProps, 'iconOnly' | 'iconSize' | 'icons' | 'showFavorite'>
|
|
9
9
|
|
|
10
10
|
export interface WalletAccountSelectProps extends SharedAddressRenderRowBoxProps, SelectProps<number> {
|
|
11
11
|
addressNames?: Record<string, string | undefined>
|
|
@@ -33,22 +33,27 @@ export const WalletAccountSelect: React.FC<WalletAccountSelectProps> = ({
|
|
|
33
33
|
<>
|
|
34
34
|
{coinTypeWallet ? (
|
|
35
35
|
<SelectEx
|
|
36
|
+
margin="dense"
|
|
36
37
|
disabled={disabled}
|
|
37
|
-
renderValue={(
|
|
38
|
+
renderValue={(selectedAccountIndex) => {
|
|
38
39
|
const Item: React.FC = () => {
|
|
39
|
-
const [
|
|
40
|
-
const customName =
|
|
41
|
-
const favorite = !!
|
|
40
|
+
const [selectedAccount] = useWallet({ path: selectedAccountIndex.toString(), wallet: coinTypeWallet })
|
|
41
|
+
const customName = selectedAccount ? addressNames[selectedAccount.address] : undefined
|
|
42
|
+
const favorite = !!selectedAccount && selectedAccount.address in addressNames
|
|
42
43
|
return (
|
|
43
|
-
<
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
44
|
+
<MenuItem value={selectedAccountIndex} sx={{ minHeight: 0, paddingBottom: 0, paddingTop: 0 }}>
|
|
45
|
+
<AddressRenderRowBox
|
|
46
|
+
disableSharedRef={true}
|
|
47
|
+
flexGrow={1}
|
|
48
|
+
address={selectedAccount?.address}
|
|
49
|
+
iconOnly={iconOnly}
|
|
50
|
+
iconSize={iconSize}
|
|
51
|
+
icons={icons}
|
|
52
|
+
name={customName}
|
|
53
|
+
favorite={favorite}
|
|
54
|
+
showFavorite={showFavorite}
|
|
55
|
+
/>
|
|
56
|
+
</MenuItem>
|
|
52
57
|
)
|
|
53
58
|
}
|
|
54
59
|
return <Item />
|
|
@@ -61,12 +66,14 @@ export const WalletAccountSelect: React.FC<WalletAccountSelectProps> = ({
|
|
|
61
66
|
>
|
|
62
67
|
{arrayRange(maxAccounts).map((index) => {
|
|
63
68
|
const Item: React.FC = () => {
|
|
64
|
-
const [account] =
|
|
69
|
+
const [account] = useWallet({ path: index.toString(), wallet: coinTypeWallet })
|
|
65
70
|
const customName = account ? addressNames[account.address] : undefined
|
|
66
71
|
const favorite = !!account && account.address in addressNames
|
|
67
72
|
return (
|
|
68
|
-
<MenuItem key={account?.address} value={index}>
|
|
73
|
+
<MenuItem key={account?.address} value={index} sx={{ minHeight: 0, paddingBottom: 0, paddingTop: 0 }}>
|
|
69
74
|
<AddressRenderRowBox
|
|
75
|
+
disableSharedRef={true}
|
|
76
|
+
flexGrow={1}
|
|
70
77
|
address={account?.address}
|
|
71
78
|
favorite={favorite}
|
|
72
79
|
iconOnly={iconOnly}
|