update sticky header height

CHANGELOG.md

@@ -1,5 +1,14 @@
 # CHANGELOG
 
+## 0.6.4
+
+_2024-12-09_
+
+### Bugfix
+
+- Force the sticky header to be the size of the rendered header
+- Make sure footer width is 0 when not present
+
 ## 0.6.3
 
 _2024-12-04_

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-fluid-table",
-  "version": "0.6.3",
+  "version": "0.6.4",
   "description": "A React table inspired by react-window",
   "author": "Mckervin Ceme <[email protected]>",
   "license": "MIT",

src/Footer.tsx

@@ -46,10 +46,15 @@ const Footer = () => {
   const ref = useRef<HTMLDivElement>(null);
 
   // constants
+  const hasFooter = !!FooterComponent || !!columns.find(c => !!c.footer);
   const style: React.CSSProperties = {
     minWidth: stickyFooter ? undefined : pixelWidths.reduce((pv, c) => pv + c, 0),
     ...footerStyle
   };
+  if (!hasFooter) {
+    style.width = 0;
+    style.minWidth = 0;
+  }
 
   // functions
   const onScroll = useCallback(

src/Header.tsx

@@ -101,6 +101,7 @@ const Header = forwardRef(
       (ref as React.MutableRefObject<HTMLDivElement>).current || NO_NODE;
     const width = scrollWidth <= clientWidth ? "100%" : undefined;
     const stickyStyle: React.CSSProperties = {
+      height,
       zIndex: columns.find(c => c.frozen) ? 2 : undefined
     };