UNPKG

igniteui-webcomponents

Version:

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.

82 lines (81 loc) 2.94 kB
import type { ReactiveController, ReactiveControllerHost } from 'lit'; import type { Ref } from 'lit/directives/ref.js'; /** * Configuration object for a {@link GesturesController} instance. * @ignore */ export interface GesturesOptions { /** * By default, the controller listens for pointer/touch events in the context of the host element. * If you pass a `ref`, you can limit the observation to a certain DOM part of the host scope. */ ref?: Ref<HTMLElement>; /** * The maximum amount of milliseconds between the start and end of a gesture combination * before it is recognized as such. */ thresholdTime?: number; /** * The minimum amount a "pointer" should travel in pixels, before being recognized as a * gesture. */ thresholdDistance?: number; /** * When enabled, the controller will skip events generated by a mouse device. */ touchOnly?: boolean; } type GestureDirection = 'left' | 'up' | 'right' | 'down'; type SwipeEvents = 'swipe' | 'swipe-left' | 'swipe-up' | 'swipe-right' | 'swipe-down'; export type GestureData = { direction: GestureDirection; type: string; xStart: number; xEnd: number; yStart: number; yEnd: number; }; export declare class SwipeEvent extends Event { readonly data: GestureData; readonly name: string; constructor(name: string, data: GestureData, initOptions?: EventInit); } declare class GesturesController extends EventTarget implements ReactiveController { private readonly _host; private readonly _ref?; private readonly _abortHandle; private _options; private _pointerState; protected get _element(): HTMLElement; /** Get the current configuration object */ get options(): GesturesOptions; constructor(host: ReactiveControllerHost & HTMLElement, options?: GesturesOptions); /** * Add an event listener for a given swipe event. */ set(type: SwipeEvents, callback: (event: SwipeEvent) => void, options?: AddEventListenerOptions): this; /** @internal */ handleEvent(event: PointerEvent): void; /** @internal */ hostConnected(): void; /** @internal */ hostDisconnected(): void; /** Updates the configuration of the controller */ updateOptions(options: Omit<GesturesOptions, 'ref'>): void; private _getGestureState; private _setTouchActionState; private _resetState; private _setPointerCaptureState; private _handlePointerDown; private _handlePointerMove; private _emit; private _createEventArgs; protected _recognize(): GestureDirection | false; private _handleLostPointerCapture; } /** * Adds a {@link GesturesController} responsible for managing gesture behaviors * for the given host element. */ export declare function addGesturesController(host: ReactiveControllerHost & HTMLElement, options?: GesturesOptions): GesturesController; export {};