@firestitch/filter 9.9.3 → 9.9.7
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.
- package/app/interfaces/action.interface.d.ts +6 -0
- package/app/models/action.model.d.ts +7 -0
- package/bundles/firestitch-filter.umd.js +20 -13
- package/bundles/firestitch-filter.umd.js.map +1 -1
- package/bundles/firestitch-filter.umd.min.js +1 -1
- package/bundles/firestitch-filter.umd.min.js.map +1 -1
- package/esm2015/app/components/action-button/action-button.component.js +2 -2
- package/esm2015/app/components/action-kebab-actions/action-kebab-actions.component.js +2 -2
- package/esm2015/app/components/actions/actions.component.js +2 -2
- package/esm2015/app/interfaces/action.interface.js +1 -1
- package/esm2015/app/models/action.model.js +8 -1
- package/esm2015/app/services/external-params-controller.service.js +13 -13
- package/esm5/app/components/action-button/action-button.component.js +2 -2
- package/esm5/app/components/action-kebab-actions/action-kebab-actions.component.js +2 -2
- package/esm5/app/components/actions/actions.component.js +2 -2
- package/esm5/app/interfaces/action.interface.js +1 -1
- package/esm5/app/models/action.model.js +8 -1
- package/esm5/app/services/external-params-controller.service.js +13 -13
- package/fesm2015/firestitch-filter.js +21 -14
- package/fesm2015/firestitch-filter.js.map +1 -1
- package/fesm5/firestitch-filter.js +21 -14
- package/fesm5/firestitch-filter.js.map +1 -1
- package/firestitch-filter.metadata.json +1 -1
- package/package.json +1 -1
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { __extends, __assign, __decorate, __metadata, __spread, __param, __values, __read } from 'tslib';
|
|
2
2
|
import { Injectable, Optional, Inject, Component, ChangeDetectionStrategy, InjectionToken, ChangeDetectorRef, HostListener, Input, Injector, Directive, EventEmitter, NgZone, Output, ContentChild, TemplateRef, ViewChild, ElementRef, HostBinding, ViewEncapsulation, KeyValueDiffers, Pipe, Self, NgModule } from '@angular/core';
|
|
3
3
|
import { ActivatedRoute, Router, RouterModule } from '@angular/router';
|
|
4
|
-
import { BehaviorSubject, Subject, isObservable, forkJoin,
|
|
4
|
+
import { BehaviorSubject, Subject, isObservable, forkJoin, of, fromEvent, combineLatest, merge, timer } from 'rxjs';
|
|
5
5
|
import { tap, finalize, take, takeUntil, debounceTime, filter as filter$1, distinctUntilChanged, switchMap, skip, map, mapTo, startWith, delay } from 'rxjs/operators';
|
|
6
6
|
import { isFunction, clone, isObject, isString, toString, pickBy } from 'lodash-es';
|
|
7
7
|
import { Alias, Model } from 'tsmodels';
|
|
@@ -2461,10 +2461,8 @@ var ExternalParamsController = /** @class */ (function () {
|
|
|
2461
2461
|
this._initSavedFilters();
|
|
2462
2462
|
this._pending$.next(true);
|
|
2463
2463
|
if (this._savedFilters.enabled) {
|
|
2464
|
-
|
|
2465
|
-
|
|
2466
|
-
this._savedFilters.load(),
|
|
2467
|
-
])
|
|
2464
|
+
this._savedFilters
|
|
2465
|
+
.load()
|
|
2468
2466
|
.pipe(takeUntil(this._destroy$))
|
|
2469
2467
|
.subscribe(function () {
|
|
2470
2468
|
_this._savedFilters.updateActiveFilter();
|
|
@@ -2474,12 +2472,8 @@ var ExternalParamsController = /** @class */ (function () {
|
|
|
2474
2472
|
});
|
|
2475
2473
|
}
|
|
2476
2474
|
else {
|
|
2477
|
-
this.
|
|
2478
|
-
|
|
2479
|
-
.subscribe(function () {
|
|
2480
|
-
_this._initItemsValues();
|
|
2481
|
-
_this._pending$.next(false);
|
|
2482
|
-
});
|
|
2475
|
+
this._initItemsValues();
|
|
2476
|
+
this._pending$.next(false);
|
|
2483
2477
|
}
|
|
2484
2478
|
this._listenItemsChange();
|
|
2485
2479
|
};
|
|
@@ -2512,6 +2506,12 @@ var ExternalParamsController = /** @class */ (function () {
|
|
|
2512
2506
|
};
|
|
2513
2507
|
ExternalParamsController.prototype._listenItemsChange = function () {
|
|
2514
2508
|
var _this = this;
|
|
2509
|
+
this._itemsStore.ready$
|
|
2510
|
+
.pipe(filter$1(function (v) { return v; }), take(1), takeUntil(this._destroy$))
|
|
2511
|
+
.subscribe(function () {
|
|
2512
|
+
_this._saveQueryParams();
|
|
2513
|
+
_this._savePersistedParams();
|
|
2514
|
+
});
|
|
2515
2515
|
this._itemsStore
|
|
2516
2516
|
.itemsChange$
|
|
2517
2517
|
.pipe(takeUntil(this._destroy$))
|
|
@@ -3039,6 +3039,7 @@ var Action = /** @class */ (function () {
|
|
|
3039
3039
|
this.label = config.label;
|
|
3040
3040
|
this.mode = config.mode;
|
|
3041
3041
|
this.icon = config.icon;
|
|
3042
|
+
this.iconPlacement = config.iconPlacement;
|
|
3042
3043
|
this._showFn = config.show;
|
|
3043
3044
|
this.tabIndex = (_d = config.tabIndex) !== null && _d !== void 0 ? _d : 0;
|
|
3044
3045
|
if (config.multiple !== undefined) {
|
|
@@ -3073,6 +3074,12 @@ var Action = /** @class */ (function () {
|
|
|
3073
3074
|
{
|
|
3074
3075
|
this.fileSelected = config.select;
|
|
3075
3076
|
this.fileError = config.error;
|
|
3077
|
+
this.accept = config.accept;
|
|
3078
|
+
this.imageQuality = config.imageQuality;
|
|
3079
|
+
this.minWidth = config.minWidth;
|
|
3080
|
+
this.minHeight = config.minHeight;
|
|
3081
|
+
this.maxWidth = config.maxWidth;
|
|
3082
|
+
this.maxHeight = config.maxHeight;
|
|
3076
3083
|
this.click = (_f = config.click) !== null && _f !== void 0 ? _f : (function () { });
|
|
3077
3084
|
this._disabledFn = config.disabled;
|
|
3078
3085
|
this.updateDisabledState();
|
|
@@ -4949,7 +4956,7 @@ var FsFilterActionsComponent = /** @class */ (function () {
|
|
|
4949
4956
|
FsFilterActionsComponent = __decorate([
|
|
4950
4957
|
Component({
|
|
4951
4958
|
selector: 'fs-filter-actions',
|
|
4952
|
-
template: "<!-- Buttons -->\n<ng-container *ngFor=\"let action of actions\">\n\n <ng-container [ngSwitch]=\"action.mode\">\n <ng-container *ngSwitchCase=\"'button'\">\n <fs-filter-action-button [action]=\"action\"></fs-filter-action-button>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'menu'\">\n <fs-filter-action-button\n [action]=\"action\"\n [fsMenuTriggerFor]=\"someRef\">\n </fs-filter-action-button>\n\n <fs-menu #someRef>\n <ng-container *ngFor=\"let childAction of action.items\">\n <ng-container *ngIf=\"childAction.isGroup else simpleMenuItem\">\n <fs-menu-group [label]=\"childAction.label\">\n <ng-container *ngFor=\"let subAction of childAction.items\">\n <ng-template fs-menu-item\n [link]=\"subAction.routerLink?.link\"\n [queryParams]=\"subAction.routerLink?.queryParams\"\n [hidden]=\"!(subAction.visible$ | async)\"\n (click)=\"subAction.click($event)\">\n <mat-icon *ngIf=\"subAction.icon\">{{subAction.icon}}</mat-icon>\n {{subAction.label}}\n </ng-template>\n </ng-container>\n </fs-menu-group>\n </ng-container>\n <ng-template #simpleMenuItem>\n <ng-template fs-menu-item\n [link]=\"childAction.routerLink?.link\"\n [queryParams]=\"childAction.routerLink?.queryParams\"\n [hidden]=\"!(childAction.visible$ | async)\"\n (click)=\"childAction.click($event);\">\n <mat-icon *ngIf=\"childAction.icon\">{{childAction.icon}}</mat-icon>\n {{childAction.label}}\n </ng-template>\n </ng-template>\n </ng-container>\n </fs-menu>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'file'\">\n <fs-file\n class=\"action-button\"\n [multiple]=\"action.multiple\"\n (select)=\"action.fileSelected($event)\"\n (error)=\"action.fileError($event)\"\n (clicked)=\"action.click($event)\">\n <fs-filter-action-button [action]=\"action\"></fs-filter-action-button>\n </fs-file>\n </ng-container>\n </ng-container>\n</ng-container>\n<!-- /Buttons -->\n\n<!-- menu -->\n<ng-container *ngIf=\"kebabActions?.length\">\n <fs-filter-action-kebab-actions [kebabActions]=\"kebabActions\"></fs-filter-action-kebab-actions>\n</ng-container>\n",
|
|
4959
|
+
template: "<!-- Buttons -->\n<ng-container *ngFor=\"let action of actions\">\n\n <ng-container [ngSwitch]=\"action.mode\">\n <ng-container *ngSwitchCase=\"'button'\">\n <fs-filter-action-button [action]=\"action\"></fs-filter-action-button>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'menu'\">\n <fs-filter-action-button\n [action]=\"action\"\n [fsMenuTriggerFor]=\"someRef\">\n </fs-filter-action-button>\n\n <fs-menu #someRef>\n <ng-container *ngFor=\"let childAction of action.items\">\n <ng-container *ngIf=\"childAction.isGroup else simpleMenuItem\">\n <fs-menu-group [label]=\"childAction.label\">\n <ng-container *ngFor=\"let subAction of childAction.items\">\n <ng-template fs-menu-item\n [link]=\"subAction.routerLink?.link\"\n [queryParams]=\"subAction.routerLink?.queryParams\"\n [hidden]=\"!(subAction.visible$ | async)\"\n (click)=\"subAction.click($event)\">\n <mat-icon *ngIf=\"subAction.icon\">{{subAction.icon}}</mat-icon>\n {{subAction.label}}\n </ng-template>\n </ng-container>\n </fs-menu-group>\n </ng-container>\n <ng-template #simpleMenuItem>\n <ng-template fs-menu-item\n [link]=\"childAction.routerLink?.link\"\n [queryParams]=\"childAction.routerLink?.queryParams\"\n [hidden]=\"!(childAction.visible$ | async)\"\n (click)=\"childAction.click($event);\">\n <mat-icon *ngIf=\"childAction.icon\">{{childAction.icon}}</mat-icon>\n {{childAction.label}}\n </ng-template>\n </ng-template>\n </ng-container>\n </fs-menu>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'file'\">\n <fs-file\n class=\"action-button\"\n [accept]=\"action.accept || '*'\"\n [multiple]=\"action.multiple\"\n [minWidth]=\"action.minWidth\"\n [minHeight]=\"action.minHeight\"\n [imageWidth]=\"action.maxWidth\"\n [imageHeight]=\"action.maxHeight\"\n (select)=\"action.fileSelected($event)\"\n (error)=\"action.fileError($event)\"\n (clicked)=\"action.click($event)\">\n <fs-filter-action-button [action]=\"action\"></fs-filter-action-button>\n </fs-file>\n </ng-container>\n </ng-container>\n</ng-container>\n<!-- /Buttons -->\n\n<!-- menu -->\n<ng-container *ngIf=\"kebabActions?.length\">\n <fs-filter-action-kebab-actions [kebabActions]=\"kebabActions\"></fs-filter-action-kebab-actions>\n</ng-container>\n",
|
|
4953
4960
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
4954
4961
|
styles: [":host{display:inline-flex}.action-button{display:block}.action-button+.action-button,fs-menu+.action-button{margin-left:5px}.menu-button{width:36px;height:36px;line-height:36px}"]
|
|
4955
4962
|
})
|
|
@@ -4967,7 +4974,7 @@ var FsFilterActionButtonComponent = /** @class */ (function () {
|
|
|
4967
4974
|
FsFilterActionButtonComponent = __decorate([
|
|
4968
4975
|
Component({
|
|
4969
4976
|
selector: 'fs-filter-action-button',
|
|
4970
|
-
template: "<ng-container [ngSwitch]=\"action.type\">\n <!-- Basic button -->\n <button type=\"button\"\n *ngSwitchCase=\"'basic'\"\n mat-button\n (click)=\"action.click && action.click($event)\"\n [color]=\"action.color\"\n [ngClass]=\"action.classArray\"\n [disabled]=\"action.disabled$ | async\"\n [tabIndex]=\"action.tabIndex\"\n >\n <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n </button>\n\n <!-- Raised button -->\n <button type=\"button\"\n *ngSwitchDefault\n mat-raised-button\n (click)=\"action.click && action.click($event)\"\n [color]=\"action.color\"\n [ngClass]=\"action.classArray\"\n [disabled]=\"action.disabled$ | async\"\n [tabIndex]=\"action.tabIndex\"\n >\n <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n </button>\n\n <!-- Icon button -->\n <button type=\"button\"\n *ngSwitchCase=\"'icon'\"\n mat-icon-button\n (click)=\"action.click && action.click($event)\"\n [color]=\"action.color\"\n [ngClass]=\"action.classArray\"\n [disabled]=\"action.disabled$ | async\"\n [tabIndex]=\"action.tabIndex\"\n >\n <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n </button>\n\n <!-- Fab button -->\n <button type=\"button\"\n *ngSwitchCase=\"'fab'\"\n mat-fab\n (click)=\"action.click && action.click($event)\"\n [color]=\"action.color\"\n [ngClass]=\"action.classArray\"\n [disabled]=\"action.disabled$ | async\"\n [tabIndex]=\"action.tabIndex\"\n >\n <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n </button>\n\n <!-- Mini Fab button -->\n <button type=\"button\"\n *ngSwitchCase=\"'mini-fab'\"\n mat-mini-fab\n (click)=\"action.click && action.click($event)\"\n [color]=\"action.color\"\n [ngClass]=\"action.classArray\"\n [disabled]=\"action.disabled$ | async\"\n [tabIndex]=\"action.tabIndex\"\n >\n <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n </button>\n\n <ng-template #buttonContent>\n <mat-icon *ngIf=\"action.
|
|
4977
|
+
template: "<ng-container [ngSwitch]=\"action.type\">\n <!-- Basic button -->\n <button type=\"button\"\n *ngSwitchCase=\"'basic'\"\n mat-button\n (click)=\"action.click && action.click($event)\"\n [color]=\"action.color\"\n [ngClass]=\"action.classArray\"\n [disabled]=\"action.disabled$ | async\"\n [tabIndex]=\"action.tabIndex\"\n >\n <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n </button>\n\n <!-- Raised button -->\n <button type=\"button\"\n *ngSwitchDefault\n mat-raised-button\n (click)=\"action.click && action.click($event)\"\n [color]=\"action.color\"\n [ngClass]=\"action.classArray\"\n [disabled]=\"action.disabled$ | async\"\n [tabIndex]=\"action.tabIndex\"\n >\n <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n </button>\n\n <!-- Icon button -->\n <button type=\"button\"\n *ngSwitchCase=\"'icon'\"\n mat-icon-button\n (click)=\"action.click && action.click($event)\"\n [color]=\"action.color\"\n [ngClass]=\"action.classArray\"\n [disabled]=\"action.disabled$ | async\"\n [tabIndex]=\"action.tabIndex\"\n >\n <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n </button>\n\n <!-- Fab button -->\n <button type=\"button\"\n *ngSwitchCase=\"'fab'\"\n mat-fab\n (click)=\"action.click && action.click($event)\"\n [color]=\"action.color\"\n [ngClass]=\"action.classArray\"\n [disabled]=\"action.disabled$ | async\"\n [tabIndex]=\"action.tabIndex\"\n >\n <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n </button>\n\n <!-- Mini Fab button -->\n <button type=\"button\"\n *ngSwitchCase=\"'mini-fab'\"\n mat-mini-fab\n (click)=\"action.click && action.click($event)\"\n [color]=\"action.color\"\n [ngClass]=\"action.classArray\"\n [disabled]=\"action.disabled$ | async\"\n [tabIndex]=\"action.tabIndex\"\n >\n <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n </button>\n\n <ng-template #buttonContent>\n <ng-container *ngIf=\"!action.icon else withIcon\">\n {{action.label}}\n </ng-container>\n\n <ng-template #withIcon>\n <mat-icon *ngIf=\"!action.iconPlacement || action.iconPlacement === 'left'\">{{action.icon}}</mat-icon>\n {{action.label}}\n <mat-icon *ngIf=\"action.iconPlacement === 'right'\">{{action.icon}}</mat-icon>\n </ng-template>\n </ng-template>\n</ng-container>\n",
|
|
4971
4978
|
host: {
|
|
4972
4979
|
class: 'action-button',
|
|
4973
4980
|
},
|
|
@@ -4987,7 +4994,7 @@ var FsFilterActionKebabActionsComponent = /** @class */ (function () {
|
|
|
4987
4994
|
FsFilterActionKebabActionsComponent = __decorate([
|
|
4988
4995
|
Component({
|
|
4989
4996
|
selector: 'fs-filter-action-kebab-actions',
|
|
4990
|
-
template: "<button type=\"button\"\n mat-icon-button\n class=\"menu-button\"\n [fsMenuTriggerFor]=\"kebabActionsMenu\">\n <mat-icon>more_vert</mat-icon>\n</button>\n<fs-menu #kebabActionsMenu>\n <ng-container *ngFor=\"let action of kebabActions\">\n <ng-container [ngSwitch]=\"action.mode\">\n <!-- Case when actions was collapsed from action with mode = 'menu'-->\n <ng-container *ngSwitchCase=\"'menu'\">\n <ng-container *ngFor=\"let childAction of action.items\">\n <ng-container *ngIf=\"childAction.isGroup else simpleMenuItem\">\n <fs-menu-group>\n <ng-template fs-group-menu-item-template>\n {{ action.label }} <mat-icon style=\"margin: 0;\">arrow_right</mat-icon> {{childAction.label}}\n </ng-template>\n <ng-container *ngFor=\"let subAction of childAction.items\">\n <ng-template fs-menu-item\n [link]=\"subAction.routerLink?.link\"\n [queryParams]=\"subAction.routerLink?.queryParams\"\n [hidden]=\"!(subAction.visible$ | async)\"\n (click)=\"subAction.click($event)\">\n <mat-icon *ngIf=\"subAction.icon\">{{subAction.icon}}</mat-icon>\n {{subAction.label}}\n </ng-template>\n </ng-container>\n </fs-menu-group>\n </ng-container>\n <ng-template #simpleMenuItem>\n <ng-template fs-menu-item\n [link]=\"childAction.routerLink?.link\"\n [queryParams]=\"childAction.routerLink?.queryParams\"\n [hidden]=\"!(childAction.visible$ | async)\"\n (click)=\"childAction.click($event);\">\n <mat-icon *ngIf=\"childAction.icon\">{{childAction.icon}}</mat-icon>\n {{ action.label }} <mat-icon style=\"margin: 0;\">arrow_right</mat-icon>{{ childAction.label }}\n </ng-template>\n </ng-template>\n </ng-container>\n </ng-container>\n\n <ng-container *ngSwitchDefault>\n <ng-template fs-menu-item\n (click)=\"action.click($event)\"\n [fsClass]=\"action.classArray\"\n >\n <mat-icon *ngIf=\"action.icon\">{{action.icon}}</mat-icon> {{action.label}}\n </ng-template>\n </ng-container>\n\n </ng-container>\n </ng-container>\n</fs-menu>\n",
|
|
4997
|
+
template: "<button type=\"button\"\n mat-icon-button\n class=\"menu-button\"\n [fsMenuTriggerFor]=\"kebabActionsMenu\">\n <mat-icon>more_vert</mat-icon>\n</button>\n<fs-menu #kebabActionsMenu>\n <ng-container *ngFor=\"let action of kebabActions\">\n <ng-container [ngSwitch]=\"action.mode\">\n <!-- Case when actions was collapsed from action with mode = 'menu'-->\n <ng-container *ngSwitchCase=\"'menu'\">\n <ng-container *ngFor=\"let childAction of action.items\">\n <ng-container *ngIf=\"childAction.isGroup else simpleMenuItem\">\n <fs-menu-group>\n <ng-template fs-group-menu-item-template>\n {{ action.label }} <mat-icon style=\"margin: 0;\">arrow_right</mat-icon> {{childAction.label}}\n </ng-template>\n <ng-container *ngFor=\"let subAction of childAction.items\">\n <ng-template fs-menu-item\n [link]=\"subAction.routerLink?.link\"\n [queryParams]=\"subAction.routerLink?.queryParams\"\n [hidden]=\"!(subAction.visible$ | async)\"\n (click)=\"subAction.click($event)\">\n <mat-icon *ngIf=\"subAction.icon\">{{subAction.icon}}</mat-icon>\n {{subAction.label}}\n </ng-template>\n </ng-container>\n </fs-menu-group>\n </ng-container>\n <ng-template #simpleMenuItem>\n <ng-template fs-menu-item\n [link]=\"childAction.routerLink?.link\"\n [queryParams]=\"childAction.routerLink?.queryParams\"\n [hidden]=\"!(childAction.visible$ | async)\"\n (click)=\"childAction.click($event);\">\n <mat-icon *ngIf=\"childAction.icon\">{{childAction.icon}}</mat-icon>\n {{ action.label }} <mat-icon style=\"margin: 0;\">arrow_right</mat-icon>{{ childAction.label }}\n </ng-template>\n </ng-template>\n </ng-container>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"'file'\">\n <ng-template fs-menu-item\n [fsClass]=\"action.classArray\"\n >\n <fs-file\n class=\"action-button\"\n [accept]=\"action.accept || '*'\"\n [multiple]=\"action.multiple\"\n [minWidth]=\"action.minWidth\"\n [minHeight]=\"action.minHeight\"\n [imageWidth]=\"action.maxWidth\"\n [imageHeight]=\"action.maxHeight\"\n (select)=\"action.fileSelected($event)\"\n (error)=\"action.fileError($event)\"\n (clicked)=\"action.click($event)\">\n <mat-icon *ngIf=\"action.icon\">{{action.icon}}</mat-icon> {{action.label}}\n </fs-file>\n </ng-template>\n </ng-container>\n\n <ng-container *ngSwitchDefault>\n <ng-template fs-menu-item\n (click)=\"action.click($event)\"\n [fsClass]=\"action.classArray\"\n >\n <mat-icon *ngIf=\"action.icon\">{{action.icon}}</mat-icon> {{action.label}}\n </ng-template>\n </ng-container>\n\n </ng-container>\n </ng-container>\n</fs-menu>\n",
|
|
4991
4998
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
4992
4999
|
styles: [".menu-button{width:36px;height:36px;line-height:36px}"]
|
|
4993
5000
|
})
|