@shopify/flash-list 2.0.0-alpha.2 → 2.0.0-alpha.20

package/dist/recyclerview/RenderStackManager.d.ts

@@ -0,0 +1,86 @@
+import { ConsecutiveNumbers } from "./helpers/ConsecutiveNumbers";
+/**
+ * Manages the recycling of rendered items in a virtualized list.
+ * This class handles tracking, recycling, and reusing item keys to optimize
+ * rendering performance by minimizing creation/destruction of components.
+ */
+export declare class RenderStackManager {
+    disableRecycling: boolean;
+    private maxItemsInRecyclePool;
+    private recycleKeyPools;
+    private keyMap;
+    private stableIdMap;
+    private keyCounter;
+    private unProcessedIndices;
+    /**
+     * @param maxItemsInRecyclePool - Maximum number of items that can be in the recycle pool
+     */
+    constructor(maxItemsInRecyclePool?: number);
+    /**
+     * Synchronizes the render stack with the current state of data.
+     * This method is the core orchestrator that:
+     * 1. Recycles keys for items that are no longer valid
+     * 2. Updates existing keys for items that remain visible
+     * 3. Assigns new keys for newly visible items
+     * 4. Cleans up excess items to maintain the recycling pool size
+     *
+     * @param getStableId - Function to get a stable identifier for an item at a specific index
+     * @param getItemType - Function to get the type of an item at a specific index
+     * @param engagedIndices - Collection of indices that are currently visible or engaged
+     * @param dataLength - Total length of the data set
+     */
+    sync(getStableId: (index: number) => string, getItemType: (index: number) => string, engagedIndices: ConsecutiveNumbers, dataLength: number): void;
+    /**
+     * Checks if a stable ID already has an assigned key
+     */
+    private hasOptimizedKey;
+    /**
+     * Cleans up stale keys and manages the recycle pool size.
+     * This ensures we don't maintain references to items that are no longer in the dataset,
+     * and limits the number of recycled items to avoid excessive memory usage.
+     */
+    private cleanup;
+    /**
+     * Places a key back into its type-specific recycle pool for future reuse
+     */
+    private recycleKey;
+    /**
+     * Returns the current render stack containing all active keys and their metadata
+     */
+    getRenderStack(): Map<string, {
+        itemType: string;
+        index: number;
+        stableId: string;
+    }>;
+    /**
+     * Syncs an individual item by assigning it an appropriate key.
+     * Will use an existing key if available, or generate a new one.
+     *
+     * @returns The key assigned to the item
+     */
+    private syncItem;
+    /**
+     * Clears all recycled keys from the pool, effectively resetting the recycling system.
+     * This operation does not affect currently active keys.
+     */
+    private clearRecyclePool;
+    /**
+     * Generates a unique sequential key using an internal counter.
+     * @returns A unique key as a string
+     */
+    private generateKey;
+    /**
+     * Removes a specific key from its type's recycle pool
+     */
+    private deleteKeyFromRecyclePool;
+    /**
+     * Gets or creates a recycle pool for a specific item type
+     */
+    private getRecyclePoolForType;
+    /**
+     * Retrieves and removes a key from the type's recycle pool
+     * @returns A recycled key or undefined if none available
+     */
+    private getKeyFromRecyclePool;
+}
+//# sourceMappingURL=RenderStackManager.d.ts.map

package/dist/recyclerview/RenderStackManager.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RenderStackManager.d.ts","sourceRoot":"","sources":["../../src/recyclerview/RenderStackManager.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,8BAA8B,CAAC;AAElE;;;;GAIG;AACH,qBAAa,kBAAkB;IACtB,gBAAgB,UAAS;IAGhC,OAAO,CAAC,qBAAqB,CAAS;IAGtC,OAAO,CAAC,eAAe,CAA2B;IAGlD,OAAO,CAAC,MAAM,CAGZ;IAGF,OAAO,CAAC,WAAW,CAAsB;IAGzC,OAAO,CAAC,UAAU,CAAS;IAE3B,OAAO,CAAC,kBAAkB,CAAc;IAExC;;OAEG;gBACS,qBAAqB,GAAE,MAAgC;IASnE;;;;;;;;;;;;OAYG;IACI,IAAI,CACT,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,EACtC,WAAW,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,EACtC,cAAc,EAAE,kBAAkB,EAClC,UAAU,EAAE,MAAM;IAmEpB;;OAEG;IACH,OAAO,CAAC,eAAe;IAIvB;;;;OAIG;IACH,OAAO,CAAC,OAAO;IA8Df;;OAEG;IACH,OAAO,CAAC,UAAU;IAkBlB;;OAEG;IACI,cAAc;kBA7MP,MAAM;eAAS,MAAM;kBAAY,MAAM;;IAiNrD;;;;;OAKG;IACH,OAAO,CAAC,QAAQ;IA+BhB;;;OAGG;IACH,OAAO,CAAC,gBAAgB;IAOxB;;;OAGG;IACH,OAAO,CAAC,WAAW;IAInB;;OAEG;IACH,OAAO,CAAC,wBAAwB;IAIhC;;OAEG;IACH,OAAO,CAAC,qBAAqB;IAS7B;;;OAGG;IACH,OAAO,CAAC,qBAAqB;CAS9B"}

package/dist/recyclerview/RenderStackManager.js

@@ -0,0 +1,343 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RenderStackManager = void 0;
+var tslib_1 = require("tslib");
+/**
+ * Manages the recycling of rendered items in a virtualized list.
+ * This class handles tracking, recycling, and reusing item keys to optimize
+ * rendering performance by minimizing creation/destruction of components.
+ */
+var RenderStackManager = /** @class */ (function () {
+    /**
+     * @param maxItemsInRecyclePool - Maximum number of items that can be in the recycle pool
+     */
+    function RenderStackManager(maxItemsInRecyclePool) {
+        if (maxItemsInRecyclePool === void 0) { maxItemsInRecyclePool = Number.MAX_SAFE_INTEGER; }
+        this.disableRecycling = false;
+        this.maxItemsInRecyclePool = maxItemsInRecyclePool;
+        this.recycleKeyPools = new Map();
+        this.keyMap = new Map();
+        this.stableIdMap = new Map();
+        this.keyCounter = 0;
+        this.unProcessedIndices = new Set();
+    }
+    /**
+     * Synchronizes the render stack with the current state of data.
+     * This method is the core orchestrator that:
+     * 1. Recycles keys for items that are no longer valid
+     * 2. Updates existing keys for items that remain visible
+     * 3. Assigns new keys for newly visible items
+     * 4. Cleans up excess items to maintain the recycling pool size
+     *
+     * @param getStableId - Function to get a stable identifier for an item at a specific index
+     * @param getItemType - Function to get the type of an item at a specific index
+     * @param engagedIndices - Collection of indices that are currently visible or engaged
+     * @param dataLength - Total length of the data set
+     */
+    RenderStackManager.prototype.sync = function (getStableId, getItemType, engagedIndices, dataLength) {
+        var e_1, _a, e_2, _b, e_3, _c, e_4, _d, e_5, _e;
+        var _this = this;
+        this.clearRecyclePool();
+        this.unProcessedIndices.clear();
+        // Recycle keys for items that are no longer valid or visible
+        this.keyMap.forEach(function (keyInfo, key) {
+            var index = keyInfo.index, stableId = keyInfo.stableId, itemType = keyInfo.itemType;
+            if (index >= dataLength) {
+                _this.recycleKey(key);
+                return;
+            }
+            if (!_this.disableRecycling) {
+                _this.unProcessedIndices.add(index);
+            }
+            if (!engagedIndices.includes(index)) {
+                _this.recycleKey(key);
+                return;
+            }
+            var newStableId = getStableId(index);
+            var newItemType = getItemType(index);
+            if (stableId !== newStableId || itemType !== newItemType) {
+                _this.recycleKey(key);
+            }
+        });
+        try {
+            // First pass: process items that already have optimized keys
+            for (var engagedIndices_1 = tslib_1.__values(engagedIndices), engagedIndices_1_1 = engagedIndices_1.next(); !engagedIndices_1_1.done; engagedIndices_1_1 = engagedIndices_1.next()) {
+                var index = engagedIndices_1_1.value;
+                if (this.hasOptimizedKey(getStableId(index))) {
+                    this.syncItem(index, getItemType(index), getStableId(index));
+                }
+            }
+        }
+        catch (e_1_1) { e_1 = { error: e_1_1 }; }
+        finally {
+            try {
+                if (engagedIndices_1_1 && !engagedIndices_1_1.done && (_a = engagedIndices_1.return)) _a.call(engagedIndices_1);
+            }
+            finally { if (e_1) throw e_1.error; }
+        }
+        try {
+            // Second pass: process remaining items that need new keys
+            for (var engagedIndices_2 = tslib_1.__values(engagedIndices), engagedIndices_2_1 = engagedIndices_2.next(); !engagedIndices_2_1.done; engagedIndices_2_1 = engagedIndices_2.next()) {
+                var index = engagedIndices_2_1.value;
+                if (!this.hasOptimizedKey(getStableId(index))) {
+                    this.syncItem(index, getItemType(index), getStableId(index));
+                }
+            }
+        }
+        catch (e_2_1) { e_2 = { error: e_2_1 }; }
+        finally {
+            try {
+                if (engagedIndices_2_1 && !engagedIndices_2_1.done && (_b = engagedIndices_2.return)) _b.call(engagedIndices_2);
+            }
+            finally { if (e_2) throw e_2.error; }
+        }
+        // create indices that are not in the engagedIndices and less than dataLength
+        // select only indices that are not in the engagedIndices
+        var validIndicesInPool = [];
+        try {
+            for (var _f = tslib_1.__values(this.keyMap.values()), _g = _f.next(); !_g.done; _g = _f.next()) {
+                var keyInfo = _g.value;
+                var index = keyInfo.index;
+                if (index < dataLength && !engagedIndices.includes(index)) {
+                    validIndicesInPool.push(index);
+                }
+            }
+        }
+        catch (e_3_1) { e_3 = { error: e_3_1 }; }
+        finally {
+            try {
+                if (_g && !_g.done && (_c = _f.return)) _c.call(_f);
+            }
+            finally { if (e_3) throw e_3.error; }
+        }
+        try {
+            // First pass: process items that already have optimized keys
+            for (var validIndicesInPool_1 = tslib_1.__values(validIndicesInPool), validIndicesInPool_1_1 = validIndicesInPool_1.next(); !validIndicesInPool_1_1.done; validIndicesInPool_1_1 = validIndicesInPool_1.next()) {
+                var index = validIndicesInPool_1_1.value;
+                if (this.hasOptimizedKey(getStableId(index))) {
+                    this.syncItem(index, getItemType(index), getStableId(index));
+                }
+            }
+        }
+        catch (e_4_1) { e_4 = { error: e_4_1 }; }
+        finally {
+            try {
+                if (validIndicesInPool_1_1 && !validIndicesInPool_1_1.done && (_d = validIndicesInPool_1.return)) _d.call(validIndicesInPool_1);
+            }
+            finally { if (e_4) throw e_4.error; }
+        }
+        try {
+            for (var validIndicesInPool_2 = tslib_1.__values(validIndicesInPool), validIndicesInPool_2_1 = validIndicesInPool_2.next(); !validIndicesInPool_2_1.done; validIndicesInPool_2_1 = validIndicesInPool_2.next()) {
+                var index = validIndicesInPool_2_1.value;
+                if (!this.hasOptimizedKey(getStableId(index))) {
+                    this.syncItem(index, getItemType(index), getStableId(index));
+                }
+            }
+        }
+        catch (e_5_1) { e_5 = { error: e_5_1 }; }
+        finally {
+            try {
+                if (validIndicesInPool_2_1 && !validIndicesInPool_2_1.done && (_e = validIndicesInPool_2.return)) _e.call(validIndicesInPool_2);
+            }
+            finally { if (e_5) throw e_5.error; }
+        }
+        // Clean up stale items and manage the recycle pool size
+        this.cleanup(getStableId, getItemType, engagedIndices, dataLength);
+    };
+    /**
+     * Checks if a stable ID already has an assigned key
+     */
+    RenderStackManager.prototype.hasOptimizedKey = function (stableId) {
+        return this.stableIdMap.has(stableId);
+    };
+    /**
+     * Cleans up stale keys and manages the recycle pool size.
+     * This ensures we don't maintain references to items that are no longer in the dataset,
+     * and limits the number of recycled items to avoid excessive memory usage.
+     */
+    RenderStackManager.prototype.cleanup = function (getStableId, getItemType, engagedIndices, dataLength) {
+        var e_6, _a, e_7, _b;
+        var itemsToDelete = new Array();
+        try {
+            // Remove items that are no longer in the dataset
+            for (var _c = tslib_1.__values(this.keyMap.entries()), _d = _c.next(); !_d.done; _d = _c.next()) {
+                var _e = tslib_1.__read(_d.value, 2), key = _e[0], keyInfo = _e[1];
+                var index = keyInfo.index, itemType = keyInfo.itemType, stableId = keyInfo.stableId;
+                var indexOutOfBounds = index >= dataLength;
+                var hasStableIdChanged = !indexOutOfBounds && getStableId(index) !== stableId;
+                if (indexOutOfBounds || hasStableIdChanged) {
+                    var nextIndex = this.unProcessedIndices.values().next().value;
+                    var shouldDeleteKey = true;
+                    if (nextIndex !== undefined) {
+                        var nextItemType = getItemType(nextIndex);
+                        var nextStableId = getStableId(nextIndex);
+                        if (itemType === nextItemType) {
+                            this.syncItem(nextIndex, nextItemType, nextStableId);
+                            shouldDeleteKey = false;
+                        }
+                    }
+                    if (shouldDeleteKey) {
+                        this.deleteKeyFromRecyclePool(itemType, key);
+                        this.stableIdMap.delete(stableId);
+                        itemsToDelete.push(key);
+                    }
+                }
+            }
+        }
+        catch (e_6_1) { e_6 = { error: e_6_1 }; }
+        finally {
+            try {
+                if (_d && !_d.done && (_a = _c.return)) _a.call(_c);
+            }
+            finally { if (e_6) throw e_6.error; }
+        }
+        try {
+            for (var itemsToDelete_1 = tslib_1.__values(itemsToDelete), itemsToDelete_1_1 = itemsToDelete_1.next(); !itemsToDelete_1_1.done; itemsToDelete_1_1 = itemsToDelete_1.next()) {
+                var key = itemsToDelete_1_1.value;
+                this.keyMap.delete(key);
+            }
+        }
+        catch (e_7_1) { e_7 = { error: e_7_1 }; }
+        finally {
+            try {
+                if (itemsToDelete_1_1 && !itemsToDelete_1_1.done && (_b = itemsToDelete_1.return)) _b.call(itemsToDelete_1);
+            }
+            finally { if (e_7) throw e_7.error; }
+        }
+        // Limit the size of the recycle pool
+        var itemsRenderedForRecycling = this.keyMap.size - engagedIndices.length;
+        if (itemsRenderedForRecycling > this.maxItemsInRecyclePool) {
+            var deleteCount = itemsRenderedForRecycling - this.maxItemsInRecyclePool;
+            var deleted = 0;
+            // Use a for loop so we can break early once we've deleted enough items
+            var entries = Array.from(this.keyMap.entries()).reverse();
+            for (var i = 0; i < entries.length && deleted < deleteCount; i++) {
+                var _f = tslib_1.__read(entries[i], 2), key = _f[0], keyInfo = _f[1];
+                var index = keyInfo.index, itemType = keyInfo.itemType, stableId = keyInfo.stableId;
+                if (!engagedIndices.includes(index)) {
+                    this.deleteKeyFromRecyclePool(itemType, key);
+                    this.stableIdMap.delete(stableId);
+                    this.keyMap.delete(key);
+                    deleted++;
+                }
+            }
+        }
+    };
+    /**
+     * Places a key back into its type-specific recycle pool for future reuse
+     */
+    RenderStackManager.prototype.recycleKey = function (key) {
+        if (this.disableRecycling) {
+            return;
+        }
+        var keyInfo = this.keyMap.get(key);
+        if (!keyInfo) {
+            return;
+        }
+        var itemType = keyInfo.itemType;
+        // Add key back to its type's pool
+        var pool = this.getRecyclePoolForType(itemType);
+        pool.add(key);
+    };
+    /**
+     * Returns the current render stack containing all active keys and their metadata
+     */
+    RenderStackManager.prototype.getRenderStack = function () {
+        return this.keyMap;
+    };
+    /**
+     * Syncs an individual item by assigning it an appropriate key.
+     * Will use an existing key if available, or generate a new one.
+     *
+     * @returns The key assigned to the item
+     */
+    RenderStackManager.prototype.syncItem = function (index, itemType, stableId) {
+        // Try to reuse an existing key, or get one from the recycle pool, or generate a new one
+        var newKey = this.stableIdMap.get(stableId) ||
+            this.getKeyFromRecyclePool(itemType) ||
+            this.generateKey();
+        this.unProcessedIndices.delete(index);
+        var keyInfo = this.keyMap.get(newKey);
+        if (keyInfo) {
+            // Update an existing key's metadata
+            this.deleteKeyFromRecyclePool(itemType, newKey);
+            this.deleteKeyFromRecyclePool(keyInfo.itemType, newKey);
+            this.stableIdMap.delete(keyInfo.stableId);
+            keyInfo.index = index;
+            keyInfo.itemType = itemType;
+            keyInfo.stableId = stableId;
+        }
+        else {
+            // Create a new entry in the key map
+            this.keyMap.set(newKey, {
+                itemType: itemType,
+                index: index,
+                stableId: stableId,
+            });
+        }
+        this.stableIdMap.set(stableId, newKey);
+        return newKey;
+    };
+    /**
+     * Clears all recycled keys from the pool, effectively resetting the recycling system.
+     * This operation does not affect currently active keys.
+     */
+    RenderStackManager.prototype.clearRecyclePool = function () {
+        var e_8, _a;
+        try {
+            // iterate over all pools and clear them
+            for (var _b = tslib_1.__values(this.recycleKeyPools.values()), _c = _b.next(); !_c.done; _c = _b.next()) {
+                var pool = _c.value;
+                pool.clear();
+            }
+        }
+        catch (e_8_1) { e_8 = { error: e_8_1 }; }
+        finally {
+            try {
+                if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+            }
+            finally { if (e_8) throw e_8.error; }
+        }
+    };
+    /**
+     * Generates a unique sequential key using an internal counter.
+     * @returns A unique key as a string
+     */
+    RenderStackManager.prototype.generateKey = function () {
+        return (this.keyCounter++).toString();
+    };
+    /**
+     * Removes a specific key from its type's recycle pool
+     */
+    RenderStackManager.prototype.deleteKeyFromRecyclePool = function (itemType, key) {
+        var _a;
+        (_a = this.recycleKeyPools.get(itemType)) === null || _a === void 0 ? void 0 : _a.delete(key);
+    };
+    /**
+     * Gets or creates a recycle pool for a specific item type
+     */
+    RenderStackManager.prototype.getRecyclePoolForType = function (itemType) {
+        var pool = this.recycleKeyPools.get(itemType);
+        if (!pool) {
+            pool = new Set();
+            this.recycleKeyPools.set(itemType, pool);
+        }
+        return pool;
+    };
+    /**
+     * Retrieves and removes a key from the type's recycle pool
+     * @returns A recycled key or undefined if none available
+     */
+    RenderStackManager.prototype.getKeyFromRecyclePool = function (itemType) {
+        var pool = this.getRecyclePoolForType(itemType);
+        if (pool.size > 0) {
+            var key = pool.values().next().value;
+            pool.delete(key);
+            return key;
+        }
+        return undefined;
+    };
+    return RenderStackManager;
+}());
+exports.RenderStackManager = RenderStackManager;
+//# sourceMappingURL=RenderStackManager.js.map

package/dist/recyclerview/RenderStackManager.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RenderStackManager.js","sourceRoot":"","sources":["../../src/recyclerview/RenderStackManager.ts"],"names":[],"mappings":"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"}

package/dist/recyclerview/ViewHolder.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ViewHolder.d.ts","sourceRoot":"","sources":["../../src/recyclerview/ViewHolder.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAGH,OAAO,KAAK,EAAE,EACZ,SAAS,EAKV,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEjE,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AACxE,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAErD;;;GAGG;AACH,MAAM,WAAW,eAAe,CAAC,KAAK;IACpC,0CAA0C;IAC1C,KAAK,EAAE,MAAM,CAAC;IACd,6DAA6D;IAC7D,MAAM,EAAE,QAAQ,CAAC;IACjB,qEAAqE;IACrE,SAAS,EAAE,GAAG,CAAC,MAAM,EAAE,SAAS,CAAC,UAAU,GAAG,IAAI,CAAC,CAAC,CAAC;IACrD,uEAAuE;IACvE,SAAS,EAAE,GAAG,CAAC;IACf,oEAAoE;IACpE,MAAM,EAAE,YAAY,CAAC;IACrB,0CAA0C;IAC1C,IAAI,EAAE,KAAK,CAAC;IACZ,+DAA+D;IAC/D,YAAY,EAAE,KAAK,GAAG,SAAS,CAAC;IAChC,0CAA0C;IAC1C,UAAU,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC,YAAY,CAAC,CAAC;IAChD,kDAAkD;IAClD,qBAAqB,CAAC,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC,uBAAuB,CAAC,CAAC;IACvE,iDAAiD;IACjD,sBAAsB,CAAC,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC,wBAAwB,CAAC,CAAC;IACzE,iDAAiD;IACjD,UAAU,CAAC,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC,YAAY,CAAC,CAAC;IACjD,4CAA4C;IAC5C,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC;CAC5D;AA8ED;;;GAGG;AACH,eAAO,MAAM,UAAU,0FAmBtB,CAAC"}
+{"version":3,"file":"ViewHolder.d.ts","sourceRoot":"","sources":["../../src/recyclerview/ViewHolder.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAGH,OAAO,KAAK,EAAE,EACZ,SAAS,EAKV,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEjE,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AACxE,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAErD;;;GAGG;AACH,MAAM,WAAW,eAAe,CAAC,KAAK;IACpC,0CAA0C;IAC1C,KAAK,EAAE,MAAM,CAAC;IACd,6DAA6D;IAC7D,MAAM,EAAE,QAAQ,CAAC;IACjB,qEAAqE;IACrE,SAAS,EAAE,GAAG,CAAC,MAAM,EAAE,SAAS,CAAC,UAAU,GAAG,IAAI,CAAC,CAAC,CAAC;IACrD,uEAAuE;IACvE,SAAS,EAAE,GAAG,CAAC;IACf,oEAAoE;IACpE,MAAM,EAAE,YAAY,CAAC;IACrB,0CAA0C;IAC1C,IAAI,EAAE,KAAK,CAAC;IACZ,+DAA+D;IAC/D,YAAY,EAAE,KAAK,GAAG,SAAS,CAAC;IAChC,0CAA0C;IAC1C,UAAU,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC,YAAY,CAAC,CAAC;IAChD,kDAAkD;IAClD,qBAAqB,CAAC,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC,uBAAuB,CAAC,CAAC;IACvE,iDAAiD;IACjD,sBAAsB,CAAC,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC,wBAAwB,CAAC,CAAC;IACzE,iDAAiD;IACjD,UAAU,CAAC,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC,YAAY,CAAC,CAAC;IACjD,4CAA4C;IAC5C,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC;CAC5D;AAqFD;;;GAGG;AACH,eAAO,MAAM,UAAU,8BAnFK,KAAK,SAAU,eAAe,CAAC,KAAK,CAAC,wBAsGhE,CAAC"}

package/dist/recyclerview/ViewHolder.js

@@ -29,13 +29,16 @@ var ViewHolderInternal = function (props) {
         onSizeChanged === null || onSizeChanged === void 0 ? void 0 : onSizeChanged(index, event.nativeEvent.layout);
     }, [index, onSizeChanged]);
     var separator = (0, react_1.useMemo)(function () {
-        return ItemSeparatorComponent ? (react_1.default.createElement(ItemSeparatorComponent, { leadingItem: item, trailingItem: trailingItem })) : null;
+        return ItemSeparatorComponent && trailingItem !== undefined ? (react_1.default.createElement(ItemSeparatorComponent, { leadingItem: item, trailingItem: trailingItem })) : null;
     }, [ItemSeparatorComponent, item, trailingItem]);
-    //console.log("ViewHolder re-render", index);
+    // console.log("ViewHolder re-render", index);
     var children = (0, react_1.useMemo)(function () {
         var _a;
         return (_a = renderItem === null || renderItem === void 0 ? void 0 : renderItem({ item: item, index: index, extraData: extraData, target: target })) !== null && _a !== void 0 ? _a : null;
-    }, [item, index, extraData, target, renderItem]);
+        // TODO: Test more thoroughly
+        // We don't really  to re-render the children when the index changes
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [item, extraData, target, renderItem]);
     var style = {
         flexDirection: horizontal ? "row" : "column",
         position: target === "StickyHeader" ? "relative" : "absolute",
@@ -47,11 +50,10 @@ var ViewHolderInternal = function (props) {
         maxWidth: layout.maxWidth,
         left: layout.x,
         top: layout.y,
-        zIndex: 0,
     };
-    //TODO: Fix this type issue
+    // TODO: Fix this type issue
     var CompatContainer = (CellRendererComponent !== null && CellRendererComponent !== void 0 ? CellRendererComponent : CompatView_1.CompatView);
-    return (react_1.default.createElement(CompatContainer, { ref: viewRef, onLayout: onLayout, style: style },
+    return (react_1.default.createElement(CompatContainer, { ref: viewRef, onLayout: onLayout, style: style, index: index },
         children,
         separator));
 };

package/dist/recyclerview/ViewHolder.js.map

@@ -1 +1 @@
-{"version":3,"file":"ViewHolder.js","sourceRoot":"","sources":["../../src/recyclerview/ViewHolder.tsx"],"names":[],"mappings":";AAAA;;;;GAIG;;;;AAGH,qDAMe;AAKf,sDAAqD;AAiCrD;;;GAGG;AACH,IAAM,kBAAkB,GAAG,UAAS,KAA6B;IAC/D,sBAAsB;IACtB,IAAM,OAAO,GAAG,IAAA,cAAM,EAAa,IAAI,CAAC,CAAC;IAEvC,IAAA,KAAK,GAYH,KAAK,MAZF,EACL,SAAS,GAWP,KAAK,UAXE,EACT,MAAM,GAUJ,KAAK,OAVD,EACN,aAAa,GASX,KAAK,cATM,EACb,UAAU,GAQR,KAAK,WARG,EACV,SAAS,GAOP,KAAK,UAPE,EACT,IAAI,GAMF,KAAK,KANH,EACJ,MAAM,GAKJ,KAAK,OALD,EACN,qBAAqB,GAInB,KAAK,sBAJc,EACrB,sBAAsB,GAGpB,KAAK,uBAHe,EACtB,YAAY,GAEV,KAAK,aAFK,EACZ,UAAU,GACR,KAAK,WADG,CACF;IAEV,IAAA,uBAAe,EAAC;QACd,SAAS,CAAC,GAAG,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC;QAC9B,OAAO;YACL,IAAI,SAAS,CAAC,GAAG,CAAC,KAAK,CAAC,KAAK,OAAO,EAAE;gBACpC,SAAS,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;aACzB;QACH,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC;IAEvB,IAAM,QAAQ,GAAG,IAAA,mBAAW,EAC1B,UAAC,KAAwB;QACvB,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAG,KAAK,EAAE,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;IACnD,CAAC,EACD,CAAC,KAAK,EAAE,aAAa,CAAC,CACvB,CAAC;IAEF,IAAM,SAAS,GAAG,IAAA,eAAO,EAAC;QACxB,OAAO,sBAAsB,CAAC,CAAC,CAAC,CAC9B,8BAAC,sBAAsB,IAAC,WAAW,EAAE,IAAI,EAAE,YAAY,EAAE,YAAY,GAAI,CAC1E,CAAC,CAAC,CAAC,IAAI,CAAC;IACX,CAAC,EAAE,CAAC,sBAAsB,EAAE,IAAI,EAAE,YAAY,CAAC,CAAC,CAAC;IAEjD,6CAA6C;IAE7C,IAAM,QAAQ,GAAG,IAAA,eAAO,EAAC;;QACvB,OAAO,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAG,EAAE,IAAI,MAAA,EAAE,KAAK,OAAA,EAAE,SAAS,WAAA,EAAE,MAAM,QAAA,EAAE,CAAC,mCAAI,IAAI,CAAC;IAClE,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,UAAU,CAAC,CAAC,CAAC;IAEjD,IAAM,KAAK,GAAG;QACZ,aAAa,EAAE,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ;QAC5C,QAAQ,EAAE,MAAM,KAAK,cAAc,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,UAAU;QAC7D,KAAK,EAAE,MAAM,CAAC,aAAa,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS;QACtD,MAAM,EAAE,MAAM,CAAC,cAAc,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS;QACzD,SAAS,EAAE,MAAM,CAAC,SAAS;QAC3B,QAAQ,EAAE,MAAM,CAAC,QAAQ;QACzB,SAAS,EAAE,MAAM,CAAC,SAAS;QAC3B,QAAQ,EAAE,MAAM,CAAC,QAAQ;QACzB,IAAI,EAAE,MAAM,CAAC,CAAC;QACd,GAAG,EAAE,MAAM,CAAC,CAAC;QACb,MAAM,EAAE,CAAC;KACD,CAAC;IAEX,2BAA2B;IAC3B,IAAM,eAAe,GAAG,CAAC,qBAAqB,aAArB,qBAAqB,cAArB,qBAAqB,GAC5C,uBAAU,CAAmB,CAAC;IAEhC,OAAO,CACL,8BAAC,eAAe,IAAC,GAAG,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK;QAC5D,QAAQ;QACR,SAAS,CACM,CACnB,CAAC;AACJ,CAAC,CAAC;AAEF;;;GAGG;AACU,QAAA,UAAU,GAAG,eAAK,CAAC,IAAI,CAClC,kBAAkB,EAClB,UAAC,SAAS,EAAE,SAAS;IACnB,sCAAsC;IACtC,OAAO,CACL,SAAS,CAAC,KAAK,KAAK,SAAS,CAAC,KAAK;QACnC,eAAe,CAAC,SAAS,CAAC,MAAM,EAAE,SAAS,CAAC,MAAM,CAAC;QACnD,SAAS,CAAC,SAAS,KAAK,SAAS,CAAC,SAAS;QAC3C,SAAS,CAAC,aAAa,KAAK,SAAS,CAAC,aAAa;QACnD,SAAS,CAAC,SAAS,KAAK,SAAS,CAAC,SAAS;QAC3C,SAAS,CAAC,MAAM,KAAK,SAAS,CAAC,MAAM;QACrC,SAAS,CAAC,IAAI,KAAK,SAAS,CAAC,IAAI;QACjC,SAAS,CAAC,UAAU,KAAK,SAAS,CAAC,UAAU;QAC7C,SAAS,CAAC,qBAAqB,KAAK,SAAS,CAAC,qBAAqB;QACnE,SAAS,CAAC,sBAAsB,KAAK,SAAS,CAAC,sBAAsB;QACrE,SAAS,CAAC,YAAY,KAAK,SAAS,CAAC,YAAY;QACjD,SAAS,CAAC,UAAU,KAAK,SAAS,CAAC,UAAU,CAC9C,CAAC;AACJ,CAAC,CACF,CAAC;AAEF;;;;;;GAMG;AACH,SAAS,eAAe,CAAC,UAAoB,EAAE,UAAoB;IACjE,OAAO,CACL,UAAU,CAAC,CAAC,KAAK,UAAU,CAAC,CAAC;QAC7B,UAAU,CAAC,CAAC,KAAK,UAAU,CAAC,CAAC;QAC7B,UAAU,CAAC,KAAK,KAAK,UAAU,CAAC,KAAK;QACrC,UAAU,CAAC,MAAM,KAAK,UAAU,CAAC,MAAM;QACvC,UAAU,CAAC,aAAa,KAAK,UAAU,CAAC,aAAa;QACrD,UAAU,CAAC,cAAc,KAAK,UAAU,CAAC,cAAc;QACvD,UAAU,CAAC,QAAQ,KAAK,UAAU,CAAC,QAAQ;QAC3C,UAAU,CAAC,SAAS,KAAK,UAAU,CAAC,SAAS;QAC7C,UAAU,CAAC,QAAQ,KAAK,UAAU,CAAC,QAAQ;QAC3C,UAAU,CAAC,SAAS,KAAK,UAAU,CAAC,SAAS,CAC9C,CAAC;AACJ,CAAC"}
+{"version":3,"file":"ViewHolder.js","sourceRoot":"","sources":["../../src/recyclerview/ViewHolder.tsx"],"names":[],"mappings":"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"}

package/dist/recyclerview/ViewHolderCollection.d.ts

@@ -4,9 +4,9 @@
  * and coordinates with the RecyclerView context for layout changes.
  */
 import React from "react";
+import { FlashListProps } from "../FlashListProps";
 import { ViewHolderProps } from "./ViewHolder";
 import { RVDimension, RVLayout } from "./layout-managers/LayoutManager";
-import { FlashListProps } from "../FlashListProps";
 /**
  * Props interface for the ViewHolderCollection component
  * @template TItem - The type of items in the data array
@@ -15,7 +15,9 @@ export interface ViewHolderCollectionProps<TItem> {
     /** The data array to be rendered */
     data: FlashListProps<TItem>["data"];
     /** Map of indices to React keys for each rendered item */
-    renderStack: Map<number, string>;
+    renderStack: Map<string, {
+        index: number;
+    }>;
     /** Function to get layout information for a specific index */
     getLayout: (index: number) => RVLayout;
     /** Ref to control layout updates from parent components */
@@ -31,15 +33,19 @@ export interface ViewHolderCollectionProps<TItem> {
     /** Function to get the container's layout dimensions */
     getChildContainerLayout: () => RVDimension | undefined;
     /** Callback after layout effects are committed */
-    onCommitLayoutEffect?: () => void;
+    onCommitLayoutEffect: () => void;
     /** Callback after effects are committed */
-    onCommitEffect?: () => void;
+    onCommitEffect: () => void;
     /** Optional custom component to wrap each item */
     CellRendererComponent?: FlashListProps<TItem>["CellRendererComponent"];
     /** Optional component to render between items */
     ItemSeparatorComponent?: FlashListProps<TItem>["ItemSeparatorComponent"];
     /** Whether the list is horizontal or vertical */
     horizontal: FlashListProps<TItem>["horizontal"];
+    /** Function to get the adjustment margin for the container.
+     * For startRenderingFromBottom, we need to adjust the height of the container
+     */
+    getAdjustmentMargin: () => number;
 }
 /**
  * Ref interface for ViewHolderCollection that exposes methods to control layout updates

package/dist/recyclerview/ViewHolderCollection.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ViewHolderCollection.d.ts","sourceRoot":"","sources":["../../src/recyclerview/ViewHolderCollection.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAA0D,MAAM,OAAO,CAAC;AAC/E,OAAO,EAAc,eAAe,EAAE,MAAM,cAAc,CAAC;AAC3D,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AACxE,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAInD;;;GAGG;AACH,MAAM,WAAW,yBAAyB,CAAC,KAAK;IAC9C,oCAAoC;IACpC,IAAI,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,CAAC;IACpC,0DAA0D;IAC1D,WAAW,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACjC,8DAA8D;IAC9D,SAAS,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,QAAQ,CAAC;IACvC,2DAA2D;IAC3D,uBAAuB,EAAE,KAAK,CAAC,GAAG,CAAC,uBAAuB,CAAC,CAAC;IAC5D,qDAAqD;IACrD,SAAS,EAAE,eAAe,CAAC,KAAK,CAAC,CAAC,WAAW,CAAC,CAAC;IAC/C,4CAA4C;IAC5C,aAAa,EAAE,eAAe,CAAC,KAAK,CAAC,CAAC,eAAe,CAAC,CAAC;IACvD,mCAAmC;IACnC,UAAU,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC,YAAY,CAAC,CAAC;IAChD,uEAAuE;IACvE,SAAS,EAAE,GAAG,CAAC;IACf,wDAAwD;IACxD,uBAAuB,EAAE,MAAM,WAAW,GAAG,SAAS,CAAC;IACvD,kDAAkD;IAClD,oBAAoB,CAAC,EAAE,MAAM,IAAI,CAAC;IAClC,2CAA2C;IAC3C,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,kDAAkD;IAClD,qBAAqB,CAAC,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC,uBAAuB,CAAC,CAAC;IACvE,iDAAiD;IACjD,sBAAsB,CAAC,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC,wBAAwB,CAAC,CAAC;IACzE,iDAAiD;IACjD,UAAU,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC,YAAY,CAAC,CAAC;CACjD;AAED;;GAEG;AACH,MAAM,WAAW,uBAAuB;IACtC,uDAAuD;IACvD,YAAY,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED;;;;GAIG;AACH,eAAO,MAAM,oBAAoB,uEAsGhC,CAAC"}
+{"version":3,"file":"ViewHolderCollection.d.ts","sourceRoot":"","sources":["../../src/recyclerview/ViewHolderCollection.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAA0D,MAAM,OAAO,CAAC;AAE/E,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAEnD,OAAO,EAAc,eAAe,EAAE,MAAM,cAAc,CAAC;AAC3D,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AAIxE;;;GAGG;AACH,MAAM,WAAW,yBAAyB,CAAC,KAAK;IAC9C,oCAAoC;IACpC,IAAI,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,CAAC;IACpC,0DAA0D;IAC1D,WAAW,EAAE,GAAG,CAAC,MAAM,EAAE;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC5C,8DAA8D;IAC9D,SAAS,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,QAAQ,CAAC;IACvC,2DAA2D;IAC3D,uBAAuB,EAAE,KAAK,CAAC,GAAG,CAAC,uBAAuB,CAAC,CAAC;IAC5D,qDAAqD;IACrD,SAAS,EAAE,eAAe,CAAC,KAAK,CAAC,CAAC,WAAW,CAAC,CAAC;IAC/C,4CAA4C;IAC5C,aAAa,EAAE,eAAe,CAAC,KAAK,CAAC,CAAC,eAAe,CAAC,CAAC;IACvD,mCAAmC;IACnC,UAAU,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC,YAAY,CAAC,CAAC;IAChD,uEAAuE;IACvE,SAAS,EAAE,GAAG,CAAC;IACf,wDAAwD;IACxD,uBAAuB,EAAE,MAAM,WAAW,GAAG,SAAS,CAAC;IACvD,kDAAkD;IAClD,oBAAoB,EAAE,MAAM,IAAI,CAAC;IACjC,2CAA2C;IAC3C,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,kDAAkD;IAClD,qBAAqB,CAAC,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC,uBAAuB,CAAC,CAAC;IACvE,iDAAiD;IACjD,sBAAsB,CAAC,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC,wBAAwB,CAAC,CAAC;IACzE,iDAAiD;IACjD,UAAU,EAAE,cAAc,CAAC,KAAK,CAAC,CAAC,YAAY,CAAC,CAAC;IAChD;;OAEG;IACH,mBAAmB,EAAE,MAAM,MAAM,CAAC;CACnC;AAED;;GAEG;AACH,MAAM,WAAW,uBAAuB;IACtC,uDAAuD;IACvD,YAAY,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED;;;;GAIG;AACH,eAAO,MAAM,oBAAoB,GAAI,KAAK,EACxC,OAAO,yBAAyB,CAAC,KAAK,CAAC,sBA4HxC,CAAC"}

package/dist/recyclerview/ViewHolderCollection.js

@@ -17,10 +17,9 @@ var RecyclerViewContextProvider_1 = require("./RecyclerViewContextProvider");
  * @template TItem - The type of items in the data array
  */
 var ViewHolderCollection = function (props) {
-    var data = props.data, renderStack = props.renderStack, getLayout = props.getLayout, refHolder = props.refHolder, onSizeChanged = props.onSizeChanged, renderItem = props.renderItem, extraData = props.extraData, viewHolderCollectionRef = props.viewHolderCollectionRef, getChildContainerLayout = props.getChildContainerLayout, onCommitLayoutEffect = props.onCommitLayoutEffect, CellRendererComponent = props.CellRendererComponent, ItemSeparatorComponent = props.ItemSeparatorComponent, onCommitEffect = props.onCommitEffect, horizontal = props.horizontal;
+    var data = props.data, renderStack = props.renderStack, getLayout = props.getLayout, refHolder = props.refHolder, onSizeChanged = props.onSizeChanged, renderItem = props.renderItem, extraData = props.extraData, viewHolderCollectionRef = props.viewHolderCollectionRef, getChildContainerLayout = props.getChildContainerLayout, onCommitLayoutEffect = props.onCommitLayoutEffect, CellRendererComponent = props.CellRendererComponent, ItemSeparatorComponent = props.ItemSeparatorComponent, onCommitEffect = props.onCommitEffect, horizontal = props.horizontal, getAdjustmentMargin = props.getAdjustmentMargin;
     var _a = tslib_1.__read(react_1.default.useState(0), 2), renderId = _a[0], setRenderId = _a[1];
     var containerLayout = getChildContainerLayout();
-    // TODO: guard againt precision issues
     var fixedContainerSize = horizontal
         ? containerLayout === null || containerLayout === void 0 ? void 0 : containerLayout.height
         : containerLayout === null || containerLayout === void 0 ? void 0 : containerLayout.width;
@@ -33,16 +32,22 @@ var ViewHolderCollection = function (props) {
             // );
             recyclerViewContext === null || recyclerViewContext === void 0 ? void 0 : recyclerViewContext.layout();
         }
+        // we need to run this callback on when fixedContainerSize changes
+        // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [fixedContainerSize]);
     (0, react_1.useLayoutEffect)(function () {
         if (renderId > 0) {
             onCommitLayoutEffect === null || onCommitLayoutEffect === void 0 ? void 0 : onCommitLayoutEffect();
         }
+        // we need to run this callback on when renderId changes
+        // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [renderId]);
     (0, react_1.useEffect)(function () {
         if (renderId > 0) {
             onCommitEffect === null || onCommitEffect === void 0 ? void 0 : onCommitEffect();
         }
+        // we need to run this callback on when renderId changes
+        // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [renderId]);
     // Expose forceUpdate through ref
     (0, react_1.useImperativeHandle)(viewHolderCollectionRef, function () { return ({
@@ -50,20 +55,31 @@ var ViewHolderCollection = function (props) {
             // This will trigger a re-render of the component
             setRenderId(function (prev) { return prev + 1; });
         },
-    }); });
+    }); }, [setRenderId]);
     var hasData = data && data.length > 0;
     var containerStyle = {
         width: horizontal ? containerLayout === null || containerLayout === void 0 ? void 0 : containerLayout.width : undefined,
         height: containerLayout === null || containerLayout === void 0 ? void 0 : containerLayout.height,
+        marginTop: horizontal ? undefined : getAdjustmentMargin(),
+        marginLeft: horizontal ? getAdjustmentMargin() : undefined,
+        // TODO: Temp workaround, useLayoutEffect doesn't block paint in some cases
+        // We need to investigate why this is happening
+        opacity: renderId > 0 ? 1 : 0,
     };
-    return (react_1.default.createElement(CompatView_1.CompatView
-    // TODO: Take care of web scroll bar here
-    , { 
-        // TODO: Take care of web scroll bar here
-        style: hasData && containerStyle }, containerLayout &&
+    // sort by index and log
+    // const sortedRenderStack = Array.from(renderStack.entries()).sort(
+    //   ([, a], [, b]) => a.index - b.index
+    // );
+    // console.log(
+    //   "sortedRenderStack",
+    //   sortedRenderStack.map(([reactKey, { index }]) => {
+    //     return `${index} => ${reactKey}`;
+    //   })
+    // );
+    return (react_1.default.createElement(CompatView_1.CompatView, { style: hasData && containerStyle }, containerLayout &&
         hasData &&
-        Array.from(renderStack, function (_a) {
-            var _b = tslib_1.__read(_a, 2), index = _b[0], reactKey = _b[1];
+        Array.from(renderStack.entries(), function (_a) {
+            var _b = tslib_1.__read(_a, 2), reactKey = _b[0], index = _b[1].index;
             var item = data[index];
             var trailingItem = ItemSeparatorComponent
                 ? data[index + 1]