@lensui/lens-table 0.1.8 → 0.1.9

package/dist/index.cjs

@@ -1698,7 +1698,8 @@ function TableInner({
   const hoveredRowIndexRef = (0, import_react5.useRef)(null);
   const [viewport, setViewport] = (0, import_react5.useState)({ width: 0, height: typeof height === "number" ? height : FALLBACK_HEIGHT });
   const [horizontalScrollbarHeight, setHorizontalScrollbarHeight] = (0, import_react5.useState)(0);
-  const resolvedHeight = typeof height === "number" ? height : viewport.height || FALLBACK_HEIGHT;
+  const [availableHeight, setAvailableHeight] = (0, import_react5.useState)(FALLBACK_HEIGHT);
+  const resolvedHeight = typeof height === "number" ? height : availableHeight;
   const [scrollPosition, setScrollPosition] = (0, import_react5.useState)({ left: 0, top: 0 });
   const scrollRef = (0, import_react5.useRef)({ left: 0, top: 0 });
   const [rowKeys, setRowKeys] = useControllableKeys(selectedRowKeys, defaultSelectedRowKeys, (keys) => {
@@ -2375,7 +2376,15 @@ function TableInner({
   (0, import_react5.useLayoutEffect)(() => {
     const element = scrollerRef.current;
     if (!element) return;
+    const root = element.parentElement;
     const update = () => {
+      if (root && typeof height !== "number") {
+        const renderedHeight = root.style.height;
+        root.style.height = height;
+        const nextAvailableHeight = root.clientHeight || FALLBACK_HEIGHT;
+        root.style.height = renderedHeight;
+        setAvailableHeight(nextAvailableHeight);
+      }
       const measuredHeight = element.clientHeight || (typeof height === "number" ? height : FALLBACK_HEIGHT);
       setViewport({ width: element.clientWidth, height: measuredHeight });
       setHorizontalScrollbarHeight(Math.max(0, element.offsetHeight - element.clientHeight));
@@ -2387,6 +2396,7 @@ function TableInner({
     }
     const observer = new ResizeObserver(update);
     observer.observe(element);
+    if (root?.parentElement) observer.observe(root.parentElement);
     return () => observer.disconnect();
   }, [height]);
   (0, import_react5.useEffect)(() => {

package/dist/index.js

@@ -1668,7 +1668,8 @@ function TableInner({
   const hoveredRowIndexRef = useRef2(null);
   const [viewport, setViewport] = useState4({ width: 0, height: typeof height === "number" ? height : FALLBACK_HEIGHT });
   const [horizontalScrollbarHeight, setHorizontalScrollbarHeight] = useState4(0);
-  const resolvedHeight = typeof height === "number" ? height : viewport.height || FALLBACK_HEIGHT;
+  const [availableHeight, setAvailableHeight] = useState4(FALLBACK_HEIGHT);
+  const resolvedHeight = typeof height === "number" ? height : availableHeight;
   const [scrollPosition, setScrollPosition] = useState4({ left: 0, top: 0 });
   const scrollRef = useRef2({ left: 0, top: 0 });
   const [rowKeys, setRowKeys] = useControllableKeys(selectedRowKeys, defaultSelectedRowKeys, (keys) => {
@@ -2345,7 +2346,15 @@ function TableInner({
   useLayoutEffect2(() => {
     const element = scrollerRef.current;
     if (!element) return;
+    const root = element.parentElement;
     const update = () => {
+      if (root && typeof height !== "number") {
+        const renderedHeight = root.style.height;
+        root.style.height = height;
+        const nextAvailableHeight = root.clientHeight || FALLBACK_HEIGHT;
+        root.style.height = renderedHeight;
+        setAvailableHeight(nextAvailableHeight);
+      }
       const measuredHeight = element.clientHeight || (typeof height === "number" ? height : FALLBACK_HEIGHT);
       setViewport({ width: element.clientWidth, height: measuredHeight });
       setHorizontalScrollbarHeight(Math.max(0, element.offsetHeight - element.clientHeight));
@@ -2357,6 +2366,7 @@ function TableInner({
     }
     const observer = new ResizeObserver(update);
     observer.observe(element);
+    if (root?.parentElement) observer.observe(root.parentElement);
     return () => observer.disconnect();
   }, [height]);
   useEffect2(() => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lensui/lens-table",
-  "version": "0.1.8",
+  "version": "0.1.9",
   "description": "A lightweight, canvas-rendered React table component for LensUI.",
   "type": "module",
   "main": "./dist/index.cjs",