react-trophies/dist/components/TrophyModal.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 { AchievementConfiguration } from '../types';
interface TrophyModalProps {
    /** The text or element that triggers the modal. */
    trigger?: React.ReactNode;
    /** Custom title for the modal. */
    modalTitle?: string;
    /** Additional class names for the trigger button. */
    className?: string;
    /** Position of the trigger button on the screen. */
    buttonPosition?: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
    /** Full achievement configuration (required because context doesn't expose it) */
    config: AchievementConfiguration;
    /** Current metrics values (required because context doesn't expose it) */
    metrics?: Record<string, number | string | number[]>;
    /** Custom class name for the modal content. Use undefined to style the modal container */
    modalClassName?: string;
    /** Custom class name for achievement cards. Applied to all cards as base styling */
    cardClassName?: string;
    /** Custom class name for unlocked achievement cards. Applied in addition to cardClassName */
    unlockedCardClassName?: string;
    /** Custom class name for the achievement icon */
    iconClassName?: string;
}
/**
 * A modal dialog to display all achievements, their status, and progress.
 * Integrates with Shadcn UI for styling and requires peer dependencies.
 *
 * @requires Shadcn UI components (Dialog, Button, ScrollArea, Progress)
 * @example
 * // Make sure you've installed the required components:
 * // npx shadcn-ui@latest add dialog button scroll-area progress
 *
 * // import { TrophyModal } from 'react-trophies';
 *
 * // function App() {
 * //   return (
 * //     <>
 * //       <TrophyModal
 * //         modalTitle="Your Achievements"
 * //         config={achievementConfig}
 * //         metrics={currentMetrics}
 * //       />
 * //     </>
 * //   );
 * // }
 */
export declare const TrophyModal: React.FC<TrophyModalProps>;
export default TrophyModal;