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

Flexible and customizable React UI components for Frank Authentication

import { ColorPalette, ComponentVariant, Theme, ThemeColors, ThemeCustomization, ThemeGeneratorOptions, ThemeMode, ThemeValidation } from '../types';
export declare const hexToHsl: (hex: string) => [number, number, number];
export declare const hslToHex: (h: number, s: number, l: number) => string;
export declare const adjustBrightness: (hex: string, amount: number) => string;
export declare const adjustSaturation: (hex: string, amount: number) => string;
export declare const adjustHue: (hex: string, amount: number) => string;
export declare const getContrastRatio: (color1: string, color2: string) => number;
export declare const isValidContrast: (color1: string, color2: string, level?: "AA" | "AAA") => boolean;
export declare const findAccessibleColor: (baseColor: string, backgroundColor: string, level?: "AA" | "AAA") => string;
export declare const generateColorPalette: (baseColor: string) => ColorPalette;
export declare const generateSemanticColors: (primary: string, mode?: ThemeMode) => Pick<ThemeColors, "success" | "warning" | "danger" | "info">;
export declare const getSystemTheme: () => "light" | "dark";
export declare const watchSystemTheme: (callback: (theme: "light" | "dark") => void) => (() => void);
export declare const resolveThemeMode: (mode: ThemeMode) => "light" | "dark";
export declare const generateCSSVariables: (theme: Theme) => Record<string, string>;
export declare const applyCSSVariables: (variables: Record<string, string>, element?: HTMLElement) => void;
export declare const removeCSSVariables: (keys: string[], element?: HTMLElement) => void;
export declare const generateTheme: (options: ThemeGeneratorOptions) => Partial<Theme>;
export declare const validateTheme: (theme: Partial<Theme>) => ThemeValidation;
export declare const mergeThemes: (baseTheme: Theme, customization: ThemeCustomization) => Theme;
export declare const getComponentVariant: (theme: Theme, component: string, variant: string, color?: string) => ComponentVariant | undefined;
export declare const getComponentStyles: (theme: Theme, component: string, variant: string, color?: string, size?: string) => string;
export declare const saveThemeToStorage: (theme: string, mode: ThemeMode) => void;
export declare const loadThemeFromStorage: () => {
    theme?: string;
    mode?: ThemeMode;
};
export declare const ThemeUtils: {
    hexToHsl: (hex: string) => [number, number, number];
    hslToHex: (h: number, s: number, l: number) => string;
    adjustBrightness: (hex: string, amount: number) => string;
    adjustSaturation: (hex: string, amount: number) => string;
    adjustHue: (hex: string, amount: number) => string;
    getContrastRatio: (color1: string, color2: string) => number;
    isValidContrast: (color1: string, color2: string, level?: "AA" | "AAA") => boolean;
    findAccessibleColor: (baseColor: string, backgroundColor: string, level?: "AA" | "AAA") => string;
    generateColorPalette: (baseColor: string) => ColorPalette;
    generateSemanticColors: (primary: string, mode?: ThemeMode) => Pick<ThemeColors, "success" | "warning" | "danger" | "info">;
    getSystemTheme: () => "light" | "dark";
    watchSystemTheme: (callback: (theme: "light" | "dark") => void) => (() => void);
    resolveThemeMode: (mode: ThemeMode) => "light" | "dark";
    generateCSSVariables: (theme: Theme) => Record<string, string>;
    applyCSSVariables: (variables: Record<string, string>, element?: HTMLElement) => void;
    removeCSSVariables: (keys: string[], element?: HTMLElement) => void;
    generateTheme: (options: ThemeGeneratorOptions) => Partial<Theme>;
    validateTheme: (theme: Partial<Theme>) => ThemeValidation;
    mergeThemes: (baseTheme: Theme, customization: ThemeCustomization) => Theme;
    getComponentVariant: (theme: Theme, component: string, variant: string, color?: string) => ComponentVariant | undefined;
    getComponentStyles: (theme: Theme, component: string, variant: string, color?: string, size?: string) => string;
    saveThemeToStorage: (theme: string, mode: ThemeMode) => void;
    loadThemeFromStorage: () => {
        theme?: string;
        mode?: ThemeMode;
    };
};
//# sourceMappingURL=theme.d.ts.map