import type { BaseProps } from '@astryxdesign/core';
import type { ChatEmojiOption } from './ChatEmojiPicker';
export interface ChatReaction {
    /** The emoji character, e.g. "🎉". */
    emoji: string;
    /** Number of people who reacted with this emoji. */
    count: number;
    /**
     * Whether the current user has reacted — accent border, tinted
     * background, and `aria-pressed="true"` on the pill.
     * @default false
     */
    isSelected?: boolean;
    /**
     * Human-readable description used as the pill's tooltip and accessible
     * label, e.g. "Ana and Dana reacted with 🎉". Falls back to a count-based
     * label when omitted.
     */
    label?: string;
}
export interface ChatReactionBarProps extends Omit<BaseProps<HTMLDivElement>, 'onToggle'> {
    /** Ref forwarded to the root element */
    ref?: React.Ref<HTMLDivElement>;
    /** Reactions to render, in display order. */
    reactions: ChatReaction[];
    /** Called with the pill's emoji when the user toggles a reaction. */
    onToggle?: (emoji: string) => void;
    /**
     * Called with the picked emoji when the user adds a reaction from the
     * emoji picker. The trailing add-reaction button renders only when
     * this is provided.
     */
    onAdd?: (emoji: string) => void;
    /**
     * Emoji options for the add-reaction picker.
     * @default DEFAULT_CHAT_EMOJIS
     */
    emojis?: ReadonlyArray<ChatEmojiOption>;
    /**
     * Accessible label for the add-reaction button.
     * @default 'Add reaction'
     */
    addLabel?: string;
    /**
     * Accessible label for the reaction group.
     * @default 'Reactions'
     */
    label?: string;
}
/**
 * Row of emoji reaction pills under a chat message.
 *
 * Each pill shows an emoji and count; the current user's own reactions get
 * an accent tint and `aria-pressed`. Provide `onAdd` to render a trailing
 * add-reaction button that opens a ChatEmojiPicker popover.
 *
 * @example
 * ```
 * <ChatReactionBar
 *   reactions={[
 *     {emoji: '🎉', count: 4, isSelected: true, label: 'You and Dana reacted with 🎉'},
 *     {emoji: '👀', count: 2},
 *   ]}
 *   onToggle={(emoji) => toggleReaction(emoji)}
 *   onAdd={(emoji) => addReaction(emoji)}
 * />
 * ```
 */
export declare function ChatReactionBar({ reactions, onToggle, onAdd, emojis, addLabel, label, xstyle, className, style: styleProp, 'data-testid': testId, ref, }: ChatReactionBarProps): import("react").JSX.Element;
export declare namespace ChatReactionBar {
    var displayName: string;
}
//# sourceMappingURL=ChatReactionBar.d.ts.map