import { ReactNode } from 'react';
/**
 * Props for the TypingIndicators component
 */
export interface TypingIndicatorsProps {
    /**
     * Maximum number of distinct clients to display by name before collapsing to "X others".
     * Controls the verbosity of the typing message to prevent overly long text.
     * When exceeded, remaining users are summarized as "and N other(s)".
     *
     * @default 1
     * @example
     * // Show only first user: "Alice is typing"
     * maxClients={1}
     *
     * @example
     * // Show up to 3 users: "Alice, Bob and Charlie are typing"
     * maxClients={3}
     *
     * @example
     * // With overflow: "Alice, Bob and 5 others are typing"
     * maxClients={2} // when 7 users are typing
     */
    maxClients?: number;
    /**
     * Additional CSS classes to apply to the container element.
     * Merged with default styling classes.
     *
     * @example
     * // Custom positioning and colors
     * className="absolute bottom-2 left-4 text-blue-500"
     *
     * @example
     * // Integration with flex layouts
     * className="flex-shrink-0 ml-4"
     */
    className?: string;
    /**
     * CSS classes to apply specifically to the typing text element.
     * Allows independent styling of the text content without affecting container layout.
     *
     * @example
     * // Custom text styling
     * textClassName="font-medium text-green-600 text-xs"
     *
     * @example
     * // Responsive text sizing
     * textClassName="text-sm md:text-base"
     */
    textClassName?: string;
    /**
     * Callback function triggered when the typing state changes.
     * Useful for parent components to react to typing activity,
     * @param typingUsers - Array of client IDs currently typing, excluding the current user.
     *
     * Example usage:
     * ```tsx
     * <TypingIndicators
     *   onTypingChange={(typingUsers) => {
     *   console.log('Current typing users:', typingUsers);
     *   }}
     *   />
     *
     */
    onTypingChange?: (typingUsers: string[]) => void;
}
/**
 * TypingIndicators component displays real-time typing activity in a chat room
 *
 * Features:
 * - Animated typing dots
 * - Human-readable sentences showing who is currently typing
 * - Smart participant limiting to prevent overly long messages
 * - Automatic exclusion of the current user from typing displays
 * - Live region support for screen reader announcements
 * - Custom styling of container and text elements
 *
 * Display:
 * • 0 typing: Component returns null (nothing rendered)
 * • 1 user: "Alice is typing"
 * • 2 users: "Alice and Bob are typing"
 * • 3 users: "Alice, Bob and Charlie are typing"
 * • 4+ users (maxClients=3): "Alice, Bob and 2 others are typing"
 * • Current user excluded: Never shows "You are typing"
 *
 *
 * @example
 * <TypingIndicators
 *   className="bg-blue-50 rounded-lg px-3 py-2"
 *   textClassName="text-blue-700 font-medium"
 *   maxClients={2}
 * />
 *
 */
export declare const TypingIndicators: ({ maxClients, textClassName, className, onTypingChange, }: TypingIndicatorsProps) => ReactNode;