/**
 * theme.ts — Dark/light theme system for @nice2dev/ui-graphics editors.
 *
 * Provides CSS custom properties, theme context, and auto-detection
 * of system dark mode preference.
 */
import React from "react";
export type ThemeMode = "light" | "dark" | "auto";
export interface EditorTheme {
    mode: "light" | "dark";
    colors: {
        bg: string;
        bgAlt: string;
        surface: string;
        surfaceHover: string;
        border: string;
        text: string;
        textSecondary: string;
        textMuted: string;
        accent: string;
        accentHover: string;
        accentText: string;
        error: string;
        warning: string;
        success: string;
        canvasBg: string;
        toolbarBg: string;
        panelBg: string;
        statusBarBg: string;
        selectionBg: string;
        selectionBorder: string;
    };
    spacing: {
        xs: number;
        sm: number;
        md: number;
        lg: number;
        xl: number;
    };
    radius: {
        sm: number;
        md: number;
        lg: number;
    };
    fontSize: {
        xs: number;
        sm: number;
        md: number;
        lg: number;
    };
}
export declare const LIGHT_THEME: EditorTheme;
export declare const DARK_THEME: EditorTheme;
/** Generate CSS custom properties from a theme. */
export declare function themeToCssVars(theme: EditorTheme): Record<string, string>;
/** Apply theme CSS variables to a DOM element. */
export declare function applyThemeToElement(element: HTMLElement, theme: EditorTheme): void;
/** Detect if system prefers dark mode. */
export declare function systemPrefersDark(): boolean;
/** Resolve "auto" mode to "light" or "dark". */
export declare function resolveThemeMode(mode: ThemeMode): "light" | "dark";
/** Get theme for a given mode. */
export declare function getTheme(mode: ThemeMode): EditorTheme;
interface ThemeContextValue {
    theme: EditorTheme;
    mode: ThemeMode;
    setMode: (mode: ThemeMode) => void;
    toggleMode: () => void;
}
/** Provider for editor theme. Supports "light", "dark", or "auto". */
export declare const NiceEditorThemeProvider: React.FC<{
    initialMode?: ThemeMode;
    storageKey?: string;
    children: React.ReactNode;
}>;
/** Hook to access editor theme. */
export declare function useEditorTheme(): ThemeContextValue;
export {};
