| 1 | import { SyntheticEvent } from 'react';
|
| 2 | export declare type ThrottledHandler<TEvent> = ((event: TEvent) => void) & {
|
| 3 | clear(): void;
|
| 4 | };
|
| 5 | /**
|
| 6 | * Creates a event handler function throttled by `requestAnimationFrame` that
|
| 7 | * returns the **most recent** event. Useful for noisy events that update react state.
|
| 8 | *
|
| 9 | * ```tsx
|
| 10 | * function Component() {
|
| 11 | * const [position, setPosition] = useState();
|
| 12 | * const handleMove = useThrottledEventHandler<React.PointerEvent>(
|
| 13 | * (event) => {
|
| 14 | * setPosition({
|
| 15 | * top: event.clientX,
|
| 16 | * left: event.clientY,
|
| 17 | * })
|
| 18 | * }
|
| 19 | * )
|
| 20 | *
|
| 21 | * return (
|
| 22 | * <div onPointerMove={handleMove}>
|
| 23 | * <div style={position} />
|
| 24 | * </div>
|
| 25 | * );
|
| 26 | * }
|
| 27 | * ```
|
| 28 | *
|
| 29 | * @param handler An event handler function
|
| 30 | * @typeParam TEvent The event object passed to the handler function
|
| 31 | * @returns The event handler with a `clear` method attached for clearing any in-flight handler calls
|
| 32 | *
|
| 33 | */
|
| 34 | export default function useThrottledEventHandler<TEvent = SyntheticEvent>(handler: (event: TEvent) => void): ThrottledHandler<TEvent>;
|
| 35 | |
| \ | No newline at end of file |