@colijnit/corecomponents_v12 258.1.8 → 258.1.10

package/bundles/colijnit-corecomponents_v12.umd.js

@@ -7945,6 +7945,7 @@
             _this.ngZoneWrapper = ngZoneWrapper;
             _this.elementRef = elementRef;
             _this.modelChangeOnEnter = true;
+            _this.showPermanentLabel = false;
             _this.minusIcon = exports.CoreComponentsIcon.MinusSimple;
             _this.plusIcon = exports.CoreComponentsIcon.PlusSimple;
             // Whether to show buttons 'always', 'onFocusOnly', or 'never'
@@ -8196,7 +8197,7 @@
     InputNumberPickerComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'co-input-number-picker',
-                    template: "\n        <div class=\"icon-wrapper\" *ngIf=\"leftIconData\">\n            <co-icon class=\"input-number-picker-icon\" [iconData]=\"leftIconData\" (click)=\"iconClick.emit($event)\"></co-icon>\n            <div class=\"spacer\"></div>\n        </div>\n        <div class=\"button-wrapper\">\n            <co-button *ngIf=\"showButtons\" class=\"minus-operator\" [class.select]=\"minSelected\" tabindex=\"-1\"\n                       [disabled]=\"readonly\"\n                       [iconData]=\"iconCacheService.getIcon(minusIcon)\"\n                       (mousedown)=\"onMinusMouseDown($event)\"\n                       (mouseup)=\"stopAutoCounting()\" (mouseleave)=\"stopAutoCounting()\"></co-button>\n        </div>\n        <input type=\"text\"\n               [tabIndex]=\"readonly ? -1 : 0\"\n               [ngModel]=\"model\"\n               [readonly]=\"readonly\"\n               [disabled]=\"disabled\"\n               [required]=\"required\"\n               [placeholder]=\"label\"\n               (ngModelChange)=\"handleChangeModel($event)\"\n               (keydown)=\"handleInputKeyDown($event)\"\n               (blur)=\"handleBlur()\"/>\n        <div class=\"button-wrapper\">\n            <co-button *ngIf=\"showButtons\" class=\"plus-operator\" [class.select]=\"plusSelected\" tabindex=\"-1\"\n                       [disabled]=\"readonly\"\n                       [iconData]=\"iconCacheService.getIcon(plusIcon)\"\n                       (mousedown)=\"onPlusMouseDown($event)\"\n                       (mouseup)=\"stopAutoCounting()\" (mouseleave)=\"stopAutoCounting()\"></co-button>\n        </div>\n    ",
+                    template: "\n        <div class=\"icon-wrapper\" *ngIf=\"leftIconData\">\n            <co-icon class=\"input-number-picker-icon\" [iconData]=\"leftIconData\" (click)=\"iconClick.emit($event)\"></co-icon>\n            <div class=\"spacer\"></div>\n        </div>\n        <div class=\"button-wrapper\">\n            <co-button *ngIf=\"showButtons\" class=\"minus-operator\" [class.select]=\"minSelected\" tabindex=\"-1\"\n                       [disabled]=\"readonly\"\n                       [iconData]=\"iconCacheService.getIcon(minusIcon)\"\n                       (mousedown)=\"onMinusMouseDown($event)\"\n                       (mouseup)=\"stopAutoCounting()\" (mouseleave)=\"stopAutoCounting()\"></co-button>\n        </div>\n        <div class=\"input-wrapper\">\n          <span class='permanent-label' [textContent]=\"label\" *ngIf=\"showPermanentLabel\"></span>\n          <input type=\"text\"\n                 [tabIndex]=\"readonly ? -1 : 0\"\n                 [ngModel]=\"model\"\n                 [readonly]=\"readonly\"\n                 [disabled]=\"disabled\"\n                 [required]=\"required\"\n                 [placeholder]=\"label\"\n                 (ngModelChange)=\"handleChangeModel($event)\"\n                 (keydown)=\"handleInputKeyDown($event)\"\n                 (blur)=\"handleBlur()\"/>\n        </div>\n        <div class=\"button-wrapper\">\n            <co-button *ngIf=\"showButtons\" class=\"plus-operator\" [class.select]=\"plusSelected\" tabindex=\"-1\"\n                       [disabled]=\"readonly\"\n                       [iconData]=\"iconCacheService.getIcon(plusIcon)\"\n                       (mousedown)=\"onPlusMouseDown($event)\"\n                       (mouseup)=\"stopAutoCounting()\" (mouseleave)=\"stopAutoCounting()\"></co-button>\n        </div>\n    ",
                     providers: [
                         OverlayService, {
                             provide: SCREEN_CONFIG_ADAPTER_COMPONENT_INTERFACE_NAME, useExisting: i0.forwardRef(function () { return InputNumberPickerComponent; })
@@ -8223,6 +8224,7 @@
     InputNumberPickerComponent.propDecorators = {
         model: [{ type: i0.Input }],
         modelChangeOnEnter: [{ type: i0.Input }],
+        showPermanentLabel: [{ type: i0.Input }],
         leftIconData: [{ type: i0.HostBinding, args: ['class.has-icon',] }, { type: i0.Input }],
         min: [{ type: i0.Input }],
         step: [{ type: i0.Input }],
@@ -10110,7 +10112,7 @@
                 exportData = data.map(function (item) {
                     var newItem = {};
                     columns.forEach(function (col) {
-                        newItem[col.header] = _this.getNestedValue(item, col.key);
+                        newItem[col.header] = _this.getFlatValue(item, col.key);
                     });
                     return newItem;
                 });
@@ -10186,6 +10188,9 @@
                 return current && current[key] !== undefined ? current[key] : '';
             }, obj);
         };
+        ExcelExportService.prototype.getFlatValue = function (obj, key) {
+            return obj && obj[key] !== undefined ? obj[key] : '';
+        };
         /**
          * Format date for Excel export
          * @param date - Date to format
@@ -10246,8 +10251,8 @@
             _this.selectedRowIndex = -1;
             _this.currentPage = 1;
             _this.sortDirection = 'asc';
-            _this.Icons = exports.CoreComponentsIcon;
             _this.hoveredRowIndex = -1;
+            _this.Icons = exports.CoreComponentsIcon;
             _this._doubleClicked = false;
             _this._newRow = false;
             _this.IconCacheService = IconCacheService;
@@ -10442,18 +10447,31 @@
                 });
             });
         };
-        SimpleGridComponent.prototype.editRow = function (event, selectCell) {
-            var _this = this;
+        SimpleGridComponent.prototype.editRow = function (event, selectCell, rowIndex) {
             if (selectCell === void 0) { selectCell = true; }
-            this.editRowIndex = this.selectedRowIndex;
-            this.rowToEdit = this.data[this.editRowIndex];
-            this.editing = true;
-            if (selectCell) {
-                this._nextAvailableCellToEdit(true).then(function (index) {
-                    _this.editCellIndex = index;
+            return __awaiter(this, void 0, void 0, function () {
+                var _a;
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0:
+                            if (rowIndex !== undefined) {
+                                this.selectTheRow(rowIndex, false);
+                            }
+                            this.editRowIndex = this.selectedRowIndex;
+                            this.rowToEdit = this.data[this.editRowIndex];
+                            this.editing = true;
+                            if (!selectCell) return [3 /*break*/, 2];
+                            _a = this;
+                            return [4 /*yield*/, this._nextAvailableCellToEdit(true)];
+                        case 1:
+                            _a.editCellIndex = _b.sent();
+                            _b.label = 2;
+                        case 2:
+                            this._detectChanges();
+                            return [2 /*return*/];
+                    }
                 });
-            }
-            this._detectChanges();
+            });
         };
         SimpleGridComponent.prototype.handleCellClick = function (event, row, rowIndex, cellIndex) {
             return __awaiter(this, void 0, void 0, function () {
@@ -10552,7 +10570,45 @@
             this.headerColumnsCopy = this.headerColumns;
         };
         SimpleGridComponent.prototype.exportToExcel = function () {
-            this.excelExportService.exportTableToExcel('simple-grid-table', 'ExcelSheet', 'Sheet1');
+            this.isSettingsMenuOpen = false;
+            var columns = this.headerColumnsCopy.map(function (column) {
+                return ({
+                    key: column.field,
+                    header: column.headerText
+                });
+            });
+            var headers = columns.map(function (col) { return col.header; });
+            var rows = this.data.map(function (row) { return columns.map(function (col) {
+                var value = row[col.key];
+                if (value instanceof Date) {
+                    var pad = function (n) { return String(n).padStart(2, '0'); };
+                    return value.getFullYear() + "-" + pad(value.getMonth() + 1) + "-" + pad(value.getDate()) + "T" + pad(value.getHours()) + ":" + pad(value.getMinutes()) + ":" + pad(value.getSeconds());
+                }
+                else if (Array.isArray(value)) {
+                    return value.join(', ');
+                }
+                else if (typeof value === 'object' && value !== null) {
+                    return JSON.stringify(value);
+                }
+                else {
+                    return String(value !== null && value !== void 0 ? value : '');
+                }
+            }); });
+            var csvContent = __spreadArray([headers], __read(rows)).map(function (row) { return row.map(function (cell) { return "\"" + cell.replace(/"/g, '""') + "\""; }).join(','); }).join('\r\n');
+            var blob = new Blob([csvContent], { type: 'text/csv;charset=utf-8;' });
+            var link = document.createElement('a');
+            var url = URL.createObjectURL(blob);
+            link.href = url;
+            link.setAttribute('download', 'ExcelSheet');
+            document.body.appendChild(link);
+            link.click();
+            document.body.removeChild(link);
+            // this.excelExportService.exportToExcel(
+            //   this.data,
+            //   columns,
+            //   'ExcelSheet',
+            //   'Sheet1'
+            // );
         };
         SimpleGridComponent.prototype.prepareDataRow = function (row, index) {
             this.isRowDisabled(row, index);
@@ -10712,7 +10768,7 @@
     SimpleGridComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'co-simple-grid',
-                    template: "\n    <co-grid-toolbar\n      *ngIf=\"showToolbar\" [class.right]=\"rightToolbar\"\n      [showEdit]=\"showEdit\"\n      [showAdd]=\"showAdd\"\n      [showDelete]=\"showDelete\"\n      [deleteEnabled]=\"selectedRowIndex > -1\"\n      (addClick)=\"addNewRow()\"\n      (editClick)=\"editRow($event)\"\n      (saveClick)=\"validateAndSave()\"\n      (cancelClick)=\"cancelEditRow()\"\n      (deleteClick)=\"removeRow()\">\n    </co-grid-toolbar>\n\n    <table\n      id=\"simple-grid-table\"\n      class=\"simple-grid-table\"\n      [clickOutside]=\"editing\"\n      (clickOutside)=\"handleClickOutsideRow()\">\n      <colgroup>\n        <col\n          *ngFor=\"let column of headerColumnsCopy; let index = index\"\n          [class.simple-grid-column-auto-fit]=\"column.autoFit\"\n          [style.width.px]=\"column.width\"\n          [style.min-width.px]=\"MIN_COLUMN_WIDTH\">\n      </colgroup>\n      <thead>\n      <tr>\n        <th\n          scope=\"col\"\n          #headerCell\n          class=\"simple-grid-column-header\"\n          *ngFor=\"let column of headerColumnsCopy; let index = index\">\n          <div\n            class=\"simple-grid-column-header-wrapper\"\n            [class.resizable]=\"resizable\"\n            [class.selected]=\"column.isSelected\"\n            [ngClass]=\"column.textAlign ? column.textAlign : defaultTextAlign\">\n            <ng-container *ngIf=\"column.headerTemplate; else noHeaderTemplate\">\n              <ng-container [ngTemplateOutlet]=\"column.headerTemplate\"></ng-container>\n            </ng-container>\n            <ng-template #noHeaderTemplate>\n              <div\n                class=\"simple-grid-column-header-label\"\n                [ngClass]=\"column.textAlign ? column.textAlign : defaultTextAlign\"\n                [class.with-menu]=\"showGridSettings\"\n                [class.with-sort]=\"showColumnSort\"\n                [textContent]=\"column.headerText || '&nbsp;'\"\n                (click)=\"showColumnSort ? sortColumn(column, column.field) : toggleColumnMenu(column)\">\n              </div>\n\n              <div class=\"sort-column\" *ngIf=\"showColumnSort\">\n                <co-button\n                  (click)=\"sortColumn(column, column?.field)\"\n                  [iconData]=\"icons.getIcon(Icons.ArrowUpArrowDown)\">\n                </co-button>\n              </div>\n\n              <div class=\"column-menu\" *ngIf=\"column.isSelected\">\n                <h3 [textContent]=\"'COLUMN_OPTIONS' | coreLocalize\"></h3>\n                <ul>\n                  <li (click)=\"hideColumn(column)\">Hide Column</li>\n                  <li (click)=\"sortColumn(column, column.field)\">Sort Column</li>\n                </ul>\n              </div>\n            </ng-template>\n            <div\n              *ngIf=\"resizable && column.resizable\"\n              class=\"simple-grid-column-sizer\"\n              (mousedown)=\"handleSizerMouseDown($event, column)\">\n            </div>\n          </div>\n        </th>\n      </tr>\n\n      <div *ngIf=\"showGridSettings\" class=\"grid-settings\">\n        <co-button\n          [class.selected]=\"isSettingsMenuOpen\"\n          [iconData]=\"icons.getIcon(Icons.CogWheels)\"\n          (click)=\"toggleSettingsMenu()\">\n        </co-button>\n\n        <div class=\"settings-menu\" *ngIf=\"isSettingsMenuOpen\">\n          <h3 [textContent]=\"'GRID_OPTIONS' | coreLocalize\"></h3>\n          <ul>\n            <li (click)=\"exportToExcel()\">Export to Excel</li>\n            <li *ngIf=\"headerColumnsCopy.length !== headerColumns.length\" (click)=\"showAllColumns()\">\n              Show All Columns\n            </li>\n          </ul>\n        </div>\n      </div>\n      </thead>\n      <tbody\n        #dropList cdkDropList cdkDropListOrientation=\"vertical\"\n        class=\"simple-grid-drag-drop-list\"\n        [cdkDropListDisabled]=\"!dragDropEnabled || editing\"\n        [cdkDropListData]=\"data\"\n        [cdkDropListEnterPredicate]=\"handleCanDragDrop\"\n        (cdkDropListDropped)=\"handleDrop($event)\">\n      <co-form class=\"simple-grid-row-form\">\n        <tr\n          class=\"simple-grid-row\"\n          [class.selected]=\"rowIndex === selectedRowIndex && !editing\" observeVisibility\n          [class.disabled]=\"getIsRowDisabled(rowIndex)\"\n          [class.editing]=\"rowIndex === editRowIndex\"\n          *ngFor=\"let row of (!!rowsPerPage ? (data | paginate: {itemsPerPage: rowsPerPage, currentPage: currentPage}) : data); last as last; let rowIndex = index\"\n          cdkDrag\n          (click)=\"handleClickRow($event, rowIndex, row)\" (dblclick)=\"handleDblClickRow($event, rowIndex, row)\"\n          (visibilityChange)=\"rowVisible.next(row)\"\n          (mouseenter)=\"hoveredRowIndex = rowIndex\"\n          (mouseleave)=\"hoveredRowIndex = -1\"\n        >\n          <ng-container *ngIf=\"isSingleColumnRow(row)\">\n            <td class=\"simple-grid-single-column-cell\" [attr.colspan]=\"headerColumnsCopy.length\">\n              <co-simple-grid-cell\n                [column]=\"columns[singleColumnIndex(row)]\"\n                [row]=\"row\"\n                [editMode]=\"false\">\n              </co-simple-grid-cell>\n            </td>\n          </ng-container>\n          <ng-container *ngIf=\"!isSingleColumnRow(row)\">\n            <ng-container *ngFor=\"let column of headerColumnsCopy; let columnIndex = index\">\n              <td class=\"simple-grid-column-cell\" *ngIf=\"columnIndex !== singleColumnIndex(row)\">\n                <co-simple-grid-cell\n                  [column]=\"column\"\n                  [row]=\"row\"\n                  [editMode]=\"inlineEdit && editing && rowIndex === editRowIndex\"\n                  [fieldEditMode]=\"editCellIndex === columnIndex && rowIndex === editRowIndex\"\n                  (cellClick)=\"handleCellClick($event, row, rowIndex, columnIndex)\">\n                </co-simple-grid-cell>\n                <div *ngIf=\"column.resizable\" class=\"simple-grid-column-sizer-placeholder\"></div>\n              </td>\n            </ng-container>\n            <ng-container *ngIf=\"inlineEdit\">\n              <div class=\"icons-container\" *ngIf=\"!editing\">\n                <co-icon class=\"icon-item icon-edit\"\n                         [iconData]=\"icons.getIcon(Icons.PenToSquareSolid)\" *ngIf=\"hoveredRowIndex === rowIndex\"\n                         (click)=\"editRow($event)\"></co-icon>\n\n                <co-icon class=\"icon-item icon-delete\"\n                         [iconData]=\"icons.getIcon(Icons.TrashBin)\" *ngIf=\"hoveredRowIndex === rowIndex\"\n                         (click)=\"removeRow()\"></co-icon>\n              </div>\n              <div class=\"icons-container\">\n                <co-button class=\"save-button\"\n                           *ngIf=\"editing && (selectedRowIndex === rowIndex || (isNewRow && rowIndex === editRowIndex))\"\n                           [iconData]=\"icons.getIcon(Icons.CheckDuotone)\"\n                           (click)=\"validateAndSave(); $event.stopPropagation()\"></co-button>\n\n                <co-button class=\"close-button\"\n                           *ngIf=\"editing && (selectedRowIndex === rowIndex || (isNewRow && rowIndex === editRowIndex))\"\n                           [iconData]=\"icons.getIcon(Icons.CrossSkinny)\"\n                           (click)=\"cancelEditRow(); $event.stopPropagation() \"></co-button>\n              </div>\n            </ng-container>\n          </ng-container>\n        </tr>\n      </co-form>\n      </tbody>\n    </table>\n\n    <co-pagination-bar\n      *ngIf=\"data?.length > rowsPerPage\" class=\"pagination-bar\"\n      [itemsPerPage]=\"rowsPerPage\"\n      [currentPage]=\"currentPage\"\n      [totalItems]=\"data.length\"\n      [autoHide]=\"true\"\n      (previousClick)=\"goToPreviousPage()\"\n      (nextClick)=\"goToNextPage()\"\n      (pageClick)=\"setCurrentPage($event)\">\n    </co-pagination-bar>\n  ",
+                    template: "\n    <co-grid-toolbar\n      *ngIf=\"showToolbar\" [class.right]=\"rightToolbar\"\n      [showEdit]=\"showEdit\"\n      [showAdd]=\"showAdd\"\n      [showDelete]=\"showDelete\"\n      [deleteEnabled]=\"selectedRowIndex > -1\"\n      (addClick)=\"addNewRow()\"\n      (editClick)=\"editRow($event)\"\n      (saveClick)=\"validateAndSave()\"\n      (cancelClick)=\"cancelEditRow()\"\n      (deleteClick)=\"removeRow()\">\n    </co-grid-toolbar>\n\n    <table\n      id=\"simple-grid-table\"\n      class=\"simple-grid-table\"\n      [clickOutside]=\"editing\"\n      (clickOutside)=\"handleClickOutsideRow()\">\n      <colgroup>\n        <col\n          *ngFor=\"let column of headerColumnsCopy; let index = index\"\n          [class.simple-grid-column-auto-fit]=\"column.autoFit\"\n          [style.width.px]=\"column.width\"\n          [style.min-width.px]=\"MIN_COLUMN_WIDTH\">\n      </colgroup>\n      <thead>\n      <tr>\n        <th\n          scope=\"col\"\n          #headerCell\n          class=\"simple-grid-column-header\"\n          *ngFor=\"let column of headerColumnsCopy; let index = index\">\n          <div\n            class=\"simple-grid-column-header-wrapper\"\n            [class.resizable]=\"resizable\"\n            [class.selected]=\"column.isSelected\"\n            [ngClass]=\"column.textAlign ? column.textAlign : defaultTextAlign\">\n            <ng-container *ngIf=\"column.headerTemplate; else noHeaderTemplate\">\n              <ng-container [ngTemplateOutlet]=\"column.headerTemplate\"></ng-container>\n            </ng-container>\n            <ng-template #noHeaderTemplate>\n              <div\n                class=\"simple-grid-column-header-label\"\n                [ngClass]=\"column.textAlign ? column.textAlign : defaultTextAlign\"\n                [class.with-menu]=\"showGridSettings\"\n                [class.with-sort]=\"showColumnSort\"\n                [textContent]=\"column.headerText || '&nbsp;'\"\n                (click)=\"showColumnSort ? sortColumn(column, column.field) : toggleColumnMenu(column)\">\n              </div>\n\n              <div class=\"sort-column\" *ngIf=\"showColumnSort\">\n                <co-button\n                  (click)=\"sortColumn(column, column?.field)\"\n                  [iconData]=\"icons.getIcon(Icons.ArrowUpArrowDown)\">\n                </co-button>\n              </div>\n\n              <div class=\"column-menu\" *ngIf=\"column.isSelected\">\n                <h3 [textContent]=\"'COLUMN_OPTIONS' | coreLocalize\"></h3>\n                <ul>\n                  <li (click)=\"hideColumn(column)\">Hide Column</li>\n                  <li (click)=\"sortColumn(column, column.field)\">Sort Column</li>\n                </ul>\n              </div>\n            </ng-template>\n            <div\n              *ngIf=\"resizable && column.resizable\"\n              class=\"simple-grid-column-sizer\"\n              (mousedown)=\"handleSizerMouseDown($event, column)\">\n            </div>\n          </div>\n        </th>\n      </tr>\n\n      <div *ngIf=\"showGridSettings\" class=\"grid-settings\">\n        <co-button\n          [class.selected]=\"isSettingsMenuOpen\"\n          [iconData]=\"icons.getIcon(Icons.CogWheels)\"\n          (click)=\"toggleSettingsMenu()\">\n        </co-button>\n\n        <div class=\"settings-menu\" *ngIf=\"isSettingsMenuOpen\">\n          <h3 [textContent]=\"'GRID_OPTIONS' | coreLocalize\"></h3>\n          <ul>\n            <li (click)=\"exportToExcel()\">Export to Excel</li>\n            <li *ngIf=\"headerColumnsCopy.length !== headerColumns.length\" (click)=\"showAllColumns()\">\n              Show All Columns\n            </li>\n          </ul>\n        </div>\n      </div>\n      </thead>\n      <tbody\n        #dropList cdkDropList cdkDropListOrientation=\"vertical\"\n        class=\"simple-grid-drag-drop-list\"\n        [cdkDropListDisabled]=\"!dragDropEnabled || editing\"\n        [cdkDropListData]=\"data\"\n        [cdkDropListEnterPredicate]=\"handleCanDragDrop\"\n        (cdkDropListDropped)=\"handleDrop($event)\">\n      <co-form class=\"simple-grid-row-form\">\n        <tr\n          class=\"simple-grid-row\"\n          [class.selected]=\"rowIndex === selectedRowIndex && !editing\" observeVisibility\n          [class.disabled]=\"getIsRowDisabled(rowIndex)\"\n          [class.editing]=\"rowIndex === editRowIndex\"\n          *ngFor=\"let row of (!!rowsPerPage ? (data | paginate: {itemsPerPage: rowsPerPage, currentPage: currentPage}) : data); last as last; let rowIndex = index\"\n          cdkDrag\n          (click)=\"handleClickRow($event, rowIndex, row)\" (dblclick)=\"handleDblClickRow($event, rowIndex, row)\"\n          (visibilityChange)=\"rowVisible.next(row)\"\n          (mouseenter)=\"hoveredRowIndex = rowIndex\"\n          (mouseleave)=\"hoveredRowIndex = -1\"\n        >\n          <ng-container *ngIf=\"isSingleColumnRow(row)\">\n            <td class=\"simple-grid-single-column-cell\" [attr.colspan]=\"headerColumnsCopy.length\">\n              <co-simple-grid-cell\n                [column]=\"columns[singleColumnIndex(row)]\"\n                [row]=\"row\"\n                [editMode]=\"false\">\n              </co-simple-grid-cell>\n            </td>\n          </ng-container>\n          <ng-container *ngIf=\"!isSingleColumnRow(row)\">\n            <ng-container *ngFor=\"let column of headerColumnsCopy; let columnIndex = index\">\n              <td class=\"simple-grid-column-cell\" *ngIf=\"columnIndex !== singleColumnIndex(row)\">\n                <co-simple-grid-cell\n                  [column]=\"column\"\n                  [row]=\"row\"\n                  [editMode]=\"inlineEdit && editing && rowIndex === editRowIndex\"\n                  [fieldEditMode]=\"editCellIndex === columnIndex && rowIndex === editRowIndex\"\n                  (cellClick)=\"handleCellClick($event, row, rowIndex, columnIndex)\">\n                </co-simple-grid-cell>\n                <div *ngIf=\"column.resizable\" class=\"simple-grid-column-sizer-placeholder\"></div>\n              </td>\n            </ng-container>\n            <ng-container *ngIf=\"inlineEdit\">\n              <div class=\"icons-container\" *ngIf=\"!editing\">\n                <co-icon class=\"icon-item icon-edit\"\n                         [iconData]=\"icons.getIcon(Icons.PenToSquareSolid)\" *ngIf=\"hoveredRowIndex === rowIndex\"\n                         (click)=\"editRow($event, true, rowIndex); $event.stopPropagation()\"></co-icon>\n                <co-icon class=\"icon-item icon-delete\"\n                         [iconData]=\"icons.getIcon(Icons.TrashBin)\" *ngIf=\"hoveredRowIndex === rowIndex\"\n                         (click)=\"removeRow()\"></co-icon>\n              </div>\n              <div class=\"icons-container\">\n                <co-button class=\"save-button\"\n                           *ngIf=\"editing && (selectedRowIndex === rowIndex || (isNewRow && rowIndex === editRowIndex))\"\n                           [iconData]=\"icons.getIcon(Icons.CheckDuotone)\"\n                           (click)=\"validateAndSave(); $event.stopPropagation()\"></co-button>\n                <co-button class=\"close-button\"\n                           *ngIf=\"editing && (selectedRowIndex === rowIndex || (isNewRow && rowIndex === editRowIndex))\"\n                           [iconData]=\"icons.getIcon(Icons.CrossSkinny)\"\n                           (click)=\"cancelEditRow(); $event.stopPropagation() \"></co-button>\n              </div>\n            </ng-container>\n          </ng-container>\n        </tr>\n      </co-form>\n      </tbody>\n    </table>\n    <co-pagination-bar\n      *ngIf=\"data?.length > rowsPerPage\" class=\"pagination-bar\"\n      [itemsPerPage]=\"rowsPerPage\"\n      [currentPage]=\"currentPage\"\n      [totalItems]=\"data.length\"\n      [autoHide]=\"true\"\n      (previousClick)=\"goToPreviousPage()\"\n      (nextClick)=\"goToNextPage()\"\n      (pageClick)=\"setCurrentPage($event)\">\n    </co-pagination-bar>\n  ",
                     providers: [FormMasterService],
                     changeDetection: i0.ChangeDetectionStrategy.OnPush,
                     encapsulation: i0.ViewEncapsulation.None