Version Packages (#883 )

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
[Auth] Add useAuth back to @thirdweb-dev/react (#922 )
2023-04-20 21:57:14 -07:00 · 2023-04-19 20:05:51 +00:00 · 2023-04-18 23:40:50 +00:00 · 2023-04-18 21:01:57 +00:00 · 2023-04-18 19:14:05 +00:00 · 2023-04-18 17:33:01 +00:00
166 changed files with 5223 additions and 1040 deletions
@@ -1,5 +1,46 @@
 # @thirdweb-dev/auth

+## 3.0.15
+
+### Patch Changes
+
+- [#874](https://github.com/thirdweb-dev/js/pull/874) [`49922de9`](https://github.com/thirdweb-dev/js/commit/49922de9d9c1258e58a3a05e656b229db469b1dd) Thanks [@iketw](https://github.com/iketw)! - [RN] Adds Auth to React Native
+
+  - Adds an optional `secureStorage` to authConfig
+  - Adds `expo-secure-store` to store the JWT token securely in React Native, passing a default value
+  - Stores the token in secure storage to be accessed by subsequent calls
+  - Returns the token in `useLogin` to be used by the user
+
+  How I tested:
+
+  - Tested in Android/iOS/Web
+
+  Usage:
+
+  ```
+  <ThirdwebProvider
+        activeChain="ethereum"
+        supportedWallets={[metamaskWallet(), rainbowWallet()]}
+        authConfig={{
+          domain: https://your-domain.com,
+          authUrl: '/api/auth',
+        }}>
+        <AppInner />
+      </ThirdwebProvider>
+  ```
+
+  ```
+  const { login } = useLogin();
+  const { logout } = useLogout();
+  const { user, isLoggedIn } = useUser();
+  ...
+
+  const token = await login();
+  ```
+
+- Updated dependencies [[`4acb2b55`](https://github.com/thirdweb-dev/js/commit/4acb2b5561118dde5c7372400d4d754b879aef2e), [`82bea3fa`](https://github.com/thirdweb-dev/js/commit/82bea3fa10294eb3c5c7327fb047e3d1b2c62ff9), [`664d1cd0`](https://github.com/thirdweb-dev/js/commit/664d1cd0dd03f32337c2cf532f0ad860e5aa5ea8), [`c2fec930`](https://github.com/thirdweb-dev/js/commit/c2fec930520e2df89532ec0027ead4563c7708cf)]:
+  - @thirdweb-dev/[email protected]
+
 ## 3.0.14

 ### Patch Changes
@@ -1,6 +1,6 @@
 {
  "name": "@thirdweb-dev/auth",
-  "version": "3.0.14",
+  "version": "3.0.15",
  "main": "dist/thirdweb-dev-auth.cjs.js",
  "module": "dist/thirdweb-dev-auth.esm.js",
  "browser": {
@@ -60,7 +60,8 @@
    "lint": "eslint src/",
    "fix": "eslint src/ --fix",
    "clean": "rm -rf dist/ && rm -rf node_modules/",
-    "test": "mocha --config './test/.mocharc.json' --timeout 30000 --parallel './test/**/*.test.ts'"
+    "test": "mocha --config './test/.mocharc.json' --timeout 30000 --parallel './test/**/*.test.ts'",
+    "push": "yalc push"
  },
  "preconstruct": {
    "entrypoints": [
@@ -49,9 +49,7 @@ export class ThirdwebAuth {
      address: await this.wallet.getAddress(),
      statement: parsedOptions?.statement,
      version: parsedOptions?.version,
-      uri:
-        parsedOptions?.uri ||
-        (isBrowser() ? window.location.origin : undefined),
+      uri: parsedOptions?.uri,
      chain_id: chainId,
      nonce: parsedOptions?.nonce,
      expiration_time:
@@ -1,5 +1,13 @@
 # @thirdweb-dev/chains

+## 0.1.12
+
+### Patch Changes
+
+- [#896](https://github.com/thirdweb-dev/js/pull/896) [`a6610f12`](https://github.com/thirdweb-dev/js/commit/a6610f1211e9359885b948bf69a66d834707ec07) Thanks [@atharvadeosthale](https://github.com/atharvadeosthale)! - Added links to portal
+
+- [#903](https://github.com/thirdweb-dev/js/pull/903) [`77224646`](https://github.com/thirdweb-dev/js/commit/77224646d542db3171394d744b455497cd057633) Thanks [@joaquim-verges](https://github.com/joaquim-verges)! - new chains
+
 ## 0.1.11

 ### Patch Changes
@@ -0,0 +1,37 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "Chaos (SKALE Testnet)",
+  "title": "Chaos Testnet",
+  "chain": "staging-fast-active-bellatrix",
+  "rpc": [
+    "https://chaos-skale-testnet.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://staging-v3.skalenodes.com/v1/staging-fast-active-bellatrix"
+  ],
+  "faucets": [
+    "https://sfuel.skale.network/staging/chaos"
+  ],
+  "nativeCurrency": {
+    "name": "sFUEL",
+    "symbol": "sFUEL",
+    "decimals": 18
+  },
+  "infoURL": "https://docs.skale.network/develop/",
+  "shortName": "chaos-tenet",
+  "chainId": 1351057110,
+  "networkId": 1351057110,
+  "explorers": [
+    {
+      "name": "Blockscout",
+      "url": "https://staging-fast-active-bellatrix.explorer.staging-v3.skalenodes.com",
+      "icon": {
+        "url": "ipfs://QmbYYCoU2G4LUfRr9ofGowF3eatfvWv9FiPVhqKndZeqwA",
+        "width": 400,
+        "height": 400,
+        "format": "png"
+      },
+      "standard": "EIP3091"
+    }
+  ],
+  "testnet": true,
+  "slug": "chaos-skale-testnet"
+} as const satisfies Chain;
@@ -0,0 +1,34 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "Zafirium Mainnet",
+  "chain": "ZAFIC",
+  "icon": {
+    "url": "ipfs://QmZT1Wq3P4YbgKBSUmCtgbs5ijPF5d91BzaMPh7Aub8d8t",
+    "width": 192,
+    "height": 192,
+    "format": "png"
+  },
+  "rpc": [
+    "https://zafirium.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://mainnet.zakumi.io"
+  ],
+  "faucets": [],
+  "nativeCurrency": {
+    "name": "Zakumi Chain Native Token",
+    "symbol": "ZAFIC",
+    "decimals": 18
+  },
+  "infoURL": "https://www.zakumi.io",
+  "shortName": "zafic",
+  "chainId": 1369,
+  "networkId": 1369,
+  "explorers": [
+    {
+      "name": "zafirium-explorer",
+      "url": "https://explorer.zakumi.io",
+      "standard": "none"
+    }
+  ],
+  "testnet": false,
+  "slug": "zafirium"
+} as const satisfies Chain;
@@ -0,0 +1,43 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "EOS EVM Network Testnet",
+  "chain": "EOS",
+  "icon": {
+    "url": "ipfs://QmXkK5D5GWizvY1FmL6pV8cYLAbhehKETubktCgh6qDJZb",
+    "width": 500,
+    "height": 750,
+    "format": "png"
+  },
+  "rpc": [
+    "https://eos-evm-network-testnet.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://api.testnet.evm.eosnetwork.com"
+  ],
+  "faucets": [],
+  "nativeCurrency": {
+    "name": "EOS",
+    "symbol": "EOS",
+    "decimals": 18
+  },
+  "infoURL": "https://eosnetwork.com/eos-evm",
+  "shortName": "eos-testnet",
+  "chainId": 15557,
+  "networkId": 15557,
+  "explorers": [
+    {
+      "name": "EOS EVM Explorer",
+      "url": "https://explorer.testnet.evm.eosnetwork.com",
+      "standard": "EIP3091"
+    }
+  ],
+  "parent": {
+    "type": "L2",
+    "chain": "eip155-1",
+    "bridges": [
+      {
+        "url": "https://bridge.testnet.evm.eosnetwork.com"
+      }
+    ]
+  },
+  "testnet": true,
+  "slug": "eos-evm-network-testnet"
+} as const satisfies Chain;
@@ -0,0 +1,34 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "OEBlock Testnet",
+  "chain": "OEBt",
+  "rpc": [
+    "https://oeblock-testnet.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://testnet-rpc.oeblock.com/"
+  ],
+  "faucets": [],
+  "nativeCurrency": {
+    "name": "OEBlock",
+    "symbol": "OEB",
+    "decimals": 18
+  },
+  "infoURL": "https://www.oeblock.com/",
+  "shortName": "obe",
+  "chainId": 156,
+  "networkId": 156,
+  "icon": {
+    "url": "ipfs://QmdoQUfYqtkWMfjtoPv2KWDY4MxDDSsyWgwXtCx6jfkezz",
+    "width": 155,
+    "height": 177,
+    "format": "png"
+  },
+  "explorers": [
+    {
+      "name": "OEScan explorer",
+      "url": "https://testnet.oescan.io",
+      "standard": "EIP3091"
+    }
+  ],
+  "testnet": true,
+  "slug": "oeblock-testnet"
+} as const satisfies Chain;
@@ -0,0 +1,51 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "Horizen Gobi Testnet",
+  "shortName": "Gobi",
+  "chain": "Gobi",
+  "icon": {
+    "url": "ipfs://QmSFMBk3rMyu45Sy9KQHjgArFj4HdywANNYrSosLMUdcti",
+    "width": 1213,
+    "height": 1213,
+    "format": "png"
+  },
+  "rpc": [
+    "https://horizen-gobi-testnet.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://gobi-testnet.horizenlabs.io/ethv1"
+  ],
+  "features": [
+    {
+      "name": "EIP155"
+    },
+    {
+      "name": "EIP1559"
+    }
+  ],
+  "faucets": [
+    "https://faucet.horizen.io"
+  ],
+  "nativeCurrency": {
+    "name": "Testnet Zen",
+    "symbol": "tZEN",
+    "decimals": 18
+  },
+  "infoURL": "https://horizen.io/",
+  "chainId": 1663,
+  "networkId": 1663,
+  "slip44": 121,
+  "explorers": [
+    {
+      "name": "Gobi Testnet Block Explorer",
+      "url": "https://gobi-explorer.horizen.io",
+      "icon": {
+        "url": "ipfs://QmSFMBk3rMyu45Sy9KQHjgArFj4HdywANNYrSosLMUdcti",
+        "width": 1213,
+        "height": 1213,
+        "format": "png"
+      },
+      "standard": "EIP3091"
+    }
+  ],
+  "testnet": true,
+  "slug": "horizen-gobi-testnet"
+} as const satisfies Chain;
@@ -0,0 +1,48 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "IRIShub Testnet",
+  "chain": "IRIShub",
+  "rpc": [
+    "https://irishub-testnet.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "http://34.80.202.172:8545"
+  ],
+  "features": [
+    {
+      "name": "EIP155"
+    },
+    {
+      "name": "EIP1559"
+    }
+  ],
+  "faucets": [],
+  "nativeCurrency": {
+    "name": "Eris",
+    "symbol": "ERIS",
+    "decimals": 18
+  },
+  "infoURL": "https://www.irisnet.org",
+  "shortName": "nyancat",
+  "chainId": 16688,
+  "networkId": 16688,
+  "icon": {
+    "url": "ipfs://QmRaSx7AX1VDgcqjwLgSDP4WZmKBHPdHhbjkcEEXPA2Fnc",
+    "width": 1062,
+    "height": 822,
+    "format": "png"
+  },
+  "explorers": [
+    {
+      "name": "IRISHub Testnet Cosmos Explorer (IOBScan)",
+      "url": "https://nyancat.iobscan.io",
+      "standard": "none",
+      "icon": {
+        "url": "ipfs://QmRaSx7AX1VDgcqjwLgSDP4WZmKBHPdHhbjkcEEXPA2Fnc",
+        "width": 1062,
+        "height": 822,
+        "format": "png"
+      }
+    }
+  ],
+  "testnet": true,
+  "slug": "irishub-testnet"
+} as const satisfies Chain;
@@ -0,0 +1,41 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "Palette Chain Testnet",
+  "chain": "PLT",
+  "rpc": [
+    "https://palette-chain-testnet.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://palette-opennet.com:22000"
+  ],
+  "faucets": [],
+  "nativeCurrency": {
+    "name": "Palette Token",
+    "symbol": "PLT",
+    "decimals": 18
+  },
+  "features": [],
+  "infoURL": "https://hashpalette.com/",
+  "shortName": "PCT",
+  "chainId": 17180,
+  "networkId": 17180,
+  "icon": {
+    "url": "ipfs://QmPCEGZD1p1keTT2YfPp725azx1r9Ci41hejeUuGL2whFA",
+    "width": 800,
+    "height": 800,
+    "format": "png"
+  },
+  "explorers": [
+    {
+      "name": "Palettescan",
+      "url": "https://testnet.palettescan.com",
+      "icon": {
+        "url": "ipfs://QmPCEGZD1p1keTT2YfPp725azx1r9Ci41hejeUuGL2whFA",
+        "width": 800,
+        "height": 800,
+        "format": "png"
+      },
+      "standard": "none"
+    }
+  ],
+  "testnet": true,
+  "slug": "palette-chain-testnet"
+} as const satisfies Chain;
@@ -0,0 +1,42 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "PartyChain",
+  "chain": "mainnet",
+  "rpc": [
+    "https://partychain.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://tea.mining4people.com/rpc",
+    "http://172.104.194.36:8545"
+  ],
+  "faucets": [],
+  "nativeCurrency": {
+    "name": "Grams",
+    "symbol": "GRAMS",
+    "decimals": 18
+  },
+  "infoURL": "TeaPartyCrypto.com",
+  "shortName": "TeaParty",
+  "chainId": 1773,
+  "networkId": 1773,
+  "icon": {
+    "url": "ipfs://QmerDBFoXvgev2xx9U71gAaAK4CtxaaQVaAPf9Qi6UF9MS",
+    "width": 400,
+    "height": 400,
+    "format": "jpg"
+  },
+  "status": "incubating",
+  "explorers": [
+    {
+      "name": "PartyExplorer",
+      "url": "https://partyexplorer.co",
+      "icon": {
+        "url": "ipfs://QmerDBFoXvgev2xx9U71gAaAK4CtxaaQVaAPf9Qi6UF9MS",
+        "width": 400,
+        "height": 400,
+        "format": "jpg"
+      },
+      "standard": "EIP3091"
+    }
+  ],
+  "testnet": false,
+  "slug": "partychain"
+} as const satisfies Chain;
@@ -0,0 +1,46 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "EOS EVM Network",
+  "chain": "EOS",
+  "icon": {
+    "url": "ipfs://QmXkK5D5GWizvY1FmL6pV8cYLAbhehKETubktCgh6qDJZb",
+    "width": 500,
+    "height": 750,
+    "format": "png"
+  },
+  "rpc": [
+    "https://eos-evm-network.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://api.evm.eosnetwork.com"
+  ],
+  "faucets": [],
+  "nativeCurrency": {
+    "name": "EOS",
+    "symbol": "EOS",
+    "decimals": 18
+  },
+  "infoURL": "https://eosnetwork.com/eos-evm",
+  "shortName": "eos",
+  "chainId": 17777,
+  "networkId": 17777,
+  "explorers": [
+    {
+      "name": "EOS EVM Explorer",
+      "url": "https://explorer.evm.eosnetwork.com",
+      "standard": "EIP3091"
+    }
+  ],
+  "parent": {
+    "type": "L2",
+    "chain": "eip155-1",
+    "bridges": [
+      {
+        "url": "https://bridge.evm.eosnetwork.com"
+      },
+      {
+        "url": "https://app.multichain.org"
+      }
+    ]
+  },
+  "testnet": false,
+  "slug": "eos-evm-network"
+} as const satisfies Chain;
@@ -16,19 +16,25 @@ export default {
  "shortName": "GTH",
  "chainId": 192837465,
  "networkId": 192837465,
-  "explorers": [
-    {
-      "name": "Blockscout",
-      "url": "https://explorer.gather.network",
-      "standard": "none"
-    }
-  ],
  "icon": {
    "url": "ipfs://Qmc9AJGg9aNhoH56n3deaZeUc8Ty1jDYJsW6Lu6hgSZH4S",
    "height": 512,
    "width": 512,
    "format": "png"
  },
+  "explorers": [
+    {
+      "name": "Blockscout",
+      "url": "https://explorer.gather.network",
+      "icon": {
+        "url": "ipfs://QmeoEHUVYKSJFkM9o5j62rhQqCDN5iQxPC7PtzmH77rSWR",
+        "width": 512,
+        "height": 512,
+        "format": "png"
+      },
+      "standard": "none"
+    }
+  ],
  "testnet": false,
  "slug": "gather-network"
 } as const satisfies Chain;
@@ -9,11 +9,11 @@ export default {
  "faucets": [],
  "nativeCurrency": {
    "name": "Bitcoin",
-    "symbol": "eBTC",
+    "symbol": "BTC",
    "decimals": 18
  },
  "infoURL": "https://bitcoinevm.com",
-  "shortName": "eBTC",
+  "shortName": "BTC",
  "chainId": 2203,
  "networkId": 2203,
  "icon": {
@@ -0,0 +1,24 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "Kanazawa",
+  "title": "Meld Testnet Kanazawa",
+  "chain": "MELD",
+  "rpc": [
+    "https://kanazawa.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://rpc-kanazawa.meldlabs.dev/ext/bc/2Ci7VYrUd4fTBqGA5D2HA6UPHzQ4LQyr8rZQww9MGSv9rNkRzn/rpc"
+  ],
+  "faucets": [],
+  "features": [],
+  "nativeCurrency": {
+    "name": "gMeld",
+    "symbol": "gMELD",
+    "decimals": 18
+  },
+  "infoURL": "https://meld.com",
+  "shortName": "meld",
+  "chainId": 222000222,
+  "networkId": 222000222,
+  "explorers": [],
+  "testnet": true,
+  "slug": "kanazawa"
+} as const satisfies Chain;
@@ -0,0 +1,40 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "Neonlink Mainnet",
+  "chain": "Neonlink",
+  "rpc": [
+    "https://neonlink.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://mainnet.neonlink.io"
+  ],
+  "faucets": [],
+  "nativeCurrency": {
+    "name": "Neonlink Native Token",
+    "symbol": "NEON",
+    "decimals": 18
+  },
+  "infoURL": "https://neonlink.io",
+  "shortName": "neon",
+  "chainId": 259,
+  "networkId": 259,
+  "icon": {
+    "url": "ipfs://QmX3hBv8WyvVfYjh1gmgDfJCpJBvKk4TYG9wFX9sC8WAjz",
+    "width": 512,
+    "height": 512,
+    "format": "svg"
+  },
+  "explorers": [
+    {
+      "name": "Neon Blockchain Explorer",
+      "url": "https://scan.neonlink.io",
+      "standard": "EIP3091",
+      "icon": {
+        "url": "ipfs://QmX3hBv8WyvVfYjh1gmgDfJCpJBvKk4TYG9wFX9sC8WAjz",
+        "width": 512,
+        "height": 512,
+        "format": "svg"
+      }
+    }
+  ],
+  "testnet": false,
+  "slug": "neonlink"
+} as const satisfies Chain;
@@ -0,0 +1,42 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "TTcoin Smart Chain Mainnet",
+  "chain": "TSC",
+  "icon": {
+    "url": "ipfs://QmS7ipvvyZ16weG1DM7AZbi1v9ixYwU2FjP25Jj5jkLiuf",
+    "width": 512,
+    "height": 512,
+    "format": "png"
+  },
+  "rpc": [
+    "https://ttcoin-smart-chain.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://mainnet-rpc.tscscan.com"
+  ],
+  "faucets": [
+    "https://faucet.tscscan.com"
+  ],
+  "nativeCurrency": {
+    "name": "TTcoin",
+    "symbol": "TC",
+    "decimals": 18
+  },
+  "infoURL": "https://ttcoin.info/",
+  "shortName": "tc",
+  "chainId": 330844,
+  "networkId": 330844,
+  "explorers": [
+    {
+      "name": "TTcoin Smart Chain Explorer",
+      "url": "https://tscscan.com",
+      "standard": "EIP3091",
+      "icon": {
+        "url": "ipfs://QmS7ipvvyZ16weG1DM7AZbi1v9ixYwU2FjP25Jj5jkLiuf",
+        "width": 512,
+        "height": 512,
+        "format": "png"
+      }
+    }
+  ],
+  "testnet": false,
+  "slug": "ttcoin-smart-chain"
+} as const satisfies Chain;
@@ -18,19 +18,25 @@ export default {
  "shortName": "tGTH",
  "chainId": 356256156,
  "networkId": 356256156,
-  "explorers": [
-    {
-      "name": "Blockscout",
-      "url": "https://testnet-explorer.gather.network",
-      "standard": "none"
-    }
-  ],
-  "testnet": true,
  "icon": {
    "url": "ipfs://Qmc9AJGg9aNhoH56n3deaZeUc8Ty1jDYJsW6Lu6hgSZH4S",
    "height": 512,
    "width": 512,
    "format": "png"
  },
+  "explorers": [
+    {
+      "name": "Blockscout",
+      "url": "https://testnet-explorer.gather.network",
+      "icon": {
+        "url": "ipfs://QmeoEHUVYKSJFkM9o5j62rhQqCDN5iQxPC7PtzmH77rSWR",
+        "width": 512,
+        "height": 512,
+        "format": "png"
+      },
+      "standard": "none"
+    }
+  ],
+  "testnet": true,
  "slug": "gather-testnet-network"
 } as const satisfies Chain;
@@ -0,0 +1,29 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "Markr Go",
+  "chain": "Unified",
+  "icon": {
+    "url": "ipfs://QmVMBTZVPawyLBD2B5VbG68dfWLfZ1CnB8V59xduBe2kwh",
+    "width": 84,
+    "height": 84,
+    "format": "png"
+  },
+  "rpc": [
+    "https://markr-go.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://rpc.markr.io/ext/"
+  ],
+  "faucets": [],
+  "nativeCurrency": {
+    "name": "Avalanche",
+    "symbol": "AVAX",
+    "decimals": 18
+  },
+  "infoURL": "https://www.markr.io/",
+  "shortName": "markr-go",
+  "chainId": 431140,
+  "networkId": 431140,
+  "explorers": [],
+  "status": "incubating",
+  "testnet": false,
+  "slug": "markr-go"
+} as const satisfies Chain;
@@ -0,0 +1,34 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "MXC Wannsee zkEVM Testnet",
+  "chain": "MXC zkEVM",
+  "icon": {
+    "url": "ipfs://QmdGCthKA11K9kCZJdbTP5WPAyq1wiRZ3REn6KG58MrWaE",
+    "width": 159,
+    "height": 159,
+    "format": "png"
+  },
+  "rpc": [
+    "https://mxc-wannsee-zkevm-testnet.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://wannsee-rpc.mxc.com"
+  ],
+  "faucets": [],
+  "nativeCurrency": {
+    "name": "MXC Wannsee zkEVM Testnet",
+    "symbol": "MXC",
+    "decimals": 18
+  },
+  "infoURL": "https://wannsee.mxc.com/docs/intro",
+  "shortName": "MXC",
+  "chainId": 5167003,
+  "networkId": 5167003,
+  "explorers": [
+    {
+      "name": "MXC Wannsee zkEVM Testnet",
+      "url": "https://wannsee-explorer.mxc.com",
+      "standard": "EIP3091"
+    }
+  ],
+  "testnet": true,
+  "slug": "mxc-wannsee-zkevm-testnet"
+} as const satisfies Chain;
@@ -0,0 +1,48 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "IRIShub",
+  "chain": "IRIShub",
+  "rpc": [
+    "https://irishub.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://evmrpc.irishub-1.irisnet.org"
+  ],
+  "features": [
+    {
+      "name": "EIP155"
+    },
+    {
+      "name": "EIP1559"
+    }
+  ],
+  "faucets": [],
+  "nativeCurrency": {
+    "name": "Eris",
+    "symbol": "ERIS",
+    "decimals": 18
+  },
+  "infoURL": "https://www.irisnet.org",
+  "shortName": "iris",
+  "chainId": 6688,
+  "networkId": 6688,
+  "icon": {
+    "url": "ipfs://QmTKgKs7kJiWDhdjbELE4Y2HVZ36KS4bYkNCbXdsXk66sW",
+    "width": 1062,
+    "height": 1062,
+    "format": "png"
+  },
+  "explorers": [
+    {
+      "name": "IRISHub Cosmos Explorer (IOBScan)",
+      "url": "https://irishub.iobscan.io",
+      "standard": "none",
+      "icon": {
+        "url": "ipfs://QmTKgKs7kJiWDhdjbELE4Y2HVZ36KS4bYkNCbXdsXk66sW",
+        "width": 1062,
+        "height": 1062,
+        "format": "png"
+      }
+    }
+  ],
+  "testnet": false,
+  "slug": "irishub"
+} as const satisfies Chain;
@@ -0,0 +1,21 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "Cosmic Chain",
+  "chain": "COSMIC",
+  "rpc": [
+    "https://cosmic-chain.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "http://testnet.cosmicchain.site:3344"
+  ],
+  "faucets": [],
+  "nativeCurrency": {
+    "name": "Cosmic Chain",
+    "symbol": "COSMIC",
+    "decimals": 18
+  },
+  "infoURL": "https://cosmicchain.site",
+  "shortName": "Cosmic",
+  "chainId": 67588,
+  "networkId": 3344,
+  "testnet": true,
+  "slug": "cosmic-chain"
+} as const satisfies Chain;
@@ -0,0 +1,34 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "ADIL Mainnet",
+  "chain": "ADIL",
+  "icon": {
+    "url": "ipfs://QmeHNYUx6n8CjUFSLWNT17oAtDYrUq6r8buyvGCUBXCJw6",
+    "width": 500,
+    "height": 500,
+    "format": "png"
+  },
+  "rpc": [
+    "https://adil.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://s2.adilchain-rpc.io"
+  ],
+  "faucets": [],
+  "nativeCurrency": {
+    "name": "ADIL",
+    "symbol": "ADIL",
+    "decimals": 18
+  },
+  "infoURL": "https://adilchain.io",
+  "shortName": "adil",
+  "chainId": 7576,
+  "networkId": 7576,
+  "explorers": [
+    {
+      "name": "ADIL Mainnet Explorer",
+      "url": "https://s2.adilchain-scan.io",
+      "standard": "EIP3091"
+    }
+  ],
+  "testnet": false,
+  "slug": "adil"
+} as const satisfies Chain;
@@ -1,6 +1,6 @@
 import type { Chain } from "../src/types";
 export default {
-  "name": "Qitmeer Network Mixnext",
+  "name": "Qitmeer Network Mixnet",
  "chain": "MEER",
  "rpc": [],
  "faucets": [],
@@ -21,5 +21,5 @@ export default {
  "networkId": 8132,
  "status": "incubating",
  "testnet": false,
-  "slug": "qitmeer-network-mixnext"
+  "slug": "qitmeer-network-mixnet"
 } as const satisfies Chain;
@@ -6,7 +6,7 @@ export default {
  "faucets": [],
  "nativeCurrency": {
    "name": "Amana Testnet",
-    "symbol": "MEER-t",
+    "symbol": "MEER-T",
    "decimals": 18
  },
  "infoURL": "https://github.com/Qitmeer",
@@ -6,7 +6,7 @@ export default {
  "faucets": [],
  "nativeCurrency": {
    "name": "Amana Mixnet",
-    "symbol": "MEER-m",
+    "symbol": "MEER-M",
    "decimals": 18
  },
  "infoURL": "https://github.com/Qitmeer",
@@ -6,7 +6,7 @@ export default {
  "faucets": [],
  "nativeCurrency": {
    "name": "Amana Privnet",
-    "symbol": "MEER-p",
+    "symbol": "MEER-P",
    "decimals": 18
  },
  "infoURL": "https://github.com/Qitmeer",
@@ -6,7 +6,7 @@ export default {
  "faucets": [],
  "nativeCurrency": {
    "name": "Flana Testnet",
-    "symbol": "MEER-t",
+    "symbol": "MEER-T",
    "decimals": 18
  },
  "infoURL": "https://github.com/Qitmeer",
@@ -6,7 +6,7 @@ export default {
  "faucets": [],
  "nativeCurrency": {
    "name": "Flana Mixnet",
-    "symbol": "MEER-m",
+    "symbol": "MEER-M",
    "decimals": 18
  },
  "infoURL": "https://github.com/Qitmeer",
@@ -6,7 +6,7 @@ export default {
  "faucets": [],
  "nativeCurrency": {
    "name": "Flana Privnet",
-    "symbol": "MEER-p",
+    "symbol": "MEER-P",
    "decimals": 18
  },
  "infoURL": "https://github.com/Qitmeer",
@@ -6,7 +6,7 @@ export default {
  "faucets": [],
  "nativeCurrency": {
    "name": "Mizana Testnet",
-    "symbol": "MEER-t",
+    "symbol": "MEER-T",
    "decimals": 18
  },
  "infoURL": "https://github.com/Qitmeer",
@@ -6,7 +6,7 @@ export default {
  "faucets": [],
  "nativeCurrency": {
    "name": "Mizana Mixnet",
-    "symbol": "MEER-m",
+    "symbol": "MEER-M",
    "decimals": 18
  },
  "infoURL": "https://github.com/Qitmeer",
@@ -6,7 +6,7 @@ export default {
  "faucets": [],
  "nativeCurrency": {
    "name": "Mizana Privnet",
-    "symbol": "MEER-p",
+    "symbol": "MEER-P",
    "decimals": 18
  },
  "infoURL": "https://github.com/Qitmeer",
@@ -0,0 +1,28 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "Linqto Devnet",
+  "chain": "LNQ",
+  "rpc": [
+    "https://linqto-devnet.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://linqto-dev.com"
+  ],
+  "faucets": [],
+  "nativeCurrency": {
+    "name": "XRP",
+    "symbol": "XRP",
+    "decimals": 18
+  },
+  "infoURL": "https://linqto.com",
+  "shortName": "linqto-devnet",
+  "chainId": 84,
+  "networkId": 84,
+  "explorers": [
+    {
+      "name": "Linqto Devnet Explorer",
+      "url": "https://explorer.linqto-dev.com",
+      "standard": "EIP3091"
+    }
+  ],
+  "testnet": false,
+  "slug": "linqto-devnet"
+} as const satisfies Chain;
@@ -0,0 +1,43 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "PulseChain Testnet v4",
+  "shortName": "t4pls",
+  "chain": "t4PLS",
+  "chainId": 943,
+  "networkId": 943,
+  "icon": {
+    "url": "ipfs://Qmckj9B9F3jWDk9bv9HwoPmfjrx2Ju8J2BQSNoPFdYGduj",
+    "width": 433,
+    "height": 402,
+    "format": "png"
+  },
+  "infoURL": "https://pulsechain.com",
+  "rpc": [
+    "https://pulsechain-testnet-v4.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://rpc.v4.testnet.pulsechain.com/",
+    "wss://rpc.v4.testnet.pulsechain.com/"
+  ],
+  "features": [
+    {
+      "name": "EIP155"
+    },
+    {
+      "name": "EIP1559"
+    }
+  ],
+  "faucets": [
+    "https://faucet.v4.testnet.pulsechain.com/"
+  ],
+  "ens": {
+    "registry": "0x00000000000C2E074eC69A0dFb2997BA6C7d2e1e"
+  },
+  "status": "incubating",
+  "explorers": [],
+  "nativeCurrency": {
+    "name": "Test Pulse",
+    "symbol": "tPLS",
+    "decimals": 18
+  },
+  "testnet": true,
+  "slug": "pulsechain-testnet-v4"
+} as const satisfies Chain;
@@ -0,0 +1,42 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "Neonlink Testnet",
+  "chain": "Neonlink",
+  "rpc": [
+    "https://neonlink-testnet.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://testnet.neonlink.io"
+  ],
+  "faucets": [
+    "https://faucet.neonlink.io/"
+  ],
+  "nativeCurrency": {
+    "name": "Neonlink Native Token",
+    "symbol": "tNEON",
+    "decimals": 18
+  },
+  "infoURL": "https://neonlink.io",
+  "shortName": "testneon",
+  "chainId": 9559,
+  "networkId": 9559,
+  "icon": {
+    "url": "ipfs://QmX3hBv8WyvVfYjh1gmgDfJCpJBvKk4TYG9wFX9sC8WAjz",
+    "width": 512,
+    "height": 512,
+    "format": "svg"
+  },
+  "explorers": [
+    {
+      "name": "Neon Blockchain Explorer",
+      "url": "https://testnet-scan.neonlink.io",
+      "standard": "EIP3091",
+      "icon": {
+        "url": "ipfs://QmX3hBv8WyvVfYjh1gmgDfJCpJBvKk4TYG9wFX9sC8WAjz",
+        "width": 512,
+        "height": 512,
+        "format": "svg"
+      }
+    }
+  ],
+  "testnet": true,
+  "slug": "neonlink-testnet"
+} as const satisfies Chain;
@@ -0,0 +1,28 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "Carbon EVM",
+  "chain": "Carbon",
+  "icon": {
+    "url": "ipfs://QmQUHqi1gyuTuKmJQHqt9EyhN1FPmmmLNUK8u93nMGrxAy",
+    "width": 1600,
+    "height": 1600,
+    "format": "png"
+  },
+  "rpc": [
+    "https://carbon-evm.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://evm-api.carbon.network/"
+  ],
+  "faucets": [],
+  "nativeCurrency": {
+    "name": "swth",
+    "symbol": "SWTH",
+    "decimals": 18
+  },
+  "infoURL": "https://carbon.network/",
+  "shortName": "carbon",
+  "chainId": 9790,
+  "networkId": 9790,
+  "explorers": [],
+  "testnet": false,
+  "slug": "carbon-evm"
+} as const satisfies Chain;
@@ -0,0 +1,28 @@
+import type { Chain } from "../src/types";
+export default {
+  "name": "Carbon EVM Testnet",
+  "chain": "Carbon",
+  "icon": {
+    "url": "ipfs://QmQUHqi1gyuTuKmJQHqt9EyhN1FPmmmLNUK8u93nMGrxAy",
+    "width": 1600,
+    "height": 1600,
+    "format": "png"
+  },
+  "rpc": [
+    "https://carbon-evm-testnet.rpc.thirdweb.com/${THIRDWEB_API_KEY}",
+    "https://test-evm-api.carbon.network/"
+  ],
+  "faucets": [],
+  "nativeCurrency": {
+    "name": "swth",
+    "symbol": "SWTH",
+    "decimals": 18
+  },
+  "infoURL": "https://carbon.network/",
+  "shortName": "carbon-testnet",
+  "chainId": 9792,
+  "networkId": 9792,
+  "explorers": [],
+  "testnet": true,
+  "slug": "carbon-evm-testnet"
+} as const satisfies Chain;
@@ -1,6 +1,6 @@
 {
  "name": "@thirdweb-dev/chains",
-  "version": "0.1.11",
+  "version": "0.1.12",
  "main": "dist/thirdweb-dev-chains.cjs.js",
  "module": "dist/thirdweb-dev-chains.esm.js",
  "browser": {
@@ -1,5 +1,15 @@
 # thirdweb

+## 0.10.12
+
+### Patch Changes
+
+- [#894](https://github.com/thirdweb-dev/js/pull/894) [`72db2dc3`](https://github.com/thirdweb-dev/js/commit/72db2dc3e1c63e82ba4d73b6bd5ad4b2f8bbd559) Thanks [@adam-maj](https://github.com/adam-maj)! - Add more clear error messages to thirdweb generate
+
+- Updated dependencies [[`abe88599`](https://github.com/thirdweb-dev/js/commit/abe88599b634699aa3b876fe344bfddc6c1a92d4), [`4acb2b55`](https://github.com/thirdweb-dev/js/commit/4acb2b5561118dde5c7372400d4d754b879aef2e), [`ea04edf4`](https://github.com/thirdweb-dev/js/commit/ea04edf47867617ff74f0aca1471a40b8d9c9f7c), [`77224646`](https://github.com/thirdweb-dev/js/commit/77224646d542db3171394d744b455497cd057633), [`c9ee9b32`](https://github.com/thirdweb-dev/js/commit/c9ee9b32f0a275f7c03d50243f23a7332f148ae5), [`00f4355f`](https://github.com/thirdweb-dev/js/commit/00f4355f1aa8843bb534b173e4d8e0a19dd18b47), [`a6610f12`](https://github.com/thirdweb-dev/js/commit/a6610f1211e9359885b948bf69a66d834707ec07), [`29146e00`](https://github.com/thirdweb-dev/js/commit/29146e009db655304f5753904ae7f8569c12f4ca), [`77224646`](https://github.com/thirdweb-dev/js/commit/77224646d542db3171394d744b455497cd057633), [`bfdd8493`](https://github.com/thirdweb-dev/js/commit/bfdd84939d7cf9c6635b83c971bcc8967b52538c)]:
+  - @thirdweb-dev/sdk@3.10.11
+  - @thirdweb-dev/chains@0.1.12
+
 ## 0.10.11

 ### Patch Changes
@@ -1,7 +1,7 @@
 {
  "name": "thirdweb",
  "main": "dist/cli/index.js",
-  "version": "0.10.11",
+  "version": "0.10.12",
  "repository": "https://github.com/thirdweb-dev/js/tree/main/packages/cli",
  "author": "thirdweb eng <[email protected]>",
  "license": "Apache-2.0",
@@ -412,10 +412,6 @@ const main = async () => {
      "Preload ABIs and generate types for your smart contract to strongly type the thirdweb SDK",
    )
    .option("-p, --path <project-path>", "path to project", ".")
-    .option(
-      "-d, --deployer <deployer-address>",
-      "address of the contract deployer",
-    )
    .action(async (options) => {
      await generate(options);
    });
@@ -5,7 +5,7 @@ import {
  getChainProvider,
 } from "@thirdweb-dev/sdk";
 import { ThirdwebStorage } from "@thirdweb-dev/storage";
-import { spinner, info } from "../core/helpers/logger";
+import { info } from "../core/helpers/logger";
 import { allChains } from "@thirdweb-dev/chains";
 import fs from "fs";
 import prompts from "prompts";
@@ -95,9 +95,7 @@ export async function generate(options: GenerateOptions) {
  }

  // Attempt to download the ABI for each contract
-  const abiSpinner = spinner(
-    `Downloading ABIs for contracts configured in 'thirdweb.json'`,
-  );
+  ora(`Downloading ABIs for contracts configured in 'thirdweb.json'`).info();
  const storage = new ThirdwebStorage();
  const metadata: {
    address: string;
@@ -115,6 +113,9 @@ export async function generate(options: GenerateOptions) {
        );
      } catch {
        // If metadata for a contract fails, just go onto the next one
+        ora(
+          `Unable to download ABI for contract ${contract.address}, skipping.`,
+        ).warn();
        return;
      }

@@ -128,9 +129,10 @@ export async function generate(options: GenerateOptions) {
  // Store the ABIs in the the SDKs ABI cache files
  const packagePath = `${projectPath}/node_modules/@thirdweb-dev/generated-abis/dist`;
  if (!fs.existsSync(packagePath)) {
-    throw new Error(
-      `Unable to cache ABIs. Please ensure that you're using the latest @thirdweb-dev/sdk package`,
-    );
+    ora(
+      `Unable to cache ABIs. Please ensure that you have the latest @thirdweb-dev/sdk package installed.`,
+    ).fail();
+    process.exit(1);
  }

  const filePaths = [
@@ -176,11 +178,11 @@ export async function generate(options: GenerateOptions) {
    fs.writeFileSync(typeFilePath, updatedFile);
  }

-  abiSpinner.succeed(
-    `Downloaded and cached ABIs for ${contracts.length} smart contract${
-      contracts.length === 1 ? "" : "s"
+  ora(
+    `Downloaded and cached ABIs for ${metadata.length} smart contract${
+      metadata.length === 1 ? "" : "s"
    }`,
-  );
+  ).succeed();

  // Add generate command to postinstall
  const packageJsonPath = `${projectPath}/package.json`;
@@ -25,5 +25,8 @@
  "sideEffects": false,
  "files": [
    "dist/"
-  ]
+  ],
+  "scripts": {
+    "push": "yalc push"
+  }
 }
@@ -1,5 +1,58 @@
 # @thirdweb-dev/react-core

+## 3.11.8
+
+### Patch Changes
+
+- [#874](https://github.com/thirdweb-dev/js/pull/874) [`49922de9`](https://github.com/thirdweb-dev/js/commit/49922de9d9c1258e58a3a05e656b229db469b1dd) Thanks [@iketw](https://github.com/iketw)! - [RN] Adds Auth to React Native
+
+  - Adds an optional `secureStorage` to authConfig
+  - Adds `expo-secure-store` to store the JWT token securely in React Native, passing a default value
+  - Stores the token in secure storage to be accessed by subsequent calls
+  - Returns the token in `useLogin` to be used by the user
+
+  How I tested:
+
+  - Tested in Android/iOS/Web
+
+  Usage:
+
+  ```
+  <ThirdwebProvider
+        activeChain="ethereum"
+        supportedWallets={[metamaskWallet(), rainbowWallet()]}
+        authConfig={{
+          domain: https://your-domain.com,
+          authUrl: '/api/auth',
+        }}>
+        <AppInner />
+      </ThirdwebProvider>
+  ```
+
+  ```
+  const { login } = useLogin();
+  const { logout } = useLogout();
+  const { user, isLoggedIn } = useUser();
+  ...
+
+  const token = await login();
+  ```
+
+- [#892](https://github.com/thirdweb-dev/js/pull/892) [`4acb2b55`](https://github.com/thirdweb-dev/js/commit/4acb2b5561118dde5c7372400d4d754b879aef2e) Thanks [@MananTank](https://github.com/MananTank)! - Add Switch Account button for MetaMask
+
+- [#896](https://github.com/thirdweb-dev/js/pull/896) [`a6610f12`](https://github.com/thirdweb-dev/js/commit/a6610f1211e9359885b948bf69a66d834707ec07) Thanks [@atharvadeosthale](https://github.com/atharvadeosthale)! - Added links to portal
+
+- [#895](https://github.com/thirdweb-dev/js/pull/895) [`06cc1df3`](https://github.com/thirdweb-dev/js/commit/06cc1df3b7906584c9e2e69fddc4a2d831c237f9) Thanks [@MananTank](https://github.com/MananTank)! - Fix supportedChains not having the activeChain for wallets
+
+- [#887](https://github.com/thirdweb-dev/js/pull/887) [`430a5f79`](https://github.com/thirdweb-dev/js/commit/430a5f793419173775a434e0b2a21f70223e3813) Thanks [@MananTank](https://github.com/MananTank)! - export Configurable NetworkSelector
+
+- [#922](https://github.com/thirdweb-dev/js/pull/922) [`477324ec`](https://github.com/thirdweb-dev/js/commit/477324ec85b800dcbc54b709430c77fb63b16537) Thanks [@adam-maj](https://github.com/adam-maj)! - Add useAuth back to react-core
+
+- Updated dependencies [[`abe88599`](https://github.com/thirdweb-dev/js/commit/abe88599b634699aa3b876fe344bfddc6c1a92d4), [`4acb2b55`](https://github.com/thirdweb-dev/js/commit/4acb2b5561118dde5c7372400d4d754b879aef2e), [`82bea3fa`](https://github.com/thirdweb-dev/js/commit/82bea3fa10294eb3c5c7327fb047e3d1b2c62ff9), [`ea04edf4`](https://github.com/thirdweb-dev/js/commit/ea04edf47867617ff74f0aca1471a40b8d9c9f7c), [`77224646`](https://github.com/thirdweb-dev/js/commit/77224646d542db3171394d744b455497cd057633), [`c9ee9b32`](https://github.com/thirdweb-dev/js/commit/c9ee9b32f0a275f7c03d50243f23a7332f148ae5), [`00f4355f`](https://github.com/thirdweb-dev/js/commit/00f4355f1aa8843bb534b173e4d8e0a19dd18b47), [`a6610f12`](https://github.com/thirdweb-dev/js/commit/a6610f1211e9359885b948bf69a66d834707ec07), [`29146e00`](https://github.com/thirdweb-dev/js/commit/29146e009db655304f5753904ae7f8569c12f4ca), [`77224646`](https://github.com/thirdweb-dev/js/commit/77224646d542db3171394d744b455497cd057633), [`664d1cd0`](https://github.com/thirdweb-dev/js/commit/664d1cd0dd03f32337c2cf532f0ad860e5aa5ea8), [`bfdd8493`](https://github.com/thirdweb-dev/js/commit/bfdd84939d7cf9c6635b83c971bcc8967b52538c), [`c2fec930`](https://github.com/thirdweb-dev/js/commit/c2fec930520e2df89532ec0027ead4563c7708cf)]:
+  - @thirdweb-dev/[email protected]
+  - @thirdweb-dev/[email protected]
+  - @thirdweb-dev/[email protected]
+
 ## 3.11.7

 ### Patch Changes
@@ -1,6 +1,6 @@
 {
  "name": "@thirdweb-dev/react-core",
-  "version": "3.11.7",
+  "version": "3.11.8",
  "repository": "https://github.com/thirdweb-dev/js/tree/main/packages/react-core",
  "author": "thirdweb eng <[email protected]>",
  "license": "Apache-2.0",
@@ -0,0 +1 @@
+export const AUTH_TOKEN_STORAGE_KEY = "auth_token_storage_key";
@@ -67,9 +67,34 @@ export const ThirdwebProviderCore = <TChains extends Chain[]>({
  createWalletStorage = createAsyncLocalStorage,
  ...props
 }: React.PropsWithChildren<ThirdwebProviderCoreProps<TChains>>) => {
+  const { activeChain } = props;
+
  const supportedChainsNonNull = useMemo(() => {
-    return props.supportedChains || (defaultChains as any as TChains);
-  }, [props.supportedChains]);
+    const isActiveChainObject =
+      typeof activeChain === "object" && activeChain !== null;
+
+    if (!isActiveChainObject) {
+      return props.supportedChains || defaultChains;
+    }
+
+    if (!props.supportedChains) {
+      return [...defaultChains, activeChain];
+    }
+
+    const isActiveChainInSupportedChains = props.supportedChains.find(
+      (c) => c.chainId === activeChain.chainId,
+    );
+
+    // if activeChain is not in supportedChains - add it
+    if (!isActiveChainInSupportedChains) {
+      return [...props.supportedChains, activeChain];
+    }
+
+    // if active chain is in supportedChains - replace it with object in activeChain
+    return props.supportedChains.map((c) =>
+      c.chainId === activeChain.chainId ? activeChain : c,
+    );
+  }, [props.supportedChains, activeChain]);

  const [supportedChainsWithKey, activeChainIdOrObjWithKey] =
    useUpdateChainsWithApiKeys(
@@ -5,8 +5,12 @@ import { getChainRPCs, ChainRPCOptions, Chain } from "@thirdweb-dev/chains";
 * use the keys and return a new chain object with updated RPCs
 */
 export const updateChainRPCs = (chain: Chain, options: ChainRPCOptions) => {
-  return {
-    ...chain,
-    rpc: getChainRPCs(chain, options),
-  };
+  try {
+    return {
+      ...chain,
+      rpc: getChainRPCs(chain, options),
+    };
+  } catch (error) {
+    return chain;
+  }
 };
@@ -5,6 +5,12 @@ import React, {
  useMemo,
 } from "react";

+export interface ISecureStorage {
+  getItem(key: string): Promise<string | null>;
+  setItem(key: string, value: string): Promise<void>;
+  removeItem(key: string): Promise<void>;
+}
+
 /**
 * The configuration to use the react SDK with an [auth](https://portal.thirdweb.com/auth) server.
 *
@@ -22,6 +28,17 @@ export interface ThirdwebAuthConfig {
   * This domain should match the domain used on your auth backend.
   */
  domain: string;
+
+  /**
+   * Secure storage to use for storing the auth token when using JWT tokens.
+   * 
+   * Do not use a storage option that stores values accessible outside 
+   * your aplication (like localStorage on web environments) since you may 
+   * be exposing your auth token to malicious actors.
+   * 
+   * ** By default auth uses cookies so no need to set this unless you want to specifically use JWT tokens **
+   */
+  secureStorage?: ISecureStorage;
 }

 interface ThirdwebAuthContext extends ThirdwebAuthConfig {}
@@ -65,6 +65,7 @@ export type SetClaimConditionsParams = {
 * @param tokenId - the id of the token to fetch the claim conditions for (if the contract is an ERC1155 contract)
 * @returns a response object with the currently active claim condition
 * @twfeature ERC20ClaimPhasesV2 | ERC20ClaimPhasesV1 | ERC20ClaimConditionsV2 | ERC20ClaimConditionsV1 | ERC721ClaimPhasesV2 | ERC721ClaimPhasesV1 | ERC721ClaimConditionsV2 | ERC721ClaimConditionsV1 | ERC1155ClaimPhasesV2 | ERC1155ClaimPhasesV1 | ERC1155ClaimConditionsV2 | ERC1155ClaimConditionsV1
+ * @see {@link https://portal.thirdweb.com/react/react.useactiveclaimcondition?utm_source=sdk | Documentation}
 * @beta
 */
 export function useActiveClaimCondition(
@@ -120,6 +121,7 @@ export function useActiveClaimCondition(
 * @param claimConditionId - optional the claim condition id to get the proofs for
 * @returns a response object with the snapshot for the provided address
 * @twfeature ERC20ClaimPhasesV2 | ERC20ClaimPhasesV1 | ERC20ClaimConditionsV2 | ERC20ClaimConditionsV1 | ERC721ClaimPhasesV2 | ERC721ClaimPhasesV1 | ERC721ClaimConditionsV2 | ERC721ClaimConditionsV1 | ERC1155ClaimPhasesV2 | ERC1155ClaimPhasesV1 | ERC1155ClaimConditionsV2 | ERC1155ClaimConditionsV1
+ * @see {@link https://portal.thirdweb.com/react/react.useclaimerproofs?utm_source=sdk | Documentation}
 * @beta
 */
 export function useClaimerProofs(
@@ -183,6 +185,7 @@ export function useClaimerProofs(
 * @param tokenId - the id of the token to fetch the claim conditions for (if the contract is an ERC1155 contract)
 * @returns a response object with the list of claim conditions
 * @twfeature ERC20ClaimPhasesV2 | ERC20ClaimPhasesV1 | ERC20ClaimConditionsV2 | ERC20ClaimConditionsV1 | ERC721ClaimPhasesV2 | ERC721ClaimPhasesV1 | ERC721ClaimConditionsV2 | ERC721ClaimConditionsV1 | ERC1155ClaimPhasesV2 | ERC1155ClaimPhasesV1 | ERC1155ClaimConditionsV2 | ERC1155ClaimConditionsV1
+ * @see {@link https://portal.thirdweb.com/react/react.useclaimconditions?utm_source=sdk | Documentation}
 * @beta
 */
 export function useClaimConditions(
@@ -237,6 +240,7 @@ export function useClaimConditions(
 * @param tokenId - the id of the token to fetch the claim conditions for (if the contract is an ERC1155 contract)
 * @returns a response object with the reasons for the claim ineligibility
 * @twfeature ERC20ClaimPhasesV2 | ERC20ClaimPhasesV1 | ERC20ClaimConditionsV2 | ERC20ClaimConditionsV1 | ERC721ClaimPhasesV2 | ERC721ClaimPhasesV1 | ERC721ClaimConditionsV2 | ERC721ClaimConditionsV1 | ERC1155ClaimPhasesV2 | ERC1155ClaimPhasesV1 | ERC1155ClaimConditionsV2 | ERC1155ClaimConditionsV1
+ * @see {@link https://portal.thirdweb.com/react/react.useclaimineligibilityreasons?utm_source=sdk | Documentation}
 * @beta
 */
 export function useClaimIneligibilityReasons(
@@ -306,7 +310,7 @@ export function useClaimIneligibilityReasons(
 * @param tokenId - the id of the token to fetch the claim conditions for (if the contract is an ERC1155 contract)
 * @returns the active claim conditon for the wallet address or null if there is no active claim condition
 * @twfeature ERC20ClaimPhasesV2 | ERC20ClaimPhasesV1 | ERC20ClaimConditionsV2 | ERC20ClaimConditionsV1 | ERC721ClaimPhasesV2 | ERC721ClaimPhasesV1 | ERC721ClaimConditionsV2 | ERC721ClaimConditionsV1 | ERC1155ClaimPhasesV2 | ERC1155ClaimPhasesV1 | ERC1155ClaimConditionsV2 | ERC1155ClaimConditionsV1
- *
+ * @see {@link https://portal.thirdweb.com/react/react.useactiveclaimconditionforwallet?utm_source=sdk | Documentation}
 * @beta
 */
 export function useActiveClaimConditionForWallet(
@@ -462,6 +466,7 @@ export function useActiveClaimConditionForWallet(
 * @param contract - an instance of a {@link DropContract}
 * @returns a mutation object that can be used to set claim conditions
 * @twfeature ERC20ClaimPhasesV2 | ERC20ClaimPhasesV1 | ERC20ClaimConditionsV2 | ERC20ClaimConditionsV1 | ERC721ClaimPhasesV2 | ERC721ClaimPhasesV1 | ERC721ClaimConditionsV2 | ERC721ClaimConditionsV1 | ERC1155ClaimPhasesV2 | ERC1155ClaimPhasesV1 | ERC1155ClaimConditionsV2 | ERC1155ClaimConditionsV1
+ * @see {@link https://portal.thirdweb.com/react/react.usesetclaimconditions?utm_source=sdk | Documentation}
 * @beta
 */
 export function useSetClaimConditions(
@@ -36,6 +36,7 @@ import invariant from "tiny-invariant";
 * @param contract - an instance of a {@link SmartContract}
 * @returns the wallet address of the primary sales recipient
 * @twfeature PrimarySale
+ * @see {@link https://portal.thirdweb.com/react/react.useprimarysalerecipient?utm_source=sdk | Documentation}
 * @beta
 */
 export function usePrimarySaleRecipient(
@@ -87,6 +88,7 @@ export function usePrimarySaleRecipient(
 * @param contract - an instance of a {@link SmartContract}
 * @returns a mutation object that can be used to update the primary sales recipient
 * @twfeature PrimarySale
+ * @see {@link https://portal.thirdweb.com/react/react.useupdateprimarysalerecipient?utm_source=sdk | Documentation}
 * @beta
 */
 export function useUpdatePrimarySaleRecipient(
@@ -137,6 +139,7 @@ export function useUpdatePrimarySaleRecipient(
 * @param contract - an instance of a {@link SmartContract}
 * @returns an object containing recipient address and the royalty basis points
 * @twfeature Royalty
+ * @see {@link https://portal.thirdweb.com/react/react.useroyaltysettings?utm_source=sdk | Documentation}
 * @beta
 */
 export function useRoyaltySettings(
@@ -188,6 +191,7 @@ export function useRoyaltySettings(
 * @param contract - an instance of a {@link SmartContract}
 * @returns a mutation object that can be used to update the royalty settings
 * @twfeature Royalty
+ * @see {@link https://portal.thirdweb.com/react/react.useupdateroyaltysettings?utm_source=sdk | Documentation}
 * @beta
 */
 export function useUpdateRoyaltySettings(
@@ -234,6 +238,7 @@ export function useUpdateRoyaltySettings(
 * @param contract - an instance of a {@link SmartContract}
 * @returns an object containing the platform fee basis points and the fee recipient address
 * @twfeature PlatformFee
+ * @see {@link https://portal.thirdweb.com/react/react.useplatformfees?utm_source=sdk | Documentation}
 * @beta
 */
 export function usePlatformFees(
@@ -284,6 +289,7 @@ export function usePlatformFees(
 * @param contract - an instance of a {@link SmartContract}
 * @returns a mutation object that can be used to update the platform fees settings
 * @twfeature PlatformFee
+ * @see {@link https://portal.thirdweb.com/react/react.useupdateplatformfees?utm_source=sdk | Documentation}
 * @beta
 */
 export function useUpdatePlatformFees(
@@ -329,6 +335,7 @@ export function useUpdatePlatformFees(
 *
 * @param contract - an instance of a {@link SmartContract}
 * @returns a {@link CustomContractMetadata} object containing the metadata
+ * @see {@link https://portal.thirdweb.com/react/react.usemetadata?utm_source=sdk | Documentation}
 * @beta
 */
 export function useMetadata(
@@ -382,6 +389,7 @@ export function useMetadata(
 * ```
 * @param contract - an instance of a {@link SmartContract}
 * @returns a mutation object that can be used to update the metadata
+ * @see {@link https://portal.thirdweb.com/react/react.useupdatemetadata?utm_source=sdk | Documentation}
 * @beta
 */
 export function useUpdateMetadata(
@@ -160,6 +160,7 @@ export type UseContractResult<
 *
 * @param contractAddress - the address of the deployed contract
 * @returns a response object that includes the contract once it is resolved
+ * @see {@link https://portal.thirdweb.com/react/react.usecontract?utm_source=sdk | Documentation}
 * @public
 */
 export function useContract(
@@ -177,6 +178,7 @@ export function useContract(
 * @param contractAddress - the address of the deployed contract
 * @param _contractType - the type of the contract
 * @returns a response object that includes the contract once it is resolved
+ * @see {@link https://portal.thirdweb.com/react/react.usecontract?utm_source=sdk | Documentation}
 * @public
 */
 export function useContract<TContractType extends ContractType>(
@@ -199,6 +201,7 @@ export function useContract<TContractType extends ContractType>(
 * @param contractAddress - the address of the deployed contract
 * @param _abi - the ABI of the contract to use
 * @returns a response object that includes the contract once it is resolved
+ * @see {@link https://portal.thirdweb.com/react/react.usecontract?utm_source=sdk | Documentation}
 * @public
 */

@@ -409,6 +412,7 @@ export function useContractMetadataUpdate(
 * @param eventName - the name of the event to query for (omit this or pass `undefined` to query for all events)
 * @param options - options includes the filters ({@link QueryAllEvents}) for the query as well as if you want to subscribe to real-time updates (default: true)
 * @returns a response object that includes the contract events
+ * @see {@link https://portal.thirdweb.com/react/react.usecontractevents?utm_source=sdk | Documentation}
 * @beta
 */
 export function useContractEvents(
@@ -506,7 +510,7 @@ export function useContractEvents(
 * @param functionName - the name of the function to call
 * @param args - The arguments to pass to the function (if any), with optional call arguments as the last parameter
 * @returns a response object that includes the data returned by the function call
- *
+ * @see {@link https://portal.thirdweb.com/react/react.usecontractread?utm_source=sdk | Documentation}
 * @beta
 */
 export function useContractRead<
@@ -553,7 +557,7 @@ export function useContractRead<
 * @param contract - the contract instance of the contract to call a function on
 * @param functionName - the name of the function to call
 * @returns a response object that includes the write function to call
- *
+ * @see {@link https://portal.thirdweb.com/react/react.usecontractwrite?utm_source=sdk | Documentation}
 * @beta
 */
 export function useContractWrite<
@@ -51,6 +51,7 @@ import invariant from "tiny-invariant";
 * @param queryParams - query params to pass to the query for the sake of pagination
 * @returns a response object that includes an array of NFTs that are unclaimed
 * @twfeature ERC721LazyMintable
+ * @see {@link https://portal.thirdweb.com/react/react.useunclaimednfts?utm_source=sdk | Documentation}
 * @beta
 */
 export function useUnclaimedNFTs(
@@ -87,6 +88,7 @@ export function useUnclaimedNFTs(
 * @param queryParams - query params to pass to the query for the sake of pagination
 * @returns a response object that includes an array of NFTs that are claimed
 * @twfeature ERC721LazyMintable
+ * @see {@link https://portal.thirdweb.com/react/react.useclaimednfts?utm_source=sdk | Documentation}
 * @beta
 */
 export function useClaimedNFTs(
@@ -114,6 +116,7 @@ export function useClaimedNFTs(
 * @param contract - an instance of a contract that extends the ERC721 spec (NFT drop, Signature Drop, or any custom contract that extends the ERC721 spec)
 * @returns a response object that includes the number of NFTs that are unclaimed
 * @twfeature ERC721LazyMintable
+ * @see {@link https://portal.thirdweb.com/react/react.useunclaimednftsupply?utm_source=sdk | Documentation}
 */
 export function useUnclaimedNFTSupply(
  contract: RequiredParam<NFTDrop | SignatureDrop | SmartContract | null>,
@@ -140,6 +143,7 @@ export function useUnclaimedNFTSupply(
 * @param contract - an instance of a contract that extends the ERC721 spec (NFT drop, Signature Drop, or any custom contract that extends the ERC721 spec)
 * @returns a response object that includes the number of NFTs that are claimed
 * @twfeature ERC721LazyMintable
+ * @see {@link https://portal.thirdweb.com/react/react.useclaimednftsupply?utm_source=sdk | Documentation}
 */
 export function useClaimedNFTSupply(
  contract: RequiredParam<NFTDrop | SignatureDrop | SmartContract | null>,
@@ -165,6 +169,7 @@ export function useClaimedNFTSupply(
 * @param contract - an instance of a {@link RevealableContract}
 * @returns a response object that gets the batches to still be revealed
 * @twfeature ERC721Revealable | ERC1155Revealable
+ * @see {@link https://portal.thirdweb.com/react/react.usebatchestoreveal?utm_source=sdk | Documentation}
 */
 export function useBatchesToReveal<TContract extends RevealableContract>(
  contract: RequiredParam<TContract>,
@@ -220,6 +225,7 @@ export function useBatchesToReveal<TContract extends RevealableContract>(
 * @param contract - an instance of a {@link DropContract}
 * @returns a mutation object that can be used to claim a NFT to the wallet specificed in the params
 * @twfeature ERC721Claimable | ERC1155Claimable | ERC721ClaimPhasesV2 | ERC721ClaimPhasesV1 | ERC721ClaimConditionsV2 | ERC721ClaimConditionsV1 | ERC1155ClaimPhasesV2 | ERC1155ClaimPhasesV1 | ERC1155ClaimConditionsV2 | ERC1155ClaimConditionsV1
+ * @see {@link https://portal.thirdweb.com/react/react.useclaimnft?utm_source=sdk | Documentation}
 * @beta
 */
 export function useClaimNFT<TContract extends DropContract>(
@@ -309,6 +315,7 @@ export function useClaimNFT<TContract extends DropContract>(
 * @param onProgress - an optional callback that will be called with the progress of the upload
 * @returns a mutation object that can be used to lazy mint a batch of NFTs
 * @twfeature ERC721LazyMintable | ERC1155LazyMintable
+ * @see {@link https://portal.thirdweb.com/react/react.uselazymint?utm_source=sdk | Documentation}
 * @beta
 */
 export function useLazyMint<TContract extends DropContract>(
@@ -381,6 +388,7 @@ export function useLazyMint<TContract extends DropContract>(
 * @param onProgress - an optional callback that will be called with the progress of the upload
 * @returns a mutation object that can be used to lazy mint a batch of NFTs
 * @twfeature ERC721Revealable | ERC1155Revealable
+ * @see {@link https://portal.thirdweb.com/react/react.usedelayedreveallazymint?utm_source=sdk | Documentation}
 * @beta
 */
 export function useDelayedRevealLazyMint<TContract extends RevealableContract>(
@@ -461,6 +469,7 @@ export function useDelayedRevealLazyMint<TContract extends RevealableContract>(
 * @param contract - an instance of a {@link RevealableContract}
 * @returns a mutation object that can be used to reveal a batch of delayed reveal NFTs
 * @twfeature ERC721Revealable | ERC1155Revealable
+ * @see {@link https://portal.thirdweb.com/react/react.usereveallazymint?utm_source=sdk | Documentation}
 * @beta
 */
 export function useRevealLazyMint<TContract extends RevealableContract>(
@@ -54,6 +54,7 @@ import invariant from "tiny-invariant";
 * @param contract - an instance of a marketplace contract
 * @param listingId - the listing id to check
 * @returns a response object that includes the desired listing
+ * @see {@link https://portal.thirdweb.com/react/react.uselisting?utm_source=sdk | Documentation}
 * @beta
 */
 export function useListing(
@@ -88,6 +89,7 @@ export function useListing(
 * @param listingId - the listing id to check
 * @returns a response object that includes the desired direct listing
 * @twfeature DirectListings
+ * @see {@link https://portal.thirdweb.com/react/react.usedirectlisting?utm_source=sdk | Documentation}
 */
 export function useDirectListing(
  contract: RequiredParam<MarketplaceV3>,
@@ -124,6 +126,7 @@ export function useDirectListing(
 * @param auctionId - the auction id to check
 * @returns a response object that includes the desired english auction
 * @twfeature EnglishAuctions
+ * @see {@link https://portal.thirdweb.com/react/react.useenglishauctions?utm_source=sdk | Documentation}
 */
 export function useEnglishAuction(
  contract: RequiredParam<MarketplaceV3>,
@@ -158,6 +161,7 @@ export function useEnglishAuction(
 * @param contract - an instance of a marketplace contract
 * @param filter - filter to pass to the query for the sake of pagination & filtering
 * @returns a response object that includes an array of listings
+ * @see {@link https://portal.thirdweb.com/react/react.uselistings?utm_source=sdk | Documentation}
 * @beta
 */
 export function useListings(
@@ -190,6 +194,7 @@ export function useListings(
 * @param filter - filter to pass to the query for the sake of pagination & filtering
 * @returns a response object that includes an array of direct listings
 * @twfeature DirectListings
+ * @see {@link https://portal.thirdweb.com/react/react.usedirectlistings?utm_source=sdk | Documentation}
 */
 export function useDirectListings(
  contract: RequiredParam<MarketplaceV3>,
@@ -224,6 +229,7 @@ export function useDirectListings(
 * @param filter - filter to pass to the query for the sake of pagination & filtering
 * @returns a response object that includes an array of direct listings
 * @twfeature DirectListings
+ * @see {@link https://portal.thirdweb.com/react/react.usevaliddirectlistings?utm_source=sdk | Documentation}
 */
 export function useValidDirectListings(
  contract: RequiredParam<MarketplaceV3>,
@@ -258,6 +264,7 @@ export function useValidDirectListings(
 * @param filter - filter to pass to the query for the sake of pagination & filtering
 * @returns a response object that includes an array of english auctions
 * @twfeature EnglishAuctions
+ * @see {@link https://portal.thirdweb.com/react/react.useenglishauctions?utm_source=sdk | Documentation}
 */
 export function useEnglishAuctions(
  contract: RequiredParam<MarketplaceV3>,
@@ -292,6 +299,7 @@ export function useEnglishAuctions(
 * @param filter - filter to pass to the query for the sake of pagination & filtering
 * @returns a response object that includes an array of english auctions
 * @twfeature EnglishAuctions
+ * @see {@link https://portal.thirdweb.com/react/react.usevalidenglishauctions?utm_source=sdk | Documentation}
 */
 export function useValidEnglishAuctions(
  contract: RequiredParam<MarketplaceV3>,
@@ -324,6 +332,7 @@ export function useValidEnglishAuctions(
 *
 * @param contract - an instance of a marketplace contract
 * @returns a response object that includes the listing count
+ * @see {@link https://portal.thirdweb.com/react/react.uselistingscount?utm_source=sdk | Documentation}
 * @beta
 */
 export function useListingsCount(contract: RequiredParam<Marketplace>) {
@@ -351,6 +360,7 @@ export function useListingsCount(contract: RequiredParam<Marketplace>) {
 * @param contract - an instance of a marketplace v3 contract
 * @returns a response object that includes the direct listings count
 * @twfeature DirectListings
+ * @see {@link https://portal.thirdweb.com/react/react.usedirectlistingscount?utm_source=sdk | Documentation}
 */
 export function useDirectListingsCount(contract: RequiredParam<MarketplaceV3>) {
  const contractAddress = contract?.getAddress();
@@ -379,6 +389,7 @@ export function useDirectListingsCount(contract: RequiredParam<MarketplaceV3>) {
 * @param contract - an instance of a marketplace v3 contract
 * @returns a response object that includes the direct english actions count
 * @twfeature EnglishAuctions
+ * @see {@link https://portal.thirdweb.com/react/react.useenglishauctionscount?utm_source=sdk | Documentation}
 */
 export function useEnglishAuctionsCount(
  contract: RequiredParam<MarketplaceV3>,
@@ -409,6 +420,7 @@ export function useEnglishAuctionsCount(
 * @param contract - an instance of a marketplace contract
 * @param filter - filter to pass to the query for the sake of pagination & filtering
 * @returns a response object that includes an array of listings
+ * @see {@link https://portal.thirdweb.com/react/react.useactivelistings?utm_source=sdk | Documentation}
 * @beta
 */
 export function useActiveListings(
@@ -442,6 +454,7 @@ export function useActiveListings(
 * @param contract - an instance of a marketplace contract
 * @param listingId - the listing id to check
 * @returns a response object that includes the {@link Offer} that is winning the auction
+ * @see {@link https://portal.thirdweb.com/react/react.usewinningbid?utm_source=sdk | Documentation}
 * @beta
 */
 export function useWinningBid(
@@ -482,6 +495,7 @@ export function useWinningBid(
 * @param auctionId - the auction id to check
 * @returns a response object that includes the {@link Bid} that is winning the auction
 * @twfeature EnglishAuctions
+ * @see {@link https://portal.thirdweb.com/react/react.useenglishauctionwinningbid?utm_source=sdk | Documentation}
 */
 export function useEnglishAuctionWinningBid(
  contract: RequiredParam<MarketplaceV3>,
@@ -521,6 +535,7 @@ export function useEnglishAuctionWinningBid(
 * @param listingId - the listing id to check
 * @returns a response object that includes the address of the winner of the auction or undefined if there is no winner yet
 * @twfeature EnglishAuctions
+ * @see {@link https://portal.thirdweb.com/react/react.useauctionwinner?utm_source=sdk | Documentation}
 */
 export function useAuctionWinner(
  contract: RequiredParam<Marketplace | MarketplaceV3>,
@@ -572,6 +587,7 @@ export function useAuctionWinner(

 * @returns a response object that includes an array of listings
 * @twfeature EnglishAuctions
+ * @see {@link https://portal.thirdweb.com/react/react.usebidbuffer?utm_source=sdk | Documentation}
 */
 export function useBidBuffer(
  contract: RequiredParam<Marketplace | MarketplaceV3>,
@@ -622,6 +638,7 @@ export function useBidBuffer(
 * @param listingId - the listing id to check
 * @returns a response object that includes the minimum next bid for the auction listing
 * @twfeature EnglishAucton
+ * @see {@link https://portal.thirdweb.com/react/react.useminimumnextbid?utm_source=sdk | Documentation}
 */
 export function useMinimumNextBid(
  contract: RequiredParam<Marketplace | MarketplaceV3>,
@@ -672,6 +689,7 @@ export function useMinimumNextBid(
 *
 * @param contract - an instance of a Marketplace contract
 * @param listingId - the id of the listing to fetch offers for
+ * @see {@link https://portal.thirdweb.com/react/react.useoffers?utm_source=sdk | Documentation}
 * @beta
 */
 export function useOffers(
@@ -722,6 +740,7 @@ export function useOffers(
 * @param contract - an instance of a Marketplace contract
 * @returns a mutation object that can be used to create a new direct listing
 * @twfeature DirectListings
+ * @see {@link https://portal.thirdweb.com/react/react.usecreatedirectlisting?utm_source=sdk | Documentation}
 */
 export function useCreateDirectListing<
  TMarketplace extends Marketplace | MarketplaceV3,
@@ -800,6 +819,7 @@ export function useCreateDirectListing<
 * @param contract - an instance of a Marketplace contract
 * @returns a mutation object that can be used to create a new auction listing
 * @twfeature EnglishAuctions
+ * @see {@link https://portal.thirdweb.com/react/react.usecreateauctionlisting?utm_source=sdk | Documentation}
 */
 export function useCreateAuctionListing<
  TMarketplace extends Marketplace | MarketplaceV3,
@@ -877,6 +897,7 @@ export function useCreateAuctionListing<
 *
 * @param contract - an instance of a Marketplace contract
 * @returns a mutation object that can be used to cancel a listing
+ * @see {@link https://portal.thirdweb.com/react/react.usecancellisting?utm_source=sdk | Documentation}
 * @beta
 */
 export function useCancelListing(
@@ -958,6 +979,7 @@ export function useCancelListing(
 * @param contract - an instance of a Marketplace v3 contract
 * @returns a mutation object that can be used to cancel a direct listing
 * @twfeature DirectListings
+ * @see {@link https://portal.thirdweb.com/react/react.usecanceldirectlisting?utm_source=sdk | Documentation}
 */
 export function useCancelDirectListing(contract: RequiredParam<MarketplaceV3>) {
  const activeChainId = useSDKChainId();
@@ -1018,6 +1040,7 @@ export function useCancelDirectListing(contract: RequiredParam<MarketplaceV3>) {
 * @param contract - an instance of a Marketplace v3 contract
 * @returns a mutation object that can be used to cancel an english auction
 * @twfeature EnglishAuctions
+ * @see {@link https://portal.thirdweb.com/react/react.usecancelenglishauction?utm_source=sdk | Documentation}
 */
 export function useCancelEnglishAuction(
  contract: RequiredParam<MarketplaceV3>,
@@ -1079,6 +1102,7 @@ export function useCancelEnglishAuction(
 *
 * @param contract - an instance of a Marketplace contract
 * @returns a mutation object that can be used to make a bid on an auction listing
+ * @see {@link https://portal.thirdweb.com/react/react.usemakebid?utm_source=sdk | Documentation}
 * @beta
 */
 export function useMakeBid(contract: RequiredParam<Marketplace>) {
@@ -1137,6 +1161,7 @@ export function useMakeBid(contract: RequiredParam<Marketplace>) {
 *
 * @param contract - an instance of a Marketplace contract
 * @returns a mutation object that can be used to make a bid on an auction listing
+ * @see {@link https://portal.thirdweb.com/react/react.usemakeoffer?utm_source=sdk | Documentation}
 * @beta
 */
 export function useMakeOffer(contract: RequiredParam<Marketplace>) {
@@ -1197,6 +1222,7 @@ export function useMakeOffer(contract: RequiredParam<Marketplace>) {
 *
 * @param contract - an instance of a Marketplace contract
 * @returns a mutation object that can be used to accept an offer on a direct listing
+ * @see {@link https://portal.thirdweb.com/react/react.useacceptdirectlistingoffer?utm_source=sdk | Documentation}
 */
 export function useAcceptDirectListingOffer(
  contract: RequiredParam<Marketplace>,
@@ -1255,6 +1281,7 @@ export function useAcceptDirectListingOffer(
 *
 * @param contract - an instance of a Marketplace contract
 * @returns a mutation object that can be used to accept an offer on a direct listing
+ * @see {@link https://portal.thirdweb.com/react/react.useexecuteauctionsale?utm_source=sdk | Documentation}
 * @beta
 */
 export function useExecuteAuctionSale(contract: RequiredParam<Marketplace>) {
@@ -1312,6 +1339,7 @@ export function useExecuteAuctionSale(contract: RequiredParam<Marketplace>) {
 *
 * @param contract - an instance of a Marketplace contract
 * @returns a mutation object that can be used to buy out an auction listing
+ * @see {@link https://portal.thirdweb.com/react/react.usebuynow?utm_source=sdk | Documentation}
 * @beta
 */
 export function useBuyNow(contract: RequiredParam<Marketplace>) {
@@ -46,6 +46,7 @@ import invariant from "tiny-invariant";
 * @returns a response object that includes the metadata for the given tokenId
 * @beta
 * @twfeature ERC721 | ERC1155
+ * @see {@link https://portal.thirdweb.com/react/react.usenft?utm_source=sdk | Documentation}
 */
 export function useNFT<TContract extends NFTContract>(
  contract: RequiredParam<TContract>,
@@ -88,6 +89,7 @@ export function useNFT<TContract extends NFTContract>(
 * @returns a response object that includes an array of NFTs
 * @twfeature ERC721Supply | ERC721Enumerable | ERC1155Enumerable
 * @beta
+ * @see {@link https://portal.thirdweb.com/react/react.usenfts?utm_source=sdk | Documentation}
 */
 export function useNFTs<TContract extends NFTContract>(
  contract: RequiredParam<TContract>,
@@ -130,6 +132,7 @@ export function useNFTs<TContract extends NFTContract>(
 * @returns a response object that includes the total count of NFTs
 * @beta
 * @twfeature ERC721Supply | ERC1155Enumerable
+ * @see {@link https://portal.thirdweb.com/react/react.usetotalcount?utm_source=sdk | Documentation}
 */
 export function useTotalCount<TContract extends NFTContract>(
  contract: RequiredParam<TContract>,
@@ -178,6 +181,7 @@ export function useTotalCount<TContract extends NFTContract>(
 * @returns a response object that includes the total minted supply
 * @beta
 * @twfeature ERC721Supply | ERC1155Enumerable
+ * @see {@link https://portal.thirdweb.com/react/react.usetotalcirculatingsupply?utm_source=sdk | Documentation}
 */
 export function useTotalCirculatingSupply(
  contract: RequiredParam<NFTContract>,
@@ -227,6 +231,7 @@ export function useTotalCirculatingSupply(
 * @returns a response object that includes the list of owned tokens
 * @beta
 * @twfeature ERC721Enumerable | ERC1155Enumerable | ERC721Supply
+ * @see {@link https://portal.thirdweb.com/react/react.useownednfts?utm_source=sdk | Documentation}
 */
 export function useOwnedNFTs<TContract extends NFTContract>(
  contract: RequiredParam<TContract>,
@@ -270,6 +275,7 @@ export function useOwnedNFTs<TContract extends NFTContract>(
 * @param tokenId - required for ERC1155, the tokenId to look up
 * @returns a response object that includes the total balance of the owner
 * @twfeature ERC721 | ERC1155
+ * @see {@link https://portal.thirdweb.com/react/react.usenftbalance?utm_source=sdk | Documentation}
 * @beta
 */
 export function useNFTBalance(
@@ -348,6 +354,7 @@ export function useNFTBalance(
 * @returns a mutation object that can be used to mint a new NFT token to the connected wallet
 * @beta
 * @twfeature ERC721Mintable | ERC1155Mintable
+ * @see {@link https://portal.thirdweb.com/react/react.usemintnft?utm_source=sdk | Documentation}
 */
 export function useMintNFT<TContract extends NFTContract>(
  contract: RequiredParam<TContract>,
@@ -420,6 +427,7 @@ export function useMintNFT<TContract extends NFTContract>(
 * @returns a mutation object that can be used to mint a more supply of a token id to the provided wallet
 * @beta
 * @twfeature ERC1155Mintable
+ * @see {@link https://portal.thirdweb.com/react/react.usemintnftsupply?utm_source=sdk | Documentation}
 */
 export function useMintNFTSupply(contract: Erc1155) {
  const activeChainId = useSDKChainId();
@@ -486,6 +494,7 @@ export function useMintNFTSupply(contract: Erc1155) {
 * @returns a mutation object that can be used to transfer NFTs
 * @beta
 * @twfeature ERC721 | ERC1155
+ * @see {@link https://portal.thirdweb.com/react/react.usetransfernft?utm_source=sdk | Documentation}
 */
 export function useTransferNFT<TContract extends NFTContract>(
  contract: RequiredParam<TContract>,
@@ -569,6 +578,7 @@ export function useTransferNFT<TContract extends NFTContract>(
 * @param contract - an instance of a {@link Erc1155}
 * @returns a mutation object that can be used to transfer batch NFTs
 * @twfeature ERC1155
+ * @see {@link https://portal.thirdweb.com/react/react.useairdropnft?utm_source=sdk | Documentation}
 * @beta
 */
 export function useAirdropNFT(contract: Erc1155) {
@@ -629,6 +639,7 @@ export function useAirdropNFT(contract: Erc1155) {
 * @param contract - an instance of a {@link NFTContract}
 * @returns a mutation object that can be used to burn an NFT token from the connected wallet
 * @twfeature ERC721Burnable | ERC1155Burnable
+ * @see {@link https://portal.thirdweb.com/react/react.useburnnft?utm_source=sdk | Documentation}
 * @beta
 */
 export function useBurnNFT<TContract extends NFTContract>(
@@ -55,6 +55,7 @@ type GetAllReturnType<TContract extends ContractWithRoles> = Promise<
 * @param contract - an instance of a {@link SmartContract}
 * @returns a list of addresses for all supported roles on the contract.
 * @twfeature PermissionsEnumerable
+ * @see {@link https://portal.thirdweb.com/react/react.useallrolemembers?utm_source=sdk | Documentation}
 * @beta
 */
 export function useAllRoleMembers<TContract extends ContractWithRoles>(
@@ -87,6 +88,7 @@ export function useAllRoleMembers<TContract extends ContractWithRoles>(
 * @param role - the role to get the members of, see {@link Role}
 * @returns a list of addresses that are members of the role
 * @twfeature Permissions
+ * @see {@link https://portal.thirdweb.com/react/react.userolemembers?utm_source=sdk | Documentation}
 * @beta
 */
 export function useRoleMembers<TContract extends ContractWithRoles>(
@@ -120,6 +122,7 @@ export function useRoleMembers<TContract extends ContractWithRoles>(
 * @param walletAddress - the address to check
 * @returns true if the address is a member of the role, or false if not
 * @twfeature PermissionsEnumerable
+ * @see {@link https://portal.thirdweb.com/react/react.useisaddressrole?utm_source=sdk | Documentation}
 * @beta
 */
 export function useIsAddressRole<TContract extends ContractWithRoles>(
@@ -242,6 +245,7 @@ export function useSetAllRoleMembers<TContract extends ContractWithRoles>(
 * @param contract - an instance of a {@link SmartContract}
 * @returns a mutation object that can be used to grant a member of a role on the contract
 * @twfeature Permissions | PermissionsEnumerable
+ * @see {@link https://portal.thirdweb.com/react/react.usegrantrole?utm_source=sdk | Documentation}
 * @beta
 */
 export function useGrantRole<TContract extends ContractWithRoles>(
@@ -302,6 +306,7 @@ export function useGrantRole<TContract extends ContractWithRoles>(
 * @param contract - an instance of a {@link SmartContract}
 * @returns a mutation object that can be used to revoke a role from a member on the contract
 * @twfeature Permissions | PermissionsEnumerable
+ * @see {@link https://portal.thirdweb.com/react/react.userevokerole?utm_source=sdk | Documentation}
 * @beta
 */
 export function useRevokeRole<TContract extends ContractWithRoles>(
@@ -39,6 +39,7 @@ import invariant from "tiny-invariant";
 * @param contract - an instance of a {@link TokenContract}
 * @returns a response object that includes the total minted supply
 * @twfeature ERC20
+ * @see {@link https://portal.thirdweb.com/react/react.usetokensupply?utm_source=sdk | Documentation}
 * @beta
 */
 export function useTokenSupply(contract: RequiredParam<TokenContract>) {
@@ -70,6 +71,7 @@ export function useTokenSupply(contract: RequiredParam<TokenContract>) {
 * @param contract - an instance of a {@link TokenContract}
 * @returns a response object that includes the balance of the address
 * @twfeature ERC20
+ * @see {@link https://portal.thirdweb.com/react/react.usetokenbalance?utm_source=sdk | Documentation}
 * @beta
 */
 export function useTokenBalance(
@@ -106,6 +108,7 @@ export function useTokenBalance(
 * @param contract - an instance of a {@link TokenContract}
 * @returns a response object that includes the decimals of the ERC20 token
 * @twfeature ERC20
+ * @see {@link https://portal.thirdweb.com/react/react.usetokendecimals?utm_source=sdk | Documentation}
 * @beta
 */
 export function useTokenDecimals(contract: RequiredParam<TokenContract>) {
@@ -162,6 +165,7 @@ export function useTokenDecimals(contract: RequiredParam<TokenContract>) {
 * @param contract - an instance of a {@link TokenContract}
 * @returns a mutation object that can be used to mint new tokens to the connected wallet
 * @twfeature ERC20Mintable
+ * @see {@link https://portal.thirdweb.com/react/react.useminttoken?utm_source=sdk | Documentation}
 * @beta
 */
 export function useMintToken(
@@ -234,6 +238,7 @@ export function useMintToken(
 * @param contract - an instance of a {@link TokenContract}
 * @returns a mutation object that can be used to tokens to the wallet specified in the params
 * @twfeature ERC20ClaimPhasesV2 | ERC20ClaimPhasesV1 | ERC20ClaimConditionsV2 | ERC20ClaimConditionsV1
+ * @see {@link https://portal.thirdweb.com/react/react.useclaimtoken?utm_source=sdk | Documentation}
 * @beta
 */
 export function useClaimToken(contract: RequiredParam<TokenContract>) {
@@ -295,6 +300,7 @@ export function useClaimToken(contract: RequiredParam<TokenContract>) {
 * @param contract - an instance of a {@link TokenContract}
 * @returns a mutation object that can be used to transfer tokens
 * @twfeature ERC20
+ * @see {@link https://portal.thirdweb.com/react/react.usetransfertoken?utm_source=sdk | Documentation}
 * @beta
 */
 export function useTransferToken(contract: RequiredParam<TokenContract>) {
@@ -354,6 +360,7 @@ export function useTransferToken(contract: RequiredParam<TokenContract>) {
 * @param contract - an instance of a {@link TokenContract}
 * @returns a mutation object that can be used to transfer batch tokens
 * @twfeature ERC20
+ * @see {@link https://portal.thirdweb.com/react/react.usetransferbatchtoken?utm_source=sdk | Documentation}
 * @beta
 */
 export function useTransferBatchToken(contract: RequiredParam<TokenContract>) {
@@ -420,6 +427,7 @@ export function useTransferBatchToken(contract: RequiredParam<TokenContract>) {
 * @param contract - an instance of a {@link TokenContract}
 * @returns a mutation object that can be used to burn tokens from the connected wallet
 * @twfeature ERC20Burnable
+ * @see {@link https://portal.thirdweb.com/react/react.useburntoken?utm_source=sdk | Documentation}
 * @beta
 */
 export function useBurnToken(contract: RequiredParam<TokenContract>) {
@@ -1,4 +1,29 @@
-export { useLogin } from "./useLogin";
+import { LoginOptions } from "@thirdweb-dev/auth";
+import { useWallet } from "../../../core/hooks/wallet-hooks";
+import { useThirdwebAuthContext } from "../../contexts/thirdweb-auth";
+import { doLogin } from "./useLogin";
+import invariant from "tiny-invariant";
+
+export { useLogin, doLogin } from "./useLogin";
 export { useLogout } from "./useLogout";
 export type { UserWithData } from "./useUser";
 export { useUser } from "./useUser";
+
+export function useAuth() {
+  const wallet = useWallet();
+  const authConfig = useThirdwebAuthContext();
+
+  return {
+    login: async (options?: LoginOptions) => {
+      invariant(
+        authConfig,
+        "Please specify an authConfig in the ThirdwebProvider",
+      );
+      invariant(wallet, "Need a connected a wallet!");
+      return doLogin(wallet, {
+        domain: authConfig.domain,
+        ...options,
+      });
+    },
+  };
+}
@@ -9,6 +9,7 @@ import type {
 } from "@thirdweb-dev/auth";
 import { GenericAuthWallet } from "@thirdweb-dev/wallets";
 import invariant from "tiny-invariant";
+import { AUTH_TOKEN_STORAGE_KEY } from "../../../core/constants/auth";

 /**
 * Hook to securely login to a backend with the connected wallet. The backend
@@ -16,6 +17,8 @@ import invariant from "tiny-invariant";
 *
 * @returns - A function to invoke to login with the connected wallet, and an isLoading state.
 *
+ * @see {@link https://portal.thirdweb.com/react/react.uselogin?utm_source=sdk | Documentation}
+ *
 * @beta
 */
 export function useLogin() {
@@ -60,7 +63,12 @@ export function useLogin() {
        throw new Error(`Login request failed with status code ${res.status}`);
      }

+      const { token } = await res.json();
+      await authConfig.secureStorage?.setItem(AUTH_TOKEN_STORAGE_KEY, token);
+
      queryClient.invalidateQueries(cacheKeys.auth.user());
+
+      return token;
    },
  });

@@ -70,10 +78,7 @@ export function useLogin() {
  };
 }

-// login function extracted directly from auth
-const isBrowser = () => typeof window !== "undefined";
-
-async function doLogin(
+export async function doLogin(
  wallet: GenericAuthWallet,
  options?: LoginOptions,
 ): Promise<LoginPayload> {
@@ -99,7 +104,7 @@ async function doLogin(
      options?.statement ||
      "Please ensure that the domain above matches the URL of the current website.",
    version: options?.version || "1",
-    uri: options?.uri || (isBrowser() ? window.location.origin : undefined),
+    uri: options?.uri,
    chain_id: chainId,
    nonce: options?.nonce || nonce,
    issued_at: new Date().toISOString(),
@@ -1,3 +1,4 @@
+import { AUTH_TOKEN_STORAGE_KEY } from "../../../core/constants/auth";
 import { useThirdwebAuthContext } from "../../contexts/thirdweb-auth";
 import { cacheKeys } from "../../utils/cache-keys";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
@@ -9,6 +10,8 @@ import invariant from "tiny-invariant";
 *
 * @returns - A function to invoke to logout.
 *
+ * @see {@link https://portal.thirdweb.com/react/react.uselogout?utm_source=sdk | Documentation}
+ *
 * @beta
 */
 export function useLogout() {
@@ -30,6 +33,7 @@ export function useLogout() {
        method: "POST",
        credentials: "include",
      });
+      authConfig.secureStorage?.removeItem(AUTH_TOKEN_STORAGE_KEY);

      queryClient.invalidateQueries(cacheKeys.auth.user());
    },
@@ -3,6 +3,7 @@ import { cacheKeys } from "../../utils/cache-keys";
 import { useQuery } from "@tanstack/react-query";
 import type { Json, User } from "@thirdweb-dev/auth";
 import invariant from "tiny-invariant";
+import { AUTH_TOKEN_STORAGE_KEY } from "../../../core/constants/auth";

 export interface UserWithData<
  TData extends Json = Json,
@@ -16,6 +17,8 @@ export interface UserWithData<
 *
 * @returns - The currently logged in user or null if not logged in, as well as a loading state.
 *
+ * @see {@link https://portal.thirdweb.com/react/react.useuser?utm_source=sdk | Documentation}
+ *
 * @beta
 */
 export function useUser<
@@ -36,10 +39,25 @@ export function useUser<
        "Please specify an authUrl in the authConfig.",
      );

+      const token = await authConfig.secureStorage?.getItem(
+        AUTH_TOKEN_STORAGE_KEY,
+      );
      // We include credentials so we can getUser even if API is on different URL
-      const res = await fetch(`${authConfig.authUrl}/user`, {
+      const params = {
        credentials: "include",
-      });
+        ...(token
+          ? {
+              headers: {
+                Authorization: `Bearer ${token}`,
+              },
+            }
+          : {}),
+      };
+
+      const res = await fetch(
+        `${authConfig.authUrl}/user`,
+        params as RequestInit,
+      );

      return (await res.json()) as UserWithData<TData, TContext>;
    },
@@ -5,6 +5,7 @@ export { useStorageUpload } from "./useStorageUpload";
 /**
 * Get the configured `ThirdwebStorage` instance
 * @returns The `storageInterface` configured on the `ThirdwebProvider`
+ * @see {@link https://portal.thirdweb.com/react/react.usestorage?utm_source=sdk | Documentation}
 */
 export function useStorage() {
  const sdk = useSDK();
@@ -35,6 +35,7 @@ interface StorageUploadOptions<T extends UploadOptions> {
 *   )
 * }
 * ```
+ * @see {@link https://portal.thirdweb.com/react/react.usestorageupload?utm_source=sdk | Documentation}
 */
 export function useStorageUpload<
  T extends UploadOptions = IpfsUploadBatchOptions,
@@ -10,6 +10,8 @@ import { useChainId } from "./wallet";
 *
 * @returns `true` if the chainId of the connected wallet is different from the chainId of the network passed into <ThirdwebProvider />
 *
+ * @see {@link https://portal.thirdweb.com/react/react.usenetworkmismatch?utm_source=sdk | Documentation}
+ *
 * @example
 * You can check if a users wallet is connected to the correct chain ID as follows:
 * ```javascript
@@ -66,6 +66,8 @@ export function useConnectedWallet() {
 *
 * The `address` variable will hold the address of the connected wallet if a user has connected using one of the supported wallet connection hooks.
 *
+ * @see {@link https://portal.thirdweb.com/react/react.useaddress?utm_source=sdk | Documentation}
+ *
 * @public
 */
 export function useAddress(): string | undefined {
@@ -90,6 +92,7 @@ export function useAddress(): string | undefined {
 *   return <div>{chainId}</div>
 * }
 * ```
+ * @see {@link https://portal.thirdweb.com/react/react.usechainid?utm_source=sdk | Documentation}
 * @public
 */
 export function useChainId(): number | undefined {
@@ -114,6 +117,7 @@ export function useChainId(): number | undefined {
 *   return <div>{chain.chainId}</div>
 * }
 * ```
+ * @see {@link https://portal.thirdweb.com/react/react.useActiveChain?utm_source=sdk | Documentation}
 * @public
 */
 export function useActiveChain(): Chain | undefined {
@@ -45,7 +45,10 @@ export {
  ThirdwebAuthProvider,
  useThirdwebAuthContext,
 } from "./contexts/thirdweb-auth";
-export type { ThirdwebAuthConfig } from "./contexts/thirdweb-auth";
+export type {
+  ThirdwebAuthConfig,
+  ISecureStorage,
+} from "./contexts/thirdweb-auth";

 // config
 export {
@@ -187,7 +190,7 @@ export {
 // thirdweb hooks (work as long as at least `<ThirdwebSdkProvider>` is used)

 // auth hooks
-export { useLogin, useLogout, useUser } from "./hooks/auth";
+export { useLogin, useLogout, useUser, useAuth } from "./hooks/auth";
 export type { UserWithData } from "./hooks/auth";

 // contract hooks
@@ -1,5 +1,7 @@
 # @thirdweb-dev/react-native-compat

+## 0.2.8
+
 ## 0.2.7

 ## 0.2.6
@@ -1,7 +1,7 @@
 {
  "name": "@thirdweb-dev/react-native-compat",
  "description": "Shims for Thirdweb in React Native Projects",
-  "version": "0.2.7",
+  "version": "0.2.8",
  "author": "thirdweb eng <[email protected]>",
  "repository": "https://github.com/thirdweb-dev/js/tree/main/packages/react-native-compat",
  "license": "Apache-2.0",
@@ -1,5 +1,107 @@
 # @thirdweb-dev/react-native

+## 0.2.8
+
+### Patch Changes
+
+- [#874](https://github.com/thirdweb-dev/js/pull/874) [`49922de9`](https://github.com/thirdweb-dev/js/commit/49922de9d9c1258e58a3a05e656b229db469b1dd) Thanks [@iketw](https://github.com/iketw)! - [RN] Adds Auth to React Native
+
+  - Adds an optional `secureStorage` to authConfig
+  - Adds `expo-secure-store` to store the JWT token securely in React Native, passing a default value
+  - Stores the token in secure storage to be accessed by subsequent calls
+  - Returns the token in `useLogin` to be used by the user
+
+  How I tested:
+
+  - Tested in Android/iOS/Web
+
+  Usage:
+
+  ```
+  <ThirdwebProvider
+        activeChain="ethereum"
+        supportedWallets={[metamaskWallet(), rainbowWallet()]}
+        authConfig={{
+          domain: https://your-domain.com,
+          authUrl: '/api/auth',
+        }}>
+        <AppInner />
+      </ThirdwebProvider>
+  ```
+
+  ```
+  const { login } = useLogin();
+  const { logout } = useLogout();
+  const { user, isLoggedIn } = useUser();
+  ...
+
+  const token = await login();
+  ```
+
+- [#886](https://github.com/thirdweb-dev/js/pull/886) [`51e6b414`](https://github.com/thirdweb-dev/js/commit/51e6b4146e1ff1a902f7b940dddf6c72e39fc49c) Thanks [@iketw](https://github.com/iketw)! - [ReactNative] Fixes Coinbase wallet on iOS
+
+  - Adds connect wallet hooks for the supported wallets:
+
+  1. useMetaMaskWallet
+  2. useCoinbaseWallet
+  3. useRainbowWallet
+  4. useTrustWallet
+
+  Usage:
+
+  ```
+  const connect = useMetaMaskWallet();
+  connect();
+  ```
+
+- [#916](https://github.com/thirdweb-dev/js/pull/916) [`0b1f5229`](https://github.com/thirdweb-dev/js/commit/0b1f52290619dca76bbec32c92403598d351c3a5) Thanks [@iketw](https://github.com/iketw)! - [ReactNative] Improve customization of buttons background and text colors
+
+  You can now pass custom background and text colors without having to create the full theme object. Alternatively, you can complete customize the theme:
+
+  ```ConnectWallet button
+  import { ConnectWallet, darkTheme } from '@thirdweb-dev/react-native';
+
+  <ConnectWallet theme={darkTheme({
+     buttonBackgroundColor: '#new-color',
+     buttonTextColor: '#another-color'
+  })}
+  />
+  ```
+
+  ```Web3Button
+  import { Web3Button, lightTheme } from '@thirdweb-dev/react-native';
+
+  <Web3Button theme={lightTheme({
+     buttonBackgroundColor: '#new-color',
+     buttonTextColor: '#another-color'
+  })}
+  />
+  ```
+
+  Customizing theme beyond the button:
+
+  ```ConnectWallet button
+  import { ConnectWallet, darkTheme } from '@thirdweb-dev/react-native';
+
+  const darkThemeCustom = darkTheme();
+
+  <ConnectWallet
+      theme={{
+      ...darkThemeCustom,
+      colors: {
+          ...darkThemeCustom.colors,
+          backgroundHighlight: 'blue',
+      },
+      }}
+  />
+  ```
+
+- Updated dependencies [[`abe88599`](https://github.com/thirdweb-dev/js/commit/abe88599b634699aa3b876fe344bfddc6c1a92d4), [`49922de9`](https://github.com/thirdweb-dev/js/commit/49922de9d9c1258e58a3a05e656b229db469b1dd), [`4acb2b55`](https://github.com/thirdweb-dev/js/commit/4acb2b5561118dde5c7372400d4d754b879aef2e), [`82bea3fa`](https://github.com/thirdweb-dev/js/commit/82bea3fa10294eb3c5c7327fb047e3d1b2c62ff9), [`ea04edf4`](https://github.com/thirdweb-dev/js/commit/ea04edf47867617ff74f0aca1471a40b8d9c9f7c), [`77224646`](https://github.com/thirdweb-dev/js/commit/77224646d542db3171394d744b455497cd057633), [`c9ee9b32`](https://github.com/thirdweb-dev/js/commit/c9ee9b32f0a275f7c03d50243f23a7332f148ae5), [`00f4355f`](https://github.com/thirdweb-dev/js/commit/00f4355f1aa8843bb534b173e4d8e0a19dd18b47), [`a6610f12`](https://github.com/thirdweb-dev/js/commit/a6610f1211e9359885b948bf69a66d834707ec07), [`06cc1df3`](https://github.com/thirdweb-dev/js/commit/06cc1df3b7906584c9e2e69fddc4a2d831c237f9), [`29146e00`](https://github.com/thirdweb-dev/js/commit/29146e009db655304f5753904ae7f8569c12f4ca), [`77224646`](https://github.com/thirdweb-dev/js/commit/77224646d542db3171394d744b455497cd057633), [`430a5f79`](https://github.com/thirdweb-dev/js/commit/430a5f793419173775a434e0b2a21f70223e3813), [`664d1cd0`](https://github.com/thirdweb-dev/js/commit/664d1cd0dd03f32337c2cf532f0ad860e5aa5ea8), [`bfdd8493`](https://github.com/thirdweb-dev/js/commit/bfdd84939d7cf9c6635b83c971bcc8967b52538c), [`c2fec930`](https://github.com/thirdweb-dev/js/commit/c2fec930520e2df89532ec0027ead4563c7708cf), [`477324ec`](https://github.com/thirdweb-dev/js/commit/477324ec85b800dcbc54b709430c77fb63b16537)]:
+  - @thirdweb-dev/[email protected]
+  - @thirdweb-dev/[email protected]
+  - @thirdweb-dev/[email protected]
+  - @thirdweb-dev/[email protected]
+
 ## 0.2.7

 ### Patch Changes
@@ -1,6 +1,6 @@
 {
  "name": "@thirdweb-dev/react-native",
-  "version": "0.2.7",
+  "version": "0.2.8",
  "repository": "https://github.com/thirdweb-dev/js/tree/main/packages/react-native",
  "author": "thirdweb eng <[email protected]>",
  "license": "Apache-2.0",
@@ -33,6 +33,7 @@
    "@thirdweb-dev/storage": "workspace:*",
    "@thirdweb-dev/wallets": "workspace:*",
    "abitype": "^0.2.5",
+    "expo-secure-store": "^12.1.1",
    "react-native-mmkv": "2.5.1",
    "react-native-modal": "^13.0.1",
    "react-native-svg": "^13.8.0",
@@ -43,6 +44,7 @@
  },
  "devDependencies": {
    "@babel/core": "^7.19.3",
+    "@babel/preset-env": "^7.1.6",
    "@react-native-async-storage/async-storage": "*",
    "@react-native-community/eslint-config": "^3.0.2",
    "@thirdweb-dev/tsconfig": "workspace:*",
@@ -0,0 +1,30 @@
+import { ISecureStorage } from '@thirdweb-dev/react-core';
+import * as SecureStore from 'expo-secure-store';
+
+const PREFIX = "__tw__";
+
+export class SecureStorage implements ISecureStorage {
+  name: string;
+  asyncStorage: typeof SecureStore;
+
+  constructor(name: string) {
+    this.name = name;
+    this.asyncStorage = SecureStore;
+  }
+
+  getItem(key: string) {
+    return this.asyncStorage.getItemAsync(`${PREFIX}_${this.name}_${key}`);
+  }
+
+  setItem(key: string, value: string) {
+    return this.asyncStorage.setItemAsync(`${PREFIX}_${this.name}_${key}`, value);
+  }
+
+  removeItem(key: string) {
+    return this.asyncStorage.deleteItemAsync(`${PREFIX}_${this.name}_${key}`);
+  }
+}
+
+export function createSecureStorage(name: string) {
+  return new SecureStorage(name);
+}
@@ -4,9 +4,8 @@ import { TWModal } from "../base/modal/TWModal";
 import { ChooseWallet } from "./ChooseWallet/ChooseWallet";
 import { ConnectingWallet } from "./ConnectingWallet/ConnectingWallet";
 import { Wallet, useConnect, useWallets } from "@thirdweb-dev/react-core";
-import { useEffect, useState } from "react";
-import { Linking, StyleSheet } from "react-native";
-import { handleResponse } from "@coinbase/wallet-mobile-sdk";
+import { useState } from "react";
+import { StyleSheet } from "react-native";

 export const ConnectWalletFlow = () => {
  const [modalVisible, setModalVisible] = useState(false);
@@ -15,17 +14,6 @@ export const ConnectWalletFlow = () => {
  const connect = useConnect();
  const supportedWallets = useWallets();

-  useEffect(() => {
-    if (activeWallet && activeWallet.meta.name.toLowerCase().includes("coinbase")) {
-      const sub = Linking.addEventListener("url", ({ url }) => {
-        if (url) {
-          handleResponse(new URL(url));
-        }
-      });
-      return () => sub?.remove();
-    }
-  }, [activeWallet]);
-
  const onConnectPress = () => {
    setModalVisible(true);
  };
@@ -68,11 +56,11 @@ export const ConnectWalletFlow = () => {
      </TWModal>

      <BaseButton
-        backgroundColor="white"
+        backgroundColor="buttonBackgroundColor"
        onPress={onConnectPress}
        style={styles.connectWalletButton}
      >
-        <Text variant="bodyLarge" color="black">
+        <Text variant="bodyLarge" color="buttonTextColor">
          Connect Wallet
        </Text>
      </BaseButton>
@@ -1,4 +1,4 @@
-import { ThemeProvider } from "../styles/ThemeProvider";
+import { ThemeProvider, ThemeProviderProps } from "../styles/ThemeProvider";
 import { ConnectWallet } from "./ConnectWallet";
 import BaseButton from "./base/BaseButton";
 import Text from "./base/Text";
@@ -36,7 +36,7 @@ interface Web3ButtonProps<TActionFn extends ActionFn> {
  isDisabled?: boolean;
  // the fn to execute
  action: TActionFn;
-  theme?: "dark" | "light";
+  theme?: ThemeProviderProps["theme"];
 }

 /**
@@ -145,7 +145,7 @@ export const Web3Button = <TAction extends ActionFn>({
      connectionStatus === "connecting" ||
      connectionStatus === "unknown"
    ) {
-      content = <ActivityIndicator size="small" color={"black"} />;
+      content = <ActivityIndicator size="small" color="buttonTextColor" />;
      buttonLoading = true;
    }
  }
@@ -153,7 +153,7 @@ export const Web3Button = <TAction extends ActionFn>({
  return (
    <ThemeProvider theme={theme}>
      <BaseButton
-        backgroundColor="white"
+        backgroundColor="buttonBackgroundColor"
        onPress={() => {
          actionMutation.mutate();
        }}
@@ -161,7 +161,7 @@ export const Web3Button = <TAction extends ActionFn>({
        disabled={buttonDisabled || buttonLoading}
      >
        {typeof content === "string" ? (
-          <Text variant="bodyLarge" color="black">
+          <Text variant="bodyLarge" color="buttonTextColor">
            {content}
          </Text>
        ) : (
@@ -1,8 +1,16 @@
+export { darkTheme, lightTheme } from "./styles/theme";
+export type { Theme, ButtonTheme } from "./styles/theme";
+
 export { coinbaseWallet } from "./wallets/wallets/coinbase-wallet";
 export { metamaskWallet } from "./wallets/wallets/metamask-wallet";
 export { rainbowWallet } from "./wallets/wallets/rainbow-wallet";
 export { trustWallet } from "./wallets/wallets/trust-wallet";

+export { useCoinbaseWallet } from "./wallets/hooks/useCoinbaseWallet";
+export { useMetaMaskWallet } from "./wallets/hooks/useMetaMaskWallet";
+export { useRainbowWallet } from "./wallets/hooks/useRainbowWallet";
+export { useTrustWallet } from "./wallets/hooks/useTrustWallet";
+
 export { ConnectWallet } from "./components/ConnectWallet";
 export { Web3Button } from "./components/Web3Button";

@@ -9,6 +9,8 @@ import { PropsWithChildren } from "react";
 import type { Chain, defaultChains } from "@thirdweb-dev/chains";
 import { metamaskWallet } from "../wallets/wallets/metamask-wallet";
 import { rainbowWallet } from "../wallets/wallets/rainbow-wallet";
+import { SecureStorage } from "../../core/SecureStorage";
+import { useCoinbaseWalletListener } from "../wallets/hooks/useCoinbaseWalletListener";

 const DEFAULT_WALLETS = [metamaskWallet(), rainbowWallet()];

@@ -56,12 +58,16 @@ export const ThirdwebProvider = <
  createWalletStorage = createAsyncLocalStorage,
  thirdwebApiKey = DEFAULT_API_KEY,
  supportedWallets = DEFAULT_WALLETS,
+  authConfig,
  ...restProps
 }: PropsWithChildren<ThirdwebProviderProps<TChains>>) => {
+  useCoinbaseWalletListener();
+
  return (
    <ThirdwebProviderCore
      thirdwebApiKey={thirdwebApiKey}
      supportedWallets={supportedWallets}
+      authConfig={authConfig ? (authConfig.secureStorage ? authConfig : {...authConfig, secureStorage: new SecureStorage('auth')}) : undefined}
      createWalletStorage={createWalletStorage}
      {...restProps}
    >
@@ -21,8 +21,8 @@ export function ThemeProvider({
        typeof theme_ === "object"
          ? theme_
          : theme_ === "dark"
-          ? darkTheme
-          : lightTheme
+          ? darkTheme()
+          : lightTheme()
      }
    >
      {children}
@@ -1,4 +1,7 @@
 export type Palette = {
+  buttonBackgroundColor: string;
+  buttonTextColor: string;
+
  background: string;
  backgroundHighlight: string;

@@ -23,6 +26,9 @@ export const paletteBase = {
 };

 export const paletteLight: Palette = {
+  buttonBackgroundColor: "white",
+  buttonTextColor: "black",
+
  background: "#F7F7F9",
  backgroundHighlight: "#FFFFFF",

@@ -40,6 +46,9 @@ export const paletteLight: Palette = {
 };

 export const paletteDark: Palette = {
+  buttonBackgroundColor: "white",
+  buttonTextColor: "black",
+
  background: "#131417",
  backgroundHighlight: "#232429",

@@ -2,10 +2,7 @@ import { paletteDark, paletteLight } from "./colors";
 import { textVariants } from "./textVariants";
 import { createTheme } from "@shopify/restyle";

-export const darkTheme = createTheme({
-  colors: {
-    ...paletteDark,
-  },
+export const baseTheme = {
  spacing: {
    none: 0,
    xxs: 6,
@@ -37,13 +34,53 @@ export const darkTheme = createTheme({
    xl: 48,
  },
  textVariants,
+};
+
+const darkTheme_ = createTheme({
+  ...baseTheme,
+  colors: {
+    ...paletteDark,
+  },
 });

-export const lightTheme: Theme = {
-  ...darkTheme,
+const lightTheme_: Theme = {
+  ...baseTheme,
  colors: {
    ...paletteLight,
  },
 };

-export type Theme = typeof darkTheme;
+export type Theme = typeof darkTheme_;
+
+export type ButtonTheme = {
+  buttonBackgroundColor?: string;
+  buttonTextColor?: string;
+};
+
+export const darkTheme = ({
+  buttonBackgroundColor = paletteDark.buttonBackgroundColor,
+  buttonTextColor = paletteDark.buttonTextColor,
+}: ButtonTheme = {}) => {
+  return {
+    ...darkTheme_,
+    colors: {
+      ...darkTheme_.colors,
+      buttonBackgroundColor,
+      buttonTextColor,
+    },
+  };
+};
+
+export const lightTheme = ({
+  buttonBackgroundColor = paletteLight.buttonBackgroundColor,
+  buttonTextColor = paletteLight.buttonTextColor,
+}: ButtonTheme = {}) => {
+  return {
+    ...lightTheme_,
+    colors: {
+      ...lightTheme_.colors,
+      buttonBackgroundColor,
+      buttonTextColor,
+    },
+  };
+};
@@ -60,8 +60,8 @@ export class CoinbaseWalletConnector extends Connector<

    configure({
      callbackURL: options.callbackURL,
-      hostURL: options.hostURL,
-      hostPackageName: options.hostPackageName,
+      hostURL: options.hostURL || new URL("https://wallet.coinbase.com/wsegue"),
+      hostPackageName: options.hostPackageName || "org.toshi",
    });
  }

@@ -0,0 +1,26 @@
+import { useConnect } from "@thirdweb-dev/react-core";
+import { useCallback } from "react";
+import { useCoinbaseWalletListener } from "./useCoinbaseWalletListener";
+
+/**
+ * Hook to connect to the Coinbase wallet.
+ *
+ * const connect = useCoinbaseWallet('org.reactjs.native.example.test15://');
+ * connect();
+ *
+ * @param callbackURL The Universal Link used by Coinbase Wallet to return responses to your application.
+ * @returns connect function to connect to the Coinbase wallet
+ */
+export function useCoinbaseWallet(callbackURL: string) {
+  const connect = useConnect();
+  useCoinbaseWalletListener();
+
+  return useCallback(
+    async (connectOptions?: { chainId?: number; callbackURL: string }) => {
+      const { coinbaseWallet } = await import("../wallets/coinbase-wallet");
+      // @ts-ignore
+      connect(coinbaseWallet({ callbackURL: callbackURL }), connectOptions);
+    },
+    [connect, callbackURL],
+  );
+}
@@ -0,0 +1,18 @@
+import { handleResponse } from "@coinbase/wallet-mobile-sdk";
+import { useEffect } from "react";
+import { Linking } from "react-native";
+
+/**
+ * Coinbase wallet works differently than the other wallets. It requires UniversalLinks to be set up.
+ *
+ * This hook sets up the UniversalLinks listener.
+ */
+export function useCoinbaseWalletListener() {
+  useEffect(() => {
+    const sub = Linking.addEventListener("url", ({ url }) => {
+      // @ts-ignore - Passing a URL object to handleResponse crashes the function
+      handleResponse(url);
+    });
+    return () => sub?.remove();
+  }, []);
+}
@@ -0,0 +1,19 @@
+import { useConnect } from "@thirdweb-dev/react-core";
+import { useCallback } from "react";
+
+/**
+ * const connect = useMetaMaskWallet();
+ * connect();
+ *
+ * @returns connect function to connect to the MetaMask wallet
+ */
+export function useMetaMaskWallet() {
+  const connect = useConnect();
+  return useCallback(
+    async (connectOptions?: { chainId?: number }) => {
+      const { metamaskWallet } = await import("../wallets/metamask-wallet");
+      connect(metamaskWallet(), connectOptions);
+    },
+    [connect],
+  );
+}
@@ -0,0 +1,19 @@
+import { useConnect } from "@thirdweb-dev/react-core";
+import { useCallback } from "react";
+
+/**
+ * const connect = useRainbowWallet();
+ * connect();
+ *
+ * @returns connect function to connect to the Rainbow wallet
+ */
+export function useRainbowWallet() {
+  const connect = useConnect();
+  return useCallback(
+    async (connectOptions?: { chainId?: number }) => {
+      const { rainbowWallet } = await import("../wallets/rainbow-wallet");
+      connect(rainbowWallet(), connectOptions);
+    },
+    [connect],
+  );
+}
@@ -0,0 +1,19 @@
+import { useConnect } from "@thirdweb-dev/react-core";
+import { useCallback } from "react";
+
+/**
+ * const connect = useTrustWallet();
+ * connect();
+ *
+ * @returns connect function to connect to the Trust wallet
+ */
+export function useTrustWallet() {
+  const connect = useConnect();
+  return useCallback(
+    async (connectOptions?: { chainId?: number }) => {
+      const { trustWallet } = await import("../wallets/trust-wallet");
+      connect(trustWallet(), connectOptions);
+    },
+    [connect],
+  );
+}
@@ -1,5 +1,35 @@
 # @thirdweb-dev/react

+## 3.11.8
+
+### Patch Changes
+
+- [#892](https://github.com/thirdweb-dev/js/pull/892) [`4acb2b55`](https://github.com/thirdweb-dev/js/commit/4acb2b5561118dde5c7372400d4d754b879aef2e) Thanks [@MananTank](https://github.com/MananTank)! - Add Switch Account button for MetaMask
+
+- [#919](https://github.com/thirdweb-dev/js/pull/919) [`81770647`](https://github.com/thirdweb-dev/js/commit/81770647ab2b3b621c663dadd9878ed0ee0da8cb) Thanks [@MananTank](https://github.com/MananTank)! - improved device wallet password input autocomplete
+
+- [#914](https://github.com/thirdweb-dev/js/pull/914) [`ec36df5f`](https://github.com/thirdweb-dev/js/commit/ec36df5f754f35c0c9ee0a3794046f4de46c254d) Thanks [@MananTank](https://github.com/MananTank)! - Add "Request Testnet funds" for LocalHost
+
+- [#895](https://github.com/thirdweb-dev/js/pull/895) [`06cc1df3`](https://github.com/thirdweb-dev/js/commit/06cc1df3b7906584c9e2e69fddc4a2d831c237f9) Thanks [@MananTank](https://github.com/MananTank)! - Fix supportedChains not having the activeChain for wallets
+
+- [#887](https://github.com/thirdweb-dev/js/pull/887) [`430a5f79`](https://github.com/thirdweb-dev/js/commit/430a5f793419173775a434e0b2a21f70223e3813) Thanks [@MananTank](https://github.com/MananTank)! - export Configurable NetworkSelector
+
+- [#918](https://github.com/thirdweb-dev/js/pull/918) [`26644d63`](https://github.com/thirdweb-dev/js/commit/26644d63b5773124d4c6be41be609f27167940af) Thanks [@MananTank](https://github.com/MananTank)! - Fix Connect Wallet Modal width on tablet size viewport
+
+- [#917](https://github.com/thirdweb-dev/js/pull/917) [`09fae984`](https://github.com/thirdweb-dev/js/commit/09fae984e7f954628d717b25e2269b853c0c17fc) Thanks [@MananTank](https://github.com/MananTank)! - Device Wallet and other Connect Wallet UI improvements
+
+- [#920](https://github.com/thirdweb-dev/js/pull/920) [`3010d845`](https://github.com/thirdweb-dev/js/commit/3010d845951735a7ce1aa85cb5959eddcc54bf6c) Thanks [@MananTank](https://github.com/MananTank)! - Improved autocomplete for imported device wallet
+
+- [#910](https://github.com/thirdweb-dev/js/pull/910) [`c2fec930`](https://github.com/thirdweb-dev/js/commit/c2fec930520e2df89532ec0027ead4563c7708cf) Thanks [@joaquim-verges](https://github.com/joaquim-verges)! - Allow passing any EVMWallet to SafeWallet as personal signer
+
+- [#909](https://github.com/thirdweb-dev/js/pull/909) [`d8b54a6f`](https://github.com/thirdweb-dev/js/commit/d8b54a6f91d5943bd7c0720b0e0bff05c4be89e5) Thanks [@MananTank](https://github.com/MananTank)! - Add back device wallet UI
+
+- Updated dependencies [[`abe88599`](https://github.com/thirdweb-dev/js/commit/abe88599b634699aa3b876fe344bfddc6c1a92d4), [`49922de9`](https://github.com/thirdweb-dev/js/commit/49922de9d9c1258e58a3a05e656b229db469b1dd), [`4acb2b55`](https://github.com/thirdweb-dev/js/commit/4acb2b5561118dde5c7372400d4d754b879aef2e), [`82bea3fa`](https://github.com/thirdweb-dev/js/commit/82bea3fa10294eb3c5c7327fb047e3d1b2c62ff9), [`ea04edf4`](https://github.com/thirdweb-dev/js/commit/ea04edf47867617ff74f0aca1471a40b8d9c9f7c), [`77224646`](https://github.com/thirdweb-dev/js/commit/77224646d542db3171394d744b455497cd057633), [`c9ee9b32`](https://github.com/thirdweb-dev/js/commit/c9ee9b32f0a275f7c03d50243f23a7332f148ae5), [`00f4355f`](https://github.com/thirdweb-dev/js/commit/00f4355f1aa8843bb534b173e4d8e0a19dd18b47), [`a6610f12`](https://github.com/thirdweb-dev/js/commit/a6610f1211e9359885b948bf69a66d834707ec07), [`06cc1df3`](https://github.com/thirdweb-dev/js/commit/06cc1df3b7906584c9e2e69fddc4a2d831c237f9), [`29146e00`](https://github.com/thirdweb-dev/js/commit/29146e009db655304f5753904ae7f8569c12f4ca), [`77224646`](https://github.com/thirdweb-dev/js/commit/77224646d542db3171394d744b455497cd057633), [`430a5f79`](https://github.com/thirdweb-dev/js/commit/430a5f793419173775a434e0b2a21f70223e3813), [`664d1cd0`](https://github.com/thirdweb-dev/js/commit/664d1cd0dd03f32337c2cf532f0ad860e5aa5ea8), [`bfdd8493`](https://github.com/thirdweb-dev/js/commit/bfdd84939d7cf9c6635b83c971bcc8967b52538c), [`c2fec930`](https://github.com/thirdweb-dev/js/commit/c2fec930520e2df89532ec0027ead4563c7708cf), [`477324ec`](https://github.com/thirdweb-dev/js/commit/477324ec85b800dcbc54b709430c77fb63b16537)]:
+  - @thirdweb-dev/sdk@3.10.11
+  - @thirdweb-dev/react-core@3.11.8
+  - @thirdweb-dev/wallets@0.2.16
+  - @thirdweb-dev/chains@0.1.12
+
 ## 3.11.7

 ### Patch Changes
@@ -1,6 +1,6 @@
 {
  "name": "@thirdweb-dev/react",
-  "version": "3.11.7",
+  "version": "3.11.8",
  "repository": "https://github.com/thirdweb-dev/js/tree/main/packages/react",
  "author": "thirdweb eng <[email protected]>",
  "license": "Apache-2.0",
@@ -137,6 +137,7 @@
    "buffer": "^6.0.3",
    "copy-to-clipboard": "^3.3.2",
    "detect-browser": "^5.3.0",
+    "fuse.js": "^6.6.2",
    "react-qr-code": "^2.0.11",
    "tiny-invariant": "^1.2.0"
  },
@@ -12,6 +12,7 @@ export const ChainIcon: React.FC<{
  size: string;
  active?: boolean;
  className?: string;
+  loading?: "lazy" | "eager";
 }> = (props) => {
  const url = props.chain?.icon?.url;
  const src = url ? resolveIpfsUri(url) : defaultChainIcon;
@@ -36,6 +37,12 @@ export const ChainIcon: React.FC<{
        width={props.size}
        height={props.size}
        className={props.className}
+        loading={props.loading}
+        style={{
+          objectFit: "contain",
+          width: props.size + "px",
+          height: props.size + "px",
+        }}
      />
      {props.active && <ActiveDot />}
    </div>
@@ -0,0 +1,190 @@
+import { useState } from "react";
+import { UploadIcon } from "@radix-ui/react-icons";
+import { Theme, fontSize, iconSize, radius, spacing } from "../design-system";
+import styled from "@emotion/styled";
+import { Spacer } from "./Spacer";
+import { isMobile } from "../evm/utils/isMobile";
+import { IconFC } from "../wallet/ConnectWallet/icons/types";
+
+export const DragNDrop: React.FC<{
+  extension: string;
+  accept: string;
+  onUpload: (file: File) => void;
+}> = (props) => {
+  const [error, setError] = useState(false);
+  const [uploaded, setUploaded] = useState<File | undefined>();
+  const [isDragging, setIsDragging] = useState(false);
+
+  const dragIn: React.DragEventHandler<HTMLDivElement> = (e) => {
+    setError(false);
+    setUploaded(undefined);
+    setIsDragging(true);
+
+    e.preventDefault();
+    e.stopPropagation();
+  };
+
+  const dragOut: React.DragEventHandler<HTMLDivElement> = (e) => {
+    setIsDragging(false);
+    e.preventDefault();
+    e.stopPropagation();
+  };
+
+  const handleFileUpload = (file: File) => {
+    if (file.type !== props.accept) {
+      setError(true);
+    } else {
+      setUploaded(file);
+      props.onUpload(file);
+    }
+  };
+
+  const drop: React.DragEventHandler<HTMLDivElement> = (e) => {
+    setIsDragging(false);
+    e.preventDefault();
+    e.stopPropagation();
+
+    if (e.dataTransfer.files && e.dataTransfer.files.length > 0) {
+      handleFileUpload(e.dataTransfer.files[0]);
+      e.dataTransfer.clearData();
+    }
+  };
+
+  const message = isMobile()
+    ? "Click to Upload"
+    : "Drop your file here or click to upload";
+
+  return (
+    <div
+      onDragEnter={dragIn}
+      onDragLeave={dragOut}
+      onDragOver={(e) => {
+        setIsDragging(true);
+        e.preventDefault();
+        e.stopPropagation();
+      }}
+      onClick={() => {
+        setError(false);
+      }}
+      onDrop={drop}
+      style={{
+        cursor: "pointer",
+      }}
+    >
+      <label htmlFor="file-upload">
+        <input
+          id="file-upload"
+          type="file"
+          accept={props.accept}
+          multiple={false}
+          style={{
+            display: "none",
+          }}
+          onChange={(e) => {
+            if (e.target.files && e.target.files.length > 0) {
+              handleFileUpload(e.target.files[0]);
+            }
+          }}
+        />
+
+        <DropContainer data-error={error} data-is-dragging={isDragging}>
+          {!uploaded ? (
+            <>
+              {" "}
+              <UploadIconSecondary width={iconSize.xl} height={iconSize.xl} />
+              <Spacer y="md" />
+              <Message>{message}</Message>
+              <Spacer y="md" />
+              {error ? (
+                <ErrorMessage>
+                  {" "}
+                  Please upload a {props.extension} file{" "}
+                </ErrorMessage>
+              ) : (
+                <ExtensionText> {props.extension} </ExtensionText>
+              )}
+            </>
+          ) : (
+            <>
+              <Message>{uploaded.name} uploaded successfully</Message>
+              <Spacer y="md" />
+              <CheckCircleIcon size={iconSize.xl} />
+            </>
+          )}
+        </DropContainer>
+      </label>
+    </div>
+  );
+};
+
+const UploadIconSecondary = styled(UploadIcon)<{ theme?: Theme }>`
+  color: ${(props) => props.theme.text.secondary};
+  transition: transform 200ms ease, color 200ms ease;
+`;
+
+const DropContainer = styled.div<{ theme?: Theme }>`
+  border: 2px solid ${(p) => p.theme.bg.elevated};
+  border-radius: ${radius.md};
+  padding: ${spacing.xl} ${spacing.md};
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  cursor: pointer;
+  transition: border-color 200ms ease;
+
+  &:hover,
+  &[data-is-dragging="true"] {
+    border-color: ${(p) => p.theme.link.primary};
+    svg {
+      color: ${(p) => p.theme.link.primary};
+      transform: translateY(-8px);
+    }
+  }
+
+  &[data-error="true"] {
+    border-color: ${(p) => p.theme.input.errorRing};
+  }
+`;
+
+const ErrorMessage = styled.p<{ theme?: Theme }>`
+  color: ${(p) => p.theme.input.errorRing};
+  font-size: ${fontSize.sm};
+  margin: 0;
+`;
+
+const ExtensionText = styled.span<{ theme?: Theme }>`
+  color: ${(p) => p.theme.text.secondary};
+  font-size: ${fontSize.sm};
+`;
+
+const CheckCircleIcon: IconFC = (props) => (
+  <svg
+    width={props.size}
+    height={props.size}
+    viewBox="0 0 38 38"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <path
+      d="M35.6666 17.4671V19.0004C35.6645 22.5945 34.5008 26.0916 32.3488 28.9701C30.1969 31.8487 27.1721 33.9546 23.7255 34.9736C20.279 35.9926 16.5954 35.8703 13.224 34.6247C9.85272 33.3792 6.97434 31.0773 5.01819 28.0622C3.06203 25.0472 2.1329 21.4805 2.36938 17.8943C2.60586 14.308 3.99526 10.8943 6.33039 8.16221C8.66551 5.43012 11.8212 3.52606 15.3269 2.734C18.8326 1.94194 22.5004 2.30432 25.7833 3.76709"
+      stroke="#5BD58C"
+      strokeWidth="3.33333"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+    />
+    <path
+      d="M35.6667 5.66699L19 22.3503L14 17.3503"
+      stroke="#5BD58C"
+      strokeWidth="3.33333"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+    />
+  </svg>
+);
+
+const Message = styled.p<{ theme?: Theme }>`
+  color: ${(p) => p.theme.text.neutral};
+  font-size: ${fontSize.md};
+  margin: 0;
+  font-weight: 600;
+`;
@@ -143,6 +143,7 @@ const DialogContent = styled.div<{ theme?: Theme }>`
    border-radius: ${radius.xxl};
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
+    max-width: none !important;
  }

  & *::selection {
@@ -52,6 +52,8 @@ const TooltipContent = styled(RadixTooltip.Content)<{ theme?: Theme }>`
  will-change: transform, opacity;
  animation: ${slideUpAndFade} 200ms cubic-bezier(0.16, 1, 0.3, 1);
  z-index: 999999999999999;
+  max-width: 300px;
+  line-height: 1.5;
 `;

 const TooltipArrow = styled(RadixTooltip.Arrow)<{ theme?: Theme }>`
@@ -1,9 +1,9 @@
-import { fontSize, radius, shadow, spacing, Theme } from "../design-system";
+import { fontSize, radius, spacing, Theme } from "../design-system";
 import styled from "@emotion/styled";

 // for rendering a conventional button
 export const Button = styled.button<{
-  variant: "inverted" | "secondary";
+  variant: "inverted" | "secondary" | "link" | "danger";
  theme?: Theme;
 }>`
  all: unset;
@@ -27,16 +27,31 @@ export const Button = styled.button<{
            return p.theme.bg.invertedFocused;
          case "secondary":
            return p.theme.bg.highlighted;
+          case "danger":
+            return p.theme.text.danger;
        }
      }};
  }

+  box-shadow: ${(p) => {
+    switch (p.variant) {
+      case "danger":
+        return `0 0 0 2px ${p.theme.text.danger}`;
+      default:
+        return "none";
+    }
+  }};
+
  background: ${(p) => {
    switch (p.variant) {
      case "inverted":
        return p.theme.bg.inverted;
      case "secondary":
        return p.theme.bg.elevated;
+      case "link":
+        return "transparent";
+      case "danger":
+        return "none";
    }
  }};
  color: ${(p) => {
@@ -45,10 +60,13 @@ export const Button = styled.button<{
        return p.theme.text.inverted;
      case "secondary":
        return p.theme.text.neutral;
+      case "link":
+        return p.theme.link.primary;
+      case "danger":
+        return p.theme.text.danger;
    }
  }};
  cursor: pointer;
-  box-shadow: ${shadow.sm};

  /* pressed effect */
  &:active {
@@ -20,6 +20,8 @@ export const Input = styled.input<{
  border: none;
  border-radius: 6px;
  color: ${(p) => p.theme.text.neutral};
+  -webkit-appearance: none;
+  appearance: none;
  background: ${(p) => {
    switch (p.variant) {
      case "secondary":
@@ -67,6 +69,10 @@ export const Input = styled.input<{
  &[data-error="true"] {
    box-shadow: 0 0 0 2px ${(p) => p.theme.input.errorRing};
  }
+
+  &[disabled] {
+    cursor: not-allowed;
+  }
 `;

 // for rendering a input and a button side by side
@@ -96,3 +102,9 @@ export const ErrorMessage = styled.p<{ theme?: Theme }>`
  display: block;
  color: ${(p) => p.theme.input.errorRing};
 `;
+
+export const FormFooter = styled.div`
+  display: flex;
+  justify-content: flex-end;
+  gap: ${spacing.md};
+`;
@@ -20,7 +20,7 @@ export const FormFieldWithIconButton: React.FC<{
  return (
    <div>
      <Label htmlFor={props.id}>{props.label}</Label>
-      <Spacer y="xs" />
+      <Spacer y="sm" />

      <InputContainer data-error={!!props.error}>
        <Input
@@ -60,11 +60,12 @@ export const FormField: React.FC<{
  label: string;
  placeholder?: string;
  errorMessage?: string;
+  disabled?: boolean;
 }> = (props) => {
  return (
    <div>
      <Label htmlFor={props.id}>{props.label}</Label>
-      <Spacer y="xs" />
+      <Spacer y="sm" />

      <Input
        variant="outline"
@@ -77,6 +78,7 @@ export const FormField: React.FC<{
        type={props.type}
        data-error={!!props.errorMessage}
        placeholder={props.placeholder}
+        disabled={props.disabled}
      />

      {props.errorMessage && (
@@ -5,24 +5,32 @@ import styled from "@emotion/styled";
 import { Title } from "@radix-ui/react-dialog";
 import { ChevronLeftIcon } from "@radix-ui/react-icons";

-export const ModalTitle = styled(Title)<{ theme?: Theme }>`
+export const ModalTitle = styled(Title)<{
+  theme?: Theme;
+  centerOnMobile?: boolean;
+}>`
  margin: 0;
  font-weight: 600;
  font-size: ${fontSize.lg};
  color: ${(p) => p.theme.text.neutral};
+  text-align: left;
  ${media.mobile} {
-    text-align: center;
+    text-align: ${(p) => (p.centerOnMobile ? "center" : "left")};
  }
 `;

-export const ModalDescription = styled.p<{ theme?: Theme }>`
+export const ModalDescription = styled.p<{
+  theme?: Theme;
+  centerOnMobile?: boolean;
+  sm?: boolean;
+}>`
  all: unset;
  display: block;
-  font-size: ${fontSize.md};
+  font-size: ${(p) => (p.sm ? fontSize.sm : fontSize.md)};
  color: ${(p) => p.theme.text.secondary};
  line-height: 1.5;
  ${media.mobile} {
-    text-align: center;
+    text-align: ${(p) => (p.centerOnMobile ? "center" : "left")};
  }
 `;

@@ -6,11 +6,12 @@ import {
  UseQueryResult,
  useQueryClient,
 } from "@tanstack/react-query";
+import type { PaperSupportedChainId } from "@thirdweb-dev/wallets/evm/connectors/paper";

 export function usePaperWallet() {
  const connect = useConnect();
  return useCallback(
-    async (options: { chainId?: number; clientId: string }) => {
+    async (options: { chainId?: PaperSupportedChainId; clientId: string }) => {
      const { paperWallet } = await import(
        "../../../wallet/wallets/paperWallet"
      );
@@ -1,6 +1,8 @@
 export { useSafe } from "./connectors/gnosis";

 export { ConnectWallet } from "../wallet/ConnectWallet/ConnectWallet";
+export { NetworkSelector } from "../wallet/ConnectWallet/NetworkSelector";
+export type { NetworkSelectorProps } from "../wallet/ConnectWallet/NetworkSelector";

 // UI components
 export * from "./components/MediaRenderer";
@@ -12,7 +12,9 @@ type Screen =
  | "coinbase/get-started"
  | "safe/select-wallet"
  | "safe/form"
-  | "wallets/get-started";
+  | "wallets/get-started"
+  | "deviceWallet/connect"
+  | "deviceWallet/export";

 const SafeConnection = createContext(false);
 const SetSafeConnection = createContext<BoolSetter | undefined>(undefined);
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
github-actions[bot]GitHubgithub-actions[bot] <github-actions[bot]@users.noreply.github.com>	7c15913e46	Version Packages (#883 ) Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>	2023-04-20 21:57:14 -07:00
Adam MajmudarandGitHub	477324ec85	[Auth] Add useAuth back to @thirdweb-dev/react (#922 )	2023-04-19 20:05:51 +00:00
Yash GitHub Joaquim Verges	c9ee9b32f0	[SDK] Fix error handling for create2 factory deployments (#915 ) Co-authored-by: Joaquim Verges <[email protected]>	2023-04-18 23:40:50 +00:00
Manan TankandGitHub	3010d84595	[react] improved autocomplete for imported device wallet (#920 )	2023-04-18 21:01:57 +00:00
Manan TankandGitHub	81770647ab	[react] improved device wallet password input autocomplete (#919 )	2023-04-18 19:14:05 +00:00
Manan TankandGitHub	26644d63b5	Fix Connect Wallet Modal max-width on tablet (#918 )	2023-04-18 17:33:01 +00:00
Manan TankandGitHub	09fae984e7	[react] Device wallet and other UI improvements (#917 )	2023-04-18 15:57:11 +00:00
iketwandGitHub	0b1f522906	[ReactNative] Improve theming for Web3Button and ConnectWallet (#916 )	2023-04-17 21:32:43 +00:00
Manan TankandGitHub	ec36df5f75	Add Request Testnet Funds for Localhost (#914 )	2023-04-17 11:00:46 +00:00
Manan TankandGitHub	c93edc4999	[wallets] paper: add Avalanche (#913 )	2023-04-17 09:20:13 +00:00
YashandGitHub	29146e009d	[SDK] Fix listing validation for marketplace v2 & v3 (#907 )	2023-04-15 01:14:25 +00:00
Adam MajmudarandGitHub	ea04edf478	[SDK] Fix StaticJsonBatchRpcProvider (#911 )	2023-04-14 23:54:39 +00:00
Joaquim VergesandGitHub	c2fec93052	[Wallets] Allow passing any EVMWallet as personal Safe signer (#910 )	2023-04-14 23:20:34 +00:00
Manan TankandGitHub	d8b54a6f91	[react] add back device wallet UI (#909 )	2023-04-14 22:43:30 +00:00
Manan TankandGitHub	664d1cd0dd	[wallets] fix dynamic import error of crypto-js on vite (#908 )	2023-04-14 20:40:16 +00:00
Manan TankandGitHub	4275c8e739	[wallets] device wallet fixes (#906 )	2023-04-14 19:55:30 +00:00
Manan TankandGitHub	82bea3fa10	[wallets] Device Wallet Revamp (#901 )	2023-04-14 17:15:30 +00:00
YashandGitHub	8e8ceaa344	[SDK] Update Weth addresses (#902 )	2023-04-14 05:12:26 +00:00
Joaquim VergesandGitHub	77224646d5	[SDK] more transaction error parsing (#903 )	2023-04-14 05:11:53 +00:00
Adam MajmudarandGitHub	72db2dc3e1	[CLI] Add cleaner messages to thirdweb generate (#894 )	2023-04-13 18:29:54 +00:00
Joaquim VergesandGitHub	abe88599b6	[SDK] fix gasless open pack (#898 )	2023-04-12 22:38:23 +00:00
Atharva Deosthale GitHub Jonas Daniels	a6610f1211	Portal Links added to functions (#896 ) Co-authored-by: Jonas Daniels <[email protected]>	2023-04-11 23:20:14 +00:00
YashandGitHub	bfdd84939d	[SDK] Enable MarketplaceV3 deploys on any EVM (#885 )	2023-04-11 23:07:10 +00:00
Manan TankandGitHub	06cc1df3b7	Fix supported chains not having activeChain for wallets (#895 )	2023-04-11 22:21:07 +00:00
Manan TankandGitHub	4acb2b5561	[react] add switch account for MetaMask (#892 )	2023-04-10 21:38:15 +00:00
Adam MajmudarandGitHub	00f4355f1a	[SDK] Add ability to batch list on marketplace v3 (#890 )	2023-04-10 19:59:55 +00:00
Manan TankandGitHub	430a5f7934	[React] network selector revamp (#887 )	2023-04-08 04:34:48 +00:00
iketwandGitHub	51e6b4146e	[ReactNative] Fixes Coinbase Wallet Connect for iOS (#886 )	2023-04-07 17:29:42 +00:00
iketwandGitHub	49922de9d9	[Core/RN] Implements auth for React Native (#874 )	2023-04-07 00:43:56 +00:00
				`@@ -0,0 +1 @@`
				`export const AUTH_TOKEN_STORAGE_KEY = "auth_token_storage_key";`