@firestitch/list 9.11.1 → 9.12.1

package/fesm2015/firestitch-list.js

@@ -15,6 +15,7 @@ import { ItemType, FilterComponent, ExternalParamsController as ExternalParamsCo
 import { FsScrollService, FsScrollModule } from '@firestitch/scroll';
 import { FsMenuModule } from '@firestitch/menu';
 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';
@@ -325,6 +326,15 @@ class RowAction extends Model {
             return this.clickEvent(row, event, index, rowActionsRef, clickFn);
         };
         this._linkFn = value.link;
+        if (value.file) {
+            if (value.file.select) {
+                this.fileUploadFn = (selection, row, index) => {
+                    value.file.select(selection, row, index);
+                };
+            }
+            this.fileUploadErrorFn = value.file.error;
+            this.fileMultiple = value.file.multiple;
+        }
         if (typeof value.label === 'function') {
             this._labelFn = value.label;
             this.label = '';
@@ -344,7 +354,8 @@ class RowAction extends Model {
             this.rowActions.forEach((action) => {
                 action.checkShowStatus(row, index);
             });
-            this.isShown = this.rowActions.some((action) => action.isShown);
+            const groupVisible = !this.show || this.show(row, index);
+            this.isShown = groupVisible && this.rowActions.some((action) => action.isShown);
         }
         else if (this.show) {
             this.isShown = this.show(row, index);
@@ -2429,6 +2440,7 @@ class List extends Model {
         // Empty state
         this.emptyStateEnabled = false;
         this.onDestroy$ = new Subject();
+        this._filtersQuery = new BehaviorSubject(null);
         this._fromJSON(config);
         this.initialize(config);
         this._headerConfig = new StyleConfig(config.header);
@@ -2445,6 +2457,12 @@ class List extends Model {
     get hasSavedFilters() {
         return !!this.filterConfig.savedFilters;
     }
+    get filtersQuery() {
+        return this._filtersQuery.getValue();
+    }
+    get filtersQuery$() {
+        return this._filtersQuery.asObservable();
+    }
     fetchRemote(query) {
         const options = {
             state: this.dataController.operation,
@@ -2900,7 +2918,7 @@ class List extends Model {
         if (this.filterInitCb) {
             this.filterInitCb(filters);
         }
-        this.filtersQuery = filters;
+        this._filtersQuery.next(filters);
         this.checkRestoreFilter();
     }
     /**
@@ -2912,7 +2930,7 @@ class List extends Model {
         if (this.filterChangeCb) {
             this.filterChangeCb(filterQuery, filterSort);
         }
-        this.filtersQuery = filterQuery;
+        this._filtersQuery.next(filterQuery);
         this.restoreMode = false;
         // Restore option
         this.checkRestoreFilter();
@@ -3129,6 +3147,7 @@ let ReorderController = class ReorderController {
         this._enabled$ = new BehaviorSubject(false);
         this._manualReorderActivated$ = new BehaviorSubject(false);
         this._reorderDisabled$ = new BehaviorSubject(false);
+        this._numberOfActiveFilters = 0;
         this._destroy$ = new Subject();
     }
     get enabled() {
@@ -3148,13 +3167,17 @@ let ReorderController = class ReorderController {
         return this._enabled$
             .pipe(map((enabled) => {
             return enabled && this.position === ReorderPosition.Left;
-        }), distinctUntilChanged(), shareReplay(), takeUntil(this._destroy$));
+        }), map((enabled) => {
+            return enabled && this._numberOfActiveFilters === 0;
+        }), distinctUntilChanged(), shareReplay());
     }
     get rightReorderActivated$() {
         return this._enabled$
             .pipe(map((enabled) => {
             return enabled && this.position === ReorderPosition.Right;
-        }), distinctUntilChanged(), shareReplay(), takeUntil(this._destroy$));
+        }), map((enabled) => {
+            return enabled && this._numberOfActiveFilters === 0;
+        }), distinctUntilChanged(), shareReplay());
     }
     get reorderDisabled$() {
         return this._reorderDisabled$.asObservable();
@@ -3263,6 +3286,10 @@ let ReorderController = class ReorderController {
         this._reorderDisabled$.next(true);
         this._actionsController.updateDisabledState();
     }
+    setNunberOfActiveFilters(activeFilters) {
+        this._numberOfActiveFilters = activeFilters;
+        this.enabled = this.enabled;
+    }
 };
 ReorderController = __decorate([
     Injectable(),
@@ -3731,6 +3758,7 @@ let FsListComponent = class FsListComponent {
         this._updateCustomizeAction(listConfig.actions);
         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);
         if (this.listColumnDirectives) {
             this.list.tranformTemplatesToColumns(this.listColumnDirectives);
@@ -3803,6 +3831,16 @@ let FsListComponent = class FsListComponent {
             this.cdRef.markForCheck();
         });
     }
+    _listenFiltersQueryChange() {
+        this.list.filtersQuery$
+            .pipe(takeUntil(this.list.onDestroy$), takeUntil(this._destroy))
+            .subscribe((value) => {
+            if (value) {
+                const activeFilters = Object.keys(value).length;
+                this.reorderController.setNunberOfActiveFilters(activeFilters);
+            }
+        });
+    }
     _configMergeCustomizer(objValue, srcValue) {
         if (Array.isArray(objValue)) {
             return objValue;
@@ -5027,7 +5065,7 @@ __decorate([
 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    </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        <mat-icon *ngIf=\"action.icon\">{{action.icon}}</mat-icon>\n        {{action.label}}\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              <mat-icon *ngIf=\"subAction.icon\">{{subAction.icon}}</mat-icon>\n              {{subAction.label}}\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          <mat-icon *ngIf=\"action.icon\">{{action.icon}}</mat-icon>\n          {{action.label}}\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.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",
         changeDetection: ChangeDetectionStrategy.OnPush
     }),
     __metadata("design:paramtypes", [FsPrompt])
@@ -5037,10 +5075,14 @@ let FsRowInlineActionComponent = class FsRowInlineActionComponent {
     constructor(_fsPrompt) {
         this._fsPrompt = _fsPrompt;
         this.clicked = new EventEmitter();
+        this.fileSelect = new EventEmitter();
     }
     actionClick(event) {
         this.clicked.emit(event);
     }
+    fileSelected(event) {
+        this.fileSelect.emit(event);
+    }
 };
 FsRowInlineActionComponent.ctorParameters = () => [
     { type: FsPrompt }
@@ -5053,15 +5095,57 @@ __decorate([
     Output(),
     __metadata("design:type", Object)
 ], FsRowInlineActionComponent.prototype, "clicked", void 0);
+__decorate([
+    Output(),
+    __metadata("design:type", Object)
+], FsRowInlineActionComponent.prototype, "fileSelect", void 0);
 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 let-value=\"value\">\n    <mat-icon *ngIf=\"action.icon\">{{action.icon}}</mat-icon>\n    {{action.label}}\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.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",
         changeDetection: ChangeDetectionStrategy.OnPush
     }),
     __metadata("design:paramtypes", [FsPrompt])
 ], FsRowInlineActionComponent);
 
+let FsRowMenuActionComponent = class FsRowMenuActionComponent {
+    constructor() {
+        this.fileSelect = new EventEmitter();
+        this.fileError = new EventEmitter();
+    }
+};
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], FsRowMenuActionComponent.prototype, "icon", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", String)
+], FsRowMenuActionComponent.prototype, "label", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
+], FsRowMenuActionComponent.prototype, "file", void 0);
+__decorate([
+    Input(),
+    __metadata("design:type", Boolean)
+], FsRowMenuActionComponent.prototype, "fileMultiple", void 0);
+__decorate([
+    Output(),
+    __metadata("design:type", Object)
+], FsRowMenuActionComponent.prototype, "fileSelect", void 0);
+__decorate([
+    Output(),
+    __metadata("design:type", Object)
+], FsRowMenuActionComponent.prototype, "fileError", void 0);
+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",
+        changeDetection: ChangeDetectionStrategy.OnPush
+    })
+], FsRowMenuActionComponent);
+
 let FsListManageSavedFiltersComponent = class FsListManageSavedFiltersComponent {
     constructor(_externalParams) {
         this._externalParams = _externalParams;
@@ -5268,6 +5352,7 @@ FsListModule = FsListModule_1 = __decorate([
             FsPromptModule,
             MatDialogModule,
             MatTooltipModule,
+            FsFileModule,
         ],
         declarations: [
             // Components
@@ -5275,6 +5360,7 @@ FsListModule = FsListModule_1 = __decorate([
             FsRowComponent,
             FsRowActionsComponent,
             FsRowInlineActionComponent,
+            FsRowMenuActionComponent,
             FsCellComponent,
             FsFooterRowComponent,
             FsFooterCellComponent,
@@ -5333,5 +5419,5 @@ function FsListConfigFactory(config) {
  * Generated bundle index. Do not edit.
  */
 
-export { ActionType, Column, FS_LIST_CONFIG, FS_LIST_DEFAULT_CONFIG, FsBodyComponent, FsCellComponent, FsFooterCellComponent, FsFooterComponent, FsFooterRowComponent, FsHeadCellComponent, FsHeadComponent, FsListCellDirective, FsListColumnDirective, FsListComponent, FsListEmptyStateDirective, FsListFooterDirective, FsListHeaderDirective, FsListModule, FsListState, FsPaginationComponent, FsRowComponent, FsStatusComponent, List, PaginationController, PaginationStrategy, ReorderController, ReorderPosition, ReorderStrategy, RowAction, RowType, SelectionChangeType, SelectionController, SortingController, SortingDirection, StyleConfig, FsListConfigFactory as ɵa, GroupExpandNotifierService as ɵb, PersistanceController as ɵc, FsListGroupCellDirective as ɵd, FsListGroupExpandTriggerDirective as ɵe, FsListDraggableListDirective as ɵf, FsRowActionsComponent as ɵg, FsRowInlineActionComponent as ɵh, FsListLoaderComponent as ɵi, FsListSavedFiltersComponent as ɵj, FsListManageSavedFiltersComponent as ɵk, FsListDraggableRowDirective as ɵl, CustomizeColsDialogComponent as ɵm };
+export { ActionType, Column, FS_LIST_CONFIG, FS_LIST_DEFAULT_CONFIG, FsBodyComponent, FsCellComponent, FsFooterCellComponent, FsFooterComponent, FsFooterRowComponent, FsHeadCellComponent, FsHeadComponent, FsListCellDirective, FsListColumnDirective, FsListComponent, FsListEmptyStateDirective, FsListFooterDirective, FsListHeaderDirective, FsListModule, FsListState, FsPaginationComponent, FsRowComponent, FsStatusComponent, List, PaginationController, PaginationStrategy, ReorderController, ReorderPosition, ReorderStrategy, RowAction, RowType, SelectionChangeType, SelectionController, SortingController, SortingDirection, StyleConfig, FsListConfigFactory as ɵa, GroupExpandNotifierService as ɵb, PersistanceController as ɵc, FsListGroupCellDirective as ɵd, FsListGroupExpandTriggerDirective as ɵe, FsListDraggableListDirective as ɵf, FsRowActionsComponent as ɵg, FsRowInlineActionComponent as ɵh, FsRowMenuActionComponent as ɵi, FsListLoaderComponent as ɵj, FsListSavedFiltersComponent as ɵk, FsListManageSavedFiltersComponent as ɵl, FsListDraggableRowDirective as ɵm, CustomizeColsDialogComponent as ɵn };
 //# sourceMappingURL=firestitch-list.js.map