cps-ui-kit 0.130.0 → 0.131.0

package/fesm2020/cps-ui-kit.mjs

@@ -5644,6 +5644,7 @@ class CpsTreeTableComponent {
         this.colHeaderName = 'header';
         this.colFieldName = 'field';
         this.minWidth = 0;
+        this.minWidthForBodyOnly = true;
         this.striped = true;
         this.bordered = true;
         this.size = 'normal';
@@ -5781,23 +5782,23 @@ class CpsTreeTableComponent {
         this.selectedColumns = this.columns;
     }
     ngAfterViewInit() {
-        if (this.minWidth > 0) {
-            const treeTableMain = this.primengTreeTable.el.nativeElement.querySelector('.p-treetable');
-            if (treeTableMain)
-                treeTableMain.style.overflow = 'auto';
-            const scrollableWrapper = this.primengTreeTable.el.nativeElement.querySelector('.p-treetable-scrollable-wrapper');
-            if (scrollableWrapper)
-                scrollableWrapper.style.minWidth = this.minWidth + 'px';
-            const treeTableHeader = this.primengTreeTable.el.nativeElement.querySelector('.p-treetable-header');
-            if (treeTableHeader)
-                treeTableHeader.style.minWidth = this.minWidth + 'px';
-        }
+        this._setMinWidthOverall();
         this.scrollableBody = this.primengTreeTable.el.nativeElement.querySelector('.p-treetable-scrollable-body');
         if (this.scrollableBody) {
-            this.headerBox = this.primengTreeTable.el.nativeElement.querySelector('.p-treetable-scrollable-header-box');
+            if (this.minWidthForBodyOnly && this.minWidth > 0) {
+                const table = this.scrollableBody.querySelector('table');
+                if (table)
+                    table.style.minWidth = this.minWidth + 'px';
+            }
             if (this.virtualScroll && this.defScrollHeight === 'flex')
                 this.defScrollHeightPx = this.scrollableBody.clientHeight;
+            this.headerBox = this.primengTreeTable.el.nativeElement.querySelector('.p-treetable-scrollable-header-box');
             if (this.headerBox) {
+                if (this.minWidthForBodyOnly && this.minWidth > 0) {
+                    const table = this.headerBox.querySelector('table');
+                    if (table)
+                        table.style.minWidth = this.minWidth + 'px';
+                }
                 this.scrollbarWidth = DomHandler.calculateScrollbarWidth();
                 this.scrollableBody.addEventListener('treeTableBodyResized', () => {
                     this._recalcVirtualHeight();
@@ -5825,12 +5826,33 @@ class CpsTreeTableComponent {
         this._recalcVirtualHeight();
         this.cdRef.detectChanges();
     }
+    _setMinWidthOverall() {
+        if (this.minWidthForBodyOnly || !this.minWidth || !this.primengTreeTable)
+            return;
+        const treeTableMain = this.primengTreeTable.el?.nativeElement?.querySelector('.p-treetable');
+        if (treeTableMain) {
+            treeTableMain.style.overflow = 'auto';
+            const paginatorEl = treeTableMain.querySelector('.p-paginator');
+            if (paginatorEl)
+                paginatorEl.style.minWidth = this.minWidth + 'px';
+            const loadingOverlay = treeTableMain.querySelector('.p-treetable-loading-overlay');
+            if (loadingOverlay)
+                loadingOverlay.style.minWidth = this.minWidth + 'px';
+        }
+        const scrollableWrapper = this.primengTreeTable.el?.nativeElement?.querySelector('.p-treetable-scrollable-wrapper');
+        if (scrollableWrapper)
+            scrollableWrapper.style.minWidth = this.minWidth + 'px';
+        const treeTableHeader = this.primengTreeTable.el?.nativeElement?.querySelector('.p-treetable-header');
+        if (treeTableHeader)
+            treeTableHeader.style.minWidth = this.minWidth + 'px';
+    }
     ngOnChanges(changes) {
         if (this.loading) {
             this.clearSelection();
             if (this.clearGlobalFilterOnLoading)
                 this.clearGlobalFilter();
         }
+        this._setMinWidthOverall();
         const dataChanges = changes?.data;
         if (dataChanges?.previousValue !== dataChanges?.currentValue) {
             this.clearSelection();
@@ -6080,7 +6102,7 @@ class CpsTreeTableComponent {
     }
 }
 CpsTreeTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CpsTreeTableComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-CpsTreeTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CpsTreeTableComponent, isStandalone: true, selector: "cps-tree-table", inputs: { data: "data", columns: "columns", colHeaderName: "colHeaderName", colFieldName: "colFieldName", minWidth: "minWidth", striped: "striped", bordered: "bordered", size: "size", selectable: "selectable", rowHover: "rowHover", showRowMenu: "showRowMenu", loading: "loading", tableStyle: "tableStyle", tableStyleClass: "tableStyleClass", sortable: "sortable", sortMode: "sortMode", customSort: "customSort", hasToolbar: "hasToolbar", toolbarSize: "toolbarSize", toolbarTitle: "toolbarTitle", toolbarIcon: "toolbarIcon", toolbarIconColor: "toolbarIconColor", scrollable: "scrollable", scrollHeight: "scrollHeight", virtualScroll: "virtualScroll", maxVirtualScrollItemHeight: "maxVirtualScrollItemHeight", numToleratedItems: "numToleratedItems", paginator: "paginator", alwaysShowPaginator: "alwaysShowPaginator", rowsPerPageOptions: "rowsPerPageOptions", first: "first", rows: "rows", resetPageOnRowsChange: "resetPageOnRowsChange", resetPageOnSort: "resetPageOnSort", totalRecords: "totalRecords", emptyMessage: "emptyMessage", emptyBodyHeight: "emptyBodyHeight", lazy: "lazy", lazyLoadOnInit: "lazyLoadOnInit", showGlobalFilter: "showGlobalFilter", globalFilterPlaceholder: "globalFilterPlaceholder", globalFilterFields: "globalFilterFields", clearGlobalFilterOnLoading: "clearGlobalFilterOnLoading", showRemoveBtnOnSelect: "showRemoveBtnOnSelect", removeBtnOnSelectDisabled: "removeBtnOnSelectDisabled", showAdditionalBtnOnSelect: "showAdditionalBtnOnSelect", additionalBtnOnSelectTitle: "additionalBtnOnSelectTitle", additionalBtnOnSelectDisabled: "additionalBtnOnSelectDisabled", showActionBtn: "showActionBtn", actionBtnTitle: "actionBtnTitle", actionBtnDisabled: "actionBtnDisabled", showDataReloadBtn: "showDataReloadBtn", dataReloadBtnDisabled: "dataReloadBtnDisabled", showColumnsToggleBtn: "showColumnsToggleBtn", columnsToggleBtnDisabled: "columnsToggleBtnDisabled" }, outputs: { selectionChanged: "selectionChanged", actionBtnClicked: "actionBtnClicked", additionalBtnOnSelectClicked: "additionalBtnOnSelectClicked", editRowBtnClicked: "editRowBtnClicked", rowsRemoved: "rowsRemoved", pageChanged: "pageChanged", sorted: "sorted", filtered: "filtered", columnsSelected: "columnsSelected", lazyLoaded: "lazyLoaded", dataReloadBtnClicked: "dataReloadBtnClicked", nodeExpanded: "nodeExpanded", nodeCollapsed: "nodeCollapsed", nodeSelected: "nodeSelected", nodeUnselected: "nodeUnselected", customSortFunction: "customSortFunction" }, providers: [
+CpsTreeTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CpsTreeTableComponent, isStandalone: true, selector: "cps-tree-table", inputs: { data: "data", columns: "columns", colHeaderName: "colHeaderName", colFieldName: "colFieldName", minWidth: "minWidth", minWidthForBodyOnly: "minWidthForBodyOnly", striped: "striped", bordered: "bordered", size: "size", selectable: "selectable", rowHover: "rowHover", showRowMenu: "showRowMenu", loading: "loading", tableStyle: "tableStyle", tableStyleClass: "tableStyleClass", sortable: "sortable", sortMode: "sortMode", customSort: "customSort", hasToolbar: "hasToolbar", toolbarSize: "toolbarSize", toolbarTitle: "toolbarTitle", toolbarIcon: "toolbarIcon", toolbarIconColor: "toolbarIconColor", scrollable: "scrollable", scrollHeight: "scrollHeight", virtualScroll: "virtualScroll", maxVirtualScrollItemHeight: "maxVirtualScrollItemHeight", numToleratedItems: "numToleratedItems", paginator: "paginator", alwaysShowPaginator: "alwaysShowPaginator", rowsPerPageOptions: "rowsPerPageOptions", first: "first", rows: "rows", resetPageOnRowsChange: "resetPageOnRowsChange", resetPageOnSort: "resetPageOnSort", totalRecords: "totalRecords", emptyMessage: "emptyMessage", emptyBodyHeight: "emptyBodyHeight", lazy: "lazy", lazyLoadOnInit: "lazyLoadOnInit", showGlobalFilter: "showGlobalFilter", globalFilterPlaceholder: "globalFilterPlaceholder", globalFilterFields: "globalFilterFields", clearGlobalFilterOnLoading: "clearGlobalFilterOnLoading", showRemoveBtnOnSelect: "showRemoveBtnOnSelect", removeBtnOnSelectDisabled: "removeBtnOnSelectDisabled", showAdditionalBtnOnSelect: "showAdditionalBtnOnSelect", additionalBtnOnSelectTitle: "additionalBtnOnSelectTitle", additionalBtnOnSelectDisabled: "additionalBtnOnSelectDisabled", showActionBtn: "showActionBtn", actionBtnTitle: "actionBtnTitle", actionBtnDisabled: "actionBtnDisabled", showDataReloadBtn: "showDataReloadBtn", dataReloadBtnDisabled: "dataReloadBtnDisabled", showColumnsToggleBtn: "showColumnsToggleBtn", columnsToggleBtnDisabled: "columnsToggleBtnDisabled" }, outputs: { selectionChanged: "selectionChanged", actionBtnClicked: "actionBtnClicked", additionalBtnOnSelectClicked: "additionalBtnOnSelectClicked", editRowBtnClicked: "editRowBtnClicked", rowsRemoved: "rowsRemoved", pageChanged: "pageChanged", sorted: "sorted", filtered: "filtered", columnsSelected: "columnsSelected", lazyLoaded: "lazyLoaded", dataReloadBtnClicked: "dataReloadBtnClicked", nodeExpanded: "nodeExpanded", nodeCollapsed: "nodeCollapsed", nodeSelected: "nodeSelected", nodeUnselected: "nodeUnselected", customSortFunction: "customSortFunction" }, providers: [
         TreeTableService,
         {
             provide: TreeTable,
@@ -6127,6 +6149,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
                 type: Input
             }], minWidth: [{
                 type: Input
+            }], minWidthForBodyOnly: [{
+                type: Input
             }], striped: [{
                 type: Input
             }], bordered: [{