react-intersection-observer-ng/dist/typings/types.d.ts

Monitor if a component is inside the viewport, using IntersectionObserver API

import * as React from 'react';
declare type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>;
declare type RenderProps = {
    inView: boolean;
    entry: IntersectionObserverEntry | undefined;
    ref: React.RefObject<any> | ((node?: Element | null) => void);
};
export declare type IntersectionOptions = IntersectionObserverInit & {
    /** Only trigger the inView callback once */
    triggerOnce?: boolean;
    debounce?: number;
};
export declare type IntersectionObserverProps = IntersectionOptions & {
    /**
     * Children expects a function that receives an object
     * contain an `inView` boolean and `ref` that should be
     * assigned to the element root.
     */
    children: (fields: RenderProps) => React.ReactNode;
    /** Call this function whenever the in view state changes */
    onChange?: (inView: boolean, entry: IntersectionObserverEntry) => void;
};
/**
 * Types specific to the PlainChildren rendering of InView
 * */
export declare type PlainChildrenProps = IntersectionOptions & {
    children: React.ReactNode;
    /**
     * Render the wrapping element as this element.
     * @default `'div'`
     */
    as?: React.ElementType<any>;
    /**
     * Element tag to use for the wrapping component
     * @deprecated Replace with the 'as' prop
     */
    tag?: React.ElementType<any>;
    /** Call this function whenever the in view state changes */
    onChange?: (inView: boolean, entry: IntersectionObserverEntry) => void;
} & Omit<React.HTMLProps<HTMLElement>, 'onChange'>;
export declare type HookResponse = [((node?: Element | null) => void), boolean, IntersectionObserverEntry | undefined];
export {};