@a.izzuddin/ai-chat 0.2.9 → 0.2.11

package/custom-elements.json

@@ -69,7 +69,18 @@
     {
       "kind": "javascript-module",
       "path": "dist/index.js",
-      "declarations": [],
+      "declarations": [
+        {
+          "kind": "variable",
+          "name": "suggestedQuestions",
+          "default": "void 0"
+        },
+        {
+          "kind": "variable",
+          "name": "faqs",
+          "default": "void 0"
+        }
+      ],
       "exports": []
     },
     {
@@ -515,34 +526,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "src/components/AIChat.tsx",
-      "declarations": [
-        {
-          "kind": "function",
-          "name": "AIChat",
-          "parameters": [
-            {
-              "name": "{\n  apiUrl,\n  sessionId = \"default-session\",\n  title = \"My AI Agent\",\n  initialMessages = [],\n  className,\n  onMessageSent,\n  onResponseReceived,\n  onError,\n}",
-              "type": {
-                "text": "AIChatProps"
-              }
-            }
-          ]
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "AIChat",
-          "declaration": {
-            "name": "AIChat",
-            "module": "src/components/AIChat.tsx"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "src/components/ai-chat.ts",
@@ -723,6 +706,16 @@
               "default": "''",
               "attribute": "welcome-subtitle"
             },
+            {
+              "kind": "field",
+              "name": "initialQuestionsUrl",
+              "privacy": "public",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "attribute": "initial-questions-url"
+            },
             {
               "kind": "field",
               "name": "messages",
@@ -1067,6 +1060,14 @@
               },
               "default": "''",
               "fieldName": "welcomeSubtitle"
+            },
+            {
+              "name": "initial-questions-url",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "fieldName": "initialQuestionsUrl"
             }
           ],
           "superclass": {
@@ -1095,6 +1096,34 @@
           }
         }
       ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/components/AIChat.tsx",
+      "declarations": [
+        {
+          "kind": "function",
+          "name": "AIChat",
+          "parameters": [
+            {
+              "name": "{\r\n  apiUrl,\r\n  sessionId = \"default-session\",\r\n  title = \"My AI Agent\",\r\n  initialMessages = [],\r\n  className,\r\n  onMessageSent,\r\n  onResponseReceived,\r\n  onError,\r\n}",
+              "type": {
+                "text": "AIChatProps"
+              }
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "AIChat",
+          "declaration": {
+            "name": "AIChat",
+            "module": "src/components/AIChat.tsx"
+          }
+        }
+      ]
     }
   ]
 }

package/dist/index.d.mts

@@ -2,11 +2,15 @@ import * as lit_html from 'lit-html';
 import * as lit from 'lit';
 import { LitElement, PropertyValues } from 'lit';
 
+interface FAQ {
+    No: string;
+    Question: string;
+}
 interface Message {
     id: string;
     role: 'user' | 'assistant';
     content: string;
-    faqs?: any[];
+    faqs?: FAQ[];
     suggestedQuestions?: string[];
 }
 /**
@@ -66,6 +70,7 @@ declare class AIChat extends LitElement {
     botMessageBg: string;
     welcomeMessage: string;
     welcomeSubtitle: string;
+    initialQuestionsUrl: string;
     private messages;
     private input;
     private isLoading;
@@ -137,6 +142,10 @@ declare class AIChat extends LitElement {
             type: StringConstructor;
             attribute: string;
         };
+        initialQuestionsUrl: {
+            type: StringConstructor;
+            attribute: string;
+        };
     };
     constructor();
     private toggleWidget;
@@ -151,7 +160,7 @@ declare class AIChat extends LitElement {
     private loadMessagesFromStorage;
     private clearMessagesFromStorage;
     private formatMessageContent;
-    connectedCallback(): void;
+    connectedCallback(): Promise<void>;
     updated(changedProperties: PropertyValues): void;
     private scrollToBottom;
     private handleInput;

package/dist/index.d.ts

@@ -2,11 +2,15 @@ import * as lit_html from 'lit-html';
 import * as lit from 'lit';
 import { LitElement, PropertyValues } from 'lit';
 
+interface FAQ {
+    No: string;
+    Question: string;
+}
 interface Message {
     id: string;
     role: 'user' | 'assistant';
     content: string;
-    faqs?: any[];
+    faqs?: FAQ[];
     suggestedQuestions?: string[];
 }
 /**
@@ -66,6 +70,7 @@ declare class AIChat extends LitElement {
     botMessageBg: string;
     welcomeMessage: string;
     welcomeSubtitle: string;
+    initialQuestionsUrl: string;
     private messages;
     private input;
     private isLoading;
@@ -137,6 +142,10 @@ declare class AIChat extends LitElement {
             type: StringConstructor;
             attribute: string;
         };
+        initialQuestionsUrl: {
+            type: StringConstructor;
+            attribute: string;
+        };
     };
     constructor();
     private toggleWidget;
@@ -151,7 +160,7 @@ declare class AIChat extends LitElement {
     private loadMessagesFromStorage;
     private clearMessagesFromStorage;
     private formatMessageContent;
-    connectedCallback(): void;
+    connectedCallback(): Promise<void>;
     updated(changedProperties: PropertyValues): void;
     private scrollToBottom;
     private handleInput;

package/dist/index.js

@@ -16,7 +16,7 @@ var __decorateClass = (decorators, target, key, kind) => {
   if (kind && result) __defProp(target, key, result);
   return result;
 };
-var VERSION = "0.2.8";
+var VERSION = "0.2.11";
 exports.AIChat = class AIChat extends lit.LitElement {
   constructor() {
     super();
@@ -37,6 +37,7 @@ exports.AIChat = class AIChat extends lit.LitElement {
     this.botMessageBg = "#F5F5F5";
     this.welcomeMessage = "How can I help you today?";
     this.welcomeSubtitle = "";
+    this.initialQuestionsUrl = "";
     this.messages = [];
     this.input = "";
     this.isLoading = false;
@@ -80,29 +81,38 @@ ${this.welcomeSubtitle}` : this.welcomeMessage;
   saveMessagesToStorage() {
     try {
       const storageKey = this.getStorageKey();
-      localStorage.setItem(storageKey, JSON.stringify(this.messages));
+      sessionStorage.setItem(storageKey, JSON.stringify(this.messages));
+      sessionStorage.setItem("ai-chat-last-session-id", this.sessionId);
     } catch (error) {
-      console.warn("Failed to save messages to localStorage:", error);
+      console.warn("Failed to save messages to sessionStorage:", error);
     }
   }
   loadMessagesFromStorage() {
     try {
+      const lastSessionId = sessionStorage.getItem("ai-chat-last-session-id");
+      if (lastSessionId && lastSessionId !== this.sessionId) {
+        console.log(`\u{1F504} Session changed from "${lastSessionId}" to "${this.sessionId}", clearing old messages`);
+        const oldStorageKey = `ai-chat-messages-${lastSessionId}`;
+        sessionStorage.removeItem(oldStorageKey);
+        sessionStorage.setItem("ai-chat-last-session-id", this.sessionId);
+        return null;
+      }
       const storageKey = this.getStorageKey();
-      const saved = localStorage.getItem(storageKey);
+      const saved = sessionStorage.getItem(storageKey);
       if (saved) {
         return JSON.parse(saved);
       }
     } catch (error) {
-      console.warn("Failed to load messages from localStorage:", error);
+      console.warn("Failed to load messages from sessionStorage:", error);
     }
     return null;
   }
   clearMessagesFromStorage() {
     try {
       const storageKey = this.getStorageKey();
-      localStorage.removeItem(storageKey);
+      sessionStorage.removeItem(storageKey);
     } catch (error) {
-      console.warn("Failed to clear messages from localStorage:", error);
+      console.warn("Failed to clear messages from sessionStorage:", error);
     }
   }
   formatMessageContent(content) {
@@ -111,7 +121,7 @@ ${this.welcomeSubtitle}` : this.welcomeMessage;
       div.textContent = text;
       return div.innerHTML;
     };
-    let processedContent = content.replace(/([:\w])\s*(\d+\.\s+)/g, "$1\n$2");
+    let processedContent = content.replace(/([^\n])\s*(\d+\.\s+)/g, "$1\n$2");
     processedContent = processedContent.replace(/(\d+\.\s+[^0-9]+?)(?=\s+\d+\.\s+|\s*$)/g, "$1\n");
     processedContent = processedContent.replace(/(-\s+[^-]+?)(?=\s+-\s+|\s*$)/g, "$1\n");
     const lines = processedContent.split("\n");
@@ -186,22 +196,46 @@ ${this.welcomeSubtitle}` : this.welcomeMessage;
     }
     return formattedContent;
   }
-  connectedCallback() {
+  async connectedCallback() {
     super.connectedCallback();
     const savedMessages = this.loadMessagesFromStorage();
     if (this.initialMessages && this.initialMessages.length > 0) {
       this.messages = [...this.initialMessages];
     } else if (savedMessages && savedMessages.length > 0) {
       this.messages = savedMessages;
-    } else if (this.welcomeMessage) {
-      const welcomeText = this.welcomeSubtitle ? `${this.welcomeMessage}
+    } else {
+      let suggestedQuestions = void 0;
+      if (this.initialQuestionsUrl) {
+        try {
+          const response = await fetch(this.initialQuestionsUrl);
+          if (response.ok) {
+            const data = await response.json();
+            console.log("\u{1F4E5} Fetched initial questions:", data);
+            let questionsArray = data.questions || data.suggested_questions || data;
+            if (Array.isArray(questionsArray) && questionsArray.length > 0) {
+              if (typeof questionsArray[0] === "object" && questionsArray[0].question_text) {
+                suggestedQuestions = questionsArray.map((q) => q.question_text);
+              } else if (typeof questionsArray[0] === "string") {
+                suggestedQuestions = questionsArray;
+              }
+            }
+            console.log("\u2705 Processed suggested questions:", suggestedQuestions);
+          }
+        } catch (error) {
+          console.warn("Failed to fetch initial questions:", error);
+        }
+      }
+      if (this.welcomeMessage) {
+        const welcomeText = this.welcomeSubtitle ? `${this.welcomeMessage}
 
 ${this.welcomeSubtitle}` : this.welcomeMessage;
-      this.messages = [{
-        id: "welcome-" + Date.now(),
-        role: "assistant",
-        content: welcomeText
-      }];
+        this.messages = [{
+          id: "welcome-" + Date.now(),
+          role: "assistant",
+          content: welcomeText,
+          suggestedQuestions
+        }];
+      }
     }
   }
   updated(changedProperties) {
@@ -262,6 +296,7 @@ ${this.welcomeSubtitle}` : this.welcomeMessage;
       const data = await response.json();
       console.log("\u{1F50D} Raw API response:", data);
       let responseText = "No response from agent";
+      let faqs = void 0;
       let suggestedQuestions = void 0;
       if (data && typeof data === "object" && data.response && typeof data.response === "string") {
         console.log("\u{1F4DD} data.response type:", typeof data.response);
@@ -274,11 +309,14 @@ ${this.welcomeSubtitle}` : this.welcomeMessage;
             console.log("\u2705 Parsed inner data with JSON.parse");
             if (innerData && innerData.response && typeof innerData.response === "string") {
               responseText = innerData.response;
+              faqs = innerData.faq_used || innerData.faqs_used || void 0;
               suggestedQuestions = innerData.suggested_follow_ups || innerData.suggested_questions || void 0;
               console.log("\u2705 Extracted text length:", responseText.length);
+              console.log("\u2705 Extracted FAQs count:", faqs?.length || 0);
               console.log("\u2705 Extracted suggested questions count:", suggestedQuestions?.length || 0);
             } else {
               responseText = data.response;
+              faqs = data.faq_used || data.faqs_used || void 0;
               suggestedQuestions = data.suggested_follow_ups || data.suggested_questions || void 0;
             }
           } catch (parseError) {
@@ -292,6 +330,26 @@ ${this.welcomeSubtitle}` : this.welcomeMessage;
               console.error("\u274C Could not extract response");
               responseText = "Error: Could not parse response";
             }
+            const faqsPattern = /"(?:faq_used|faqs_used)"\s*:\s*(\[[^\]]*\])/s;
+            const faqsMatch = data.response.match(faqsPattern);
+            if (faqsMatch) {
+              try {
+                faqs = JSON.parse(faqsMatch[1]);
+                console.log("\u2705 Extracted FAQs, count:", faqs?.length || 0);
+              } catch {
+                console.log("\u26A0\uFE0F Could not parse FAQs, trying multiline...");
+                const faqsMultiPattern = /"(?:faq_used|faqs_used)"\s*:\s*(\[[\s\S]*?\n\s*\])/;
+                const faqsMultiMatch = data.response.match(faqsMultiPattern);
+                if (faqsMultiMatch) {
+                  try {
+                    faqs = JSON.parse(faqsMultiMatch[1]);
+                    console.log("\u2705 Extracted multi-line FAQs, count:", faqs?.length || 0);
+                  } catch {
+                    faqs = void 0;
+                  }
+                }
+              }
+            }
             const suggestedPattern = /"(?:suggested_follow_ups|suggested_questions)"\s*:\s*(\[[^\]]*\])/s;
             const suggestedMatch = data.response.match(suggestedPattern);
             if (suggestedMatch) {
@@ -316,6 +374,7 @@ ${this.welcomeSubtitle}` : this.welcomeMessage;
         } else {
           console.log("\u{1F4C4} Direct text response (not JSON)");
           responseText = data.response;
+          faqs = data.faq_used || data.faqs_used || void 0;
           suggestedQuestions = data.suggested_follow_ups || data.suggested_questions || void 0;
         }
       } else if (typeof data === "string") {
@@ -324,16 +383,18 @@ ${this.welcomeSubtitle}` : this.welcomeMessage;
       } else if (data && typeof data === "object") {
         console.warn("\u26A0\uFE0F Unexpected format, using fallback");
         responseText = data.message || data.answer || "Error: Unexpected response format";
+        faqs = data.faq_used || data.faqs_used || void 0;
         suggestedQuestions = data.suggested_follow_ups || data.suggested_questions || void 0;
       }
       console.log("\u{1F3AF} Final responseText length:", responseText.length);
       console.log("\u{1F3AF} Final responseText preview:", responseText.substring(0, 100));
+      console.log("\u{1F3AF} Final FAQs:", faqs);
       console.log("\u{1F3AF} Final suggested questions:", suggestedQuestions);
       const assistantMessage = {
         id: (Date.now() + 1).toString(),
         role: "assistant",
         content: responseText,
-        // faqs: faqs,  // Commented out - FAQ functionality disabled
+        faqs,
         suggestedQuestions
       };
       this.messages = [...this.messages, assistantMessage];
@@ -392,19 +453,18 @@ Please check your API endpoint configuration.`
               </div>
               <div class="message-content">
                 <div class="message-text">${unsafeHtml_js.unsafeHTML(this.formatMessageContent(msg.content))}</div>
-                <!-- FAQ section - commented out for now -->
-                <!-- ${msg.role === "assistant" && msg.faqs && msg.faqs.length > 0 ? lit.html`
+                ${msg.role === "assistant" && msg.faqs && msg.faqs.length > 0 ? lit.html`
                   <div class="faq-section">
                     <p class="faq-title">Related FAQs:</p>
                     <ul class="faq-list">
                       ${msg.faqs.map((faq) => lit.html`
                         <li class="faq-item-static">
-                          ${faq.question}
+                          ${faq.Question}
                         </li>
                       `)}
                     </ul>
                   </div>
-                ` : ""} -->
+                ` : ""}
                 ${msg.role === "assistant" && msg.suggestedQuestions && msg.suggestedQuestions.length > 0 ? lit.html`
                   <div class="faq-section">
                     <p class="faq-title">Suggested Questions:</p>
@@ -1272,7 +1332,8 @@ exports.AIChat.properties = {
   userMessageBg: { type: String, attribute: "user-message-bg" },
   botMessageBg: { type: String, attribute: "bot-message-bg" },
   welcomeMessage: { type: String, attribute: "welcome-message" },
-  welcomeSubtitle: { type: String, attribute: "welcome-subtitle" }
+  welcomeSubtitle: { type: String, attribute: "welcome-subtitle" },
+  initialQuestionsUrl: { type: String, attribute: "initial-questions-url" }
 };
 __decorateClass([
   decorators_js.state()