Version Packages (#223)

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

.changeset/config.json

@@ -9,7 +9,8 @@
   "updateInternalDependencies": "patch",
   "ignore": [],
   "___experimentalUnsafeOptions_WILL_CHANGE_IN_PATCH": {
-    "updateInternalDependents": "always"
+    "updateInternalDependents": "always",
+    "onlyUpdatePeerDependentsWhenOutOfRange": true
   },
   "snapshot": {
     "useCalculatedVersion": true,

.github/contributing.md

@@ -1,5 +1,9 @@
 # Contributing to thirdweb
 
+You can find a full video tutorial on how to contribute to thirdweb below:
+
+https://www.youtube.com/watch?v=TXsQ3qok3B0
+
 ## Getting Started
 
 To get started, read the [How this repo works](#how-this-repo-works) section below to learn about the structure of this repo.
@@ -16,7 +20,7 @@ If you have any questions about the issue, feel free to ask on our [Discord serv
 
 We use [Turborepo](https://turborepo.org/docs/getting-started) to manage the monorepo, and help speed up the [CI/CD](https://www.atlassian.com/continuous-delivery/principles/continuous-integration-vs-delivery-vs-deployment) pipeline to ship to production faster 🚢.
 
-You can see a quick outline of each of the projects within this repo below, which each live within the [/packages](/packages) directory:
+You can see a quick outline of each of the projects within this repo below, each living within the [/packages](/packages) directory:
 
 | Package                        | Description                                                          | Latest Version                                                                                                                                                                   |
 | ------------------------------ | -------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
@@ -58,75 +62,75 @@ To begin:
 
 Now you have got the repo on your local machine, and you're ready to start making your changes!
 
+### Test Your Changes
+
+We use [yalc](https://github.com/wclr/yalc) to test changes locally.
+
+Install the yalc CLI globally:
+
+```bash
+yarn global add yalc
+```
+
+First, create a test project where you can experiment with your changes:
+
+You can create a basic starter project with the `sdk` and `react` packages installed using the CLI:
+
+```bash
+npx thirdweb create --app
+```
+
+Use `yalc` to link your local changes in the monorepo to the test project, by running the following command from your test repo:
+
+```bash
+yalc add @thirdweb-dev/react # Link the react package
+yalc add @thirdweb-dev/sdk # Link the sdk package
+# etc...
+```
+
+From the monorepo, run the following command to publish your local changes to the test project:
+
+```bash
+yarn push
+```
+
+Now, each time you make a change to the monorepo, you can run `yarn push` to publish your changes to the test project.
+
+In your test project, you need to:
+
+1. Delete the dependencies cache. If you're using Next.js, that is the `.next` directory, and if you're using CRA, that is the `node_modules/.cache` directory.
+2. Restart the development server.
+
 <br/>
 
 ### Publish Your Changes
 
+Once you're satisfied with your changes, you are ready to submit them for review!
+
 1. Use [changeset](https://github.com/changesets/changesets) to generate a changeset file:
 
-   ```
-   yarn changeset
-   ```
+```
+yarn changeset
+```
 
-   We follow [semantic versioning](https://semver.org/) for generating versioned releases of our packages (i.e. version = `MAJOR.MINOR.PATCH`)
+We follow [semantic versioning](https://semver.org/) for generating versioned releases of our packages (i.e. version = `MAJOR.MINOR.PATCH`)
 
-   - Update `major` for breaking changes
-   - Update `minor` for new features,
-   - Update `patch` for non-breaking bug fixes, etc)
+- Update `major` for breaking changes
+- Update `minor` for new features,
+- Update `patch` for non-breaking bug fixes, etc)
 
 2. Commit the changeset along with your changes:
 
-   ```
-   git commit -am "My commit message"
-   ```
+```
+git commit -am "My commit message"
+```
 
 3. Push your changes to the SDK:
 
-   ```
-    git push origin MY_BRANCH_NAME
-   ```
+```
+git push origin MY_BRANCH_NAME
+```
 
 4. Create a [pull request](https://www.atlassian.com/git/tutorials/making-a-pull-request) to the `main` branch of the official (not your fork) SDK repo.
 
-   It's helpful to tag PRs with `[SDK]`, `[REACT]`, `[AUTH]`, (the name of the package you're modifying) to indicate the package that you are engaging with.
-
-<br/>
-
-### Testing Your Changes
-
-When you make a pull request, your changes will be tested automatically by our CI/CD pipeline using [GitHub Actions](https://github.com/features/actions).
-
-On your pull request, you can release your changes to a `dev` version by adding a **comment** with the following text:
-
-```
-/release-pr
-```
-
-This comment triggers the `release-pr` GitHub Action that publishes your changes to a `dev` version of the package(s) you are modifying.
-
-Once this is done, you can test your changes by installing the `dev` version of the package(s).
-
-If you don't already have a test project, you can use the [CLI](https://github.com/thirdweb-dev/thirdweb-cli) to create one:
-
-```bash
-npx thirdweb create
-```
-
-Inside your test project, you can install the `dev` version of the package(s) you are modifying.
-
-For example, if you are modifying the `@thirdweb-dev/react` package, you can install the `dev` version of the package by running:
-
-```
-yarn add @thirdweb-dev/sdk@dev
-```
-
-This will install the `dev` version of the `@thirdweb-dev/react` package in your project, as you can see in the `package.json` file:
-
-```diff
-  "dependencies": {
--    "@thirdweb-dev/react": "^2",
-+    "@thirdweb-dev/react": "^2.9.7-dev-b073878",
-   }
-```
-
-You can now test your changes in your test project!
+It's helpful to tag PRs with `[SDK]`, `[REACT]`, `[AUTH]`, (the name of the package you're modifying) to indicate the package that you are engaging with.

package.json

@@ -12,7 +12,7 @@
     ]
   },
   "scripts": {
-    "test": "turbo run test",
+    "test": "turbo run test && turbo run test:evm && turbo run test:solana",
     "e2e": "turbo run e2e",
     "build": "turbo run build",
     "build:release": "turbo run build --force",
@@ -26,7 +26,8 @@
     "version-packages": "changeset version",
     "release": "node ./scripts/pre-release.mjs && changeset publish",
     "version-packages:nightly": "changeset version --snapshot nightly",
-    "release:nightly": "node ./scripts/pre-release.mjs && changeset publish --tag nightly"
+    "release:nightly": "node ./scripts/pre-release.mjs && changeset publish --tag nightly",
+    "push": "turbo run push"
   },
   "preconstruct": {
     "packages": [
@@ -43,7 +44,8 @@
     "eslint": "^8.21.0",
     "postinstall-postinstall": "^2.1.0",
     "prettier": "^2.7.1",
-    "turbo": "^1.4.6"
+    "turbo": "^1.4.6",
+    "yalc": "^1.0.0-pre.53"
   },
   "manypkg": {
     "defaultBranch": "main"

packages/auth/CHANGELOG.md

@@ -1,5 +1,30 @@
 # @thirdweb-dev/auth
 
+## 2.0.10
+
+## 2.0.9
+
+## 2.0.8
+
+### Patch Changes
+
+- Updated dependencies [[`ce05bfd`](https://github.com/thirdweb-dev/js/commit/ce05bfd8615a9c79664856bce53de8b43bed5c87)]:
+  - @thirdweb-dev/sdk@3.0.8
+
+## 2.0.7
+
+### Patch Changes
+
+- Updated dependencies [[`5f5ab01`](https://github.com/thirdweb-dev/js/commit/5f5ab015e1dd3c471d6affe995ef36ec88932b3c)]:
+  - @thirdweb-dev/sdk@3.0.7
+
+## 2.0.6
+
+### Patch Changes
+
+- Updated dependencies [[`a80fc97`](https://github.com/thirdweb-dev/js/commit/a80fc97b6a1e72ed46a400b4b602e180947fb870)]:
+  - @thirdweb-dev/sdk@3.0.6
+
 ## 2.0.5
 
 ### Patch Changes

packages/auth/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thirdweb-dev/auth",
-  "version": "2.0.5",
+  "version": "2.0.10",
   "exports": {
     "./package.json": "./package.json",
     "./express": {

packages/cli/CHANGELOG.md

@@ -1,5 +1,40 @@
 # thirdweb
 
+## 0.7.21
+
+### Patch Changes
+
+- Updated dependencies [[`666ff5f`](https://github.com/thirdweb-dev/js/commit/666ff5f694f1e146150ddb9fa3233f00533b6d60), [`0dade96`](https://github.com/thirdweb-dev/js/commit/0dade96d0d2553d25b386d822e534eb7ed0aefa9), [`c295a47`](https://github.com/thirdweb-dev/js/commit/c295a47144cd722c6f8861c1ec567b53a05ea0bf)]:
+  - @thirdweb-dev/sdk@3.1.1
+
+## 0.7.20
+
+### Patch Changes
+
+- Updated dependencies [[`3c8f620`](https://github.com/thirdweb-dev/js/commit/3c8f6205e9b49ae9fea1f9629678210c6c9c36e6), [`e187d21`](https://github.com/thirdweb-dev/js/commit/e187d21e123a506fac0459da18f2d4fc94abae29), [`acbabc8`](https://github.com/thirdweb-dev/js/commit/acbabc8999b2b7b6e0eb89cae97e2f1ef7143501), [`b030a86`](https://github.com/thirdweb-dev/js/commit/b030a866080953bbf4e504ddc41d7050b250d2d7)]:
+  - @thirdweb-dev/sdk@3.1.0
+
+## 0.7.19
+
+### Patch Changes
+
+- Updated dependencies [[`ce05bfd`](https://github.com/thirdweb-dev/js/commit/ce05bfd8615a9c79664856bce53de8b43bed5c87)]:
+  - @thirdweb-dev/sdk@3.0.8
+
+## 0.7.18
+
+### Patch Changes
+
+- Updated dependencies [[`5f5ab01`](https://github.com/thirdweb-dev/js/commit/5f5ab015e1dd3c471d6affe995ef36ec88932b3c)]:
+  - @thirdweb-dev/sdk@3.0.7
+
+## 0.7.17
+
+### Patch Changes
+
+- Updated dependencies [[`a80fc97`](https://github.com/thirdweb-dev/js/commit/a80fc97b6a1e72ed46a400b4b602e180947fb870)]:
+  - @thirdweb-dev/sdk@3.0.6
+
 ## 0.7.16
 
 ### Patch Changes

packages/cli/package.json

@@ -1,7 +1,7 @@
 {
   "name": "thirdweb",
   "main": "dist/cli/index.js",
-  "version": "0.7.16",
+  "version": "0.7.21",
   "repository": "https://github.com/thirdweb-dev/js/tree/main/packages/cli",
   "author": "thirdweb eng <[email protected]>",
   "license": "Apache-2.0",

packages/cli/src/core/detection/detect.ts

@@ -5,7 +5,7 @@ import { Detector } from "./detector";
 import FoundryDetector from "./foundry";
 import HardhatDetector from "./hardhat";
 import TruffleDetector from "./truffle";
-import fs, { exists, existsSync } from "fs";
+import fs, { existsSync } from "fs";
 import inquirer from "inquirer";
 import { parse } from "path";
 

packages/react/CHANGELOG.md

@@ -1,5 +1,54 @@
 # @thirdweb-dev/react
 
+## 3.1.1
+
+### Patch Changes
+
+- [#221](https://github.com/thirdweb-dev/js/pull/221) [`c295a47`](https://github.com/thirdweb-dev/js/commit/c295a47144cd722c6f8861c1ec567b53a05ea0bf) Thanks [@jnsdls](https://github.com/jnsdls)! - fix esm exports
+
+## 3.1.0
+
+### Minor Changes
+
+- [#213](https://github.com/thirdweb-dev/js/pull/213) [`e187d21`](https://github.com/thirdweb-dev/js/commit/e187d21e123a506fac0459da18f2d4fc94abae29) Thanks [@joaquim-verges](https://github.com/joaquim-verges)! - New @thirdweb-dev/react/solana entrypoint
+
+### Patch Changes
+
+- [#208](https://github.com/thirdweb-dev/js/pull/208) [`7c86bab`](https://github.com/thirdweb-dev/js/commit/7c86babb86e02f08a630ed7578036202eb3dbe66) Thanks [@jnsdls](https://github.com/jnsdls)! - add a bunch of initial solana hooks
+
+- [#218](https://github.com/thirdweb-dev/js/pull/218) [`1eaedc2`](https://github.com/thirdweb-dev/js/commit/1eaedc262f0665de2a6a0446402b570371136e05) Thanks [@jnsdls](https://github.com/jnsdls)! - allow both `null` and `undefined` to be passed as a `RequiredParam`
+
+- [#220](https://github.com/thirdweb-dev/js/pull/220) [`37a707f`](https://github.com/thirdweb-dev/js/commit/37a707f98c00140ddedb1d876a4b2f99fe25556a) Thanks [@joaquim-verges](https://github.com/joaquim-verges)! - Fix chakra zag-menu breaking update
+
+## 3.0.8
+
+### Patch Changes
+
+- [#209](https://github.com/thirdweb-dev/js/pull/209) [`1bda83b`](https://github.com/thirdweb-dev/js/commit/1bda83b1142406892acfb64576fce25d2647afa7) Thanks [@jnsdls](https://github.com/jnsdls)! - fix useLayoutEffect during SSR warning
+
+- Updated dependencies [[`ce05bfd`](https://github.com/thirdweb-dev/js/commit/ce05bfd8615a9c79664856bce53de8b43bed5c87)]:
+  - @thirdweb-dev/sdk@3.0.8
+
+## 3.0.7
+
+### Patch Changes
+
+- [#197](https://github.com/thirdweb-dev/js/pull/197) [`f4f05bd`](https://github.com/thirdweb-dev/js/commit/f4f05bd9a4ec98e9abc6716006353f330b7be055) Thanks [@jnsdls](https://github.com/jnsdls)! - make it obvious when the <Web3Button /> will trigger a network switch
+
+- Updated dependencies [[`5f5ab01`](https://github.com/thirdweb-dev/js/commit/5f5ab015e1dd3c471d6affe995ef36ec88932b3c), [`5f5ab01`](https://github.com/thirdweb-dev/js/commit/5f5ab015e1dd3c471d6affe995ef36ec88932b3c)]:
+  - @thirdweb-dev/sdk@3.0.7
+  - @thirdweb-dev/solana@0.2.15
+
+## 3.0.6
+
+### Patch Changes
+
+- [#179](https://github.com/thirdweb-dev/js/pull/179) [`63258bc`](https://github.com/thirdweb-dev/js/commit/63258bc9c3443db7d12fc1dc6fbd483926c92d3e) Thanks [@joaquim-verges](https://github.com/joaquim-verges)! - Expose simple provider and useSDK hooks for Solana
+
+- Updated dependencies [[`a80fc97`](https://github.com/thirdweb-dev/js/commit/a80fc97b6a1e72ed46a400b4b602e180947fb870)]:
+  - @thirdweb-dev/sdk@3.0.6
+  - @thirdweb-dev/solana@0.2.14
+
 ## 3.0.5
 
 ### Patch Changes

packages/react/MIGRATION_GUIDE.md

@@ -0,0 +1,69 @@
+# Migration Guide
+
+If you are looking to upgrade from an earlier version of the React SDK, below are the breaking changes that you should be aware of between each version.
+
+## Upgrading to Version 3
+
+Version 3 of the React SDK introduces a significant (87%) reduction in package size and first-class support for using custom contracts with the SDK. Learn more about why we made these changes and how it improves the SDK in our [blog post](https://blog.thirdweb.com/sdk-major-update/).
+
+### useContractData
+
+The `useContractData` hook to read data from a smart contract has been renamed to `useContractRead`.
+
+```diff
+- const { data } = useContractData(contract, 'name')
++ const { data } = useContractRead(contract, 'name')
+```
+
+### useContractCall
+
+The `useContractCall` hook to call a smart contract function has been renamed to `useContractWrite`.
+
+```diff
+- const { mutate } = useContractCall(contract, 'setName')
++ const { mutate } = useContractWrite(contract, 'setName')
+```
+
+### Prebuilt Contract Hooks
+
+Hooks to connect to prebuilt contracts such as `useNFTDrop` and `useMarketplace` are now deprecated in favour of using the generic `useContract` hook:
+
+```diff
+- const contract = useNFTDrop("0x...")
++ const { contract } = useContract("0x...")
+```
+
+You can currently still continue to use the prebuilt hooks, however they provide a warning in the console informing you of their deprecation. We will likely remove these hooks in a future version of the SDK.
+
+### New Contract Namespaces
+
+When working with contracts using the `useContract` hook, we now expose all the convenient high level APIs for each ERC standard top level.
+Calling a function that is not supported in your contract will give you an error with instructions on how to unlock that functionality.
+
+```diff
+// ERC721 contracts
+- const contract.nft?.drop?.claim?.to(...)
++ const contract.erc721.claimTo(...)
+- const contract.nft?.drop?.claim?.conditions.set(...)
++ const contract.erc721.claimConditions.set(...)
+
+// ERC1155 contracts
+- const contract.edition?.mint?.to(...)
++ const contract.erc1155.mintTo(...)
+
+// ERC20 contracts
+- const contract.token?.burn.tokens(...)
++ const contract.erc20.burn(...)
+```
+
+The `Web3Button`'s `contract` benefits from these changes as well:
+
+```diff jsx
+<Web3Button
+  contractAddress={...}
+-  action={(contract) => contract.nft?.drop?.claim?.to(...)}
++  action={(contract) => contract.erc721.claim(...)}
+>
+  Claim
+</Web3Button>
+```

packages/react/evm/package.json

@@ -0,0 +1,4 @@
+{
+  "main": "dist/thirdweb-dev-react-evm.cjs.js",
+  "module": "dist/thirdweb-dev-react-evm.esm.js"
+}

packages/react/package.json

@@ -1,16 +1,39 @@
 {
   "name": "@thirdweb-dev/react",
-  "version": "3.0.5",
+  "version": "3.1.1",
   "repository": "https://github.com/thirdweb-dev/js/tree/main/packages/react",
   "author": "thirdweb eng <[email protected]>",
   "license": "Apache-2.0",
   "main": "dist/thirdweb-dev-react.cjs.js",
   "types": "dist/thirdweb-dev-react.cjs.d.ts",
   "module": "dist/thirdweb-dev-react.esm.js",
+  "exports": {
+    "./package.json": "./package.json",
+    ".": {
+      "module": "./dist/thirdweb-dev-react.esm.js",
+      "default": "./dist/thirdweb-dev-react.cjs.js"
+    },
+    "./solana": {
+      "module": "./solana/dist/thirdweb-dev-react-solana.esm.js",
+      "default": "./solana/dist/thirdweb-dev-react-solana.cjs.js"
+    },
+    "./evm": {
+      "module": "./evm/dist/thirdweb-dev-react-evm.esm.js",
+      "default": "./evm/dist/thirdweb-dev-react-evm.cjs.js"
+    }
+  },
   "files": [
-    "dist/**/*",
-    "patches/**/*"
+    "dist/",
+    "evm/",
+    "solana/"
   ],
+  "preconstruct": {
+    "entrypoints": [
+      "index.ts",
+      "solana/index.ts",
+      "evm/index.ts"
+    ]
+  },
   "private": false,
   "scripts": {
     "format": "prettier --write 'src/**/*'",
@@ -22,7 +45,8 @@
     "generate-snippets": "node ./scripts/generate-snippets.mjs && node ./scripts/generate-feature-snippets.mjs",
     "build": "tsc && preconstruct build",
     "e2e": "yarn test-ct",
-    "test-ct": "playwright test -c playwright-ct.config.ts"
+    "test-ct": "playwright test -c playwright-ct.config.ts",
+    "push": "yalc push"
   },
   "sideEffects:": false,
   "devDependencies": {
@@ -36,7 +60,12 @@
     "@playwright/experimental-ct-react": "1.25.1",
     "@playwright/test": "1.25.1",
     "@preconstruct/cli": "^2.2.1",
+    "@solana/wallet-adapter-base": "^0.9.17",
+    "@solana/wallet-adapter-react": "^0.15.19",
+    "@solana/wallet-adapter-wallets": "^0.19.0",
+    "@solana/web3.js": "^1.63.0",
     "@thirdweb-dev/sdk": "*",
+    "@thirdweb-dev/solana": "*",
     "@types/color": "^3.0.3",
     "@types/mime": "^3.0.1",
     "@types/react": "^18.0.5",
@@ -63,7 +92,7 @@
     "@gnosis.pm/safe-ethers-lib": "1.1.0",
     "@react-icons/all-files": "^4.1.0",
     "@tanstack/react-query": "^4.0.10",
-    "@zag-js/menu": "^0.1.11",
+    "@zag-js/menu": "0.1.14",
     "@zag-js/react": "0.1.16",
     "color": "^4.2.3",
     "copy-to-clipboard": "^3.3.2",
@@ -75,6 +104,10 @@
     "wagmi": "^0.2.28"
   },
   "peerDependencies": {
+    "@solana/wallet-adapter-base": "^0.9.17",
+    "@solana/wallet-adapter-react": "^0.15.19",
+    "@solana/wallet-adapter-wallets": "^0.19.0",
+    "@solana/web3.js": "^1.63.0",
     "@thirdweb-dev/sdk": "*",
     "ethers": ">=5.5.1",
     "react": ">=18.0.0",
@@ -83,5 +116,22 @@
   "resolutions": {
     "ansi-regex": "^6.0.1",
     "typescript": "^4.6.2"
+  },
+  "peerDependenciesMeta": {
+    "@solana/wallet-adapter-base": {
+      "optional": true
+    },
+    "@solana/wallet-adapter-react": {
+      "optional": true
+    },
+    "@solana/wallet-adapter-wallets": {
+      "optional": true
+    },
+    "@solana/web3.js": {
+      "optional": true
+    },
+    "@thirdweb-dev/solana": {
+      "optional": true
+    }
   }
 }

packages/react/solana/package.json

@@ -0,0 +1,4 @@
+{
+  "main": "dist/thirdweb-dev-react-solana.cjs.js",
+  "module": "dist/thirdweb-dev-react-solana.esm.js"
+}

packages/react/src/core/providers/query-client.tsx

@@ -0,0 +1,21 @@
+import { ComponentWithChildren } from "../types/component";
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { useMemo } from "react";
+
+export interface QueryClientProviderProps {
+  queryClient?: QueryClient;
+}
+
+export const QueryClientProviderWithDefault: ComponentWithChildren<
+  QueryClientProviderProps
+> = ({ queryClient, children }) => {
+  const queryClientWithDefault: QueryClient = useMemo(() => {
+    return queryClient ? queryClient : new QueryClient();
+  }, [queryClient]);
+
+  return (
+    <QueryClientProvider client={queryClientWithDefault}>
+      {children}
+    </QueryClientProvider>
+  );
+};

packages/react/src/core/query-utils/query-key.ts

@@ -0,0 +1,68 @@
+import { RequiredParam } from "../types/shared";
+import { QueryKey } from "@tanstack/react-query";
+import type { ChainId } from "@thirdweb-dev/sdk";
+import type {
+  Network,
+  NFTCollection,
+  NFTDrop,
+  Token,
+} from "@thirdweb-dev/sdk/solana";
+
+// we prefix all our query keys with this to avoid possible collisions with user-defined queries that share the same query client
+const TW_QUERY_KEY_PREFIX = "__tw__";
+// marker to make sure the query will not get stored in local storage by a query persister
+const NEVER_PERSIST_QUERY_POSTFIX = { persist: false } as const;
+
+function ensureTWPrefix<TKey extends QueryKey>(key: TKey) {
+  if (key[0] === TW_QUERY_KEY_PREFIX) {
+    return key as unknown as Readonly<[typeof TW_QUERY_KEY_PREFIX, ...TKey]>;
+  }
+  return [TW_QUERY_KEY_PREFIX, ...key] as const;
+}
+
+export function neverPersist<TKey extends QueryKey>(key: TKey) {
+  return [...key, NEVER_PERSIST_QUERY_POSTFIX] as const;
+}
+
+export function shouldNeverPersistQuery<TKey extends QueryKey>(
+  key: TKey,
+): boolean {
+  return key[key.length] === NEVER_PERSIST_QUERY_POSTFIX;
+}
+
+// EVM
+
+export function createEVMQueryKey<TKey extends QueryKey>(key: TKey) {
+  return ensureTWPrefix(["evm", ...key] as const);
+}
+export function createEVMQueryKeyWithChain<TKey extends QueryKey>(
+  key: TKey,
+  chainId: RequiredParam<ChainId>,
+) {
+  return ensureTWPrefix([chainId, ...key] as const);
+}
+
+// SOL
+
+export function createSOLQueryKey<TKey extends QueryKey>(key: TKey) {
+  return ensureTWPrefix(["sol", ...key] as const);
+}
+
+export function createSOLQueryKeyWithNetwork<TKey extends QueryKey>(
+  key: TKey,
+  network: RequiredParam<Network>,
+) {
+  return createSOLQueryKey([network, ...key] as const);
+}
+
+export function createSOLProgramQueryKey<TKey extends QueryKey>(
+  program: RequiredParam<NFTCollection | NFTDrop | Token>,
+  key: TKey = [] as unknown as TKey,
+) {
+  const network = program?.network;
+  const address = program?.publicKey.toBase58();
+  return createSOLQueryKeyWithNetwork(
+    ["program", address, ...key] as const,
+    network || null,
+  );
+}

packages/react/src/core/types/component.ts

@@ -0,0 +1,5 @@
+import React from "react";
+
+export type ComponentWithChildren<P = unknown> = React.FC<
+  React.PropsWithChildren<P>
+>;

packages/react/src/core/types/shared.ts

@@ -0,0 +1,6 @@
+/**
+ * Makes a parameter required to be passed, but still allowes it to be null or undefined.
+ *
+ * @beta
+ */
+export type RequiredParam<T> = T | null | undefined;

packages/react/src/evm/components/Web3Button/index.tsx

@@ -1,4 +1,5 @@
 import { useContract } from "../../hooks/async/contracts";
+import { useNetworkMismatch } from "../../hooks/useNetworkMismatch";
 import { useNetwork } from "../../hooks/wagmi-required/useNetwork";
 import { useAddress, useChainId } from "../../hooks/wallet";
 import { useSDKChainId } from "../../providers/base";
@@ -9,8 +10,9 @@ import {
 import { ConnectWallet } from "../ConnectWallet";
 import { Button } from "../shared/Button";
 import { ThemeProvider, ThemeProviderProps } from "../shared/ThemeProvider";
+import { FiWifi } from "@react-icons/all-files/fi/FiWifi";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
-import type { SmartContract } from "@thirdweb-dev/sdk/dist/declarations/src/contracts/smart-contract";
+import type { SmartContract } from "@thirdweb-dev/sdk/dist/declarations/src/evm/contracts/smart-contract";
 import type { CallOverrides } from "ethers";
 import { PropsWithChildren, useMemo } from "react";
 import invariant from "tiny-invariant";
@@ -74,6 +76,8 @@ export const Web3Button = <TAction extends ActionFn>({
 
   const queryClient = useQueryClient();
 
+  const hasMismatch = useNetworkMismatch();
+
   const switchToChainId = useMemo(() => {
     if (sdkChainId && walletChainId && sdkChainId !== walletChainId) {
       return sdkChainId;
@@ -130,6 +134,8 @@ export const Web3Button = <TAction extends ActionFn>({
     return <ConnectWallet className={className} {...themeProps} />;
   }
 
+  const willSwitchNetwork = hasMismatch && !!switchNetwork;
+
   return (
     <ThemeProvider {...themeProps}>
       <Button
@@ -137,9 +143,12 @@ export const Web3Button = <TAction extends ActionFn>({
         style={{ height: "50px", minWidth: "200px", width: "100%" }}
         isLoading={mutation.isLoading || !contract}
         onClick={() => mutation.mutate()}
-        isDisabled={isDisabled}
+        isDisabled={willSwitchNetwork ? false : isDisabled}
+        leftElement={
+          willSwitchNetwork ? <FiWifi width="1em" height="1em" /> : undefined
+        }
       >
-        {children}
+        {willSwitchNetwork ? "Switch Network" : children}
       </Button>
     </ThemeProvider>
   );

packages/react/src/evm/hooks/async/claim-conditions.ts

@@ -1,10 +1,6 @@
+import { RequiredParam } from "../../../core/types/shared";
 import { useSDKChainId } from "../../providers/base";
-import {
-  getErcs,
-  DropContract,
-  RequiredParam,
-  WalletAddress,
-} from "../../types";
+import { getErcs, DropContract, WalletAddress } from "../../types";
 import {
   cacheKeys,
   invalidateContractAndBalances,
@@ -83,7 +79,7 @@ export function useActiveClaimCondition(
       if (erc20) {
         return erc20.claimConditions.getActive();
       }
-      return undefined;
+      throw new Error("Contract must be ERC721, ERC1155 or ERC20");
     },
     {
       // Checks that happen here:
@@ -136,7 +132,7 @@ export function useClaimConditions(
       if (erc20) {
         return erc20.claimConditions.getAll();
       }
-      return undefined;
+      throw new Error("Contract must be ERC721, ERC1155 or ERC20");
     },
     {
       // Checks that happen here:
@@ -207,7 +203,7 @@ export function useClaimIneligibilityReasons(
           params.walletAddress,
         );
       }
-      return undefined;
+      throw new Error("Contract must be ERC721, ERC1155 or ERC20");
     },
     {
       // Checks that happen here:
@@ -284,7 +280,7 @@ export function useSetClaimConditions(
       if (erc20) {
         return erc20.claimConditions.set(phases, reset);
       }
-      return undefined;
+      throw new Error("Contract must be ERC721, ERC1155 or ERC20");
     },
     {
       onSettled: () => {
@@ -374,7 +370,7 @@ export function useResetClaimConditions(
           true,
         );
       }
-      return undefined;
+      throw new Error("Contract must be ERC721, ERC1155 or ERC20");
     },
     {
       onSettled: () => {

packages/react/src/evm/hooks/async/contract-settings.ts

@@ -1,5 +1,6 @@
+import { RequiredParam } from "../../../core/types/shared";
 import { useSDKChainId } from "../../providers/base";
-import { RequiredParam, WalletAddress } from "../../types";
+import { WalletAddress } from "../../types";
 import {
   cacheKeys,
   invalidateContractAndBalances,

packages/react/src/evm/hooks/async/contracts.ts

@@ -1,5 +1,7 @@
+import { neverPersist } from "../../../core/query-utils/query-key";
+import { RequiredParam } from "../../../core/types/shared";
 import { useSDK, useSDKChainId } from "../../providers/base";
-import { ContractAddress, RequiredParam } from "../../types";
+import { ContractAddress } from "../../types";
 import {
   cacheKeys,
   createCacheKeyWithNetwork,
@@ -21,7 +23,7 @@ import {
   ThirdwebSDK,
   ValidContractInstance,
 } from "@thirdweb-dev/sdk";
-import type { SmartContract } from "@thirdweb-dev/sdk/dist/declarations/src/contracts/smart-contract";
+import type { SmartContract } from "@thirdweb-dev/sdk/dist/declarations/src/evm/contracts/smart-contract";
 import { CallOverrides } from "ethers";
 import { useEffect, useMemo } from "react";
 import invariant from "tiny-invariant";
@@ -159,11 +161,11 @@ export function useContract<
 
   const contractQuery = useQueryWithNetwork(
     // need to add the wallet and walletChainId into the query key so this gets refreshed when the wallet / chain changes!
-    [
+    neverPersist([
       "contract-instance",
       contractAddress,
       { wallet, walletChainId, sdkTimestamp },
-    ],
+    ]),
     async () => {
       invariant(contractAddress, "contract address is required");
       invariant(sdk, "SDK not initialized");

packages/react/src/evm/hooks/async/drop.ts

@@ -1,10 +1,10 @@
+import { RequiredParam } from "../../../core/types/shared";
 import { useSDKChainId } from "../../providers/base";
 import {
   ClaimNFTParams,
   ClaimNFTReturnType,
   DelayedRevealLazyMintInput,
   DropContract,
-  RequiredParam,
   RevealLazyMintInput,
   getErcs,
   NFTContract,
@@ -22,7 +22,7 @@ import {
   QueryAllParams,
   UploadProgressEvent,
 } from "@thirdweb-dev/sdk";
-import { NFTDrop } from "@thirdweb-dev/sdk/dist/declarations/src/contracts/prebuilt-implementations/nft-drop";
+import { NFTDrop } from "@thirdweb-dev/sdk/dist/declarations/src/evm/contracts/prebuilt-implementations/nft-drop";
 import invariant from "tiny-invariant";
 
 /** **********************/

packages/react/src/evm/hooks/async/marketplace.ts

@@ -1,5 +1,6 @@
+import { RequiredParam } from "../../../core/types/shared";
 import { useSDKChainId } from "../../providers/base";
-import { BuyNowParams, MakeBidParams, RequiredParam } from "../../types";
+import { BuyNowParams, MakeBidParams } from "../../types";
 import {
   cacheKeys,
   invalidateContractAndBalances,
@@ -15,7 +16,7 @@ import type {
   NewDirectListing,
 } from "@thirdweb-dev/sdk";
 import { ListingType } from "@thirdweb-dev/sdk";
-import { Marketplace } from "@thirdweb-dev/sdk/dist/declarations/src/contracts/prebuilt-implementations/marketplace";
+import { Marketplace } from "@thirdweb-dev/sdk/dist/declarations/src/evm/contracts/prebuilt-implementations/marketplace";
 import { BigNumber, BigNumberish } from "ethers";
 import invariant from "tiny-invariant";
 

packages/react/src/evm/hooks/async/nft.ts

@@ -1,3 +1,4 @@
+import { RequiredParam } from "../../../core/types/shared";
 import { useSDKChainId } from "../../providers/base";
 import {
   AirdropNFTParams,
@@ -6,7 +7,6 @@ import {
   MintNFTReturnType,
   MintNFTSupplyParams,
   NFT,
-  RequiredParam,
   TransferNFTParams,
   WalletAddress,
   Erc721OrErc1155,
@@ -223,7 +223,7 @@ export function useTotalCount<TContract extends NFTContract>(
  */
 export function useTotalCirculatingSupply(
   contract: RequiredParam<NFTContract>,
-  tokenId: BigNumberish,
+  tokenId: RequiredParam<BigNumberish>,
 ) {
   const contractAddress = contract?.getAddress();
   const { erc721, erc1155 } = getErcs(contract);
@@ -238,6 +238,7 @@ export function useTotalCirculatingSupply(
           erc1155.totalCirculatingSupply,
           "Contract instance does not support totalCirculatingSupply",
         );
+        invariant(tokenId, "No tokenId provided");
         return await erc1155.totalCirculatingSupply(tokenId);
       }
       if (erc721) {
@@ -250,7 +251,7 @@ export function useTotalCirculatingSupply(
       invariant(false, "Unknown NFT type");
     },
     {
-      enabled: !!erc721 || !!erc1155,
+      enabled: !!erc721 || (!!erc1155 && tokenId !== undefined),
     },
   );
 }
@@ -281,6 +282,7 @@ export function useOwnedNFTs<TContract extends NFTContract>(
     cacheKeys.contract.nft.query.owned.all(contractAddress, ownerWalletAddress),
     async () => {
       invariant(contract, "No Contract instance provided");
+      invariant(ownerWalletAddress, "No wallet address provided");
       if (erc721) {
         return convertResponseToNFTTypeArray(
           erc721,

packages/react/src/evm/hooks/async/roles.ts

@@ -1,5 +1,6 @@
+import { RequiredParam } from "../../../core/types/shared";
 import { useSDKChainId } from "../../providers/base";
-import { RequiredParam, WalletAddress } from "../../types";
+import { WalletAddress } from "../../types";
 import {
   cacheKeys,
   invalidateContractAndBalances,
@@ -7,8 +8,8 @@ import {
 import { useQueryWithNetwork } from "../query-utils/useQueryWithNetwork";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
 import type { Role, ValidContractInstance } from "@thirdweb-dev/sdk";
-import type { Vote } from "@thirdweb-dev/sdk/dist/declarations/src/contracts/prebuilt-implementations/vote";
-import type { SmartContract } from "@thirdweb-dev/sdk/dist/declarations/src/contracts/smart-contract";
+import type { Vote } from "@thirdweb-dev/sdk/dist/declarations/src/evm/contracts/prebuilt-implementations/vote";
+import type { SmartContract } from "@thirdweb-dev/sdk/dist/declarations/src/evm/contracts/smart-contract";
 import { constants } from "ethers";
 import invariant from "tiny-invariant";
 

packages/react/src/evm/hooks/async/token.ts

@@ -1,7 +1,7 @@
+import { RequiredParam } from "../../../core/types/shared";
 import { useSDKChainId } from "../../providers/base";
 import {
   ClaimTokenParams,
-  RequiredParam,
   TokenBurnParams,
   TokenParams,
   WalletAddress,

packages/react/src/evm/hooks/contracts/useEdition.ts

@@ -1,6 +1,6 @@
 import { showDeprecationWarning } from "../../utils/deprecation-warning";
 import { useContract } from "../async/contracts";
-import { Edition } from "@thirdweb-dev/sdk/dist/declarations/src/contracts/prebuilt-implementations/edition";
+import { Edition } from "@thirdweb-dev/sdk/dist/declarations/src/evm/contracts/prebuilt-implementations/edition";
 
 /**
  * Hook for getting an instance of an `Edition` contract. This contract is used to interface with ERC1155 compliant NFTs.

packages/react/src/evm/hooks/contracts/useEditionDrop.ts

@@ -1,6 +1,6 @@
 import { showDeprecationWarning } from "../../utils/deprecation-warning";
 import { useContract } from "../async/contracts";
-import { EditionDrop } from "@thirdweb-dev/sdk/dist/declarations/src/contracts/prebuilt-implementations/edition-drop";
+import { EditionDrop } from "@thirdweb-dev/sdk/dist/declarations/src/evm/contracts/prebuilt-implementations/edition-drop";
 
 /**
  * Hook for getting an instance of an `EditionDrop` contract. This conract is used to interface with ERC1155 compliant NFTs that can be lazily minted.

packages/react/src/evm/hooks/contracts/useMarketplace.ts

@@ -1,6 +1,6 @@
 import { showDeprecationWarning } from "../../utils/deprecation-warning";
 import { useContract } from "../async/contracts";
-import { Marketplace } from "@thirdweb-dev/sdk/dist/declarations/src/contracts/prebuilt-implementations/marketplace";
+import { Marketplace } from "@thirdweb-dev/sdk/dist/declarations/src/evm/contracts/prebuilt-implementations/marketplace";
 
 /**
  * Hook for getting an instance of a `Marketplace` contract. This contract is used to support marketplace for purchase and sale of on-chain assets.

packages/react/src/evm/hooks/contracts/useMultiwrap.ts

@@ -1,6 +1,6 @@
 import { showDeprecationWarning } from "../../utils/deprecation-warning";
 import { useContract } from "../async/contracts";
-import { Multiwrap } from "@thirdweb-dev/sdk/dist/declarations/src/contracts/prebuilt-implementations/multiwrap";
+import { Multiwrap } from "@thirdweb-dev/sdk/dist/declarations/src/evm/contracts/prebuilt-implementations/multiwrap";
 
 /**
  * Hook for getting an instance of an `Multiwrap` contract. This contract is an ERC721 in which you can wrap ERC721, ERC1155 and ERC20 tokens.

packages/react/src/evm/hooks/contracts/useNFTCollection.ts

@@ -1,6 +1,6 @@
 import { showDeprecationWarning } from "../../utils/deprecation-warning";
 import { useContract } from "../async/contracts";
-import { NFTCollection } from "@thirdweb-dev/sdk/dist/declarations/src/contracts/prebuilt-implementations/nft-collection";
+import { NFTCollection } from "@thirdweb-dev/sdk/dist/declarations/src/evm/contracts/prebuilt-implementations/nft-collection";
 
 /**
  * Hook for getting an instance of an `NFTCollection` contract. This contract is meant to interface with ERC721 compliant NFTs.

packages/react/src/evm/hooks/contracts/useNFTDrop.ts

@@ -1,6 +1,6 @@
 import { showDeprecationWarning } from "../../utils/deprecation-warning";
 import { useContract } from "../async/contracts";
-import { NFTDrop } from "@thirdweb-dev/sdk/dist/declarations/src/contracts/prebuilt-implementations/nft-drop";
+import { NFTDrop } from "@thirdweb-dev/sdk/dist/declarations/src/evm/contracts/prebuilt-implementations/nft-drop";
 
 /**
  * Hook for getting an instance of an `NFTDrop` contract. This contract is meant to interface with ERC721 compliant NFTs that can be lazily minted.

packages/react/src/evm/hooks/contracts/usePack.ts

@@ -1,6 +1,6 @@
 import { showDeprecationWarning } from "../../utils/deprecation-warning";
 import { useContract } from "../async/contracts";
-import { Pack } from "@thirdweb-dev/sdk/dist/declarations/src/contracts/prebuilt-implementations/pack";
+import { Pack } from "@thirdweb-dev/sdk/dist/declarations/src/evm/contracts/prebuilt-implementations/pack";
 
 /**
  * Hook for getting an instance of a `Pack` contract. This contract supports the creation of on-chain luck-based lootboxes.

packages/react/src/evm/hooks/contracts/useSignatureDrop.ts

@@ -1,6 +1,6 @@
 import { showDeprecationWarning } from "../../utils/deprecation-warning";
 import { useContract } from "../async/contracts";
-import { SignatureDrop } from "@thirdweb-dev/sdk/dist/declarations/src/contracts/prebuilt-implementations/signature-drop";
+import { SignatureDrop } from "@thirdweb-dev/sdk/dist/declarations/src/evm/contracts/prebuilt-implementations/signature-drop";
 
 /**
  * Hook for getting an instance of an `SignatureDrop` contract. This contract is meant to interface with ERC721 compliant NFTs that can be lazily minted.

packages/react/src/evm/hooks/contracts/useSplit.ts

@@ -1,6 +1,6 @@
 import { showDeprecationWarning } from "../../utils/deprecation-warning";
 import { useContract } from "../async/contracts";
-import { Split } from "@thirdweb-dev/sdk/dist/declarations/src/contracts/prebuilt-implementations/split";
+import { Split } from "@thirdweb-dev/sdk/dist/declarations/src/evm/contracts/prebuilt-implementations/split";
 
 /**
  * Hook for getting an instance of a `Split` contract. This contract supports fund distribution to multiple parties.

packages/react/src/evm/hooks/contracts/useToken.ts

@@ -1,6 +1,6 @@
 import { showDeprecationWarning } from "../../utils/deprecation-warning";
 import { useContract } from "../async/contracts";
-import { Token } from "@thirdweb-dev/sdk/dist/declarations/src/contracts/prebuilt-implementations/token";
+import { Token } from "@thirdweb-dev/sdk/dist/declarations/src/evm/contracts/prebuilt-implementations/token";
 
 /**
  * Hook for getting an instance of a `Token` contract. This contract supports ERC20 compliant tokens.

packages/react/src/evm/hooks/contracts/useTokenDrop.ts

@@ -1,6 +1,6 @@
 import { showDeprecationWarning } from "../../utils/deprecation-warning";
 import { useContract } from "../async/contracts";
-import { TokenDrop } from "@thirdweb-dev/sdk/dist/declarations/src/contracts/prebuilt-implementations/token-drop";
+import { TokenDrop } from "@thirdweb-dev/sdk/dist/declarations/src/evm/contracts/prebuilt-implementations/token-drop";
 
 /**
  * Hook for getting an instance of a `Token Drop` contract.

packages/react/src/evm/hooks/contracts/useVote.ts

@@ -1,6 +1,6 @@
 import { showDeprecationWarning } from "../../utils/deprecation-warning";
 import { useContract } from "../async/contracts";
-import { Vote } from "@thirdweb-dev/sdk/dist/declarations/src/contracts/prebuilt-implementations/vote";
+import { Vote } from "@thirdweb-dev/sdk/dist/declarations/src/evm/contracts/prebuilt-implementations/vote";
 
 /**
  * Hook for getting an instance of an `Vote` contract. This contract enables fully featured voting-based decentralized governance systems.

packages/react/src/evm/index.ts

@@ -0,0 +1,47 @@
+// providers
+export * from "./providers/base";
+export * from "./providers/full";
+
+// contract hooks
+export * from "./hooks/contracts";
+// async contract hooks
+export * from "./hooks/async/contracts";
+export * from "./hooks/async/nft";
+export * from "./hooks/async/drop";
+export * from "./hooks/async/marketplace";
+export * from "./hooks/async/token";
+export * from "./hooks/async/claim-conditions";
+
+export * from "./hooks/async/contract-settings";
+export * from "./hooks/async/roles";
+
+// thirdweb hooks (work as long as at least `<ThirdwebSDkProvider>` is used)
+export * from "./hooks/auth";
+export * from "./hooks/useSigner";
+export * from "./hooks/useReadonlySDK";
+export * from "./hooks/useNetworkMismatch";
+export * from "./hooks/wallet";
+
+// require to be inside `<ThirdwebProvider />`
+export * from "./hooks/wagmi-required/useAccount";
+export * from "./hooks/wagmi-required/useNetwork";
+export * from "./hooks/wagmi-required/useDisconnect";
+export * from "./hooks/wagmi-required/useConnect";
+export * from "./hooks/connectors/useMetamask";
+export * from "./hooks/connectors/useWalletConnect";
+export * from "./hooks/connectors/useWalletLink";
+export * from "./hooks/connectors/useGnosis";
+export * from "./hooks/connectors/useMagic";
+
+// re-exports
+export { ChainId } from "@thirdweb-dev/sdk";
+
+// types
+export * from "./types";
+export type { ThirdwebAuthConfig } from "./contexts/thirdweb-auth";
+
+// ui components
+export * from "./components/MediaRenderer";
+export * from "./components/NftMedia";
+export * from "./components/ConnectWallet";
+export * from "./components/Web3Button";

packages/react/src/evm/lib/portal.tsx

@@ -21,7 +21,7 @@ dispatch(Object.create(null));
 }
 
 
-export const useIsomorphicLayoutEffect = canUseDOM() ? useLayoutEffect : useEffect;
+const useIsomorphicLayoutEffect = canUseDOM() ? useLayoutEffect : useEffect;
 
 
  /**
@@ -39,7 +39,7 @@ export const useIsomorphicLayoutEffect = canUseDOM() ? useLayoutEffect : useEffe
    const forceUpdate = useForceUpdate();
 
 
-   useLayoutEffect(() => {
+   useIsomorphicLayoutEffect(() => {
      // This ref may be null when a hot-loader replaces components on the page
      if (!mountNode.current) {return;}
      // It's possible that the content of the portal has, itself, been portaled.

packages/react/src/evm/providers/base.tsx

@@ -1,3 +1,9 @@
+import {
+  QueryClientProviderProps,
+  QueryClientProviderWithDefault,
+} from "../../core/providers/query-client";
+import { ComponentWithChildren } from "../../core/types/component";
+import { RequiredParam } from "../../core/types/shared";
 import {
   ThirdwebAuthConfig,
   ThirdwebAuthConfigProvider,
@@ -6,8 +12,6 @@ import {
   ThirdwebConnectedWalletProvider,
   useThirdwebConnectedWalletContext,
 } from "../contexts/thirdweb-wallet";
-import { RequiredParam } from "../types";
-import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import {
   ChainOrRpc,
   SDKOptions,
@@ -28,7 +32,7 @@ interface TWSDKContext {
 
 const ThirdwebSDKContext = createContext<TWSDKContext>({ desiredChainId: -1 });
 
-export interface ThirdwebSDKProviderProps {
+export interface ThirdwebSDKProviderProps extends QueryClientProviderProps {
   desiredChainId: RequiredParam<SUPPORTED_CHAIN_ID>;
   provider: ChainOrRpc | SignerOrProvider;
 
@@ -37,30 +41,23 @@ export interface ThirdwebSDKProviderProps {
   sdkOptions?: SDKOptions;
   storageInterface?: ThirdwebStorage;
   authConfig?: ThirdwebAuthConfig;
-
-  queryClient?: QueryClient;
 }
 
 /**
  *
  * @internal
  */
-export const WrappedThirdwebSDKProvider: React.FC<
-  React.PropsWithChildren<Omit<ThirdwebSDKProviderProps, "signer">>
+export const WrappedThirdwebSDKProvider: ComponentWithChildren<
+  Omit<ThirdwebSDKProviderProps, "signer">
 > = ({
   sdkOptions,
   desiredChainId,
   storageInterface,
   provider,
-
   queryClient,
   authConfig,
   children,
 }) => {
-  const queryClientWithDefault: QueryClient = useMemo(() => {
-    return queryClient ? queryClient : new QueryClient();
-  }, [queryClient]);
-
   const { signer } = useThirdwebConnectedWalletContext();
 
   const sdk = useMemo(() => {
@@ -89,13 +86,13 @@ export const WrappedThirdwebSDKProvider: React.FC<
   );
 
   return (
-    <ThirdwebAuthConfigProvider value={authConfig}>
-      <QueryClientProvider client={queryClientWithDefault}>
+    <QueryClientProviderWithDefault queryClient={queryClient}>
+      <ThirdwebAuthConfigProvider value={authConfig}>
         <ThirdwebSDKContext.Provider value={ctxValue}>
           {children}
         </ThirdwebSDKContext.Provider>
-      </QueryClientProvider>
-    </ThirdwebAuthConfigProvider>
+      </ThirdwebAuthConfigProvider>
+    </QueryClientProviderWithDefault>
   );
 };
 
@@ -108,8 +105,8 @@ export const WrappedThirdwebSDKProvider: React.FC<
  *
  * @public
  */
-export const ThirdwebSDKProvider: React.FC<
-  React.PropsWithChildren<ThirdwebSDKProviderProps>
+export const ThirdwebSDKProvider: ComponentWithChildren<
+  ThirdwebSDKProviderProps
 > = ({ signer, children, ...restProps }) => {
   return (
     <ThirdwebConnectedWalletProvider signer={signer}>

packages/react/src/evm/types.ts

@@ -1,3 +1,4 @@
+import { RequiredParam } from "../core/types/shared";
 import type {
   AirdropInput,
   Amount,
@@ -14,22 +15,15 @@ import type {
   Erc20,
   ClaimOptions,
 } from "@thirdweb-dev/sdk";
-import type { Edition } from "@thirdweb-dev/sdk/dist/declarations/src/contracts/prebuilt-implementations/edition";
-import type { EditionDrop } from "@thirdweb-dev/sdk/dist/declarations/src/contracts/prebuilt-implementations/edition-drop";
-import type { NFTCollection } from "@thirdweb-dev/sdk/dist/declarations/src/contracts/prebuilt-implementations/nft-collection";
-import type { NFTDrop } from "@thirdweb-dev/sdk/dist/declarations/src/contracts/prebuilt-implementations/nft-drop";
-import type { SignatureDrop } from "@thirdweb-dev/sdk/dist/declarations/src/contracts/prebuilt-implementations/signature-drop";
-import type { TokenDrop } from "@thirdweb-dev/sdk/dist/declarations/src/contracts/prebuilt-implementations/token-drop";
-import type { SmartContract } from "@thirdweb-dev/sdk/dist/declarations/src/contracts/smart-contract";
+import type { Edition } from "@thirdweb-dev/sdk/dist/declarations/src/evm/contracts/prebuilt-implementations/edition";
+import type { EditionDrop } from "@thirdweb-dev/sdk/dist/declarations/src/evm/contracts/prebuilt-implementations/edition-drop";
+import type { NFTCollection } from "@thirdweb-dev/sdk/dist/declarations/src/evm/contracts/prebuilt-implementations/nft-collection";
+import type { NFTDrop } from "@thirdweb-dev/sdk/dist/declarations/src/evm/contracts/prebuilt-implementations/nft-drop";
+import type { SignatureDrop } from "@thirdweb-dev/sdk/dist/declarations/src/evm/contracts/prebuilt-implementations/signature-drop";
+import type { TokenDrop } from "@thirdweb-dev/sdk/dist/declarations/src/evm/contracts/prebuilt-implementations/token-drop";
+import type { SmartContract } from "@thirdweb-dev/sdk/dist/declarations/src/evm/contracts/smart-contract";
 import type { BigNumberish } from "ethers";
 
-/**
- * Makes a parameter required to be passed, but still allowes it to be undefined.
- *
- * @beta
- */
-export type RequiredParam<T> = T | undefined;
-
 /**
  * A wallet address.
  * @beta

packages/react/src/evm/utils/cache-keys.ts

@@ -1,5 +1,6 @@
+import { RequiredParam } from "../../core/types/shared";
 import { SupportedChainId } from "../constants/chain";
-import { ContractAddress, RequiredParam, WalletAddress } from "../types";
+import { ContractAddress, WalletAddress } from "../types";
 import { QueryClient, QueryKey } from "@tanstack/react-query";
 import type {
   MarketplaceFilter,
@@ -24,7 +25,7 @@ function enforceCachePrefix(input: QueryKey): QueryKey {
  * @internal
  */
 export function createContractCacheKey(
-  contractAddress: string = constants.AddressZero,
+  contractAddress: string | null = constants.AddressZero,
   input: QueryKey = [],
 ): QueryKey {
   return enforceCachePrefix(["contract", contractAddress, ...input]);