range-slider-element/dist/range-slider-element.d.ts

A cross browser customizable and accessible <range-slider> web component

/**
 * A custom element that represents a range slider for selecting numerical values within a defined range.
 * This element supports both single and dual handles for selecting a single value or a range.
 *
 * @element RangeSliderElement
 * @extends HTMLElement
 * @fires input - Fired when the value of the range slider changes.
 * @fires change - Fired when the user stops adjusting the value.
 *
 * @example
 * // Example of using RangeSliderElement in HTML
 * <range-slider min="0" max="100" step="1"></range-slider>
 */
export class RangeSliderElement {
    /**
     * Registers the custom element with the global or provided custom element registry.
     *
     * @param {string} [tagName='range-slider'] - The tag name to register the element under.
     * @param {CustomElementRegistry} [registry=window.customElements] - Optional custom element registry.
     * @returns {typeof RangeSliderElement | undefined} - Returns the class constructor if successfully defined, otherwise undefined.
     * @example
     * RangeSliderElement.define();
     * RangeSliderElement.define('my-slider', customElements);
     */
    static define(tagName?: string, registry?: CustomElementRegistry): typeof RangeSliderElement | undefined;
    static observedAttributes: string[];
    static formAssociated: boolean;
    set min(min: number);
    get min(): number;
    set max(max: number);
    get max(): number;
    set step(step: number);
    get step(): number;
    set value(values: string);
    get value(): string;
    set disabled(value: any);
    get disabled(): any;
    set valuePrecision(precision: any);
    get valuePrecision(): any;
    /**
     * Form data support
     * The following properties and methods aren't strictly required,
     * but browser-level form controls provide them. Providing them helps
     * ensure consistency with browser-provided controls.
     */
    get form(): any;
    get name(): any;
    get type(): any;
    get validity(): any;
    get validationMessage(): any;
    get willValidate(): any;
    checkValidity(): any;
    reportValidity(): any;
    formDisabledCallback(value: any): void;
    connectedCallback(): void;
    disconnectedCallback(): void;
    attributeChangedCallback(name: any, oldValue: any, newValue: any): void;
    /**
     * Increments the value
     * @param {number} amount - The amount to increment by.
     */
    stepUp(amount?: number): void;
    /**
     * Decrements the value
     * @param {number} amount - The amount to decrement by.
     */
    stepDown(amount?: number): void;
    #private;
}