From d4d1b62cd3389cc060dec9654e574c6a90a204b8 Mon Sep 17 00:00:00 2001
From: tiennm <tiennm@hblab.vn>
Date: Thu, 16 Apr 2026 14:31:28 +0700
Subject: [PATCH 1/2] fix: avoid rendering scrollbar column when table is empty

---
 src/FixedHolder/index.tsx                     |  9 +++----
 tests/FixedColumn.spec.tsx                    | 24 +++++++++++++++++++
 tests/__snapshots__/FixedColumn.spec.tsx.snap | 10 +++-----
 3 files changed, 32 insertions(+), 11 deletions(-)

diff --git a/src/FixedHolder/index.tsx b/src/FixedHolder/index.tsx
index 419637eaa..8c1de0753 100644
--- a/src/FixedHolder/index.tsx
+++ b/src/FixedHolder/index.tsx
@@ -131,15 +131,16 @@ const FixedHolder = React.forwardRef<HTMLDivElement, FixedHeaderProps<any>>((pro
       className: `${prefixCls}-cell-scrollbar`,
     }),
   };
+  const shouldAppendScrollBarColumn = combinationScrollBarSize && !noData;
 
   const columnsWithScrollbar = useMemo<ColumnsType<unknown>>(
-    () => (combinationScrollBarSize ? [...columns, ScrollBarColumn] : columns),
-    [combinationScrollBarSize, columns],
+    () => (shouldAppendScrollBarColumn ? [...columns, ScrollBarColumn] : columns),
+    [shouldAppendScrollBarColumn, columns],
   );
 
   const flattenColumnsWithScrollbar = useMemo(
-    () => (combinationScrollBarSize ? [...flattenColumns, ScrollBarColumn] : flattenColumns),
-    [combinationScrollBarSize, flattenColumns],
+    () => (shouldAppendScrollBarColumn ? [...flattenColumns, ScrollBarColumn] : flattenColumns),
+    [shouldAppendScrollBarColumn, flattenColumns],
   );
 
   // Calculate the sticky offsets
diff --git a/tests/FixedColumn.spec.tsx b/tests/FixedColumn.spec.tsx
index 3e7a5b493..091fd5579 100644
--- a/tests/FixedColumn.spec.tsx
+++ b/tests/FixedColumn.spec.tsx
@@ -119,6 +119,30 @@ describe('Table.FixedColumn', () => {
 
       expect(container.querySelector('colgroup')?.outerHTML).toMatchSnapshot();
     });
+
+    it('does not render scrollbar header cell when data is empty', async () => {
+      const { container } = render(
+        <Table columns={columns} data={[]} scroll={{ x: 1200, y: 100 }} />,
+      );
+
+      await triggerResize(container.querySelector<HTMLElement>('.rc-table'));
+
+      act(() => {
+        const coll = container.querySelector('.rc-table-resize-collection');
+        if (coll) {
+          triggerResize(coll as HTMLElement);
+        }
+      });
+
+      await act(async () => {
+        vi.runAllTimers();
+        await Promise.resolve();
+      });
+
+      expect(container.querySelectorAll('thead .rc-table-cell-scrollbar')).toHaveLength(0);
+      expect(container.querySelector('.rc-table-placeholder')).toBeTruthy();
+      vi.useRealTimers();
+    });
   });
 
   it('has correct scroll classNames when table resize', async () => {
diff --git a/tests/__snapshots__/FixedColumn.spec.tsx.snap b/tests/__snapshots__/FixedColumn.spec.tsx.snap
index f56c89857..33e78933c 100644
--- a/tests/__snapshots__/FixedColumn.spec.tsx.snap
+++ b/tests/__snapshots__/FixedColumn.spec.tsx.snap
@@ -2723,14 +2723,14 @@ exports[`Table.FixedColumn > renders correctly > scrollXY - without data 1`] = `
             <th
               class="rc-table-cell rc-table-cell-fix rc-table-cell-fix-start"
               scope="col"
-              style="inset-inline-start: 0px; --z-offset: 26; --z-offset-reverse: 13;"
+              style="inset-inline-start: 0px; --z-offset: 24; --z-offset-reverse: 12;"
             >
               title1
             </th>
             <th
               class="rc-table-cell rc-table-cell-fix rc-table-cell-fix-start rc-table-cell-fix-start-shadow rc-table-cell-ellipsis"
               scope="col"
-              style="inset-inline-start: 1000px; --z-offset: 25; --z-offset-reverse: 14;"
+              style="inset-inline-start: 1000px; --z-offset: 23; --z-offset-reverse: 13;"
               title="title2"
             >
               <span
@@ -2796,14 +2796,10 @@ exports[`Table.FixedColumn > renders correctly > scrollXY - without data 1`] = `
             <th
               class="rc-table-cell rc-table-cell-fix rc-table-cell-fix-end rc-table-cell-fix-end-shadow"
               scope="col"
-              style="inset-inline-end: 15px; --z-offset: 11; --z-offset-reverse: 2;"
+              style="inset-inline-end: 15px; --z-offset: 11; --z-offset-reverse: 1;"
             >
               title12
             </th>
-            <th
-              class="rc-table-cell rc-table-cell-fix rc-table-cell-fix-end rc-table-cell-scrollbar"
-              style="inset-inline-end: 0px; --z-offset: 12; --z-offset-reverse: 1;"
-            />
           </tr>
         </thead>
       </table>

From ca3af2edca66b521b95e7b367abfd3b0f6a944ad Mon Sep 17 00:00:00 2001
From: tiennm <tiennm@hblab.vn>
Date: Thu, 16 Apr 2026 14:39:19 +0700
Subject: [PATCH 2/2] fix: keep header sticky offsets in sync for empty tables

---
 src/FixedHolder/index.tsx                     | 5 +++--
 tests/__snapshots__/FixedColumn.spec.tsx.snap | 2 +-
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/FixedHolder/index.tsx b/src/FixedHolder/index.tsx
index 8c1de0753..cffb145b4 100644
--- a/src/FixedHolder/index.tsx
+++ b/src/FixedHolder/index.tsx
@@ -146,6 +146,7 @@ const FixedHolder = React.forwardRef<HTMLDivElement, FixedHeaderProps<any>>((pro
   // Calculate the sticky offsets
   const headerStickyOffsets = useMemo(() => {
     const { start, end } = stickyOffsets;
+    const scrollbarOffset = shouldAppendScrollBarColumn ? combinationScrollBarSize : 0;
     return {
       ...stickyOffsets,
       // left:
@@ -153,10 +154,10 @@ const FixedHolder = React.forwardRef<HTMLDivElement, FixedHeaderProps<any>>((pro
       // right:
       //   direction === 'rtl' ? right : [...right.map(width => width + combinationScrollBarSize), 0],
       start: start,
-      end: [...end.map(width => width + combinationScrollBarSize), 0],
+      end: [...end.map(width => width + scrollbarOffset), 0],
       isSticky,
     };
-  }, [combinationScrollBarSize, stickyOffsets, isSticky]);
+  }, [shouldAppendScrollBarColumn, combinationScrollBarSize, stickyOffsets, isSticky]);
 
   const mergedColumnWidth = useColumnWidth(colWidths, columCount);
 
diff --git a/tests/__snapshots__/FixedColumn.spec.tsx.snap b/tests/__snapshots__/FixedColumn.spec.tsx.snap
index 33e78933c..85d62a343 100644
--- a/tests/__snapshots__/FixedColumn.spec.tsx.snap
+++ b/tests/__snapshots__/FixedColumn.spec.tsx.snap
@@ -2796,7 +2796,7 @@ exports[`Table.FixedColumn > renders correctly > scrollXY - without data 1`] = `
             <th
               class="rc-table-cell rc-table-cell-fix rc-table-cell-fix-end rc-table-cell-fix-end-shadow"
               scope="col"
-              style="inset-inline-end: 15px; --z-offset: 11; --z-offset-reverse: 1;"
+              style="inset-inline-end: 0px; --z-offset: 11; --z-offset-reverse: 1;"
             >
               title12
             </th>