@mysten/dapp-kit-react 2.0.1 → 2.0.3
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/index.d.mts +9 -9
- package/dist/index.d.mts.map +1 -1
- package/dist/ui.d.mts.map +1 -1
- package/docs/actions/connect-wallet.md +6 -5
- package/docs/actions/disconnect-wallet.md +12 -10
- package/docs/actions/sign-and-execute-transaction.md +16 -15
- package/docs/actions/sign-personal-message.md +10 -9
- package/docs/actions/sign-transaction.md +9 -8
- package/docs/actions/switch-account.md +8 -7
- package/docs/actions/switch-network.md +7 -6
- package/docs/dapp-kit-instance.md +22 -22
- package/docs/getting-started/create-dapp.md +13 -13
- package/docs/getting-started/next-js.md +14 -13
- package/docs/getting-started/react.md +29 -27
- package/docs/getting-started/vue.md +20 -15
- package/docs/index.md +10 -10
- package/docs/llms-index.md +30 -31
- package/docs/react/components/connect-button.md +4 -4
- package/docs/react/components/connect-modal.md +4 -4
- package/docs/react/components/index.md +3 -3
- package/docs/react/dapp-kit-provider.md +7 -7
- package/docs/react/hooks/index.md +5 -4
- package/docs/react/hooks/use-current-account.md +4 -4
- package/docs/react/hooks/use-current-client.md +7 -7
- package/docs/react/hooks/use-current-network.md +4 -4
- package/docs/react/hooks/use-current-wallet.md +4 -4
- package/docs/react/hooks/use-dapp-kit.md +6 -6
- package/docs/react/hooks/use-wallet-connection.md +4 -4
- package/docs/react/hooks/use-wallets.md +4 -4
- package/docs/state.md +18 -17
- package/docs/theming.md +32 -32
- package/docs/web-components/connect-button.md +13 -11
- package/docs/web-components/connect-modal.md +18 -17
- package/package.json +3 -5
package/dist/index.d.mts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as _mysten_dapp_kit_core4 from "@mysten/dapp-kit-core";
|
|
2
2
|
import { DAppKit, DefaultExpectedDppKit, RegisteredDAppKit } from "@mysten/dapp-kit-core";
|
|
3
3
|
import * as react0 from "react";
|
|
4
4
|
import { PropsWithChildren } from "react";
|
|
@@ -7,7 +7,7 @@ import * as nanostores0 from "nanostores";
|
|
|
7
7
|
export * from "@mysten/dapp-kit-core";
|
|
8
8
|
|
|
9
9
|
//#region src/components/DAppKitProvider.d.ts
|
|
10
|
-
declare const DAppKitContext: react0.Context<
|
|
10
|
+
declare const DAppKitContext: react0.Context<_mysten_dapp_kit_core4.DAppKit<any, _mysten_dapp_kit_core4.ClientWithCoreApi> | null>;
|
|
11
11
|
type DAppKitProviderProps = PropsWithChildren<{
|
|
12
12
|
dAppKit: DefaultExpectedDppKit;
|
|
13
13
|
}>;
|
|
@@ -25,7 +25,7 @@ type UseWalletsOptions<TDAppKit extends DAppKit> = {
|
|
|
25
25
|
};
|
|
26
26
|
declare function useWallets<TDAppKit extends DAppKit<any> = RegisteredDAppKit>({
|
|
27
27
|
dAppKit
|
|
28
|
-
}?: UseWalletsOptions<TDAppKit>):
|
|
28
|
+
}?: UseWalletsOptions<TDAppKit>): _mysten_dapp_kit_core4.UiWallet[];
|
|
29
29
|
//#endregion
|
|
30
30
|
//#region src/hooks/useWalletConnection.d.ts
|
|
31
31
|
type UseWalletConnectionOptions<TDAppKit extends DAppKit<any>> = {
|
|
@@ -43,8 +43,8 @@ declare function useWalletConnection<TDAppKit extends DAppKit = RegisteredDAppKi
|
|
|
43
43
|
readonly isReconnecting: false;
|
|
44
44
|
readonly isDisconnected: true;
|
|
45
45
|
} | {
|
|
46
|
-
readonly wallet:
|
|
47
|
-
readonly account:
|
|
46
|
+
readonly wallet: _mysten_dapp_kit_core4.UiWallet;
|
|
47
|
+
readonly account: _mysten_dapp_kit_core4.UiWalletAccount;
|
|
48
48
|
readonly status: "connected";
|
|
49
49
|
readonly supportedIntents: string[];
|
|
50
50
|
readonly isConnected: true;
|
|
@@ -61,8 +61,8 @@ declare function useWalletConnection<TDAppKit extends DAppKit = RegisteredDAppKi
|
|
|
61
61
|
readonly isReconnecting: false;
|
|
62
62
|
readonly isDisconnected: false;
|
|
63
63
|
} | {
|
|
64
|
-
readonly wallet:
|
|
65
|
-
readonly account:
|
|
64
|
+
readonly wallet: _mysten_dapp_kit_core4.UiWallet;
|
|
65
|
+
readonly account: _mysten_dapp_kit_core4.UiWalletAccount;
|
|
66
66
|
readonly status: "reconnecting";
|
|
67
67
|
readonly supportedIntents: string[];
|
|
68
68
|
readonly isConnected: false;
|
|
@@ -77,7 +77,7 @@ type UseCurrentAccountOptions<TDAppKit extends DAppKit> = {
|
|
|
77
77
|
};
|
|
78
78
|
declare function useCurrentAccount<TDAppKit extends DAppKit<any> = RegisteredDAppKit>({
|
|
79
79
|
dAppKit
|
|
80
|
-
}?: UseCurrentAccountOptions<TDAppKit>):
|
|
80
|
+
}?: UseCurrentAccountOptions<TDAppKit>): _mysten_dapp_kit_core4.UiWalletAccount | null;
|
|
81
81
|
//#endregion
|
|
82
82
|
//#region src/hooks/useCurrentWallet.d.ts
|
|
83
83
|
type UseCurrentWalletOptions<TDAppKit extends DAppKit> = {
|
|
@@ -85,7 +85,7 @@ type UseCurrentWalletOptions<TDAppKit extends DAppKit> = {
|
|
|
85
85
|
};
|
|
86
86
|
declare function useCurrentWallet<TDAppKit extends DAppKit<any> = RegisteredDAppKit>({
|
|
87
87
|
dAppKit
|
|
88
|
-
}?: UseCurrentWalletOptions<TDAppKit>):
|
|
88
|
+
}?: UseCurrentWalletOptions<TDAppKit>): _mysten_dapp_kit_core4.UiWallet | null;
|
|
89
89
|
//#endregion
|
|
90
90
|
//#region src/hooks/useCurrentClient.d.ts
|
|
91
91
|
type UseCurrentClientOptions<TDAppKit extends DAppKit<any>> = {
|
package/dist/index.d.mts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.mts","names":[],"sources":["../src/components/DAppKitProvider.tsx","../src/hooks/useDAppKit.ts","../src/hooks/useWallets.ts","../src/hooks/useWalletConnection.ts","../src/hooks/useCurrentAccount.ts","../src/hooks/useCurrentWallet.ts","../src/hooks/useCurrentClient.ts","../src/hooks/useCurrentNetwork.ts"],"
|
|
1
|
+
{"version":3,"file":"index.d.mts","names":[],"sources":["../src/components/DAppKitProvider.tsx","../src/hooks/useDAppKit.ts","../src/hooks/useWallets.ts","../src/hooks/useWalletConnection.ts","../src/hooks/useCurrentAccount.ts","../src/hooks/useCurrentWallet.ts","../src/hooks/useCurrentClient.ts","../src/hooks/useCurrentNetwork.ts"],"mappings":";;;;;;;;;cAOa,cAAA,EAAc,MAAA,CAAA,OAAA,CAAA,sBAAA,CAAA,OAAA,MAAoD,sBAAA,CAApD,iBAAA;AAAA,KAEf,oBAAA,GAAuB,iBAAA;EAClC,OAAA,EAAS,qBAAA;AAAA;AAAA,iBAGM,eAAA,CAAA;EAAkB,OAAA;EAAS;AAAA,GAAY,oBAAA,GAAoB,kBAAA,CAAA,GAAA,CAAA,OAAA;;;iBCN3D,UAAA,kBAA4B,OAAA,QAAe,iBAAA,CAAA,CAAmB,OAAA,GAAU,QAAA,GAAQ,QAAA;;;KCApF,iBAAA,kBAAmC,OAAA;EAC9C,OAAA,GAAU,QAAA;AAAA;AAAA,iBAGK,UAAA,kBAA4B,OAAA,QAAe,iBAAA,CAAA,CAAA;EAC1D;AAAA,IACE,iBAAA,CAAkB,QAAA,IAAD,sBAAA,CAAe,QAAA;;;KCNvB,0BAAA,kBAA4C,OAAA;EACvD,OAAA,GAAU,QAAA;AAAA;AAAA,iBAGK,mBAAA,kBAAqC,OAAA,GAAU,iBAAA,CAAA,CAAA;EAC9D;AAAA,IACE,0BAAA,CAA2B,QAAA;EAAA;;;;;;;;;mBAAD,sBAAA,CAAA,QAAA;EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;KCPjB,wBAAA,kBAA0C,OAAA;EACrD,OAAA,GAAU,QAAA;AAAA;AAAA,iBAGK,iBAAA,kBAAmC,OAAA,QAAe,iBAAA,CAAA,CAAA;EACjE;AAAA,IACE,wBAAA,CAAyB,QAAA,IAAD,sBAAA,CAAe,eAAA;;;KCN9B,uBAAA,kBAAyC,OAAA;EACpD,OAAA,GAAU,QAAA;AAAA;AAAA,iBAGK,gBAAA,kBAAkC,OAAA,QAAe,iBAAA,CAAA,CAAA;EAChE;AAAA,IACE,uBAAA,CAAwB,QAAA,IAAD,sBAAA,CAAe,QAAA;;;KCL7B,uBAAA,kBAAyC,OAAA;EACpD,OAAA,GAAU,QAAA;AAAA;AAAA,iBAGK,gBAAA,kBAAkC,OAAA,QAAe,iBAAA,CAAA,CAAA;EAChE;AAAA,IACE,uBAAA,CAAwB,QAAA,IAEyB,UAAA,CAAW,QAAA;;;KCRnD,wBAAA,kBAA0C,OAAA;EACrD,OAAA,GAAU,QAAA;AAAA;AAAA,iBAGK,iBAAA,kBAAmC,OAAA,QAAe,iBAAA,CAAA,CAAA;EACjE;AAAA,IACE,wBAAA,CAAyB,QAAA,IAAc,WAAA,CAAA,UAAA,CAAA,QAAA"}
|
package/dist/ui.d.mts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ui.d.mts","names":[],"sources":["../src/components/ConnectButton.tsx","../src/components/ConnectModal.tsx"],"
|
|
1
|
+
{"version":3,"file":"ui.d.mts","names":[],"sources":["../src/components/ConnectButton.tsx","../src/components/ConnectModal.tsx"],"mappings":";;;;;;KASY,kBAAA,GAAqB,cAAA,QAAsB,sBAAA;AAAA,cAEjD,sBAAA,EAAsB,WAAA,CAAA,iBAAA,CAAA,oBAAA;AAAA,iBAMZ,aAAA,CAAA;EAAgB,QAAA;EAAA,GAAa;AAAA,GAAS,kBAAA,GAAkB,kBAAA,CAAA,GAAA,CAAA,OAAA;;;KCR5D,iBAAA,GAAoB,cAAA,QAAsB,qBAAA;AAAA,cAEhD,qBAAA,EAAqB,WAAA,CAAA,iBAAA,CAAA,mBAAA;AAAA,iBAMX,YAAA,CAAA;EAAe,QAAA;EAAA,GAAa;AAAA,GAAS,iBAAA,GAAiB,kBAAA,CAAA,GAAA,CAAA,OAAA"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# Connect Wallet
|
|
2
2
|
|
|
3
|
-
> Programmatically connect to a Sui wallet
|
|
3
|
+
> Programmatically connect to a Sui wallet using the dApp Kit connectWallet action.
|
|
4
4
|
|
|
5
5
|
The dApp Kit SDK provides an action for wallet connection, allowing users to connect, disconnect,
|
|
6
6
|
and switch between wallets and accounts.
|
|
@@ -17,6 +17,7 @@ and switch between wallets and accounts.
|
|
|
17
17
|
The `connectWallet` action prompts a wallet to connect and authorize accounts for your application:
|
|
18
18
|
|
|
19
19
|
```typescript
|
|
20
|
+
|
|
20
21
|
const dAppKit = createDAppKit({
|
|
21
22
|
/* config */
|
|
22
23
|
});
|
|
@@ -32,15 +33,15 @@ console.log('Connected accounts:', result.accounts);
|
|
|
32
33
|
|
|
33
34
|
## Parameters
|
|
34
35
|
|
|
35
|
-
- **`wallet
|
|
36
|
+
- **`wallet`:** The `UiWallet` instance to connect to
|
|
36
37
|
- **`account`** (optional) - A specific `UiWalletAccount` to set as the selected account. Defaults
|
|
37
38
|
to the first authorized account
|
|
38
39
|
|
|
39
|
-
## Return
|
|
40
|
+
## Return value
|
|
40
41
|
|
|
41
42
|
Returns a `Promise` that resolves to an object containing:
|
|
42
43
|
|
|
43
|
-
- **`accounts
|
|
44
|
+
- **`accounts`:** Array of authorized `UiWalletAccount` instances
|
|
44
45
|
|
|
45
46
|
## Example
|
|
46
47
|
|
|
@@ -65,4 +66,4 @@ if (wallets.length > 0) {
|
|
|
65
66
|
console.error('Connection failed:', error);
|
|
66
67
|
}
|
|
67
68
|
}
|
|
68
|
-
```
|
|
69
|
+
```
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# Disconnect Wallet
|
|
2
2
|
|
|
3
|
-
> Programmatically disconnect from a Sui wallet
|
|
3
|
+
> Programmatically disconnect from a Sui wallet using the dApp Kit disconnectWallet action.
|
|
4
4
|
|
|
5
5
|
The `disconnectWallet` action terminates the connection with the currently connected wallet.
|
|
6
6
|
|
|
@@ -9,15 +9,16 @@ The `disconnectWallet` action terminates the connection with the currently conne
|
|
|
9
9
|
|
|
10
10
|
## Usage
|
|
11
11
|
|
|
12
|
-
> **Note:** The disconnect action clears the connection state locally and attempts to notify the
|
|
13
|
-
>
|
|
12
|
+
> **Note:** The disconnect action clears the connection state locally and attempts to notify the wallet. Even
|
|
13
|
+
> if the wallet notification fails, the local state is always cleared to ensure a clean
|
|
14
14
|
> disconnection.
|
|
15
|
-
>
|
|
16
|
-
>
|
|
17
|
-
>
|
|
18
|
-
> wallet itself
|
|
15
|
+
>
|
|
16
|
+
> Wallets might or might not implement the `disconnect` feature. Calling `disconnectWallet`
|
|
17
|
+
> does not necessarily mean that the wallet accounts are disconnected from the app within the
|
|
18
|
+
> wallet itself. This is determined by each wallet's implementation.
|
|
19
19
|
|
|
20
20
|
```typescript
|
|
21
|
+
|
|
21
22
|
const dAppKit = createDAppKit({
|
|
22
23
|
/* config */
|
|
23
24
|
});
|
|
@@ -29,9 +30,10 @@ await dAppKit.disconnectWallet();
|
|
|
29
30
|
|
|
30
31
|
None.
|
|
31
32
|
|
|
32
|
-
## Return
|
|
33
|
+
## Return value
|
|
33
34
|
|
|
34
35
|
Returns a `Promise` that resolves to `void` when the disconnection is complete.
|
|
35
36
|
|
|
36
|
-
> The action
|
|
37
|
-
> disconnect failures are logged but don't prevent the local connection state from
|
|
37
|
+
> The action might throw `WalletNotConnectedError` if no wallet is connected. However,
|
|
38
|
+
> wallet-specific disconnect failures are logged but don't prevent the local connection state from
|
|
39
|
+
> being cleared.
|
|
@@ -1,13 +1,14 @@
|
|
|
1
1
|
# Sign and Execute Transaction
|
|
2
2
|
|
|
3
|
-
> Sign and execute a transaction using the connected wallet
|
|
3
|
+
> Sign and execute a transaction on the Sui network using the connected wallet.
|
|
4
4
|
|
|
5
5
|
The `signAndExecuteTransaction` action prompts the connected wallet to sign and immediately execute
|
|
6
|
-
a transaction on the Sui network. This is the most common way to execute transactions in your
|
|
6
|
+
a transaction on the Sui network. This is the most common way to execute transactions in your app.
|
|
7
7
|
|
|
8
8
|
## Usage
|
|
9
9
|
|
|
10
10
|
```typescript
|
|
11
|
+
|
|
11
12
|
const dAppKit = createDAppKit({
|
|
12
13
|
/* config */
|
|
13
14
|
});
|
|
@@ -29,11 +30,11 @@ console.log('Transaction digest:', result.Transaction.digest);
|
|
|
29
30
|
|
|
30
31
|
## Parameters
|
|
31
32
|
|
|
32
|
-
- **`transaction
|
|
33
|
+
- **`transaction`:** `Transaction | string`: The transaction to sign and execute. Can be either a
|
|
33
34
|
Transaction instance or base64-encoded bcs bytes for the transaction.
|
|
34
|
-
- **`signal`** (optional)
|
|
35
|
+
- **`signal`** (optional): `AbortSignal`: An abort signal to cancel the transaction request.
|
|
35
36
|
|
|
36
|
-
## Return
|
|
37
|
+
## Return value
|
|
37
38
|
|
|
38
39
|
Returns a `Promise` that resolves to a `TransactionResult` discriminated union:
|
|
39
40
|
|
|
@@ -45,14 +46,14 @@ type TransactionResult =
|
|
|
45
46
|
|
|
46
47
|
The `Transaction` object contains:
|
|
47
48
|
|
|
48
|
-
- **`digest
|
|
49
|
-
- **`signatures
|
|
50
|
-
- **`epoch
|
|
51
|
-
- **`status
|
|
49
|
+
- **`digest`:** `string`: The transaction digest (unique identifier for the executed transaction)
|
|
50
|
+
- **`signatures`:** `string[]`: The signatures as base64-encoded strings
|
|
51
|
+
- **`epoch`:** `string | null`: The epoch in which the transaction was executed
|
|
52
|
+
- **`status`:** `ExecutionStatus`: The execution status with `success: boolean` and
|
|
52
53
|
`error: string | null`
|
|
53
|
-
- **`effects
|
|
54
|
+
- **`effects`:** `TransactionEffects | null`: The parsed transaction effects (may be `null` if
|
|
54
55
|
effects parsing fails for unknown effect versions)
|
|
55
|
-
- **`transaction
|
|
56
|
+
- **`transaction`:** `TransactionData`: The parsed transaction data
|
|
56
57
|
|
|
57
58
|
```typescript
|
|
58
59
|
const result = await dAppKit.signAndExecuteTransaction({ transaction });
|
|
@@ -69,7 +70,7 @@ console.log('Signatures:', tx.signatures);
|
|
|
69
70
|
console.log('Epoch:', tx.epoch);
|
|
70
71
|
```
|
|
71
72
|
|
|
72
|
-
## Transaction
|
|
73
|
+
## Transaction building
|
|
73
74
|
|
|
74
75
|
When passing a Transaction instance, the action automatically:
|
|
75
76
|
|
|
@@ -78,12 +79,12 @@ When passing a Transaction instance, the action automatically:
|
|
|
78
79
|
3. Converts it to the appropriate format for the wallet
|
|
79
80
|
4. Submits the transaction to the network
|
|
80
81
|
|
|
81
|
-
## Wallet
|
|
82
|
+
## Wallet compatibility
|
|
82
83
|
|
|
83
84
|
- The action transparently handles both `sui:signAndExecuteTransaction` and
|
|
84
85
|
`sui:signAndExecuteTransactionBlock` wallet-standard features
|
|
85
86
|
- The wallet handles network submission and response
|
|
86
|
-
- Some wallets (Enoki, Enoki Connect, WalletConnect)
|
|
87
|
+
- Some wallets (Enoki, Enoki Connect, and WalletConnect) might use the dApp Kit client and execute
|
|
87
88
|
transactions within the application as an implementation detail
|
|
88
89
|
|
|
89
90
|
```typescript
|
|
@@ -92,4 +93,4 @@ When passing a Transaction instance, the action automatically:
|
|
|
92
93
|
const result = await dAppKit.signAndExecuteTransaction({
|
|
93
94
|
transaction: tx,
|
|
94
95
|
});
|
|
95
|
-
```
|
|
96
|
+
```
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# Sign Personal Message
|
|
2
2
|
|
|
3
|
-
> Sign an arbitrary message with the connected wallet
|
|
3
|
+
> Sign an arbitrary message with the connected wallet for authentication or proof of ownership.
|
|
4
4
|
|
|
5
5
|
The `signPersonalMessage` action prompts the connected wallet to sign a personal message. This is
|
|
6
6
|
useful for authentication, proof of ownership, or other scenarios where you need cryptographic proof
|
|
@@ -9,6 +9,7 @@ that a user controls a specific account.
|
|
|
9
9
|
## Usage
|
|
10
10
|
|
|
11
11
|
```typescript
|
|
12
|
+
|
|
12
13
|
const dAppKit = createDAppKit({
|
|
13
14
|
/* config */
|
|
14
15
|
});
|
|
@@ -24,16 +25,16 @@ console.log('Signature:', result.signature);
|
|
|
24
25
|
|
|
25
26
|
## Parameters
|
|
26
27
|
|
|
27
|
-
- **`message
|
|
28
|
+
- **`message`:** `Uint8Array` - The message to sign as a byte array
|
|
28
29
|
|
|
29
|
-
## Return
|
|
30
|
+
## Return value
|
|
30
31
|
|
|
31
32
|
Returns a `Promise` that resolves to an object containing:
|
|
32
33
|
|
|
33
|
-
- **`bytes
|
|
34
|
-
- **`signature
|
|
34
|
+
- **`bytes`:** `string` - Base64 encoded message bytes
|
|
35
|
+
- **`signature`:** `string` - Base64 encoded signature
|
|
35
36
|
|
|
36
|
-
## Message
|
|
37
|
+
## Message format
|
|
37
38
|
|
|
38
39
|
The message parameter must be a `Uint8Array`. Common patterns for creating byte arrays:
|
|
39
40
|
|
|
@@ -47,11 +48,11 @@ const jsonMessage = new TextEncoder().encode(
|
|
|
47
48
|
await dAppKit.signPersonalMessage({ message: jsonMessage });
|
|
48
49
|
```
|
|
49
50
|
|
|
50
|
-
## Security
|
|
51
|
+
## Security considerations
|
|
51
52
|
|
|
52
|
-
### Message
|
|
53
|
+
### Message content
|
|
53
54
|
|
|
54
55
|
- Always display the message content clearly to users before signing
|
|
55
56
|
- Avoid signing opaque or encoded data that users cannot understand
|
|
56
57
|
- Include human-readable prefixes for different message types
|
|
57
|
-
- Consider adding timestamps to prevent replay attacks
|
|
58
|
+
- Consider adding timestamps to prevent replay attacks
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# Sign Transaction
|
|
2
2
|
|
|
3
|
-
> Sign a transaction without executing it
|
|
3
|
+
> Sign a Sui transaction without executing it for deferred or multi-signature scenarios.
|
|
4
4
|
|
|
5
5
|
The `signTransaction` action prompts the connected wallet to sign a transaction without executing
|
|
6
6
|
it. This is useful when you need a signed transaction for later execution or for multi-signature
|
|
@@ -9,6 +9,7 @@ scenarios.
|
|
|
9
9
|
## Usage
|
|
10
10
|
|
|
11
11
|
```typescript
|
|
12
|
+
|
|
12
13
|
const dAppKit = createDAppKit({
|
|
13
14
|
/* config */
|
|
14
15
|
});
|
|
@@ -25,16 +26,16 @@ const { bytes, signature } = await dAppKit.signTransaction({
|
|
|
25
26
|
|
|
26
27
|
## Parameters
|
|
27
28
|
|
|
28
|
-
- **`transaction
|
|
29
|
+
- **`transaction`:** `Transaction | string` - The transaction to sign. Can be either a Transaction
|
|
29
30
|
instance or base64-encoded bcs bytes for the transaction.
|
|
30
31
|
- **`signal`** (optional) - `AbortSignal` - An abort signal to cancel the signing request.
|
|
31
32
|
|
|
32
|
-
## Return
|
|
33
|
+
## Return value
|
|
33
34
|
|
|
34
35
|
Returns a `Promise` that resolves to an object containing:
|
|
35
36
|
|
|
36
|
-
- **`bytes
|
|
37
|
-
- **`signature
|
|
37
|
+
- **`bytes`:** `string` - The signed transaction as a base64-encoded BCS string
|
|
38
|
+
- **`signature`:** `string` - The signature as a base64-encoded string
|
|
38
39
|
|
|
39
40
|
```typescript
|
|
40
41
|
const result = await dAppKit.signTransaction({ transaction });
|
|
@@ -42,7 +43,7 @@ console.log('Signed transaction bytes:', result.bytes);
|
|
|
42
43
|
console.log('Signature:', result.signature);
|
|
43
44
|
```
|
|
44
45
|
|
|
45
|
-
## Transaction
|
|
46
|
+
## Transaction building
|
|
46
47
|
|
|
47
48
|
When passing a Transaction instance, the action automatically:
|
|
48
49
|
|
|
@@ -50,7 +51,7 @@ When passing a Transaction instance, the action automatically:
|
|
|
50
51
|
2. Builds the transaction using the current network's client
|
|
51
52
|
3. Converts it to the appropriate format for the wallet
|
|
52
53
|
|
|
53
|
-
## Wallet
|
|
54
|
+
## Wallet compatibility
|
|
54
55
|
|
|
55
56
|
- The action transparently handles both `sui:signTransaction` and `sui:signTransactionBlock`
|
|
56
57
|
wallet-standard features
|
|
@@ -61,4 +62,4 @@ When passing a Transaction instance, the action automatically:
|
|
|
61
62
|
const result = await dAppKit.signTransaction({
|
|
62
63
|
transaction: tx,
|
|
63
64
|
});
|
|
64
|
-
```
|
|
65
|
+
```
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
# Switch Account
|
|
2
2
|
|
|
3
|
-
> Switch the active account in the connected wallet
|
|
3
|
+
> Switch the active account in the connected wallet using the dApp Kit switchAccount action.
|
|
4
4
|
|
|
5
5
|
The `switchAccount` action changes the currently selected account to a different account from the
|
|
6
6
|
connected wallet.
|
|
7
7
|
|
|
8
|
-
> **Note:** The
|
|
9
|
-
>
|
|
10
|
-
>
|
|
8
|
+
> **Note:** The current account is a dApp Kit concept that tracks which account is active within your
|
|
9
|
+
> application. Changing the active account in the app does not affect the wallet itself, and wallets
|
|
10
|
+
> are not notified when the active account changes.
|
|
11
11
|
|
|
12
12
|
> Account switching is integrated into the [Connect Button](../web-components/connect-button) Web
|
|
13
13
|
> Component. When a wallet is connected with multiple accounts, the button provides an account
|
|
@@ -16,6 +16,7 @@ connected wallet.
|
|
|
16
16
|
## Usage
|
|
17
17
|
|
|
18
18
|
```typescript
|
|
19
|
+
|
|
19
20
|
const dAppKit = createDAppKit({
|
|
20
21
|
/* config */
|
|
21
22
|
});
|
|
@@ -28,9 +29,9 @@ dAppKit.switchAccount({
|
|
|
28
29
|
|
|
29
30
|
## Parameters
|
|
30
31
|
|
|
31
|
-
- **`account
|
|
32
|
+
- **`account`:** `UiWalletAccount` - The account to switch to. Must be an account that belongs to
|
|
32
33
|
the currently connected wallet.
|
|
33
34
|
|
|
34
|
-
## Return
|
|
35
|
+
## Return value
|
|
35
36
|
|
|
36
|
-
Returns `void`. The action completes synchronously and updates the connection state immediately.
|
|
37
|
+
Returns `void`. The action completes synchronously and updates the connection state immediately.
|
|
@@ -1,16 +1,17 @@
|
|
|
1
1
|
# Switch Network
|
|
2
2
|
|
|
3
|
-
> Switch the active network for the dApp Kit instance
|
|
3
|
+
> Switch the active network for the dApp Kit instance between mainnet, testnet, and other networks.
|
|
4
4
|
|
|
5
5
|
The `switchNetwork` action changes the currently selected network that the dApp Kit client is
|
|
6
6
|
configured to use.
|
|
7
7
|
|
|
8
|
-
> **Note:** Network switching only affects your
|
|
9
|
-
>
|
|
8
|
+
> **Note:** Network switching only affects your app's client connection. The wallet itself is not affected by
|
|
9
|
+
> this change, and wallets are not notified when the network changes in the app.
|
|
10
10
|
|
|
11
11
|
## Usage
|
|
12
12
|
|
|
13
13
|
```typescript
|
|
14
|
+
|
|
14
15
|
const GRPC_URLS = {
|
|
15
16
|
mainnet: 'https://fullnode.mainnet.sui.io:443',
|
|
16
17
|
testnet: 'https://fullnode.testnet.sui.io:443',
|
|
@@ -28,9 +29,9 @@ dAppKit.switchNetwork('testnet');
|
|
|
28
29
|
|
|
29
30
|
## Parameters
|
|
30
31
|
|
|
31
|
-
- **`network
|
|
32
|
+
- **`network`:** `TNetworks[number]`: The network to switch to. Must be one of the networks
|
|
32
33
|
configured when creating the dApp Kit instance.
|
|
33
34
|
|
|
34
|
-
## Return
|
|
35
|
+
## Return value
|
|
35
36
|
|
|
36
|
-
Returns `void`. The action completes synchronously and updates the network state immediately.
|
|
37
|
+
Returns `void`. The action completes synchronously and updates the network state immediately.
|
|
@@ -2,13 +2,13 @@
|
|
|
2
2
|
|
|
3
3
|
> Create and configure a DAppKit instance for wallet and client management
|
|
4
4
|
|
|
5
|
-
The `createDAppKit` function is the foundation of your Sui
|
|
5
|
+
The `createDAppKit` function is the foundation of your Sui app. It creates an instance that manages
|
|
6
6
|
wallet connections, network configuration, and provides access to the Sui client.
|
|
7
7
|
|
|
8
|
-
## Creating a dApp Kit
|
|
8
|
+
## Creating a dApp Kit instance
|
|
9
9
|
|
|
10
10
|
The core of the dApp Kit SDK is the `createDAppKit` function, which creates an instance that manages
|
|
11
|
-
all
|
|
11
|
+
all app functionality:
|
|
12
12
|
|
|
13
13
|
```typescript
|
|
14
14
|
|
|
@@ -22,9 +22,8 @@ const GRPC_URLS = {
|
|
|
22
22
|
```
|
|
23
23
|
|
|
24
24
|
> **Note:** If you use the React bindings, there are two ways to ensure type safety with hooks:
|
|
25
|
-
>
|
|
26
|
-
> 1. [Register the global dAppKit type](./getting-started/react#1-create-a-dapp-kit-instance) once,
|
|
27
|
-
> and all hooks will be properly typed
|
|
25
|
+
>
|
|
26
|
+
> 1. [Register the global dAppKit type](./getting-started/react#1-create-a-dapp-kit-instance) once, and all hooks will be properly typed
|
|
28
27
|
> 2. Pass the dAppKit instance explicitly to each hook: `useWalletConnection({ dAppKit })`
|
|
29
28
|
|
|
30
29
|
This instance provides:
|
|
@@ -36,22 +35,23 @@ This instance provides:
|
|
|
36
35
|
|
|
37
36
|
## Parameters
|
|
38
37
|
|
|
39
|
-
- **autoConnect** (optional)
|
|
38
|
+
- **autoConnect** (optional): Enables automatically connecting to the most recently used wallet
|
|
40
39
|
account (default: `true`)
|
|
41
|
-
- **networks
|
|
42
|
-
|
|
43
|
-
- **
|
|
44
|
-
- **
|
|
45
|
-
- **
|
|
40
|
+
- **networks:** A list of networks supported by the application (for example,
|
|
41
|
+
`['mainnet', 'testnet']`)
|
|
42
|
+
- **defaultNetwork** (optional): Initial network to use (default: first network in the array)
|
|
43
|
+
- **createClient:** Creates a new client instance for the given network
|
|
44
|
+
- **enableBurnerWallet** (optional): Enable development-only burner wallet (default: `false`)
|
|
45
|
+
- **storage** (optional): Configures how the most recently connected to wallet account is stored
|
|
46
46
|
(default: `localStorage`, set to `null` to disable)
|
|
47
|
-
- **storageKey** (optional)
|
|
47
|
+
- **storageKey** (optional): The key to use to store the most recently connected wallet account
|
|
48
48
|
(default: `'mysten-dapp-kit:selected-wallet-and-address'`)
|
|
49
|
-
- **walletInitializers** (optional)
|
|
49
|
+
- **walletInitializers** (optional): A list of wallet initializers used for registering additional
|
|
50
50
|
wallet standard wallets.
|
|
51
|
-
- **slushWalletConfig** (optional)
|
|
51
|
+
- **slushWalletConfig** (optional): Configuration for Slush wallet (set to `null` to disable the
|
|
52
52
|
wallet)
|
|
53
53
|
|
|
54
|
-
## Return
|
|
54
|
+
## Return value
|
|
55
55
|
|
|
56
56
|
```ts
|
|
57
57
|
{
|
|
@@ -78,7 +78,7 @@ This instance provides:
|
|
|
78
78
|
|
|
79
79
|
Read more about [actions](./actions/connect-wallet) and [stores](./state).
|
|
80
80
|
|
|
81
|
-
## Basic
|
|
81
|
+
## Basic usage
|
|
82
82
|
|
|
83
83
|
```ts
|
|
84
84
|
// dapp-kit.ts
|
|
@@ -112,7 +112,7 @@ const GRPC_URLS = {
|
|
|
112
112
|
> If you use the React bindings, see [Getting Started in React](./getting-started/react) and
|
|
113
113
|
> [DAppKitProvider](./react/dapp-kit-provider).
|
|
114
114
|
|
|
115
|
-
## Development
|
|
115
|
+
## Development configuration
|
|
116
116
|
|
|
117
117
|
For development environments, enable the burner wallet:
|
|
118
118
|
|
|
@@ -125,11 +125,11 @@ For development environments, enable the burner wallet:
|
|
|
125
125
|
});
|
|
126
126
|
```
|
|
127
127
|
|
|
128
|
-
## Auto-
|
|
128
|
+
## Auto-connect behavior
|
|
129
129
|
|
|
130
130
|
By default, dApp Kit automatically reconnects to the previously connected wallet.
|
|
131
131
|
|
|
132
|
-
### Disabling
|
|
132
|
+
### Disabling auto-connect
|
|
133
133
|
|
|
134
134
|
```typescript
|
|
135
135
|
|
|
@@ -140,7 +140,7 @@ By default, dApp Kit automatically reconnects to the previously connected wallet
|
|
|
140
140
|
});
|
|
141
141
|
```
|
|
142
142
|
|
|
143
|
-
## Custom
|
|
143
|
+
## Custom wallet integration
|
|
144
144
|
|
|
145
145
|
Add support for custom wallets using wallet initializers:
|
|
146
146
|
|
|
@@ -160,4 +160,4 @@ Add support for custom wallets using wallet initializers:
|
|
|
160
160
|
},
|
|
161
161
|
],
|
|
162
162
|
});
|
|
163
|
-
```
|
|
163
|
+
```
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
# @mysten/create-dapp
|
|
2
2
|
|
|
3
|
-
> Create a Sui
|
|
3
|
+
> Create a Sui app with one command using the create-dapp CLI scaffolding tool.
|
|
4
4
|
|
|
5
|
-
`@mysten/create-dapp` is a CLI tool that scaffolds a complete Sui
|
|
5
|
+
`@mysten/create-dapp` is a CLI tool that scaffolds a complete Sui app project with best practices
|
|
6
6
|
built in.
|
|
7
7
|
|
|
8
|
-
## Quick
|
|
8
|
+
## Quick start
|
|
9
9
|
|
|
10
10
|
```sh npm2yarn
|
|
11
11
|
npm create @mysten/dapp
|
|
@@ -17,7 +17,7 @@ The CLI prompts you to choose a template and project name, then creates a ready-
|
|
|
17
17
|
|
|
18
18
|
### react-client-dapp
|
|
19
19
|
|
|
20
|
-
A basic React
|
|
20
|
+
A basic React app that demonstrates wallet connection and fetching owned objects:
|
|
21
21
|
|
|
22
22
|
- Wallet connection with `ConnectButton`
|
|
23
23
|
- Display connected wallet address
|
|
@@ -34,7 +34,7 @@ A complete end-to-end example with Move smart contract integration:
|
|
|
34
34
|
- MVR (Move Registry) name resolution for package IDs
|
|
35
35
|
- Full transaction signing and execution
|
|
36
36
|
|
|
37
|
-
## Tech
|
|
37
|
+
## Tech stack
|
|
38
38
|
|
|
39
39
|
Both templates include:
|
|
40
40
|
|
|
@@ -50,7 +50,7 @@ The e2e-counter template also includes:
|
|
|
50
50
|
|
|
51
51
|
- [`@mysten/codegen`](/codegen) - Generate TypeScript from Move code
|
|
52
52
|
|
|
53
|
-
## Project
|
|
53
|
+
## Project structure
|
|
54
54
|
|
|
55
55
|
### react-client-dapp
|
|
56
56
|
|
|
@@ -82,9 +82,9 @@ move/
|
|
|
82
82
|
└── counter/ # Move smart contract
|
|
83
83
|
```
|
|
84
84
|
|
|
85
|
-
## Using the e2e-counter
|
|
85
|
+
## Using the e2e-counter template
|
|
86
86
|
|
|
87
|
-
### 1
|
|
87
|
+
### Step 1: Deploy the Move contract
|
|
88
88
|
|
|
89
89
|
First, install the [Sui CLI](https://docs.sui.io/build/install) and set up testnet:
|
|
90
90
|
|
|
@@ -100,7 +100,7 @@ cd move
|
|
|
100
100
|
sui client publish --gas-budget 100000000 counter
|
|
101
101
|
```
|
|
102
102
|
|
|
103
|
-
### 2
|
|
103
|
+
### Step 2: Configure the package ID
|
|
104
104
|
|
|
105
105
|
Copy the `packageId` from the publish output to `src/constants.ts`:
|
|
106
106
|
|
|
@@ -108,7 +108,7 @@ Copy the `packageId` from the publish output to `src/constants.ts`:
|
|
|
108
108
|
|
|
109
109
|
```
|
|
110
110
|
|
|
111
|
-
### 3
|
|
111
|
+
### Step 3: Generate TypeScript bindings
|
|
112
112
|
|
|
113
113
|
```bash
|
|
114
114
|
pnpm codegen
|
|
@@ -116,7 +116,7 @@ pnpm codegen
|
|
|
116
116
|
|
|
117
117
|
This generates type-safe functions in `src/contracts/` for interacting with your Move modules.
|
|
118
118
|
|
|
119
|
-
### 4
|
|
119
|
+
### Step 4: Start development
|
|
120
120
|
|
|
121
121
|
```bash
|
|
122
122
|
pnpm install
|
|
@@ -135,7 +135,7 @@ project.
|
|
|
135
135
|
|
|
136
136
|
Theme variables are defined in `src/index.css` using Tailwind's `@theme` directive.
|
|
137
137
|
|
|
138
|
-
## CLI
|
|
138
|
+
## CLI options
|
|
139
139
|
|
|
140
140
|
You can skip prompts with command-line flags:
|
|
141
141
|
|
|
@@ -148,4 +148,4 @@ npm create @mysten/dapp -- -n my-app
|
|
|
148
148
|
|
|
149
149
|
# Create with both
|
|
150
150
|
npm create @mysten/dapp -- -t react-client-dapp -n my-app
|
|
151
|
-
```
|
|
151
|
+
```
|