import { default as React, ReactNode } from 'react';
export type ColorTarget = "both" | "accent" | "glass";
export interface DisplaySettings {
    /** Global compact mode - affects all cards */
    compactMode: boolean;
    /** Accent color for cards and UI elements */
    accentColor: string;
    /** Glass tint color for transparent themes */
    glassTint: string;
    /** Which color setting to apply: both, accent-only, or glass-only */
    colorTarget: ColorTarget;
    /** Enable accent-colored borders on cards (for transparent themes) */
    accentBorders: boolean;
}
export interface DisplaySettingsContextValue extends DisplaySettings {
    /** Set compact mode on/off */
    setCompactMode: (value: boolean) => void;
    /** Toggle compact mode */
    toggleCompactMode: () => void;
    /** Set accent color */
    setAccentColor: (color: string) => void;
    /** Set glass tint color */
    setGlassTint: (color: string) => void;
    /** Set which color setting to apply */
    setColorTarget: (target: ColorTarget) => void;
    /** Set a color that applies based on current target */
    setColor: (color: string) => void;
    /** Set accent borders on/off */
    setAccentBorders: (value: boolean) => void;
    /** Toggle accent borders */
    toggleAccentBorders: () => void;
    /** Reset all settings to defaults */
    resetSettings: () => void;
}
export declare const PRESET_COLORS: {
    readonly purple: "#8b5cf6";
    readonly blue: "#3b82f6";
    readonly cyan: "#06b6d4";
    readonly teal: "#14b8a6";
    readonly green: "#10b981";
    readonly lime: "#84cc16";
    readonly amber: "#f59e0b";
    readonly orange: "#f97316";
    readonly pink: "#ec4899";
    readonly red: "#ef4444";
    readonly slate: "#64748b";
};
export declare const GLASS_TINTS: {
    readonly clear: "rgba(255,255,255,0.05)";
    readonly dark: "rgba(0,0,0,0.3)";
    readonly purple: "#8b5cf6";
    readonly blue: "#3b82f6";
    readonly cyan: "#06b6d4";
    readonly teal: "#14b8a6";
    readonly green: "#10b981";
    readonly lime: "#84cc16";
    readonly amber: "#f59e0b";
    readonly orange: "#f97316";
    readonly pink: "#ec4899";
    readonly red: "#ef4444";
    readonly slate: "#64748b";
};
export type PresetColorKey = keyof typeof PRESET_COLORS;
export type GlassTintKey = keyof typeof GLASS_TINTS;
export interface DisplaySettingsProviderProps {
    children: ReactNode;
    /** Initial compact mode state */
    defaultCompactMode?: boolean;
    /** Initial accent color */
    defaultAccentColor?: string;
    /** Initial glass tint color */
    defaultGlassTint?: string;
    /** Initial color target */
    defaultColorTarget?: ColorTarget;
    /** Initial accent borders state */
    defaultAccentBorders?: boolean;
    /** Enable localStorage persistence (default: true) */
    persist?: boolean;
}
export declare function DisplaySettingsProvider({ children, defaultCompactMode, defaultAccentColor, defaultGlassTint, defaultColorTarget, defaultAccentBorders, persist, }: DisplaySettingsProviderProps): React.ReactElement;
/**
 * Access display settings context
 * Must be used within a DisplaySettingsProvider
 */
export declare function useDisplaySettings(): DisplaySettingsContextValue;
/**
 * Optional hook that returns null if not within provider
 * Useful for components that should work with or without the provider
 */
export declare function useDisplaySettingsOptional(): DisplaySettingsContextValue | null;
/**
 * Get effective compact mode value
 * Priority: explicit prop > context value > default (false)
 */
export declare function getEffectiveCompactMode(propValue: boolean | undefined, contextValue: boolean | undefined): boolean;
/**
 * Get effective accent borders value
 * Priority: explicit prop > context value > default (true)
 */
export declare function getEffectiveAccentBorders(propValue: boolean | undefined, contextValue: boolean | undefined): boolean;
/**
 * Hook to get card border style based on accentBorders setting
 * Returns the appropriate border style for transparent themes
 */
export declare function useCardBorderStyle(tokens: any, isTransparentTheme: boolean): React.CSSProperties;
export default DisplaySettingsProvider;