@infineon/infineon-design-system-stencil 39.4.4--canary.2134.84be7b9e85db8400d052b6d3b5addde807790384.0 → 39.4.4--canary.2136.61ca080385a85b28f9e73c1ac2fcb72fcc5e023a.0

package/dist/collection/components/table-advanced-version/table.js

@@ -45,7 +45,6 @@ export class Table {
         this.enableSelection = false;
         this.selectedRows = new Set();
         this.selectAll = false;
-        this.selectedRowsData = new Map();
         this.showLoading = false;
         this.originalRowData = [];
         this.internalItemsPerPage = JSON.stringify([
@@ -55,45 +54,12 @@ export class Table {
         ]);
         this.handleSelectAll = (checked) => {
             this.selectAll = checked;
-            const newSelectedRows = new Set(this.selectedRows);
-            const newSelectedRowsData = new Map(this.selectedRowsData);
             if (checked) {
-                if (this.serverSidePagination) {
-                    // Server-side: select only current page rows
-                    this.rowData.forEach(row => {
-                        const rowId = row.__rowId;
-                        newSelectedRows.add(rowId);
-                        const { __checkbox, __rowId } = row, cleanRow = __rest(row, ["__checkbox", "__rowId"]);
-                        newSelectedRowsData.set(rowId, cleanRow);
-                    });
-                }
-                else {
-                    // Client-side: select ALL rows across ALL pages
-                    this.allRowData.forEach(row => {
-                        const rowId = row.__rowId;
-                        newSelectedRows.add(rowId);
-                        const { __checkbox, __rowId } = row, cleanRow = __rest(row, ["__checkbox", "__rowId"]);
-                        newSelectedRowsData.set(rowId, cleanRow);
-                    });
-                }
+                this.selectedRows = new Set(this.allRowData.map(row => row.__rowId));
             }
             else {
-                if (this.serverSidePagination) {
-                    // Server-side: remove only current page rows
-                    this.rowData.forEach(row => {
-                        const rowId = row.__rowId;
-                        newSelectedRows.delete(rowId);
-                        newSelectedRowsData.delete(rowId);
-                    });
-                }
-                else {
-                    // Client-side: remove ALL rows (clear entire selection)
-                    newSelectedRows.clear();
-                    newSelectedRowsData.clear();
-                }
+                this.selectedRows = new Set();
             }
-            this.selectedRows = newSelectedRows;
-            this.selectedRowsData = newSelectedRowsData;
             this.updateCheckboxStates();
             this.updateHeaderCheckboxState();
             this.emitSelectionChange();
@@ -102,19 +68,14 @@ export class Table {
             const clickedRowData = params.data;
             const rowId = clickedRowData.__rowId;
             const newSelectedRows = new Set(this.selectedRows);
-            const newSelectedRowsData = new Map(this.selectedRowsData);
             if (newSelectedRows.has(rowId)) {
                 newSelectedRows.delete(rowId);
-                newSelectedRowsData.delete(rowId);
             }
             else {
                 newSelectedRows.add(rowId);
-                const { __checkbox, __rowId } = clickedRowData, cleanRow = __rest(clickedRowData, ["__checkbox", "__rowId"]);
-                newSelectedRowsData.set(rowId, cleanRow);
             }
             this.selectedRows = newSelectedRows;
-            this.selectedRowsData = newSelectedRowsData;
-            this.selectAll = newSelectedRows.size === this.rowData.length && this.rowData.length > 0;
+            this.selectAll = newSelectedRows.size === this.allRowData.length;
             this.updateCheckboxStates();
             this.updateHeaderCheckboxState();
             this.emitSelectionChange();
@@ -236,21 +197,10 @@ export class Table {
                 var _a;
                 const headerCheckbox = (_a = this.container) === null || _a === void 0 ? void 0 : _a.querySelector('.ag-header-cell[col-id="__checkbox"] ifx-checkbox');
                 if (headerCheckbox) {
-                    if (this.serverSidePagination) {
-                        // For server-side: only reflect current page selection
-                        const currentPageSelectedCount = this.rowData.filter(row => { var _a; return (_a = this.selectedRows) === null || _a === void 0 ? void 0 : _a.has(row.__rowId); }).length;
-                        const allOnPageSelected = currentPageSelectedCount === this.rowData.length && this.rowData.length > 0;
-                        const someOnPageSelected = currentPageSelectedCount > 0 && currentPageSelectedCount < this.rowData.length;
-                        headerCheckbox.checked = allOnPageSelected;
-                        headerCheckbox.indeterminate = someOnPageSelected;
-                    }
-                    else {
-                        // For client-side: reflect entire dataset selection
-                        const allSelected = this.selectedRows.size === this.allRowData.length && this.allRowData.length > 0;
-                        const someSelected = this.selectedRows.size > 0 && this.selectedRows.size < this.allRowData.length;
-                        headerCheckbox.checked = allSelected;
-                        headerCheckbox.indeterminate = someSelected;
-                    }
+                    const allSelected = this.selectedRows.size === this.allRowData.length && this.allRowData.length > 0;
+                    const someSelected = this.selectedRows.size > 0 && this.selectedRows.size < this.allRowData.length;
+                    headerCheckbox.checked = allSelected;
+                    headerCheckbox.indeterminate = someSelected;
                 }
             }, 0);
         }
@@ -351,33 +301,30 @@ export class Table {
         });
     }
     async updateTableView() {
-        // Reset select-all when loading new data in server-side mode
-        if (this.serverSidePagination) {
-            this.selectAll = false;
-        }
         if (this.serverSidePagination && this.serverPageChangeHandler) {
             const { rows, total } = await this.serverPageChangeHandler({
                 page: this.currentPage,
                 pageSize: this.paginationPageSize,
             });
-            rows.forEach((row, index) => {
-                var _a;
-                const rowId = row.sampleNumber || `row_${(this.currentPage - 1) * this.paginationPageSize + index}`;
-                row.__rowId = rowId;
-                row.__checkbox = {
-                    disabled: false,
-                    checked: ((_a = this.selectedRows) === null || _a === void 0 ? void 0 : _a.has(rowId)) || false,
-                    size: 's',
-                    indeterminate: false,
-                    error: false,
-                };
-            });
+            if (this.enableSelection) {
+                rows.forEach((row, index) => {
+                    var _a;
+                    if (!row.__rowId) {
+                        row.__rowId = `row_${(this.currentPage - 1) * this.paginationPageSize + index}_${Date.now()}`;
+                    }
+                    row.__checkbox = {
+                        disabled: false,
+                        checked: ((_a = this.selectedRows) === null || _a === void 0 ? void 0 : _a.has(row.__rowId)) || false,
+                        size: 's',
+                        indeterminate: false,
+                        error: false,
+                    };
+                });
+            }
             this.rowData = rows;
             this.matchingResultsCount = total;
             if (this.gridApi) {
                 this.gridApi.setGridOption('rowData', rows);
-                // Update header checkbox state
-                this.updateHeaderCheckboxState();
             }
             const paginationElement = this.host.shadowRoot.querySelector('ifx-pagination');
             if (paginationElement) {
@@ -410,8 +357,6 @@ export class Table {
             if (this.gridApi) {
                 this.gridApi.setGridOption('rowData', this.rowData);
             }
-            // Update header checkbox state for client-side
-            this.updateHeaderCheckboxState();
         }
     }
     clearAllFilters() {
@@ -569,34 +514,15 @@ export class Table {
     }
     async handlePageChange(event) {
         this.currentPage = event.detail.currentPage;
-        // Reset the select-all checkbox state when changing pages in server-side mode
-        if (this.serverSidePagination) {
-            this.selectAll = false;
-        }
         if (this.serverSidePagination && this.serverPageChangeHandler) {
             const { rows, total } = await this.serverPageChangeHandler({
                 page: this.currentPage,
                 pageSize: this.paginationPageSize,
             });
-            // Add checkbox properties to rows
-            rows.forEach((row, index) => {
-                var _a;
-                const rowId = row.sampleNumber || `row_${(this.currentPage - 1) * this.paginationPageSize + index}`;
-                row.__rowId = rowId;
-                row.__checkbox = {
-                    disabled: false,
-                    checked: ((_a = this.selectedRows) === null || _a === void 0 ? void 0 : _a.has(rowId)) || false,
-                    size: 's',
-                    indeterminate: false,
-                    error: false,
-                };
-            });
             this.rowData = rows;
             this.matchingResultsCount = total;
             if (this.gridApi) {
                 this.gridApi.setGridOption('rowData', this.rowData);
-                // Update header checkbox state
-                this.updateHeaderCheckboxState();
             }
             const paginationElement = this.host.shadowRoot.querySelector('ifx-pagination');
             if (paginationElement) {
@@ -607,29 +533,8 @@ export class Table {
             const startIndex = (this.currentPage - 1) * this.paginationPageSize;
             const endIndex = startIndex + this.paginationPageSize;
             const visibleRowData = this.allRowData.slice(startIndex, endIndex);
-            // Update checkbox state for visible rows
-            if (this.enableSelection) {
-                visibleRowData.forEach(row => {
-                    var _a, _b;
-                    if (!row.__checkbox) {
-                        row.__checkbox = {
-                            disabled: false,
-                            checked: ((_a = this.selectedRows) === null || _a === void 0 ? void 0 : _a.has(row.__rowId)) || false,
-                            size: 's',
-                            indeterminate: false,
-                            error: false,
-                        };
-                    }
-                    else {
-                        row.__checkbox.checked = ((_b = this.selectedRows) === null || _b === void 0 ? void 0 : _b.has(row.__rowId)) || false;
-                    }
-                });
-            }
-            this.rowData = visibleRowData;
             if (this.gridApi) {
                 this.gridApi.setGridOption('rowData', visibleRowData);
-                // Update header checkbox state for client-side too
-                this.updateHeaderCheckboxState();
             }
         }
     }
@@ -679,9 +584,7 @@ export class Table {
         return rows.slice(0, this.paginationPageSize);
     }
     updateCheckboxStates() {
-        // Update checkboxes in the current view
-        const dataToUpdate = this.rowData; // Always update current page
-        dataToUpdate.forEach(row => {
+        this.allRowData.forEach(row => {
             if (row.__checkbox) {
                 row.__checkbox.checked = this.selectedRows.has(row.__rowId);
             }
@@ -694,21 +597,20 @@ export class Table {
         }
     }
     emitSelectionChange() {
-        const selectedRowsArray = Array.from(this.selectedRowsData.values());
-        let isSelectAll;
-        if (this.serverSidePagination) {
-            // Server-side: select-all only applies to current page
-            isSelectAll = this.selectedRows.size === this.rowData.length && this.rowData.length > 0;
-        }
-        else {
-            // Client-side: select-all applies to ALL data across all pages
-            isSelectAll = this.selectedRows.size === this.allRowData.length && this.allRowData.length > 0;
-        }
+        const selectedRowsData = Array.from(this.selectedRows)
+            .map(rowId => {
+            const row = this.allRowData.find(r => r.__rowId === rowId);
+            if (!row)
+                return null;
+            const { __checkbox, __rowId } = row, rowData = __rest(row, ["__checkbox", "__rowId"]);
+            return rowData;
+        })
+            .filter(row => row !== null);
         this.host.dispatchEvent(new CustomEvent('ifxSelectionChange', {
             detail: {
-                selectedRows: selectedRowsArray,
-                selectedCount: selectedRowsArray.length,
-                isSelectAll: isSelectAll,
+                selectedRows: selectedRowsData,
+                selectedCount: selectedRowsData.length,
+                isSelectAll: this.selectedRows.size === this.allRowData.length && this.allRowData.length > 0,
             },
             bubbles: true,
         }));
@@ -832,12 +734,12 @@ export class Table {
             };
         }
         const filterClass = this.filterOrientation === 'topbar' ? 'topbar-layout' : this.filterOrientation === 'none' ? '' : 'sidebar-layout';
-        return (h(Host, { key: 'c1489506902cdb79a3ba86f9253601c1ba5ce495' }, h("div", { key: '4f5439475ea09640a4cbd0224d30c4d8ede316e2', class: "table-container" }, this.filterOrientation === 'sidebar' && (h("div", { key: '0bddd913070ac4bf564620fc5f1a2254c6428f46', class: "sidebar-btn" }, h("ifx-button", { key: '9a9395c870d35290b8b89f9ec8137819c19b3397', type: "button", disabled: false, variant: "secondary", size: "m", target: "_blank", theme: "default", "full-width": "false", onClick: () => this.toggleSidebarFilters() }, h("ifx-icon", { key: '87a92e599608e4927b5b29fda70acb8268aca7a1', icon: "cross-16" }), this.showSidebarFilters ? 'Hide Filters' : 'Show Filters'))), h("div", { key: '33d925bf3bc281bc67af9f76b837b9216f1f0dc0', class: filterClass }, this.filterOrientation === 'sidebar' && this.showSidebarFilters && (h("div", { key: '4002c1a03d92dea9b4beffd3d7bfe57d7f667add', class: "sidebar-container" }, h("div", { key: 'a443ffddc716cefbaf89c33f5cc5f6278f332442', class: "filters-title-container" }, h("span", { key: '8eb9160571bf1a54927aeab52b9900ca6c3bab44', class: "filters-title" }, "Filters")), h("div", { key: '0d084ba8d7ede405c4015cb52020871c7046417b', class: "set-filter-wrapper-sidebar" }, (this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && h("slot", { key: '67912ff1dd15e0b2ea691a8a376863204ceefad2', name: "sidebar-filter" })))), this.filterOrientation !== 'none' && this.filterOrientation !== 'sidebar' && (h("div", { key: 'd50eae526270c682cb15f15fffa173d8c1898b34', class: "set-filter-wrapper-topbar" }, (this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && h("slot", { key: 'fdfa7a32a95c0b4c01995ff95ab8c166647482a2', name: "topbar-filter" }))), h("div", { key: 'e165963816e9c7412024c10314cb7aa09730e8e7', class: "table-pagination-wrapper" }, this.filterOrientation !== 'none' && this.filterOrientation !== 'topbar' && this.showSidebarFilters && (h("div", { key: 'c97d793d611e819c0a244bda14dfd1805794e199', class: "filter-chips" }, Object.keys(this.currentFilters).map(name => {
+        return (h(Host, { key: '66b9e97b36c201f86732fbd1452819419d739fd3' }, h("div", { key: 'a5c54e731669b840a732b9cf4de334a09c37ccb0', class: "table-container" }, this.filterOrientation === 'sidebar' && (h("div", { key: '786e0cdf15170384f5dfb34995db3f5ca3c419d4', class: "sidebar-btn" }, h("ifx-button", { key: '7097db9958849a342a4918dc96441ba4275539b1', type: "button", disabled: false, variant: "secondary", size: "m", target: "_blank", theme: "default", "full-width": "false", onClick: () => this.toggleSidebarFilters() }, h("ifx-icon", { key: '8005336599ce5aa87ddc1973f8005d8bd7a03551', icon: "cross-16" }), this.showSidebarFilters ? 'Hide Filters' : 'Show Filters'))), h("div", { key: '875c2049c9d4745ec5a40f14fab62d4394b8f63a', class: filterClass }, this.filterOrientation === 'sidebar' && this.showSidebarFilters && (h("div", { key: 'c87a5a9a5bb27915e6170ebe139bced53164136f', class: "sidebar-container" }, h("div", { key: '14420330d730046eda3e9049bd6df5fd66222693', class: "filters-title-container" }, h("span", { key: 'a8f006c463b5858daf5f9ff191287a1dc7be24ef', class: "filters-title" }, "Filters")), h("div", { key: '201324d69551491db05dae532a080460527e8a79', class: "set-filter-wrapper-sidebar" }, (this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && h("slot", { key: '3a3be2bc00d1148fa21cf692a077f85625cafdec', name: "sidebar-filter" })))), this.filterOrientation !== 'none' && this.filterOrientation !== 'sidebar' && (h("div", { key: '3d20934e66c39335c8966599b13be1acc48338b2', class: "set-filter-wrapper-topbar" }, (this.filterOrientation !== 'sidebar' || this.showSidebarFilters) && h("slot", { key: 'b45be18917095b816833ac7ac30260d51a29eb5c', name: "topbar-filter" }))), h("div", { key: '490b41840efb18253618d0a838d7a31ebaac6001', class: "table-pagination-wrapper" }, this.filterOrientation !== 'none' && this.filterOrientation !== 'topbar' && this.showSidebarFilters && (h("div", { key: '51a213af18af7b58e36551239eba437bce8a2b51', class: "filter-chips" }, Object.keys(this.currentFilters).map(name => {
             const filter = this.currentFilters[name];
             const filterValues = filter.filterValues;
             const isMultiSelect = filter.type !== 'text';
             return filterValues.length > 0 ? (h("ifx-chip", { placeholder: name, size: "large", variant: isMultiSelect ? 'multi' : 'single', readOnly: true, value: filterValues, key: name }, filterValues.map(filterValue => (h("ifx-chip-item", { value: filterValue, selected: true, key: filterValue }, filterValue))))) : null;
-        }))), h("div", { key: '3e9accd07cdb2f084062331ad51bb09e05b37ad9', class: "headline-wrapper" }, this.filterOrientation !== 'none' && this.headline && (h("div", { key: '7b62e23de92579c87dd31223cc462e5896f26fcd', class: "matching-results-container" }, h("span", { key: 'fb9c0f9d176143756c1d9bd5a212bfa94f81cd5e', class: "matching-results-count" }, "(", this.matchingResultsCount, ")"), h("span", { key: 'fd0d1dd3db1903b518244ce9ec9d7c9fb5f06381', class: "matching-results-text" }, this.headline))), h("div", { key: '55abe9fd4fb5b31b6ba3faa05d6bdbfce23a4c0c', class: "inner-buttons-wrapper" }, h("slot", { key: '64e5f8b60a7459acb2025abf50dd3f12e96ecb4d', name: "inner-button" }))), h("div", { key: 'cbf11cb3a5c83b2510523a866d9c3e3039acb0cb', id: "table-wrapper", class: this.getTableClassNames() }, h("div", { key: 'aa309053f78bc3c20497480ca1a36633a52982b6', id: `ifxTable-${this.uniqueKey}`, class: `ifx-ag-grid ${this.variant === 'zebra' ? 'zebra' : ''}`, style: style, ref: el => (this.container = el) })), h("div", { key: '00801e7da0e53ae3076c1f9d36158193fed1d242', class: "pagination-wrapper" }, this.pagination ? (h("ifx-pagination", { total: this.serverSidePagination ? this.matchingResultsCount : this.allRowData.length, "current-page": this.currentPage, "items-per-page": this.internalItemsPerPage })) : null))))));
+        }))), h("div", { key: '4cda426751074f84547a5f6870308ab48dfdab03', class: "headline-wrapper" }, this.filterOrientation !== 'none' && this.headline && (h("div", { key: 'c538c15f038caf9a0ba2c56a2d3e114c40112b01', class: "matching-results-container" }, h("span", { key: '9c263730471d93cfe519e4d2b68c5fbc13f612d1', class: "matching-results-count" }, "(", this.matchingResultsCount, ")"), h("span", { key: '34d9334bce111c93e6e813916a06282f11071fab', class: "matching-results-text" }, this.headline))), h("div", { key: '031ef0ce92afc9ad6fbc2c4c1b8849fcefdf7213', class: "inner-buttons-wrapper" }, h("slot", { key: '4e77698e25702ee13640fac3e24558ce5e5518b7', name: "inner-button" }))), h("div", { key: '36f1cdcd7c9560c3f3f8fbaad2d37b27e99483f5', id: "table-wrapper", class: this.getTableClassNames() }, h("div", { key: '12284c6b014a6fd63b20c8ccb95c0f181ef7557e', id: `ifxTable-${this.uniqueKey}`, class: `ifx-ag-grid ${this.variant === 'zebra' ? 'zebra' : ''}`, style: style, ref: el => (this.container = el) })), h("div", { key: '5a768d894603d010c52deb2867a8bcfd953ddaac', class: "pagination-wrapper" }, this.pagination ? (h("ifx-pagination", { total: this.serverSidePagination ? this.matchingResultsCount : this.allRowData.length, "current-page": this.currentPage, "items-per-page": this.internalItemsPerPage })) : null))))));
     }
     hasButtonCol() {
         return this.getColData().some(column => column.field === 'button');
@@ -1215,8 +1117,7 @@ export class Table {
             "showSidebarFilters": {},
             "matchingResultsCount": {},
             "selectedRows": {},
-            "selectAll": {},
-            "selectedRowsData": {}
+            "selectAll": {}
         };
     }
     static get methods() {