react-native-web+0.19.13+001+initial.patch

diff --git a/node_modules/react-native-web/dist/vendor/react-native/VirtualizedList/index.js b/node_modules/react-native-web/dist/vendor/react-native/VirtualizedList/index.js
index 1f52b73..53b1a83 100644
--- a/node_modules/react-native-web/dist/vendor/react-native/VirtualizedList/index.js
+++ b/node_modules/react-native-web/dist/vendor/react-native/VirtualizedList/index.js
@@ -287,7 +287,7 @@ class VirtualizedList extends StateSafePureComponent {
   // REACT-NATIVE-WEB patch to preserve during future RN merges: Support inverted wheel scroller.
 
   constructor(_props) {
-    var _this$props$updateCel;
+    var _this$props$updateCel, _this$props$maintainV, _this$props$maintainV2;
     super(_props);
     this._getScrollMetrics = () => {
       return this._scrollMetrics;
@@ -522,6 +522,11 @@ class VirtualizedList extends StateSafePureComponent {
         visibleLength,
         zoomScale
       };
+      if (this.state.pendingScrollUpdateCount > 0) {
+        this.setState(state => ({
+          pendingScrollUpdateCount: state.pendingScrollUpdateCount - 1
+        }));
+      }
       this._updateViewableItems(this.props, this.state.cellsAroundViewport);
       if (!this.props) {
         return;
@@ -571,7 +576,7 @@ class VirtualizedList extends StateSafePureComponent {
     this._updateCellsToRender = () => {
       this._updateViewableItems(this.props, this.state.cellsAroundViewport);
       this.setState((state, props) => {
-        var cellsAroundViewport = this._adjustCellsAroundViewport(props, state.cellsAroundViewport);
+        var cellsAroundViewport = this._adjustCellsAroundViewport(props, state.cellsAroundViewport, state.pendingScrollUpdateCount);
         var renderMask = VirtualizedList._createRenderMask(props, cellsAroundViewport, this._getNonViewportRenderRegions(props));
         if (cellsAroundViewport.first === state.cellsAroundViewport.first && cellsAroundViewport.last === state.cellsAroundViewport.last && renderMask.equals(state.renderMask)) {
           return null;
@@ -591,7 +596,7 @@ class VirtualizedList extends StateSafePureComponent {
       return {
         index,
         item,
-        key: this._keyExtractor(item, index, props),
+        key: VirtualizedList._keyExtractor(item, index, props),
         isViewable
       };
     };
@@ -623,12 +628,10 @@ class VirtualizedList extends StateSafePureComponent {
     };
     this._getFrameMetrics = (index, props) => {
       var data = props.data,
-        getItem = props.getItem,
         getItemCount = props.getItemCount,
         getItemLayout = props.getItemLayout;
       invariant(index >= 0 && index < getItemCount(data), 'Tried to get frame for out of range index ' + index);
-      var item = getItem(data, index);
-      var frame = this._frames[this._keyExtractor(item, index, props)];
+      var frame = this._frames[VirtualizedList._getItemKey(props, index)];
       if (!frame || frame.index !== index) {
         if (getItemLayout) {
           /* $FlowFixMe[prop-missing] (>=0.63.0 site=react_native_fb) This comment
@@ -652,7 +655,7 @@ class VirtualizedList extends StateSafePureComponent {
 
       // The last cell we rendered may be at a new index. Bail if we don't know
       // where it is.
-      if (focusedCellIndex >= itemCount || this._keyExtractor(props.getItem(props.data, focusedCellIndex), focusedCellIndex, props) !== this._lastFocusedCellKey) {
+      if (focusedCellIndex >= itemCount || VirtualizedList._getItemKey(props, focusedCellIndex) !== this._lastFocusedCellKey) {
         return [];
       }
       var first = focusedCellIndex;
@@ -692,9 +695,15 @@ class VirtualizedList extends StateSafePureComponent {
       }
     }
     var initialRenderRegion = VirtualizedList._initialRenderRegion(_props);
+    var minIndexForVisible = (_this$props$maintainV = (_this$props$maintainV2 = this.props.maintainVisibleContentPosition) == null ? void 0 : _this$props$maintainV2.minIndexForVisible) !== null && _this$props$maintainV !== void 0 ? _this$props$maintainV : 0;
     this.state = {
       cellsAroundViewport: initialRenderRegion,
-      renderMask: VirtualizedList._createRenderMask(_props, initialRenderRegion)
+      renderMask: VirtualizedList._createRenderMask(_props, initialRenderRegion),
+      firstVisibleItemKey: this.props.getItemCount(this.props.data) > minIndexForVisible ? VirtualizedList._getItemKey(this.props, minIndexForVisible) : null,
+      // When we have a non-zero initialScrollIndex, we will receive a
+      // scroll event later so this will prevent the window from updating
+      // until we get a valid offset.
+      pendingScrollUpdateCount: this.props.initialScrollIndex != null && this.props.initialScrollIndex > 0 ? 1 : 0
     };
 
     // REACT-NATIVE-WEB patch to preserve during future RN merges: Support inverted wheel scroller.
@@ -750,6 +759,26 @@ class VirtualizedList extends StateSafePureComponent {
       }
     }
   }
+  static _findItemIndexWithKey(props, key, hint) {
+    var itemCount = props.getItemCount(props.data);
+    if (hint != null && hint >= 0 && hint < itemCount) {
+      var curKey = VirtualizedList._getItemKey(props, hint);
+      if (curKey === key) {
+        return hint;
+      }
+    }
+    for (var ii = 0; ii < itemCount; ii++) {
+      var _curKey = VirtualizedList._getItemKey(props, ii);
+      if (_curKey === key) {
+        return ii;
+      }
+    }
+    return null;
+  }
+  static _getItemKey(props, index) {
+    var item = props.getItem(props.data, index);
+    return VirtualizedList._keyExtractor(item, index, props);
+  }
   static _createRenderMask(props, cellsAroundViewport, additionalRegions) {
     var itemCount = props.getItemCount(props.data);
     invariant(cellsAroundViewport.first >= 0 && cellsAroundViewport.last >= cellsAroundViewport.first - 1 && cellsAroundViewport.last < itemCount, "Invalid cells around viewport \"[" + cellsAroundViewport.first + ", " + cellsAroundViewport.last + "]\" was passed to VirtualizedList._createRenderMask");
@@ -798,7 +827,7 @@ class VirtualizedList extends StateSafePureComponent {
       }
     }
   }
-  _adjustCellsAroundViewport(props, cellsAroundViewport) {
+  _adjustCellsAroundViewport(props, cellsAroundViewport, pendingScrollUpdateCount) {
     var data = props.data,
       getItemCount = props.getItemCount;
     var onEndReachedThreshold = onEndReachedThresholdOrDefault(props.onEndReachedThreshold);
@@ -821,17 +850,9 @@ class VirtualizedList extends StateSafePureComponent {
         last: Math.min(cellsAroundViewport.last + renderAhead, getItemCount(data) - 1)
       };
     } else {
-      // If we have a non-zero initialScrollIndex and run this before we've scrolled,
-      // we'll wipe out the initialNumToRender rendered elements starting at initialScrollIndex.
-      // So let's wait until we've scrolled the view to the right place. And until then,
-      // we will trust the initialScrollIndex suggestion.
-
-      // Thus, we want to recalculate the windowed render limits if any of the following hold:
-      // - initialScrollIndex is undefined or is 0
-      // - initialScrollIndex > 0 AND scrolling is complete
-      // - initialScrollIndex > 0 AND the end of the list is visible (this handles the case
-      //   where the list is shorter than the visible area)
-      if (props.initialScrollIndex && !this._scrollMetrics.offset && Math.abs(distanceFromEnd) >= Number.EPSILON) {
+      // If we have a pending scroll update, we should not adjust the render window as it
+      // might override the correct window.
+      if (pendingScrollUpdateCount > 0) {
         return cellsAroundViewport.last >= getItemCount(data) ? VirtualizedList._constrainToItemCount(cellsAroundViewport, props) : cellsAroundViewport;
       }
       newCellsAroundViewport = computeWindowedRenderLimits(props, maxToRenderPerBatchOrDefault(props.maxToRenderPerBatch), windowSizeOrDefault(props.windowSize), cellsAroundViewport, this.__getFrameMetricsApprox, this._scrollMetrics);
@@ -904,16 +925,36 @@ class VirtualizedList extends StateSafePureComponent {
     }
   }
   static getDerivedStateFromProps(newProps, prevState) {
+    var _newProps$maintainVis, _newProps$maintainVis2;
     // first and last could be stale (e.g. if a new, shorter items props is passed in), so we make
     // sure we're rendering a reasonable range here.
     var itemCount = newProps.getItemCount(newProps.data);
     if (itemCount === prevState.renderMask.numCells()) {
       return prevState;
     }
-    var constrainedCells = VirtualizedList._constrainToItemCount(prevState.cellsAroundViewport, newProps);
+    var maintainVisibleContentPositionAdjustment = null;
+    var prevFirstVisibleItemKey = prevState.firstVisibleItemKey;
+    var minIndexForVisible = (_newProps$maintainVis = (_newProps$maintainVis2 = newProps.maintainVisibleContentPosition) == null ? void 0 : _newProps$maintainVis2.minIndexForVisible) !== null && _newProps$maintainVis !== void 0 ? _newProps$maintainVis : 0;
+    var newFirstVisibleItemKey = newProps.getItemCount(newProps.data) > minIndexForVisible ? VirtualizedList._getItemKey(newProps, minIndexForVisible) : null;
+    if (newProps.maintainVisibleContentPosition != null && prevFirstVisibleItemKey != null && newFirstVisibleItemKey != null) {
+      if (newFirstVisibleItemKey !== prevFirstVisibleItemKey) {
+        // Fast path if items were added at the start of the list.
+        var hint = itemCount - prevState.renderMask.numCells() + minIndexForVisible;
+        var firstVisibleItemIndex = VirtualizedList._findItemIndexWithKey(newProps, prevFirstVisibleItemKey, hint);
+        maintainVisibleContentPositionAdjustment = firstVisibleItemIndex != null ? firstVisibleItemIndex - minIndexForVisible : null;
+      } else {
+        maintainVisibleContentPositionAdjustment = null;
+      }
+    }
+    var constrainedCells = VirtualizedList._constrainToItemCount(maintainVisibleContentPositionAdjustment != null ? {
+      first: prevState.cellsAroundViewport.first + maintainVisibleContentPositionAdjustment,
+      last: prevState.cellsAroundViewport.last + maintainVisibleContentPositionAdjustment
+    } : prevState.cellsAroundViewport, newProps);
     return {
       cellsAroundViewport: constrainedCells,
-      renderMask: VirtualizedList._createRenderMask(newProps, constrainedCells)
+      renderMask: VirtualizedList._createRenderMask(newProps, constrainedCells),
+      firstVisibleItemKey: newFirstVisibleItemKey,
+      pendingScrollUpdateCount: maintainVisibleContentPositionAdjustment != null ? prevState.pendingScrollUpdateCount + 1 : prevState.pendingScrollUpdateCount
     };
   }
   _pushCells(cells, stickyHeaderIndices, stickyIndicesFromProps, first, last, inversionStyle) {
@@ -936,7 +977,7 @@ class VirtualizedList extends StateSafePureComponent {
     last = Math.min(end, last);
     var _loop = function _loop() {
       var item = getItem(data, ii);
-      var key = _this._keyExtractor(item, ii, _this.props);
+      var key = VirtualizedList._keyExtractor(item, ii, _this.props);
       _this._indicesToKeys.set(ii, key);
       if (stickyIndicesFromProps.has(ii + stickyOffset)) {
         stickyHeaderIndices.push(cells.length);
@@ -971,20 +1012,23 @@ class VirtualizedList extends StateSafePureComponent {
   }
   static _constrainToItemCount(cells, props) {
     var itemCount = props.getItemCount(props.data);
-    var last = Math.min(itemCount - 1, cells.last);
+    var lastPossibleCellIndex = itemCount - 1;
+
+    // Constraining `last` may significantly shrink the window. Adjust `first`
+    // to expand the window if the new `last` results in a new window smaller
+    // than the number of cells rendered per batch.
     var maxToRenderPerBatch = maxToRenderPerBatchOrDefault(props.maxToRenderPerBatch);
+    var maxFirst = Math.max(0, lastPossibleCellIndex - maxToRenderPerBatch);
     return {
-      first: clamp(0, itemCount - 1 - maxToRenderPerBatch, cells.first),
-      last
+      first: clamp(0, cells.first, maxFirst),
+      last: Math.min(lastPossibleCellIndex, cells.last)
     };
   }
   _isNestedWithSameOrientation() {
     var nestedContext = this.context;
     return !!(nestedContext && !!nestedContext.horizontal === horizontalOrDefault(this.props.horizontal));
   }
-  _keyExtractor(item, index, props
-  // $FlowFixMe[missing-local-annot]
-  ) {
+  static _keyExtractor(item, index, props) {
     if (props.keyExtractor != null) {
       return props.keyExtractor(item, index);
     }
@@ -1024,7 +1068,12 @@ class VirtualizedList extends StateSafePureComponent {
       cells.push(/*#__PURE__*/React.createElement(VirtualizedListCellContextProvider, {
         cellKey: this._getCellKey() + '-header',
         key: "$header"
-      }, /*#__PURE__*/React.createElement(View, {
+      }, /*#__PURE__*/React.createElement(View
+      // We expect that header component will be a single native view so make it
+      // not collapsable to avoid this view being flattened and make this assumption
+      // no longer true.
+      , {
+        collapsable: false,
         onLayout: this._onLayoutHeader,
         style: [inversionStyle, this.props.ListHeaderComponentStyle]
       },
@@ -1126,7 +1175,11 @@ class VirtualizedList extends StateSafePureComponent {
       // TODO: Android support
       invertStickyHeaders: this.props.invertStickyHeaders !== undefined ? this.props.invertStickyHeaders : this.props.inverted,
       stickyHeaderIndices,
-      style: inversionStyle ? [inversionStyle, this.props.style] : this.props.style
+      style: inversionStyle ? [inversionStyle, this.props.style] : this.props.style,
+      maintainVisibleContentPosition: this.props.maintainVisibleContentPosition != null ? _objectSpread(_objectSpread({}, this.props.maintainVisibleContentPosition), {}, {
+        // Adjust index to account for ListHeaderComponent.
+        minIndexForVisible: this.props.maintainVisibleContentPosition.minIndexForVisible + (this.props.ListHeaderComponent ? 1 : 0)
+      }) : undefined
     });
     this._hasMore = this.state.cellsAroundViewport.last < itemCount - 1;
     var innerRet = /*#__PURE__*/React.createElement(VirtualizedListContextProvider, {
@@ -1319,8 +1372,12 @@ class VirtualizedList extends StateSafePureComponent {
       onStartReached = _this$props8.onStartReached,
       onStartReachedThreshold = _this$props8.onStartReachedThreshold,
       onEndReached = _this$props8.onEndReached,
-      onEndReachedThreshold = _this$props8.onEndReachedThreshold,
-      initialScrollIndex = _this$props8.initialScrollIndex;
+      onEndReachedThreshold = _this$props8.onEndReachedThreshold;
+    // If we have any pending scroll updates it means that the scroll metrics
+    // are out of date and we should not call any of the edge reached callbacks.
+    if (this.state.pendingScrollUpdateCount > 0) {
+      return;
+    }
     var _this$_scrollMetrics2 = this._scrollMetrics,
       contentLength = _this$_scrollMetrics2.contentLength,
       visibleLength = _this$_scrollMetrics2.visibleLength,
@@ -1360,16 +1417,10 @@ class VirtualizedList extends StateSafePureComponent {
     // and call onStartReached only once for a given content length,
     // and only if onEndReached is not being executed
     else if (onStartReached != null && this.state.cellsAroundViewport.first === 0 && isWithinStartThreshold && this._scrollMetrics.contentLength !== this._sentStartForContentLength) {
-      // On initial mount when using initialScrollIndex the offset will be 0 initially
-      // and will trigger an unexpected onStartReached. To avoid this we can use
-      // timestamp to differentiate between the initial scroll metrics and when we actually
-      // received the first scroll event.
-      if (!initialScrollIndex || this._scrollMetrics.timestamp !== 0) {
-        this._sentStartForContentLength = this._scrollMetrics.contentLength;
-        onStartReached({
-          distanceFromStart
-        });
-      }
+      this._sentStartForContentLength = this._scrollMetrics.contentLength;
+      onStartReached({
+        distanceFromStart
+      });
     }
 
     // If the user scrolls away from the start or end and back again,
@@ -1435,6 +1486,11 @@ class VirtualizedList extends StateSafePureComponent {
    */
 
   _updateViewableItems(props, cellsAroundViewport) {
+    // If we have any pending scroll updates it means that the scroll metrics
+    // are out of date and we should not call any of the visibility callbacks.
+    if (this.state.pendingScrollUpdateCount > 0) {
+      return;
+    }
     this._viewabilityTuples.forEach(tuple => {
       tuple.viewabilityHelper.onUpdate(props, this._scrollMetrics.offset, this._scrollMetrics.visibleLength, this._getFrameMetrics, this._createViewToken, tuple.onViewableItemsChanged, cellsAroundViewport);
     });
diff --git a/node_modules/react-native-web/src/vendor/react-native/VirtualizedList/index.js b/node_modules/react-native-web/src/vendor/react-native/VirtualizedList/index.js
index c7d68bb..459f017 100644
--- a/node_modules/react-native-web/src/vendor/react-native/VirtualizedList/index.js
+++ b/node_modules/react-native-web/src/vendor/react-native/VirtualizedList/index.js
@@ -75,6 +75,10 @@ type ViewabilityHelperCallbackTuple = {
 type State = {
   renderMask: CellRenderMask,
   cellsAroundViewport: {first: number, last: number},
+  // Used to track items added at the start of the list for maintainVisibleContentPosition.
+  firstVisibleItemKey: ?string,
+  // When > 0 the scroll position available in JS is considered stale and should not be used.
+  pendingScrollUpdateCount: number,
 };
 
 /**
@@ -447,9 +451,24 @@ class VirtualizedList extends StateSafePureComponent<Props, State> {
 
     const initialRenderRegion = VirtualizedList._initialRenderRegion(props);
 
+    const minIndexForVisible =
+      this.props.maintainVisibleContentPosition?.minIndexForVisible ?? 0;
+
     this.state = {
       cellsAroundViewport: initialRenderRegion,
       renderMask: VirtualizedList._createRenderMask(props, initialRenderRegion),
+      firstVisibleItemKey:
+        this.props.getItemCount(this.props.data) > minIndexForVisible
+          ? VirtualizedList._getItemKey(this.props, minIndexForVisible)
+          : null,
+      // When we have a non-zero initialScrollIndex, we will receive a
+      // scroll event later so this will prevent the window from updating
+      // until we get a valid offset.
+      pendingScrollUpdateCount:
+        this.props.initialScrollIndex != null &&
+        this.props.initialScrollIndex > 0
+          ? 1
+          : 0,
     };
 
       // REACT-NATIVE-WEB patch to preserve during future RN merges: Support inverted wheel scroller.
@@ -534,6 +553,40 @@ class VirtualizedList extends StateSafePureComponent<Props, State> {
     }
   }
 
+  static _findItemIndexWithKey(
+    props: Props,
+    key: string,
+    hint: ?number,
+  ): ?number {
+    const itemCount = props.getItemCount(props.data);
+    if (hint != null && hint >= 0 && hint < itemCount) {
+      const curKey = VirtualizedList._getItemKey(props, hint);
+      if (curKey === key) {
+        return hint;
+      }
+    }
+    for (let ii = 0; ii < itemCount; ii++) {
+      const curKey = VirtualizedList._getItemKey(props, ii);
+      if (curKey === key) {
+        return ii;
+      }
+    }
+    return null;
+  }
+
+  static _getItemKey(
+    props: {
+      data: Props['data'],
+      getItem: Props['getItem'],
+      keyExtractor: Props['keyExtractor'],
+      ...
+    },
+    index: number,
+  ): string {
+    const item = props.getItem(props.data, index);
+    return VirtualizedList._keyExtractor(item, index, props);
+  }
+
   static _createRenderMask(
     props: Props,
     cellsAroundViewport: {first: number, last: number},
@@ -617,6 +670,7 @@ class VirtualizedList extends StateSafePureComponent<Props, State> {
   _adjustCellsAroundViewport(
     props: Props,
     cellsAroundViewport: {first: number, last: number},
+    pendingScrollUpdateCount: number,
   ): {first: number, last: number} {
     const {data, getItemCount} = props;
     const onEndReachedThreshold = onEndReachedThresholdOrDefault(
@@ -648,21 +702,9 @@ class VirtualizedList extends StateSafePureComponent<Props, State> {
         ),
       };
     } else {
-      // If we have a non-zero initialScrollIndex and run this before we've scrolled,
-      // we'll wipe out the initialNumToRender rendered elements starting at initialScrollIndex.
-      // So let's wait until we've scrolled the view to the right place. And until then,
-      // we will trust the initialScrollIndex suggestion.
-
-      // Thus, we want to recalculate the windowed render limits if any of the following hold:
-      // - initialScrollIndex is undefined or is 0
-      // - initialScrollIndex > 0 AND scrolling is complete
-      // - initialScrollIndex > 0 AND the end of the list is visible (this handles the case
-      //   where the list is shorter than the visible area)
-      if (
-        props.initialScrollIndex &&
-        !this._scrollMetrics.offset &&
-        Math.abs(distanceFromEnd) >= Number.EPSILON
-      ) {
+      // If we have a pending scroll update, we should not adjust the render window as it
+      // might override the correct window.
+      if (pendingScrollUpdateCount > 0) {
         return cellsAroundViewport.last >= getItemCount(data)
           ? VirtualizedList._constrainToItemCount(cellsAroundViewport, props)
           : cellsAroundViewport;
@@ -771,14 +813,59 @@ class VirtualizedList extends StateSafePureComponent<Props, State> {
       return prevState;
     }
 
+    let maintainVisibleContentPositionAdjustment: ?number = null;
+    const prevFirstVisibleItemKey = prevState.firstVisibleItemKey;
+    const minIndexForVisible =
+      newProps.maintainVisibleContentPosition?.minIndexForVisible ?? 0;
+    const newFirstVisibleItemKey =
+      newProps.getItemCount(newProps.data) > minIndexForVisible
+        ? VirtualizedList._getItemKey(newProps, minIndexForVisible)
+        : null;
+    if (
+      newProps.maintainVisibleContentPosition != null &&
+      prevFirstVisibleItemKey != null &&
+      newFirstVisibleItemKey != null
+    ) {
+      if (newFirstVisibleItemKey !== prevFirstVisibleItemKey) {
+        // Fast path if items were added at the start of the list.
+        const hint =
+          itemCount - prevState.renderMask.numCells() + minIndexForVisible;
+        const firstVisibleItemIndex = VirtualizedList._findItemIndexWithKey(
+          newProps,
+          prevFirstVisibleItemKey,
+          hint,
+        );
+        maintainVisibleContentPositionAdjustment =
+          firstVisibleItemIndex != null
+            ? firstVisibleItemIndex - minIndexForVisible
+            : null;
+      } else {
+        maintainVisibleContentPositionAdjustment = null;
+      }
+    }
+
     const constrainedCells = VirtualizedList._constrainToItemCount(
-      prevState.cellsAroundViewport,
+      maintainVisibleContentPositionAdjustment != null
+        ? {
+            first:
+              prevState.cellsAroundViewport.first +
+              maintainVisibleContentPositionAdjustment,
+            last:
+              prevState.cellsAroundViewport.last +
+              maintainVisibleContentPositionAdjustment,
+          }
+        : prevState.cellsAroundViewport,
       newProps,
     );
 
     return {
       cellsAroundViewport: constrainedCells,
       renderMask: VirtualizedList._createRenderMask(newProps, constrainedCells),
+      firstVisibleItemKey: newFirstVisibleItemKey,
+      pendingScrollUpdateCount:
+        maintainVisibleContentPositionAdjustment != null
+          ? prevState.pendingScrollUpdateCount + 1
+          : prevState.pendingScrollUpdateCount,
     };
   }
 
@@ -810,7 +897,7 @@ class VirtualizedList extends StateSafePureComponent<Props, State> {
 
     for (let ii = first; ii <= last; ii++) {
       const item = getItem(data, ii);
-      const key = this._keyExtractor(item, ii, this.props);
+      const key = VirtualizedList._keyExtractor(item, ii, this.props);
 
       this._indicesToKeys.set(ii, key);
       if (stickyIndicesFromProps.has(ii + stickyOffset)) {
@@ -853,15 +940,19 @@ class VirtualizedList extends StateSafePureComponent<Props, State> {
     props: Props,
   ): {first: number, last: number} {
     const itemCount = props.getItemCount(props.data);
-    const last = Math.min(itemCount - 1, cells.last);
+    const lastPossibleCellIndex = itemCount - 1;
 
+    // Constraining `last` may significantly shrink the window. Adjust `first`
+    // to expand the window if the new `last` results in a new window smaller
+    // than the number of cells rendered per batch.
     const maxToRenderPerBatch = maxToRenderPerBatchOrDefault(
       props.maxToRenderPerBatch,
     );
+    const maxFirst = Math.max(0, lastPossibleCellIndex - maxToRenderPerBatch);
 
     return {
-      first: clamp(0, itemCount - 1 - maxToRenderPerBatch, cells.first),
-      last,
+      first: clamp(0, cells.first, maxFirst),
+      last: Math.min(lastPossibleCellIndex, cells.last),
     };
   }
 
@@ -883,15 +974,14 @@ class VirtualizedList extends StateSafePureComponent<Props, State> {
   _getSpacerKey = (isVertical: boolean): string =>
     isVertical ? 'height' : 'width';
 
-  _keyExtractor(
+  static _keyExtractor(
     item: Item,
     index: number,
     props: {
       keyExtractor?: ?(item: Item, index: number) => string,
       ...
     },
-    // $FlowFixMe[missing-local-annot]
-  ) {
+  ): string {
     if (props.keyExtractor != null) {
       return props.keyExtractor(item, index);
     }
@@ -937,6 +1027,10 @@ class VirtualizedList extends StateSafePureComponent<Props, State> {
           cellKey={this._getCellKey() + '-header'}
           key="$header">
           <View
+            // We expect that header component will be a single native view so make it
+            // not collapsable to avoid this view being flattened and make this assumption
+            // no longer true.
+            collapsable={false}
             onLayout={this._onLayoutHeader}
             style={[
               inversionStyle,
@@ -1094,6 +1188,16 @@ class VirtualizedList extends StateSafePureComponent<Props, State> {
       style: inversionStyle
         ? [inversionStyle, this.props.style]
         : this.props.style,
+      maintainVisibleContentPosition:
+        this.props.maintainVisibleContentPosition != null
+          ? {
+              ...this.props.maintainVisibleContentPosition,
+              // Adjust index to account for ListHeaderComponent.
+              minIndexForVisible:
+                this.props.maintainVisibleContentPosition.minIndexForVisible +
+                (this.props.ListHeaderComponent ? 1 : 0),
+            }
+          : undefined,
     };
 
     this._hasMore = this.state.cellsAroundViewport.last < itemCount - 1;
@@ -1516,8 +1620,12 @@ class VirtualizedList extends StateSafePureComponent<Props, State> {
       onStartReachedThreshold,
       onEndReached,
       onEndReachedThreshold,
-      initialScrollIndex,
     } = this.props;
+    // If we have any pending scroll updates it means that the scroll metrics
+    // are out of date and we should not call any of the edge reached callbacks.
+    if (this.state.pendingScrollUpdateCount > 0) {
+      return;
+    }
     const {contentLength, visibleLength, offset} = this._scrollMetrics;
     let distanceFromStart = offset;
     let distanceFromEnd = contentLength - visibleLength - offset;
@@ -1569,14 +1677,8 @@ class VirtualizedList extends StateSafePureComponent<Props, State> {
       isWithinStartThreshold &&
       this._scrollMetrics.contentLength !== this._sentStartForContentLength
     ) {
-      // On initial mount when using initialScrollIndex the offset will be 0 initially
-      // and will trigger an unexpected onStartReached. To avoid this we can use
-      // timestamp to differentiate between the initial scroll metrics and when we actually
-      // received the first scroll event.
-      if (!initialScrollIndex || this._scrollMetrics.timestamp !== 0) {
-        this._sentStartForContentLength = this._scrollMetrics.contentLength;
-        onStartReached({distanceFromStart});
-      }
+      this._sentStartForContentLength = this._scrollMetrics.contentLength;
+      onStartReached({distanceFromStart});
     }
 
     // If the user scrolls away from the start or end and back again,
@@ -1703,6 +1805,11 @@ class VirtualizedList extends StateSafePureComponent<Props, State> {
       visibleLength,
       zoomScale,
     };
+    if (this.state.pendingScrollUpdateCount > 0) {
+      this.setState(state => ({
+        pendingScrollUpdateCount: state.pendingScrollUpdateCount - 1,
+      }));
+    }
     this._updateViewableItems(this.props, this.state.cellsAroundViewport);
     if (!this.props) {
       return;
@@ -1818,6 +1925,7 @@ class VirtualizedList extends StateSafePureComponent<Props, State> {
       const cellsAroundViewport = this._adjustCellsAroundViewport(
         props,
         state.cellsAroundViewport,
+        state.pendingScrollUpdateCount,
       );
       const renderMask = VirtualizedList._createRenderMask(
         props,
@@ -1848,7 +1956,7 @@ class VirtualizedList extends StateSafePureComponent<Props, State> {
     return {
       index,
       item,
-      key: this._keyExtractor(item, index, props),
+      key: VirtualizedList._keyExtractor(item, index, props),
       isViewable,
     };
   };
@@ -1909,13 +2017,12 @@ class VirtualizedList extends StateSafePureComponent<Props, State> {
     inLayout?: boolean,
     ...
   } => {
-    const {data, getItem, getItemCount, getItemLayout} = props;
+    const {data, getItemCount, getItemLayout} = props;
     invariant(
       index >= 0 && index < getItemCount(data),
       'Tried to get frame for out of range index ' + index,
     );
-    const item = getItem(data, index);
-    const frame = this._frames[this._keyExtractor(item, index, props)];
+    const frame = this._frames[VirtualizedList._getItemKey(props, index)];
     if (!frame || frame.index !== index) {
       if (getItemLayout) {
         /* $FlowFixMe[prop-missing] (>=0.63.0 site=react_native_fb) This comment
@@ -1950,11 +2057,8 @@ class VirtualizedList extends StateSafePureComponent<Props, State> {
     // where it is.
     if (
       focusedCellIndex >= itemCount ||
-      this._keyExtractor(
-        props.getItem(props.data, focusedCellIndex),
-        focusedCellIndex,
-        props,
-      ) !== this._lastFocusedCellKey
+      VirtualizedList._getItemKey(props, focusedCellIndex) !==
+        this._lastFocusedCellKey
     ) {
       return [];
     }
@@ -1995,6 +2099,11 @@ class VirtualizedList extends StateSafePureComponent<Props, State> {
     props: FrameMetricProps,
     cellsAroundViewport: {first: number, last: number},
   ) {
+    // If we have any pending scroll updates it means that the scroll metrics
+    // are out of date and we should not call any of the visibility callbacks.
+    if (this.state.pendingScrollUpdateCount > 0) {
+      return;
+    }
     this._viewabilityTuples.forEach(tuple => {
       tuple.viewabilityHelper.onUpdate(
         props,