@firestitch/list 9.12.1 → 9.12.4

package/fesm5/firestitch-list.js

@@ -18,7 +18,7 @@ import { FsPrompt, FsPromptModule } from '@firestitch/prompt';
 import { FsFileModule } from '@firestitch/file';
 import { isString, isObject, isBoolean, isNumber, isFunction, get, cloneDeep, mergeWith, random, merge as merge$1 } from 'lodash-es';
 import { Subject, BehaviorSubject, Observable, merge, from, combineLatest, of } from 'rxjs';
-import { takeUntil, tap, take, map, debounceTime, switchMap, mapTo, catchError, distinctUntilChanged, shareReplay, skip, filter } from 'rxjs/operators';
+import { takeUntil, tap, distinctUntilChanged, take, map, debounceTime, switchMap, mapTo, catchError, shareReplay, skip, filter } from 'rxjs/operators';
 import { SelectionDialog } from '@firestitch/selection';
 import { getNormalizedPath } from '@firestitch/common';
 import { DrawerRef } from '@firestitch/drawer';
@@ -358,13 +358,13 @@ var RowAction = /** @class */ (function (_super) {
         };
         this._linkFn = value.link;
         if (value.file) {
-            if (value.file.select) {
-                this.fileUploadFn = function (selection, row, index) {
-                    value.file.select(selection, row, index);
+            this.fileConfig = __assign({}, value.file);
+            if (this.fileConfig.select) {
+                var selectFn_1 = this.fileConfig.select;
+                this.fileConfig.select = function (selection, row, index) {
+                    selectFn_1(selection, row, index);
                 };
             }
-            this.fileUploadErrorFn = value.file.error;
-            this.fileMultiple = value.file.multiple;
         }
         if (typeof value.label === 'function') {
             this._labelFn = value.label;
@@ -1423,27 +1423,24 @@ var PaginationStrategy;
     PaginationStrategy["None"] = "none";
 })(PaginationStrategy || (PaginationStrategy = {}));
 
-var PaginationController = /** @class */ (function (_super) {
-    __extends(PaginationController, _super);
+var PaginationController = /** @class */ (function () {
     function PaginationController() {
-        var _this = _super.call(this) || this;
-        _this.limit = 25;
-        _this.manual = false;
-        _this.page = 1; // Active page
-        _this.offset = 0;
+        this.limit = 25;
+        this.manual = false;
+        this.page = 1; // Active page
+        this.offset = 0;
         // public pagesArray = [];
-        _this.displayed = 0;
-        _this._pages$ = new BehaviorSubject(0); // Total pages
-        _this._strategy = PaginationStrategy.None;
-        _this._removedRows = 0;
-        _this._pageChanged$ = new Subject();
-        _this._pageReset$ = new Subject();
-        _this._onDestroy$ = new Subject();
-        _this._loadMoreEnabled = false;
-        _this._infinityScrollEnabled = false;
-        _this._loadMoreText = 'Load More';
-        _this._limits = [10, 25, 50, 100, 200];
-        return _this;
+        this.displayed = 0;
+        this._pages$ = new BehaviorSubject(0); // Total pages
+        this._strategy = PaginationStrategy.None;
+        this._removedRows = 0;
+        this._pageChanged$ = new Subject();
+        this._pageReset$ = new Subject();
+        this._onDestroy$ = new Subject();
+        this._loadMoreEnabled = false;
+        this._infinityScrollEnabled = false;
+        this._loadMoreText = 'Load More';
+        this._limits = [10, 25, 50, 100, 200];
     }
     Object.defineProperty(PaginationController.prototype, "pages", {
         get: function () {
@@ -1458,7 +1455,8 @@ var PaginationController = /** @class */ (function (_super) {
     });
     Object.defineProperty(PaginationController.prototype, "pages$", {
         get: function () {
-            return this._pages$.asObservable();
+            return this._pages$
+                .pipe(distinctUntilChanged());
         },
         enumerable: true,
         configurable: true
@@ -1529,6 +1527,22 @@ var PaginationController = /** @class */ (function (_super) {
         enumerable: true,
         configurable: true
     });
+    Object.defineProperty(PaginationController.prototype, "loadMoreQuery", {
+        get: function () {
+            switch (this.strategy) {
+                case PaginationStrategy.Page:
+                    return this.query;
+                case PaginationStrategy.Offset:
+                    var query = this.queryOffsetStrategy;
+                    query.limit = query.offset + query.limit;
+                    query.offset = 0;
+                    return query;
+            }
+            return {};
+        },
+        enumerable: true,
+        configurable: true
+    });
     Object.defineProperty(PaginationController.prototype, "queryPageStrategy", {
         /**
          * Query for Page Strategy
@@ -1691,12 +1705,6 @@ var PaginationController = /** @class */ (function (_super) {
         enumerable: true,
         configurable: true
     });
-    PaginationController.prototype._fromJSON = function (value) {
-        _super.prototype._fromJSON.call(this, value);
-        if (!value.limit) {
-            this.limit = 25;
-        }
-    };
     PaginationController.prototype.initWithConfig = function (config, loadMore, infinityScrollEnabled) {
         if (infinityScrollEnabled === void 0) { infinityScrollEnabled = false; }
         if (config) {
@@ -1706,12 +1714,12 @@ var PaginationController = /** @class */ (function (_super) {
             if (config.limit) {
                 this.limit = config.limit;
             }
-            if (loadMore) {
-                this.setLoadMore(loadMore);
-            }
-            this._infinityScrollEnabled = infinityScrollEnabled;
             this.strategy = config.strategy;
         }
+        if (loadMore) {
+            this.setLoadMore(loadMore);
+        }
+        this._infinityScrollEnabled = infinityScrollEnabled;
     };
     Object.defineProperty(PaginationController.prototype, "_hasPrevPagePageStrategy", {
         /**
@@ -1756,15 +1764,15 @@ var PaginationController = /** @class */ (function (_super) {
     /**
      * Update paging config and all related fields
      * @param config
-     * @param displayed
-     * @param loadMore
+     * @param displayedRecords
+     * @param loadMoreOperation
      */
-    PaginationController.prototype.updatePaging = function (config, displayed, loadMore) {
-        if (displayed === void 0) { displayed = 0; }
-        if (loadMore === void 0) { loadMore = false; }
-        if (!loadMore) {
-            this._fromJSON(config);
-            this.displayed = displayed;
+    PaginationController.prototype.updatePaging = function (config, displayedRecords, loadMoreOperation) {
+        if (displayedRecords === void 0) { displayedRecords = 0; }
+        if (loadMoreOperation === void 0) { loadMoreOperation = false; }
+        if (!loadMoreOperation) {
+            this._fromParams(config);
+            this.displayed = displayedRecords;
         }
         else {
             this.records = config.records;
@@ -1951,6 +1959,19 @@ var PaginationController = /** @class */ (function (_super) {
         this._onDestroy$.next();
         this._onDestroy$.complete();
     };
+    /**
+     * Update paging state
+     * @param params
+     */
+    PaginationController.prototype._fromParams = function (params) {
+        var _a;
+        if (!this.loadMoreEnabled) {
+            this.limit = (_a = params.limit, (_a !== null && _a !== void 0 ? _a : 25));
+        }
+        this.records = params.records;
+        this.manual = params.manual;
+        this.pages = params.pages || 0;
+    };
     /**
      * Calc and update offset
      */
@@ -1963,25 +1984,8 @@ var PaginationController = /** @class */ (function (_super) {
     PaginationController.prototype.updateTotalPages = function () {
         this.pages = Math.ceil(this.records / this.limit);
     };
-    __decorate([
-        Alias(),
-        __metadata("design:type", Object)
-    ], PaginationController.prototype, "limit", void 0);
-    __decorate([
-        Alias(),
-        __metadata("design:type", Number)
-    ], PaginationController.prototype, "records", void 0);
-    __decorate([
-        Alias(),
-        __metadata("design:type", Object)
-    ], PaginationController.prototype, "manual", void 0);
-    __decorate([
-        Alias('pages'),
-        __metadata("design:type", Number),
-        __metadata("design:paramtypes", [Number])
-    ], PaginationController.prototype, "pages", null);
     return PaginationController;
-}(Model));
+}());
 
 var SelectionChangeType;
 (function (SelectionChangeType) {
@@ -3201,9 +3205,18 @@ var List = /** @class */ (function (_super) {
             var _a;
             (_a = _this.selection) === null || _a === void 0 ? void 0 : _a.closeSelectionDialog();
         }), map(function (params) {
-            var query = _this.paging.hasOffsetStrategy && params && params.loadOffset
-                ? Object.assign({}, _this.filtersQuery, _this.paging.loadDeletedOffsetQuery)
-                : Object.assign({}, _this.filtersQuery, _this.paging.query);
+            var query = Object.assign({}, _this.filtersQuery);
+            if (_this.paging.hasOffsetStrategy && params && params.loadOffset) {
+                query = Object.assign(query, _this.paging.loadDeletedOffsetQuery);
+            }
+            else {
+                if (_this.initialFetch && _this.paging.loadMoreEnabled) {
+                    query = Object.assign(query, _this.paging.loadMoreQuery);
+                }
+                else {
+                    query = Object.assign(query, _this.paging.query);
+                }
+            }
             if (_this.sorting.sortingColumn) {
                 Object.assign(query, {
                     order: _this.sorting.sortingColumn.name + "," + _this.sorting.sortingColumn.direction
@@ -3230,6 +3243,7 @@ var List = /** @class */ (function (_super) {
             return source$;
         }), takeUntil(this.onDestroy$))
             .subscribe(function (response) {
+            _this.initialFetch = false;
             _this.completeFetch(response);
         });
     };
@@ -3445,7 +3459,7 @@ var List = /** @class */ (function (_super) {
             this.selection.selectedRowsIntersection(this.dataController.visibleRowsData);
         }
         if (((_c = this.emptyState) === null || _c === void 0 ? void 0 : _c.validate) && this.emptyStateTemplate) {
-            this.emptyStateEnabled = this.emptyState.validate(query, cloneDeep(response.data));
+            this.emptyStateEnabled = this.emptyState.validate(query, cloneDeep(this.dataController.visibleRowsData));
         }
         if (this.afterFetchFn) {
             this.afterFetchFn(query, this.dataController.visibleRowsData);
@@ -5679,7 +5693,7 @@ var FsRowActionsComponent = /** @class */ (function () {
     FsRowActionsComponent = __decorate([
         Component({
             selector: 'fs-list-row-actions',
-            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.fileUploadFn($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.fileUploadFn\"\n          [fileMultiple]=\"action.fileMultiple\"\n          (fileSelect)=\"action.fileUploadFn($event, row, index)\"\n          (fileError)=\"action.fileUploadErrorFn && action.fileUploadErrorFn($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.fileUploadFn\"\n                [fileMultiple]=\"subAction.fileMultiple\"\n                (fileSelect)=\"subAction.fileUploadFn($event, row, index)\"\n                (fileError)=\"subAction.fileUploadErrorFn && subAction.fileUploadErrorFn($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.fileUploadFn\"\n            [fileMultiple]=\"action.fileMultiple\"\n            (fileSelect)=\"action.fileUploadFn($event, row, index)\"\n            (fileError)=\"action.fileUploadErrorFn && action.fileUploadErrorFn($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",
+            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",
             changeDetection: ChangeDetectionStrategy.OnPush
         }),
         __metadata("design:paramtypes", [FsPrompt])
@@ -5717,7 +5731,7 @@ var FsRowInlineActionComponent = /** @class */ (function () {
     FsRowInlineActionComponent = __decorate([
         Component({
             selector: 'fs-list-row-inline-action',
-            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.fileUploadFn 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        [multiple]=\"action.fileMultiple\"\n        (select)=\"fileSelected($event)\"\n        (error)=\"action.fileUploadErrorFn && action.fileUploadErrorFn($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",
+            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",
             changeDetection: ChangeDetectionStrategy.OnPush
         }),
         __metadata("design:paramtypes", [FsPrompt])
@@ -5740,12 +5754,8 @@ var FsRowMenuActionComponent = /** @class */ (function () {
     ], FsRowMenuActionComponent.prototype, "label", void 0);
     __decorate([
         Input(),
-        __metadata("design:type", Boolean)
+        __metadata("design:type", Object)
     ], FsRowMenuActionComponent.prototype, "file", void 0);
-    __decorate([
-        Input(),
-        __metadata("design:type", Boolean)
-    ], FsRowMenuActionComponent.prototype, "fileMultiple", void 0);
     __decorate([
         Output(),
         __metadata("design:type", Object)
@@ -5757,7 +5767,7 @@ var FsRowMenuActionComponent = /** @class */ (function () {
     FsRowMenuActionComponent = __decorate([
         Component({
             selector: 'fs-list-row-menu-action',
-            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    [multiple]=\"fileMultiple\"\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",
+            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",
             changeDetection: ChangeDetectionStrategy.OnPush
         })
     ], FsRowMenuActionComponent);