@anton.bobrov/react-vevet-hooks/lib/types/hooks/useDraggerDirection.d.ts

A collection of custom React hooks designed to seamlessly integrate with the `Vevet` library

import { RefObject } from 'react';
import { NDraggerDirection } from 'vevet';
export interface IUseDraggerDirectionProps extends Pick<NDraggerDirection.IStaticProps, 'minLength'>, Pick<NDraggerDirection.IChangeableProps, 'isEnabled'> {
    /** Reference to the container element for dragging gestures */
    ref: RefObject<HTMLElement>;
    /** Callback event triggered on any swipe */
    onAny?: (direction: 'left' | 'right' | 'up' | 'down') => void;
    /** Callback event triggered on left swipe */
    onLeft?: () => void;
    /** Callback event triggered on right swipe */
    onRight?: () => void;
    /** Callback event triggered on up swipe */
    onUp?: () => void;
    /** Callback event triggered on down swipe */
    onDown?: () => void;
}
/**
 * Custom React hook that utilizes `vevet`'s `DraggerDirection` for detecting swipe gestures.
 *
 * This hook sets up a dragger instance to listen for swipe events in four directions
 * (left, right, up, down).
 *
 * @example
 * const MyComponent = () => {
 *   const ref = useRef<HTMLDivElement>(null);
 *
 *   useDraggerDirection({
 *     ref,
 *     minLength: 50,
 *     onAny: (direction) => console.log(`${direction}`),
 *     onLeft: () => console.log('Swiped left!'),
 *     onRight: () => console.log('Swiped right!'),
 *     onUp: () => console.log('Swiped up!'),
 *     onDown: () => console.log('Swiped down!'),
 *   });
 *
 *   return <div ref={ref}>Swipe me!</div>;
 * };
 */
export declare function useDraggerDirection({ ref, minLength, onAny: onAnyProp, onLeft: onLeftProp, onRight: onRightProp, onUp: onUpProp, onDown: onDownProp, ...changeableProps }: IUseDraggerDirectionProps): void;
//# sourceMappingURL=useDraggerDirection.d.ts.map