ask-junkie 1.0.0

package/dist/ask-junkie.min.js

@@ -0,0 +1,1858 @@
+(function (global, factory) {
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
+    typeof define === 'function' && define.amd ? define(['exports'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.AskJunkie = {}));
+})(this, (function (exports) { 'use strict';
+
+    /**
+     * DOM Utility Functions
+     */
+
+    /**
+     * Escape HTML to prevent XSS
+     */
+    function escapeHtml(text) {
+        const div = document.createElement('div');
+        div.textContent = text;
+        return div.innerHTML;
+    }
+
+    /**
+     * Create an element with attributes and children
+     */
+    function createElement(tag, attributes = {}, children = []) {
+        const element = document.createElement(tag);
+
+        Object.entries(attributes).forEach(([key, value]) => {
+            if (key === 'className') {
+                element.className = value;
+            } else if (key === 'style' && typeof value === 'object') {
+                Object.assign(element.style, value);
+            } else if (key.startsWith('on') && typeof value === 'function') {
+                element.addEventListener(key.substring(2).toLowerCase(), value);
+            } else {
+                element.setAttribute(key, value);
+            }
+        });
+
+        children.forEach(child => {
+            if (typeof child === 'string') {
+                element.appendChild(document.createTextNode(child));
+            } else if (child instanceof Node) {
+                element.appendChild(child);
+            }
+        });
+
+        return element;
+    }
+
+    /**
+     * Parse markdown-style links [text](url) to HTML
+     */
+    function parseLinks(text) {
+        return text.replace(
+            /\[([^\]]+)\]\(([^)]+)\)/g,
+            '<a href="$2" target="_blank" rel="noopener noreferrer">$1</a>'
+        );
+    }
+
+    /**
+     * Parse markdown bold **text** to HTML
+     */
+    function parseBold(text) {
+        return text.replace(/\*\*([^*]+)\*\*/g, '<strong>$1</strong>');
+    }
+
+    /**
+     * Format bot response with basic markdown
+     */
+    function formatBotResponse(text) {
+        let formatted = escapeHtml(text);
+        formatted = parseLinks(formatted);
+        formatted = parseBold(formatted);
+        formatted = formatted.replace(/\n/g, '<br>');
+        return formatted;
+    }
+
+    /**
+     * Chat Widget UI Component
+     * Renders and manages the chatbot interface
+     */
+
+
+    class ChatWidget {
+        constructor(config) {
+            this.config = config;
+            this.container = null;
+            this.messagesContainer = null;
+            this.input = null;
+            this.isOpen = false;
+            this.isDragging = false;
+            this.dragOffset = { x: 0, y: 0 };
+        }
+
+        /**
+         * Render the chat widget to the DOM
+         */
+        render() {
+            // Create container
+            this.container = createElement('div', {
+                id: 'ask-junkie-widget',
+                className: 'ask-junkie-container'
+            });
+
+            // Apply position
+            this._applyPosition();
+
+            // Create toggle button
+            const toggleBtn = this._createToggleButton();
+            this.container.appendChild(toggleBtn);
+
+            // Create chat window
+            const chatWindow = this._createChatWindow();
+            this.container.appendChild(chatWindow);
+
+            // Add to DOM
+            document.body.appendChild(this.container);
+
+            // Apply theme colors
+            this._applyTheme();
+
+            // Load existing chat history
+            if (this.config.chatHistory?.length > 0) {
+                this._loadHistory(this.config.chatHistory);
+            }
+
+            // Set up event listeners
+            this._setupEventListeners();
+
+            // Enable dragging if configured
+            if (this.config.draggable) {
+                this._enableDragging(toggleBtn);
+            }
+
+            // Enable resizing if configured
+            if (this.config.resizable) {
+                this._enableResizing();
+            }
+
+            // Open on load if configured
+            if (this.config.openOnLoad) {
+                setTimeout(() => this.open(), 500);
+            }
+        }
+
+        /**
+         * Create the toggle button
+         */
+        _createToggleButton() {
+            const btn = createElement('button', {
+                id: 'ask-junkie-toggle',
+                className: 'ask-junkie-toggle',
+                'aria-label': 'Toggle Chat'
+            });
+
+            // Default icon URL (hosted on jsDelivr CDN from npm package)
+            const defaultIconUrl = 'https://cdn.jsdelivr.net/npm/ask-junkie-sdk@latest/dist/junkie-icon.png';
+            const iconUrl = this.config.toggleIcon || defaultIconUrl;
+
+            btn.innerHTML = `
+            <img class="icon-chat" src="${iconUrl}" alt="Chat" onerror="this.style.display='none';this.nextElementSibling.style.display='block';">
+            <svg class="icon-chat-fallback" viewBox="0 0 24 24" width="28" height="28" fill="white" style="display:none">
+                <path d="M20 2H4c-1.1 0-2 .9-2 2v18l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 14H6l-2 2V4h16v12z"/>
+            </svg>
+            <svg class="icon-close" viewBox="0 0 24 24" width="28" height="28" fill="white" style="display:none">
+                <path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/>
+            </svg>
+        `;
+
+            return btn;
+        }
+
+        /**
+         * Create the chat window
+         */
+        _createChatWindow() {
+            const window = createElement('div', {
+                id: 'ask-junkie-window',
+                className: 'ask-junkie-window'
+            });
+
+            window.style.display = 'none';
+
+            // Header
+            const header = createElement('div', { className: 'ask-junkie-header' });
+            const defaultAvatarUrl = 'https://cdn.jsdelivr.net/npm/ask-junkie-sdk@latest/dist/junkie-icon.png';
+            const avatarUrl = this.config.botAvatar || defaultAvatarUrl;
+            header.innerHTML = `
+            <div class="ask-junkie-avatar">
+                <img src="${escapeHtml(avatarUrl)}" alt="Bot">
+            </div>
+            <div class="ask-junkie-info">
+                <span class="ask-junkie-name">${escapeHtml(this.config.botName)}</span>
+                <span class="ask-junkie-status">Online • Ready to help</span>
+            </div>
+            <button class="ask-junkie-clear" title="Clear chat" style="display:none">
+                <svg viewBox="0 0 24 24" width="18" height="18" fill="currentColor">
+                    <path d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"/>
+                </svg>
+            </button>
+        `;
+            window.appendChild(header);
+
+            // Messages container
+            this.messagesContainer = createElement('div', {
+                id: 'ask-junkie-messages',
+                className: 'ask-junkie-messages'
+            });
+
+            // Add welcome message
+            const welcomeMsg = createElement('div', {
+                className: 'ask-junkie-message bot welcome'
+            });
+            welcomeMsg.innerHTML = `<div class="message-content">${escapeHtml(this.config.welcomeMessage)}</div>`;
+            this.messagesContainer.appendChild(welcomeMsg);
+
+            window.appendChild(this.messagesContainer);
+
+            // Input area
+            const inputArea = createElement('div', { className: 'ask-junkie-input-area' });
+
+            // Suggestions (animated or static based on config)
+            if (this.config.suggestions?.length > 0) {
+                if (this.config.animatedSuggestions) {
+                    // Animated marquee suggestions
+                    const suggestionsContainer = createElement('div', { className: 'ask-junkie-suggestions animated' });
+                    const marqueeWrapper = createElement('div', { className: 'ask-junkie-marquee-wrapper' });
+                    const marqueeContent = createElement('div', { className: 'ask-junkie-marquee-content' });
+
+                    // Double the suggestions for seamless loop
+                    const allSuggestions = [...this.config.suggestions, ...this.config.suggestions];
+
+                    allSuggestions.forEach(text => {
+                        const chip = createElement('button', {
+                            className: 'ask-junkie-chip',
+                            onClick: () => {
+                                this.input.value = text;
+                                this.input.focus();
+                            }
+                        }, [text]);
+                        marqueeContent.appendChild(chip);
+                    });
+
+                    marqueeWrapper.appendChild(marqueeContent);
+                    suggestionsContainer.appendChild(marqueeWrapper);
+
+                    // Pause animation on hover
+                    marqueeWrapper.addEventListener('mouseenter', () => {
+                        marqueeContent.style.animationPlayState = 'paused';
+                    });
+                    marqueeWrapper.addEventListener('mouseleave', () => {
+                        marqueeContent.style.animationPlayState = 'running';
+                    });
+
+                    inputArea.appendChild(suggestionsContainer);
+                } else {
+                    // Static suggestions
+                    const suggestionsContainer = createElement('div', { className: 'ask-junkie-suggestions' });
+                    this.config.suggestions.forEach(text => {
+                        const chip = createElement('button', {
+                            className: 'ask-junkie-chip',
+                            onClick: () => {
+                                this.input.value = text;
+                                this.input.focus();
+                            }
+                        }, [text]);
+                        suggestionsContainer.appendChild(chip);
+                    });
+                    inputArea.appendChild(suggestionsContainer);
+                }
+            }
+
+            // Input row
+            const inputRow = createElement('div', { className: 'ask-junkie-input-row' });
+
+            this.input = createElement('input', {
+                type: 'text',
+                id: 'ask-junkie-input',
+                placeholder: 'Type your message...',
+                autocomplete: 'off'
+            });
+            inputRow.appendChild(this.input);
+
+            // Voice input button (if enabled)
+            if (this.config.voiceInput && 'webkitSpeechRecognition' in window) {
+                const micBtn = createElement('button', {
+                    className: 'ask-junkie-mic',
+                    title: 'Voice input',
+                    onClick: () => this._startVoiceInput()
+                });
+                micBtn.innerHTML = `<svg viewBox="0 0 24 24" width="20" height="20" fill="currentColor"><path d="M12 14c1.66 0 3-1.34 3-3V5c0-1.66-1.34-3-3-3S9 3.34 9 5v6c0 1.66 1.34 3 3 3zm-1-9c0-.55.45-1 1-1s1 .45 1 1v6c0 .55-.45 1-1 1s-1-.45-1-1V5zm6 6c0 2.76-2.24 5-5 5s-5-2.24-5-5H5c0 3.53 2.61 6.43 6 6.92V21h2v-3.08c3.39-.49 6-3.39 6-6.92h-2z"/></svg>`;
+                inputRow.appendChild(micBtn);
+            }
+
+            // Send button
+            const sendBtn = createElement('button', {
+                className: 'ask-junkie-send',
+                onClick: () => this._sendMessage()
+            });
+            sendBtn.innerHTML = `<svg viewBox="0 0 24 24" width="20" height="20" fill="white"><path d="M2.01 21L23 12 2.01 3 2 10l15 2-15 2z"/></svg>`;
+            inputRow.appendChild(sendBtn);
+
+            inputArea.appendChild(inputRow);
+            window.appendChild(inputArea);
+
+            return window;
+        }
+
+        /**
+         * Set up event listeners
+         */
+        _setupEventListeners() {
+            const toggleBtn = this.container.querySelector('#ask-junkie-toggle');
+            const clearBtn = this.container.querySelector('.ask-junkie-clear');
+
+            // Toggle button
+            toggleBtn.addEventListener('click', () => {
+                if (!this.isDragging) {
+                    this.toggle();
+                }
+            });
+
+            // Input enter key
+            this.input.addEventListener('keypress', (e) => {
+                if (e.key === 'Enter') {
+                    this._sendMessage();
+                }
+            });
+
+            // Clear button
+            if (clearBtn) {
+                clearBtn.addEventListener('click', (e) => {
+                    e.stopPropagation();
+                    if (confirm('Clear all chat history?')) {
+                        this._clearMessages();
+                        if (this.config.onClearHistory) {
+                            this.config.onClearHistory();
+                        }
+                    }
+                });
+            }
+        }
+
+        /**
+         * Apply position from config
+         */
+        _applyPosition() {
+            const pos = this.config.position || 'bottom-right';
+            const [vertical, horizontal] = pos.split('-');
+
+            this.container.style[vertical] = '24px';
+            this.container.style[horizontal] = '24px';
+            this.container.setAttribute('data-position', pos);
+        }
+
+        /**
+         * Apply theme colors
+         */
+        _applyTheme() {
+            const theme = this.config.theme;
+            let gradient;
+
+            if (theme.mode === 'solid') {
+                gradient = theme.primary;
+            } else {
+                gradient = `linear-gradient(135deg, ${theme.primary}, ${theme.secondary})`;
+            }
+
+            // Apply to toggle button and header
+            const toggleBtn = this.container.querySelector('.ask-junkie-toggle');
+            const header = this.container.querySelector('.ask-junkie-header');
+            const sendBtn = this.container.querySelector('.ask-junkie-send');
+
+            if (toggleBtn) toggleBtn.style.background = gradient;
+            if (header) header.style.background = gradient;
+            if (sendBtn) sendBtn.style.background = gradient;
+
+            // Set CSS variable for consistency
+            this.container.style.setProperty('--ask-junkie-primary', theme.primary);
+            this.container.style.setProperty('--ask-junkie-secondary', theme.secondary);
+        }
+
+        /**
+         * Send a message
+         */
+        _sendMessage() {
+            const message = this.input.value.trim();
+            if (!message) return;
+
+            // Add user message to UI
+            this.addMessage(message, 'user');
+            this.input.value = '';
+
+            // Update clear button visibility
+            this._updateClearButton();
+
+            // Trigger callback
+            if (this.config.onSendMessage) {
+                this.config.onSendMessage(message);
+            }
+        }
+
+        /**
+         * Add a message to the chat
+         */
+        addMessage(text, sender = 'bot') {
+            const msgDiv = createElement('div', {
+                className: `ask-junkie-message ${sender}`
+            });
+
+            const content = createElement('div', { className: 'message-content' });
+
+            if (sender === 'bot') {
+                content.innerHTML = formatBotResponse(text);
+            } else {
+                content.textContent = text;
+            }
+
+            msgDiv.appendChild(content);
+            this.messagesContainer.appendChild(msgDiv);
+            this.messagesContainer.scrollTop = this.messagesContainer.scrollHeight;
+
+            this._updateClearButton();
+        }
+
+        /**
+         * Show typing indicator
+         */
+        showTyping() {
+            const typing = createElement('div', {
+                className: 'ask-junkie-message bot typing',
+                id: 'ask-junkie-typing'
+            });
+            typing.innerHTML = `
+            <div class="message-content">
+                <div class="typing-dots">
+                    <span></span><span></span><span></span>
+                </div>
+            </div>
+        `;
+            this.messagesContainer.appendChild(typing);
+            this.messagesContainer.scrollTop = this.messagesContainer.scrollHeight;
+        }
+
+        /**
+         * Hide typing indicator
+         */
+        hideTyping() {
+            const typing = document.getElementById('ask-junkie-typing');
+            if (typing) typing.remove();
+        }
+
+        /**
+         * Load chat history
+         */
+        _loadHistory(history) {
+            history.forEach(msg => {
+                const sender = msg.role === 'assistant' ? 'bot' : 'user';
+                this.addMessage(msg.content, sender);
+            });
+            this._updateClearButton();
+        }
+
+        /**
+         * Clear messages
+         */
+        _clearMessages() {
+            const messages = this.messagesContainer.querySelectorAll('.ask-junkie-message:not(.welcome)');
+            messages.forEach(m => m.remove());
+            this._updateClearButton();
+        }
+
+        /**
+         * Update clear button visibility
+         */
+        _updateClearButton() {
+            const clearBtn = this.container.querySelector('.ask-junkie-clear');
+            const hasMessages = this.messagesContainer.querySelectorAll('.ask-junkie-message:not(.welcome)').length > 0;
+            if (clearBtn) {
+                clearBtn.style.display = hasMessages ? 'flex' : 'none';
+            }
+        }
+
+        /**
+         * Start voice input
+         */
+        _startVoiceInput() {
+            if (!('webkitSpeechRecognition' in window)) return;
+
+            const recognition = new webkitSpeechRecognition();
+            recognition.continuous = false;
+            recognition.interimResults = false;
+
+            const micBtn = this.container.querySelector('.ask-junkie-mic');
+            if (micBtn) micBtn.classList.add('listening');
+
+            recognition.onresult = (event) => {
+                const transcript = event.results[0][0].transcript;
+                this.input.value = transcript;
+                this.input.focus();
+            };
+
+            recognition.onend = () => {
+                if (micBtn) micBtn.classList.remove('listening');
+            };
+
+            recognition.start();
+        }
+
+        /**
+         * Enable dragging
+         */
+        _enableDragging(toggleBtn) {
+            let startX, startY, startLeft, startTop;
+
+            const onMouseDown = (e) => {
+                if (this.isOpen) return;
+
+                startX = e.clientX || e.touches?.[0]?.clientX;
+                startY = e.clientY || e.touches?.[0]?.clientY;
+
+                const rect = this.container.getBoundingClientRect();
+                startLeft = rect.left;
+                startTop = rect.top;
+
+                document.addEventListener('mousemove', onMouseMove);
+                document.addEventListener('mouseup', onMouseUp);
+                document.addEventListener('touchmove', onMouseMove);
+                document.addEventListener('touchend', onMouseUp);
+            };
+
+            const onMouseMove = (e) => {
+                const clientX = e.clientX || e.touches?.[0]?.clientX;
+                const clientY = e.clientY || e.touches?.[0]?.clientY;
+
+                const deltaX = clientX - startX;
+                const deltaY = clientY - startY;
+
+                if (Math.abs(deltaX) > 5 || Math.abs(deltaY) > 5) {
+                    this.isDragging = true;
+                }
+
+                const newLeft = Math.max(0, Math.min(startLeft + deltaX, window.innerWidth - 70));
+                const newTop = Math.max(0, Math.min(startTop + deltaY, window.innerHeight - 70));
+
+                this.container.style.left = newLeft + 'px';
+                this.container.style.top = newTop + 'px';
+                this.container.style.right = 'auto';
+                this.container.style.bottom = 'auto';
+            };
+
+            const onMouseUp = () => {
+                document.removeEventListener('mousemove', onMouseMove);
+                document.removeEventListener('mouseup', onMouseUp);
+                document.removeEventListener('touchmove', onMouseMove);
+                document.removeEventListener('touchend', onMouseUp);
+
+                setTimeout(() => { this.isDragging = false; }, 100);
+            };
+
+            toggleBtn.addEventListener('mousedown', onMouseDown);
+            toggleBtn.addEventListener('touchstart', onMouseDown);
+        }
+
+        /**
+         * Enable resizing of chat window
+         */
+        _enableResizing() {
+            const chatWindow = this.container.querySelector('.ask-junkie-window');
+            if (!chatWindow) return;
+
+            // Create resize handle
+            const resizeHandle = createElement('div', { className: 'ask-junkie-resize-handle' });
+            resizeHandle.innerHTML = `<svg viewBox="0 0 24 24" width="12" height="12" fill="currentColor"><path d="M22,22H20V20H22V22M22,18H20V16H22V18M18,22H16V20H18V22M18,18H16V16H18V18M14,22H12V20H14V22M22,14H20V12H22V14Z"/></svg>`;
+            chatWindow.appendChild(resizeHandle);
+
+            // Load saved size from localStorage
+            const savedSize = localStorage.getItem('ask_junkie_chat_size');
+            if (savedSize) {
+                try {
+                    const { width, height } = JSON.parse(savedSize);
+                    chatWindow.style.width = width + 'px';
+                    chatWindow.style.height = height + 'px';
+                } catch (e) {
+                    // Ignore parse errors
+                }
+            }
+
+            let isResizing = false;
+            let startX, startY, startWidth, startHeight;
+
+            const onMouseDown = (e) => {
+                e.preventDefault();
+                e.stopPropagation();
+                isResizing = true;
+
+                startX = e.clientX || e.touches?.[0]?.clientX;
+                startY = e.clientY || e.touches?.[0]?.clientY;
+                startWidth = chatWindow.offsetWidth;
+                startHeight = chatWindow.offsetHeight;
+
+                document.addEventListener('mousemove', onMouseMove);
+                document.addEventListener('mouseup', onMouseUp);
+                document.addEventListener('touchmove', onMouseMove);
+                document.addEventListener('touchend', onMouseUp);
+            };
+
+            const onMouseMove = (e) => {
+                if (!isResizing) return;
+
+                const clientX = e.clientX || e.touches?.[0]?.clientX;
+                const clientY = e.clientY || e.touches?.[0]?.clientY;
+
+                // Calculate new dimensions (resizing from top-left corner)
+                const deltaX = startX - clientX;
+                const deltaY = startY - clientY;
+
+                const newWidth = Math.max(280, Math.min(startWidth + deltaX, window.innerWidth - 40));
+                const newHeight = Math.max(350, Math.min(startHeight + deltaY, window.innerHeight - 100));
+
+                chatWindow.style.width = newWidth + 'px';
+                chatWindow.style.height = newHeight + 'px';
+            };
+
+            const onMouseUp = () => {
+                if (isResizing) {
+                    // Save size to localStorage
+                    localStorage.setItem('ask_junkie_chat_size', JSON.stringify({
+                        width: chatWindow.offsetWidth,
+                        height: chatWindow.offsetHeight
+                    }));
+                }
+                isResizing = false;
+                document.removeEventListener('mousemove', onMouseMove);
+                document.removeEventListener('mouseup', onMouseUp);
+                document.removeEventListener('touchmove', onMouseMove);
+                document.removeEventListener('touchend', onMouseUp);
+            };
+
+            resizeHandle.addEventListener('mousedown', onMouseDown);
+            resizeHandle.addEventListener('touchstart', onMouseDown);
+        }
+
+        // ===== PUBLIC METHODS =====
+
+        open() {
+            this.isOpen = true;
+            const window = this.container.querySelector('.ask-junkie-window');
+            const chatIcon = this.container.querySelector('.icon-chat');
+            const closeIcon = this.container.querySelector('.icon-close');
+
+            window.style.display = 'flex';
+            chatIcon.style.display = 'none';
+            closeIcon.style.display = 'block';
+            this.input.focus();
+
+            if (this.config.onOpen) this.config.onOpen();
+        }
+
+        close() {
+            this.isOpen = false;
+            const window = this.container.querySelector('.ask-junkie-window');
+            const chatIcon = this.container.querySelector('.icon-chat');
+            const closeIcon = this.container.querySelector('.icon-close');
+
+            window.style.display = 'none';
+            chatIcon.style.display = 'block';
+            closeIcon.style.display = 'none';
+
+            if (this.config.onClose) this.config.onClose();
+        }
+
+        toggle() {
+            if (this.isOpen) {
+                this.close();
+            } else {
+                this.open();
+            }
+        }
+
+        destroy() {
+            if (this.container) {
+                this.container.remove();
+                this.container = null;
+            }
+        }
+    }
+
+    /**
+     * Base AI Provider Interface
+     * All AI providers extend this class
+     */
+
+    class BaseProvider {
+        constructor(apiKey, model = null, proxyUrl = null) {
+            this.apiKey = apiKey;
+            this.model = model || this.getDefaultModel();
+            this.proxyUrl = proxyUrl;
+        }
+
+        /**
+         * Get the default model for this provider
+         */
+        getDefaultModel() {
+            throw new Error('getDefaultModel must be implemented by subclass');
+        }
+
+        /**
+         * Get the API endpoint URL
+         */
+        getEndpoint() {
+            throw new Error('getEndpoint must be implemented by subclass');
+        }
+
+        /**
+         * Send a message to the AI provider
+         * @param {string} message - User message
+         * @param {string} context - System context/prompt
+         * @param {Array} history - Conversation history
+         * @returns {Promise<string>} AI response
+         */
+        async sendMessage(message, context, history = []) {
+            throw new Error('sendMessage must be implemented by subclass');
+        }
+
+        /**
+         * Make HTTP request (supports proxy mode)
+         */
+        async _fetch(url, options) {
+            this.proxyUrl || url;
+
+            if (this.proxyUrl) {
+                // Proxy mode - send the original URL and options to proxy
+                return fetch(this.proxyUrl, {
+                    method: 'POST',
+                    headers: { 'Content-Type': 'application/json' },
+                    body: JSON.stringify({
+                        targetUrl: url,
+                        ...options
+                    })
+                });
+            }
+
+            return fetch(url, options);
+        }
+
+        /**
+         * Format conversation history for chat API
+         */
+        _formatHistory(history) {
+            return history.map(msg => ({
+                role: msg.role === 'assistant' ? 'assistant' : 'user',
+                content: msg.content
+            }));
+        }
+    }
+
+    /**
+     * Groq AI Provider
+     * Fast LLM inference using Groq Cloud
+     */
+
+
+    class GroqProvider extends BaseProvider {
+        getDefaultModel() {
+            return 'openai/gpt-oss-120b';
+        }
+
+        getEndpoint() {
+            return 'https://api.groq.com/openai/v1/chat/completions';
+        }
+
+        async sendMessage(message, context, history = []) {
+            const messages = [
+                { role: 'system', content: context },
+                ...this._formatHistory(history),
+                { role: 'user', content: message }
+            ];
+
+            const response = await this._fetch(this.getEndpoint(), {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json',
+                    'Authorization': `Bearer ${this.apiKey}`
+                },
+                body: JSON.stringify({
+                    model: this.model,
+                    messages: messages,
+                    temperature: 0.7,
+                    max_tokens: 1000
+                })
+            });
+
+            if (!response.ok) {
+                const error = await response.json().catch(() => ({}));
+                throw new Error(error.error?.message || `Groq API error: ${response.status}`);
+            }
+
+            const data = await response.json();
+
+            if (data.choices?.[0]?.message?.content) {
+                return data.choices[0].message.content;
+            }
+
+            throw new Error('Invalid response from Groq API');
+        }
+    }
+
+    /**
+     * Google Gemini AI Provider
+     */
+
+
+    class GeminiProvider extends BaseProvider {
+        getDefaultModel() {
+            return 'gemini-1.5-flash';
+        }
+
+        getEndpoint() {
+            return `https://generativelanguage.googleapis.com/v1beta/models/${this.model}:generateContent`;
+        }
+
+        async sendMessage(message, context, history = []) {
+            // Build conversation text
+            let fullPrompt = context + '\n\n';
+
+            history.forEach(msg => {
+                const role = msg.role === 'user' ? 'User' : 'Assistant';
+                fullPrompt += `${role}: ${msg.content}\n`;
+            });
+
+            fullPrompt += `User: ${message}`;
+
+            const url = `${this.getEndpoint()}?key=${this.apiKey}`;
+
+            const response = await this._fetch(url, {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json'
+                },
+                body: JSON.stringify({
+                    contents: [{
+                        parts: [{ text: fullPrompt }]
+                    }],
+                    generationConfig: {
+                        temperature: 0.7,
+                        maxOutputTokens: 1000
+                    }
+                })
+            });
+
+            if (!response.ok) {
+                const error = await response.json().catch(() => ({}));
+                throw new Error(error.error?.message || `Gemini API error: ${response.status}`);
+            }
+
+            const data = await response.json();
+
+            if (data.candidates?.[0]?.content?.parts?.[0]?.text) {
+                return data.candidates[0].content.parts[0].text;
+            }
+
+            throw new Error('Invalid response from Gemini API');
+        }
+    }
+
+    /**
+     * OpenAI Provider
+     * GPT-3.5 and GPT-4 models
+     */
+
+
+    class OpenAIProvider extends BaseProvider {
+        getDefaultModel() {
+            return 'gpt-3.5-turbo';
+        }
+
+        getEndpoint() {
+            return 'https://api.openai.com/v1/chat/completions';
+        }
+
+        async sendMessage(message, context, history = []) {
+            const messages = [
+                { role: 'system', content: context },
+                ...this._formatHistory(history),
+                { role: 'user', content: message }
+            ];
+
+            const response = await this._fetch(this.getEndpoint(), {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json',
+                    'Authorization': `Bearer ${this.apiKey}`
+                },
+                body: JSON.stringify({
+                    model: this.model,
+                    messages: messages,
+                    temperature: 0.7,
+                    max_tokens: 1000
+                })
+            });
+
+            if (!response.ok) {
+                const error = await response.json().catch(() => ({}));
+                throw new Error(error.error?.message || `OpenAI API error: ${response.status}`);
+            }
+
+            const data = await response.json();
+
+            if (data.choices?.[0]?.message?.content) {
+                return data.choices[0].message.content;
+            }
+
+            throw new Error('Invalid response from OpenAI API');
+        }
+    }
+
+    /**
+     * OpenRouter Provider
+     * Access multiple AI models through one API
+     */
+
+
+    class OpenRouterProvider extends BaseProvider {
+        getDefaultModel() {
+            return 'meta-llama/llama-3-8b-instruct';
+        }
+
+        getEndpoint() {
+            return 'https://openrouter.ai/api/v1/chat/completions';
+        }
+
+        async sendMessage(message, context, history = []) {
+            const messages = [
+                { role: 'system', content: context },
+                ...this._formatHistory(history),
+                { role: 'user', content: message }
+            ];
+
+            const response = await this._fetch(this.getEndpoint(), {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json',
+                    'Authorization': `Bearer ${this.apiKey}`,
+                    'HTTP-Referer': window.location.origin,
+                    'X-Title': document.title || 'Ask Junkie Chatbot'
+                },
+                body: JSON.stringify({
+                    model: this.model,
+                    messages: messages,
+                    temperature: 0.7,
+                    max_tokens: 1000
+                })
+            });
+
+            if (!response.ok) {
+                const error = await response.json().catch(() => ({}));
+                throw new Error(error.error?.message || `OpenRouter API error: ${response.status}`);
+            }
+
+            const data = await response.json();
+
+            if (data.choices?.[0]?.message?.content) {
+                return data.choices[0].message.content;
+            }
+
+            throw new Error('Invalid response from OpenRouter API');
+        }
+    }
+
+    /**
+     * AI Provider Factory
+     * Creates the appropriate AI provider based on configuration
+     */
+
+
+    class AIProviderFactory {
+        static providers = {
+            groq: GroqProvider,
+            gemini: GeminiProvider,
+            openai: OpenAIProvider,
+            openrouter: OpenRouterProvider
+        };
+
+        /**
+         * Create an AI provider instance
+         * @param {string} providerName - Provider name (groq, gemini, openai, openrouter)
+         * @param {string} apiKey - API key for the provider
+         * @param {string|null} model - Optional model override
+         * @param {string|null} proxyUrl - Optional proxy URL
+         */
+        static create(providerName, apiKey, model = null, proxyUrl = null) {
+            const Provider = AIProviderFactory.providers[providerName.toLowerCase()];
+
+            if (!Provider) {
+                console.warn(`[AskJunkie] Unknown provider "${providerName}", falling back to Groq`);
+                return new GroqProvider(apiKey, model, proxyUrl);
+            }
+
+            return new Provider(apiKey, model, proxyUrl);
+        }
+
+        /**
+         * Get list of supported providers
+         */
+        static getSupportedProviders() {
+            return Object.keys(AIProviderFactory.providers);
+        }
+    }
+
+    /**
+     * Firebase Analytics Logger
+     * Logs chat interactions to Firebase Firestore for centralized analytics
+     */
+
+    class FirebaseLogger {
+        static FIREBASE_API_KEY = 'AIzaSyDPDWA7s6dauaPup9DFz0hMrQvDYPtEWwo';
+        static FIREBASE_PROJECT_ID = 'ai-chatbot-fe4a2';
+
+        constructor(config = {}) {
+            this.enabled = config.enabled !== false;
+            this.siteId = config.siteId || this._getSiteId();
+            this.userId = config.userId || null; // User ID from sdkKeys lookup
+            this.registered = false;
+        }
+
+        /**
+         * Get a sanitized site ID from hostname
+         */
+        _getSiteId() {
+            return window.location.hostname.replace(/[^a-zA-Z0-9.-]/g, '_');
+        }
+
+        /**
+         * Get Firestore REST API endpoint
+         */
+        _getEndpoint(path) {
+            return `https://firestore.googleapis.com/v1/projects/${FirebaseLogger.FIREBASE_PROJECT_ID}/databases/(default)/documents/${path}?key=${FirebaseLogger.FIREBASE_API_KEY}`;
+        }
+
+        /**
+         * Get the base path for this API key's data
+         * Uses new nested structure: users/{userId}/apiKeys/{keyId}
+         */
+        _getBasePath() {
+            if (this.userId && this.siteId) {
+                return `users/${this.userId}/apiKeys/${this.siteId}`;
+            }
+            // Fallback to old structure for backwards compatibility
+            return `sites/${this.siteId}`;
+        }
+
+        /**
+         * Register or update site analytics info
+         * For new user-based path, we SKIP this to avoid overwriting dashboard data
+         * Only used for legacy sites/ path
+         */
+        async registerSite() {
+            if (this.registered) return;
+
+            // Skip registration for new user-based path - dashboard already created the document
+            // Only the chats subcollection should be written to
+            if (this.userId && this.siteId) {
+                console.log('[AskJunkie] Skipping site registration for SDK-managed key');
+                this.registered = true;
+                return;
+            }
+
+            // Legacy path: sites/{siteId} - still needs registration
+            try {
+                const url = this._getEndpoint(this._getBasePath());
+
+                await fetch(url, {
+                    method: 'PATCH',
+                    headers: { 'Content-Type': 'application/json' },
+                    body: JSON.stringify({
+                        fields: {
+                            domain: { stringValue: window.location.hostname },
+                            site_name: { stringValue: document.title || 'Unknown' },
+                            site_url: { stringValue: window.location.origin },
+                            sdk_version: { stringValue: '1.1.6' },
+                            platform: { stringValue: 'JavaScript SDK' },
+                            last_active: { stringValue: new Date().toISOString() }
+                        }
+                    })
+                });
+
+                this.registered = true;
+            } catch (error) {
+                console.warn('[AskJunkie] Failed to register site:', error);
+            }
+        }
+
+        /**
+         * Log a chat interaction
+         */
+        async logChat(data) {
+            if (!this.enabled) return;
+
+            // Ensure site is registered first
+            await this.registerSite();
+
+            try {
+                const url = this._getEndpoint(`${this._getBasePath()}/chats`);
+
+                await fetch(url, {
+                    method: 'POST',
+                    headers: { 'Content-Type': 'application/json' },
+                    body: JSON.stringify({
+                        fields: {
+                            session_id: { stringValue: data.sessionId || 'unknown' },
+                            user_message: { stringValue: data.userMessage || '' },
+                            ai_response: { stringValue: data.aiResponse || '' },
+                            page_url: { stringValue: data.pageUrl || window.location.href },
+                            timestamp: { stringValue: new Date().toISOString() },
+                            user_agent: { stringValue: navigator.userAgent || '' }
+                        }
+                    })
+                });
+            } catch (error) {
+                console.warn('[AskJunkie] Failed to log chat:', error);
+            }
+        }
+    }
+
+    /**
+     * Storage Manager
+     * Handles localStorage operations with prefix and session management
+     */
+
+    class StorageManager {
+        constructor(prefix = 'ask_junkie_') {
+            this.prefix = prefix;
+            this.sessionId = null;
+        }
+
+        /**
+         * Get a value from storage
+         */
+        get(key) {
+            try {
+                const item = localStorage.getItem(this.prefix + key);
+                return item ? JSON.parse(item) : null;
+            } catch (e) {
+                console.warn('[AskJunkie] Storage get error:', e);
+                return null;
+            }
+        }
+
+        /**
+         * Set a value in storage
+         */
+        set(key, value) {
+            try {
+                localStorage.setItem(this.prefix + key, JSON.stringify(value));
+                return true;
+            } catch (e) {
+                console.warn('[AskJunkie] Storage set error:', e);
+                return false;
+            }
+        }
+
+        /**
+         * Remove a value from storage
+         */
+        remove(key) {
+            try {
+                localStorage.removeItem(this.prefix + key);
+            } catch (e) {
+                console.warn('[AskJunkie] Storage remove error:', e);
+            }
+        }
+
+        /**
+         * Get or create a unique session ID
+         */
+        getSessionId() {
+            if (this.sessionId) return this.sessionId;
+
+            this.sessionId = this.get('session_id');
+
+            if (!this.sessionId) {
+                this.sessionId = 'sess_' +
+                    Math.random().toString(36).substring(2, 10) +
+                    '_' + Date.now().toString(36);
+                this.set('session_id', this.sessionId);
+            }
+
+            return this.sessionId;
+        }
+
+        /**
+         * Check if storage is available
+         */
+        isAvailable() {
+            try {
+                const test = '__storage_test__';
+                localStorage.setItem(test, test);
+                localStorage.removeItem(test);
+                return true;
+            } catch (e) {
+                return false;
+            }
+        }
+    }
+
+    /**
+     * Simple Event Emitter for SDK events
+     */
+
+    class EventEmitter {
+        constructor() {
+            this.events = {};
+        }
+
+        /**
+         * Subscribe to an event
+         */
+        on(event, callback) {
+            if (!this.events[event]) {
+                this.events[event] = [];
+            }
+            this.events[event].push(callback);
+            return () => this.off(event, callback);
+        }
+
+        /**
+         * Unsubscribe from an event
+         */
+        off(event, callback) {
+            if (!this.events[event]) return;
+            this.events[event] = this.events[event].filter(cb => cb !== callback);
+        }
+
+        /**
+         * Emit an event
+         */
+        emit(event, data) {
+            if (!this.events[event]) return;
+            this.events[event].forEach(callback => {
+                try {
+                    callback(data);
+                } catch (error) {
+                    console.error(`[AskJunkie] Event handler error for "${event}":`, error);
+                }
+            });
+        }
+
+        /**
+         * Subscribe to an event once
+         */
+        once(event, callback) {
+            const unsubscribe = this.on(event, (data) => {
+                unsubscribe();
+                callback(data);
+            });
+        }
+    }
+
+    /**
+     * Ask Junkie SDK - Main SDK Class
+     * Handles initialization, configuration, and orchestration
+     */
+
+
+    class AskJunkie {
+        static instance = null;
+        static VERSION = '1.1.1';
+
+        constructor() {
+            this.config = null;
+            this.widget = null;
+            this.aiProvider = null;
+            this.analytics = null;
+            this.storage = null;
+            this.events = new EventEmitter();
+            this.chatHistory = [];
+            this.isInitialized = false;
+            this.siteId = null;
+        }
+
+        /**
+         * Initialize the SDK with configuration
+         * @param {Object} config - Configuration options
+         */
+        static async init(config = {}) {
+            if (AskJunkie.instance && AskJunkie.instance.isInitialized) {
+                console.warn('[AskJunkie] Already initialized. Call destroy() first to reinitialize.');
+                return AskJunkie.instance;
+            }
+
+            AskJunkie.instance = new AskJunkie();
+
+            // Check if using sdkKey mode (fetches settings from dashboard)
+            if (config.sdkKey) {
+                await AskJunkie.instance._initializeWithSdkKey(config.sdkKey, config);
+            } else {
+                AskJunkie.instance._initialize(config);
+            }
+
+            return AskJunkie.instance;
+        }
+
+        /**
+         * Initialize using SDK key - fetches settings from Firebase dashboard
+         */
+        async _initializeWithSdkKey(sdkKey, overrides = {}) {
+            console.log('[AskJunkie] Initializing with SDK key...');
+
+            try {
+                // Fetch settings from Firebase
+                const settings = await this._fetchSettingsFromDashboard(sdkKey);
+
+                if (!settings) {
+                    console.error('[AskJunkie] Invalid SDK key or site not found.');
+                    return;
+                }
+
+                // Merge fetched settings with any overrides
+                const config = {
+                    apiKey: settings.providerApiKey,
+                    provider: settings.provider,
+                    model: settings.model,
+                    botName: settings.botName,
+                    welcomeMessage: settings.welcomeMessage,
+                    suggestions: settings.suggestions,
+                    animatedSuggestions: settings.animatedSuggestions,
+                    position: settings.position,
+                    draggable: settings.draggable,
+                    resizable: settings.resizable,
+                    voiceInput: settings.speechToText,  // Map speechToText to voiceInput
+                    enabled: settings.enabled,
+                    theme: settings.theme,
+                    context: settings.context,
+                    analytics: {
+                        enabled: true,
+                        siteId: this.siteId,
+                        userId: this.userId  // Pass userId for new nested path
+                    },
+                    ...overrides,
+                    _sdkKey: sdkKey
+                };
+
+                this._initialize(config);
+
+            } catch (error) {
+                console.error('[AskJunkie] Error fetching settings:', error);
+                if (overrides.onError) {
+                    overrides.onError(error);
+                }
+            }
+        }
+
+        /**
+         * Fetch settings from Firebase dashboard
+         */
+        async _fetchSettingsFromDashboard(sdkKey) {
+            const FIREBASE_PROJECT = 'ai-chatbot-fe4a2';
+            const API_URL = `https://firestore.googleapis.com/v1/projects/${FIREBASE_PROJECT}/databases/(default)/documents`;
+
+            try {
+                // Step 1: Get the key lookup from sdkKeys collection
+                // Document ID is the SDK key itself
+                const lookupUrl = `${API_URL}/sdkKeys/${sdkKey}`;
+                const lookupResponse = await fetch(lookupUrl);
+
+                if (!lookupResponse.ok) {
+                    console.error('[AskJunkie] SDK key not found in lookup');
+                    return null;
+                }
+
+                const lookupData = await lookupResponse.json();
+
+                if (!lookupData.fields) {
+                    console.error('[AskJunkie] SDK key not found');
+                    return null;
+                }
+
+                const userId = lookupData.fields.userId.stringValue;
+                const keyId = lookupData.fields.keyId.stringValue;
+                const status = lookupData.fields.status?.stringValue;
+
+                this.siteId = keyId;
+                this.userId = userId;
+
+                // Check if key is active
+                if (status !== 'active') {
+                    console.error('[AskJunkie] SDK key is not active');
+                    return null;
+                }
+
+                // Step 2: Fetch the full API key document with settings
+                const keyUrl = `${API_URL}/users/${userId}/apiKeys/${keyId}`;
+                const keyResponse = await fetch(keyUrl);
+
+                if (!keyResponse.ok) {
+                    console.error('[AskJunkie] Could not fetch API key details');
+                    return null;
+                }
+
+                const keyData = await keyResponse.json();
+
+                if (!keyData.fields) {
+                    console.error('[AskJunkie] API key document not found');
+                    return null;
+                }
+
+                // Settings are embedded in the API key document
+                if (!keyData.fields.settings) {
+                    console.warn('[AskJunkie] No settings configured in dashboard. Using defaults.');
+                    return this._getDefaultSettings();
+                }
+
+                // Parse Firestore format to plain object
+                return this._parseFirestoreSettings(keyData.fields.settings.mapValue.fields);
+
+            } catch (error) {
+                console.error('[AskJunkie] Error fetching from Firebase:', error);
+                return null;
+            }
+        }
+
+        /**
+         * Get default settings for SDK
+         */
+        _getDefaultSettings() {
+            return {
+                enabled: true,
+                botName: 'AI Assistant',
+                welcomeMessage: "Hi! 👋 I'm your AI assistant. How can I help you today?",
+                suggestions: [],
+                animatedSuggestions: true,
+                speechToText: true,
+                provider: 'groq',
+                providerApiKey: '', // User must provide in overrides
+                model: 'llama-3.3-70b-versatile',
+                position: 'bottom-right',
+                draggable: true,
+                resizable: false,
+                theme: {
+                    mode: 'gradient',
+                    preset: 1,
+                    primary: '#6366f1',
+                    secondary: '#ec4899'
+                },
+                context: {
+                    siteName: document.title || 'Website',
+                    siteDescription: '',
+                    customInfo: '',
+                    restrictions: ''
+                }
+            };
+        }
+
+        /**
+         * Parse Firestore document format to plain object
+         */
+        _parseFirestoreSettings(fields) {
+            const getString = (field) => field?.stringValue || '';
+            const getNumber = (field) => field?.integerValue || field?.doubleValue || 0;
+            const getBool = (field) => field?.booleanValue || false;
+            const getArray = (field) => {
+                if (!field?.arrayValue?.values) return [];
+                return field.arrayValue.values.map(v => v.stringValue || '');
+            };
+
+            const themeFields = fields.theme?.mapValue?.fields || {};
+            const contextFields = fields.context?.mapValue?.fields || {};
+
+            return {
+                enabled: fields.enabled?.booleanValue !== false, // Default true if not set
+                botName: getString(fields.botName) || 'AI Assistant',
+                welcomeMessage: getString(fields.welcomeMessage) || "Hi! 👋 I'm your AI assistant.",
+                suggestions: getArray(fields.suggestions),
+                animatedSuggestions: fields.animatedSuggestions?.booleanValue !== false, // Default true
+                speechToText: fields.speechToText?.booleanValue !== false, // Default true
+                provider: getString(fields.provider) || 'groq',
+                providerApiKey: getString(fields.providerApiKey),
+                model: getString(fields.model),
+                position: getString(fields.position) || 'bottom-right',
+                draggable: getBool(fields.draggable),
+                resizable: getBool(fields.resizable),
+                theme: {
+                    mode: getString(themeFields.mode) || 'gradient',
+                    preset: getNumber(themeFields.preset) || 1,
+                    primary: getString(themeFields.primary) || '#6366f1',
+                    secondary: getString(themeFields.secondary) || '#ec4899'
+                },
+                context: {
+                    siteName: getString(contextFields.siteName),
+                    siteDescription: getString(contextFields.siteDescription),
+                    customInfo: getString(contextFields.customInfo),
+                    restrictions: getString(contextFields.restrictions)
+                }
+            };
+        }
+
+        /**
+         * Internal initialization logic
+         */
+        _initialize(config) {
+            // Merge with defaults
+            this.config = this._mergeConfig(config);
+
+            // Check if chatbot is enabled
+            if (this.config.enabled === false) {
+                console.log('[AskJunkie] Chatbot is disabled in settings. Widget will not render.');
+                this.isInitialized = true;
+                return;
+            }
+
+            // Validate required config
+            if (!this.config.apiKey && !this.config._sdkKey) {
+                console.error('[AskJunkie] API key or SDK key is required.');
+                return;
+            }
+
+            // Initialize storage manager
+            this.storage = new StorageManager(this.config.storagePrefix);
+
+            // Load chat history from storage
+            this.chatHistory = this.storage.get('chat_history') || [];
+
+            // Initialize AI provider
+            this.aiProvider = AIProviderFactory.create(
+                this.config.provider,
+                this.config.apiKey,
+                this.config.model,
+                this.config.proxyUrl
+            );
+
+            // Initialize Firebase analytics (if enabled)
+            if (this.config.analytics.enabled) {
+                this.analytics = new FirebaseLogger(this.config.analytics);
+            }
+
+            // Create and render the chat widget
+            this.widget = new ChatWidget({
+                ...this.config,
+                onSendMessage: (message) => this._handleUserMessage(message),
+                onClearHistory: () => this._clearHistory(),
+                chatHistory: this.chatHistory
+            });
+
+            this.widget.render();
+
+            this.isInitialized = true;
+            this.events.emit('ready');
+
+            if (this.config.onReady) {
+                this.config.onReady();
+            }
+
+            console.log(`[AskJunkie] SDK v${AskJunkie.VERSION} initialized successfully`);
+        }
+
+        /**
+         * Merge user config with defaults
+         */
+        _mergeConfig(userConfig) {
+            const defaults = {
+                // Required
+                apiKey: null,
+
+                // Master enable flag
+                enabled: true,
+
+                // AI Provider
+                provider: 'groq',
+                model: null, // Will use provider default
+
+                // Appearance
+                botName: 'AI Assistant',
+                botAvatar: null, // URL to custom avatar
+                welcomeMessage: "Hi! 👋 I'm your AI assistant. How can I help you today?",
+                position: 'bottom-right',
+                theme: {
+                    mode: 'gradient',
+                    preset: 1,
+                    primary: '#6366f1',
+                    secondary: '#ec4899'
+                },
+
+                // Behavior
+                draggable: false,
+                resizable: false,
+                persistChat: true,
+                voiceInput: true,
+                suggestions: [],
+                animatedSuggestions: true,
+                openOnLoad: false,
+
+                // Context for AI
+                context: {
+                    siteName: document.title || 'Website',
+                    siteDescription: '',
+                    customInfo: '',
+                    restrictions: ''
+                },
+
+                // Analytics
+                analytics: {
+                    enabled: true,
+                    siteId: window.location.hostname.replace(/[^a-zA-Z0-9.-]/g, '_')
+                },
+
+                // Proxy mode (optional)
+                proxyUrl: null,
+
+                // Storage prefix
+                storagePrefix: 'ask_junkie_',
+
+                // Event callbacks
+                onReady: null,
+                onMessage: null,
+                onOpen: null,
+                onClose: null,
+                onError: null
+            };
+
+            // Deep merge theme object
+            const theme = { ...defaults.theme, ...(userConfig.theme || {}) };
+            const context = { ...defaults.context, ...(userConfig.context || {}) };
+            const analytics = { ...defaults.analytics, ...(userConfig.analytics || {}) };
+
+            return {
+                ...defaults,
+                ...userConfig,
+                theme,
+                context,
+                analytics
+            };
+        }
+
+        /**
+         * Handle user message submission
+         */
+        async _handleUserMessage(message) {
+            if (!message.trim()) return;
+
+            // Add user message to history
+            this.chatHistory.push({
+                role: 'user',
+                content: message,
+                timestamp: new Date().toISOString()
+            });
+
+            // Show typing indicator
+            this.widget.showTyping();
+
+            try {
+                // Build context string
+                const contextString = this._buildContext();
+
+                // Get AI response
+                const response = await this.aiProvider.sendMessage(
+                    message,
+                    contextString,
+                    this.chatHistory.slice(-10) // Send last 10 messages for context
+                );
+
+                // Add bot response to history
+                this.chatHistory.push({
+                    role: 'assistant',
+                    content: response,
+                    timestamp: new Date().toISOString()
+                });
+
+                // Display response
+                this.widget.hideTyping();
+                this.widget.addMessage(response, 'bot');
+
+                // Save to storage
+                if (this.config.persistChat) {
+                    this.storage.set('chat_history', this.chatHistory.slice(-50));
+                }
+
+                // Log to analytics
+                if (this.analytics) {
+                    this.analytics.logChat({
+                        userMessage: message,
+                        aiResponse: response,
+                        pageUrl: window.location.href,
+                        sessionId: this.storage.getSessionId()
+                    });
+                }
+
+                // Fire callback
+                if (this.config.onMessage) {
+                    this.config.onMessage(response, true);
+                }
+
+                this.events.emit('message', { message: response, isBot: true });
+
+            } catch (error) {
+                this.widget.hideTyping();
+                const errorMessage = 'Sorry, I encountered an error. Please try again.';
+                this.widget.addMessage(errorMessage, 'bot');
+
+                console.error('[AskJunkie] Error:', error);
+
+                if (this.config.onError) {
+                    this.config.onError(error);
+                }
+
+                this.events.emit('error', error);
+            }
+        }
+
+        /**
+         * Build AI context from configuration
+         */
+        _buildContext() {
+            const ctx = this.config.context;
+            let context = '';
+
+            context += `You are "${this.config.botName}", a friendly and helpful AI assistant for "${ctx.siteName}". `;
+            context += `Your personality is warm, professional, and knowledgeable. `;
+
+            context += `IMPORTANT IDENTITY RULES: `;
+            context += `1. Your name is ${this.config.botName}. `;
+            context += `2. If asked who created you, politely say you're an AI assistant designed to help with website inquiries. `;
+            context += `3. Stay focused on helping users with questions about this website. `;
+
+            if (ctx.siteDescription) {
+                context += `\n\nABOUT THIS WEBSITE: ${ctx.siteDescription} `;
+            }
+
+            if (ctx.customInfo) {
+                context += `\n\nADDITIONAL INFORMATION: ${ctx.customInfo} `;
+            }
+
+            if (ctx.restrictions) {
+                context += `\n\n🚫 RESTRICTIONS (follow strictly): ${ctx.restrictions} `;
+            }
+
+            context += `\n\nRESPONSE FORMATTING: `;
+            context += `1. Be professional and courteous. `;
+            context += `2. Use clear paragraphs with line breaks. `;
+            context += `3. For lists, use numbered points or bullets. `;
+            context += `4. For links, use markdown format: [Link Text](URL). `;
+            context += `5. Use **bold** for important terms. `;
+            context += `6. Keep responses helpful but concise. `;
+
+            return context;
+        }
+
+        /**
+         * Clear chat history
+         */
+        _clearHistory() {
+            this.chatHistory = [];
+            this.storage.remove('chat_history');
+            this.events.emit('clear');
+        }
+
+        // ===== PUBLIC API =====
+
+        /**
+         * Open the chat widget
+         */
+        static open() {
+            if (AskJunkie.instance?.widget) {
+                AskJunkie.instance.widget.open();
+            }
+        }
+
+        /**
+         * Close the chat widget
+         */
+        static close() {
+            if (AskJunkie.instance?.widget) {
+                AskJunkie.instance.widget.close();
+            }
+        }
+
+        /**
+         * Toggle the chat widget
+         */
+        static toggle() {
+            if (AskJunkie.instance?.widget) {
+                AskJunkie.instance.widget.toggle();
+            }
+        }
+
+        /**
+         * Send a message programmatically
+         */
+        static sendMessage(text) {
+            if (AskJunkie.instance) {
+                AskJunkie.instance.widget.addMessage(text, 'user');
+                AskJunkie.instance._handleUserMessage(text);
+            }
+        }
+
+        /**
+         * Update context dynamically
+         */
+        static setContext(newContext) {
+            if (AskJunkie.instance) {
+                AskJunkie.instance.config.context = {
+                    ...AskJunkie.instance.config.context,
+                    ...newContext
+                };
+            }
+        }
+
+        /**
+         * Subscribe to events
+         */
+        static on(event, callback) {
+            if (AskJunkie.instance) {
+                AskJunkie.instance.events.on(event, callback);
+            }
+        }
+
+        /**
+         * Destroy the SDK instance
+         */
+        static destroy() {
+            if (AskJunkie.instance) {
+                if (AskJunkie.instance.widget) {
+                    AskJunkie.instance.widget.destroy();
+                }
+                AskJunkie.instance.isInitialized = false;
+                AskJunkie.instance = null;
+                console.log('[AskJunkie] Destroyed');
+            }
+        }
+
+        /**
+         * Get SDK version
+         */
+        static getVersion() {
+            return AskJunkie.VERSION;
+        }
+    }
+
+    /**
+     * Ask Junkie SDK - Main Entry Point
+     * Universal AI Chatbot for any website
+     * 
+     * @author Junkies Coder
+     * @version 1.0.0
+     */
+
+
+    // Auto-attach to window for script tag usage
+    if (typeof window !== 'undefined') {
+        window.AskJunkie = AskJunkie;
+    }
+
+    exports.AskJunkie = AskJunkie;
+    exports.default = AskJunkie;
+
+    Object.defineProperty(exports, '__esModule', { value: true });
+
+}));
+//# sourceMappingURL=ask-junkie.min.js.map