@cookill/wallet-adapter 3.1.6 → 3.1.8

package/README.md

@@ -23,9 +23,38 @@ function App() {
 }
 ```
 
-`WalletProvider` renders a built-in connect modal automatically. On desktop it opens centered; on mobile it slides up as a sheet.
+`WalletProvider` renders a built-in connect modal automatically. On desktop it opens as a centered dialog; on mobile it slides up as a bottom sheet with swipe-to-dismiss.
 
-> **Note:** The built-in modal has known interaction issues (tab switching may close the modal, connect button may not trigger the extension). For production use, we recommend building a custom modal using the `connect()` function directly — see [Custom Modal](#custom-modal) below.
+## Built-in Modal
+
+The built-in modal is rendered inside `WalletProvider` and includes:
+
+- **Extension tab** — detects Sheep Wallet, shows install link if not found, triggers `window.rialo.connect()` on click
+- **Scan to Connect tab** — generates a `rialo-wc://` QR code for cross-device pairing
+- **Responsive layout** — centered dialog on desktop, slide-up sheet on mobile
+- **Auto-close** — closes automatically after successful connection
+
+Control it programmatically:
+
+```tsx
+const { openModal, closeModal } = useWallet();
+
+// Open the built-in modal
+openModal();
+```
+
+Or use `ConnectButton` which handles everything:
+
+```tsx
+<ConnectButton
+  connectLabel="Connect Wallet"
+  disconnectLabel="Disconnect"
+  showAddress={true}
+  showBalance={false}
+/>
+```
+
+> When the extension is installed, `ConnectButton` calls `connect()` directly without opening the modal. When not installed, it opens the modal with a download link.
 
 ## React Hooks
 
@@ -53,7 +82,7 @@ const {
   sendTransaction,         // (tx) => Promise<TransactionResult>
   signAndSendTransaction,  // (tx) => Promise<TransactionResult>
 
-  // Built-in modal control (has known issues — see note above)
+  // Modal control
   openModal,   // () => void
   closeModal,  // () => void
 } = useWallet();
@@ -92,9 +121,9 @@ const { positions, credits, hasCredits, createPosition, sendGasless, refresh } =
 const { scanURI, status, generateQR, approveSession, rejectSession } = useScanConnect();
 ```
 
-## Custom Modal
+## Custom Modal (Optional)
 
-The built-in modal rendered by `WalletProvider` has known issues with event propagation. For a reliable connection experience, build your own modal and call `connect()` directly:
+If you need full control over the UI, build your own modal using the hooks:
 
 ```tsx
 import { useConnectWallet, useScanConnect, isInstalled } from '@cookill/wallet-adapter/react';
@@ -136,7 +165,7 @@ function MyConnectModal({ open, onClose }) {
 ```
 
 Key points:
-- Use `connect()` from `useConnectWallet()` — this calls `window.rialo.connect()` which triggers the extension's approval popup
+- `connect()` calls `window.rialo.connect()` which triggers the extension's approval popup
 - The `connect()` call has a 20-second timeout to prevent dApp freezes
 - Use `isInstalled()` to check if the extension is present before connecting
 
@@ -163,20 +192,6 @@ await wallet.signAndSendTransaction({
 await wallet.disconnect();
 ```
 
-## ConnectButton
-
-```tsx
-<ConnectButton
-  connectLabel="Connect Wallet"
-  disconnectLabel="Disconnect"
-  showAddress={true}
-  showBalance={false}
-  showFeatures={false}
-/>
-```
-
-> **Note:** When the extension is installed, `ConnectButton` calls `connect()` directly (no modal). When not installed, it opens the built-in modal with a download link.
-
 ## WalletProvider Props
 
 | Prop | Type | Default | Description |
@@ -246,14 +261,9 @@ import {
 
 - All provider calls have a 20-second timeout to prevent dApp freezes
 - `autoConnect` uses `checkSession()` — never triggers a user-facing popup
-- The built-in modal is rendered inside `WalletProvider` automatically
+- The built-in modal uses a sibling DOM architecture (backdrop and content are separate elements) to prevent click events from interfering with tab switching or button interactions
 - `ConnectButton` bypasses the modal when the extension is installed
 
-## Known Issues
-
-1. **Built-in modal tab switching** — Clicking "Scan to Connect" tab may close the modal due to event propagation. Workaround: use a custom modal.
-2. **Built-in modal connect button** — May not trigger the extension popup in some environments. Workaround: use `connect()` directly.
-
 ## License
 
 MIT