import React from 'react';
import './index.css';
import { HMSMessage } from '../../store/schema';
interface ChatBoxClasses {
    root?: string;
    header?: string;
    headerLine?: string;
    headerRoot?: string;
    headerText?: string;
    headerCloseButton?: string;
    messageBox?: string;
    messageRoot?: string;
    messageInfo?: string;
    messageSender?: string;
    messageTime?: string;
    messageText?: string;
    notificationRoot?: string;
    notificationInfo?: string;
    notificationText?: string;
    notificationTime?: string;
    time?: string;
    noMessageRoot?: string;
    footer?: string;
    chatInput?: string;
    unreadMessagesContainer?: string;
    unreadMessagesInner?: string;
    unreadIcon?: string;
}
export interface Message extends HMSMessage {
    notification?: boolean;
    direction?: 'left' | 'right' | 'center';
}
export interface ChatProps {
    messages?: Message[];
    onSend?: (message: string) => void;
    onClose?: () => void;
    autoScrollToBottom?: boolean;
    scrollAnimation?: ScrollBehavior;
    messageFormatter?: (message: string) => React.ReactNode;
    /**
     * extra classes added  by user
     */
    classes?: ChatBoxClasses;
    timeFormatter?: (date: Date) => string;
}
export declare const ChatBox: ({ messages, onSend, onClose, autoScrollToBottom, scrollAnimation, messageFormatter, classes, timeFormatter, }: ChatProps) => JSX.Element;
export {};