@exadel/esl/modules/esl-drag-to-scroll/core/esl-drag-to-scroll.mixin.d.ts

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

import { ESLMixinElement } from '../../esl-mixin-element/core';
import type { Point } from '../../esl-utils/dom/point';
/**
 * ESLDragToScrollConfig - configuration options for the ESLDragToScrollMixin
 */
export interface ESLDragToScrollConfig {
    /** Determines the scrolling axis. Options are 'x', 'y', or 'both' (default) */
    axis: 'x' | 'y' | 'both';
    /** Class name to apply during dragging. Defaults to 'dragging' */
    cls: string;
    /** Class name to apply when the element is draggable. Defaults to 'is-draggable' */
    draggableCls: string;
    /** Min distance in pixels to activate dragging mode. Defaults to 10 */
    tolerance: number;
    /** Prevent dragging if text is selected or not. Defaults to true */
    selection: boolean;
}
/**
 * ESLDragToScrollMixin - mixin to enable drag-to-scroll functionality for any scrollable container element
 * @author Anna Barmina, Alexey Stsefanovich (ala'n)
 *
 * Use example:
 * ```
 * <div class="esl-scrollable-content" esl-drag-to-scroll>
 *   <!-- Content here -->
 * </div>
 * ```
 */
export declare class ESLDragToScrollMixin extends ESLMixinElement {
    static is: string;
    /** Default configuration object */
    static DEFAULT_CONFIG: ESLDragToScrollConfig;
    /** Initial pointer event when dragging starts */
    protected startEvent: PointerEvent;
    protected startScrollLeft: number;
    protected startScrollTop: number;
    private _isDragging;
    /** Flag indicating whether dragging is in progress */
    get isDragging(): boolean;
    protected set isDragging(value: boolean);
    /**
     * Mixin configuration (merged with default)
     * @see ESLDragToScrollConfig
     */
    get config(): ESLDragToScrollConfig;
    set config(value: ESLDragToScrollConfig | string);
    get isDraggable(): boolean;
    /** Flag indicating whether text is selected */
    get hasSelection(): boolean;
    protected connectedCallback(): void;
    protected attributeChangedCallback(name: string, oldValue: string, newValue: string): void;
    /** @returns the offset of the pointer event relative to the start event */
    getEventOffset(event: PointerEvent): Point;
    /** Scrolls the host element by the specified offset */
    scrollBy(offset: Point): void;
    /** Dynamically update draggable state based on content size */
    protected onResize(): void;
    /** Handles the pointerdown event to start dragging */
    protected onPointerDown(event: PointerEvent): void;
    /** Handles the pointermove event to perform scrolling while dragging */
    protected onPointerMove(event: PointerEvent): void;
    /** Handles the pointerup and pointercancel events to stop dragging */
    protected onPointerUp(event: PointerEvent): void;
    protected onClick(event: MouseEvent): void;
}