@legendapp/list 3.0.0 → 3.0.2

package/section-list.d.ts

@@ -729,7 +729,22 @@ type SectionListOnViewableItemsChanged<ItemT, SectionT> = ((info: {
     start: number;
     startBuffered: number;
 }) => void) | null;
-type SectionListLegendProps<ItemT, SectionT> = Omit<LegendListProps<FlatSectionListItem<ItemT, SectionT>>, "data" | "children" | "renderItem" | "keyExtractor" | "ItemSeparatorComponent" | "getItemType" | "getFixedItemSize" | "stickyHeaderIndices" | "numColumns" | "columnWrapperStyle" | "onViewableItemsChanged">;
+type SectionListFlatItem<ItemT, SectionT extends SectionBase<ItemT>> = FlatSectionListItem<ItemT, SectionListData<ItemT, SectionT>>;
+type SectionListGetFixedItemSizeInfo<ItemT, SectionT extends SectionBase<ItemT>> = (SectionListRenderItemInfo<ItemT, SectionT> & {
+    type: "item";
+}) | {
+    section: SectionListData<ItemT, SectionT>;
+    type: "header";
+} | {
+    section: SectionListData<ItemT, SectionT>;
+    type: "footer";
+} | ({
+    type: "item-separator";
+} & SectionListSeparatorProps<ItemT, SectionT>) | ({
+    type: "section-separator";
+} & SectionListSeparatorProps<ItemT, SectionT>);
+type SectionListGetFixedItemSize<ItemT, SectionT extends SectionBase<ItemT>> = (info: SectionListGetFixedItemSizeInfo<ItemT, SectionT>) => number | undefined;
+type SectionListLegendProps<ItemT, SectionT extends SectionBase<ItemT>> = Omit<LegendListProps<SectionListFlatItem<ItemT, SectionT>>, "data" | "children" | "renderItem" | "keyExtractor" | "ItemSeparatorComponent" | "getItemType" | "getFixedItemSize" | "stickyHeaderIndices" | "numColumns" | "columnWrapperStyle" | "onViewableItemsChanged">;
 type SectionListProps<ItemT, SectionT extends SectionBase<ItemT> = SectionBase<ItemT>> = SectionListLegendProps<ItemT, SectionT> & {
     sections: ReadonlyArray<SectionListData<ItemT, SectionT>>;
     extraData?: any;
@@ -742,6 +757,7 @@ type SectionListProps<ItemT, SectionT extends SectionBase<ItemT> = SectionBase<I
     }) => React.ReactElement | null;
     ItemSeparatorComponent?: React.ComponentType<SectionListSeparatorProps<ItemT, SectionT>> | null;
     SectionSeparatorComponent?: React.ComponentType<SectionListSeparatorProps<ItemT, SectionT>> | React.ReactElement | null;
+    getFixedItemSize?: SectionListGetFixedItemSize<ItemT, SectionT>;
     keyExtractor?: (item: ItemT, index: number) => string;
     stickySectionHeadersEnabled?: boolean;
     onViewableItemsChanged?: SectionListOnViewableItemsChanged<ItemT, SectionT>;
@@ -761,6 +777,7 @@ declare const SectionList: (<ItemT, SectionT extends SectionBase<ItemT, react_na
     }) => React.ReactElement | null) | undefined;
     ItemSeparatorComponent?: React.ComponentType<SectionListSeparatorProps<ItemT, SectionT>> | null | undefined;
     SectionSeparatorComponent?: React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | React.ComponentType<SectionListSeparatorProps<ItemT, SectionT>> | null | undefined;
+    getFixedItemSize?: SectionListGetFixedItemSize<ItemT, SectionT> | undefined;
     keyExtractor?: ((item: ItemT, index: number) => string) | undefined;
     stickySectionHeadersEnabled?: boolean;
     onViewableItemsChanged?: SectionListOnViewableItemsChanged<ItemT, SectionT> | undefined;
@@ -768,4 +785,4 @@ declare const SectionList: (<ItemT, SectionT extends SectionBase<ItemT, react_na
     displayName?: string;
 };
 
-export { type BuildSectionListDataResult, type FlatSectionListItem, SectionList, type SectionListOnViewableItemsChanged, type SectionListProps, type SectionListRef, type SectionListSeparatorProps, type SectionListViewToken, type SectionMeta };
+export { type BuildSectionListDataResult, type FlatSectionListItem, SectionList, type SectionListGetFixedItemSize, type SectionListGetFixedItemSizeInfo, type SectionListOnViewableItemsChanged, type SectionListProps, type SectionListRef, type SectionListSeparatorProps, type SectionListViewToken, type SectionMeta };

package/section-list.js

@@ -132,6 +132,38 @@ var defaultSeparators = {
   updateProps: () => {
   }
 };
+function getSectionListItemInfo(item) {
+  switch (item.kind) {
+    case "item":
+      return {
+        index: item.itemIndex,
+        item: item.item,
+        section: item.section,
+        separators: defaultSeparators,
+        type: item.kind
+      };
+    case "item-separator":
+      return {
+        leadingItem: item.leadingItem,
+        leadingSection: item.section,
+        section: item.section,
+        trailingItem: item.trailingItem,
+        trailingSection: item.section,
+        type: item.kind
+      };
+    case "section-separator":
+      return {
+        leadingItem: void 0,
+        leadingSection: item.leadingSection,
+        section: item.leadingSection,
+        trailingItem: void 0,
+        trailingSection: item.trailingSection,
+        type: item.kind
+      };
+    default:
+      return { section: item.section, type: item.kind };
+  }
+}
 function resolveSeparatorComponent(component, props) {
   if (!component) return null;
   if (React__namespace.isValidElement(component)) {
@@ -153,6 +185,7 @@ var SectionList = typedMemo(
       keyExtractor,
       extraData,
       onViewableItemsChanged,
+      getFixedItemSize,
       horizontal,
       ...restProps
     } = props;
@@ -180,6 +213,10 @@ var SectionList = typedMemo(
       ]
     );
     const { data, sectionMeta, stickyHeaderIndices } = flattened;
+    const handleGetFixedItemSize = React__namespace.useCallback(
+      (item) => getFixedItemSize == null ? void 0 : getFixedItemSize(getSectionListItemInfo(item)),
+      [getFixedItemSize]
+    );
     const handleViewableItemsChanged = React__namespace.useMemo(() => {
       if (!onViewableItemsChanged) return void 0;
       return ({
@@ -215,39 +252,22 @@ var SectionList = typedMemo(
     const renderItem = React__namespace.useCallback(
       ({ item }) => {
         var _a, _b;
-        switch (item.kind) {
+        const info = getSectionListItemInfo(item);
+        switch (info.type) {
           case "header":
-            return renderSectionHeader ? renderSectionHeader({ section: item.section }) : null;
+            return renderSectionHeader ? renderSectionHeader(info) : null;
           case "footer":
-            return renderSectionFooter ? renderSectionFooter({ section: item.section }) : null;
+            return renderSectionFooter ? renderSectionFooter(info) : null;
           case "item": {
-            const render = (_a = item.section.renderItem) != null ? _a : renderItemProp;
-            if (!render) return null;
-            return render({
-              index: item.itemIndex,
-              item: item.item,
-              section: item.section,
-              separators: defaultSeparators
-            });
+            const render = (_a = info.section.renderItem) != null ? _a : renderItemProp;
+            return render ? render(info) : null;
           }
           case "item-separator": {
-            const SeparatorComponent = (_b = item.section.ItemSeparatorComponent) != null ? _b : ItemSeparatorComponent;
-            return resolveSeparatorComponent(SeparatorComponent, {
-              leadingItem: item.leadingItem,
-              leadingSection: item.section,
-              section: item.section,
-              trailingItem: item.trailingItem,
-              trailingSection: item.section
-            });
+            const SeparatorComponent = (_b = info.section.ItemSeparatorComponent) != null ? _b : ItemSeparatorComponent;
+            return resolveSeparatorComponent(SeparatorComponent, info);
           }
           case "section-separator":
-            return resolveSeparatorComponent(SectionSeparatorComponent, {
-              leadingItem: void 0,
-              leadingSection: item.leadingSection,
-              section: item.leadingSection,
-              trailingItem: void 0,
-              trailingSection: item.trailingSection
-            });
+            return resolveSeparatorComponent(SectionSeparatorComponent, info);
           default:
             return null;
         }
@@ -290,6 +310,7 @@ var SectionList = typedMemo(
         ...restProps,
         columnWrapperStyle: void 0,
         data,
+        getFixedItemSize: getFixedItemSize ? handleGetFixedItemSize : void 0,
         getItemType: (item) => item.kind,
         keyExtractor: (item) => item.key,
         numColumns: 1,

package/section-list.mjs

@@ -110,6 +110,38 @@ var defaultSeparators = {
   updateProps: () => {
   }
 };
+function getSectionListItemInfo(item) {
+  switch (item.kind) {
+    case "item":
+      return {
+        index: item.itemIndex,
+        item: item.item,
+        section: item.section,
+        separators: defaultSeparators,
+        type: item.kind
+      };
+    case "item-separator":
+      return {
+        leadingItem: item.leadingItem,
+        leadingSection: item.section,
+        section: item.section,
+        trailingItem: item.trailingItem,
+        trailingSection: item.section,
+        type: item.kind
+      };
+    case "section-separator":
+      return {
+        leadingItem: void 0,
+        leadingSection: item.leadingSection,
+        section: item.leadingSection,
+        trailingItem: void 0,
+        trailingSection: item.trailingSection,
+        type: item.kind
+      };
+    default:
+      return { section: item.section, type: item.kind };
+  }
+}
 function resolveSeparatorComponent(component, props) {
   if (!component) return null;
   if (React.isValidElement(component)) {
@@ -131,6 +163,7 @@ var SectionList = typedMemo(
       keyExtractor,
       extraData,
       onViewableItemsChanged,
+      getFixedItemSize,
       horizontal,
       ...restProps
     } = props;
@@ -158,6 +191,10 @@ var SectionList = typedMemo(
       ]
     );
     const { data, sectionMeta, stickyHeaderIndices } = flattened;
+    const handleGetFixedItemSize = React.useCallback(
+      (item) => getFixedItemSize == null ? void 0 : getFixedItemSize(getSectionListItemInfo(item)),
+      [getFixedItemSize]
+    );
     const handleViewableItemsChanged = React.useMemo(() => {
       if (!onViewableItemsChanged) return void 0;
       return ({
@@ -193,39 +230,22 @@ var SectionList = typedMemo(
     const renderItem = React.useCallback(
       ({ item }) => {
         var _a, _b;
-        switch (item.kind) {
+        const info = getSectionListItemInfo(item);
+        switch (info.type) {
           case "header":
-            return renderSectionHeader ? renderSectionHeader({ section: item.section }) : null;
+            return renderSectionHeader ? renderSectionHeader(info) : null;
           case "footer":
-            return renderSectionFooter ? renderSectionFooter({ section: item.section }) : null;
+            return renderSectionFooter ? renderSectionFooter(info) : null;
           case "item": {
-            const render = (_a = item.section.renderItem) != null ? _a : renderItemProp;
-            if (!render) return null;
-            return render({
-              index: item.itemIndex,
-              item: item.item,
-              section: item.section,
-              separators: defaultSeparators
-            });
+            const render = (_a = info.section.renderItem) != null ? _a : renderItemProp;
+            return render ? render(info) : null;
           }
           case "item-separator": {
-            const SeparatorComponent = (_b = item.section.ItemSeparatorComponent) != null ? _b : ItemSeparatorComponent;
-            return resolveSeparatorComponent(SeparatorComponent, {
-              leadingItem: item.leadingItem,
-              leadingSection: item.section,
-              section: item.section,
-              trailingItem: item.trailingItem,
-              trailingSection: item.section
-            });
+            const SeparatorComponent = (_b = info.section.ItemSeparatorComponent) != null ? _b : ItemSeparatorComponent;
+            return resolveSeparatorComponent(SeparatorComponent, info);
           }
           case "section-separator":
-            return resolveSeparatorComponent(SectionSeparatorComponent, {
-              leadingItem: void 0,
-              leadingSection: item.leadingSection,
-              section: item.leadingSection,
-              trailingItem: void 0,
-              trailingSection: item.trailingSection
-            });
+            return resolveSeparatorComponent(SectionSeparatorComponent, info);
           default:
             return null;
         }
@@ -268,6 +288,7 @@ var SectionList = typedMemo(
         ...restProps,
         columnWrapperStyle: void 0,
         data,
+        getFixedItemSize: getFixedItemSize ? handleGetFixedItemSize : void 0,
         getItemType: (item) => item.kind,
         keyExtractor: (item) => item.key,
         numColumns: 1,