@hardkas/react 0.4.0-alpha → 0.5.1-alpha

package/README.md

@@ -4,7 +4,7 @@ React hooks and provider context for integrating with the HardKAS deterministic
 
 ## ⚠️ Alpha-Only Local-Runtime Coupling Warning
 
-Please note that in the `v0.4.0-alpha` release, this package has direct dependencies on the **`@hardkas/bridge-local`** package to facilitate local bridge payload planning and prefix-mining simulations directly within hooks like `useBridgeLocalPlan` and `useBridgeLocalSimulation`.
+Please note that in the `v0.5.1-alpha` release, this package has direct dependencies on the **`@hardkas/bridge-local`** package to facilitate local bridge payload planning and prefix-mining simulations directly within hooks like `useBridgeLocalPlan` and `useBridgeLocalSimulation`.
 
 ### 🛡️ Production & Browser Safety
 

package/dist/index.d.ts

@@ -6,6 +6,16 @@ import * as viem from 'viem';
 import { PublicClient, Address } from 'viem';
 import { Hex } from '../types/misc.js';
 
+interface EIP6963ProviderInfo {
+    uuid: string;
+    name: string;
+    icon: string;
+    rdns: string;
+}
+interface EIP6963ProviderDetail {
+    info: EIP6963ProviderInfo;
+    provider: any;
+}
 interface HardKasReactConfig {
     readonly kaspaRpcUrl?: string;
     readonly igraRpcUrl?: string;
@@ -28,6 +38,13 @@ interface HardKasContextValue {
     readonly sseStatus: SSEStatus;
     readonly lastEvent: RuntimeEvent | null;
     readonly subscribe: (callback: EventCallback) => () => void;
+    readonly providers: EIP6963ProviderDetail[];
+    readonly activeProvider: EIP6963ProviderDetail | null;
+    readonly walletAddress: string | null;
+    readonly walletChainId: number | null;
+    readonly connectWallet: (detail: EIP6963ProviderDetail) => Promise<void>;
+    readonly disconnectWallet: () => void;
+    readonly switchChain: (chainId: number) => Promise<void>;
 }
 interface HardKasProviderProps {
     readonly config: HardKasReactConfig;
@@ -89,8 +106,19 @@ declare function useKaspaBalance(options?: {
 declare function useIgraAccount(): {
     name: string | undefined;
     address: `0x${string}` | undefined;
+    isWallet: boolean;
     isLoading: boolean;
 };
+declare function useIgraWallet(): {
+    providers: EIP6963ProviderDetail[];
+    activeProvider: EIP6963ProviderDetail | null;
+    walletAddress: string | null;
+    walletChainId: number | null;
+    connectWallet: (detail: EIP6963ProviderDetail) => Promise<void>;
+    disconnectWallet: () => void;
+    switchChain: (chainId: number) => Promise<void>;
+    isConnected: boolean;
+};
 declare function useIgraBalance(options?: {
     refetchInterval?: number;
 }): _tanstack_react_query.UseQueryResult<bigint, Error>;
@@ -4719,4 +4747,4 @@ declare function useIgraWriteContract(): _tanstack_react_query.UseMutationResult
 }, unknown>;
 declare function useIgraWaitForReceipt(): _tanstack_react_query.UseMutationResult<viem.TransactionReceipt, Error, `0x${string}`, unknown>;
 
-export { type EventCallback, type HardKasContextValue, HardKasProvider, type HardKasReactConfig, type HealthInfo, type KasWareLocalState, type KasWareSessionMatch, type MetaMaskLocalState, type RuntimeEvent, type SSEStatus, type SandboxConnection, type SessionInfo, useBridgeLocalPlan, useBridgeLocalSimulation, useConnectKasWareLocal, useCreateSandboxSession, useDisconnectSandboxSession, useHardKas, useHardKasHealth, useHardKasSession, useIgraAccount, useIgraBalance, useIgraInjectedAccount, useIgraReadContract, useIgraWaitForReceipt, useIgraWriteContract, useKasWareLocal, useKasWareSessionMatch, useKaspaBalance, useKaspaWallet, useLocalIgraWalletClient, useMetaMaskLocal, usePairSandboxSession, useSandboxSessions, useSwitchToLocalIgra };
+export { type EventCallback, type HardKasContextValue, HardKasProvider, type HardKasReactConfig, type HealthInfo, type KasWareLocalState, type KasWareSessionMatch, type MetaMaskLocalState, type RuntimeEvent, type SSEStatus, type SandboxConnection, type SessionInfo, useBridgeLocalPlan, useBridgeLocalSimulation, useConnectKasWareLocal, useCreateSandboxSession, useDisconnectSandboxSession, useHardKas, useHardKasHealth, useHardKasSession, useIgraAccount, useIgraBalance, useIgraInjectedAccount, useIgraReadContract, useIgraWaitForReceipt, useIgraWallet, useIgraWriteContract, useKasWareLocal, useKasWareSessionMatch, useKaspaBalance, useKaspaWallet, useLocalIgraWalletClient, useMetaMaskLocal, usePairSandboxSession, useSandboxSessions, useSwitchToLocalIgra };

package/dist/index.js

@@ -12,6 +12,10 @@ function HardKasProvider({ config, children, queryClient: externalQueryClient })
   const eventSource = React.useRef(null);
   const reconnectTimer = React.useRef(null);
   const backoffMs = React.useRef(500);
+  const [providers, setProviders] = React.useState([]);
+  const [activeProvider, setActiveProvider] = React.useState(null);
+  const [walletAddress, setWalletAddress] = React.useState(null);
+  const [walletChainId, setWalletChainId] = React.useState(null);
   const subscribe = React.useCallback((callback) => {
     listeners.current.add(callback);
     return () => listeners.current.delete(callback);
@@ -91,6 +95,135 @@ function HardKasProvider({ config, children, queryClient: externalQueryClient })
       }
     };
   }, [connect]);
+  React.useEffect(() => {
+    if (typeof window === "undefined") return;
+    const handleAnnounce = (event) => {
+      const detail = event.detail;
+      if (!detail || !detail.info || !detail.provider) return;
+      setProviders((prev) => {
+        if (prev.some((p) => p.info.rdns === detail.info.rdns)) return prev;
+        return [...prev, detail];
+      });
+    };
+    window.addEventListener("eip6963:announceProvider", handleAnnounce);
+    window.dispatchEvent(new Event("eip6963:requestProvider"));
+    return () => {
+      window.removeEventListener("eip6963:announceProvider", handleAnnounce);
+    };
+  }, []);
+  const connectWallet = React.useCallback(async (detail) => {
+    try {
+      const accounts = await detail.provider.request({ method: "eth_requestAccounts" });
+      const chainIdHex = await detail.provider.request({ method: "eth_chainId" });
+      const chainId = typeof chainIdHex === "string" ? parseInt(chainIdHex, 16) : Number(chainIdHex);
+      setActiveProvider(detail);
+      if (accounts && accounts[0]) {
+        setWalletAddress(accounts[0]);
+      }
+      setWalletChainId(chainId);
+      if (typeof window !== "undefined") {
+        window.localStorage.setItem("hardkas:active-wallet", detail.info.rdns);
+      }
+    } catch (err) {
+      console.error("Failed to connect wallet:", err);
+      throw err;
+    }
+  }, []);
+  const disconnectWallet = React.useCallback(() => {
+    setActiveProvider(null);
+    setWalletAddress(null);
+    setWalletChainId(null);
+    if (typeof window !== "undefined") {
+      window.localStorage.removeItem("hardkas:active-wallet");
+    }
+  }, []);
+  const switchChain = React.useCallback(async (targetChainId) => {
+    if (!activeProvider) {
+      throw new Error("No active wallet connected");
+    }
+    const hexChainId = `0x${targetChainId.toString(16)}`;
+    try {
+      await activeProvider.provider.request({
+        method: "wallet_switchEthereumChain",
+        params: [{ chainId: hexChainId }]
+      });
+      setWalletChainId(targetChainId);
+    } catch (err) {
+      if (err.code === 4902) {
+        if (targetChainId === 19416) {
+          await activeProvider.provider.request({
+            method: "wallet_addEthereumChain",
+            params: [{
+              chainId: hexChainId,
+              chainName: "Igra Local",
+              nativeCurrency: { name: "Igra Kaspa", symbol: "iKAS", decimals: 18 },
+              rpcUrls: [config.igraRpcUrl || "http://127.0.0.1:8545"]
+            }]
+          });
+          setWalletChainId(targetChainId);
+        } else {
+          throw err;
+        }
+      } else {
+        throw err;
+      }
+    }
+  }, [activeProvider, config.igraRpcUrl]);
+  React.useEffect(() => {
+    if (typeof window === "undefined" || providers.length === 0 || activeProvider) return;
+    const savedRdns = window.localStorage.getItem("hardkas:active-wallet");
+    if (savedRdns) {
+      const match = providers.find((p) => p.info.rdns === savedRdns);
+      if (match) {
+        connectWallet(match).catch(() => {
+        });
+      }
+    }
+  }, [providers, activeProvider, connectWallet]);
+  React.useEffect(() => {
+    if (!activeProvider) {
+      setWalletAddress(null);
+      setWalletChainId(null);
+      return;
+    }
+    const provider = activeProvider.provider;
+    const handleAccountsChanged = (accounts) => {
+      if (accounts && accounts[0]) {
+        setWalletAddress(accounts[0]);
+      } else {
+        setActiveProvider(null);
+        setWalletAddress(null);
+        setWalletChainId(null);
+        if (typeof window !== "undefined") {
+          window.localStorage.removeItem("hardkas:active-wallet");
+        }
+      }
+    };
+    const handleChainChanged = (chainIdHex) => {
+      const chainId = typeof chainIdHex === "string" ? parseInt(chainIdHex, 16) : Number(chainIdHex);
+      setWalletChainId(chainId);
+    };
+    const handleDisconnect = () => {
+      setActiveProvider(null);
+      setWalletAddress(null);
+      setWalletChainId(null);
+      if (typeof window !== "undefined") {
+        window.localStorage.removeItem("hardkas:active-wallet");
+      }
+    };
+    if (provider.on) {
+      provider.on("accountsChanged", handleAccountsChanged);
+      provider.on("chainChanged", handleChainChanged);
+      provider.on("disconnect", handleDisconnect);
+    }
+    return () => {
+      if (provider.removeListener) {
+        provider.removeListener("accountsChanged", handleAccountsChanged);
+        provider.removeListener("chainChanged", handleChainChanged);
+        provider.removeListener("disconnect", handleDisconnect);
+      }
+    };
+  }, [activeProvider]);
   const igraClient = useMemo(() => {
     return createPublicClient({
       chain: {
@@ -114,8 +247,29 @@ function HardKasProvider({ config, children, queryClient: externalQueryClient })
     queryClient,
     sseStatus,
     lastEvent,
-    subscribe
-  }), [config, igraClient, queryClient, sseStatus, lastEvent, subscribe]);
+    subscribe,
+    providers,
+    activeProvider,
+    walletAddress,
+    walletChainId,
+    connectWallet,
+    disconnectWallet,
+    switchChain
+  }), [
+    config,
+    igraClient,
+    queryClient,
+    sseStatus,
+    lastEvent,
+    subscribe,
+    providers,
+    activeProvider,
+    walletAddress,
+    walletChainId,
+    connectWallet,
+    disconnectWallet,
+    switchChain
+  ]);
   return /* @__PURE__ */ jsx(HardKasContext.Provider, { value, children: /* @__PURE__ */ jsx(QueryClientProvider, { client: queryClient, children }) });
 }
 function useHardKas() {
@@ -250,10 +404,34 @@ function useKaspaBalance(options = {}) {
 import { useQuery as useQuery4 } from "@tanstack/react-query";
 function useIgraAccount() {
   const { data: session } = useHardKasSession();
+  const { walletAddress } = useHardKas();
+  const address = walletAddress || session?.l2.address;
   return {
-    name: session?.l2.account,
-    address: session?.l2.address,
-    isLoading: !session
+    name: walletAddress ? "Browser Wallet" : session?.l2.account,
+    address,
+    isWallet: !!walletAddress,
+    isLoading: !session && !walletAddress
+  };
+}
+function useIgraWallet() {
+  const {
+    providers,
+    activeProvider,
+    walletAddress,
+    walletChainId,
+    connectWallet,
+    disconnectWallet,
+    switchChain
+  } = useHardKas();
+  return {
+    providers,
+    activeProvider,
+    walletAddress,
+    walletChainId,
+    connectWallet,
+    disconnectWallet,
+    switchChain,
+    isConnected: !!walletAddress
   };
 }
 function useIgraBalance(options = {}) {
@@ -587,6 +765,7 @@ function useDisconnectSandboxSession() {
 
 // src/hooks/contracts.ts
 import { useQuery as useQuery7, useMutation as useMutation3 } from "@tanstack/react-query";
+import { createWalletClient as createWalletClient2, custom as custom2 } from "viem";
 function useIgraReadContract(options) {
   const { igraClient, config } = useHardKas();
   const { data: session } = useHardKasSession();
@@ -605,12 +784,24 @@ function useIgraReadContract(options) {
   });
 }
 function useIgraWriteContract() {
+  const { activeProvider, walletAddress, igraClient } = useHardKas();
   return useMutation3({
     mutationFn: async (params) => {
-      if (!params.walletClient) {
-        throw new Error("A wallet client is required to write to a contract.");
+      let client = params.walletClient;
+      if (!client) {
+        if (!activeProvider) {
+          throw new Error("No active browser wallet connected and no walletClient was provided.");
+        }
+        if (!walletAddress) {
+          throw new Error("No active account address available on connected wallet.");
+        }
+        client = createWalletClient2({
+          account: walletAddress,
+          chain: igraClient.chain,
+          transport: custom2(activeProvider.provider)
+        });
       }
-      return await params.walletClient.writeContract({
+      return await client.writeContract({
         address: params.address,
         abi: params.abi,
         functionName: params.functionName,
@@ -642,6 +833,7 @@ export {
   useIgraInjectedAccount,
   useIgraReadContract,
   useIgraWaitForReceipt,
+  useIgraWallet,
   useIgraWriteContract,
   useKasWareLocal,
   useKasWareSessionMatch,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hardkas/react",
-  "version": "0.4.0-alpha",
+  "version": "0.5.1-alpha",
   "type": "module",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -14,11 +14,11 @@
   "dependencies": {
     "@tanstack/react-query": "^5.61.5",
     "viem": "^2.21.51",
-    "@hardkas/bridge-local": "0.4.0-alpha",
-    "@hardkas/core": "0.4.0-alpha",
-    "@hardkas/kaspa-rpc": "0.4.0-alpha",
-    "@hardkas/sessions": "0.4.0-alpha",
-    "@hardkas/l2": "0.4.0-alpha"
+    "@hardkas/bridge-local": "0.5.1-alpha",
+    "@hardkas/sessions": "0.5.1-alpha",
+    "@hardkas/kaspa-rpc": "0.5.1-alpha",
+    "@hardkas/core": "0.5.1-alpha",
+    "@hardkas/l2": "0.5.1-alpha"
   },
   "devDependencies": {
     "@testing-library/dom": "^10.4.1",