@phantom/react-sdk 1.0.0-beta.2 → 1.0.0-beta.21

package/README.md

@@ -52,11 +52,11 @@ function App() {
 
 function WalletComponent() {
   const { connect, isConnecting } = useConnect();
-  const solana = useSolana();
-  const ethereum = useEthereum();
+  const { solana } = useSolana();
+  const { ethereum } = useEthereum();
 
   const handleConnect = async () => {
-    const { addresses } = await connect();
+    const { addresses } = await connect({ provider: "injected" });
     console.log("Connected addresses:", addresses);
   };
 
@@ -94,9 +94,8 @@ function App() {
     <PhantomProvider
       config={{
         providerType: "embedded",
-        embeddedWalletType: "app-wallet", // or 'user-wallet'
+        appId: "your-app-id", // Get your app ID from phantom.com/portal
         addressTypes: [AddressType.solana, AddressType.ethereum],
-        apiBaseUrl: "https://api.phantom.app/v1/wallets",
       }}
     >
       <YourApp />
@@ -116,12 +115,12 @@ The React SDK follows a clear connection pattern:
 ```tsx
 function WalletExample() {
   const { connect } = useConnect();
-  const solana = useSolana();
-  const ethereum = useEthereum();
+  const { solana } = useSolana();
+  const { ethereum } = useEthereum();
 
-  // 1. Connect first
+  // 1. Connect first (provider parameter is required)
   const handleConnect = async () => {
-    await connect();
+    await connect({ provider: "injected" });
   };
 
   // 2. Then use chain-specific operations
@@ -137,26 +136,40 @@ function WalletExample() {
 
 ### Connection Options
 
-For embedded user-wallets, you can specify authentication providers:
+The `connect()` method requires a `provider` parameter and automatically switches between providers based on the authentication method you specify:
 
 ```tsx
 const { connect } = useConnect();
 
-// Default: Show provider selection screen
-await connect();
+// Connect with injected provider (Phantom extension)
+// Automatically switches to injected provider if not already using it
+await connect({
+  provider: "injected",
+});
+
+// Connect with Google authentication (embedded provider)
+// Automatically switches to embedded provider if not already using it
+await connect({
+  provider: "google",
+});
+
+// Connect with Apple authentication (embedded provider)
+// Automatically switches to embedded provider if not already using it
+await connect({
+  provider: "apple",
+});
 
-// Google authentication (skips provider selection)
+// Connect with Phantom authentication (embedded provider)
+// Uses Phantom extension or mobile app for authentication
+// Automatically switches to embedded provider if not already using it
 await connect({
-  authOptions: {
-    provider: "google",
-  },
+  provider: "phantom",
 });
 
-// Apple authentication (skips provider selection)
+// Connect with JWT authentication (embedded provider)
 await connect({
-  authOptions: {
-    provider: "apple",
-  },
+  provider: "jwt",
+  jwtToken: "your-jwt-token",
 });
 ```
 
@@ -181,26 +194,7 @@ Uses the Phantom browser extension installed by the user.
 
 Creates non-custodial wallets embedded in your application.
 
-#### App Wallet (Recommended for most apps)
-
-- **New wallets** created per application
-- **Unfunded** by default - you need to fund them
-- **Independent** from user's existing Phantom wallet
-
-```tsx
-<PhantomProvider
-  config={{
-    providerType: "embedded",
-    embeddedWalletType: "app-wallet",
-    addressTypes: [AddressType.solana],
-    apiBaseUrl: "https://api.phantom.app/v1/wallets",
-  }}
->
-  <YourApp />
-</PhantomProvider>
-```
-
-#### User Wallet (For existing Phantom users)
+#### User Wallet
 
 - **Uses Phantom authentication** - user logs in with existing account
 - **Potentially funded** - brings existing wallet balance
@@ -210,41 +204,14 @@ Creates non-custodial wallets embedded in your application.
 <PhantomProvider
   config={{
     providerType: "embedded",
-    embeddedWalletType: "user-wallet",
+    appId: "your-app-id",
     addressTypes: [AddressType.solana, AddressType.ethereum],
-    apiBaseUrl: "https://api.phantom.app/v1/wallets",
-  }}
->
-  <YourApp />
-</PhantomProvider>
-```
-
-## Solana Provider Configuration
-
-When using `AddressType.solana`, you can choose between two Solana libraries:
-
-```tsx
-<PhantomProvider
-  config={{
-    providerType: "embedded",
-    addressTypes: [AddressType.solana],
-    solanaProvider: "web3js", // or 'kit'
-    apiBaseUrl: "https://api.phantom.app/v1/wallets",
   }}
 >
   <YourApp />
 </PhantomProvider>
 ```
 
-**Provider Options:**
-
-- `'web3js'` (default) - Uses `@solana/web3.js` library
-- `'kit'` - Uses `@solana/kit` library (modern, TypeScript-first)
-
-**When to use each:**
-
-- **@solana/web3.js**: Better ecosystem compatibility, wider community support
-- **@solana/kit**: Better TypeScript support, modern architecture, smaller bundle size
 
 ## Available Hooks
 
@@ -262,7 +229,7 @@ function ConnectButton() {
 
   const handleConnect = async () => {
     try {
-      const { walletId, addresses } = await connect();
+      const { addresses } = await connect({ provider: "injected" });
       console.log("Connected addresses:", addresses);
     } catch (err) {
       console.error("Failed to connect:", err);
@@ -352,6 +319,33 @@ function ExtensionStatus() {
 }
 ```
 
+#### useIsPhantomLoginAvailable
+
+Check if Phantom Login is available (requires extension installed and `phantom_login` feature support):
+
+```tsx
+import { useIsPhantomLoginAvailable } from "@phantom/react-sdk";
+
+function PhantomLoginButton() {
+  const { isLoading, isAvailable } = useIsPhantomLoginAvailable();
+  const { connect } = useConnect();
+
+  if (isLoading) {
+    return <div>Checking Phantom Login availability...</div>;
+  }
+
+  if (!isAvailable) {
+    return null; // Don't show button if Phantom Login is not available
+  }
+
+  return (
+    <button onClick={() => connect({ provider: "phantom" })}>
+      Login with Phantom
+    </button>
+  );
+}
+```
+
 ### Chain-Specific Hooks
 
 #### useSolana
@@ -363,7 +357,7 @@ import { useSolana } from "@phantom/react-sdk";
 import { VersionedTransaction, TransactionMessage, SystemProgram, PublicKey, Connection } from "@solana/web3.js";
 
 function SolanaOperations() {
-  const solana = useSolana();
+  const { solana } = useSolana();
 
   const signMessage = async () => {
     const signature = await solana.signMessage("Hello Solana!");
@@ -392,7 +386,7 @@ function SolanaOperations() {
 
     // Sign and send
     const result = await solana.signAndSendTransaction(transaction);
-    console.log("Transaction sent:", result.hash);
+    console.log("Transaction sent:", result.signature);
   };
 
   const switchNetwork = async () => {
@@ -428,7 +422,7 @@ Hook for Ethereum chain operations:
 import { useEthereum } from "@phantom/react-sdk";
 
 function EthereumOperations() {
-  const ethereum = useEthereum();
+  const { ethereum } = useEthereum();
 
   const signPersonalMessage = async () => {
     const accounts = await ethereum.getAccounts();
@@ -513,12 +507,27 @@ function EthereumOperations() {
 - `signTypedData(typedData)` - Sign EIP-712 typed data
 - `signTransaction(transaction)` - Sign transaction without sending
 - `sendTransaction(transaction)` - Sign and send transaction
-- `switchChain(chainId)` - Switch chains
+- `switchChain(chainId)` - Switch chains (accepts chain ID as number or a hex string)
 - `getChainId()` - Get current chain ID
 - `getAccounts()` - Get connected accounts
 - `isConnected` - Connection status
 - `isAvailable` - Provider availability
 
+**Supported EVM Networks:**
+
+| Network | Chain ID | Usage |
+|---------|----------|-------|
+| Ethereum Mainnet | `1` | `ethereum.switchChain(1)` |
+| Ethereum Sepolia | `11155111` | `ethereum.switchChain(11155111)` |
+| Polygon Mainnet | `137` | `ethereum.switchChain(137)` |
+| Polygon Amoy | `80002` | `ethereum.switchChain(80002)` |
+| Base Mainnet | `8453` | `ethereum.switchChain(8453)` |
+| Base Sepolia | `84532` | `ethereum.switchChain(84532)` |
+| Arbitrum One | `42161` | `ethereum.switchChain(42161)` |
+| Arbitrum Sepolia | `421614` | `ethereum.switchChain(421614)` |
+| Monad Mainnet | `143` | `ethereum.switchChain(143)` |
+| Monad Testnet | `10143` | `ethereum.switchChain(10143)` |
+
 ### Auto-Confirm Hook (Injected Provider Only)
 
 #### useAutoConfirm
@@ -661,7 +670,7 @@ import { VersionedTransaction, TransactionMessage, SystemProgram, PublicKey, Con
 import { useSolana } from "@phantom/react-sdk";
 
 function SolanaExample() {
-  const solana = useSolana();
+  const { solana } = useSolana();
 
   const sendTransaction = async () => {
     // Get recent blockhash
@@ -687,7 +696,7 @@ function SolanaExample() {
 
     // Sign and send using chain-specific hook
     const result = await solana.signAndSendTransaction(transaction);
-    console.log("Transaction sent:", result.hash);
+    console.log("Transaction sent:", result.signature);
   };
 
   return <button onClick={sendTransaction}>Send SOL</button>;
@@ -709,7 +718,7 @@ import {
 import { useSolana } from "@phantom/react-sdk";
 
 function SolanaKitExample() {
-  const solana = useSolana();
+  const { solana } = useSolana();
 
   const sendTransaction = async () => {
     const rpc = createSolanaRpc("https://api.mainnet-beta.solana.com");
@@ -726,7 +735,7 @@ function SolanaKitExample() {
 
     // Sign and send using chain-specific hook
     const result = await solana.signAndSendTransaction(transaction);
-    console.log("Transaction sent:", result.hash);
+    console.log("Transaction sent:", result.signature);
   };
 
   return <button onClick={sendTransaction}>Send SOL</button>;
@@ -740,7 +749,7 @@ import { parseEther, parseGwei, encodeFunctionData } from "viem";
 import { useEthereum } from "@phantom/react-sdk";
 
 function EthereumExample() {
-  const ethereum = useEthereum();
+  const { ethereum } = useEthereum();
 
   const sendEth = async () => {
     const result = await ethereum.sendTransaction({
@@ -780,16 +789,17 @@ function EthereumExample() {
 
 Quick reference of all available hooks:
 
-| Hook                      | Purpose                                 | Returns                                             |
-| ------------------------- | --------------------------------------- | --------------------------------------------------- |
-| `useConnect`              | Connect to wallet                       | `{ connect, isConnecting, error }`                  |
-| `useAccounts`             | Get wallet addresses                    | `WalletAddress[]` or `null`                         |
-| `useIsExtensionInstalled` | Check extension status                  | `{ isLoading, isInstalled }`                        |
-| `useDisconnect`           | Disconnect from wallet                  | `{ disconnect, isDisconnecting }`                   |
-| `useAutoConfirm`          | Auto-confirm management (injected only) | `{ enable, disable, status, supportedChains, ... }` |
-| `useSolana`               | Solana chain operations                 | `{ signMessage, signAndSendTransaction, ... }`      |
-| `useEthereum`             | Ethereum chain operations               | `{ signPersonalMessage, sendTransaction, ... }`     |
-| `usePhantom`              | Get provider context                    | `{ isConnected, isReady }`                          |
+| Hook                          | Purpose                                 | Returns                                             |
+| ----------------------------- | --------------------------------------- | --------------------------------------------------- |
+| `useConnect`                  | Connect to wallet                       | `{ connect, isConnecting, error }`                  |
+| `useAccounts`                 | Get wallet addresses                    | `WalletAddress[]` or `null`                         |
+| `useIsExtensionInstalled`     | Check extension status                  | `{ isLoading, isInstalled }`                        |
+| `useIsPhantomLoginAvailable`  | Check Phantom Login availability        | `{ isLoading, isAvailable }`                        |
+| `useDisconnect`               | Disconnect from wallet                  | `{ disconnect, isDisconnecting }`                   |
+| `useAutoConfirm`              | Auto-confirm management (injected only) | `{ enable, disable, status, supportedChains, ... }` |
+| `useSolana`                   | Solana chain operations                 | `{ signMessage, signAndSendTransaction, ... }`      |
+| `useEthereum`                 | Ethereum chain operations               | `{ signPersonalMessage, sendTransaction, ... }`     |
+| `usePhantom`                  | Get provider context                    | `{ isConnected, isReady }`                          |
 
 ## Configuration Reference
 
@@ -799,15 +809,16 @@ interface PhantomSDKConfig {
   addressTypes?: [AddressType, ...AddressType[]]; // Networks to enable (e.g., [AddressType.solana])
 
   // Required for embedded provider only
-  apiBaseUrl?: string; // Phantom API base URL
-  appId: string; // Your app ID
+  appId: string; // Your app ID from phantom.com/portal (required for embedded provider)
+  
+  // Optional configuration
+  apiBaseUrl?: string; // Phantom API base URL (optional, has default)
   authOptions?: {
-    authUrl?: string; // Custom auth URL (optional)
-    redirectUrl?: string; // Custom redirect URL (optional)
+    authUrl?: string; // Custom auth URL (optional, defaults to "https://connect.phantom.app/login")
+    redirectUrl?: string; // Custom redirect URL after authentication (optional)
   };
-  embeddedWalletType?: "app-wallet" | "user-wallet"; // Wallet type
-  solanaProvider?: "web3js" | "kit"; // Solana library choice (default: 'web3js')
-  autoConnect?: boolean; // Auto-connect to existing session on SDK instantiation (default: true for embedded, false for injected)
+  embeddedWalletType?: "user-wallet"; // Wallet type (optional, defaults to "user-wallet", currently the only supported type)
+  autoConnect?: boolean; // Auto-connect to existing session on SDK instantiation (optional, defaults to true for embedded, false for injected)
 }
 ```
 
@@ -839,6 +850,7 @@ function App() {
   // SDK configuration - static, won't change when debug settings change
   const config: PhantomSDKConfig = {
     providerType: "embedded",
+    appId: "your-app-id",
     // ... other config
   };
 

package/dist/index.d.ts

@@ -1,13 +1,12 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ReactNode } from 'react';
-import { BrowserSDKConfig, DebugConfig, AuthOptions, BrowserSDK, WalletAddress, AutoConfirmEnableParams, AutoConfirmResult, AutoConfirmSupportedChainsResult } from '@phantom/browser-sdk';
-export { AddressType, AutoConfirmEnableParams, AutoConfirmResult, AutoConfirmSupportedChainsResult, DebugLevel, DebugMessage, NetworkId, SignedTransaction, WalletAddress, debug } from '@phantom/browser-sdk';
+import { BrowserSDKConfig, DebugConfig, AuthOptions, BrowserSDK, WalletAddress, ConnectResult, AutoConfirmEnableParams, AutoConfirmResult, AutoConfirmSupportedChainsResult } from '@phantom/browser-sdk';
+export { AddressType, AutoConfirmEnableParams, AutoConfirmResult, AutoConfirmSupportedChainsResult, ConnectErrorEventData, ConnectEventData, ConnectStartEventData, DebugLevel, DebugMessage, DisconnectEventData, EmbeddedProviderEvent, EmbeddedProviderEventMap, EventCallback, NetworkId, SignedTransaction, WalletAddress, debug } from '@phantom/browser-sdk';
 import * as _phantom_embedded_provider_core from '@phantom/embedded-provider-core';
-import { ISolanaChain, IEthereumChain, EthTransactionRequest } from '@phantom/chains';
-export { EthTransactionRequest, IEthereumChain, ISolanaChain } from '@phantom/chains';
+import { ISolanaChain, IEthereumChain } from '@phantom/chain-interfaces';
+export { EthTransactionRequest, IEthereumChain, ISolanaChain } from '@phantom/chain-interfaces';
 
-interface PhantomSDKConfig extends BrowserSDKConfig {
-}
+type PhantomSDKConfig = BrowserSDKConfig;
 interface PhantomDebugConfig extends DebugConfig {
 }
 interface ConnectOptions {
@@ -21,9 +20,10 @@ interface PhantomContextValue {
     isConnecting: boolean;
     connectError: Error | null;
     addresses: WalletAddress[];
-    walletId: string | null;
     currentProviderType: "injected" | "embedded" | null;
     isPhantomAvailable: boolean;
+    isClient: boolean;
+    user: ConnectResult | null;
 }
 interface PhantomProviderProps {
     children: ReactNode;
@@ -34,7 +34,7 @@ declare function PhantomProvider({ children, config, debugConfig }: PhantomProvi
 declare function usePhantom(): PhantomContextValue;
 
 declare function useConnect(): {
-    connect: (options?: AuthOptions) => Promise<_phantom_embedded_provider_core.ConnectResult>;
+    connect: (options: AuthOptions) => Promise<_phantom_embedded_provider_core.ConnectResult>;
     isConnecting: boolean;
     error: Error | null;
     currentProviderType: "injected" | "embedded" | null;
@@ -58,6 +58,15 @@ declare function useIsExtensionInstalled(): {
     isInstalled: boolean;
 };
 
+/**
+ * React hook to check if Phantom Login is available
+ * Checks if extension is installed and supports phantom_login feature
+ */
+declare function useIsPhantomLoginAvailable(): {
+    isLoading: boolean;
+    isAvailable: boolean;
+};
+
 interface UseAutoConfirmResult {
     enable: (params: AutoConfirmEnableParams) => Promise<AutoConfirmResult>;
     disable: () => Promise<void>;
@@ -72,53 +81,23 @@ declare function useAutoConfirm(): UseAutoConfirmResult;
 /**
  * Hook for Solana chain operations
  *
- * @returns Solana chain interface and convenient methods
+ * @returns Solana chain interface with connection enforcement
  */
 declare function useSolana(): {
-    solana: ISolanaChain | null;
-    signMessage: (message: string | Uint8Array) => Promise<{
-        signature: Uint8Array;
-        publicKey: string;
-    }>;
-    signTransaction: <T>(transaction: T) => Promise<T>;
-    signAndSendTransaction: <T>(transaction: T) => Promise<{
-        signature: string;
-    }>;
-    connect: (options?: {
-        onlyIfTrusted?: boolean;
-    }) => Promise<{
-        publicKey: string;
-    }>;
-    disconnect: () => Promise<void>;
-    switchNetwork: (network: "mainnet" | "devnet") => Promise<void | undefined>;
-    getPublicKey: () => Promise<string | null>;
+    solana: ISolanaChain;
     isAvailable: boolean;
-    isConnected: boolean;
 };
 
 /**
  * Hook for Ethereum chain operations
  *
- * @returns Ethereum chain interface and convenient methods
+ * @returns Ethereum chain interface with connection enforcement
  */
 declare function useEthereum(): {
-    ethereum: IEthereumChain | null;
-    request: <T = any>(args: {
-        method: string;
-        params?: unknown[];
-    }) => Promise<T>;
-    signPersonalMessage: (message: string, address: string) => Promise<string>;
-    signMessage: (message: string) => Promise<string>;
-    signTransaction: (transaction: EthTransactionRequest) => Promise<string>;
-    signTypedData: (typedData: any) => Promise<string>;
-    sendTransaction: (transaction: EthTransactionRequest) => Promise<string>;
-    switchChain: (chainId: number) => Promise<void>;
-    getChainId: () => Promise<number>;
-    getAccounts: () => Promise<string[]>;
+    ethereum: IEthereumChain;
     isAvailable: boolean;
-    isConnected: boolean;
 };
 
 type ProviderType = "injected" | "embedded";
 
-export { ConnectOptions, PhantomDebugConfig, PhantomProvider, PhantomProviderProps, PhantomSDKConfig, ProviderType, useAccounts, useAutoConfirm, useConnect, useDisconnect, useEthereum, useIsExtensionInstalled, usePhantom, useSolana };
+export { ConnectOptions, PhantomDebugConfig, PhantomProvider, PhantomProviderProps, PhantomSDKConfig, ProviderType, useAccounts, useAutoConfirm, useConnect, useDisconnect, useEthereum, useIsExtensionInstalled, useIsPhantomLoginAvailable, usePhantom, useSolana };

package/dist/index.js

@@ -30,17 +30,18 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var src_exports = {};
 __export(src_exports, {
-  AddressType: () => import_browser_sdk3.AddressType,
-  DebugLevel: () => import_browser_sdk3.DebugLevel,
-  NetworkId: () => import_browser_sdk3.NetworkId,
+  AddressType: () => import_browser_sdk4.AddressType,
+  DebugLevel: () => import_browser_sdk4.DebugLevel,
+  NetworkId: () => import_browser_sdk4.NetworkId,
   PhantomProvider: () => PhantomProvider,
-  debug: () => import_browser_sdk3.debug,
+  debug: () => import_browser_sdk4.debug,
   useAccounts: () => useAccounts,
   useAutoConfirm: () => useAutoConfirm,
   useConnect: () => useConnect,
   useDisconnect: () => useDisconnect,
   useEthereum: () => useEthereum,
   useIsExtensionInstalled: () => useIsExtensionInstalled,
+  useIsPhantomLoginAvailable: () => useIsPhantomLoginAvailable,
   usePhantom: () => usePhantom,
   useSolana: () => useSolana
 });
@@ -52,42 +53,46 @@ var import_browser_sdk = require("@phantom/browser-sdk");
 var import_jsx_runtime = require("react/jsx-runtime");
 var PhantomContext = (0, import_react.createContext)(void 0);
 function PhantomProvider({ children, config, debugConfig }) {
-  const memoizedConfig = (0, import_react.useMemo)(() => {
-    return {
-      ...config,
-      // Use providerType if provided, default to embedded
-      providerType: config.providerType || "embedded"
-    };
-  }, [config]);
+  const memoizedConfig = (0, import_react.useMemo)(() => config, [config]);
+  const [sdk, setSdk] = (0, import_react.useState)(null);
+  const [isClient, setIsClient] = (0, import_react.useState)(false);
   const [isConnected, setIsConnected] = (0, import_react.useState)(false);
   const [isConnecting, setIsConnecting] = (0, import_react.useState)(false);
   const [connectError, setConnectError] = (0, import_react.useState)(null);
   const [addresses, setAddresses] = (0, import_react.useState)([]);
-  const [walletId, setWalletId] = (0, import_react.useState)(null);
   const [currentProviderType, setCurrentProviderType] = (0, import_react.useState)(
     memoizedConfig.providerType || null
   );
   const [isPhantomAvailable, setIsPhantomAvailable] = (0, import_react.useState)(false);
-  const [sdk, setSdk] = (0, import_react.useState)(null);
+  const [user, setUser] = (0, import_react.useState)(null);
+  (0, import_react.useEffect)(() => {
+    setIsClient(true);
+  }, []);
   (0, import_react.useEffect)(() => {
+    if (!isClient)
+      return;
     const sdkInstance = new import_browser_sdk.BrowserSDK(memoizedConfig);
+    setSdk(sdkInstance);
+  }, [isClient, memoizedConfig]);
+  (0, import_react.useEffect)(() => {
+    if (!sdk)
+      return;
     const handleConnectStart = () => {
       setIsConnecting(true);
       setConnectError(null);
     };
-    const handleConnect = async () => {
+    const handleConnect = async (data) => {
       try {
         setIsConnected(true);
         setIsConnecting(false);
-        const providerInfo = sdkInstance.getCurrentProviderInfo();
-        setCurrentProviderType(providerInfo?.type || null);
-        const addrs = await sdkInstance.getAddresses();
+        setUser(data);
+        setCurrentProviderType(data.providerType || null);
+        const addrs = await sdk.getAddresses();
         setAddresses(addrs);
-        setWalletId(sdkInstance.getWalletId());
       } catch (err) {
         console.error("Error connecting:", err);
         try {
-          await sdkInstance.disconnect();
+          await sdk.disconnect();
         } catch (err2) {
           console.error("Error disconnecting:", err2);
         }
@@ -97,33 +102,33 @@ function PhantomProvider({ children, config, debugConfig }) {
       setIsConnecting(false);
       setIsConnected(false);
       setConnectError(new Error(errorData.error || "Connection failed"));
+      setAddresses([]);
     };
     const handleDisconnect = () => {
       setIsConnected(false);
       setIsConnecting(false);
       setConnectError(null);
       setAddresses([]);
-      setWalletId(null);
+      setUser(null);
     };
-    sdkInstance.on("connect_start", handleConnectStart);
-    sdkInstance.on("connect", handleConnect);
-    sdkInstance.on("connect_error", handleConnectError);
-    sdkInstance.on("disconnect", handleDisconnect);
-    setSdk(sdkInstance);
+    sdk.on("connect_start", handleConnectStart);
+    sdk.on("connect", handleConnect);
+    sdk.on("connect_error", handleConnectError);
+    sdk.on("disconnect", handleDisconnect);
     return () => {
-      sdkInstance.off("connect_start", handleConnectStart);
-      sdkInstance.off("connect", handleConnect);
-      sdkInstance.off("connect_error", handleConnectError);
-      sdkInstance.off("disconnect", handleDisconnect);
+      sdk.off("connect_start", handleConnectStart);
+      sdk.off("connect", handleConnect);
+      sdk.off("connect_error", handleConnectError);
+      sdk.off("disconnect", handleDisconnect);
     };
-  }, [memoizedConfig]);
+  }, [sdk]);
   (0, import_react.useEffect)(() => {
-    if (!sdk || !debugConfig)
+    if (!debugConfig || !sdk)
       return;
     sdk.configureDebug(debugConfig);
   }, [sdk, debugConfig]);
   (0, import_react.useEffect)(() => {
-    if (!sdk)
+    if (!isClient || !sdk)
       return;
     const initialize = async () => {
       try {
@@ -139,7 +144,7 @@ function PhantomProvider({ children, config, debugConfig }) {
       }
     };
     initialize();
-  }, [sdk, memoizedConfig.autoConnect]);
+  }, [sdk, memoizedConfig.autoConnect, isClient]);
   const value = (0, import_react.useMemo)(
     () => ({
       sdk,
@@ -147,11 +152,12 @@ function PhantomProvider({ children, config, debugConfig }) {
       isConnecting,
       connectError,
       addresses,
-      walletId,
       currentProviderType,
-      isPhantomAvailable
+      isPhantomAvailable,
+      isClient,
+      user
     }),
-    [sdk, isConnected, isConnecting, connectError, addresses, walletId, currentProviderType, isPhantomAvailable]
+    [sdk, isConnected, isConnecting, connectError, addresses, currentProviderType, isPhantomAvailable, isClient, user]
   );
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PhantomContext.Provider, { value, children });
 }
@@ -258,6 +264,39 @@ function useIsExtensionInstalled() {
   return { isLoading, isInstalled };
 }
 
+// src/hooks/useIsPhantomLoginAvailable.ts
+var React2 = __toESM(require("react"));
+var import_browser_sdk3 = require("@phantom/browser-sdk");
+function useIsPhantomLoginAvailable() {
+  const [isLoading, setIsLoading] = React2.useState(true);
+  const [isAvailable, setIsAvailable] = React2.useState(false);
+  React2.useEffect(() => {
+    let isMounted = true;
+    const checkPhantomLogin = async () => {
+      try {
+        setIsLoading(true);
+        const result = await (0, import_browser_sdk3.isPhantomLoginAvailable)(3e3);
+        if (isMounted) {
+          setIsAvailable(result);
+        }
+      } catch (error) {
+        if (isMounted) {
+          setIsAvailable(false);
+        }
+      } finally {
+        if (isMounted) {
+          setIsLoading(false);
+        }
+      }
+    };
+    checkPhantomLogin();
+    return () => {
+      isMounted = false;
+    };
+  }, []);
+  return { isLoading, isAvailable };
+}
+
 // src/hooks/useAutoConfirm.ts
 var import_react4 = require("react");
 function useAutoConfirm() {
@@ -353,189 +392,40 @@ function useAutoConfirm() {
 }
 
 // src/hooks/useSolana.ts
-var import_react5 = require("react");
 function useSolana() {
-  const { sdk, isConnected } = usePhantom();
-  const getSolanaChain = (0, import_react5.useCallback)(() => {
-    if (!sdk)
-      throw new Error("Phantom SDK not initialized.");
-    if (!sdk.isConnected())
-      throw new Error("Phantom SDK not connected. Call connect() first.");
-    return sdk.solana;
-  }, [sdk]);
-  const solanaChain = (0, import_react5.useMemo)(() => {
-    if (!sdk || !isConnected)
-      return null;
-    try {
-      return sdk.solana;
-    } catch {
-      return null;
-    }
-  }, [sdk, isConnected]);
-  const signMessage = (0, import_react5.useCallback)(
-    async (message) => {
-      const chain = getSolanaChain();
-      return chain.signMessage(message);
-    },
-    [getSolanaChain]
-  );
-  const signTransaction = (0, import_react5.useCallback)(
-    async (transaction) => {
-      const chain = getSolanaChain();
-      return chain.signTransaction(transaction);
-    },
-    [getSolanaChain]
-  );
-  const signAndSendTransaction = (0, import_react5.useCallback)(
-    async (transaction) => {
-      const chain = getSolanaChain();
-      return chain.signAndSendTransaction(transaction);
-    },
-    [getSolanaChain]
-  );
-  const connect = (0, import_react5.useCallback)(
-    async (options) => {
-      const chain = getSolanaChain();
-      return chain.connect(options);
-    },
-    [getSolanaChain]
-  );
-  const disconnect = (0, import_react5.useCallback)(async () => {
-    const chain = getSolanaChain();
-    return chain.disconnect();
-  }, [getSolanaChain]);
-  const switchNetwork = (0, import_react5.useCallback)(
-    async (network) => {
-      const chain = getSolanaChain();
-      return chain.switchNetwork?.(network);
-    },
-    [getSolanaChain]
-  );
-  const getPublicKey = (0, import_react5.useCallback)(async () => {
-    if (!sdk || !sdk.isConnected())
-      return null;
-    return sdk.solana.getPublicKey();
-  }, [sdk]);
+  const { sdk, isConnected, isClient } = usePhantom();
+  if (!isClient || !sdk) {
+    return {
+      solana: {},
+      // This will be replaced when SDK is ready
+      isAvailable: false
+    };
+  }
   return {
-    // Chain instance for advanced usage
-    solana: solanaChain,
-    // Convenient methods
-    signMessage,
-    signTransaction,
-    signAndSendTransaction,
-    connect,
-    disconnect,
-    switchNetwork,
-    getPublicKey,
+    // Chain instance with connection enforcement for signing methods
+    solana: sdk.solana,
     // State
-    isAvailable: !!solanaChain,
-    isConnected: solanaChain?.isConnected() ?? false
+    isAvailable: !!isConnected
   };
 }
 
 // src/hooks/useEthereum.ts
-var import_react6 = require("react");
 function useEthereum() {
-  const { sdk, isConnected } = usePhantom();
-  const getEthereumChain = (0, import_react6.useCallback)(() => {
-    if (!sdk)
-      throw new Error("Phantom SDK not initialized.");
-    if (!sdk.isConnected())
-      throw new Error("Phantom SDK not connected. Call connect() first.");
-    return sdk.ethereum;
-  }, [sdk]);
-  const ethereumChain = (0, import_react6.useMemo)(() => {
-    if (!sdk || !isConnected)
-      return null;
-    try {
-      return sdk.ethereum;
-    } catch {
-      return null;
-    }
-  }, [sdk, isConnected]);
-  const request = (0, import_react6.useCallback)(
-    async (args) => {
-      const chain = getEthereumChain();
-      return chain.request(args);
-    },
-    [getEthereumChain]
-  );
-  const signPersonalMessage = (0, import_react6.useCallback)(
-    async (message, address) => {
-      return request({
-        method: "personal_sign",
-        params: [message, address]
-      });
-    },
-    [request]
-  );
-  const signTransaction = (0, import_react6.useCallback)(
-    async (transaction) => {
-      const chain = getEthereumChain();
-      return chain.signTransaction(transaction);
-    },
-    [getEthereumChain]
-  );
-  const sendTransaction = (0, import_react6.useCallback)(
-    async (transaction) => {
-      const chain = getEthereumChain();
-      return chain.sendTransaction(transaction);
-    },
-    [getEthereumChain]
-  );
-  const switchChain = (0, import_react6.useCallback)(
-    async (chainId) => {
-      const chain = getEthereumChain();
-      return chain.switchChain(chainId);
-    },
-    [getEthereumChain]
-  );
-  const getChainId = (0, import_react6.useCallback)(async () => {
-    const chain = getEthereumChain();
-    return chain.getChainId();
-  }, [getEthereumChain]);
-  const getAccounts = (0, import_react6.useCallback)(async () => {
-    const chain = getEthereumChain();
-    return chain.getAccounts();
-  }, [getEthereumChain]);
-  const signMessage = (0, import_react6.useCallback)(
-    async (message) => {
-      return request({
-        method: "eth_sign",
-        params: [await getAccounts().then((accounts) => accounts[0]), message]
-      });
-    },
-    [request, getAccounts]
-  );
-  const signTypedData = (0, import_react6.useCallback)(
-    async (typedData) => {
-      const accounts = await getAccounts();
-      return request({
-        method: "eth_signTypedData_v4",
-        params: [accounts[0], JSON.stringify(typedData)]
-      });
-    },
-    [request, getAccounts]
-  );
+  const { sdk, isConnected, isClient } = usePhantom();
+  if (!isClient || !sdk) {
+    return {
+      ethereum: {},
+      // This will be replaced when SDK is ready
+      isAvailable: false
+    };
+  }
   return {
-    // Chain instance for advanced usage
-    ethereum: ethereumChain,
-    // Standard EIP-1193 interface
-    request,
-    // Convenient methods
-    signPersonalMessage,
-    signMessage,
-    signTransaction,
-    signTypedData,
-    sendTransaction,
-    switchChain,
-    getChainId,
-    getAccounts,
+    // Chain instance with connection enforcement for signing methods
+    ethereum: sdk.ethereum,
     // State
-    isAvailable: !!ethereumChain,
-    isConnected: ethereumChain?.isConnected() ?? false
+    isAvailable: !!isConnected
   };
 }
 
 // src/index.ts
-var import_browser_sdk3 = require("@phantom/browser-sdk");
+var import_browser_sdk4 = require("@phantom/browser-sdk");

package/dist/index.mjs

@@ -4,42 +4,46 @@ import { BrowserSDK } from "@phantom/browser-sdk";
 import { jsx } from "react/jsx-runtime";
 var PhantomContext = createContext(void 0);
 function PhantomProvider({ children, config, debugConfig }) {
-  const memoizedConfig = useMemo(() => {
-    return {
-      ...config,
-      // Use providerType if provided, default to embedded
-      providerType: config.providerType || "embedded"
-    };
-  }, [config]);
+  const memoizedConfig = useMemo(() => config, [config]);
+  const [sdk, setSdk] = useState(null);
+  const [isClient, setIsClient] = useState(false);
   const [isConnected, setIsConnected] = useState(false);
   const [isConnecting, setIsConnecting] = useState(false);
   const [connectError, setConnectError] = useState(null);
   const [addresses, setAddresses] = useState([]);
-  const [walletId, setWalletId] = useState(null);
   const [currentProviderType, setCurrentProviderType] = useState(
     memoizedConfig.providerType || null
   );
   const [isPhantomAvailable, setIsPhantomAvailable] = useState(false);
-  const [sdk, setSdk] = useState(null);
+  const [user, setUser] = useState(null);
+  useEffect(() => {
+    setIsClient(true);
+  }, []);
   useEffect(() => {
+    if (!isClient)
+      return;
     const sdkInstance = new BrowserSDK(memoizedConfig);
+    setSdk(sdkInstance);
+  }, [isClient, memoizedConfig]);
+  useEffect(() => {
+    if (!sdk)
+      return;
     const handleConnectStart = () => {
       setIsConnecting(true);
       setConnectError(null);
     };
-    const handleConnect = async () => {
+    const handleConnect = async (data) => {
       try {
         setIsConnected(true);
         setIsConnecting(false);
-        const providerInfo = sdkInstance.getCurrentProviderInfo();
-        setCurrentProviderType(providerInfo?.type || null);
-        const addrs = await sdkInstance.getAddresses();
+        setUser(data);
+        setCurrentProviderType(data.providerType || null);
+        const addrs = await sdk.getAddresses();
         setAddresses(addrs);
-        setWalletId(sdkInstance.getWalletId());
       } catch (err) {
         console.error("Error connecting:", err);
         try {
-          await sdkInstance.disconnect();
+          await sdk.disconnect();
         } catch (err2) {
           console.error("Error disconnecting:", err2);
         }
@@ -49,33 +53,33 @@ function PhantomProvider({ children, config, debugConfig }) {
       setIsConnecting(false);
       setIsConnected(false);
       setConnectError(new Error(errorData.error || "Connection failed"));
+      setAddresses([]);
     };
     const handleDisconnect = () => {
       setIsConnected(false);
       setIsConnecting(false);
       setConnectError(null);
       setAddresses([]);
-      setWalletId(null);
+      setUser(null);
     };
-    sdkInstance.on("connect_start", handleConnectStart);
-    sdkInstance.on("connect", handleConnect);
-    sdkInstance.on("connect_error", handleConnectError);
-    sdkInstance.on("disconnect", handleDisconnect);
-    setSdk(sdkInstance);
+    sdk.on("connect_start", handleConnectStart);
+    sdk.on("connect", handleConnect);
+    sdk.on("connect_error", handleConnectError);
+    sdk.on("disconnect", handleDisconnect);
     return () => {
-      sdkInstance.off("connect_start", handleConnectStart);
-      sdkInstance.off("connect", handleConnect);
-      sdkInstance.off("connect_error", handleConnectError);
-      sdkInstance.off("disconnect", handleDisconnect);
+      sdk.off("connect_start", handleConnectStart);
+      sdk.off("connect", handleConnect);
+      sdk.off("connect_error", handleConnectError);
+      sdk.off("disconnect", handleDisconnect);
     };
-  }, [memoizedConfig]);
+  }, [sdk]);
   useEffect(() => {
-    if (!sdk || !debugConfig)
+    if (!debugConfig || !sdk)
       return;
     sdk.configureDebug(debugConfig);
   }, [sdk, debugConfig]);
   useEffect(() => {
-    if (!sdk)
+    if (!isClient || !sdk)
       return;
     const initialize = async () => {
       try {
@@ -91,7 +95,7 @@ function PhantomProvider({ children, config, debugConfig }) {
       }
     };
     initialize();
-  }, [sdk, memoizedConfig.autoConnect]);
+  }, [sdk, memoizedConfig.autoConnect, isClient]);
   const value = useMemo(
     () => ({
       sdk,
@@ -99,11 +103,12 @@ function PhantomProvider({ children, config, debugConfig }) {
       isConnecting,
       connectError,
       addresses,
-      walletId,
       currentProviderType,
-      isPhantomAvailable
+      isPhantomAvailable,
+      isClient,
+      user
     }),
-    [sdk, isConnected, isConnecting, connectError, addresses, walletId, currentProviderType, isPhantomAvailable]
+    [sdk, isConnected, isConnecting, connectError, addresses, currentProviderType, isPhantomAvailable, isClient, user]
   );
   return /* @__PURE__ */ jsx(PhantomContext.Provider, { value, children });
 }
@@ -210,14 +215,47 @@ function useIsExtensionInstalled() {
   return { isLoading, isInstalled };
 }
 
+// src/hooks/useIsPhantomLoginAvailable.ts
+import * as React2 from "react";
+import { isPhantomLoginAvailable } from "@phantom/browser-sdk";
+function useIsPhantomLoginAvailable() {
+  const [isLoading, setIsLoading] = React2.useState(true);
+  const [isAvailable, setIsAvailable] = React2.useState(false);
+  React2.useEffect(() => {
+    let isMounted = true;
+    const checkPhantomLogin = async () => {
+      try {
+        setIsLoading(true);
+        const result = await isPhantomLoginAvailable(3e3);
+        if (isMounted) {
+          setIsAvailable(result);
+        }
+      } catch (error) {
+        if (isMounted) {
+          setIsAvailable(false);
+        }
+      } finally {
+        if (isMounted) {
+          setIsLoading(false);
+        }
+      }
+    };
+    checkPhantomLogin();
+    return () => {
+      isMounted = false;
+    };
+  }, []);
+  return { isLoading, isAvailable };
+}
+
 // src/hooks/useAutoConfirm.ts
-import { useCallback as useCallback3, useState as useState4, useEffect as useEffect3 } from "react";
+import { useCallback as useCallback3, useState as useState5, useEffect as useEffect4 } from "react";
 function useAutoConfirm() {
   const { sdk, currentProviderType } = usePhantom();
-  const [status, setStatus] = useState4(null);
-  const [supportedChains, setSupportedChains] = useState4(null);
-  const [isLoading, setIsLoading] = useState4(false);
-  const [error, setError] = useState4(null);
+  const [status, setStatus] = useState5(null);
+  const [supportedChains, setSupportedChains] = useState5(null);
+  const [isLoading, setIsLoading] = useState5(false);
+  const [error, setError] = useState5(null);
   const isInjected = currentProviderType === "injected";
   const enable = useCallback3(
     async (params) => {
@@ -284,7 +322,7 @@ function useAutoConfirm() {
       setIsLoading(false);
     }
   }, [sdk, isInjected]);
-  useEffect3(() => {
+  useEffect4(() => {
     if (sdk && isInjected) {
       refetch();
     } else {
@@ -305,187 +343,38 @@ function useAutoConfirm() {
 }
 
 // src/hooks/useSolana.ts
-import { useCallback as useCallback4, useMemo as useMemo2 } from "react";
 function useSolana() {
-  const { sdk, isConnected } = usePhantom();
-  const getSolanaChain = useCallback4(() => {
-    if (!sdk)
-      throw new Error("Phantom SDK not initialized.");
-    if (!sdk.isConnected())
-      throw new Error("Phantom SDK not connected. Call connect() first.");
-    return sdk.solana;
-  }, [sdk]);
-  const solanaChain = useMemo2(() => {
-    if (!sdk || !isConnected)
-      return null;
-    try {
-      return sdk.solana;
-    } catch {
-      return null;
-    }
-  }, [sdk, isConnected]);
-  const signMessage = useCallback4(
-    async (message) => {
-      const chain = getSolanaChain();
-      return chain.signMessage(message);
-    },
-    [getSolanaChain]
-  );
-  const signTransaction = useCallback4(
-    async (transaction) => {
-      const chain = getSolanaChain();
-      return chain.signTransaction(transaction);
-    },
-    [getSolanaChain]
-  );
-  const signAndSendTransaction = useCallback4(
-    async (transaction) => {
-      const chain = getSolanaChain();
-      return chain.signAndSendTransaction(transaction);
-    },
-    [getSolanaChain]
-  );
-  const connect = useCallback4(
-    async (options) => {
-      const chain = getSolanaChain();
-      return chain.connect(options);
-    },
-    [getSolanaChain]
-  );
-  const disconnect = useCallback4(async () => {
-    const chain = getSolanaChain();
-    return chain.disconnect();
-  }, [getSolanaChain]);
-  const switchNetwork = useCallback4(
-    async (network) => {
-      const chain = getSolanaChain();
-      return chain.switchNetwork?.(network);
-    },
-    [getSolanaChain]
-  );
-  const getPublicKey = useCallback4(async () => {
-    if (!sdk || !sdk.isConnected())
-      return null;
-    return sdk.solana.getPublicKey();
-  }, [sdk]);
+  const { sdk, isConnected, isClient } = usePhantom();
+  if (!isClient || !sdk) {
+    return {
+      solana: {},
+      // This will be replaced when SDK is ready
+      isAvailable: false
+    };
+  }
   return {
-    // Chain instance for advanced usage
-    solana: solanaChain,
-    // Convenient methods
-    signMessage,
-    signTransaction,
-    signAndSendTransaction,
-    connect,
-    disconnect,
-    switchNetwork,
-    getPublicKey,
+    // Chain instance with connection enforcement for signing methods
+    solana: sdk.solana,
     // State
-    isAvailable: !!solanaChain,
-    isConnected: solanaChain?.isConnected() ?? false
+    isAvailable: !!isConnected
   };
 }
 
 // src/hooks/useEthereum.ts
-import { useCallback as useCallback5, useMemo as useMemo3 } from "react";
 function useEthereum() {
-  const { sdk, isConnected } = usePhantom();
-  const getEthereumChain = useCallback5(() => {
-    if (!sdk)
-      throw new Error("Phantom SDK not initialized.");
-    if (!sdk.isConnected())
-      throw new Error("Phantom SDK not connected. Call connect() first.");
-    return sdk.ethereum;
-  }, [sdk]);
-  const ethereumChain = useMemo3(() => {
-    if (!sdk || !isConnected)
-      return null;
-    try {
-      return sdk.ethereum;
-    } catch {
-      return null;
-    }
-  }, [sdk, isConnected]);
-  const request = useCallback5(
-    async (args) => {
-      const chain = getEthereumChain();
-      return chain.request(args);
-    },
-    [getEthereumChain]
-  );
-  const signPersonalMessage = useCallback5(
-    async (message, address) => {
-      return request({
-        method: "personal_sign",
-        params: [message, address]
-      });
-    },
-    [request]
-  );
-  const signTransaction = useCallback5(
-    async (transaction) => {
-      const chain = getEthereumChain();
-      return chain.signTransaction(transaction);
-    },
-    [getEthereumChain]
-  );
-  const sendTransaction = useCallback5(
-    async (transaction) => {
-      const chain = getEthereumChain();
-      return chain.sendTransaction(transaction);
-    },
-    [getEthereumChain]
-  );
-  const switchChain = useCallback5(
-    async (chainId) => {
-      const chain = getEthereumChain();
-      return chain.switchChain(chainId);
-    },
-    [getEthereumChain]
-  );
-  const getChainId = useCallback5(async () => {
-    const chain = getEthereumChain();
-    return chain.getChainId();
-  }, [getEthereumChain]);
-  const getAccounts = useCallback5(async () => {
-    const chain = getEthereumChain();
-    return chain.getAccounts();
-  }, [getEthereumChain]);
-  const signMessage = useCallback5(
-    async (message) => {
-      return request({
-        method: "eth_sign",
-        params: [await getAccounts().then((accounts) => accounts[0]), message]
-      });
-    },
-    [request, getAccounts]
-  );
-  const signTypedData = useCallback5(
-    async (typedData) => {
-      const accounts = await getAccounts();
-      return request({
-        method: "eth_signTypedData_v4",
-        params: [accounts[0], JSON.stringify(typedData)]
-      });
-    },
-    [request, getAccounts]
-  );
+  const { sdk, isConnected, isClient } = usePhantom();
+  if (!isClient || !sdk) {
+    return {
+      ethereum: {},
+      // This will be replaced when SDK is ready
+      isAvailable: false
+    };
+  }
   return {
-    // Chain instance for advanced usage
-    ethereum: ethereumChain,
-    // Standard EIP-1193 interface
-    request,
-    // Convenient methods
-    signPersonalMessage,
-    signMessage,
-    signTransaction,
-    signTypedData,
-    sendTransaction,
-    switchChain,
-    getChainId,
-    getAccounts,
+    // Chain instance with connection enforcement for signing methods
+    ethereum: sdk.ethereum,
     // State
-    isAvailable: !!ethereumChain,
-    isConnected: ethereumChain?.isConnected() ?? false
+    isAvailable: !!isConnected
   };
 }
 
@@ -503,6 +392,7 @@ export {
   useDisconnect,
   useEthereum,
   useIsExtensionInstalled,
+  useIsPhantomLoginAvailable,
   usePhantom,
   useSolana
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@phantom/react-sdk",
-  "version": "1.0.0-beta.2",
+  "version": "1.0.0-beta.21",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
   "types": "dist/index.d.ts",
@@ -26,9 +26,9 @@
     "prettier": "prettier --write \"src/**/*.{ts,tsx}\""
   },
   "dependencies": {
-    "@phantom/browser-sdk": "^1.0.0-beta.2",
-    "@phantom/chains": "^1.0.0-beta.2",
-    "@phantom/constants": "^1.0.0-beta.2"
+    "@phantom/browser-sdk": "^1.0.0-beta.21",
+    "@phantom/chain-interfaces": "^1.0.0-beta.9",
+    "@phantom/constants": "^1.0.0-beta.9"
   },
   "devDependencies": {
     "@testing-library/dom": "^10.4.0",