From 165aab590465f308c7f80de212482f775e558d24 Mon Sep 17 00:00:00 2001
From: paanSinghCoder <gaurav3017@gmail.com>
Date: Tue, 5 May 2026 15:13:42 +0530
Subject: [PATCH] fix(data-table): make virtualized loader rows scroll with
 content

Loader skeleton rows were pinned to the bottom via position: sticky;
they should render in normal flow at the end of the list.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 .../components/data-table/components/virtualized-content.tsx | 2 +-
 .../raystack/components/data-table/data-table.module.css     | 5 +----
 2 files changed, 2 insertions(+), 5 deletions(-)

diff --git a/packages/raystack/components/data-table/components/virtualized-content.tsx b/packages/raystack/components/data-table/components/virtualized-content.tsx
index d6f3b5a9b..9b07332a3 100644
--- a/packages/raystack/components/data-table/components/virtualized-content.tsx
+++ b/packages/raystack/components/data-table/components/virtualized-content.tsx
@@ -169,7 +169,7 @@ function VirtualLoaderRows({
   count: number;
 }) {
   return (
-    <div className={styles.stickyLoaderContainer}>
+    <div role='rowgroup' className={styles.loaderContainer}>
       {Array.from({ length: count }).map((_, rowIndex) => (
         <div
           role='row'
diff --git a/packages/raystack/components/data-table/data-table.module.css b/packages/raystack/components/data-table/data-table.module.css
index f69bb26f5..187b2ca48 100644
--- a/packages/raystack/components/data-table/data-table.module.css
+++ b/packages/raystack/components/data-table/data-table.module.css
@@ -191,10 +191,7 @@
   box-shadow: 0 1px 0 0 var(--rs-color-border-base-primary);
 }
 
-.stickyLoaderContainer {
-  position: sticky;
-  bottom: 0;
-  z-index: 1;
+.loaderContainer {
   background: var(--rs-color-background-base-primary);
 }