/** @import { ReactiveController, LitElement } from 'lit' */
/** @import { Theme, ResolvedTheme, Device } from '../types.js' */
/**
 * Turns the `theme` property into the custom properties everything else reads.
 *
 * The generated sheet is adopted *after* the component's own stylesheets, so a
 * theme value beats the fallback declared alongside the rules that use it.
 * Page CSS still wins over both: a `chit-ui { --chit-color-accent: ... }` rule
 * lives in the outer tree, and the outer tree takes precedence over `:host`.
 *
 * @implements {ReactiveController}
 */
export class ThemeController implements ReactiveController {
    /**
     * The breakpoint a theme asks for. Needed before `apply`, because the device
     * cannot be decided until the breakpoint is known.
     *
     * @param {Theme | undefined} theme
     * @returns {number}
     */
    static breakpointOf(theme: Theme | undefined): number;
    /**
     * @param {LitElement} host
     * @param {{ device: () => Device }} options
     */
    constructor(host: LitElement, { device }: {
        device: () => Device;
    });
    /** @returns {ResolvedTheme} The theme in force, defaults filled in. */
    get current(): ResolvedTheme;
    hostConnected(): void;
    hostDisconnected(): void;
    /**
     * Re-resolve for the current theme and device. Cheap to call on every update:
     * the stylesheet is only rewritten when the generated text actually changes.
     *
     * @param {Theme | undefined} theme
     * @param {Device} device
     */
    apply(theme: Theme | undefined, device: Device): void;
    #private;
}
import type { ReactiveController } from 'lit';
import type { ResolvedTheme } from '../types.js';
import type { Theme } from '../types.js';
import type { Device } from '../types.js';
import type { LitElement } from 'lit';