@firestitch/list 13.2.0 → 13.2.2

package/fesm2020/firestitch-list.mjs

@@ -131,7 +131,7 @@ class ReorderController {
                 },
                 disabled: () => {
                     return this.reorderDisabled;
-                }
+                },
             });
             actionsController.addReorderDoneAction({
                 label: 'Done',
@@ -214,7 +214,7 @@ ReorderController.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", versio
 ReorderController.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ReorderController });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: ReorderController, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return []; } });
+        }] });
 
 var SelectionChangeType;
 (function (SelectionChangeType) {
@@ -1867,6 +1867,9 @@ class FsRowComponent {
         else {
             classes.push('fs-list-row-body');
         }
+        if (this.rowEvents?.click) {
+            classes.push('fs-list-row-clickable');
+        }
         if (this.rowClass) {
             classes = [
                 ...classes,
@@ -1957,19 +1960,15 @@ class FsRowComponent {
     _initRowEvents() {
         Object.keys(this.rowEvents || {})
             .forEach((event) => {
-            if (this.rowEvents.hasOwnProperty(event)) {
-                const listener = this._renderer
-                    .listen(this.el.nativeElement, event, (evt) => {
-                    if (!this.reorderEnabled) {
-                        this.rowEvents[event]({
-                            event: evt,
-                            row: this.row.data,
-                            rowIndex: this.rowIndex,
-                        });
-                    }
+            const listener = this._renderer
+                .listen(this.el.nativeElement, event, (evt) => {
+                this.rowEvents[event]({
+                    event: evt,
+                    row: this.row.data,
+                    rowIndex: this.rowIndex,
                 });
-                this._eventListeners.push(listener);
-            }
+            });
+            this._eventListeners.push(listener);
         });
     }
     _initRowActionsUpdate() {
@@ -2062,10 +2061,10 @@ class FsRowComponent {
     }
 }
 FsRowComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: FsRowComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.KeyValueDiffers }, { token: i0.Renderer2 }, { token: FsListDraggableListDirective }], target: i0.ɵɵFactoryTarget.Component });
-FsRowComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: FsRowComponent, selector: "[fs-list-row]", inputs: { row: "row", rowActionsRaw: "rowActionsRaw", groupActionsRaw: "groupActionsRaw", hasRowActions: "hasRowActions", rowEvents: "rowEvents", rowClass: "rowClass", restoreMode: "restoreMode", rowIndex: "rowIndex", columns: "columns", selection: "selection", rowRemoved: "rowRemoved", activeFiltersCount: "activeFiltersCount", reorderEnabled: "reorderEnabled", reorderPosition: "reorderPosition", reorderStrategy: "reorderStrategy", reorderMultiple: "reorderMultiple" }, host: { properties: { "attr.role": "this.role", "class.drag-row": "this.reorderEnabled", "class.multiple-selection": "this.isMultipleSelection", "class": "this.rowCssClass" } }, viewQueries: [{ propertyName: "cellRefs", predicate: ["td"], descendants: true }], ngImport: i0, template: "<!-- Drag -->\n<ng-container *ngIf=\"leftDragDropEnabled\">\n  <ng-container *ngTemplateOutlet=\"dragCell\"></ng-container>\n</ng-container>\n\n<!-- Selection -->\n<ng-container *ngIf=\"selection && !(selection.disabled$ | async)\">\n  <td class=\"fs-list-col fs-list-col-selection\">\n    <ng-container *ngIf=\"!row.isGroupFooter\">\n      <mat-checkbox \n        (change)=\"selectRow($event)\"\n        [checked]=\"selected\"\n        [indeterminate]=\"indeterminateSelected\">\n      </mat-checkbox>\n    </ng-container>\n  </td>\n</ng-container>\n\n<!-- Content -->\n<ng-container *ngFor=\"let column of columns; trackBy: trackByFn; let isFirst = first\">\n  <td fs-cell\n      *ngIf=\"(isGroupRow && !column.groupHeaderColspanned)\n        || (isGroupFooterRow && !column.groupFooterColspanned)\n        || (!isGroupRow && !isGroupFooterRow && !column.cellColspanned)\"\n      [column]=\"column\"\n      [row]=\"row\"\n      [rowIndex]=\"rowIndex\"\n      [class]=\"(isGroupRow && column.groupHeaderConfigs.classesString)\n        || (isGroupFooterRow && column.groupFooterConfigs.classesString)\n        || (!isGroupFooterRow && column.cellConfigs.classesString)\"\n      [ngClass]=\"{ 'primary-col': isFirst }\"\n      [attr.colspan]=\"(isGroupRow && column.groupHeaderConfigs.colspan)\n        || (isGroupFooterRow && column.groupFooterConfigs.colspan)\n        || column.cellConfigs.colspan\"\n      [attr.width]=\"column.width\"\n  >\n  </td>\n</ng-container>\n\n<!-- Drag -->\n<ng-container *ngIf=\"rightDragDropEnabled\">\n  <ng-container *ngTemplateOutlet=\"dragCell\"></ng-container>\n</ng-container>\n\n<!-- Row Actions -->\n<td *ngIf=\"hasRowActions && !(reorderEnabled && reorderStrategy === ReorderStrategy.Manual)\" class=\"fs-list-col row-actions\">\n  <ng-container *ngIf=\"!isGroupFooterRow\">\n    <fs-list-row-actions\n      [row]=\"row\"\n      [index]=\"rowIndex\"\n      [rowActions]=\"rowActions\"\n      [menuRowActions]=\"menuRowActions\"\n      [inlineRowActions]=\"inlineRowActions\"\n      [restoreAction]=\"restoreAction\"\n      [restoreMode]=\"restoreMode\"\n      [rowRemoved]=\"rowRemoved\">\n    </fs-list-row-actions>\n  </ng-container>\n</td>\n\n<ng-template #dragCell>\n  <ng-container *ngIf=\"dragCellVisible && !isGroupFooterRow; else emptyCell\">\n    <td \n        class=\"fs-list-col drag-col\"\n        [class.drag-disabled]=\"isDragDisabled\"\n        (mousedown)=\"dragStart($event)\"\n        (touchstart)=\"dragStart($event)\">\n      <mat-icon>drag_handle</mat-icon>\n    </td>\n  </ng-container>\n  <ng-template #emptyCell>\n    <td class=\"fs-list-col drag-col\"></td>\n  </ng-template>\n</ng-template>\n", styles: [":host.drag-hidden{display:none}:host.draggable{opacity:.8;position:fixed;z-index:9999;box-shadow:2px 2px 2px #9e9e9ea6;border-radius:5px}:host.draggable td{border:none;background-color:#fff}:host.draggable-elem td{background-color:#c3c3c3}td.drag-col{width:24px;text-align:center;cursor:grab}td.drag-col.drag-disabled{opacity:.4;cursor:no-drop}td.drag-col mat-icon{display:flex}td.fs-list-col-selection{padding:10px}td.row-actions{width:1%;white-space:nowrap;overflow:hidden}td.row-actions .row-inline-action{margin-left:12px;display:inline-block}td.row-actions .row-inline-action:first-child{margin-left:0}td.row-actions .row-inline-action-icon,td.row-actions .row-inline-action-fab,td.row-actions .row-inline-action-mini-fab,td.row-actions .row-menu-action{width:35px;justify-content:center;align-items:center}td.left{text-align:left}td.center{text-align:center}td.right{text-align:right}\n"], components: [{ type: i2$2.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: FsCellComponent, selector: "[fs-cell]", inputs: ["column", "row", "rowIndex"] }, { type: FsRowActionsComponent, selector: "fs-list-row-actions", inputs: ["row", "index", "restoreMode", "rowActions", "rowRemoved", "menuRowActions", "inlineRowActions", "restoreAction"] }, { type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "async": i3.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+FsRowComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: FsRowComponent, selector: "[fs-list-row]", inputs: { row: "row", rowActionsRaw: "rowActionsRaw", groupActionsRaw: "groupActionsRaw", hasRowActions: "hasRowActions", rowEvents: "rowEvents", rowClass: "rowClass", restoreMode: "restoreMode", rowIndex: "rowIndex", columns: "columns", selection: "selection", rowRemoved: "rowRemoved", activeFiltersCount: "activeFiltersCount", reorderEnabled: "reorderEnabled", reorderPosition: "reorderPosition", reorderStrategy: "reorderStrategy", reorderMultiple: "reorderMultiple" }, host: { properties: { "attr.role": "this.role", "class.drag-row": "this.reorderEnabled", "class.multiple-selection": "this.isMultipleSelection", "class": "this.rowCssClass" } }, viewQueries: [{ propertyName: "cellRefs", predicate: ["td"], descendants: true }], ngImport: i0, template: "<!-- Drag -->\n<ng-container *ngIf=\"leftDragDropEnabled\">\n  <ng-container *ngTemplateOutlet=\"dragCell\"></ng-container>\n</ng-container>\n\n<!-- Selection -->\n<ng-container *ngIf=\"selection && !(selection.disabled$ | async)\">\n  <td class=\"fs-list-col fs-list-col-selection\">\n    <ng-container *ngIf=\"!row.isGroupFooter\">\n      <mat-checkbox \n        (change)=\"selectRow($event)\"\n        [checked]=\"selected\"\n        [indeterminate]=\"indeterminateSelected\">\n      </mat-checkbox>\n    </ng-container>\n  </td>\n</ng-container>\n\n<!-- Content -->\n<ng-container *ngFor=\"let column of columns; trackBy: trackByFn; let isFirst = first\">\n  <td fs-cell\n      *ngIf=\"(isGroupRow && !column.groupHeaderColspanned)\n        || (isGroupFooterRow && !column.groupFooterColspanned)\n        || (!isGroupRow && !isGroupFooterRow && !column.cellColspanned)\"\n      [column]=\"column\"\n      [row]=\"row\"\n      [rowIndex]=\"rowIndex\"\n      [class]=\"(isGroupRow && column.groupHeaderConfigs.classesString)\n        || (isGroupFooterRow && column.groupFooterConfigs.classesString)\n        || (!isGroupFooterRow && column.cellConfigs.classesString)\"\n      [ngClass]=\"{ 'primary-col': isFirst }\"\n      [attr.colspan]=\"(isGroupRow && column.groupHeaderConfigs.colspan)\n        || (isGroupFooterRow && column.groupFooterConfigs.colspan)\n        || column.cellConfigs.colspan\"\n      [attr.width]=\"column.width\"\n  >\n  </td>\n</ng-container>\n\n<!-- Drag -->\n<ng-container *ngIf=\"rightDragDropEnabled\">\n  <ng-container *ngTemplateOutlet=\"dragCell\"></ng-container>\n</ng-container>\n\n<!-- Row Actions -->\n<td *ngIf=\"hasRowActions && !(reorderEnabled && reorderStrategy === ReorderStrategy.Manual)\" class=\"fs-list-col row-actions\">\n  <ng-container *ngIf=\"!isGroupFooterRow\">\n    <fs-list-row-actions\n      [row]=\"row\"\n      [index]=\"rowIndex\"\n      [rowActions]=\"rowActions\"\n      [menuRowActions]=\"menuRowActions\"\n      [inlineRowActions]=\"inlineRowActions\"\n      [restoreAction]=\"restoreAction\"\n      [restoreMode]=\"restoreMode\"\n      [rowRemoved]=\"rowRemoved\">\n    </fs-list-row-actions>\n  </ng-container>\n</td>\n\n<ng-template #dragCell>\n  <ng-container *ngIf=\"dragCellVisible && !isGroupFooterRow; else emptyCell\">\n    <td \n        class=\"fs-list-col drag-col\"\n        [class.drag-disabled]=\"isDragDisabled\"\n        (mousedown)=\"dragStart($event)\"\n        (touchstart)=\"dragStart($event)\">\n      <mat-icon>drag_handle</mat-icon>\n    </td>\n  </ng-container>\n  <ng-template #emptyCell>\n    <td class=\"fs-list-col drag-col\"></td>\n  </ng-template>\n</ng-template>\n", styles: [":host.drag-hidden{display:none}:host.draggable{opacity:.8;position:fixed;z-index:9999;box-shadow:2px 2px 2px #9e9e9ea6;border-radius:5px}:host.draggable td{border:none;background-color:#fff}:host.draggable-elem td{background-color:#c3c3c3}:host.fs-list-row-clickable{cursor:pointer}td.drag-col{width:24px;text-align:center;cursor:grab}td.drag-col.drag-disabled{opacity:.4;cursor:no-drop}td.drag-col mat-icon{display:flex}td.fs-list-col-selection{padding:10px}td.row-actions{width:1%;white-space:nowrap;overflow:hidden}td.row-actions .row-inline-action{margin-left:12px;display:inline-block}td.row-actions .row-inline-action:first-child{margin-left:0}td.row-actions .row-inline-action-icon,td.row-actions .row-inline-action-fab,td.row-actions .row-inline-action-mini-fab,td.row-actions .row-menu-action{width:35px;justify-content:center;align-items:center}td.left{text-align:left}td.center{text-align:center}td.right{text-align:right}\n"], components: [{ type: i2$2.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: FsCellComponent, selector: "[fs-cell]", inputs: ["column", "row", "rowIndex"] }, { type: FsRowActionsComponent, selector: "fs-list-row-actions", inputs: ["row", "index", "restoreMode", "rowActions", "rowRemoved", "menuRowActions", "inlineRowActions", "restoreAction"] }, { type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "async": i3.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: FsRowComponent, decorators: [{
             type: Component,
-            args: [{ selector: '[fs-list-row]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Drag -->\n<ng-container *ngIf=\"leftDragDropEnabled\">\n  <ng-container *ngTemplateOutlet=\"dragCell\"></ng-container>\n</ng-container>\n\n<!-- Selection -->\n<ng-container *ngIf=\"selection && !(selection.disabled$ | async)\">\n  <td class=\"fs-list-col fs-list-col-selection\">\n    <ng-container *ngIf=\"!row.isGroupFooter\">\n      <mat-checkbox \n        (change)=\"selectRow($event)\"\n        [checked]=\"selected\"\n        [indeterminate]=\"indeterminateSelected\">\n      </mat-checkbox>\n    </ng-container>\n  </td>\n</ng-container>\n\n<!-- Content -->\n<ng-container *ngFor=\"let column of columns; trackBy: trackByFn; let isFirst = first\">\n  <td fs-cell\n      *ngIf=\"(isGroupRow && !column.groupHeaderColspanned)\n        || (isGroupFooterRow && !column.groupFooterColspanned)\n        || (!isGroupRow && !isGroupFooterRow && !column.cellColspanned)\"\n      [column]=\"column\"\n      [row]=\"row\"\n      [rowIndex]=\"rowIndex\"\n      [class]=\"(isGroupRow && column.groupHeaderConfigs.classesString)\n        || (isGroupFooterRow && column.groupFooterConfigs.classesString)\n        || (!isGroupFooterRow && column.cellConfigs.classesString)\"\n      [ngClass]=\"{ 'primary-col': isFirst }\"\n      [attr.colspan]=\"(isGroupRow && column.groupHeaderConfigs.colspan)\n        || (isGroupFooterRow && column.groupFooterConfigs.colspan)\n        || column.cellConfigs.colspan\"\n      [attr.width]=\"column.width\"\n  >\n  </td>\n</ng-container>\n\n<!-- Drag -->\n<ng-container *ngIf=\"rightDragDropEnabled\">\n  <ng-container *ngTemplateOutlet=\"dragCell\"></ng-container>\n</ng-container>\n\n<!-- Row Actions -->\n<td *ngIf=\"hasRowActions && !(reorderEnabled && reorderStrategy === ReorderStrategy.Manual)\" class=\"fs-list-col row-actions\">\n  <ng-container *ngIf=\"!isGroupFooterRow\">\n    <fs-list-row-actions\n      [row]=\"row\"\n      [index]=\"rowIndex\"\n      [rowActions]=\"rowActions\"\n      [menuRowActions]=\"menuRowActions\"\n      [inlineRowActions]=\"inlineRowActions\"\n      [restoreAction]=\"restoreAction\"\n      [restoreMode]=\"restoreMode\"\n      [rowRemoved]=\"rowRemoved\">\n    </fs-list-row-actions>\n  </ng-container>\n</td>\n\n<ng-template #dragCell>\n  <ng-container *ngIf=\"dragCellVisible && !isGroupFooterRow; else emptyCell\">\n    <td \n        class=\"fs-list-col drag-col\"\n        [class.drag-disabled]=\"isDragDisabled\"\n        (mousedown)=\"dragStart($event)\"\n        (touchstart)=\"dragStart($event)\">\n      <mat-icon>drag_handle</mat-icon>\n    </td>\n  </ng-container>\n  <ng-template #emptyCell>\n    <td class=\"fs-list-col drag-col\"></td>\n  </ng-template>\n</ng-template>\n", styles: [":host.drag-hidden{display:none}:host.draggable{opacity:.8;position:fixed;z-index:9999;box-shadow:2px 2px 2px #9e9e9ea6;border-radius:5px}:host.draggable td{border:none;background-color:#fff}:host.draggable-elem td{background-color:#c3c3c3}td.drag-col{width:24px;text-align:center;cursor:grab}td.drag-col.drag-disabled{opacity:.4;cursor:no-drop}td.drag-col mat-icon{display:flex}td.fs-list-col-selection{padding:10px}td.row-actions{width:1%;white-space:nowrap;overflow:hidden}td.row-actions .row-inline-action{margin-left:12px;display:inline-block}td.row-actions .row-inline-action:first-child{margin-left:0}td.row-actions .row-inline-action-icon,td.row-actions .row-inline-action-fab,td.row-actions .row-inline-action-mini-fab,td.row-actions .row-menu-action{width:35px;justify-content:center;align-items:center}td.left{text-align:left}td.center{text-align:center}td.right{text-align:right}\n"] }]
+            args: [{ selector: '[fs-list-row]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Drag -->\n<ng-container *ngIf=\"leftDragDropEnabled\">\n  <ng-container *ngTemplateOutlet=\"dragCell\"></ng-container>\n</ng-container>\n\n<!-- Selection -->\n<ng-container *ngIf=\"selection && !(selection.disabled$ | async)\">\n  <td class=\"fs-list-col fs-list-col-selection\">\n    <ng-container *ngIf=\"!row.isGroupFooter\">\n      <mat-checkbox \n        (change)=\"selectRow($event)\"\n        [checked]=\"selected\"\n        [indeterminate]=\"indeterminateSelected\">\n      </mat-checkbox>\n    </ng-container>\n  </td>\n</ng-container>\n\n<!-- Content -->\n<ng-container *ngFor=\"let column of columns; trackBy: trackByFn; let isFirst = first\">\n  <td fs-cell\n      *ngIf=\"(isGroupRow && !column.groupHeaderColspanned)\n        || (isGroupFooterRow && !column.groupFooterColspanned)\n        || (!isGroupRow && !isGroupFooterRow && !column.cellColspanned)\"\n      [column]=\"column\"\n      [row]=\"row\"\n      [rowIndex]=\"rowIndex\"\n      [class]=\"(isGroupRow && column.groupHeaderConfigs.classesString)\n        || (isGroupFooterRow && column.groupFooterConfigs.classesString)\n        || (!isGroupFooterRow && column.cellConfigs.classesString)\"\n      [ngClass]=\"{ 'primary-col': isFirst }\"\n      [attr.colspan]=\"(isGroupRow && column.groupHeaderConfigs.colspan)\n        || (isGroupFooterRow && column.groupFooterConfigs.colspan)\n        || column.cellConfigs.colspan\"\n      [attr.width]=\"column.width\"\n  >\n  </td>\n</ng-container>\n\n<!-- Drag -->\n<ng-container *ngIf=\"rightDragDropEnabled\">\n  <ng-container *ngTemplateOutlet=\"dragCell\"></ng-container>\n</ng-container>\n\n<!-- Row Actions -->\n<td *ngIf=\"hasRowActions && !(reorderEnabled && reorderStrategy === ReorderStrategy.Manual)\" class=\"fs-list-col row-actions\">\n  <ng-container *ngIf=\"!isGroupFooterRow\">\n    <fs-list-row-actions\n      [row]=\"row\"\n      [index]=\"rowIndex\"\n      [rowActions]=\"rowActions\"\n      [menuRowActions]=\"menuRowActions\"\n      [inlineRowActions]=\"inlineRowActions\"\n      [restoreAction]=\"restoreAction\"\n      [restoreMode]=\"restoreMode\"\n      [rowRemoved]=\"rowRemoved\">\n    </fs-list-row-actions>\n  </ng-container>\n</td>\n\n<ng-template #dragCell>\n  <ng-container *ngIf=\"dragCellVisible && !isGroupFooterRow; else emptyCell\">\n    <td \n        class=\"fs-list-col drag-col\"\n        [class.drag-disabled]=\"isDragDisabled\"\n        (mousedown)=\"dragStart($event)\"\n        (touchstart)=\"dragStart($event)\">\n      <mat-icon>drag_handle</mat-icon>\n    </td>\n  </ng-container>\n  <ng-template #emptyCell>\n    <td class=\"fs-list-col drag-col\"></td>\n  </ng-template>\n</ng-template>\n", styles: [":host.drag-hidden{display:none}:host.draggable{opacity:.8;position:fixed;z-index:9999;box-shadow:2px 2px 2px #9e9e9ea6;border-radius:5px}:host.draggable td{border:none;background-color:#fff}:host.draggable-elem td{background-color:#c3c3c3}:host.fs-list-row-clickable{cursor:pointer}td.drag-col{width:24px;text-align:center;cursor:grab}td.drag-col.drag-disabled{opacity:.4;cursor:no-drop}td.drag-col mat-icon{display:flex}td.fs-list-col-selection{padding:10px}td.row-actions{width:1%;white-space:nowrap;overflow:hidden}td.row-actions .row-inline-action{margin-left:12px;display:inline-block}td.row-actions .row-inline-action:first-child{margin-left:0}td.row-actions .row-inline-action-icon,td.row-actions .row-inline-action-fab,td.row-actions .row-inline-action-mini-fab,td.row-actions .row-menu-action{width:35px;justify-content:center;align-items:center}td.left{text-align:left}td.center{text-align:center}td.right{text-align:right}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i0.KeyValueDiffers }, { type: i0.Renderer2 }, { type: FsListDraggableListDirective }]; }, propDecorators: { role: [{
                 type: HostBinding,
                 args: ['attr.role']
@@ -3051,12 +3050,6 @@ class DataController {
         this._hasData = false;
         this._destroy$ = new Subject();
     }
-    get visibleRows$() {
-        return this._visibleRows$;
-    }
-    get visibleRows() {
-        return this._visibleRows$.getValue();
-    }
     get visibleRowsData() {
         return this.visibleRows.map((row) => row.data);
     }
@@ -3081,10 +3074,16 @@ class DataController {
     get operation() {
         return this._operation;
     }
+    get visibleRows$() {
+        return this._visibleRows$;
+    }
     set visibleRows(value) {
         this._visibleRows$.next(value);
         this._hasData = this.visibleRows.length > 0;
     }
+    get visibleRows() {
+        return this._visibleRows$.getValue();
+    }
     get visibleRowsCount() {
         return this.visibleRows.length;
     }
@@ -3102,7 +3101,7 @@ class DataController {
             this._footerRowFn = group.footer || (() => false);
             this._initialExpand = group.initialExpand ?? true;
             // group mode enabled by default
-            this._groupEnabled = (group.enabled !== void 0)
+            this._groupEnabled = (group.enabled !== undefined)
                 ? group.enabled
                 : true;
         }
@@ -3170,9 +3169,7 @@ class DataController {
             this._updateVisibleRows();
             return true;
         }
-        else {
-            return false;
-        }
+        return false;
     }
     /**
      * Update data for specified row
@@ -3190,11 +3187,9 @@ class DataController {
             this._updateVisibleRows();
             return updateSuccess;
         }
-        else {
-            const updated = this.updateRow(rows, trackBy);
-            this._updateVisibleRows();
-            return updated;
-        }
+        const updated = this.updateRow(rows, trackBy);
+        this._updateVisibleRows();
+        return updated;
     }
     /**
      * Remove data for specified row
@@ -3320,7 +3315,7 @@ class DataController {
         const targetIndex = this._rowsStack.findIndex((listRow) => trackBy(listRow.data, targetRow));
         if (targetIndex !== -1) {
             const updateTarget = this._rowsStack[targetIndex];
-            const updatedData = Object.assign({}, updateTarget.data, targetRow);
+            const updatedData = { ...updateTarget.data, ...targetRow };
             this._rowsStack[targetIndex] = new Row(updatedData, updateTarget.type, {
                 parent: updateTarget.parent,
                 initialExpand: updateTarget.expanded,
@@ -3352,7 +3347,7 @@ class DataController {
         if (!this._groupByFn || !this._compareByFn) {
             return rows;
         }
-        let groupRows = [];
+        const groupRows = [];
         const footerRows = new Map();
         rows.forEach((row) => {
             const mainGroup = this._groupByFn(row);
@@ -3919,11 +3914,15 @@ class PaginationController {
     //   this.pagesArray = Object.assign([], pagesArr);
     // }
     setLoadMore(config) {
-        const loadMoreConfig = typeof config === 'boolean' ? {
-            enabled: !!config,
-        } : config;
-        this._loadMoreConfig = {
+        const loadMoreConfig = typeof config === 'boolean' ?
+            {
+                enabled: !!config,
+            } : {
             enabled: true,
+            ...config,
+        };
+        this._loadMoreConfig = {
+            enabled: false,
             label: 'Load More',
             buttonType: 'basic',
             ...loadMoreConfig,