@firestitch/list 9.11.2 → 9.12.2

package/app/components/body/row/inline-action/inline-action.component.d.ts

@@ -1,10 +1,13 @@
 import { EventEmitter } from '@angular/core';
 import { FsPrompt } from '@firestitch/prompt';
+import { FsFile } from '@firestitch/file';
 import { RowAction } from '../../../../models/row-action.model';
 export declare class FsRowInlineActionComponent {
     private _fsPrompt;
     action: RowAction;
     clicked: EventEmitter<any>;
+    fileSelect: EventEmitter<FsFile | FsFile[]>;
     constructor(_fsPrompt: FsPrompt);
     actionClick(event: any): void;
+    fileSelected(event: any): void;
 }

package/app/components/body/row/menu-action/menu-action.component.d.ts

@@ -0,0 +1,9 @@
+import { EventEmitter } from '@angular/core';
+import { FsListRowActionFile } from '../../../../interfaces/listconfig.interface';
+export declare class FsRowMenuActionComponent {
+    icon: string;
+    label: string;
+    file: FsListRowActionFile;
+    fileSelect: EventEmitter<any>;
+    fileError: EventEmitter<any>;
+}

package/app/interfaces/listconfig.interface.d.ts

@@ -1,6 +1,7 @@
 import { Observable } from 'rxjs';
 import { FsSelectionActionSelected, FsSelectionDialogConfigAction, SelectionRef } from '@firestitch/selection';
 import { IFilterConfigItem, IFilterConfigDateItem, FsFilterPersistance, IFilterSavedFiltersConfig, FsFilterAction, ChangeFn } from '@firestitch/filter';
+import { FsFile } from '@firestitch/file';
 import { ActionType } from '../enums/button-type.enum';
 import { ReorderPosition, ReorderStrategy } from '../classes/reorder-controller';
 import { PaginationStrategy } from '../enums/pagination-strategy.enum';
@@ -150,6 +151,7 @@ export interface FsListRowAction {
     menu?: boolean;
     click?: (row: any, event: any, index: any) => void;
     link?: FsListRowActionLinkFn;
+    file?: FsListRowActionFile;
     show?: (row: any, index: number) => boolean;
     remove?: {
         title?: string;
@@ -157,12 +159,26 @@ export interface FsListRowAction {
     } | boolean;
     restore?: boolean;
 }
+export interface FsListRowActionFileFn {
+    (selection: FsFile | FsFile[], row: FsListAbstractRow, index: number): void;
+}
 export interface FsListRowActionLinkFn {
     (row: FsListAbstractRow): FsListRowActionLink;
 }
 export interface FsListRowActionLabelFn {
     (row: FsListAbstractRow): string;
 }
+export interface FsListRowActionFile {
+    select: FsListRowActionFileFn;
+    error?: (error: unknown) => void;
+    multiple?: boolean;
+    accept?: string;
+    minWidth?: number;
+    minHeight?: number;
+    maxWidth?: number;
+    maxHeight?: number;
+    imageQuality?: number;
+}
 export interface FsListRowActionLink {
     link: any[] | string;
     queryParams?: Record<string, any>;

package/app/models/row-action.model.d.ts

@@ -1,6 +1,6 @@
 import { Model } from 'tsmodels';
 import { ActionType } from '../enums/button-type.enum';
-import { FsListRowActionLink } from '../interfaces';
+import { FsListRowActionFile, FsListRowActionLink } from '../interfaces';
 export declare class RowAction extends Model {
     icon: string;
     menu: boolean;
@@ -18,6 +18,7 @@ export declare class RowAction extends Model {
     classArray: string[];
     isShown: boolean;
     click: Function;
+    fileConfig: FsListRowActionFile;
     private _linkFn;
     private _labelFn;
     private readonly _isGroup;

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('lodash-es'), require('rxjs'), require('rxjs/operators'), require('@firestitch/selection'), require('@firestitch/common'), require('@firestitch/drawer'), require('tsmodels'), require('@firestitch/store')) :
-    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', 'lodash-es', 'rxjs', 'rxjs/operators', '@firestitch/selection', '@firestitch/common', '@firestitch/drawer', 'tsmodels', '@firestitch/store'], factory) :
-    (global = 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.filter, global.scroll, global.menu$1, global.prompt, global.lodashEs, global.rxjs, global.rxjs.operators, global.selection, global.common$1, global.drawer, global.tsmodels, global.store));
-}(this, (function (exports, core, common, router, button, checkbox, core$1, dialog, icon, menu, tooltip, progressSpinner, flexLayout, filter, scroll, menu$1, prompt, lodashEs, rxjs, operators, selection, common$1, drawer, tsmodels, store) { '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('@angular/flex-layout'), require('@firestitch/filter'), require('@firestitch/scroll'), require('@firestitch/menu'), require('@firestitch/prompt'), require('@firestitch/file'), require('lodash-es'), require('rxjs'), require('rxjs/operators'), require('@firestitch/selection'), require('@firestitch/common'), require('@firestitch/drawer'), require('tsmodels'), require('@firestitch/store')) :
+    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', 'lodash-es', 'rxjs', 'rxjs/operators', '@firestitch/selection', '@firestitch/common', '@firestitch/drawer', 'tsmodels', '@firestitch/store'], factory) :
+    (global = 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.filter, global.scroll, global.menu$1, global.prompt, global.file, global.lodashEs, global.rxjs, global.rxjs.operators, global.selection, global.common$1, global.drawer, global.tsmodels, global.store));
+}(this, (function (exports, core, common, router, button, checkbox, core$1, dialog, icon, menu, tooltip, progressSpinner, flexLayout, filter, scroll, menu$1, prompt, file, lodashEs, rxjs, operators, selection, common$1, drawer, tsmodels, store) { 'use strict';
 
     /*! *****************************************************************************
     Copyright (c) Microsoft Corporation. All rights reserved.
@@ -550,6 +550,15 @@
                 return _this.clickEvent(row, event, index, rowActionsRef, clickFn);
             };
             this._linkFn = value.link;
+            if (value.file) {
+                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);
+                    };
+                }
+            }
             if (typeof value.label === 'function') {
                 this._labelFn = value.label;
                 this.label = '';
@@ -569,7 +578,8 @@
                 this.rowActions.forEach(function (action) {
                     action.checkShowStatus(row, index);
                 });
-                this.isShown = this.rowActions.some(function (action) { return action.isShown; });
+                var groupVisible = !this.show || this.show(row, index);
+                this.isShown = groupVisible && this.rowActions.some(function (action) { return action.isShown; });
             }
             else if (this.show) {
                 this.isShown = this.show(row, index);
@@ -3809,8 +3819,8 @@
                 return this._enabled$
                     .pipe(operators.map(function (enabled) {
                     return enabled && _this.position === exports.ReorderPosition.Left;
-                }), operators.map(function () {
-                    return _this._numberOfActiveFilters === 0;
+                }), operators.map(function (enabled) {
+                    return enabled && _this._numberOfActiveFilters === 0;
                 }), operators.distinctUntilChanged(), operators.shareReplay());
             },
             enumerable: true,
@@ -3822,8 +3832,8 @@
                 return this._enabled$
                     .pipe(operators.map(function (enabled) {
                     return enabled && _this.position === exports.ReorderPosition.Right;
-                }), operators.map(function () {
-                    return _this._numberOfActiveFilters === 0;
+                }), operators.map(function (enabled) {
+                    return enabled && _this._numberOfActiveFilters === 0;
                 }), operators.distinctUntilChanged(), operators.shareReplay());
             },
             enumerable: true,
@@ -5862,7 +5872,7 @@
         FsRowActionsComponent = __decorate([
             core.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.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: core.ChangeDetectionStrategy.OnPush
             }),
             __metadata("design:paramtypes", [prompt.FsPrompt])
@@ -5874,10 +5884,14 @@
         function FsRowInlineActionComponent(_fsPrompt) {
             this._fsPrompt = _fsPrompt;
             this.clicked = new core.EventEmitter();
+            this.fileSelect = new core.EventEmitter();
         }
         FsRowInlineActionComponent.prototype.actionClick = function (event) {
             this.clicked.emit(event);
         };
+        FsRowInlineActionComponent.prototype.fileSelected = function (event) {
+            this.fileSelect.emit(event);
+        };
         FsRowInlineActionComponent.ctorParameters = function () { return [
             { type: prompt.FsPrompt }
         ]; };
@@ -5889,10 +5903,14 @@
             core.Output(),
             __metadata("design:type", Object)
         ], FsRowInlineActionComponent.prototype, "clicked", void 0);
+        __decorate([
+            core.Output(),
+            __metadata("design:type", Object)
+        ], FsRowInlineActionComponent.prototype, "fileSelect", void 0);
         FsRowInlineActionComponent = __decorate([
             core.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.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: core.ChangeDetectionStrategy.OnPush
             }),
             __metadata("design:paramtypes", [prompt.FsPrompt])
@@ -5900,6 +5918,41 @@
         return FsRowInlineActionComponent;
     }());
 
+    var FsRowMenuActionComponent = /** @class */ (function () {
+        function FsRowMenuActionComponent() {
+            this.fileSelect = new core.EventEmitter();
+            this.fileError = new core.EventEmitter();
+        }
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String)
+        ], FsRowMenuActionComponent.prototype, "icon", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String)
+        ], FsRowMenuActionComponent.prototype, "label", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Object)
+        ], FsRowMenuActionComponent.prototype, "file", void 0);
+        __decorate([
+            core.Output(),
+            __metadata("design:type", Object)
+        ], FsRowMenuActionComponent.prototype, "fileSelect", void 0);
+        __decorate([
+            core.Output(),
+            __metadata("design:type", Object)
+        ], FsRowMenuActionComponent.prototype, "fileError", void 0);
+        FsRowMenuActionComponent = __decorate([
+            core.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    [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: core.ChangeDetectionStrategy.OnPush
+            })
+        ], FsRowMenuActionComponent);
+        return FsRowMenuActionComponent;
+    }());
+
     var FsListManageSavedFiltersComponent = /** @class */ (function () {
         function FsListManageSavedFiltersComponent(_externalParams) {
             this._externalParams = _externalParams;
@@ -6122,6 +6175,7 @@
                     prompt.FsPromptModule,
                     dialog.MatDialogModule,
                     tooltip.MatTooltipModule,
+                    file.FsFileModule,
                 ],
                 declarations: [
                     // Components
@@ -6129,6 +6183,7 @@
                     FsRowComponent,
                     FsRowActionsComponent,
                     FsRowInlineActionComponent,
+                    FsRowMenuActionComponent,
                     FsCellComponent,
                     FsFooterRowComponent,
                     FsFooterCellComponent,
@@ -6216,11 +6271,12 @@
     exports.ɵf = FsListDraggableListDirective;
     exports.ɵg = FsRowActionsComponent;
     exports.ɵh = FsRowInlineActionComponent;
-    exports.ɵi = FsListLoaderComponent;
-    exports.ɵj = FsListSavedFiltersComponent;
-    exports.ɵk = FsListManageSavedFiltersComponent;
-    exports.ɵl = FsListDraggableRowDirective;
-    exports.ɵm = CustomizeColsDialogComponent;
+    exports.ɵi = FsRowMenuActionComponent;
+    exports.ɵj = FsListLoaderComponent;
+    exports.ɵk = FsListSavedFiltersComponent;
+    exports.ɵl = FsListManageSavedFiltersComponent;
+    exports.ɵm = FsListDraggableRowDirective;
+    exports.ɵn = CustomizeColsDialogComponent;
 
     Object.defineProperty(exports, '__esModule', { value: true });