@sv-use/core
Version:
A collection of Svelte 5 utilities.
55 lines (54 loc) • 1.7 kB
TypeScript
import type { ConfigurableWindow } from '../__internal__/configurable.js';
import type { MaybeGetter } from '../__internal__/types.js';
type Position = {
x: number;
y: number;
};
type OnSwipeDirection = 'up' | 'down' | 'left' | 'right' | 'none';
interface OnSwipeOptions extends ConfigurableWindow {
/**
* Whether to register events as passive or not.
* @default true
*/
passive?: boolean;
/**
* The treshold in pixels before considering the touch event as a swipe.
* @default 50
*/
threshold?: number;
/**
* Callback on swipe start.
* @default () => {}
*/
onStart?(e: TouchEvent): void;
/**
* Callback on swipe move.
* @default () => {}
*/
onMove?(e: TouchEvent): void;
/**
* Callback on swipe end.
* @default () => {}
*/
onEnd?(e: TouchEvent, direction: OnSwipeDirection): void;
}
type OnSwipeReturn = {
readonly isSwiping: boolean;
readonly direction: OnSwipeDirection;
readonly coordsStart: Position;
readonly coordsEnd: Position;
/** The distance travelled by the swipe in the `x` axis. */
readonly lengthX: number;
/** The distance travelled by the swipe in the `y` axis. */
readonly lengthY: number;
reset: () => void;
cleanup: () => void;
};
/**
* Reactive swipe detection for mobile devices.
* @param target The target on which to detect swipe events.
* @param options Additional options to customize the behavior.
* @see https://svelte-librarian.github.io/sv-use/docs/core/on-swipe
*/
export declare function onSwipe(target: MaybeGetter<EventTarget | null | undefined>, options?: OnSwipeOptions): OnSwipeReturn;
export {};