@firestitch/list 13.2.2 → 13.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -2,7 +2,7 @@ import * as i3 from '@angular/common';
2
2
  import { CommonModule } from '@angular/common';
3
3
  import * as i0 from '@angular/core';
4
4
  import { Injectable, Directive, Input, Component, ChangeDetectionStrategy, HostBinding, EventEmitter, Output, Pipe, ViewChildren, TemplateRef, ViewContainerRef, ViewChild, ContentChild, Inject, HostListener, ContentChildren, InjectionToken, Optional, NgModule } from '@angular/core';
5
- import * as i7 from '@angular/router';
5
+ import * as i6 from '@angular/router';
6
6
  import { RouterModule } from '@angular/router';
7
7
  import * as i1 from '@angular/material/button';
8
8
  import { MatButtonModule } from '@angular/material/button';
@@ -16,7 +16,7 @@ import * as i2 from '@angular/material/icon';
16
16
  import { MatIconModule } from '@angular/material/icon';
17
17
  import { MatMenuModule } from '@angular/material/menu';
18
18
  import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
19
- import * as i6 from '@angular/material/tooltip';
19
+ import * as i6$1 from '@angular/material/tooltip';
20
20
  import { MatTooltipModule } from '@angular/material/tooltip';
21
21
  import * as i4 from '@firestitch/common';
22
22
  import { getNormalizedPath, FsCommonModule } from '@firestitch/common';
@@ -28,13 +28,12 @@ import * as i2$1 from '@firestitch/menu';
28
28
  import { FsMenuModule } from '@firestitch/menu';
29
29
  import * as i1$1 from '@firestitch/prompt';
30
30
  import { FsPromptModule } from '@firestitch/prompt';
31
- import * as i2$4 from '@firestitch/scroll';
32
31
  import { FsScrollModule } from '@firestitch/scroll';
33
32
  import { get, isString, isObject, isBoolean, isNumber, isFunction, cloneDeep, random, mergeWith, merge as merge$1 } from 'lodash-es';
34
33
  import { BehaviorSubject, Subject, Observable, merge, from, combineLatest, of, EMPTY } from 'rxjs';
35
- import { takeUntil, take, filter, tap, skip, distinctUntilChanged, map, shareReplay, debounceTime, switchMap, mapTo, catchError } from 'rxjs/operators';
36
- import * as i4$1 from '@firestitch/drawer';
37
- import * as i5 from '@firestitch/selection';
34
+ import { takeUntil, take, filter, tap, skip, distinctUntilChanged, map, shareReplay, delay, debounceTime, switchMap, mapTo, catchError } from 'rxjs/operators';
35
+ import * as i3$3 from '@firestitch/drawer';
36
+ import * as i4$1 from '@firestitch/selection';
38
37
  import * as i1$3 from '@firestitch/store';
39
38
  import { FsPersistanceStore } from '@firestitch/store';
40
39
 
@@ -375,11 +374,9 @@ class SelectionController {
375
374
  this._selectionDialogRef.updateAllCount(this._totalRecordsCount);
376
375
  }
377
376
  }
378
- pageChanged(infinityScrollEnabled) {
377
+ pageChanged() {
379
378
  if (this._selectedAll) {
380
- if (!infinityScrollEnabled) {
381
- this._resetSelection();
382
- }
379
+ this._resetSelection();
383
380
  }
384
381
  else {
385
382
  this._selectedRecords = 0;
@@ -1660,7 +1657,7 @@ class FsRowInlineActionComponent {
1660
1657
  }
1661
1658
  }
1662
1659
  FsRowInlineActionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: FsRowInlineActionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1663
- FsRowInlineActionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: FsRowInlineActionComponent, selector: "fs-list-row-inline-action", inputs: { action: "action" }, outputs: { clicked: "clicked", fileSelect: "fileSelect" }, ngImport: i0, 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: i1.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: i1.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: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i3$1.FsFileComponent, selector: "fs-file", inputs: ["minHeight", "minWidth", "orientate", "multiple", "capture", "allowClick", "allowDrop", "accept", "disabled", "imageWidth", "imageHeight", "imageQuality"], outputs: ["select", "error", "beforeProcessing", "clicked", "declined"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i7.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1660
+ FsRowInlineActionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: FsRowInlineActionComponent, selector: "fs-list-row-inline-action", inputs: { action: "action" }, outputs: { clicked: "clicked", fileSelect: "fileSelect" }, ngImport: i0, 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: i1.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: i1.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: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i3$1.FsFileComponent, selector: "fs-file", inputs: ["minHeight", "minWidth", "orientate", "multiple", "capture", "allowClick", "allowDrop", "accept", "disabled", "imageWidth", "imageHeight", "imageQuality"], outputs: ["select", "error", "beforeProcessing", "clicked", "declined"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i6.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1664
1661
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: FsRowInlineActionComponent, decorators: [{
1665
1662
  type: Component,
1666
1663
  args: [{ selector: 'fs-list-row-inline-action', changeDetection: ChangeDetectionStrategy.OnPush, 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" }]
@@ -2287,7 +2284,7 @@ class CustomizeColsDialogComponent {
2287
2284
  }
2288
2285
  }
2289
2286
  CustomizeColsDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: CustomizeColsDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1$2.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component });
2290
- CustomizeColsDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: CustomizeColsDialogComponent, selector: "ng-component", ngImport: i0, template: "<h1 matDialogTitle>Customize Columns</h1>\r\n<mat-dialog-content>\r\n <div *ngFor=\"let column of columns\">\r\n <mat-checkbox [checked]=\"column.show\" (change)=\"visibilityChange($event, column)\" [disabled]=\"column.disabled\">\r\n <ng-container *ngIf=\"!column.title; else titleLable\">\r\n <ng-template [ngTemplateOutlet]=\"column.template\"></ng-template>\r\n </ng-container>\r\n <ng-template #titleLable>\r\n {{ column.title }}\r\n </ng-template>\r\n\r\n <ng-container *ngIf=\"column.tooltip\">\r\n <mat-icon [matTooltip]=\"column.tooltip\">\r\n help\r\n </mat-icon>\r\n </ng-container>\r\n </mat-checkbox>\r\n </div>\r\n</mat-dialog-content>\r\n<mat-dialog-actions>\r\n <button type=\"button\" mat-button color=\"primary\" (click)=\"save()\" [disabled]=\"saveDisabled\">Save</button>\r\n <button type=\"button\" mat-button (click)=\"cancel()\">Cancel</button>\r\n</mat-dialog-actions>\r\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$2.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i1.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$2.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1$2.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i6.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i1$2.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2287
+ CustomizeColsDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: CustomizeColsDialogComponent, selector: "ng-component", ngImport: i0, template: "<h1 matDialogTitle>Customize Columns</h1>\r\n<mat-dialog-content>\r\n <div *ngFor=\"let column of columns\">\r\n <mat-checkbox [checked]=\"column.show\" (change)=\"visibilityChange($event, column)\" [disabled]=\"column.disabled\">\r\n <ng-container *ngIf=\"!column.title; else titleLable\">\r\n <ng-template [ngTemplateOutlet]=\"column.template\"></ng-template>\r\n </ng-container>\r\n <ng-template #titleLable>\r\n {{ column.title }}\r\n </ng-template>\r\n\r\n <ng-container *ngIf=\"column.tooltip\">\r\n <mat-icon [matTooltip]=\"column.tooltip\">\r\n help\r\n </mat-icon>\r\n </ng-container>\r\n </mat-checkbox>\r\n </div>\r\n</mat-dialog-content>\r\n<mat-dialog-actions>\r\n <button type=\"button\" mat-button color=\"primary\" (click)=\"save()\" [disabled]=\"saveDisabled\">Save</button>\r\n <button type=\"button\" mat-button (click)=\"cancel()\">Cancel</button>\r\n</mat-dialog-actions>\r\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$2.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i1.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$2.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { type: i1$2.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i6$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i1$2.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
2291
2288
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: CustomizeColsDialogComponent, decorators: [{
2292
2289
  type: Component,
2293
2290
  args: [{ changeDetection: ChangeDetectionStrategy.OnPush, template: "<h1 matDialogTitle>Customize Columns</h1>\r\n<mat-dialog-content>\r\n <div *ngFor=\"let column of columns\">\r\n <mat-checkbox [checked]=\"column.show\" (change)=\"visibilityChange($event, column)\" [disabled]=\"column.disabled\">\r\n <ng-container *ngIf=\"!column.title; else titleLable\">\r\n <ng-template [ngTemplateOutlet]=\"column.template\"></ng-template>\r\n </ng-container>\r\n <ng-template #titleLable>\r\n {{ column.title }}\r\n </ng-template>\r\n\r\n <ng-container *ngIf=\"column.tooltip\">\r\n <mat-icon [matTooltip]=\"column.tooltip\">\r\n help\r\n </mat-icon>\r\n </ng-container>\r\n </mat-checkbox>\r\n </div>\r\n</mat-dialog-content>\r\n<mat-dialog-actions>\r\n <button type=\"button\" mat-button color=\"primary\" (click)=\"save()\" [disabled]=\"saveDisabled\">Save</button>\r\n <button type=\"button\" mat-button (click)=\"cancel()\">Cancel</button>\r\n</mat-dialog-actions>\r\n", styles: [".mat-checkbox{min-height:32px;display:block}.mat-icon{font-size:14px;height:14px;width:14px;vertical-align:middle}\n"] }]
@@ -3107,7 +3104,6 @@ class DataController {
3107
3104
  }
3108
3105
  }
3109
3106
  setAdditionalConfigs(configs) {
3110
- this._infinityScrollEnabled = configs.scrollable;
3111
3107
  this._loadMoreEnabled = configs.loadMoreEnabled;
3112
3108
  }
3113
3109
  /**
@@ -3115,29 +3111,12 @@ class DataController {
3115
3111
  * @param rows
3116
3112
  */
3117
3113
  setRowsFromResponse(rows) {
3118
- if (this._infinityScrollEnabled) {
3119
- switch (this._operation) {
3120
- case FsListState.Filter:
3121
- case FsListState.Reload:
3122
- case FsListState.Sort:
3123
- {
3124
- this._updateRowsStack(rows);
3125
- }
3126
- break;
3127
- default: {
3128
- this._extendRowsStack(rows);
3129
- }
3130
- }
3131
- this._remoteRowsChange$.next();
3114
+ if (this._operation === FsListState.LoadMore ||
3115
+ (this._operation === FsListState.PageChange && this._loadMoreEnabled)) {
3116
+ this._extendRowsStack(rows);
3132
3117
  }
3133
3118
  else {
3134
- if (this._operation === FsListState.LoadMore ||
3135
- (this._operation === FsListState.PageChange && this._loadMoreEnabled)) {
3136
- this._extendRowsStack(rows);
3137
- }
3138
- else {
3139
- this._updateRowsStack(rows);
3140
- }
3119
+ this._updateRowsStack(rows);
3141
3120
  }
3142
3121
  this._operation = FsListState.Idle;
3143
3122
  this._updateVisibleRows();
@@ -3446,7 +3425,7 @@ class ExternalParamsController {
3446
3425
  }
3447
3426
  // Set initial pagination params
3448
3427
  // The same initial, but for sorting placed in list-controller "tranformTemplatesToColumns" method
3449
- if (this._paginator.enabled && !this._paginator.infinityScrollEnabled) {
3428
+ if (this._paginator.enabled) {
3450
3429
  if (this._limit) {
3451
3430
  this._paginator.setLimit(this._limit);
3452
3431
  }
@@ -3611,7 +3590,6 @@ class PaginationController {
3611
3590
  this._pageChanged$ = new Subject();
3612
3591
  this._pageReset$ = new Subject();
3613
3592
  this._onDestroy$ = new Subject();
3614
- this._infinityScrollEnabled = false;
3615
3593
  this._limits = [10, 25, 50, 100, 200];
3616
3594
  }
3617
3595
  // Total pages
@@ -3790,9 +3768,6 @@ class PaginationController {
3790
3768
  get loadMoreButtonType() {
3791
3769
  return this._loadMoreConfig.buttonType;
3792
3770
  }
3793
- get infinityScrollEnabled() {
3794
- return this._infinityScrollEnabled;
3795
- }
3796
3771
  /**
3797
3772
  * SP-T1974
3798
3773
  * Showing 26-50 of 333 results sorted by Name, Ascending
@@ -3815,7 +3790,7 @@ class PaginationController {
3815
3790
  displayed: this.displayed,
3816
3791
  };
3817
3792
  }
3818
- initWithConfig(config, loadMore, infinityScrollEnabled = false) {
3793
+ initWithConfig(config, loadMore) {
3819
3794
  if (config) {
3820
3795
  if (config.limits) {
3821
3796
  this.limits = config.limits;
@@ -3826,7 +3801,6 @@ class PaginationController {
3826
3801
  this.strategy = config.strategy;
3827
3802
  }
3828
3803
  this.setLoadMore(loadMore);
3829
- this._infinityScrollEnabled = infinityScrollEnabled;
3830
3804
  }
3831
3805
  /**
3832
3806
  * If pagination has prev page when Page Strategy
@@ -3917,10 +3891,11 @@ class PaginationController {
3917
3891
  const loadMoreConfig = typeof config === 'boolean' ?
3918
3892
  {
3919
3893
  enabled: !!config,
3920
- } : {
3921
- enabled: true,
3922
- ...config,
3923
- };
3894
+ } :
3895
+ (config === undefined ? {} : {
3896
+ ...config,
3897
+ enabled: true,
3898
+ });
3924
3899
  this._loadMoreConfig = {
3925
3900
  enabled: false,
3926
3901
  label: 'Load More',
@@ -4091,10 +4066,9 @@ class PaginationController {
4091
4066
 
4092
4067
  const showDeletedFilterKey = 'showDeleted';
4093
4068
  class List {
4094
- constructor(_el, _config = {}, _fsScroll, _selectionDialog, _router, _route, _persistance, _inDialog) {
4069
+ constructor(_el, _config = {}, _selectionDialog, _router, _route, _persistance, _inDialog) {
4095
4070
  this._el = _el;
4096
4071
  this._config = _config;
4097
- this._fsScroll = _fsScroll;
4098
4072
  this._selectionDialog = _selectionDialog;
4099
4073
  this._router = _router;
4100
4074
  this._route = _route;
@@ -4193,19 +4167,14 @@ class List {
4193
4167
  console.warn('Not able to restore persisted sorting params.', externalSorting);
4194
4168
  }
4195
4169
  this._initFilters();
4196
- this._initInfinityScroll();
4197
4170
  }
4198
4171
  reload() {
4199
4172
  this.loading$.next(true);
4200
4173
  this.dataController.setOperation(FsListState.Reload);
4201
- if (this.fsScrollInstance) {
4202
- this.paging.resetPaging();
4203
- this.dataController.clearRows();
4204
- this.fsScrollInstance.reload();
4205
- }
4206
- else {
4207
- this._fetch$.next();
4208
- }
4174
+ this._fetch$.next();
4175
+ return this.fetchComplete$
4176
+ .asObservable()
4177
+ .pipe(take(1), delay(0));
4209
4178
  }
4210
4179
  /**
4211
4180
  * Watch page changes
@@ -4224,10 +4193,10 @@ class List {
4224
4193
  if (this.selection) {
4225
4194
  this.selection.updateVisibleRecordsCount(this.paging.getVisibleRecords());
4226
4195
  this.selection.updateTotalRecordsCount(this.paging.records);
4227
- this.selection.pageChanged(this.scrollable);
4196
+ this.selection.pageChanged();
4228
4197
  }
4229
4198
  }
4230
- if (!this.scrollable && !this.paging.loadMoreEnabled) {
4199
+ if (!this.paging.loadMoreEnabled) {
4231
4200
  const contains = [].slice.call(document.querySelectorAll('.cdk-overlay-container')).some((overlay) => {
4232
4201
  return this._el.nativeElement.contains(overlay);
4233
4202
  });
@@ -4238,7 +4207,8 @@ class List {
4238
4207
  el = document.body;
4239
4208
  }
4240
4209
  }
4241
- this.fetchComplete$.asObservable()
4210
+ this.fetchComplete$
4211
+ .asObservable()
4242
4212
  .pipe(take(1), takeUntil(this._destroy$))
4243
4213
  .subscribe((event) => {
4244
4214
  if (event?.scrollIntoView ?? true) {
@@ -4253,13 +4223,7 @@ class List {
4253
4223
  .subscribe(() => {
4254
4224
  this.dataController.setOperation(FsListState.Sort);
4255
4225
  this.paging.page = 1;
4256
- if (this.fsScrollInstance) {
4257
- this.dataController.clearRows();
4258
- this.fsScrollInstance.reload();
4259
- }
4260
- else {
4261
- this._fetch$.next();
4262
- }
4226
+ this._fetch$.next();
4263
4227
  });
4264
4228
  this._listenVisibleColumnChanges();
4265
4229
  this._listenRowsRemove();
@@ -4294,9 +4258,6 @@ class List {
4294
4258
  }
4295
4259
  }
4296
4260
  destroy() {
4297
- if (this._fsScrollSubscription) {
4298
- this._fsScrollSubscription.unsubscribe();
4299
- }
4300
4261
  if (this.paging) {
4301
4262
  this.paging.destroy();
4302
4263
  }
@@ -4348,7 +4309,6 @@ class List {
4348
4309
  this.filterInitCb = config.filterInit;
4349
4310
  this.filterChangeCb = config.filterChange;
4350
4311
  this.savedFilters = config.savedFilters;
4351
- this.scrollable = config.scrollable;
4352
4312
  this.noResults = config.noResults;
4353
4313
  this.emptyState = config.emptyState;
4354
4314
  this.fetchFn = config.fetch;
@@ -4435,7 +4395,7 @@ class List {
4435
4395
  * @param loadMore
4436
4396
  */
4437
4397
  _initPaging(pagingConfig, loadMore) {
4438
- this.paging.initWithConfig(pagingConfig, loadMore, !!this.scrollable);
4398
+ this.paging.initWithConfig(pagingConfig, loadMore);
4439
4399
  }
4440
4400
  /**
4441
4401
  * Split actions by categories
@@ -4456,7 +4416,6 @@ class List {
4456
4416
  }
4457
4417
  _initializeData() {
4458
4418
  this.dataController.setAdditionalConfigs({
4459
- scrollable: !!this.scrollable,
4460
4419
  loadMoreEnabled: this.paging.loadMoreEnabled,
4461
4420
  });
4462
4421
  }
@@ -4577,55 +4536,6 @@ class List {
4577
4536
  this._updateSortingColumns();
4578
4537
  });
4579
4538
  }
4580
- _initInfinityScroll() {
4581
- if (this.fsScrollInstance) {
4582
- return;
4583
- }
4584
- if (this.scrollable) {
4585
- // Scrollable status by default
4586
- if (this.scrollable.status === undefined) {
4587
- this.scrollable.status = true;
4588
- }
4589
- this._fsScroll
4590
- .component(this.scrollable.name)
4591
- .pipe(takeUntil(this._destroy$))
4592
- .subscribe((fsScrollInstance) => {
4593
- this.fsScrollInstance = fsScrollInstance;
4594
- this._fsScrollSubscription = fsScrollInstance
4595
- .subscribe(() => {
4596
- let startLoading = false;
4597
- const operation = this.dataController.operation;
4598
- // Initial loading if initialFetch equals false
4599
- if (!this.initialFetch
4600
- && !this.paging.initialized
4601
- && operation !== FsListState.Reload) {
4602
- this.dataController.setOperation(FsListState.Load);
4603
- startLoading = true;
4604
- }
4605
- else if (operation === FsListState.Reload ||
4606
- operation === FsListState.Filter ||
4607
- operation === FsListState.Sort) {
4608
- startLoading = true;
4609
- }
4610
- else if (this.paging.initialized && this.paging.hasNextPage) {
4611
- // Loading if content has been scrolled
4612
- startLoading = true;
4613
- this.dataController.setOperation(FsListState.Load);
4614
- this.paging.goNext();
4615
- }
4616
- if (startLoading) {
4617
- this._fetch$.next();
4618
- fsScrollInstance.loading();
4619
- }
4620
- });
4621
- this.dataController.remoteRowsChange$
4622
- .pipe(takeUntil(this._destroy$))
4623
- .subscribe(() => {
4624
- fsScrollInstance.loaded();
4625
- });
4626
- });
4627
- }
4628
- }
4629
4539
  /**
4630
4540
  * Update and watch filter changes
4631
4541
  */
@@ -4688,13 +4598,7 @@ class List {
4688
4598
  this.dataController.setOperation(FsListState.Filter);
4689
4599
  // Reset paging for request with correct offset
4690
4600
  this.paging.resetPaging();
4691
- if (this.fsScrollInstance) {
4692
- this.dataController.clearRows();
4693
- this.fsScrollInstance.reload();
4694
- }
4695
- else {
4696
- this._fetch$.next();
4697
- }
4601
+ this._fetch$.next();
4698
4602
  }
4699
4603
  _checkRestoreFilter() {
4700
4604
  // Restore option
@@ -4753,7 +4657,7 @@ class List {
4753
4657
  // Update selection params
4754
4658
  if (this.selection) {
4755
4659
  if (this.paging.enabled) {
4756
- this.selection.pageChanged(this.scrollable);
4660
+ this.selection.pageChanged();
4757
4661
  this.selection.updateVisibleRecordsCount(this.paging.getVisibleRecords());
4758
4662
  this.selection.updateTotalRecordsCount(this.paging.records);
4759
4663
  }
@@ -4825,11 +4729,11 @@ class PersistanceController extends FsPersistanceStore {
4825
4729
  this.STORE_KEY = FILTER_STORE_KEY;
4826
4730
  }
4827
4731
  }
4828
- PersistanceController.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: PersistanceController, deps: [{ token: i1$3.FsStore }, { token: i7.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Injectable });
4732
+ PersistanceController.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: PersistanceController, deps: [{ token: i1$3.FsStore }, { token: i6.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Injectable });
4829
4733
  PersistanceController.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: PersistanceController });
4830
4734
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: PersistanceController, decorators: [{
4831
4735
  type: Injectable
4832
- }], ctorParameters: function () { return [{ type: i1$3.FsStore }, { type: i7.ActivatedRoute }]; } });
4736
+ }], ctorParameters: function () { return [{ type: i1$3.FsStore }, { type: i6.ActivatedRoute }]; } });
4833
4737
 
4834
4738
  class FsListHeadingDirective {
4835
4739
  }
@@ -5159,18 +5063,16 @@ class FsStatusComponent {
5159
5063
  }
5160
5064
  }
5161
5065
  FsStatusComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: FsStatusComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
5162
- FsStatusComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", 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, template: "<div class=\"status\">\r\n <small>\r\n <ng-container *ngIf=\"paging.enabled && !scrollable\">\r\n <ng-container *ngIf=\"paging.records > 0; else emptyResults\">\r\n Showing <a [fsMenuTriggerFor]=\"limitsMenu\">{{ paging.statusLabel }}</a> of {{ paging.records | number:'1.0':'en-US' }} results\r\n </ng-container>\r\n <ng-template #emptyResults>\r\n Showing <a [fsMenuTriggerFor]=\"limitsMenu\">0</a> results\r\n </ng-template>\r\n <ng-container *ngTemplateOutlet=\"sortedBy\"></ng-container><!--\r\n --></ng-container><!--\r\n\r\n --><ng-container *ngIf=\"(!paging.enabled || scrollable) && paging.displayed > 0\">\r\n <ng-container *ngIf=\"!scrollable; else scrollable\">\r\n Showing\r\n <span *ngIf=\"paging.displayed == 1\">{{ paging.displayed }} result </span>\r\n <span *ngIf=\"paging.displayed > 1\">{{ paging.displayed | number:'1.0':'en-US' }} results </span>\r\n </ng-container>\r\n\r\n <ng-template #scrollable>\r\n <span *ngIf=\"paging.records == 1\">{{ paging.records }} result </span>\r\n <span *ngIf=\"paging.records > 1\">{{ paging.records | number:'1.0':'en-US' }} results </span>\r\n </ng-template>\r\n <ng-container *ngTemplateOutlet=\"sortedBy\"></ng-container><!--\r\n --></ng-container><!--\r\n\r\n --><fs-list-saved-filters class=\"saved-filters\"></fs-list-saved-filters>\r\n\r\n <fs-menu [hidden]=\"!paging.enabled || scrollable\" #limitsMenu>\r\n <ng-template\r\n ngFor\r\n let-limit\r\n [ngForOf]=\"paging.limits\">\r\n <ng-template fs-menu-item (click)=\"setLimit(limit)\">\r\n {{ limit }}\r\n </ng-template>\r\n </ng-template>\r\n </fs-menu>\r\n\r\n <fs-menu [hidden]=\"!sorting.sortingColumn || paging.displayed === 0\" #orderColumnsMenu>\r\n <!-- Real sorting columns -->\r\n <ng-template\r\n ngFor\r\n let-column\r\n [ngForOf]=\"sorting.sortingColumns\">\r\n <ng-template fs-menu-item (click)=\"setSortableColumn(column)\">\r\n <ng-container *ngIf=\"column.title; else sortByTemplate\">\r\n {{ column.title }}\r\n </ng-container>\r\n <ng-template #sortByTemplate>\r\n <ng-template [ngTemplateOutlet]=\"column.headerTemplate\"></ng-template>\r\n </ng-template>\r\n </ng-template>\r\n </ng-template>\r\n\r\n <!-- Fake sorting columns -->\r\n <ng-template\r\n ngFor\r\n let-column\r\n [ngForOf]=\"sorting.fakeSortingColumns\">\r\n <ng-template fs-menu-item (click)=\"setSortableColumn(column)\">\r\n {{ column.title }}\r\n </ng-template>\r\n </ng-template>\r\n </fs-menu>\r\n\r\n <ng-template #sortedBy>\r\n <ng-container *ngIf=\"sorting.sortingColumn\">\r\n sorted by\r\n <ng-container *ngIf=\"sorting.sortingColumn.title; else sortByTemplate\">\r\n <a class=\"order-toggle\" [fsMenuTriggerFor]=\"orderColumnsMenu\">{{ sorting.sortingColumn.title }}</a>,\r\n </ng-container>\r\n <ng-template #sortByTemplate>\r\n <a class=\"order-toggle\" [fsMenuTriggerFor]=\"orderColumnsMenu\">\r\n <ng-template [ngTemplateOutlet]=\"sorting.sortingColumn.headerTemplate\"></ng-template>\r\n </a>,\r\n </ng-template>\r\n <a class=\"order-toggle\" (click)=\"toggleDirection()\">{{ sorting.sortingColumn.fullNameDirection }}</a><!--\r\n --></ng-container><!--\r\n --></ng-template>\r\n </small> \r\n</div>\r\n", styles: [":host.hidden-mobile{display:none!important}: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$1.FsMenuComponent, selector: "fs-menu", inputs: ["class", "buttonClass", "buttonType", "buttonColor"], outputs: ["opened", "closed"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.FsMenuTriggerDirective, selector: "[fsMenuTriggerFor]", inputs: ["fsMenuTriggerFor"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2$1.FsMenuItemDirective, selector: "fs-menu-group,[fs-menu-item]" }], pipes: { "number": i3.DecimalPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, preserveWhitespaces: true });
5066
+ FsStatusComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: FsStatusComponent, selector: "fs-list-status", inputs: { paging: "paging", sorting: "sorting", rows: "rows", firstLoad: "firstLoad" }, host: { properties: { "class.first-load": "this.firstLoad", "class.fs-skeleton-placeholder": "this.firstLoad" } }, ngImport: i0, template: "<div class=\"status\">\r\n <small>\r\n <ng-container *ngIf=\"paging.enabled\">\r\n <ng-container *ngIf=\"paging.records > 0; else emptyResults\">\r\n Showing <a [fsMenuTriggerFor]=\"limitsMenu\">{{ paging.statusLabel }}</a> of {{ paging.records | number:'1.0':'en-US' }} results\r\n </ng-container>\r\n <ng-template #emptyResults>\r\n Showing <a [fsMenuTriggerFor]=\"limitsMenu\">0</a> results\r\n </ng-template>\r\n <ng-container *ngTemplateOutlet=\"sortedBy\"></ng-container><!--\r\n --></ng-container><!--\r\n\r\n --><ng-container *ngIf=\"(!paging.enabled) && paging.displayed > 0\">\r\n <ng-container *ngIf=\"!scrollable; else scrollable\">\r\n Showing\r\n <span *ngIf=\"paging.displayed === 1\">{{ paging.displayed }} result </span>\r\n <span *ngIf=\"paging.displayed > 1\">{{ paging.displayed | number:'1.0':'en-US' }} results </span>\r\n </ng-container>\r\n\r\n <ng-template #scrollable>\r\n <span *ngIf=\"paging.records === 1\">{{ paging.records }} result </span>\r\n <span *ngIf=\"paging.records > 1\">{{ paging.records | number:'1.0':'en-US' }} results </span>\r\n </ng-template>\r\n <ng-container *ngTemplateOutlet=\"sortedBy\"></ng-container><!--\r\n --></ng-container><!--\r\n\r\n --><fs-list-saved-filters class=\"saved-filters\"></fs-list-saved-filters>\r\n\r\n <fs-menu [hidden]=\"!paging.enabled\" #limitsMenu>\r\n <ng-template\r\n ngFor\r\n let-limit\r\n [ngForOf]=\"paging.limits\">\r\n <ng-template fs-menu-item (click)=\"setLimit(limit)\">\r\n {{ limit }}\r\n </ng-template>\r\n </ng-template>\r\n </fs-menu>\r\n\r\n <fs-menu [hidden]=\"!sorting.sortingColumn || paging.displayed === 0\" #orderColumnsMenu>\r\n <!-- Real sorting columns -->\r\n <ng-template\r\n ngFor\r\n let-column\r\n [ngForOf]=\"sorting.sortingColumns\">\r\n <ng-template fs-menu-item (click)=\"setSortableColumn(column)\">\r\n <ng-container *ngIf=\"column.title; else sortByTemplate\">\r\n {{ column.title }}\r\n </ng-container>\r\n <ng-template #sortByTemplate>\r\n <ng-template [ngTemplateOutlet]=\"column.headerTemplate\"></ng-template>\r\n </ng-template>\r\n </ng-template>\r\n </ng-template>\r\n\r\n <!-- Fake sorting columns -->\r\n <ng-template\r\n ngFor\r\n let-column\r\n [ngForOf]=\"sorting.fakeSortingColumns\">\r\n <ng-template fs-menu-item (click)=\"setSortableColumn(column)\">\r\n {{ column.title }}\r\n </ng-template>\r\n </ng-template>\r\n </fs-menu>\r\n\r\n <ng-template #sortedBy>\r\n <ng-container *ngIf=\"sorting.sortingColumn\">\r\n sorted by\r\n <ng-container *ngIf=\"sorting.sortingColumn.title; else sortByTemplate\">\r\n <a class=\"order-toggle\" [fsMenuTriggerFor]=\"orderColumnsMenu\">{{ sorting.sortingColumn.title }}</a>,\r\n </ng-container>\r\n <ng-template #sortByTemplate>\r\n <a class=\"order-toggle\" [fsMenuTriggerFor]=\"orderColumnsMenu\">\r\n <ng-template [ngTemplateOutlet]=\"sorting.sortingColumn.headerTemplate\"></ng-template>\r\n </a>,\r\n </ng-template>\r\n <a class=\"order-toggle\" (click)=\"toggleDirection()\">{{ sorting.sortingColumn.fullNameDirection }}</a><!--\r\n --></ng-container><!--\r\n --></ng-template>\r\n </small> \r\n</div>\r\n", styles: [":host.hidden-mobile{display:none!important}: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$1.FsMenuComponent, selector: "fs-menu", inputs: ["class", "buttonClass", "buttonType", "buttonColor"], outputs: ["opened", "closed"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.FsMenuTriggerDirective, selector: "[fsMenuTriggerFor]", inputs: ["fsMenuTriggerFor"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2$1.FsMenuItemDirective, selector: "fs-menu-group,[fs-menu-item]" }], pipes: { "number": i3.DecimalPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, preserveWhitespaces: true });
5163
5067
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: FsStatusComponent, decorators: [{
5164
5068
  type: Component,
5165
- args: [{ selector: 'fs-list-status', changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: true, template: "<div class=\"status\">\r\n <small>\r\n <ng-container *ngIf=\"paging.enabled && !scrollable\">\r\n <ng-container *ngIf=\"paging.records > 0; else emptyResults\">\r\n Showing <a [fsMenuTriggerFor]=\"limitsMenu\">{{ paging.statusLabel }}</a> of {{ paging.records | number:'1.0':'en-US' }} results\r\n </ng-container>\r\n <ng-template #emptyResults>\r\n Showing <a [fsMenuTriggerFor]=\"limitsMenu\">0</a> results\r\n </ng-template>\r\n <ng-container *ngTemplateOutlet=\"sortedBy\"></ng-container><!--\r\n --></ng-container><!--\r\n\r\n --><ng-container *ngIf=\"(!paging.enabled || scrollable) && paging.displayed > 0\">\r\n <ng-container *ngIf=\"!scrollable; else scrollable\">\r\n Showing\r\n <span *ngIf=\"paging.displayed == 1\">{{ paging.displayed }} result </span>\r\n <span *ngIf=\"paging.displayed > 1\">{{ paging.displayed | number:'1.0':'en-US' }} results </span>\r\n </ng-container>\r\n\r\n <ng-template #scrollable>\r\n <span *ngIf=\"paging.records == 1\">{{ paging.records }} result </span>\r\n <span *ngIf=\"paging.records > 1\">{{ paging.records | number:'1.0':'en-US' }} results </span>\r\n </ng-template>\r\n <ng-container *ngTemplateOutlet=\"sortedBy\"></ng-container><!--\r\n --></ng-container><!--\r\n\r\n --><fs-list-saved-filters class=\"saved-filters\"></fs-list-saved-filters>\r\n\r\n <fs-menu [hidden]=\"!paging.enabled || scrollable\" #limitsMenu>\r\n <ng-template\r\n ngFor\r\n let-limit\r\n [ngForOf]=\"paging.limits\">\r\n <ng-template fs-menu-item (click)=\"setLimit(limit)\">\r\n {{ limit }}\r\n </ng-template>\r\n </ng-template>\r\n </fs-menu>\r\n\r\n <fs-menu [hidden]=\"!sorting.sortingColumn || paging.displayed === 0\" #orderColumnsMenu>\r\n <!-- Real sorting columns -->\r\n <ng-template\r\n ngFor\r\n let-column\r\n [ngForOf]=\"sorting.sortingColumns\">\r\n <ng-template fs-menu-item (click)=\"setSortableColumn(column)\">\r\n <ng-container *ngIf=\"column.title; else sortByTemplate\">\r\n {{ column.title }}\r\n </ng-container>\r\n <ng-template #sortByTemplate>\r\n <ng-template [ngTemplateOutlet]=\"column.headerTemplate\"></ng-template>\r\n </ng-template>\r\n </ng-template>\r\n </ng-template>\r\n\r\n <!-- Fake sorting columns -->\r\n <ng-template\r\n ngFor\r\n let-column\r\n [ngForOf]=\"sorting.fakeSortingColumns\">\r\n <ng-template fs-menu-item (click)=\"setSortableColumn(column)\">\r\n {{ column.title }}\r\n </ng-template>\r\n </ng-template>\r\n </fs-menu>\r\n\r\n <ng-template #sortedBy>\r\n <ng-container *ngIf=\"sorting.sortingColumn\">\r\n sorted by\r\n <ng-container *ngIf=\"sorting.sortingColumn.title; else sortByTemplate\">\r\n <a class=\"order-toggle\" [fsMenuTriggerFor]=\"orderColumnsMenu\">{{ sorting.sortingColumn.title }}</a>,\r\n </ng-container>\r\n <ng-template #sortByTemplate>\r\n <a class=\"order-toggle\" [fsMenuTriggerFor]=\"orderColumnsMenu\">\r\n <ng-template [ngTemplateOutlet]=\"sorting.sortingColumn.headerTemplate\"></ng-template>\r\n </a>,\r\n </ng-template>\r\n <a class=\"order-toggle\" (click)=\"toggleDirection()\">{{ sorting.sortingColumn.fullNameDirection }}</a><!--\r\n --></ng-container><!--\r\n --></ng-template>\r\n </small> \r\n</div>\r\n", styles: [":host.hidden-mobile{display:none!important}:host.first-load .status{visibility:hidden}.order-toggle{white-space:nowrap}a{cursor:pointer}\n"] }]
5069
+ args: [{ selector: 'fs-list-status', changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: true, template: "<div class=\"status\">\r\n <small>\r\n <ng-container *ngIf=\"paging.enabled\">\r\n <ng-container *ngIf=\"paging.records > 0; else emptyResults\">\r\n Showing <a [fsMenuTriggerFor]=\"limitsMenu\">{{ paging.statusLabel }}</a> of {{ paging.records | number:'1.0':'en-US' }} results\r\n </ng-container>\r\n <ng-template #emptyResults>\r\n Showing <a [fsMenuTriggerFor]=\"limitsMenu\">0</a> results\r\n </ng-template>\r\n <ng-container *ngTemplateOutlet=\"sortedBy\"></ng-container><!--\r\n --></ng-container><!--\r\n\r\n --><ng-container *ngIf=\"(!paging.enabled) && paging.displayed > 0\">\r\n <ng-container *ngIf=\"!scrollable; else scrollable\">\r\n Showing\r\n <span *ngIf=\"paging.displayed === 1\">{{ paging.displayed }} result </span>\r\n <span *ngIf=\"paging.displayed > 1\">{{ paging.displayed | number:'1.0':'en-US' }} results </span>\r\n </ng-container>\r\n\r\n <ng-template #scrollable>\r\n <span *ngIf=\"paging.records === 1\">{{ paging.records }} result </span>\r\n <span *ngIf=\"paging.records > 1\">{{ paging.records | number:'1.0':'en-US' }} results </span>\r\n </ng-template>\r\n <ng-container *ngTemplateOutlet=\"sortedBy\"></ng-container><!--\r\n --></ng-container><!--\r\n\r\n --><fs-list-saved-filters class=\"saved-filters\"></fs-list-saved-filters>\r\n\r\n <fs-menu [hidden]=\"!paging.enabled\" #limitsMenu>\r\n <ng-template\r\n ngFor\r\n let-limit\r\n [ngForOf]=\"paging.limits\">\r\n <ng-template fs-menu-item (click)=\"setLimit(limit)\">\r\n {{ limit }}\r\n </ng-template>\r\n </ng-template>\r\n </fs-menu>\r\n\r\n <fs-menu [hidden]=\"!sorting.sortingColumn || paging.displayed === 0\" #orderColumnsMenu>\r\n <!-- Real sorting columns -->\r\n <ng-template\r\n ngFor\r\n let-column\r\n [ngForOf]=\"sorting.sortingColumns\">\r\n <ng-template fs-menu-item (click)=\"setSortableColumn(column)\">\r\n <ng-container *ngIf=\"column.title; else sortByTemplate\">\r\n {{ column.title }}\r\n </ng-container>\r\n <ng-template #sortByTemplate>\r\n <ng-template [ngTemplateOutlet]=\"column.headerTemplate\"></ng-template>\r\n </ng-template>\r\n </ng-template>\r\n </ng-template>\r\n\r\n <!-- Fake sorting columns -->\r\n <ng-template\r\n ngFor\r\n let-column\r\n [ngForOf]=\"sorting.fakeSortingColumns\">\r\n <ng-template fs-menu-item (click)=\"setSortableColumn(column)\">\r\n {{ column.title }}\r\n </ng-template>\r\n </ng-template>\r\n </fs-menu>\r\n\r\n <ng-template #sortedBy>\r\n <ng-container *ngIf=\"sorting.sortingColumn\">\r\n sorted by\r\n <ng-container *ngIf=\"sorting.sortingColumn.title; else sortByTemplate\">\r\n <a class=\"order-toggle\" [fsMenuTriggerFor]=\"orderColumnsMenu\">{{ sorting.sortingColumn.title }}</a>,\r\n </ng-container>\r\n <ng-template #sortByTemplate>\r\n <a class=\"order-toggle\" [fsMenuTriggerFor]=\"orderColumnsMenu\">\r\n <ng-template [ngTemplateOutlet]=\"sorting.sortingColumn.headerTemplate\"></ng-template>\r\n </a>,\r\n </ng-template>\r\n <a class=\"order-toggle\" (click)=\"toggleDirection()\">{{ sorting.sortingColumn.fullNameDirection }}</a><!--\r\n --></ng-container><!--\r\n --></ng-template>\r\n </small> \r\n</div>\r\n", styles: [":host.hidden-mobile{display:none!important}:host.first-load .status{visibility:hidden}.order-toggle{white-space:nowrap}a{cursor:pointer}\n"] }]
5166
5070
  }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { paging: [{
5167
5071
  type: Input
5168
5072
  }], sorting: [{
5169
5073
  type: Input
5170
5074
  }], rows: [{
5171
5075
  type: Input
5172
- }], scrollable: [{
5173
- type: Input
5174
5076
  }], firstLoad: [{
5175
5077
  type: Input
5176
5078
  }, {
@@ -5266,10 +5168,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImpor
5266
5168
  }] } });
5267
5169
 
5268
5170
  class FsListComponent {
5269
- constructor(reorderController, _defaultOptions, _scroll, _dialogRef, _drawerRef, _el, _selectionDialog, _dialog, _cdRef, _groupExpandNotifier, _router, _route, _persistance, _location) {
5171
+ constructor(reorderController, _defaultOptions, _dialogRef, _drawerRef, _el, _selectionDialog, _dialog, _cdRef, _groupExpandNotifier, _router, _route, _persistance, _location) {
5270
5172
  this.reorderController = reorderController;
5271
5173
  this._defaultOptions = _defaultOptions;
5272
- this._scroll = _scroll;
5273
5174
  this._dialogRef = _dialogRef;
5274
5175
  this._drawerRef = _drawerRef;
5275
5176
  this._el = _el;
@@ -5334,13 +5235,11 @@ class FsListComponent {
5334
5235
  return this.list.status &&
5335
5236
  (this.list.sorting.isDefined || this.list.paging.enabled) &&
5336
5237
  (!this.reorderController.enabled ||
5337
- (this.reorderController.enabled && this.reorderController.status)) &&
5338
- ((this.list.scrollable && this.list.scrollable.status) || !this.list.scrollable);
5238
+ (this.reorderController.enabled && this.reorderController.status));
5339
5239
  }
5340
5240
  get paginatorVisible() {
5341
5241
  return this.list.paging.enabled
5342
5242
  && !this.firstLoad
5343
- && !this.list.scrollable
5344
5243
  && !this.list.emptyStateEnabled
5345
5244
  && this.list.dataController.visibleRowsCount > 0
5346
5245
  && this.list.paging.pages > 1;
@@ -5380,7 +5279,7 @@ class FsListComponent {
5380
5279
  this.list.paging.goLast();
5381
5280
  }
5382
5281
  reload() {
5383
- this.list.reload();
5282
+ return this.list.reload();
5384
5283
  }
5385
5284
  getData(trackBy) {
5386
5285
  return this.list.getData(trackBy);
@@ -5469,7 +5368,7 @@ class FsListComponent {
5469
5368
  this._restorePersistance(listConfig.persist);
5470
5369
  }
5471
5370
  this._updateCustomizeAction(listConfig.actions);
5472
- this.list = new List(this._el, listConfig, this._scroll, this._selectionDialog, this._router, this._route, this._persistance, this._inDialog);
5371
+ this.list = new List(this._el, listConfig, this._selectionDialog, this._router, this._route, this._persistance, this._inDialog);
5473
5372
  this.rowHoverHighlight = this.list.rowHoverHighlight;
5474
5373
  this._waitFirstLoad();
5475
5374
  this.reorderController.initWithConfig(config.reorder, this.list.dataController, this.list.actions, this.list.selection);
@@ -5555,31 +5454,29 @@ class FsListComponent {
5555
5454
  this._persistance.setConfig(persistConfig, namespace, this._inDialog);
5556
5455
  }
5557
5456
  }
5558
- FsListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: FsListComponent, deps: [{ token: ReorderController }, { token: FS_LIST_DEFAULT_CONFIG, optional: true }, { token: i2$4.FsScrollService, optional: true }, { token: i1$2.MatDialogRef, optional: true }, { token: i4$1.DrawerRef, optional: true }, { token: i0.ElementRef }, { token: i5.SelectionDialog }, { token: i1$2.MatDialog }, { token: i0.ChangeDetectorRef }, { token: GroupExpandNotifierService }, { token: i7.Router }, { token: i7.ActivatedRoute }, { token: PersistanceController }, { token: i3.Location }], target: i0.ɵɵFactoryTarget.Component });
5457
+ FsListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: FsListComponent, deps: [{ token: ReorderController }, { token: FS_LIST_DEFAULT_CONFIG, optional: true }, { token: i1$2.MatDialogRef, optional: true }, { token: i3$3.DrawerRef, optional: true }, { token: i0.ElementRef }, { token: i4$1.SelectionDialog }, { token: i1$2.MatDialog }, { token: i0.ChangeDetectorRef }, { token: GroupExpandNotifierService }, { token: i6.Router }, { token: i6.ActivatedRoute }, { token: PersistanceController }, { token: i3.Location }], target: i0.ɵɵFactoryTarget.Component });
5559
5458
  FsListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: FsListComponent, selector: "fs-list", inputs: { config: "config", loaderLines: "loaderLines" }, outputs: { filtersReady: "filtersReady" }, host: { properties: { "class.fs-list": "this.classFsList", "class.fs-list-row-highlight": "this.rowHoverHighlight" } }, providers: [
5560
5459
  GroupExpandNotifierService,
5561
5460
  PersistanceController,
5562
5461
  ReorderController,
5563
- ], queries: [{ propertyName: "headingTemplate", first: true, predicate: FsListHeadingDirective, descendants: true, read: TemplateRef }, { propertyName: "headingContainerTemplate", first: true, predicate: FsListHeadingContainerDirective, descendants: true, read: TemplateRef }, { propertyName: "subheadingTemplate", first: true, predicate: FsListSubheadingDirective, descendants: true, read: TemplateRef }, { propertyName: "_emptyStateTemplate", first: true, predicate: FsListEmptyStateDirective, descendants: true, read: TemplateRef }, { propertyName: "columnTemplates", predicate: FsListColumnDirective }], viewQueries: [{ propertyName: "body", first: true, predicate: FsBodyComponent, descendants: true }, { propertyName: "filterReference", first: true, predicate: FilterComponent, descendants: true }], ngImport: i0, 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 \n class=\"fs-list-table\" \n role=\"grid\" \n [fsListContentInit]=\"list.afterContentInit\" \n [ngClass]=\"{\n 'style-card': list.style === 'card',\n 'style-basic': list.style === 'basic',\n 'style-line': (list.style || 'line') === 'line'\n }\">\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 [activeFiltersCount]=\"list.activeFiltersCount$ | async\"\n [reorderEnabled]=\"reorderController.enabled$ | async\"\n [reorderPosition]=\"reorderController.position$ | async\"\n [reorderStrategy]=\"reorderController.strategy$ | async\">\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 [activeFiltersCount]=\"list.activeFiltersCount$ | async\"\n [reorderEnabled]=\"reorderController.enabled$ | async\"\n [reorderPosition]=\"reorderController.position$ | async\"\n [reorderStrategy]=\"reorderController.strategy$ | async\"\n [reorderMultiple]=\"reorderController.multiple\">\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 [activeFiltersCount]=\"list.activeFiltersCount$ | async\"\n [reorderEnabled]=\"reorderController.enabled$ | async\"\n [reorderPosition]=\"reorderController.position$ | async\"\n [reorderStrategy]=\"reorderController.strategy$ | async\">\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=\"headingContainerTemplate || list.heading || list.subheading || headingTemplate\">\n <ng-container *ngIf=\"headingContainerTemplate; else headingContainer\">\n <ng-container\n [ngTemplateOutlet]=\"headingContainerTemplate\"\n [ngTemplateOutletContext]=\"{ template: headingContainer }\">\n </ng-container>\n </ng-container>\n <ng-template #headingContainer>\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 </ng-template>\n </div>\n</ng-template>\n", styles: [":host{display:block;width:100%}: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}:host ::ng-deep .multiple-selection{background-color:#2196f380}:host ::ng-deep .multiple-selection ::ng-deep .fs-list-col{background-color:#2196f380}@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-head,.fs-list-container.loading .fs-list-footer,.fs-list-container.loading fs-list-pagination,.fs-list-container.loading ::ng-deep fs-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-head,.fs-list-container.first-load .fs-list-footer,.fs-list-container.first-load fs-list-pagination,.fs-list-container.first-load ::ng-deep fs-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-container .fs-list-header .heading-container{display:flex;flex-direction:column;justify-content:center}.fs-list-container .fs-list-header .heading{margin:0}.fs-list-container .fs-list-header h2+.subheading{margin:2px 0 0}.fs-list-container .fs-list-filter{margin-bottom:0;position:initial!important;display:block;width:100%}.fs-list-container .fs-list-no-results-container .fs-list-no-results{text-align:center;color:#999;padding:10px 0}.fs-list-container .fs-list-table-container{width:100%;overflow:auto}::ng-deep .fs-list-table{border-spacing:0;display:table;width:100%;border-collapse:collapse}::ng-deep .fs-list-table thead{display:table-header-group}::ng-deep .fs-list-table thead th{color:#999;padding:8px;font-weight:400;color:#8f8f8f;font-size:85%;text-align:left}::ng-deep .fs-list-table tbody{display:table-row-group;position:relative}::ng-deep .fs-list-table tbody tr,::ng-deep .fs-list-table thead tr,::ng-deep .fs-list-table tfoot tr{display:table-row}::ng-deep .fs-list-table tbody tr td,::ng-deep .fs-list-table thead tr td,::ng-deep .fs-list-table tfoot tr td{display:table-cell;padding:8px;vertical-align:middle;outline:none;text-align:left}::ng-deep .fs-list-table tfoot td{padding:8px}::ng-deep .fs-list-table.style-line tbody .fs-list-col,::ng-deep .fs-list-table:not(.style-card):not(.style-basic) tbody .fs-list-col{box-sizing:border-box;border-top:1px solid #ddd}::ng-deep .fs-list-table.style-line tbody .fs-list-row:first-child .fs-list-col,::ng-deep .fs-list-table:not(.style-card):not(.style-basic) tbody .fs-list-row:first-child .fs-list-col{border-top:2px solid #ddd}::ng-deep .fs-list-table.style-line tbody .fs-list-row:last-child .fs-list-col,::ng-deep .fs-list-table:not(.style-card):not(.style-basic) tbody .fs-list-row:last-child .fs-list-col{border-bottom:2px solid #ddd}::ng-deep .fs-list-table.style-line .fs-list-container.has-dragging thead th,::ng-deep .fs-list-table:not(.style-card):not(.style-basic) .fs-list-container.has-dragging thead th{border-bottom:2px solid #ddd}::ng-deep .fs-list-table.style-line .fs-list-container.has-dragging tbody tr:nth-child(2) td,::ng-deep .fs-list-table:not(.style-card):not(.style-basic) .fs-list-container.has-dragging tbody tr:nth-child(2) td{border-top:none}::ng-deep .fs-list-table.style-card{border-spacing:0 8px;border-collapse:separate}::ng-deep .fs-list-table.style-card tbody tr:not(.fs-list-row-group-footer):not(.fs-list-row-group){background-color:#fafafa;border-radius:10px}::ng-deep .fs-list-table.style-card tbody tr td{border:none!important;padding:8px 16px}::ng-deep .fs-list-table.style-card tbody tr td:first-child{border-top-left-radius:10px;border-bottom-left-radius:10px}::ng-deep .fs-list-table.style-card tbody tr td:last-child{border-top-right-radius:10px;border-bottom-right-radius:10px}::ng-deep .fs-list-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 .reorder-in-progress{-webkit-user-select:none;user-select:none}@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}}:host(.fs-list-row-highlight) ::ng-deep tbody .fs-list-row:hover .fs-list-col{background-color:#f6f6f6}\n"], components: [{ type: i2$3.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", "activeFiltersCount", "reorderEnabled", "reorderPosition", "reorderStrategy"] }, { type: FsBodyComponent, selector: "[fs-list-body]", inputs: ["rows", "columns", "hasFooter", "rowActionsRaw", "groupActionsRaw", "rowEvents", "rowClass", "hasRowActions", "selection", "restoreMode", "rowRemoved", "activeFiltersCount", "reorderEnabled", "reorderPosition", "reorderStrategy", "reorderMultiple"] }, { type: FsFooterComponent, selector: "[fs-list-footer]", inputs: ["hasRowActions", "columns", "selection", "activeFiltersCount", "reorderEnabled", "reorderPosition", "reorderStrategy"] }, { type: FsListLoaderComponent, selector: "fs-list-loader", inputs: ["columns", "loaderLines"] }, { type: FsPaginationComponent, selector: "fs-list-pagination", inputs: ["pagination", "rows"] }], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$3.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.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
5462
+ ], queries: [{ propertyName: "headingTemplate", first: true, predicate: FsListHeadingDirective, descendants: true, read: TemplateRef }, { propertyName: "headingContainerTemplate", first: true, predicate: FsListHeadingContainerDirective, descendants: true, read: TemplateRef }, { propertyName: "subheadingTemplate", first: true, predicate: FsListSubheadingDirective, descendants: true, read: TemplateRef }, { propertyName: "_emptyStateTemplate", first: true, predicate: FsListEmptyStateDirective, descendants: true, read: TemplateRef }, { propertyName: "columnTemplates", predicate: FsListColumnDirective }], viewQueries: [{ propertyName: "body", first: true, predicate: FsBodyComponent, descendants: true }, { propertyName: "filterReference", first: true, predicate: FilterComponent, descendants: true }], ngImport: i0, 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 </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 \n class=\"fs-list-table\" \n role=\"grid\" \n [fsListContentInit]=\"list.afterContentInit\" \n [ngClass]=\"{\n 'style-card': list.style === 'card',\n 'style-basic': list.style === 'basic',\n 'style-line': (list.style || 'line') === 'line'\n }\">\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 [activeFiltersCount]=\"list.activeFiltersCount$ | async\"\n [reorderEnabled]=\"reorderController.enabled$ | async\"\n [reorderPosition]=\"reorderController.position$ | async\"\n [reorderStrategy]=\"reorderController.strategy$ | async\">\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 [activeFiltersCount]=\"list.activeFiltersCount$ | async\"\n [reorderEnabled]=\"reorderController.enabled$ | async\"\n [reorderPosition]=\"reorderController.position$ | async\"\n [reorderStrategy]=\"reorderController.strategy$ | async\"\n [reorderMultiple]=\"reorderController.multiple\">\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 [activeFiltersCount]=\"list.activeFiltersCount$ | async\"\n [reorderEnabled]=\"reorderController.enabled$ | async\"\n [reorderPosition]=\"reorderController.position$ | async\"\n [reorderStrategy]=\"reorderController.strategy$ | async\">\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=\"headingContainerTemplate || list.heading || list.subheading || headingTemplate\">\n <ng-container *ngIf=\"headingContainerTemplate; else headingContainer\">\n <ng-container\n [ngTemplateOutlet]=\"headingContainerTemplate\"\n [ngTemplateOutletContext]=\"{ template: headingContainer }\">\n </ng-container>\n </ng-container>\n <ng-template #headingContainer>\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 </ng-template>\n </div>\n</ng-template>\n", styles: [":host{display:block;width:100%}: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}:host ::ng-deep .multiple-selection{background-color:#2196f380}:host ::ng-deep .multiple-selection ::ng-deep .fs-list-col{background-color:#2196f380}@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-head,.fs-list-container.loading .fs-list-footer,.fs-list-container.loading fs-list-pagination,.fs-list-container.loading ::ng-deep fs-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-head,.fs-list-container.first-load .fs-list-footer,.fs-list-container.first-load fs-list-pagination,.fs-list-container.first-load ::ng-deep fs-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-container .fs-list-header .heading-container{display:flex;flex-direction:column;justify-content:center}.fs-list-container .fs-list-header .heading{margin:0}.fs-list-container .fs-list-header h2+.subheading{margin:2px 0 0}.fs-list-container .fs-list-filter{margin-bottom:0;position:initial!important;display:block;width:100%}.fs-list-container .fs-list-no-results-container .fs-list-no-results{text-align:center;color:#999;padding:10px 0}.fs-list-container .fs-list-table-container{width:100%;overflow:auto}::ng-deep .fs-list-table{border-spacing:0;display:table;width:100%;border-collapse:collapse}::ng-deep .fs-list-table thead{display:table-header-group}::ng-deep .fs-list-table thead th{color:#999;padding:8px;font-weight:400;color:#8f8f8f;font-size:85%;text-align:left}::ng-deep .fs-list-table tbody{display:table-row-group;position:relative}::ng-deep .fs-list-table tbody tr,::ng-deep .fs-list-table thead tr,::ng-deep .fs-list-table tfoot tr{display:table-row}::ng-deep .fs-list-table tbody tr td,::ng-deep .fs-list-table thead tr td,::ng-deep .fs-list-table tfoot tr td{display:table-cell;padding:8px;vertical-align:middle;outline:none;text-align:left}::ng-deep .fs-list-table tfoot td{padding:8px}::ng-deep .fs-list-table.style-line tbody .fs-list-col,::ng-deep .fs-list-table:not(.style-card):not(.style-basic) tbody .fs-list-col{box-sizing:border-box;border-top:1px solid #ddd}::ng-deep .fs-list-table.style-line tbody .fs-list-row:first-child .fs-list-col,::ng-deep .fs-list-table:not(.style-card):not(.style-basic) tbody .fs-list-row:first-child .fs-list-col{border-top:2px solid #ddd}::ng-deep .fs-list-table.style-line tbody .fs-list-row:last-child .fs-list-col,::ng-deep .fs-list-table:not(.style-card):not(.style-basic) tbody .fs-list-row:last-child .fs-list-col{border-bottom:2px solid #ddd}::ng-deep .fs-list-table.style-line .fs-list-container.has-dragging thead th,::ng-deep .fs-list-table:not(.style-card):not(.style-basic) .fs-list-container.has-dragging thead th{border-bottom:2px solid #ddd}::ng-deep .fs-list-table.style-line .fs-list-container.has-dragging tbody tr:nth-child(2) td,::ng-deep .fs-list-table:not(.style-card):not(.style-basic) .fs-list-container.has-dragging tbody tr:nth-child(2) td{border-top:none}::ng-deep .fs-list-table.style-card{border-spacing:0 8px;border-collapse:separate}::ng-deep .fs-list-table.style-card tbody tr:not(.fs-list-row-group-footer):not(.fs-list-row-group){background-color:#fafafa;border-radius:10px}::ng-deep .fs-list-table.style-card tbody tr td{border:none!important;padding:8px 16px}::ng-deep .fs-list-table.style-card tbody tr td:first-child{border-top-left-radius:10px;border-bottom-left-radius:10px}::ng-deep .fs-list-table.style-card tbody tr td:last-child{border-top-right-radius:10px;border-bottom-right-radius:10px}::ng-deep .fs-list-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 .reorder-in-progress{-webkit-user-select:none;user-select:none}@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}}:host(.fs-list-row-highlight) ::ng-deep tbody .fs-list-row:hover .fs-list-col{background-color:#f6f6f6}\n"], components: [{ type: i2$3.FilterComponent, selector: "fs-filter", inputs: ["config", "filter", "showSortBy", "showFilterInput"], outputs: ["closed", "opened", "ready"] }, { type: FsStatusComponent, selector: "fs-list-status", inputs: ["paging", "sorting", "rows", "firstLoad"] }, { type: FsHeadComponent, selector: "[fs-list-head]", inputs: ["sorting", "columns", "hasRowActions", "selection", "activeFiltersCount", "reorderEnabled", "reorderPosition", "reorderStrategy"] }, { type: FsBodyComponent, selector: "[fs-list-body]", inputs: ["rows", "columns", "hasFooter", "rowActionsRaw", "groupActionsRaw", "rowEvents", "rowClass", "hasRowActions", "selection", "restoreMode", "rowRemoved", "activeFiltersCount", "reorderEnabled", "reorderPosition", "reorderStrategy", "reorderMultiple"] }, { type: FsFooterComponent, selector: "[fs-list-footer]", inputs: ["hasRowActions", "columns", "selection", "activeFiltersCount", "reorderEnabled", "reorderPosition", "reorderStrategy"] }, { type: FsListLoaderComponent, selector: "fs-list-loader", inputs: ["columns", "loaderLines"] }, { type: FsPaginationComponent, selector: "fs-list-pagination", inputs: ["pagination", "rows"] }], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$3.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.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
5564
5463
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: FsListComponent, decorators: [{
5565
5464
  type: Component,
5566
5465
  args: [{ selector: 'fs-list', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
5567
5466
  GroupExpandNotifierService,
5568
5467
  PersistanceController,
5569
5468
  ReorderController,
5570
- ], 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 \n class=\"fs-list-table\" \n role=\"grid\" \n [fsListContentInit]=\"list.afterContentInit\" \n [ngClass]=\"{\n 'style-card': list.style === 'card',\n 'style-basic': list.style === 'basic',\n 'style-line': (list.style || 'line') === 'line'\n }\">\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 [activeFiltersCount]=\"list.activeFiltersCount$ | async\"\n [reorderEnabled]=\"reorderController.enabled$ | async\"\n [reorderPosition]=\"reorderController.position$ | async\"\n [reorderStrategy]=\"reorderController.strategy$ | async\">\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 [activeFiltersCount]=\"list.activeFiltersCount$ | async\"\n [reorderEnabled]=\"reorderController.enabled$ | async\"\n [reorderPosition]=\"reorderController.position$ | async\"\n [reorderStrategy]=\"reorderController.strategy$ | async\"\n [reorderMultiple]=\"reorderController.multiple\">\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 [activeFiltersCount]=\"list.activeFiltersCount$ | async\"\n [reorderEnabled]=\"reorderController.enabled$ | async\"\n [reorderPosition]=\"reorderController.position$ | async\"\n [reorderStrategy]=\"reorderController.strategy$ | async\">\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=\"headingContainerTemplate || list.heading || list.subheading || headingTemplate\">\n <ng-container *ngIf=\"headingContainerTemplate; else headingContainer\">\n <ng-container\n [ngTemplateOutlet]=\"headingContainerTemplate\"\n [ngTemplateOutletContext]=\"{ template: headingContainer }\">\n </ng-container>\n </ng-container>\n <ng-template #headingContainer>\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 </ng-template>\n </div>\n</ng-template>\n", styles: [":host{display:block;width:100%}: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}:host ::ng-deep .multiple-selection{background-color:#2196f380}:host ::ng-deep .multiple-selection ::ng-deep .fs-list-col{background-color:#2196f380}@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-head,.fs-list-container.loading .fs-list-footer,.fs-list-container.loading fs-list-pagination,.fs-list-container.loading ::ng-deep fs-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-head,.fs-list-container.first-load .fs-list-footer,.fs-list-container.first-load fs-list-pagination,.fs-list-container.first-load ::ng-deep fs-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-container .fs-list-header .heading-container{display:flex;flex-direction:column;justify-content:center}.fs-list-container .fs-list-header .heading{margin:0}.fs-list-container .fs-list-header h2+.subheading{margin:2px 0 0}.fs-list-container .fs-list-filter{margin-bottom:0;position:initial!important;display:block;width:100%}.fs-list-container .fs-list-no-results-container .fs-list-no-results{text-align:center;color:#999;padding:10px 0}.fs-list-container .fs-list-table-container{width:100%;overflow:auto}::ng-deep .fs-list-table{border-spacing:0;display:table;width:100%;border-collapse:collapse}::ng-deep .fs-list-table thead{display:table-header-group}::ng-deep .fs-list-table thead th{color:#999;padding:8px;font-weight:400;color:#8f8f8f;font-size:85%;text-align:left}::ng-deep .fs-list-table tbody{display:table-row-group;position:relative}::ng-deep .fs-list-table tbody tr,::ng-deep .fs-list-table thead tr,::ng-deep .fs-list-table tfoot tr{display:table-row}::ng-deep .fs-list-table tbody tr td,::ng-deep .fs-list-table thead tr td,::ng-deep .fs-list-table tfoot tr td{display:table-cell;padding:8px;vertical-align:middle;outline:none;text-align:left}::ng-deep .fs-list-table tfoot td{padding:8px}::ng-deep .fs-list-table.style-line tbody .fs-list-col,::ng-deep .fs-list-table:not(.style-card):not(.style-basic) tbody .fs-list-col{box-sizing:border-box;border-top:1px solid #ddd}::ng-deep .fs-list-table.style-line tbody .fs-list-row:first-child .fs-list-col,::ng-deep .fs-list-table:not(.style-card):not(.style-basic) tbody .fs-list-row:first-child .fs-list-col{border-top:2px solid #ddd}::ng-deep .fs-list-table.style-line tbody .fs-list-row:last-child .fs-list-col,::ng-deep .fs-list-table:not(.style-card):not(.style-basic) tbody .fs-list-row:last-child .fs-list-col{border-bottom:2px solid #ddd}::ng-deep .fs-list-table.style-line .fs-list-container.has-dragging thead th,::ng-deep .fs-list-table:not(.style-card):not(.style-basic) .fs-list-container.has-dragging thead th{border-bottom:2px solid #ddd}::ng-deep .fs-list-table.style-line .fs-list-container.has-dragging tbody tr:nth-child(2) td,::ng-deep .fs-list-table:not(.style-card):not(.style-basic) .fs-list-container.has-dragging tbody tr:nth-child(2) td{border-top:none}::ng-deep .fs-list-table.style-card{border-spacing:0 8px;border-collapse:separate}::ng-deep .fs-list-table.style-card tbody tr:not(.fs-list-row-group-footer):not(.fs-list-row-group){background-color:#fafafa;border-radius:10px}::ng-deep .fs-list-table.style-card tbody tr td{border:none!important;padding:8px 16px}::ng-deep .fs-list-table.style-card tbody tr td:first-child{border-top-left-radius:10px;border-bottom-left-radius:10px}::ng-deep .fs-list-table.style-card tbody tr td:last-child{border-top-right-radius:10px;border-bottom-right-radius:10px}::ng-deep .fs-list-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 .reorder-in-progress{-webkit-user-select:none;user-select:none}@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}}:host(.fs-list-row-highlight) ::ng-deep tbody .fs-list-row:hover .fs-list-col{background-color:#f6f6f6}\n"] }]
5469
+ ], 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 </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 \n class=\"fs-list-table\" \n role=\"grid\" \n [fsListContentInit]=\"list.afterContentInit\" \n [ngClass]=\"{\n 'style-card': list.style === 'card',\n 'style-basic': list.style === 'basic',\n 'style-line': (list.style || 'line') === 'line'\n }\">\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 [activeFiltersCount]=\"list.activeFiltersCount$ | async\"\n [reorderEnabled]=\"reorderController.enabled$ | async\"\n [reorderPosition]=\"reorderController.position$ | async\"\n [reorderStrategy]=\"reorderController.strategy$ | async\">\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 [activeFiltersCount]=\"list.activeFiltersCount$ | async\"\n [reorderEnabled]=\"reorderController.enabled$ | async\"\n [reorderPosition]=\"reorderController.position$ | async\"\n [reorderStrategy]=\"reorderController.strategy$ | async\"\n [reorderMultiple]=\"reorderController.multiple\">\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 [activeFiltersCount]=\"list.activeFiltersCount$ | async\"\n [reorderEnabled]=\"reorderController.enabled$ | async\"\n [reorderPosition]=\"reorderController.position$ | async\"\n [reorderStrategy]=\"reorderController.strategy$ | async\">\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=\"headingContainerTemplate || list.heading || list.subheading || headingTemplate\">\n <ng-container *ngIf=\"headingContainerTemplate; else headingContainer\">\n <ng-container\n [ngTemplateOutlet]=\"headingContainerTemplate\"\n [ngTemplateOutletContext]=\"{ template: headingContainer }\">\n </ng-container>\n </ng-container>\n <ng-template #headingContainer>\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 </ng-template>\n </div>\n</ng-template>\n", styles: [":host{display:block;width:100%}: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}:host ::ng-deep .multiple-selection{background-color:#2196f380}:host ::ng-deep .multiple-selection ::ng-deep .fs-list-col{background-color:#2196f380}@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-head,.fs-list-container.loading .fs-list-footer,.fs-list-container.loading fs-list-pagination,.fs-list-container.loading ::ng-deep fs-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-head,.fs-list-container.first-load .fs-list-footer,.fs-list-container.first-load fs-list-pagination,.fs-list-container.first-load ::ng-deep fs-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-container .fs-list-header .heading-container{display:flex;flex-direction:column;justify-content:center}.fs-list-container .fs-list-header .heading{margin:0}.fs-list-container .fs-list-header h2+.subheading{margin:2px 0 0}.fs-list-container .fs-list-filter{margin-bottom:0;position:initial!important;display:block;width:100%}.fs-list-container .fs-list-no-results-container .fs-list-no-results{text-align:center;color:#999;padding:10px 0}.fs-list-container .fs-list-table-container{width:100%;overflow:auto}::ng-deep .fs-list-table{border-spacing:0;display:table;width:100%;border-collapse:collapse}::ng-deep .fs-list-table thead{display:table-header-group}::ng-deep .fs-list-table thead th{color:#999;padding:8px;font-weight:400;color:#8f8f8f;font-size:85%;text-align:left}::ng-deep .fs-list-table tbody{display:table-row-group;position:relative}::ng-deep .fs-list-table tbody tr,::ng-deep .fs-list-table thead tr,::ng-deep .fs-list-table tfoot tr{display:table-row}::ng-deep .fs-list-table tbody tr td,::ng-deep .fs-list-table thead tr td,::ng-deep .fs-list-table tfoot tr td{display:table-cell;padding:8px;vertical-align:middle;outline:none;text-align:left}::ng-deep .fs-list-table tfoot td{padding:8px}::ng-deep .fs-list-table.style-line tbody .fs-list-col,::ng-deep .fs-list-table:not(.style-card):not(.style-basic) tbody .fs-list-col{box-sizing:border-box;border-top:1px solid #ddd}::ng-deep .fs-list-table.style-line tbody .fs-list-row:first-child .fs-list-col,::ng-deep .fs-list-table:not(.style-card):not(.style-basic) tbody .fs-list-row:first-child .fs-list-col{border-top:2px solid #ddd}::ng-deep .fs-list-table.style-line tbody .fs-list-row:last-child .fs-list-col,::ng-deep .fs-list-table:not(.style-card):not(.style-basic) tbody .fs-list-row:last-child .fs-list-col{border-bottom:2px solid #ddd}::ng-deep .fs-list-table.style-line .fs-list-container.has-dragging thead th,::ng-deep .fs-list-table:not(.style-card):not(.style-basic) .fs-list-container.has-dragging thead th{border-bottom:2px solid #ddd}::ng-deep .fs-list-table.style-line .fs-list-container.has-dragging tbody tr:nth-child(2) td,::ng-deep .fs-list-table:not(.style-card):not(.style-basic) .fs-list-container.has-dragging tbody tr:nth-child(2) td{border-top:none}::ng-deep .fs-list-table.style-card{border-spacing:0 8px;border-collapse:separate}::ng-deep .fs-list-table.style-card tbody tr:not(.fs-list-row-group-footer):not(.fs-list-row-group){background-color:#fafafa;border-radius:10px}::ng-deep .fs-list-table.style-card tbody tr td{border:none!important;padding:8px 16px}::ng-deep .fs-list-table.style-card tbody tr td:first-child{border-top-left-radius:10px;border-bottom-left-radius:10px}::ng-deep .fs-list-table.style-card tbody tr td:last-child{border-top-right-radius:10px;border-bottom-right-radius:10px}::ng-deep .fs-list-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 .reorder-in-progress{-webkit-user-select:none;user-select:none}@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}}:host(.fs-list-row-highlight) ::ng-deep tbody .fs-list-row:hover .fs-list-col{background-color:#f6f6f6}\n"] }]
5571
5470
  }], ctorParameters: function () { return [{ type: ReorderController }, { type: undefined, decorators: [{
5572
5471
  type: Optional
5573
5472
  }, {
5574
5473
  type: Inject,
5575
5474
  args: [FS_LIST_DEFAULT_CONFIG]
5576
- }] }, { type: i2$4.FsScrollService, decorators: [{
5577
- type: Optional
5578
5475
  }] }, { type: i1$2.MatDialogRef, decorators: [{
5579
5476
  type: Optional
5580
- }] }, { type: i4$1.DrawerRef, decorators: [{
5477
+ }] }, { type: i3$3.DrawerRef, decorators: [{
5581
5478
  type: Optional
5582
- }] }, { type: i0.ElementRef }, { type: i5.SelectionDialog }, { type: i1$2.MatDialog }, { type: i0.ChangeDetectorRef }, { type: GroupExpandNotifierService }, { type: i7.Router }, { type: i7.ActivatedRoute }, { type: PersistanceController }, { type: i3.Location }]; }, propDecorators: { classFsList: [{
5479
+ }] }, { type: i0.ElementRef }, { type: i4$1.SelectionDialog }, { type: i1$2.MatDialog }, { type: i0.ChangeDetectorRef }, { type: GroupExpandNotifierService }, { type: i6.Router }, { type: i6.ActivatedRoute }, { type: PersistanceController }, { type: i3.Location }]; }, propDecorators: { classFsList: [{
5583
5480
  type: HostBinding,
5584
5481
  args: ['class.fs-list']
5585
5482
  }], rowHoverHighlight: [{