import { type ReactNode } from "react";
export type Appearance = "light" | "dark" | "system";
export declare const APPEARANCE_KEY = "opengeni.appearance";
export declare const SYSTEM_DARK_QUERY = "(prefers-color-scheme: dark)";
export declare function parseAppearance(value: string | null): Appearance;
export declare function AppearanceProvider({ children, hostTheme, scope, }: {
    children: ReactNode;
    /**
     * A theme the host application dictates (Excel's Office theme, for example).
     * It wins over the stored and system appearance.
     */
    hostTheme?: "light" | "dark" | undefined;
    /**
     * `document` (the web app): the theme goes on <html>. `local` (an embed in
     * someone else's page): the page is left alone and the embed's own root
     * applies `resolvedTheme` (see `SessionApp`).
     */
    scope?: "document" | "local" | undefined;
}): import("react").JSX.Element;
export declare function useAppearance(): {
    appearance: Appearance;
    resolvedTheme: "light" | "dark";
    setAppearance: (value: Appearance) => void;
};