observe-element-in-viewport/dist/src/index.d.ts

Wrapper around IntersectionObserver to hide away its weirdness and increase ease of usability

export interface Options {
    viewport: null | Element;
    modTop: string;
    modRight: string;
    modBottom: string;
    modLeft: string;
    threshold: number | number[];
}
export interface CustomEntry extends IntersectionObserverEntry {
    isInViewport?: boolean;
}
export declare type UnobserveFn = () => void;
export declare type Handler = (entry: CustomEntry, unobserveFn: UnobserveFn, el: Element) => any;
/**
 * Given a set of options, DOM node and in and out of viewport handlers,
 * this function uses an IntersectionObserver to figure out whether
 * the DOM node is in viewport or not and calls the respective handler.
 * It is a curried function and expects the parameters in the not so
 * common order so as to make it easier to observe multiple DOM nodes
 * with the same settings/options and maybe even the same handlers.
 *
 * @param {Node} target - target element to observe
 * and intersection threshold
 * @param {function} inHandler - fn to call when element is in viewport
 * for each given threshhold
 * @param {function} outHandler - fn to call when element leaves viewport
 * @param {object} opts - options to configure the viewport
 *
 * @return {function} unobserve element function
 */
export declare function observeElementInViewport(target: Element | null, inHandler: Handler, outHandler?: Handler, opts?: Partial<Options>): UnobserveFn;
export declare const isInViewport: (el: Element | null, opts?: Partial<Options>) => Promise<boolean | {}>;
//# sourceMappingURL=index.d.ts.map