@frank-auth/react/dist/types/config/theme.d.ts

Flexible and customizable React UI components for Frank Authentication

import { BrandingConfig, Theme, ThemeMode } from './types';
import { DEFAULT_THEME_CONFIG } from './defaults';
/**
 * Creates a dark theme variant from a light theme
 */
export declare function createDarkTheme(lightTheme: Theme): Theme;
/**
 * Blue theme (default)
 */
export declare const BLUE_THEME: Theme;
/**
 * Purple theme
 */
export declare const PURPLE_THEME: Theme;
/**
 * Green theme
 */
export declare const GREEN_THEME: Theme;
/**
 * Orange theme
 */
export declare const ORANGE_THEME: Theme;
/**
 * Pink theme
 */
export declare const PINK_THEME: Theme;
/**
 * Available theme presets
 */
export declare const THEME_PRESETS: {
    readonly blue: Theme;
    readonly purple: Theme;
    readonly green: Theme;
    readonly orange: Theme;
    readonly pink: Theme;
};
export type ThemePreset = keyof typeof THEME_PRESETS;
export declare class ThemeManager {
    private currentTheme;
    private systemPreference;
    private listeners;
    constructor(initialTheme?: Partial<Theme>);
    /**
     * Get current theme
     */
    getTheme(): Theme;
    /**
     * Set theme configuration
     */
    setTheme(theme: Partial<Theme>): void;
    /**
     * Apply a theme preset
     */
    applyPreset(preset: ThemePreset): void;
    /**
     * Set theme mode
     */
    setMode(mode: ThemeMode): void;
    /**
     * Get effective theme mode (resolves 'system' to 'light' or 'dark')
     */
    getEffectiveMode(): 'light' | 'dark';
    /**
     * Apply branding colors to theme
     */
    applyBranding(branding: BrandingConfig): void;
    /**
     * Generate CSS variables for the current theme
     */
    generateCSSVariables(): Record<string, string>;
    /**
     * Apply theme to DOM
     */
    applyToDOM(): void;
    /**
     * Subscribe to theme changes
     */
    subscribe(callback: (theme: Theme) => void): () => void;
    private detectSystemPreference;
    private mergeTheme;
    private getResolvedTheme;
    private updateTheme;
}
/**
 * Create a theme manager instance
 */
export declare function createThemeManager(initialTheme?: Partial<Theme>): ThemeManager;
/**
 * Get theme CSS for server-side rendering
 */
export declare function getThemeCSS(theme: Theme): string;
/**
 * Validate theme configuration
 */
export declare function validateTheme(theme: Partial<Theme>): boolean;
export { DEFAULT_THEME_CONFIG, };
//# sourceMappingURL=theme.d.ts.map