Merge branch 'dev' into 0.x

.changeset/config.json

@@ -7,5 +7,5 @@
   "access": "public",
   "baseBranch": "0.x",
   "updateInternalDependencies": "patch",
-  "ignore": ["example-nextjs", "example-vite", "example-test", "website"]
+  "ignore": ["example-nextjs", "example-vite", "website"]
 }

.changeset/late-birds-compare.md

@@ -0,0 +1,5 @@
+---
+'@totejs/walletkit': patch
+---
+
+Fixed `WalletConnect` automatic connection issue in the follow scenario: connect the WalletConnect -> close browser -> reopen browser -> disconnect -> select WalletConnect, will automatically connect.

.changeset/pre.json

@@ -0,0 +1,11 @@
+{
+  "mode": "pre",
+  "tag": "alpha",
+  "initialVersions": {
+    "example-nextjs": "0.0.1",
+    "example-vite": "0.0.1",
+    "@totejs/walletkit": "1.0.7-alpha.1",
+    "website": "0.0.1"
+  },
+  "changesets": []
+}

.eslintignore

@@ -1,4 +1,4 @@
 .next
 dist
 CHANGELOG.md
-build.cjs
+.changeset/*.md

.github/actions/setup/action.yaml

@@ -0,0 +1,25 @@
+name: 'setup'
+description: Prepare the environment
+
+runs:
+  using: composite
+  steps:
+    - name: Setup node.js
+      uses: actions/setup-node@v3
+      with:
+        node-version: 16
+
+    - name: Setup pnpm
+      uses: pnpm/action-setup@v2
+      id: pnpm-install
+      with:
+        version: 8
+        run_install: false
+
+    - name: Setup pnpm config
+      shell: bash
+      run: pnpm config set store-dir .pnpm-store
+
+    - name: Install dependencies
+      shell: bash
+      run: pnpm install

.github/workflows/docs.yaml

@@ -0,0 +1,38 @@
+name: Deploy docs
+on:
+  push:
+    branches:
+      - main
+      - alpha
+
+jobs:
+  release:
+    name: deploy docs
+    if: github.repository == 'node-real/walletkit'
+    timeout-minutes: 10
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code repository
+        uses: actions/checkout@v3
+        with:
+          fetch-depth: 0
+
+      - uses: ./.github/actions/setup
+
+      - name: Build docs
+        run: pnpm build:docs
+
+      - name: Redirect
+        run: |
+          mkdir -p ./website/dist/website/dist
+          cat << EOF > "./website/dist/website/dist/index.html"
+            <script>window.location.href='https://node-real.github.io/walletkit'</script>
+          EOF
+
+      - name: Deploy docs
+        uses: JamesIves/github-pages-deploy-action@v4
+        with:
+          folder: ./website/dist
+          branch: 'docs'
+          clean: true
+          force: true

.github/workflows/release.yaml

@@ -3,35 +3,26 @@ on:
   push:
     branches:
       - main
+      - alpha
       - 0.x
-
-env:
-  CI: true
-  PNPM_CACHE_FOLDER: .pnpm-store
+      - 0.x-alpha
 
 jobs:
   release:
     name: release
     if: github.repository == 'node-real/walletkit'
-    timeout-minutes: 15
+    timeout-minutes: 10
     runs-on: ubuntu-latest
     steps:
       - name: Checkout code repository
         uses: actions/checkout@v3
         with:
           fetch-depth: 0
 
-      - name: Setup node.js
-        uses: actions/setup-node@v3
-        with:
-          node-version: 16
+      - uses: ./.github/actions/setup
 
-      - name: Setup pnpm
-        uses: pnpm/action-setup@v2
-        id: pnpm-install
-        with:
-          version: 8
-          run_install: false
+      - name: Build packages
+        run: pnpm build
 
       - name: Creating .npmrc
         run: |
@@ -41,15 +32,6 @@ jobs:
         env:
           NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
 
-      - name: Setup pnpm config
-        run: pnpm config set store-dir $PNPM_CACHE_FOLDER
-
-      - name: Install dependencies
-        run: pnpm install
-
-      - name: Build packages
-        run: pnpm --filter "@totejs/**" build
-
       - name: Create and publish versions
         uses: changesets/action@v1
         with:

.prettierignore

@@ -1,3 +1,4 @@
 .next
 dist
-CHANGELOG.md
+CHANGELOG.md
+.changeset/*.md

CONTRIBUTING.md

@@ -27,7 +27,7 @@ pnpm install
 pnpm dev
 ```
 
-In default, this will run the [test example](./examples/test/), you can use this example for
+In default, this will run a [vite example](./packages/walletkit/dev), you can use this example for
 development and debugging. Any changes in `packages/walletkit` will trigger a refresh.
 
 ## Coding standards
@@ -68,9 +68,9 @@ Then you can add it to project by following steps:
 2. Create an icon file `icon.tsx`:
 
 ```tsx
-export const TrustWalletLightIcon = (props: React.SVGProps<SVGSVGElement>) => {
+export const TrustWalletLightIcon = (props: SVGIconProps) => {
   return (
-    <svg width="52" height="52" viewBox="0 0 52 52">
+    <svg width="52" height="52" viewBox="0 0 52 52" {...props}>
       ...
     </svg>
   )
@@ -84,8 +84,8 @@ import { Chain } from 'wagmi';
 import {
   TrustWalletDarkIcon,
   TrustWalletLightIcon,
-  TrustWalletMobileDarkIcon,
-  TrustWalletMobileLightIcon,
+  TrustWalletTransparentDarkIcon,
+  TrustWalletTransparentLightIcon,
 } from './icon';
 import { PartialWalletProps, WalletProps } from '../types';
 import { TrustWalletConnector, TrustWalletConnectorOptions } from '../trustWallet/connector';
@@ -127,7 +127,7 @@ export function trustWallet(props: TrustWalletProps = {}): WalletProps {
         },
       });
     },
-    getUri: () => {
+    getDeepLink: () => {
       const dappPath = `https://link.trustwallet.com/open_url?coin_id=60&url=${encodeURIComponent(
         window.location.href,
       )}`;
@@ -156,15 +156,17 @@ export interface WalletProps {
   name: string;
   logos: {
     default: ReactElement | { [x in ColorMode]: ReactElement };
-    mobile?: ReactElement | { [x in ColorMode]: ReactElement };
+    transparent?: ReactElement | { [x in ColorMode]: ReactElement };
   };
   downloadUrls: {
     default: string | undefined;
   };
   spinnerColor?: string;
+  showQRCode?: boolean;
   installed: boolean | undefined;
   createConnector: (chains: Chain[]) => Connector;
-  getUri: () => string | undefined;
+  getDeepLink: () => string | undefined;
+  getQRCodeUri?: (uri: string) => string;
 }
 ```
 

README.md

@@ -10,14 +10,14 @@ WalletKit is a React component library for easily connecting a wallet to your dA
 
 ## Documentation
 
-For full documentation, visit [here](https://node-real.github.io/walletkit/website/dist/#/index).
+For full documentation, visit [here](https://node-real.github.io/walletkit).
 
 ## Examples
 
 The following examples are provided in the [examples](./examples/) folder of this repo.
 
-- [nextjs](https://github.com/node-real/walletkit/tree/main/examples/nextjs)
-- [vite](https://github.com/node-real/walletkit/tree/main/examples/vite)
+- [nextjs](./examples/nextjs/)
+- [vite](./examples/vite/)
 
 ## Installation
 

examples/nextjs/package.json

@@ -10,17 +10,17 @@
     "lint": "next lint"
   },
   "dependencies": {
-    "react": "^18",
-    "react-dom": "^18",
-    "next": "^13",
     "@totejs/walletkit": "workspace:*",
-    "wagmi": "^0",
-    "ethers": "^5"
+    "ethers": "^5.7.2",
+    "next": "^13.5.6",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "wagmi": "^0.12.19"
   },
   "devDependencies": {
-    "typescript": "^5",
-    "@types/node": "^20",
-    "@types/react": "^18",
-    "@types/react-dom": "^18"
+    "@types/node": "^20.10.1",
+    "@types/react": "^18.2.39",
+    "@types/react-dom": "^18.2.17",
+    "typescript": "^5.3.2"
   }
 }

examples/nextjs/pages/_app.tsx

@@ -27,16 +27,13 @@ const client = createClient(
 );
 
 const options: WalletKitOptions = {
-  initialChainId: 56,
+  initialChainId: 1,
 };
 
 export default function App({ Component, pageProps }: AppProps) {
   return (
     <WagmiConfig client={client}>
-      <WalletKitProvider
-        options={options}
-        mode="light"
-      >
+      <WalletKitProvider options={options} mode="light">
         <WalletKitButton />
         <Component {...pageProps} />
         <SwitchNetworkModal />