@firestitch/list 12.12.3 → 12.12.4

package/bundles/firestitch-list.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@angular/router'), require('@angular/material/button'), require('@angular/material/checkbox'), require('@angular/material/core'), require('@angular/material/dialog'), require('@angular/material/icon'), require('@angular/material/menu'), require('@angular/material/tooltip'), require('@angular/material/progress-spinner'), require('@angular/flex-layout'), require('@firestitch/filter'), require('@firestitch/scroll'), require('@firestitch/menu'), require('@firestitch/prompt'), require('@firestitch/file'), require('@firestitch/common'), require('lodash-es'), require('rxjs'), require('rxjs/operators'), require('@firestitch/store'), require('@firestitch/selection'), require('@firestitch/drawer'), require('@angular/flex-layout/extended'), require('@angular/flex-layout/flex')) :
-    typeof define === 'function' && define.amd ? define('@firestitch/list', ['exports', '@angular/core', '@angular/common', '@angular/router', '@angular/material/button', '@angular/material/checkbox', '@angular/material/core', '@angular/material/dialog', '@angular/material/icon', '@angular/material/menu', '@angular/material/tooltip', '@angular/material/progress-spinner', '@angular/flex-layout', '@firestitch/filter', '@firestitch/scroll', '@firestitch/menu', '@firestitch/prompt', '@firestitch/file', '@firestitch/common', 'lodash-es', 'rxjs', 'rxjs/operators', '@firestitch/store', '@firestitch/selection', '@firestitch/drawer', '@angular/flex-layout/extended', '@angular/flex-layout/flex'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.firestitch = global.firestitch || {}, global.firestitch.list = {}), global.ng.core, global.ng.common, global.ng.router, global.ng.material.button, global.ng.material.checkbox, global.ng.material.core, global.ng.material.dialog, global.ng.material.icon, global.ng.material.menu, global.ng.material.tooltip, global.ng.material.progressSpinner, global.ng.flexLayout, global.i2, global.i2$4, global.i2$3, global.i1$1, global.i4$1, global.i5$1, global.lodashEs, global.rxjs, global.rxjs.operators, global.i1, global.i3$3, global.i9, global.ng.flexLayout.extended, global.ng.flexLayout.flex));
-})(this, (function (exports, i0, i3$1, i6$1, i2$2, i2$1, i4$2, i4, i3, menu, i6, progressSpinner, flexLayout, i2, i2$4, i2$3, i1$1, i4$1, i5$1, lodashEs, rxjs, operators, i1, i3$3, i9, i5, i3$2) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@angular/router'), require('@angular/material/button'), require('@angular/material/checkbox'), require('@angular/material/core'), require('@angular/material/dialog'), require('@angular/material/icon'), require('@angular/material/menu'), require('@angular/material/tooltip'), require('@angular/material/progress-spinner'), require('@firestitch/filter'), require('@firestitch/scroll'), require('@firestitch/menu'), require('@firestitch/prompt'), require('@firestitch/file'), require('@firestitch/common'), require('lodash-es'), require('rxjs'), require('rxjs/operators'), require('@firestitch/store'), require('@firestitch/drawer'), require('@firestitch/selection')) :
+    typeof define === 'function' && define.amd ? define('@firestitch/list', ['exports', '@angular/core', '@angular/common', '@angular/router', '@angular/material/button', '@angular/material/checkbox', '@angular/material/core', '@angular/material/dialog', '@angular/material/icon', '@angular/material/menu', '@angular/material/tooltip', '@angular/material/progress-spinner', '@firestitch/filter', '@firestitch/scroll', '@firestitch/menu', '@firestitch/prompt', '@firestitch/file', '@firestitch/common', 'lodash-es', 'rxjs', 'rxjs/operators', '@firestitch/store', '@firestitch/drawer', '@firestitch/selection'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.firestitch = global.firestitch || {}, global.firestitch.list = {}), global.ng.core, global.ng.common, global.ng.router, global.ng.material.button, global.ng.material.checkbox, global.ng.material.core, global.ng.material.dialog, global.ng.material.icon, global.ng.material.menu, global.ng.material.tooltip, global.ng.material.progressSpinner, global.i2, global.i2$4, global.i2$3, global.i1$2, global.i4, global.i4$1, global.lodashEs, global.rxjs, global.rxjs.operators, global.i1$1, global.i4$2, global.i5));
+})(this, (function (exports, i0, i3$1, i7, i2$2, i2$1, i3$2, i1, i3, menu, i6, progressSpinner, i2, i2$4, i2$3, i1$2, i4, i4$1, lodashEs, rxjs, operators, i1$1, i4$2, i5) { 'use strict';
 
     function _interopNamespace(e) {
         if (e && e.__esModule) return e;
@@ -24,24 +24,22 @@
 
     var i0__namespace = /*#__PURE__*/_interopNamespace(i0);
     var i3__namespace$1 = /*#__PURE__*/_interopNamespace(i3$1);
-    var i6__namespace$1 = /*#__PURE__*/_interopNamespace(i6$1);
+    var i7__namespace = /*#__PURE__*/_interopNamespace(i7);
     var i2__namespace$1 = /*#__PURE__*/_interopNamespace(i2$2);
     var i2__namespace = /*#__PURE__*/_interopNamespace(i2$1);
-    var i4__namespace$2 = /*#__PURE__*/_interopNamespace(i4$2);
-    var i4__namespace = /*#__PURE__*/_interopNamespace(i4);
+    var i3__namespace$2 = /*#__PURE__*/_interopNamespace(i3$2);
+    var i1__namespace = /*#__PURE__*/_interopNamespace(i1);
     var i3__namespace = /*#__PURE__*/_interopNamespace(i3);
     var i6__namespace = /*#__PURE__*/_interopNamespace(i6);
     var i2__namespace$2 = /*#__PURE__*/_interopNamespace(i2);
     var i2__namespace$4 = /*#__PURE__*/_interopNamespace(i2$4);
     var i2__namespace$3 = /*#__PURE__*/_interopNamespace(i2$3);
-    var i1__namespace$1 = /*#__PURE__*/_interopNamespace(i1$1);
+    var i1__namespace$2 = /*#__PURE__*/_interopNamespace(i1$2);
+    var i4__namespace = /*#__PURE__*/_interopNamespace(i4);
     var i4__namespace$1 = /*#__PURE__*/_interopNamespace(i4$1);
-    var i5__namespace$1 = /*#__PURE__*/_interopNamespace(i5$1);
-    var i1__namespace = /*#__PURE__*/_interopNamespace(i1);
-    var i3__namespace$3 = /*#__PURE__*/_interopNamespace(i3$3);
-    var i9__namespace = /*#__PURE__*/_interopNamespace(i9);
+    var i1__namespace$1 = /*#__PURE__*/_interopNamespace(i1$1);
+    var i4__namespace$2 = /*#__PURE__*/_interopNamespace(i4$2);
     var i5__namespace = /*#__PURE__*/_interopNamespace(i5);
-    var i3__namespace$2 = /*#__PURE__*/_interopNamespace(i3$2);
 
     /*! *****************************************************************************
     Copyright (c) Microsoft Corporation.
@@ -693,7 +691,12 @@
             this.menu = (_a = value.menu) !== null && _a !== void 0 ? _a : true;
             this.remove = value.remove;
             this.className = value.className;
-            this.type = (_b = value.type) !== null && _b !== void 0 ? _b : exports.ActionType.Basic;
+            if (this.menu && this.icon && !this.label && !value.type) {
+                this.type = exports.ActionType.Icon;
+            }
+            else {
+                this.type = (_b = value.type) !== null && _b !== void 0 ? _b : exports.ActionType.Basic;
+            }
             this.show = value.show;
             this.restore = value.restore;
             this.rowActions = (_c = value.rowActions) === null || _c === void 0 ? void 0 : _c.map(function (action) { return new RowAction(action); });
@@ -713,13 +716,7 @@
                     };
                 }
             }
-            if (typeof value.label === 'function') {
-                this._labelFn = value.label;
-                this.label = '';
-            }
-            else {
-                this.label = value.label;
-            }
+            this.label = value.label;
             if (this.className) {
                 this.classArray = this.className.split(' ').reduce(function (acc, elem) {
                     acc.push(elem);
@@ -755,19 +752,6 @@
                 }
             }
         };
-        RowAction.prototype.updateLabel = function (row) {
-            if (!this.isShown) {
-                return;
-            }
-            if (this.isGroup) {
-                this.rowActions.forEach(function (action) {
-                    action.updateLabel(row);
-                });
-            }
-            else if (this._labelFn) {
-                this.label = this._labelFn(row);
-            }
-        };
         RowAction.prototype.clickEvent = function (row, event, index, rowActionsRef, clickFn) {
             // Stop event propagation for parent
             event.stopPropagation();
@@ -1183,6 +1167,14 @@
             }
             return _this;
         }
+        Object.defineProperty(GroupRow.prototype, "childrenData", {
+            get: function () {
+                return this.children
+                    .map(function (child) { return child.data; });
+            },
+            enumerable: false,
+            configurable: true
+        });
         Object.defineProperty(GroupRow.prototype, "isGroup", {
             get: function () {
                 return true;
@@ -1297,7 +1289,7 @@
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(GroupFooterRow.prototype, "isFooter", {
+        Object.defineProperty(GroupFooterRow.prototype, "isGroupFooter", {
             get: function () {
                 return true;
             },
@@ -1386,7 +1378,7 @@
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(Row.prototype, "isFooter", {
+        Object.defineProperty(Row.prototype, "isGroupFooter", {
             get: function () {
                 return this._row instanceof GroupFooterRow;
             },
@@ -1671,7 +1663,8 @@
             }
             return !!removedRows.length;
         };
-        DataController.prototype.swapRows = function (row1, row2) {
+        DataController.prototype.swapRows = function (row1, row2, selectedRows, isMultipleDrag) {
+            if (isMultipleDrag === void 0) { isMultipleDrag = false; }
             var tmpEl;
             var rowsStack = this._rowsStack;
             var row1GlobalIndex = rowsStack.indexOf(row1);
@@ -1679,6 +1672,24 @@
             tmpEl = rowsStack[row1GlobalIndex];
             rowsStack[row1GlobalIndex] = rowsStack[row2GlobalIndex];
             rowsStack[row2GlobalIndex] = tmpEl;
+            if (isMultipleDrag && Array.isArray(selectedRows)) {
+                if (!selectedRows.includes(row1)) {
+                    selectedRows = __spreadArray([row1], __read(selectedRows));
+                }
+                selectedRows
+                    .filter(function (selectedRow) {
+                    return selectedRow !== row1;
+                })
+                    .forEach(function (selectedRow) {
+                    var idx = rowsStack.indexOf(selectedRow);
+                    rowsStack.splice(idx, 1);
+                });
+                var indexToInsertAfter_1 = rowsStack.indexOf(tmpEl);
+                rowsStack.splice(indexToInsertAfter_1, 1);
+                selectedRows.forEach(function (selectedRow, offset) {
+                    rowsStack.splice(indexToInsertAfter_1 + offset, 0, selectedRow);
+                });
+            }
             this._rowsStack = __spreadArray([], __read(rowsStack));
         };
         DataController.prototype.destroy = function () {
@@ -1691,7 +1702,9 @@
             var row = this.visibleRows.find(function (visibleRow) { return visibleRow.data === rowData; });
             row.toggleRowExpandStatus();
             this._updateVisibleRows();
-            console.log(this._rowsStack);
+        };
+        DataController.prototype.finishReorder = function () {
+            this._updateVisibleRows();
         };
         DataController.prototype._updateRowsStack = function (rows) {
             var _this = this;
@@ -1725,7 +1738,7 @@
         DataController.prototype._updateVisibleRows = function () {
             this.visibleRows = this._rowsStack
                 .filter(function (row) {
-                return (!row.isChild && !row.isFooter) || row.visible;
+                return (!row.isChild && !row.isGroupFooter) || row.visible;
             });
         };
         DataController.prototype.updateRow = function (targetRow, trackBy) {
@@ -1766,25 +1779,19 @@
          * Split existing rows by groups and store them for future use
          */
         DataController.prototype.groupRowsBy = function (rows) {
-            var e_1, _b;
             var _this = this;
             if (!this._groupByFn || !this._compareByFn) {
                 return rows;
             }
-            var numberOfGroups = 0;
+            var groupRows = [];
             var footerRows = new Map();
             rows.forEach(function (row) {
                 var mainGroup = _this._groupByFn(row);
-                var isFooterRow = _this._footerRowFn(row);
                 var mainGroupKey = _this._compareByFn(mainGroup);
-                if (isFooterRow) {
-                    footerRows.set(mainGroupKey, row);
-                    return;
-                }
                 if (!_this._store.has(mainGroupKey)) {
                     var group = new GroupRow(mainGroup, _this._initialExpand);
-                    group.index = numberOfGroups;
-                    numberOfGroups++;
+                    group.index = groupRows.length;
+                    groupRows.push(group);
                     var childRow = new ChildRow(row, group);
                     _this._store.set(mainGroupKey, group);
                     group.children.push(childRow);
@@ -1795,23 +1802,16 @@
                     group.children.push(childRow);
                 }
             });
-            try {
-                for (var footerRows_1 = __values(footerRows), footerRows_1_1 = footerRows_1.next(); !footerRows_1_1.done; footerRows_1_1 = footerRows_1.next()) {
-                    var _c = __read(footerRows_1_1.value, 2), key = _c[0], value = _c[1];
-                    var group = this._store.get(key);
-                    if (group) {
-                        var footerRow = new GroupFooterRow(value, group);
-                        group.children.push(footerRow);
-                    }
-                }
-            }
-            catch (e_1_1) { e_1 = { error: e_1_1 }; }
-            finally {
-                try {
-                    if (footerRows_1_1 && !footerRows_1_1.done && (_b = footerRows_1.return)) _b.call(footerRows_1);
+            groupRows.forEach(function (groupRow) {
+                var footerIndex = groupRow.children
+                    .findIndex(function (row) {
+                    return _this._footerRowFn(row.data, Object.assign(Object.assign({}, groupRow.data), { children: groupRow.childrenData }));
+                });
+                if (footerIndex !== -1) {
+                    var footerRow = groupRow.children.slice(footerIndex, footerIndex + 1)[0];
+                    groupRow.children.push(new GroupFooterRow(footerRow.data, groupRow));
                 }
-                finally { if (e_1) throw e_1.error; }
-            }
+            });
             return Array.from(this._store.values())
                 .reduce(function (acc, item) {
                 if (item.isGroup) {
@@ -2426,13 +2426,29 @@
             this._visibleRecordsCount = 0;
             this._totalRecordsCount = 0;
             this._destroy$ = new rxjs.Subject();
+            this._disabled$ = new rxjs.BehaviorSubject(false);
             this.actions = config.actions ? __spreadArray([], __read(config.actions)) : [];
             this.actionSelectedFn = config.actionSelected;
             this.allSelectedFn = config.allSelected;
             this.cancelledFn = config.cancelled;
             this.selectionChangedFn = config.selectionChanged;
             this.selectAll = config.selectAll;
+            this._disabled$.next(!!config.disabled);
         }
+        Object.defineProperty(SelectionController.prototype, "disabled", {
+            get: function () {
+                return this._disabled$.getValue();
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(SelectionController.prototype, "disabled$", {
+            get: function () {
+                return this._disabled$.asObservable();
+            },
+            enumerable: false,
+            configurable: true
+        });
         Object.defineProperty(SelectionController.prototype, "selectedAll", {
             get: function () {
                 return this._selectedAll;
@@ -2578,6 +2594,12 @@
                 this._updateSelectedVisibleStatus();
             }
         };
+        SelectionController.prototype.enableSelection = function () {
+            this._disabled$.next(false);
+        };
+        SelectionController.prototype.disableSelection = function () {
+            this._disabled$.next(true);
+        };
         /**
          * Method will be called from List for remove row if it was selected
          *
@@ -3435,7 +3457,7 @@
         return ExternalParamsController;
     }());
 
-    var SHOW_DELETED_FILTERS_KEY = '$$_show_deleted_$$';
+    var SHOW_DELETED_FILTERS_KEY = '_showDeleted_';
     var List = /** @class */ (function () {
         function List(el, config, fsScroll, selectionDialog, router, route, persistance, inDialog) {
             if (config === void 0) { config = {}; }
@@ -3448,7 +3470,6 @@
             this.persistance = persistance;
             this.inDialog = inDialog;
             this.filters = [];
-            // @Alias('rows') private _rows: any;
             this.initialized$ = new rxjs.BehaviorSubject(false);
             this.loading$ = new rxjs.BehaviorSubject(false);
             this.paging = new PaginationController();
@@ -4165,12 +4186,12 @@
         ReorderPosition["Left"] = "left";
         ReorderPosition["Right"] = "right";
     })(exports.ReorderPosition || (exports.ReorderPosition = {}));
-    exports.ReorderStrategy = void 0;
+    var ReorderStrategy;
     (function (ReorderStrategy) {
         ReorderStrategy["Always"] = "always";
         ReorderStrategy["Manual"] = "manual";
         ReorderStrategy["Custom"] = "custom";
-    })(exports.ReorderStrategy || (exports.ReorderStrategy = {}));
+    })(ReorderStrategy || (ReorderStrategy = {}));
     var ReorderController = /** @class */ (function () {
         function ReorderController() {
             this._enabled$ = new rxjs.BehaviorSubject(false);
@@ -4185,7 +4206,7 @@
             },
             set: function (value) {
                 this._enabled$.next(value);
-                this._manualReorderActivated$.next(this.enabled && this.strategy === exports.ReorderStrategy.Manual);
+                this._manualReorderActivated$.next(this.enabled && this.strategy === ReorderStrategy.Manual);
             },
             enumerable: false,
             configurable: true
@@ -4197,6 +4218,13 @@
             enumerable: false,
             configurable: true
         });
+        Object.defineProperty(ReorderController.prototype, "selectionController", {
+            get: function () {
+                return this._selectionController;
+            },
+            enumerable: false,
+            configurable: true
+        });
         Object.defineProperty(ReorderController.prototype, "manualReorderActivated$", {
             get: function () {
                 return this._manualReorderActivated$.asObservable();
@@ -4204,6 +4232,13 @@
             enumerable: false,
             configurable: true
         });
+        Object.defineProperty(ReorderController.prototype, "manualReorderActivated", {
+            get: function () {
+                return this._manualReorderActivated$.getValue();
+            },
+            enumerable: false,
+            configurable: true
+        });
         Object.defineProperty(ReorderController.prototype, "leftReorderActivated$", {
             get: function () {
                 var _this = this;
@@ -4244,27 +4279,35 @@
             enumerable: false,
             configurable: true
         });
-        ReorderController.prototype.initWithConfig = function (data, dataController, actionsController) {
+        ReorderController.prototype.initWithConfig = function (data, dataController, actionsController, selectionController) {
             var _this = this;
-            var _a, _b, _c, _d;
+            var _a, _b, _c;
             if (!data) {
                 return;
             }
-            this.menu = (_a = data.menu) !== null && _a !== void 0 ? _a : true;
+            this.menu = (_a = data.menu) !== null && _a !== void 0 ? _a : false;
             this.position = (_b = data.position) !== null && _b !== void 0 ? _b : exports.ReorderPosition.Left;
-            this.strategy = (_c = data.strategy) !== null && _c !== void 0 ? _c : exports.ReorderStrategy.Manual;
-            this.status = (_d = data.status) !== null && _d !== void 0 ? _d : true;
+            if (!data.disabled) {
+                this.strategy = ReorderStrategy.Always;
+            }
+            if (data.toggle) {
+                this.strategy = ReorderStrategy.Manual;
+            }
+            // this.strategy = data.strategy ?? ReorderStrategy.Manual;
             this.label = data.label;
+            this.multiple = data.multiple;
+            this.status = (_c = data.status) !== null && _c !== void 0 ? _c : true;
             this.startCallback = data.start;
             this.movedCallback = data.moved;
             this.doneCallback = data.done;
             this.moveDropCallback = data.moveDrop;
             this._dataController = dataController;
             this._actionsController = actionsController;
-            if (this.strategy === exports.ReorderStrategy.Always) {
+            this._selectionController = selectionController;
+            if (this.strategy === ReorderStrategy.Always) {
                 this.enableReorder();
             }
-            else if (this.strategy === exports.ReorderStrategy.Manual) {
+            else if (this.strategy === ReorderStrategy.Manual) {
                 actionsController.addReorderAction({
                     label: this.label || 'Reorder',
                     menu: this.menu,
@@ -4290,7 +4333,7 @@
         };
         ReorderController.prototype.enableReorder = function () {
             var _this = this;
-            if (this.strategy === exports.ReorderStrategy.Manual || this.strategy === exports.ReorderStrategy.Custom) {
+            if ((this.strategy === ReorderStrategy.Manual || this.strategy === ReorderStrategy.Custom) && this.startCallback) {
                 var returnedValue = this.startCallback();
                 if (returnedValue && returnedValue instanceof rxjs.Observable) {
                     this.disableReorderAction();
@@ -4307,7 +4350,7 @@
         };
         ReorderController.prototype.disableReorder = function () {
             var _this = this;
-            if (this.strategy === exports.ReorderStrategy.Manual || this.strategy === exports.ReorderStrategy.Custom) {
+            if (this.strategy === ReorderStrategy.Manual || this.strategy === ReorderStrategy.Custom) {
                 var returnedValue = this.reorderFinished();
                 if (returnedValue && returnedValue instanceof rxjs.Observable) {
                     this.disableReorderAction();
@@ -4712,8 +4755,8 @@
         };
         return CustomizeColsDialogComponent;
     }());
-    CustomizeColsDialogComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CustomizeColsDialogComponent, deps: [{ token: i4.MAT_DIALOG_DATA }, { token: i4__namespace.MatDialogRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    CustomizeColsDialogComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: CustomizeColsDialogComponent, selector: "ng-component", ngImport: i0__namespace, template: "<h1 matDialogTitle>Customize Columns</h1>\n<mat-dialog-content>\n  <div *ngFor=\"let column of columns\">\n    <mat-checkbox [checked]=\"column.show\" (change)=\"visibilityChange($event, column)\" [disabled]=\"column.disabled\">\n      <ng-container *ngIf=\"!column.title; else titleLable\">\n        <ng-template [ngTemplateOutlet]=\"column.template\"></ng-template>\n      </ng-container>\n      <ng-template #titleLable>\n        {{ column.title }}\n      </ng-template>\n\n      <ng-container *ngIf=\"column.tooltip\">\n        <mat-icon [matTooltip]=\"column.tooltip\">\n          help\n        </mat-icon>\n      </ng-container>\n    </mat-checkbox>\n  </div>\n</mat-dialog-content>\n<mat-dialog-actions>\n  <button type=\"button\" mat-button color=\"primary\" (click)=\"save()\" [disabled]=\"saveDisabled\">Save</button>\n  <button type=\"button\" mat-button (click)=\"cancel()\">Cancel</button>\n</mat-dialog-actions>\n", styles: [".mat-checkbox{min-height:32px;display:block}.mat-icon{font-size:14px;height:14px;width:14px;vertical-align:middle}\n"], components: [{ type: i2__namespace.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "id", "labelPosition", "name", "required", "checked", "disabled", "indeterminate", "aria-describedby", "value"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i3__namespace.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i2__namespace$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i4__namespace.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i4__namespace.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i3__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i6__namespace.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i4__namespace.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+    CustomizeColsDialogComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CustomizeColsDialogComponent, deps: [{ token: i1.MAT_DIALOG_DATA }, { token: i1__namespace.MatDialogRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    CustomizeColsDialogComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: CustomizeColsDialogComponent, selector: "ng-component", ngImport: i0__namespace, template: "<h1 matDialogTitle>Customize Columns</h1>\n<mat-dialog-content>\n  <div *ngFor=\"let column of columns\">\n    <mat-checkbox [checked]=\"column.show\" (change)=\"visibilityChange($event, column)\" [disabled]=\"column.disabled\">\n      <ng-container *ngIf=\"!column.title; else titleLable\">\n        <ng-template [ngTemplateOutlet]=\"column.template\"></ng-template>\n      </ng-container>\n      <ng-template #titleLable>\n        {{ column.title }}\n      </ng-template>\n\n      <ng-container *ngIf=\"column.tooltip\">\n        <mat-icon [matTooltip]=\"column.tooltip\">\n          help\n        </mat-icon>\n      </ng-container>\n    </mat-checkbox>\n  </div>\n</mat-dialog-content>\n<mat-dialog-actions>\n  <button type=\"button\" mat-button color=\"primary\" (click)=\"save()\" [disabled]=\"saveDisabled\">Save</button>\n  <button type=\"button\" mat-button (click)=\"cancel()\">Cancel</button>\n</mat-dialog-actions>\n", styles: [".mat-checkbox{min-height:32px;display:block}.mat-icon{font-size:14px;height:14px;width:14px;vertical-align:middle}\n"], components: [{ type: i2__namespace.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "id", "labelPosition", "name", "required", "checked", "disabled", "indeterminate", "aria-describedby", "value"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i3__namespace.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i2__namespace$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i1__namespace.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1__namespace.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i3__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i6__namespace.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i1__namespace.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: CustomizeColsDialogComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -4724,8 +4767,8 @@
             }], ctorParameters: function () {
             return [{ type: undefined, decorators: [{
                             type: i0.Inject,
-                            args: [i4.MAT_DIALOG_DATA]
-                        }] }, { type: i4__namespace.MatDialogRef }];
+                            args: [i1.MAT_DIALOG_DATA]
+                        }] }, { type: i1__namespace.MatDialogRef }];
         } });
 
     var FILTER_STORE_KEY = 'fs-list-persist';
@@ -4737,12 +4780,40 @@
             return _this;
         }
         return PersistanceController;
-    }(i1.FsPersistanceStore));
-    PersistanceController.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: PersistanceController, deps: [{ token: i1__namespace.FsStore }, { token: i6__namespace$1.ActivatedRoute }], target: i0__namespace.ɵɵFactoryTarget.Injectable });
+    }(i1$1.FsPersistanceStore));
+    PersistanceController.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: PersistanceController, deps: [{ token: i1__namespace$1.FsStore }, { token: i7__namespace.ActivatedRoute }], target: i0__namespace.ɵɵFactoryTarget.Injectable });
     PersistanceController.ɵprov = i0__namespace.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: PersistanceController });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: PersistanceController, decorators: [{
                 type: i0.Injectable
-            }], ctorParameters: function () { return [{ type: i1__namespace.FsStore }, { type: i6__namespace$1.ActivatedRoute }]; } });
+            }], ctorParameters: function () { return [{ type: i1__namespace$1.FsStore }, { type: i7__namespace.ActivatedRoute }]; } });
+
+    var FsListHeadingDirective = /** @class */ (function () {
+        function FsListHeadingDirective() {
+        }
+        return FsListHeadingDirective;
+    }());
+    FsListHeadingDirective.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsListHeadingDirective, deps: [], target: i0__namespace.ɵɵFactoryTarget.Directive });
+    FsListHeadingDirective.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: FsListHeadingDirective, selector: "[fs-list-heading],[fsListHeading]", ngImport: i0__namespace });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsListHeadingDirective, decorators: [{
+                type: i0.Directive,
+                args: [{
+                        selector: '[fs-list-heading],[fsListHeading]'
+                    }]
+            }] });
+
+    var FsListSubheadingDirective = /** @class */ (function () {
+        function FsListSubheadingDirective() {
+        }
+        return FsListSubheadingDirective;
+    }());
+    FsListSubheadingDirective.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsListSubheadingDirective, deps: [], target: i0__namespace.ɵɵFactoryTarget.Directive });
+    FsListSubheadingDirective.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: FsListSubheadingDirective, selector: "[fs-list-subheading],[fsListSubheading]", ngImport: i0__namespace });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsListSubheadingDirective, decorators: [{
+                type: i0.Directive,
+                args: [{
+                        selector: '[fs-list-subheading],[fsListSubheading]'
+                    }]
+            }] });
 
     // import { FsListManageSavedFiltersComponent } from '../manage-saved-filters/manage-saved-filters.component';
     var FsListSavedFiltersComponent = /** @class */ (function () {
@@ -4765,7 +4836,7 @@
         };
         return FsListSavedFiltersComponent;
     }());
-    FsListSavedFiltersComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsListSavedFiltersComponent, deps: [{ token: i4__namespace.MatDialog }, { token: i2__namespace$2.ExternalParamsController }, { token: i0__namespace.ViewContainerRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    FsListSavedFiltersComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsListSavedFiltersComponent, deps: [{ token: i1__namespace.MatDialog }, { token: i2__namespace$2.ExternalParamsController }, { token: i0__namespace.ViewContainerRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
     FsListSavedFiltersComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsListSavedFiltersComponent, selector: "fs-list-saved-filters", ngImport: i0__namespace, template: "<ng-container *ngIf=\"savedFiltersEnabled$ | async\"><!--\n  -->, saved filter\n  <fs-filter-saved-filters-menu (manage)=\"showManageDialog()\"></fs-filter-saved-filters-menu>\n</ng-container>\n", components: [{ type: i2__namespace$2.FsSavedFiltersMenuComponent, selector: "fs-filter-saved-filters-menu", outputs: ["select", "clear", "manage"] }], directives: [{ type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i3__namespace$1.AsyncPipe } });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsListSavedFiltersComponent, decorators: [{
                 type: i0.Component,
@@ -4773,7 +4844,7 @@
                         selector: 'fs-list-saved-filters',
                         templateUrl: 'saved-filters.component.html',
                     }]
-            }], ctorParameters: function () { return [{ type: i4__namespace.MatDialog }, { type: i2__namespace$2.ExternalParamsController }, { type: i0__namespace.ViewContainerRef }]; } });
+            }], ctorParameters: function () { return [{ type: i1__namespace.MatDialog }, { type: i2__namespace$2.ExternalParamsController }, { type: i0__namespace.ViewContainerRef }]; } });
 
     var FsStatusComponent = /** @class */ (function () {
         function FsStatusComponent(_cdRef) {
@@ -4811,15 +4882,13 @@
         return FsStatusComponent;
     }());
     FsStatusComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsStatusComponent, deps: [{ token: i0__namespace.ChangeDetectorRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    FsStatusComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsStatusComponent, selector: "fs-list-status", inputs: { paging: "paging", sorting: "sorting", rows: "rows", scrollable: "scrollable", firstLoad: "firstLoad" }, host: { properties: { "class.first-load": "this.firstLoad", "class.fs-skeleton-placeholder": "this.firstLoad" } }, ngImport: i0__namespace, template: "<div class=\"status\">\n  <ng-container *ngIf=\"paging.enabled && !scrollable\">\n    <ng-container *ngIf=\"paging.records > 0; else emptyResults\">\n      Showing <a [fsMenuTriggerFor]=\"limitsMenu\">{{ paging.statusLabel }}</a> of {{ paging.records | number:'1.0':'en-US' }} results\n    </ng-container>\n    <ng-template #emptyResults>\n      Showing <a [fsMenuTriggerFor]=\"limitsMenu\">0</a> results\n    </ng-template>\n    <ng-container *ngTemplateOutlet=\"sortedBy\"></ng-container><!--\n--></ng-container><!--\n\n--><ng-container *ngIf=\"(!paging.enabled || scrollable) && paging.displayed > 0\">\n  <ng-container *ngIf=\"!scrollable; else scrollable\">\n    Showing\n    <span *ngIf=\"paging.displayed == 1\">{{ paging.displayed }} result </span>\n    <span *ngIf=\"paging.displayed > 1\">{{ paging.displayed | number:'1.0':'en-US' }} results </span>\n  </ng-container>\n\n  <ng-template #scrollable>\n    <span *ngIf=\"paging.records == 1\">{{ paging.records }} result </span>\n    <span *ngIf=\"paging.records > 1\">{{ paging.records | number:'1.0':'en-US' }} results </span>\n  </ng-template>\n  <ng-container *ngTemplateOutlet=\"sortedBy\"></ng-container><!--\n--></ng-container><!--\n\n--><fs-list-saved-filters class=\"saved-filters\"></fs-list-saved-filters>\n\n  <fs-menu [hidden]=\"!paging.enabled || scrollable\" #limitsMenu>\n    <ng-template\n      ngFor\n      let-limit\n      [ngForOf]=\"paging.limits\"\n    >\n      <ng-template fs-menu-item (click)=\"setLimit(limit)\">\n        {{ limit }}\n      </ng-template>\n    </ng-template>\n  </fs-menu>\n\n  <fs-menu [hidden]=\"!sorting.sortingColumn || paging.displayed === 0\" #orderColumnsMenu>\n    <!-- Real sorting columns -->\n    <ng-template\n      ngFor\n      let-column\n      [ngForOf]=\"sorting.sortingColumns\"\n    >\n      <ng-template fs-menu-item (click)=\"setSortableColumn(column)\">\n        <ng-container *ngIf=\"column.title; else sortByTemplate\">\n          {{ column.title }}\n        </ng-container>\n        <ng-template #sortByTemplate>\n          <ng-template [ngTemplateOutlet]=\"column.headerTemplate\"></ng-template>\n        </ng-template>\n      </ng-template>\n    </ng-template>\n\n    <!-- Fake sorting columns -->\n    <ng-template\n      ngFor\n      let-column\n      [ngForOf]=\"sorting.fakeSortingColumns\"\n    >\n      <ng-template fs-menu-item (click)=\"setSortableColumn(column)\">\n        {{ column.title }}\n      </ng-template>\n    </ng-template>\n  </fs-menu>\n\n  <ng-template #sortedBy>\n    <ng-container *ngIf=\"sorting.sortingColumn\">\n      sorted by\n      <ng-container *ngIf=\"sorting.sortingColumn.title; else sortByTemplate\">\n        <a class=\"order-toggle\" [fsMenuTriggerFor]=\"orderColumnsMenu\">{{ sorting.sortingColumn.title }}</a>,\n      </ng-container>\n      <ng-template #sortByTemplate>\n        <a class=\"order-toggle\" [fsMenuTriggerFor]=\"orderColumnsMenu\">\n          <ng-template [ngTemplateOutlet]=\"sorting.sortingColumn.headerTemplate\"></ng-template>\n        </a>,\n      </ng-template>\n      <a class=\"order-toggle\" (click)=\"toggleDirection()\">{{ sorting.sortingColumn.fullNameDirection }}</a><!--\n  --></ng-container><!--\n--></ng-template>\n</div>\n", styles: [":host{display:inline-block}:host.first-load .status{visibility:hidden}.order-toggle{white-space:nowrap}a{cursor:pointer}\n"], components: [{ type: FsListSavedFiltersComponent, selector: "fs-list-saved-filters" }, { type: i2__namespace$3.FsMenuComponent, selector: "fs-menu", inputs: ["class", "buttonClass"], outputs: ["opened", "closed"] }], directives: [{ type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace$3.FsMenuTriggerDirective, selector: "[fsMenuTriggerFor]", inputs: ["fsMenuTriggerFor"] }, { type: i3__namespace$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2__namespace$3.FsMenuItemDirective, selector: "fs-menu-group,[fs-menu-item]", inputs: ["fsClass", "class", "id", "label", "hidden", "groupHidden", "dismissAfterClick", "link", "target", "queryParams"], outputs: ["click"] }], pipes: { "number": i3__namespace$1.DecimalPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush, preserveWhitespaces: true });
+    FsStatusComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsStatusComponent, selector: "fs-list-status", inputs: { paging: "paging", sorting: "sorting", rows: "rows", scrollable: "scrollable", firstLoad: "firstLoad" }, host: { properties: { "class.first-load": "this.firstLoad", "class.fs-skeleton-placeholder": "this.firstLoad" } }, ngImport: i0__namespace, template: "<div class=\"status\">\n  <small>\n    <ng-container *ngIf=\"paging.enabled && !scrollable\">\n      <ng-container *ngIf=\"paging.records > 0; else emptyResults\">\n        Showing <a [fsMenuTriggerFor]=\"limitsMenu\">{{ paging.statusLabel }}</a> of {{ paging.records | number:'1.0':'en-US' }} results\n      </ng-container>\n      <ng-template #emptyResults>\n        Showing <a [fsMenuTriggerFor]=\"limitsMenu\">0</a> results\n      </ng-template>\n      <ng-container *ngTemplateOutlet=\"sortedBy\"></ng-container><!--\n  --></ng-container><!--\n\n  --><ng-container *ngIf=\"(!paging.enabled || scrollable) && paging.displayed > 0\">\n    <ng-container *ngIf=\"!scrollable; else scrollable\">\n      Showing\n      <span *ngIf=\"paging.displayed == 1\">{{ paging.displayed }} result </span>\n      <span *ngIf=\"paging.displayed > 1\">{{ paging.displayed | number:'1.0':'en-US' }} results </span>\n    </ng-container>\n\n    <ng-template #scrollable>\n      <span *ngIf=\"paging.records == 1\">{{ paging.records }} result </span>\n      <span *ngIf=\"paging.records > 1\">{{ paging.records | number:'1.0':'en-US' }} results </span>\n    </ng-template>\n    <ng-container *ngTemplateOutlet=\"sortedBy\"></ng-container><!--\n  --></ng-container><!--\n\n  --><fs-list-saved-filters class=\"saved-filters\"></fs-list-saved-filters>\n\n    <fs-menu [hidden]=\"!paging.enabled || scrollable\" #limitsMenu>\n      <ng-template\n        ngFor\n        let-limit\n        [ngForOf]=\"paging.limits\"\n      >\n        <ng-template fs-menu-item (click)=\"setLimit(limit)\">\n          {{ limit }}\n        </ng-template>\n      </ng-template>\n    </fs-menu>\n\n    <fs-menu [hidden]=\"!sorting.sortingColumn || paging.displayed === 0\" #orderColumnsMenu>\n      <!-- Real sorting columns -->\n      <ng-template\n        ngFor\n        let-column\n        [ngForOf]=\"sorting.sortingColumns\"\n      >\n        <ng-template fs-menu-item (click)=\"setSortableColumn(column)\">\n          <ng-container *ngIf=\"column.title; else sortByTemplate\">\n            {{ column.title }}\n          </ng-container>\n          <ng-template #sortByTemplate>\n            <ng-template [ngTemplateOutlet]=\"column.headerTemplate\"></ng-template>\n          </ng-template>\n        </ng-template>\n      </ng-template>\n\n      <!-- Fake sorting columns -->\n      <ng-template\n        ngFor\n        let-column\n        [ngForOf]=\"sorting.fakeSortingColumns\"\n      >\n        <ng-template fs-menu-item (click)=\"setSortableColumn(column)\">\n          {{ column.title }}\n        </ng-template>\n      </ng-template>\n    </fs-menu>\n\n    <ng-template #sortedBy>\n      <ng-container *ngIf=\"sorting.sortingColumn\">\n        sorted by\n        <ng-container *ngIf=\"sorting.sortingColumn.title; else sortByTemplate\">\n          <a class=\"order-toggle\" [fsMenuTriggerFor]=\"orderColumnsMenu\">{{ sorting.sortingColumn.title }}</a>,\n        </ng-container>\n        <ng-template #sortByTemplate>\n          <a class=\"order-toggle\" [fsMenuTriggerFor]=\"orderColumnsMenu\">\n            <ng-template [ngTemplateOutlet]=\"sorting.sortingColumn.headerTemplate\"></ng-template>\n          </a>,\n        </ng-template>\n        <a class=\"order-toggle\" (click)=\"toggleDirection()\">{{ sorting.sortingColumn.fullNameDirection }}</a><!--\n    --></ng-container><!--\n  --></ng-template>\n  </small>  \n</div>\n", styles: [":host{display:inline-block}:host.first-load .status{visibility:hidden}.order-toggle{white-space:nowrap}a{cursor:pointer}\n"], components: [{ type: FsListSavedFiltersComponent, selector: "fs-list-saved-filters" }, { type: i2__namespace$3.FsMenuComponent, selector: "fs-menu", inputs: ["class", "buttonClass"], outputs: ["opened", "closed"] }], directives: [{ type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace$3.FsMenuTriggerDirective, selector: "[fsMenuTriggerFor]", inputs: ["fsMenuTriggerFor"] }, { type: i3__namespace$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2__namespace$3.FsMenuItemDirective, selector: "fs-menu-group,[fs-menu-item]" }], pipes: { "number": i3__namespace$1.DecimalPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush, preserveWhitespaces: true });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsStatusComponent, decorators: [{
                 type: i0.Component,
                 args: [{
                         selector: 'fs-list-status',
                         templateUrl: 'status.component.html',
-                        styleUrls: [
-                            './status.component.scss',
-                        ],
+                        styleUrls: ['./status.component.scss'],
                         changeDetection: i0.ChangeDetectionStrategy.OnPush,
                         preserveWhitespaces: true
                     }]
@@ -4849,14 +4918,17 @@
             this._destroy$ = new rxjs.Subject();
         }
         FsCellComponent.prototype.ngOnInit = function () {
-            this._initCellContext();
-            this._initCellTemplate();
             this._listenGroupOpen();
         };
         FsCellComponent.prototype.ngOnChanges = function (changes) {
-            if (changes.rowIndex) {
+            var _a, _b, _c, _d;
+            if (((_a = changes.rowIndex) === null || _a === void 0 ? void 0 : _a.currentValue) !== ((_b = changes.rowIndex) === null || _b === void 0 ? void 0 : _b.previousValue)) {
                 this.cellContext.index = this.rowIndex;
             }
+            if (((_c = changes.column) === null || _c === void 0 ? void 0 : _c.currentValue) !== ((_d = changes.column) === null || _d === void 0 ? void 0 : _d.previousValue)) {
+                this._initCellContext();
+                this._initCellTemplate();
+            }
         };
         FsCellComponent.prototype.ngOnDestroy = function () {
             this._destroy$.next();
@@ -4868,9 +4940,21 @@
                 if (this.row.isGroup) {
                     this.cellContext.groupIndex = this.row.index;
                 }
-                else if (this.row.isChild || this.row.isFooter) {
-                    this.cellContext.groupChildIndex = this.row.index;
+                else if (this.row.isChild || this.row.isGroupFooter) {
+                    this.cellContext.groupIndex = this.row.index;
                     this.cellContext.groupRow = this.row.parent.data;
+                    this.cellContext.group = this.row.parent.data;
+                }
+                if (this.row.isGroup) {
+                    this.cellContext.group = this.row.data;
+                    this.cellContext.groupChildren = this.row.children
+                        .map(function (child) { return child.data; });
+                }
+                else if (this.row.isGroupFooter) {
+                    this.cellContext.group = this.row.parent.data;
+                    this.cellContext.groupIndex = this.row.index;
+                    this.cellContext.groupChildren = this.row.parent.children
+                        .map(function (child) { return child.data; });
                 }
             }
             this.cellContext.column = this.column;
@@ -4886,7 +4970,7 @@
             if ((_a = this.row) === null || _a === void 0 ? void 0 : _a.isGroup) {
                 this.cellTemplate = this.column.groupHeaderTemplate || this.column.cellTemplate;
             }
-            else if ((_b = this.row) === null || _b === void 0 ? void 0 : _b.isFooter) {
+            else if ((_b = this.row) === null || _b === void 0 ? void 0 : _b.isGroupFooter) {
                 this.cellTemplate = this.column.groupFooterTemplate || this.column.cellTemplate;
             }
             else {
@@ -4965,7 +5049,7 @@
             this.cdRef = cdRef;
             this.selectedAll = false;
             this.ReorderPosition = exports.ReorderPosition;
-            this.ReorderStrategy = exports.ReorderStrategy;
+            this.ReorderStrategy = ReorderStrategy;
             this._destroy$ = new rxjs.Subject();
         }
         FsHeadComponent.prototype.ngOnInit = function () {
@@ -5024,7 +5108,7 @@
         return FsHeadComponent;
     }());
     FsHeadComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsHeadComponent, deps: [{ token: ReorderController }, { token: i0__namespace.ChangeDetectorRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    FsHeadComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsHeadComponent, selector: "[fs-list-head]", inputs: { sorting: "sorting", columns: "columns", hasRowActions: "hasRowActions", selection: "selection" }, viewQueries: [{ propertyName: "rowsContainer", first: true, predicate: ["rowsContainer"], descendants: true, read: i0.ViewContainerRef, static: true }], ngImport: i0__namespace, template: "<tr class=\"fs-list-row\">\n  <!-- Drag -->\n  <th *ngIf=\"reorderController.leftReorderActivated$ | async\" class=\"fs-list-col drag-col\"></th>\n\n  <!-- Selection -->\n  <th *ngIf=\"selection\" class=\"fs-list-col fs-list-col-selection\">\n    <mat-checkbox (change)=\"selectAll($event)\" [checked]=\"selectedAll\"></mat-checkbox>\n  </th>\n\n  <!-- Content -->\n  <th fs-head-cell *ngFor=\"let column of columns; trackBy: trackByFn\"\n      (click)=\"$event.stopPropagation(); sorting.sortBy(column)\"\n      [column]=\"column\"\n      [class.sorting]=\"column.sortable\"\n      [ngClass]=\"column.headerConfigs.classesArray\"\n      [attr.colspan]=\"column.headerConfigs.colspan\"\n      [attr.width]=\"column.width\"></th>\n\n  <!-- Drag -->\n  <th *ngIf=\"reorderController.rightReorderActivated$ | async\" class=\"fs-list-col drag-col\"></th>\n\n  <!-- Row Actions -->\n  <th *ngIf=\"hasRowActions && !(reorderController.manualReorderActivated$ | async)\" class=\"fs-list-col row-actions\"></th>\n</tr>\n", components: [{ type: i2__namespace.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "id", "labelPosition", "name", "required", "checked", "disabled", "indeterminate", "aria-describedby", "value"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: FsHeadCellComponent, selector: "[fs-head-cell]" }], directives: [{ type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5__namespace.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }], pipes: { "async": i3__namespace$1.AsyncPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+    FsHeadComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsHeadComponent, selector: "[fs-list-head]", inputs: { sorting: "sorting", columns: "columns", hasRowActions: "hasRowActions", selection: "selection" }, viewQueries: [{ propertyName: "rowsContainer", first: true, predicate: ["rowsContainer"], descendants: true, read: i0.ViewContainerRef, static: true }], ngImport: i0__namespace, template: "<tr class=\"fs-list-row\">\n  <!-- Drag -->\n  <th *ngIf=\"reorderController.leftReorderActivated$ | async\" class=\"fs-list-col drag-col\"></th>\n\n  <!-- Selection -->\n  <th *ngIf=\"selection && !(selection.disabled$ | async)\" class=\"fs-list-col fs-list-col-selection\">\n    <mat-checkbox (change)=\"selectAll($event)\" [checked]=\"selectedAll\"></mat-checkbox>\n  </th>\n\n  <!-- Content -->\n  <th fs-head-cell *ngFor=\"let column of columns; trackBy: trackByFn\"\n      (click)=\"$event.stopPropagation(); sorting.sortBy(column)\"\n      [column]=\"column\"\n      [class.sorting]=\"column.sortable\"\n      [ngClass]=\"column.headerConfigs.classesArray\"\n      [attr.colspan]=\"column.headerConfigs.colspan\"\n      [attr.width]=\"column.width\"></th>\n\n  <!-- Drag -->\n  <th *ngIf=\"reorderController.rightReorderActivated$ | async\" class=\"fs-list-col drag-col\"></th>\n\n  <!-- Row Actions -->\n  <th *ngIf=\"hasRowActions && !(reorderController.manualReorderActivated$ | async)\" class=\"fs-list-col row-actions\"></th>\n</tr>\n", components: [{ type: i2__namespace.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "id", "labelPosition", "name", "required", "checked", "disabled", "indeterminate", "aria-describedby", "value"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: FsHeadCellComponent, selector: "[fs-head-cell]" }], directives: [{ type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "async": i3__namespace$1.AsyncPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsHeadComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -5046,11 +5130,12 @@
                 }] } });
 
     var FsListDraggableListDirective = /** @class */ (function () {
-        function FsListDraggableListDirective(_cdRef, _zone, _containerElement, _reorderController) {
+        function FsListDraggableListDirective(_cdRef, _zone, _containerElement, _reorderController, _renderer) {
             this._cdRef = _cdRef;
             this._zone = _zone;
             this._containerElement = _containerElement;
             this._reorderController = _reorderController;
+            this._renderer = _renderer;
             // Handlers
             this._dragToHandler = this.dragTo.bind(this);
             this._dragEndHandler = this.dragEnd.bind(this);
@@ -5058,6 +5143,8 @@
             this._dragInProgress = false;
             this._dragStart$ = new rxjs.Subject();
             this._dragEnd$ = new rxjs.Subject();
+            this._draggableChildrenDirectives = [];
+            this._selectedRowsDirectives = [];
             this._destroy$ = new rxjs.Subject();
         }
         Object.defineProperty(FsListDraggableListDirective.prototype, "dragStart$", {
@@ -5081,6 +5168,22 @@
             enumerable: false,
             configurable: true
         });
+        Object.defineProperty(FsListDraggableListDirective.prototype, "_isMultipleDrag", {
+            get: function () {
+                return this._reorderController.multiple && this._selectedRowsDirectives.length > 1;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        FsListDraggableListDirective.prototype.addDraggableDirective = function (dir) {
+            this._draggableChildrenDirectives.push(dir);
+        };
+        FsListDraggableListDirective.prototype.removeDraggableDirective = function (dir) {
+            var idx = this._draggableChildrenDirectives.indexOf(dir);
+            if (idx !== -1) {
+                this._draggableChildrenDirectives.splice(idx, 1);
+            }
+        };
         /**
          * Prepare draggable elements and add events
          * @param draggableElement
@@ -5091,12 +5194,13 @@
                 return;
             }
             if (this._reorderController.startCallback
-                && this._reorderController.strategy === exports.ReorderStrategy.Always) {
+                && this._reorderController.strategy === ReorderStrategy.Always) {
                 this._reorderController.startCallback();
             }
             this._dragInProgress = true;
             window.document.body.classList.add('reorder-in-progress');
             this._draggableElement = draggableElement;
+            this._detectSelectedRows();
             this.prepareElements();
             this.initDraggableElement();
             this._draggableElement.classList.add('draggable-elem');
@@ -5118,6 +5222,10 @@
             this.touchFix(event);
             var elemIndex = this.lookupElementUnder(event);
             var targetRow = this._rows[elemIndex];
+            if (this._multipleDraggableElementPreview) {
+                this._multipleDraggableElementPreview.style.left = event.clientX + 'px';
+                this._multipleDraggableElementPreview.style.top = event.clientY + 'px';
+            }
             // Can not drag before first group and after last group
             var swapWithBoundaryGroupElement = (elemIndex === 0 || elemIndex === this._rows.length - 1)
                 && targetRow.isGroup
@@ -5126,15 +5234,22 @@
                 if (elemIndex !== null) {
                     if (targetRow.readyToSwap) {
                         this.swapWithIndex(elemIndex);
-                        this._draggableElementPreview.classList.remove('fs-list-no-drop');
+                        if (this._draggableElementPreview) {
+                            this._draggableElementPreview.classList.remove('fs-list-no-drop');
+                        }
                     }
                     else {
-                        this._draggableElementPreview.classList.add('fs-list-no-drop');
+                        if (this._draggableElementPreview) {
+                            this._draggableElementPreview.classList.add('fs-list-no-drop');
+                        }
                     }
                 }
+                // FIXME
+                if (this._draggableElementPreview) {
+                    var topOffset = (event.y || event.clientY) - (this._draggableElementHeight / 2);
+                    this._draggableElementPreview.style.top = topOffset + 'px';
+                }
             }
-            var topOffset = (event.y || event.clientY) - (this._draggableElementHeight / 2);
-            this._draggableElementPreview.style.top = topOffset + 'px';
         };
         /**
          * Remove events and classes after drag finish
@@ -5142,11 +5257,11 @@
         FsListDraggableListDirective.prototype.dragEnd = function () {
             var _this = this;
             this._dragInProgress = false;
-            ///
+            this._reorderController.dataController.finishReorder();
             if (this._reorderController.movedCallback) {
                 this._reorderController.movedCallback(this._reorderController.dataController.reorderData);
             }
-            if (this._reorderController.strategy === exports.ReorderStrategy.Always) {
+            if (this._reorderController.strategy === ReorderStrategy.Always) {
                 this._zone.run(function () {
                     if (_this._reorderController.doneCallback) {
                         var result = _this._reorderController.doneCallback(_this._reorderController.dataController.reorderData);
@@ -5156,13 +5271,21 @@
             }
             // this._reorderController.dataController.updateOrderByRows(this._rows);
             ///
+            this._containerElement.nativeElement.classList.remove('drag-hidden');
             this._draggableElement.classList.remove('draggable-elem');
             window.document.body.classList.remove('reorder-in-progress');
-            this._draggableElementPreview.remove();
             this._draggableElement = null;
-            this._draggableElementPreview = null;
+            if (this._draggableElementPreview) {
+                this._draggableElementPreview.remove();
+                this._draggableElementPreview = null;
+            }
+            else {
+                this._renderer.removeChild(document.body, this._multipleDraggableElementPreview);
+                this._multipleDraggableElementPreview = null;
+            }
             this._draggableElementHeight = null;
             this._draggableElementIndex = null;
+            this._selectedRowsDirectives = [];
             window.removeEventListener('touchmove', this._windowTouchMoveHandler);
             window.document.removeEventListener('mousemove', this._dragToHandler);
             window.document.removeEventListener('touchmove', this._dragToHandler);
@@ -5183,7 +5306,7 @@
          */
         FsListDraggableListDirective.prototype.lookupChildElements = function () {
             var _this = this;
-            this._childRowElements = Array.from(this._containerElement.nativeElement.querySelectorAll('tr'))
+            this._childRowElements = Array.from(this._containerElement.nativeElement.querySelectorAll('tr:not(.drag-hidden)'))
                 .reduce(function (acc, rowElement, index) {
                 var element = { target: rowElement };
                 if (rowElement === _this._draggableElement) {
@@ -5210,19 +5333,35 @@
          * Init draggable element
          */
         FsListDraggableListDirective.prototype.initDraggableElement = function () {
+            var _a;
             var el = this._draggableElement.cloneNode(true);
             var data = this._draggableElement.getBoundingClientRect();
-            el.style.width = data.width + 'px';
-            el.style.left = data.left + 'px';
-            el.style.top = data.top + 'px';
-            el.classList.add('draggable');
-            this._containerElement.nativeElement.insertAdjacentElement('afterbegin', el);
-            this._draggableElementPreview = el;
-            this._draggableElementHeight = data.height;
-            this.updateDraggableDims();
+            if (!(this._isMultipleDrag)) {
+                el.style.width = data.width + 'px';
+                el.style.left = data.left + 'px';
+                el.style.top = data.top + 'px';
+                el.classList.add('draggable');
+                this._containerElement.nativeElement.insertAdjacentElement('afterbegin', el);
+                this._draggableElementPreview = el;
+                this._draggableElementHeight = data.height;
+                this.updateDraggableDims();
+            }
+            else {
+                // Create preview DIV
+                this._containerElement.nativeElement.classList.add('drag-hidden');
+                var selectedCount = (_a = this._selectedRowsDirectives) === null || _a === void 0 ? void 0 : _a.length;
+                var previewBlock = this._renderer.createElement('div');
+                previewBlock.style.left = data.left + 'px';
+                previewBlock.style.top = data.top + 'px';
+                var text = this._renderer.createText(selectedCount + " selected items");
+                this._renderer.appendChild(previewBlock, text);
+                this._renderer.addClass(previewBlock, 'preview-block');
+                this._renderer.appendChild(document.body, previewBlock);
+                this._multipleDraggableElementPreview = previewBlock;
+            }
         };
         /**
-         * Looking by stored row elemens for overlapped row
+         * Looking by stored row elements for overlapped row
          * @param event
          */
         FsListDraggableListDirective.prototype.lookupElementUnder = function (event) {
@@ -5246,19 +5385,24 @@
          */
         FsListDraggableListDirective.prototype.swapWithIndex = function (index) {
             var activeIndex = this._draggableElementIndex;
+            var selectedRows = this._selectedRowsDirectives
+                .map(function (d) { return d.row; })
+                .filter(function (d) { return d.readyToSwap; });
             // Swap rows in global rows stack
             this._reorderController
                 .dataController
-                .swapRows(this._rows[activeIndex], this._rows[index]);
+                .swapRows(this._rows[activeIndex], this._rows[index], selectedRows, this._isMultipleDrag);
             // Swap visible rows
-            var activeRow = this._rows[activeIndex];
-            this._rows[activeIndex] = this._rows[index];
-            this._rows[index] = activeRow;
-            var activeElement = this._childRowElements[activeIndex].target;
-            this._childRowElements[activeIndex].active = false;
-            this._childRowElements[activeIndex].target = this._childRowElements[index].target;
-            this._childRowElements[index].target = activeElement;
-            this._childRowElements[index].active = true;
+            if (!this._isMultipleDrag) {
+                var activeRow = this._rows[activeIndex];
+                this._rows[activeIndex] = this._rows[index];
+                this._rows[index] = activeRow;
+                var activeElement = this._childRowElements[activeIndex].target;
+                this._childRowElements[activeIndex].active = false;
+                this._childRowElements[activeIndex].target = this._childRowElements[index].target;
+                this._childRowElements[index].target = activeElement;
+                this._childRowElements[index].active = true;
+            }
             this._draggableElementIndex = index;
             this._cdRef.detectChanges();
         };
@@ -5279,11 +5423,21 @@
                 doneResult
                     .pipe(operators.takeUntil(this._destroy$))
                     .subscribe(function () {
-                    console.log('enable');
                     _this._reorderController.enableReorderAction();
                 });
             }
         };
+        FsListDraggableListDirective.prototype._detectSelectedRows = function () {
+            var _this = this;
+            this._draggableChildrenDirectives
+                .forEach(function (dir) {
+                var _a;
+                var isRowSelected = (_a = _this._reorderController.selectionController) === null || _a === void 0 ? void 0 : _a.isRowSelected(dir.row.data);
+                if (isRowSelected && !dir.row.isGroup) {
+                    _this._selectedRowsDirectives.push(dir);
+                }
+            });
+        };
         /**
          * Fix background when mobile
          * @param e
@@ -5300,14 +5454,14 @@
         };
         return FsListDraggableListDirective;
     }());
-    FsListDraggableListDirective.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsListDraggableListDirective, deps: [{ token: i0__namespace.ChangeDetectorRef }, { token: i0__namespace.NgZone }, { token: i0__namespace.ElementRef }, { token: ReorderController }], target: i0__namespace.ɵɵFactoryTarget.Directive });
+    FsListDraggableListDirective.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsListDraggableListDirective, deps: [{ token: i0__namespace.ChangeDetectorRef }, { token: i0__namespace.NgZone }, { token: i0__namespace.ElementRef }, { token: ReorderController }, { token: i0__namespace.Renderer2 }], target: i0__namespace.ɵɵFactoryTarget.Directive });
     FsListDraggableListDirective.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: FsListDraggableListDirective, selector: "[fsListDraggableList]", inputs: { _rows: ["rows", "_rows"] }, ngImport: i0__namespace });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsListDraggableListDirective, decorators: [{
                 type: i0.Directive,
                 args: [{
                         selector: '[fsListDraggableList]',
                     }]
-            }], ctorParameters: function () { return [{ type: i0__namespace.ChangeDetectorRef }, { type: i0__namespace.NgZone }, { type: i0__namespace.ElementRef }, { type: ReorderController }]; }, propDecorators: { _rows: [{
+            }], ctorParameters: function () { return [{ type: i0__namespace.ChangeDetectorRef }, { type: i0__namespace.NgZone }, { type: i0__namespace.ElementRef }, { type: ReorderController }, { type: i0__namespace.Renderer2 }]; }, propDecorators: { _rows: [{
                     type: i0.Input,
                     args: ['rows']
                 }] } });
@@ -5326,8 +5480,8 @@
         };
         return FsRowInlineActionComponent;
     }());
-    FsRowInlineActionComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsRowInlineActionComponent, deps: [{ token: i1__namespace$1.FsPrompt }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    FsRowInlineActionComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsRowInlineActionComponent, selector: "fs-list-row-inline-action", inputs: { action: "action" }, outputs: { clicked: "clicked", fileSelect: "fileSelect" }, ngImport: i0__namespace, template: "<ng-container *ngIf=\"action.isShown\" [ngSwitch]=\"action.type\">\n  <!-- Basic button -->\n  <ng-container *ngSwitchCase=\"'basic'\">\n    <ng-container *ngIf=\"!action.routerLink; else link\">\n      <button type=\"button\"\n              mat-button\n              (click)=\"actionClick($event)\"\n              [ngClass]=\"action.classArray\"\n      >\n        <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n      </button>\n    </ng-container>\n    <ng-template #link>\n      <a mat-button\n         [routerLink]=\"action.routerLink.link\"\n         [queryParams]=\"action.routerLink.queryParams\">\n        <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n      </a>\n    </ng-template>\n  </ng-container>\n\n  <!-- Raised button -->\n  <ng-container *ngSwitchCase=\"'raised'\">\n    <ng-container *ngIf=\"!action.routerLink; else link\">\n      <button type=\"button\"\n              mat-raised-button\n              (click)=\"actionClick($event)\"\n              [ngClass]=\"action.classArray\"\n      >\n        <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n      </button>\n    </ng-container>\n    <ng-template #link>\n      <a mat-raised-button\n         [routerLink]=\"action.routerLink.link\"\n         [queryParams]=\"action.routerLink.queryParams\">\n        <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n      </a>\n    </ng-template>\n  </ng-container>\n\n  <!-- Icon button -->\n  <ng-container *ngSwitchCase=\"'icon'\">\n    <ng-container *ngIf=\"!action.routerLink; else link\">\n      <button type=\"button\"\n              mat-icon-button\n              (click)=\"actionClick($event)\"\n              [ngClass]=\"action.classArray\"\n      >\n        <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n      </button>\n    </ng-container>\n    <ng-template #link>\n      <a mat-icon-button\n         [routerLink]=\"action.routerLink.link\"\n         [queryParams]=\"action.routerLink.queryParams\">\n        <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n      </a>\n    </ng-template>\n  </ng-container>\n\n  <!-- Fab button -->\n  <ng-container *ngSwitchCase=\"'fab'\">\n    <ng-container *ngIf=\"!action.routerLink; else link\">\n      <button type=\"button\"\n              mat-fab\n              (click)=\"actionClick($event)\"\n              [ngClass]=\"action.classArray\"\n      >\n        <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n      </button>\n    </ng-container>\n    <ng-template #link>\n      <a mat-fab\n         [routerLink]=\"action.routerLink.link\"\n         [queryParams]=\"action.routerLink.queryParams\">\n        <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n      </a>\n    </ng-template>\n  </ng-container>\n\n  <!-- Mini Fab button -->\n  <ng-container *ngSwitchCase=\"'mini-fab'\">\n    <ng-container *ngIf=\"!action.routerLink; else link\">\n      <button type=\"button\"\n              mat-mini-fab\n              (click)=\"actionClick($event)\"\n              [ngClass]=\"action.classArray\"\n      >\n        <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n      </button>\n    </ng-container>\n    <ng-template #link>\n      <a mat-mini-fab\n         [routerLink]=\"action.routerLink.link\"\n         [queryParams]=\"action.routerLink.queryParams\">\n        <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n      </a>\n    </ng-template>\n  </ng-container>\n\n  <ng-template #buttonContent>\n    <ng-container *ngIf=\"!action.fileConfig else uploadFileBtn\">\n      <mat-icon *ngIf=\"action.icon\">{{action.icon}}</mat-icon>\n      {{action.label}}\n    </ng-container>\n\n    <ng-template #uploadFileBtn>\n      <fs-file\n        class=\"action-button\"\n        [accept]=\"action.fileConfig.accept || '*'\"\n        [multiple]=\"action.fileConfig.multiple\"\n        [minWidth]=\"action.fileConfig.minWidth\"\n        [minHeight]=\"action.fileConfig.minHeight\"\n        [imageWidth]=\"action.fileConfig.maxWidth\"\n        [imageHeight]=\"action.fileConfig.maxHeight\"\n        (select)=\"fileSelected($event)\"\n        (error)=\"action.fileConfig.error && action.fileConfig.error($event)\">\n        <mat-icon *ngIf=\"action.icon\">{{action.icon}}</mat-icon>\n        {{action.label}}\n      </fs-file>\n    </ng-template>\n  </ng-template>\n</ng-container>\n", components: [{ type: i2__namespace$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i2__namespace$1.MatAnchor, selector: "a[mat-button], a[mat-raised-button], a[mat-icon-button], a[mat-fab],             a[mat-mini-fab], a[mat-stroked-button], a[mat-flat-button]", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matButton", "matAnchor"] }, { type: i3__namespace.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i4__namespace$1.FsFileComponent, selector: "fs-file", inputs: ["minHeight", "minWidth", "multiple", "capture", "allowClick", "allowDrop", "accept", "disabled", "imageWidth", "imageHeight", "imageQuality"], outputs: ["select", "error", "clicked", "declined"] }], directives: [{ type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3__namespace$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i3__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5__namespace.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i3__namespace$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i6__namespace$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["routerLink", "target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+    FsRowInlineActionComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsRowInlineActionComponent, deps: [{ token: i1__namespace$2.FsPrompt }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    FsRowInlineActionComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsRowInlineActionComponent, selector: "fs-list-row-inline-action", inputs: { action: "action" }, outputs: { clicked: "clicked", fileSelect: "fileSelect" }, ngImport: i0__namespace, template: "<ng-container *ngIf=\"action.isShown\" [ngSwitch]=\"action.type\">\n  <!-- Basic button -->\n  <ng-container *ngSwitchCase=\"'basic'\">\n    <ng-container *ngIf=\"!action.routerLink; else link\">\n      <button type=\"button\"\n              mat-button\n              (click)=\"actionClick($event)\"\n              [ngClass]=\"action.classArray\"\n      >\n        <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n      </button>\n    </ng-container>\n    <ng-template #link>\n      <a mat-button\n         [routerLink]=\"action.routerLink.link\"\n         [queryParams]=\"action.routerLink.queryParams\">\n        <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n      </a>\n    </ng-template>\n  </ng-container>\n\n  <!-- Raised button -->\n  <ng-container *ngSwitchCase=\"'raised'\">\n    <ng-container *ngIf=\"!action.routerLink; else link\">\n      <button type=\"button\"\n              mat-raised-button\n              (click)=\"actionClick($event)\"\n              [ngClass]=\"action.classArray\"\n      >\n        <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n      </button>\n    </ng-container>\n    <ng-template #link>\n      <a mat-raised-button\n         [routerLink]=\"action.routerLink.link\"\n         [queryParams]=\"action.routerLink.queryParams\">\n        <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n      </a>\n    </ng-template>\n  </ng-container>\n\n  <!-- Icon button -->\n  <ng-container *ngSwitchCase=\"'icon'\">\n    <ng-container *ngIf=\"!action.routerLink; else link\">\n      <button type=\"button\"\n              mat-icon-button\n              (click)=\"actionClick($event)\"\n              [ngClass]=\"action.classArray\"\n      >\n        <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n      </button>\n    </ng-container>\n    <ng-template #link>\n      <a mat-icon-button\n         [routerLink]=\"action.routerLink.link\"\n         [queryParams]=\"action.routerLink.queryParams\">\n        <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n      </a>\n    </ng-template>\n  </ng-container>\n\n  <!-- Fab button -->\n  <ng-container *ngSwitchCase=\"'fab'\">\n    <ng-container *ngIf=\"!action.routerLink; else link\">\n      <button type=\"button\"\n              mat-fab\n              (click)=\"actionClick($event)\"\n              [ngClass]=\"action.classArray\"\n      >\n        <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n      </button>\n    </ng-container>\n    <ng-template #link>\n      <a mat-fab\n         [routerLink]=\"action.routerLink.link\"\n         [queryParams]=\"action.routerLink.queryParams\">\n        <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n      </a>\n    </ng-template>\n  </ng-container>\n\n  <!-- Mini Fab button -->\n  <ng-container *ngSwitchCase=\"'mini-fab'\">\n    <ng-container *ngIf=\"!action.routerLink; else link\">\n      <button type=\"button\"\n              mat-mini-fab\n              (click)=\"actionClick($event)\"\n              [ngClass]=\"action.classArray\"\n      >\n        <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n      </button>\n    </ng-container>\n    <ng-template #link>\n      <a mat-mini-fab\n         [routerLink]=\"action.routerLink.link\"\n         [queryParams]=\"action.routerLink.queryParams\">\n        <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n      </a>\n    </ng-template>\n  </ng-container>\n\n  <ng-template #buttonContent>\n    <ng-container *ngIf=\"!action.fileConfig else uploadFileBtn\">\n      <mat-icon *ngIf=\"action.icon\">{{action.icon}}</mat-icon>\n      {{action.label}}\n    </ng-container>\n\n    <ng-template #uploadFileBtn>\n      <fs-file\n        class=\"action-button\"\n        [accept]=\"action.fileConfig.accept || '*'\"\n        [multiple]=\"action.fileConfig.multiple\"\n        [minWidth]=\"action.fileConfig.minWidth\"\n        [minHeight]=\"action.fileConfig.minHeight\"\n        [imageWidth]=\"action.fileConfig.maxWidth\"\n        [imageHeight]=\"action.fileConfig.maxHeight\"\n        (select)=\"fileSelected($event)\"\n        (error)=\"action.fileConfig.error && action.fileConfig.error($event)\">\n        <mat-icon *ngIf=\"action.icon\">{{action.icon}}</mat-icon>\n        {{action.label}}\n      </fs-file>\n    </ng-template>\n  </ng-template>\n</ng-container>\n", components: [{ type: i2__namespace$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i2__namespace$1.MatAnchor, selector: "a[mat-button], a[mat-raised-button], a[mat-icon-button], a[mat-fab],             a[mat-mini-fab], a[mat-stroked-button], a[mat-flat-button]", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matButton", "matAnchor"] }, { type: i3__namespace.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i4__namespace.FsFileComponent, selector: "fs-file", inputs: ["minHeight", "minWidth", "multiple", "capture", "allowClick", "allowDrop", "accept", "disabled", "imageWidth", "imageHeight", "imageQuality"], outputs: ["select", "error", "clicked", "declined"] }], directives: [{ type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3__namespace$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i3__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3__namespace$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i7__namespace.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["routerLink", "target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsRowInlineActionComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -5335,7 +5489,7 @@
                         templateUrl: './inline-action.component.html',
                         changeDetection: i0.ChangeDetectionStrategy.OnPush,
                     }]
-            }], ctorParameters: function () { return [{ type: i1__namespace$1.FsPrompt }]; }, propDecorators: { action: [{
+            }], ctorParameters: function () { return [{ type: i1__namespace$2.FsPrompt }]; }, propDecorators: { action: [{
                     type: i0.Input
                 }], clicked: [{
                     type: i0.Output
@@ -5343,6 +5497,24 @@
                     type: i0.Output
                 }] } });
 
+    var ActionLabelPipe = /** @class */ (function () {
+        function ActionLabelPipe() {
+        }
+        ActionLabelPipe.prototype.transform = function (label, row) {
+            if (typeof label === 'function') {
+                return label(row.data);
+            }
+            return label;
+        };
+        return ActionLabelPipe;
+    }());
+    ActionLabelPipe.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ActionLabelPipe, deps: [], target: i0__namespace.ɵɵFactoryTarget.Pipe });
+    ActionLabelPipe.ɵpipe = i0__namespace.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ActionLabelPipe, name: "actionLabel" });
+    i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: ActionLabelPipe, decorators: [{
+                type: i0.Pipe,
+                args: [{ name: 'actionLabel' }]
+            }] });
+
     var FsRowMenuActionComponent = /** @class */ (function () {
         function FsRowMenuActionComponent() {
             this.fileSelect = new i0.EventEmitter();
@@ -5351,7 +5523,7 @@
         return FsRowMenuActionComponent;
     }());
     FsRowMenuActionComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsRowMenuActionComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    FsRowMenuActionComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsRowMenuActionComponent, selector: "fs-list-row-menu-action", inputs: { icon: "icon", label: "label", file: "file" }, outputs: { fileSelect: "fileSelect", fileError: "fileError" }, ngImport: i0__namespace, template: "<ng-container *ngIf=\"!file else withFile\">\n  <mat-icon *ngIf=\"icon\">{{icon}}</mat-icon>\n  {{label}}\n</ng-container>\n\n<ng-template #withFile>\n  <fs-file\n    class=\"action-button\"\n    [accept]=\"file.accept || '*'\"\n    [multiple]=\"file.multiple\"\n    [minWidth]=\"file.minWidth\"\n    [minHeight]=\"file.minHeight\"\n    [imageWidth]=\"file.maxWidth\"\n    [imageHeight]=\"file.maxHeight\"\n    (select)=\"fileSelect.emit($event)\"\n    (error)=\"fileError.emit($event)\">\n    <mat-icon *ngIf=\"icon\">{{icon}}</mat-icon>\n    {{label}}\n  </fs-file>\n</ng-template>\n", components: [{ type: i3__namespace.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i4__namespace$1.FsFileComponent, selector: "fs-file", inputs: ["minHeight", "minWidth", "multiple", "capture", "allowClick", "allowDrop", "accept", "disabled", "imageWidth", "imageHeight", "imageQuality"], outputs: ["select", "error", "clicked", "declined"] }], directives: [{ type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+    FsRowMenuActionComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsRowMenuActionComponent, selector: "fs-list-row-menu-action", inputs: { row: "row", icon: "icon", label: "label", file: "file" }, outputs: { fileSelect: "fileSelect", fileError: "fileError" }, ngImport: i0__namespace, template: "<ng-container *ngIf=\"!file else withFile\">\n  <mat-icon *ngIf=\"icon\">{{icon}}</mat-icon>\n  {{label| actionLabel:row}}\n</ng-container>\n\n<ng-template #withFile>\n  <fs-file\n      class=\"action-button\"\n      [accept]=\"file.accept || '*'\"\n      [multiple]=\"file.multiple\"\n      [minWidth]=\"file.minWidth\"\n      [minHeight]=\"file.minHeight\"\n      [imageWidth]=\"file.maxWidth\"\n      [imageHeight]=\"file.maxHeight\"\n      (select)=\"fileSelect.emit($event)\"\n      (error)=\"fileError.emit($event)\">\n    <mat-icon *ngIf=\"icon\">{{icon}}</mat-icon>\n    {{label| actionLabel:row}}\n  </fs-file>\n</ng-template>\n", components: [{ type: i3__namespace.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i4__namespace.FsFileComponent, selector: "fs-file", inputs: ["minHeight", "minWidth", "multiple", "capture", "allowClick", "allowDrop", "accept", "disabled", "imageWidth", "imageHeight", "imageQuality"], outputs: ["select", "error", "clicked", "declined"] }], directives: [{ type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "actionLabel": ActionLabelPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsRowMenuActionComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -5359,7 +5531,9 @@
                         templateUrl: './menu-action.component.html',
                         changeDetection: i0.ChangeDetectionStrategy.OnPush,
                     }]
-            }], propDecorators: { icon: [{
+            }], propDecorators: { row: [{
+                    type: i0.Input
+                }], icon: [{
                     type: i0.Input
                 }], label: [{
                     type: i0.Input
@@ -5409,12 +5583,6 @@
         FsRowActionsComponent.prototype.trackByFn = function (index) {
             return index;
         };
-        FsRowActionsComponent.prototype.clickOnTrigger = function (event) {
-            var _this = this;
-            event.stopPropagation();
-            this.rowActions
-                .forEach(function (action) { return action.updateLabel(_this.row.data); });
-        };
         /**
          * Emit that some row must be removed
          * @param action
@@ -5435,8 +5603,8 @@
         };
         return FsRowActionsComponent;
     }());
-    FsRowActionsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsRowActionsComponent, deps: [{ token: i1__namespace$1.FsPrompt }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    FsRowActionsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsRowActionsComponent, selector: "fs-list-row-actions", inputs: { row: "row", index: "index", restoreMode: "restoreMode", rowActions: "rowActions", rowRemoved: "rowRemoved", menuRowActions: "menuRowActions", inlineRowActions: "inlineRowActions", restoreAction: "restoreAction" }, ngImport: i0__namespace, template: "<ng-container *ngIf=\"!restoreMode || (restoreMode && !restoreAction)\">\n  <ng-container *ngFor=\"let action of inlineRowActions; trackBy: trackByFn\">\n    <fs-list-row-inline-action class=\"row-inline-action row-inline-action-{{action.type}}\"\n                               [action]=\"action\"\n                               [ngClass]=\"{'mobile-hide': action.menu === undefined}\"\n                               (clicked)=\"actionClick(action, row, $event)\"\n                               (fileSelect)=\"action.fileConfig.select($event, row, index)\">\n    </fs-list-row-inline-action>\n  </ng-container>\n</ng-container>\n\n<!-- Menu -->\n<fs-menu class=\"row-menu-action\"\n         *ngIf=\"menuRowActions.length || (restoreMode && restoreAction)\"\n         (click)=\"clickOnTrigger($event)\"\n         #menuRef\n>\n  <!-- Case when we have usual menu actions -->\n  <ng-container *ngIf=\"!restoreMode || (restoreMode && !restoreAction)\">\n    <ng-container *ngFor=\"let action of inlineRowActions; trackBy: trackByFn\">\n      <ng-template class=\"hidden-mobile-menu-action\"\n                   fs-menu-item\n                   [link]=\"action.routerLink?.link\"\n                   [queryParams]=\"action.routerLink?.queryParams\"\n                   [target]=\"action.routerLink?.target\"\n                   [hidden]=\"action.menu !== undefined && !action.isShown\">\n        <fs-list-row-menu-action\n          [icon]=\"action.icon\"\n          [label]=\"action.label\"\n          [file]=\"action.fileConfig\"\n          (fileSelect)=\"action.fileConfig.select($event, row, index)\"\n          (fileError)=\"action.fileConfig.error && action.fileConfig.error($event)\">\n        </fs-list-row-menu-action>\n      </ng-template>\n    </ng-container>\n\n    <ng-container *ngFor=\"let action of menuRowActions; trackBy: trackByFn\">\n      <ng-container *ngIf=\"action.isGroup else simpleMenuItem\">\n        <fs-menu-group [label]=\"action.label\">\n          <ng-container *ngFor=\"let subAction of action.rowActions\">\n            <ng-template fs-menu-item\n                         [link]=\"subAction.routerLink?.link\"\n                         [queryParams]=\"subAction.routerLink?.queryParams\"\n                         [target]=\"subAction.routerLink?.target\"\n                         [hidden]=\"!subAction.isShown\"\n                         (click)=\"actionClick(subAction, row, $event, menuRef);\">\n              <fs-list-row-menu-action\n                [icon]=\"subAction.icon\"\n                [label]=\"subAction.label\"\n                [file]=\"subAction.fileConfig\"\n                (fileSelect)=\"subAction.fileConfig.select($event, row, index)\"\n                (fileError)=\"subAction.fileConfig.error && subAction.fileConfig.error($event)\">\n              </fs-list-row-menu-action>\n            </ng-template>\n          </ng-container>\n        </fs-menu-group>\n      </ng-container>\n      <ng-template #simpleMenuItem>\n        <ng-template fs-menu-item\n                     [link]=\"action.routerLink?.link\"\n                     [queryParams]=\"action.routerLink?.queryParams\"\n                     [target]=\"action.routerLink?.target\"\n                     [hidden]=\"!action.isShown\"\n                     (click)=\"actionClick(action, row, $event, menuRef);\">\n          <fs-list-row-menu-action\n            [icon]=\"action.icon\"\n            [label]=\"action.label\"\n            [file]=\"action.fileConfig\"\n            (fileSelect)=\"action.fileConfig.select($event, row, index)\"\n            (fileError)=\"action.fileConfig.error && action.fileConfig.error($event)\">\n          </fs-list-row-menu-action>\n        </ng-template>\n      </ng-template>\n    </ng-container>\n  </ng-container>\n\n  <!-- Case when we have restore mode enabled and must hide menu actions -->\n  <ng-container *ngIf=\"restoreMode && restoreAction\">\n    <ng-template fs-menu-item (click)=\"actionClick(restoreAction, row, $event, menuRef)\">\n      <mat-icon *ngIf=\"restoreAction.icon\">{{restoreAction.icon}}</mat-icon>\n      {{restoreAction.label}}\n    </ng-template>\n  </ng-container>\n</fs-menu>\n", components: [{ type: FsRowInlineActionComponent, selector: "fs-list-row-inline-action", inputs: ["action"], outputs: ["clicked", "fileSelect"] }, { type: i2__namespace$3.FsMenuComponent, selector: "fs-menu", inputs: ["class", "buttonClass"], outputs: ["opened", "closed"] }, { type: FsRowMenuActionComponent, selector: "fs-list-row-menu-action", inputs: ["icon", "label", "file"], outputs: ["fileSelect", "fileError"] }, { type: i3__namespace.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5__namespace.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i2__namespace$3.FsMenuItemDirective, selector: "fs-menu-group,[fs-menu-item]", inputs: ["fsClass", "class", "id", "label", "hidden", "groupHidden", "dismissAfterClick", "link", "target", "queryParams"], outputs: ["click"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+    FsRowActionsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsRowActionsComponent, deps: [{ token: i1__namespace$2.FsPrompt }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    FsRowActionsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsRowActionsComponent, selector: "fs-list-row-actions", inputs: { row: "row", index: "index", restoreMode: "restoreMode", rowActions: "rowActions", rowRemoved: "rowRemoved", menuRowActions: "menuRowActions", inlineRowActions: "inlineRowActions", restoreAction: "restoreAction" }, ngImport: i0__namespace, template: "<ng-container *ngIf=\"!restoreMode || (restoreMode && !restoreAction)\">\n  <ng-container *ngFor=\"let action of inlineRowActions; trackBy: trackByFn\">\n    <fs-list-row-inline-action \n      class=\"row-inline-action row-inline-action-{{action.type}}\"\n      [action]=\"action\"\n      [ngClass]=\"{'mobile-hide': action.menu === undefined}\"\n      (clicked)=\"actionClick(action, row, $event)\"\n      (fileSelect)=\"action.fileConfig.select($event, row, index)\">\n    </fs-list-row-inline-action>\n  </ng-container>\n</ng-container>\n\n<!-- Menu -->\n<fs-menu \n    class=\"row-menu-action\"\n    *ngIf=\"menuRowActions.length || (restoreMode && restoreAction)\"\n    #menuRef>\n  <!-- Case when we have usual menu actions -->\n  <ng-container *ngIf=\"!restoreMode || (restoreMode && !restoreAction)\">\n    <ng-container *ngFor=\"let action of inlineRowActions; trackBy: trackByFn\">\n      <ng-template \n          class=\"hidden-mobile-menu-action\"\n          fs-menu-item\n          [link]=\"action.routerLink?.link\"\n          [queryParams]=\"action.routerLink?.queryParams\"\n          [target]=\"action.routerLink?.target\"\n          [hidden]=\"action.menu !== undefined && !action.isShown\">\n        <fs-list-row-menu-action\n          [icon]=\"action.icon\"\n          [label]=\"action.label\"\n          [row]=\"row\"\n          [file]=\"action.fileConfig\"\n          (fileSelect)=\"action.fileConfig.select($event, row, index)\"\n          (fileError)=\"action.fileConfig.error && action.fileConfig.error($event)\">\n        </fs-list-row-menu-action>\n      </ng-template>\n    </ng-container>\n\n    <ng-container *ngFor=\"let action of menuRowActions; trackBy: trackByFn\">\n      <ng-container *ngIf=\"action.isGroup else simpleMenuItem\">\n        <fs-menu-group [label]=\"action.label | actionLabel:row\">\n          <ng-container *ngFor=\"let subAction of action.rowActions\">\n            <ng-template \n                fs-menu-item\n                [link]=\"subAction.routerLink?.link\"\n                [queryParams]=\"subAction.routerLink?.queryParams\"\n                [target]=\"subAction.routerLink?.target\"\n                [hidden]=\"!subAction.isShown\"\n                (click)=\"actionClick(subAction, row, $event, menuRef);\">\n              <fs-list-row-menu-action\n                [icon]=\"subAction.icon\"\n                [label]=\"subAction.label\"\n                [row]=\"row\"\n                [file]=\"subAction.fileConfig\"\n                (fileSelect)=\"subAction.fileConfig.select($event, row, index)\"\n                (fileError)=\"subAction.fileConfig.error && subAction.fileConfig.error($event)\">\n              </fs-list-row-menu-action>\n            </ng-template>\n          </ng-container>\n        </fs-menu-group>\n      </ng-container>\n      <ng-template #simpleMenuItem>\n        <ng-template \n            fs-menu-item\n            [link]=\"action.routerLink?.link\"\n            [queryParams]=\"action.routerLink?.queryParams\"\n            [target]=\"action.routerLink?.target\"\n            [hidden]=\"!action.isShown\"\n            (click)=\"actionClick(action, row, $event, menuRef);\">\n          <fs-list-row-menu-action\n            [icon]=\"action.icon\"\n            [label]=\"action.label\"\n            [row]=\"row\"\n            [file]=\"action.fileConfig\"\n            (fileSelect)=\"action.fileConfig.select($event, row, index)\"\n            (fileError)=\"action.fileConfig.error && action.fileConfig.error($event)\">\n          </fs-list-row-menu-action>\n        </ng-template>\n      </ng-template>\n    </ng-container>\n  </ng-container>\n\n  <!-- Case when we have restore mode enabled and must hide menu actions -->\n  <ng-container *ngIf=\"restoreMode && restoreAction\">\n    <ng-template fs-menu-item (click)=\"actionClick(restoreAction, row, $event, menuRef)\">\n      <mat-icon *ngIf=\"restoreAction.icon\">{{restoreAction.icon}}</mat-icon>\n      {{restoreAction.label | actionLabel:row}}\n    </ng-template>\n  </ng-container>\n</fs-menu>\n", components: [{ type: FsRowInlineActionComponent, selector: "fs-list-row-inline-action", inputs: ["action"], outputs: ["clicked", "fileSelect"] }, { type: i2__namespace$3.FsMenuComponent, selector: "fs-menu", inputs: ["class", "buttonClass"], outputs: ["opened", "closed"] }, { type: FsRowMenuActionComponent, selector: "fs-list-row-menu-action", inputs: ["row", "icon", "label", "file"], outputs: ["fileSelect", "fileError"] }, { type: i3__namespace.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2__namespace$3.FsMenuItemDirective, selector: "fs-menu-group,[fs-menu-item]" }], pipes: { "actionLabel": ActionLabelPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsRowActionsComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -5444,7 +5612,7 @@
                         templateUrl: './actions.component.html',
                         changeDetection: i0.ChangeDetectionStrategy.OnPush,
                     }]
-            }], ctorParameters: function () { return [{ type: i1__namespace$1.FsPrompt }]; }, propDecorators: { row: [{
+            }], ctorParameters: function () { return [{ type: i1__namespace$2.FsPrompt }]; }, propDecorators: { row: [{
                     type: i0.Input
                 }], index: [{
                     type: i0.Input
@@ -5477,7 +5645,7 @@
             this.rowEvents = {};
             this.restoreMode = false;
             this.ReorderPosition = exports.ReorderPosition;
-            this.ReorderStrategy = exports.ReorderStrategy;
+            this.ReorderStrategy = ReorderStrategy;
             this.rowActions = [];
             this.menuRowActions = [];
             this.inlineRowActions = [];
@@ -5503,7 +5671,22 @@
         });
         Object.defineProperty(FsRowComponent.prototype, "isGroupFooterRow", {
             get: function () {
-                return this.row.isFooter;
+                return this.row.isGroupFooter;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(FsRowComponent.prototype, "isDragDisabled", {
+            get: function () {
+                return !this.selected && this.reorderController.multiple && !!this.selection.selectedRows.size;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(FsRowComponent.prototype, "isMultipleSelection", {
+            get: function () {
+                var multiple = this.reorderController.multiple;
+                return multiple && this.selected;
             },
             enumerable: false,
             configurable: true
@@ -5523,7 +5706,7 @@
                 else if ((_b = this.row) === null || _b === void 0 ? void 0 : _b.isChild) {
                     cls += ' fs-list-row-group-child';
                 }
-                else if ((_c = this.row) === null || _c === void 0 ? void 0 : _c.isFooter) {
+                else if ((_c = this.row) === null || _c === void 0 ? void 0 : _c.isGroupFooter) {
                     cls += ' fs-list-row-group-footer';
                 }
                 if (this.rowClass) {
@@ -5534,7 +5717,7 @@
                         options.groupIndex = this.row.index;
                     }
                     else if (this.row.isChild) {
-                        options.groupChildIndex = this.row.index;
+                        options.groupIndex = this.row.index;
                     }
                     var resultClass = this.rowClass(this.row.data, options);
                     if (typeof resultClass === 'string') {
@@ -5618,7 +5801,7 @@
             return index;
         };
         FsRowComponent.prototype.dragStart = function (event) {
-            if (this.reorderController.enabled) {
+            if (this.reorderController.enabled && !this.isDragDisabled) {
                 event.preventDefault();
                 event.stopPropagation();
                 this._draggableList.dragStart(this.el.nativeElement);
@@ -5707,7 +5890,7 @@
         return FsRowComponent;
     }());
     FsRowComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsRowComponent, deps: [{ token: i0__namespace.ElementRef }, { token: ReorderController }, { token: i0__namespace.ChangeDetectorRef }, { token: i0__namespace.KeyValueDiffers }, { token: i0__namespace.Renderer2 }, { token: FsListDraggableListDirective }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    FsRowComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", 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" }, host: { properties: { "attr.role": "this.role", "class": "this.rowCssClass" } }, viewQueries: [{ propertyName: "cellRefs", predicate: ["td"], descendants: true }], ngImport: i0__namespace, template: "<!-- Drag -->\n<ng-container *ngIf=\"reorderController.leftReorderActivated$ | async\">\n  <ng-container *ngTemplateOutlet=\"dragCell\"></ng-container>\n</ng-container>\n\n<!-- Selection -->\n<ng-container *ngIf=\"selection\">\n  <td class=\"fs-list-col fs-list-col-selection\">\n    <ng-container *ngIf=\"!row.isFooter\">\n      <mat-checkbox (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=\"reorderController.rightReorderActivated$ | async\">\n  <ng-container *ngTemplateOutlet=\"dragCell\"></ng-container>\n</ng-container>\n\n<!-- Row Actions -->\n<td *ngIf=\"hasRowActions && !(reorderController.manualReorderActivated$ | async)\" class=\"fs-list-col row-actions\">\n  <ng-container *ngIf=\"!isGroupFooterRow\">\n    <fs-list-row-actions [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 class=\"fs-list-col drag-col\"\n        (mousedown)=\"dragStart($event)\"\n        (touchstart)=\"dragStart($event)\"\n    >\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", components: [{ type: i2__namespace.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "id", "labelPosition", "name", "required", "checked", "disabled", "indeterminate", "aria-describedby", "value"], 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: i3__namespace.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5__namespace.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }], pipes: { "async": i3__namespace$1.AsyncPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+    FsRowComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", 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" }, host: { properties: { "attr.role": "this.role", "class.multiple-selection": "this.isMultipleSelection", "class": "this.rowCssClass" } }, viewQueries: [{ propertyName: "cellRefs", predicate: ["td"], descendants: true }], ngImport: i0__namespace, template: "<!-- Drag -->\n<ng-container *ngIf=\"reorderController.leftReorderActivated$ | async\">\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 (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=\"reorderController.rightReorderActivated$ | async\">\n  <ng-container *ngTemplateOutlet=\"dragCell\"></ng-container>\n</ng-container>\n\n<!-- Row Actions -->\n<td *ngIf=\"hasRowActions && !(reorderController.manualReorderActivated$ | async)\" class=\"fs-list-col row-actions\">\n  <ng-container *ngIf=\"!isGroupFooterRow\">\n    <fs-list-row-actions [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 class=\"fs-list-col drag-col\"\n        [class.drag-disabled]=\"isDragDisabled\"\n        (mousedown)=\"dragStart($event)\"\n        (touchstart)=\"dragStart($event)\"\n    >\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", components: [{ type: i2__namespace.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "id", "labelPosition", "name", "required", "checked", "disabled", "indeterminate", "aria-describedby", "value"], 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: i3__namespace.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "async": i3__namespace$1.AsyncPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsRowComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -5743,6 +5926,9 @@
                 }], cellRefs: [{
                     type: i0.ViewChildren,
                     args: ['td']
+                }], isMultipleSelection: [{
+                    type: i0.HostBinding,
+                    args: ['class.multiple-selection']
                 }], rowCssClass: [{
                     type: i0.HostBinding,
                     args: ['class']
@@ -5756,15 +5942,27 @@
             this._draggableList = _draggableList;
             this._destroy$ = new rxjs.Subject();
         }
+        Object.defineProperty(FsListDraggableRowDirective.prototype, "elRef", {
+            get: function () {
+                return this._el;
+            },
+            enumerable: false,
+            configurable: true
+        });
         FsListDraggableRowDirective.prototype.ngOnInit = function () {
             if (this._reorderController.moveDropCallback) {
                 this._listenDragEvents();
             }
+            this._draggableList.addDraggableDirective(this);
         };
         FsListDraggableRowDirective.prototype.ngOnDestroy = function () {
+            this._draggableList.removeDraggableDirective(this);
             this._destroy$.next();
             this._destroy$.complete();
         };
+        FsListDraggableRowDirective.prototype.dragHide = function () {
+            this._el.nativeElement.classList.add('drag-hidden');
+        };
         FsListDraggableRowDirective.prototype._listenDragEvents = function () {
             var _this = this;
             this._draggableList
@@ -5815,8 +6013,8 @@
                 }] } });
 
     var FsBodyComponent = /** @class */ (function () {
-        function FsBodyComponent(reorderContoller, el, cdRef, differs) {
-            this.reorderContoller = reorderContoller;
+        function FsBodyComponent(reorderController, el, cdRef, differs) {
+            this.reorderController = reorderController;
             this.el = el;
             this.cdRef = cdRef;
             this.differs = differs;
@@ -5842,7 +6040,7 @@
         return FsBodyComponent;
     }());
     FsBodyComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsBodyComponent, deps: [{ token: ReorderController }, { token: i0__namespace.ElementRef }, { token: i0__namespace.ChangeDetectorRef }, { token: i0__namespace.IterableDiffers }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    FsBodyComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsBodyComponent, selector: "[fs-list-body]", inputs: { rows: "rows", columns: "columns", hasFooter: "hasFooter", rowActionsRaw: "rowActionsRaw", groupActionsRaw: "groupActionsRaw", rowEvents: "rowEvents", rowClass: "rowClass", hasRowActions: "hasRowActions", selection: "selection", restoreMode: "restoreMode", rowRemoved: "rowRemoved" }, queries: [{ propertyName: "headerTemplate", first: true, predicate: FsRowComponent, descendants: true, read: i0.TemplateRef, static: true }], viewQueries: [{ propertyName: "rowsContainer", first: true, predicate: ["rowsContainer"], descendants: true, read: i0.ViewContainerRef, static: true }], ngImport: i0__namespace, template: "<ng-container *ngFor=\"let row of rows; let i = index;\">\n  <tr fs-list-row\n      fsListDraggableRow\n      [row]=\"row\"\n      [rowIndex]=\"i\"\n      [columns]=\"columns\"\n      [rowActionsRaw]=\"rowActionsRaw\"\n      [groupActionsRaw]=\"groupActionsRaw\"\n      [hasRowActions]=\"hasRowActions\"\n      [rowEvents]=\"rowEvents\"\n      [rowClass]=\"rowClass\"\n      [selection]=\"selection\"\n      [restoreMode]=\"restoreMode\"\n      [ngClass]=\"{ 'drag-row': reorderContoller.enabled }\"\n      [rowRemoved]=\"rowRemoved\"\n      #activeRow>\n  </tr>\n</ng-container>\n", components: [{ type: FsRowComponent, selector: "[fs-list-row]", inputs: ["row", "rowActionsRaw", "groupActionsRaw", "hasRowActions", "rowEvents", "rowClass", "restoreMode", "rowIndex", "columns", "selection", "rowRemoved"] }], directives: [{ type: i3__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: FsListDraggableRowDirective, selector: "[fsListDraggableRow]", inputs: ["row"] }, { type: i3__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5__namespace.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+    FsBodyComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsBodyComponent, selector: "[fs-list-body]", inputs: { rows: "rows", columns: "columns", hasFooter: "hasFooter", rowActionsRaw: "rowActionsRaw", groupActionsRaw: "groupActionsRaw", rowEvents: "rowEvents", rowClass: "rowClass", hasRowActions: "hasRowActions", selection: "selection", restoreMode: "restoreMode", rowRemoved: "rowRemoved" }, queries: [{ propertyName: "headerTemplate", first: true, predicate: FsRowComponent, descendants: true, read: i0.TemplateRef, static: true }], viewQueries: [{ propertyName: "rowsContainer", first: true, predicate: ["rowsContainer"], descendants: true, read: i0.ViewContainerRef, static: true }], ngImport: i0__namespace, template: "<ng-container *ngFor=\"let row of rows; let i = index;\">\n  <tr fs-list-row\n      fsListDraggableRow\n      [row]=\"row\"\n      [rowIndex]=\"i\"\n      [columns]=\"columns\"\n      [rowActionsRaw]=\"rowActionsRaw\"\n      [groupActionsRaw]=\"groupActionsRaw\"\n      [hasRowActions]=\"hasRowActions\"\n      [rowEvents]=\"rowEvents\"\n      [rowClass]=\"rowClass\"\n      [selection]=\"selection\"\n      [restoreMode]=\"restoreMode\"\n      [ngClass]=\"{ 'drag-row': reorderController.enabled }\"\n      [rowRemoved]=\"rowRemoved\"\n      #activeRow>\n  </tr>\n</ng-container>\n", components: [{ type: FsRowComponent, selector: "[fs-list-row]", inputs: ["row", "rowActionsRaw", "groupActionsRaw", "hasRowActions", "rowEvents", "rowClass", "restoreMode", "rowIndex", "columns", "selection", "rowRemoved"] }], directives: [{ type: i3__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: FsListDraggableRowDirective, selector: "[fsListDraggableRow]", inputs: ["row"] }, { type: i3__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsBodyComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -5908,7 +6106,7 @@
         return FsFooterRowComponent;
     }(FsRowComponent));
     FsFooterRowComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsFooterRowComponent, deps: [{ token: i0__namespace.ElementRef }, { token: ReorderController }, { token: i0__namespace.ChangeDetectorRef }, { token: i0__namespace.KeyValueDiffers }, { token: i0__namespace.Renderer2 }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    FsFooterRowComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsFooterRowComponent, selector: "[fs-list-footer-row]", inputs: { hasRowActions: "hasRowActions" }, usesInheritance: true, ngImport: i0__namespace, template: "<td *ngIf=\"reorderController.leftReorderActivated$ | async\" class=\"fs-list-col drag-col\"></td>\n\n<td *ngIf=\"selection\" class=\"fs-list-col fs-list-col-selection\"></td>\n<ng-container *ngFor=\"let column of columns; trackBy: trackByFn\">\n  <td fs-list-footer-cell\n      *ngIf=\"!column.footerColspanned\"\n      [column]=\"column\"\n      [row]=\"row\"\n      [rowIndex]=\"rowIndex\"\n      [ngClass]=\"column.footerConfigs.classesArray\"\n      [attr.colspan]=\"column.footerConfigs.colspan\"\n      [attr.width]=\"column.width\">\n  </td>\n</ng-container>\n\n<!-- Drag -->\n<td *ngIf=\"reorderController.rightReorderActivated$ | async\" class=\"fs-list-col row-actions\"></td>\n\n<!-- Row Actions -->\n<td *ngIf=\"hasRowActions && !(reorderController.enabled && reorderController.strategy === ReorderStrategy.Manual)\" class=\"fs-list-col drag-col\"></td>\n", components: [{ type: FsFooterCellComponent, selector: "[fs-list-footer-cell]" }], directives: [{ type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5__namespace.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }], pipes: { "async": i3__namespace$1.AsyncPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+    FsFooterRowComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsFooterRowComponent, selector: "[fs-list-footer-row]", inputs: { hasRowActions: "hasRowActions" }, usesInheritance: true, ngImport: i0__namespace, template: "<td *ngIf=\"reorderController.leftReorderActivated$ | async\" class=\"fs-list-col drag-col\"></td>\n\n<td *ngIf=\"selection\" class=\"fs-list-col fs-list-col-selection\"></td>\n<ng-container *ngFor=\"let column of columns; trackBy: trackByFn\">\n  <td fs-list-footer-cell\n      *ngIf=\"!column.footerColspanned\"\n      [column]=\"column\"\n      [row]=\"row\"\n      [rowIndex]=\"rowIndex\"\n      [ngClass]=\"column.footerConfigs.classesArray\"\n      [attr.colspan]=\"column.footerConfigs.colspan\"\n      [attr.width]=\"column.width\">\n  </td>\n</ng-container>\n\n<!-- Drag -->\n<td *ngIf=\"reorderController.rightReorderActivated$ | async\" class=\"fs-list-col row-actions\"></td>\n\n<!-- Row Actions -->\n<td *ngIf=\"hasRowActions && !(reorderController.enabled && reorderController.strategy === ReorderStrategy.Manual)\" class=\"fs-list-col drag-col\"></td>\n", components: [{ type: FsFooterCellComponent, selector: "[fs-list-footer-cell]" }], directives: [{ type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "async": i3__namespace$1.AsyncPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsFooterRowComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -6007,7 +6205,7 @@
         return FsPaginationComponent;
     }());
     FsPaginationComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsPaginationComponent, deps: [{ token: i0__namespace.ChangeDetectorRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    FsPaginationComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsPaginationComponent, selector: "fs-list-pagination", inputs: { pagination: "pagination", rows: "rows" }, ngImport: i0__namespace, template: "<ng-container *ngIf=\"!pagination.loadMoreEnabled; else loadMoreButton\">\n  <div class=\"paging\" *ngIf=\"pagination?.pages\">\n    <div class=\"records\"></div>\n    <div fxFlex>\n      <div class=\"pages\">\n        <a matRipple matRippleRadius=\"15\" [matRippleCentered]=\"true\" class=\"first\" [class.disabled]=\"!pagination.hasPrevPage\" (click)=\"pagination.goFirst()\">\n          <i class=\"material-icons\">first_page</i>\n        </a>\n\n        <a matRipple matRippleRadius=\"15\" [matRippleCentered]=\"true\" class=\"previous\" [class.disabled]=\"!pagination.hasPrevPage\" (click)=\"pagination.goPrev()\">\n          <i class=\"material-icons\">keyboard_arrow_left</i>\n        </a>\n\n        <div class=\"number\">\n          {{ pagination.page | fsFormatNumber }} of {{ pagination.pages | fsFormatNumber }}\n        </div>\n\n        <a matRipple matRippleRadius=\"15\" [matRippleCentered]=\"true\" class=\"next\" [class.disabled]=\"!pagination.hasNextPage\" (click)=\"pagination.goNext()\">\n          <i class=\"material-icons\">keyboard_arrow_right</i>\n        </a>\n\n        <a matRipple matRippleRadius=\"15\" [matRippleCentered]=\"true\" class=\"last\" [class.disabled]=\"!pagination.hasNextPage\" (click)=\"pagination.goLast()\">\n          <i class=\"material-icons\">last_page</i>\n        </a>\n\n      </div>\n    </div>\n  </div>\n</ng-container>\n\n<ng-template #loadMoreButton>\n  <div class=\"fs-list-load-more\" *ngIf=\"pagination.hasNextPage\">\n    <button mat-button (click)=\"pagination.goNext()\">{{ pagination.loadMoreText }}</button>\n  </div>\n</ng-template>\n", styles: [":host{display:block}.paging{display:flex}.paging .pages{display:flex;justify-content:center;align-items:center;-webkit-user-select:none;user-select:none}.paging .pages a{text-align:center;color:#000000de;text-decoration:none;font-size:15px;cursor:pointer;display:flex}.paging .pages a:not(.page){padding:10px}.paging .pages a.disabled{pointer-events:none;cursor:default;color:#d8d8d8}.paging .pages .number{font-size:90%}.fs-list-load-more button{width:100%;margin-top:10px}\n"], components: [{ type: i2__namespace$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace$2.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { type: i4__namespace$2.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleRadius", "matRippleDisabled", "matRippleTrigger", "matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleAnimation"], exportAs: ["matRipple"] }], pipes: { "fsFormatNumber": i5__namespace$1.FsFormatNumberPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+    FsPaginationComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsPaginationComponent, selector: "fs-list-pagination", inputs: { pagination: "pagination", rows: "rows" }, ngImport: i0__namespace, template: "<ng-container *ngIf=\"!pagination.loadMoreEnabled; else loadMoreButton\">\n  <ng-container *ngIf=\"pagination?.pages\">\n    <a matRipple [matRippleRadius]=\"15\" [matRippleCentered]=\"true\" class=\"first\" [class.disabled]=\"!pagination.hasPrevPage\" (click)=\"pagination.goFirst()\">\n      <i class=\"material-icons\">first_page</i>\n    </a>\n\n    <a matRipple [matRippleRadius]=\"15\" [matRippleCentered]=\"true\" class=\"previous\" [class.disabled]=\"!pagination.hasPrevPage\" (click)=\"pagination.goPrev()\">\n      <i class=\"material-icons\">keyboard_arrow_left</i>\n    </a>\n\n    <div class=\"number\">\n      {{ pagination.page | fsFormatNumber }} of {{ pagination.pages | fsFormatNumber }}\n    </div>\n\n    <a matRipple [matRippleRadius]=\"15\" [matRippleCentered]=\"true\" class=\"next\" [class.disabled]=\"!pagination.hasNextPage\" (click)=\"pagination.goNext()\">\n      <i class=\"material-icons\">keyboard_arrow_right</i>\n    </a>\n\n    <a matRipple [matRippleRadius]=\"15\" [matRippleCentered]=\"true\" class=\"last\" [class.disabled]=\"!pagination.hasNextPage\" (click)=\"pagination.goLast()\">\n      <i class=\"material-icons\">last_page</i>\n    </a>\n  </ng-container>\n</ng-container>\n\n<ng-template #loadMoreButton>\n  <div class=\"fs-list-load-more\" *ngIf=\"pagination.hasNextPage\">\n    <button mat-button (click)=\"pagination.goNext()\">{{ pagination.loadMoreText }}</button>\n  </div>\n</ng-template>\n", styles: [":host{display:flex;justify-content:center;align-items:center;-webkit-user-select:none;user-select:none;width:100%}a{text-align:center;color:#000000de;text-decoration:none;font-size:15px;cursor:pointer;display:flex}a:not(.page){padding:10px}a.disabled{pointer-events:none;cursor:default;color:#d8d8d8}.number{font-size:90%}.fs-list-load-more button{width:100%;margin-top:10px}\n"], components: [{ type: i2__namespace$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace$2.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleRadius", "matRippleDisabled", "matRippleTrigger", "matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleAnimation"], exportAs: ["matRipple"] }], pipes: { "fsFormatNumber": i4__namespace$1.FsFormatNumberPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsPaginationComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -6047,11 +6245,13 @@
                 }] } });
 
     var FsListComponent = /** @class */ (function () {
-        function FsListComponent(reorderController, _el, _defaultOptions, fsScroll, selectionDialog, dialog, cdRef, _groupExpandNotifier, _router, _route, _persistance, _location, _dialogRef, _drawerRef) {
+        function FsListComponent(reorderController, _defaultOptions, fsScroll, _dialogRef, _drawerRef, _el, selectionDialog, dialog, cdRef, _groupExpandNotifier, _router, _route, _persistance, _location) {
             this.reorderController = reorderController;
-            this._el = _el;
             this._defaultOptions = _defaultOptions;
             this.fsScroll = fsScroll;
+            this._dialogRef = _dialogRef;
+            this._drawerRef = _drawerRef;
+            this._el = _el;
             this.selectionDialog = selectionDialog;
             this.dialog = dialog;
             this.cdRef = cdRef;
@@ -6060,11 +6260,10 @@
             this._route = _route;
             this._persistance = _persistance;
             this._location = _location;
-            this._dialogRef = _dialogRef;
-            this._drawerRef = _drawerRef;
             this.classFsList = true;
             this.loaderLines = 3;
             this.filtersReady = new i0.EventEmitter();
+            this.keywordVisible = true;
             // Event will fired if action remove: true will clicked
             this.rowRemoved = new i0.EventEmitter();
             this.firstLoad = true;
@@ -6132,6 +6331,23 @@
             enumerable: false,
             configurable: true
         });
+        Object.defineProperty(FsListComponent.prototype, "hasFilterKeyword", {
+            get: function () {
+                return this.list.filterInput && this.keywordVisible;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(FsListComponent.prototype, "hasStatus", {
+            get: function () {
+                return this.list.status &&
+                    (this.list.sorting.isDefined || this.list.paging.enabled) &&
+                    (!this.reorderController.enabled || (this.reorderController.enabled && this.reorderController.status)) &&
+                    ((this.list.scrollable && this.list.scrollable.status) || !this.list.scrollable);
+            },
+            enumerable: false,
+            configurable: true
+        });
         Object.defineProperty(FsListComponent.prototype, "paginatorVisible", {
             get: function () {
                 return this.list.paging.enabled
@@ -6195,6 +6411,12 @@
         FsListComponent.prototype.resetSelectionActions = function () {
             this.list.selection.resetActions();
         };
+        FsListComponent.prototype.enableSelection = function () {
+            this.list.selection.enableSelection();
+        };
+        FsListComponent.prototype.disableSelection = function () {
+            this.list.selection.disableSelection();
+        };
         FsListComponent.prototype.removeData = function (data) {
             return this.list.dataController.removeData(data);
         };
@@ -6236,6 +6458,8 @@
         FsListComponent.prototype._emitFiltersReadyEvent = function () {
             if (!!this.filterRef && this._filterParamsReady) {
                 this.filtersReady.emit();
+                this.keywordVisible = this.filterRef.hasKeyword;
+                this.cdRef.markForCheck();
             }
         };
         /**
@@ -6257,7 +6481,7 @@
             this.list = new List(this._el, listConfig, this.fsScroll, this.selectionDialog, this._router, this._route, this._persistance, this._inDialog);
             this._waitFirstLoad();
             this._listenFiltersQueryChange();
-            this.reorderController.initWithConfig(config.reorder, this.list.dataController, this.list.actions);
+            this.reorderController.initWithConfig(config.reorder, this.list.dataController, this.list.actions, this.list.selection);
             if (this.listColumnDirectives) {
                 this.list.tranformTemplatesToColumns(this.listColumnDirectives);
             }
@@ -6350,25 +6574,23 @@
             }
         };
         FsListComponent.prototype._restorePersistance = function (persistConfig) {
-            var namespace = i5$1.getNormalizedPath(this._location);
+            var namespace = i4$1.getNormalizedPath(this._location);
             this._persistance.setConfig(persistConfig, namespace, this._inDialog);
         };
         return FsListComponent;
     }());
-    FsListComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsListComponent, deps: [{ token: ReorderController }, { token: i0__namespace.ElementRef }, { token: FS_LIST_DEFAULT_CONFIG, optional: true }, { token: i2__namespace$4.FsScrollService, optional: true }, { token: i3__namespace$3.SelectionDialog }, { token: i4__namespace.MatDialog }, { token: i0__namespace.ChangeDetectorRef }, { token: GroupExpandNotifierService }, { token: i6__namespace$1.Router }, { token: i6__namespace$1.ActivatedRoute }, { token: PersistanceController }, { token: i3__namespace$1.Location }, { token: i4__namespace.MatDialogRef, optional: true }, { token: i9__namespace.DrawerRef, optional: true }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    FsListComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsListComponent, deps: [{ token: ReorderController }, { token: FS_LIST_DEFAULT_CONFIG, optional: true }, { token: i2__namespace$4.FsScrollService, optional: true }, { token: i1__namespace.MatDialogRef, optional: true }, { token: i4__namespace$2.DrawerRef, optional: true }, { token: i0__namespace.ElementRef }, { token: i5__namespace.SelectionDialog }, { token: i1__namespace.MatDialog }, { token: i0__namespace.ChangeDetectorRef }, { token: GroupExpandNotifierService }, { token: i7__namespace.Router }, { token: i7__namespace.ActivatedRoute }, { token: PersistanceController }, { token: i3__namespace$1.Location }], target: i0__namespace.ɵɵFactoryTarget.Component });
     FsListComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsListComponent, selector: "fs-list", inputs: { config: "config", loaderLines: "loaderLines" }, outputs: { filtersReady: "filtersReady" }, host: { properties: { "class.fs-list": "this.classFsList" } }, providers: [
             GroupExpandNotifierService,
             PersistanceController,
             ReorderController,
-        ], queries: [{ propertyName: "_emptyStateTemplate", first: true, predicate: FsListEmptyStateDirective, descendants: true, read: i0.TemplateRef }, { propertyName: "columnTemplates", predicate: FsListColumnDirective }], viewQueries: [{ propertyName: "filterReference", first: true, predicate: i2.FilterComponent, descendants: true }], ngImport: i0__namespace, template: "<div class=\"fs-list-container\"\n     [ngClass]=\"{ 'has-filter-input': list.filterInput,\n                  'has-filters': list.filterConfig?.items.length,\n                  'has-heading': list.heading,\n                  'has-status': list.status,\n                  'has-chips': list.chips,\n                  'has-actions': list.actions.hasActions,\n                  'first-load': firstLoad,\n                  'loading': list.loading$ | async }\">\n  <ng-template [ngTemplateOutlet]=\"listContainerContent\"></ng-template>\n</div>\n\n<ng-template #listContainerContent>\n  <ng-container *ngIf=\"list.dataController.visibleRows$ | async as listData\">\n    <!-- Header -->\n    <div class=\"fs-list-header-container\">\n\n      <div class=\"fs-list-header\"\n        [ngClass]=\"{ 'no-wrap': reorderController.manualReorderActivated$ || !list.filterConfig?.items.length }\">\n        <div class=\"heading-container\">\n          <h2 class=\"heading\" *ngIf=\"list.heading\">{{list.heading}}</h2>\n          <span class=\"subheading\" *ngIf=\"list.subheading\">{{list.subheading}}</span>\n        </div>\n        <fs-filter\n          class=\"fs-list-filter\"\n          *ngIf=\"list.filterConfig\"\n          [filter]=\"list.filterConfig\"\n          [showSortBy]=\"!list.status\"\n          [showFilterInput]=\"list.filterInput\"\n          (ready)=\"filterReady()\">\n\n          <ng-template fsFilterStatusBar>\n            <ng-container *ngIf=\"\n              list.paging &&\n              !(reorderController.manualReorderActivated$ | async) &&\n              (!reorderController.enabled || reorderController.status) &&\n              ((list.scrollable && list.scrollable.status) || !list.scrollable)\">\n              <!-- Status -->\n              <fs-list-status\n                class=\"fs-list-status\"\n                [ngClass]=\"{ 'hidden-mobile': !list.status }\"\n                [rows]=\"listData\"\n                [sorting]=\"list.sorting\"\n                [paging]=\"list.paging\"\n                [firstLoad]=\"firstLoad\"\n                [scrollable]=\"list.scrollable\">\n              </fs-list-status>\n            </ng-container>\n          </ng-template>\n        </fs-filter>\n      </div>\n    </div>\n\n    <ng-content select=\"[fs-list-content]\"></ng-content>\n\n    <!-- Table implementation -->\n    <div class=\"fs-list-table-container\">\n      <ng-container *ngIf=\"!firstLoad && listData.length > 0 && !list.emptyStateEnabled\">\n        <table class=\"fs-list-table\" role=\"grid\" [fsListContentInit]=\"list.afterContentInit\">\n          <thead fs-list-head\n                 class=\"fs-list-head\"\n                 role=\"rowgroup\"\n                 *ngIf=\"list.columns.hasHeader\"\n                 [ngClass]=\"list.columns.theadClass\"\n                 [columns]=\"list.columns.visibleColumns$ | async\"\n                 [sorting]=\"list.sorting\"\n                 [selection]=\"list.selection\"\n                 [hasRowActions]=\"list.hasRowActions\"\n          >\n          </thead>\n\n          <tbody fs-list-body\n                 fsListDraggableList\n                 class=\"fs-list-body\"\n                 role=\"rowgroup\"\n                 [class.disabled]=\"!!(reorderController.reorderDisabled$ | async)\"\n                 [rows]=\"listData\"\n                 [rowActionsRaw]=\"list.rowActionsRaw\"\n                 [groupActionsRaw]=\"list.groupActionsRaw\"\n                 [hasRowActions]=\"list.hasRowActions\"\n                 [rowEvents]=\"list.rowEvents\"\n                 [rowClass]=\"list.rowClass\"\n                 [columns]=\"list.columns.visibleColumns$ | async\"\n                 [restoreMode]=\"list.restoreMode\"\n                 [selection]=\"list.selection\"\n                 [rowRemoved]=\"rowRemoved\"\n          >\n          </tbody>\n\n          <tfoot fs-list-footer\n                 class=\"fs-list-footer\"\n                 *ngIf=\"list.columns.hasFooter\"\n                 [columns]=\"list.columns.visibleColumns$ | async\"\n                 [selection]=\"list.selection\"\n                 [hasRowActions]=\"list.hasRowActions\">\n          </tfoot>\n        </table>\n      </ng-container>\n      <fs-list-loader\n        *ngIf=\"firstLoad\"\n        [columns]=\"list.columns.columns\"\n        [loaderLines]=\"loaderLines\">\n      </fs-list-loader>\n    </div>\n\n    <fs-list-pagination\n      *ngIf=\"paginatorVisible\"\n      class=\"fs-list-pagination\"\n      [rows]=\"listData\"\n      [pagination]=\"list.paging\">\n    </fs-list-pagination>\n\n\n    <ng-container *ngIf=\"!firstLoad\">\n      <div\n          *ngIf=\"listData.length === 0\"\n          class=\"fs-list-no-results-container\">\n        <div\n            *ngIf=\"list.noResults?.message && !list.emptyStateEnabled\"\n            class=\"fs-list-no-results\">\n          {{ list.noResults?.message }}\n        </div>\n        <ng-container *ngIf=\"list.emptyStateEnabled\">\n          <ng-template [ngTemplateOutlet]=\"list.emptyStateTemplate\"></ng-template>\n        </ng-container>\n      </div>\n    </ng-container>\n  </ng-container>\n</ng-template>\n\n", styles: ["@media print{:host ::ng-deep .fs-list-row-group{page-break-after:avoid}:host ::ng-deep .fs-list-row-group-child{page-break-before:avoid}:host ::ng-deep .fs-list-row-group-footer{page-break-before:avoid}}::ng-deep .fs-list{display:block;width:100%}::ng-deep .fs-list .fs-list-swap-restricted{opacity:.5}::ng-deep .fs-list .fs-list-no-drop{cursor:no-drop}::ng-deep .fs-list .fs-filter{margin-bottom:0;position:initial!important;display:block}::ng-deep .fs-list .fs-list-container.loading .fs-list-status,::ng-deep .fs-list .fs-list-container.loading .fs-list-body,::ng-deep .fs-list .fs-list-container.loading fs-list-pagination,::ng-deep .fs-list .fs-list-container.loading .filter-chips,::ng-deep .fs-list .fs-list-container.loading .fs-list-no-results-container,::ng-deep .fs-list .fs-list-container.first-load .fs-list-status,::ng-deep .fs-list .fs-list-container.first-load .fs-list-body,::ng-deep .fs-list .fs-list-container.first-load fs-list-pagination,::ng-deep .fs-list .fs-list-container.first-load .filter-chips,::ng-deep .fs-list .fs-list-container.first-load .fs-list-no-results-container{opacity:.4;pointer-events:none}::ng-deep .fs-list .fs-list-container.first-load ::ng-deep fs-filter-chips .fs-chip{color:transparent}::ng-deep .fs-list .fs-list-container.first-load ::ng-deep fs-filter-chips .fs-chip .remove{visibility:hidden}::ng-deep .fs-list .fs-list-container.has-actions .fs-list-actions{margin-left:5px}::ng-deep .fs-list .fs-list-table-container{width:100%;overflow:auto}::ng-deep .fs-list table,::ng-deep .fs-list .fs-list-table{border-spacing:0;display:table;width:100%;border-collapse:collapse}::ng-deep .fs-list .fs-list-no-results-container .fs-list-no-results{text-align:center;color:#999;padding:10px 0}::ng-deep .fs-list .hidden{display:none}::ng-deep .fs-list thead,::ng-deep .fs-list .fs-list-head{display:table-header-group}::ng-deep .fs-list thead th,::ng-deep .fs-list thead .fs-list-col,::ng-deep .fs-list .fs-list-head th,::ng-deep .fs-list .fs-list-head .fs-list-col{color:#999;padding:8px;font-weight:normal;font-size:13px;color:#8f8f8f}::ng-deep .fs-list thead th.fs-list-col-selection,::ng-deep .fs-list thead .fs-list-col.fs-list-col-selection,::ng-deep .fs-list .fs-list-head th.fs-list-col-selection,::ng-deep .fs-list .fs-list-head .fs-list-col.fs-list-col-selection{width:1%;text-align:left}::ng-deep .fs-list thead th.sorting,::ng-deep .fs-list thead .fs-list-col.sorting,::ng-deep .fs-list .fs-list-head th.sorting,::ng-deep .fs-list .fs-list-head .fs-list-col.sorting{cursor:pointer}::ng-deep .fs-list thead th.sorting:hover,::ng-deep .fs-list thead .fs-list-col.sorting:hover,::ng-deep .fs-list .fs-list-head th.sorting:hover,::ng-deep .fs-list .fs-list-head .fs-list-col.sorting:hover{background-color:#f6f6f6}::ng-deep .fs-list thead th .wrap,::ng-deep .fs-list thead .fs-list-col .wrap,::ng-deep .fs-list .fs-list-head th .wrap,::ng-deep .fs-list .fs-list-head .fs-list-col .wrap{display:inline-flex;vertical-align:middle;white-space:nowrap}::ng-deep .fs-list thead th .wrap mat-icon,::ng-deep .fs-list thead .fs-list-col .wrap mat-icon,::ng-deep .fs-list .fs-list-head th .wrap mat-icon,::ng-deep .fs-list .fs-list-head .fs-list-col .wrap mat-icon{font-size:14px;display:block;height:14px;width:14px}::ng-deep .fs-list thead th .wrap .direction,::ng-deep .fs-list thead .fs-list-col .wrap .direction,::ng-deep .fs-list .fs-list-head th .wrap .direction,::ng-deep .fs-list .fs-list-head .fs-list-col .wrap .direction{margin-left:5px}::ng-deep .fs-list thead th.sorting,::ng-deep .fs-list thead .fs-list-col.sorting,::ng-deep .fs-list .fs-list-head th.sorting,::ng-deep .fs-list .fs-list-head .fs-list-col.sorting{background-image:none}::ng-deep .fs-list tbody,::ng-deep .fs-list .fs-list-body{display:table-row-group;position:relative}::ng-deep .fs-list tbody.disabled,::ng-deep .fs-list .fs-list-body.disabled{opacity:.4;pointer-events:none}::ng-deep .fs-list tbody td,::ng-deep .fs-list tbody .fs-list-col,::ng-deep .fs-list .fs-list-body td,::ng-deep .fs-list .fs-list-body .fs-list-col{box-sizing:border-box}::ng-deep .fs-list tbody tr:hover td,::ng-deep .fs-list tbody .fs-list-row:hover .fs-list-col,::ng-deep .fs-list .fs-list-body tr:hover td,::ng-deep .fs-list .fs-list-body .fs-list-row:hover .fs-list-col{background-color:#f6f6f6}::ng-deep .fs-list tbody tr:hover td,::ng-deep .fs-list tbody tr:hover .fs-list-col,::ng-deep .fs-list tbody .fs-list-row:hover td,::ng-deep .fs-list tbody .fs-list-row:hover .fs-list-col,::ng-deep .fs-list .fs-list-body tr:hover td,::ng-deep .fs-list .fs-list-body tr:hover .fs-list-col,::ng-deep .fs-list .fs-list-body .fs-list-row:hover td,::ng-deep .fs-list .fs-list-body .fs-list-row:hover .fs-list-col{background-color:#f6f6f6}::ng-deep .fs-list tbody tr:first-child td,::ng-deep .fs-list .fs-list-body tr:first-child td{border-top:2px solid #ddd}::ng-deep .fs-list tbody tr:last-child td,::ng-deep .fs-list .fs-list-body tr:last-child td{border-bottom:2px solid #ddd}::ng-deep .fs-list tbody td,::ng-deep .fs-list .fs-list-body td{border-top:1px solid #ddd}::ng-deep .fs-list thead tr,::ng-deep .fs-list thead .fs-list-row,::ng-deep .fs-list tbody tr,::ng-deep .fs-list tbody .fs-list-row,::ng-deep .fs-list tfoot tr,::ng-deep .fs-list tfoot .fs-list-row,::ng-deep .fs-list .fs-list-head tr,::ng-deep .fs-list .fs-list-head .fs-list-row,::ng-deep .fs-list .fs-list-body tr,::ng-deep .fs-list .fs-list-body .fs-list-row,::ng-deep .fs-list .fs-list-footer tr,::ng-deep .fs-list .fs-list-footer .fs-list-row{display:table-row}::ng-deep .fs-list thead tr td,::ng-deep .fs-list thead tr th,::ng-deep .fs-list thead tr .fs-list-col,::ng-deep .fs-list thead .fs-list-row td,::ng-deep .fs-list thead .fs-list-row th,::ng-deep .fs-list thead .fs-list-row .fs-list-col,::ng-deep .fs-list tbody tr td,::ng-deep .fs-list tbody tr th,::ng-deep .fs-list tbody tr .fs-list-col,::ng-deep .fs-list tbody .fs-list-row td,::ng-deep .fs-list tbody .fs-list-row th,::ng-deep .fs-list tbody .fs-list-row .fs-list-col,::ng-deep .fs-list tfoot tr td,::ng-deep .fs-list tfoot tr th,::ng-deep .fs-list tfoot tr .fs-list-col,::ng-deep .fs-list tfoot .fs-list-row td,::ng-deep .fs-list tfoot .fs-list-row th,::ng-deep .fs-list tfoot .fs-list-row .fs-list-col,::ng-deep .fs-list .fs-list-head tr td,::ng-deep .fs-list .fs-list-head tr th,::ng-deep .fs-list .fs-list-head tr .fs-list-col,::ng-deep .fs-list .fs-list-head .fs-list-row td,::ng-deep .fs-list .fs-list-head .fs-list-row th,::ng-deep .fs-list .fs-list-head .fs-list-row .fs-list-col,::ng-deep .fs-list .fs-list-body tr td,::ng-deep .fs-list .fs-list-body tr th,::ng-deep .fs-list .fs-list-body tr .fs-list-col,::ng-deep .fs-list .fs-list-body .fs-list-row td,::ng-deep .fs-list .fs-list-body .fs-list-row th,::ng-deep .fs-list .fs-list-body .fs-list-row .fs-list-col,::ng-deep .fs-list .fs-list-footer tr td,::ng-deep .fs-list .fs-list-footer tr th,::ng-deep .fs-list .fs-list-footer tr .fs-list-col,::ng-deep .fs-list .fs-list-footer .fs-list-row td,::ng-deep .fs-list .fs-list-footer .fs-list-row th,::ng-deep .fs-list .fs-list-footer .fs-list-row .fs-list-col{display:table-cell;padding:8px;vertical-align:middle;outline:none}::ng-deep .fs-list thead tr td.drag-col,::ng-deep .fs-list thead tr th.drag-col,::ng-deep .fs-list thead tr .fs-list-col.drag-col,::ng-deep .fs-list thead .fs-list-row td.drag-col,::ng-deep .fs-list thead .fs-list-row th.drag-col,::ng-deep .fs-list thead .fs-list-row .fs-list-col.drag-col,::ng-deep .fs-list tbody tr td.drag-col,::ng-deep .fs-list tbody tr th.drag-col,::ng-deep .fs-list tbody tr .fs-list-col.drag-col,::ng-deep .fs-list tbody .fs-list-row td.drag-col,::ng-deep .fs-list tbody .fs-list-row th.drag-col,::ng-deep .fs-list tbody .fs-list-row .fs-list-col.drag-col,::ng-deep .fs-list tfoot tr td.drag-col,::ng-deep .fs-list tfoot tr th.drag-col,::ng-deep .fs-list tfoot tr .fs-list-col.drag-col,::ng-deep .fs-list tfoot .fs-list-row td.drag-col,::ng-deep .fs-list tfoot .fs-list-row th.drag-col,::ng-deep .fs-list tfoot .fs-list-row .fs-list-col.drag-col,::ng-deep .fs-list .fs-list-head tr td.drag-col,::ng-deep .fs-list .fs-list-head tr th.drag-col,::ng-deep .fs-list .fs-list-head tr .fs-list-col.drag-col,::ng-deep .fs-list .fs-list-head .fs-list-row td.drag-col,::ng-deep .fs-list .fs-list-head .fs-list-row th.drag-col,::ng-deep .fs-list .fs-list-head .fs-list-row .fs-list-col.drag-col,::ng-deep .fs-list .fs-list-body tr td.drag-col,::ng-deep .fs-list .fs-list-body tr th.drag-col,::ng-deep .fs-list .fs-list-body tr .fs-list-col.drag-col,::ng-deep .fs-list .fs-list-body .fs-list-row td.drag-col,::ng-deep .fs-list .fs-list-body .fs-list-row th.drag-col,::ng-deep .fs-list .fs-list-body .fs-list-row .fs-list-col.drag-col,::ng-deep .fs-list .fs-list-footer tr td.drag-col,::ng-deep .fs-list .fs-list-footer tr th.drag-col,::ng-deep .fs-list .fs-list-footer tr .fs-list-col.drag-col,::ng-deep .fs-list .fs-list-footer .fs-list-row td.drag-col,::ng-deep .fs-list .fs-list-footer .fs-list-row th.drag-col,::ng-deep .fs-list .fs-list-footer .fs-list-row .fs-list-col.drag-col{width:24px;text-align:center;cursor:grab}::ng-deep .fs-list thead tr td.drag-col mat-icon,::ng-deep .fs-list thead tr th.drag-col mat-icon,::ng-deep .fs-list thead tr .fs-list-col.drag-col mat-icon,::ng-deep .fs-list thead .fs-list-row td.drag-col mat-icon,::ng-deep .fs-list thead .fs-list-row th.drag-col mat-icon,::ng-deep .fs-list thead .fs-list-row .fs-list-col.drag-col mat-icon,::ng-deep .fs-list tbody tr td.drag-col mat-icon,::ng-deep .fs-list tbody tr th.drag-col mat-icon,::ng-deep .fs-list tbody tr .fs-list-col.drag-col mat-icon,::ng-deep .fs-list tbody .fs-list-row td.drag-col mat-icon,::ng-deep .fs-list tbody .fs-list-row th.drag-col mat-icon,::ng-deep .fs-list tbody .fs-list-row .fs-list-col.drag-col mat-icon,::ng-deep .fs-list tfoot tr td.drag-col mat-icon,::ng-deep .fs-list tfoot tr th.drag-col mat-icon,::ng-deep .fs-list tfoot tr .fs-list-col.drag-col mat-icon,::ng-deep .fs-list tfoot .fs-list-row td.drag-col mat-icon,::ng-deep .fs-list tfoot .fs-list-row th.drag-col mat-icon,::ng-deep .fs-list tfoot .fs-list-row .fs-list-col.drag-col mat-icon,::ng-deep .fs-list .fs-list-head tr td.drag-col mat-icon,::ng-deep .fs-list .fs-list-head tr th.drag-col mat-icon,::ng-deep .fs-list .fs-list-head tr .fs-list-col.drag-col mat-icon,::ng-deep .fs-list .fs-list-head .fs-list-row td.drag-col mat-icon,::ng-deep .fs-list .fs-list-head .fs-list-row th.drag-col mat-icon,::ng-deep .fs-list .fs-list-head .fs-list-row .fs-list-col.drag-col mat-icon,::ng-deep .fs-list .fs-list-body tr td.drag-col mat-icon,::ng-deep .fs-list .fs-list-body tr th.drag-col mat-icon,::ng-deep .fs-list .fs-list-body tr .fs-list-col.drag-col mat-icon,::ng-deep .fs-list .fs-list-body .fs-list-row td.drag-col mat-icon,::ng-deep .fs-list .fs-list-body .fs-list-row th.drag-col mat-icon,::ng-deep .fs-list .fs-list-body .fs-list-row .fs-list-col.drag-col mat-icon,::ng-deep .fs-list .fs-list-footer tr td.drag-col mat-icon,::ng-deep .fs-list .fs-list-footer tr th.drag-col mat-icon,::ng-deep .fs-list .fs-list-footer tr .fs-list-col.drag-col mat-icon,::ng-deep .fs-list .fs-list-footer .fs-list-row td.drag-col mat-icon,::ng-deep .fs-list .fs-list-footer .fs-list-row th.drag-col mat-icon,::ng-deep .fs-list .fs-list-footer .fs-list-row .fs-list-col.drag-col mat-icon{display:flex}::ng-deep .fs-list thead tr td.row-actions,::ng-deep .fs-list thead tr th.row-actions,::ng-deep .fs-list thead tr .fs-list-col.row-actions,::ng-deep .fs-list thead .fs-list-row td.row-actions,::ng-deep .fs-list thead .fs-list-row th.row-actions,::ng-deep .fs-list thead .fs-list-row .fs-list-col.row-actions,::ng-deep .fs-list tbody tr td.row-actions,::ng-deep .fs-list tbody tr th.row-actions,::ng-deep .fs-list tbody tr .fs-list-col.row-actions,::ng-deep .fs-list tbody .fs-list-row td.row-actions,::ng-deep .fs-list tbody .fs-list-row th.row-actions,::ng-deep .fs-list tbody .fs-list-row .fs-list-col.row-actions,::ng-deep .fs-list tfoot tr td.row-actions,::ng-deep .fs-list tfoot tr th.row-actions,::ng-deep .fs-list tfoot tr .fs-list-col.row-actions,::ng-deep .fs-list tfoot .fs-list-row td.row-actions,::ng-deep .fs-list tfoot .fs-list-row th.row-actions,::ng-deep .fs-list tfoot .fs-list-row .fs-list-col.row-actions,::ng-deep .fs-list .fs-list-head tr td.row-actions,::ng-deep .fs-list .fs-list-head tr th.row-actions,::ng-deep .fs-list .fs-list-head tr .fs-list-col.row-actions,::ng-deep .fs-list .fs-list-head .fs-list-row td.row-actions,::ng-deep .fs-list .fs-list-head .fs-list-row th.row-actions,::ng-deep .fs-list .fs-list-head .fs-list-row .fs-list-col.row-actions,::ng-deep .fs-list .fs-list-body tr td.row-actions,::ng-deep .fs-list .fs-list-body tr th.row-actions,::ng-deep .fs-list .fs-list-body tr .fs-list-col.row-actions,::ng-deep .fs-list .fs-list-body .fs-list-row td.row-actions,::ng-deep .fs-list .fs-list-body .fs-list-row th.row-actions,::ng-deep .fs-list .fs-list-body .fs-list-row .fs-list-col.row-actions,::ng-deep .fs-list .fs-list-footer tr td.row-actions,::ng-deep .fs-list .fs-list-footer tr th.row-actions,::ng-deep .fs-list .fs-list-footer tr .fs-list-col.row-actions,::ng-deep .fs-list .fs-list-footer .fs-list-row td.row-actions,::ng-deep .fs-list .fs-list-footer .fs-list-row th.row-actions,::ng-deep .fs-list .fs-list-footer .fs-list-row .fs-list-col.row-actions{width:1%;white-space:nowrap;padding-right:10px;overflow:hidden}::ng-deep .fs-list thead tr td.row-actions .row-inline-action,::ng-deep .fs-list thead tr th.row-actions .row-inline-action,::ng-deep .fs-list thead tr .fs-list-col.row-actions .row-inline-action,::ng-deep .fs-list thead .fs-list-row td.row-actions .row-inline-action,::ng-deep .fs-list thead .fs-list-row th.row-actions .row-inline-action,::ng-deep .fs-list thead .fs-list-row .fs-list-col.row-actions .row-inline-action,::ng-deep .fs-list tbody tr td.row-actions .row-inline-action,::ng-deep .fs-list tbody tr th.row-actions .row-inline-action,::ng-deep .fs-list tbody tr .fs-list-col.row-actions .row-inline-action,::ng-deep .fs-list tbody .fs-list-row td.row-actions .row-inline-action,::ng-deep .fs-list tbody .fs-list-row th.row-actions .row-inline-action,::ng-deep .fs-list tbody .fs-list-row .fs-list-col.row-actions .row-inline-action,::ng-deep .fs-list tfoot tr td.row-actions .row-inline-action,::ng-deep .fs-list tfoot tr th.row-actions .row-inline-action,::ng-deep .fs-list tfoot tr .fs-list-col.row-actions .row-inline-action,::ng-deep .fs-list tfoot .fs-list-row td.row-actions .row-inline-action,::ng-deep .fs-list tfoot .fs-list-row th.row-actions .row-inline-action,::ng-deep .fs-list tfoot .fs-list-row .fs-list-col.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-head tr td.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-head tr th.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-head tr .fs-list-col.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-head .fs-list-row td.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-head .fs-list-row th.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-head .fs-list-row .fs-list-col.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-body tr td.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-body tr th.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-body tr .fs-list-col.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-body .fs-list-row td.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-body .fs-list-row th.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-body .fs-list-row .fs-list-col.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-footer tr td.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-footer tr th.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-footer tr .fs-list-col.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-footer .fs-list-row td.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-footer .fs-list-row th.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-footer .fs-list-row .fs-list-col.row-actions .row-inline-action{margin-left:12px;display:inline-block}::ng-deep .fs-list thead tr td.row-actions .row-inline-action:first-child,::ng-deep .fs-list thead tr th.row-actions .row-inline-action:first-child,::ng-deep .fs-list thead tr .fs-list-col.row-actions .row-inline-action:first-child,::ng-deep .fs-list thead .fs-list-row td.row-actions .row-inline-action:first-child,::ng-deep .fs-list thead .fs-list-row th.row-actions .row-inline-action:first-child,::ng-deep .fs-list thead .fs-list-row .fs-list-col.row-actions .row-inline-action:first-child,::ng-deep .fs-list tbody tr td.row-actions .row-inline-action:first-child,::ng-deep .fs-list tbody tr th.row-actions .row-inline-action:first-child,::ng-deep .fs-list tbody tr .fs-list-col.row-actions .row-inline-action:first-child,::ng-deep .fs-list tbody .fs-list-row td.row-actions .row-inline-action:first-child,::ng-deep .fs-list tbody .fs-list-row th.row-actions .row-inline-action:first-child,::ng-deep .fs-list tbody .fs-list-row .fs-list-col.row-actions .row-inline-action:first-child,::ng-deep .fs-list tfoot tr td.row-actions .row-inline-action:first-child,::ng-deep .fs-list tfoot tr th.row-actions .row-inline-action:first-child,::ng-deep .fs-list tfoot tr .fs-list-col.row-actions .row-inline-action:first-child,::ng-deep .fs-list tfoot .fs-list-row td.row-actions .row-inline-action:first-child,::ng-deep .fs-list tfoot .fs-list-row th.row-actions .row-inline-action:first-child,::ng-deep .fs-list tfoot .fs-list-row .fs-list-col.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-head tr td.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-head tr th.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-head tr .fs-list-col.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-head .fs-list-row td.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-head .fs-list-row th.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-head .fs-list-row .fs-list-col.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-body tr td.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-body tr th.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-body tr .fs-list-col.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-body .fs-list-row td.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-body .fs-list-row th.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-body .fs-list-row .fs-list-col.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-footer tr td.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-footer tr th.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-footer tr .fs-list-col.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-footer .fs-list-row td.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-footer .fs-list-row th.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-footer .fs-list-row .fs-list-col.row-actions .row-inline-action:first-child{margin-left:0}::ng-deep .fs-list thead tr td.row-actions .row-inline-action-icon,::ng-deep .fs-list thead tr td.row-actions .row-inline-action-fab,::ng-deep .fs-list thead tr td.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list thead tr td.row-actions .row-menu-action,::ng-deep .fs-list thead tr th.row-actions .row-inline-action-icon,::ng-deep .fs-list thead tr th.row-actions .row-inline-action-fab,::ng-deep .fs-list thead tr th.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list thead tr th.row-actions .row-menu-action,::ng-deep .fs-list thead tr .fs-list-col.row-actions .row-inline-action-icon,::ng-deep .fs-list thead tr .fs-list-col.row-actions .row-inline-action-fab,::ng-deep .fs-list thead tr .fs-list-col.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list thead tr .fs-list-col.row-actions .row-menu-action,::ng-deep .fs-list thead .fs-list-row td.row-actions .row-inline-action-icon,::ng-deep .fs-list thead .fs-list-row td.row-actions .row-inline-action-fab,::ng-deep .fs-list thead .fs-list-row td.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list thead .fs-list-row td.row-actions .row-menu-action,::ng-deep .fs-list thead .fs-list-row th.row-actions .row-inline-action-icon,::ng-deep .fs-list thead .fs-list-row th.row-actions .row-inline-action-fab,::ng-deep .fs-list thead .fs-list-row th.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list thead .fs-list-row th.row-actions .row-menu-action,::ng-deep .fs-list thead .fs-list-row .fs-list-col.row-actions .row-inline-action-icon,::ng-deep .fs-list thead .fs-list-row .fs-list-col.row-actions .row-inline-action-fab,::ng-deep .fs-list thead .fs-list-row .fs-list-col.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list thead .fs-list-row .fs-list-col.row-actions .row-menu-action,::ng-deep .fs-list tbody tr td.row-actions .row-inline-action-icon,::ng-deep .fs-list tbody tr td.row-actions .row-inline-action-fab,::ng-deep .fs-list tbody tr td.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list tbody tr td.row-actions .row-menu-action,::ng-deep .fs-list tbody tr th.row-actions .row-inline-action-icon,::ng-deep .fs-list tbody tr th.row-actions .row-inline-action-fab,::ng-deep .fs-list tbody tr th.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list tbody tr th.row-actions .row-menu-action,::ng-deep .fs-list tbody tr .fs-list-col.row-actions .row-inline-action-icon,::ng-deep .fs-list tbody tr .fs-list-col.row-actions .row-inline-action-fab,::ng-deep .fs-list tbody tr .fs-list-col.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list tbody tr .fs-list-col.row-actions .row-menu-action,::ng-deep .fs-list tbody .fs-list-row td.row-actions .row-inline-action-icon,::ng-deep .fs-list tbody .fs-list-row td.row-actions .row-inline-action-fab,::ng-deep .fs-list tbody .fs-list-row td.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list tbody .fs-list-row td.row-actions .row-menu-action,::ng-deep .fs-list tbody .fs-list-row th.row-actions .row-inline-action-icon,::ng-deep .fs-list tbody .fs-list-row th.row-actions .row-inline-action-fab,::ng-deep .fs-list tbody .fs-list-row th.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list tbody .fs-list-row th.row-actions .row-menu-action,::ng-deep .fs-list tbody .fs-list-row .fs-list-col.row-actions .row-inline-action-icon,::ng-deep .fs-list tbody .fs-list-row .fs-list-col.row-actions .row-inline-action-fab,::ng-deep .fs-list tbody .fs-list-row .fs-list-col.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list tbody .fs-list-row .fs-list-col.row-actions .row-menu-action,::ng-deep .fs-list tfoot tr td.row-actions .row-inline-action-icon,::ng-deep .fs-list tfoot tr td.row-actions .row-inline-action-fab,::ng-deep .fs-list tfoot tr td.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list tfoot tr td.row-actions .row-menu-action,::ng-deep .fs-list tfoot tr th.row-actions .row-inline-action-icon,::ng-deep .fs-list tfoot tr th.row-actions .row-inline-action-fab,::ng-deep .fs-list tfoot tr th.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list tfoot tr th.row-actions .row-menu-action,::ng-deep .fs-list tfoot tr .fs-list-col.row-actions .row-inline-action-icon,::ng-deep .fs-list tfoot tr .fs-list-col.row-actions .row-inline-action-fab,::ng-deep .fs-list tfoot tr .fs-list-col.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list tfoot tr .fs-list-col.row-actions .row-menu-action,::ng-deep .fs-list tfoot .fs-list-row td.row-actions .row-inline-action-icon,::ng-deep .fs-list tfoot .fs-list-row td.row-actions .row-inline-action-fab,::ng-deep .fs-list tfoot .fs-list-row td.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list tfoot .fs-list-row td.row-actions .row-menu-action,::ng-deep .fs-list tfoot .fs-list-row th.row-actions .row-inline-action-icon,::ng-deep .fs-list tfoot .fs-list-row th.row-actions .row-inline-action-fab,::ng-deep .fs-list tfoot .fs-list-row th.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list tfoot .fs-list-row th.row-actions .row-menu-action,::ng-deep .fs-list tfoot .fs-list-row .fs-list-col.row-actions .row-inline-action-icon,::ng-deep .fs-list tfoot .fs-list-row .fs-list-col.row-actions .row-inline-action-fab,::ng-deep .fs-list tfoot .fs-list-row .fs-list-col.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list tfoot .fs-list-row .fs-list-col.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-head tr td.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-head tr td.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-head tr td.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-head tr td.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-head tr th.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-head tr th.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-head tr th.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-head tr th.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-head tr .fs-list-col.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-head tr .fs-list-col.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-head tr .fs-list-col.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-head tr .fs-list-col.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-head .fs-list-row td.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-head .fs-list-row td.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-head .fs-list-row td.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-head .fs-list-row td.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-head .fs-list-row th.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-head .fs-list-row th.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-head .fs-list-row th.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-head .fs-list-row th.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-head .fs-list-row .fs-list-col.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-head .fs-list-row .fs-list-col.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-head .fs-list-row .fs-list-col.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-head .fs-list-row .fs-list-col.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-body tr td.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-body tr td.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-body tr td.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-body tr td.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-body tr th.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-body tr th.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-body tr th.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-body tr th.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-body tr .fs-list-col.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-body tr .fs-list-col.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-body tr .fs-list-col.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-body tr .fs-list-col.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-body .fs-list-row td.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-body .fs-list-row td.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-body .fs-list-row td.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-body .fs-list-row td.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-body .fs-list-row th.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-body .fs-list-row th.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-body .fs-list-row th.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-body .fs-list-row th.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-body .fs-list-row .fs-list-col.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-body .fs-list-row .fs-list-col.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-body .fs-list-row .fs-list-col.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-body .fs-list-row .fs-list-col.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-footer tr td.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-footer tr td.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-footer tr td.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-footer tr td.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-footer tr th.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-footer tr th.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-footer tr th.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-footer tr th.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-footer tr .fs-list-col.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-footer tr .fs-list-col.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-footer tr .fs-list-col.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-footer tr .fs-list-col.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-footer .fs-list-row td.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-footer .fs-list-row td.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-footer .fs-list-row td.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-footer .fs-list-row td.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-footer .fs-list-row th.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-footer .fs-list-row th.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-footer .fs-list-row th.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-footer .fs-list-row th.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-footer .fs-list-row .fs-list-col.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-footer .fs-list-row .fs-list-col.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-footer .fs-list-row .fs-list-col.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-footer .fs-list-row .fs-list-col.row-actions .row-menu-action{width:35px;justify-content:center;align-items:center}::ng-deep .fs-list thead tr td.left,::ng-deep .fs-list thead tr th.left,::ng-deep .fs-list thead tr .fs-list-col.left,::ng-deep .fs-list thead .fs-list-row td.left,::ng-deep .fs-list thead .fs-list-row th.left,::ng-deep .fs-list thead .fs-list-row .fs-list-col.left,::ng-deep .fs-list tbody tr td.left,::ng-deep .fs-list tbody tr th.left,::ng-deep .fs-list tbody tr .fs-list-col.left,::ng-deep .fs-list tbody .fs-list-row td.left,::ng-deep .fs-list tbody .fs-list-row th.left,::ng-deep .fs-list tbody .fs-list-row .fs-list-col.left,::ng-deep .fs-list tfoot tr td.left,::ng-deep .fs-list tfoot tr th.left,::ng-deep .fs-list tfoot tr .fs-list-col.left,::ng-deep .fs-list tfoot .fs-list-row td.left,::ng-deep .fs-list tfoot .fs-list-row th.left,::ng-deep .fs-list tfoot .fs-list-row .fs-list-col.left,::ng-deep .fs-list .fs-list-head tr td.left,::ng-deep .fs-list .fs-list-head tr th.left,::ng-deep .fs-list .fs-list-head tr .fs-list-col.left,::ng-deep .fs-list .fs-list-head .fs-list-row td.left,::ng-deep .fs-list .fs-list-head .fs-list-row th.left,::ng-deep .fs-list .fs-list-head .fs-list-row .fs-list-col.left,::ng-deep .fs-list .fs-list-body tr td.left,::ng-deep .fs-list .fs-list-body tr th.left,::ng-deep .fs-list .fs-list-body tr .fs-list-col.left,::ng-deep .fs-list .fs-list-body .fs-list-row td.left,::ng-deep .fs-list .fs-list-body .fs-list-row th.left,::ng-deep .fs-list .fs-list-body .fs-list-row .fs-list-col.left,::ng-deep .fs-list .fs-list-footer tr td.left,::ng-deep .fs-list .fs-list-footer tr th.left,::ng-deep .fs-list .fs-list-footer tr .fs-list-col.left,::ng-deep .fs-list .fs-list-footer .fs-list-row td.left,::ng-deep .fs-list .fs-list-footer .fs-list-row th.left,::ng-deep .fs-list .fs-list-footer .fs-list-row .fs-list-col.left{text-align:left}::ng-deep .fs-list thead tr td.center,::ng-deep .fs-list thead tr th.center,::ng-deep .fs-list thead tr .fs-list-col.center,::ng-deep .fs-list thead .fs-list-row td.center,::ng-deep .fs-list thead .fs-list-row th.center,::ng-deep .fs-list thead .fs-list-row .fs-list-col.center,::ng-deep .fs-list tbody tr td.center,::ng-deep .fs-list tbody tr th.center,::ng-deep .fs-list tbody tr .fs-list-col.center,::ng-deep .fs-list tbody .fs-list-row td.center,::ng-deep .fs-list tbody .fs-list-row th.center,::ng-deep .fs-list tbody .fs-list-row .fs-list-col.center,::ng-deep .fs-list tfoot tr td.center,::ng-deep .fs-list tfoot tr th.center,::ng-deep .fs-list tfoot tr .fs-list-col.center,::ng-deep .fs-list tfoot .fs-list-row td.center,::ng-deep .fs-list tfoot .fs-list-row th.center,::ng-deep .fs-list tfoot .fs-list-row .fs-list-col.center,::ng-deep .fs-list .fs-list-head tr td.center,::ng-deep .fs-list .fs-list-head tr th.center,::ng-deep .fs-list .fs-list-head tr .fs-list-col.center,::ng-deep .fs-list .fs-list-head .fs-list-row td.center,::ng-deep .fs-list .fs-list-head .fs-list-row th.center,::ng-deep .fs-list .fs-list-head .fs-list-row .fs-list-col.center,::ng-deep .fs-list .fs-list-body tr td.center,::ng-deep .fs-list .fs-list-body tr th.center,::ng-deep .fs-list .fs-list-body tr .fs-list-col.center,::ng-deep .fs-list .fs-list-body .fs-list-row td.center,::ng-deep .fs-list .fs-list-body .fs-list-row th.center,::ng-deep .fs-list .fs-list-body .fs-list-row .fs-list-col.center,::ng-deep .fs-list .fs-list-footer tr td.center,::ng-deep .fs-list .fs-list-footer tr th.center,::ng-deep .fs-list .fs-list-footer tr .fs-list-col.center,::ng-deep .fs-list .fs-list-footer .fs-list-row td.center,::ng-deep .fs-list .fs-list-footer .fs-list-row th.center,::ng-deep .fs-list .fs-list-footer .fs-list-row .fs-list-col.center{text-align:center}::ng-deep .fs-list thead tr td.right,::ng-deep .fs-list thead tr th.right,::ng-deep .fs-list thead tr .fs-list-col.right,::ng-deep .fs-list thead .fs-list-row td.right,::ng-deep .fs-list thead .fs-list-row th.right,::ng-deep .fs-list thead .fs-list-row .fs-list-col.right,::ng-deep .fs-list tbody tr td.right,::ng-deep .fs-list tbody tr th.right,::ng-deep .fs-list tbody tr .fs-list-col.right,::ng-deep .fs-list tbody .fs-list-row td.right,::ng-deep .fs-list tbody .fs-list-row th.right,::ng-deep .fs-list tbody .fs-list-row .fs-list-col.right,::ng-deep .fs-list tfoot tr td.right,::ng-deep .fs-list tfoot tr th.right,::ng-deep .fs-list tfoot tr .fs-list-col.right,::ng-deep .fs-list tfoot .fs-list-row td.right,::ng-deep .fs-list tfoot .fs-list-row th.right,::ng-deep .fs-list tfoot .fs-list-row .fs-list-col.right,::ng-deep .fs-list .fs-list-head tr td.right,::ng-deep .fs-list .fs-list-head tr th.right,::ng-deep .fs-list .fs-list-head tr .fs-list-col.right,::ng-deep .fs-list .fs-list-head .fs-list-row td.right,::ng-deep .fs-list .fs-list-head .fs-list-row th.right,::ng-deep .fs-list .fs-list-head .fs-list-row .fs-list-col.right,::ng-deep .fs-list .fs-list-body tr td.right,::ng-deep .fs-list .fs-list-body tr th.right,::ng-deep .fs-list .fs-list-body tr .fs-list-col.right,::ng-deep .fs-list .fs-list-body .fs-list-row td.right,::ng-deep .fs-list .fs-list-body .fs-list-row th.right,::ng-deep .fs-list .fs-list-body .fs-list-row .fs-list-col.right,::ng-deep .fs-list .fs-list-footer tr td.right,::ng-deep .fs-list .fs-list-footer tr th.right,::ng-deep .fs-list .fs-list-footer tr .fs-list-col.right,::ng-deep .fs-list .fs-list-footer .fs-list-row td.right,::ng-deep .fs-list .fs-list-footer .fs-list-row th.right,::ng-deep .fs-list .fs-list-footer .fs-list-row .fs-list-col.right{text-align:right}::ng-deep .fs-list thead tr.draggable,::ng-deep .fs-list thead .fs-list-row.draggable,::ng-deep .fs-list tbody tr.draggable,::ng-deep .fs-list tbody .fs-list-row.draggable,::ng-deep .fs-list tfoot tr.draggable,::ng-deep .fs-list tfoot .fs-list-row.draggable,::ng-deep .fs-list .fs-list-head tr.draggable,::ng-deep .fs-list .fs-list-head .fs-list-row.draggable,::ng-deep .fs-list .fs-list-body tr.draggable,::ng-deep .fs-list .fs-list-body .fs-list-row.draggable,::ng-deep .fs-list .fs-list-footer tr.draggable,::ng-deep .fs-list .fs-list-footer .fs-list-row.draggable{position:fixed;z-index:9999;box-shadow:2px 2px 2px #9e9e9ea6;border-radius:5px}::ng-deep .fs-list thead tr.draggable td,::ng-deep .fs-list thead tr.draggable .fs-list-col,::ng-deep .fs-list thead .fs-list-row.draggable td,::ng-deep .fs-list thead .fs-list-row.draggable .fs-list-col,::ng-deep .fs-list tbody tr.draggable td,::ng-deep .fs-list tbody tr.draggable .fs-list-col,::ng-deep .fs-list tbody .fs-list-row.draggable td,::ng-deep .fs-list tbody .fs-list-row.draggable .fs-list-col,::ng-deep .fs-list tfoot tr.draggable td,::ng-deep .fs-list tfoot tr.draggable .fs-list-col,::ng-deep .fs-list tfoot .fs-list-row.draggable td,::ng-deep .fs-list tfoot .fs-list-row.draggable .fs-list-col,::ng-deep .fs-list .fs-list-head tr.draggable td,::ng-deep .fs-list .fs-list-head tr.draggable .fs-list-col,::ng-deep .fs-list .fs-list-head .fs-list-row.draggable td,::ng-deep .fs-list .fs-list-head .fs-list-row.draggable .fs-list-col,::ng-deep .fs-list .fs-list-body tr.draggable td,::ng-deep .fs-list .fs-list-body tr.draggable .fs-list-col,::ng-deep .fs-list .fs-list-body .fs-list-row.draggable td,::ng-deep .fs-list .fs-list-body .fs-list-row.draggable .fs-list-col,::ng-deep .fs-list .fs-list-footer tr.draggable td,::ng-deep .fs-list .fs-list-footer tr.draggable .fs-list-col,::ng-deep .fs-list .fs-list-footer .fs-list-row.draggable td,::ng-deep .fs-list .fs-list-footer .fs-list-row.draggable .fs-list-col{background-color:#f6f6f6;border:none}::ng-deep .fs-list .fs-list-header .heading-container{font-weight:600;font-size:18px;color:#212537;display:flex;flex-direction:column;justify-content:center}::ng-deep .fs-list .fs-list-header .heading{margin:0;line-height:36px}::ng-deep .fs-list .fs-list-header .subheading{display:block;font-size:14px;color:#929292;font-weight:400}::ng-deep .fs-list .fs-list-header .fs-list-actions{white-space:nowrap;float:right}::ng-deep .fs-list .fs-list-header .fs-list-actions .menu-button{width:36px;height:36px;line-height:36px}::ng-deep .fs-list .fs-list-header .action-button{margin-left:5px}::ng-deep .fs-list .fs-list-header .action-button:first-child{margin-left:0}::ng-deep .fs-list .fs-list-header .mat-button{margin-top:0;margin-bottom:0;margin-right:0}::ng-deep .fs-list .fs-list-container{width:100%}::ng-deep .fs-list .fs-list-container:not(.has-filters):not(.has-actions):not(.has-heading) .fs-list-header-container{display:none}::ng-deep .fs-list .fs-list-container.has-dragging thead th{border-bottom:2px solid #ddd}::ng-deep .fs-list .fs-list-container.has-dragging tbody tr:nth-child(2) td{border-top:none}::ng-deep .fs-list tfoot td{padding:8px}::ng-deep .reorder-in-progress{-webkit-user-select:none;user-select:none}::ng-deep .draggable-elem td{opacity:.2}::ng-deep .hidden-mobile-menu-action{display:none!important}::ng-deep .hidden-mobile{display:none!important}@media only screen and (max-width: 600px){::ng-deep .fs-list-filter .inline-actions{top:initial!important;position:initial!important}::ng-deep .fs-list-filter .inline-actions .action-filter{margin-bottom:0!important}::ng-deep .fs-list-header .filter-input-field .mat-form-field-wrapper{padding:0!important}::ng-deep .fs-list-header.has-filters{flex-flow:row wrap}}@media only screen and (max-width: 768px){::ng-deep .show-mobile{display:inline-block!important}::ng-deep .fs-list-actions .action-button{display:none}::ng-deep .row-inline-action.mobile-hide{display:none}::ng-deep .hidden-mobile-menu-action{display:block!important}}\n"], components: [{ type: i2__namespace$2.FilterComponent, selector: "fs-filter", inputs: ["config", "filter", "showSortBy", "showFilterInput"], outputs: ["closed", "opened", "ready"] }, { type: FsStatusComponent, selector: "fs-list-status", inputs: ["paging", "sorting", "rows", "scrollable", "firstLoad"] }, { type: FsHeadComponent, selector: "[fs-list-head]", inputs: ["sorting", "columns", "hasRowActions", "selection"] }, { type: FsBodyComponent, selector: "[fs-list-body]", inputs: ["rows", "columns", "hasFooter", "rowActionsRaw", "groupActionsRaw", "rowEvents", "rowClass", "hasRowActions", "selection", "restoreMode", "rowRemoved"] }, { type: FsFooterComponent, selector: "[fs-list-footer]", inputs: ["hasRowActions", "columns", "selection"] }, { type: FsListLoaderComponent, selector: "fs-list-loader", inputs: ["columns", "loaderLines"] }, { type: FsPaginationComponent, selector: "fs-list-pagination", inputs: ["pagination", "rows"] }], directives: [{ type: i3__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5__namespace.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i3__namespace$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace$2.FilterStatusBarDirective, selector: "[fsFilterStatusBar]" }, { type: FsListContentInitDirective, selector: "[fsListContentInit]", inputs: ["fsListContentInit"] }, { type: FsListDraggableListDirective, selector: "[fsListDraggableList]", inputs: ["rows"] }, { type: FsListFooterDirective, selector: "[fs-list-footer]", inputs: ["colspan", "align", "class"] }], pipes: { "async": i3__namespace$1.AsyncPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+        ], queries: [{ propertyName: "_emptyStateTemplate", first: true, predicate: FsListEmptyStateDirective, descendants: true, read: i0.TemplateRef }, { propertyName: "headingTemplate", first: true, predicate: FsListHeadingDirective, descendants: true, read: i0.TemplateRef }, { propertyName: "subheadingTemplate", first: true, predicate: FsListSubheadingDirective, descendants: true, read: i0.TemplateRef }, { propertyName: "columnTemplates", predicate: FsListColumnDirective }], viewQueries: [{ propertyName: "filterReference", first: true, predicate: i2.FilterComponent, descendants: true }], ngImport: i0__namespace, template: "<div class=\"fs-list-container\"\n    [ngClass]=\"{\n      'has-filter-keyword': hasFilterKeyword,\n      'has-filters': list.filterConfig?.items.length,\n      'has-heading': list.heading || headingTemplate,\n      'has-status': hasStatus,\n      'has-chips': list.chips,\n      'has-actions': list.actions.hasActions,\n      'first-load': firstLoad,\n      'loading': list.loading$ | async\n    }\">\n  <ng-template [ngTemplateOutlet]=\"listContainerContent\"></ng-template>\n</div>\n\n<ng-template #listContainerContent>\n  <ng-container *ngIf=\"list.dataController.visibleRows$ | async as listData\">\n    <div class=\"fs-list-header-container\">\n      <div\n          class=\"fs-list-header\"\n          [ngClass]=\"{ 'no-wrap': reorderController.manualReorderActivated || !list.filterConfig?.items.length }\">\n        <ng-container\n            *ngIf=\"hasFilterKeyword\"\n            [ngTemplateOutlet]=\"heading\">\n        </ng-container>\n        <fs-filter\n            class=\"fs-list-filter\"\n            *ngIf=\"list.filterConfig\"\n            [filter]=\"list.filterConfig\"\n            [showSortBy]=\"!list.status\"\n            [showFilterInput]=\"list.filterInput\"\n            (ready)=\"filterReady()\">\n          <ng-template fsFilterStatusBar>\n            <ng-container\n                *ngIf=\"!hasFilterKeyword\"\n                [ngTemplateOutlet]=\"heading\">\n            </ng-container>\n            <ng-container *ngIf=\"hasStatus\">\n              <fs-list-status\n                class=\"fs-list-status\"\n                [ngClass]=\"{ 'hidden-mobile': !list.status }\"\n                [rows]=\"listData\"\n                [sorting]=\"list.sorting\"\n                [paging]=\"list.paging\"\n                [firstLoad]=\"firstLoad\"\n                [scrollable]=\"list.scrollable || list.paging.loadMoreEnabled\">\n              </fs-list-status>\n            </ng-container>\n          </ng-template>\n        </fs-filter>\n      </div>\n    </div>\n\n    <ng-content select=\"[fs-list-content]\"></ng-content>\n\n    <!-- Table implementation -->\n    <div class=\"fs-list-table-container\">\n      <ng-container *ngIf=\"!firstLoad && listData.length > 0 && !list.emptyStateEnabled\">\n        <table class=\"fs-list-table\" role=\"grid\" [fsListContentInit]=\"list.afterContentInit\">\n          <thead\n            fs-list-head\n            class=\"fs-list-head\"\n            role=\"rowgroup\"\n            *ngIf=\"list.columns.hasHeader\"\n            [ngClass]=\"list.columns.theadClass\"\n            [columns]=\"list.columns.visibleColumns$ | async\"\n            [sorting]=\"list.sorting\"\n            [selection]=\"list.selection\"\n            [hasRowActions]=\"list.hasRowActions\">\n          </thead>\n\n          <tbody\n            fs-list-body\n            fsListDraggableList\n            class=\"fs-list-body\"\n            role=\"rowgroup\"\n            [class.disabled]=\"!!(reorderController.reorderDisabled$ | async)\"\n            [rows]=\"listData\"\n            [rowActionsRaw]=\"list.rowActionsRaw\"\n            [groupActionsRaw]=\"list.groupActionsRaw\"\n            [hasRowActions]=\"list.hasRowActions\"\n            [rowEvents]=\"list.rowEvents\"\n            [rowClass]=\"list.rowClass\"\n            [columns]=\"list.columns.visibleColumns$ | async\"\n            [restoreMode]=\"list.restoreMode\"\n            [selection]=\"list.selection\"\n            [rowRemoved]=\"rowRemoved\">\n          </tbody>\n\n          <tfoot\n            fs-list-footer\n            class=\"fs-list-footer\"\n            *ngIf=\"list.columns.hasFooter\"\n            [columns]=\"list.columns.visibleColumns$ | async\"\n            [selection]=\"list.selection\"\n            [hasRowActions]=\"list.hasRowActions\">\n          </tfoot>\n        </table>\n      </ng-container>\n      <fs-list-loader\n        *ngIf=\"firstLoad\"\n        [columns]=\"list.columns.columns\"\n        [loaderLines]=\"loaderLines\">\n      </fs-list-loader>\n    </div>\n\n    <fs-list-pagination\n      *ngIf=\"paginatorVisible\"\n      class=\"fs-list-pagination\"\n      [rows]=\"listData\"\n      [pagination]=\"list.paging\">\n    </fs-list-pagination>\n\n    <ng-container *ngIf=\"!firstLoad\">\n      <div\n          *ngIf=\"listData.length === 0\"\n          class=\"fs-list-no-results-container\">\n        <div\n            *ngIf=\"list.noResults?.message && !list.emptyStateEnabled\"\n            class=\"fs-list-no-results\">\n          {{ list.noResults?.message }}\n        </div>\n        <ng-container *ngIf=\"list.emptyStateEnabled\">\n          <ng-template [ngTemplateOutlet]=\"list.emptyStateTemplate\"></ng-template>\n        </ng-container>\n      </div>\n    </ng-container>\n  </ng-container>\n</ng-template>\n\n<ng-template #heading>\n  <div class=\"heading-container\" *ngIf=\"list.heading || list.subheading || headingTemplate\">\n    <h2 class=\"heading\" *ngIf=\"list.heading|| headingTemplate\">\n      {{list.heading}}\n      <ng-container [ngTemplateOutlet]=\"headingTemplate\"></ng-container>\n    </h2>\n    <div class=\"small subheading\" *ngIf=\"list.subheading || subheadingTemplate\">\n      {{list.subheading}}\n      <ng-container [ngTemplateOutlet]=\"subheadingTemplate\"></ng-container>\n    </div>\n  </div>\n</ng-template>\n", styles: [":host ::ng-deep .fs-list-swap-restricted{opacity:.5}:host ::ng-deep .fs-list-no-drop{cursor:no-drop}:host ::ng-deep .hidden{display:none}@media print{:host ::ng-deep .fs-list-row-group{page-break-after:avoid}:host ::ng-deep .fs-list-row-group-child{page-break-before:avoid}:host ::ng-deep .fs-list-row-group-footer{page-break-before:avoid}}.fs-list-container{width:100%}.fs-list-container:not(.has-filters):not(.has-actions):not(.has-heading) .fs-list-header-container{display:none}.fs-list-container:not(.has-filter-keyword) .fs-list-header{display:flex;margin-bottom:4px}.fs-list-container:not(.has-filter-keyword) .fs-list-header .heading-container{flex:1}.fs-list-container:not(.has-filter-keyword) .fs-list-header fs-filter{display:flex}.fs-list-container.has-filters .heading-container{margin-bottom:4px}.fs-list-container.loading .fs-list-status,.fs-list-container.loading .fs-list-body,.fs-list-container.loading fs-list-pagination,.fs-list-container.loading .filter-chips,.fs-list-container.loading .fs-list-no-results-container,.fs-list-container.first-load .fs-list-status,.fs-list-container.first-load .fs-list-body,.fs-list-container.first-load fs-list-pagination,.fs-list-container.first-load .filter-chips,.fs-list-container.first-load .fs-list-no-results-container{opacity:.4;pointer-events:none}.fs-list-container.first-load ::ng-deep fs-filter-chips .fs-chip{color:transparent}.fs-list-container.first-load ::ng-deep fs-filter-chips .fs-chip .remove{visibility:hidden}.fs-list-container.has-actions .fs-list-actions{margin-left:5px}.fs-list-filter{margin-bottom:0;position:initial!important;display:block;width:100%}.fs-list-no-results-container .fs-list-no-results{text-align:center;color:#999;padding:10px 0}.fs-list-header .heading-container{display:flex;flex-direction:column;justify-content:center}.fs-list-header .heading{margin:0}.fs-list-header h2+.subheading{margin:2px 0 0}.fs-list-header .fs-list-actions{white-space:nowrap;float:right}.fs-list-header .fs-list-actions .menu-button{width:36px;height:36px;line-height:36px}.fs-list-header .action-button{margin-left:5px}.fs-list-header .action-button:first-child{margin-left:0}.fs-list-header .mat-button{margin-top:0;margin-bottom:0;margin-right:0}.fs-list-table-container{width:100%;overflow:auto}::ng-deep .preview-block{position:fixed;height:30px;width:200px;background:grey;display:flex;justify-content:center;align-items:center;z-index:1000;box-shadow:2px 2px 2px #9e9e9ea6;border-radius:6px}::ng-deep .fs-list{display:block;width:100%}::ng-deep .fs-list table,::ng-deep .fs-list .fs-list-table{border-spacing:0;display:table;width:100%;border-collapse:collapse}::ng-deep .fs-list thead,::ng-deep .fs-list .fs-list-head{display:table-header-group}::ng-deep .fs-list thead th,::ng-deep .fs-list thead .fs-list-col,::ng-deep .fs-list .fs-list-head th,::ng-deep .fs-list .fs-list-head .fs-list-col{color:#999;padding:8px;font-weight:normal;color:#8f8f8f;font-size:85%}::ng-deep .fs-list thead th.fs-list-col-selection,::ng-deep .fs-list thead .fs-list-col.fs-list-col-selection,::ng-deep .fs-list .fs-list-head th.fs-list-col-selection,::ng-deep .fs-list .fs-list-head .fs-list-col.fs-list-col-selection{width:1%;text-align:left}::ng-deep .fs-list thead th.sorting,::ng-deep .fs-list thead .fs-list-col.sorting,::ng-deep .fs-list .fs-list-head th.sorting,::ng-deep .fs-list .fs-list-head .fs-list-col.sorting{cursor:pointer}::ng-deep .fs-list thead th.sorting:hover,::ng-deep .fs-list thead .fs-list-col.sorting:hover,::ng-deep .fs-list .fs-list-head th.sorting:hover,::ng-deep .fs-list .fs-list-head .fs-list-col.sorting:hover{background-color:#f6f6f6}::ng-deep .fs-list thead th .wrap,::ng-deep .fs-list thead .fs-list-col .wrap,::ng-deep .fs-list .fs-list-head th .wrap,::ng-deep .fs-list .fs-list-head .fs-list-col .wrap{display:inline-flex;vertical-align:middle;white-space:nowrap}::ng-deep .fs-list thead th .wrap mat-icon,::ng-deep .fs-list thead .fs-list-col .wrap mat-icon,::ng-deep .fs-list .fs-list-head th .wrap mat-icon,::ng-deep .fs-list .fs-list-head .fs-list-col .wrap mat-icon{font-size:14px;display:block;height:14px;width:14px}::ng-deep .fs-list thead th .wrap .direction,::ng-deep .fs-list thead .fs-list-col .wrap .direction,::ng-deep .fs-list .fs-list-head th .wrap .direction,::ng-deep .fs-list .fs-list-head .fs-list-col .wrap .direction{margin-left:5px}::ng-deep .fs-list thead th.sorting,::ng-deep .fs-list thead .fs-list-col.sorting,::ng-deep .fs-list .fs-list-head th.sorting,::ng-deep .fs-list .fs-list-head .fs-list-col.sorting{background-image:none}::ng-deep .fs-list tbody,::ng-deep .fs-list .fs-list-body{display:table-row-group;position:relative}::ng-deep .fs-list tbody.drag-hidden .drag-col,::ng-deep .fs-list .fs-list-body.drag-hidden .drag-col{opacity:0!important;cursor:default}::ng-deep .fs-list tbody.disabled,::ng-deep .fs-list .fs-list-body.disabled{opacity:.4;pointer-events:none}::ng-deep .fs-list tbody td,::ng-deep .fs-list .fs-list-body td{border-top:1px solid #ddd}::ng-deep .fs-list tbody td,::ng-deep .fs-list tbody .fs-list-col,::ng-deep .fs-list .fs-list-body td,::ng-deep .fs-list .fs-list-body .fs-list-col{box-sizing:border-box}::ng-deep .fs-list tbody tr:hover td,::ng-deep .fs-list tbody .fs-list-row:hover .fs-list-col,::ng-deep .fs-list .fs-list-body tr:hover td,::ng-deep .fs-list .fs-list-body .fs-list-row:hover .fs-list-col{background-color:#f6f6f6}::ng-deep .fs-list tbody tr:hover td,::ng-deep .fs-list tbody tr:hover .fs-list-col,::ng-deep .fs-list tbody .fs-list-row:hover td,::ng-deep .fs-list tbody .fs-list-row:hover .fs-list-col,::ng-deep .fs-list .fs-list-body tr:hover td,::ng-deep .fs-list .fs-list-body tr:hover .fs-list-col,::ng-deep .fs-list .fs-list-body .fs-list-row:hover td,::ng-deep .fs-list .fs-list-body .fs-list-row:hover .fs-list-col{background-color:#f6f6f6}::ng-deep .fs-list tbody tr:first-child td,::ng-deep .fs-list .fs-list-body tr:first-child td{border-top:2px solid #ddd}::ng-deep .fs-list tbody tr:last-child td,::ng-deep .fs-list .fs-list-body tr:last-child td{border-bottom:2px solid #ddd}::ng-deep .fs-list thead tr,::ng-deep .fs-list thead .fs-list-row,::ng-deep .fs-list tbody tr,::ng-deep .fs-list tbody .fs-list-row,::ng-deep .fs-list tfoot tr,::ng-deep .fs-list tfoot .fs-list-row,::ng-deep .fs-list .fs-list-head tr,::ng-deep .fs-list .fs-list-head .fs-list-row,::ng-deep .fs-list .fs-list-body tr,::ng-deep .fs-list .fs-list-body .fs-list-row,::ng-deep .fs-list .fs-list-footer tr,::ng-deep .fs-list .fs-list-footer .fs-list-row{display:table-row}::ng-deep .fs-list thead tr.drag-hidden,::ng-deep .fs-list thead .fs-list-row.drag-hidden,::ng-deep .fs-list tbody tr.drag-hidden,::ng-deep .fs-list tbody .fs-list-row.drag-hidden,::ng-deep .fs-list tfoot tr.drag-hidden,::ng-deep .fs-list tfoot .fs-list-row.drag-hidden,::ng-deep .fs-list .fs-list-head tr.drag-hidden,::ng-deep .fs-list .fs-list-head .fs-list-row.drag-hidden,::ng-deep .fs-list .fs-list-body tr.drag-hidden,::ng-deep .fs-list .fs-list-body .fs-list-row.drag-hidden,::ng-deep .fs-list .fs-list-footer tr.drag-hidden,::ng-deep .fs-list .fs-list-footer .fs-list-row.drag-hidden{display:none}::ng-deep .fs-list thead tr.multiple-selection,::ng-deep .fs-list thead .fs-list-row.multiple-selection,::ng-deep .fs-list tbody tr.multiple-selection,::ng-deep .fs-list tbody .fs-list-row.multiple-selection,::ng-deep .fs-list tfoot tr.multiple-selection,::ng-deep .fs-list tfoot .fs-list-row.multiple-selection,::ng-deep .fs-list .fs-list-head tr.multiple-selection,::ng-deep .fs-list .fs-list-head .fs-list-row.multiple-selection,::ng-deep .fs-list .fs-list-body tr.multiple-selection,::ng-deep .fs-list .fs-list-body .fs-list-row.multiple-selection,::ng-deep .fs-list .fs-list-footer tr.multiple-selection,::ng-deep .fs-list .fs-list-footer .fs-list-row.multiple-selection{background-color:#2196f380}::ng-deep .fs-list thead tr.multiple-selection .fs-list-col,::ng-deep .fs-list thead .fs-list-row.multiple-selection .fs-list-col,::ng-deep .fs-list tbody tr.multiple-selection .fs-list-col,::ng-deep .fs-list tbody .fs-list-row.multiple-selection .fs-list-col,::ng-deep .fs-list tfoot tr.multiple-selection .fs-list-col,::ng-deep .fs-list tfoot .fs-list-row.multiple-selection .fs-list-col,::ng-deep .fs-list .fs-list-head tr.multiple-selection .fs-list-col,::ng-deep .fs-list .fs-list-head .fs-list-row.multiple-selection .fs-list-col,::ng-deep .fs-list .fs-list-body tr.multiple-selection .fs-list-col,::ng-deep .fs-list .fs-list-body .fs-list-row.multiple-selection .fs-list-col,::ng-deep .fs-list .fs-list-footer tr.multiple-selection .fs-list-col,::ng-deep .fs-list .fs-list-footer .fs-list-row.multiple-selection .fs-list-col{background-color:#2196f380}::ng-deep .fs-list thead tr td,::ng-deep .fs-list thead tr th,::ng-deep .fs-list thead tr .fs-list-col,::ng-deep .fs-list thead .fs-list-row td,::ng-deep .fs-list thead .fs-list-row th,::ng-deep .fs-list thead .fs-list-row .fs-list-col,::ng-deep .fs-list tbody tr td,::ng-deep .fs-list tbody tr th,::ng-deep .fs-list tbody tr .fs-list-col,::ng-deep .fs-list tbody .fs-list-row td,::ng-deep .fs-list tbody .fs-list-row th,::ng-deep .fs-list tbody .fs-list-row .fs-list-col,::ng-deep .fs-list tfoot tr td,::ng-deep .fs-list tfoot tr th,::ng-deep .fs-list tfoot tr .fs-list-col,::ng-deep .fs-list tfoot .fs-list-row td,::ng-deep .fs-list tfoot .fs-list-row th,::ng-deep .fs-list tfoot .fs-list-row .fs-list-col,::ng-deep .fs-list .fs-list-head tr td,::ng-deep .fs-list .fs-list-head tr th,::ng-deep .fs-list .fs-list-head tr .fs-list-col,::ng-deep .fs-list .fs-list-head .fs-list-row td,::ng-deep .fs-list .fs-list-head .fs-list-row th,::ng-deep .fs-list .fs-list-head .fs-list-row .fs-list-col,::ng-deep .fs-list .fs-list-body tr td,::ng-deep .fs-list .fs-list-body tr th,::ng-deep .fs-list .fs-list-body tr .fs-list-col,::ng-deep .fs-list .fs-list-body .fs-list-row td,::ng-deep .fs-list .fs-list-body .fs-list-row th,::ng-deep .fs-list .fs-list-body .fs-list-row .fs-list-col,::ng-deep .fs-list .fs-list-footer tr td,::ng-deep .fs-list .fs-list-footer tr th,::ng-deep .fs-list .fs-list-footer tr .fs-list-col,::ng-deep .fs-list .fs-list-footer .fs-list-row td,::ng-deep .fs-list .fs-list-footer .fs-list-row th,::ng-deep .fs-list .fs-list-footer .fs-list-row .fs-list-col{display:table-cell;padding:8px;vertical-align:middle;outline:none}::ng-deep .fs-list thead tr td.drag-col,::ng-deep .fs-list thead tr th.drag-col,::ng-deep .fs-list thead tr .fs-list-col.drag-col,::ng-deep .fs-list thead .fs-list-row td.drag-col,::ng-deep .fs-list thead .fs-list-row th.drag-col,::ng-deep .fs-list thead .fs-list-row .fs-list-col.drag-col,::ng-deep .fs-list tbody tr td.drag-col,::ng-deep .fs-list tbody tr th.drag-col,::ng-deep .fs-list tbody tr .fs-list-col.drag-col,::ng-deep .fs-list tbody .fs-list-row td.drag-col,::ng-deep .fs-list tbody .fs-list-row th.drag-col,::ng-deep .fs-list tbody .fs-list-row .fs-list-col.drag-col,::ng-deep .fs-list tfoot tr td.drag-col,::ng-deep .fs-list tfoot tr th.drag-col,::ng-deep .fs-list tfoot tr .fs-list-col.drag-col,::ng-deep .fs-list tfoot .fs-list-row td.drag-col,::ng-deep .fs-list tfoot .fs-list-row th.drag-col,::ng-deep .fs-list tfoot .fs-list-row .fs-list-col.drag-col,::ng-deep .fs-list .fs-list-head tr td.drag-col,::ng-deep .fs-list .fs-list-head tr th.drag-col,::ng-deep .fs-list .fs-list-head tr .fs-list-col.drag-col,::ng-deep .fs-list .fs-list-head .fs-list-row td.drag-col,::ng-deep .fs-list .fs-list-head .fs-list-row th.drag-col,::ng-deep .fs-list .fs-list-head .fs-list-row .fs-list-col.drag-col,::ng-deep .fs-list .fs-list-body tr td.drag-col,::ng-deep .fs-list .fs-list-body tr th.drag-col,::ng-deep .fs-list .fs-list-body tr .fs-list-col.drag-col,::ng-deep .fs-list .fs-list-body .fs-list-row td.drag-col,::ng-deep .fs-list .fs-list-body .fs-list-row th.drag-col,::ng-deep .fs-list .fs-list-body .fs-list-row .fs-list-col.drag-col,::ng-deep .fs-list .fs-list-footer tr td.drag-col,::ng-deep .fs-list .fs-list-footer tr th.drag-col,::ng-deep .fs-list .fs-list-footer tr .fs-list-col.drag-col,::ng-deep .fs-list .fs-list-footer .fs-list-row td.drag-col,::ng-deep .fs-list .fs-list-footer .fs-list-row th.drag-col,::ng-deep .fs-list .fs-list-footer .fs-list-row .fs-list-col.drag-col{width:24px;text-align:center;cursor:grab}::ng-deep .fs-list thead tr td.drag-col.drag-disabled,::ng-deep .fs-list thead tr th.drag-col.drag-disabled,::ng-deep .fs-list thead tr .fs-list-col.drag-col.drag-disabled,::ng-deep .fs-list thead .fs-list-row td.drag-col.drag-disabled,::ng-deep .fs-list thead .fs-list-row th.drag-col.drag-disabled,::ng-deep .fs-list thead .fs-list-row .fs-list-col.drag-col.drag-disabled,::ng-deep .fs-list tbody tr td.drag-col.drag-disabled,::ng-deep .fs-list tbody tr th.drag-col.drag-disabled,::ng-deep .fs-list tbody tr .fs-list-col.drag-col.drag-disabled,::ng-deep .fs-list tbody .fs-list-row td.drag-col.drag-disabled,::ng-deep .fs-list tbody .fs-list-row th.drag-col.drag-disabled,::ng-deep .fs-list tbody .fs-list-row .fs-list-col.drag-col.drag-disabled,::ng-deep .fs-list tfoot tr td.drag-col.drag-disabled,::ng-deep .fs-list tfoot tr th.drag-col.drag-disabled,::ng-deep .fs-list tfoot tr .fs-list-col.drag-col.drag-disabled,::ng-deep .fs-list tfoot .fs-list-row td.drag-col.drag-disabled,::ng-deep .fs-list tfoot .fs-list-row th.drag-col.drag-disabled,::ng-deep .fs-list tfoot .fs-list-row .fs-list-col.drag-col.drag-disabled,::ng-deep .fs-list .fs-list-head tr td.drag-col.drag-disabled,::ng-deep .fs-list .fs-list-head tr th.drag-col.drag-disabled,::ng-deep .fs-list .fs-list-head tr .fs-list-col.drag-col.drag-disabled,::ng-deep .fs-list .fs-list-head .fs-list-row td.drag-col.drag-disabled,::ng-deep .fs-list .fs-list-head .fs-list-row th.drag-col.drag-disabled,::ng-deep .fs-list .fs-list-head .fs-list-row .fs-list-col.drag-col.drag-disabled,::ng-deep .fs-list .fs-list-body tr td.drag-col.drag-disabled,::ng-deep .fs-list .fs-list-body tr th.drag-col.drag-disabled,::ng-deep .fs-list .fs-list-body tr .fs-list-col.drag-col.drag-disabled,::ng-deep .fs-list .fs-list-body .fs-list-row td.drag-col.drag-disabled,::ng-deep .fs-list .fs-list-body .fs-list-row th.drag-col.drag-disabled,::ng-deep .fs-list .fs-list-body .fs-list-row .fs-list-col.drag-col.drag-disabled,::ng-deep .fs-list .fs-list-footer tr td.drag-col.drag-disabled,::ng-deep .fs-list .fs-list-footer tr th.drag-col.drag-disabled,::ng-deep .fs-list .fs-list-footer tr .fs-list-col.drag-col.drag-disabled,::ng-deep .fs-list .fs-list-footer .fs-list-row td.drag-col.drag-disabled,::ng-deep .fs-list .fs-list-footer .fs-list-row th.drag-col.drag-disabled,::ng-deep .fs-list .fs-list-footer .fs-list-row .fs-list-col.drag-col.drag-disabled{opacity:.4;cursor:no-drop}::ng-deep .fs-list thead tr td.drag-col mat-icon,::ng-deep .fs-list thead tr th.drag-col mat-icon,::ng-deep .fs-list thead tr .fs-list-col.drag-col mat-icon,::ng-deep .fs-list thead .fs-list-row td.drag-col mat-icon,::ng-deep .fs-list thead .fs-list-row th.drag-col mat-icon,::ng-deep .fs-list thead .fs-list-row .fs-list-col.drag-col mat-icon,::ng-deep .fs-list tbody tr td.drag-col mat-icon,::ng-deep .fs-list tbody tr th.drag-col mat-icon,::ng-deep .fs-list tbody tr .fs-list-col.drag-col mat-icon,::ng-deep .fs-list tbody .fs-list-row td.drag-col mat-icon,::ng-deep .fs-list tbody .fs-list-row th.drag-col mat-icon,::ng-deep .fs-list tbody .fs-list-row .fs-list-col.drag-col mat-icon,::ng-deep .fs-list tfoot tr td.drag-col mat-icon,::ng-deep .fs-list tfoot tr th.drag-col mat-icon,::ng-deep .fs-list tfoot tr .fs-list-col.drag-col mat-icon,::ng-deep .fs-list tfoot .fs-list-row td.drag-col mat-icon,::ng-deep .fs-list tfoot .fs-list-row th.drag-col mat-icon,::ng-deep .fs-list tfoot .fs-list-row .fs-list-col.drag-col mat-icon,::ng-deep .fs-list .fs-list-head tr td.drag-col mat-icon,::ng-deep .fs-list .fs-list-head tr th.drag-col mat-icon,::ng-deep .fs-list .fs-list-head tr .fs-list-col.drag-col mat-icon,::ng-deep .fs-list .fs-list-head .fs-list-row td.drag-col mat-icon,::ng-deep .fs-list .fs-list-head .fs-list-row th.drag-col mat-icon,::ng-deep .fs-list .fs-list-head .fs-list-row .fs-list-col.drag-col mat-icon,::ng-deep .fs-list .fs-list-body tr td.drag-col mat-icon,::ng-deep .fs-list .fs-list-body tr th.drag-col mat-icon,::ng-deep .fs-list .fs-list-body tr .fs-list-col.drag-col mat-icon,::ng-deep .fs-list .fs-list-body .fs-list-row td.drag-col mat-icon,::ng-deep .fs-list .fs-list-body .fs-list-row th.drag-col mat-icon,::ng-deep .fs-list .fs-list-body .fs-list-row .fs-list-col.drag-col mat-icon,::ng-deep .fs-list .fs-list-footer tr td.drag-col mat-icon,::ng-deep .fs-list .fs-list-footer tr th.drag-col mat-icon,::ng-deep .fs-list .fs-list-footer tr .fs-list-col.drag-col mat-icon,::ng-deep .fs-list .fs-list-footer .fs-list-row td.drag-col mat-icon,::ng-deep .fs-list .fs-list-footer .fs-list-row th.drag-col mat-icon,::ng-deep .fs-list .fs-list-footer .fs-list-row .fs-list-col.drag-col mat-icon{display:flex}::ng-deep .fs-list thead tr td.row-actions,::ng-deep .fs-list thead tr th.row-actions,::ng-deep .fs-list thead tr .fs-list-col.row-actions,::ng-deep .fs-list thead .fs-list-row td.row-actions,::ng-deep .fs-list thead .fs-list-row th.row-actions,::ng-deep .fs-list thead .fs-list-row .fs-list-col.row-actions,::ng-deep .fs-list tbody tr td.row-actions,::ng-deep .fs-list tbody tr th.row-actions,::ng-deep .fs-list tbody tr .fs-list-col.row-actions,::ng-deep .fs-list tbody .fs-list-row td.row-actions,::ng-deep .fs-list tbody .fs-list-row th.row-actions,::ng-deep .fs-list tbody .fs-list-row .fs-list-col.row-actions,::ng-deep .fs-list tfoot tr td.row-actions,::ng-deep .fs-list tfoot tr th.row-actions,::ng-deep .fs-list tfoot tr .fs-list-col.row-actions,::ng-deep .fs-list tfoot .fs-list-row td.row-actions,::ng-deep .fs-list tfoot .fs-list-row th.row-actions,::ng-deep .fs-list tfoot .fs-list-row .fs-list-col.row-actions,::ng-deep .fs-list .fs-list-head tr td.row-actions,::ng-deep .fs-list .fs-list-head tr th.row-actions,::ng-deep .fs-list .fs-list-head tr .fs-list-col.row-actions,::ng-deep .fs-list .fs-list-head .fs-list-row td.row-actions,::ng-deep .fs-list .fs-list-head .fs-list-row th.row-actions,::ng-deep .fs-list .fs-list-head .fs-list-row .fs-list-col.row-actions,::ng-deep .fs-list .fs-list-body tr td.row-actions,::ng-deep .fs-list .fs-list-body tr th.row-actions,::ng-deep .fs-list .fs-list-body tr .fs-list-col.row-actions,::ng-deep .fs-list .fs-list-body .fs-list-row td.row-actions,::ng-deep .fs-list .fs-list-body .fs-list-row th.row-actions,::ng-deep .fs-list .fs-list-body .fs-list-row .fs-list-col.row-actions,::ng-deep .fs-list .fs-list-footer tr td.row-actions,::ng-deep .fs-list .fs-list-footer tr th.row-actions,::ng-deep .fs-list .fs-list-footer tr .fs-list-col.row-actions,::ng-deep .fs-list .fs-list-footer .fs-list-row td.row-actions,::ng-deep .fs-list .fs-list-footer .fs-list-row th.row-actions,::ng-deep .fs-list .fs-list-footer .fs-list-row .fs-list-col.row-actions{width:1%;white-space:nowrap;padding-right:10px;overflow:hidden}::ng-deep .fs-list thead tr td.row-actions .row-inline-action,::ng-deep .fs-list thead tr th.row-actions .row-inline-action,::ng-deep .fs-list thead tr .fs-list-col.row-actions .row-inline-action,::ng-deep .fs-list thead .fs-list-row td.row-actions .row-inline-action,::ng-deep .fs-list thead .fs-list-row th.row-actions .row-inline-action,::ng-deep .fs-list thead .fs-list-row .fs-list-col.row-actions .row-inline-action,::ng-deep .fs-list tbody tr td.row-actions .row-inline-action,::ng-deep .fs-list tbody tr th.row-actions .row-inline-action,::ng-deep .fs-list tbody tr .fs-list-col.row-actions .row-inline-action,::ng-deep .fs-list tbody .fs-list-row td.row-actions .row-inline-action,::ng-deep .fs-list tbody .fs-list-row th.row-actions .row-inline-action,::ng-deep .fs-list tbody .fs-list-row .fs-list-col.row-actions .row-inline-action,::ng-deep .fs-list tfoot tr td.row-actions .row-inline-action,::ng-deep .fs-list tfoot tr th.row-actions .row-inline-action,::ng-deep .fs-list tfoot tr .fs-list-col.row-actions .row-inline-action,::ng-deep .fs-list tfoot .fs-list-row td.row-actions .row-inline-action,::ng-deep .fs-list tfoot .fs-list-row th.row-actions .row-inline-action,::ng-deep .fs-list tfoot .fs-list-row .fs-list-col.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-head tr td.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-head tr th.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-head tr .fs-list-col.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-head .fs-list-row td.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-head .fs-list-row th.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-head .fs-list-row .fs-list-col.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-body tr td.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-body tr th.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-body tr .fs-list-col.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-body .fs-list-row td.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-body .fs-list-row th.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-body .fs-list-row .fs-list-col.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-footer tr td.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-footer tr th.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-footer tr .fs-list-col.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-footer .fs-list-row td.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-footer .fs-list-row th.row-actions .row-inline-action,::ng-deep .fs-list .fs-list-footer .fs-list-row .fs-list-col.row-actions .row-inline-action{margin-left:12px;display:inline-block}::ng-deep .fs-list thead tr td.row-actions .row-inline-action:first-child,::ng-deep .fs-list thead tr th.row-actions .row-inline-action:first-child,::ng-deep .fs-list thead tr .fs-list-col.row-actions .row-inline-action:first-child,::ng-deep .fs-list thead .fs-list-row td.row-actions .row-inline-action:first-child,::ng-deep .fs-list thead .fs-list-row th.row-actions .row-inline-action:first-child,::ng-deep .fs-list thead .fs-list-row .fs-list-col.row-actions .row-inline-action:first-child,::ng-deep .fs-list tbody tr td.row-actions .row-inline-action:first-child,::ng-deep .fs-list tbody tr th.row-actions .row-inline-action:first-child,::ng-deep .fs-list tbody tr .fs-list-col.row-actions .row-inline-action:first-child,::ng-deep .fs-list tbody .fs-list-row td.row-actions .row-inline-action:first-child,::ng-deep .fs-list tbody .fs-list-row th.row-actions .row-inline-action:first-child,::ng-deep .fs-list tbody .fs-list-row .fs-list-col.row-actions .row-inline-action:first-child,::ng-deep .fs-list tfoot tr td.row-actions .row-inline-action:first-child,::ng-deep .fs-list tfoot tr th.row-actions .row-inline-action:first-child,::ng-deep .fs-list tfoot tr .fs-list-col.row-actions .row-inline-action:first-child,::ng-deep .fs-list tfoot .fs-list-row td.row-actions .row-inline-action:first-child,::ng-deep .fs-list tfoot .fs-list-row th.row-actions .row-inline-action:first-child,::ng-deep .fs-list tfoot .fs-list-row .fs-list-col.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-head tr td.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-head tr th.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-head tr .fs-list-col.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-head .fs-list-row td.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-head .fs-list-row th.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-head .fs-list-row .fs-list-col.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-body tr td.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-body tr th.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-body tr .fs-list-col.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-body .fs-list-row td.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-body .fs-list-row th.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-body .fs-list-row .fs-list-col.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-footer tr td.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-footer tr th.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-footer tr .fs-list-col.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-footer .fs-list-row td.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-footer .fs-list-row th.row-actions .row-inline-action:first-child,::ng-deep .fs-list .fs-list-footer .fs-list-row .fs-list-col.row-actions .row-inline-action:first-child{margin-left:0}::ng-deep .fs-list thead tr td.row-actions .row-inline-action-icon,::ng-deep .fs-list thead tr td.row-actions .row-inline-action-fab,::ng-deep .fs-list thead tr td.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list thead tr td.row-actions .row-menu-action,::ng-deep .fs-list thead tr th.row-actions .row-inline-action-icon,::ng-deep .fs-list thead tr th.row-actions .row-inline-action-fab,::ng-deep .fs-list thead tr th.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list thead tr th.row-actions .row-menu-action,::ng-deep .fs-list thead tr .fs-list-col.row-actions .row-inline-action-icon,::ng-deep .fs-list thead tr .fs-list-col.row-actions .row-inline-action-fab,::ng-deep .fs-list thead tr .fs-list-col.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list thead tr .fs-list-col.row-actions .row-menu-action,::ng-deep .fs-list thead .fs-list-row td.row-actions .row-inline-action-icon,::ng-deep .fs-list thead .fs-list-row td.row-actions .row-inline-action-fab,::ng-deep .fs-list thead .fs-list-row td.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list thead .fs-list-row td.row-actions .row-menu-action,::ng-deep .fs-list thead .fs-list-row th.row-actions .row-inline-action-icon,::ng-deep .fs-list thead .fs-list-row th.row-actions .row-inline-action-fab,::ng-deep .fs-list thead .fs-list-row th.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list thead .fs-list-row th.row-actions .row-menu-action,::ng-deep .fs-list thead .fs-list-row .fs-list-col.row-actions .row-inline-action-icon,::ng-deep .fs-list thead .fs-list-row .fs-list-col.row-actions .row-inline-action-fab,::ng-deep .fs-list thead .fs-list-row .fs-list-col.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list thead .fs-list-row .fs-list-col.row-actions .row-menu-action,::ng-deep .fs-list tbody tr td.row-actions .row-inline-action-icon,::ng-deep .fs-list tbody tr td.row-actions .row-inline-action-fab,::ng-deep .fs-list tbody tr td.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list tbody tr td.row-actions .row-menu-action,::ng-deep .fs-list tbody tr th.row-actions .row-inline-action-icon,::ng-deep .fs-list tbody tr th.row-actions .row-inline-action-fab,::ng-deep .fs-list tbody tr th.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list tbody tr th.row-actions .row-menu-action,::ng-deep .fs-list tbody tr .fs-list-col.row-actions .row-inline-action-icon,::ng-deep .fs-list tbody tr .fs-list-col.row-actions .row-inline-action-fab,::ng-deep .fs-list tbody tr .fs-list-col.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list tbody tr .fs-list-col.row-actions .row-menu-action,::ng-deep .fs-list tbody .fs-list-row td.row-actions .row-inline-action-icon,::ng-deep .fs-list tbody .fs-list-row td.row-actions .row-inline-action-fab,::ng-deep .fs-list tbody .fs-list-row td.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list tbody .fs-list-row td.row-actions .row-menu-action,::ng-deep .fs-list tbody .fs-list-row th.row-actions .row-inline-action-icon,::ng-deep .fs-list tbody .fs-list-row th.row-actions .row-inline-action-fab,::ng-deep .fs-list tbody .fs-list-row th.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list tbody .fs-list-row th.row-actions .row-menu-action,::ng-deep .fs-list tbody .fs-list-row .fs-list-col.row-actions .row-inline-action-icon,::ng-deep .fs-list tbody .fs-list-row .fs-list-col.row-actions .row-inline-action-fab,::ng-deep .fs-list tbody .fs-list-row .fs-list-col.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list tbody .fs-list-row .fs-list-col.row-actions .row-menu-action,::ng-deep .fs-list tfoot tr td.row-actions .row-inline-action-icon,::ng-deep .fs-list tfoot tr td.row-actions .row-inline-action-fab,::ng-deep .fs-list tfoot tr td.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list tfoot tr td.row-actions .row-menu-action,::ng-deep .fs-list tfoot tr th.row-actions .row-inline-action-icon,::ng-deep .fs-list tfoot tr th.row-actions .row-inline-action-fab,::ng-deep .fs-list tfoot tr th.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list tfoot tr th.row-actions .row-menu-action,::ng-deep .fs-list tfoot tr .fs-list-col.row-actions .row-inline-action-icon,::ng-deep .fs-list tfoot tr .fs-list-col.row-actions .row-inline-action-fab,::ng-deep .fs-list tfoot tr .fs-list-col.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list tfoot tr .fs-list-col.row-actions .row-menu-action,::ng-deep .fs-list tfoot .fs-list-row td.row-actions .row-inline-action-icon,::ng-deep .fs-list tfoot .fs-list-row td.row-actions .row-inline-action-fab,::ng-deep .fs-list tfoot .fs-list-row td.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list tfoot .fs-list-row td.row-actions .row-menu-action,::ng-deep .fs-list tfoot .fs-list-row th.row-actions .row-inline-action-icon,::ng-deep .fs-list tfoot .fs-list-row th.row-actions .row-inline-action-fab,::ng-deep .fs-list tfoot .fs-list-row th.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list tfoot .fs-list-row th.row-actions .row-menu-action,::ng-deep .fs-list tfoot .fs-list-row .fs-list-col.row-actions .row-inline-action-icon,::ng-deep .fs-list tfoot .fs-list-row .fs-list-col.row-actions .row-inline-action-fab,::ng-deep .fs-list tfoot .fs-list-row .fs-list-col.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list tfoot .fs-list-row .fs-list-col.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-head tr td.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-head tr td.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-head tr td.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-head tr td.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-head tr th.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-head tr th.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-head tr th.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-head tr th.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-head tr .fs-list-col.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-head tr .fs-list-col.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-head tr .fs-list-col.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-head tr .fs-list-col.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-head .fs-list-row td.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-head .fs-list-row td.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-head .fs-list-row td.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-head .fs-list-row td.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-head .fs-list-row th.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-head .fs-list-row th.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-head .fs-list-row th.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-head .fs-list-row th.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-head .fs-list-row .fs-list-col.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-head .fs-list-row .fs-list-col.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-head .fs-list-row .fs-list-col.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-head .fs-list-row .fs-list-col.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-body tr td.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-body tr td.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-body tr td.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-body tr td.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-body tr th.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-body tr th.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-body tr th.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-body tr th.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-body tr .fs-list-col.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-body tr .fs-list-col.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-body tr .fs-list-col.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-body tr .fs-list-col.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-body .fs-list-row td.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-body .fs-list-row td.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-body .fs-list-row td.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-body .fs-list-row td.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-body .fs-list-row th.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-body .fs-list-row th.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-body .fs-list-row th.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-body .fs-list-row th.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-body .fs-list-row .fs-list-col.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-body .fs-list-row .fs-list-col.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-body .fs-list-row .fs-list-col.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-body .fs-list-row .fs-list-col.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-footer tr td.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-footer tr td.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-footer tr td.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-footer tr td.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-footer tr th.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-footer tr th.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-footer tr th.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-footer tr th.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-footer tr .fs-list-col.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-footer tr .fs-list-col.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-footer tr .fs-list-col.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-footer tr .fs-list-col.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-footer .fs-list-row td.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-footer .fs-list-row td.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-footer .fs-list-row td.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-footer .fs-list-row td.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-footer .fs-list-row th.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-footer .fs-list-row th.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-footer .fs-list-row th.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-footer .fs-list-row th.row-actions .row-menu-action,::ng-deep .fs-list .fs-list-footer .fs-list-row .fs-list-col.row-actions .row-inline-action-icon,::ng-deep .fs-list .fs-list-footer .fs-list-row .fs-list-col.row-actions .row-inline-action-fab,::ng-deep .fs-list .fs-list-footer .fs-list-row .fs-list-col.row-actions .row-inline-action-mini-fab,::ng-deep .fs-list .fs-list-footer .fs-list-row .fs-list-col.row-actions .row-menu-action{width:35px;justify-content:center;align-items:center}::ng-deep .fs-list thead tr td.left,::ng-deep .fs-list thead tr th.left,::ng-deep .fs-list thead tr .fs-list-col.left,::ng-deep .fs-list thead .fs-list-row td.left,::ng-deep .fs-list thead .fs-list-row th.left,::ng-deep .fs-list thead .fs-list-row .fs-list-col.left,::ng-deep .fs-list tbody tr td.left,::ng-deep .fs-list tbody tr th.left,::ng-deep .fs-list tbody tr .fs-list-col.left,::ng-deep .fs-list tbody .fs-list-row td.left,::ng-deep .fs-list tbody .fs-list-row th.left,::ng-deep .fs-list tbody .fs-list-row .fs-list-col.left,::ng-deep .fs-list tfoot tr td.left,::ng-deep .fs-list tfoot tr th.left,::ng-deep .fs-list tfoot tr .fs-list-col.left,::ng-deep .fs-list tfoot .fs-list-row td.left,::ng-deep .fs-list tfoot .fs-list-row th.left,::ng-deep .fs-list tfoot .fs-list-row .fs-list-col.left,::ng-deep .fs-list .fs-list-head tr td.left,::ng-deep .fs-list .fs-list-head tr th.left,::ng-deep .fs-list .fs-list-head tr .fs-list-col.left,::ng-deep .fs-list .fs-list-head .fs-list-row td.left,::ng-deep .fs-list .fs-list-head .fs-list-row th.left,::ng-deep .fs-list .fs-list-head .fs-list-row .fs-list-col.left,::ng-deep .fs-list .fs-list-body tr td.left,::ng-deep .fs-list .fs-list-body tr th.left,::ng-deep .fs-list .fs-list-body tr .fs-list-col.left,::ng-deep .fs-list .fs-list-body .fs-list-row td.left,::ng-deep .fs-list .fs-list-body .fs-list-row th.left,::ng-deep .fs-list .fs-list-body .fs-list-row .fs-list-col.left,::ng-deep .fs-list .fs-list-footer tr td.left,::ng-deep .fs-list .fs-list-footer tr th.left,::ng-deep .fs-list .fs-list-footer tr .fs-list-col.left,::ng-deep .fs-list .fs-list-footer .fs-list-row td.left,::ng-deep .fs-list .fs-list-footer .fs-list-row th.left,::ng-deep .fs-list .fs-list-footer .fs-list-row .fs-list-col.left{text-align:left}::ng-deep .fs-list thead tr td.center,::ng-deep .fs-list thead tr th.center,::ng-deep .fs-list thead tr .fs-list-col.center,::ng-deep .fs-list thead .fs-list-row td.center,::ng-deep .fs-list thead .fs-list-row th.center,::ng-deep .fs-list thead .fs-list-row .fs-list-col.center,::ng-deep .fs-list tbody tr td.center,::ng-deep .fs-list tbody tr th.center,::ng-deep .fs-list tbody tr .fs-list-col.center,::ng-deep .fs-list tbody .fs-list-row td.center,::ng-deep .fs-list tbody .fs-list-row th.center,::ng-deep .fs-list tbody .fs-list-row .fs-list-col.center,::ng-deep .fs-list tfoot tr td.center,::ng-deep .fs-list tfoot tr th.center,::ng-deep .fs-list tfoot tr .fs-list-col.center,::ng-deep .fs-list tfoot .fs-list-row td.center,::ng-deep .fs-list tfoot .fs-list-row th.center,::ng-deep .fs-list tfoot .fs-list-row .fs-list-col.center,::ng-deep .fs-list .fs-list-head tr td.center,::ng-deep .fs-list .fs-list-head tr th.center,::ng-deep .fs-list .fs-list-head tr .fs-list-col.center,::ng-deep .fs-list .fs-list-head .fs-list-row td.center,::ng-deep .fs-list .fs-list-head .fs-list-row th.center,::ng-deep .fs-list .fs-list-head .fs-list-row .fs-list-col.center,::ng-deep .fs-list .fs-list-body tr td.center,::ng-deep .fs-list .fs-list-body tr th.center,::ng-deep .fs-list .fs-list-body tr .fs-list-col.center,::ng-deep .fs-list .fs-list-body .fs-list-row td.center,::ng-deep .fs-list .fs-list-body .fs-list-row th.center,::ng-deep .fs-list .fs-list-body .fs-list-row .fs-list-col.center,::ng-deep .fs-list .fs-list-footer tr td.center,::ng-deep .fs-list .fs-list-footer tr th.center,::ng-deep .fs-list .fs-list-footer tr .fs-list-col.center,::ng-deep .fs-list .fs-list-footer .fs-list-row td.center,::ng-deep .fs-list .fs-list-footer .fs-list-row th.center,::ng-deep .fs-list .fs-list-footer .fs-list-row .fs-list-col.center{text-align:center}::ng-deep .fs-list thead tr td.right,::ng-deep .fs-list thead tr th.right,::ng-deep .fs-list thead tr .fs-list-col.right,::ng-deep .fs-list thead .fs-list-row td.right,::ng-deep .fs-list thead .fs-list-row th.right,::ng-deep .fs-list thead .fs-list-row .fs-list-col.right,::ng-deep .fs-list tbody tr td.right,::ng-deep .fs-list tbody tr th.right,::ng-deep .fs-list tbody tr .fs-list-col.right,::ng-deep .fs-list tbody .fs-list-row td.right,::ng-deep .fs-list tbody .fs-list-row th.right,::ng-deep .fs-list tbody .fs-list-row .fs-list-col.right,::ng-deep .fs-list tfoot tr td.right,::ng-deep .fs-list tfoot tr th.right,::ng-deep .fs-list tfoot tr .fs-list-col.right,::ng-deep .fs-list tfoot .fs-list-row td.right,::ng-deep .fs-list tfoot .fs-list-row th.right,::ng-deep .fs-list tfoot .fs-list-row .fs-list-col.right,::ng-deep .fs-list .fs-list-head tr td.right,::ng-deep .fs-list .fs-list-head tr th.right,::ng-deep .fs-list .fs-list-head tr .fs-list-col.right,::ng-deep .fs-list .fs-list-head .fs-list-row td.right,::ng-deep .fs-list .fs-list-head .fs-list-row th.right,::ng-deep .fs-list .fs-list-head .fs-list-row .fs-list-col.right,::ng-deep .fs-list .fs-list-body tr td.right,::ng-deep .fs-list .fs-list-body tr th.right,::ng-deep .fs-list .fs-list-body tr .fs-list-col.right,::ng-deep .fs-list .fs-list-body .fs-list-row td.right,::ng-deep .fs-list .fs-list-body .fs-list-row th.right,::ng-deep .fs-list .fs-list-body .fs-list-row .fs-list-col.right,::ng-deep .fs-list .fs-list-footer tr td.right,::ng-deep .fs-list .fs-list-footer tr th.right,::ng-deep .fs-list .fs-list-footer tr .fs-list-col.right,::ng-deep .fs-list .fs-list-footer .fs-list-row td.right,::ng-deep .fs-list .fs-list-footer .fs-list-row th.right,::ng-deep .fs-list .fs-list-footer .fs-list-row .fs-list-col.right{text-align:right}::ng-deep .fs-list thead tr.draggable,::ng-deep .fs-list thead .fs-list-row.draggable,::ng-deep .fs-list tbody tr.draggable,::ng-deep .fs-list tbody .fs-list-row.draggable,::ng-deep .fs-list tfoot tr.draggable,::ng-deep .fs-list tfoot .fs-list-row.draggable,::ng-deep .fs-list .fs-list-head tr.draggable,::ng-deep .fs-list .fs-list-head .fs-list-row.draggable,::ng-deep .fs-list .fs-list-body tr.draggable,::ng-deep .fs-list .fs-list-body .fs-list-row.draggable,::ng-deep .fs-list .fs-list-footer tr.draggable,::ng-deep .fs-list .fs-list-footer .fs-list-row.draggable{position:fixed;z-index:9999;box-shadow:2px 2px 2px #9e9e9ea6;border-radius:5px;background-color:#f6f6f6}::ng-deep .fs-list thead tr.draggable td,::ng-deep .fs-list thead tr.draggable .fs-list-col,::ng-deep .fs-list thead .fs-list-row.draggable td,::ng-deep .fs-list thead .fs-list-row.draggable .fs-list-col,::ng-deep .fs-list tbody tr.draggable td,::ng-deep .fs-list tbody tr.draggable .fs-list-col,::ng-deep .fs-list tbody .fs-list-row.draggable td,::ng-deep .fs-list tbody .fs-list-row.draggable .fs-list-col,::ng-deep .fs-list tfoot tr.draggable td,::ng-deep .fs-list tfoot tr.draggable .fs-list-col,::ng-deep .fs-list tfoot .fs-list-row.draggable td,::ng-deep .fs-list tfoot .fs-list-row.draggable .fs-list-col,::ng-deep .fs-list .fs-list-head tr.draggable td,::ng-deep .fs-list .fs-list-head tr.draggable .fs-list-col,::ng-deep .fs-list .fs-list-head .fs-list-row.draggable td,::ng-deep .fs-list .fs-list-head .fs-list-row.draggable .fs-list-col,::ng-deep .fs-list .fs-list-body tr.draggable td,::ng-deep .fs-list .fs-list-body tr.draggable .fs-list-col,::ng-deep .fs-list .fs-list-body .fs-list-row.draggable td,::ng-deep .fs-list .fs-list-body .fs-list-row.draggable .fs-list-col,::ng-deep .fs-list .fs-list-footer tr.draggable td,::ng-deep .fs-list .fs-list-footer tr.draggable .fs-list-col,::ng-deep .fs-list .fs-list-footer .fs-list-row.draggable td,::ng-deep .fs-list .fs-list-footer .fs-list-row.draggable .fs-list-col{border:none}::ng-deep .fs-list .fs-list-container.has-dragging thead th{border-bottom:2px solid #ddd}::ng-deep .fs-list .fs-list-container.has-dragging tbody tr:nth-child(2) td{border-top:none}::ng-deep .fs-list tfoot td{padding:8px}::ng-deep .reorder-in-progress{-webkit-user-select:none;user-select:none}::ng-deep .draggable-elem td{opacity:.2}::ng-deep .hidden-mobile-menu-action{display:none!important}::ng-deep .hidden-mobile{display:none!important}@media only screen and (max-width: 600px){::ng-deep .fs-list-filter .inline-actions{top:initial!important;position:initial!important}::ng-deep .fs-list-filter .inline-actions .action-filter{margin-bottom:0!important}::ng-deep .fs-list-header .filter-input-field .mat-form-field-wrapper{padding:0!important}::ng-deep .fs-list-header.has-filters{flex-flow:row wrap}}@media only screen and (max-width: 768px){::ng-deep .show-mobile{display:inline-block!important}::ng-deep .fs-list-actions .action-button{display:none}::ng-deep .row-inline-action.mobile-hide{display:none}::ng-deep .hidden-mobile-menu-action{display:block!important}}\n"], components: [{ type: i2__namespace$2.FilterComponent, selector: "fs-filter", inputs: ["config", "filter", "showSortBy", "showFilterInput"], outputs: ["closed", "opened", "ready"] }, { type: FsStatusComponent, selector: "fs-list-status", inputs: ["paging", "sorting", "rows", "scrollable", "firstLoad"] }, { type: FsHeadComponent, selector: "[fs-list-head]", inputs: ["sorting", "columns", "hasRowActions", "selection"] }, { type: FsBodyComponent, selector: "[fs-list-body]", inputs: ["rows", "columns", "hasFooter", "rowActionsRaw", "groupActionsRaw", "rowEvents", "rowClass", "hasRowActions", "selection", "restoreMode", "rowRemoved"] }, { type: FsFooterComponent, selector: "[fs-list-footer]", inputs: ["hasRowActions", "columns", "selection"] }, { type: FsListLoaderComponent, selector: "fs-list-loader", inputs: ["columns", "loaderLines"] }, { type: FsPaginationComponent, selector: "fs-list-pagination", inputs: ["pagination", "rows"] }], directives: [{ type: i3__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3__namespace$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace$2.FilterStatusBarDirective, selector: "[fsFilterStatusBar]" }, { type: FsListContentInitDirective, selector: "[fsListContentInit]", inputs: ["fsListContentInit"] }, { type: FsListDraggableListDirective, selector: "[fsListDraggableList]", inputs: ["rows"] }, { type: FsListFooterDirective, selector: "[fs-list-footer]", inputs: ["colspan", "align", "class"] }], pipes: { "async": i3__namespace$1.AsyncPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsListComponent, decorators: [{
                 type: i0.Component,
                 args: [{
                         selector: 'fs-list',
                         templateUrl: 'list.component.html',
-                        styleUrls: [
-                            './list.component.scss',
-                        ],
+                        styleUrls: ['./list.component.scss'],
                         changeDetection: i0.ChangeDetectionStrategy.OnPush,
                         providers: [
                             GroupExpandNotifierService,
@@ -6377,18 +6599,18 @@
                         ]
                     }]
             }], ctorParameters: function () {
-            return [{ type: ReorderController }, { type: i0__namespace.ElementRef }, { type: undefined, decorators: [{
+            return [{ type: ReorderController }, { type: undefined, decorators: [{
                             type: i0.Optional
                         }, {
                             type: i0.Inject,
                             args: [FS_LIST_DEFAULT_CONFIG]
                         }] }, { type: i2__namespace$4.FsScrollService, decorators: [{
                             type: i0.Optional
-                        }] }, { type: i3__namespace$3.SelectionDialog }, { type: i4__namespace.MatDialog }, { type: i0__namespace.ChangeDetectorRef }, { type: GroupExpandNotifierService }, { type: i6__namespace$1.Router }, { type: i6__namespace$1.ActivatedRoute }, { type: PersistanceController }, { type: i3__namespace$1.Location }, { type: i4__namespace.MatDialogRef, decorators: [{
+                        }] }, { type: i1__namespace.MatDialogRef, decorators: [{
                             type: i0.Optional
-                        }] }, { type: i9__namespace.DrawerRef, decorators: [{
+                        }] }, { type: i4__namespace$2.DrawerRef, decorators: [{
                             type: i0.Optional
-                        }] }];
+                        }] }, { type: i0__namespace.ElementRef }, { type: i5__namespace.SelectionDialog }, { type: i1__namespace.MatDialog }, { type: i0__namespace.ChangeDetectorRef }, { type: GroupExpandNotifierService }, { type: i7__namespace.Router }, { type: i7__namespace.ActivatedRoute }, { type: PersistanceController }, { type: i3__namespace$1.Location }];
         }, propDecorators: { classFsList: [{
                     type: i0.HostBinding,
                     args: ['class.fs-list']
@@ -6408,6 +6630,12 @@
                 }], _emptyStateTemplate: [{
                     type: i0.ContentChild,
                     args: [FsListEmptyStateDirective, { read: i0.TemplateRef }]
+                }], headingTemplate: [{
+                    type: i0.ContentChild,
+                    args: [FsListHeadingDirective, { read: i0.TemplateRef }]
+                }], subheadingTemplate: [{
+                    type: i0.ContentChild,
+                    args: [FsListSubheadingDirective, { read: i0.TemplateRef }]
                 }] } });
 
     var FsListManageSavedFiltersComponent = /** @class */ (function () {
@@ -6433,7 +6661,6 @@
                 paging: false,
                 reorder: {
                     position: exports.ReorderPosition.Left,
-                    strategy: exports.ReorderStrategy.Always,
                     moveDrop: function () {
                         return _this._reorderReady;
                     },
@@ -6476,7 +6703,7 @@
         return FsListManageSavedFiltersComponent;
     }());
     FsListManageSavedFiltersComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsListManageSavedFiltersComponent, deps: [{ token: i2__namespace$2.ExternalParamsController }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    FsListManageSavedFiltersComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsListManageSavedFiltersComponent, selector: "ng-component", ngImport: i0__namespace, template: "<h1 mat-dialog-title>\n  Manage Saved Filters\n</h1>\n<div mat-dialog-content>\n  <fs-list [config]=\"config\">\n    <fs-list-column name=\"name\" title=\"Name\">\n      <ng-template fs-list-cell let-row=\"row\">\n        {{ row.name }}\n      </ng-template>\n    </fs-list-column>\n  </fs-list>\n</div>\n<div mat-dialog-actions>\n  <button mat-button\n          [mat-dialog-close]=\"null\"\n          type=\"button\"\n          color=\"primary\">\n    Done\n  </button>\n</div>\n", components: [{ type: FsListComponent, selector: "fs-list", inputs: ["config", "loaderLines"], outputs: ["filtersReady"] }, { type: i2__namespace$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i4__namespace.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i4__namespace.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: FsListColumnDirective, selector: "fs-list-column", inputs: ["show", "title", "name", "customize", "sortable", "sortableDefault", "direction", "align", "width", "class"] }, { type: FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }, { type: i4__namespace.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i4__namespace.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["type", "mat-dialog-close", "aria-label", "matDialogClose"], exportAs: ["matDialogClose"] }] });
+    FsListManageSavedFiltersComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsListManageSavedFiltersComponent, selector: "ng-component", ngImport: i0__namespace, template: "<h1 mat-dialog-title>\n  Manage Saved Filters\n</h1>\n<div mat-dialog-content>\n  <fs-list [config]=\"config\">\n    <fs-list-column name=\"name\" title=\"Name\">\n      <ng-template fs-list-cell let-row=\"row\">\n        {{ row.name }}\n      </ng-template>\n    </fs-list-column>\n  </fs-list>\n</div>\n<div mat-dialog-actions>\n  <button mat-button\n          [mat-dialog-close]=\"null\"\n          type=\"button\"\n          color=\"primary\">\n    Done\n  </button>\n</div>\n", components: [{ type: FsListComponent, selector: "fs-list", inputs: ["config", "loaderLines"], outputs: ["filtersReady"] }, { type: i2__namespace$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i1__namespace.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1__namespace.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: FsListColumnDirective, selector: "fs-list-column", inputs: ["show", "title", "name", "customize", "sortable", "sortableDefault", "direction", "align", "width", "class"] }, { type: FsListCellDirective, selector: "[fs-list-cell]", inputs: ["colspan", "align", "class"] }, { type: i1__namespace.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }, { type: i1__namespace.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["type", "mat-dialog-close", "aria-label", "matDialogClose"], exportAs: ["matDialogClose"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsListManageSavedFiltersComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -6551,25 +6778,28 @@
             FsListEmptyStateDirective,
             FsListContentDirective,
             FsListContentInitDirective,
+            FsListSubheadingDirective,
+            FsListHeadingDirective,
             // Dialog
-            CustomizeColsDialogComponent
+            CustomizeColsDialogComponent,
+            //Pipes
+            ActionLabelPipe
         ], imports: [i3$1.CommonModule,
-            i6$1.RouterModule,
+            i7.RouterModule,
             i2$2.MatButtonModule,
             i3.MatIconModule,
             menu.MatMenuModule,
             progressSpinner.MatProgressSpinnerModule,
             i2$1.MatCheckboxModule,
-            i4$2.MatRippleModule,
+            i3$2.MatRippleModule,
             i2.FsFilterModule,
             i2$3.FsMenuModule,
-            flexLayout.FlexLayoutModule,
             i2$4.FsScrollModule,
-            i1$1.FsPromptModule,
-            i4.MatDialogModule,
+            i1$2.FsPromptModule,
+            i1.MatDialogModule,
             i6.MatTooltipModule,
-            i4$1.FsFileModule,
-            i5$1.FsCommonModule], exports: [FsListComponent,
+            i4.FsFileModule,
+            i4$1.FsCommonModule], exports: [FsListComponent,
             FsRowComponent,
             FsCellComponent,
             FsListLoaderComponent,
@@ -6581,47 +6811,47 @@
             FsListGroupFooterDirective,
             FsListGroupExpandTriggerDirective,
             FsListEmptyStateDirective,
-            FsListContentDirective] });
-    FsListModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsListModule, providers: [], imports: [[
+            FsListContentDirective,
+            FsListSubheadingDirective,
+            FsListHeadingDirective] });
+    FsListModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsListModule, imports: [[
                 i3$1.CommonModule,
-                i6$1.RouterModule,
+                i7.RouterModule,
                 i2$2.MatButtonModule,
                 i3.MatIconModule,
                 menu.MatMenuModule,
                 progressSpinner.MatProgressSpinnerModule,
                 i2$1.MatCheckboxModule,
-                i4$2.MatRippleModule,
+                i3$2.MatRippleModule,
                 i2.FsFilterModule,
                 i2$3.FsMenuModule,
-                flexLayout.FlexLayoutModule,
                 i2$4.FsScrollModule,
-                i1$1.FsPromptModule,
-                i4.MatDialogModule,
+                i1$2.FsPromptModule,
+                i1.MatDialogModule,
                 i6.MatTooltipModule,
-                i4$1.FsFileModule,
-                i5$1.FsCommonModule,
+                i4.FsFileModule,
+                i4$1.FsCommonModule,
             ]] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: FsListModule, decorators: [{
                 type: i0.NgModule,
                 args: [{
                         imports: [
                             i3$1.CommonModule,
-                            i6$1.RouterModule,
+                            i7.RouterModule,
                             i2$2.MatButtonModule,
                             i3.MatIconModule,
                             menu.MatMenuModule,
                             progressSpinner.MatProgressSpinnerModule,
                             i2$1.MatCheckboxModule,
-                            i4$2.MatRippleModule,
+                            i3$2.MatRippleModule,
                             i2.FsFilterModule,
                             i2$3.FsMenuModule,
-                            flexLayout.FlexLayoutModule,
                             i2$4.FsScrollModule,
-                            i1$1.FsPromptModule,
-                            i4.MatDialogModule,
+                            i1$2.FsPromptModule,
+                            i1.MatDialogModule,
                             i6.MatTooltipModule,
-                            i4$1.FsFileModule,
-                            i5$1.FsCommonModule,
+                            i4.FsFileModule,
+                            i4$1.FsCommonModule,
                         ],
                         declarations: [
                             // Components
@@ -6656,10 +6886,13 @@
                             FsListEmptyStateDirective,
                             FsListContentDirective,
                             FsListContentInitDirective,
+                            FsListSubheadingDirective,
+                            FsListHeadingDirective,
                             // Dialog
                             CustomizeColsDialogComponent,
+                            //Pipes
+                            ActionLabelPipe,
                         ],
-                        providers: [],
                         exports: [
                             FsListComponent,
                             FsRowComponent,
@@ -6674,6 +6907,8 @@
                             FsListGroupExpandTriggerDirective,
                             FsListEmptyStateDirective,
                             FsListContentDirective,
+                            FsListSubheadingDirective,
+                            FsListHeadingDirective,
                         ],
                     }]
             }] });
@@ -6709,8 +6944,10 @@
     exports.FsListGroupFooterDirective = FsListGroupFooterDirective;
     exports.FsListGroupHeaderDirective = FsListGroupHeaderDirective;
     exports.FsListHeaderDirective = FsListHeaderDirective;
+    exports.FsListHeadingDirective = FsListHeadingDirective;
     exports.FsListLoaderComponent = FsListLoaderComponent;
     exports.FsListModule = FsListModule;
+    exports.FsListSubheadingDirective = FsListSubheadingDirective;
     exports.FsPaginationComponent = FsPaginationComponent;
     exports.FsRowComponent = FsRowComponent;
     exports.FsStatusComponent = FsStatusComponent;