File tree Expand file tree Collapse file tree 1 file changed +78
-0
lines changed Expand file tree Collapse file tree 1 file changed +78
-0
lines changed Original file line number Diff line number Diff line change
1
+ ---
2
+ " thirdweb " : minor
3
+ ---
4
+
5
+ Adds new components BuyWidget, CheckoutWidget, and TransactionWidget
6
+
7
+ ## BuyWidget
8
+ A component that allows users to purchase tokens or NFTs directly within your application.
9
+
10
+ ### Example:
11
+ ``` tsx
12
+ import { BuyWidget } from " thirdweb/react" ;
13
+
14
+ function App() {
15
+ return (
16
+ <BuyWidget
17
+ client = { client }
18
+ chain = { chain }
19
+ tokenAddress = " 0x..." // Token or NFT contract address
20
+ recipient = " 0x..." // Optional: recipient address
21
+ theme = " light" // Optional: "light" or "dark"
22
+ />
23
+ );
24
+ }
25
+ ```
26
+
27
+ ## CheckoutWidget
28
+ A comprehensive checkout experience for purchasing digital assets with multiple payment options.
29
+
30
+ ### Example:
31
+ ``` tsx
32
+ import { CheckoutWidget } from " thirdweb/react" ;
33
+
34
+ function App() {
35
+ return (
36
+ <CheckoutWidget
37
+ client = { client }
38
+ chain = { chain }
39
+ items = { [
40
+ {
41
+ tokenAddress: " 0x..." ,
42
+ tokenId: " 1" , // For NFTs
43
+ quantity: " 1"
44
+ }
45
+ ]}
46
+ onSuccess = { (result ) => console .log (" Purchase successful:" , result )}
47
+ theme = " dark" // Optional: "light" or "dark"
48
+ />
49
+ );
50
+ }
51
+ ```
52
+
53
+ ## TransactionWidget
54
+ A widget for executing arbitrary blockchain transactions with a user-friendly interface.
55
+
56
+ ### Example:
57
+ ``` tsx
58
+ import { TransactionWidget } from " thirdweb/react" ;
59
+ import { prepareContractCall } from " thirdweb" ;
60
+
61
+ function App() {
62
+ const transaction = prepareContractCall ({
63
+ contract: myContract ,
64
+ method: " transfer" ,
65
+ params: [recipientAddress , amount ]
66
+ });
67
+
68
+ return (
69
+ <TransactionWidget
70
+ client = { client }
71
+ transaction = { transaction }
72
+ onSuccess = { (result ) => console .log (" Transaction successful:" , result )}
73
+ onError = { (error ) => console .error (" Transaction failed:" , error )}
74
+ theme = " light" // Optional: "light" or "dark"
75
+ />
76
+ );
77
+ }
78
+ ```
You can’t perform that action at this time.
0 commit comments