import { CSSResult } from 'lit';
import { LitElement } from 'lit';
import { TemplateResult } from 'lit-html';

export declare interface AutoDetectDefaults {
    sliderRanges?: {
        [unit: string]: {
            min: number;
            max: number;
            step?: number;
        };
    };
}

export declare interface ColorConfig {
    type: "color";
    default?: string;
    scope?: string;
    colorSpace?: "standard" | "modern";
}

export declare type CSSUnit = "px" | "cm" | "mm" | "in" | "pt" | "pc" | "Q" | "em" | "rem" | "ex" | "rex" | "cap" | "rcap" | "ch" | "rch" | "ic" | "ric" | "lh" | "rlh" | "vw" | "vh" | "vi" | "vb" | "vmin" | "vmax" | "svw" | "svh" | "svi" | "svb" | "svmin" | "svmax" | "lvw" | "lvh" | "lvi" | "lvb" | "lvmin" | "lvmax" | "dvw" | "dvh" | "dvi" | "dvb" | "dvmin" | "dvmax" | "cqw" | "cqh" | "cqi" | "cqb" | "cqmin" | "cqmax" | "deg" | "grad" | "rad" | "turn" | "s" | "ms" | "Hz" | "kHz" | "dpi" | "dpcm" | "dppx" | "%" | "fr" | "";

export declare interface SliderConfig {
    type: "slider";
    min: number;
    max: number;
    default?: number;
    unit: CSSUnit;
    scope?: string;
    step?: number;
}

export declare class SlideVars {
    private element;
    /**
     * Initialize the slide vars component with configuration
     * @param config - Configuration object mapping CSS variable names to their controls.
     *                 Pass an empty object {} or omit to auto-detect from :root
     * @param options - Optional configuration for the component behavior
     */
    init(config?: SlideVarsInitConfig, options?: SlideVarsOptions): void;
    /**
     * Remove the slide vars component from the DOM
     */
    destroy(): void;
    /**
     * Get the current slide vars element
     */
    getElement(): SlideVarsElement | null;
    /**
     * Open the controls panel
     */
    open(): void;
    /**
     * Close the controls panel
     */
    close(): void;
    /**
     * Toggle the controls panel
     */
    toggle(): void;
}

export declare const slideVars: SlideVars;

export declare interface SlideVarsConfig {
    [varName: string]: VarConfig;
}

export declare interface SlideVarsConfigGroup {
    [varName: string]: VarConfig;
}

export declare class SlideVarsElement extends LitElement {
    config: SlideVarsConfig;
    renderSections: SlideVarsRenderSection[];
    private isOpen;
    private values;
    private colorInputLoaded;
    static styles: CSSResult;
    connectedCallback(): void;
    private loadColorInputComponent;
    setConfig(config: SlideVarsConfig, defaultOpen?: boolean, renderSections?: SlideVarsRenderSection[]): void;
    toggle(): void;
    open(): void;
    close(): void;
    private initializeValues;
    private handleSliderChange;
    private handleColorChange;
    private handleModernColorChange;
    private setCSSVariable;
    private normalizeColor;
    private renderControl;
    render(): TemplateResult<1>;
}

export declare interface SlideVarsGroupSection {
    type: "group";
    groupName: string;
    varNames: string[];
}

export declare interface SlideVarsInitConfig {
    [key: string]: VarConfig | SlideVarsConfigGroup;
}

export declare class SlideVarsLogo extends LitElement {
    open: boolean;
    size: number;
    static styles: CSSResult;
    render(): TemplateResult<1>;
}

export declare interface SlideVarsOptions {
    defaultOpen?: boolean;
    auto?: boolean;
    scope?: string;
    /** Variable name prefixes to exclude from auto-detection (e.g. `"--arc-"` or `["--arc-", "--other-"]`) */
    filterVariables?: string | string[];
}

export declare type SlideVarsRenderSection = SlideVarsVarSection | SlideVarsGroupSection;

export declare interface SlideVarsVarSection {
    type: "var";
    varName: string;
}

export declare type VarConfig = SliderConfig | ColorConfig;

export { }