@schneideress/dashboardframework 20.0.30 → 20.0.31

package/fesm2022/schneideress-dashboardframework.mjs

@@ -5049,49 +5049,59 @@ class RADashboardArea {
                 }
                 return;
             }
-            // Find the table body or grid content that contains the actual data rows
-            const tbody = element.querySelector('tbody');
-            const table = element.querySelector('table');
+            // Prefer the real data table (ra-grid) so we do not pick unrelated tables when present
+            const dataTable = element.querySelector('table.ra-grid')
+                ?? element.querySelector('table');
+            const tbody = dataTable?.querySelector('tbody')
+                ?? element.querySelector('tbody');
+            const table = dataTable;
             const wcBody = element.querySelector('.wcBody');
             const wc = element.querySelector('.wc');
             const kendoGridContent = element.querySelector('.k-grid-content');
             const kendoGridTable = element.querySelector('.k-grid-table');
+            const addVisibleFilterHeights = (base) => {
+                let h = base;
+                element.querySelectorAll('.ra-widget-filter').forEach((node) => {
+                    const fe = node;
+                    if (fe.offsetHeight > 0) {
+                        h += fe.offsetHeight;
+                    }
+                });
+                return h;
+            };
             // Measure the actual content height - try multiple strategies to get accurate measurement
             let contentHeight = 0;
             let measuredElement = null;
-            // Strategy 1: Measure table body (most accurate for row count)
-            if (tbody) {
+            // Strategy 1: HTML table / ra-grid — use full table box (thead + tbody), not tbody only (avoids clipping header row)
+            if (table && table.offsetHeight > 0) {
+                measuredElement = table;
+                contentHeight = addVisibleFilterHeights(table.offsetHeight);
+            }
+            // Strategy 2: tbody only (fallback if table not measurable)
+            else if (tbody) {
                 measuredElement = tbody;
-                // Count actual rows and calculate height
                 const rows = tbody.querySelectorAll('tr');
                 if (rows.length > 0) {
-                    // Get height of first row to estimate
-                    const firstRow = rows[0];
-                    const rowHeight = firstRow.offsetHeight || 30; // Default row height if not available
-                    // Calculate total height based on row count
-                    const estimatedHeight = rows.length * rowHeight;
-                    // Use scrollHeight if available, otherwise use estimated
-                    contentHeight = Math.max(tbody.scrollHeight, estimatedHeight);
+                    let totalRowHeight = 0;
+                    rows.forEach((row) => {
+                        totalRowHeight += row.offsetHeight || 30;
+                    });
+                    contentHeight = addVisibleFilterHeights(totalRowHeight);
                 }
                 else {
-                    contentHeight = tbody.scrollHeight;
+                    contentHeight = addVisibleFilterHeights(tbody.scrollHeight);
                 }
             }
-            // Strategy 2: Measure Kendo grid content
+            // Strategy 3: Measure Kendo grid content
             else if (kendoGridContent) {
                 measuredElement = kendoGridContent;
-                contentHeight = kendoGridContent.scrollHeight;
+                contentHeight = addVisibleFilterHeights(kendoGridContent.scrollHeight);
                 // Also check the table inside
                 if (kendoGridTable) {
                     const tableHeight = kendoGridTable.scrollHeight;
-                    contentHeight = Math.max(contentHeight, tableHeight);
+                    contentHeight = Math.max(contentHeight, addVisibleFilterHeights(tableHeight));
                 }
             }
-            // Strategy 3: Measure table
-            else if (table) {
-                measuredElement = table;
-                contentHeight = table.scrollHeight;
-            }
             // Strategy 4: Measure widget content
             else if (wc) {
                 measuredElement = wc;
@@ -5118,16 +5128,22 @@ class RADashboardArea {
                     // Try offsetHeight
                     contentHeight = Math.max(contentHeight, offsetH);
                 }
-                // For tables, also try measuring all rows directly
-                if (tbody || table) {
-                    const allRows = (tbody || table)?.querySelectorAll('tr') || [];
-                    if (allRows.length > 0) {
-                        let totalRowHeight = 0;
-                        allRows.forEach((row) => {
-                            totalRowHeight += row.offsetHeight || 30;
-                        });
-                        // Use the maximum of scrollHeight and calculated row heights
-                        contentHeight = Math.max(contentHeight, totalRowHeight);
+                // Sum of tr heights often exceeds table.offsetHeight for many rows (borders/spacing), which grows extra whitespace.
+                // When the table already laid out with a real box height, trust that measurement only.
+                const tableBoxHeightTrusted = !!(table && table.offsetHeight > 0);
+                if (!tableBoxHeightTrusted) {
+                    const rowHost = table || tbody;
+                    if (rowHost) {
+                        const hostEl = rowHost;
+                        const allRows = hostEl.querySelectorAll('tr');
+                        if (allRows.length > 0) {
+                            let totalRowHeight = 0;
+                            allRows.forEach((row) => {
+                                totalRowHeight += row.offsetHeight || 30;
+                            });
+                            const withFilters = addVisibleFilterHeights(totalRowHeight);
+                            contentHeight = Math.max(contentHeight, withFilters);
+                        }
                     }
                 }
             }
@@ -5135,8 +5151,8 @@ class RADashboardArea {
             const header = element.querySelector('.wcheader');
             const headerHeight = header ? header.offsetHeight : 46;
             // Calculate total height needed (content + header + padding)
-            // Add sufficient padding to ensure no scrolling
-            const padding = 40; // Padding for margins and spacing
+            // Slightly less vertical slack for tall tables (grid ceil already adds a partial row).
+            const padding = contentHeight > 380 ? 28 : 36;
             const totalHeight = contentHeight + headerHeight + padding;
             // Check if content is loaded (reasonable height)
             // For expanded view, we expect significant content
@@ -5146,13 +5162,12 @@ class RADashboardArea {
                 this.measureAndUpdateWidgetDimensions(gridsterItem, attempt + 1, maxAttempts);
                 return;
             }
-            // Calculate rows needed based on grid cell height
-            // Use Math.ceil to ensure we have enough space (round up)
-            const calculatedRows = Math.ceil(totalHeight / this.gridcellHeight);
-            // Add a small buffer (0.5 rows) to ensure no scrolling, then round up
-            // This accounts for any rounding errors or minor spacing issues
-            const bufferedRows = calculatedRows + 0.5;
-            const newRows = Math.max(Math.ceil(bufferedRows), 4);
+            // Calculate rows needed based on grid cell height.
+            // Blend pixel + fractional cell buffer; keep a bit more for short content to avoid last-row clipping.
+            const bufferPx = contentHeight > 380
+                ? Math.max(12, this.gridcellHeight * 0.35)
+                : Math.max(16, this.gridcellHeight * 0.5);
+            const newRows = Math.max(Math.ceil((totalHeight + bufferPx) / this.gridcellHeight), 2);
             // For expanded view, use full available width (no spacing needed since widgets stack vertically)
             const maxCols = this.responsiveService.maxColsDesktop || 12;
             const newCols = maxCols; // Full width
@@ -5193,8 +5208,12 @@ class RADashboardArea {
                                 }
                                 if (el) {
                                     const wcBody = el.querySelector('.wcBody');
+                                    const tableContainer = el.querySelector('.table-container');
+                                    const verifyTable = el.querySelector('table.ra-grid')
+                                        ?? el.querySelector('table');
                                     const tbody = el.querySelector('tbody');
-                                    const contentEl = tbody || wcBody || el;
+                                    // ra-grid scrolls inside .table-container; measuring tbody alone can miss real overflow
+                                    const contentEl = tableContainer || verifyTable || tbody || wcBody || el;
                                     // Check if there's scrolling (scrollHeight > clientHeight)
                                     if (contentEl && contentEl.scrollHeight > contentEl.clientHeight + 10) {
                                         // Still has scrolling, need more height
@@ -5212,6 +5231,23 @@ class RADashboardArea {
                                             setTimeout(() => this.setAreaHeight(), 100);
                                         }
                                     }
+                                    else if (contentEl) {
+                                        // If there is clear spare space, shrink one row to avoid oversized blank area.
+                                        // Keep this conservative to prevent oscillation/flapping.
+                                        const spareHeight = contentEl.clientHeight - contentEl.scrollHeight;
+                                        const canShrink = spareHeight > (this.gridcellHeight * 0.8) && gridsterItem.rows > 2;
+                                        if (canShrink) {
+                                            gridsterItem.rows = gridsterItem.rows - 1;
+                                            if (gridsterItem.widgetInfo) {
+                                                gridsterItem.widgetInfo.height = gridsterItem.rows;
+                                            }
+                                            this.widgetList = [...this.widgetList];
+                                            if (this.options && this.options.api) {
+                                                this.options.api?.optionsChanged();
+                                            }
+                                            setTimeout(() => this.setAreaHeight(), 100);
+                                        }
+                                    }
                                 }
                                 // Continue with normal retry logic
                                 this.measureAndUpdateWidgetDimensions(gridsterItem, attempt + 1, maxAttempts);