react-trophies/dist/components/TrophyCard.d.ts

Comprehensive achievement and trophy system for React apps with sound effects, notifications, theming, and visual components. Uses React, React-DOM, Sonner (toast notifications), Howler (sound effects), Zustand (state management), React-Confetti (celebrat

import React from 'react';
import { AchievementDetails } from '../types';
/**
 * Props for the TrophyCard component
 */
export interface TrophyCardProps {
    /** The achievement data to display */
    achievement: AchievementDetails;
    /** Optional custom styles for the card */
    customStyles?: {
        container?: React.CSSProperties;
        iconContainer?: React.CSSProperties;
        icon?: React.CSSProperties;
        title?: React.CSSProperties;
        description?: React.CSSProperties;
        date?: React.CSSProperties;
        locked?: React.CSSProperties;
    };
    /** Custom icons to use for achievements */
    icons?: Record<string, string>;
    /** Function to call when the card is clicked */
    onClick?: (achievement: AchievementDetails) => void;
    /** Whether to show the achievement description */
    showDescription?: boolean;
    /** Whether to show the date when the achievement was unlocked */
    showDate?: boolean;
    /** Whether to show locked achievements differently */
    showLocked?: boolean;
}
/**
 * TrophyCard - A visually appealing card component to display individual achievements
 *
 * @example
 * ```tsx
 * <TrophyCard
 *   achievement={achievement}
 *   showDescription={true}
 *   onClick={(achievement) => console.log('Clicked:', achievement.achievementId)}
 * />
 * ```
 */
declare const TrophyCard: React.FC<TrophyCardProps>;
export default TrophyCard;