acecoderz-chat-ui 1.0.5 → 1.0.8

package/README.md

@@ -11,6 +11,10 @@ A framework-agnostic, fully customizable chat UI package that works with React,
 - 🎯 **TypeScript** - Full TypeScript support
 - 📦 **Modular** - Import only what you need
 - ✅ **Package Manager Compatible** - Works with both npm and pnpm
+- 💾 **Message Persistence** - Automatic localStorage save/restore
+- ✂️ **Message Actions** - Copy, delete, and edit messages
+- ♿ **Accessible** - Full ARIA support and keyboard navigation
+- 🎭 **Improved Loading** - Animated indicators with accessibility
 
 ## Installation
 
@@ -189,17 +193,26 @@ const container = document.getElementById('chat-container');
 const chatUI = createChatUI({
   config: {
     apiUrl: 'http://localhost:3000/api',
+    enablePersistence: true, // Optional: Save messages to localStorage
+    storageKey: 'my-chat-app', // Optional: Custom storage key
   },
   theme: {
     primaryColor: '#3b82f6',
   },
   container,
+  // Optional: Enable message actions (copy, delete, edit)
+  enableMessageActions: true,
+  showCopyButton: true,
+  showDeleteButton: true,
+  showEditButton: true,
 });
 
 // Later, to destroy:
 // chatUI.destroy();
 ```
 
+**Note**: The vanilla adapter now handles form submission automatically - no workarounds needed! See [INTEGRATION_GUIDE.md](../../INTEGRATION_GUIDE.md) for complete integration examples.
+
 ### Core Only (Advanced)
 
 ```typescript
@@ -259,9 +272,103 @@ interface ChatConfig {
   onError?: (error: Error) => void; // Error callback
   enableWebSocket?: boolean;    // Enable WebSocket
   websocketUrl?: string;        // WebSocket URL
+  enablePersistence?: boolean;  // Enable localStorage persistence (default: false)
+  storageKey?: string;          // Storage key prefix (default: 'chat-ui')
 }
 ```
 
+## New Features
+
+### Message Persistence
+
+Automatically save and restore conversations across page reloads:
+
+```javascript
+const chatUI = createChatUI({
+  config: {
+    apiUrl: '/api/chat',
+    enablePersistence: true, // Enable localStorage
+    storageKey: 'my-app', // Optional: custom key
+  },
+  container: document.getElementById('chat'),
+});
+```
+
+### Message Actions
+
+Enable copy, delete, and edit buttons on messages:
+
+```javascript
+const chatUI = createChatUI({
+  config: { apiUrl: '/api/chat' },
+  container: document.getElementById('chat'),
+  enableMessageActions: true,
+  showCopyButton: true,
+  showDeleteButton: true,
+  showEditButton: true,
+  onMessageCopy: (message) => console.log('Copied:', message.content),
+  onMessageDelete: (message) => console.log('Deleted:', message.id),
+  onMessageEdit: (message, newContent) => console.log('Edited:', newContent),
+});
+```
+
+### Initial Greeting
+
+Display a welcome message when the chat first opens:
+
+**Vanilla JS:**
+```javascript
+const chatUI = createChatUI({
+  config: { apiUrl: '/api/chat' },
+  container: document.getElementById('chat'),
+  initialGreeting: "Hello! 👋 I'm your assistant. How can I help you today?",
+});
+```
+
+**React:**
+```tsx
+<ChatUI
+  config={config}
+  initialGreeting="Hello! 👋 I'm your assistant. How can I help you today?"
+/>
+```
+
+The greeting will:
+- Appear automatically when the chat opens
+- Only show once per conversation
+- Reappear after clearing the chat
+- Not trigger an API call (it's a local message)
+
+### Improved Loading States
+
+- Animated loading indicators
+- Better accessibility with ARIA live regions
+- Smooth transitions
+
+See [NEW_FEATURES.md](./NEW_FEATURES.md) for complete feature documentation.
+
+## Integration Guide
+
+For complete integration instructions, examples, and troubleshooting, see the [Integration Guide](../../INTEGRATION_GUIDE.md).
+
+The integration guide includes:
+- Complete vanilla JS examples with modal
+- React integration examples
+- Backend configuration
+- Feature documentation
+- Troubleshooting guide
+
+### Laravel Integration
+
+For Laravel-specific integration with modal interface, event handling, and CORS configuration, see [LARAVEL_INTEGRATION.md](./LARAVEL_INTEGRATION.md).
+
+The Laravel integration guide includes:
+- Complete setup instructions
+- Blade template examples
+- Event handling for Laravel forms
+- CORS configuration
+- Troubleshooting common issues
+
 ## Customization
 
 ### Custom Message Renderer (React)

package/dist/adapters/react/ChatUI.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChatUI.d.ts","sourceRoot":"","sources":["../../../adapters/react/ChatUI.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,UAAU,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAuD3E,MAAM,WAAW,WAAW;IAC1B,MAAM,EAAE,UAAU,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IACtC,eAAe,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,0BAA0B,CAAC,EAAE,MAAM,CAAC;IACpC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAE7B,qBAAqB,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,KAAK,CAAC,SAAS,CAAC;IAC9D,mBAAmB,CAAC,EAAE,CAAC,KAAK,EAAE;QAC5B,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;QAClC,MAAM,EAAE,MAAM,IAAI,CAAC;QACnB,QAAQ,EAAE,OAAO,CAAC;KACnB,KAAK,KAAK,CAAC,SAAS,CAAC;IAEtB,cAAc,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CACzC;AAED,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAsPxC,CAAC"}
+{"version":3,"file":"ChatUI.d.ts","sourceRoot":"","sources":["../../../adapters/react/ChatUI.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,UAAU,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAuD3E,MAAM,WAAW,WAAW;IAC1B,MAAM,EAAE,UAAU,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IACtC,eAAe,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,0BAA0B,CAAC,EAAE,MAAM,CAAC;IACpC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAE7B,qBAAqB,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,KAAK,CAAC,SAAS,CAAC;IAC9D,mBAAmB,CAAC,EAAE,CAAC,KAAK,EAAE;QAC5B,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;QAClC,MAAM,EAAE,MAAM,IAAI,CAAC;QACnB,QAAQ,EAAE,OAAO,CAAC;KACnB,KAAK,KAAK,CAAC,SAAS,CAAC;IAEtB,cAAc,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CACzC;AAED,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAsQxC,CAAC"}

package/dist/adapters/react/ChatUI.js

@@ -39,24 +39,36 @@ const MarkdownContent = ({ content }) => {
 };
 export const ChatUI = ({ config, theme = {}, className = '', placeholder = 'Type your message...', showTimestamp = true, showAvatar = true, userAvatar, assistantAvatar, maxHeight = '600px', disabled = false, initialGreeting, messagesContainerClassName = '', messageClassName = '', inputContainerClassName = '', inputClassName = '', buttonClassName = '', errorClassName = '', emptyStateClassName = '', customMessageRenderer, customInputRenderer, dataAttributes = {}, }) => {
     const { messages, input, isLoading, error, sendMessage, setInput, addMessage, } = useChat(config);
-    // Track if we've already added the initial greeting for the current initialGreeting value
-    const greetingAddedRef = React.useRef(null);
-    // Add initial greeting message when component mounts
+    // Track if we've already added the initial greeting
+    const greetingAddedRef = React.useRef(false);
+    const previousInitialGreetingRef = React.useRef(initialGreeting);
+    const messagesInitializedRef = React.useRef(false);
+    // Reset greeting flag if initialGreeting prop changes
+    if (previousInitialGreetingRef.current !== initialGreeting) {
+        greetingAddedRef.current = false;
+        previousInitialGreetingRef.current = initialGreeting;
+    }
+    // Mark when messages are initialized (loaded from storage or empty)
+    React.useEffect(() => {
+        if (messages.length >= 0) {
+            messagesInitializedRef.current = true;
+        }
+    }, [messages.length]);
+    // Add initial greeting message once when component mounts and messages are ready
     React.useEffect(() => {
-        if (!initialGreeting) {
-            greetingAddedRef.current = null;
+        // Skip if no greeting or already added
+        if (!initialGreeting || greetingAddedRef.current) {
+            return;
+        }
+        // Wait for messages to be initialized
+        if (!messagesInitializedRef.current) {
             return;
         }
         // Check if there's already a greeting message with the same content
         const hasGreeting = messages.some(msg => msg.role === 'assistant' && msg.content === initialGreeting);
-        // Only add greeting if:
-        // 1. We haven't already added this specific greeting (tracked by ref)
-        // 2. There's no existing greeting message with the same content
-        // 3. Messages array is empty
-        if (greetingAddedRef.current !== initialGreeting &&
-            !hasGreeting &&
-            messages.length === 0) {
-            greetingAddedRef.current = initialGreeting;
+        // Add greeting if it doesn't already exist
+        if (!hasGreeting) {
+            greetingAddedRef.current = true;
             const greetingMessage = {
                 id: `greeting-${Date.now()}`,
                 content: initialGreeting,
@@ -65,6 +77,10 @@ export const ChatUI = ({ config, theme = {}, className = '', placeholder = 'Type
             };
             addMessage(greetingMessage);
         }
+        else {
+            // If greeting already exists, mark as added
+            greetingAddedRef.current = true;
+        }
     }, [initialGreeting, messages, addMessage]);
     const handleSubmit = (e) => {
         e.preventDefault();

package/dist/adapters/vanilla/createChatUI.d.ts

@@ -0,0 +1,3 @@
+import type { ChatUIOptions, ChatUIInstance } from './types.js';
+export declare function createChatUI(options: ChatUIOptions): ChatUIInstance;
+//# sourceMappingURL=createChatUI.d.ts.map

package/dist/adapters/vanilla/createChatUI.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createChatUI.d.ts","sourceRoot":"","sources":["../../../adapters/vanilla/createChatUI.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;AAOhE,wBAAgB,YAAY,CAAC,OAAO,EAAE,aAAa,GAAG,cAAc,CAgWnE"}

package/dist/adapters/vanilla/createChatUI.js

@@ -0,0 +1,292 @@
+import { ChatEngine } from '../../core/src/ChatEngine';
+import { escapeHtml, getContainerElement } from './utils.js';
+import { applyTheme } from './theme.js';
+import { renderAvatar, renderMessage } from './renderers.js';
+import { createMessageActionHelpers } from './message-actions.js';
+import { attachEventHandlers } from './event-handlers.js';
+export function createChatUI(options) {
+    console.log('[ChatUI] createChatUI called', { container: options.container });
+    const { config, theme = {}, container, placeholder = 'Type your message...', showTimestamp = true, showAvatar = true, userAvatar, assistantAvatar, maxHeight = '600px', disabled = false, autoScroll = true, enableMarkdown = true, showClearButton = true, emptyStateMessage = 'Start a conversation...', loadingMessage = 'Thinking...', customMessageRenderer, onInit, initialGreeting, enableMessageActions = false, showCopyButton = true, showDeleteButton = true, showEditButton = true, onMessageCopy, onMessageDelete, onMessageEdit, stopPropagationRoot, } = options;
+    const containerElement = getContainerElement(container);
+    console.log('[ChatUI] Container element found', {
+        containerElement: !!containerElement,
+        containerId: containerElement.id,
+    });
+    const engine = new ChatEngine(config);
+    let messagesContainer = null;
+    let inputElement = null;
+    let inputWrapperElement = null;
+    let sendButtonElement = null;
+    let clearButtonElement = null;
+    const isUpdatingInputProgrammatically = { current: false };
+    let greetingAdded = false;
+    let previousInitialGreeting = initialGreeting;
+    let messagesInitialized = false;
+    const eventHandlers = [];
+    const applyThemeToContainer = () => {
+        applyTheme(containerElement, theme, maxHeight);
+    };
+    const scrollToBottom = () => {
+        if (messagesContainer && autoScroll) {
+            messagesContainer.scrollTop = messagesContainer.scrollHeight;
+        }
+    };
+    const updateSendButtonState = () => {
+        if (sendButtonElement && inputElement) {
+            const domInput = inputElement.value || '';
+            const isLoading = engine.getIsLoading();
+            const shouldDisable = disabled || isLoading || !domInput.trim();
+            console.log('[ChatUI] updateSendButtonState', {
+                domInput,
+                domInputLength: domInput.length,
+                isLoading,
+                disabled,
+                shouldDisable,
+            });
+            if (shouldDisable) {
+                sendButtonElement.disabled = true;
+            }
+            else {
+                sendButtonElement.disabled = false;
+                sendButtonElement.removeAttribute('disabled');
+            }
+        }
+    };
+    const renderOpts = {
+        showAvatar,
+        userAvatar,
+        assistantAvatar,
+        enableMarkdown,
+        showTimestamp,
+        enableMessageActions,
+        showCopyButton,
+        showDeleteButton,
+        showEditButton,
+        customMessageRenderer,
+    };
+    const messageActions = enableMessageActions
+        ? createMessageActionHelpers(containerElement, engine, {
+            onMessageCopy,
+            onMessageDelete,
+            onMessageEdit,
+        })
+        : undefined;
+    const render = () => {
+        console.log('[ChatUI] RENDER FUNCTION CALLED - THIS SHOULD APPEAR');
+        const messages = engine.getMessages();
+        const input = engine.getInput();
+        const isLoading = engine.getIsLoading();
+        const error = engine.getError();
+        const wasInputFocused = inputElement && document.activeElement === inputElement;
+        const inputCursorPosition = inputElement ? inputElement.selectionStart || 0 : 0;
+        applyThemeToContainer();
+        containerElement.className = `chat-container ${containerElement.className || ''}`.trim();
+        containerElement.setAttribute('data-chat-ui', 'true');
+        containerElement.setAttribute('role', 'log');
+        containerElement.setAttribute('aria-label', 'Chat conversation');
+        containerElement.setAttribute('aria-live', 'polite');
+        containerElement.setAttribute('aria-atomic', 'false');
+        containerElement.innerHTML = `
+      <div class="chat-messages-container" role="log" aria-live="polite" aria-label="Chat messages">
+        ${messages.length === 0 ? `<div class="chat-empty-state">${escapeHtml(emptyStateMessage)}</div>` : ''}
+        ${messages.map((m) => renderMessage(m, renderOpts)).join('')}
+        ${isLoading ? `
+          <div class="chat-message chat-message-assistant chat-message-loading" role="status" aria-live="polite" aria-label="Loading response">
+            ${renderAvatar('assistant', renderOpts)}
+            <div class="chat-message-content chat-message-content-assistant">
+              <div class="chat-message-text">
+                <span class="chat-loading-dots">
+                  <span></span><span></span><span></span>
+                </span>
+                <span class="chat-loading-text">${escapeHtml(loadingMessage)}</span>
+              </div>
+            </div>
+          </div>
+        ` : ''}
+      </div>
+      ${error ? `<div class="chat-error">
+        <div class="chat-error-message">Error: ${escapeHtml(error.message)}</div>
+        <button class="chat-retry-button" type="button">Retry</button>
+      </div>` : ''}
+      ${showClearButton && messages.length > 0 ? `
+        <div class="chat-actions">
+          <button class="chat-clear-button" type="button" title="Clear conversation">Clear</button>
+        </div>
+      ` : ''}
+      <div class="chat-input-container">
+        <div 
+          class="chat-input-form" 
+          data-chat-form="true"
+          role="form"
+          aria-label="Chat input form"
+        >
+          <input 
+            type="text" 
+            class="chat-input" 
+            value="${escapeHtml(input)}" 
+            placeholder="${escapeHtml(placeholder)}" 
+            ${disabled || isLoading ? 'disabled' : ''}
+            aria-label="Chat input"
+          />
+          <button 
+            type="button" 
+            class="chat-send-button"
+            aria-label="Send message"
+          >
+            Send
+          </button>
+        </div>
+      </div>
+    `;
+        messagesContainer = containerElement.querySelector('.chat-messages-container');
+        inputElement = containerElement.querySelector('.chat-input');
+        inputWrapperElement = containerElement.querySelector('.chat-input-form');
+        sendButtonElement = containerElement.querySelector('.chat-send-button');
+        clearButtonElement = containerElement.querySelector('.chat-clear-button');
+        const retryButton = containerElement.querySelector('.chat-retry-button');
+        console.log('[ChatUI] Element references stored', {
+            hasMessagesContainer: !!messagesContainer,
+            hasInputElement: !!inputElement,
+            hasSendButtonElement: !!sendButtonElement,
+            sendButtonElement: sendButtonElement,
+            sendButtonClasses: sendButtonElement?.className,
+            sendButtonDisabled: sendButtonElement?.disabled,
+            containerHTML: containerElement.innerHTML.substring(0, 200),
+        });
+        setTimeout(() => {
+            updateSendButtonState();
+        }, 0);
+        if (wasInputFocused && inputElement) {
+            requestAnimationFrame(() => {
+                if (inputElement) {
+                    inputElement.focus();
+                    const newCursorPosition = Math.min(inputCursorPosition, inputElement.value.length);
+                    inputElement.setSelectionRange(newCursorPosition, newCursorPosition);
+                }
+            });
+        }
+        eventHandlers.length = 0;
+        attachEventHandlers({
+            containerElement,
+            engine,
+            disabled,
+            placeholder,
+            enableMessageActions,
+            stopPropagationRoot,
+            refs: {
+                inputElement,
+                sendButtonElement,
+                clearButtonElement,
+                retryButton,
+            },
+            isUpdatingInputProgrammatically,
+            updateSendButtonState,
+            eventHandlers,
+            messageActions,
+        });
+        setTimeout(() => {
+            scrollToBottom();
+        }, 0);
+    };
+    const addInitialGreetingIfNeeded = () => {
+        if (!initialGreeting || greetingAdded) {
+            return;
+        }
+        if (previousInitialGreeting !== initialGreeting) {
+            greetingAdded = false;
+            previousInitialGreeting = initialGreeting;
+        }
+        const messages = engine.getMessages();
+        const hasGreeting = messages.some((msg) => msg.role === 'assistant' && msg.content === initialGreeting);
+        if (!hasGreeting) {
+            greetingAdded = true;
+            const greetingMessage = {
+                id: `greeting-${Date.now()}`,
+                content: initialGreeting,
+                role: 'assistant',
+                timestamp: new Date(),
+            };
+            engine.addMessage(greetingMessage);
+        }
+        else {
+            greetingAdded = true;
+        }
+    };
+    engine.on('messagesChange', () => {
+        if (!messagesInitialized) {
+            messagesInitialized = true;
+            addInitialGreetingIfNeeded();
+            if (greetingAdded) {
+                return;
+            }
+        }
+        render();
+        setTimeout(() => {
+            scrollToBottom();
+        }, 100);
+    });
+    engine.on('inputChange', (value) => {
+        if (inputElement && inputElement.isConnected) {
+            const wasFocused = document.activeElement === inputElement;
+            const cursorPosition = inputElement.selectionStart || 0;
+            isUpdatingInputProgrammatically.current = true;
+            inputElement.value = value || '';
+            isUpdatingInputProgrammatically.current = false;
+            updateSendButtonState();
+            if (wasFocused) {
+                requestAnimationFrame(() => {
+                    if (inputElement) {
+                        inputElement.focus();
+                        const newCursorPosition = Math.min(cursorPosition, inputElement.value.length);
+                        inputElement.setSelectionRange(newCursorPosition, newCursorPosition);
+                    }
+                });
+            }
+        }
+        else {
+            render();
+        }
+    });
+    engine.on('loadingChange', () => {
+        updateSendButtonState();
+        render();
+        setTimeout(() => {
+            scrollToBottom();
+        }, 100);
+    });
+    engine.on('error', render);
+    render();
+    setTimeout(() => {
+        if (!messagesInitialized) {
+            messagesInitialized = true;
+            addInitialGreetingIfNeeded();
+        }
+    }, 100);
+    const instance = {
+        engine,
+        render,
+        destroy: () => {
+            eventHandlers.forEach(({ element, event, handler, options }) => {
+                element.removeEventListener(event, handler, options);
+            });
+            eventHandlers.length = 0;
+            engine.destroy();
+            containerElement.innerHTML = '';
+            messagesContainer = null;
+            inputElement = null;
+            inputWrapperElement = null;
+            sendButtonElement = null;
+            clearButtonElement = null;
+        },
+        clear: () => {
+            greetingAdded = false;
+            engine.clearMessages();
+        },
+        scrollToBottom,
+        getContainer: () => containerElement,
+    };
+    if (onInit) {
+        onInit(instance);
+    }
+    return instance;
+}

package/dist/adapters/vanilla/event-handlers.d.ts

@@ -0,0 +1,30 @@
+import type { ChatEngine } from '../../core/src/ChatEngine';
+import type { MessageActionHelpers } from './message-actions.js';
+export type EventHandlerEntry = {
+    element: HTMLElement;
+    event: string;
+    handler: EventListener;
+    options?: boolean | AddEventListenerOptions;
+};
+export interface EventHandlerContext {
+    containerElement: HTMLElement;
+    engine: ChatEngine;
+    disabled: boolean;
+    placeholder: string;
+    enableMessageActions: boolean;
+    stopPropagationRoot?: HTMLElement;
+    refs: {
+        inputElement: HTMLInputElement | null;
+        sendButtonElement: HTMLButtonElement | null;
+        clearButtonElement: HTMLButtonElement | null;
+        retryButton: HTMLButtonElement | null;
+    };
+    isUpdatingInputProgrammatically: {
+        current: boolean;
+    };
+    updateSendButtonState: () => void;
+    eventHandlers: EventHandlerEntry[];
+    messageActions?: MessageActionHelpers;
+}
+export declare function attachEventHandlers(ctx: EventHandlerContext): void;
+//# sourceMappingURL=event-handlers.d.ts.map

package/dist/adapters/vanilla/event-handlers.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"event-handlers.d.ts","sourceRoot":"","sources":["../../../adapters/vanilla/event-handlers.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AAC5D,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAEjE,MAAM,MAAM,iBAAiB,GAAG;IAC9B,OAAO,EAAE,WAAW,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,aAAa,CAAC;IACvB,OAAO,CAAC,EAAE,OAAO,GAAG,uBAAuB,CAAC;CAC7C,CAAC;AAEF,MAAM,WAAW,mBAAmB;IAClC,gBAAgB,EAAE,WAAW,CAAC;IAC9B,MAAM,EAAE,UAAU,CAAC;IACnB,QAAQ,EAAE,OAAO,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,oBAAoB,EAAE,OAAO,CAAC;IAC9B,mBAAmB,CAAC,EAAE,WAAW,CAAC;IAClC,IAAI,EAAE;QACJ,YAAY,EAAE,gBAAgB,GAAG,IAAI,CAAC;QACtC,iBAAiB,EAAE,iBAAiB,GAAG,IAAI,CAAC;QAC5C,kBAAkB,EAAE,iBAAiB,GAAG,IAAI,CAAC;QAC7C,WAAW,EAAE,iBAAiB,GAAG,IAAI,CAAC;KACvC,CAAC;IACF,+BAA+B,EAAE;QAAE,OAAO,EAAE,OAAO,CAAA;KAAE,CAAC;IACtD,qBAAqB,EAAE,MAAM,IAAI,CAAC;IAClC,aAAa,EAAE,iBAAiB,EAAE,CAAC;IACnC,cAAc,CAAC,EAAE,oBAAoB,CAAC;CACvC;AAED,wBAAgB,mBAAmB,CAAC,GAAG,EAAE,mBAAmB,GAAG,IAAI,CAmSlE"}