rsuite/esm/internals/Windowing/List.js

A suite of react components

'use client';
import _extends from "@babel/runtime/helpers/esm/extends";
import React, { useRef, useImperativeHandle, useCallback, useMemo } from 'react';
import ScrollView from "../ScrollView/index.js";
import { VariableSizeList } from 'react-window';
import { useCustom } from "../hooks/index.js";
import { forwardRef } from "../utils/index.js";
export const defaultItemSize = () => 36;
const OuterElementType = forwardRef(function OuterElementType(props, ref) {
  return /*#__PURE__*/React.createElement(ScrollView, _extends({
    scrollShadow: true,
    ref: ref
  }, props));
});

/**
 * This component renders a virtualized list of elements with either fixed or dynamic heights.
 *
 * @private
 */
const List = forwardRef((props, ref) => {
  const {
    rowHeight,
    as: Component = VariableSizeList,
    itemSize: itemSizeProp,
    scrollShadow,
    ...rest
  } = props;
  const listRef = useRef(null);
  const {
    rtl
  } = useCustom();
  useImperativeHandle(ref, () => ({
    resetAfterIndex: (index, shouldForceUpdate) => {
      listRef.current?.resetAfterIndex?.(index, shouldForceUpdate);
    },
    scrollTo: scrollOffset => {
      listRef.current?.scrollTo?.(scrollOffset);
    },
    scrollToItem: (index, align) => {
      listRef.current?.scrollToItem?.(index, align);
    },
    scrollToRow: index => {
      listRef.current?.scrollToItem?.(index);
    }
  }));
  const setRowHeight = useCallback(index => {
    return typeof rowHeight === 'function' ? rowHeight({
      index
    }) : rowHeight || 0;
  }, [rowHeight]);
  const itemSize = useMemo(() => {
    if (typeof itemSizeProp === 'function') return itemSizeProp;
    return () => itemSizeProp;
  }, [itemSizeProp]);
  const compatibleProps = {
    itemSize,
    ...rest
  };
  if (rowHeight) {
    compatibleProps.itemSize = Component === VariableSizeList ? setRowHeight : rowHeight;
  }
  return /*#__PURE__*/React.createElement(Component, _extends({
    ref: listRef,
    direction: rtl ? 'rtl' : 'ltr'
  }, compatibleProps, {
    outerElementType: scrollShadow ? OuterElementType : undefined
  }));
});
List.displayName = 'List';
export default List;