/** @jsx createElement */
import type { Renderer } from '../types';
/**
 * CompareBar — the "funnel into chat" selection bar.
 *
 * Shows the products the user picked for comparison (via `connectCompare` /
 * `useCompare`), lets them remove entries or clear the selection, and exposes
 * the primary "Compare" call-to-action that opens the chat and sends the
 * comparison message. The bar renders nothing while the selection is empty.
 */
/** A selected record. Only `objectID` is required; the label is derived from
 * `name`/`title` when present. */
export type CompareBarItem = {
    objectID: string;
} & Record<string, unknown>;
export type CompareBarClassNames = {
    /** Class names to apply to the root element. */
    root?: string | string[];
    /** Class names to apply to the header row (title + count). */
    header?: string | string[];
    /** Class names to apply to the title element. */
    title?: string | string[];
    /** Class names to apply to the selection count element. */
    count?: string | string[];
    /** Class names to apply to the selected-items list. */
    list?: string | string[];
    /** Class names to apply to each selected item. */
    item?: string | string[];
    /** Class names to apply to each item label. */
    itemLabel?: string | string[];
    /** Class names to apply to each item remove button. */
    itemRemove?: string | string[];
    /** Class names to apply to the hint element. */
    hint?: string | string[];
    /** Class names to apply to the actions row. */
    actions?: string | string[];
    /** Class names to apply to the clear button. */
    clearButton?: string | string[];
    /** Class names to apply to the compare button. */
    compareButton?: string | string[];
};
export type CompareBarTranslations = {
    /** Accessible label and heading of the bar. */
    title: string;
    /** Selection counter, e.g. "2 of 3". */
    countText: (count: number, maxItems: number) => string;
    /** Label of the primary call-to-action. */
    compareButtonText: (count: number) => string;
    /** Label of the clear-selection button. */
    clearButtonText: string;
    /** Accessible label of an item's remove button. */
    removeItemLabel: (itemLabel: string) => string;
    /** Hint shown while fewer than `minItems` items are selected. */
    minItemsHint: (minItems: number) => string;
    /** Hint shown when the selection limit is reached. */
    limitReachedHint: string;
};
export type CompareBarItemComponentProps = {
    item: CompareBarItem;
};
export type CompareBarProps = {
    /** Ordered selection, one entry per product. */
    items: CompareBarItem[];
    /** Minimum number of items required to start a comparison. */
    minItems: number;
    /** Maximum number of items that can be selected. */
    maxItems: number;
    /** Whether the primary call-to-action is enabled. */
    canCompare: boolean;
    /** Starts the comparison (opens the chat and sends the message). */
    onCompare: () => void;
    /** Removes one item from the selection. */
    onRemove: (item: CompareBarItem) => void;
    /** Clears the whole selection. */
    onClear: () => void;
    /** Optional custom renderer for an item's label. */
    itemComponent?: (props: CompareBarItemComponentProps) => JSX.Element;
    classNames?: Partial<CompareBarClassNames>;
    translations?: Partial<CompareBarTranslations>;
};
export declare function createCompareBarComponent({ createElement }: Renderer): (userProps: CompareBarProps) => JSX.Element | null;