import { type HTMLAttributes, type ReactNode } from 'react';
/**
 * Shared ranking variant type
 */
export type RankingVariant = 'highlight' | 'attention';
/**
 * Card background colors by position (1 = most intense, 3+ = lightest)
 */
export declare const CARD_BACKGROUND_CLASSES: {
    readonly highlight: {
        readonly 1: "bg-success-200";
        readonly 2: "bg-success-100";
        readonly 3: "bg-success-background";
    };
    readonly attention: {
        readonly 1: "bg-error-200";
        readonly 2: "bg-error-100";
        readonly 3: "bg-error-background";
    };
};
/**
 * Position badge background colors
 */
export declare const BADGE_BACKGROUND_CLASSES: {
    readonly highlight: "bg-indicator-positive";
    readonly attention: "bg-indicator-negative";
};
/**
 * Percentage badge background colors
 */
export declare const PERCENTAGE_BADGE_CLASSES: {
    readonly highlight: "bg-success-700";
    readonly attention: "bg-indicator-negative";
};
/** Header icon badge uses the same palette as position badges */
export declare const HEADER_BADGE_CLASSES: {
    readonly highlight: "bg-indicator-positive";
    readonly attention: "bg-indicator-negative";
};
/**
 * Get background class based on position (1, 2, or 3+)
 */
export declare const getPositionBackgroundClass: (variant: RankingVariant, position: number) => string;
/**
 * Generic ranking card wrapper — renders a header (title + icon badge)
 * followed by a list of items using the provided render function.
 */
export interface BaseRankingCardProps<T> extends HTMLAttributes<HTMLDivElement> {
    title: string;
    variant: RankingVariant;
    items: T[];
    renderItem: (item: T, variant: RankingVariant, index: number) => ReactNode;
    /** Override the default header icon (Trophy/Warning) */
    headerIcon?: ReactNode;
}
export declare function BaseRankingCard<T>({ title, variant, items, renderItem, headerIcon, className, ...props }: Readonly<BaseRankingCardProps<T>>): import("react/jsx-runtime").JSX.Element;
/**
 * Two-card side-by-side responsive layout for ranking components
 */
export interface RankingLayoutProps extends HTMLAttributes<HTMLDivElement> {
    children: ReactNode;
}
export declare function RankingLayout({ children, className, ...props }: Readonly<RankingLayoutProps>): import("react/jsx-runtime").JSX.Element;
//# sourceMappingURL=RankingShared.d.ts.map