igniteui-webcomponents/components/slider/slider.d.ts

Ignite UI for Web Components is a complete library of UI components, giving you the ability to build modern web applications using encapsulation and the concept of reusable components in a dependency-free approach.

import type { Constructor } from '../common/mixins/constructor.js';
import { type FormValue } from '../common/mixins/forms/form-value.js';
import { IgcSliderBaseComponent } from './slider-base.js';
export interface IgcSliderComponentEventMap {
    /**
     * Emitted when a value is changed via thumb drag or keyboard interaction.
     */
    igcInput: CustomEvent<number>;
    /**
     * Emitted when a value change is committed on a thumb drag end or keyboard interaction.
     */
    igcChange: CustomEvent<number>;
}
declare const IgcSliderComponent_base: Constructor<import("../common/mixins/forms/types.js").FormAssociatedElementInterface> & Constructor<import("../common/mixins/event-emitter.js").EventEmitterInterface<IgcSliderComponentEventMap>> & Constructor<IgcSliderBaseComponent>;
/**
 * A slider component used to select numeric value within a range.
 *
 * @element igc-slider
 *
 * @fires igcInput - Emitted when a value is changed via thumb drag or keyboard interaction.
 * @fires igcChange - Emitted when a value change is committed on a thumb drag end or keyboard interaction.
 *
 * @csspart base - The base wrapper of the slider.
 * @csspart ticks - The ticks container.
 * @csspart tick-group - The tick group container.
 * @csspart tick - The tick element.
 * @csspart tick-label - The tick label element.
 * @csspart tick-label-inner - The inner element of the tick label.
 * @csspart thumbs - The thumbs container.
 * @csspart thumb - The thumb element.
 * @csspart thumb-label - The thumb tooltip label container.
 * @csspart thumb-label-inner - The thumb tooltip label inner element.
 * @csspart track - The track container.
 * @csspart steps - The track steps element.
 * @csspart inactive - The inactive element of the track.
 * @csspart fill - The filled part of the track.
 */
export default class IgcSliderComponent extends IgcSliderComponent_base {
    static readonly tagName = "igc-slider";
    static register(): void;
    protected _formValue: FormValue<number>;
    /**
     * The current value of the component.
     * @attr
     */
    set value(value: number);
    get value(): number;
    protected get activeValue(): number;
    constructor();
    protected normalizeValue(): void;
    protected getTrackStyle(): {
        width: string;
    };
    protected updateValue(increment: number): boolean;
    protected emitInputEvent(): void;
    protected emitChangeEvent(): void;
    /**
     * Increments the value of the slider by `stepIncrement * step`, where `stepIncrement` defaults to 1.
     * @param stepIncrement Optional step increment. If no parameter is passed, it defaults to 1.
     */
    stepUp(stepIncrement?: number): void;
    /**
     * Decrements the value of the slider by `stepDecrement * step`, where `stepDecrement` defaults to 1.
     * @param stepDecrement Optional step decrement. If no parameter is passed, it defaults to 1.
     */
    stepDown(stepDecrement?: number): void;
    protected renderThumbs(): import("lit-html").TemplateResult<1>;
}
declare global {
    interface HTMLElementTagNameMap {
        'igc-slider': IgcSliderComponent;
    }
}
export {};