Fix Typo

docs/onboarding/20 Connect/3 Connect Wallet Component/Customizations/10 Supported Tokens.mdx

@@ -0,0 +1,29 @@
+---
+slug: /connect/connect-wallet/supported-tokens
+title: Customize Supported Tokens
+---
+
+Customize the tokens shown in the "Send Funds" screen for various networks.
+
+By default, The "Send Funds" screen shows a few popular tokens for default chains and the native token. For other chains it only shows the native token.
+
+
+```jsx
+import { Base } from "@thirdweb-dev/chains";
+
+// Show "Dai Stablecoin" when connected to the "Base" mainnet
+<ConnectWallet
+  supportedTokens={{
+    // use chain id of the network as key and pass an array of tokens to show
+    // you can directly pass the number or import the chain object from @thirdweb-dev/chains to get the chain id
+    [Base.chainId]: [
+      {
+        address: "0x50c5725949A6F0c72E6C4a641F24049A917DB0Cb", // token contract address
+        name: "Dai Stablecoin",
+        symbol: "DAI",
+        icon: "https://assets.coingecko.com/coins/images/9956/small/Badge_Dai.png?1687143508",
+      },
+    ],
+  }}
+/>
+```

docs/onboarding/20 Connect/3 Connect Wallet Component/Customizations/11 Display Token Balance.mdx

@@ -0,0 +1,24 @@
+---
+slug: /connect/connect-wallet/display-token-balance
+title: Display Token Balance
+---
+
+Display the balance of a token instead of the native token in ConnectWallet details button.
+
+```jsx
+import { Base } from "@thirdweb-dev/chains";
+
+// show Wrapped BTC balance when connected to Ethereum mainnet
+// Show Dai Stablecoin balance when connected to the Base mainnet
+
+<ConnectWallet
+  //  pass an object with chain id as key and token address as value
+  displayBalanceToken={{
+    // 1 is chain id of Ethereum mainnet
+    1: "0x2260FAC5E5542a773Aa44fBCfeDf7C193bc2C599", // contract address of Wrapped BTC token
+
+    // you can also import the chain object from @thirdweb-dev/chains to get the chain id
+    [Base.chainId]: "0x50c5725949A6F0c72E6C4a641F24049A917DB0Cb", // contract address of Dai Stablecoin token
+  }}
+/>
+```

docs/onboarding/20 Connect/3 Connect Wallet Component/Customizations/12 Switch To Personal Wallet.mdx

@@ -0,0 +1,13 @@
+---
+slug: /connect/connect-wallet/hide-switch-to-personal-wallet
+title: Switch To Personal Wallet
+---
+
+Hide the "Switch to Personal wallet" option in the wallet modal which is shown when wallet is connected to either Smart Wallet or Safe
+
+Default is `false`
+
+
+```jsx
+<ConnectWallet hideSwitchToPersonalWallet={true} />
+```

docs/onboarding/20 Connect/3 Connect Wallet Component/Customizations/index.mdx

@@ -5,19 +5,23 @@ title: Customizations
 
 The following customizations are available for the Connect Wallet component:
 
-| Prop Name                                                              | Description                                                        |
-| ---------------------------------------------------------------------- | ------------------------------------------------------------------ |
-| [Displayed Wallet Providers](/connect/connect-wallet/wallet-providers) | Customize the wallets that are displayed.                          |
-| [Modal Size](/connect/connect-wallet/modal-size)                       | The size of the Connect Wallet modal.                              |
-| [Theme](/connect/connect-wallet/theme)                                 | The theme of the Connect Wallet component. The default is "light". |
-| [Button Title](/connect/connect-wallet/button-title)                   | The title of the Connect Wallet button.                            |
-| [Modal Title](/connect/connect-wallet/modal-title)                     | The title of the Connect Wallet modal.                             |
-| [Modal Size](/connect/connect-wallet/modal-size)                       | The size of the Connect Wallet modal. "compact" or "wide"          |
-| [Welcome Screen](/connect/connect-wallet/welcome-screen)               | Customize the welcome screen on wide modal.                        |
-| [Custom CSS](/connect/connect-wallet/class-name)                       | Apply custom CSS styles to the Connect Wallet button.              |
-| [Button UI](/connect/connect-wallet/custom-button)                     | Customize the details button.                                      |
-| [Modal Drop-Down Position](/connect/connect-wallet/drop-down-position) | Specify where should the dropdown menu open.                       |
-| [Authorization](/connect/connect-wallet/auth)                          | Enforce that users must # with their wallet.                 |
-| [Switch To Active Chain](/connect/connect-wallet/switch-chain)         | Automatically switch to the active chain when connecting a wallet. |
-| [Terms Of Service URL](/connect/connect-wallet/terms-of-service)       | The URL to the terms of service page.                              |
-| [Privacy Policy URL](/connect/connect-wallet/privacy-policy)           | The URL to the privacy policy page.                                |
+| Prop Name                                                                           | Description                                                        |
+| ------------------------------------------------------------------------------------|--------------------------------------------------------------------|
+| [Displayed Wallet Providers](/connect/connect-wallet/wallet-providers)              | Customize the wallets that are displayed.                          |
+| [Modal Size](/connect/connect-wallet/modal-size)                                    | The size of the Connect Wallet modal.                              |
+| [Theme](/connect/connect-wallet/theme)                                              | The theme of the Connect Wallet component. The default is "light". |
+| [Button Title](/connect/connect-wallet/button-title)                                | The title of the Connect Wallet button.                            |
+| [Modal Title](/connect/connect-wallet/modal-title)                                  | The title of the Connect Wallet modal.                             |
+| [Modal Size](/connect/connect-wallet/modal-size)                                    | The size of the Connect Wallet modal. "compact" or "wide"          |
+| [Welcome Screen](/connect/connect-wallet/welcome-screen)                            | Customize the welcome screen on wide modal.                        |
+| [Custom CSS](/connect/connect-wallet/class-name)                                    | Apply custom CSS styles to the Connect Wallet button.              |
+| [Button UI](/connect/connect-wallet/custom-button)                                  | Customize the details button.                                      |
+| [Modal Drop-Down Position](/connect/connect-wallet/drop-down-position)              | Specify where should the dropdown menu open.                       |
+| [Authorization](/connect/connect-wallet/auth)                                       | Enforce that users must # with their wallet.                 |
+| [Switch To Active Chain](/connect/connect-wallet/switch-chain)                      | Automatically switch to the active chain when connecting a wallet. |
+| [Terms Of Service URL](/connect/connect-wallet/terms-of-service)                    | The URL to the terms of service page.                              |
+| [Privacy Policy URL](/connect/connect-wallet/privacy-policy)                        | The URL to the privacy policy page.                                |
+| [Hide Testnet Faucet](/connect/connect-wallet/hide-testnet-faucet)                  | Hide request testnet funds option when connected to testnets       |
+| [Customize Supported Tokens](/connect/connect-wallet/supported-tokens)              | Customize the tokens shown in the "Send Funds" screen              |
+| [Display Token Balance](/connect/connect-wallet/display-token-balance)              | Display the balance of a token instead of the native token         |
+| [Switch To Personal Wallet](/connect/connect-wallet/hide-switch-to-personal-wallet) | Hide the "Switch to Personal wallet" option in the wallet modal    |

docs/react/hooks/claim-conditions/useclaimconditions.mdx

@@ -70,12 +70,12 @@ function App() {
 </details>
 
 <details>
-  <summary>withAllowlist (optional)</summary>
+  <summary>withAllowList (optional)</summary>
   <div>
 
 By default, the hook will not include the allowlist in the returned data.
 
-To include the allowlist in the returned data, set the `withAllowlist` option to `true`.
+To include the allowlist in the returned data, set the `withAllowList` option to `true`.
 
 This will add a `snapshot` property to the returned data, which contains the allowlist in an array.
 
@@ -94,7 +94,7 @@ function App() {
     undefined, // Token ID required for ERC1155 contracts here.
     // highlight-start
     {
-      withAllowlist: true,
+      withAllowList: true,
     },
     // highlight-end
   );

docs/typescript/interacting-with-contracts/extensions/erc1155/erc1155claimconditions.mdx

@@ -173,11 +173,11 @@ Must be a `string`, `number` or `BigNumber`.
 
 #### options (optional)
 
-Provide an object containing a `withAllowlist` property to include the allowlist in the response.
+Provide an object containing a `withAllowList` property to include the allowlist in the response.
 
 By default, the method will not include the allowlist in the returned data.
 
-To include the allowlist in the returned data, set the `withAllowlist` option to `true`.
+To include the allowlist in the returned data, set the `withAllowList` option to `true`.
 
 This will add a `snapshot` property to the returned data, which contains the allowlist in an array.
 
@@ -186,7 +186,7 @@ const activePhase = contract.erc1155.claimConditions.getActive(
   "{{token_id}}",
   // highlight-start
   {
-    withAllowlist: true,
+    withAllowList: true,
   },
   // highlight-end
 );

docs/typescript/interacting-with-contracts/extensions/erc20/erc20claimconditions.mdx

@@ -139,19 +139,19 @@ const activePhase = await contract.erc20.claimConditions.getActive();
 
 #### options (optional)
 
-Provide an object containing a `withAllowlist` property to include the allowlist in the response.
+Provide an object containing a `withAllowList` property to include the allowlist in the response.
 
 By default, the method will not include the allowlist in the returned data.
 
-To include the allowlist in the returned data, set the `withAllowlist` option to `true`.
+To include the allowlist in the returned data, set the `withAllowList` option to `true`.
 
 This will add a `snapshot` property to the returned data, which contains the allowlist in an array.
 
 ```javascript
 const activePhase = contract?.erc20.getActive(
   // highlight-start
   {
-    withAllowlist: true,
+    withAllowList: true,
   },
   // highlight-end
 );

docs/typescript/interacting-with-contracts/extensions/erc721/erc721claimconditions.mdx

@@ -188,11 +188,11 @@ const activePhase = await contract.erc721.claimConditions.getActive();
 
 #### options (optional)
 
-Provide an object containing a `withAllowlist` property to include the allowlist in the response.
+Provide an object containing a `withAllowList` property to include the allowlist in the response.
 
 By default, the method will not include the allowlist in the returned data.
 
-To include the allowlist in the returned data, set the `withAllowlist` option to `true`.
+To include the allowlist in the returned data, set the `withAllowList` option to `true`.
 
 This will add a `snapshot` property to the returned data, which contains the allowlist in an array.
 

docs/typescript/interacting-with-contracts/prebuilt-contracts/edition-drop.mdx

@@ -666,11 +666,11 @@ Must be a `string`, `number` or `BigNumber`.
 
 #### options (optional)
 
-Provide an object containing a `withAllowlist` property to include the allowlist in the response.
+Provide an object containing a `withAllowList` property to include the allowlist in the response.
 
 By default, the method will not include the allowlist in the returned data.
 
-To include the allowlist in the returned data, set the `withAllowlist` option to `true`.
+To include the allowlist in the returned data, set the `withAllowList` option to `true`.
 
 This will add a `snapshot` property to the returned data, which contains the allowlist in an array.
 
@@ -679,7 +679,7 @@ const activePhase = contract.erc1155.claimConditions.getActive(
   "{{token_id}}",
   // highlight-start
   {
-    withAllowlist: true,
+    withAllowList: true,
   },
   // highlight-end
 );

docs/typescript/interacting-with-contracts/prebuilt-contracts/nft-drop.mdx

@@ -570,11 +570,11 @@ const activePhase = await contract.erc721.claimConditions.getActive();
 
 #### options (optional)
 
-Provide an object containing a `withAllowlist` property to include the allowlist in the response.
+Provide an object containing a `withAllowList` property to include the allowlist in the response.
 
 By default, the method will not include the allowlist in the returned data.
 
-To include the allowlist in the returned data, set the `withAllowlist` option to `true`.
+To include the allowlist in the returned data, set the `withAllowList` option to `true`.
 
 This will add a `snapshot` property to the returned data, which contains the allowlist in an array.
 

docs/typescript/interacting-with-contracts/prebuilt-contracts/signature-drop.mdx

@@ -824,11 +824,11 @@ const activePhase = await contract.erc721.claimConditions.getActive();
 
 #### options (optional)
 
-Provide an object containing a `withAllowlist` property to include the allowlist in the response.
+Provide an object containing a `withAllowList` property to include the allowlist in the response.
 
 By default, the method will not include the allowlist in the returned data.
 
-To include the allowlist in the returned data, set the `withAllowlist` option to `true`.
+To include the allowlist in the returned data, set the `withAllowList` option to `true`.
 
 This will add a `snapshot` property to the returned data, which contains the allowlist in an array.
 

docs/typescript/interacting-with-contracts/prebuilt-contracts/token-drop.mdx

@@ -530,19 +530,19 @@ const activePhase = await contract.erc20.claimConditions.getActive();
 
 #### options (optional)
 
-Provide an object containing a `withAllowlist` property to include the allowlist in the response.
+Provide an object containing a `withAllowList` property to include the allowlist in the response.
 
 By default, the method will not include the allowlist in the returned data.
 
-To include the allowlist in the returned data, set the `withAllowlist` option to `true`.
+To include the allowlist in the returned data, set the `withAllowList` option to `true`.
 
 This will add a `snapshot` property to the returned data, which contains the allowlist in an array.
 
 ```javascript
 const activePhase = contract?.erc20.getActive(
   // highlight-start
   {
-    withAllowlist: true,
+    withAllowList: true,
   },
   // highlight-end
 );