npm - @ihoomanai/chat-widget - Versions diffs - 3.0.0 → 3.0.1 - Mend

@ihoomanai/chat-widget 3.0.0 → 3.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (36) hide show

package/cdn/SRI_HASHES.md +8 -8
package/cdn/health.json +2 -2
package/cdn/latest/chat.js +764 -459
package/cdn/latest/chat.js.map +1 -1
package/cdn/latest/chat.min.js +1 -1
package/cdn/latest/chat.min.js.map +1 -1
package/cdn/manifest.json +13 -13
package/cdn/{v2 → v3}/chat.js +764 -459
package/cdn/v3/chat.js.map +1 -0
package/cdn/v3/chat.min.js +2 -0
package/cdn/v3/chat.min.js.map +1 -0
package/cdn/{v2.2.2 → v3.0.1}/chat.js +764 -459
package/cdn/v3.0.1/chat.js.map +1 -0
package/cdn/v3.0.1/chat.min.js +2 -0
package/cdn/v3.0.1/chat.min.js.map +1 -0
package/dist/index.cjs.js +558 -542
package/dist/index.cjs.js.map +1 -1
package/dist/index.esm.js +558 -542
package/dist/index.esm.js.map +1 -1
package/dist/index.esm.min.js +1 -1
package/dist/index.esm.min.js.map +1 -1
package/dist/index.umd.js +558 -542
package/dist/index.umd.js.map +1 -1
package/dist/index.umd.min.js +1 -1
package/dist/index.umd.min.js.map +1 -1
package/dist/widget.d.ts +2 -19
package/dist/widget.d.ts.map +1 -1
package/package.json +1 -1
package/src/widget.ts +671 -655
package/cdn/v2/chat.js.map +0 -1
package/cdn/v2/chat.min.js +0 -2
package/cdn/v2/chat.min.js.map +0 -1
package/cdn/v2.2.2/chat.js.map +0 -1
package/cdn/v2.2.2/chat.min.js +0 -2
package/cdn/v2.2.2/chat.min.js.map +0 -1
package/cdn/widget.min.js +0 -2

package/dist/index.esm.js CHANGED Viewed

@@ -1,5 +1,5 @@
 /**
- * @ihoomanai/chat-widget v3.0.0
+ * @ihoomanai/chat-widget v3.0.1
  * Universal chat support widget for any website - secure Widget ID based initialization
  *
  * @license MIT
@@ -7,27 +7,14 @@
  */
 /**
  * Ihooman Chat Widget - Core Implementation
- *
- * Secure Widget ID based initialization - no API keys in client code.
- * Fetches configuration from Widget Configuration API using Widget ID.
- *
- * @module widget
- * @version 2.0.0
- * @license MIT
- *
- * Requirements:
- * - 5.2: Export IhoomanChat object with init, open, close, toggle, destroy methods
- * - 5.3: Accept widgetId configuration option for initialization
- * - 10.1: Widget only requires Widget ID, never API key
- * - 10.2: Widget fetches configuration using only Widget ID
+ * Enhanced with professional features
+ * @version 3.0.0
  */
-const VERSION = '2.0.0';
+const VERSION = '3.0.1';
 const STORAGE_PREFIX = 'ihooman_chat_';
-/**
- * Default widget configuration
- */
+const DEFAULT_SERVER_URL = 'https://api.ihooman.ai';
 const defaultConfig = {
-    serverUrl: 'https://api.ihooman.ai',
+    serverUrl: DEFAULT_SERVER_URL,
     theme: 'light',
     position: 'bottom-right',
     title: 'Chat Support',
@@ -51,10 +38,12 @@ const defaultConfig = {
     fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
     avatarUrl: '',
     poweredBy: true,
+    presetQuestions: [],
+    proactiveMessages: [],
+    surveyConfig: null,
+    locale: 'en',
+    allowLocalhost: true,
 };
-/**
- * SVG icons for the widget UI
- */
 const icons = {
     chat: `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path></svg>`,
     close: `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>`,
@@ -63,60 +52,65 @@ const icons = {
     minimize: `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"></line></svg>`,
     bot: `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="11" width="18" height="10" rx="2"></rect><circle cx="12" cy="5" r="2"></circle><path d="M12 7v4"></path></svg>`,
     agent: `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"></path><circle cx="12" cy="7" r="4"></circle></svg>`,
-    ticket: `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14.5 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7.5L14.5 2z"></path><polyline points="14 2 14 8 20 8"></polyline><line x1="16" y1="13" x2="8" y2="13"></line><line x1="16" y1="17" x2="8" y2="17"></line><line x1="10" y1="9" x2="8" y2="9"></line></svg>`,
+    ticket: `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14.5 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7.5L14.5 2z"></path><polyline points="14 2 14 8 20 8"></polyline></svg>`,
     history: `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"></circle><polyline points="12 6 12 12 16 14"></polyline></svg>`,
     plus: `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="12" y1="5" x2="12" y2="19"></line><line x1="5" y1="12" x2="19" y2="12"></line></svg>`,
-};
-/**
- * Internal widget state
- */
+    star: `<svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"></path></svg>`,
+    starEmpty: `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"></path></svg>`,
+    thumbUp: `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 9V5a3 3 0 0 0-3-3l-4 9v11h11.28a2 2 0 0 0 2-1.7l1.38-9a2 2 0 0 0-2-2.3zM7 22H4a2 2 0 0 1-2-2v-7a2 2 0 0 1 2-2h3"></path></svg>`,
+    thumbDown: `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M10 15v4a3 3 0 0 0 3 3l4-9V2H5.72a2 2 0 0 0-2 1.7l-1.38 9a2 2 0 0 0 2 2.3zm7-13h2.67A2.31 2.31 0 0 1 22 4v7a2.31 2.31 0 0 1-2.33 2H17"></path></svg>`};
 let config = { widgetId: '', ...defaultConfig };
 let state = {
     isOpen: false,
     isConnected: false,
     messages: [],
+    pendingMessages: [],
     sessionId: null,
     visitorId: null,
     unreadCount: 0,
+    view: 'chat',
+    connectionStatus: 'disconnected',
+    typingIndicator: false,
+    soundMuted: false,
+    escalationStatus: null,
+    userInfo: null,
 };
 let currentView = 'chat';
 let isLiveAgentMode = false;
+let shownProactiveIds = [];
+let proactiveCooldowns = {};
+let proactiveCheckInterval = null;
+let presetQuestions = [];
 let elements = {};
 const eventListeners = {};
-/**
- * WebSocket and polling state
- */
 let ws = null;
 let pollInterval = null;
 let reconnectAttempts = 0;
 const maxReconnectAttempts = 5;
-let intentionalDisconnect = false; // Flag to prevent reconnection on intentional close
-// ============================================================================
-// UTILITIES
-// ============================================================================
-/**
- * Generate a unique ID with optional prefix
- */
+let intentionalDisconnect = false;
+let heartbeatInterval = null;
+let liveAgentPollInterval = null;
 function generateId(prefix = '') {
     return prefix + Math.random().toString(36).slice(2, 14) + Date.now().toString(36);
 }
-/**
- * Format a date to time string
- */
 function formatTime(date) {
     return new Date(date).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
 }
-/**
- * Escape HTML to prevent XSS
- */
+function timeAgo(date) {
+    const diff = Date.now() - new Date(date).getTime();
+    if (diff < 60000)
+        return 'now';
+    if (diff < 3600000)
+        return Math.floor(diff / 60000) + 'm';
+    if (diff < 86400000)
+        return Math.floor(diff / 3600000) + 'h';
+    return Math.floor(diff / 86400000) + 'd';
+}
 function escapeHtml(text) {
     const div = document.createElement('div');
     div.textContent = text;
     return div.innerHTML;
 }
-/**
- * Parse basic markdown to HTML
- */
 function parseMarkdown(text) {
     if (!text)
         return '';
@@ -124,11 +118,9 @@ function parseMarkdown(text) {
         .replace(/\*\*(.*?)\*\*/g, '<strong>$1</strong>')
         .replace(/\*(.*?)\*/g, '<em>$1</em>')
         .replace(/`(.*?)`/g, '<code>$1</code>')
+        .replace(/\[(.*?)\]\((.*?)\)/g, '<a href="$2" target="_blank" rel="noopener">$1</a>')
         .replace(/\n/g, '<br>');
 }
-/**
- * Local storage helper with prefix
- */
 function storage(key, value) {
     const fullKey = STORAGE_PREFIX + key;
     try {
@@ -149,9 +141,6 @@ function storage(key, value) {
         return null;
     }
 }
-/**
- * Emit an event to all registered listeners
- */
 function emit(event, data) {
     const listeners = eventListeners[event] || [];
     listeners.forEach((fn) => {
@@ -159,10 +148,9 @@ function emit(event, data) {
             fn(data);
         }
         catch (e) {
-            console.error(`Error in ${event} event handler:`, e);
+            console.error(`Error in ${event} handler:`, e);
         }
     });
-    // Also call config callbacks
     const callbackName = `on${event.charAt(0).toUpperCase()}${event.slice(1)}`;
     const callback = config[callbackName];
     if (typeof callback === 'function') {
@@ -170,16 +158,27 @@ function emit(event, data) {
             callback(data);
         }
         catch (e) {
-            console.error(`Error in ${callbackName} callback:`, e);
+            console.error(`Error in ${callbackName}:`, e);
         }
     }
 }
+function getCurrentScrollDepth() {
+    const scrollTop = window.scrollY || document.documentElement.scrollTop;
+    const scrollHeight = document.documentElement.scrollHeight - window.innerHeight;
+    return scrollHeight > 0 ? Math.round((scrollTop / scrollHeight) * 100) : 0;
+}
+function matchUrlPattern(pattern) {
+    try {
+        const regex = new RegExp(pattern.replace(/\*/g, '.*'));
+        return regex.test(window.location.href);
+    }
+    catch {
+        return window.location.href.includes(pattern);
+    }
+}
 // ============================================================================
 // STYLES
 // ============================================================================
-/**
- * Generate CSS styles for the widget
- */
 function generateStyles() {
     const { primaryColor, gradientFrom, gradientTo, fontFamily, borderRadius, zIndex, width, height, buttonSize } = config;
     const isDark = config.theme === 'dark';
@@ -261,7 +260,6 @@ function generateStyles() {
     .ihooman-file-input { display: none; }
     .ihooman-powered { text-align: center; padding: 8px; font-size: 11px; color: ${mutedColor}; background: ${bgColor}; }
     .ihooman-powered a { color: ${primaryColor}; text-decoration: none; }
-    .ihooman-error { padding: 16px; text-align: center; color: #ef4444; background: ${bgColor}; }
     .ihooman-escalation-actions { display: flex; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
     .ihooman-widget .ihooman-escalation-btn { display: inline-flex !important; align-items: center !important; gap: 8px !important; padding: 10px 18px !important; border-radius: 8px !important; border: none !important; cursor: pointer !important; font-family: inherit !important; font-size: 13px !important; font-weight: 500 !important; transition: all 0.2s ease !important; width: auto !important; height: auto !important; min-width: 120px !important; }
     .ihooman-widget .ihooman-escalation-btn svg { width: 16px !important; height: 16px !important; flex-shrink: 0 !important; }
@@ -269,7 +267,6 @@ function generateStyles() {
     .ihooman-widget .ihooman-escalation-btn.primary:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0, 174, 255, 0.3); }
     .ihooman-widget .ihooman-escalation-btn.secondary { background: ${isDark ? 'rgba(255,255,255,0.1)' : 'rgba(0,0,0,0.05)'} !important; color: ${textColor} !important; border: 1px solid ${borderColor} !important; }
     .ihooman-widget .ihooman-escalation-btn.secondary:hover { background: ${isDark ? 'rgba(255,255,255,0.15)' : 'rgba(0,0,0,0.08)'} !important; }
-    .ihooman-widget .ihooman-escalation-btn:disabled { opacity: 0.5; cursor: not-allowed; transform: none; }
     .ihooman-status-bar { padding: 10px 16px; text-align: center; font-size: 13px; display: none; }
     .ihooman-status-bar.show { display: block; }
     .ihooman-status-bar.waiting { background: #fef3c7; color: #92400e; }
@@ -278,7 +275,7 @@ function generateStyles() {
     .ihooman-chat-view.hidden { display: none; }
     .ihooman-ticket-view { display: none; flex-direction: column; padding: 20px; gap: 16px; background: ${bgColor}; flex: 1; overflow-y: auto; min-height: 0; }
     .ihooman-ticket-view.show { display: flex; }
-    .ihooman-ticket-title { font-size: 18px; font-weight: 600; color: ${textColor}; margin: 0; display: flex; align-items: center; gap: 8px; }
+    .ihooman-ticket-title { font-size: 18px; font-weight: 600; color: ${textColor}; margin: 0; }
     .ihooman-ticket-subtitle { font-size: 13px; color: ${mutedColor}; margin: 0; }
     .ihooman-ticket-input { padding: 12px 14px; border: 1px solid ${borderColor}; border-radius: 10px; font-size: 14px; font-family: inherit; background: ${inputBg}; color: ${textColor}; outline: none; transition: border-color 0.2s; }
     .ihooman-ticket-input:focus { border-color: ${primaryColor}; }
@@ -288,7 +285,6 @@ function generateStyles() {
     .ihooman-ticket-submit:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0, 174, 255, 0.3); }
     .ihooman-ticket-submit:disabled { opacity: 0.5; cursor: not-allowed; transform: none; }
     .ihooman-ticket-back { padding: 10px; background: transparent; color: ${mutedColor}; border: 1px solid ${borderColor}; border-radius: 10px; font-size: 13px; cursor: pointer; transition: all 0.2s; }
-    .ihooman-ticket-back:hover { background: ${isDark ? 'rgba(255,255,255,0.05)' : 'rgba(0,0,0,0.03)'}; }
     .ihooman-history-view { display: none; flex-direction: column; flex: 1; overflow: hidden; background: ${bgColor}; }
     .ihooman-history-view.show { display: flex; }
     .ihooman-history-header { padding: 12px 16px; border-bottom: 1px solid ${borderColor}; display: flex; justify-content: space-between; align-items: center; }
@@ -306,25 +302,54 @@ function generateStyles() {
     .ihooman-preset-questions { padding: 10px 16px; display: flex; flex-wrap: wrap; gap: 6px; background: ${bgColor}; border-top: 1px solid ${borderColor}; }
     .ihooman-preset-questions:empty { display: none; }
     .ihooman-preset-questions.hidden { display: none !important; }
-    .ihooman-widget .ihooman-preset-btn { display: inline-flex !important; align-items: center !important; gap: 4px !important; padding: 6px 12px !important; border-radius: 6px !important; border: 1px solid ${borderColor} !important; background: ${isDark ? 'rgba(255,255,255,0.05)' : 'rgba(0,0,0,0.02)'} !important; color: ${textColor} !important; font-size: 12px !important; font-weight: 500 !important; cursor: pointer !important; transition: all 0.2s !important; white-space: nowrap !important; width: auto !important; height: auto !important; min-width: 0 !important; aspect-ratio: auto !important; }
+    .ihooman-widget .ihooman-preset-btn { display: inline-flex !important; align-items: center !important; gap: 4px !important; padding: 6px 12px !important; border-radius: 6px !important; border: 1px solid ${borderColor} !important; background: ${isDark ? 'rgba(255,255,255,0.05)' : 'rgba(0,0,0,0.02)'} !important; color: ${textColor} !important; font-size: 12px !important; font-weight: 500 !important; cursor: pointer !important; transition: all 0.2s !important; white-space: nowrap !important; width: auto !important; height: auto !important; }
     .ihooman-widget .ihooman-preset-btn:hover { background: ${isDark ? 'rgba(255,255,255,0.1)' : 'rgba(0,0,0,0.05)'} !important; border-color: ${primaryColor} !important; }
-    .ihooman-widget .ihooman-preset-btn .icon { font-size: 12px !important; flex-shrink: 0 !important; }
-    @media (max-width: 480px) { .ihooman-window { width: calc(100vw - 20px); height: calc(100vh - 100px); min-height: 400px; max-height: calc(100vh - 100px); left: 10px; right: 10px; bottom: 80px; } .ihooman-toggle { ${positionRight ? 'right: 16px' : 'left: 16px'}; bottom: 16px; } }
+    .ihooman-proactive-toast { position: fixed; ${positionRight ? 'right: 20px' : 'left: 20px'}; ${positionBottom ? 'bottom: 90px' : 'top: 90px'}; max-width: 300px; padding: 16px; background: ${bgColor}; border-radius: 12px; box-shadow: 0 10px 40px rgba(0,0,0,0.15); z-index: ${(zIndex ?? 9999) - 2}; opacity: 0; visibility: hidden; transform: translateY(10px); transition: all 0.3s ease; border: 1px solid ${borderColor}; }
+    .ihooman-proactive-toast.show { opacity: 1; visibility: visible; transform: translateY(0); }
+    .ihooman-proactive-toast-content { font-size: 14px; color: ${textColor}; margin-bottom: 12px; }
+    .ihooman-proactive-toast-actions { display: flex; gap: 8px; }
+    .ihooman-proactive-toast-btn { padding: 8px 16px; border-radius: 6px; font-size: 13px; font-weight: 500; cursor: pointer; transition: all 0.2s; }
+    .ihooman-proactive-toast-btn.primary { background: linear-gradient(135deg, ${gradientFrom}, ${gradientTo}); color: white; border: none; }
+    .ihooman-proactive-toast-btn.secondary { background: transparent; color: ${mutedColor}; border: 1px solid ${borderColor}; }
+    .ihooman-survey-view { display: none; flex-direction: column; padding: 20px; gap: 16px; background: ${bgColor}; flex: 1; align-items: center; justify-content: center; }
+    .ihooman-survey-view.show { display: flex; }
+    .ihooman-survey-question { font-size: 16px; font-weight: 600; color: ${textColor}; text-align: center; }
+    .ihooman-survey-stars { display: flex; gap: 8px; }
+    .ihooman-survey-star { width: 40px; height: 40px; cursor: pointer; color: ${mutedColor}; transition: all 0.2s; }
+    .ihooman-survey-star:hover, .ihooman-survey-star.active { color: #fbbf24; transform: scale(1.1); }
+    .ihooman-survey-star svg { width: 100%; height: 100%; }
+    .ihooman-survey-comment { width: 100%; padding: 12px; border: 1px solid ${borderColor}; border-radius: 8px; font-size: 14px; resize: none; min-height: 80px; background: ${inputBg}; color: ${textColor}; }
+    .ihooman-survey-submit { padding: 12px 24px; background: linear-gradient(135deg, ${gradientFrom}, ${gradientTo}); color: white; border: none; border-radius: 8px; font-size: 14px; font-weight: 500; cursor: pointer; }
+    .ihooman-survey-skip { padding: 8px 16px; background: transparent; color: ${mutedColor}; border: none; font-size: 13px; cursor: pointer; }
+    .ihooman-feedback-btns { display: flex; gap: 8px; margin-top: 8px; }
+    .ihooman-feedback-btn { padding: 4px 8px; border: 1px solid ${borderColor}; border-radius: 4px; background: transparent; cursor: pointer; color: ${mutedColor}; transition: all 0.2s; }
+    .ihooman-feedback-btn:hover { background: ${isDark ? 'rgba(255,255,255,0.1)' : 'rgba(0,0,0,0.05)'}; }
+    .ihooman-feedback-btn.active { background: ${primaryColor}; color: white; border-color: ${primaryColor}; }
+    .ihooman-feedback-btn svg { width: 14px; height: 14px; }
+    .ihooman-carousel { display: flex; gap: 12px; overflow-x: auto; padding: 8px 0; scroll-snap-type: x mandatory; }
+    .ihooman-carousel::-webkit-scrollbar { height: 4px; }
+    .ihooman-carousel-card { min-width: 200px; max-width: 250px; border: 1px solid ${borderColor}; border-radius: 12px; overflow: hidden; scroll-snap-align: start; background: ${bgColor}; }
+    .ihooman-carousel-card img { width: 100%; height: 120px; object-fit: cover; }
+    .ihooman-carousel-card-content { padding: 12px; }
+    .ihooman-carousel-card-title { font-size: 14px; font-weight: 600; color: ${textColor}; margin-bottom: 4px; }
+    .ihooman-carousel-card-desc { font-size: 12px; color: ${mutedColor}; margin-bottom: 8px; }
+    .ihooman-carousel-card-btns { display: flex; flex-direction: column; gap: 6px; }
+    .ihooman-carousel-card-btn { padding: 8px 12px; border: 1px solid ${borderColor}; border-radius: 6px; background: transparent; color: ${textColor}; font-size: 12px; cursor: pointer; transition: all 0.2s; text-align: center; }
+    .ihooman-carousel-card-btn:hover { background: ${isDark ? 'rgba(255,255,255,0.1)' : 'rgba(0,0,0,0.05)'}; border-color: ${primaryColor}; }
+    .ihooman-quick-replies { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
+    .ihooman-quick-reply { padding: 6px 12px; border: 1px solid ${primaryColor}; border-radius: 16px; background: transparent; color: ${primaryColor}; font-size: 12px; cursor: pointer; transition: all 0.2s; }
+    .ihooman-quick-reply:hover { background: ${primaryColor}; color: white; }
+    @media (max-width: 480px) { .ihooman-window { width: calc(100vw - 20px); height: calc(100vh - 100px); min-height: 400px; max-height: calc(100vh - 100px); left: 10px; right: 10px; bottom: 80px; } .ihooman-toggle { ${positionRight ? 'right: 16px' : 'left: 16px'}; bottom: 16px; } .ihooman-proactive-toast { left: 10px; right: 10px; max-width: none; } }
   `;
 }
 // ============================================================================
 // DOM CREATION
 // ============================================================================
-/**
- * Create the widget DOM elements
- */
 function createWidget() {
-    // Add styles
     const styleEl = document.createElement('style');
     styleEl.id = 'ihooman-widget-styles';
     styleEl.textContent = generateStyles();
     document.head.appendChild(styleEl);
-    // Create widget container
     const widget = document.createElement('div');
     widget.className = 'ihooman-widget';
     widget.innerHTML = `
@@ -334,6 +359,13 @@ function createWidget() {
       <span class="chat-icon">${icons.chat}</span>
       <span class="close-icon">${icons.close}</span>
     </button>
+    <div class="ihooman-proactive-toast">
+      <div class="ihooman-proactive-toast-content"></div>
+      <div class="ihooman-proactive-toast-actions">
+        <button class="ihooman-proactive-toast-btn primary">Chat Now</button>
+        <button class="ihooman-proactive-toast-btn secondary">Dismiss</button>
+      </div>
+    </div>
     <div class="ihooman-window" role="dialog" aria-label="Chat window">
       <div class="ihooman-container">
         <div class="ihooman-header">
@@ -348,8 +380,6 @@ function createWidget() {
             <button class="ihooman-header-btn" data-action="minimize" title="Minimize">${icons.minimize}</button>
           </div>
         </div>
-        <!-- Chat View -->
         <div class="ihooman-chat-view">
           <div class="ihooman-status-bar"></div>
           <div class="ihooman-messages" role="log" aria-live="polite"></div>
@@ -362,8 +392,6 @@ function createWidget() {
             </div>
           </div>
         </div>
-        <!-- Ticket Form View -->
         <div class="ihooman-ticket-view">
           <h4 class="ihooman-ticket-title">📝 Submit a Ticket</h4>
           <p class="ihooman-ticket-subtitle">We'll get back to you via email</p>
@@ -373,22 +401,25 @@ function createWidget() {
           <button class="ihooman-ticket-submit" id="ihooman-ticket-submit">Submit Ticket</button>
           <button class="ihooman-ticket-back" id="ihooman-ticket-back">← Back to Chat</button>
         </div>
-        <!-- History View -->
         <div class="ihooman-history-view">
           <div class="ihooman-history-header">
             <span class="ihooman-history-title">Your Conversations</span>
-            <button class="ihooman-history-new" style="all: revert; display: inline-flex !important; align-items: center !important; gap: 4px !important; background: linear-gradient(135deg, ${config.gradientFrom}, ${config.gradientTo}) !important; color: white !important; border: none !important; padding: 6px 10px !important; border-radius: 6px !important; font-size: 12px !important; font-weight: 500 !important; cursor: pointer !important; width: auto !important; height: auto !important; min-width: 0 !important; aspect-ratio: auto !important;">${icons.plus} New Chat</button>
+            <button class="ihooman-history-new">${icons.plus} New Chat</button>
           </div>
           <div class="ihooman-history-list"></div>
         </div>
+        <div class="ihooman-survey-view">
+          <div class="ihooman-survey-question">${config.surveyConfig?.question || 'How was your experience?'}</div>
+          <div class="ihooman-survey-stars"></div>
+          <textarea class="ihooman-survey-comment" placeholder="Any additional feedback? (optional)"></textarea>
+          <button class="ihooman-survey-submit">Submit Feedback</button>
+          <button class="ihooman-survey-skip">Skip</button>
+        </div>
         ${config.poweredBy ? `<div class="ihooman-powered">Powered by <a href="https://ihooman.ai" target="_blank" rel="noopener">Ihooman AI</a></div>` : ''}
       </div>
     </div>
   `;
     document.body.appendChild(widget);
-    // Store element references
     elements = {
         widget,
         toggle: widget.querySelector('.ihooman-toggle'),
@@ -397,8 +428,8 @@ function createWidget() {
         chatView: widget.querySelector('.ihooman-chat-view'),
         ticketView: widget.querySelector('.ihooman-ticket-view'),
         historyView: widget.querySelector('.ihooman-history-view'),
+        surveyView: widget.querySelector('.ihooman-survey-view'),
         historyList: widget.querySelector('.ihooman-history-list'),
-        historyNewBtn: widget.querySelector('.ihooman-history-new'),
         messages: widget.querySelector('.ihooman-messages'),
         presetQuestions: widget.querySelector('.ihooman-preset-questions'),
         input: widget.querySelector('.ihooman-input'),
@@ -413,22 +444,18 @@ function createWidget() {
         ticketIssue: widget.querySelector('#ihooman-ticket-issue'),
         ticketSubmitBtn: widget.querySelector('#ihooman-ticket-submit'),
         ticketBackBtn: widget.querySelector('#ihooman-ticket-back'),
+        proactiveToast: widget.querySelector('.ihooman-proactive-toast'),
     };
-    // Set up event listeners
     setupEventListeners();
 }
-/**
- * Set up DOM event listeners
- */
 function setupEventListeners() {
     if (!elements.toggle || !elements.sendBtn || !elements.input)
         return;
     elements.toggle.addEventListener('click', toggle);
     elements.sendBtn.addEventListener('click', handleSendClick);
     elements.input.addEventListener('input', () => {
-        if (elements.sendBtn) {
+        if (elements.sendBtn)
             elements.sendBtn.disabled = !elements.input?.value.trim();
-        }
         if (elements.input) {
             elements.input.style.height = 'auto';
             elements.input.style.height = Math.min(elements.input.scrollHeight, 100) + 'px';
@@ -448,27 +475,79 @@ function setupEventListeners() {
     elements.widget?.querySelector('[data-action="refresh"]')?.addEventListener('click', startNewConversation);
     elements.widget?.querySelector('[data-action="minimize"]')?.addEventListener('click', close);
     elements.widget?.querySelector('[data-action="history"]')?.addEventListener('click', toggleHistoryView);
-    // Ticket form buttons
-    if (elements.ticketSubmitBtn) {
+    if (elements.ticketSubmitBtn)
         elements.ticketSubmitBtn.addEventListener('click', handleSubmitTicket);
-    }
-    if (elements.ticketBackBtn) {
+    if (elements.ticketBackBtn)
         elements.ticketBackBtn.addEventListener('click', () => showView('chat'));
-    }
-    // History view buttons
-    if (elements.historyNewBtn) {
-        elements.historyNewBtn.addEventListener('click', () => {
+    const historyNewBtn = elements.widget?.querySelector('.ihooman-history-new');
+    if (historyNewBtn) {
+        historyNewBtn.addEventListener('click', () => {
             startNewConversation();
             showView('chat');
         });
     }
+    // Proactive toast buttons
+    const proactivePrimaryBtn = elements.proactiveToast?.querySelector('.ihooman-proactive-toast-btn.primary');
+    const proactiveSecondaryBtn = elements.proactiveToast?.querySelector('.ihooman-proactive-toast-btn.secondary');
+    if (proactivePrimaryBtn) {
+        proactivePrimaryBtn.addEventListener('click', () => {
+            hideProactiveToast();
+            open();
+            emit('proactive:clicked');
+        });
+    }
+    if (proactiveSecondaryBtn) {
+        proactiveSecondaryBtn.addEventListener('click', () => {
+            hideProactiveToast();
+        });
+    }
+    // Survey buttons
+    const surveySubmitBtn = elements.surveyView?.querySelector('.ihooman-survey-submit');
+    const surveySkipBtn = elements.surveyView?.querySelector('.ihooman-survey-skip');
+    if (surveySubmitBtn)
+        surveySubmitBtn.addEventListener('click', handleSurveySubmit);
+    if (surveySkipBtn)
+        surveySkipBtn.addEventListener('click', () => showView('chat'));
+    // Initialize survey stars
+    initializeSurveyStars();
+}
+function initializeSurveyStars() {
+    const starsContainer = elements.surveyView?.querySelector('.ihooman-survey-stars');
+    if (!starsContainer)
+        return;
+    let selectedRating = 0;
+    starsContainer.innerHTML = '';
+    for (let i = 1; i <= 5; i++) {
+        const star = document.createElement('div');
+        star.className = 'ihooman-survey-star';
+        star.innerHTML = icons.starEmpty;
+        star.dataset.rating = String(i);
+        star.addEventListener('click', () => {
+            selectedRating = i;
+            updateStars(starsContainer, i);
+        });
+        star.addEventListener('mouseenter', () => updateStars(starsContainer, i));
+        star.addEventListener('mouseleave', () => updateStars(starsContainer, selectedRating));
+        starsContainer.appendChild(star);
+    }
+}
+function updateStars(container, rating) {
+    const stars = container.querySelectorAll('.ihooman-survey-star');
+    stars.forEach((star, index) => {
+        const starEl = star;
+        if (index < rating) {
+            starEl.innerHTML = icons.star;
+            starEl.classList.add('active');
+        }
+        else {
+            starEl.innerHTML = icons.starEmpty;
+            starEl.classList.remove('active');
+        }
+    });
 }
 // ============================================================================
 // MESSAGING
 // ============================================================================
-/**
- * Add a message to the chat
- */
 function addMessage(content, sender = 'bot', metadata = {}) {
     const message = {
         id: generateId('msg_'),
@@ -482,175 +561,148 @@ function addMessage(content, sender = 'bot', metadata = {}) {
         return message;
     const el = document.createElement('div');
     el.className = `ihooman-message ${sender}`;
-    // Check if this message should show escalation buttons
     const showEscalationButtons = sender === 'bot' && metadata?.escalation_offered === true;
     let escalationButtonsHtml = '';
     if (showEscalationButtons) {
-        // Use inline styles with !important to override any external CSS
-        const btnBaseStyle = 'all: revert; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important; padding: 8px 12px !important; border-radius: 6px !important; border: none !important; cursor: pointer !important; font-size: 12px !important; font-weight: 500 !important; line-height: 1.2 !important; width: auto !important; height: auto !important; min-width: 0 !important; min-height: 0 !important; max-width: none !important; max-height: none !important; aspect-ratio: auto !important; box-sizing: border-box !important;';
+        const btnBaseStyle = 'all: revert; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important; padding: 8px 12px !important; border-radius: 6px !important; border: none !important; cursor: pointer !important; font-size: 12px !important; font-weight: 500 !important;';
         const primaryStyle = `${btnBaseStyle} background: linear-gradient(135deg, ${config.gradientFrom}, ${config.gradientTo}) !important; color: white !important;`;
         const secondaryStyle = `${btnBaseStyle} background: rgba(0,0,0,0.05) !important; color: inherit !important; border: 1px solid rgba(0,0,0,0.1) !important;`;
         escalationButtonsHtml = `
-      <div class="ihooman-escalation-actions" style="display: flex !important; gap: 8px !important; margin-top: 10px !important; flex-wrap: wrap !important;">
-        <button class="ihooman-escalation-btn primary" data-action="live-agent" style="${primaryStyle}">
-          ${icons.agent}
-          <span>Talk to Agent</span>
-        </button>
-        <button class="ihooman-escalation-btn secondary" data-action="create-ticket" style="${secondaryStyle}">
-          ${icons.ticket}
-          <span>Create Ticket</span>
-        </button>
+      <div class="ihooman-escalation-actions">
+        <button class="ihooman-escalation-btn primary" data-action="live-agent" style="${primaryStyle}">${icons.agent}<span>Talk to Agent</span></button>
+        <button class="ihooman-escalation-btn secondary" data-action="create-ticket" style="${secondaryStyle}">${icons.ticket}<span>Create Ticket</span></button>
+      </div>
+    `;
+    }
+    // Quick replies
+    let quickRepliesHtml = '';
+    if (metadata?.quick_replies && metadata.quick_replies.length > 0) {
+        quickRepliesHtml = `<div class="ihooman-quick-replies">${metadata.quick_replies.map(qr => `<button class="ihooman-quick-reply" data-text="${escapeHtml(qr.text)}">${escapeHtml(qr.text)}</button>`).join('')}</div>`;
+    }
+    // Feedback buttons for bot messages
+    let feedbackHtml = '';
+    if (sender === 'bot' && !metadata?.is_system_message) {
+        feedbackHtml = `
+      <div class="ihooman-feedback-btns">
+        <button class="ihooman-feedback-btn" data-feedback="up" title="Helpful">${icons.thumbUp}</button>
+        <button class="ihooman-feedback-btn" data-feedback="down" title="Not helpful">${icons.thumbDown}</button>
       </div>
     `;
     }
     el.innerHTML = `
     <div class="ihooman-message-content">${parseMarkdown(content)}</div>
     ${escalationButtonsHtml}
+    ${quickRepliesHtml}
+    ${feedbackHtml}
     ${config.showTimestamps ? `<div class="ihooman-message-time">${formatTime(message.timestamp)}</div>` : ''}
   `;
-    // Add event listeners for escalation buttons
+    // Event listeners
     if (showEscalationButtons) {
-        const liveAgentBtn = el.querySelector('[data-action="live-agent"]');
-        const ticketBtn = el.querySelector('[data-action="create-ticket"]');
-        if (liveAgentBtn) {
-            liveAgentBtn.addEventListener('click', () => handleEscalationAction('live-agent'));
-        }
-        if (ticketBtn) {
-            ticketBtn.addEventListener('click', () => handleEscalationAction('create-ticket'));
-        }
+        el.querySelector('[data-action="live-agent"]')?.addEventListener('click', () => handleEscalationAction('live-agent'));
+        el.querySelector('[data-action="create-ticket"]')?.addEventListener('click', () => handleEscalationAction('create-ticket'));
     }
-    // Remove typing indicator if present
+    // Quick reply listeners
+    el.querySelectorAll('.ihooman-quick-reply').forEach(btn => {
+        btn.addEventListener('click', () => {
+            const text = btn.dataset.text;
+            if (text) {
+                hidePresetQuestions();
+                addMessage(text, 'user');
+                showTyping();
+                sendMessageToServer(text);
+            }
+        });
+    });
+    // Feedback listeners
+    el.querySelectorAll('.ihooman-feedback-btn').forEach(btn => {
+        btn.addEventListener('click', () => {
+            const feedback = btn.dataset.feedback;
+            el.querySelectorAll('.ihooman-feedback-btn').forEach(b => b.classList.remove('active'));
+            btn.classList.add('active');
+            submitFeedback(message.id, feedback === 'up' ? 'positive' : 'negative');
+        });
+    });
     const typing = elements.messages.querySelector('.ihooman-typing');
     if (typing)
         typing.remove();
     elements.messages.appendChild(el);
     elements.messages.scrollTop = elements.messages.scrollHeight;
-    // Update unread count if widget is closed
     if (sender === 'bot' && !state.isOpen) {
         state.unreadCount++;
-        if (elements.badge) {
+        if (elements.badge)
             elements.badge.textContent = String(state.unreadCount);
-        }
         if (config.enableSounds)
             playSound();
     }
     emit('message', message);
     return message;
 }
-/**
- * Render preset questions in the widget
- */
 function renderPresetQuestions() {
+    console.debug('[IhoomanChat] Rendering preset questions:', presetQuestions.length);
     if (!elements.presetQuestions || presetQuestions.length === 0) {
-        if (elements.presetQuestions) {
+        if (elements.presetQuestions)
             elements.presetQuestions.innerHTML = '';
-        }
         return;
     }
     elements.presetQuestions.innerHTML = presetQuestions.map(q => `
     <button class="ihooman-preset-btn" data-question-id="${escapeHtml(q.id)}" data-question-text="${escapeHtml(q.text)}">
-      ${q.icon ? `<span class="icon">${escapeHtml(q.icon)}</span>` : ''}
+      ${q.icon || q.emoji ? `<span class="icon">${escapeHtml(q.icon || q.emoji || '')}</span>` : ''}
       <span>${escapeHtml(q.text)}</span>
     </button>
   `).join('');
-    // Add click handlers
     elements.presetQuestions.querySelectorAll('.ihooman-preset-btn').forEach(btn => {
         btn.addEventListener('click', () => {
             const questionText = btn.dataset.questionText;
-            if (questionText) {
+            if (questionText)
                 handlePresetQuestionClick(questionText);
-            }
         });
     });
 }
-/**
- * Handle preset question click - send the question as a message
- */
 function handlePresetQuestionClick(questionText) {
-    // Hide preset questions immediately
     hidePresetQuestions();
-    // Add the question as a user message
     addMessage(questionText, 'user');
-    // Show typing indicator
     showTyping();
-    // Send to server
     sendMessageToServer(questionText);
 }
-/**
- * Handle escalation action button clicks
- */
 function handleEscalationAction(action) {
-    // Disable all escalation buttons to prevent double-clicks
     const buttons = document.querySelectorAll('.ihooman-escalation-btn');
     buttons.forEach(btn => btn.disabled = true);
-    if (action === 'live-agent') {
+    if (action === 'live-agent')
         handleRequestLiveAgent();
-    }
-    else if (action === 'create-ticket') {
-        handleShowTicketForm();
-    }
+    else if (action === 'create-ticket')
+        showView('ticket');
 }
-/**
- * Switch between chat, ticket, and history views
- */
 function showView(view) {
     currentView = view;
-    if (elements.chatView) {
+    state.view = view;
+    if (elements.chatView)
         elements.chatView.classList.toggle('hidden', view !== 'chat');
-    }
-    if (elements.ticketView) {
+    if (elements.ticketView)
         elements.ticketView.classList.toggle('show', view === 'ticket');
-    }
-    if (elements.historyView) {
+    if (elements.historyView)
         elements.historyView.classList.toggle('show', view === 'history');
-    }
-    // Load history when showing history view
-    if (view === 'history') {
+    if (elements.surveyView)
+        elements.surveyView.classList.toggle('show', view === 'survey');
+    if (view === 'history')
         loadConversationHistory();
-    }
 }
-/**
- * Toggle between chat and history views
- */
 function toggleHistoryView() {
-    if (currentView === 'history') {
-        showView('chat');
-    }
-    else {
-        showView('history');
-    }
-}
-/**
- * Format time ago string
- */
-function timeAgo(date) {
-    const diff = Date.now() - new Date(date).getTime();
-    if (diff < 60000)
-        return 'now';
-    if (diff < 3600000)
-        return Math.floor(diff / 60000) + 'm';
-    if (diff < 86400000)
-        return Math.floor(diff / 3600000) + 'h';
-    return Math.floor(diff / 86400000) + 'd';
+    showView(currentView === 'history' ? 'chat' : 'history');
 }
-/**
- * Load conversation history from the server
- */
 async function loadConversationHistory() {
     if (!elements.historyList || !state.visitorId)
         return;
     elements.historyList.innerHTML = '<div class="ihooman-history-empty">Loading...</div>';
     try {
         const response = await fetch(`${config.serverUrl}/api/widget/conversations?widget_id=${config.widgetId}&visitor_id=${state.visitorId}&limit=20`);
-        if (!response.ok) {
+        if (!response.ok)
             throw new Error('Failed to load history');
-        }
         const conversations = await response.json();
         if (!conversations.length) {
             elements.historyList.innerHTML = '<div class="ihooman-history-empty">No conversations yet</div>';
             return;
         }
-        elements.historyList.innerHTML = conversations.map(conv => `
+        elements.historyList.innerHTML = conversations.map((conv) => `
       <div class="ihooman-history-item ${conv.session_id === state.sessionId ? 'active' : ''}" data-session-id="${conv.session_id}">
         <div class="ihooman-history-preview">${escapeHtml(conv.preview || 'New conversation')}</div>
         <div class="ihooman-history-meta">
@@ -659,13 +711,11 @@ async function loadConversationHistory() {
         </div>
       </div>
     `).join('');
-        // Add click handlers to history items
         elements.historyList.querySelectorAll('.ihooman-history-item').forEach(item => {
             item.addEventListener('click', () => {
                 const sessionId = item.dataset.sessionId;
-                if (sessionId) {
+                if (sessionId)
                     switchToConversation(sessionId);
-                }
             });
         });
     }
@@ -673,49 +723,35 @@ async function loadConversationHistory() {
         console.error('Error loading conversation history:', error);
         elements.historyList.innerHTML = '<div class="ihooman-history-empty">Failed to load history</div>';
     }
+    finally {
+    }
 }
-/**
- * Switch to a specific conversation
- */
 async function switchToConversation(sessionId) {
     state.sessionId = sessionId;
-    if (config.persistSession) {
+    if (config.persistSession)
         storage('session_id', sessionId);
-    }
-    // Clear current messages
-    if (elements.messages) {
+    if (elements.messages)
         elements.messages.innerHTML = '';
-    }
-    // Reset live agent mode
     isLiveAgentMode = false;
     stopLiveAgentPolling();
     updateStatusBar('hidden');
-    // Reconnect WebSocket with new session
     intentionalDisconnect = true;
     if (ws) {
         ws.close();
         ws = null;
     }
     connectWebSocket();
-    // Switch to chat view
     showView('chat');
-    // Load conversation messages
     await loadConversationMessages(sessionId);
 }
-/**
- * Load messages for a specific conversation
- */
 async function loadConversationMessages(sessionId) {
     try {
         const response = await fetch(`${config.serverUrl}/api/widget/transcript/${sessionId}?widget_id=${config.widgetId}`);
-        if (!response.ok) {
+        if (!response.ok)
             throw new Error('Failed to load messages');
-        }
         const data = await response.json();
-        if (elements.messages) {
+        if (elements.messages)
             elements.messages.innerHTML = '';
-        }
-        // Add messages to the chat
         if (data.messages && data.messages.length > 0) {
             data.messages.forEach((msg) => {
                 const sender = msg.sender_type === 'user' ? 'user' : 'bot';
@@ -725,34 +761,18 @@ async function loadConversationMessages(sessionId) {
         else if (config.welcomeMessage) {
             addMessage(config.welcomeMessage, 'bot');
         }
-        // Check conversation status
         if (data.status === 'pending') {
             isLiveAgentMode = true;
             startLiveAgentPolling();
             updateStatusBar('waiting', '⏳ Waiting for agent...');
         }
-        else if (data.status === 'closed') {
-            updateStatusBar('hidden');
-        }
     }
     catch (error) {
         console.error('Error loading conversation messages:', error);
-        if (config.welcomeMessage) {
+        if (config.welcomeMessage)
             addMessage(config.welcomeMessage, 'bot');
-        }
     }
 }
-/**
- * Show the ticket form
- */
-function handleShowTicketForm() {
-    showView('ticket');
-    // Focus on name input
-    setTimeout(() => elements.ticketName?.focus(), 100);
-}
-/**
- * Update the status bar display
- */
 function updateStatusBar(status, message) {
     if (!elements.statusBar)
         return;
@@ -763,13 +783,9 @@ function updateStatusBar(status, message) {
     elements.statusBar.classList.add('show');
     elements.statusBar.classList.remove('waiting', 'connected');
     elements.statusBar.classList.add(status);
-    if (message) {
+    if (message)
         elements.statusBar.textContent = message;
-    }
 }
-/**
- * Submit a ticket via the API
- */
 async function handleSubmitTicket() {
     const name = elements.ticketName?.value.trim();
     const email = elements.ticketEmail?.value.trim();
@@ -783,7 +799,6 @@ async function handleSubmitTicket() {
         elements.ticketSubmitBtn.textContent = 'Submitting...';
     }
     try {
-        // Use Widget ID authenticated endpoint
         const response = await fetch(`${config.serverUrl}/api/widget/submit-ticket`, {
             method: 'POST',
             headers: { 'Content-Type': 'application/json' },
@@ -796,16 +811,13 @@ async function handleSubmitTicket() {
             }),
         });
         const data = await response.json();
-        // Clear form
         if (elements.ticketName)
             elements.ticketName.value = '';
         if (elements.ticketEmail)
             elements.ticketEmail.value = '';
         if (elements.ticketIssue)
             elements.ticketIssue.value = '';
-        // Switch back to chat view
         showView('chat');
-        // Show success message
         const ticketRef = data.ticket_id ? data.ticket_id.slice(0, 8) : 'submitted';
         addMessage(`✅ Ticket submitted! We'll contact you at ${email}. Reference: #${ticketRef}`, 'bot', { is_system_message: true });
     }
@@ -818,22 +830,12 @@ async function handleSubmitTicket() {
         elements.ticketSubmitBtn.textContent = 'Submit Ticket';
     }
 }
-/**
- * Request a live agent via the API
- */
 async function handleRequestLiveAgent() {
     if (!state.sessionId) {
         addMessage('Please send a message first to start a conversation.', 'bot', { is_system_message: true });
         return;
     }
-    // Disable live agent button
-    const liveBtn = elements.widget?.querySelector('[data-action="live-agent"]');
-    if (liveBtn) {
-        liveBtn.disabled = true;
-        liveBtn.innerHTML = '<svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"/></svg> Connecting...';
-    }
     try {
-        // Use Widget ID authenticated endpoint
         const response = await fetch(`${config.serverUrl}/api/widget/live-agent`, {
             method: 'POST',
             headers: { 'Content-Type': 'application/json' },
@@ -845,33 +847,21 @@ async function handleRequestLiveAgent() {
         });
         const data = await response.json();
         isLiveAgentMode = true;
-        // Show status bar - always start with waiting since agent hasn't accepted yet
+        state.escalationStatus = { active: true, type: 'live_agent', queuePosition: data.position_in_queue };
         if (data.position_in_queue && data.position_in_queue > 1) {
             updateStatusBar('waiting', `⏳ Waiting for agent (Position: #${data.position_in_queue})`);
         }
         else {
             updateStatusBar('waiting', '⏳ Connecting to live support...');
         }
-        // Start polling for agent messages
         startLiveAgentPolling();
+        emit('escalation:start', { type: 'live_agent' });
     }
     catch (error) {
         console.error('Error requesting live agent:', error);
         addMessage('❌ Unable to connect to live support. Please try again.', 'bot', { is_system_message: true });
     }
-    // Re-enable button
-    if (liveBtn) {
-        liveBtn.disabled = false;
-        liveBtn.innerHTML = '<svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"/></svg> Live Agent';
-    }
 }
-/**
- * Live agent polling interval
- */
-let liveAgentPollInterval = null;
-/**
- * Start polling for live agent messages
- */
 function startLiveAgentPolling() {
     if (liveAgentPollInterval)
         return;
@@ -881,58 +871,102 @@ function startLiveAgentPolling() {
             return;
         }
         try {
-            // Note: transcript endpoint still uses API key auth, but we can use the WebSocket
-            // for real-time updates. For now, poll the escalation status endpoint.
-            // Update queue position and connection status using Widget ID auth
-            try {
-                const escResponse = await fetch(`${config.serverUrl}/api/widget/escalation-status/${state.sessionId}?widget_id=${config.widgetId}`);
-                if (escResponse.ok) {
-                    const escData = await escResponse.json();
-                    if (escData.escalated) {
-                        if (escData.ticket_status === 'in_progress') {
-                            // Agent has accepted - show connected status
-                            updateStatusBar('connected', '🟢 Connected to live agent');
-                        }
-                        else if (escData.ticket_status === 'open') {
-                            // Still waiting in queue
-                            if (escData.position_in_queue && escData.position_in_queue > 1) {
-                                updateStatusBar('waiting', `⏳ Waiting for agent (Position: #${escData.position_in_queue})`);
-                            }
-                            else {
-                                updateStatusBar('waiting', '⏳ Waiting for agent...');
-                            }
-                        }
-                        else if (escData.ticket_status === 'closed' || escData.ticket_status === 'resolved') {
-                            // Conversation closed
-                            isLiveAgentMode = false;
-                            stopLiveAgentPolling();
-                            updateStatusBar('hidden');
-                            addMessage('This conversation has been closed. Thank you for contacting us!', 'bot', { is_system_message: true });
-                        }
+            const response = await fetch(`${config.serverUrl}/api/widget/escalation-status/${state.sessionId}?widget_id=${config.widgetId}`);
+            if (response.ok) {
+                const data = await response.json();
+                if (data.escalated) {
+                    if (data.ticket_status === 'in_progress') {
+                        updateStatusBar('connected', '🟢 Connected to live agent');
+                    }
+                    else if (data.ticket_status === 'open') {
+                        updateStatusBar('waiting', data.position_in_queue > 1
+                            ? `⏳ Waiting for agent (Position: #${data.position_in_queue})`
+                            : '⏳ Waiting for agent...');
+                    }
+                    else if (data.ticket_status === 'closed' || data.ticket_status === 'resolved') {
+                        isLiveAgentMode = false;
+                        stopLiveAgentPolling();
+                        updateStatusBar('hidden');
+                        addMessage('This conversation has been closed. Thank you for contacting us!', 'bot', { is_system_message: true });
+                        emit('escalation:end', { type: 'live_agent' });
                     }
                 }
             }
-            catch {
-                // Ignore escalation status errors
-            }
-        }
-        catch (error) {
-            console.error('Error polling for messages:', error);
         }
+        catch { /* ignore */ }
     }, 3000);
 }
-/**
- * Stop live agent polling
- */
 function stopLiveAgentPolling() {
     if (liveAgentPollInterval) {
         clearInterval(liveAgentPollInterval);
         liveAgentPollInterval = null;
     }
 }
+async function submitFeedback(messageId, feedbackType) {
+    try {
+        await fetch(`${config.serverUrl}/api/widget/feedback`, {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({
+                widget_id: config.widgetId,
+                message_id: messageId,
+                session_id: state.sessionId,
+                feedback_type: feedbackType,
+            }),
+        });
+    }
+    catch (error) {
+        console.error('Error submitting feedback:', error);
+    }
+}
+async function handleSurveySubmit() {
+    const starsContainer = elements.surveyView?.querySelector('.ihooman-survey-stars');
+    const activeStars = starsContainer?.querySelectorAll('.ihooman-survey-star.active');
+    const rating = activeStars?.length || 0;
+    const comment = elements.surveyView?.querySelector('.ihooman-survey-comment')?.value;
+    if (rating === 0) {
+        alert('Please select a rating');
+        return;
+    }
+    try {
+        await fetch(`${config.serverUrl}/api/widget/survey-response`, {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({
+                widget_id: config.widgetId,
+                survey_id: config.surveyConfig?.id,
+                session_id: state.sessionId,
+                rating,
+                comment,
+            }),
+        });
+        // Mark survey as completed for this session
+        storage('survey_completed_' + state.sessionId, true);
+        emit('survey:submitted', { rating, comment });
+        addMessage(config.surveyConfig?.thankYouMessage || 'Thank you for your feedback!', 'bot', { is_system_message: true });
+        showView('chat');
+    }
+    catch (error) {
+        console.error('Error submitting survey:', error);
+    }
+}
 /**
- * Show typing indicator
+ * Check if survey should be shown and show it
  */
+function checkAndShowSurvey() {
+    // Don't show if no survey configured
+    if (!config.surveyConfig)
+        return;
+    // Don't show if already completed for this session
+    if (state.sessionId && storage('survey_completed_' + state.sessionId))
+        return;
+    // Don't show if not enough messages (at least 2 exchanges)
+    if (state.messages.length < 4)
+        return;
+    // Show the survey
+    showView('survey');
+    emit('survey:shown', config.surveyConfig);
+}
 function showTyping() {
     if (!config.showTypingIndicator || !elements.messages)
         return;
@@ -944,56 +978,35 @@ function showTyping() {
     elements.messages.appendChild(typing);
     elements.messages.scrollTop = elements.messages.scrollHeight;
 }
-/**
- * Hide typing indicator
- */
 function hideTyping() {
     const typing = elements.messages?.querySelector('.ihooman-typing');
     if (typing)
         typing.remove();
 }
-/**
- * Handle send button click
- */
 function handleSendClick() {
     const content = elements.input?.value.trim();
     if (!content)
         return;
-    // Hide preset questions after user sends any message
     hidePresetQuestions();
     if (elements.input) {
         elements.input.value = '';
         elements.input.style.height = 'auto';
     }
-    if (elements.sendBtn) {
+    if (elements.sendBtn)
         elements.sendBtn.disabled = true;
-    }
     addMessage(content, 'user');
     showTyping();
     sendMessageToServer(content);
 }
-/**
- * Hide preset questions
- */
 function hidePresetQuestions() {
-    if (elements.presetQuestions) {
+    if (elements.presetQuestions)
         elements.presetQuestions.classList.add('hidden');
-    }
 }
-/**
- * Send message to the server
- * Uses WebSocket if connected, otherwise falls back to REST API
- */
 async function sendMessageToServer(content) {
-    // If WebSocket is connected, send via WebSocket
     if (ws && ws.readyState === WebSocket.OPEN) {
-        ws.send(JSON.stringify({
-            type: 'message',
-            content: content,
-        }));
+        ws.send(JSON.stringify({ type: 'message', content }));
         return;
     }
-    // Fallback to REST API
     try {
         const response = await fetch(`${config.serverUrl}/api/v1/public/chat`, {
             method: 'POST',
@@ -1013,7 +1026,12 @@ async function sendMessageToServer(content) {
                 storage('session_id', state.sessionId);
         }
         if (data.response) {
-            addMessage(data.response, 'bot', { sources: data.sources, confidence: data.confidence });
+            addMessage(data.response, 'bot', {
+                sources: data.sources,
+                confidence: data.confidence,
+                escalation_offered: data.escalation_offered,
+                quick_replies: data.quick_replies,
+            });
         }
     }
     catch (error) {
@@ -1022,9 +1040,6 @@ async function sendMessageToServer(content) {
         emit('error', error);
     }
 }
-/**
- * Handle file selection
- */
 function handleFileSelect(e) {
     const target = e.target;
     const file = target.files?.[0];
@@ -1050,102 +1065,179 @@ function handleFileSelect(e) {
     });
     target.value = '';
 }
-/**
- * Play notification sound
- */
 function playSound() {
     try {
         const audio = new Audio('data:audio/mp3;base64,SUQzBAAAAAAAI1RTU0UAAAAPAAADTGF2ZjU4Ljc2LjEwMAAAAAAAAAAAAAAA//tQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAWGluZwAAAA8AAAACAAABhgC7u7u7u7u7u7u7u7u7u7u7u7u7u7u7u7u7u7u7u7u7u7u7u7u7u7u7u7u7u7u7u7u7u7u7//////////////////////////////////////////////////////////////////8AAAAATGF2YzU4LjEzAAAAAAAAAAAAAAAAJAAAAAAAAAAAAYYNBrP/AAAAAAAAAAAAAAAAAAAAAP/7UMQAA8AAAaQAAAAgAAA0gAAABExBTUUzLjEwMFVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV//tQxBKDwAABpAAAACAAADSAAAAEVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVU=');
         audio.volume = 0.3;
         audio.play().catch(() => { });
     }
-    catch {
-        // Ignore audio errors
+    catch { /* ignore */ }
+}
+// ============================================================================
+// PROACTIVE MESSAGES
+// ============================================================================
+function initializeProactiveMessages() {
+    if (!config.proactiveMessages || config.proactiveMessages.length === 0) {
+        console.debug('[IhoomanChat] No proactive messages configured');
+        return;
+    }
+    console.debug('[IhoomanChat] Initializing proactive messages:', config.proactiveMessages.length);
+    // Load shown proactive IDs from storage
+    shownProactiveIds = storage('shown_proactive') || [];
+    proactiveCooldowns = storage('proactive_cooldowns') || {};
+    // Start checking for triggers
+    proactiveCheckInterval = setInterval(checkProactiveTriggers, 5000);
+    // Also check on scroll
+    window.addEventListener('scroll', checkProactiveTriggers);
+    // Exit intent detection
+    document.addEventListener('mouseout', (e) => {
+        if (e.clientY <= 0)
+            checkExitIntentTrigger();
+    });
+}
+function checkProactiveTriggers() {
+    if (state.isOpen || !config.proactiveMessages)
+        return;
+    const now = Date.now();
+    for (const pm of config.proactiveMessages) {
+        // Skip if already shown in this session
+        if (shownProactiveIds.includes(pm.id))
+            continue;
+        // Check cooldown
+        const lastShown = proactiveCooldowns[pm.id];
+        if (lastShown && now - lastShown < pm.cooldownMinutes * 60 * 1000)
+            continue;
+        // Check date range
+        if (pm.startDate && new Date(pm.startDate) > new Date())
+            continue;
+        if (pm.endDate && new Date(pm.endDate) < new Date())
+            continue;
+        // Check trigger
+        let triggered = false;
+        switch (pm.trigger.type) {
+            case 'time':
+                const timeValue = typeof pm.trigger.value === 'number' ? pm.trigger.value : parseInt(String(pm.trigger.value), 10);
+                const pageLoadTime = storage('page_load_time') || now;
+                if (now - pageLoadTime >= timeValue * 1000)
+                    triggered = true;
+                break;
+            case 'scroll':
+                const scrollValue = typeof pm.trigger.value === 'number' ? pm.trigger.value : parseInt(String(pm.trigger.value), 10);
+                const currentScroll = getCurrentScrollDepth();
+                if (currentScroll >= scrollValue)
+                    triggered = true;
+                break;
+            case 'url_pattern':
+                if (matchUrlPattern(String(pm.trigger.value)))
+                    triggered = true;
+                break;
+        }
+        if (triggered) {
+            showProactiveMessage(pm);
+            break;
+        }
+    }
+}
+function checkExitIntentTrigger() {
+    if (state.isOpen || !config.proactiveMessages)
+        return;
+    const exitIntentMessages = config.proactiveMessages.filter(pm => pm.trigger.type === 'exit_intent' && !shownProactiveIds.includes(pm.id));
+    if (exitIntentMessages.length > 0) {
+        showProactiveMessage(exitIntentMessages[0]);
+    }
+}
+function showProactiveMessage(pm) {
+    // Mark as shown
+    shownProactiveIds.push(pm.id);
+    proactiveCooldowns[pm.id] = Date.now();
+    storage('shown_proactive', shownProactiveIds);
+    storage('proactive_cooldowns', proactiveCooldowns);
+    // Show toast
+    if (elements.proactiveToast) {
+        const content = elements.proactiveToast.querySelector('.ihooman-proactive-toast-content');
+        if (content)
+            content.textContent = pm.message;
+        elements.proactiveToast.classList.add('show');
+        emit('proactive:shown', pm);
+        // Auto-open if configured
+        if (pm.autoOpen) {
+            setTimeout(() => {
+                hideProactiveToast();
+                open();
+            }, 3000);
+        }
+    }
+}
+function hideProactiveToast() {
+    if (elements.proactiveToast) {
+        elements.proactiveToast.classList.remove('show');
+    }
+}
+function cleanupProactiveMessages() {
+    if (proactiveCheckInterval) {
+        clearInterval(proactiveCheckInterval);
+        proactiveCheckInterval = null;
     }
+    window.removeEventListener('scroll', checkProactiveTriggers);
 }
 // ============================================================================
 // WEBSOCKET CONNECTION
 // ============================================================================
-/**
- * Connect to WebSocket for real-time messaging.
- *
- * For public widgets (using Widget ID), connects to /public/ws endpoint
- * which authenticates via Widget ID + Domain validation.
- *
- * For authenticated users (dashboard), connects to /ws endpoint with JWT.
- */
 function connectWebSocket(chatEndpoint) {
     if (!config.serverUrl && !chatEndpoint)
         return;
     let wsUrl;
     if (config.widgetId) {
-        // Public widget - use /public/ws endpoint with widget_id auth
         const baseWsUrl = config.serverUrl?.replace(/^http/, 'ws');
-        const params = new URLSearchParams({
-            widget_id: config.widgetId,
-        });
-        if (state.visitorId) {
+        const params = new URLSearchParams({ widget_id: config.widgetId });
+        if (state.visitorId)
             params.append('visitor_id', state.visitorId);
-        }
-        if (state.sessionId) {
+        if (state.sessionId)
             params.append('session_id', state.sessionId);
-        }
         wsUrl = `${baseWsUrl}/public/ws?${params.toString()}`;
     }
     else {
-        // Authenticated user - use /ws endpoint
         wsUrl = chatEndpoint || config.serverUrl?.replace(/^http/, 'ws') + '/ws';
     }
     try {
-        // Stop any existing heartbeat before creating new connection
         stopHeartbeat();
         ws = new WebSocket(wsUrl);
         ws.onopen = () => {
             state.isConnected = true;
+            state.connectionStatus = 'connected';
             reconnectAttempts = 0;
             updateStatus(true);
             emit('connected');
-            // Start heartbeat after connection is established
             startHeartbeat();
         };
         ws.onclose = (event) => {
             state.isConnected = false;
+            state.connectionStatus = 'disconnected';
             updateStatus(false);
             stopHeartbeat();
             emit('disconnected');
-            // Log close reason for debugging
-            console.log(`WebSocket closed: code=${event.code}, reason=${event.reason || 'none'}, wasClean=${event.wasClean}`);
-            // Don't reconnect if this was an intentional disconnect (e.g., starting new conversation)
             if (intentionalDisconnect) {
                 intentionalDisconnect = false;
                 return;
             }
-            // Don't reconnect if the widget is closed
-            if (!state.isOpen) {
+            if (!state.isOpen)
                 return;
-            }
-            // Attempt reconnection with exponential backoff
             if (reconnectAttempts < maxReconnectAttempts) {
                 reconnectAttempts++;
                 const delay = Math.min(1000 * Math.pow(2, reconnectAttempts), 30000);
-                console.log(`WebSocket reconnecting in ${delay}ms (attempt ${reconnectAttempts}/${maxReconnectAttempts})`);
                 setTimeout(() => connectWebSocket(chatEndpoint), delay);
             }
             else {
-                // Fall back to polling after max reconnect attempts
-                console.warn('WebSocket reconnection failed, falling back to polling');
                 startPolling();
             }
         };
         ws.onerror = (error) => {
             console.error('WebSocket error:', error);
-            // WebSocket error - will trigger onclose
         };
         ws.onmessage = (e) => {
             try {
                 const data = JSON.parse(e.data);
                 if (data.type === 'connected') {
-                    // Server confirmed connection - update session info
                     if (data.session_id) {
                         state.sessionId = data.session_id;
                         if (config.persistSession)
@@ -1156,7 +1248,6 @@ function connectWebSocket(chatEndpoint) {
                         if (config.persistSession)
                             storage('visitor_id', state.visitorId);
                     }
-                    // Show welcome message if provided
                     if (data.welcome_message && state.messages.length === 0) {
                         addMessage(data.welcome_message, 'bot');
                     }
@@ -1169,64 +1260,44 @@ function connectWebSocket(chatEndpoint) {
                         agent_name: data.agent_name,
                         escalation_offered: data.escalation_offered,
                         escalated: data.escalated,
+                        quick_replies: data.quick_replies,
                     });
                 }
                 else if (data.type === 'typing') {
                     data.is_typing ? showTyping() : hideTyping();
                 }
                 else if (data.type === 'pong') {
-                    // Heartbeat response - connection is alive
+                    // Heartbeat response
                 }
                 else if (data.type === 'error') {
                     console.error('WebSocket server error:', data.message);
                     emit('error', { message: data.message });
                 }
             }
-            catch {
-                // Ignore parse errors
-            }
+            catch { /* ignore */ }
         };
     }
     catch {
-        // WebSocket not supported, fall back to polling
-        console.warn('WebSocket not supported, using polling');
         startPolling();
     }
 }
-/**
- * Heartbeat interval reference
- */
-let heartbeatInterval = null;
-/**
- * Start heartbeat to keep WebSocket connection alive
- * Sends ping every 25 seconds to prevent Cloudflare/proxy timeouts
- */
 function startHeartbeat() {
-    // Clear any existing heartbeat first
     stopHeartbeat();
     heartbeatInterval = setInterval(() => {
         if (ws && ws.readyState === WebSocket.OPEN) {
             try {
                 ws.send(JSON.stringify({ type: 'ping' }));
             }
-            catch (e) {
-                console.warn('Failed to send heartbeat ping:', e);
-            }
+            catch { /* ignore */ }
         }
-    }, 25000); // Ping every 25 seconds (Cloudflare timeout is 100s, but some proxies are shorter)
+    }, 25000);
 }
-/**
- * Stop heartbeat
- */
 function stopHeartbeat() {
     if (heartbeatInterval) {
         clearInterval(heartbeatInterval);
         heartbeatInterval = null;
     }
 }
-/**
- * Start polling for messages (fallback when WebSocket unavailable)
- */
 function startPolling() {
     if (pollInterval)
         return;
@@ -1244,132 +1315,107 @@ function startPolling() {
                 });
             }
         }
-        catch {
-            // Ignore polling errors
-        }
+        catch { /* ignore */ }
     }, 5000);
 }
-/**
- * Update connection status display
- */
 function updateStatus(online) {
-    if (elements.statusDot) {
+    if (elements.statusDot)
         elements.statusDot.classList.toggle('offline', !online);
-    }
-    if (elements.statusText) {
+    if (elements.statusText)
         elements.statusText.textContent = online ? 'Online' : 'Offline';
-    }
 }
 // ============================================================================
 // PUBLIC API METHODS
 // ============================================================================
-/**
- * Open the chat widget window
- */
 function open() {
     if (state.isOpen)
         return;
     state.isOpen = true;
     state.unreadCount = 0;
-    if (elements.badge) {
+    if (elements.badge)
         elements.badge.textContent = '';
-    }
-    if (elements.toggle) {
+    if (elements.toggle)
         elements.toggle.classList.add('open');
-    }
-    if (elements.window) {
+    if (elements.window)
         elements.window.classList.add('open');
-    }
+    hideProactiveToast();
     setTimeout(() => elements.input?.focus(), 300);
     emit('open');
 }
-/**
- * Close the chat widget window
- */
 function close() {
     if (!state.isOpen)
         return;
     state.isOpen = false;
-    if (elements.toggle) {
+    if (elements.toggle)
         elements.toggle.classList.remove('open');
-    }
-    if (elements.window) {
+    if (elements.window)
         elements.window.classList.remove('open');
+    // Check if we should show survey after closing (if conversation had enough messages)
+    if (config.surveyConfig && state.messages.length >= 4) {
+        const surveyCompleted = state.sessionId && storage('survey_completed_' + state.sessionId);
+        if (!surveyCompleted) {
+            // Show survey after a short delay
+            setTimeout(() => {
+                if (!state.isOpen) {
+                    checkAndShowSurvey();
+                    open(); // Re-open to show survey
+                }
+            }, 500);
+        }
     }
     emit('close');
 }
-/**
- * Toggle the chat widget window
- */
 function toggle() {
     state.isOpen ? close() : open();
 }
-/**
- * Start a new conversation
- */
+function isOpenFn() {
+    return state.isOpen;
+}
 function startNewConversation() {
-    // Clear session and visitor to force a completely new conversation
     state.sessionId = null;
     state.visitorId = null;
     state.messages = [];
     isLiveAgentMode = false;
-    // Clear stored session
     storage('session_id', null);
-    // Generate new visitor ID
     state.visitorId = generateId('v_');
     storage('visitor_id', state.visitorId);
-    // Clear UI
-    if (elements.messages) {
+    if (elements.messages)
         elements.messages.innerHTML = '';
-    }
-    // Hide status bar
     updateStatusBar('hidden');
-    // Stop any live agent polling
     stopLiveAgentPolling();
-    // Reset reconnect attempts for fresh connection
     reconnectAttempts = 0;
-    // Close existing WebSocket with intentional flag to prevent auto-reconnect
     if (ws) {
         intentionalDisconnect = true;
         ws.close();
         ws = null;
     }
-    // Connect with new visitor ID
     connectWebSocket();
-    // Show welcome message
-    if (config.welcomeMessage) {
+    if (config.welcomeMessage)
         addMessage(config.welcomeMessage, 'bot');
-    }
+    // Show preset questions again
+    if (elements.presetQuestions)
+        elements.presetQuestions.classList.remove('hidden');
+    renderPresetQuestions();
     emit('newConversation');
 }
-/**
- * Destroy the widget and clean up resources
- */
 function destroy() {
-    // Stop heartbeat
     stopHeartbeat();
-    // Stop live agent polling
     stopLiveAgentPolling();
-    // Close WebSocket (intentionally, don't reconnect)
+    cleanupProactiveMessages();
     intentionalDisconnect = true;
     if (ws) {
         ws.close();
         ws = null;
     }
-    // Clear polling interval
     if (pollInterval) {
         clearInterval(pollInterval);
         pollInterval = null;
     }
-    // Remove DOM elements
-    if (elements.widget) {
+    if (elements.widget)
         elements.widget.remove();
-    }
     const styles = document.getElementById('ihooman-widget-styles');
-    if (styles) {
+    if (styles)
         styles.remove();
-    }
-    // Reset state
     state = {
         isOpen: false,
         isConnected: false,
@@ -1382,21 +1428,15 @@ function destroy() {
     reconnectAttempts = 0;
     intentionalDisconnect = false;
 }
-/**
- * Send a message programmatically
- */
 function sendMessage(content) {
     if (!content.trim())
         return;
-    if (elements.input) {
+    if (elements.input)
         elements.input.value = content;
-    }
     handleSendClick();
 }
-/**
- * Set user information
- */
 function setUser(user) {
+    state.userInfo = user;
     if (user.name)
         storage('user_name', user.name);
     if (user.email)
@@ -1404,79 +1444,53 @@ function setUser(user) {
     if (user.metadata)
         storage('user_metadata', user.metadata);
 }
-/**
- * Clear chat history
- */
+function clearUser() {
+    state.userInfo = null;
+    storage('user_name', null);
+    storage('user_email', null);
+    storage('user_metadata', null);
+}
 function clearHistory() {
     startNewConversation();
 }
-/**
- * Subscribe to widget events
- */
 function on(event, callback) {
-    if (!eventListeners[event]) {
+    if (!eventListeners[event])
         eventListeners[event] = [];
-    }
     eventListeners[event].push(callback);
 }
-/**
- * Unsubscribe from widget events
- */
 function off(event, callback) {
     if (eventListeners[event]) {
         eventListeners[event] = eventListeners[event].filter((fn) => fn !== callback);
     }
 }
-/**
- * Get current widget state
- */
 function getState() {
     return { ...state };
 }
+function getConfig() {
+    return { ...config };
+}
 // ============================================================================
 // INITIALIZATION
 // ============================================================================
-/**
- * Fetch widget configuration from the Widget Configuration API
- *
- * Requirements:
- * - 10.1: Widget only requires Widget ID, never API key
- * - 10.2: Widget fetches configuration using only Widget ID
- */
 async function fetchWidgetConfig(widgetId, serverUrl) {
     try {
         const response = await fetch(`${serverUrl}/api/widget/config?widget_id=${encodeURIComponent(widgetId)}`);
         if (!response.ok) {
             const errorData = await response.json().catch(() => ({}));
-            return {
-                success: false,
-                error: errorData.error || `HTTP ${response.status}`,
-            };
+            return { success: false, error: errorData.error || `HTTP ${response.status}` };
         }
         return await response.json();
     }
     catch (error) {
-        return {
-            success: false,
-            error: 'Unable to connect. Please check your internet connection.',
-        };
+        return { success: false, error: 'Unable to connect. Please check your internet connection.' };
     }
 }
-/**
- * Preset questions from server config
- */
-let presetQuestions = [];
-/**
- * Apply server configuration to local config
- */
 function applyServerConfig(serverConfig) {
-    // Apply basic settings
     config.title = serverConfig.title || config.title;
     config.subtitle = serverConfig.subtitle || config.subtitle;
     config.welcomeMessage = serverConfig.welcomeMessage || config.welcomeMessage;
     config.placeholder = serverConfig.placeholder || config.placeholder;
     config.position = serverConfig.position || config.position;
-    // Apply theme settings
     if (serverConfig.theme) {
         config.primaryColor = serverConfig.theme.primaryColor || config.primaryColor;
         config.gradientFrom = serverConfig.theme.gradientFrom || config.gradientFrom;
@@ -1486,7 +1500,6 @@ function applyServerConfig(serverConfig) {
             config.borderRadius = parseInt(serverConfig.theme.borderRadius, 10) || config.borderRadius;
         }
     }
-    // Apply behavior settings
     if (serverConfig.behavior) {
         config.startOpen = serverConfig.behavior.startOpen ?? config.startOpen;
         config.showTypingIndicator = serverConfig.behavior.showTypingIndicator ?? config.showTypingIndicator;
@@ -1495,72 +1508,91 @@ function applyServerConfig(serverConfig) {
         config.enableFileUpload = serverConfig.behavior.enableFileUpload ?? config.enableFileUpload;
         config.persistSession = serverConfig.behavior.persistSession ?? config.persistSession;
     }
-    // Apply branding settings
     if (serverConfig.branding) {
         config.avatarUrl = serverConfig.branding.avatarUrl || config.avatarUrl;
+        config.logoUrl = serverConfig.branding.logoUrl || config.logoUrl;
         config.poweredBy = serverConfig.branding.poweredBy ?? config.poweredBy;
+        config.customCss = serverConfig.branding.customCss || config.customCss;
+    }
+    if (serverConfig.size) {
+        config.width = serverConfig.size.width || config.width;
+        config.height = serverConfig.size.height || config.height;
+        config.buttonSize = serverConfig.size.buttonSize || config.buttonSize;
     }
-    // Store preset questions
     if (serverConfig.presetQuestions && Array.isArray(serverConfig.presetQuestions)) {
-        presetQuestions = serverConfig.presetQuestions;
+        console.debug('[IhoomanChat] Server config presetQuestions:', serverConfig.presetQuestions.length);
+        presetQuestions = serverConfig.presetQuestions.map(q => ({
+            id: q.id,
+            text: q.text,
+            icon: q.icon,
+            emoji: q.icon,
+        }));
+        config.presetQuestions = presetQuestions;
+    }
+    if (serverConfig.proactiveMessages && Array.isArray(serverConfig.proactiveMessages)) {
+        console.debug('[IhoomanChat] Server config proactiveMessages:', serverConfig.proactiveMessages.length);
+        config.proactiveMessages = serverConfig.proactiveMessages
+            .filter(pm => pm.isActive !== false)
+            .map(pm => ({
+            id: pm.id,
+            message: pm.message,
+            trigger: {
+                type: pm.trigger.type,
+                value: pm.trigger.type === 'time' || pm.trigger.type === 'scroll'
+                    ? parseInt(pm.trigger.value, 10) || 30
+                    : pm.trigger.value,
+            },
+            autoOpen: pm.autoOpen || false,
+            cooldownMinutes: pm.cooldownMinutes || 60,
+        }));
+    }
+    if (serverConfig.surveyConfig && serverConfig.surveyConfig.isActive !== false) {
+        console.debug('[IhoomanChat] Server config surveyConfig:', serverConfig.surveyConfig.id);
+        config.surveyConfig = {
+            id: serverConfig.surveyConfig.id,
+            type: serverConfig.surveyConfig.type,
+            question: serverConfig.surveyConfig.question,
+            followUpQuestion: serverConfig.surveyConfig.followUpQuestion,
+            thankYouMessage: serverConfig.surveyConfig.thankYouMessage,
+        };
     }
 }
-/**
- * Initialize the widget
- *
- * Requirements:
- * - 5.2: Export IhoomanChat object with init, open, close, toggle, destroy methods
- * - 5.3: Accept widgetId configuration option for initialization
- * - 10.1: Widget only requires Widget ID, never API key
- * - 10.2: Widget fetches configuration using only Widget ID
- */
 async function init(userConfig) {
-    // Validate required widgetId
     if (!userConfig.widgetId) {
         console.error('IhoomanChat: widgetId is required');
         return null;
     }
-    // Merge user config with defaults
     config = { ...defaultConfig, ...userConfig };
-    // Initialize visitor ID
     state.visitorId = storage('visitor_id') || generateId('v_');
     storage('visitor_id', state.visitorId);
-    // Restore session if persistence is enabled
     if (config.persistSession) {
         state.sessionId = storage('session_id');
     }
-    // Fetch configuration from Widget Configuration API using Widget ID
-    // This is the secure approach - no API key is ever sent from the client
-    const serverUrl = config.serverUrl || 'https://api.ihooman.ai';
+    // Store page load time for proactive messages
+    if (!storage('page_load_time')) {
+        storage('page_load_time', Date.now());
+    }
+    const serverUrl = config.serverUrl || DEFAULT_SERVER_URL;
     const configResponse = await fetchWidgetConfig(config.widgetId, serverUrl);
     let chatEndpoint;
     if (configResponse.success && configResponse.config) {
-        // Apply server configuration
         applyServerConfig(configResponse.config);
         chatEndpoint = configResponse.chatEndpoint;
     }
     else if (configResponse.error) {
-        // Log error but continue with local config
         console.warn('IhoomanChat: Could not fetch server config:', configResponse.error);
-        // If domain validation failed, show error to user
         if (configResponse.error === 'Widget not authorized for this domain') {
             console.error('IhoomanChat: Widget configuration error. Please contact support.');
-            // Still create widget but show error state
         }
     }
-    // Create the widget DOM
     createWidget();
-    // Render preset questions (after config is loaded and widget is created)
     renderPresetQuestions();
-    // Restore messages from state (if any)
-    state.messages.forEach((msg) => addMessage(msg.content, msg.sender, msg.metadata));
-    // Show welcome message if no messages
+    state.messages.forEach((msg) => addMessage(msg.content, msg.sender === 'user' ? 'user' : 'bot', msg.metadata));
     if (state.messages.length === 0 && config.welcomeMessage) {
         addMessage(config.welcomeMessage, 'bot');
     }
-    // Connect WebSocket for real-time messaging
     connectWebSocket(chatEndpoint);
-    // Auto-open if configured
+    initializeProactiveMessages();
     if (config.startOpen) {
         setTimeout(open, 500);
     }
@@ -1570,43 +1602,30 @@ async function init(userConfig) {
 // ============================================================================
 // PUBLIC API OBJECT
 // ============================================================================
-/**
- * Public API object
- *
- * Requirements:
- * - 5.2: Export IhoomanChat object with init, open, close, toggle, destroy methods
- */
 const publicAPI = {
     init,
     open,
     close,
     toggle,
+    isOpen: isOpenFn,
     destroy,
     sendMessage,
     setUser,
+    clearUser,
     clearHistory,
     on,
     off,
     getState,
+    getConfig,
     version: VERSION,
 };
-/**
- * Main IhoomanChat export
- */
 const IhoomanChat = publicAPI;
-/**
- * Factory function to create a new widget instance
- */
 function createWidgetInstance() {
     return { ...publicAPI };
 }
 // ============================================================================
 // AUTO-INITIALIZATION
 // ============================================================================
-/**
- * Auto-initialize from script attributes
- * Supports data-widget-id attribute for easy embedding
- */
 (function autoInit() {
     if (typeof document === 'undefined')
         return;
@@ -1625,7 +1644,6 @@ function createWidgetInstance() {
     const widgetId = script.getAttribute('data-widget-id');
     if (widgetId) {
         const autoConfig = { widgetId };
-        // Parse optional attributes
         const serverUrl = script.getAttribute('data-server-url');
         if (serverUrl)
             autoConfig.serverUrl = serverUrl;
@@ -1638,7 +1656,6 @@ function createWidgetInstance() {
         const startOpen = script.getAttribute('data-start-open');
         if (startOpen === 'true')
             autoConfig.startOpen = true;
-        // Initialize when DOM is ready
         if (document.readyState === 'loading') {
             document.addEventListener('DOMContentLoaded', () => init(autoConfig));
         }
@@ -1647,7 +1664,6 @@ function createWidgetInstance() {
         }
     }
 })();
-// Export for UMD builds
 if (typeof window !== 'undefined') {
     window.IhoomanChat = IhoomanChat;
 }