@phantom/browser-sdk 1.0.0-beta.2 → 1.0.0-beta.20

package/README.md

@@ -19,7 +19,7 @@ const sdk = new BrowserSDK({
   addressTypes: [AddressType.solana, AddressType.ethereum],
 });
 
-const { addresses } = await sdk.connect();
+const { addresses } = await sdk.connect({ provider: "injected" });
 console.log("Connected addresses:", addresses);
 
 // Chain-specific operations
@@ -44,11 +44,10 @@ import { BrowserSDK, AddressType } from "@phantom/browser-sdk";
 const sdk = new BrowserSDK({
   providerType: "embedded",
   addressTypes: [AddressType.solana, AddressType.ethereum],
-  apiBaseUrl: "https://api.phantom.app/v1/wallets",
-  appId: "your-app-id",
+  appId: "your-app-id", // Get your app ID from phantom.com/portal
 });
 
-const { addresses } = await sdk.connect();
+const { addresses } = await sdk.connect({ provider: "phantom" });
 console.log("Addresses:", addresses);
 
 // Use chain-specific APIs
@@ -79,8 +78,8 @@ const sdk = new BrowserSDK({
   addressTypes: [AddressType.solana, AddressType.ethereum],
 });
 
-// 2. Connect to wallet
-const { addresses } = await sdk.connect();
+// 2. Connect to wallet (provider parameter is required)
+const { addresses } = await sdk.connect({ provider: "injected" });
 console.log("Connected addresses:", addresses);
 
 // 3. Use chain-specific methods
@@ -94,24 +93,38 @@ const ethResult = await sdk.ethereum.sendTransaction({
 
 ### 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:
 
 ```typescript
-// Default: Show provider selection screen
-const result = await sdk.connect();
+// Connect with injected provider (Phantom extension)
+// Automatically switches to injected provider if not already using it
+const result = await sdk.connect({
+  provider: "injected",
+});
 
-// Google authentication (skips provider selection)
+// Connect with Google authentication (embedded provider)
+// Automatically switches to embedded provider if not already using it
 const result = await sdk.connect({
-  authOptions: {
-    provider: "google",
-  },
+  provider: "google",
 });
 
-// Apple authentication (skips provider selection)
+// Connect with Apple authentication (embedded provider)
+// Automatically switches to embedded provider if not already using it
 const result = await sdk.connect({
-  authOptions: {
-    provider: "apple",
-  },
+  provider: "apple",
+});
+
+// Connect with Phantom authentication (embedded provider)
+// Uses Phantom extension or mobile app for authentication
+// Automatically switches to embedded provider if not already using it
+const result = await sdk.connect({
+  provider: "phantom",
+});
+
+// Connect with JWT authentication (embedded provider)
+const result = await sdk.connect({
+  provider: "jwt",
+  jwtToken: "your-jwt-token",
 });
 ```
 
@@ -190,48 +203,29 @@ Creates a non-custodial wallet embedded in your application. Requires API config
 const sdk = new BrowserSDK({
   providerType: "embedded",
   addressTypes: [AddressType.solana, AddressType.ethereum],
-  apiBaseUrl: "https://api.phantom.app/v1/wallets",
-  appId: "your-app-id",
-  embeddedWalletType: "app-wallet", // or 'user-wallet'
+  appId: "your-app-id", // Get your app ID from phantom.com/portal
   authOptions: {
-    authUrl: "https://auth.phantom.app", // optional, defaults to "https://connect.phantom.app"
+    authUrl: "https://connect.phantom.app/login", // optional, defaults to "https://connect.phantom.app/login"
     redirectUrl: "https://yourapp.com/callback", // optional, defaults to current page
   },
   autoConnect: true, // optional, auto-connect to existing session (default: true for embedded)
 });
 ```
 
-### Embedded Wallet Types
-
-#### App Wallet (`'app-wallet'`)
-
-- **New wallets** created per application
-- **Unfunded** by default - you need to fund them
-- **Independent** from user's existing Phantom wallet
-- **Perfect for**: Gaming, DeFi protocols, or apps that need fresh wallets
-
-```typescript
-const sdk = new BrowserSDK({
-  providerType: "embedded",
-  embeddedWalletType: "app-wallet",
-  addressTypes: [AddressType.solana],
-  // ... other config
-});
-```
+### Embedded Wallet Type
 
 #### User Wallet (`'user-wallet'`)
 
 - **Uses Phantom authentication** - user logs in with existing Phantom account
 - **Potentially funded** - brings in user's existing wallet balance
 - **Connected** to user's Phantom ecosystem
-- **Perfect for**: Trading platforms, NFT marketplaces, or apps needing funded wallets
+- **Perfect for**: All embedded wallet use cases
 
 ```typescript
 const sdk = new BrowserSDK({
   providerType: "embedded",
-  embeddedWalletType: "user-wallet",
+  appId: "your-app-id",
   addressTypes: [AddressType.solana, AddressType.ethereum],
-  // ... other config
 });
 ```
 
@@ -242,28 +236,6 @@ const sdk = new BrowserSDK({
 | `AddressType.solana`   | Solana Mainnet, Devnet, Testnet       |
 | `AddressType.ethereum` | Ethereum, Polygon, Arbitrum, and more |
 
-### Solana Provider Configuration
-
-When using `AddressType.solana`, you can choose between two Solana libraries:
-
-```typescript
-const sdk = new BrowserSDK({
-  providerType: "embedded",
-  addressTypes: [AddressType.solana],
-  solanaProvider: "web3js", // or 'kit'
-  // ... other config
-});
-```
-
-**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
 
 ### Auto-Connect Feature
 
@@ -272,8 +244,8 @@ The SDK can automatically reconnect to existing sessions when instantiated, prov
 ```typescript
 const sdk = new BrowserSDK({
   providerType: "embedded",
+  appId: "your-app-id",
   addressTypes: [AddressType.solana],
-  // ... other config
   autoConnect: true, // Default: true for embedded, false for injected
 });
 
@@ -295,8 +267,8 @@ if (sdk.isConnected()) {
 ```typescript
 const sdk = new BrowserSDK({
   providerType: "embedded",
+  appId: "your-app-id",
   addressTypes: [AddressType.solana],
-  // ... other config
   autoConnect: false, // Disable auto-connect
 });
 
@@ -320,21 +292,24 @@ interface BrowserSDKConfig {
   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 (required for embedded provider)
+  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 (default: "https://connect.phantom.app")
-    redirectUrl?: string; // Custom redirect URL after authentication
+    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; // Enable auto-connect to existing sessions (default: true)
+  embeddedWalletType?: "user-wallet"; // Wallet type (optional, defaults to "user-wallet", currently the only supported type)
+  autoConnect?: boolean; // Enable auto-connect to existing sessions (optional, defaults to true for embedded)
 }
 ```
 
 ### Extension Detection
 
-For injected provider usage, you can check if the Phantom extension is installed:
+#### waitForPhantomExtension
+
+Check if the Phantom extension is installed:
 
 ```typescript
 import { waitForPhantomExtension } from "@phantom/browser-sdk";
@@ -348,15 +323,46 @@ if (isAvailable) {
 }
 ```
 
+#### isPhantomLoginAvailable
+
+Check if Phantom Login is available (requires extension to be installed and support the `phantom_login` feature):
+
+```typescript
+import { isPhantomLoginAvailable } from "@phantom/browser-sdk";
+
+const isAvailable = await isPhantomLoginAvailable();
+
+if (isAvailable) {
+  console.log("Phantom Login is available!");
+  // Can use provider: "phantom" in connect()
+} else {
+  console.log("Phantom Login is not available");
+}
+```
+
 ### Core Methods
 
-#### connect()
+#### connect(options)
 
 Connect to wallet and get addresses for configured AddressTypes.
 
+**Parameters:**
+- `options: AuthOptions` (required) - Authentication options
+  - `provider: "google" | "apple" | "jwt" | "phantom" | "injected"` (required) - Authentication provider to use
+  - `jwtToken?: string` (optional) - JWT token (required when `provider` is "jwt")
+  - `customAuthData?: Record<string, any>` (optional) - Custom authentication data
+
 ```typescript
-const result = await sdk.connect();
-// Returns: { walletId?: string, addresses: WalletAddress[] }
+// Connect with injected provider
+const result = await sdk.connect({ provider: "injected" });
+
+// Connect with Phantom authentication
+const result = await sdk.connect({ provider: "phantom" });
+
+// Connect with Google authentication
+const result = await sdk.connect({ provider: "google" });
+
+// Returns: { addresses: WalletAddress[], status: "pending" | "completed", providerType: "embedded" | "injected" }
 // addresses only includes types from addressTypes config
 ```
 
@@ -385,15 +391,6 @@ Check if SDK is connected to a wallet.
 const connected = sdk.isConnected();
 ```
 
-#### getWalletId()
-
-Get the wallet ID (embedded wallets only).
-
-```typescript
-const walletId = sdk.getWalletId();
-// Returns string for embedded wallets, null for injected
-```
-
 ### Solana Chain Methods
 
 #### signMessage(message)
@@ -590,6 +587,106 @@ Attempt auto-connection using existing session. Should be called after setting u
 await sdk.autoConnect();
 ```
 
+### Event Handlers
+
+The SDK provides typed event handlers that allow you to listen for connection state changes. This is especially useful for `autoConnect()` flows where you need to track the connection result.
+
+#### Available Events
+
+```typescript
+import { BrowserSDK } from '@phantom/browser-sdk';
+import type {
+  ConnectEventData,
+  ConnectStartEventData,
+  ConnectErrorEventData,
+  DisconnectEventData
+} from '@phantom/browser-sdk';
+
+const sdk = new BrowserSDK({
+  providerType: 'embedded',
+  appId: 'your-app-id',
+  addressTypes: [AddressType.solana],
+});
+
+// 1. connect_start - Fired when connection starts
+sdk.on('connect_start', (data: ConnectStartEventData) => {
+  console.log('Connection starting:', data.source); // "auto-connect" | "manual-connect"
+  console.log('Auth options:', data.authOptions?.provider); // "google" | "apple" | etc.
+});
+
+// 2. connect - Fired when connection succeeds (includes full ConnectResult)
+sdk.on('connect', (data: ConnectEventData) => {
+  console.log('Connected successfully!');
+  console.log('Provider type:', data.providerType); // "embedded" | "injected"
+  console.log('Wallet ID:', data.walletId); // only for embedded providers
+  console.log('Addresses:', data.addresses); // WalletAddress[]
+  console.log('Status:', data.status); // "pending" | "completed"
+  console.log('Source:', data.source); // "auto-connect" | "manual-connect" | "manual-existing" | "existing-session" | "manual"
+});
+
+// 3. connect_error - Fired when connection fails
+sdk.on('connect_error', (data: ConnectErrorEventData) => {
+  console.error('Connection failed:', data.error);
+  console.log('Source:', data.source); // "auto-connect" | "manual-connect"
+});
+
+// 4. disconnect - Fired when disconnected
+sdk.on('disconnect', (data: DisconnectEventData) => {
+  console.log('Disconnected from wallet');
+  console.log('Source:', data.source); // "manual"
+});
+
+// 5. error - General error handler
+sdk.on('error', (error: unknown) => {
+  console.error('SDK error:', error);
+});
+
+// Don't forget to remove listeners when done
+sdk.off('connect', handleConnect);
+```
+
+#### Event Types
+
+| Event | Payload Type | When Fired | Key Data |
+|-------|-------------|------------|----------|
+| `connect_start` | `ConnectStartEventData` | Connection initiated | `source`, `authOptions` |
+| `connect` | `ConnectEventData` | Connection successful | `providerType`, `addresses`, `status`, `source`, `user`|
+| `connect_error` | `ConnectErrorEventData` | Connection failed | `error`, `source` |
+| `disconnect` | `DisconnectEventData` | Disconnected | `source` |
+| `error` | `unknown` | General SDK errors | Error details |
+
+#### Using Events with autoConnect()
+
+Event handlers are especially useful with `autoConnect()` since it doesn't return a value:
+
+```typescript
+const sdk = new BrowserSDK({
+  providerType: 'embedded',
+  appId: 'your-app-id',
+  addressTypes: [AddressType.solana],
+  autoConnect: true,
+});
+
+// Set up event listeners BEFORE autoConnect
+sdk.on('connect', (data: ConnectEventData) => {
+  console.log('Auto-connected successfully!');
+  console.log('Provider type:', data.providerType);
+  console.log('Addresses:', data.addresses);
+
+  // Update your UI state here
+  updateUIWithAddresses(data.addresses);
+});
+
+sdk.on('connect_error', (data: ConnectErrorEventData) => {
+  console.log('Auto-connect failed:', data.error);
+  // Show connect button to user
+  showConnectButton();
+});
+
+// Auto-connect will trigger events
+await sdk.autoConnect();
+```
+
 ### Auto-Confirm Methods (Injected Provider Only)
 
 The SDK provides auto-confirm functionality that allows automatic transaction confirmation for specified chains. This feature is only available when using the injected provider (Phantom browser extension).
@@ -748,7 +845,7 @@ import { BrowserSDK, DebugLevel } from "@phantom/browser-sdk";
 
 const sdk = new BrowserSDK({
   providerType: "embedded",
-  // ... other config
+  appId: "your-app-id",
 });
 
 // Store debug messages
@@ -815,10 +912,9 @@ import { BrowserSDK, AddressType } from "@phantom/browser-sdk";
 const sdk = new BrowserSDK({
   providerType: "injected",
   addressTypes: [AddressType.solana],
-  solanaProvider: "web3js",
 });
 
-await sdk.connect();
+await sdk.connect({ provider: "injected" });
 
 // Get recent blockhash
 const connection = new Connection("https://api.mainnet-beta.solana.com");
@@ -869,10 +965,9 @@ import { BrowserSDK, AddressType } from "@phantom/browser-sdk";
 const sdk = new BrowserSDK({
   providerType: "injected",
   addressTypes: [AddressType.solana],
-  solanaProvider: "kit",
 });
 
-await sdk.connect();
+await sdk.connect({ provider: "injected" });
 
 // Create transaction with @solana/kit
 const rpc = createSolanaRpc("https://api.mainnet-beta.solana.com");
@@ -902,7 +997,7 @@ const sdk = new BrowserSDK({
   addressTypes: [AddressType.ethereum],
 });
 
-await sdk.connect();
+await sdk.connect({ provider: "injected" });
 
 // Simple ETH transfer
 const result = await sdk.ethereum.sendTransaction({

package/dist/index.d.ts

@@ -1,7 +1,7 @@
 import { EmbeddedProviderConfig, AuthOptions, ConnectResult, WalletAddress, EmbeddedProviderEvent, EventCallback } from '@phantom/embedded-provider-core';
-export { AuthOptions, ConnectResult, SignAndSendTransactionParams, SignMessageParams, SignMessageResult, SignedTransaction, WalletAddress } from '@phantom/embedded-provider-core';
-import { ISolanaChain, IEthereumChain } from '@phantom/chains';
-export { EthTransactionRequest, IEthereumChain, ISolanaChain } from '@phantom/chains';
+export { AuthOptions, ConnectErrorEventData, ConnectEventData, ConnectResult, ConnectStartEventData, DisconnectEventData, EmbeddedProviderEvent, EmbeddedProviderEventMap, EventCallback, SignAndSendTransactionParams, SignMessageParams, SignMessageResult, SignedTransaction, WalletAddress } from '@phantom/embedded-provider-core';
+import { ISolanaChain, IEthereumChain } from '@phantom/chain-interfaces';
+export { EthTransactionRequest, IEthereumChain, ISolanaChain } from '@phantom/chain-interfaces';
 import { AddressType } from '@phantom/client';
 export { AddressType } from '@phantom/client';
 import { AutoConfirmEnableParams, AutoConfirmResult, AutoConfirmSupportedChainsResult } from '@phantom/browser-injected-sdk/auto-confirm';
@@ -52,18 +52,69 @@ declare const DebugCategory: {
     readonly SESSION: "Session";
 };
 
+/**
+ * Phantom extension app.login API types
+ */
+interface PhantomAppLoginOptions {
+    publicKey: string;
+    appId: string;
+    sessionId: string;
+}
+interface PhantomAppLoginResult {
+    walletId: string;
+    organizationId: string;
+    accountDerivationIndex?: number;
+    expiresInMs?: number;
+    authUserId?: string;
+}
+interface PhantomApp {
+    login(options: PhantomAppLoginOptions): Promise<PhantomAppLoginResult>;
+    features(): Promise<{
+        features: string[];
+    }>;
+    getUser(): Promise<{
+        authUserId?: string;
+    } | undefined>;
+}
+declare global {
+    interface Window {
+        phantom?: {
+            solana?: unknown;
+            ethereum?: unknown;
+            app?: PhantomApp;
+        } | undefined;
+    }
+}
+
+interface InjectedProviderConfig {
+    addressTypes: AddressType[];
+}
+
 interface DebugConfig {
     enabled?: boolean;
     level?: DebugLevel;
     callback?: DebugCallback;
 }
-interface BrowserSDKConfig extends Partial<EmbeddedProviderConfig> {
-    providerType: "injected" | "embedded" | (string & Record<never, never>);
-    addressTypes: [AddressType, ...AddressType[]];
-    apiBaseUrl?: string;
-    appId?: string;
-    embeddedWalletType?: "app-wallet" | "user-wallet" | (string & Record<never, never>);
+type BrowserSDKConfig = Prettify<(ExtendedEmbeddedProviderConfig | ExtendedInjectedProviderConfig) & {
     autoConnect?: boolean;
+}>;
+type Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+interface ExtendedEmbeddedProviderConfig extends Omit<EmbeddedProviderConfig, "authOptions" | "apiBaseUrl" | "embeddedWalletType"> {
+    providerType: "embedded";
+    apiBaseUrl?: string;
+    embeddedWalletType?: "app-wallet" | "user-wallet";
+    authOptions?: {
+        authUrl?: string;
+        redirectUrl?: string;
+    };
+}
+interface ExtendedInjectedProviderConfig extends InjectedProviderConfig {
+    providerType: "injected";
+    appId?: never;
+    authOptions?: never;
+    embeddedWalletType?: never;
 }
 
 interface Provider {
@@ -71,6 +122,7 @@ interface Provider {
     disconnect(): Promise<void>;
     getAddresses(): WalletAddress[];
     isConnected(): boolean;
+    autoConnect(): Promise<void>;
     solana: ISolanaChain;
     ethereum: IEthereumChain;
 }
@@ -79,9 +131,6 @@ interface ProviderPreference {
     type: "injected" | "embedded";
     embeddedWalletType?: "app-wallet" | "user-wallet";
 }
-interface SwitchProviderOptions {
-    embeddedWalletType?: "app-wallet" | "user-wallet" | (string & Record<never, never>);
-}
 
 /**
  * Browser SDK with chain-specific API
@@ -110,15 +159,11 @@ declare class BrowserSDK {
     /**
      * Connect to the wallet
      */
-    connect(options?: AuthOptions): Promise<ConnectResult>;
+    connect(options: AuthOptions): Promise<ConnectResult>;
     /**
      * Disconnect from the wallet
      */
     disconnect(): Promise<void>;
-    /**
-     * Switch between provider types (injected vs embedded)
-     */
-    switchProvider(type: "injected" | "embedded", options?: SwitchProviderOptions): Promise<void>;
     /**
      * Check if the SDK is connected to a wallet
      */
@@ -131,10 +176,6 @@ declare class BrowserSDK {
      * Get information about the current provider
      */
     getCurrentProviderInfo(): ProviderPreference | null;
-    /**
-     * Get the wallet ID (for embedded wallets)
-     */
-    getWalletId(): string | null;
     /**
      * Check if Phantom extension is installed
      */
@@ -152,7 +193,7 @@ declare class BrowserSDK {
     /**
      * Attempt auto-connection using existing session
      * Should be called after setting up event listeners
-     * Only works with embedded providers
+     * Tries embedded provider first, then injected provider as fallback
      */
     autoConnect(): Promise<void>;
     /**
@@ -205,18 +246,13 @@ declare class BrowserSDK {
     getSupportedAutoConfirmChains(): Promise<AutoConfirmSupportedChainsResult>;
 }
 
-/**
- * Constants used throughout the browser SDK
- */
-declare const DEFAULT_AUTH_URL = "https://connect.phantom.app";
-declare const DEFAULT_WALLET_API_URL = "https://api.phantom.app/v1/wallets";
-
 /**
  * Browser detection utility to identify browser name and version
  */
 interface BrowserInfo {
     name: string;
     version: string;
+    userAgent: string;
 }
 /**
  * Parse browser information from a user agent string
@@ -237,6 +273,18 @@ declare function getPlatformName(): string;
  * Format: "Chrome 120.0" or "Firefox 119.0"
  */
 declare function getBrowserDisplayName(): string;
+/**
+ * Detect if the current device is a mobile device
+ * Checks user agent for mobile indicators and screen size
+ */
+declare function isMobileDevice(): boolean;
+
+/**
+ * Generates a deeplink URL to open the current page in Phantom mobile app
+ * @param ref Optional referrer parameter
+ * @returns Phantom mobile app deeplink URL
+ */
+declare function getDeeplinkToPhantom(ref?: string): string;
 
 /**
  * Wait for Phantom extension to be available with retry logic
@@ -256,4 +304,26 @@ declare function getBrowserDisplayName(): string;
  */
 declare function waitForPhantomExtension(timeoutMs?: number): Promise<boolean>;
 
-export { BrowserInfo, BrowserSDK, BrowserSDKConfig, DEFAULT_AUTH_URL, DEFAULT_WALLET_API_URL, DebugCallback, DebugCategory, DebugConfig, DebugLevel, DebugMessage, Provider, debug, detectBrowser, getBrowserDisplayName, getPlatformName, parseBrowserFromUserAgent, waitForPhantomExtension };
+/**
+ * Check if Phantom Login is available
+ *
+ * This function checks if:
+ * 1. The Phantom extension is installed
+ * 2. The extension supports the phantom_login feature
+ *
+ * @param timeoutMs - Maximum time to wait for extension in milliseconds (default: 3000)
+ * @returns Promise<boolean> - true if Phantom Login is available, false otherwise
+ *
+ * Usage:
+ * ```typescript
+ * const isAvailable = await isPhantomLoginAvailable();
+ * if (isAvailable) {
+ *   console.log("Phantom Login is available!");
+ * } else {
+ *   console.log("Phantom Login is not available");
+ * }
+ * ```
+ */
+declare function isPhantomLoginAvailable(timeoutMs?: number): Promise<boolean>;
+
+export { BrowserInfo, BrowserSDK, BrowserSDKConfig, DebugCallback, DebugCategory, DebugConfig, DebugLevel, DebugMessage, Provider, debug, detectBrowser, getBrowserDisplayName, getDeeplinkToPhantom, getPlatformName, isMobileDevice, isPhantomLoginAvailable, parseBrowserFromUserAgent, waitForPhantomExtension };