tosijs-ui 1.5.18 → 1.5.21

package/dist/data-table.js

@@ -1090,8 +1090,13 @@ export class TosiTable extends WebComponent {
     // its own non-virtualised listBinding so each pinned row goes through the
     // same dataCell / rowRendered / `^.prop` pipeline as the virtual rows. The
     // wrapper has no box of its own, so its stamped rows are layout children of
-    // .scroll-area and share its single sticky context.
-    buildPinnedBody(rowsProxy, cols, stickyInfo, region, part) {
+    // .scroll-area and share its single sticky context. Returns null when the
+    // region is empty so render() can drop it from the DOM.
+    buildPinnedBody(rowsProxy, cols, stickyInfo, region) {
+        const data = tosiValue(rowsProxy);
+        if (!data || data.length === 0)
+            return null;
+        const part = region === 'pinned-top' ? 'pinnedTopRows' : 'pinnedBottomRows';
         const rowClass = this.rowClasses(region);
         const binding = rowsProxy.listBinding((_elements, item) => this.buildRow(item, cols, stickyInfo, rowClass), {});
         return div({
@@ -1641,25 +1646,18 @@ export class TosiTable extends WebComponent {
         // so their stamped rows participate in .scroll-area's layout directly,
         // sharing one sticky context with the visible rows and the header.
         this._head = this.buildHeader(cols, stickyInfo);
-        this._tbodyTop =
-            pinnedTopData.length > 0
-                ? this.buildPinnedBody(this.rowData.pinnedTopData, cols, stickyInfo, 'pinned-top', 'pinnedTopRows')
-                : null;
-        this._tbodyBottom =
-            pinnedBottomData.length > 0
-                ? this.buildPinnedBody(this.rowData.pinnedBottomData, cols, stickyInfo, 'pinned-bottom', 'pinnedBottomRows')
-                : null;
+        this._tbodyTop = this.buildPinnedBody(this.rowData.pinnedTopData, cols, stickyInfo, 'pinned-top');
+        this._tbodyBottom = this.buildPinnedBody(this.rowData.pinnedBottomData, cols, stickyInfo, 'pinned-bottom');
         // The visible-rows listBinding is bound directly to .scroll-area so
         // virtualisation observes the same scroll container that sticky cells
         // stick against.
         const visibleBinding = this.rowData.visible.listBinding((_elements, item) => this.buildRow(item, cols, stickyInfo), this.rowHeight > 0 ? { virtual: { height: this.rowHeight } } : {});
-        const scrollAreaChildren = [this._head];
-        if (this._tbodyTop)
-            scrollAreaChildren.push(this._tbodyTop);
-        scrollAreaChildren.push(...visibleBinding);
-        if (this._tbodyBottom)
-            scrollAreaChildren.push(this._tbodyBottom);
-        this._scrollArea = div({ class: 'scroll-area', part: 'visibleRows' }, ...scrollAreaChildren);
+        this._scrollArea = div({ class: 'scroll-area', part: 'visibleRows' }, ...[
+            this._head,
+            this._tbodyTop,
+            ...visibleBinding,
+            this._tbodyBottom,
+        ].filter(Boolean));
         this._scrollArea.addEventListener('scrollend', this.onScrollEnd);
         this.append(this._scrollArea);
         this.observePinnedRowMutations();