@abstraxn/signer-react 1.0.15 → 2.0.0

package/CHANGELOG.md

@@ -5,6 +5,12 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [1.0.16] - 2026-02-23
+
+### Fixed
+
+- **External wallet disconnect from extension** – When the user disconnects from an external wallet (e.g. MetaMask) via the extension ("Disconnect this site"), the app now updates `isConnected` to false immediately without requiring a page refresh. Previously the sync effect returned early when the user had explicitly connected, so state was never reset until refresh. The fix: (1) allow the sync effect to run the existing reset when wagmi reports disconnected; (2) use wagmi’s `useConnectionEffect(onDisconnect)` to clear external wallet state as soon as wagmi reports disconnect; (3) subscribe to the connector provider’s `accountsChanged` and `disconnect` events so state clears even if wagmi is slow or stale.
+
 ## [1.0.15] - 2026-02-20
 
 ### Added

package/README.md

@@ -98,11 +98,107 @@ function HookConnectButton() {
 
 - `useAbstraxnWallet()` - Main wallet hook
 - `useIsConnected()` - Check connection status
-- `useAddress()` - Get wallet address
-- `useWhoami()` - Get user information
-- `useExternalWalletInfo()` - External wallet information
-- `usePrepareTransaction()` - Prepare and sign transactions
-- `useExportWallet()` - Export wallet
+- `useAddress()` - Get wallet address (EVM)
+- `useWhoami()` - Get user information (includes `solanaAddress` when available)
+- `useExternalWalletInfo()` - External wallet information (EVM)
+- `useExportWallet()` - Export wallet (EVM or Solana, based on current chain)
+- `usePublicClient()` / `usePrepareRawTxn()` / `useSignTxn()` / `useSignAndSendTxn()` / `useWaitForTxnReceipt()` - EVM transaction flow (prepare → sign → send → confirm)
+- `useSolanaConnection()` / `useSolanaPublicKey()` / `usePrepareSolanaTxn()` / `useSignSolanaTxn()` / `useSignAndSendSolanaTxn()` / `useWaitForSolanaConfirmation()` - Solana transaction flow (prepare → sign → send → confirm)
+
+### Example: EVM → Solana flow after social/email login
+
+```tsx
+import {
+  useAbstraxnWallet,
+  usePublicClient,
+  usePrepareRawTxn,
+  useEstimateGas,
+  useGetGasPrice,
+  useSignAndSendTxn,
+  useWaitForTxnReceipt,
+  useSolanaConnection,
+  useSolanaPublicKey,
+  usePrepareSolanaTxn,
+  useSignAndSendSolanaTxn,
+  useWaitForSolanaConfirmation,
+} from '@abstraxn/signer-react';
+import { polygonAmoy } from 'viem/chains';
+
+function CrossChainExample() {
+  const { isConnected } = useAbstraxnWallet();
+
+  // EVM clients & hooks
+  const { publicClient } = usePublicClient(
+    polygonAmoy,
+    'https://rpc-amoy.polygon.technology'
+  );
+  const { prepareRawTxn } = usePrepareRawTxn(publicClient);
+  const { estimateGas } = useEstimateGas(publicClient);
+  const { getGasPrice } = useGetGasPrice(publicClient);
+  const { signAndSendTxn } = useSignAndSendTxn(publicClient);
+  const { waitForTxnReceipt } = useWaitForTxnReceipt(publicClient);
+
+  // Solana clients & hooks
+  const { connection } = useSolanaConnection('https://api.devnet.solana.com');
+  const { solanaAddress } = useSolanaPublicKey();
+  const { prepareSolanaTransfer } = usePrepareSolanaTxn(connection);
+  const { signAndSendSolanaTxn } = useSignAndSendSolanaTxn(connection);
+  const { waitForSolanaConfirmation } = useWaitForSolanaConfirmation(connection);
+
+  const handleCrossChain = async () => {
+    if (!isConnected) throw new Error('Please login first');
+
+    // 1) EVM tx (e.g. on Polygon Amoy)
+    const from = '0x...'; // current EVM address
+    const rawTx = await prepareRawTxn({
+      from,
+      to: '0x...',
+      value: '0.001',
+    });
+    const { gasLimit } = await estimateGas({
+      account: from,
+      to: rawTx.to,
+      data: rawTx.data,
+      value: rawTx.value,
+    });
+    const fees = await getGasPrice();
+
+    const evmResult = await signAndSendTxn({
+      from,
+      ...rawTx,
+      gas: {
+        gasLimit,
+        maxFeePerGas: fees.maxFeePerGas!,
+        maxPriorityFeePerGas: fees.maxPriorityFeePerGas!,
+      },
+    });
+
+    await waitForTxnReceipt({ hash: evmResult.hash, confirmations: 1 });
+
+    // 2) After EVM confirmation, send SOL
+    if (!solanaAddress) throw new Error('Solana wallet not provisioned');
+
+    const { transaction } = await prepareSolanaTransfer({
+      fromPubkey: solanaAddress,
+      toPubkey: 'TargetSolanaAddressHere',
+      amountInSol: 0.01,
+    });
+
+    const solanaResult = await signAndSendSolanaTxn({
+      transaction,
+      fromPubkey: solanaAddress,
+    });
+
+    await waitForSolanaConfirmation({ signature: solanaResult.signature });
+  };
+
+  return (
+    <button onClick={handleCrossChain}>
+      Run EVM → Solana Flow
+    </button>
+  );
+}
+```
 
 ## 🔗 Related Packages
 

package/dist/src/components/AbstraxnProvider/AbstraxnProviderInner.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * AbstraxnProviderInner - Core provider logic
  * This component contains all the wallet state management and operations
@@ -6,15 +6,22 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { useEffect, useState, useRef, useCallback, useMemo, } from "react";
 import { AbstraxnWallet, AuthenticationError, } from "@abstraxn/signer-core";
 import { OnboardingUIWeb } from "../OnboardingUI";
+import { useConnectionEffect, } from "wagmi";
 import { parseEther, createPublicClient, http } from "viem";
 import { ExternalWalletButtons } from "../../ExternalWalletButtons";
 import { EVM_CHAINS, SOLANA_CHAINS, getChainById, toCoreChain, } from "../../chains";
 import { AbstraxnContext } from "./context";
+/** Syncs wagmi disconnect to external wallet state; only rendered when wagmi is available (under WagmiProvider). */
+function WagmiConnectionEffectSync({ onDisconnect, }) {
+    useConnectionEffect({ onDisconnect });
+    return null;
+}
 export function AbstraxnProviderInner({ config, children, base, wagmi, }) {
     const { isInitialized, setIsInitialized, isConnected, setIsConnected, address, setAddress, user, setUser, whoami, setWhoami, chainId, setChainId, error, setError, loading, setLoading, resending, setResending, walletBalance, setWalletBalance, onboardingRef, otpIdRef, walletRef, googleCallbackHandledRef, twitterCallbackHandledRef, discordCallbackHandledRef, } = base;
     const externalWalletsEnabled = config.externalWallets?.enabled ?? false;
     // Keep a ref to avoid re-creating callbacks when toggling config (prevents flicker)
     const externalWalletsEnabledRef = useRef(externalWalletsEnabled);
+    const isExternalWalletConnectedRef = useRef(false);
     useEffect(() => {
         externalWalletsEnabledRef.current = externalWalletsEnabled;
     }, [externalWalletsEnabled]);
@@ -37,6 +44,9 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, }) {
     const [emailForOtp, setEmailForOtpState] = useState("");
     const explicitConnectionRef = useRef(false);
     const autoDisconnectHandledRef = useRef(false);
+    useEffect(() => {
+        isExternalWalletConnectedRef.current = isExternalWalletConnected;
+    }, [isExternalWalletConnected]);
     // Track when we last connected to prevent premature reset
     const lastConnectionTimeRef = useRef(0);
     // Refs to track previous values and prevent unnecessary updates
@@ -1715,6 +1725,28 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, }) {
             setLoading(false);
         }
     }, []);
+    // Sign Solana transaction via API (returns signed transaction)
+    const signSolanaTransactionViaAPI = useCallback(async (unsignedTransaction, fromAddress) => {
+        if (!walletRef.current)
+            throw new Error("Wallet not initialized");
+        setLoading(true);
+        setError(null);
+        try {
+            const walletAny = walletRef.current;
+            if (typeof walletAny.signSolanaTransactionViaAPI !== "function") {
+                throw new Error("Solana transaction signing is not supported by this wallet");
+            }
+            return await walletAny.signSolanaTransactionViaAPI(unsignedTransaction, fromAddress);
+        }
+        catch (err) {
+            const error = err instanceof Error ? err : new Error("Failed to sign Solana transaction");
+            setError(error);
+            throw error;
+        }
+        finally {
+            setLoading(false);
+        }
+    }, []);
     // Sign typed data / raw payload via API (same flow as signTransactionViaAPI, payload: from, unsignedTransaction, encoding, hashFunction)
     const signTypedTxViaAPI = useCallback(async (fromAddress, unsignedTransaction, encoding, hashFunction) => {
         if (!walletRef.current)
@@ -1984,12 +2016,6 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, }) {
                 isUpdatingRef.current = false;
                 return;
             }
-            // If we're not connected but explicitConnectionRef is true, it means we're trying to reconnect
-            // Don't reset state in this case - wait for the connection to complete
-            if (!wagmiAccount.isConnected && explicitConnectionRef.current) {
-                // Connection is in progress, don't interfere
-                return;
-            }
         }
         // Check if external wallet is connected
         if (wagmiAccount.isConnected && wagmiAccount.address) {
@@ -2483,6 +2509,95 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, }) {
             setLoading(false);
         }
     }, [externalWalletsEnabled, wagmiDisconnect, wagmiAccount?.connector]);
+    // When wagmi reports disconnect (e.g. user disconnected in extension), clear external wallet state immediately
+    const handleWagmiDisconnect = useCallback(() => {
+        if (!externalWalletsEnabledRef.current)
+            return;
+        setIsExternalWalletConnected(false);
+        setExternalWalletAddress(null);
+        setExternalWalletChainId(null);
+        setConnectionType(null);
+        try {
+            localStorage.removeItem("abstraxn_connection_type");
+        }
+        catch (e) {
+            // Ignore
+        }
+        explicitConnectionRef.current = false;
+        lastConnectionTimeRef.current = 0;
+        lastAddressRef.current = null;
+        lastChainIdRef.current = null;
+        if (!walletRef.current?.isConnected) {
+            setIsConnected(false);
+            setAddress(null);
+            setChainId(null);
+        }
+    }, [
+        setIsExternalWalletConnected,
+        setExternalWalletAddress,
+        setExternalWalletChainId,
+        setConnectionType,
+        setIsConnected,
+        setAddress,
+        setChainId,
+    ]);
+    // When user disconnects in the extension, provider may emit before wagmi updates; listen so we clear state even if wagmi is stale
+    const providerListenerCleanupRef = useRef(null);
+    useEffect(() => {
+        if (!externalWalletsEnabled ||
+            !isExternalWalletConnected ||
+            !wagmiAccount?.connector) {
+            return;
+        }
+        const connector = wagmiAccount.connector;
+        let mounted = true;
+        const setup = async () => {
+            try {
+                const getProvider = connector.getProvider ?? connector.getEthereumProvider;
+                if (typeof getProvider !== "function")
+                    return;
+                const p = await getProvider();
+                if (!mounted || !p)
+                    return;
+                const onDisconnectFromProvider = () => {
+                    if (!isExternalWalletConnectedRef.current)
+                        return;
+                    handleWagmiDisconnect();
+                };
+                const onAccountsChanged = (accounts) => {
+                    const list = Array.isArray(accounts) ? accounts : [];
+                    if (list.length === 0)
+                        onDisconnectFromProvider();
+                };
+                p.on?.("accountsChanged", onAccountsChanged);
+                p.on?.("disconnect", onDisconnectFromProvider);
+                return () => {
+                    p.removeListener?.("accountsChanged", onAccountsChanged);
+                    p.removeListener?.("disconnect", onDisconnectFromProvider);
+                };
+            }
+            catch {
+                // Connector may not support getProvider (e.g. some injected)
+                return undefined;
+            }
+        };
+        setup().then((cleanup) => {
+            if (mounted)
+                providerListenerCleanupRef.current = cleanup ?? null;
+        });
+        return () => {
+            mounted = false;
+            const cleanup = providerListenerCleanupRef.current;
+            providerListenerCleanupRef.current = null;
+            if (typeof cleanup === "function")
+                cleanup();
+        };
+    }, [
+        externalWalletsEnabled,
+        isExternalWalletConnected,
+        wagmiAccount?.connector,
+        handleWagmiDisconnect,
+    ]);
     // Helper function to get network name from chain ID
     const getNetworkName = useCallback((chainId) => {
         const chainNames = {
@@ -2762,6 +2877,7 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, }) {
         signTransaction,
         sendTransaction,
         signTransactionViaAPI,
+        signSolanaTransactionViaAPI,
         signTypedTxViaAPI,
         signAndSendTransaction,
         loginWithOTP,
@@ -3351,6 +3467,6 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, }) {
             console.warn("Failed to update ExternalWalletButtons:", error);
         }
     }, [value, externalWalletsEnabled]);
-    return (_jsx(AbstraxnContext.Provider, { value: value, children: children }));
+    return (_jsxs(AbstraxnContext.Provider, { value: value, children: [wagmi ? (_jsx(WagmiConnectionEffectSync, { onDisconnect: handleWagmiDisconnect })) : null, children] }));
 }
 //# sourceMappingURL=AbstraxnProviderInner.js.map