@react-native-macos/virtualized-lists 0.79.0 → 0.81.0

package/Lists/ListMetricsAggregator.js

@@ -9,7 +9,7 @@
  */
 
 import type {VirtualizedListProps} from './VirtualizedListProps';
-import type {LayoutRectangle} from 'react-native/Libraries/Types/CoreEventTypes';
+import type {LayoutRectangle} from 'react-native';
 
 import {keyExtractor as defaultKeyExtractor} from './VirtualizeUtils';
 import invariant from 'invariant';

package/Lists/VirtualizeUtils.js

@@ -10,9 +10,8 @@
 
 'use strict';
 
-import type ListMetricsAggregator, {
-  CellMetricProps,
-} from './ListMetricsAggregator';
+import type ListMetricsAggregator from './ListMetricsAggregator';
+import type {CellMetricProps} from './ListMetricsAggregator';
 
 import * as ReactNativeFeatureFlags from 'react-native/src/private/featureflags/ReactNativeFeatureFlags';
 

package/Lists/VirtualizedList.d.ts

@@ -131,8 +131,8 @@ export class VirtualizedList<ItemT> extends React.Component<
   recordInteraction: () => void;
 
   getScrollRef: () =>
-    | React.ElementRef<typeof ScrollView>
-    | React.ElementRef<typeof View>
+    | React.ComponentRef<typeof ScrollView>
+    | React.ComponentRef<typeof View>
     | null;
 
   getScrollResponder: () => ScrollResponderMixin | null;

package/Lists/VirtualizedList.js

@@ -17,12 +17,13 @@ import type {
   Separators,
   VirtualizedListProps,
 } from './VirtualizedListProps';
-import type {ScrollResponderType} from 'react-native/Libraries/Components/ScrollView/ScrollView';
-import type {ViewStyleProp} from 'react-native/Libraries/StyleSheet/StyleSheet';
 import type {
   LayoutChangeEvent,
   ScrollEvent,
-} from 'react-native/Libraries/Types/CoreEventTypes';
+  ScrollResponderType,
+  StyleProp,
+  ViewStyle,
+} from 'react-native';
 import type {KeyEvent} from 'react-native/Libraries/Types/CoreEventTypes'; // [macOS]
 
 import clamp from '../Utilities/clamp';
@@ -54,6 +55,7 @@ import {
 import invariant from 'invariant';
 import nullthrows from 'nullthrows';
 import * as React from 'react';
+import {cloneElement, isValidElement} from 'react';
 import {
   I18nManager,
   Platform,
@@ -63,6 +65,7 @@ import {
   View,
   findNodeHandle,
 } from 'react-native';
+import * as ReactNativeFeatureFlags from 'react-native/src/private/featureflags/ReactNativeFeatureFlags';
 
 export type {ListRenderItemInfo, ListRenderItem, Separators};
 
@@ -340,7 +343,7 @@ class VirtualizedList extends StateSafePureComponent<
     if (this._scrollRef && this._scrollRef.getScrollableNode) {
       return this._scrollRef.getScrollableNode();
     } else {
-      return findNodeHandle(this._scrollRef);
+      return findNodeHandle<$FlowFixMe>(this._scrollRef);
     }
   }
 
@@ -800,7 +803,7 @@ class VirtualizedList extends StateSafePureComponent<
     stickyIndicesFromProps: Set<number>,
     first: number,
     last: number,
-    inversionStyle: ViewStyleProp,
+    inversionStyle: StyleProp<ViewStyle>,
   ) {
     const {
       CellRendererComponent,
@@ -928,6 +931,30 @@ class VirtualizedList extends StateSafePureComponent<
     return key;
   }
 
+  _renderEmptyComponent(
+    element: ExactReactElement_DEPRECATED<any>,
+    inversionStyle: StyleProp<ViewStyle>,
+  ): React.Node {
+    // $FlowFixMe[prop-missing] React.Element internal inspection
+    const isFragment = element.type === React.Fragment;
+
+    if (isFragment) {
+      return element;
+    }
+
+    return cloneElement(element, {
+      onLayout: (event: LayoutChangeEvent) => {
+        this._onLayoutEmpty(event);
+        // $FlowFixMe[prop-missing] React.Element internal inspection
+        if (element.props.onLayout) {
+          element.props.onLayout(event);
+        }
+      },
+      // $FlowFixMe[prop-missing] React.Element internal inspection
+      style: StyleSheet.compose(inversionStyle, element.props.style),
+    });
+  }
+
   render(): React.Node {
     this._checkProps(this.props);
     const {ListEmptyComponent, ListFooterComponent, ListHeaderComponent} =
@@ -949,7 +976,7 @@ class VirtualizedList extends StateSafePureComponent<
       if (stickyIndicesFromProps.has(0)) {
         stickyHeaderIndices.push(0);
       }
-      const element = React.isValidElement(ListHeaderComponent) ? (
+      const element = isValidElement(ListHeaderComponent) ? (
         ListHeaderComponent
       ) : (
         // $FlowFixMe[not-a-component]
@@ -982,7 +1009,7 @@ class VirtualizedList extends StateSafePureComponent<
     // 2a. Add a cell for ListEmptyComponent if applicable
     const itemCount = this.props.getItemCount(data);
     if (itemCount === 0 && ListEmptyComponent) {
-      const element: ExactReactElement_DEPRECATED<any> = ((React.isValidElement(
+      const element: ExactReactElement_DEPRECATED<any> = ((isValidElement(
         ListEmptyComponent,
       ) ? (
         ListEmptyComponent
@@ -997,17 +1024,7 @@ class VirtualizedList extends StateSafePureComponent<
           cellKey={this._getCellKey() + '-empty'}
           collapsable={Platform.OS !== 'macos'} // [macOS]
           key="$empty">
-          {React.cloneElement(element, {
-            onLayout: (event: LayoutChangeEvent) => {
-              this._onLayoutEmpty(event);
-              // $FlowFixMe[prop-missing] React.Element internal inspection
-              if (element.props.onLayout) {
-                element.props.onLayout(event);
-              }
-            },
-            // $FlowFixMe[prop-missing] React.Element internal inspection
-            style: StyleSheet.compose(inversionStyle, element.props.style),
-          })}
+          {this._renderEmptyComponent(element, inversionStyle)}
         </VirtualizedListCellContextProvider>,
       );
     }
@@ -1085,7 +1102,7 @@ class VirtualizedList extends StateSafePureComponent<
 
     // 3. Add cell for ListFooterComponent
     if (ListFooterComponent) {
-      const element = React.isValidElement(ListFooterComponent) ? (
+      const element = isValidElement(ListFooterComponent) ? (
         ListFooterComponent
       ) : (
         // $FlowFixMe[not-a-component]
@@ -1158,11 +1175,14 @@ class VirtualizedList extends StateSafePureComponent<
           registerAsNestedChild: this._registerAsNestedChild,
           unregisterAsNestedChild: this._unregisterAsNestedChild,
         }}>
-        {React.cloneElement(
+        {cloneElement(
           (
             this.props.renderScrollComponent ||
             this._defaultRenderScrollComponent
-          )(scrollProps) as ExactReactElement_DEPRECATED<any>,
+          )(
+            // $FlowExpectedError[prop-missing] scrollProps is a superset of ScrollViewProps
+            scrollProps,
+          ) as ExactReactElement_DEPRECATED<any>,
           {
             ref: this._captureScrollRef,
           },
@@ -1393,7 +1413,12 @@ class VirtualizedList extends StateSafePureComponent<
 
   _onCellFocusCapture = (cellKey: string) => {
     this._lastFocusedCellKey = cellKey;
-    this._updateCellsToRender();
+    if (ReactNativeFeatureFlags.deferFlatListFocusChangeRenderUpdate()) {
+      // Schedule the cells to render update the same way we handle scroll or layout events.
+      this._scheduleCellsToRenderUpdate();
+    } else {
+      this._updateCellsToRender();
+    }
   };
 
   _onCellUnmount = (cellKey: string) => {

package/Lists/VirtualizedListCellRenderer.js

@@ -9,16 +9,18 @@
  */
 
 import type {CellRendererProps, ListRenderItem} from './VirtualizedListProps';
-import type {ViewStyleProp} from 'react-native/Libraries/StyleSheet/StyleSheet';
 import type {
   FocusEvent,
   LayoutChangeEvent,
-} from 'react-native/Libraries/Types/CoreEventTypes';
+  StyleProp,
+  ViewStyle,
+} from 'react-native';
 
 import {VirtualizedListCellContextProvider} from './VirtualizedListContext.js';
 import invariant from 'invariant';
 import * as React from 'react';
-import {Platform, StyleSheet, View} from 'react-native'; // [macOS]
+import {isValidElement} from 'react';
+import {Platform, StyleSheet, View} from 'react-native';
 
 export type Props<ItemT> = {
   CellRendererComponent?: ?React.ComponentType<CellRendererProps<ItemT>>,
@@ -29,7 +31,7 @@ export type Props<ItemT> = {
   cellKey: string,
   horizontal: ?boolean,
   index: number,
-  inversionStyle: ViewStyleProp,
+  inversionStyle: StyleProp<ViewStyle>,
   isSelected: ?boolean, // [macOS]
   item: ItemT,
   onCellLayout?: (
@@ -197,9 +199,7 @@ export default class CellRenderer<ItemT> extends React.PureComponent<
 
     // NOTE: that when this is a sticky header, `onLayout` will get automatically extracted and
     // called explicitly by `ScrollViewStickyHeader`.
-    const itemSeparator: React.Node = React.isValidElement(
-      ItemSeparatorComponent,
-    )
+    const itemSeparator: React.Node = isValidElement(ItemSeparatorComponent)
       ? // $FlowFixMe[incompatible-type]
         ItemSeparatorComponent
       : // $FlowFixMe[incompatible-type]

package/Lists/VirtualizedListContext.js

@@ -8,10 +8,10 @@
  * @format
  */
 
-import typeof VirtualizedList from './VirtualizedList';
+import typeof VirtualizedListT from './VirtualizedList';
 
 import * as React from 'react';
-import {useContext, useMemo} from 'react';
+import {createContext, useContext, useMemo} from 'react';
 
 type Context = $ReadOnly<{
   cellKey: ?string,
@@ -26,16 +26,16 @@ type Context = $ReadOnly<{
     zoomScale: number,
   },
   horizontal: ?boolean,
-  getOutermostParentListRef: () => React.ElementRef<VirtualizedList>,
+  getOutermostParentListRef: () => React.ElementRef<VirtualizedListT>,
   registerAsNestedChild: ({
     cellKey: string,
-    ref: React.ElementRef<VirtualizedList>,
+    ref: React.ElementRef<VirtualizedListT>,
   }) => void,
-  unregisterAsNestedChild: ({ref: React.ElementRef<VirtualizedList>}) => void,
+  unregisterAsNestedChild: ({ref: React.ElementRef<VirtualizedListT>}) => void,
 }>;
 
 export const VirtualizedListContext: React.Context<?Context> =
-  React.createContext(null);
+  createContext(null);
 if (__DEV__) {
   VirtualizedListContext.displayName = 'VirtualizedListContext';
 }

package/Lists/VirtualizedListProps.js

@@ -13,14 +13,15 @@ import type {
   ViewabilityConfigCallbackPair,
   ViewToken,
 } from './ViewabilityHelper';
-import type {ViewStyleProp} from 'react-native/Libraries/StyleSheet/StyleSheet';
 import type {
   FocusEvent,
   LayoutChangeEvent,
-} from 'react-native/Libraries/Types/CoreEventTypes';
+  ScrollViewProps,
+  StyleProp,
+  ViewStyle,
+} from 'react-native';
 
 import * as React from 'react';
-import {typeof ScrollView} from 'react-native';
 
 export type Item = any;
 
@@ -46,7 +47,7 @@ export type CellRendererProps<ItemT> = $ReadOnly<{
   item: ItemT,
   onFocusCapture?: (event: FocusEvent) => void,
   onLayout?: (event: LayoutChangeEvent) => void,
-  style: ViewStyleProp,
+  style: StyleProp<ViewStyle>,
 }>;
 
 export type ListRenderItem<ItemT> = (
@@ -59,7 +60,7 @@ export type SelectedRowIndexPathType = {
   rowIndex: number,
 }; // macOS]
 
-type RequiredProps = {
+type RequiredVirtualizedListProps = {
   /**
    * The default accessor functions assume this is an Array<{key: string} | {id: string}> but you can override
    * getItem, getItemCount, and keyExtractor to handle any type of index-based data.
@@ -74,7 +75,7 @@ type RequiredProps = {
    */
   getItemCount: (data: any) => number,
 };
-type OptionalProps = {
+type OptionalVirtualizedListProps = {
   renderItem?: ?ListRenderItem<Item>,
   /**
    * `debug` will turn on extra logging and visual overlays to aid with debugging both usage and
@@ -176,7 +177,7 @@ type OptionalProps = {
   /**
    * Styling for internal View for ListFooterComponent
    */
-  ListFooterComponentStyle?: ViewStyleProp,
+  ListFooterComponentStyle?: StyleProp<ViewStyle>,
   /**
    * Rendered at the top of all the items. Can be a React Component Class, a render function, or
    * a rendered element.
@@ -185,7 +186,7 @@ type OptionalProps = {
   /**
    * Styling for internal View for ListHeaderComponent
    */
-  ListHeaderComponentStyle?: ViewStyleProp,
+  ListHeaderComponentStyle?: StyleProp<ViewStyle>,
   /**
    * The maximum number of items to render in each incremental render batch. The more rendered at
    * once, the better the fill rate, but responsiveness may suffer because rendering content may
@@ -265,7 +266,7 @@ type OptionalProps = {
   /**
    * Render a custom scroll component, e.g. with a differently styled `RefreshControl`.
    */
-  renderScrollComponent?: (props: Object) => React.MixedElement,
+  renderScrollComponent?: (props: ScrollViewProps) => React.MixedElement,
   /**
    * Amount of time between low-pri item render batches, e.g. for rendering items quite a ways off
    * screen. Similar fill rate/responsiveness tradeoff as `maxToRenderPerBatch`.
@@ -290,7 +291,7 @@ type OptionalProps = {
   windowSize?: ?number,
 };
 // [macOS
-type MacOSProps = {
+type VirtualizedListMacOSProps = {
   /**
    * Allows you to 'select' a row using arrow keys. The selected row will have the prop `isSelected`
    * passed in as true to it's renderItem / ListItemComponent. You can also imperatively select a row
@@ -335,10 +336,10 @@ type MacOSProps = {
 // macOS]
 
 export type VirtualizedListProps = {
-  ...React.ElementConfig<ScrollView>,
-  ...RequiredProps,
-  ...OptionalProps,
-  ...MacOSProps, // [macOS]
+  ...ScrollViewProps,
+  ...RequiredVirtualizedListProps,
+  ...OptionalVirtualizedListProps,
+  ...VirtualizedListMacOSProps, // [macOS]
 };
 
 /**

package/Lists/VirtualizedSectionList.js

@@ -9,14 +9,25 @@
  */
 
 import type {ViewToken} from './ViewabilityHelper';
+import type {VirtualizedListProps} from './VirtualizedListProps';
 
 import VirtualizedList from './VirtualizedList';
 import {keyExtractor as defaultKeyExtractor} from './VirtualizeUtils';
 import invariant from 'invariant';
 import * as React from 'react';
-type Item = any;
+import {useEffect, useState} from 'react';
 
-export type SectionBase<SectionItemT> = {
+type DefaultVirtualizedSectionT = {
+  data: any,
+  [key: string]: any,
+};
+
+export type SectionData<SectionItemT, SectionT = DefaultVirtualizedSectionT> =
+  | ($ReadOnly<SectionBase<SectionItemT, SectionT>> & SectionT)
+  | (SectionBase<SectionItemT, SectionT> & SectionT)
+  | SectionT;
+
+export type SectionBase<SectionItemT, SectionT = DefaultVirtualizedSectionT> = {
   /**
    * The data for rendering items in this section.
    */
@@ -30,7 +41,7 @@ export type SectionBase<SectionItemT> = {
   renderItem?: ?(info: {
     item: SectionItemT,
     index: number,
-    section: SectionBase<SectionItemT>,
+    section: SectionData<SectionItemT, SectionT>,
     separators: {
       highlight: () => void,
       unhighlight: () => void,
@@ -40,21 +51,28 @@ export type SectionBase<SectionItemT> = {
     ...
   }) => null | React.MixedElement,
   ItemSeparatorComponent?: ?React.ComponentType<any>,
-  keyExtractor?: (item: SectionItemT, index?: ?number) => string,
+  keyExtractor?: (item: ?SectionItemT, index?: ?number) => string,
   ...
 };
 
-type RequiredProps<SectionT: SectionBase<any>> = {
-  sections: $ReadOnlyArray<SectionT>,
+type RequiredVirtualizedSectionListProps<
+  ItemT,
+  SectionT = DefaultVirtualizedSectionT,
+> = {
+  sections: $ReadOnlyArray<SectionData<ItemT, SectionT>>,
 };
 
-type OptionalProps<SectionT: SectionBase<any>> = {
+type OptionalVirtualizedSectionListProps<
+  ItemT,
+  SectionT = DefaultVirtualizedSectionT,
+> = {
   /**
    * Default renderer for every item in every section.
    */
   renderItem?: (info: {
-    item: Item,
+    item: ItemT,
     index: number,
+    isSelected: ?boolean, // [macOS]
     section: SectionT,
     separators: {
       highlight: () => void,
@@ -89,19 +107,13 @@ type OptionalProps<SectionT: SectionBase<any>> = {
   onEndReached?: ?({distanceFromEnd: number, ...}) => void,
 };
 
-type VirtualizedListProps = React.ElementConfig<typeof VirtualizedList>;
-
-export type VirtualizedSectionListProps<SectionT: SectionBase<any>> = {
-  ...RequiredProps<SectionT>,
-  ...OptionalProps<SectionT>,
-  ...$Diff<
-    VirtualizedListProps,
-    {
-      renderItem: $PropertyType<VirtualizedListProps, 'renderItem'>,
-      data: $PropertyType<VirtualizedListProps, 'data'>,
-      ...
-    },
-  >,
+export type VirtualizedSectionListProps<
+  ItemT,
+  SectionT = DefaultVirtualizedSectionT,
+> = {
+  ...RequiredVirtualizedSectionListProps<ItemT, SectionT>,
+  ...OptionalVirtualizedSectionListProps<ItemT, SectionT>,
+  ...Omit<VirtualizedListProps, 'data' | 'renderItem'>,
 };
 export type ScrollToLocationParamsType = {
   animated?: ?boolean,
@@ -119,8 +131,15 @@ type State = {childProps: VirtualizedListProps, ...};
  * sections when new props are received, which should be plenty fast for up to ~10,000 items.
  */
 class VirtualizedSectionList<
-  SectionT: SectionBase<any>,
-> extends React.PureComponent<VirtualizedSectionListProps<SectionT>, State> {
+  ItemT,
+  SectionT: SectionBase<
+    ItemT,
+    DefaultVirtualizedSectionT,
+  > = DefaultVirtualizedSectionT,
+> extends React.PureComponent<
+  VirtualizedSectionListProps<ItemT, SectionT>,
+  State,
+> {
   scrollToLocation(params: ScrollToLocationParamsType) {
     let index = params.itemIndex;
     for (let i = 0; i < params.sectionIndex; i++) {
@@ -203,10 +222,10 @@ class VirtualizedSectionList<
   }
 
   _getItem(
-    props: VirtualizedSectionListProps<SectionT>,
-    sections: ?$ReadOnlyArray<Item>,
+    props: VirtualizedSectionListProps<ItemT, SectionT>,
+    sections: ?$ReadOnlyArray<SectionData<ItemT, SectionT>>,
     index: number,
-  ): ?Item {
+  ): ?ItemT {
     if (!sections) {
       return null;
     }
@@ -219,6 +238,7 @@ class VirtualizedSectionList<
         // We intend for there to be overflow by one on both ends of the list.
         // This will be for headers and footers. When returning a header or footer
         // item the section itself is the item.
+        // $FlowIgnore[incompatible-return]
         return section;
       } else if (itemIdx < itemCount) {
         // If we are in the bounds of the list's data then return the item.
@@ -231,23 +251,23 @@ class VirtualizedSectionList<
   }
 
   // $FlowFixMe[missing-local-annot]
-  _keyExtractor = (item: Item, index: number) => {
+  _keyExtractor = (item: ItemT, index: number) => {
     const info = this._subExtractor(index);
     return (info && info.key) || String(index);
   };
 
   _subExtractor(index: number): ?{
-    section: SectionT,
+    section: SectionData<ItemT, SectionT>,
     // Key of the section or combined key for section + item
     key: string,
     // Relative index within the section
     index: ?number,
     // True if this is the section header
     header?: ?boolean,
-    leadingItem?: ?Item,
-    leadingSection?: ?SectionT,
-    trailingItem?: ?Item,
-    trailingSection?: ?SectionT,
+    leadingItem?: ?ItemT,
+    leadingSection?: ?SectionData<ItemT, SectionT>,
+    trailingItem?: ?ItemT,
+    trailingSection?: ?SectionData<ItemT, SectionT>,
     ...
   } {
     let itemIndex = index;
@@ -336,7 +356,7 @@ class VirtualizedSectionList<
   _renderItem =
     (listItemCount: number): $FlowFixMe =>
     // eslint-disable-next-line react/no-unstable-nested-components
-    ({item, index}: {item: Item, index: number, ...}) => {
+    ({item, index}: {item: ItemT, index: number, ...}) => {
       const info = this._subExtractor(index);
       if (!info) {
         return null;
@@ -453,21 +473,21 @@ class VirtualizedSectionList<
   };
 }
 
-type ItemWithSeparatorCommonProps = $ReadOnly<{
-  leadingItem: ?Item,
+type ItemWithSeparatorCommonProps<ItemT> = $ReadOnly<{
+  leadingItem: ?ItemT,
   leadingSection: ?Object,
   section: Object,
-  trailingItem: ?Item,
+  trailingItem: ?ItemT,
   trailingSection: ?Object,
 }>;
 
-type ItemWithSeparatorProps = $ReadOnly<{
-  ...ItemWithSeparatorCommonProps,
+type ItemWithSeparatorProps<ItemT> = $ReadOnly<{
+  ...ItemWithSeparatorCommonProps<ItemT>,
   LeadingSeparatorComponent: ?React.ComponentType<any>,
   SeparatorComponent: ?React.ComponentType<any>,
   cellKey: string,
   index: number,
-  item: Item,
+  item: ItemT,
   setSelfHighlightCallback: (
     cellKey: string,
     updateFn: ?(boolean) => void,
@@ -483,7 +503,9 @@ type ItemWithSeparatorProps = $ReadOnly<{
   inverted: boolean,
 }>;
 
-function ItemWithSeparator(props: ItemWithSeparatorProps): React.Node {
+function ItemWithSeparator<ItemT>(
+  props: ItemWithSeparatorProps<ItemT>,
+): React.Node {
   const {
     LeadingSeparatorComponent,
     // this is the trailing separator and is associated with this item
@@ -501,18 +523,22 @@ function ItemWithSeparator(props: ItemWithSeparatorProps): React.Node {
   } = props;
 
   const [leadingSeparatorHiglighted, setLeadingSeparatorHighlighted] =
-    React.useState(false);
+    useState(false);
 
-  const [separatorHighlighted, setSeparatorHighlighted] = React.useState(false);
+  const [separatorHighlighted, setSeparatorHighlighted] = useState(false);
 
-  const [leadingSeparatorProps, setLeadingSeparatorProps] = React.useState({
+  const [leadingSeparatorProps, setLeadingSeparatorProps] = useState<
+    ItemWithSeparatorCommonProps<ItemT>,
+  >({
     leadingItem: props.leadingItem,
     leadingSection: props.leadingSection,
     section: props.section,
     trailingItem: props.item,
     trailingSection: props.trailingSection,
   });
-  const [separatorProps, setSeparatorProps] = React.useState({
+  const [separatorProps, setSeparatorProps] = useState<
+    ItemWithSeparatorCommonProps<ItemT>,
+  >({
     leadingItem: props.item,
     leadingSection: props.leadingSection,
     section: props.section,
@@ -520,7 +546,7 @@ function ItemWithSeparator(props: ItemWithSeparatorProps): React.Node {
     trailingSection: props.trailingSection,
   });
 
-  React.useEffect(() => {
+  useEffect(() => {
     setSelfHighlightCallback(cellKey, setSeparatorHighlighted);
     // $FlowFixMe[incompatible-call]
     setSelfUpdatePropsCallback(cellKey, setSeparatorProps);
@@ -553,7 +579,7 @@ function ItemWithSeparator(props: ItemWithSeparatorProps): React.Node {
     },
     updateProps: (
       select: 'leading' | 'trailing',
-      newProps: Partial<ItemWithSeparatorCommonProps>,
+      newProps: Partial<ItemWithSeparatorCommonProps<ItemT>>,
     ) => {
       if (select === 'leading') {
         if (LeadingSeparatorComponent != null) {
@@ -598,12 +624,25 @@ function ItemWithSeparator(props: ItemWithSeparatorProps): React.Node {
   );
 }
 
-export default VirtualizedSectionList as component(
+const VirtualizedSectionListComponent = VirtualizedSectionList as component<
+  ItemT,
+  SectionT: SectionBase<
+    ItemT,
+    DefaultVirtualizedSectionT,
+  > = DefaultVirtualizedSectionT,
+>(
   ref: React.RefSetter<
     interface {
       getListRef(): ?VirtualizedList,
       scrollToLocation(params: ScrollToLocationParamsType): void,
     },
   >,
-  ...VirtualizedSectionListProps<SectionBase<any>>
+  ...VirtualizedSectionListProps<ItemT, SectionT>
 );
+
+export default VirtualizedSectionListComponent;
+
+export type AnyVirtualizedSectionList = typeof VirtualizedSectionListComponent<
+  any,
+  any,
+>;

package/Utilities/clamp.js

@@ -4,8 +4,8 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @format
  * @flow strict
+ * @format
  */
 
 'use strict';

package/Utilities/infoLog.js

@@ -4,8 +4,8 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @format
  * @flow strict
+ * @format
  */
 
 'use strict';

package/index.js

@@ -4,18 +4,18 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @format
  * @flow
+ * @format
  */
 
 'use strict';
 
-import typeof FillRateHelper from './Lists/FillRateHelper';
-import typeof ViewabilityHelper from './Lists/ViewabilityHelper';
-import typeof VirtualizedList from './Lists/VirtualizedList';
-import typeof VirtualizedSectionList from './Lists/VirtualizedSectionList';
+import typeof FillRateHelperT from './Lists/FillRateHelper';
+import typeof ViewabilityHelperT from './Lists/ViewabilityHelper';
+import typeof VirtualizedListT from './Lists/VirtualizedList';
+import type {AnyVirtualizedSectionList as AnyVirtualizedSectionListT} from './Lists/VirtualizedSectionList';
 
-import {typeof VirtualizedListContextResetter} from './Lists/VirtualizedListContext';
+import {typeof VirtualizedListContextResetter as VirtualizedListContextResetterT} from './Lists/VirtualizedListContext';
 import {keyExtractor} from './Lists/VirtualizeUtils';
 
 export type {
@@ -29,31 +29,33 @@ export type {
   ListRenderItemInfo,
   ListRenderItem,
   Separators,
+  VirtualizedListProps,
 } from './Lists/VirtualizedListProps';
 export type {
   VirtualizedSectionListProps,
   ScrollToLocationParamsType,
   SectionBase,
+  SectionData,
 } from './Lists/VirtualizedSectionList';
 export type {FillRateInfo} from './Lists/FillRateHelper';
 
 export default {
   keyExtractor,
 
-  get VirtualizedList(): VirtualizedList {
+  get VirtualizedList(): VirtualizedListT {
     return require('./Lists/VirtualizedList').default;
   },
-  get VirtualizedSectionList(): VirtualizedSectionList {
+  get VirtualizedSectionList(): AnyVirtualizedSectionListT {
     return require('./Lists/VirtualizedSectionList').default;
   },
-  get VirtualizedListContextResetter(): VirtualizedListContextResetter {
+  get VirtualizedListContextResetter(): VirtualizedListContextResetterT {
     const VirtualizedListContext = require('./Lists/VirtualizedListContext');
     return VirtualizedListContext.VirtualizedListContextResetter;
   },
-  get ViewabilityHelper(): ViewabilityHelper {
+  get ViewabilityHelper(): ViewabilityHelperT {
     return require('./Lists/ViewabilityHelper').default;
   },
-  get FillRateHelper(): FillRateHelper {
+  get FillRateHelper(): FillRateHelperT {
     return require('./Lists/FillRateHelper').default;
   },
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-native-macos/virtualized-lists",
-  "version": "0.79.0",
+  "version": "0.81.0",
   "description": "Virtualized lists for React Native macOS.",
   "license": "MIT",
   "repository": {
@@ -17,17 +17,41 @@
   ],
   "bugs": "https://github.com/facebook/react-native/issues",
   "engines": {
-    "node": ">=18"
+    "node": ">= 20.19.4"
   },
+  "exports": {
+    ".": {
+      "react-native-strict-api": "./types_generated/index.d.ts",
+      "types": "./index.d.ts",
+      "default": "./index.js"
+    },
+    "./*": {
+      "types": null,
+      "default": "./*.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "index.js",
+    "index.d.ts",
+    "Lists",
+    "README.md",
+    "types_generated",
+    "Utilities",
+    "!**/__docs__/**",
+    "!**/__fixtures__/**",
+    "!**/__mocks__/**",
+    "!**/__tests__/**"
+  ],
   "dependencies": {
     "invariant": "^2.2.4",
     "nullthrows": "^1.1.1"
   },
   "devDependencies": {
-    "react-test-renderer": "19.0.0"
+    "react-test-renderer": "19.1.4"
   },
   "peerDependencies": {
-    "@types/react": "^19.0.0",
+    "@types/react": "^19.1.4",
     "react": "*",
     "react-native": "*"
   },

package/CHANGELOG.json

@@ -1,20 +0,0 @@
-{
-  "name": "@react-native-mac/virtualized-lists",
-  "entries": [
-    {
-      "date": "Wed, 06 Sep 2023 19:59:04 GMT",
-      "tag": "@react-native-mac/virtualized-lists_v0.72.1",
-      "version": "0.72.1",
-      "comments": {
-        "patch": [
-          {
-            "author": "adgleitm@microsoft.com",
-            "package": "@react-native-mac/virtualized-lists",
-            "commit": "fea8f9a9859f8e2e43ac313ff3c8975b6e82b8c4",
-            "comment": "Bring in 0.72-stable changes to virtualized-lists"
-          }
-        ]
-      }
-    }
-  ]
-}

package/CHANGELOG.md

@@ -1,13 +0,0 @@
-# Change Log - @react-native-macos/virtualized-lists
-
-This log was last generated on Wed, 06 Sep 2023 19:59:04 GMT and should not be manually modified.
-
-<!-- Start content -->
-
-## 0.72.1
-
-Wed, 06 Sep 2023 19:59:04 GMT
-
-### Patches
-
-- Bring in 0.72-stable changes to virtualized-lists (adgleitm@microsoft.com)