import { type HTMLAttributes } from 'react';
import type { StudentHighlightItem } from '../../hooks/useStudentsHighlight';
import { type RankingVariant } from '../shared/RankingShared';
/**
 * Re-export RankingVariant as StudentRankingVariant for backwards compatibility
 */
export type StudentRankingVariant = RankingVariant;
/**
 * Re-export StudentHighlightItem as StudentRankingItem for backwards compatibility
 * and direct usage with the component
 */
export type StudentRankingItem = Pick<StudentHighlightItem, 'position' | 'name' | 'percentage'>;
/**
 * Props for a single ranking card
 */
export interface RankingCardProps extends HTMLAttributes<HTMLDivElement> {
    /** Card title */
    title: string;
    /** Card variant: highlight (best students) or attention (needs attention) */
    variant: RankingVariant;
    /** List of students to display */
    students: StudentRankingItem[];
}
/**
 * Single ranking card component (can be used independently)
 */
export declare const RankingCard: ({ title, variant, students, className, ...props }: RankingCardProps) => import("react/jsx-runtime").JSX.Element;
/**
 * Props for the StudentRanking component
 */
export interface StudentRankingProps extends HTMLAttributes<HTMLDivElement> {
    /** Title for the highlight (best students) card */
    highlightTitle?: string;
    /** Title for the attention (needs attention) card */
    attentionTitle?: string;
    /** List of highlighted (best performing) students */
    highlightStudents: StudentRankingItem[];
    /** List of students needing attention (lowest performing) */
    attentionStudents: StudentRankingItem[];
}
/**
 * StudentRanking component - displays two cards side by side showing
 * the best performing students and students that need attention.
 *
 * @example
 * ```tsx
 * <StudentRanking
 *   highlightTitle="Estudantes em destaque"
 *   attentionTitle="Estudantes precisando de atenção"
 *   highlightStudents={[
 *     { position: 1, name: 'Valentina Ribeiro', percentage: 100 },
 *     { position: 2, name: 'Lucas Almeida', percentage: 100 },
 *     { position: 3, name: 'Fernanda Costa', percentage: 100 },
 *   ]}
 *   attentionStudents={[
 *     { position: 1, name: 'Ricardo Silva', percentage: 80 },
 *     { position: 2, name: 'Juliana Santos', percentage: 50 },
 *     { position: 3, name: 'Gabriel Oliveira', percentage: 40 },
 *   ]}
 * />
 * ```
 */
export declare const StudentRanking: ({ highlightTitle, attentionTitle, highlightStudents, attentionStudents, className, ...props }: StudentRankingProps) => import("react/jsx-runtime").JSX.Element;
export default StudentRanking;
//# sourceMappingURL=StudentRanking.d.ts.map