langflow-chatbot/dist/components/ChatDisplayManager.d.ts

Add a Langflow-powered chatbot to your website.

import { Logger } from '../utils/logger';
import { DatetimeHandler } from '../utils/datetimeUtils';
import { SenderConfig } from '../types';
/**
 * Configuration for the ChatDisplayManager.
 */
export interface ChatDisplayManagerConfig extends SenderConfig {
    /** The HTML template string for a single message. */
    messageTemplate: string;
    /** Optional datetime format string (e.g., 'HH:mm') for the default datetime handler. */
    datetimeFormat?: string;
}
/**
 * Manages the display of messages and other UI elements within the chat widget.
 * Handles DOM manipulations for adding, updating, and removing messages, scrolling, etc.
 */
export declare class ChatDisplayManager {
    private widgetElement;
    private config;
    private logger;
    private chatMessagesContainer;
    private datetimeHandler;
    /**
     * Constructs a ChatDisplayManager instance.
     * @param {HTMLElement} widgetElement - The main HTML element of the chat widget.
     * @param {ChatDisplayManagerConfig} config - Configuration for display behavior and templates.
     * @param {Logger} logger - An instance of the Logger for logging messages.
     */
    constructor(widgetElement: HTMLElement, config: ChatDisplayManagerConfig, logger: Logger);
    /**
     * Sets a custom datetime handler function.
     * If the new handler is invalid, the existing handler is retained.
     * @param {DatetimeHandler} newHandler - The new datetime handler function.
     */
    setDatetimeHandler(newHandler: DatetimeHandler): void;
    /**
     * Adds a message to the chat display.
     * @param {string} sender - The sender of the message (e.g., user, bot).
     * @param {string} message - The message content (HTML or plain text).
     * @param {boolean} [isThinking=false] - Whether the message is a "thinking" indicator.
     * @param {string} [datetime] - Optional ISO datetime string for the message. Defaults to current time.
     * @returns {HTMLElement | null} The created message element, or null if an error occurred.
     */
    addMessageToDisplay(sender: string, message: string, isThinking?: boolean, datetime?: string): HTMLElement | null;
    /**
     * Updates the content of an existing bot message element, typically used for streaming responses.
     * Prioritizes updating the `.message-text-content` span within the element.
     * If not found, falls back to updating the first child (if not sender display) or the element itself.
     * @param {HTMLElement} messageElement - The bot message HTML element to update.
     * @param {string} htmlOrText - The new HTML or text content.
     */
    updateBotMessageContent(messageElement: HTMLElement, htmlOrText: string): void;
    /**
     * Scrolls the chat messages container to the bottom.
     * Uses requestAnimationFrame for smoother rendering.
     */
    scrollChatToBottom(): void;
    /**
     * Removes a specific message element from the display.
     * @param {HTMLElement} messageElement - The HTML element of the message to remove.
     */
    removeMessageElement(messageElement: HTMLElement): void;
    /**
     * Removes any message element currently marked with the 'thinking' class.
     */
    removeThinkingMessage(): void;
    /**
     * Clears all messages from the chat messages container.
     */
    clearMessages(): void;
}