playkit-sdk 1.1.0-beta-pr → 1.1.2-beta

package/dist/playkit-sdk.cjs.js

@@ -1,5 +1,5 @@
 /**
- * playkit-sdk v1.1.0-beta-pr
+ * playkit-sdk v1.1.2-beta
  * PlayKit SDK for JavaScript
  * @license SEE LICENSE IN LICENSE
  */
@@ -300,7 +300,7 @@ const translations$1 = {
     },
 };
 class AuthFlowManager extends EventEmitter {
-    constructor(baseURL = 'https://playkit.agentlandlab.com') {
+    constructor(baseURL) {
         super();
         this.currentSessionId = null;
         this.uiContainer = null;
@@ -311,7 +311,8 @@ class AuthFlowManager extends EventEmitter {
         this.identifierPanel = null;
         this.verificationPanel = null;
         this.loadingOverlay = null;
-        this.baseURL = baseURL;
+        // @ts-ignore - replaced at build time
+        this.baseURL = baseURL || "https://playkit.agentlandlab.com";
         this.currentLanguage = this.detectLanguage();
     }
     /**
@@ -1056,16 +1057,250 @@ class AuthFlowManager extends EventEmitter {
     }
 }
 
+/**
+ * External Authentication Flow Manager
+ * Manages OAuth-like popup authentication flow for external_auth channel
+ */
+class ExternalAuthFlowManager extends EventEmitter {
+    constructor(baseURL, gameId) {
+        super();
+        this.baseURL = baseURL;
+        this.gameId = gameId;
+    }
+    /**
+     * Generate a random string for PKCE code verifier
+     * @private
+     */
+    generateCodeVerifier() {
+        const array = new Uint8Array(32);
+        crypto.getRandomValues(array);
+        return this.base64URLEncode(array);
+    }
+    /**
+     * Generate PKCE code challenge from verifier
+     * @private
+     */
+    async generateCodeChallenge(verifier) {
+        const encoder = new TextEncoder();
+        const data = encoder.encode(verifier);
+        const hash = await crypto.subtle.digest('SHA-256', data);
+        return this.base64URLEncode(new Uint8Array(hash));
+    }
+    /**
+     * Base64 URL encode
+     * @private
+     */
+    base64URLEncode(buffer) {
+        const base64 = btoa(String.fromCharCode(...buffer));
+        return base64.replace(/\+/g, '-').replace(/\//g, '_').replace(/=/g, '');
+    }
+    /**
+     * Generate a random state for CSRF protection
+     * @private
+     */
+    generateState() {
+        const array = new Uint8Array(16);
+        crypto.getRandomValues(array);
+        return this.base64URLEncode(array);
+    }
+    /**
+     * Start the external authentication flow
+     * Shows an iframe modal for user to login and authorize
+     *
+     * @returns {Promise<string>} Player token
+     */
+    async startFlow() {
+        return new Promise(async (resolve, reject) => {
+            // Generate PKCE parameters
+            const codeVerifier = this.generateCodeVerifier();
+            const codeChallenge = await this.generateCodeChallenge(codeVerifier);
+            const state = this.generateState();
+            // Build authorization URL with postmessage redirect
+            const redirectUri = 'postmessage';
+            const params = new URLSearchParams({
+                response_type: 'code',
+                game_id: this.gameId,
+                redirect_uri: redirectUri,
+                code_challenge: codeChallenge,
+                code_challenge_method: 'S256',
+                state: state,
+            });
+            const authUrl = `${this.baseURL}/external-auth/authorize?${params}`;
+            // Create iframe modal
+            this.createAuthModal(authUrl);
+            // Listen for messages from iframe
+            const messageHandler = async (event) => {
+                // Verify origin
+                const allowedOrigin = new URL(this.baseURL).origin;
+                if (event.origin !== allowedOrigin) {
+                    return;
+                }
+                // Check message type
+                if (event.data.type !== 'external_auth_callback') {
+                    return;
+                }
+                // Cleanup
+                window.removeEventListener('message', messageHandler);
+                this.destroyAuthModal();
+                try {
+                    // Extract data from message
+                    const { code, state: returnedState, error, error_description } = event.data;
+                    // Check for errors
+                    if (error) {
+                        reject(new PlayKitError(error_description || error, 'AUTH_ERROR'));
+                        return;
+                    }
+                    // Verify state
+                    if (returnedState !== state) {
+                        reject(new PlayKitError('State mismatch - possible CSRF attack', 'STATE_MISMATCH'));
+                        return;
+                    }
+                    if (!code) {
+                        reject(new PlayKitError('No authorization code received', 'NO_CODE'));
+                        return;
+                    }
+                    // Exchange code for token
+                    const token = await this.exchangeCodeForToken(code, codeVerifier, redirectUri);
+                    resolve(token);
+                }
+                catch (err) {
+                    reject(err);
+                }
+            };
+            window.addEventListener('message', messageHandler);
+        });
+    }
+    /**
+     * Create authentication modal with iframe
+     * @private
+     */
+    createAuthModal(authUrl) {
+        // Create modal container
+        const modal = document.createElement('div');
+        modal.id = 'playkit-external-auth-modal';
+        modal.style.cssText = `
+      position: fixed;
+      top: 0;
+      left: 0;
+      right: 0;
+      bottom: 0;
+      z-index: 999999;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      background: rgba(0, 0, 0, 0.5);
+      backdrop-filter: blur(4px);
+    `;
+        // Create close button
+        const closeButton = document.createElement('button');
+        closeButton.innerHTML = '×';
+        closeButton.style.cssText = `
+      position: absolute;
+      top: 20px;
+      right: 20px;
+      width: 40px;
+      height: 40px;
+      border: none;
+      background: rgba(255, 255, 255, 0.9);
+      color: #333;
+      font-size: 32px;
+      line-height: 32px;
+      cursor: pointer;
+      border-radius: 50%;
+      z-index: 1000000;
+      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
+      transition: background 0.2s;
+    `;
+        closeButton.onmouseover = () => {
+            closeButton.style.background = 'rgba(255, 255, 255, 1)';
+        };
+        closeButton.onmouseout = () => {
+            closeButton.style.background = 'rgba(255, 255, 255, 0.9)';
+        };
+        closeButton.onclick = () => {
+            this.destroyAuthModal();
+        };
+        // Create iframe container
+        const iframeContainer = document.createElement('div');
+        iframeContainer.style.cssText = `
+      position: relative;
+      width: 90%;
+      max-width: 480px;
+      height: 90%;
+      max-height: 700px;
+      background: white;
+      border-radius: 8px;
+      overflow: hidden;
+      box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
+    `;
+        // Create iframe
+        const iframe = document.createElement('iframe');
+        iframe.src = authUrl;
+        iframe.style.cssText = `
+      width: 100%;
+      height: 100%;
+      border: none;
+    `;
+        iframe.allow = 'clipboard-write';
+        iframeContainer.appendChild(iframe);
+        modal.appendChild(closeButton);
+        modal.appendChild(iframeContainer);
+        document.body.appendChild(modal);
+    }
+    /**
+     * Destroy authentication modal
+     * @private
+     */
+    destroyAuthModal() {
+        const modal = document.getElementById('playkit-external-auth-modal');
+        if (modal) {
+            modal.remove();
+        }
+    }
+    /**
+     * Exchange authorization code for access token
+     * @private
+     */
+    async exchangeCodeForToken(code, codeVerifier, redirectUri) {
+        const response = await fetch(`${this.baseURL}/api/external-auth/token`, {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json',
+            },
+            body: JSON.stringify({
+                grant_type: 'authorization_code',
+                code: code,
+                code_verifier: codeVerifier,
+                redirect_uri: redirectUri,
+            }),
+        });
+        if (!response.ok) {
+            const error = await response.json().catch(() => ({ error_description: 'Token exchange failed' }));
+            throw new PlayKitError(error.error_description || 'Token exchange failed', 'TOKEN_EXCHANGE_FAILED', response.status);
+        }
+        const data = await response.json();
+        return data.access_token;
+    }
+    /**
+     * Clean up
+     */
+    destroy() {
+        this.removeAllListeners();
+    }
+}
+
 /**
  * Authentication manager
  * Handles JWT exchange and token management
  */
-const DEFAULT_BASE_URL$3 = 'https://playkit.agentlandlab.com';
+// @ts-ignore - replaced at build time
+const DEFAULT_BASE_URL$3 = "https://playkit.agentlandlab.com";
 const JWT_EXCHANGE_ENDPOINT = '/api/external/exchange-jwt';
 class AuthManager extends EventEmitter {
     constructor(config) {
         super();
         this.authFlowManager = null;
+        this.externalAuthFlowManager = null;
         this.config = config;
         this.storage = new TokenStorage();
         this.baseURL = config.baseURL || DEFAULT_BASE_URL$3;
@@ -1119,7 +1354,9 @@ class AuthManager extends EventEmitter {
         this.emit('unauthenticated');
         // Auto-start login flow in browser environment
         if (typeof window !== 'undefined') {
-            await this.startAuthFlow();
+            // Default to external-auth if not specified
+            const useExternalAuth = this.config.authMethod !== 'headless';
+            await this.startAuthFlow(useExternalAuth);
             // If we reach here, authentication was successful
             // If it failed, startAuthFlow() will have thrown an error
         }
@@ -1130,27 +1367,53 @@ class AuthManager extends EventEmitter {
     }
     /**
      * Start the authentication flow UI
+     *
+     * @param useExternalAuth - Use external-auth OAuth flow instead of headless flow
      */
-    async startAuthFlow() {
-        var _a;
-        if (this.authFlowManager) {
+    async startAuthFlow(useExternalAuth = false) {
+        var _a, _b;
+        if (this.authFlowManager || this.externalAuthFlowManager) {
             // Already in progress
             return;
         }
         try {
-            this.authFlowManager = new AuthFlowManager(this.baseURL);
-            // Get global token from auth flow
-            const globalToken = await this.authFlowManager.startFlow();
-            // Exchange for player token
-            await this.exchangeJWT(globalToken);
-            // Clean up
-            this.authFlowManager.destroy();
-            this.authFlowManager = null;
+            if (useExternalAuth) {
+                // Use external-auth OAuth popup flow
+                this.externalAuthFlowManager = new ExternalAuthFlowManager(this.baseURL, this.config.gameId);
+                // Get player token directly from external-auth flow
+                const playerToken = await this.externalAuthFlowManager.startFlow();
+                // Update auth state with the player token
+                this.authState = {
+                    isAuthenticated: true,
+                    token: playerToken,
+                    tokenType: 'player',
+                };
+                // Save to storage
+                await this.storage.saveAuthState(this.config.gameId, this.authState);
+                await this.storage.saveSharedToken(playerToken);
+                this.emit('authenticated', this.authState);
+                // Clean up
+                this.externalAuthFlowManager.destroy();
+                this.externalAuthFlowManager = null;
+            }
+            else {
+                // Use headless verification code flow
+                this.authFlowManager = new AuthFlowManager(this.baseURL);
+                // Get global token from auth flow
+                const globalToken = await this.authFlowManager.startFlow();
+                // Exchange for player token
+                await this.exchangeJWT(globalToken);
+                // Clean up
+                this.authFlowManager.destroy();
+                this.authFlowManager = null;
+            }
         }
         catch (error) {
             // User canceled or error occurred
             (_a = this.authFlowManager) === null || _a === void 0 ? void 0 : _a.destroy();
             this.authFlowManager = null;
+            (_b = this.externalAuthFlowManager) === null || _b === void 0 ? void 0 : _b.destroy();
+            this.externalAuthFlowManager = null;
             // Re-emit error
             this.emit('error', error);
             throw error;
@@ -2791,8 +3054,10 @@ class PlayKitSDK extends EventEmitter {
     }
 }
 
+exports.AuthFlowManager = AuthFlowManager;
 exports.AuthManager = AuthManager;
 exports.ChatClient = ChatClient;
+exports.ExternalAuthFlowManager = ExternalAuthFlowManager;
 exports.ImageClient = ImageClient;
 exports.NPCClient = NPCClient;
 exports.PlayKitSDK = PlayKitSDK;