@exadel/esl/modules/esl-carousel/plugin/touch/esl-carousel.touch.mixin.d.ts

Exadel Smart Library (ESL) is the lightweight custom elements library that provide a set of super-flexible components

import { ESLCarouselPlugin } from '../esl-carousel.plugin';
import type { ElementScrollOffset } from '../../../esl-utils/dom/scroll';
export interface ESLCarouselTouchConfig {
    /** Condition to have drag and swipe support active. (primary property) */
    type: 'drag' | 'swipe' | 'none' | '';
    /** Min distance in pixels to activate dragging mode */
    tolerance: number;
    /** Defines type of swipe */
    swipeType: 'group' | 'slide';
    /** Defines distance tolerance to swipe */
    swipeDistance: number;
    /** Defines timeout tolerance to swipe */
    swipeTimeout: number;
}
/**
 * {@link ESLCarousel} Touch handler mixin
 *
 * Usage:
 * ```
 * <esl-carousel esl-carousel-touch></esl-carousel>
 *
 * <esl-carousel esl-carousel-touch="@XS => swipe | @+SM => drag"></esl-carousel>
 * ```
 */
export declare class ESLCarouselTouchMixin extends ESLCarouselPlugin<ESLCarouselTouchConfig> {
    static is: string;
    static readonly DRAG_TYPE = "drag";
    static readonly SWIPE_TYPE = "swipe";
    static DEFAULT_CONFIG_KEY: string;
    static readonly DEFAULT_CONFIG: ESLCarouselTouchConfig;
    /** Start index of the drag action */
    protected startIndex: number;
    /** Start pointer event to detect action */
    protected startEvent?: PointerEvent;
    /** Initial scroll offsets, filled on touch action start */
    protected startScrollOffsets: ElementScrollOffset[];
    get config(): ESLCarouselTouchConfig;
    protected onConfigChange(): void;
    /** @returns whether the swipe mode is active */
    get isSwipeMode(): boolean;
    /** @returns whether the drag mode is active */
    get isDragMode(): boolean;
    /** @returns whether the plugin is disabled (due to carousel state or plugin config) */
    get isDisabled(): boolean;
    /** @returns whether the drugging is prevented by external conditions (scroll, selection) */
    get isPrevented(): boolean;
    /** @returns offset between start point and passed event point */
    protected getOffset(event: PointerEvent): number;
    /** @returns if the passed event leads to swipe action */
    protected isSwipeAccepted(event: PointerEvent): boolean;
    /** Handles `mousedown` / `touchstart` event to manage thumb drag start and scroll clicks */
    protected _onPointerDown(event: PointerEvent): void;
    /** Processes `mousemove` and `touchmove` events. */
    protected _onPointerMove(event: PointerEvent): void;
    /** Processes `mouseup` and `touchend` events. */
    protected _onPointerUp(event: PointerEvent): void;
}
declare global {
    export interface ESLCarouselNS {
        Touch: typeof ESLCarouselTouchMixin;
    }
}