react-atom-trigger/lib/index.d.ts

React component to execute code when you scroll to an element. Simple react-waypoint alternative in typescript.

import React from "react";

//#region src/AtomTrigger.types.d.ts
type ScrollEvent = {
  scrollX: number;
  scrollY: number;
};
type Dimensions = {
  width: number;
  height: number;
};
type DebugInfo = {
  timesTriggered: {
    leftViewport: number;
    enteredViewport: number;
  };
  trigger: 'entered' | 'left';
};
interface IAtomTriggerProps {
  scrollEvent: ScrollEvent;
  behavior?: 'default' | 'enter' | 'leave';
  callback: () => unknown;
  getDebugInfo?: (data: DebugInfo) => void;
  triggerOnce?: boolean;
  className?: string;
  dimensions: Dimensions;
  offset?: [number, number, number, number];
}
//#endregion
//#region src/AtomTrigger.d.ts
declare const AtomTrigger: React.FC<IAtomTriggerProps>;
//#endregion
//#region src/utils.d.ts
type Options = {
  passiveEventListener?: boolean;
  eventListenerTimeoutMs?: number;
};
declare function log<T>(log: T, color?: string): void;
declare function useWindowDimensions(options?: Options | undefined): Dimensions;
declare function useContainerScroll({
  containerRef,
  options
}: {
  containerRef?: React.RefObject<HTMLDivElement>;
  options?: Options;
}): ScrollEvent;
declare function useWindowScroll(options?: Options): ScrollEvent;
//#endregion
export { AtomTrigger, Options, log, useContainerScroll, useWindowDimensions, useWindowScroll };