react-virtualized - npm Package Compare versions

Comparing version 9.21.0 to 9.21.1

dist/commonjs/Collection/CollectionView.js

@@ -31,5 +31,5 @@ 'use strict';
 
-var _classnames = require('classnames');
+var _clsx = require('clsx');
 
-var _classnames2 = _interopRequireDefault(_classnames);
+var _clsx2 = _interopRequireDefault(_clsx);
 
@@ -411,3 +411,3 @@ var _propTypes = require('prop-types');
           'aria-label': this.props['aria-label'],
-          className: (0, _classnames2.default)('ReactVirtualized__Collection', className),
+          className: (0, _clsx2.default)('ReactVirtualized__Collection', className),
           id: id,
@@ -414,0 +414,0 @@ onScroll: this._onScroll,

dist/commonjs/Grid/utils/CellSizeAndPositionManager.js

@@ -15,2 +15,6 @@ 'use strict';
 
+var _linearLayoutVector = require('linear-layout-vector');
+
+var _linearLayoutVector2 = _interopRequireDefault(_linearLayoutVector);
+
 var _types = require('../types');
@@ -26,6 +30,3 @@
 
-  // Used in deferred mode to track which cells have been queued for measurement.
-
-  // Cache of size and position data for cells, mapped by cell index.
-  // Note that invalid values may exist in this map so only rely on cells up to this._lastMeasuredIndex
+  // Measurements for cells up to this index can be trusted; cells afterward should be estimated.
   function CellSizeAndPositionManager(_ref) {
@@ -36,5 +37,3 @@ var cellCount = _ref.cellCount,
     (0, _classCallCheck3.default)(this, CellSizeAndPositionManager);
-    this._cellSizeAndPositionData = {};
     this._lastMeasuredIndex = -1;
-    this._lastBatchedIndex = -1;
 
@@ -44,7 +43,10 @@ this._cellSizeGetter = cellSizeGetter;
     this._estimatedCellSize = estimatedCellSize;
+    this._layoutVector = new _linearLayoutVector2.default();
+    this._layoutVector.setLength(cellCount);
+    this._layoutVector.setDefaultSize(estimatedCellSize);
   }
+  // Cache of size and position data for cells, mapped by cell index.
+  // Note that invalid values may exist in this map so only rely on cells up to this._lastMeasuredIndex
 
-  // Measurements for cells up to this index can be trusted; cells afterward should be estimated.
 
-
   (0, _createClass3.default)(CellSizeAndPositionManager, [{
@@ -65,2 +67,4 @@ key: 'areOffsetsAdjusted',
       this._cellSizeGetter = cellSizeGetter;
+      this._layoutVector.setLength(cellCount);
+      this._layoutVector.setDefaultSize(estimatedCellSize);
     }
@@ -99,35 +103,23 @@ }, {
       }
-
+      var vector = this._layoutVector;
       if (index > this._lastMeasuredIndex) {
-        var lastMeasuredCellSizeAndPosition = this.getSizeAndPositionOfLastMeasuredCell();
-        var _offset = lastMeasuredCellSizeAndPosition.offset + lastMeasuredCellSizeAndPosition.size;
+        var token = { index: this._lastMeasuredIndex + 1 };
 
-        for (var i = this._lastMeasuredIndex + 1; i <= index; i++) {
-          var _size = this._cellSizeGetter({ index: i });
-
+        for (var i = token.index; i <= index; token.index = ++i) {
+          var _size = this._cellSizeGetter(token);
           // undefined or NaN probably means a logic error in the size getter.
           // null means we're using CellMeasurer and haven't yet measured a given index.
-          if (_size === undefined || isNaN(_size)) {
+          if (_size === undefined || _size !== _size) {
             throw Error('Invalid size returned for cell ' + i + ' of value ' + _size);
-          } else if (_size === null) {
-            this._cellSizeAndPositionData[i] = {
-              offset: _offset,
-              size: 0
-            };
-
-            this._lastBatchedIndex = index;
-          } else {
-            this._cellSizeAndPositionData[i] = {
-              offset: _offset,
-              size: _size
-            };
-
-            _offset += _size;
-
-            this._lastMeasuredIndex = index;
+          } else if (_size !== null) {
+            vector.setItemSize(i, _size);
           }
         }
+        this._lastMeasuredIndex = Math.min(index, this._cellCount - 1);
       }
 
-      return this._cellSizeAndPositionData[index];
+      return {
+        offset: vector.start(index),
+        size: vector.getItemSize(index)
+      };
     }
@@ -137,5 +129,13 @@ }, {
     value: function getSizeAndPositionOfLastMeasuredCell() {
-      return this._lastMeasuredIndex >= 0 ? this._cellSizeAndPositionData[this._lastMeasuredIndex] : {
-        offset: 0,
-        size: 0
+      var index = this._lastMeasuredIndex;
+      if (index <= 0) {
+        return {
+          offset: 0,
+          size: 0
+        };
+      }
+      var vector = this._layoutVector;
+      return {
+        offset: vector.start(index),
+        size: vector.getItemSize(index)
       };
@@ -153,7 +153,4 @@ }
     value: function getTotalSize() {
-      var lastMeasuredCellSizeAndPosition = this.getSizeAndPositionOfLastMeasuredCell();
-      var totalSizeOfMeasuredCells = lastMeasuredCellSizeAndPosition.offset + lastMeasuredCellSizeAndPosition.size;
-      var numUnmeasuredCells = this._cellCount - this._lastMeasuredIndex - 1;
-      var totalSizeOfUnmeasuredCells = numUnmeasuredCells * this._estimatedCellSize;
-      return totalSizeOfMeasuredCells + totalSizeOfUnmeasuredCells;
+      var lastIndex = this._cellCount - 1;
+      return lastIndex >= 0 ? this._layoutVector.end(lastIndex) : 0;
     }
@@ -214,29 +211,13 @@
     value: function getVisibleCellRange(params) {
-      var containerSize = params.containerSize,
-          offset = params.offset;
-
-
-      var totalSize = this.getTotalSize();
-
-      if (totalSize === 0) {
+      if (this.getTotalSize() === 0) {
         return {};
       }
 
-      var maxOffset = offset + containerSize;
-      var start = this._findNearestCell(offset);
+      var containerSize = params.containerSize,
+          offset = params.offset;
 
-      var datum = this.getSizeAndPositionOfCell(start);
-      offset = datum.offset + datum.size;
-
-      var stop = start;
-
-      while (offset < maxOffset && stop < this._cellCount - 1) {
-        stop++;
-
-        offset += this.getSizeAndPositionOfCell(stop).size;
-      }
-
+      var maxOffset = offset + containerSize - 1;
       return {
-        start: start,
-        stop: stop
+        start: this._findNearestCell(offset),
+        stop: this._findNearestCell(maxOffset)
       };
@@ -256,37 +237,3 @@ }
     }
-  }, {
-    key: '_binarySearch',
-    value: function _binarySearch(high, low, offset) {
-      while (low <= high) {
-        var middle = low + Math.floor((high - low) / 2);
-        var _currentOffset = this.getSizeAndPositionOfCell(middle).offset;
 
-        if (_currentOffset === offset) {
-          return middle;
-        } else if (_currentOffset < offset) {
-          low = middle + 1;
-        } else if (_currentOffset > offset) {
-          high = middle - 1;
-        }
-      }
-
-      if (low > 0) {
-        return low - 1;
-      } else {
-        return 0;
-      }
-    }
-  }, {
-    key: '_exponentialSearch',
-    value: function _exponentialSearch(index, offset) {
-      var interval = 1;
-
-      while (index < this._cellCount && this.getSizeAndPositionOfCell(index).offset < offset) {
-        index += interval;
-        interval *= 2;
-      }
-
-      return this._binarySearch(Math.min(index, this._cellCount - 1), Math.floor(index / 2), offset);
-    }
-
     /**
@@ -306,18 +253,32 @@ * Searches for the cell (index) nearest the specified offset.
 
+      var vector = this._layoutVector;
+      var lastIndex = this._cellCount - 1;
       // Our search algorithms find the nearest match at or below the specified offset.
       // So make sure the offset is at least 0 or no match will be found.
-      offset = Math.max(0, offset);
+      var targetOffset = Math.max(0, Math.min(offset, vector.start(lastIndex)));
+      // First interrogate the constant-time lookup table
+      var nearestCellIndex = vector.indexOf(targetOffset);
 
-      var lastMeasuredCellSizeAndPosition = this.getSizeAndPositionOfLastMeasuredCell();
-      var lastMeasuredIndex = Math.max(0, this._lastMeasuredIndex);
+      // If we haven't yet measured this high, compute sizes for each cell up to the desired offset.
+      while (nearestCellIndex > this._lastMeasuredIndex) {
+        // Measure all the cells up to the one we want to find presently.
+        // Do this before the last-index check to ensure the sparse array
+        // is fully populated.
+        this.getSizeAndPositionOfCell(nearestCellIndex);
+        // No need to search and compare again if we're at the end.
+        if (nearestCellIndex === lastIndex) {
+          return nearestCellIndex;
+        }
+        nearestCellIndex = vector.indexOf(targetOffset);
+        // Guard in case `getSizeAndPositionOfCell` didn't fully measure to
+        // the nearestCellIndex. This might happen scrolling quickly down
+        // and back up on large lists -- possible race with React or DOM?
+        if (nearestCellIndex === -1) {
+          nearestCellIndex = this._lastMeasuredIndex;
+          this._lastMeasuredIndex = nearestCellIndex - 1;
+          targetOffset = Math.max(0, Math.min(offset, vector.start(lastIndex)));
+        }
+      }
 
-      if (lastMeasuredCellSizeAndPosition.offset >= offset) {
-        // If we've already measured cells within this range just use a binary search as it's faster.
-        return this._binarySearch(lastMeasuredIndex, 0, offset);
-      } else {
-        // If we haven't yet measured this high, fallback to an exponential search with an inner binary search.
-        // The exponential search avoids pre-computing sizes for the full set of cells as a binary search would.
-        // The overall complexity for this approach is O(log n).
-        return this._exponentialSearch(lastMeasuredIndex, offset);
-      }
+      return nearestCellIndex;
     }
@@ -324,0 +285,0 @@ }]);

dist/commonjs/InfiniteLoader/InfiniteLoader.js

@@ -7,2 +7,6 @@ 'use strict';
 
+var _toConsumableArray2 = require('babel-runtime/helpers/toConsumableArray');
+
+var _toConsumableArray3 = _interopRequireDefault(_toConsumableArray2);
+
 var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
@@ -130,3 +134,4 @@
     value: function _doStuff(startIndex, stopIndex) {
-      var _this3 = this;
+      var _ref2,
+          _this3 = this;
 
@@ -149,5 +154,7 @@ var _props = this.props,
       // For memoize comparison
-      var squashedUnloadedRanges = unloadedRanges.reduce(function (reduced, unloadedRange) {
-        return reduced.concat([unloadedRange.startIndex, unloadedRange.stopIndex]);
-      }, []);
+      var squashedUnloadedRanges = (_ref2 = []).concat.apply(_ref2, (0, _toConsumableArray3.default)(unloadedRanges.map(function (_ref3) {
+        var startIndex = _ref3.startIndex,
+            stopIndex = _ref3.stopIndex;
+        return [startIndex, stopIndex];
+      })));
 
@@ -225,7 +232,7 @@ this._loadMoreRowsMemoizer({
 } : {};
-function isRangeVisible(_ref2) {
-  var lastRenderedStartIndex = _ref2.lastRenderedStartIndex,
-      lastRenderedStopIndex = _ref2.lastRenderedStopIndex,
-      startIndex = _ref2.startIndex,
-      stopIndex = _ref2.stopIndex;
+function isRangeVisible(_ref4) {
+  var lastRenderedStartIndex = _ref4.lastRenderedStartIndex,
+      lastRenderedStopIndex = _ref4.lastRenderedStopIndex,
+      startIndex = _ref4.startIndex,
+      stopIndex = _ref4.stopIndex;
 
@@ -238,8 +245,8 @@ return !(startIndex > lastRenderedStopIndex || stopIndex < lastRenderedStartIndex);
  */
-function scanForUnloadedRanges(_ref3) {
-  var isRowLoaded = _ref3.isRowLoaded,
-      minimumBatchSize = _ref3.minimumBatchSize,
-      rowCount = _ref3.rowCount,
-      startIndex = _ref3.startIndex,
-      stopIndex = _ref3.stopIndex;
+function scanForUnloadedRanges(_ref5) {
+  var isRowLoaded = _ref5.isRowLoaded,
+      minimumBatchSize = _ref5.minimumBatchSize,
+      rowCount = _ref5.rowCount,
+      startIndex = _ref5.startIndex,
+      stopIndex = _ref5.stopIndex;
 
@@ -246,0 +253,0 @@ var unloadedRanges = [];

dist/commonjs/List/List.js

@@ -43,5 +43,5 @@ 'use strict';
 
-var _classnames = require('classnames');
+var _clsx = require('clsx');
 
-var _classnames2 = _interopRequireDefault(_classnames);
+var _clsx2 = _interopRequireDefault(_clsx);
 
@@ -265,3 +265,3 @@ var _types = require('./types');
 
-      var classNames = (0, _classnames2.default)('ReactVirtualized__List', className);
+      var classNames = (0, _clsx2.default)('ReactVirtualized__List', className);
 
@@ -268,0 +268,0 @@ return React.createElement(_Grid2.default, (0, _extends3.default)({}, this.props, {

dist/commonjs/Masonry/Masonry.js

@@ -36,5 +36,5 @@ 'use strict';
 
-var _classnames = require('classnames');
+var _clsx = require('clsx');
 
-var _classnames2 = _interopRequireDefault(_classnames);
+var _clsx2 = _interopRequireDefault(_clsx);
 
@@ -297,3 +297,3 @@ var _react = require('react');
           'aria-label': this.props['aria-label'],
-          className: (0, _classnames2.default)('ReactVirtualized__Masonry', className),
+          className: (0, _clsx2.default)('ReactVirtualized__Masonry', className),
           id: id,
@@ -300,0 +300,0 @@ onScroll: this._onScroll,

dist/commonjs/Table/defaultHeaderRenderer.js

@@ -41,3 +41,3 @@ 'use strict';
       key: 'label',
-      title: label },
+      title: typeof label === 'string' ? label : null },
     label
@@ -44,0 +44,0 @@ )];

dist/commonjs/Table/SortIndicator.js

@@ -8,5 +8,5 @@ 'use strict';
 
-var _classnames = require('classnames');
+var _clsx = require('clsx');
 
-var _classnames2 = _interopRequireDefault(_classnames);
+var _clsx2 = _interopRequireDefault(_clsx);
 
@@ -35,3 +35,3 @@ var _propTypes = require('prop-types');
 
-  var classNames = (0, _classnames2.default)('ReactVirtualized__Table__sortableHeaderIcon', {
+  var classNames = (0, _clsx2.default)('ReactVirtualized__Table__sortableHeaderIcon', {
     'ReactVirtualized__Table__sortableHeaderIcon--ASC': sortDirection === _SortDirection2.default.ASC,
@@ -38,0 +38,0 @@ 'ReactVirtualized__Table__sortableHeaderIcon--DESC': sortDirection === _SortDirection2.default.DESC

dist/commonjs/Table/Table.js

@@ -31,5 +31,5 @@ 'use strict';
 
-var _classnames = require('classnames');
+var _clsx = require('clsx');
 
-var _classnames2 = _interopRequireDefault(_classnames);
+var _clsx2 = _interopRequireDefault(_clsx);
 
@@ -266,3 +266,3 @@ var _Column = require('./Column');
           'aria-rowcount': this.props.rowCount,
-          className: (0, _classnames2.default)('ReactVirtualized__Table', className),
+          className: (0, _clsx2.default)('ReactVirtualized__Table', className),
           id: id,
@@ -272,3 +272,3 @@ role: 'grid',
         !disableHeader && headerRowRenderer({
-          className: (0, _classnames2.default)('ReactVirtualized__Table__headerRow', rowClass),
+          className: (0, _clsx2.default)('ReactVirtualized__Table__headerRow', rowClass),
           columns: this._getHeaderColumns(),
@@ -284,3 +284,3 @@ style: (0, _extends3.default)({
           autoContainerWidth: true,
-          className: (0, _classnames2.default)('ReactVirtualized__Table__Grid', gridClassName),
+          className: (0, _clsx2.default)('ReactVirtualized__Table__Grid', gridClassName),
           cellRenderer: this._createRow,
@@ -351,3 +351,3 @@ columnWidth: width,
           'aria-describedby': id,
-          className: (0, _classnames2.default)('ReactVirtualized__Table__rowColumn', className),
+          className: (0, _clsx2.default)('ReactVirtualized__Table__rowColumn', className),
           key: 'Row' + rowIndex + '-' + 'Col' + columnIndex,
@@ -384,3 +384,3 @@ onClick: onClick,
 
-      var classNames = (0, _classnames2.default)('ReactVirtualized__Table__headerColumn', headerClassName, column.props.headerClassName, {
+      var classNames = (0, _clsx2.default)('ReactVirtualized__Table__headerColumn', headerClassName, column.props.headerClassName, {
         ReactVirtualized__Table__sortableHeaderColumn: sortEnabled
@@ -499,3 +499,3 @@ });
 
-      var className = (0, _classnames2.default)('ReactVirtualized__Table__row', rowClass);
+      var className = (0, _clsx2.default)('ReactVirtualized__Table__row', rowClass);
       var flattenedStyle = (0, _extends3.default)({}, style, {
@@ -502,0 +502,0 @@ height: this._getRowHeight(index),

dist/es/Collection/CollectionView.js

@@ -7,3 +7,3 @@ import _extends from 'babel-runtime/helpers/extends';
 import _inherits from 'babel-runtime/helpers/inherits';
-import cn from 'classnames';
+import clsx from 'clsx';
 import PropTypes from 'prop-types';
@@ -368,3 +368,3 @@ import * as React from 'react';
           'aria-label': this.props['aria-label'],
-          className: cn('ReactVirtualized__Collection', className),
+          className: clsx('ReactVirtualized__Collection', className),
           id: id,
@@ -371,0 +371,0 @@ onScroll: this._onScroll,

dist/es/Grid/Grid.js

@@ -9,3 +9,3 @@ import _Object$assign from 'babel-runtime/core-js/object/assign';
 import * as React from 'react';
-import cn from 'classnames';
+import clsx from 'clsx';
 import calculateSizeAndPositionDataAndUpdateScrollOffset from './utils/calculateSizeAndPositionDataAndUpdateScrollOffset';
@@ -137,2 +137,4 @@ import ScalingCellSizeAndPositionManager from './utils/ScalingCellSizeAndPositionManager';
         prevScrollToRow: props.scrollToRow,
+        prevScrollLeft: props.scrollLeft,
+        prevScrollTop: props.scrollTop,
 
@@ -145,4 +147,4 @@ scrollbarSize: 0,
       scrollDirectionVertical: SCROLL_DIRECTION_FORWARD,
-      scrollLeft: 0,
-      scrollTop: 0,
+      scrollLeft: props.scrollLeft || 0,
+      scrollTop: props.scrollTop || 0,
       scrollPositionChangeReason: null,
@@ -688,3 +690,3 @@
           'aria-readonly': this.props['aria-readonly'],
-          className: cn('ReactVirtualized__Grid', className),
+          className: clsx('ReactVirtualized__Grid', className),
           id: id,
@@ -1050,3 +1052,5 @@ onScroll: this._onScroll,
       var newState = {};
+      var instanceProps = prevState.instanceProps;
 
+
       if (nextProps.columnCount === 0 && prevState.scrollLeft !== 0 || nextProps.rowCount === 0 && prevState.scrollTop !== 0) {
@@ -1058,3 +1062,3 @@ newState.scrollLeft = 0;
         // scrollTo{Column,Row} should override scroll{Left,Top}
-      } else if (nextProps.scrollLeft !== prevState.scrollLeft && nextProps.scrollToColumn < 0 || nextProps.scrollTop !== prevState.scrollTop && nextProps.scrollToRow < 0) {
+      } else if (nextProps.scrollLeft !== instanceProps.prevScrollLeft && nextProps.scrollToColumn < 0 || nextProps.scrollTop !== instanceProps.prevScrollTop && nextProps.scrollToRow < 0) {
         _Object$assign(newState, Grid._getScrollToPositionStateUpdate({
@@ -1067,6 +1071,3 @@ prevState: prevState,
 
-      var instanceProps = prevState.instanceProps;
-
       // Initially we should not clearStyleCache
-
       newState.needToResetStyleCache = false;
@@ -1143,2 +1144,4 @@ if (nextProps.columnWidth !== instanceProps.prevColumnWidth || nextProps.rowHeight !== instanceProps.prevRowHeight) {
       instanceProps.prevScrollToRow = nextProps.scrollToRow;
+      instanceProps.prevScrollLeft = nextProps.scrollLeft;
+      instanceProps.prevScrollTop = nextProps.scrollTop;
 
@@ -1145,0 +1148,0 @@ // getting scrollBarSize (moved from componentWillMount)

dist/es/Grid/utils/CellSizeAndPositionManager.js

 import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
 import _createClass from 'babel-runtime/helpers/createClass';
+import LinearLayoutVector from 'linear-layout-vector';
 
@@ -10,6 +11,3 @@ /**
 
-  // Used in deferred mode to track which cells have been queued for measurement.
-
-  // Cache of size and position data for cells, mapped by cell index.
-  // Note that invalid values may exist in this map so only rely on cells up to this._lastMeasuredIndex
+  // Measurements for cells up to this index can be trusted; cells afterward should be estimated.
   function CellSizeAndPositionManager(_ref) {
@@ -22,5 +20,3 @@ var cellCount = _ref.cellCount,
 
-    this._cellSizeAndPositionData = {};
     this._lastMeasuredIndex = -1;
-    this._lastBatchedIndex = -1;
 
@@ -30,7 +26,10 @@ this._cellSizeGetter = cellSizeGetter;
     this._estimatedCellSize = estimatedCellSize;
+    this._layoutVector = new LinearLayoutVector();
+    this._layoutVector.setLength(cellCount);
+    this._layoutVector.setDefaultSize(estimatedCellSize);
   }
+  // Cache of size and position data for cells, mapped by cell index.
+  // Note that invalid values may exist in this map so only rely on cells up to this._lastMeasuredIndex
 
-  // Measurements for cells up to this index can be trusted; cells afterward should be estimated.
 
-
   _createClass(CellSizeAndPositionManager, [{
@@ -51,2 +50,4 @@ key: 'areOffsetsAdjusted',
       this._cellSizeGetter = cellSizeGetter;
+      this._layoutVector.setLength(cellCount);
+      this._layoutVector.setDefaultSize(estimatedCellSize);
     }
@@ -85,35 +86,23 @@ }, {
       }
-
+      var vector = this._layoutVector;
       if (index > this._lastMeasuredIndex) {
-        var lastMeasuredCellSizeAndPosition = this.getSizeAndPositionOfLastMeasuredCell();
-        var _offset = lastMeasuredCellSizeAndPosition.offset + lastMeasuredCellSizeAndPosition.size;
+        var token = { index: this._lastMeasuredIndex + 1 };
 
-        for (var i = this._lastMeasuredIndex + 1; i <= index; i++) {
-          var _size = this._cellSizeGetter({ index: i });
-
+        for (var i = token.index; i <= index; token.index = ++i) {
+          var _size = this._cellSizeGetter(token);
           // undefined or NaN probably means a logic error in the size getter.
           // null means we're using CellMeasurer and haven't yet measured a given index.
-          if (_size === undefined || isNaN(_size)) {
+          if (_size === undefined || _size !== _size) {
             throw Error('Invalid size returned for cell ' + i + ' of value ' + _size);
-          } else if (_size === null) {
-            this._cellSizeAndPositionData[i] = {
-              offset: _offset,
-              size: 0
-            };
-
-            this._lastBatchedIndex = index;
-          } else {
-            this._cellSizeAndPositionData[i] = {
-              offset: _offset,
-              size: _size
-            };
-
-            _offset += _size;
-
-            this._lastMeasuredIndex = index;
+          } else if (_size !== null) {
+            vector.setItemSize(i, _size);
           }
         }
+        this._lastMeasuredIndex = Math.min(index, this._cellCount - 1);
       }
 
-      return this._cellSizeAndPositionData[index];
+      return {
+        offset: vector.start(index),
+        size: vector.getItemSize(index)
+      };
     }
@@ -123,5 +112,13 @@ }, {
     value: function getSizeAndPositionOfLastMeasuredCell() {
-      return this._lastMeasuredIndex >= 0 ? this._cellSizeAndPositionData[this._lastMeasuredIndex] : {
-        offset: 0,
-        size: 0
+      var index = this._lastMeasuredIndex;
+      if (index <= 0) {
+        return {
+          offset: 0,
+          size: 0
+        };
+      }
+      var vector = this._layoutVector;
+      return {
+        offset: vector.start(index),
+        size: vector.getItemSize(index)
       };
@@ -139,7 +136,4 @@ }
     value: function getTotalSize() {
-      var lastMeasuredCellSizeAndPosition = this.getSizeAndPositionOfLastMeasuredCell();
-      var totalSizeOfMeasuredCells = lastMeasuredCellSizeAndPosition.offset + lastMeasuredCellSizeAndPosition.size;
-      var numUnmeasuredCells = this._cellCount - this._lastMeasuredIndex - 1;
-      var totalSizeOfUnmeasuredCells = numUnmeasuredCells * this._estimatedCellSize;
-      return totalSizeOfMeasuredCells + totalSizeOfUnmeasuredCells;
+      var lastIndex = this._cellCount - 1;
+      return lastIndex >= 0 ? this._layoutVector.end(lastIndex) : 0;
     }
@@ -200,29 +194,13 @@
     value: function getVisibleCellRange(params) {
-      var containerSize = params.containerSize,
-          offset = params.offset;
-
-
-      var totalSize = this.getTotalSize();
-
-      if (totalSize === 0) {
+      if (this.getTotalSize() === 0) {
         return {};
       }
 
-      var maxOffset = offset + containerSize;
-      var start = this._findNearestCell(offset);
+      var containerSize = params.containerSize,
+          offset = params.offset;
 
-      var datum = this.getSizeAndPositionOfCell(start);
-      offset = datum.offset + datum.size;
-
-      var stop = start;
-
-      while (offset < maxOffset && stop < this._cellCount - 1) {
-        stop++;
-
-        offset += this.getSizeAndPositionOfCell(stop).size;
-      }
-
+      var maxOffset = offset + containerSize - 1;
       return {
-        start: start,
-        stop: stop
+        start: this._findNearestCell(offset),
+        stop: this._findNearestCell(maxOffset)
       };
@@ -242,37 +220,3 @@ }
     }
-  }, {
-    key: '_binarySearch',
-    value: function _binarySearch(high, low, offset) {
-      while (low <= high) {
-        var middle = low + Math.floor((high - low) / 2);
-        var _currentOffset = this.getSizeAndPositionOfCell(middle).offset;
 
-        if (_currentOffset === offset) {
-          return middle;
-        } else if (_currentOffset < offset) {
-          low = middle + 1;
-        } else if (_currentOffset > offset) {
-          high = middle - 1;
-        }
-      }
-
-      if (low > 0) {
-        return low - 1;
-      } else {
-        return 0;
-      }
-    }
-  }, {
-    key: '_exponentialSearch',
-    value: function _exponentialSearch(index, offset) {
-      var interval = 1;
-
-      while (index < this._cellCount && this.getSizeAndPositionOfCell(index).offset < offset) {
-        index += interval;
-        interval *= 2;
-      }
-
-      return this._binarySearch(Math.min(index, this._cellCount - 1), Math.floor(index / 2), offset);
-    }
-
     /**
@@ -292,18 +236,32 @@ * Searches for the cell (index) nearest the specified offset.
 
+      var vector = this._layoutVector;
+      var lastIndex = this._cellCount - 1;
       // Our search algorithms find the nearest match at or below the specified offset.
       // So make sure the offset is at least 0 or no match will be found.
-      offset = Math.max(0, offset);
+      var targetOffset = Math.max(0, Math.min(offset, vector.start(lastIndex)));
+      // First interrogate the constant-time lookup table
+      var nearestCellIndex = vector.indexOf(targetOffset);
 
-      var lastMeasuredCellSizeAndPosition = this.getSizeAndPositionOfLastMeasuredCell();
-      var lastMeasuredIndex = Math.max(0, this._lastMeasuredIndex);
+      // If we haven't yet measured this high, compute sizes for each cell up to the desired offset.
+      while (nearestCellIndex > this._lastMeasuredIndex) {
+        // Measure all the cells up to the one we want to find presently.
+        // Do this before the last-index check to ensure the sparse array
+        // is fully populated.
+        this.getSizeAndPositionOfCell(nearestCellIndex);
+        // No need to search and compare again if we're at the end.
+        if (nearestCellIndex === lastIndex) {
+          return nearestCellIndex;
+        }
+        nearestCellIndex = vector.indexOf(targetOffset);
+        // Guard in case `getSizeAndPositionOfCell` didn't fully measure to
+        // the nearestCellIndex. This might happen scrolling quickly down
+        // and back up on large lists -- possible race with React or DOM?
+        if (nearestCellIndex === -1) {
+          nearestCellIndex = this._lastMeasuredIndex;
+          this._lastMeasuredIndex = nearestCellIndex - 1;
+          targetOffset = Math.max(0, Math.min(offset, vector.start(lastIndex)));
+        }
+      }
 
-      if (lastMeasuredCellSizeAndPosition.offset >= offset) {
-        // If we've already measured cells within this range just use a binary search as it's faster.
-        return this._binarySearch(lastMeasuredIndex, 0, offset);
-      } else {
-        // If we haven't yet measured this high, fallback to an exponential search with an inner binary search.
-        // The exponential search avoids pre-computing sizes for the full set of cells as a binary search would.
-        // The overall complexity for this approach is O(log n).
-        return this._exponentialSearch(lastMeasuredIndex, offset);
-      }
+      return nearestCellIndex;
     }
@@ -310,0 +268,0 @@ }]);

dist/es/InfiniteLoader/InfiniteLoader.js

@@ -0,1 +1,2 @@
+import _toConsumableArray from 'babel-runtime/helpers/toConsumableArray';
 import _Object$getPrototypeOf from 'babel-runtime/core-js/object/get-prototype-of';
@@ -93,3 +94,4 @@ import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
     value: function _doStuff(startIndex, stopIndex) {
-      var _this3 = this;
+      var _ref2,
+          _this3 = this;
 
@@ -112,5 +114,7 @@ var _props = this.props,
       // For memoize comparison
-      var squashedUnloadedRanges = unloadedRanges.reduce(function (reduced, unloadedRange) {
-        return reduced.concat([unloadedRange.startIndex, unloadedRange.stopIndex]);
-      }, []);
+      var squashedUnloadedRanges = (_ref2 = []).concat.apply(_ref2, _toConsumableArray(unloadedRanges.map(function (_ref3) {
+        var startIndex = _ref3.startIndex,
+            stopIndex = _ref3.stopIndex;
+        return [startIndex, stopIndex];
+      })));
 
@@ -189,7 +193,7 @@ this._loadMoreRowsMemoizer({
 } : {};
-export function isRangeVisible(_ref2) {
-  var lastRenderedStartIndex = _ref2.lastRenderedStartIndex,
-      lastRenderedStopIndex = _ref2.lastRenderedStopIndex,
-      startIndex = _ref2.startIndex,
-      stopIndex = _ref2.stopIndex;
+export function isRangeVisible(_ref4) {
+  var lastRenderedStartIndex = _ref4.lastRenderedStartIndex,
+      lastRenderedStopIndex = _ref4.lastRenderedStopIndex,
+      startIndex = _ref4.startIndex,
+      stopIndex = _ref4.stopIndex;
 
@@ -202,8 +206,8 @@ return !(startIndex > lastRenderedStopIndex || stopIndex < lastRenderedStartIndex);
  */
-export function scanForUnloadedRanges(_ref3) {
-  var isRowLoaded = _ref3.isRowLoaded,
-      minimumBatchSize = _ref3.minimumBatchSize,
-      rowCount = _ref3.rowCount,
-      startIndex = _ref3.startIndex,
-      stopIndex = _ref3.stopIndex;
+export function scanForUnloadedRanges(_ref5) {
+  var isRowLoaded = _ref5.isRowLoaded,
+      minimumBatchSize = _ref5.minimumBatchSize,
+      rowCount = _ref5.rowCount,
+      startIndex = _ref5.startIndex,
+      stopIndex = _ref5.stopIndex;
 
@@ -210,0 +214,0 @@ var unloadedRanges = [];

dist/es/List/List.js

@@ -10,3 +10,3 @@ import _extends from 'babel-runtime/helpers/extends';
 import * as React from 'react';
-import cn from 'classnames';
+import clsx from 'clsx';
 
@@ -220,3 +220,3 @@ /**
 
-      var classNames = cn('ReactVirtualized__List', className);
+      var classNames = clsx('ReactVirtualized__List', className);
 
@@ -223,0 +223,0 @@ return React.createElement(Grid, _extends({}, this.props, {

dist/es/Masonry/Masonry.js

@@ -8,3 +8,3 @@ import _extends from 'babel-runtime/helpers/extends';
 import _inherits from 'babel-runtime/helpers/inherits';
-import cn from 'classnames';
+import clsx from 'clsx';
 import * as React from 'react';
@@ -250,3 +250,3 @@ import { polyfill } from 'react-lifecycles-compat';
           'aria-label': this.props['aria-label'],
-          className: cn('ReactVirtualized__Masonry', className),
+          className: clsx('ReactVirtualized__Masonry', className),
           id: id,
@@ -253,0 +253,0 @@ onScroll: this._onScroll,

dist/es/Table/defaultHeaderRenderer.js

@@ -20,3 +20,3 @@ import * as React from 'react';
       key: 'label',
-      title: label },
+      title: typeof label === 'string' ? label : null },
     label
@@ -23,0 +23,0 @@ )];

dist/es/Table/SortIndicator.js

@@ -1,2 +0,2 @@
-import cn from 'classnames';
+import clsx from 'clsx';
 import PropTypes from 'prop-types';
@@ -12,3 +12,3 @@ import * as React from 'react';
 
-  var classNames = cn('ReactVirtualized__Table__sortableHeaderIcon', {
+  var classNames = clsx('ReactVirtualized__Table__sortableHeaderIcon', {
     'ReactVirtualized__Table__sortableHeaderIcon--ASC': sortDirection === SortDirection.ASC,
@@ -15,0 +15,0 @@ 'ReactVirtualized__Table__sortableHeaderIcon--DESC': sortDirection === SortDirection.DESC

dist/es/Table/Table.js

@@ -9,3 +9,3 @@ import _extends from 'babel-runtime/helpers/extends';
 
-import cn from 'classnames';
+import clsx from 'clsx';
 
@@ -219,3 +219,3 @@ import Column from './Column';
           'aria-rowcount': this.props.rowCount,
-          className: cn('ReactVirtualized__Table', className),
+          className: clsx('ReactVirtualized__Table', className),
           id: id,
@@ -225,3 +225,3 @@ role: 'grid',
         !disableHeader && headerRowRenderer({
-          className: cn('ReactVirtualized__Table__headerRow', rowClass),
+          className: clsx('ReactVirtualized__Table__headerRow', rowClass),
           columns: this._getHeaderColumns(),
@@ -237,3 +237,3 @@ style: _extends({
           autoContainerWidth: true,
-          className: cn('ReactVirtualized__Table__Grid', gridClassName),
+          className: clsx('ReactVirtualized__Table__Grid', gridClassName),
           cellRenderer: this._createRow,
@@ -304,3 +304,3 @@ columnWidth: width,
           'aria-describedby': id,
-          className: cn('ReactVirtualized__Table__rowColumn', className),
+          className: clsx('ReactVirtualized__Table__rowColumn', className),
           key: 'Row' + rowIndex + '-' + 'Col' + columnIndex,
@@ -337,3 +337,3 @@ onClick: onClick,
 
-      var classNames = cn('ReactVirtualized__Table__headerColumn', headerClassName, column.props.headerClassName, {
+      var classNames = clsx('ReactVirtualized__Table__headerColumn', headerClassName, column.props.headerClassName, {
         ReactVirtualized__Table__sortableHeaderColumn: sortEnabled
@@ -452,3 +452,3 @@ });
 
-      var className = cn('ReactVirtualized__Table__row', rowClass);
+      var className = clsx('ReactVirtualized__Table__row', rowClass);
       var flattenedStyle = _extends({}, style, {
@@ -455,0 +455,0 @@ height: this._getRowHeight(index),

package.json

@@ -6,3 +6,3 @@ {
   "user": "bvaughn",
-  "version": "9.21.0",
+  "version": "9.21.1",
   "homepage": "https://github.com/bvaughn/react-virtualized",
@@ -173,4 +173,5 @@ "main": "dist/commonjs/index.js",
     "babel-runtime": "^6.26.0",
-    "classnames": "^2.2.3",
+    "clsx": "^1.0.1",
     "dom-helpers": "^2.4.0 || ^3.0.0",
+    "linear-layout-vector": "0.0.1",
     "loose-envify": "^1.3.0",
@@ -177,0 +178,0 @@ "prop-types": "^15.6.0",

README.md

@@ -86,2 +86,7 @@ [<img src="https://cloud.githubusercontent.com/assets/29597/11737732/0ca1e55e-9f91-11e5-97f3-098f2f8ed866.png" alt="React virtualized" data-canonical-src="https://cloud.githubusercontent.com/assets/29597/11737732/0ca1e55e-9f91-11e5-97f3-098f2f8ed866.png" width="330" height="100" />](http://bvaughn.github.io/react-virtualized/)
 
+A word about `react-window`
+---------------
+
+If you're considering adding `react-virtualized` to a project, take a look at [`react-window`](https://github.com/bvaughn/react-window) as a possible lighter-weight alternative. [Learn more about how the two libraries compare here.](https://github.com/bvaughn/react-window#how-is-react-window-different-from-react-virtualized)
+
 Getting started
@@ -88,0 +93,0 @@ ---------------

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1143314

increased by1.81%

Lines of code

22199

increased by1.5%

Number of lines in readme file

266

increased by1.92%

Worsened metrics

Dependency count

9

increased by12.5%

Number of package files

152

decreased by-0.65%

Dependency changes

• + Addedclsx@^1.0.1

• + Addedlinear-layout-vector@0.0.1

• + Addedclsx@1.2.1(transitive)

• + Addedlinear-layout-vector@0.0.1(transitive)

• - Removedclassnames@^2.2.3

• - Removedclassnames@2.5.1(transitive)