From febb5882ad9c14e8534b5d6d2b45343210a10925 Mon Sep 17 00:00:00 2001
From: Mohammad Tourjoman <mtourjoman0@gmail.com>
Date: Thu, 23 Jan 2025 22:07:34 -0800
Subject: [PATCH] fix: sticky header transform style should be applied to
 direct parent of rendered row

---
 src/FlashList.tsx | 34 ++++++++++++++++++----------------
 1 file changed, 18 insertions(+), 16 deletions(-)

diff --git a/src/FlashList.tsx b/src/FlashList.tsx
index 12ab36089..47548f5c6 100644
--- a/src/FlashList.tsx
+++ b/src/FlashList.tsx
@@ -671,7 +671,16 @@ class FlashList<T> extends React.PureComponent<
   };
 
   private rowRendererSticky = (index: number) => {
-    return this.rowRendererWithIndex(index, RenderTargetOptions.StickyHeader);
+    return (
+      <View
+        style={{
+          flexDirection: this.props.horizontal ? "row" : "column",
+          ...this.getTransform(),
+        }}
+      >
+        {this.rowRendererWithIndex(index, RenderTargetOptions.StickyHeader)}
+      </View>
+    );
   };
 
   private rowRendererWithIndex = (index: number, target: RenderTarget) => {
@@ -727,21 +736,14 @@ class FlashList<T> extends React.PureComponent<
     ___: any
   ) => {
     return (
-      <View
-        style={{
-          flexDirection: this.props.horizontal ? "row" : "column",
-          ...this.getTransform(),
-        }}
-      >
-        <PureComponentWrapper
-          ref={this.stickyContentRef}
-          enabled={this.isStickyEnabled}
-          // We're passing rowData to ensure that sticky headers are updated when data changes
-          rowData={rowData}
-          arg={index}
-          renderer={this.rowRendererSticky}
-        />
-      </View>
+      <PureComponentWrapper
+        ref={this.stickyContentRef}
+        enabled={this.isStickyEnabled}
+        // We're passing rowData to ensure that sticky headers are updated when data changes
+        rowData={rowData}
+        arg={index}
+        renderer={this.rowRendererSticky}
+      />
     );
   };