react-window.d.ts

/* eslint-disable */
declare module 'react-window' {
  import { Requireable, Validator } from 'prop-types';

  export type Direction = 'vertical' | 'horizontal';
  export type Alignment = 'auto' | 'center' | 'end' | 'start';

  export type RenderProps<TDataType extends any = any> = {
    key?: string;
    data?: TDataType;
    index: number;
    isScrolling?: boolean;
    style: React.CSSProperties;
  }

  export type ItemsRenderedProps = {
    overscanStartIndex: number;
    ovserscanStopIndex: number;
    visibleStartIndex: number;
    visibleStopIndex: number;
  };

  export type OnScrollProps = {
    scrollDirection: Direction;
    scrollOffset: number;
    scrollUpdateWasRequested: boolean;
  };

  export type OnItemsRendered = (o: ItemsRenderedProps) => void;
  export type OnScroll = (o: OnScrollProps) => void;

  export interface ListProps<TDataType> {
    /**
     * React component responsible for rendering the individual item specified by an index prop. This component also receives a style prop (used for positioning).
     * If useIsScrolling is enabled for the list, the component also receives an additional isScrolling boolean prop.
     */
    children(props: RenderProps<TDataType>): React.ReactNode;
    /**
     * Optional CSS class to attach to outermost <div> element.
     */
    className?: string;
    /**
     * Primary scroll direction of the list. Acceptable values are:
     * - vertical (default) - Up/down scrolling.
     * - horizontal - Left/right scrolling.
     * Note that lists may scroll in both directions (depending on CSS) but content will only be windowed in the primary direction.
     */
    direction?: Direction;
    /**
     * Height of the list.
     * For vertical lists, this must be a number. It affects the number of rows that will be rendered (and displayed) at any given time.
     * For horizontal lists, this can be a number or a string (e.g. "50%").
     */
    height: number | string;
    /**
     * Scroll offset for initial render.
     * For vertical lists, this affects scrollTop. For horizontal lists, this affects scrollLeft.
     */
    initialScrollOffset?: number;
    /**
     * Ref to attach to the inner container element. This is an advanced property.
     */
    innerRef?: React.Ref<HTMLElement> | React.RefObject<HTMLElement>;
    /**
     * Tag name passed to document.createElement to create the inner container element. This is an advanced property; in most cases, the default ("div") should be used.
     */
    innerTag?: string;
    /**
     * Total number of items in the list. Note that only a few items will be rendered and displayed at a time.
     */
    itemCount: number;
    /**
     * Contextual data to be passed to the item renderer as a data prop. This is a light-weight alternative to React's built-in context API.
     */
    itemData?: TDataType;
    /**
     * By default, lists will use an item's index as its key. This is okay if:
     *   - Your collections of items is never sorted or modified
     *   - Your item renderer is not stateful and does not extend PureComponent
     * If your list does not satisfy the above constraints, use the itemKey property to specify your own keys for items:
     * @param {number} index
     */
    itemKey?(index: number): string;
    /**
     * Size of a item in the direction being windowed. For vertical lists, this is the row height. For horizontal lists, this is the column width.
     */
    itemSize: number;
    onItemsRendered?: OnItemsRendered;
    onScroll?: OnScroll;
    outerTagName?: string;
    overscanCount?: number;
    style?: React.CSSProperties | null;
    useIsScrolling?: boolean;
    width: number | string;
  }

  export class FixedSizeList<TDataType = any> extends React.PureComponent<ListProps<TDataType>> {
    static propTypes: {
      height: Requireable<number | string>;
      width: Requireable<number | string>;
      overscanCount: Validator<number>;
      innerRef: Validator<ListProps<any>['innerRef']>;
      innerTag?: Validator<string>;
      itemData?: Validator<any>;
      className?: Validator<string>;
      itemSize?: Validator<number>;
      itemKey: Validator<(index: number) => string>;
    };

    static defaultProps: {
      direction: 'vertical',
      initialScrollOffset: 0;
      innerTagName: 'div';
      outerTagName: 'div';
      overscanCount: 1;
      useIsScrolling: false;
      style: null;
    };

    scrollTo(scrollOffset: number): void;
    scrollToItem(index: number, align: Alignment): void;
  }
}