import { PropertyValues, TemplateResult } from 'lit';
import { BahtElement } from '../base.js';
export type ThemeName = 'light' | 'dark';
/**
 * Light / dark switch for the 20baht themes. Sets `data-baht-theme` on `<html>` (or on the
 * `target` element), so every `--baht-*` token follows.
 *
 *   <baht-theme-toggle></baht-theme-toggle>
 *   <baht-theme-toggle default="system"></baht-theme-toggle>   <!-- first visit follows the OS -->
 *   <baht-theme-toggle target="#preview" storage-key=""></baht-theme-toggle>
 *
 * Starting theme: the one saved in `localStorage[storage-key]`, else the theme already on the
 * target, else `default`. Clicking flips it, saves it and fires `baht-theme-change`. Every
 * toggle watches its target's attribute, so several toggles (or the app's own settings page)
 * stay in sync. To avoid a flash of the wrong theme on load, apply the saved theme before
 * paint with an inline script (see the docs page).
 *
 * A11y: an APG toggle button — fixed localized name ("Dark theme"), `aria-pressed` = dark.
 *
 * @fires baht-theme-change - The user switched theme. `detail: { theme: 'light' | 'dark' }`.
 */
export declare class BahtThemeToggle extends BahtElement {
    /** Current theme. Setting it applies it to the target (not saved, no event). */
    theme: ThemeName;
    /** Theme when nothing is saved and the target has none: `light`, `dark`, or `system`. */
    default: ThemeName | 'system';
    /** CSS selector of the element that carries `data-baht-theme`. Default: `<html>`. */
    target: string;
    /** localStorage key for the user's choice; `""` turns persistence off. */
    storageKey: string;
    private targetEl;
    private observer;
    connectedCallback(): void;
    disconnectedCallback(): void;
    protected willUpdate(changed: PropertyValues<this>): void;
    protected updated(changed: PropertyValues<this>): void;
    private attachTarget;
    private initialTheme;
    private read;
    private save;
    /** Flip light ↔ dark, save it and fire `baht-theme-change` (what a click does). */
    toggle(): void;
    protected render(): TemplateResult;
}