@findify/react-components/lib/components/common/VirtualizedList/view.js

Findify react UI components

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }

function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }

import { createElement, useCallback, useRef } from 'react';
import { CellMeasurerCache, CellMeasurer } from 'react-virtualized/dist/commonjs/CellMeasurer';
import { AutoSizer } from 'react-virtualized/dist/commonjs/AutoSizer';
import { List } from 'react-virtualized/dist/commonjs/List';
import cx from 'classnames';
import { useMemo } from 'react';
import { jsx as _jsx } from "react/jsx-runtime";
var styles = {};

var View = function View(_ref) {
  var initAutoSizer = _ref.initAutoSizer,
      initList = _ref.initList,
      array = _ref.array,
      cache = _ref.cache,
      rowRenderer = _ref.rowRenderer,
      className = _ref.className,
      theme = _ref.theme,
      limit = _ref.limit;
  var height = useMemo(function () {
    return cache && Array.from(Array(limit).keys()).reduce(function (acc, i) {
      return acc + cache.rowHeight(i);
    }, 0);
  }, [cache]);
  return /*#__PURE__*/_jsx("div", {
    className: cx(className, theme.list),
    children: /*#__PURE__*/_jsx(AutoSizer, {
      ref: initAutoSizer,
      disableHeight: true,
      children: function children(_ref2) {
        var width = _ref2.width;
        return /*#__PURE__*/_jsx(List, {
          className: theme.list,
          ref: initList,
          height: height || 100,
          width: width,
          rowCount: array.size,
          overscanRowCount: 2,
          rowHeight: cache.rowHeight,
          rowRenderer: rowRenderer,
          style: {
            overflowX: 'hidden'
          }
        });
      }
    })
  });
};

export default (function (_ref3) {
  var array = _ref3.array,
      factory = _ref3.factory,
      rest = _objectWithoutProperties(_ref3, ["array", "factory"]);

  var cache = useRef(new CellMeasurerCache({
    fixedWidth: true
  }));
  var autosizer = useRef(null);
  var list = useRef(null);
  var rowRenderer = useCallback(function (_ref4) {
    var index = _ref4.index,
        key = _ref4.key,
        parent = _ref4.parent,
        style = _ref4.style;
    var item = array.get(index);
    return /*#__PURE__*/createElement(CellMeasurer, {
      parent: parent,
      key: key,
      cache: cache.current,
      columnIndex: 0,
      rowIndex: index
    }, function () {
      return /*#__PURE__*/createElement(factory, _objectSpread(_objectSpread({}, rest), {}, {
        item: item,
        style: style,
        key: item.hashCode()
      }));
    });
  }, [array]);
  return /*#__PURE__*/createElement(View, _objectSpread(_objectSpread({}, rest), {}, {
    array: array,
    theme: styles,
    rowRenderer: rowRenderer,
    initAutoSizer: autosizer,
    initList: list,
    cache: cache.current
  }));
});