vanilla-agent 1.21.0 → 1.23.0

package/src/index.ts

@@ -32,7 +32,16 @@ export type {
   // Markdown types
   AgentWidgetMarkdownConfig,
   AgentWidgetMarkdownOptions,
-  AgentWidgetMarkdownRendererOverrides
+  AgentWidgetMarkdownRendererOverrides,
+  // Message actions types
+  AgentWidgetMessageActionsConfig,
+  AgentWidgetMessageFeedback,
+  // Client token types
+  ClientSession,
+  ClientInitResponse,
+  ClientChatRequest,
+  ClientFeedbackRequest,
+  ClientFeedbackType
 } from "./types";
 
 export { initAgentWidgetFn as initAgentWidget };
@@ -67,6 +76,11 @@ export {
   createRegexJsonParser,
   createXmlParser
 } from "./utils/formatting";
+export {
+  generateMessageId,
+  generateUserMessageId,
+  generateAssistantMessageId
+} from "./utils/message-id";
 export { generateCodeSnippet } from "./utils/code-generators";
 export type { CodeFormat } from "./utils/code-generators";
 export type { AgentWidgetInitHandle };
@@ -120,8 +134,14 @@ export type {
 export {
   createStandardBubble,
   createBubbleWithLayout,
-  createTypingIndicator
+  createTypingIndicator,
+  createMessageActions
 } from "./components/message-bubble";
-export type { MessageTransform } from "./components/message-bubble";
+export type { MessageTransform, MessageActionCallbacks } from "./components/message-bubble";
+export {
+  createCSATFeedback,
+  createNPSFeedback
+} from "./components/feedback";
+export type { CSATFeedbackOptions, NPSFeedbackOptions } from "./components/feedback";
 
 export default initAgentWidgetFn;

package/src/install.ts

@@ -12,6 +12,10 @@ interface SiteAgentInstallConfig {
   target?: string | HTMLElement;
   config?: any;
   autoInit?: boolean;
+  // Client token mode options (can also be set via data attributes)
+  clientToken?: string;
+  flowId?: string;
+  apiUrl?: string;
 }
 
 declare global {
@@ -30,7 +34,45 @@ declare global {
   }
   (window as any).__siteAgentInstallerLoaded = true;
 
-  const config: SiteAgentInstallConfig = window.siteAgentConfig || {};
+  /**
+   * Read configuration from data attributes on the current script tag.
+   * Supports: data-travrse-token, data-flow-id, data-api-url
+   */
+  const getConfigFromScript = (): Partial<SiteAgentInstallConfig> => {
+    // Try to get the current script element
+    const script = document.currentScript as HTMLScriptElement | null;
+    if (!script) return {};
+
+    const scriptConfig: Partial<SiteAgentInstallConfig> = {};
+
+    // Client token from data attribute (primary method for client token mode)
+    const token = script.getAttribute('data-travrse-token');
+    if (token) {
+      scriptConfig.clientToken = token;
+    }
+
+    // Optional flow ID
+    const flowId = script.getAttribute('data-flow-id');
+    if (flowId) {
+      scriptConfig.flowId = flowId;
+    }
+
+    // Optional API URL override
+    const apiUrl = script.getAttribute('data-api-url');
+    if (apiUrl) {
+      scriptConfig.apiUrl = apiUrl;
+    }
+
+    return scriptConfig;
+  };
+
+  // Get config from script attributes (must be called synchronously during script execution)
+  const scriptConfig = getConfigFromScript();
+
+  // Merge script attributes with window config (script attributes take precedence)
+  const windowConfig: SiteAgentInstallConfig = window.siteAgentConfig || {};
+  const config: SiteAgentInstallConfig = { ...windowConfig, ...scriptConfig };
+  
   const version = config.version || "latest";
   const cdn = config.cdn || "jsdelivr";
   const autoInit = config.autoInit !== false; // Default to true
@@ -113,14 +155,27 @@ declare global {
     }
 
     const target = config.target || "body";
-    // Merge apiUrl from top-level config into widget config if present
+    // Merge top-level config options into widget config
     const widgetConfig = { ...config.config };
-    if ((config as any).apiUrl && !widgetConfig.apiUrl) {
-      widgetConfig.apiUrl = (config as any).apiUrl;
+    
+    // Merge apiUrl from top-level config into widget config if present
+    if (config.apiUrl && !widgetConfig.apiUrl) {
+      widgetConfig.apiUrl = config.apiUrl;
+    }
+    
+    // Merge clientToken from top-level config into widget config if present
+    if (config.clientToken && !widgetConfig.clientToken) {
+      widgetConfig.clientToken = config.clientToken;
+    }
+    
+    // Merge flowId from top-level config into widget config if present
+    if (config.flowId && !widgetConfig.flowId) {
+      widgetConfig.flowId = config.flowId;
     }
 
-    // Only initialize if config is provided
-    if (!widgetConfig.apiUrl && Object.keys(widgetConfig).length === 0) {
+    // Only initialize if we have either apiUrl OR clientToken (or other config)
+    const hasApiConfig = widgetConfig.apiUrl || widgetConfig.clientToken;
+    if (!hasApiConfig && Object.keys(widgetConfig).length === 0) {
       return;
     }
 
@@ -140,7 +195,14 @@ declare global {
       await loadCSS();
       await loadJS();
       
-      if (autoInit && (config.config || (config as any).apiUrl)) {
+      // Auto-init if we have config OR apiUrl OR clientToken
+      const shouldAutoInit = autoInit && (
+        config.config || 
+        config.apiUrl || 
+        config.clientToken
+      );
+      
+      if (shouldAutoInit) {
         // Wait a tick to ensure AgentWidget is fully initialized
         setTimeout(initWidget, 0);
       }

package/src/session.ts

@@ -2,8 +2,13 @@ import { AgentWidgetClient } from "./client";
 import {
   AgentWidgetConfig,
   AgentWidgetEvent,
-  AgentWidgetMessage
+  AgentWidgetMessage,
+  ClientSession
 } from "./types";
+import {
+  generateUserMessageId,
+  generateAssistantMessageId
+} from "./utils/message-id";
 
 export type AgentWidgetSessionStatus =
   | "idle"
@@ -25,6 +30,9 @@ export class AgentWidgetSession {
   private streaming = false;
   private abortController: AbortController | null = null;
   private sequenceCounter = Date.now();
+  
+  // Client token session management
+  private clientSession: ClientSession | null = null;
 
   constructor(
     private config: AgentWidgetConfig = {},
@@ -43,6 +51,121 @@ export class AgentWidgetSession {
     this.callbacks.onStatusChanged(this.status);
   }
 
+  /**
+   * Check if running in client token mode
+   */
+  public isClientTokenMode(): boolean {
+    return this.client.isClientTokenMode();
+  }
+
+  /**
+   * Initialize the client session (for client token mode).
+   * This is called automatically on first message, but can be called
+   * explicitly to pre-initialize the session and get config from server.
+   */
+  public async initClientSession(): Promise<ClientSession | null> {
+    if (!this.isClientTokenMode()) {
+      return null;
+    }
+    
+    try {
+      const session = await this.client.initSession();
+      this.setClientSession(session);
+      return session;
+    } catch (error) {
+      this.callbacks.onError?.(
+        error instanceof Error ? error : new Error(String(error))
+      );
+      return null;
+    }
+  }
+
+  /**
+   * Set the client session after initialization
+   */
+  public setClientSession(session: ClientSession): void {
+    this.clientSession = session;
+    
+    // Optionally add welcome message from session config
+    if (session.config.welcomeMessage && this.messages.length === 0) {
+      const welcomeMessage: AgentWidgetMessage = {
+        id: `welcome-${Date.now()}`,
+        role: "assistant",
+        content: session.config.welcomeMessage,
+        createdAt: new Date().toISOString(),
+        sequence: this.nextSequence()
+      };
+      this.appendMessage(welcomeMessage);
+    }
+  }
+
+  /**
+   * Get current client session
+   */
+  public getClientSession(): ClientSession | null {
+    return this.clientSession ?? this.client.getClientSession();
+  }
+
+  /**
+   * Check if session is valid and not expired
+   */
+  public isSessionValid(): boolean {
+    const session = this.getClientSession();
+    if (!session) return false;
+    return new Date() < session.expiresAt;
+  }
+
+  /**
+   * Clear session (on expiry or error)
+   */
+  public clearClientSession(): void {
+    this.clientSession = null;
+    this.client.clearClientSession();
+  }
+
+  /**
+   * Get the underlying client instance (for advanced use cases like feedback)
+   */
+  public getClient(): AgentWidgetClient {
+    return this.client;
+  }
+
+  /**
+   * Submit message feedback (upvote, downvote, or copy) to the API.
+   * Only available in client token mode.
+   * 
+   * @param messageId - The ID of the message to provide feedback for
+   * @param type - The feedback type: 'upvote', 'downvote', or 'copy'
+   */
+  public async submitMessageFeedback(
+    messageId: string,
+    type: 'upvote' | 'downvote' | 'copy'
+  ): Promise<void> {
+    return this.client.submitMessageFeedback(messageId, type);
+  }
+
+  /**
+   * Submit CSAT (Customer Satisfaction) feedback to the API.
+   * Only available in client token mode.
+   * 
+   * @param rating - Rating from 1 to 5
+   * @param comment - Optional comment
+   */
+  public async submitCSATFeedback(rating: number, comment?: string): Promise<void> {
+    return this.client.submitCSATFeedback(rating, comment);
+  }
+
+  /**
+   * Submit NPS (Net Promoter Score) feedback to the API.
+   * Only available in client token mode.
+   * 
+   * @param rating - Rating from 0 to 10
+   * @param comment - Optional comment
+   */
+  public async submitNPSFeedback(rating: number, comment?: string): Promise<void> {
+    return this.client.submitNPSFeedback(rating, comment);
+  }
+
   public updateConfig(next: AgentWidgetConfig) {
     this.config = { ...this.config, ...next };
     this.client = new AgentWidgetClient(this.config);
@@ -70,8 +193,12 @@ export class AgentWidgetSession {
 
     this.abortController?.abort();
 
+    // Generate IDs for both user message and expected assistant response
+    const userMessageId = generateUserMessageId();
+    const assistantMessageId = generateAssistantMessageId();
+
     const userMessage: AgentWidgetMessage = {
-      id: `user-${Date.now()}`,
+      id: userMessageId,
       role: "user",
       content: input,
       createdAt: new Date().toISOString(),
@@ -91,13 +218,14 @@ export class AgentWidgetSession {
       await this.client.dispatch(
         {
           messages: snapshot,
-          signal: controller.signal
+          signal: controller.signal,
+          assistantMessageId // Pass expected assistant message ID for tracking
         },
         this.handleEvent
       );
     } catch (error) {
       const fallback: AgentWidgetMessage = {
-        id: `assistant-${Date.now()}`,
+        id: assistantMessageId, // Use the pre-generated ID for fallback too
         role: "assistant",
         createdAt: new Date().toISOString(),
         content: