@firestitch/list 12.2.1 → 12.3.2

package/fesm2015/firestitch-list.js

@@ -29,26 +29,24 @@ import * as i1$1 from '@firestitch/prompt';
 import { FsPromptModule } from '@firestitch/prompt';
 import * as i4$1 from '@firestitch/file';
 import { FsFileModule } from '@firestitch/file';
+import * as i5$1 from '@firestitch/common';
+import { getNormalizedPath, FsCommonModule } from '@firestitch/common';
 import { isString, isObject, isBoolean, isNumber, isFunction, get, cloneDeep, random, mergeWith, merge as merge$1 } from 'lodash-es';
 import { BehaviorSubject, Subject, merge, Observable, from, combineLatest, of } from 'rxjs';
 import { takeUntil, tap, skip, distinctUntilChanged, take, map, debounceTime, switchMap, mapTo, catchError, shareReplay, filter } from 'rxjs/operators';
 import * as i3$3 from '@firestitch/selection';
-import { getNormalizedPath } from '@firestitch/common';
 import * as i9 from '@firestitch/drawer';
-import { __decorate, __metadata } from 'tslib';
-import { Model, Alias } from 'tsmodels';
 import * as i1 from '@firestitch/store';
 import { FsPersistanceStore } from '@firestitch/store';
 import * as i5 from '@angular/flex-layout/extended';
 import * as i3$2 from '@angular/flex-layout/flex';
 
-class StyleConfig extends Model {
+class StyleConfig {
     constructor(config = {}) {
-        super();
         this.className = []; // Can't be used in tempaltes!
         this.classesArray = []; // Can be used in tempaltes
         this.classesString = '';
-        this._fromJSON(config);
+        this._init(config);
     }
     /**
      * Create static array of styles for using in templates
@@ -98,6 +96,11 @@ class StyleConfig extends Model {
         }
         this.className = targetValue;
     }
+    _init(config) {
+        this.colspan = config.colspan;
+        this.align = config.align;
+        this.className = config.className;
+    }
     /**
      * Merge params into array
      * @param to
@@ -112,18 +115,6 @@ class StyleConfig extends Model {
         }
     }
 }
-__decorate([
-    Alias(),
-    __metadata("design:type", Object)
-], StyleConfig.prototype, "colspan", void 0);
-__decorate([
-    Alias(),
-    __metadata("design:type", String)
-], StyleConfig.prototype, "align", void 0);
-__decorate([
-    Alias(),
-    __metadata("design:type", Object)
-], StyleConfig.prototype, "className", void 0);
 
 var SortingDirection;
 (function (SortingDirection) {
@@ -299,14 +290,13 @@ var ActionType;
     ActionType["MiniFab"] = "mini-fab";
 })(ActionType || (ActionType = {}));
 
-class RowAction extends Model {
+class RowAction {
     constructor(config = {}) {
-        super();
         this.label = '';
         this.classArray = [];
         this.isShown = true;
         this._isGroup = false;
-        this._fromJSON(config);
+        this._init(config);
         if (Array.isArray(this.rowActions)) {
             this._isGroup = true;
         }
@@ -314,14 +304,16 @@ class RowAction extends Model {
     get isGroup() {
         return this._isGroup;
     }
-    _fromJSON(value) {
-        super._fromJSON(value);
-        if (value.type === void 0) {
-            this.type = ActionType.Basic;
-        }
-        if (this.menu === void 0) {
-            this.menu = true;
-        }
+    _init(value) {
+        var _a, _b, _c;
+        this.icon = value.icon;
+        this.menu = (_a = value.menu) !== null && _a !== void 0 ? _a : true;
+        this.remove = value.remove;
+        this.className = value.className;
+        this.type = (_b = value.type) !== null && _b !== void 0 ? _b : ActionType.Basic;
+        this.show = value.show;
+        this.restore = value.restore;
+        this.rowActions = (_c = value.rowActions) === null || _c === void 0 ? void 0 : _c.map((action) => new RowAction(action));
         // Re-assign click function
         const clickFn = value.click;
         this.click = (row, event, index, rowActionsRef = null) => {
@@ -405,38 +397,6 @@ class RowAction extends Model {
         }
     }
 }
-__decorate([
-    Alias(),
-    __metadata("design:type", String)
-], RowAction.prototype, "icon", void 0);
-__decorate([
-    Alias(),
-    __metadata("design:type", Boolean)
-], RowAction.prototype, "menu", void 0);
-__decorate([
-    Alias(),
-    __metadata("design:type", Object)
-], RowAction.prototype, "remove", void 0);
-__decorate([
-    Alias(),
-    __metadata("design:type", String)
-], RowAction.prototype, "className", void 0);
-__decorate([
-    Alias(),
-    __metadata("design:type", String)
-], RowAction.prototype, "type", void 0);
-__decorate([
-    Alias(),
-    __metadata("design:type", Function)
-], RowAction.prototype, "show", void 0);
-__decorate([
-    Alias(),
-    __metadata("design:type", Boolean)
-], RowAction.prototype, "restore", void 0);
-__decorate([
-    Alias('rowActions', RowAction),
-    __metadata("design:type", Array)
-], RowAction.prototype, "rowActions", void 0);
 
 class ColumnsController {
     constructor() {
@@ -2614,9 +2574,8 @@ class ExternalParamsController {
 }
 
 const SHOW_DELETED_FILTERS_KEY = '$$_show_deleted_$$';
-class List extends Model {
+class List {
     constructor(el, config = {}, fsScroll, selectionDialog, router, route, persistance, inDialog) {
-        super();
         this.el = el;
         this.config = config;
         this.fsScroll = fsScroll;
@@ -2626,7 +2585,6 @@ class List extends Model {
         this.persistance = persistance;
         this.inDialog = inDialog;
         this.filters = [];
-        this.scrollable = false;
         // @Alias('rows') private _rows: any;
         this.initialized$ = new BehaviorSubject(false);
         this.loading$ = new BehaviorSubject(false);
@@ -2649,7 +2607,6 @@ class List extends Model {
         this.emptyStateEnabled = false;
         this.onDestroy$ = new Subject();
         this._filtersQuery = new BehaviorSubject(null);
-        this._fromJSON(config);
         this.initialize(config);
         this._headerConfig = new StyleConfig(config.header);
         this._groupCellConfig = new StyleConfig(config.cell);
@@ -2839,6 +2796,24 @@ class List extends Model {
      * @param config
      */
     initialize(config) {
+        var _a;
+        this.heading = config.heading;
+        this.trackBy = config.trackBy;
+        this.subheading = config.subheading;
+        this.rowActionsRaw = config.rowActions;
+        this.rowClass = config.rowClass;
+        this.rowEvents = config.rowEvents;
+        this.restore = config.restore;
+        this.persist = config.persist;
+        this.filters = (_a = config.filters) !== null && _a !== void 0 ? _a : [];
+        this.filterInitCb = config.filterInit;
+        this.filterChangeCb = config.filterChange;
+        this.savedFilters = config.savedFilters;
+        this.scrollable = config.scrollable;
+        this.noResults = config.noResults;
+        this.emptyState = config.emptyState;
+        this.fetchFn = config.fetch;
+        this.afterFetchFn = config.afterFetch;
         this.columns.initConfig(config.column);
         this.initDefaultOptions(config);
         this.initRestore();
@@ -3123,7 +3098,7 @@ class List extends Model {
             persist: this.persist,
             items: this.filters || [],
             savedFilters: this.savedFilters,
-            inline: this.inlineFilters,
+            // inline: this.inlineFilters,
             actions: this.actions.actions,
             queryParam: this.queryParam,
             sorts: sortValues,
@@ -3279,82 +3254,6 @@ class List extends Model {
         }
     }
 }
-__decorate([
-    Alias(),
-    __metadata("design:type", String)
-], List.prototype, "heading", void 0);
-__decorate([
-    Alias(),
-    __metadata("design:type", String)
-], List.prototype, "trackBy", void 0);
-__decorate([
-    Alias(),
-    __metadata("design:type", String)
-], List.prototype, "subheading", void 0);
-__decorate([
-    Alias(),
-    __metadata("design:type", Object)
-], List.prototype, "inlineFilters", void 0);
-__decorate([
-    Alias('rowActions'),
-    __metadata("design:type", Array)
-], List.prototype, "rowActionsRaw", void 0);
-__decorate([
-    Alias('rowClass'),
-    __metadata("design:type", Object)
-], List.prototype, "rowClass", void 0);
-__decorate([
-    Alias(),
-    __metadata("design:type", Object)
-], List.prototype, "rowEvents", void 0);
-__decorate([
-    Alias(),
-    __metadata("design:type", Object)
-], List.prototype, "restore", void 0);
-__decorate([
-    Alias(),
-    __metadata("design:type", Object)
-], List.prototype, "columnTemplates", void 0);
-__decorate([
-    Alias(),
-    __metadata("design:type", Boolean)
-], List.prototype, "persist", void 0);
-__decorate([
-    Alias(),
-    __metadata("design:type", Object)
-], List.prototype, "filters", void 0);
-__decorate([
-    Alias('filterInit'),
-    __metadata("design:type", Function)
-], List.prototype, "filterInitCb", void 0);
-__decorate([
-    Alias('filterChange'),
-    __metadata("design:type", Function)
-], List.prototype, "filterChangeCb", void 0);
-__decorate([
-    Alias(),
-    __metadata("design:type", Object)
-], List.prototype, "savedFilters", void 0);
-__decorate([
-    Alias(),
-    __metadata("design:type", Object)
-], List.prototype, "scrollable", void 0);
-__decorate([
-    Alias(),
-    __metadata("design:type", Object)
-], List.prototype, "noResults", void 0);
-__decorate([
-    Alias(),
-    __metadata("design:type", Object)
-], List.prototype, "emptyState", void 0);
-__decorate([
-    Alias('fetch'),
-    __metadata("design:type", Function)
-], List.prototype, "fetchFn", void 0);
-__decorate([
-    Alias('afterFetch'),
-    __metadata("design:type", Function)
-], List.prototype, "afterFetchFn", void 0);
 
 var ReorderPosition;
 (function (ReorderPosition) {
@@ -4987,7 +4886,7 @@ class FsPaginationComponent {
     }
 }
 FsPaginationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FsPaginationComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-FsPaginationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsPaginationComponent, selector: "fs-list-pagination", inputs: { pagination: "pagination", rows: "rows" }, ngImport: i0, template: "<ng-container *ngIf=\"!pagination.loadMoreEnabled; else loadMoreButton\">\n  <div class=\"paging\" *ngIf=\"pagination?.pages\">\n    <div class=\"records\"></div>\n    <div fxFlex>\n      <div class=\"pages\">\n        <a matRipple matRippleRadius=\"15\" [matRippleCentered]=\"true\" class=\"first\" [class.disabled]=\"!pagination.hasPrevPage\" (click)=\"pagination.goFirst()\">\n          <i class=\"material-icons\">first_page</i>\n        </a>\n\n        <a matRipple matRippleRadius=\"15\" [matRippleCentered]=\"true\" class=\"previous\" [class.disabled]=\"!pagination.hasPrevPage\" (click)=\"pagination.goPrev()\">\n          <i class=\"material-icons\">keyboard_arrow_left</i>\n        </a>\n\n        <div class=\"number\">\n          {{ pagination.page }} of {{ pagination.pages }}\n        </div>\n\n        <a matRipple matRippleRadius=\"15\" [matRippleCentered]=\"true\" class=\"next\" [class.disabled]=\"!pagination.hasNextPage\" (click)=\"pagination.goNext()\">\n          <i class=\"material-icons\">keyboard_arrow_right</i>\n        </a>\n\n        <a matRipple matRippleRadius=\"15\" [matRippleCentered]=\"true\" class=\"last\" [class.disabled]=\"!pagination.hasNextPage\" (click)=\"pagination.goLast()\">\n          <i class=\"material-icons\">last_page</i>\n        </a>\n\n      </div>\n    </div>\n  </div>\n</ng-container>\n\n<ng-template #loadMoreButton>\n  <div class=\"fs-list-load-more\" *ngIf=\"pagination.hasNextPage\">\n    <button mat-button (click)=\"pagination.goNext()\">{{ pagination.loadMoreText }}</button>\n  </div>\n</ng-template>\n", styles: [":host{display:block}.paging{display:flex}.paging .pages{display:flex;justify-content:center;align-items:center;-webkit-user-select:none;user-select:none}.paging .pages a{text-align:center;color:#000000de;text-decoration:none;font-size:15px;cursor:pointer;display:flex}.paging .pages a:not(.page){padding:10px}.paging .pages a.disabled{pointer-events:none;cursor:default;color:#d8d8d8}.paging .pages .number{font-size:90%}.fs-list-load-more button{width:100%;margin-top:10px}\n"], components: [{ type: i2$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$2.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { type: i4$2.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleRadius", "matRippleDisabled", "matRippleTrigger", "matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleAnimation"], exportAs: ["matRipple"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+FsPaginationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: FsPaginationComponent, selector: "fs-list-pagination", inputs: { pagination: "pagination", rows: "rows" }, ngImport: i0, template: "<ng-container *ngIf=\"!pagination.loadMoreEnabled; else loadMoreButton\">\n  <div class=\"paging\" *ngIf=\"pagination?.pages\">\n    <div class=\"records\"></div>\n    <div fxFlex>\n      <div class=\"pages\">\n        <a matRipple matRippleRadius=\"15\" [matRippleCentered]=\"true\" class=\"first\" [class.disabled]=\"!pagination.hasPrevPage\" (click)=\"pagination.goFirst()\">\n          <i class=\"material-icons\">first_page</i>\n        </a>\n\n        <a matRipple matRippleRadius=\"15\" [matRippleCentered]=\"true\" class=\"previous\" [class.disabled]=\"!pagination.hasPrevPage\" (click)=\"pagination.goPrev()\">\n          <i class=\"material-icons\">keyboard_arrow_left</i>\n        </a>\n\n        <div class=\"number\">\n          {{ pagination.page | fsFormatNumber }} of {{ pagination.pages | fsFormatNumber }}\n        </div>\n\n        <a matRipple matRippleRadius=\"15\" [matRippleCentered]=\"true\" class=\"next\" [class.disabled]=\"!pagination.hasNextPage\" (click)=\"pagination.goNext()\">\n          <i class=\"material-icons\">keyboard_arrow_right</i>\n        </a>\n\n        <a matRipple matRippleRadius=\"15\" [matRippleCentered]=\"true\" class=\"last\" [class.disabled]=\"!pagination.hasNextPage\" (click)=\"pagination.goLast()\">\n          <i class=\"material-icons\">last_page</i>\n        </a>\n\n      </div>\n    </div>\n  </div>\n</ng-container>\n\n<ng-template #loadMoreButton>\n  <div class=\"fs-list-load-more\" *ngIf=\"pagination.hasNextPage\">\n    <button mat-button (click)=\"pagination.goNext()\">{{ pagination.loadMoreText }}</button>\n  </div>\n</ng-template>\n", styles: [":host{display:block}.paging{display:flex}.paging .pages{display:flex;justify-content:center;align-items:center;-webkit-user-select:none;user-select:none}.paging .pages a{text-align:center;color:#000000de;text-decoration:none;font-size:15px;cursor:pointer;display:flex}.paging .pages a:not(.page){padding:10px}.paging .pages a.disabled{pointer-events:none;cursor:default;color:#d8d8d8}.paging .pages .number{font-size:90%}.fs-list-load-more button{width:100%;margin-top:10px}\n"], components: [{ type: i2$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$2.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { type: i4$2.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleRadius", "matRippleDisabled", "matRippleTrigger", "matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleAnimation"], exportAs: ["matRipple"] }], pipes: { "fsFormatNumber": i5$1.FsFormatNumberPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FsPaginationComponent, decorators: [{
             type: Component,
             args: [{
@@ -5094,6 +4993,9 @@ class FsListComponent {
     set groupEnabled(value) {
         this.list.groupEnabled(value);
     }
+    get filtersQuery() {
+        return this.list.filtersQuery;
+    }
     ngOnInit() {
         this._subscribeToRemoveRow();
         this._subscribeToGroupExpandStatusChange();
@@ -5488,7 +5390,8 @@ FsListModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "
         FsPromptModule,
         MatDialogModule,
         MatTooltipModule,
-        FsFileModule], exports: [FsListComponent,
+        FsFileModule,
+        FsCommonModule], exports: [FsListComponent,
         FsRowComponent,
         FsCellComponent,
         FsListLoaderComponent,
@@ -5518,6 +5421,7 @@ FsListModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
             MatDialogModule,
             MatTooltipModule,
             FsFileModule,
+            FsCommonModule,
         ]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: FsListModule, decorators: [{
             type: NgModule,
@@ -5539,6 +5443,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                         MatDialogModule,
                         MatTooltipModule,
                         FsFileModule,
+                        FsCommonModule,
                     ],
                     declarations: [
                         // Components