@depup/react-virtualized 9.22.6-depup.0

package/dist/es/Grid/utils/updateScrollIndexHelper.jest.js

@@ -0,0 +1,174 @@
+import updateScrollIndexHelper from './updateScrollIndexHelper';
+import CellSizeAndPositionManager from './CellSizeAndPositionManager';
+
+// Default cell sizes and offsets for use in shared tests
+export function getCellSizeAndPositionManager(_ref) {
+  var _ref$cellCount = _ref.cellCount,
+    cellCount = _ref$cellCount === void 0 ? CELL_SIZES.length : _ref$cellCount,
+    _ref$estimatedCellSiz = _ref.estimatedCellSize,
+    estimatedCellSize = _ref$estimatedCellSiz === void 0 ? 10 : _ref$estimatedCellSiz;
+  return new CellSizeAndPositionManager({
+    cellCount: cellCount,
+    cellSizeGetter: function cellSizeGetter(_ref2) {
+      var index = _ref2.index;
+      return CELL_SIZES[index % CELL_SIZES.length];
+    },
+    estimatedCellSize: estimatedCellSize
+  });
+}
+var CELL_SIZES = [10,
+// 0: 0..0 (min)
+20,
+// 1: 0..10
+15,
+// 2: 0..30
+10,
+// 3: 5..45
+15,
+// 4: 20..55
+30,
+// 5: 50..70
+20,
+// 6: 70..100
+10,
+// 7: 80..110
+30 //  8: 110..110 (max)
+];
+describe('updateScrollIndexHelper', function () {
+  function helper() {
+    var _ref3 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+      _ref3$cellCount = _ref3.cellCount,
+      cellCount = _ref3$cellCount === void 0 ? undefined : _ref3$cellCount,
+      cellSizeAndPositionManager = _ref3.cellSizeAndPositionManager,
+      _ref3$cellSize = _ref3.cellSize,
+      cellSize = _ref3$cellSize === void 0 ? 10 : _ref3$cellSize,
+      _ref3$previousCellsCo = _ref3.previousCellsCount,
+      previousCellsCount = _ref3$previousCellsCo === void 0 ? undefined : _ref3$previousCellsCo,
+      _ref3$previousCellSiz = _ref3.previousCellSize,
+      previousCellSize = _ref3$previousCellSiz === void 0 ? 10 : _ref3$previousCellSiz,
+      _ref3$previousScrollT = _ref3.previousScrollToAlignment,
+      previousScrollToAlignment = _ref3$previousScrollT === void 0 ? 'auto' : _ref3$previousScrollT,
+      previousScrollToIndex = _ref3.previousScrollToIndex,
+      _ref3$previousSize = _ref3.previousSize,
+      previousSize = _ref3$previousSize === void 0 ? 50 : _ref3$previousSize,
+      _ref3$scrollOffset = _ref3.scrollOffset,
+      scrollOffset = _ref3$scrollOffset === void 0 ? 0 : _ref3$scrollOffset,
+      _ref3$scrollToAlignme = _ref3.scrollToAlignment,
+      scrollToAlignment = _ref3$scrollToAlignme === void 0 ? 'auto' : _ref3$scrollToAlignme,
+      scrollToIndex = _ref3.scrollToIndex,
+      _ref3$size = _ref3.size,
+      size = _ref3$size === void 0 ? 50 : _ref3$size;
+    cellSizeAndPositionManager = cellSizeAndPositionManager || getCellSizeAndPositionManager({
+      cellCount: cellCount
+    });
+    cellCount = cellCount === undefined ? cellSizeAndPositionManager.getCellCount() : cellCount;
+    previousCellsCount = previousCellsCount === undefined ? cellCount : previousCellsCount;
+    var updateScrollIndexCallbackCalled = false;
+    function updateScrollIndexCallback() {
+      updateScrollIndexCallbackCalled = true;
+    }
+    updateScrollIndexHelper({
+      cellCount: cellCount,
+      cellSizeAndPositionManager: cellSizeAndPositionManager,
+      cellSize: cellSize,
+      previousCellsCount: previousCellsCount,
+      previousCellSize: previousCellSize,
+      previousScrollToAlignment: previousScrollToAlignment,
+      previousScrollToIndex: previousScrollToIndex,
+      previousSize: previousSize,
+      scrollOffset: scrollOffset,
+      scrollToAlignment: scrollToAlignment,
+      scrollToIndex: scrollToIndex,
+      size: size,
+      updateScrollIndexCallback: updateScrollIndexCallback
+    });
+    return updateScrollIndexCallbackCalled;
+  }
+  it('should not call :updateScrollIndexCallback if there is no :scrollToIndex and size has not changed', function () {
+    expect(helper()).toEqual(false);
+  });
+  it('should not call :updateScrollIndexCallback if an invalid :scrollToIndex has been specified', function () {
+    expect(helper({
+      size: 100,
+      previousSize: 50,
+      scrollToIndex: -1
+    })).toEqual(false);
+  });
+  it('should call :updateScrollIndexCallback if there is a :scrollToIndex and :size has changed', function () {
+    expect(helper({
+      cellCount: 100,
+      size: 100,
+      previousSize: 50,
+      scrollToIndex: 10
+    })).toEqual(true);
+  });
+  it('should call :updateScrollIndexCallback if there is a :scrollToIndex and :cellSize has changed', function () {
+    expect(helper({
+      cellCount: 100,
+      cellSize: 15,
+      previousCellSize: 20,
+      scrollToIndex: 10
+    })).toEqual(true);
+  });
+  it('should call :updateScrollIndexCallback if previous :scrollToIndex has changed', function () {
+    expect(helper({
+      cellCount: 15,
+      previousScrollToIndex: 20,
+      scrollToIndex: 10
+    })).toEqual(true);
+  });
+  it('should call :updateScrollIndexCallback if :cellCount has been reduced past the current scroll offset', function () {
+    expect(helper({
+      previousCellsCount: 100,
+      scrollOffset: 510
+    })).toEqual(true);
+  });
+  it('should call :updateScrollIndexCallback if there is no :scrollToIndex but :size has been reduced', function () {
+    expect(helper({
+      previousSize: 100,
+      scrollOffset: 510,
+      size: 50
+    })).toEqual(true);
+  });
+  it('should not measure rows if :size or :cellCount have been reduced but only use already measured (or estimated) total size', function () {
+    var cellSizeAndPositionManager = {
+      getCellCount: function getCellCount() {
+        return CELL_SIZES.length;
+      },
+      getTotalSize: function getTotalSize() {
+        return 560;
+      }
+    };
+    expect(helper({
+      cellSizeAndPositionManager: cellSizeAndPositionManager,
+      previousSize: 100,
+      scrollOffset: 510,
+      size: 50
+    })).toEqual(false);
+  });
+  it('should not call :updateScrollIndexCallback if there is no :scrollToIndex but :cellCount has been increased', function () {
+    expect(helper({
+      cellCount: 100,
+      previousCellsCount: 50
+    })).toEqual(false);
+  });
+  it('should not call :updateScrollIndexCallback if there is no :scrollToIndex but :size has been increased', function () {
+    expect(helper({
+      previousSize: 50,
+      size: 100
+    })).toEqual(false);
+  });
+  it('should call :updateScrollIndexCallback if :scrollToAlignment has changed', function () {
+    expect(helper({
+      previousScrollToAlignment: 'start',
+      scrollToAlignment: 'end',
+      scrollToIndex: 5
+    })).toEqual(true);
+  });
+  it('should not call :updateScrollIndexCallback if :scrollToAlignment has changed but there is no :scrollToIndex', function () {
+    expect(helper({
+      previousScrollToAlignment: 'start',
+      scrollToAlignment: 'end'
+    })).toEqual(false);
+  });
+});

package/dist/es/Grid/utils/updateScrollIndexHelper.js

@@ -0,0 +1,79 @@
+/*:: import type {Alignment, CellSize} from '../types';*/
+import ScalingCellSizeAndPositionManager from './ScalingCellSizeAndPositionManager.js';
+
+/**
+ * Helper function that determines when to update scroll offsets to ensure that a scroll-to-index remains visible.
+ * This function also ensures that the scroll ofset isn't past the last column/row of cells.
+ */
+/*:: type Params = {
+  // Width or height of cells for the current axis
+  cellSize?: CellSize,
+
+  // Manages size and position metadata of cells
+  cellSizeAndPositionManager: ScalingCellSizeAndPositionManager,
+
+  // Previous number of rows or columns
+  previousCellsCount: number,
+
+  // Previous width or height of cells
+  previousCellSize: CellSize,
+
+  previousScrollToAlignment: Alignment,
+
+  // Previous scroll-to-index
+  previousScrollToIndex: number,
+
+  // Previous width or height of the virtualized container
+  previousSize: number,
+
+  // Current scrollLeft or scrollTop
+  scrollOffset: number,
+
+  scrollToAlignment: Alignment,
+
+  // Scroll-to-index
+  scrollToIndex: number,
+
+  // Width or height of the virtualized container
+  size: number,
+
+  sizeJustIncreasedFromZero: boolean,
+
+  // Callback to invoke with an scroll-to-index value
+  updateScrollIndexCallback: (index: number) => void,
+};*/
+export default function updateScrollIndexHelper(_ref /*:: */) {
+  var cellSize = _ref /*:: */.cellSize,
+    cellSizeAndPositionManager = _ref /*:: */.cellSizeAndPositionManager,
+    previousCellsCount = _ref /*:: */.previousCellsCount,
+    previousCellSize = _ref /*:: */.previousCellSize,
+    previousScrollToAlignment = _ref /*:: */.previousScrollToAlignment,
+    previousScrollToIndex = _ref /*:: */.previousScrollToIndex,
+    previousSize = _ref /*:: */.previousSize,
+    scrollOffset = _ref /*:: */.scrollOffset,
+    scrollToAlignment = _ref /*:: */.scrollToAlignment,
+    scrollToIndex = _ref /*:: */.scrollToIndex,
+    size = _ref /*:: */.size,
+    sizeJustIncreasedFromZero = _ref /*:: */.sizeJustIncreasedFromZero,
+    updateScrollIndexCallback = _ref /*:: */.updateScrollIndexCallback;
+  var cellCount = cellSizeAndPositionManager.getCellCount();
+  var hasScrollToIndex = scrollToIndex >= 0 && scrollToIndex < cellCount;
+  var sizeHasChanged = size !== previousSize || sizeJustIncreasedFromZero || !previousCellSize || typeof cellSize === 'number' && cellSize !== previousCellSize;
+
+  // If we have a new scroll target OR if height/row-height has changed,
+  // We should ensure that the scroll target is visible.
+  if (hasScrollToIndex && (sizeHasChanged || scrollToAlignment !== previousScrollToAlignment || scrollToIndex !== previousScrollToIndex)) {
+    updateScrollIndexCallback(scrollToIndex);
+
+    // If we don't have a selected item but list size or number of children have decreased,
+    // Make sure we aren't scrolled too far past the current content.
+  } else if (!hasScrollToIndex && cellCount > 0 && (size < previousSize || cellCount < previousCellsCount)) {
+    // We need to ensure that the current scroll offset is still within the collection's range.
+    // To do this, we don't need to measure everything; CellMeasurer would perform poorly.
+    // Just check to make sure we're still okay.
+    // Only adjust the scroll position if we've scrolled below the last set of rows.
+    if (scrollOffset > cellSizeAndPositionManager.getTotalSize() - size) {
+      updateScrollIndexCallback(cellCount - 1);
+    }
+  }
+}

package/dist/es/InfiniteLoader/InfiniteLoader.example.js

@@ -0,0 +1,170 @@
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+import _inherits from "@babel/runtime/helpers/inherits";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { ContentBox, ContentBoxHeader, ContentBoxParagraph } from '../demo/ContentBox';
+import Immutable from 'immutable';
+import AutoSizer from '../AutoSizer';
+import InfiniteLoader from './InfiniteLoader';
+import List from '../List';
+import styles from './InfiniteLoader.example.css';
+var STATUS_LOADING = 1;
+var STATUS_LOADED = 2;
+var InfiniteLoaderExample = /*#__PURE__*/function (_React$PureComponent) {
+  function InfiniteLoaderExample(props) {
+    var _this;
+    _classCallCheck(this, InfiniteLoaderExample);
+    _this = _callSuper(this, InfiniteLoaderExample, [props]);
+    _this.state = {
+      loadedRowCount: 0,
+      loadedRowsMap: {},
+      loadingRowCount: 0
+    };
+    _this._timeoutIdMap = {};
+    _this._clearData = _this._clearData.bind(_this);
+    _this._isRowLoaded = _this._isRowLoaded.bind(_this);
+    _this._loadMoreRows = _this._loadMoreRows.bind(_this);
+    _this._rowRenderer = _this._rowRenderer.bind(_this);
+    return _this;
+  }
+  _inherits(InfiniteLoaderExample, _React$PureComponent);
+  return _createClass(InfiniteLoaderExample, [{
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      Object.keys(this._timeoutIdMap).forEach(function (timeoutId) {
+        clearTimeout(timeoutId);
+      });
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this2 = this;
+      var list = this.context.list;
+      var _this$state = this.state,
+        loadedRowCount = _this$state.loadedRowCount,
+        loadingRowCount = _this$state.loadingRowCount;
+      return /*#__PURE__*/React.createElement(ContentBox, null, /*#__PURE__*/React.createElement(ContentBoxHeader, {
+        text: "InfiniteLoader",
+        sourceLink: "https://github.com/bvaughn/react-virtualized/blob/master/source/InfiniteLoader/InfiniteLoader.example.js",
+        docsLink: "https://github.com/bvaughn/react-virtualized/blob/master/docs/InfiniteLoader.md"
+      }), /*#__PURE__*/React.createElement(ContentBoxParagraph, null, "This component manages just-in-time data fetching to ensure that the all visible rows have been loaded. It also uses a threshold to determine how early to pre-fetch rows (before a user scrolls to them)."), /*#__PURE__*/React.createElement(ContentBoxParagraph, null, /*#__PURE__*/React.createElement("div", {
+        className: styles.cacheButtonAndCountRow
+      }, /*#__PURE__*/React.createElement("button", {
+        className: styles.button,
+        onClick: this._clearData
+      }, "Flush Cached Data"), /*#__PURE__*/React.createElement("div", {
+        className: styles.cacheCountRow
+      }, loadingRowCount, " loading, ", loadedRowCount, " loaded"))), /*#__PURE__*/React.createElement(InfiniteLoader, {
+        isRowLoaded: this._isRowLoaded,
+        loadMoreRows: this._loadMoreRows,
+        rowCount: list.size
+      }, function (_ref) {
+        var onRowsRendered = _ref.onRowsRendered,
+          registerChild = _ref.registerChild;
+        return /*#__PURE__*/React.createElement(AutoSizer, {
+          disableHeight: true
+        }, function (_ref2) {
+          var width = _ref2.width;
+          return /*#__PURE__*/React.createElement(List, {
+            ref: registerChild,
+            className: styles.List,
+            height: 200,
+            onRowsRendered: onRowsRendered,
+            rowCount: list.size,
+            rowHeight: 30,
+            rowRenderer: _this2._rowRenderer,
+            width: width
+          });
+        });
+      }));
+    }
+  }, {
+    key: "_clearData",
+    value: function _clearData() {
+      this.setState({
+        loadedRowCount: 0,
+        loadedRowsMap: {},
+        loadingRowCount: 0
+      });
+    }
+  }, {
+    key: "_isRowLoaded",
+    value: function _isRowLoaded(_ref3) {
+      var index = _ref3.index;
+      var loadedRowsMap = this.state.loadedRowsMap;
+      return !!loadedRowsMap[index]; // STATUS_LOADING or STATUS_LOADED
+    }
+  }, {
+    key: "_loadMoreRows",
+    value: function _loadMoreRows(_ref4) {
+      var _this3 = this;
+      var startIndex = _ref4.startIndex,
+        stopIndex = _ref4.stopIndex;
+      var _this$state2 = this.state,
+        loadedRowsMap = _this$state2.loadedRowsMap,
+        loadingRowCount = _this$state2.loadingRowCount;
+      var increment = stopIndex - startIndex + 1;
+      for (var i = startIndex; i <= stopIndex; i++) {
+        loadedRowsMap[i] = STATUS_LOADING;
+      }
+      this.setState({
+        loadingRowCount: loadingRowCount + increment
+      });
+      var timeoutId = setTimeout(function () {
+        var _this3$state = _this3.state,
+          loadedRowCount = _this3$state.loadedRowCount,
+          loadingRowCount = _this3$state.loadingRowCount;
+        delete _this3._timeoutIdMap[timeoutId];
+        for (var i = startIndex; i <= stopIndex; i++) {
+          loadedRowsMap[i] = STATUS_LOADED;
+        }
+        _this3.setState({
+          loadingRowCount: loadingRowCount - increment,
+          loadedRowCount: loadedRowCount + increment
+        });
+        promiseResolver();
+      }, 1000 + Math.round(Math.random() * 2000));
+      this._timeoutIdMap[timeoutId] = true;
+      var promiseResolver;
+      return new Promise(function (resolve) {
+        promiseResolver = resolve;
+      });
+    }
+  }, {
+    key: "_rowRenderer",
+    value: function _rowRenderer(_ref5) {
+      var index = _ref5.index,
+        key = _ref5.key,
+        style = _ref5.style;
+      var list = this.context.list;
+      var loadedRowsMap = this.state.loadedRowsMap;
+      var row = list.get(index);
+      var content;
+      if (loadedRowsMap[index] === STATUS_LOADED) {
+        content = row.name;
+      } else {
+        content = /*#__PURE__*/React.createElement("div", {
+          className: styles.placeholder,
+          style: {
+            width: row.size
+          }
+        });
+      }
+      return /*#__PURE__*/React.createElement("div", {
+        className: styles.row,
+        key: key,
+        style: style
+      }, content);
+    }
+  }]);
+}(React.PureComponent);
+_defineProperty(InfiniteLoaderExample, "contextTypes", {
+  list: PropTypes.instanceOf(Immutable.List).isRequired
+});
+export { InfiniteLoaderExample as default };