import { TemplateResult } from 'lit-html';

/**
 * Standard control event detail interface for Leva/lil-gui style state aggregation.
 * All control components should dispatch events with this shape.
 */
interface ControlEventDetail<TValue = unknown> {
    /** The control's name/identifier for state aggregation */
    name?: string;
    /** The current value of the control */
    value: TValue;
    /** The original DOM event that triggered this change */
    event: Event;
}
/** The standard event type for control value changes */
declare const CONTROL_CHANGE_EVENT = "control-change";
/**
 * Dispatch a control change event with standard shape.
 * Events bubble and are composed (cross shadow DOM boundaries).
 *
 * @param host - The element dispatching the event
 * @param type - Event type (prefer CONTROL_CHANGE_EVENT for standard controls)
 * @param detail - Event detail with value and optional name
 *
 * @example
 * ```ts
 * dispatchControlEvent(this, CONTROL_CHANGE_EVENT, {
 *   name: this.name,
 *   value: this.value,
 *   event: e
 * });
 * ```
 */
declare const dispatchControlEvent: <THost extends HTMLElement, TValue>(host: THost, type: string, detail: ControlEventDetail<TValue>) => void;
declare const setBooleanAttribute: (element: Element | null | undefined, name: string, value: boolean) => void;
declare const coerceNumber: (value: string) => number | null;
type ControlElement = Element & {
    value?: unknown;
    checked?: unknown;
};
declare const readControlValue: (element: ControlElement) => string | null;

type StateChangeCallback<T = unknown> = (value: T, name: string) => void;
type StateSubscription = {
    unsubscribe: () => void;
};
/**
 * Event detail for state change events
 */
interface StateChangeEventDetail {
    /** The name of the control that changed */
    name: string;
    /** The new value */
    value: unknown;
    /** The complete state object */
    state: Record<string, unknown>;
    /** The original event */
    event: Event;
}
/**
 * State aggregator component - collects and manages state from child controls.
 *
 * This component provides state management without any visual styling.
 * Use it standalone or wrap it with `<ease-panel>` for a styled container.
 *
 * @tag ease-state
 *
 * @slot - Default slot for controls
 *
 * @fires state-change - Fired when any control value changes
 *
 * @example
 * ```html
 * <!-- Standalone usage (no panel) -->
 * <ease-state>
 *   <ease-field label="Duration">
 *     <ease-slider name="duration" value="1" min="0" max="5"></ease-slider>
 *   </ease-field>
 *   <ease-field label="Loop">
 *     <ease-toggle name="loop"></ease-toggle>
 *   </ease-field>
 * </ease-state>
 *
 * <!-- With panel wrapper -->
 * <ease-panel>
 *   <span slot="headline">Animation Controls</span>
 *   <ease-state>
 *     <ease-field label="Duration">
 *       <ease-slider name="duration" value="1" min="0" max="5"></ease-slider>
 *     </ease-field>
 *   </ease-state>
 * </ease-panel>
 * ```
 */
declare class State extends HTMLElement {
    #private;
    requestRender: () => void;
    accessor value: string | null;
    accessor defaultSlot: HTMLSlotElement | null;
    /**
     * Get the current state object with all control values
     */
    get state(): Readonly<Record<string, unknown>>;
    /**
     * Get a specific control value by name
     * @param name - The control name
     * @returns The control value or undefined
     */
    get(name: string): unknown;
    /**
     * Set a control value programmatically
     * @param name - The control name
     * @param value - The new value
     */
    set(name: string, value: unknown): void;
    /**
     * Subscribe to state changes
     * @param nameOrCallback - Control name to watch, '*' for all, or callback for all changes
     * @param callback - Callback when using name filter
     * @returns Subscription with unsubscribe method
     */
    subscribe(callback: StateChangeCallback): StateSubscription;
    subscribe(name: string, callback: StateChangeCallback): StateSubscription;
    /**
     * Reset all controls to their initial values
     */
    reset(): void;
    connectedCallback(): void;
    disconnectedCallback(): void;
    render(): TemplateResult;
    handleInternalInput(event: CustomEvent<ControlEventDetail>): void;
    handleInternalChange(event: CustomEvent<ControlEventDetail>): void;
    handleControlChange(event: CustomEvent<ControlEventDetail>): void;
}

export { type ControlEventDetail as C, type StateChangeEventDetail as S, CONTROL_CHANGE_EVENT as a, State as b, coerceNumber as c, dispatchControlEvent as d, readControlValue as r, setBooleanAttribute as s };