docs: optional dependencies required by WalletConnect

apps/docs/docs/getting-started/connect-wallets.md → apps/docs/docs/getting-started/connect-wallets.mdx

@@ -2,10 +2,41 @@
 sidebar_position: 3
 ---
 
+import TabItem from "@theme/TabItem";
+import Tabs from "@theme/Tabs";
+
 # Connect wallets
 
 Wallets & accounts connection can by managed via [`useWallets`](/api/react/function/useWallets), [`useConnectedWallets`](/api/react/function/useConnectedWallets) & [`useAccounts`](/api/react/function/useAccounts) hooks.
 
+## Install optional dependencies
+
+Additional dependencies are required if you use any of be bellow wallet type.
+
+### [WalletConnect](https://walletconnect.com/)
+
+{/* prettier-ignore-start */}
+
+<Tabs>
+  <TabItem value="npm" label="npm" default>
+    ```sh
+    npm add @walletconnect/modal @walletconnect/universal-provider
+    ```
+  </TabItem>
+  <TabItem value="yarn" label="yarn">
+    ```sh
+    yarn add @walletconnect/modal @walletconnect/universal-provider
+    ```
+  </TabItem>
+    <TabItem value="pnpm" label="pnpm">
+    ```sh
+    pnpm add @walletconnect/modal @walletconnect/universal-provider
+    ```
+  </TabItem>
+</Tabs>
+
+{/* prettier-ignore-end */}
+
 ## Add wallets to the config
 
 ```ts title="config.ts"