UNPKG

svelte-motion

Version:

Svelte animation library based on the React library framer-motion.

142 lines (141 loc) 3.05 kB
/** based on framer-motion@4.1.17, Copyright (c) 2018 Framer B.V. */ import { Point2D, TransformPoint2D } from "../types/geometry"; export declare type AnyPointerEvent = MouseEvent | TouchEvent | PointerEvent; /** * Passed in to pan event handlers like `onPan` the `PanInfo` object contains * information about the current state of the tap gesture such as its * `point`, `delta`, `offset` and `velocity`. * * @motion * * ```jsx * <MotionDiv onPan={(event, info) => { * console.log(info.point.x, info.point.y) * }} /> * ``` * * @public */ export interface PanInfo { /** * Contains `x` and `y` values for the current pan position relative * to the device or page. * * @motion * * ```jsx * function onPan(event, info) { * console.log(info.point.x, info.point.y) * } * * <MotionDiv onPan={onPan} /> * ``` * * @public */ point: Point2D; /** * Contains `x` and `y` values for the distance moved since * the last event. * * @motion * * ```jsx * function onPan(event, info) { * console.log(info.delta.x, info.delta.y) * } * * <MotionDiv onPan={onPan} /> * ``` * * @public */ delta: Point2D; /** * Contains `x` and `y` values for the distance moved from * the first pan event. * * @motion * * ```jsx * function onPan(event, info) { * console.log(info.offset.x, info.offset.y) * } * * <MotionDiv onPan={onPan} /> * ``` * * @public */ offset: Point2D; /** * Contains `x` and `y` values for the current velocity of the pointer, in px/ms. * * @motion * * ```jsx * function onPan(event, info) { * console.log(info.velocity.x, info.velocity.y) * } * * <MotionDiv onPan={onPan} /> * ``` * * @public */ velocity: Point2D; } export declare type PanHandler = (event: Event, info: PanInfo) => void; interface PanSessionHandlers { onSessionStart: PanHandler; onStart: PanHandler; onMove: PanHandler; onEnd: PanHandler; onSessionEnd: PanHandler; } interface PanSessionOptions { transformPagePoint?: TransformPoint2D; } /** * @internal */ export declare class PanSession { /** * @internal */ private history; /** * @internal */ private startEvent; /** * @internal */ private lastMoveEvent; /** * @internal */ private lastMoveEventInfo; /** * @internal */ private transformPagePoint?; /** * @internal */ private handlers; /** * @internal */ private removeListeners; constructor(event: AnyPointerEvent, handlers: Partial<PanSessionHandlers>, { transformPagePoint }?: PanSessionOptions); private updatePoint; private handlePointerMove; private handlePointerUp; updateHandlers(handlers: Partial<PanSessionHandlers>): void; end(): void; } export {};