react-trophies/dist/components/ThemeProvider.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';
/**
 * Available theme types
 */
export type ThemeType = 'light' | 'dark' | 'system' | string;
/**
 * Theme colors object definition
 */
export interface ThemeColors {
    primary: string;
    secondary: string;
    background: string;
    text: string;
    border: string;
    success: string;
    warning: string;
    error: string;
    card: string;
    cardBorder: string;
    progressBar: string;
    progressBackground: string;
    modalBackground: string;
    modalOverlay: string;
    buttonText: string;
    buttonBackground: string;
    toastBackground: string;
    toastText: string;
}
/**
 * Interface for custom theme definitions
 */
export interface CustomTheme {
    name: string;
    colors: Partial<ThemeColors>;
}
/**
 * Theme context value interface
 */
export interface ThemeContextValue {
    /** Current theme name */
    theme: ThemeType;
    /** Set the theme */
    setTheme: (theme: ThemeType) => void;
    /** Theme colors */
    colors: ThemeColors;
    /** Add a custom theme */
    addCustomTheme: (customTheme: CustomTheme) => void;
}
/**
 * Props for the ThemeProvider component
 */
export interface ThemeProviderProps {
    /** Children components */
    children: React.ReactNode;
    /** Initial theme to use */
    initialTheme?: ThemeType;
    /** Additional custom themes */
    customThemes?: CustomTheme[];
    /** Whether to persist theme preference in localStorage */
    persistTheme?: boolean;
    /** Storage key for theme preference */
    storageKey?: string;
}
/**
 * ThemeProvider - Provides theming context for trophy components
 *
 * @example
 * ```tsx
 * <ThemeProvider initialTheme="dark" persistTheme={true}>
 *   <YourApp />
 * </ThemeProvider>
 * ```
 */
export declare const ThemeProvider: React.FC<ThemeProviderProps>;
/**
 * Hook to use the theme context
 * @returns The theme context value
 */
export declare const useTheme: () => ThemeContextValue;
export default ThemeProvider;