react-virtualized Grid/MultiGrid: TypeError: Super expression must either be null or a function

Grid/MultiGrid: TypeError: Super expression must either be null or a function

Open rlaphoenix opened this issue 1 year ago • 1 comments

Bug Report

I'm unable to reproduce in Sandbox, probably because it's not using WebPack.

What is the current behavior?

When Grid calls _inherit() from babel, the subClass is the Grid function, but the superClass (which should be _React$PureComponent) is actually undefined. This results in an error as the _inherit function makes sure that it is a function being passed.

The subClass being passed to _inherit (after webpack via NextJS) is:

The subClass being passed (after webpack via NextJS) is:

function Grid(props) {
  var _this;

  _babel_runtime_helpers_classCallCheck__WEBPACK_IMPORTED_MODULE_1___default()(
    this,
    Grid
  );

  _this =
    _babel_runtime_helpers_possibleConstructorReturn__WEBPACK_IMPORTED_MODULE_3___default()(
      this,
      _babel_runtime_helpers_getPrototypeOf__WEBPACK_IMPORTED_MODULE_4___default()(
        Grid
      ).call(this, props)
    );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_onGridRenderedMemoizer",
    (0,
    _utils_createCallbackMemoizer__WEBPACK_IMPORTED_MODULE_12__["default"])()
  );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_onScrollMemoizer",
    (0, _utils_createCallbackMemoizer__WEBPACK_IMPORTED_MODULE_12__["default"])(
      false
    )
  );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_deferredInvalidateColumnIndex",
    null
  );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_deferredInvalidateRowIndex",
    null
  );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_recomputeScrollLeftFlag",
    false
  );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_recomputeScrollTopFlag",
    false
  );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_horizontalScrollBarSize",
    0
  );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_verticalScrollBarSize",
    0
  );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_scrollbarPresenceChanged",
    false
  );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_scrollingContainer",
    void 0
  );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_childrenToDisplay",
    void 0
  );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_columnStartIndex",
    void 0
  );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_columnStopIndex",
    void 0
  );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_rowStartIndex",
    void 0
  );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_rowStopIndex",
    void 0
  );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_renderedColumnStartIndex",
    0
  );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_renderedColumnStopIndex",
    0
  );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_renderedRowStartIndex",
    0
  );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_renderedRowStopIndex",
    0
  );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_initialScrollTop",
    void 0
  );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_initialScrollLeft",
    void 0
  );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_disablePointerEventsTimeoutId",
    void 0
  );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_styleCache",
    {}
  );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_cellCache",
    {}
  );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_debounceScrollEndedCallback",
    function () {
      _this._disablePointerEventsTimeoutId = null; // isScrolling is used to determine if we reset styleCache

      _this.setState({
        isScrolling: false,
        needToResetStyleCache: false,
      });
    }
  );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_invokeOnGridRenderedHelper",
    function () {
      var onSectionRendered = _this.props.onSectionRendered;

      _this._onGridRenderedMemoizer({
        callback: onSectionRendered,
        indices: {
          columnOverscanStartIndex: _this._columnStartIndex,
          columnOverscanStopIndex: _this._columnStopIndex,
          columnStartIndex: _this._renderedColumnStartIndex,
          columnStopIndex: _this._renderedColumnStopIndex,
          rowOverscanStartIndex: _this._rowStartIndex,
          rowOverscanStopIndex: _this._rowStopIndex,
          rowStartIndex: _this._renderedRowStartIndex,
          rowStopIndex: _this._renderedRowStopIndex,
        },
      });
    }
  );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_setScrollingContainerRef",
    function (ref) {
      _this._scrollingContainer = ref;
    }
  );

  _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(
    _babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(
      _this
    ),
    "_onScroll",
    function (event) {
      // In certain edge-cases React dispatches an onScroll event with an invalid target.scrollLeft / target.scrollTop.
      // This invalid event can be detected by comparing event.target to this component's scrollable DOM element.
      // See issue #404 for more information.
      if (event.target === _this._scrollingContainer) {
        _this.handleScrollEvent(event.target);
      }
    }
  );

  var columnSizeAndPositionManager =
    new _utils_ScalingCellSizeAndPositionManager__WEBPACK_IMPORTED_MODULE_11__[
      "default"
    ]({
      cellCount: props.columnCount,
      cellSizeGetter: function cellSizeGetter(params) {
        return Grid._wrapSizeGetter(props.columnWidth)(params);
      },
      estimatedCellSize: Grid._getEstimatedColumnSize(props),
    });
  var rowSizeAndPositionManager =
    new _utils_ScalingCellSizeAndPositionManager__WEBPACK_IMPORTED_MODULE_11__[
      "default"
    ]({
      cellCount: props.rowCount,
      cellSizeGetter: function cellSizeGetter(params) {
        return Grid._wrapSizeGetter(props.rowHeight)(params);
      },
      estimatedCellSize: Grid._getEstimatedRowSize(props),
    });
  _this.state = {
    instanceProps: {
      columnSizeAndPositionManager: columnSizeAndPositionManager,
      rowSizeAndPositionManager: rowSizeAndPositionManager,
      prevColumnWidth: props.columnWidth,
      prevRowHeight: props.rowHeight,
      prevColumnCount: props.columnCount,
      prevRowCount: props.rowCount,
      prevIsScrolling: props.isScrolling === true,
      prevScrollToColumn: props.scrollToColumn,
      prevScrollToRow: props.scrollToRow,
      scrollbarSize: 0,
      scrollbarSizeMeasured: false,
    },
    isScrolling: false,
    scrollDirectionHorizontal:
      _defaultOverscanIndicesGetter__WEBPACK_IMPORTED_MODULE_13__.SCROLL_DIRECTION_FORWARD,
    scrollDirectionVertical:
      _defaultOverscanIndicesGetter__WEBPACK_IMPORTED_MODULE_13__.SCROLL_DIRECTION_FORWARD,
    scrollLeft: 0,
    scrollTop: 0,
    scrollPositionChangeReason: null,
    needToResetStyleCache: false,
  };

  if (props.scrollToRow > 0) {
    _this._initialScrollTop = _this._getCalculatedScrollTop(props, _this.state);
  }

  if (props.scrollToColumn > 0) {
    _this._initialScrollLeft = _this._getCalculatedScrollLeft(
      props,
      _this.state
    );
  }

  return _this;
}

What is the expected behavior?

It should have passed the expected React.PureComponent function, I presume, yet it didn't. It seems like WebPack cut it out. The Source code has it passed to this _inherit call as an argument in it's wrapped:

function (_React$PureComponent) {
  _inherits(Grid, _React$PureComponent);
  // ...
  function Grid(props) {
    // ...
  }
  // ...
}(React.PureComponent), _defineProperty(_class, "propTypes", process.env.NODE_ENV === 'production' ? null : { // ...

I presume React.PureComponent was removed here, or lost in some sort.

Which versions of React and react-virtualized, and which browser / OS are affected by this issue? Did this work in previous versions of react-virtualized?


Browser	Chromium (Arc)
OS	Windows 11
React	18.3.1
React DOM	18.3.1
react-virtualized	9.22.5

Jun 29 '24 01:06 rlaphoenix

I made an edit to the _inherits function:

function _inherits(subClass, superClass) {
  if (typeof superClass !== "function" && superClass !== null) {
-    throw new TypeError("Super expression must either be null or a function");
+    throw new TypeError(`Super expression must either be null or a function: ${superClass}, subClass:\n${subClass}`);

And an edit to the Grid.js file where I copied the function that encapsulated the call to _inherit and named it poop with otherwise no changes. I copied it outside of and before the function, and then replaced Grid in the _inherit call with poop.

This resulted in the following error

// Error: Super expression must either be null or a function: undefined, subClass:
function poop(_React$PureComponent) {
 _babel_runtime_helpers_inherits__WEBPACK_IMPORTED_MODULE_6___default()(Grid, _React$PureComponent);

 // Invokes onSectionRendered callback only when start/stop row or column indices change
 function Grid(props) {
   var _this;

   _babel_runtime_helpers_classCallCheck__WEBPACK_IMPORTED_MODULE_1___default()(this, Grid);

   _this = _babel_runtime_helpers_possibleConstructorReturn__WEBPACK_IMPORTED_MODULE_3___default()(this, _babel_runtime_helpers_getPrototypeOf__WEBPACK_IMPORTED_MODULE_4___default()(Grid).call(this, props));

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_onGridRenderedMemoizer", (0,_utils_createCallbackMemoizer__WEBPACK_IMPORTED_MODULE_12__["default"])());

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_onScrollMemoizer", (0,_utils_createCallbackMemoizer__WEBPACK_IMPORTED_MODULE_12__["default"])(false));

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_deferredInvalidateColumnIndex", null);

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_deferredInvalidateRowIndex", null);

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_recomputeScrollLeftFlag", false);

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_recomputeScrollTopFlag", false);

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_horizontalScrollBarSize", 0);

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_verticalScrollBarSize", 0);

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_scrollbarPresenceChanged", false);

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_scrollingContainer", void 0);

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_childrenToDisplay", void 0);

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_columnStartIndex", void 0);

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_columnStopIndex", void 0);

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_rowStartIndex", void 0);

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_rowStopIndex", void 0);

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_renderedColumnStartIndex", 0);

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_renderedColumnStopIndex", 0);

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_renderedRowStartIndex", 0);

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_renderedRowStopIndex", 0);

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_initialScrollTop", void 0);

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_initialScrollLeft", void 0);

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_disablePointerEventsTimeoutId", void 0);

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_styleCache", {});

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_cellCache", {});

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_debounceScrollEndedCallback", function () {
     _this._disablePointerEventsTimeoutId = null; // isScrolling is used to determine if we reset styleCache

     _this.setState({
       isScrolling: false,
       needToResetStyleCache: false
     });
   });

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_invokeOnGridRenderedHelper", function () {
     var onSectionRendered = _this.props.onSectionRendered;

     _this._onGridRenderedMemoizer({
       callback: onSectionRendered,
       indices: {
         columnOverscanStartIndex: _this._columnStartIndex,
         columnOverscanStopIndex: _this._columnStopIndex,
         columnStartIndex: _this._renderedColumnStartIndex,
         columnStopIndex: _this._renderedColumnStopIndex,
         rowOverscanStartIndex: _this._rowStartIndex,
         rowOverscanStopIndex: _this._rowStopIndex,
         rowStartIndex: _this._renderedRowStartIndex,
         rowStopIndex: _this._renderedRowStopIndex
       }
     });
   });

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_setScrollingContainerRef", function (ref) {
     _this._scrollingContainer = ref;
   });

   _babel_runtime_helpers_defineProperty__WEBPACK_IMPORTED_MODULE_7___default()(_babel_runtime_helpers_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5___default()(_this), "_onScroll", function (event) {
     // In certain edge-cases React dispatches an onScroll event with an invalid target.scrollLeft / target.scrollTop.
     // This invalid event can be detected by comparing event.target to this component's scrollable DOM element.
     // See issue #404 for more information.
     if (event.target === _this._scrollingContainer) {
       _this.handleScrollEvent(event.target);
     }
   });

   var columnSizeAndPositionManager = new _utils_ScalingCellSizeAndPositionManager__WEBPACK_IMPORTED_MODULE_11__["default"]({
     cellCount: props.columnCount,
     cellSizeGetter: function cellSizeGetter(params) {
       return Grid._wrapSizeGetter(props.columnWidth)(params);
     },
     estimatedCellSize: Grid._getEstimatedColumnSize(props)
   });
   var rowSizeAndPositionManager = new _utils_ScalingCellSizeAndPositionManager__WEBPACK_IMPORTED_MODULE_11__["default"]({
     cellCount: props.rowCount,
     cellSizeGetter: function cellSizeGetter(params) {
       return Grid._wrapSizeGetter(props.rowHeight)(params);
     },
     estimatedCellSize: Grid._getEstimatedRowSize(props)
   });
   _this.state = {
     instanceProps: {
       columnSizeAndPositionManager: columnSizeAndPositionManager,
       rowSizeAndPositionManager: rowSizeAndPositionManager,
       prevColumnWidth: props.columnWidth,
       prevRowHeight: props.rowHeight,
       prevColumnCount: props.columnCount,
       prevRowCount: props.rowCount,
       prevIsScrolling: props.isScrolling === true,
       prevScrollToColumn: props.scrollToColumn,
       prevScrollToRow: props.scrollToRow,
       scrollbarSize: 0,
       scrollbarSizeMeasured: false
     },
     isScrolling: false,
     scrollDirectionHorizontal: _defaultOverscanIndicesGetter__WEBPACK_IMPORTED_MODULE_13__.SCROLL_DIRECTION_FORWARD,
     scrollDirectionVertical: _defaultOverscanIndicesGetter__WEBPACK_IMPORTED_MODULE_13__.SCROLL_DIRECTION_FORWARD,
     scrollLeft: 0,
     scrollTop: 0,
     scrollPositionChangeReason: null,
     needToResetStyleCache: false
   };

   if (props.scrollToRow > 0) {
     _this._initialScrollTop = _this._getCalculatedScrollTop(props, _this.state);
   }

   if (props.scrollToColumn > 0) {
     _this._initialScrollLeft = _this._getCalculatedScrollLeft(props, _this.state);
   }

   return _this;
 }
 /**
  * Gets offsets for a given cell and alignment.
  */


 _babel_runtime_helpers_createClass__WEBPACK_IMPORTED_MODULE_2___default()(Grid, [{
   key: "getOffsetForCell",
   value: function getOffsetForCell() {
     var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
         _ref$alignment = _ref.alignment,
         alignment = _ref$alignment === void 0 ? this.props.scrollToAlignment : _ref$alignment,
         _ref$columnIndex = _ref.columnIndex,
         columnIndex = _ref$columnIndex === void 0 ? this.props.scrollToColumn : _ref$columnIndex,
         _ref$rowIndex = _ref.rowIndex,
         rowIndex = _ref$rowIndex === void 0 ? this.props.scrollToRow : _ref$rowIndex;

     var offsetProps = _objectSpread({}, this.props, {
       scrollToAlignment: alignment,
       scrollToColumn: columnIndex,
       scrollToRow: rowIndex
     });

     return {
       scrollLeft: this._getCalculatedScrollLeft(offsetProps),
       scrollTop: this._getCalculatedScrollTop(offsetProps)
     };
   }
   /**
    * Gets estimated total rows' height.
    */

 }, {
   key: "getTotalRowsHeight",
   value: function getTotalRowsHeight() {
     return this.state.instanceProps.rowSizeAndPositionManager.getTotalSize();
   }
   /**
    * Gets estimated total columns' width.
    */

 }, {
   key: "getTotalColumnsWidth",
   value: function getTotalColumnsWidth() {
     return this.state.instanceProps.columnSizeAndPositionManager.getTotalSize();
   }
   /**
    * This method handles a scroll event originating from an external scroll control.
    * It's an advanced method and should probably not be used unless you're implementing a custom scroll-bar solution.
    */

 }, {
   key: "handleScrollEvent",
   value: function handleScrollEvent(_ref2) {
     var _ref2$scrollLeft = _ref2.scrollLeft,
         scrollLeftParam = _ref2$scrollLeft === void 0 ? 0 : _ref2$scrollLeft,
         _ref2$scrollTop = _ref2.scrollTop,
         scrollTopParam = _ref2$scrollTop === void 0 ? 0 : _ref2$scrollTop;

     // On iOS, we can arrive at negative offsets by swiping past the start.
     // To prevent flicker here, we make playing in the negative offset zone cause nothing to happen.
     if (scrollTopParam < 0) {
       return;
     } // Prevent pointer events from interrupting a smooth scroll


     this._debounceScrollEnded();

     var _this$props = this.props,
         autoHeight = _this$props.autoHeight,
         autoWidth = _this$props.autoWidth,
         height = _this$props.height,
         width = _this$props.width;
     var instanceProps = this.state.instanceProps; // When this component is shrunk drastically, React dispatches a series of back-to-back scroll events,
     // Gradually converging on a scrollTop that is within the bounds of the new, smaller height.
     // This causes a series of rapid renders that is slow for long lists.
     // We can avoid that by doing some simple bounds checking to ensure that scroll offsets never exceed their bounds.

     var scrollbarSize = instanceProps.scrollbarSize;
     var totalRowsHeight = instanceProps.rowSizeAndPositionManager.getTotalSize();
     var totalColumnsWidth = instanceProps.columnSizeAndPositionManager.getTotalSize();
     var scrollLeft = Math.min(Math.max(0, totalColumnsWidth - width + scrollbarSize), scrollLeftParam);
     var scrollTop = Math.min(Math.max(0, totalRowsHeight - height + scrollbarSize), scrollTopParam); // Certain devices (like Apple touchpad) rapid-fire duplicate events.
     // Don't force a re-render if this is the case.
     // The mouse may move faster then the animation frame does.
     // Use requestAnimationFrame to avoid over-updating.

     if (this.state.scrollLeft !== scrollLeft || this.state.scrollTop !== scrollTop) {
       // Track scrolling direction so we can more efficiently overscan rows to reduce empty space around the edges while scrolling.
       // Don't change direction for an axis unless scroll offset has changed.
       var scrollDirectionHorizontal = scrollLeft !== this.state.scrollLeft ? scrollLeft > this.state.scrollLeft ? _defaultOverscanIndicesGetter__WEBPACK_IMPORTED_MODULE_13__.SCROLL_DIRECTION_FORWARD : _defaultOverscanIndicesGetter__WEBPACK_IMPORTED_MODULE_13__.SCROLL_DIRECTION_BACKWARD : this.state.scrollDirectionHorizontal;
       var scrollDirectionVertical = scrollTop !== this.state.scrollTop ? scrollTop > this.state.scrollTop ? _defaultOverscanIndicesGetter__WEBPACK_IMPORTED_MODULE_13__.SCROLL_DIRECTION_FORWARD : _defaultOverscanIndicesGetter__WEBPACK_IMPORTED_MODULE_13__.SCROLL_DIRECTION_BACKWARD : this.state.scrollDirectionVertical;
       var newState = {
         isScrolling: true,
         scrollDirectionHorizontal: scrollDirectionHorizontal,
         scrollDirectionVertical: scrollDirectionVertical,
         scrollPositionChangeReason: SCROLL_POSITION_CHANGE_REASONS.OBSERVED
       };

       if (!autoHeight) {
         newState.scrollTop = scrollTop;
       }

       if (!autoWidth) {
         newState.scrollLeft = scrollLeft;
       }

       newState.needToResetStyleCache = false;
       this.setState(newState);
     }

     this._invokeOnScrollMemoizer({
       scrollLeft: scrollLeft,
       scrollTop: scrollTop,
       totalColumnsWidth: totalColumnsWidth,
       totalRowsHeight: totalRowsHeight
     });
   }
   /**
    * Invalidate Grid size and recompute visible cells.
    * This is a deferred wrapper for recomputeGridSize().
    * It sets a flag to be evaluated on cDM/cDU to avoid unnecessary renders.
    * This method is intended for advanced use-cases like CellMeasurer.
    */
   // @TODO (bvaughn) Add automated test coverage for this.

 }, {
   key: "invalidateCellSizeAfterRender",
   value: function invalidateCellSizeAfterRender(_ref3) {
     var columnIndex = _ref3.columnIndex,
         rowIndex = _ref3.rowIndex;
     this._deferredInvalidateColumnIndex = typeof this._deferredInvalidateColumnIndex === 'number' ? Math.min(this._deferredInvalidateColumnIndex, columnIndex) : columnIndex;
     this._deferredInvalidateRowIndex = typeof this._deferredInvalidateRowIndex === 'number' ? Math.min(this._deferredInvalidateRowIndex, rowIndex) : rowIndex;
   }
   /**
    * Pre-measure all columns and rows in a Grid.
    * Typically cells are only measured as needed and estimated sizes are used for cells that have not yet been measured.
    * This method ensures that the next call to getTotalSize() returns an exact size (as opposed to just an estimated one).
    */

 }, {
   key: "measureAllCells",
   value: function measureAllCells() {
     var _this$props2 = this.props,
         columnCount = _this$props2.columnCount,
         rowCount = _this$props2.rowCount;
     var instanceProps = this.state.instanceProps;
     instanceProps.columnSizeAndPositionManager.getSizeAndPositionOfCell(columnCount - 1);
     instanceProps.rowSizeAndPositionManager.getSizeAndPositionOfCell(rowCount - 1);
   }
   /**
    * Forced recompute of row heights and column widths.
    * This function should be called if dynamic column or row sizes have changed but nothing else has.
    * Since Grid only receives :columnCount and :rowCount it has no way of detecting when the underlying data changes.
    */

 }, {
   key: "recomputeGridSize",
   value: function recomputeGridSize() {
     var _ref4 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
         _ref4$columnIndex = _ref4.columnIndex,
         columnIndex = _ref4$columnIndex === void 0 ? 0 : _ref4$columnIndex,
         _ref4$rowIndex = _ref4.rowIndex,
         rowIndex = _ref4$rowIndex === void 0 ? 0 : _ref4$rowIndex;

     var _this$props3 = this.props,
         scrollToColumn = _this$props3.scrollToColumn,
         scrollToRow = _this$props3.scrollToRow;
     var instanceProps = this.state.instanceProps;
     instanceProps.columnSizeAndPositionManager.resetCell(columnIndex);
     instanceProps.rowSizeAndPositionManager.resetCell(rowIndex); // Cell sizes may be determined by a function property.
     // In this case the cDU handler can't know if they changed.
     // Store this flag to let the next cDU pass know it needs to recompute the scroll offset.

     this._recomputeScrollLeftFlag = scrollToColumn >= 0 && (this.state.scrollDirectionHorizontal === _defaultOverscanIndicesGetter__WEBPACK_IMPORTED_MODULE_13__.SCROLL_DIRECTION_FORWARD ? columnIndex <= scrollToColumn : columnIndex >= scrollToColumn);
     this._recomputeScrollTopFlag = scrollToRow >= 0 && (this.state.scrollDirectionVertical === _defaultOverscanIndicesGetter__WEBPACK_IMPORTED_MODULE_13__.SCROLL_DIRECTION_FORWARD ? rowIndex <= scrollToRow : rowIndex >= scrollToRow); // Clear cell cache in case we are scrolling;
     // Invalid row heights likely mean invalid cached content as well.

     this._styleCache = {};
     this._cellCache = {};
     this.forceUpdate();
   }
   /**
    * Ensure column and row are visible.
    */

 }, {
   key: "scrollToCell",
   value: function scrollToCell(_ref5) {
     var columnIndex = _ref5.columnIndex,
         rowIndex = _ref5.rowIndex;
     var columnCount = this.props.columnCount;
     var props = this.props; // Don't adjust scroll offset for single-column grids (eg List, Table).
     // This can cause a funky scroll offset because of the vertical scrollbar width.

     if (columnCount > 1 && columnIndex !== undefined) {
       this._updateScrollLeftForScrollToColumn(_objectSpread({}, props, {
         scrollToColumn: columnIndex
       }));
     }

     if (rowIndex !== undefined) {
       this._updateScrollTopForScrollToRow(_objectSpread({}, props, {
         scrollToRow: rowIndex
       }));
     }
   }
 }, {
   key: "componentDidMount",
   value: function componentDidMount() {
     var _this$props4 = this.props,
         getScrollbarSize = _this$props4.getScrollbarSize,
         height = _this$props4.height,
         scrollLeft = _this$props4.scrollLeft,
         scrollToColumn = _this$props4.scrollToColumn,
         scrollTop = _this$props4.scrollTop,
         scrollToRow = _this$props4.scrollToRow,
         width = _this$props4.width;
     var instanceProps = this.state.instanceProps; // Reset initial offsets to be ignored in browser

     this._initialScrollTop = 0;
     this._initialScrollLeft = 0; // If cell sizes have been invalidated (eg we are using CellMeasurer) then reset cached positions.
     // We must do this at the start of the method as we may calculate and update scroll position below.

     this._handleInvalidatedGridSize(); // If this component was first rendered server-side, scrollbar size will be undefined.
     // In that event we need to remeasure.


     if (!instanceProps.scrollbarSizeMeasured) {
       this.setState(function (prevState) {
         var stateUpdate = _objectSpread({}, prevState, {
           needToResetStyleCache: false
         });

         stateUpdate.instanceProps.scrollbarSize = getScrollbarSize();
         stateUpdate.instanceProps.scrollbarSizeMeasured = true;
         return stateUpdate;
       });
     }

     if (typeof scrollLeft === 'number' && scrollLeft >= 0 || typeof scrollTop === 'number' && scrollTop >= 0) {
       var stateUpdate = Grid._getScrollToPositionStateUpdate({
         prevState: this.state,
         scrollLeft: scrollLeft,
         scrollTop: scrollTop
       });

       if (stateUpdate) {
         stateUpdate.needToResetStyleCache = false;
         this.setState(stateUpdate);
       }
     } // refs don't work in `react-test-renderer`


     if (this._scrollingContainer) {
       // setting the ref's scrollLeft and scrollTop.
       // Somehow in MultiGrid the main grid doesn't trigger a update on mount.
       if (this._scrollingContainer.scrollLeft !== this.state.scrollLeft) {
         this._scrollingContainer.scrollLeft = this.state.scrollLeft;
       }

       if (this._scrollingContainer.scrollTop !== this.state.scrollTop) {
         this._scrollingContainer.scrollTop = this.state.scrollTop;
       }
     } // Don't update scroll offset if the size is 0; we don't render any cells in this case.
     // Setting a state may cause us to later thing we've updated the offce when we haven't.


     var sizeIsBiggerThanZero = height > 0 && width > 0;

     if (scrollToColumn >= 0 && sizeIsBiggerThanZero) {
       this._updateScrollLeftForScrollToColumn();
     }

     if (scrollToRow >= 0 && sizeIsBiggerThanZero) {
       this._updateScrollTopForScrollToRow();
     } // Update onRowsRendered callback


     this._invokeOnGridRenderedHelper(); // Initialize onScroll callback


     this._invokeOnScrollMemoizer({
       scrollLeft: scrollLeft || 0,
       scrollTop: scrollTop || 0,
       totalColumnsWidth: instanceProps.columnSizeAndPositionManager.getTotalSize(),
       totalRowsHeight: instanceProps.rowSizeAndPositionManager.getTotalSize()
     });

     this._maybeCallOnScrollbarPresenceChange();
   }
   /**
    * @private
    * This method updates scrollLeft/scrollTop in state for the following conditions:
    * 1) New scroll-to-cell props have been set
    */

 }, {
   key: "componentDidUpdate",
   value: function componentDidUpdate(prevProps, prevState) {
     var _this2 = this;

     var _this$props5 = this.props,
         autoHeight = _this$props5.autoHeight,
         autoWidth = _this$props5.autoWidth,
         columnCount = _this$props5.columnCount,
         height = _this$props5.height,
         rowCount = _this$props5.rowCount,
         scrollToAlignment = _this$props5.scrollToAlignment,
         scrollToColumn = _this$props5.scrollToColumn,
         scrollToRow = _this$props5.scrollToRow,
         width = _this$props5.width;
     var _this$state = this.state,
         scrollLeft = _this$state.scrollLeft,
         scrollPositionChangeReason = _this$state.scrollPositionChangeReason,
         scrollTop = _this$state.scrollTop,
         instanceProps = _this$state.instanceProps; // If cell sizes have been invalidated (eg we are using CellMeasurer) then reset cached positions.
     // We must do this at the start of the method as we may calculate and update scroll position below.

     this._handleInvalidatedGridSize(); // Handle edge case where column or row count has only just increased over 0.
     // In this case we may have to restore a previously-specified scroll offset.
     // For more info see bvaughn/react-virtualized/issues/218


     var columnOrRowCountJustIncreasedFromZero = columnCount > 0 && prevProps.columnCount === 0 || rowCount > 0 && prevProps.rowCount === 0; // Make sure requested changes to :scrollLeft or :scrollTop get applied.
     // Assigning to scrollLeft/scrollTop tells the browser to interrupt any running scroll animations,
     // And to discard any pending async changes to the scroll position that may have happened in the meantime (e.g. on a separate scrolling thread).
     // So we only set these when we require an adjustment of the scroll position.
     // See issue #2 for more information.

     if (scrollPositionChangeReason === SCROLL_POSITION_CHANGE_REASONS.REQUESTED) {
       // @TRICKY :autoHeight and :autoWidth properties instructs Grid to leave :scrollTop and :scrollLeft management to an external HOC (eg WindowScroller).
       // In this case we should avoid checking scrollingContainer.scrollTop and scrollingContainer.scrollLeft since it forces layout/flow.
       if (!autoWidth && scrollLeft >= 0 && (scrollLeft !== this._scrollingContainer.scrollLeft || columnOrRowCountJustIncreasedFromZero)) {
         this._scrollingContainer.scrollLeft = scrollLeft;
       }

       if (!autoHeight && scrollTop >= 0 && (scrollTop !== this._scrollingContainer.scrollTop || columnOrRowCountJustIncreasedFromZero)) {
         this._scrollingContainer.scrollTop = scrollTop;
       }
     } // Special case where the previous size was 0:
     // In this case we don't show any windowed cells at all.
     // So we should always recalculate offset afterwards.


     var sizeJustIncreasedFromZero = (prevProps.width === 0 || prevProps.height === 0) && height > 0 && width > 0; // Update scroll offsets if the current :scrollToColumn or :scrollToRow values requires it
     // @TODO Do we also need this check or can the one in componentWillUpdate() suffice?

     if (this._recomputeScrollLeftFlag) {
       this._recomputeScrollLeftFlag = false;

       this._updateScrollLeftForScrollToColumn(this.props);
     } else {
       (0,_utils_updateScrollIndexHelper__WEBPACK_IMPORTED_MODULE_14__["default"])({
         cellSizeAndPositionManager: instanceProps.columnSizeAndPositionManager,
         previousCellsCount: prevProps.columnCount,
         previousCellSize: prevProps.columnWidth,
         previousScrollToAlignment: prevProps.scrollToAlignment,
         previousScrollToIndex: prevProps.scrollToColumn,
         previousSize: prevProps.width,
         scrollOffset: scrollLeft,
         scrollToAlignment: scrollToAlignment,
         scrollToIndex: scrollToColumn,
         size: width,
         sizeJustIncreasedFromZero: sizeJustIncreasedFromZero,
         updateScrollIndexCallback: function updateScrollIndexCallback() {
           return _this2._updateScrollLeftForScrollToColumn(_this2.props);
         }
       });
     }

     if (this._recomputeScrollTopFlag) {
       this._recomputeScrollTopFlag = false;

       this._updateScrollTopForScrollToRow(this.props);
     } else {
       (0,_utils_updateScrollIndexHelper__WEBPACK_IMPORTED_MODULE_14__["default"])({
         cellSizeAndPositionManager: instanceProps.rowSizeAndPositionManager,
         previousCellsCount: prevProps.rowCount,
         previousCellSize: prevProps.rowHeight,
         previousScrollToAlignment: prevProps.scrollToAlignment,
         previousScrollToIndex: prevProps.scrollToRow,
         previousSize: prevProps.height,
         scrollOffset: scrollTop,
         scrollToAlignment: scrollToAlignment,
         scrollToIndex: scrollToRow,
         size: height,
         sizeJustIncreasedFromZero: sizeJustIncreasedFromZero,
         updateScrollIndexCallback: function updateScrollIndexCallback() {
           return _this2._updateScrollTopForScrollToRow(_this2.props);
         }
       });
     } // Update onRowsRendered callback if start/stop indices have changed


     this._invokeOnGridRenderedHelper(); // Changes to :scrollLeft or :scrollTop should also notify :onScroll listeners


     if (scrollLeft !== prevState.scrollLeft || scrollTop !== prevState.scrollTop) {
       var totalRowsHeight = instanceProps.rowSizeAndPositionManager.getTotalSize();
       var totalColumnsWidth = instanceProps.columnSizeAndPositionManager.getTotalSize();

       this._invokeOnScrollMemoizer({
         scrollLeft: scrollLeft,
         scrollTop: scrollTop,
         totalColumnsWidth: totalColumnsWidth,
         totalRowsHeight: totalRowsHeight
       });
     }

     this._maybeCallOnScrollbarPresenceChange();
   }
 }, {
   key: "componentWillUnmount",
   value: function componentWillUnmount() {
     if (this._disablePointerEventsTimeoutId) {
       (0,_utils_requestAnimationTimeout__WEBPACK_IMPORTED_MODULE_18__.cancelAnimationTimeout)(this._disablePointerEventsTimeoutId);
     }
   }
   /**
    * This method updates scrollLeft/scrollTop in state for the following conditions:
    * 1) Empty content (0 rows or columns)
    * 2) New scroll props overriding the current state
    * 3) Cells-count or cells-size has changed, making previous scroll offsets invalid
    */

 }, {
   key: "render",
   value: function render() {
     var _this$props6 = this.props,
         autoContainerWidth = _this$props6.autoContainerWidth,
         autoHeight = _this$props6.autoHeight,
         autoWidth = _this$props6.autoWidth,
         className = _this$props6.className,
         containerProps = _this$props6.containerProps,
         containerRole = _this$props6.containerRole,
         containerStyle = _this$props6.containerStyle,
         height = _this$props6.height,
         id = _this$props6.id,
         noContentRenderer = _this$props6.noContentRenderer,
         role = _this$props6.role,
         style = _this$props6.style,
         tabIndex = _this$props6.tabIndex,
         width = _this$props6.width;
     var _this$state2 = this.state,
         instanceProps = _this$state2.instanceProps,
         needToResetStyleCache = _this$state2.needToResetStyleCache;

     var isScrolling = this._isScrolling();

     var gridStyle = {
       boxSizing: 'border-box',
       direction: 'ltr',
       height: autoHeight ? 'auto' : height,
       position: 'relative',
       width: autoWidth ? 'auto' : width,
       WebkitOverflowScrolling: 'touch',
       willChange: 'transform'
     };

     if (needToResetStyleCache) {
       this._styleCache = {};
     } // calculate _styleCache here
     // if state.isScrolling (not from _isScrolling) then reset


     if (!this.state.isScrolling) {
       this._resetStyleCache();
     } // calculate children to render here


     this._calculateChildrenToRender(this.props, this.state);

     var totalColumnsWidth = instanceProps.columnSizeAndPositionManager.getTotalSize();
     var totalRowsHeight = instanceProps.rowSizeAndPositionManager.getTotalSize(); // Force browser to hide scrollbars when we know they aren't necessary.
     // Otherwise once scrollbars appear they may not disappear again.
     // For more info see issue #116

     var verticalScrollBarSize = totalRowsHeight > height ? instanceProps.scrollbarSize : 0;
     var horizontalScrollBarSize = totalColumnsWidth > width ? instanceProps.scrollbarSize : 0;

     if (horizontalScrollBarSize !== this._horizontalScrollBarSize || verticalScrollBarSize !== this._verticalScrollBarSize) {
       this._horizontalScrollBarSize = horizontalScrollBarSize;
       this._verticalScrollBarSize = verticalScrollBarSize;
       this._scrollbarPresenceChanged = true;
     } // Also explicitly init styles to 'auto' if scrollbars are required.
     // This works around an obscure edge case where external CSS styles have not yet been loaded,
     // But an initial scroll index of offset is set as an external prop.
     // Without this style, Grid would render the correct range of cells but would NOT update its internal offset.
     // This was originally reported via clauderic/react-infinite-calendar/issues/23


     gridStyle.overflowX = totalColumnsWidth + verticalScrollBarSize <= width ? 'hidden' : 'auto';
     gridStyle.overflowY = totalRowsHeight + horizontalScrollBarSize <= height ? 'hidden' : 'auto';
     var childrenToDisplay = this._childrenToDisplay;
     var showNoContentRenderer = childrenToDisplay.length === 0 && height > 0 && width > 0;
     return react__WEBPACK_IMPORTED_MODULE_8__.createElement("div", _babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0___default()({
       ref: this._setScrollingContainerRef
     }, containerProps, {
       "aria-label": this.props['aria-label'],
       "aria-readonly": this.props['aria-readonly'],
       className: (0,clsx__WEBPACK_IMPORTED_MODULE_9__["default"])('ReactVirtualized__Grid', className),
       id: id,
       onScroll: this._onScroll,
       role: role,
       style: _objectSpread({}, gridStyle, {}, style),
       tabIndex: tabIndex
     }), childrenToDisplay.length > 0 && react__WEBPACK_IMPORTED_MODULE_8__.createElement("div", {
       className: "ReactVirtualized__Grid__innerScrollContainer",
       role: containerRole,
       style: _objectSpread({
         width: autoContainerWidth ? 'auto' : totalColumnsWidth,
         height: totalRowsHeight,
         maxWidth: totalColumnsWidth,
         maxHeight: totalRowsHeight,
         overflow: 'hidden',
         pointerEvents: isScrolling ? 'none' : '',
         position: 'relative'
       }, containerStyle)
     }, childrenToDisplay), showNoContentRenderer && noContentRenderer());
   }
   /* ---------------------------- Helper methods ---------------------------- */

 }, {
   key: "_calculateChildrenToRender",
   value: function _calculateChildrenToRender() {
     var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.props;
     var state = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.state;
     var cellRenderer = props.cellRenderer,
         cellRangeRenderer = props.cellRangeRenderer,
         columnCount = props.columnCount,
         deferredMeasurementCache = props.deferredMeasurementCache,
         height = props.height,
         overscanColumnCount = props.overscanColumnCount,
         overscanIndicesGetter = props.overscanIndicesGetter,
         overscanRowCount = props.overscanRowCount,
         rowCount = props.rowCount,
         width = props.width,
         isScrollingOptOut = props.isScrollingOptOut;
     var scrollDirectionHorizontal = state.scrollDirectionHorizontal,
         scrollDirectionVertical = state.scrollDirectionVertical,
         instanceProps = state.instanceProps;
     var scrollTop = this._initialScrollTop > 0 ? this._initialScrollTop : state.scrollTop;
     var scrollLeft = this._initialScrollLeft > 0 ? this._initialScrollLeft : state.scrollLeft;

     var isScrolling = this._isScrolling(props, state);

     this._childrenToDisplay = []; // Render only enough columns and rows to cover the visible area of the grid.

     if (height > 0 && width > 0) {
       var visibleColumnIndices = instanceProps.columnSizeAndPositionManager.getVisibleCellRange({
         containerSize: width,
         offset: scrollLeft
       });
       var visibleRowIndices = instanceProps.rowSizeAndPositionManager.getVisibleCellRange({
         containerSize: height,
         offset: scrollTop
       });
       var horizontalOffsetAdjustment = instanceProps.columnSizeAndPositionManager.getOffsetAdjustment({
         containerSize: width,
         offset: scrollLeft
       });
       var verticalOffsetAdjustment = instanceProps.rowSizeAndPositionManager.getOffsetAdjustment({
         containerSize: height,
         offset: scrollTop
       }); // Store for _invokeOnGridRenderedHelper()

       this._renderedColumnStartIndex = visibleColumnIndices.start;
       this._renderedColumnStopIndex = visibleColumnIndices.stop;
       this._renderedRowStartIndex = visibleRowIndices.start;
       this._renderedRowStopIndex = visibleRowIndices.stop;
       var overscanColumnIndices = overscanIndicesGetter({
         direction: 'horizontal',
         cellCount: columnCount,
         overscanCellsCount: overscanColumnCount,
         scrollDirection: scrollDirectionHorizontal,
         startIndex: typeof visibleColumnIndices.start === 'number' ? visibleColumnIndices.start : 0,
         stopIndex: typeof visibleColumnIndices.stop === 'number' ? visibleColumnIndices.stop : -1
       });
       var overscanRowIndices = overscanIndicesGetter({
         direction: 'vertical',
         cellCount: rowCount,
         overscanCellsCount: overscanRowCount,
         scrollDirection: scrollDirectionVertical,
         startIndex: typeof visibleRowIndices.start === 'number' ? visibleRowIndices.start : 0,
         stopIndex: typeof visibleRowIndices.stop === 'number' ? visibleRowIndices.stop : -1
       }); // Store for _invokeOnGridRenderedHelper()

       var columnStartIndex = overscanColumnIndices.overscanStartIndex;
       var columnStopIndex = overscanColumnIndices.overscanStopIndex;
       var rowStartIndex = overscanRowIndices.overscanStartIndex;
       var rowStopIndex = overscanRowIndices.overscanStopIndex; // Advanced use-cases (eg CellMeasurer) require batched measurements to determine accurate sizes.

       if (deferredMeasurementCache) {
         // If rows have a dynamic height, scan the rows we are about to render.
         // If any have not yet been measured, then we need to render all columns initially,
         // Because the height of the row is equal to the tallest cell within that row,
         // (And so we can't know the height without measuring all column-cells first).
         if (!deferredMeasurementCache.hasFixedHeight()) {
           for (var rowIndex = rowStartIndex; rowIndex <= rowStopIndex; rowIndex++) {
             if (!deferredMeasurementCache.has(rowIndex, 0)) {
               columnStartIndex = 0;
               columnStopIndex = columnCount - 1;
               break;
             }
           }
         } // If columns have a dynamic width, scan the columns we are about to render.
         // If any have not yet been measured, then we need to render all rows initially,
         // Because the width of the column is equal to the widest cell within that column,
         // (And so we can't know the width without measuring all row-cells first).


         if (!deferredMeasurementCache.hasFixedWidth()) {
           for (var columnIndex = columnStartIndex; columnIndex <= columnStopIndex; columnIndex++) {
             if (!deferredMeasurementCache.has(0, columnIndex)) {
               rowStartIndex = 0;
               rowStopIndex = rowCount - 1;
               break;
             }
           }
         }
       }

       this._childrenToDisplay = cellRangeRenderer({
         cellCache: this._cellCache,
         cellRenderer: cellRenderer,
         columnSizeAndPositionManager: instanceProps.columnSizeAndPositionManager,
         columnStartIndex: columnStartIndex,
         columnStopIndex: columnStopIndex,
         deferredMeasurementCache: deferredMeasurementCache,
         horizontalOffsetAdjustment: horizontalOffsetAdjustment,
         isScrolling: isScrolling,
         isScrollingOptOut: isScrollingOptOut,
         parent: this,
         rowSizeAndPositionManager: instanceProps.rowSizeAndPositionManager,
         rowStartIndex: rowStartIndex,
         rowStopIndex: rowStopIndex,
         scrollLeft: scrollLeft,
         scrollTop: scrollTop,
         styleCache: this._styleCache,
         verticalOffsetAdjustment: verticalOffsetAdjustment,
         visibleColumnIndices: visibleColumnIndices,
         visibleRowIndices: visibleRowIndices
       }); // update the indices

       this._columnStartIndex = columnStartIndex;
       this._columnStopIndex = columnStopIndex;
       this._rowStartIndex = rowStartIndex;
       this._rowStopIndex = rowStopIndex;
     }
   }
   /**
    * Sets an :isScrolling flag for a small window of time.
    * This flag is used to disable pointer events on the scrollable portion of the Grid.
    * This prevents jerky/stuttery mouse-wheel scrolling.
    */

 }, {
   key: "_debounceScrollEnded",
   value: function _debounceScrollEnded() {
     var scrollingResetTimeInterval = this.props.scrollingResetTimeInterval;

     if (this._disablePointerEventsTimeoutId) {
       (0,_utils_requestAnimationTimeout__WEBPACK_IMPORTED_MODULE_18__.cancelAnimationTimeout)(this._disablePointerEventsTimeoutId);
     }

     this._disablePointerEventsTimeoutId = (0,_utils_requestAnimationTimeout__WEBPACK_IMPORTED_MODULE_18__.requestAnimationTimeout)(this._debounceScrollEndedCallback, scrollingResetTimeInterval);
   }
 }, {
   key: "_handleInvalidatedGridSize",

   /**
    * Check for batched CellMeasurer size invalidations.
    * This will occur the first time one or more previously unmeasured cells are rendered.
    */
   value: function _handleInvalidatedGridSize() {
     if (typeof this._deferredInvalidateColumnIndex === 'number' && typeof this._deferredInvalidateRowIndex === 'number') {
       var columnIndex = this._deferredInvalidateColumnIndex;
       var rowIndex = this._deferredInvalidateRowIndex;
       this._deferredInvalidateColumnIndex = null;
       this._deferredInvalidateRowIndex = null;
       this.recomputeGridSize({
         columnIndex: columnIndex,
         rowIndex: rowIndex
       });
     }
   }
 }, {
   key: "_invokeOnScrollMemoizer",
   value: function _invokeOnScrollMemoizer(_ref6) {
     var _this3 = this;

     var scrollLeft = _ref6.scrollLeft,
         scrollTop = _ref6.scrollTop,
         totalColumnsWidth = _ref6.totalColumnsWidth,
         totalRowsHeight = _ref6.totalRowsHeight;

     this._onScrollMemoizer({
       callback: function callback(_ref7) {
         var scrollLeft = _ref7.scrollLeft,
             scrollTop = _ref7.scrollTop;
         var _this3$props = _this3.props,
             height = _this3$props.height,
             onScroll = _this3$props.onScroll,
             width = _this3$props.width;
         onScroll({
           clientHeight: height,
           clientWidth: width,
           scrollHeight: totalRowsHeight,
           scrollLeft: scrollLeft,
           scrollTop: scrollTop,
           scrollWidth: totalColumnsWidth
         });
       },
       indices: {
         scrollLeft: scrollLeft,
         scrollTop: scrollTop
       }
     });
   }
 }, {
   key: "_isScrolling",
   value: function _isScrolling() {
     var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.props;
     var state = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.state;
     // If isScrolling is defined in props, use it to override the value in state
     // This is a performance optimization for WindowScroller + Grid
     return Object.hasOwnProperty.call(props, 'isScrolling') ? Boolean(props.isScrolling) : Boolean(state.isScrolling);
   }
 }, {
   key: "_maybeCallOnScrollbarPresenceChange",
   value: function _maybeCallOnScrollbarPresenceChange() {
     if (this._scrollbarPresenceChanged) {
       var onScrollbarPresenceChange = this.props.onScrollbarPresenceChange;
       this._scrollbarPresenceChanged = false;
       onScrollbarPresenceChange({
         horizontal: this._horizontalScrollBarSize > 0,
         size: this.state.instanceProps.scrollbarSize,
         vertical: this._verticalScrollBarSize > 0
       });
     }
   }
 }, {
   key: "scrollToPosition",

   /**
    * Scroll to the specified offset(s).
    * Useful for animating position changes.
    */
   value: function scrollToPosition(_ref8) {
     var scrollLeft = _ref8.scrollLeft,
         scrollTop = _ref8.scrollTop;

     var stateUpdate = Grid._getScrollToPositionStateUpdate({
       prevState: this.state,
       scrollLeft: scrollLeft,
       scrollTop: scrollTop
     });

     if (stateUpdate) {
       stateUpdate.needToResetStyleCache = false;
       this.setState(stateUpdate);
     }
   }
 }, {
   key: "_getCalculatedScrollLeft",
   value: function _getCalculatedScrollLeft() {
     var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.props;
     var state = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.state;
     return Grid._getCalculatedScrollLeft(props, state);
   }
 }, {
   key: "_updateScrollLeftForScrollToColumn",
   value: function _updateScrollLeftForScrollToColumn() {
     var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.props;
     var state = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.state;

     var stateUpdate = Grid._getScrollLeftForScrollToColumnStateUpdate(props, state);

     if (stateUpdate) {
       stateUpdate.needToResetStyleCache = false;
       this.setState(stateUpdate);
     }
   }
 }, {
   key: "_getCalculatedScrollTop",
   value: function _getCalculatedScrollTop() {
     var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.props;
     var state = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.state;
     return Grid._getCalculatedScrollTop(props, state);
   }
 }, {
   key: "_resetStyleCache",
   value: function _resetStyleCache() {
     var styleCache = this._styleCache;
     var cellCache = this._cellCache;
     var isScrollingOptOut = this.props.isScrollingOptOut; // Reset cell and style caches once scrolling stops.
     // This makes Grid simpler to use (since cells commonly change).
     // And it keeps the caches from growing too large.
     // Performance is most sensitive when a user is scrolling.
     // Don't clear visible cells from cellCache if isScrollingOptOut is specified.
     // This keeps the cellCache to a resonable size.

     this._cellCache = {};
     this._styleCache = {}; // Copy over the visible cell styles so avoid unnecessary re-render.

     for (var rowIndex = this._rowStartIndex; rowIndex <= this._rowStopIndex; rowIndex++) {
       for (var columnIndex = this._columnStartIndex; columnIndex <= this._columnStopIndex; columnIndex++) {
         var key = "".concat(rowIndex, "-").concat(columnIndex);
         this._styleCache[key] = styleCache[key];

         if (isScrollingOptOut) {
           this._cellCache[key] = cellCache[key];
         }
       }
     }
   }
 }, {
   key: "_updateScrollTopForScrollToRow",
   value: function _updateScrollTopForScrollToRow() {
     var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.props;
     var state = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.state;

     var stateUpdate = Grid._getScrollTopForScrollToRowStateUpdate(props, state);

     if (stateUpdate) {
       stateUpdate.needToResetStyleCache = false;
       this.setState(stateUpdate);
     }
   }
 }], [{
   key: "getDerivedStateFromProps",
   value: function getDerivedStateFromProps(nextProps, prevState) {
     var newState = {};

     if (nextProps.columnCount === 0 && prevState.scrollLeft !== 0 || nextProps.rowCount === 0 && prevState.scrollTop !== 0) {
       newState.scrollLeft = 0;
       newState.scrollTop = 0; // only use scroll{Left,Top} from props if scrollTo{Column,Row} isn't specified
       // scrollTo{Column,Row} should override scroll{Left,Top}
     } else if (nextProps.scrollLeft !== prevState.scrollLeft && nextProps.scrollToColumn < 0 || nextProps.scrollTop !== prevState.scrollTop && nextProps.scrollToRow < 0) {
       Object.assign(newState, Grid._getScrollToPositionStateUpdate({
         prevState: prevState,
         scrollLeft: nextProps.scrollLeft,
         scrollTop: nextProps.scrollTop
       }));
     }

     var instanceProps = prevState.instanceProps; // Initially we should not clearStyleCache

     newState.needToResetStyleCache = false;

     if (nextProps.columnWidth !== instanceProps.prevColumnWidth || nextProps.rowHeight !== instanceProps.prevRowHeight) {
       // Reset cache. set it to {} in render
       newState.needToResetStyleCache = true;
     }

     instanceProps.columnSizeAndPositionManager.configure({
       cellCount: nextProps.columnCount,
       estimatedCellSize: Grid._getEstimatedColumnSize(nextProps),
       cellSizeGetter: Grid._wrapSizeGetter(nextProps.columnWidth)
     });
     instanceProps.rowSizeAndPositionManager.configure({
       cellCount: nextProps.rowCount,
       estimatedCellSize: Grid._getEstimatedRowSize(nextProps),
       cellSizeGetter: Grid._wrapSizeGetter(nextProps.rowHeight)
     });

     if (instanceProps.prevColumnCount === 0 || instanceProps.prevRowCount === 0) {
       instanceProps.prevColumnCount = 0;
       instanceProps.prevRowCount = 0;
     } // If scrolling is controlled outside this component, clear cache when scrolling stops


     if (nextProps.autoHeight && nextProps.isScrolling === false && instanceProps.prevIsScrolling === true) {
       Object.assign(newState, {
         isScrolling: false
       });
     }

     var maybeStateA;
     var maybeStateB;
     (0,_utils_calculateSizeAndPositionDataAndUpdateScrollOffset__WEBPACK_IMPORTED_MODULE_10__["default"])({
       cellCount: instanceProps.prevColumnCount,
       cellSize: typeof instanceProps.prevColumnWidth === 'number' ? instanceProps.prevColumnWidth : null,
       computeMetadataCallback: function computeMetadataCallback() {
         return instanceProps.columnSizeAndPositionManager.resetCell(0);
       },
       computeMetadataCallbackProps: nextProps,
       nextCellsCount: nextProps.columnCount,
       nextCellSize: typeof nextProps.columnWidth === 'number' ? nextProps.columnWidth : null,
       nextScrollToIndex: nextProps.scrollToColumn,
       scrollToIndex: instanceProps.prevScrollToColumn,
       updateScrollOffsetForScrollToIndex: function updateScrollOffsetForScrollToIndex() {
         maybeStateA = Grid._getScrollLeftForScrollToColumnStateUpdate(nextProps, prevState);
       }
     });
     (0,_utils_calculateSizeAndPositionDataAndUpdateScrollOffset__WEBPACK_IMPORTED_MODULE_10__["default"])({
       cellCount: instanceProps.prevRowCount,
       cellSize: typeof instanceProps.prevRowHeight === 'number' ? instanceProps.prevRowHeight : null,
       computeMetadataCallback: function computeMetadataCallback() {
         return instanceProps.rowSizeAndPositionManager.resetCell(0);
       },
       computeMetadataCallbackProps: nextProps,
       nextCellsCount: nextProps.rowCount,
       nextCellSize: typeof nextProps.rowHeight === 'number' ? nextProps.rowHeight : null,
       nextScrollToIndex: nextProps.scrollToRow,
       scrollToIndex: instanceProps.prevScrollToRow,
       updateScrollOffsetForScrollToIndex: function updateScrollOffsetForScrollToIndex() {
         maybeStateB = Grid._getScrollTopForScrollToRowStateUpdate(nextProps, prevState);
       }
     });
     instanceProps.prevColumnCount = nextProps.columnCount;
     instanceProps.prevColumnWidth = nextProps.columnWidth;
     instanceProps.prevIsScrolling = nextProps.isScrolling === true;
     instanceProps.prevRowCount = nextProps.rowCount;
     instanceProps.prevRowHeight = nextProps.rowHeight;
     instanceProps.prevScrollToColumn = nextProps.scrollToColumn;
     instanceProps.prevScrollToRow = nextProps.scrollToRow; // getting scrollBarSize (moved from componentWillMount)

     instanceProps.scrollbarSize = nextProps.getScrollbarSize();

     if (instanceProps.scrollbarSize === undefined) {
       instanceProps.scrollbarSizeMeasured = false;
       instanceProps.scrollbarSize = 0;
     } else {
       instanceProps.scrollbarSizeMeasured = true;
     }

     newState.instanceProps = instanceProps;
     return _objectSpread({}, newState, {}, maybeStateA, {}, maybeStateB);
   }
 }, {
   key: "_getEstimatedColumnSize",
   value: function _getEstimatedColumnSize(props) {
     return typeof props.columnWidth === 'number' ? props.columnWidth : props.estimatedColumnSize;
   }
 }, {
   key: "_getEstimatedRowSize",
   value: function _getEstimatedRowSize(props) {
     return typeof props.rowHeight === 'number' ? props.rowHeight : props.estimatedRowSize;
   }
 }, {
   key: "_getScrollToPositionStateUpdate",

   /**
    * Get the updated state after scrolling to
    * scrollLeft and scrollTop
    */
   value: function _getScrollToPositionStateUpdate(_ref9) {
     var prevState = _ref9.prevState,
         scrollLeft = _ref9.scrollLeft,
         scrollTop = _ref9.scrollTop;
     var newState = {
       scrollPositionChangeReason: SCROLL_POSITION_CHANGE_REASONS.REQUESTED
     };

     if (typeof scrollLeft === 'number' && scrollLeft >= 0) {
       newState.scrollDirectionHorizontal = scrollLeft > prevState.scrollLeft ? _defaultOverscanIndicesGetter__WEBPACK_IMPORTED_MODULE_13__.SCROLL_DIRECTION_FORWARD : _defaultOverscanIndicesGetter__WEBPACK_IMPORTED_MODULE_13__.SCROLL_DIRECTION_BACKWARD;
       newState.scrollLeft = scrollLeft;
     }

     if (typeof scrollTop === 'number' && scrollTop >= 0) {
       newState.scrollDirectionVertical = scrollTop > prevState.scrollTop ? _defaultOverscanIndicesGetter__WEBPACK_IMPORTED_MODULE_13__.SCROLL_DIRECTION_FORWARD : _defaultOverscanIndicesGetter__WEBPACK_IMPORTED_MODULE_13__.SCROLL_DIRECTION_BACKWARD;
       newState.scrollTop = scrollTop;
     }

     if (typeof scrollLeft === 'number' && scrollLeft >= 0 && scrollLeft !== prevState.scrollLeft || typeof scrollTop === 'number' && scrollTop >= 0 && scrollTop !== prevState.scrollTop) {
       return newState;
     }

     return {};
   }
 }, {
   key: "_wrapSizeGetter",
   value: function _wrapSizeGetter(value) {
     return typeof value === 'function' ? value : function () {
       return value;
     };
   }
 }, {
   key: "_getCalculatedScrollLeft",
   value: function _getCalculatedScrollLeft(nextProps, prevState) {
     var columnCount = nextProps.columnCount,
         height = nextProps.height,
         scrollToAlignment = nextProps.scrollToAlignment,
         scrollToColumn = nextProps.scrollToColumn,
         width = nextProps.width;
     var scrollLeft = prevState.scrollLeft,
         instanceProps = prevState.instanceProps;

     if (columnCount > 0) {
       var finalColumn = columnCount - 1;
       var targetIndex = scrollToColumn < 0 ? finalColumn : Math.min(finalColumn, scrollToColumn);
       var totalRowsHeight = instanceProps.rowSizeAndPositionManager.getTotalSize();
       var scrollBarSize = instanceProps.scrollbarSizeMeasured && totalRowsHeight > height ? instanceProps.scrollbarSize : 0;
       return instanceProps.columnSizeAndPositionManager.getUpdatedOffsetForIndex({
         align: scrollToAlignment,
         containerSize: width - scrollBarSize,
         currentOffset: scrollLeft,
         targetIndex: targetIndex
       });
     }

     return 0;
   }
 }, {
   key: "_getScrollLeftForScrollToColumnStateUpdate",
   value: function _getScrollLeftForScrollToColumnStateUpdate(nextProps, prevState) {
     var scrollLeft = prevState.scrollLeft;

     var calculatedScrollLeft = Grid._getCalculatedScrollLeft(nextProps, prevState);

     if (typeof calculatedScrollLeft === 'number' && calculatedScrollLeft >= 0 && scrollLeft !== calculatedScrollLeft) {
       return Grid._getScrollToPositionStateUpdate({
         prevState: prevState,
         scrollLeft: calculatedScrollLeft,
         scrollTop: -1
       });
     }

     return {};
   }
 }, {
   key: "_getCalculatedScrollTop",
   value: function _getCalculatedScrollTop(nextProps, prevState) {
     var height = nextProps.height,
         rowCount = nextProps.rowCount,
         scrollToAlignment = nextProps.scrollToAlignment,
         scrollToRow = nextProps.scrollToRow,
         width = nextProps.width;
     var scrollTop = prevState.scrollTop,
         instanceProps = prevState.instanceProps;

     if (rowCount > 0) {
       var finalRow = rowCount - 1;
       var targetIndex = scrollToRow < 0 ? finalRow : Math.min(finalRow, scrollToRow);
       var totalColumnsWidth = instanceProps.columnSizeAndPositionManager.getTotalSize();
       var scrollBarSize = instanceProps.scrollbarSizeMeasured && totalColumnsWidth > width ? instanceProps.scrollbarSize : 0;
       return instanceProps.rowSizeAndPositionManager.getUpdatedOffsetForIndex({
         align: scrollToAlignment,
         containerSize: height - scrollBarSize,
         currentOffset: scrollTop,
         targetIndex: targetIndex
       });
     }

     return 0;
   }
 }, {
   key: "_getScrollTopForScrollToRowStateUpdate",
   value: function _getScrollTopForScrollToRowStateUpdate(nextProps, prevState) {
     var scrollTop = prevState.scrollTop;

     var calculatedScrollTop = Grid._getCalculatedScrollTop(nextProps, prevState);

     if (typeof calculatedScrollTop === 'number' && calculatedScrollTop >= 0 && scrollTop !== calculatedScrollTop) {
       return Grid._getScrollToPositionStateUpdate({
         prevState: prevState,
         scrollLeft: -1,
         scrollTop: calculatedScrollTop
       });
     }

     return {};
   }
 }]);

 return Grid;
}

This leads me to believe that WebPack is cutting off the /*..*/}(React.PureComponent) bit at the end of the function, therefore it is undefined.

Jun 29 '24 01:06 rlaphoenix

Just came across the same issue and have no idea how to solve it

Oct 30 '24 14:10 baba43

react-virtualized react-virtualized copied to clipboard

Grid/MultiGrid: TypeError: Super expression must either be null or a function

Bug Report

What is the current behavior?

What is the expected behavior?

Which versions of React and react-virtualized, and which browser / OS are affected by this issue? Did this work in previous versions of react-virtualized?

react-virtualized
react-virtualized copied to clipboard