react-native-windows 0.67.0 → 0.68.0-preview.3

package/Libraries/Lists/VirtualizedList.js

@@ -1,5 +1,5 @@
 /**
- * Copyright (c) Facebook, Inc. and its affiliates.
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
@@ -349,8 +349,8 @@ function windowSizeOrDefault(windowSize: ?number) {
 }
 
 /**
- * Base implementation for the more convenient [`<FlatList>`](https://reactnative.dev/docs/flatlist.html)
- * and [`<SectionList>`](https://reactnative.dev/docs/sectionlist.html) components, which are also better
+ * Base implementation for the more convenient [`<FlatList>`](https://reactnative.dev/docs/flatlist)
+ * and [`<SectionList>`](https://reactnative.dev/docs/sectionlist) components, which are also better
  * documented. In general, this should only really be used if you need more flexibility than
  * `FlatList` provides, e.g. for use with immutable data instead of plain arrays.
  *
@@ -441,9 +441,9 @@ class VirtualizedList extends React.PureComponent<Props, State> {
     );
     invariant(
       index < getItemCount(data),
-      `scrollToIndex out of range: requested index ${index} is out of 0 to ${getItemCount(
-        data,
-      ) - 1}`,
+      `scrollToIndex out of range: requested index ${index} is out of 0 to ${
+        getItemCount(data) - 1
+      }`,
     );
     if (!getItemLayout && index > this._highestMeasuredFrameIndex) {
       invariant(
@@ -703,12 +703,14 @@ class VirtualizedList extends React.PureComponent<Props, State> {
           onViewableItemsChanged: pair.onViewableItemsChanged,
         }),
       );
-    } else if (this.props.onViewableItemsChanged) {
-      this._viewabilityTuples.push({
-        viewabilityHelper: new ViewabilityHelper(this.props.viewabilityConfig),
-        // $FlowFixMe[incompatible-call]
-        onViewableItemsChanged: this.props.onViewableItemsChanged,
-      });
+    } else {
+      const {onViewableItemsChanged, viewabilityConfig} = this.props;
+      if (onViewableItemsChanged) {
+        this._viewabilityTuples.push({
+          viewabilityHelper: new ViewabilityHelper(viewabilityConfig),
+          onViewableItemsChanged: onViewableItemsChanged,
+        });
+      }
     }
 
     let initialState = {
@@ -882,11 +884,8 @@ class VirtualizedList extends React.PureComponent<Props, State> {
         );
       }
     }
-    const {
-      ListEmptyComponent,
-      ListFooterComponent,
-      ListHeaderComponent,
-    } = this.props;
+    const {ListEmptyComponent, ListFooterComponent, ListHeaderComponent} =
+      this.props;
     const {data, horizontal} = this.props;
     const isVirtualizationDisabled = this._isVirtualizationDisabled();
     const inversionStyle = this.props.inverted
@@ -1496,12 +1495,8 @@ class VirtualizedList extends React.PureComponent<Props, State> {
   }
 
   _maybeCallOnEndReached() {
-    const {
-      data,
-      getItemCount,
-      onEndReached,
-      onEndReachedThreshold,
-    } = this.props;
+    const {data, getItemCount, onEndReached, onEndReachedThreshold} =
+      this.props;
     const {contentLength, visibleLength, offset} = this._scrollMetrics;
     const distanceFromEnd = contentLength - visibleLength - offset;
     const threshold =
@@ -1588,15 +1583,11 @@ class VirtualizedList extends React.PureComponent<Props, State> {
         // know our offset from our offset from our parent
         return;
       }
-      ({
-        visibleLength,
-        contentLength,
-        offset,
-        dOffset,
-      } = this._convertParentScrollMetrics({
-        visibleLength,
-        offset,
-      }));
+      ({visibleLength, contentLength, offset, dOffset} =
+        this._convertParentScrollMetrics({
+          visibleLength,
+          offset,
+        }));
     }
 
     const dt = this._scrollMetrics.timestamp
@@ -1802,7 +1793,6 @@ class VirtualizedList extends React.PureComponent<Props, State> {
             }
           }
           if (someChildHasMore) {
-            // $FlowFixMe[incompatible-use]
             newState.last = ii;
             break;
           }

package/Libraries/Lists/VirtualizedListContext.js

@@ -1,5 +1,5 @@
 /**
- * Copyright (c) Facebook, Inc. and its affiliates.
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
@@ -64,9 +64,8 @@ type Context = $ReadOnly<{
   debugInfo: ListDebugInfo,
 }>;
 
-export const VirtualizedListContext: React.Context<?Context> = React.createContext(
-  null,
-);
+export const VirtualizedListContext: React.Context<?Context> =
+  React.createContext(null);
 if (__DEV__) {
   VirtualizedListContext.displayName = 'VirtualizedListContext';
 }

package/Libraries/Lists/VirtualizedSectionList.js

@@ -1,5 +1,5 @@
 /**
- * Copyright (c) Facebook, Inc. and its affiliates.
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
@@ -240,9 +240,7 @@ class VirtualizedSectionList<
     return (info && info.key) || String(index);
   };
 
-  _subExtractor(
-    index: number,
-  ): ?{
+  _subExtractor(index: number): ?{
     section: SectionT,
     // Key of the section or combined key for section + item
     key: string,
@@ -339,63 +337,58 @@ class VirtualizedSectionList<
     }
   };
 
-  _renderItem = (listItemCount: number) => ({
-    item,
-    index,
-  }: {
-    item: Item,
-    index: number,
-    ...
-  }) => {
-    const info = this._subExtractor(index);
-    if (!info) {
-      return null;
-    }
-    const infoIndex = info.index;
-    if (infoIndex == null) {
-      const {section} = info;
-      if (info.header === true) {
-        const {renderSectionHeader} = this.props;
-        return renderSectionHeader ? renderSectionHeader({section}) : null;
+  _renderItem =
+    (listItemCount: number) =>
+    ({item, index}: {item: Item, index: number, ...}) => {
+      const info = this._subExtractor(index);
+      if (!info) {
+        return null;
+      }
+      const infoIndex = info.index;
+      if (infoIndex == null) {
+        const {section} = info;
+        if (info.header === true) {
+          const {renderSectionHeader} = this.props;
+          return renderSectionHeader ? renderSectionHeader({section}) : null;
+        } else {
+          const {renderSectionFooter} = this.props;
+          return renderSectionFooter ? renderSectionFooter({section}) : null;
+        }
       } else {
-        const {renderSectionFooter} = this.props;
-        return renderSectionFooter ? renderSectionFooter({section}) : null;
+        const renderItem = info.section.renderItem || this.props.renderItem;
+        const SeparatorComponent = this._getSeparatorComponent(
+          index,
+          info,
+          listItemCount,
+        );
+        invariant(renderItem, 'no renderItem!');
+        return (
+          <ItemWithSeparator
+            SeparatorComponent={SeparatorComponent}
+            LeadingSeparatorComponent={
+              infoIndex === 0 ? this.props.SectionSeparatorComponent : undefined
+            }
+            cellKey={info.key}
+            index={infoIndex}
+            item={item}
+            leadingItem={info.leadingItem}
+            leadingSection={info.leadingSection}
+            prevCellKey={(this._subExtractor(index - 1) || {}).key}
+            // Callback to provide updateHighlight for this item
+            setSelfHighlightCallback={this._setUpdateHighlightFor}
+            setSelfUpdatePropsCallback={this._setUpdatePropsFor}
+            // Provide child ability to set highlight/updateProps for previous item using prevCellKey
+            updateHighlightFor={this._updateHighlightFor}
+            updatePropsFor={this._updatePropsFor}
+            renderItem={renderItem}
+            section={info.section}
+            trailingItem={info.trailingItem}
+            trailingSection={info.trailingSection}
+            inverted={!!this.props.inverted}
+          />
+        );
       }
-    } else {
-      const renderItem = info.section.renderItem || this.props.renderItem;
-      const SeparatorComponent = this._getSeparatorComponent(
-        index,
-        info,
-        listItemCount,
-      );
-      invariant(renderItem, 'no renderItem!');
-      return (
-        <ItemWithSeparator
-          SeparatorComponent={SeparatorComponent}
-          LeadingSeparatorComponent={
-            infoIndex === 0 ? this.props.SectionSeparatorComponent : undefined
-          }
-          cellKey={info.key}
-          index={infoIndex}
-          item={item}
-          leadingItem={info.leadingItem}
-          leadingSection={info.leadingSection}
-          prevCellKey={(this._subExtractor(index - 1) || {}).key}
-          // Callback to provide updateHighlight for this item
-          setSelfHighlightCallback={this._setUpdateHighlightFor}
-          setSelfUpdatePropsCallback={this._setUpdatePropsFor}
-          // Provide child ability to set highlight/updateProps for previous item using prevCellKey
-          updateHighlightFor={this._updateHighlightFor}
-          updatePropsFor={this._updatePropsFor}
-          renderItem={renderItem}
-          section={info.section}
-          trailingItem={info.trailingItem}
-          trailingSection={info.trailingSection}
-          inverted={!!this.props.inverted}
-        />
-      );
-    }
-  };
+    };
 
   _updatePropsFor = (cellKey, value) => {
     const updateProps = this._updatePropsMap[cellKey];
@@ -506,10 +499,8 @@ function ItemWithSeparator(props: ItemWithSeparatorProps): React.Node {
     inverted,
   } = props;
 
-  const [
-    leadingSeparatorHiglighted,
-    setLeadingSeparatorHighlighted,
-  ] = React.useState(false);
+  const [leadingSeparatorHiglighted, setLeadingSeparatorHighlighted] =
+    React.useState(false);
 
   const [separatorHighlighted, setSeparatorHighlighted] = React.useState(false);
 

package/Libraries/Lists/__flowtests__/FlatList-flowtest.js

@@ -1,5 +1,5 @@
 /**
- * Copyright (c) Facebook, Inc. and its affiliates.
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

package/Libraries/Lists/__flowtests__/SectionList-flowtest.js

@@ -1,5 +1,5 @@
 /**
- * Copyright (c) Facebook, Inc. and its affiliates.
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

package/Libraries/Lists/__tests__/CellRenderMask-test.js

@@ -1,5 +1,5 @@
 /**
- * Copyright (c) Facebook, Inc. and its affiliates.
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

package/Libraries/Lists/__tests__/{FillRateHelper-test.js → FillRateHelper-test.windows.js}

@@ -1,5 +1,5 @@
 /**
- * Copyright (c) Facebook, Inc. and its affiliates.
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
@@ -31,7 +31,7 @@ function computeResult({helper, props, state, scroll}): number {
   return helper.computeBlankness(
     {
       data: dataGlobal,
-      getItemCount: data2 => data2.length,
+      getItemCount: (data2) => data2.length,
       initialNumToRender: 10,
       ...(props || {}),
     },
@@ -40,13 +40,13 @@ function computeResult({helper, props, state, scroll}): number {
   );
 }
 
-describe('computeBlankness', function() {
+describe('computeBlankness', function () {
   beforeEach(() => {
     FillRateHelper.setSampleRate(1);
     FillRateHelper.setMinSampleCount(0);
   });
 
-  it('computes correct blankness of viewport', function() {
+  it('computes correct blankness of viewport', function () {
     const helper = new FillRateHelper(getFrameMetrics);
     rowFramesGlobal = {
       header: {y: 0, height: 0, inLayout: true},
@@ -65,7 +65,7 @@ describe('computeBlankness', function() {
     expect(blankness).toBe(1);
   });
 
-  it('skips frames that are not in layout', function() {
+  it('skips frames that are not in layout', function () {
     const helper = new FillRateHelper(getFrameMetrics);
     rowFramesGlobal = {
       header: {y: 0, height: 0, inLayout: false},
@@ -79,7 +79,7 @@ describe('computeBlankness', function() {
     expect(blankness).toBe(0.3);
   });
 
-  it('sampling rate can disable', function() {
+  it('sampling rate can disable', function () {
     let helper = new FillRateHelper(getFrameMetrics);
     rowFramesGlobal = {
       header: {y: 0, height: 0, inLayout: true},
@@ -96,9 +96,9 @@ describe('computeBlankness', function() {
     expect(blankness).toBe(0);
   });
 
-  it('can handle multiple listeners and unsubscribe', function() {
+  it('can handle multiple listeners and unsubscribe', function () {
     const listeners = [jest.fn(), jest.fn(), jest.fn()];
-    const subscriptions = listeners.map(listener =>
+    const subscriptions = listeners.map((listener) =>
       FillRateHelper.addListener(listener),
     );
     subscriptions[1].remove();

package/Libraries/Lists/__tests__/{FlatList-test.js → FlatList-test.windows.js}

@@ -1,5 +1,5 @@
 /**
- * Copyright (c) Facebook, Inc. and its affiliates.
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
@@ -102,13 +102,13 @@ describe('FlatList', () => {
     ReactTestRenderer.create(
       <FlatList
         data={[{key: 'outer0'}, {key: 'outer1'}]}
-        renderItem={outerInfo => (
+        renderItem={(outerInfo) => (
           <FlatList
             data={[
               {key: outerInfo.item.key + ':inner0'},
               {key: outerInfo.item.key + ':inner1'},
             ]}
-            renderItem={innerInfo => {
+            renderItem={(innerInfo) => {
               return <item title={innerInfo.item.key} />;
             }}
             ref={listRef}

package/Libraries/Lists/__tests__/{SectionList-test.js → SectionList-test.windows.js}

@@ -1,5 +1,5 @@
 /**
- * Copyright (c) Facebook, Inc. and its affiliates.
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
@@ -39,21 +39,21 @@ describe('SectionList', () => {
     const component = ReactTestRenderer.create(
       <SectionList
         initialNumToRender={Infinity}
-        ItemSeparatorComponent={props => (
+        ItemSeparatorComponent={(props) => (
           <defaultItemSeparator v={propStr(props)} />
         )}
-        ListEmptyComponent={props => <empty v={propStr(props)} />}
-        ListFooterComponent={props => <footer v={propStr(props)} />}
-        ListHeaderComponent={props => <header v={propStr(props)} />}
-        SectionSeparatorComponent={props => (
+        ListEmptyComponent={(props) => <empty v={propStr(props)} />}
+        ListFooterComponent={(props) => <footer v={propStr(props)} />}
+        ListHeaderComponent={(props) => <header v={propStr(props)} />}
+        SectionSeparatorComponent={(props) => (
           <sectionSeparator v={propStr(props)} />
         )}
         sections={[
           {
-            renderItem: props => <itemForSection1 v={propStr(props)} />,
+            renderItem: (props) => <itemForSection1 v={propStr(props)} />,
             key: 's1',
             keyExtractor: (item, index) => item.id,
-            ItemSeparatorComponent: props => (
+            ItemSeparatorComponent: (props) => (
               <itemSeparatorForSection1 v={propStr(props)} />
             ),
             data: [{id: 'i1s1'}, {id: 'i2s1'}],
@@ -69,9 +69,9 @@ describe('SectionList', () => {
         ]}
         refreshing={false}
         onRefresh={jest.fn()}
-        renderItem={props => <defaultItem v={propStr(props)} />}
-        renderSectionHeader={props => <sectionHeader v={propStr(props)} />}
-        renderSectionFooter={props => <sectionFooter v={propStr(props)} />}
+        renderItem={(props) => <defaultItem v={propStr(props)} />}
+        renderSectionHeader={(props) => <sectionHeader v={propStr(props)} />}
+        renderSectionFooter={(props) => <sectionFooter v={propStr(props)} />}
       />,
     );
     expect(component).toMatchSnapshot();
@@ -81,8 +81,8 @@ describe('SectionList', () => {
       <SectionList
         sections={[{key: 's1', data: []}]}
         renderItem={({item}) => <item v={item.key} />}
-        renderSectionHeader={props => <sectionHeader v={propStr(props)} />}
-        renderSectionFooter={props => <sectionFooter v={propStr(props)} />}
+        renderSectionHeader={(props) => <sectionHeader v={propStr(props)} />}
+        renderSectionFooter={(props) => <sectionFooter v={propStr(props)} />}
       />,
     );
     expect(component).toMatchSnapshot();
@@ -92,7 +92,7 @@ describe('SectionList', () => {
       <SectionList
         sections={[{key: 's1', data: []}]}
         renderItem={({item}) => <item v={item.key} />}
-        renderSectionFooter={props => <sectionFooter v={propStr(props)} />}
+        renderSectionFooter={(props) => <sectionFooter v={propStr(props)} />}
       />,
     );
     expect(component).toMatchSnapshot();
@@ -101,7 +101,7 @@ describe('SectionList', () => {
 
 function propStr(props) {
   return Object.keys(props)
-    .map(k => {
+    .map((k) => {
       const propObj = props[k] || {};
       return `${k}:${propObj.key || propObj.id || props[k]}`;
     })

package/Libraries/Lists/__tests__/ViewabilityHelper-test.js

@@ -1,5 +1,5 @@
 /**
- * Copyright (c) Facebook, Inc. and its affiliates.
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
@@ -22,8 +22,8 @@ function createViewToken(index: number, isViewable: boolean) {
   return {key: data[index].key, isViewable};
 }
 
-describe('computeViewableItems', function() {
-  it('returns all 4 entirely visible rows as viewable', function() {
+describe('computeViewableItems', function () {
+  it('returns all 4 entirely visible rows as viewable', function () {
     const helper = new ViewabilityHelper({
       viewAreaCoveragePercentThreshold: 50,
     });
@@ -39,7 +39,7 @@ describe('computeViewableItems', function() {
     ).toEqual([0, 1, 2, 3]);
   });
 
-  it('returns top 2 rows as viewable (1. entirely visible and 2. majority)', function() {
+  it('returns top 2 rows as viewable (1. entirely visible and 2. majority)', function () {
     const helper = new ViewabilityHelper({
       viewAreaCoveragePercentThreshold: 50,
     });
@@ -55,7 +55,7 @@ describe('computeViewableItems', function() {
     ).toEqual([0, 1]);
   });
 
-  it('returns only 2nd row as viewable (majority)', function() {
+  it('returns only 2nd row as viewable (majority)', function () {
     const helper = new ViewabilityHelper({
       viewAreaCoveragePercentThreshold: 50,
     });
@@ -71,7 +71,7 @@ describe('computeViewableItems', function() {
     ).toEqual([1]);
   });
 
-  it('handles empty input', function() {
+  it('handles empty input', function () {
     const helper = new ViewabilityHelper({
       viewAreaCoveragePercentThreshold: 50,
     });
@@ -82,7 +82,7 @@ describe('computeViewableItems', function() {
     ).toEqual([]);
   });
 
-  it('handles different view area coverage percent thresholds', function() {
+  it('handles different view area coverage percent thresholds', function () {
     rowFrames = {
       a: {y: 0, height: 50},
       b: {y: 50, height: 150},
@@ -128,7 +128,7 @@ describe('computeViewableItems', function() {
     ).toEqual([1, 2]);
   });
 
-  it('handles different item visible percent thresholds', function() {
+  it('handles different item visible percent thresholds', function () {
     rowFrames = {
       a: {y: 0, height: 50},
       b: {y: 50, height: 150},
@@ -165,8 +165,8 @@ describe('computeViewableItems', function() {
   });
 });
 
-describe('onUpdate', function() {
-  it('returns 1 visible row as viewable then scrolls away', function() {
+describe('onUpdate', function () {
+  it('returns 1 visible row as viewable then scrolls away', function () {
     const helper = new ViewabilityHelper();
     rowFrames = {
       a: {y: 0, height: 50},
@@ -212,7 +212,7 @@ describe('onUpdate', function() {
     });
   });
 
-  it('returns 1st visible row then 1st and 2nd then just 2nd', function() {
+  it('returns 1st visible row then 1st and 2nd then just 2nd', function () {
     const helper = new ViewabilityHelper();
     rowFrames = {
       a: {y: 0, height: 200},
@@ -268,7 +268,7 @@ describe('onUpdate', function() {
     });
   });
 
-  it('minimumViewTime delays callback', function() {
+  it('minimumViewTime delays callback', function () {
     const helper = new ViewabilityHelper({
       minimumViewTime: 350,
       viewAreaCoveragePercentThreshold: 0,
@@ -302,7 +302,7 @@ describe('onUpdate', function() {
     });
   });
 
-  it('minimumViewTime skips briefly visible items', function() {
+  it('minimumViewTime skips briefly visible items', function () {
     const helper = new ViewabilityHelper({
       minimumViewTime: 350,
       viewAreaCoveragePercentThreshold: 0,
@@ -343,7 +343,7 @@ describe('onUpdate', function() {
     });
   });
 
-  it('waitForInteraction blocks callback until interaction', function() {
+  it('waitForInteraction blocks callback until interaction', function () {
     const helper = new ViewabilityHelper({
       waitForInteraction: true,
       viewAreaCoveragePercentThreshold: 0,
@@ -385,7 +385,7 @@ describe('onUpdate', function() {
     });
   });
 
-  it('returns the right visible row after the underlying data changed', function() {
+  it('returns the right visible row after the underlying data changed', function () {
     const helper = new ViewabilityHelper();
     rowFrames = {
       a: {y: 0, height: 200},