import type { PropertyValues } from 'lit';
import { LuxenFormAssociatedElement } from '../../shared/luxen-form-associated-element.js';
export type SliderSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
export type SliderOrientation = 'horizontal' | 'vertical';
/** Fired continuously while a thumb is dragged or stepped. Bubbles; not composed. */
export declare class SliderInputEvent extends Event {
    /** Value of the (first) thumb. */
    readonly value: number;
    /** All thumb values, low to high. One entry in single mode, two in range mode. */
    readonly values: number[];
    constructor(values: number[]);
}
/** Fired when a thumb is released after a change. Bubbles; not composed. */
export declare class SliderChangeEvent extends Event {
    /** Value of the (first) thumb. */
    readonly value: number;
    /** All thumb values, low to high. One entry in single mode, two in range mode. */
    readonly values: number[];
    constructor(values: number[]);
}
interface SliderEventMap {
    input: SliderInputEvent;
    change: SliderChangeEvent;
}
/**
 * A single- or dual-thumb range slider. Pick a numeric value, or a min–max
 * range with `range`. Form-associated: the value is submitted under `name`
 * (range mode submits the low and high values as two entries).
 *
 * @summary Pick a numeric value or a min–max range by dragging a thumb.
 *
 * @example
 * ```html
 * <l-slider label="Volume" min="0" max="100" value="40" name="volume"></l-slider>
 * ```
 *
 * @example Range (min–max)
 * ```html
 * <l-slider label="Price" range min="0" max="100" min-value="20" max-value="70" name="price"></l-slider>
 * ```
 *
 * @event input - Fired continuously while a thumb moves. Bubbles. Not cancelable. Properties: `value: number`, `values: number[]`.
 * @event change - Fired when a thumb is released. Bubbles. Not cancelable. Properties: `value: number`, `values: number[]`.
 *
 * @csspart base - The slider container.
 * @csspart track - The full-width rail.
 * @csspart indicator - The filled portion of the rail.
 * @csspart thumb - Each draggable thumb.
 * @csspart tooltip - The value tooltip shown above a thumb when `with-tooltip` is set.
 *
 * @cssproperty [--track-size] - Thickness of the rail.
 * @cssproperty [--thumb-size] - Diameter of each thumb.
 * @cssproperty [--track-color] - Color of the unfilled rail.
 * @cssproperty [--indicator-color] - Color of the filled portion.
 * @cssproperty [--thumb-color] - Background color of the thumbs.
 *
 * @customElement l-slider
 */
export declare class Slider extends LuxenFormAssociatedElement {
    static styles: import("lit").CSSResult[];
    private _localize;
    /** Minimum value. */
    accessor min: number;
    /** Maximum value. */
    accessor max: number;
    /** Step increment. */
    accessor step: number;
    /** Single-thumb value. */
    accessor value: number;
    /** Enable a two-thumb min–max range. */
    accessor range: boolean;
    /** Lower value (range mode). */
    accessor minValue: number;
    /** Upper value (range mode). */
    accessor maxValue: number;
    /** Accessible label for the slider (and base for the range thumbs' names). */
    accessor label: string;
    /** Control size. */
    accessor size: SliderSize;
    /** Layout axis. Vertical sliders increase upward. */
    accessor orientation: SliderOrientation;
    /** Show a tooltip with the current value while a thumb is focused or dragged. */
    accessor withTooltip: boolean;
    /**
     * Formats a value for the tooltip and the `aria-valuetext` announcement.
     * Assign a function `(value: number) => string`, e.g. to add a unit or currency.
     */
    valueFormatter?: (value: number) => string;
    /** The thumb currently being dragged, or null. */
    private accessor _activeThumb;
    connectedCallback(): void;
    willUpdate(changed: PropertyValues<this>): void;
    updated(): void;
    formResetCallback(): void;
    formStateRestoreCallback(state: string): void;
    private _clamp;
    private _percent;
    /** Current thumb values, low to high. */
    get values(): number[];
    private _serialize;
    private _parse;
    private _syncForm;
    private _set;
    private _valueOf;
    private _format;
    private _onKeyDown;
    private _onPointerDown;
    private _valueFromPointer;
    private _focusThumb;
    private _renderThumb;
    render(): import("lit").TemplateResult<1>;
}
export interface Slider {
    addEventListener<K extends keyof SliderEventMap>(type: K, listener: (this: Slider, ev: SliderEventMap[K]) => void, options?: boolean | AddEventListenerOptions): void;
    addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
    removeEventListener<K extends keyof SliderEventMap>(type: K, listener: (this: Slider, ev: SliderEventMap[K]) => void, options?: boolean | EventListenerOptions): void;
    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
}
declare global {
    interface HTMLElementTagNameMap {
        'l-slider': Slider;
    }
}
export {};
//# sourceMappingURL=slider.d.ts.map