/**
 * @file SyntaxTheme.tsx
 * @input SyntaxTheme from defineSyntaxTheme.ts
 * @output SyntaxTheme provider, useSyntaxTheme hook
 * @position Provider component; wraps code surfaces to apply syntax coloring
 *
 * @see https://github.com/facebook/astryx/issues/1148
 */
import React from 'react';
import { type SyntaxThemeDefinition, type SyntaxThemeTokenKey } from './defineSyntaxTheme';
export interface UseSyntaxThemeReturn {
    /** Syntax theme name */
    name: string;
    /** Resolved effective mode ('light' | 'dark') */
    mode: 'light' | 'dark';
    /**
     * Resolve a syntax token to its raw CSS value for the current color mode.
     *
     * @example
     * const keywordColor = token('keyword'); // "#0064E0" in light mode
     */
    token: (name: SyntaxThemeTokenKey) => string;
    /**
     * All syntax tokens resolved for the current color mode.
     */
    tokens: Record<SyntaxThemeTokenKey, string>;
}
/**
 * Access the current syntax theme's token values, resolved for the active
 * color mode. Returns null if no SyntaxTheme provider is present.
 *
 * @example
 * function CodeCanvas() {
 *   const syntax = useSyntaxTheme();
 *   if (!syntax) {
 *     return null;
 *   }
 *   ctx.fillStyle = syntax.token('keyword');
 * }
 */
export declare function useSyntaxTheme(): UseSyntaxThemeReturn | null;
interface SyntaxThemeProps {
    theme: SyntaxThemeDefinition;
    children: React.ReactNode;
}
/**
 * Syntax theme provider. Sets CSS custom properties on a wrapper div
 * so child code components inherit via cascade.
 */
export declare function SyntaxTheme({ theme, children, }: SyntaxThemeProps): React.ReactElement;
export declare namespace SyntaxTheme {
    var displayName: string;
}
export {};
//# sourceMappingURL=SyntaxTheme.d.ts.map