Merge pull request #38 from tronprotocol/release/v1.2.0

Release/v1.2.0
tronprotocol · Nov 15, 2023 · de55903 · de55903
2 parents 739ce03 + fcdf13a
commit de55903
Show file tree

Hide file tree

Showing 62 changed files with 2,563 additions and 793 deletions.
diff --git a/README.md b/README.md
@@ -138,6 +138,7 @@ tronwallet-adapter
 |   |   ├─vite-app # demo for vitejs
 |   |   ├─next-app # demo for nextjs
 |   ├─dev-demo # demo for development
+|   ├─cdn-demo # demo for cdn usage of adapters
 ```
 
 ### TronWallet Adapters

diff --git a/demos/cdn-demo/.eslintrc b/demos/cdn-demo/.eslintrc
@@ -0,0 +1,18 @@
+{
+    // "extends": [],
+    "parser": "@typescript-eslint/parser",
+    "env": {
+        "node": true
+    },
+    "rules": {
+        "require-extensions/require-extensions": "off"
+    },
+    "overrides": [
+        {
+            "files": "./scripts/*.cjs",
+            "rules": {
+                "@typescript-eslint/no-var-requires": "off"
+            }
+        }
+    ]
+}
diff --git a/demos/cdn-demo/.gitignore b/demos/cdn-demo/.gitignore
@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
diff --git a/demos/cdn-demo/.npmrc b/demos/cdn-demo/.npmrc
@@ -0,0 +1 @@
+package-lock=false
diff --git a/demos/cdn-demo/.prettierrc.json b/demos/cdn-demo/.prettierrc.json
@@ -0,0 +1,7 @@
+{
+    "printWidth": 180,
+    "trailingComma": "es5",
+    "tabWidth": 4,
+    "semi": true,
+    "singleQuote": true
+}
diff --git a/demos/cdn-demo/README.md b/demos/cdn-demo/README.md
@@ -0,0 +1,41 @@
+# TronWallet CND Demo
+This project shows how to use Tronwallet Adapter with vanilla js.
+
+## Usage
+1. Installation
+First you should install the npm package to use the `umd` format file:
+```bash
+npm i @tronweb3/tronwallet-adapters
+```
+
+2. Add script in your HTML file
+Put the script in your `head` tag:
+```html
+<script src="../node_modules/@tronweb3/tronwallet-adapters/lib/umd/index.js"></script>
+```
+
+**Note**: You should adjust the relative path according to the position of your HTML file.
+
+3. Get specified adapter
+```js
+const { TronLinkAdapter, BitKeepAdapter, WalletConnectAdapter, OkxWalletAdapter } = window['@tronweb3/tronwallet-adapters'];
+const tronlinkAdapter = new TronLinkAdapter({
+    openTronLinkAppOnMobile: true,
+    openUrlWhenWalletNotFound: false,
+    checkTimeout: 3000,
+});
+```
+
+Please refer [here](https://developers.tron.network/docs/tronwallet-adapter) for more detailed documentation.
+
+## WalletConnectAdapter
+If you want to use `WalletConnectAdapter`, you should install another dependency in addition:
+```bash
+npm i @walletconnect/sign-client
+```
+
+And add a script tag for `@walletconnect/sign-client`:
+```diff
++ <script src="../node_modules/@walletconnect/sign-client/dist/index.umd.js"></script>
+<script src="../node_modules/@tronweb3/tronwallet-adapters/lib/umd/index.js"></script>
+```
diff --git a/demos/cdn-demo/adapters/index.html b/demos/cdn-demo/adapters/index.html
@@ -0,0 +1,129 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <title>Adapters Test Demo</title>
+        <script src="../node_modules/@walletconnect/sign-client/dist/index.umd.js"></script>
+        <script src="../node_modules/@tronweb3/tronwallet-adapters/lib/umd/index.js"></script>
+    </head>
+    <body>
+        <div id="root">
+            <button id="connectBtn">connect</button>
+            <button id="disconnectBtn">disconnect</button>
+            <button id="signMessageBtn">signMessage</button>
+            <button id="signTransactionBtn">signTransaction</button>
+        </div>
+        <script>
+            const log = function (...args) {
+                console.log('Adapter:', ...args);
+            };
+            let address;
+            const receiver = 'TMDKznuDWaZwfZHcM61FVFstyYNmK6Njk1';
+            const { TronLinkAdapter, BitKeepAdapter, WalletConnectAdapter } = window['@tronweb3/tronwallet-adapters'];
+            let adapter;
+            const tronlinkAdapter = new TronLinkAdapter({
+                openTronLinkAppOnMobile: true,
+                openUrlWhenWalletNotFound: false,
+                checkTimeout: 3000,
+            });
+
+            const bitkeepAdapter = new BitKeepAdapter({
+                openTronLinkAppOnMobile: true,
+                openUrlWhenWalletNotFound: false,
+                checkTimeout: 3000,
+            });
+
+            const walletconnectAdapter = new WalletConnectAdapter({
+                network: 'Nile',
+                options: {
+                    relayUrl: 'wss://relay.walletconnect.com',
+                    // example WC app project ID
+                    projectId: '5fc507d8fc7ae913fff0b8071c7df231',
+                    metadata: {
+                        name: 'Test DApp',
+                        description: 'JustLend WalletConnect',
+                        url: 'https://your-dapp-url.org/',
+                        icons: ['https://your-dapp-url.org/mainLogo.svg'],
+                    },
+                },
+                web3ModalConfig: {
+                    themeMode: 'dark',
+                    themeVariables: {
+                        '--w3m-z-index': '1000'
+                    },
+                }
+            });
+
+
+            adapter = walletconnectAdapter;
+
+            adapter.on('readyStateChanged', () => {
+                log('readyState: ', adapter.readyState);
+            });
+            adapter.on('connect', () => {
+                log('connect2222: ', adapter.address);
+                address = adapter.address;
+                adapter
+                    .network()
+                    .then((res) => {
+                        log(res);
+                    })
+                    .catch((e) => {
+                        log(e);
+                    });
+            });
+            adapter.on('stateChanged', (state) => {
+                log('stateChanged: ', state);
+            });
+            adapter.on('accountsChanged', (data, preaddr) => {
+                log('accountsChanged: current', data, ' pre: ', preaddr);
+            });
+
+            adapter.on('chainChanged', (data) => {
+                log('chainChanged: ', data);
+            });
+
+            adapter.on('disconnect', () => {
+                log('disconnect');
+            });
+
+            const connectBtn = document.querySelector('#connectBtn');
+            const disconnectBtn = document.querySelector('#disconnectBtn');
+            const signMessageBtn = document.querySelector('#signMessageBtn');
+            const signTransactionBtn = document.querySelector('#signTransactionBtn');
+
+            connectBtn.addEventListener('click', onConnect);
+            disconnectBtn.addEventListener('click', onDisconnect);
+            signMessageBtn.addEventListener('click', onSignMessage);
+            signTransactionBtn.addEventListener('click', onSignTransaction);
+
+            async function onConnect() {
+                const res = await adapter.connect();
+                log('connect successfully: ', adapter.address);
+                address = adapter.address;
+            }
+
+            async function onDisconnect() {
+                await adapter.disconnect();
+                log('disconnect successfully ');
+                address = undefined;
+            }
+
+            async function onSignMessage() {
+                const m = 'Hello world';
+                const res = await adapter.signMessage(m);
+                log('sign message successfully: ', res);
+                const address = await tronWeb.trx.verifyMessageV2(m, res);
+                log('verify successfully');
+            }
+
+            async function onSignTransaction() {
+                const transaction = await tronWeb.transactionBuilder.sendTrx(receiver, tronWeb.toSun(0.1), adapter.address);
+                const signedTransaction = await adapter.signTransaction(transaction);
+                const res = await tronWeb.trx.sendRawTransaction(signedTransaction);
+                log('send successfully.');
+            }
+        </script>
+    </body>
+</html>
diff --git a/demos/cdn-demo/bitkeep/index.html b/demos/cdn-demo/bitkeep/index.html
@@ -0,0 +1,97 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <title>BitkeepAdapter Test Demo</title>
+        <script src="../node_modules/@tronweb3/tronwallet-adapter-bitkeep/lib/umd/index.js"></script>
+    </head>
+    <body>
+        <div id="root">
+            <button id="connectBtn">connect</button>
+            <button id="disconnectBtn">disconnect</button>
+            <button id="signMessageBtn">signMessage</button>
+            <button id="signTransactionBtn">signTransaction</button>
+        </div>
+        <script>
+            const log = function (...args) {
+                console.log('Adapter:', ...args);
+            };
+            let address;
+            const receiver = 'TMDKznuDWaZwfZHcM61FVFstyYNmK6Njk1';
+            const { BitKeepAdapter } = window['@tronweb3/tronwallet-adapter-bitkeep'];
+            const adapter = new BitKeepAdapter({
+                openTronLinkAppOnMobile: true,
+                openUrlWhenWalletNotFound: false,
+                checkTimeout: 3000,
+            });
+
+            adapter.on('readyStateChanged', () => {
+                log('readyState: ', adapter.readyState);
+            });
+            adapter.on('connect', () => {
+                log('connect2222: ', adapter.address);
+                address = adapter.address;
+                adapter
+                    .network()
+                    .then((res) => {
+                        log(res);
+                    })
+                    .catch((e) => {
+                        log(e);
+                    });
+            });
+            adapter.on('stateChanged', (state) => {
+                log('stateChanged: ', state);
+            });
+            adapter.on('accountsChanged', (data, preaddr) => {
+                log('accountsChanged: current', data, ' pre: ', preaddr);
+            });
+
+            adapter.on('chainChanged', (data) => {
+                log('chainChanged: ', data);
+            });
+
+            adapter.on('disconnect', () => {
+                log('disconnect');
+            });
+
+            const connectBtn = document.querySelector('#connectBtn');
+            const disconnectBtn = document.querySelector('#disconnectBtn');
+            const signMessageBtn = document.querySelector('#signMessageBtn');
+            const signTransactionBtn = document.querySelector('#signTransactionBtn');
+
+            connectBtn.addEventListener('click', onConnect);
+            disconnectBtn.addEventListener('click', onDisconnect);
+            signMessageBtn.addEventListener('click', onSignMessage);
+            signTransactionBtn.addEventListener('click', onSignTransaction);
+
+            async function onConnect() {
+                const res = await adapter.connect();
+                log('connect successfully: ', adapter.address);
+                address = adapter.address;
+            }
+
+            async function onDisconnect() {
+                await adapter.disconnect();
+                log('disconnect successfully ');
+                address = undefined;
+            }
+
+            async function onSignMessage() {
+                const m = 'Hello world';
+                const res = await adapter.signMessage(m);
+                log('sign message successfully: ', res);
+                const address = await tronWeb.trx.verifyMessageV2(m, res);
+                log('verify successfully');
+            }
+
+            async function onSignTransaction() {
+                const transaction = await tronWeb.transactionBuilder.sendTrx(receiver, tronWeb.toSun(0.1), adapter.address);
+                const signedTransaction = await adapter.signTransaction(transaction);
+                const res = await tronWeb.trx.sendRawTransaction(signedTransaction);
+                log('send successfully.');
+            }
+        </script>
+    </body>
+</html>