@firestitch/filter 14.0.3 → 16.0.0

package/fesm2015/firestitch-filter.mjs

@@ -1,4585 +0,0 @@
-import * as i0 from '@angular/core';
-import { Injectable, Optional, Component, ChangeDetectionStrategy, Inject, Input, EventEmitter, Output, InjectionToken, Directive, Self, ViewChild, Pipe, HostListener, ElementRef, ContentChild, HostBinding, NgModule } from '@angular/core';
-import { BehaviorSubject, Subject, isObservable, forkJoin, of, timer, combineLatest, fromEvent, merge, interval } from 'rxjs';
-import { tap, finalize, take, takeUntil, debounceTime, filter as filter$1, distinctUntilChanged, switchMap, mapTo, startWith, map, delay, skip } from 'rxjs/operators';
-import { filter, isArrayEqual, list, isEmpty, getNormalizedPath, remove, FsCommonModule } from '@firestitch/common';
-import { isObject, isFunction, clone, toString, isString, pickBy } from 'lodash-es';
-import { simpleFormat, format } from '@firestitch/date';
-import { isValid, isDate, parseISO } from 'date-fns';
-import * as i3$3 from '@firestitch/datepicker';
-import { formatPeriodObject, FsDatePickerModule } from '@firestitch/datepicker';
-import * as i1 from '@firestitch/store';
-import { FsPersistanceStore, FsStoreModule, FsStore } from '@firestitch/store';
-import * as i2 from '@angular/router';
-import { RouterModule } from '@angular/router';
-import * as i1$1 from '@angular/common';
-import { CommonModule } from '@angular/common';
-import * as i1$2 from '@angular/material/dialog';
-import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
-import * as i6 from '@firestitch/drawer';
-import * as i2$1 from '@angular/forms';
-import { UntypedFormControl, FormsModule, ReactiveFormsModule } from '@angular/forms';
-import * as i3 from '@angular/material/form-field';
-import * as i4 from '@angular/material/input';
-import { MatInput, MatInputModule } from '@angular/material/input';
-import * as i4$1 from '@angular/material/select';
-import { MatSelectModule } from '@angular/material/select';
-import * as i5 from '@angular/material/core';
-import * as i3$1 from '@angular/material/button';
-import { MatButtonModule } from '@angular/material/button';
-import * as i9 from '@firestitch/form';
-import { FsFormModule } from '@firestitch/form';
-import * as i2$3 from '@angular/cdk/drag-drop';
-import { moveItemInArray, DragDropModule } from '@angular/cdk/drag-drop';
-import { ComponentPortal, PortalInjector, PortalModule } from '@angular/cdk/portal';
-import { MatAutocompleteModule } from '@angular/material/autocomplete';
-import * as i6$2 from '@angular/material/checkbox';
-import { MatCheckboxModule } from '@angular/material/checkbox';
-import { MatChipsModule } from '@angular/material/chips';
-import * as i2$2 from '@angular/material/icon';
-import { MatIconModule } from '@angular/material/icon';
-import * as i12 from '@angular/material/slide-toggle';
-import { MatSlideToggleModule } from '@angular/material/slide-toggle';
-import { MatTooltipModule } from '@angular/material/tooltip';
-import * as i4$2 from '@firestitch/autocomplete';
-import { FsAutocompleteModule } from '@firestitch/autocomplete';
-import * as i5$1 from '@firestitch/autocomplete-chips';
-import { FsAutocompleteChipsModule } from '@firestitch/autocomplete-chips';
-import * as i3$2 from '@firestitch/chip';
-import { FsChipModule } from '@firestitch/chip';
-import * as i14 from '@firestitch/clear';
-import { FsClearModule } from '@firestitch/clear';
-import * as i8 from '@firestitch/file';
-import { FsFileModule } from '@firestitch/file';
-import * as i4$3 from '@firestitch/label';
-import { FsLabelModule } from '@firestitch/label';
-import * as i6$1 from '@firestitch/menu';
-import { FsMenuModule } from '@firestitch/menu';
-import * as i10 from '@firestitch/popover';
-import { FsPopoverModule } from '@firestitch/popover';
-import { FsScrollModule } from '@firestitch/scroll';
-import * as i9$1 from '@firestitch/selectbutton';
-import { FsSelectButtonModule } from '@firestitch/selectbutton';
-import * as i5$2 from '@firestitch/skeleton';
-import { FsSkeletonModule } from '@firestitch/skeleton';
-import * as i1$3 from '@angular/cdk/overlay';
-import { OverlayConfig } from '@angular/cdk/overlay';
-import * as i1$4 from '@angular/cdk/layout';
-import * as i3$4 from '@firestitch/html';
-
-function objectsAreEquals(obj1, obj2) {
-    const oldKeys = Object.keys(obj1);
-    const currKeys = Object.keys(obj2);
-    if (oldKeys.length !== currKeys.length) {
-        return false;
-    }
-    for (const key in obj1) {
-        if (obj1.hasOwnProperty(key)) {
-            const oldItem = obj1[key];
-            const currItem = obj2[key];
-            const isArrays = Array.isArray(oldItem) && Array.isArray(currItem);
-            const isObjects = isObject(oldItem) && isObject(currItem);
-            if (isArrays && !arraysAreEquals(oldItem, currItem)) {
-                return false;
-            }
-            else if (isObjects && !objectsAreEquals(oldItem, currItem)) {
-                return false;
-            }
-            else if (!isArrays && !isObjects && oldItem !== currItem) {
-                return false;
-            }
-        }
-    }
-    return true;
-}
-function arraysAreEquals(arr1, arr2) {
-    if (arr1.length !== arr2.length) {
-        return false;
-    }
-    for (const el of arr1) {
-        if (arr2.indexOf(el) === -1) {
-            return false;
-        }
-    }
-    return true;
-}
-
-var ItemType;
-(function (ItemType) {
-    ItemType["Text"] = "text";
-    ItemType["Select"] = "select";
-    ItemType["Range"] = "range";
-    ItemType["Date"] = "date";
-    ItemType["DateTime"] = "datetime";
-    ItemType["DateRange"] = "daterange";
-    ItemType["Week"] = "week";
-    ItemType["DateTimeRange"] = "datetimerange";
-    ItemType["AutoComplete"] = "autocomplete";
-    ItemType["AutoCompleteChips"] = "autocompletechips";
-    ItemType["Checkbox"] = "checkbox";
-    ItemType["Chips"] = "chips";
-    ItemType["Keyword"] = "keyword";
-})(ItemType || (ItemType = {}));
-
-class BaseItem {
-    constructor(itemConfig, _additionalConfig, _filter) {
-        this._additionalConfig = _additionalConfig;
-        this._filter = _filter;
-        this._pendingValues = false;
-        this._pendingDefaultValue = false;
-        this._initializedValues = false;
-        this._loading$ = new BehaviorSubject(false);
-        this._value$ = new BehaviorSubject(null);
-        this._valueChange$ = new Subject();
-        this._values$ = new BehaviorSubject(null);
-        this._destroy$ = new Subject();
-        this._clear$ = new Subject();
-        this._type = itemConfig.type;
-        this._parseConfig(itemConfig);
-    }
-    get filter() {
-        return this._filter;
-    }
-    get isTypeAutocomplete() {
-        return this.type === ItemType.AutoComplete;
-    }
-    get isTypeAutocompleteChips() {
-        return this.type === ItemType.AutoCompleteChips;
-    }
-    get isTypeChips() {
-        return this.type === ItemType.Chips;
-    }
-    get isTypeCheckbox() {
-        return this.type === ItemType.Checkbox;
-    }
-    get isTypeSelect() {
-        return this.type === ItemType.Select;
-    }
-    get isTypeDate() {
-        return this.type === ItemType.Date;
-    }
-    get isTypeDateRange() {
-        return this.type === ItemType.DateRange;
-    }
-    get isTypeRange() {
-        return this.type === ItemType.Range;
-    }
-    get isTypeDateTimeRange() {
-        return this.type === ItemType.DateTimeRange;
-    }
-    get isTypeDateTime() {
-        return this.type === ItemType.DateTime;
-    }
-    get isTypeKeyword() {
-        return this.type === ItemType.Keyword;
-    }
-    get isChipVisible() {
-        return !!this.model;
-    }
-    get destroy$() {
-        return this._destroy$.asObservable();
-    }
-    get type() {
-        return this._type;
-    }
-    get hasPendingValues() {
-        return this._pendingValues;
-    }
-    get hasPendingDefaultValue() {
-        return this._pendingDefaultValue;
-    }
-    get model() {
-        return this._model;
-    }
-    set model(value) {
-        this._setModel(value);
-        this.valueChanged();
-    }
-    set values(values) {
-        this._values$.next(values);
-    }
-    get values() {
-        return this._values$.getValue();
-    }
-    get values$() {
-        return this._values$.asObservable();
-    }
-    get valueChange$() {
-        return this._valueChange$.asObservable();
-    }
-    get value$() {
-        return this._value$.asObservable();
-    }
-    get clear$() {
-        return this._clear$.asObservable();
-    }
-    get initialized() {
-        return this._initialized;
-    }
-    get loading$() {
-        return this._loading$.asObservable();
-    }
-    get loading() {
-        return this._loading$.getValue();
-    }
-    set loading(value) {
-        this._loading$.next(value);
-    }
-    get _initialized() {
-        return !this._pendingDefaultValue && !this._pendingValues && this._initializedValues;
-    }
-    valueChanged() {
-        this._value$.next(this.value);
-        if (this.change) {
-            this.change(this, this._filter);
-        }
-        if (this.initialized) {
-            this._valueChange$.next();
-        }
-    }
-    get queryObject() {
-        const value = this.value;
-        const name = this.name;
-        const params = {};
-        if (Array.isArray(value)) {
-            params[this.name] = value.join(',');
-        }
-        else {
-            params[name] = value;
-        }
-        return params;
-    }
-    get persistanceObject() {
-        return this.queryObject;
-    }
-    loadDefaultValue() {
-        this._pendingDefaultValue = true;
-        return this.defaultValueFn()
-            .pipe(tap((value) => {
-            this.defaultValue = value;
-            this._initDefaultModel();
-        }), finalize(() => {
-            this._pendingDefaultValue = false;
-        }));
-    }
-    initValues(persistedValue) {
-        this._initializedValues = false;
-        this.persistedValue = persistedValue;
-        this._initDefaultModel();
-        const isAutocomplete = this.type === ItemType.AutoComplete || this.type === ItemType.AutoCompleteChips;
-        if (this._valuesFn && !isAutocomplete) {
-            const valuesResult = this._valuesFn(null, this._filter);
-            if (isObservable(valuesResult)) {
-                this._pendingValues = true;
-            }
-            else {
-                this.values = valuesResult;
-                this._init();
-                this._initializedValues = true;
-            }
-        }
-        else {
-            this._init();
-            this._initializedValues = true;
-        }
-    }
-    loadAsyncValues(reload = true) {
-        if (reload || (!this.loading && this.hasPendingValues)) {
-            this.loading = true;
-            this._valuesFn(null, this._filter)
-                .pipe(take(1), takeUntil(this._destroy$))
-                .subscribe((values) => {
-                this.values = values;
-                this._pendingValues = false;
-                this.loading = false;
-                this._init();
-                this._validateModel();
-                this._initializedValues = true;
-            });
-        }
-    }
-    clear(defaultValue = undefined) {
-        if (this.isTypeRange || this.isTypeDateRange || this.isTypeDateTimeRange) {
-            console.warn(`
-        Filter ${this.name} can not be cleared with .clear() method!
-        Use special .clearRange() or clearDateRange() instead.
-      `);
-        }
-        this._clear$.next(defaultValue);
-        this._clearValue(defaultValue);
-    }
-    getChipsContent(type) {
-        return '';
-    }
-    destroy() {
-        this._destroy$.next();
-        this._destroy$.complete();
-    }
-    _setModel(value) {
-        this._model = value;
-    }
-    _parseConfig(item) {
-        var _a, _b, _c;
-        this.name = item.name;
-        this.label = item.label;
-        this.chipLabel = item.chipLabel;
-        if (typeof item.default === 'function') {
-            this.defaultValueFn = item.default;
-        }
-        else {
-            this.defaultValue = item.default;
-        }
-        this.change = item.change;
-        this.init = item.init || ((_) => {
-            //
-        });
-        this.hide = item.hide;
-        this.showClear = (_a = item.clear) !== null && _a !== void 0 ? _a : true;
-        this.persistanceDisabled = (_b = item.disablePersist) !== null && _b !== void 0 ? _b : false;
-        this.queryParamsDisabled = (_c = item.disableQueryParams) !== null && _c !== void 0 ? _c : false;
-        if (isFunction(item.values)) {
-            this._valuesFn = item.values;
-        }
-        else {
-            this.values = item.values;
-        }
-    }
-    _initDefaultModel() {
-        var _a;
-        const model = (_a = this.persistedValue) !== null && _a !== void 0 ? _a : this.defaultValue;
-        if (model !== undefined) {
-            this._setModel(model);
-        }
-    }
-    _clearValue(defaultValue = undefined) {
-        this.model = defaultValue !== null && defaultValue !== void 0 ? defaultValue : undefined;
-    }
-}
-
-class BaseSelectItem extends BaseItem {
-    _parseConfig(item) {
-        this.multiple = item.multiple;
-        this.children = item.children;
-        // TODO nullish
-        if (item.isolate) {
-            this.isolate = Object.assign(Object.assign({}, item.isolate), { enabled: false });
-        }
-        super._parseConfig(item);
-    }
-    _init() {
-        if (!Array.isArray(this.values)) {
-            this.values = [];
-        }
-        // TODO Refactor
-        if (this.isolate) {
-            this.values = this.values.filter((item) => {
-                if (Array.isArray(this.isolate.value)) {
-                    return this.isolate.value.indexOf(item.value) === -1;
-                }
-                else {
-                    return item.value !== this.isolate.value;
-                }
-            });
-        }
-    }
-    _clearValue(defaultValue = undefined) {
-        if (this.isolate) {
-            this.isolate.enabled = false;
-        }
-    }
-}
-
-class MultipleSelectItem extends BaseSelectItem {
-    constructor(itemConfig, _persistedValues, _filter) {
-        super(itemConfig, _persistedValues, _filter);
-    }
-    get value() {
-        var _a;
-        let value = clone(this.model);
-        if (this.isolateOptionNotSelected) {
-            value = (_a = this.values) === null || _a === void 0 ? void 0 : _a.map((v) => v.value);
-        }
-        else if (!Array.isArray(value) || value.length === 0 || value.indexOf('__all') > -1) {
-            value = undefined;
-        }
-        return value;
-    }
-    get isChipVisible() {
-        return Array.isArray(this.model) && this.model.length > 0;
-    }
-    get isolateOptionNotSelected() {
-        const modelValue = this.model;
-        const isolate = this.isolate;
-        return isolate && !isolate.enabled && (modelValue === null || modelValue === void 0 ? void 0 : modelValue.length) === 0;
-    }
-    getChipsContent(type = null) {
-        const options = this.model.reduce((acc, key) => {
-            const itemValue = this.values.find((val) => val.value === key);
-            let itemLabel;
-            if (itemValue) {
-                itemLabel = itemValue.name;
-            }
-            else if (this.isolate && this.isolate.enabled) {
-                itemLabel = this.isolate.label;
-            }
-            if (!acc.includes(itemLabel)) {
-                acc.push(itemLabel);
-            }
-            return acc;
-        }, []);
-        return options.join(', ');
-    }
-    _init() {
-        super._init();
-        const values = this.values.map((itemv) => itemv.value);
-        const wrongDefaultValue = !this.model && !Array.isArray(this.defaultValue);
-        /**
-         * When multiple select is in isolate mode and have no options selected
-         * it should send to the server all it's possible values,
-         * but should not show them as selected in interfaces as well as in query params & persistance
-         *
-         * Code below prevents filling model with values from query params if query params contain all possible values
-         */
-        const isolate = !wrongDefaultValue
-            && !this.isolateOptionNotSelected
-            && arraysAreEquals(this.model, values);
-        if (wrongDefaultValue || isolate) {
-            this.model = [];
-        }
-    }
-    _setModel(value) {
-        if (Array.isArray(value)) {
-            value = value.map((val) => {
-                if (isNaN(val)) {
-                    return val;
-                }
-                return +val;
-            });
-        }
-        super._setModel(value);
-    }
-    _validateModel() {
-        const possibleValues = filter(this.model || [], (item) => {
-            return this.values.find((value) => {
-                return value.value === item;
-            });
-        });
-        if (!isArrayEqual(this.model, possibleValues)) {
-            this.model = possibleValues;
-        }
-    }
-    _clearValue(defaultValue = undefined) {
-        super._clearValue(defaultValue);
-        this.model = defaultValue !== null && defaultValue !== void 0 ? defaultValue : [];
-    }
-}
-
-const QUERY_PARAM_DELIMITER = ':';
-
-function filterToQueryParam(value, name) {
-    return `${encodeURIComponent(value)}${QUERY_PARAM_DELIMITER}${encodeURIComponent(name)}`;
-}
-function filterFromQueryParam(param) {
-    const parts = param.split(QUERY_PARAM_DELIMITER);
-    return [decodeURIComponent(parts[0]), decodeURIComponent(parts[1])];
-}
-
-function buildQueryParams(flattenedParams, items) {
-    items
-        .forEach((filterItem) => {
-        if (filterItem instanceof MultipleSelectItem && filterItem.isolate) {
-            if (filterItem.multiple && filterItem.value) {
-                const isolated = list(filterItem.values, 'value').sort();
-                const value = filterItem.value.sort();
-                if (arraysAreEquals(value, isolated)) {
-                    flattenedParams[filterItem.name] = null;
-                }
-            }
-        }
-        if (filterItem.isTypeAutocomplete) {
-            if (isObject(filterItem.model)) {
-                flattenedParams[filterItem.name] = filterToQueryParam(filterItem.model.value, filterItem.model.name);
-            }
-        }
-        else if (filterItem.isTypeAutocompleteChips || filterItem.isTypeChips) {
-            if (Array.isArray(filterItem.model) && filterItem.model.length) {
-                flattenedParams[filterItem.name] = filterItem.model.map((item) => {
-                    return filterToQueryParam(item.value, item.name);
-                }).join(',');
-            }
-        }
-    });
-    return flattenedParams;
-}
-
-class BaseAutocompleteItem extends BaseItem {
-    get valuesFn() {
-        return this._valuesFn;
-    }
-    _validateModel() {
-        //
-    }
-    _parseConfig(item) {
-        var _a;
-        this.fetchOnFocus = (_a = item.fetchOnFocus) !== null && _a !== void 0 ? _a : true;
-        super._parseConfig(item);
-    }
-}
-
-class AutocompleteChipsItem extends BaseAutocompleteItem {
-    static create(config, filter) {
-        return new AutocompleteChipsItem(config, null, filter);
-    }
-    get value() {
-        if (Array.isArray(this.model) && this.model.length === 0) {
-            return undefined;
-        }
-        return clone(this.model);
-    }
-    get queryObject() {
-        const value = this.value;
-        const name = this.name;
-        const params = {};
-        if (Array.isArray(value)) {
-            params[this.name] = value
-                .filter((item) => !!item.value)
-                .map((item) => item.value)
-                .join(',');
-        }
-        else {
-            params[name] = value;
-        }
-        return params;
-    }
-    get isChipVisible() {
-        return Array.isArray(this.model) && this.model.length > 0;
-    }
-    getChipsContent() {
-        return this.model
-            .reduce((acc, i) => {
-            acc.push(i.name);
-            return acc;
-        }, [])
-            .join(', ');
-    }
-    _init() {
-        if (this.model === undefined) {
-            this._model = [];
-        }
-    }
-    _parseConfig(item) {
-        var _a;
-        this.chipImage = (_a = item.chipImage) !== null && _a !== void 0 ? _a : 'image';
-        this.chipIcon = item.chipIcon;
-        this.chipIconColor = item.chipIconColor;
-        this.chipColor = item.chipColor;
-        this.chipBackground = item.chipBackground;
-        this.chipClass = item.chipClass;
-        super._parseConfig(item);
-    }
-    _clearValue(defaultValue = undefined) {
-        this.model = defaultValue !== null && defaultValue !== void 0 ? defaultValue : [];
-        this.search = '';
-    }
-    _setModel(value) {
-        super._setModel(value || []);
-    }
-}
-
-class AutocompleteItem extends BaseAutocompleteItem {
-    static create(config, filter) {
-        return new AutocompleteItem(config, null, filter);
-    }
-    get value() {
-        let value = clone(this.model);
-        if (!this.model || this.model.value === undefined) {
-            return undefined;
-        }
-        value = this.model.value;
-        return value;
-    }
-    get queryObject() {
-        const value = this.value;
-        const name = this.name;
-        const params = {};
-        params[name] = value;
-        return params;
-    }
-    getChipsContent() {
-        return this.model ? this.model.name : '';
-    }
-    _init() {
-        //
-    }
-    _clearValue(defaultValue = undefined) {
-        this.model = defaultValue !== null && defaultValue !== void 0 ? defaultValue : undefined;
-        this.search = '';
-    }
-}
-
-class CheckboxItem extends BaseItem {
-    static create(config, filter) {
-        return new CheckboxItem(config, null, filter);
-    }
-    get isTypeCheckbox() {
-        return true;
-    }
-    get isChipVisible() {
-        return this.value === this.checked;
-    }
-    get value() {
-        const value = this.model ? this.checked : this.unchecked;
-        if (!value) {
-            return undefined;
-        }
-        return value;
-    }
-    get queryObject() {
-        const value = this.value;
-        const name = this.name;
-        const params = {};
-        params[name] = this.model ? value : undefined;
-        return params;
-    }
-    getChipsContent(type = null) {
-        return this.label;
-    }
-    _validateModel() {
-        //
-    }
-    _parseConfig(item) {
-        this.checked = item.checked;
-        this.unchecked = item.unchecked;
-        this.checked = item.checked ? toString(item.checked) : true;
-        this.unchecked = item.unchecked ? toString(item.unchecked) : false;
-        this.defaultValue = item.default === undefined ? this.unchecked : toString(this.defaultValue);
-        super._parseConfig(item);
-    }
-    _init() {
-        if (this.model === undefined) {
-            this._model = this.checked === this.defaultValue;
-        }
-    }
-    _clearValue(defaultValue = undefined) {
-        this.model = defaultValue !== null && defaultValue !== void 0 ? defaultValue : false;
-    }
-}
-
-class ChipsItem extends BaseItem {
-    static create(config, filter) {
-        return new ChipsItem(config, null, filter);
-    }
-    get isTypeChips() {
-        return true;
-    }
-    get value() {
-        const value = clone(this.model);
-        if (Array.isArray(value) && value.length === 0) {
-            return undefined;
-        }
-        return value;
-    }
-    get isChipVisible() {
-        return !!this.value;
-    }
-    get queryObject() {
-        if (!this.value) {
-            return {};
-        }
-        const value = this.value
-            .map((item) => item.value)
-            .join(',');
-        const name = this.name;
-        return {
-            [name]: value,
-        };
-    }
-    get persistanceObject() {
-        const value = this.value;
-        const name = this.name;
-        const params = {};
-        if (Array.isArray(value)) {
-            params[name] = value.join(',');
-        }
-        else {
-            params[name] = undefined;
-        }
-        return params;
-    }
-    getChipsContent() {
-        return this.model
-            .reduce((acc, i) => {
-            acc.push(i.name);
-            return acc;
-        }, [])
-            .join(', ');
-    }
-    _validateModel() {
-        //
-    }
-    _setModel(value) {
-        if (Array.isArray(value)) {
-            value = value.map((val) => {
-                if (isNaN(val)) {
-                    return val;
-                }
-                return +val;
-            });
-        }
-        this._model = value;
-    }
-    _parseConfig(item) {
-        var _a;
-        this.multiple = (_a = item.multiple) !== null && _a !== void 0 ? _a : true;
-        super._parseConfig(item);
-    }
-    _init() {
-        if (!Array.isArray(this.values)) {
-            this.values = [];
-        }
-        if (this.model && Array.isArray(this.model) && this.values.length) {
-            if (Number.isInteger(this.model[0])) {
-                this._model = this.model.map((id) => {
-                    return this.values.find((value) => value.value === id);
-                });
-            }
-        }
-        if (this.model === undefined) {
-            this._model = [];
-        }
-    }
-    _clearValue(defaultValue = undefined) {
-        this.model = defaultValue !== null && defaultValue !== void 0 ? defaultValue : [];
-    }
-}
-
-var ItemDateMode;
-(function (ItemDateMode) {
-    ItemDateMode["Calendar"] = "calendar";
-    ItemDateMode["ScrollMonthYear"] = "monthyear";
-    ItemDateMode["ScrollMonthDayYear"] = "monthdayyear";
-})(ItemDateMode || (ItemDateMode = {}));
-
-class BaseDateItem extends BaseItem {
-    get value() {
-        const value = clone(this.model);
-        if (!value || !isValid(value) || !isDate(value)) {
-            return undefined;
-        }
-        return value;
-    }
-    get queryObject() {
-        const value = this.value;
-        const name = this.name;
-        const params = {};
-        params[name] = value;
-        return params;
-    }
-    get persistanceObject() {
-        const value = this.queryObject[this.name];
-        return {
-            [this.name]: value ? simpleFormat(value) : undefined,
-        };
-    }
-    _validateModel() {
-    }
-    _setModel(value) {
-        if (value) {
-            if (!isDate(value) || !isValid(value)) {
-                value = parseISO(value);
-            }
-        }
-        super._setModel(value);
-    }
-    _parseConfig(item) {
-        this.maxYear = item.maxYear;
-        this.mode = item.mode || ItemDateMode.Calendar;
-        super._parseConfig(item);
-    }
-    _init() {
-        if (!this.label) {
-            this.label = ['Min', 'Max'];
-        }
-    }
-}
-
-class DateItem extends BaseDateItem {
-    static create(config, filter) {
-        return new DateItem(config, null, filter);
-    }
-    getChipsContent(type = null) {
-        let dateFormat = 'date';
-        if (this.mode === ItemDateMode.ScrollMonthYear) {
-            dateFormat = 'full-date-dayless';
-        }
-        return format(this.model, dateFormat);
-    }
-    _clearValue(defaultValue = undefined) {
-        this.model = defaultValue !== null && defaultValue !== void 0 ? defaultValue : undefined;
-    }
-}
-
-function getRangeName(configCase, name, range) {
-    if (configCase === 'snake') {
-        return name.concat('_').concat(range);
-    }
-    if (configCase === 'camel') {
-        return name.concat(range.charAt(0).toUpperCase()).concat(range.slice(1));
-    }
-}
-
-class BaseDateRangeItem extends BaseItem {
-    get isTypeDateRange() {
-        return this.type === ItemType.DateRange;
-    }
-    get isTypeDateTimeRange() {
-        return this.type === ItemType.DateTimeRange;
-    }
-    get isChipVisible() {
-        return this.model && (this.model.from !== undefined || this.model.to !== undefined);
-    }
-    get value() {
-        let value = clone(this.model);
-        if (!isObject(this.model) ||
-            (isEmpty(this.model.from, { zero: true }) && isEmpty(this.model.to, { zero: true }))) {
-            value = undefined;
-        }
-        if (isEmpty(value, { zero: true })) {
-            return undefined;
-        }
-        let from = value.from;
-        let to = value.to;
-        value = {};
-        if (from) {
-            if (isString(from)) {
-                from = parseISO(from);
-            }
-            if (isValid(from) && isDate(from)) {
-                value.from = from;
-            }
-        }
-        if (to) {
-            if (isString(to)) {
-                to = parseISO(to);
-            }
-            if (isValid(to) && isDate(to)) {
-                value.to = to;
-            }
-        }
-        return value;
-    }
-    get queryObject() {
-        const value = this.value || {};
-        const name = this.name;
-        const paramFromName = getRangeName(this.case, name, 'from');
-        const paramToName = getRangeName(this.case, name, 'to');
-        return {
-            [paramFromName]: value.from || undefined,
-            [paramToName]: value.to || undefined,
-        };
-    }
-    get persistanceObject() {
-        const query = this.queryObject;
-        return Object.keys(this.queryObject)
-            .reduce((acc, key) => {
-            if (!!query[key]) {
-                acc[key] = simpleFormat(query[key]);
-            }
-            else {
-                acc[key] = query[key];
-            }
-            return acc;
-        }, {});
-    }
-    getChipsContent(type = null) {
-        const formatTo = this.type === ItemType.DateRange ? 'date' : 'date-time';
-        if (type === 'from') {
-            const from = this.model.from;
-            return `${format(from, formatTo)}`;
-        }
-        else if (type === 'to') {
-            const to = this.model.to;
-            return `${format(to, formatTo)}`;
-        }
-    }
-    clearDateRange(type = null, defaultValue = undefined) {
-        if (type === 'from') {
-            delete this.model.from;
-            if (defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.from) {
-                this.model.from = defaultValue.from;
-            }
-            this.model = Object.assign({}, this.model);
-        }
-        else if (type === 'to') {
-            delete this.model.to;
-            if (defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.to) {
-                this.model.to = defaultValue.to;
-            }
-            this.model = Object.assign({}, this.model);
-        }
-        else {
-            if (defaultValue) {
-                this.model = Object.assign({}, defaultValue);
-            }
-            else {
-                this.model = {};
-            }
-        }
-    }
-    _validateModel() {
-    }
-    _setModel(value) {
-        if (value) {
-            if (value.from && (!isDate(value.from) || !isValid(value.from))) {
-                value.from = parseISO(value.from);
-            }
-            if (value.to && (!isDate(value.to) || !isValid(value.to))) {
-                value.to = parseISO(value.to);
-            }
-        }
-        super._setModel(value);
-    }
-    _parseConfig(item) {
-        var _a, _b;
-        this.case = (_b = (_a = this._additionalConfig) === null || _a === void 0 ? void 0 : _a.case) !== null && _b !== void 0 ? _b : 'camel';
-        super._parseConfig(item);
-    }
-    _init() {
-        if (!this.label) {
-            this.label = ['Date From', 'Date To'];
-        }
-        if (!this.model) {
-            this.model = this.defaultValue || {};
-        }
-    }
-    _clearValue(defaultValue = undefined) {
-        var _a;
-        this.model = (_a = this.defaultValue) !== null && _a !== void 0 ? _a : {};
-    }
-}
-
-class DateRangeItem extends BaseDateRangeItem {
-    static create(config, filter) {
-        return new DateRangeItem(config, null, filter);
-    }
-}
-
-class DateTimeItem extends BaseDateItem {
-    static create(config, filter) {
-        return new DateTimeItem(config, null, filter);
-    }
-    _clearValue(defaultValue = undefined) {
-        this.model = defaultValue !== null && defaultValue !== void 0 ? defaultValue : undefined;
-    }
-}
-
-class DateTimeRangeItem extends BaseDateRangeItem {
-    static create(config, filter) {
-        return new DateTimeRangeItem(config, null, filter);
-    }
-}
-
-class RangeItem extends BaseItem {
-    static create(config, additionalConfig, filter) {
-        return new RangeItem(config, additionalConfig, filter);
-    }
-    get value() {
-        let value = clone(this.model);
-        if (!isObject(this.model) ||
-            (isEmpty(this.model.max, { zero: true }) && isEmpty(this.model.min, { zero: true }))) {
-            value = undefined;
-        }
-        return value;
-    }
-    get queryObject() {
-        const value = this.value;
-        const name = this.name;
-        const params = {};
-        const paramMinName = getRangeName(this.case, name, 'min');
-        const paramMaxName = getRangeName(this.case, name, 'max');
-        if (isObject(value)) {
-            params[paramMinName] = value.min || undefined;
-            params[paramMaxName] = value.max || undefined;
-        }
-        else {
-            params[paramMinName] = undefined;
-            params[paramMaxName] = undefined;
-        }
-        return params;
-    }
-    get isChipVisible() {
-        return this.model && (this.model.min !== undefined || this.model.max !== undefined);
-    }
-    getChipsContent(type) {
-        if (type === 'from') {
-            const min = this.model.min;
-            return `${min}`;
-        }
-        else if (type === 'to') {
-            const max = this.model.max;
-            return `${max}`;
-        }
-    }
-    clearRange(type = null, defaultValue = undefined) {
-        if (type === 'from') {
-            delete this.model.min;
-            if (defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.min) {
-                this.model.min = defaultValue.min;
-            }
-            this.model = Object.assign({}, this.model);
-        }
-        else if (type === 'to') {
-            delete this.model.max;
-            if (defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.max) {
-                this.model.max = defaultValue.max;
-            }
-            this.model = Object.assign({}, this.model);
-        }
-        else {
-            this.model = defaultValue ? Object.assign({}, defaultValue) : {};
-        }
-    }
-    _validateModel() {
-    }
-    _parseConfig(item) {
-        var _a, _b;
-        this.options = item.options;
-        this.prefix = item.prefix;
-        this.suffix = item.suffix;
-        this.case = (_b = (_a = this._additionalConfig) === null || _a === void 0 ? void 0 : _a.case) !== null && _b !== void 0 ? _b : 'camel';
-        super._parseConfig(item);
-    }
-    _init() {
-        if (!this.label) {
-            this.label = ['Min', 'Max'];
-        }
-        if (!this.model) {
-            this.model = this.defaultValue || {};
-        }
-    }
-}
-
-function findValue(values, value, children) {
-    for (let i = 0; i < values.length; i++) {
-        const val = values[i];
-        if (val[children]) {
-            return findValue(val[children], value, children);
-        }
-        if (val.value === value) {
-            return val;
-        }
-    }
-    return undefined;
-}
-
-class SimpleSelectItem extends BaseSelectItem {
-    constructor(itemConfig, _persistedValues, _filter) {
-        super(itemConfig, _persistedValues, _filter);
-    }
-    get value() {
-        let value = this.model;
-        if (value === '__all' || value === undefined) {
-            value = undefined;
-        }
-        return value;
-    }
-    getChipsContent(type = null) {
-        if (this.children) {
-            const itemValue = findValue(this.values, this.model, this.children);
-            return itemValue && itemValue.name;
-        }
-        const itemValue = this.values.find((val) => val.value === this.model);
-        if (itemValue) {
-            return itemValue.name;
-        }
-        else if (this.isolate) {
-            return this.isolate.label;
-        }
-    }
-    get isChipVisible() {
-        return this.model !== '__all' && this.model !== undefined;
-    }
-    _init() {
-        super._init();
-        if (this.model === undefined && this.defaultValue === undefined) {
-            this._model = '__all';
-        }
-    }
-    get isolateOptionNotSelected() {
-        const modelValue = this.model;
-        const isolate = this.isolate;
-        return isolate && !isolate.enabled && (modelValue === null || modelValue === void 0 ? void 0 : modelValue.length) === 0;
-    }
-    _setModel(value) {
-        if (value) {
-            if (!isNaN(value)) {
-                value = +value;
-            }
-        }
-        super._setModel(value);
-    }
-    _validateModel() {
-        const item = this.values.find((value) => {
-            return value.value == this.model;
-        });
-        const value = item ? item.value : '__all';
-        if (this._model !== value) {
-            this.model = value;
-        }
-    }
-    _clearValue(defaultValue = undefined) {
-        super._clearValue(defaultValue);
-        const value = Array.isArray(this.values) && this.values.some((val) => val.value === '__all')
-            ? '__all'
-            : undefined;
-        this.model = defaultValue !== null && defaultValue !== void 0 ? defaultValue : value;
-    }
-}
-
-class SelectItem {
-    static create(config, filter) {
-        if (config.multiple) {
-            return new MultipleSelectItem(config, null, filter);
-        }
-        return new SimpleSelectItem(config, null, filter);
-    }
-}
-
-class TextItem extends BaseItem {
-    static create(config, filter) {
-        return new TextItem(config, null, filter);
-    }
-    get value() {
-        return !!this.model ? this.model : undefined;
-    }
-    get queryObject() {
-        const value = this.value;
-        const name = this.name;
-        const params = {};
-        params[name] = value;
-        return params;
-    }
-    getChipsContent() {
-        return this.model;
-    }
-    _validateModel() {
-        //
-    }
-    _parseConfig(item) {
-        this.prefix = item.prefix;
-        this.suffix = item.suffix;
-        super._parseConfig(item);
-    }
-    _init() {
-        //
-    }
-    _clearValue(defaultValue = undefined) {
-        this.model = defaultValue !== null && defaultValue !== void 0 ? defaultValue : '';
-    }
-}
-
-function parseDate(value) {
-    if (value && (!isDate(value) || !isValid(value))) {
-        return parseISO(value);
-    }
-    return value;
-}
-
-class WeekItem extends BaseItem {
-    static create(config, filter) {
-        return new WeekItem(config, null, filter);
-    }
-    get value() {
-        let value = clone(this.model);
-        if (!isObject(this.model) ||
-            (isEmpty(this.model.from, { zero: true }) && isEmpty(this.model.to, { zero: true }))) {
-            value = undefined;
-        }
-        if (isEmpty(value, { zero: true })) {
-            return undefined;
-        }
-        let from = value.from;
-        let to = value.to;
-        const period = value.period;
-        value = {};
-        if (from) {
-            if (isString(from)) {
-                from = parseISO(from);
-            }
-            if (isValid(from) && isDate(from)) {
-                value.from = from;
-            }
-        }
-        if (to) {
-            if (isString(to)) {
-                to = parseISO(to);
-            }
-            if (isValid(to) && isDate(to)) {
-                value.to = to;
-            }
-        }
-        if (period) {
-            value.period = isString(period) ? parseInt(period, 10) : period;
-        }
-        return value;
-    }
-    get queryObject() {
-        const value = this.value;
-        const name = this.name;
-        const paramFromName = getRangeName('camel', name, 'from');
-        const paramToName = getRangeName('camel', name, 'to');
-        const paramPeriodName = `${name}Period`;
-        return {
-            [paramFromName]: (value === null || value === void 0 ? void 0 : value.from) || undefined,
-            [paramToName]: (value === null || value === void 0 ? void 0 : value.to) || undefined,
-            [paramPeriodName]: (value === null || value === void 0 ? void 0 : value.period) || undefined,
-        };
-    }
-    get persistanceObject() {
-        const query = this.queryObject;
-        const name = this.name;
-        const paramFromName = getRangeName('camel', name, 'from');
-        const paramFromValue = query[paramFromName] && simpleFormat(query[paramFromName]) || query[paramFromName];
-        const paramToName = getRangeName('camel', name, 'to');
-        const paramToValue = query[paramToName] && simpleFormat(query[paramToName]) || query[paramToName];
-        const paramPeriodName = `${name}Period`;
-        return {
-            [paramFromName]: paramFromValue,
-            [paramToName]: paramToValue,
-            [paramPeriodName]: query[paramPeriodName],
-        };
-    }
-    getChipsContent(type = null) {
-        return formatPeriodObject(this.value);
-    }
-    _validateModel() { }
-    _setModel(value) {
-        if (value) {
-            value.from = parseDate(value.from);
-            value.to = parseDate(value.to);
-            value.period = parseInt(value.period, 10) || undefined;
-        }
-        super._setModel(value);
-    }
-    _parseConfig(item) {
-        super._parseConfig(item);
-        this.seedDate = item.seedDate;
-    }
-    _init() { }
-    _clearValue(defaultValue = undefined) {
-        this.model = defaultValue !== null && defaultValue !== void 0 ? defaultValue : undefined;
-    }
-}
-
-function createFilterItem(item, config, filter) {
-    switch (item.type) {
-        case ItemType.Select: {
-            return SelectItem.create(item, filter);
-        }
-        case ItemType.Chips: {
-            return ChipsItem.create(item, filter);
-        }
-        case ItemType.Range: {
-            return RangeItem.create(item, config, filter);
-        }
-        case ItemType.DateRange: {
-            return DateRangeItem.create(item, filter);
-        }
-        case ItemType.DateTimeRange: {
-            return DateTimeRangeItem.create(item, filter);
-        }
-        case ItemType.Date: {
-            return DateItem.create(item, filter);
-        }
-        case ItemType.Week: {
-            return WeekItem.create(item, filter);
-        }
-        case ItemType.DateTime: {
-            return DateTimeItem.create(item, filter);
-        }
-        case ItemType.AutoComplete: {
-            return AutocompleteItem.create(item, filter);
-        }
-        case ItemType.AutoCompleteChips: {
-            return AutocompleteChipsItem.create(item, filter);
-        }
-        case ItemType.Checkbox: {
-            return CheckboxItem.create(item, filter);
-        }
-        case ItemType.Keyword:
-        case ItemType.Text: {
-            return TextItem.create(item, filter);
-        }
-    }
-}
-
-var ActionMode;
-(function (ActionMode) {
-    ActionMode["Button"] = "button";
-    ActionMode["SelectButton"] = "selectButton";
-    ActionMode["Menu"] = "menu";
-    ActionMode["File"] = "file";
-})(ActionMode || (ActionMode = {}));
-
-var ActionType;
-(function (ActionType) {
-    ActionType["Basic"] = "basic";
-    ActionType["Raised"] = "raised";
-    ActionType["Icon"] = "icon";
-    ActionType["Fab"] = "fab";
-    ActionType["MiniFab"] = "mini-fab";
-    ActionType["Flat"] = "flat";
-    ActionType["Stroked"] = "stroked";
-})(ActionType || (ActionType = {}));
-
-var ButtonStyle;
-(function (ButtonStyle) {
-    ButtonStyle["Basic"] = "basic";
-    ButtonStyle["Raised"] = "raised";
-    ButtonStyle["Icon"] = "icon";
-    ButtonStyle["Fab"] = "fab";
-    ButtonStyle["MiniFab"] = "mini-fab";
-    ButtonStyle["Flat"] = "flat";
-    ButtonStyle["Stroked"] = "stroked";
-})(ButtonStyle || (ButtonStyle = {}));
-
-var PickerViewType;
-(function (PickerViewType) {
-    PickerViewType["Date"] = "date";
-    PickerViewType["DateTime"] = "datetime";
-    PickerViewType["Time"] = "time";
-    PickerViewType["Week"] = "week";
-    PickerViewType["MonthRange"] = "monthrange";
-})(PickerViewType || (PickerViewType = {}));
-
-const SORT_BY_FIELD = 'sortName';
-const SORT_DIRECTION_FIELD = 'sortDirection';
-class FsFilterConfig {
-    constructor(data = {}) {
-        this.load = true;
-        this.persist = false;
-        this.inline = false;
-        this.autofocus = false;
-        this.chips = false;
-        this.sortValues = null;
-        this.sort = null;
-        // public sortDirection = null;
-        this.queryParam = false;
-        this.case = 'camel';
-        this._init(data);
-    }
-    _init(data = {}) {
-        var _a, _b, _c, _d, _e, _f, _g;
-        this.load = (_a = data.load) !== null && _a !== void 0 ? _a : true;
-        this.persist = data.persist;
-        this.savedFilters = data.savedFilters;
-        this.inline = (_b = data.inline) !== null && _b !== void 0 ? _b : false;
-        this.autofocus = (_c = data.autofocus) !== null && _c !== void 0 ? _c : false;
-        this.chips = (_d = data.chips) !== null && _d !== void 0 ? _d : false;
-        this.sortValues = data.sorts;
-        this.sort = data.sort;
-        this.queryParam = (_e = data.queryParam) !== null && _e !== void 0 ? _e : false;
-        this.init = data.init;
-        this.change = data.change;
-        this.reload = data.reload;
-        this.autoReload = data.autoReload;
-        this.clear = data.clear;
-        this.sortChange = data.sortChange;
-        this.case = (_f = data.case) !== null && _f !== void 0 ? _f : 'camel';
-        this.reloadWhenConfigChanged = data.reloadWhenConfigChanged;
-        this.button = data.button;
-        this.items = data.items;
-        this.actions = data.actions;
-        this.case = (_g = data.case) !== null && _g !== void 0 ? _g : 'camel';
-        if (this.persist) {
-            if (typeof this.persist === 'object') {
-                if (this.persist.name) {
-                    this.namespace = this.persist.name;
-                }
-            }
-        }
-        if (!this.button) {
-            this.button = {};
-        }
-        if (this.button.label === undefined) {
-            this.button.label = 'Filters';
-        }
-        if (this.button.icon === undefined) {
-            this.button.icon = 'tune';
-        }
-        if (this.button.style === undefined) {
-            this.button.style = ButtonStyle.Raised;
-        }
-        if (this.button.color === undefined) {
-            this.button.color = 'default';
-        }
-        if (this.clear === undefined) {
-            this.clear = () => { };
-        }
-    }
-}
-
-class FsFilterItemsStore {
-    constructor() {
-        this.sortByItem = null;
-        this.sortDirectionItem = null;
-        this.keywordItem = null;
-        this._ready$ = new BehaviorSubject(false);
-        this._items = [];
-        this._visibleItems$ = new BehaviorSubject([]);
-        this._itemsByName = new Map();
-        this._itemsValuesLoaded = false;
-        this._hasKeyword = false;
-        this._itemsChange$ = new Subject();
-        this._destroy$ = new Subject();
-        this._lazyInit();
-    }
-    get items() {
-        return this._items;
-    }
-    get itemNames() {
-        return this._items.map((item) => item.name);
-    }
-    get visibleItems() {
-        return this._visibleItems$.getValue();
-    }
-    set visibleItems(items) {
-        this._visibleItems$.next(items);
-    }
-    get visibleItems$() {
-        return this._visibleItems$.asObservable();
-    }
-    get hasKeyword() {
-        return this._hasKeyword;
-    }
-    get itemsChange$() {
-        return this._itemsChange$.pipe(debounceTime(30));
-    }
-    get ready$() {
-        return this._ready$.asObservable();
-    }
-    ngOnDestroy() {
-        this.destroyItems();
-        this._destroy$.next();
-        this._destroy$.complete();
-    }
-    setConfig(config) {
-        this._itemsByName.clear();
-        this._config = config;
-        this.initItems(config.items);
-    }
-    getItemByName(name) {
-        return this._itemsByName.get(name);
-    }
-    initItems(items) {
-        this._itemsValuesLoaded = false;
-        if (Array.isArray(items)) {
-            this._createItems(items);
-        }
-    }
-    filtersClear() {
-        var _a;
-        this.items.forEach((item) => {
-            if (item instanceof RangeItem) {
-                item.clearRange(null, item.defaultValue);
-            }
-            else if (item instanceof BaseDateRangeItem) {
-                item.clearDateRange(null, item.defaultValue);
-            }
-            else {
-                item.clear(item.defaultValue);
-            }
-        });
-        if (this.sortByItem) {
-            if (this._config.sort) {
-                this.sortByItem.model = this._config.sort.value;
-            }
-            else {
-                this.sortByItem.clear(this.sortByItem.defaultValue);
-            }
-        }
-        if (this.sortDirectionItem) {
-            if (this._config.sort) {
-                this.sortDirectionItem.model = this._config.sort.direction;
-            }
-            else {
-                this.sortDirectionItem.clear(this.sortDirectionItem.defaultValue);
-            }
-        }
-        (_a = this.keywordItem) === null || _a === void 0 ? void 0 : _a.clear();
-    }
-    loadAsyncValues() {
-        this.items
-            .filter((item) => item.hasPendingValues)
-            .forEach((item) => item.loadAsyncValues());
-    }
-    loadAsyncDefaults() {
-        // default values can be asynchronous, and we must load them if there is no persisted value instead
-        const defaultValuesToBeLoaded = this.items
-            .filter((item) => {
-            return item.defaultValueFn
-                && (item.persistedValue === null || item.persistedValue === undefined);
-        });
-        // special hack for isolate multiple select
-        // values for this type of select must be preloaded
-        // Read more in class MultipleSelectItem._init()
-        const valuesToBeLoaded = this.items
-            .filter((item) => {
-            return (item instanceof MultipleSelectItem) && item.hasPendingValues && item.isolate;
-        });
-        if (defaultValuesToBeLoaded.length > 0 || valuesToBeLoaded.length > 0) {
-            forkJoin([
-                ...defaultValuesToBeLoaded
-                    .map((item) => item.loadDefaultValue()),
-                ...valuesToBeLoaded
-                    .map((item) => {
-                    item.loadAsyncValues();
-                    return item.loading$
-                        .pipe();
-                }),
-            ])
-                .pipe(finalize(() => {
-                this._ready$.next(true);
-            }), takeUntil(this._destroy$))
-                .subscribe();
-        }
-        else {
-            this._ready$.next(true);
-        }
-    }
-    getSort() {
-        let sortBy = this.getSortByValue();
-        sortBy = sortBy === '__all' ? null : sortBy;
-        let sortDirection = this.getSortDirectionValue();
-        sortDirection = sortDirection === '__all' ? null : sortDirection;
-        return {
-            value: sortBy,
-            direction: sortDirection,
-        };
-    }
-    getSortByValue() {
-        return this.sortByItem ? this.sortByItem.model : null;
-    }
-    getSortDirectionValue() {
-        return this.sortDirectionItem ? this.sortDirectionItem.model : null;
-    }
-    updateSort(sort) {
-        if (sort.sortBy) {
-            this.sortByItem.model = sort.sortBy;
-        }
-        if (sort.sortDirection) {
-            this.sortDirectionItem.model = sort.sortDirection;
-        }
-    }
-    values(onlyPresented = false) {
-        return this.items
-            .reduce((acc, item) => {
-            const value = item.value;
-            if (!onlyPresented || value !== null) {
-                acc[item.name] = value;
-            }
-            return acc;
-        }, {});
-    }
-    valuesAsQuery({ onlyPresented = true, items = null, persisted = false, } = {}) {
-        const params = {};
-        (items || this.items)
-            .forEach((filterItem) => {
-            const values = persisted
-                ? filterItem.persistanceObject
-                : filterItem.queryObject;
-            Object.assign(params, values);
-        });
-        if (onlyPresented) {
-            return pickBy(params, (val) => {
-                return val !== void 0;
-            });
-        }
-        return params;
-    }
-    init(p) {
-        this.items
-            .forEach((item) => {
-            item.initValues(p[item.name]);
-        });
-        this._initSortingItems(p);
-        this.loadAsyncDefaults();
-        this._subscribeToItemsChanges();
-    }
-    updateItemsWithValues(values) {
-        this.items
-            .forEach((item) => {
-            if (values[item.name]) {
-                item.model = values[item.name];
-            }
-            else {
-                if (item instanceof RangeItem) {
-                    item.clearRange(null, item.defaultValue);
-                }
-                else if (item instanceof BaseDateRangeItem) {
-                    item.clearDateRange(null, item.defaultValue);
-                }
-                else {
-                    item.clear();
-                }
-            }
-        });
-        if (this.sortByItem) {
-            this.sortByItem.clear();
-        }
-        if (this.sortDirectionItem) {
-            this.sortDirectionItem.clear();
-        }
-    }
-    updateSortingItemsValues(items) {
-        this.sortByItem.values = items;
-    }
-    destroyItems() {
-        var _a, _b;
-        this.items
-            .forEach((item) => item.destroy());
-        (_a = this.sortByItem) === null || _a === void 0 ? void 0 : _a.destroy();
-        (_b = this.sortDirectionItem) === null || _b === void 0 ? void 0 : _b.destroy();
-        this._items = [];
-        this.sortByItem = null;
-        this.sortDirectionItem = null;
-    }
-    /**
-     * Some items might need to load async values before they will be shown
-     */
-    prepareItems() {
-        if (!this._itemsValuesLoaded) {
-            this._itemsValuesLoaded = true;
-            this.loadAsyncValues();
-        }
-    }
-    updateItemsVisiblity() {
-        this.visibleItems = this.items
-            .filter((item) => !item.isTypeKeyword && !item.hide);
-    }
-    _createItems(items) {
-        this._items = items
-            .filter((item) => !item.disable)
-            .filter((item) => {
-            if (this._itemsByName.has(item.name)) {
-                throw Error('Filter init error. Items name must be unique.');
-            }
-            else {
-                this._itemsByName.set(item.name, null);
-                return true;
-            }
-        })
-            .map((item) => {
-            const filterItem = createFilterItem(item, { case: this._config.case }, this.filter);
-            if (filterItem.type === ItemType.Keyword) {
-                this._hasKeyword = true;
-            }
-            this._itemsByName.set(item.name, filterItem);
-            return filterItem;
-        });
-        this._createSortingItems();
-    }
-    _subscribeToItemsChanges() {
-        var _a;
-        this.items
-            .forEach((item) => {
-            item.valueChange$
-                .pipe(takeUntil(item.destroy$))
-                .subscribe(() => {
-                this._itemsChange$.next(item);
-            });
-        });
-        if ((_a = this._config.sortValues) === null || _a === void 0 ? void 0 : _a.length) {
-            this.sortByItem.valueChange$
-                .pipe(takeUntil(this.sortByItem.destroy$))
-                .subscribe(() => {
-                this._itemsChange$.next(this.sortByItem);
-            });
-            this.sortDirectionItem.valueChange$
-                .pipe(takeUntil(this.sortDirectionItem.destroy$))
-                .subscribe(() => {
-                this._itemsChange$.next(this.sortDirectionItem);
-            });
-        }
-    }
-    _lazyInit() {
-        this.ready$
-            .pipe(filter$1((state) => state), takeUntil(this._destroy$))
-            .subscribe(() => {
-            this.updateItemsVisiblity();
-            this._setKeywordItem();
-        });
-    }
-    _initSortingItems(p) {
-        if (this.sortByItem && this.sortDirectionItem) {
-            this.sortByItem.initValues(p[this.sortByItem.name]);
-            this.sortDirectionItem.initValues(p[this.sortDirectionItem.name]);
-        }
-    }
-    _createSortingItems() {
-        var _a;
-        if (((_a = this._config.sortValues) === null || _a === void 0 ? void 0 : _a.length) > 0) {
-            const sortByItem = {
-                name: SORT_BY_FIELD,
-                type: ItemType.Select,
-                label: 'Sort by',
-                values: this._config.sortValues,
-            };
-            if (this._config.sort && this._config.sort.value) {
-                sortByItem.default = this._config.sort.value;
-            }
-            this.sortByItem = new SimpleSelectItem(sortByItem, null, this.filter);
-            const sortDirectionItem = {
-                name: SORT_DIRECTION_FIELD,
-                type: ItemType.Select,
-                label: 'Sort direction',
-                values: [
-                    { name: 'Ascending', value: 'asc' },
-                    { name: 'Descending', value: 'desc' },
-                ],
-            };
-            if (this._config.sort && this._config.sort.direction) {
-                sortDirectionItem.default = this._config.sort.direction;
-            }
-            this.sortDirectionItem = new SimpleSelectItem(sortDirectionItem, null, this.filter);
-        }
-    }
-    _setKeywordItem() {
-        this.keywordItem = this
-            .items
-            .find((item) => item.isTypeKeyword);
-    }
-}
-FsFilterItemsStore.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterItemsStore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-FsFilterItemsStore.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterItemsStore });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterItemsStore, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return []; } });
-
-function parseItemValueFromStored(item, params, paramCase) {
-    const param = params[item.name];
-    switch (item.type) {
-        case ItemType.Range: {
-            const min = params[getRangeName(paramCase, item.name, 'min')];
-            const max = params[getRangeName(paramCase, item.name, 'max')];
-            return { min: min, max: max };
-        }
-        case ItemType.DateRange:
-        case ItemType.DateTimeRange: {
-            const from = params[getRangeName(item.case, item.name, 'from')];
-            const to = params[getRangeName(item.case, item.name, 'to')];
-            return { from: from, to: to };
-        }
-        case ItemType.Week: {
-            const from = params[getRangeName('camel', item.name, 'from')];
-            const to = params[getRangeName('camel', item.name, 'to')];
-            const period = params[`${item.name}Period`];
-            return { from, to, period };
-        }
-        case ItemType.Select: {
-            if (item.multiple && !!param) {
-                const values = param.split(',');
-                if (item.isolate) {
-                    const isolatedValue = Array.isArray(item.isolate.value)
-                        ? item.isolate.value
-                        : [item.isolate.value];
-                    item.isolate.enabled = arraysHaveSameElements(isolatedValue, values);
-                    return item.isolate.enabled
-                        ? isolatedValue
-                        : values;
-                }
-                return values;
-            }
-            else {
-                return param;
-            }
-        }
-        case ItemType.Checkbox: {
-            if (param === 'true') {
-                return true === item.checked;
-            }
-            else {
-                return param === item.checked;
-            }
-        }
-        case ItemType.AutoComplete: {
-            const filterParts = filterFromQueryParam(param);
-            return {
-                name: filterParts[1],
-                value: filterParts[0]
-            };
-        }
-        case ItemType.AutoCompleteChips:
-        case ItemType.Chips: {
-            const filterParts = param.split(',');
-            return filterParts.reduce((arry, value) => {
-                const chipParts = filterFromQueryParam(value);
-                arry.push({
-                    name: chipParts[1],
-                    value: chipParts[0],
-                });
-                return arry;
-            }, []);
-        }
-        default: {
-            return param;
-        }
-    }
-}
-function arraysHaveSameElements(arr1, arr2) {
-    arr1 = [...arr1].sort();
-    arr2 = [...arr2].sort();
-    return arr1.some((item) => {
-        return arr2.includes(item);
-    });
-}
-
-/**
- * We need this function because when we store persisted/query/remote filter values
- * it stores with different format, ex.: Range will be stored as RangeFrom && RangeTo
- * and in this case we don't know how to restroe those values.
- *
- * This function do convertation for those kinds of stored values
- *
- * @param params
- * @param items
- * @param paramsCase
- */
-function restoreItems(params, items, paramsCase) {
-    const result = {};
-    Object.keys(params)
-        .forEach((name) => {
-        const item = findItemWidthName(items, name);
-        if (item) {
-            result[item.name] = parseItemValueFromStored(item, params, paramsCase);
-        }
-    });
-    return result;
-}
-function findItemWidthName(items, name) {
-    return items
-        .find((filterItem) => {
-        if (filterItem instanceof RangeItem) {
-            return name === getRangeName(filterItem.case, filterItem.name, 'min') ||
-                name === getRangeName(filterItem.case, filterItem.name, 'max') ||
-                name === filterItem.name;
-        }
-        else if (filterItem instanceof DateRangeItem || filterItem instanceof DateTimeRangeItem) {
-            return name === getRangeName(filterItem.case, filterItem.name, 'from') ||
-                name === getRangeName(filterItem.case, filterItem.name, 'to');
-        }
-        else if (filterItem instanceof WeekItem) {
-            return name === getRangeName('camel', filterItem.name, 'from')
-                || name === getRangeName('camel', filterItem.name, 'to')
-                || name === `${filterItem.name}Period`;
-        }
-        return filterItem.name === name;
-    });
-}
-
-const FILTER_STORE_KEY = 'fs-filter-persist';
-class PersistanceParamsController extends FsPersistanceStore {
-    constructor(_store, _route, _location, _itemsStore, _dialogRef, _drawerRef) {
-        super(_store, _route);
-        this._location = _location;
-        this._itemsStore = _itemsStore;
-        this._dialogRef = _dialogRef;
-        this._drawerRef = _drawerRef;
-        this.STORE_KEY = FILTER_STORE_KEY;
-    }
-    init(persistanceConfig, namespace, paramsCase) {
-        this._paramsCase = paramsCase;
-        namespace = namespace !== null && namespace !== void 0 ? namespace : getNormalizedPath(this._location);
-        const persistanceDisabled = !!this._dialogRef || !!this._drawerRef;
-        this.setConfig(persistanceConfig, namespace, persistanceDisabled);
-    }
-    restore() {
-        if (!this.enabled) {
-            return;
-        }
-        super.restore();
-        const items = [
-            ...this._itemsStore.items,
-            this._itemsStore.sortByItem,
-            this._itemsStore.sortDirectionItem,
-        ].filter((item) => !!item);
-        if (this._value) {
-            this._value.data = restoreItems(this._value.data, items, this._paramsCase);
-        }
-    }
-}
-PersistanceParamsController.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PersistanceParamsController, deps: [{ token: i1.FsStore }, { token: i2.ActivatedRoute }, { token: i1$1.Location }, { token: FsFilterItemsStore }, { token: i1$2.MatDialogRef, optional: true }, { token: i6.DrawerRef, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
-PersistanceParamsController.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PersistanceParamsController });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PersistanceParamsController, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () {
-        return [{ type: i1.FsStore }, { type: i2.ActivatedRoute }, { type: i1$1.Location }, { type: FsFilterItemsStore }, { type: i1$2.MatDialogRef, decorators: [{
-                        type: Optional
-                    }] }, { type: i6.DrawerRef, decorators: [{
-                        type: Optional
-                    }] }];
-    } });
-
-class QueryParamsController {
-    constructor(_route, _itemsStore) {
-        this._route = _route;
-        this._itemsStore = _itemsStore;
-        this._enabled = false;
-    }
-    get enabled() {
-        return this._enabled;
-    }
-    get fetchedParams() {
-        return this._fetchedParams;
-    }
-    init(enabled, paramsCase) {
-        this._enabled = enabled;
-        this._paramsCase = paramsCase;
-        if (this.enabled) {
-            this.fetchFromQueryParams();
-        }
-    }
-    writeStateToQueryParams(params) {
-        if (this._enabled) {
-            this._replaceState(params);
-        }
-    }
-    /**
-     * Parse query and update filter values
-     */
-    fetchFromQueryParams() {
-        const items = [
-            ...this._itemsStore.items,
-            this._itemsStore.sortByItem,
-            this._itemsStore.sortDirectionItem,
-        ].filter((item) => !!item);
-        this._fetchedParams = restoreItems(this._route.snapshot.queryParams, items, this._paramsCase);
-    }
-    _replaceState(data) {
-        const url = new URL(window.location.href);
-        Object.keys(data)
-            .forEach((name) => {
-            if (data[name] === undefined || data[name] === null) {
-                url.searchParams.delete(name);
-            }
-            else {
-                url.searchParams.set(name, data[name]);
-            }
-        });
-        history.replaceState({}, null, url.pathname + url.search);
-    }
-}
-QueryParamsController.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: QueryParamsController, deps: [{ token: i2.ActivatedRoute }, { token: FsFilterItemsStore }], target: i0.ɵɵFactoryTarget.Injectable });
-QueryParamsController.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: QueryParamsController });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: QueryParamsController, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: i2.ActivatedRoute }, { type: FsFilterItemsStore }]; } });
-
-class FsFilterSavedFilterEditComponent {
-    constructor(data, _dialogRef) {
-        this.data = data;
-        this._dialogRef = _dialogRef;
-        this.saveAsFilter = 'new';
-        this.savedFilterName = '';
-        this._destroy$ = new Subject();
-        this.save = () => {
-            const savedFilter = this.saveAsFilter === 'new' ?
-                {
-                    name: this.savedFilterName,
-                    active: true,
-                    filters: this.data.params,
-                } : Object.assign(Object.assign({}, this.saveAsFilter), { filters: this.data.params });
-            return this._saveCallback(savedFilter)
-                .pipe(tap((filter) => {
-                this._dialogRef.close(filter);
-            }), takeUntil(this._destroy$));
-        };
-        this.savedFilters = this.data.savedFilters;
-        this._saveCallback = this.data.saveCallback;
-    }
-}
-FsFilterSavedFilterEditComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterSavedFilterEditComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1$2.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component });
-FsFilterSavedFilterEditComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FsFilterSavedFilterEditComponent, selector: "ng-component", ngImport: i0, template: "<form fsForm [submit]=\"save\">\n  <h1 mat-dialog-title>\n    Save filter\n  </h1>\n  <div mat-dialog-content>\n    <mat-form-field>\n      <mat-label>Save as</mat-label>\n      <mat-select [(ngModel)]=\"saveAsFilter\" name=\"saveAs\">\n        <mat-option value=\"new\">New filter</mat-option>\n        <ng-container *ngIf=\"savedFilters.length\">\n          <mat-optgroup label=\"Saved filters\">\n            <ng-container *ngFor=\"let filter of savedFilters\">\n              <mat-option [value]=\"filter\">{{ filter.name }}</mat-option>\n            </ng-container>\n          </mat-optgroup>\n        </ng-container>\n      </mat-select>\n    </mat-form-field>\n    <br>\n    <mat-form-field *ngIf=\"saveAsFilter === 'new'\">\n      <mat-label>Name</mat-label>\n      <input matInput name=\"filter-name\" [(ngModel)]=\"savedFilterName\" required>\n    </mat-form-field>\n  </div>\n  <div mat-dialog-actions>\n    <button \n        mat-button\n        type=\"submit\"\n        color=\"primary\">\n      {{ saveAsFilter === 'new' ? 'Create' : 'Save' }}\n    </button>\n\n    <button \n        mat-button\n        type=\"button\"\n        [mat-dialog-close]=\"null\">\n      Cancel\n    </button>\n  </div>\n</form>\n", dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i4$1.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i5.MatOptgroup, selector: "mat-optgroup", inputs: ["disabled"], exportAs: ["matOptgroup"] }, { kind: "component", type: i3$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"] }, { kind: "directive", type: i1$2.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1$2.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$2.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i1$2.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i9.FsFormDirective, selector: "[fsForm]", inputs: ["wrapperSelector", "messageSelector", "hintSelector", "labelSelector", "autocomplete", "shortcuts", "confirm", "confirmDialog", "confirmDrawer", "confirmBrowser", "confirmTabs", "dirtySubmitButton", "submit", "successDelay", "errorDelay", "tabGroup", "deactivationGuard"], outputs: ["fsForm", "invalid", "valid", "submitted", "reseted", "cleared"], exportAs: ["fsForm"] }, { kind: "directive", type: i9.FsFormRequiredDirective, selector: "[fsFormRequired],[ngModel][required]", inputs: ["fsFormRequired", "required", "fsFormRequiredMessage"] }, { kind: "directive", type: i9.FsFormNoFsValidatorsDirective, selector: "[ngModel]:not([required]):not([fsFormRequired]):not([fsFormCompare]):not([fsFormDateRange]):not([fsFormEmail]):not([fsFormEmails]):not([fsFormFunction]):not([fsFormGreater]):not([fsFormGreaterEqual]):not([fsFormInteger]):not([fsFormLesser]):not([fsFormMax]):not([fsFormMaxLength]):not([fsFormMin]):not([fsFormMinLength]):not([fsFormNumeric]):not([fsFormPattern]):not([fsFormPhone]):not([fsFormUrl]):not([validate])" }, { kind: "directive", type: i9.FsButtonDirective, selector: "[mat-raised-button]:not([fsFormButtonStandalone]),[mat-button]:not([fsFormButtonStandalone]),[mat-flat-button]:not([fsFormButtonStandalone]),[mat-stroked-button]:not([fsFormButtonStandalone])", inputs: ["name", "dirtySubmit", "form"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterSavedFilterEditComponent, decorators: [{
-            type: Component,
-            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, template: "<form fsForm [submit]=\"save\">\n  <h1 mat-dialog-title>\n    Save filter\n  </h1>\n  <div mat-dialog-content>\n    <mat-form-field>\n      <mat-label>Save as</mat-label>\n      <mat-select [(ngModel)]=\"saveAsFilter\" name=\"saveAs\">\n        <mat-option value=\"new\">New filter</mat-option>\n        <ng-container *ngIf=\"savedFilters.length\">\n          <mat-optgroup label=\"Saved filters\">\n            <ng-container *ngFor=\"let filter of savedFilters\">\n              <mat-option [value]=\"filter\">{{ filter.name }}</mat-option>\n            </ng-container>\n          </mat-optgroup>\n        </ng-container>\n      </mat-select>\n    </mat-form-field>\n    <br>\n    <mat-form-field *ngIf=\"saveAsFilter === 'new'\">\n      <mat-label>Name</mat-label>\n      <input matInput name=\"filter-name\" [(ngModel)]=\"savedFilterName\" required>\n    </mat-form-field>\n  </div>\n  <div mat-dialog-actions>\n    <button \n        mat-button\n        type=\"submit\"\n        color=\"primary\">\n      {{ saveAsFilter === 'new' ? 'Create' : 'Save' }}\n    </button>\n\n    <button \n        mat-button\n        type=\"button\"\n        [mat-dialog-close]=\"null\">\n      Cancel\n    </button>\n  </div>\n</form>\n" }]
-        }], ctorParameters: function () {
-        return [{ type: undefined, decorators: [{
-                        type: Inject,
-                        args: [MAT_DIALOG_DATA]
-                    }] }, { type: i1$2.MatDialogRef }];
-    } });
-
-class SavedFiltersController {
-    constructor(_itemsStore, _dialog) {
-        this._itemsStore = _itemsStore;
-        this._dialog = _dialog;
-        this._savedFilters$ = new BehaviorSubject([]);
-        this._activeFilter$ = new BehaviorSubject(null);
-        this._enabled$ = new BehaviorSubject(false);
-        this._destroy$ = new Subject();
-    }
-    get enabled() {
-        return this._enabled$.getValue();
-    }
-    get enabled$() {
-        return this._enabled$
-            .pipe(distinctUntilChanged());
-    }
-    get savedFilters() {
-        return this._savedFilters$.getValue();
-    }
-    set savedFilters(filters) {
-        this._savedFilters$.next(filters);
-    }
-    get savedFilters$() {
-        return this._savedFilters$
-            .pipe(distinctUntilChanged());
-    }
-    get activeFilter() {
-        return this._activeFilter$.getValue();
-    }
-    get activeFilter$() {
-        return this._activeFilter$
-            .pipe(distinctUntilChanged());
-    }
-    get activeFilterData() {
-        var _a;
-        return (_a = this._activeFilter$.getValue()) === null || _a === void 0 ? void 0 : _a.filters;
-    }
-    ngOnDestroy() {
-        this._destroy$.next();
-        this._destroy$.complete();
-    }
-    init(remoteParamsConfig, paramsCase) {
-        if (!remoteParamsConfig) {
-            this._setEnabledStatus(false);
-            return;
-        }
-        this._setEnabledStatus(true);
-        this._paramsCase = paramsCase;
-        this._config = remoteParamsConfig;
-    }
-    initSavedFilters(filters) {
-        filters = [...filters];
-        filters.forEach((savedFilter) => {
-            savedFilter.filters = restoreItems(savedFilter.filters, this._itemsStore.items, this._paramsCase);
-        });
-        this.savedFilters = filters;
-    }
-    load() {
-        return this._config.load()
-            .pipe(tap((response) => {
-            this.initSavedFilters(response);
-        }));
-    }
-    save(savedFilter) {
-        return this._config.save(savedFilter);
-    }
-    order(savedFilters) {
-        return this._config.order(savedFilters)
-            .pipe(tap(() => {
-            this.savedFilters = [
-                ...savedFilters,
-            ];
-        }));
-    }
-    delete(savedFilter) {
-        return this._config.delete(savedFilter)
-            .pipe(tap(() => {
-            this.savedFilters = this.savedFilters
-                .filter((f) => f.id !== savedFilter.id);
-        }));
-    }
-    setActiveFilter(savedFilter) {
-        if (savedFilter) {
-            const existingFilter = this.savedFilters
-                .find((f) => f.id === savedFilter.id);
-            if (!existingFilter) {
-                throw new Error(`Saved filter cannot be activated, because it does not exists. Filter ID = ${savedFilter.id}`);
-            }
-            this._activeFilter$.next(existingFilter);
-        }
-        else {
-            this._activeFilter$.next(null);
-        }
-    }
-    openSavedFilterEditDialog() {
-        const params = buildQueryParams(this._itemsStore.valuesAsQuery(), this._itemsStore.items);
-        const dialogConfig = {
-            data: {
-                params: params,
-                savedFilters: this.savedFilters,
-                saveCallback: this.save.bind(this),
-            },
-        };
-        this._dialog
-            .open(FsFilterSavedFilterEditComponent, dialogConfig)
-            .beforeClosed()
-            .pipe(take(1), takeUntil(this._destroy$))
-            .subscribe((updatedFilter) => {
-            if (updatedFilter) {
-                // get already saved related filter object
-                const savedFilter = this.savedFilters
-                    .find((f) => f.id === updatedFilter.id);
-                // restore values from query string
-                updatedFilter.filters = restoreItems(updatedFilter.filters, this._itemsStore.items, this._paramsCase);
-                if (savedFilter) {
-                    Object.assign(savedFilter, updatedFilter);
-                }
-                else {
-                    this.resetActiveFilter();
-                    this.savedFilters = [
-                        ...this.savedFilters,
-                        updatedFilter,
-                    ];
-                }
-                this.updateActiveFilter();
-            }
-        });
-    }
-    updateActiveFilter() {
-        // Lookup active filter
-        const acitveFilter = this.savedFilters
-            .find((f) => f.active);
-        if (acitveFilter) {
-            this.setActiveFilter(acitveFilter);
-        }
-    }
-    resetActiveFilter() {
-        // Reset all previously activated filters
-        this.savedFilters.forEach((savedFilter) => {
-            savedFilter.active = false;
-        });
-        this.setActiveFilter(null);
-    }
-    _setEnabledStatus(value) {
-        this._enabled$.next(value);
-    }
-}
-SavedFiltersController.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SavedFiltersController, deps: [{ token: FsFilterItemsStore }, { token: i1$2.MatDialog }], target: i0.ɵɵFactoryTarget.Injectable });
-SavedFiltersController.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SavedFiltersController });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SavedFiltersController, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: FsFilterItemsStore }, { type: i1$2.MatDialog }]; } });
-
-class ExternalParamsController {
-    constructor(_itemsStore, _persistanceStore, _queryParams, _savedFilters) {
-        this._itemsStore = _itemsStore;
-        this._persistanceStore = _persistanceStore;
-        this._queryParams = _queryParams;
-        this._savedFilters = _savedFilters;
-        this._pending$ = new BehaviorSubject(false);
-        this._shouldResetSavedFilters = true;
-        this._destroy$ = new Subject();
-    }
-    get params() {
-        var _a;
-        let result = {};
-        if (this._persistanceStore.enabled) {
-            result = Object.assign(Object.assign({}, result), (_a = this._persistanceStore.value) === null || _a === void 0 ? void 0 : _a.data);
-        }
-        if (this._savedFilters.enabled && this._savedFilters.activeFilter) {
-            const query = Object.keys(result)
-                .filter((key) => !this._itemsStore.itemNames.includes(key))
-                .reduce((acc, key) => {
-                return Object.assign(Object.assign({}, acc), { [key]: result[key] });
-            }, {});
-            result = Object.assign(Object.assign({}, query), this._savedFilters.activeFilterData);
-        }
-        else if (this._queryParams.enabled) {
-            result = Object.assign(Object.assign({}, result), this._queryParams.fetchedParams);
-        }
-        return result;
-    }
-    get pending() {
-        return this._pending$.getValue();
-    }
-    get pending$() {
-        return this._pending$.asObservable();
-    }
-    get savedFiltersController() {
-        return this._savedFilters;
-    }
-    get savedFiltersEnabled() {
-        return this._savedFilters.enabled;
-    }
-    ngOnDestroy() {
-        this._destroy$.next();
-        this._destroy$.complete();
-    }
-    setConfig(config) {
-        this._config = config;
-        this._initPersistance();
-        this._initQueryParams();
-        this._initSavedFilters();
-        this.initItems();
-    }
-    setActiveSavedFilter(savedFilter) {
-        this.savedFiltersController.setActiveFilter(savedFilter);
-        if (savedFilter) {
-            this.reloadFiltersWithValues(savedFilter.filters, false);
-        }
-    }
-    reloadFiltersWithValues(params, shouldResetSavedFilters = true) {
-        this._shouldResetSavedFilters = shouldResetSavedFilters;
-        this._itemsStore.updateItemsWithValues(params);
-        this._saveQueryParams();
-        this._savePersistedParams();
-    }
-    initItems() {
-        this._pending$.next(true);
-        if (this._savedFilters.enabled) {
-            this._savedFilters
-                .load()
-                .pipe(takeUntil(this._destroy$))
-                .subscribe(() => {
-                this._savedFilters.updateActiveFilter();
-                this._initItemsValues();
-                this._listenAndResetSavedFilters();
-                this._pending$.next(false);
-            });
-        }
-        else {
-            this._initItemsValues();
-            this._pending$.next(false);
-        }
-        this._listenItemsChange();
-    }
-    _initItemsValues() {
-        this._itemsStore.init(this.params);
-        this._saveQueryParams();
-        this._savePersistedParams();
-    }
-    fetchQueryParams() {
-        this._initQueryParams();
-        this._itemsStore.updateItemsWithValues(this.params);
-    }
-    _initPersistance() {
-        this._persistanceStore.init(this._config.persist, this._config.namespace, this._config.case);
-    }
-    _initQueryParams() {
-        this._queryParams.init(this._config.queryParam, this._config.case);
-    }
-    _initSavedFilters() {
-        this._savedFilters.init(this._config.savedFilters, this._config.case);
-    }
-    _listenItemsChange() {
-        this._itemsStore.ready$
-            .pipe(filter$1((v) => v), take(1), takeUntil(this._destroy$))
-            .subscribe(() => {
-            this._saveQueryParams();
-            this._savePersistedParams();
-        });
-        this._itemsStore
-            .itemsChange$
-            .pipe(takeUntil(this._destroy$))
-            .subscribe(() => {
-            this._saveQueryParams();
-            this._savePersistedParams();
-        });
-    }
-    _listenAndResetSavedFilters() {
-        this._itemsStore
-            .itemsChange$
-            .pipe(filter$1(() => !!this.savedFiltersController.activeFilter), switchMap(() => {
-            const shouldReset = this._shouldResetSavedFilters;
-            this._shouldResetSavedFilters = true;
-            return of(shouldReset);
-        }), filter$1((shouldReset) => shouldReset), takeUntil(this._destroy$))
-            .subscribe(() => {
-            this.savedFiltersController.resetActiveFilter();
-        });
-    }
-    _saveQueryParams() {
-        const targetItems = this._itemsStore.items
-            .filter((item) => !item.queryParamsDisabled);
-        const params = buildQueryParams(this._itemsStore.valuesAsQuery({
-            onlyPresented: false,
-            items: targetItems,
-            persisted: true,
-        }), targetItems);
-        this._queryParams.writeStateToQueryParams(params);
-    }
-    _savePersistedParams() {
-        const targetItems = this._itemsStore.items
-            .filter((item) => !item.persistanceDisabled);
-        const params = buildQueryParams(this._itemsStore.valuesAsQuery({
-            onlyPresented: false,
-            items: targetItems,
-            persisted: true,
-        }), targetItems);
-        this._persistanceStore.save(params);
-    }
-}
-ExternalParamsController.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ExternalParamsController, deps: [{ token: FsFilterItemsStore }, { token: PersistanceParamsController }, { token: QueryParamsController }, { token: SavedFiltersController }], target: i0.ɵɵFactoryTarget.Injectable });
-ExternalParamsController.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ExternalParamsController });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ExternalParamsController, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: FsFilterItemsStore }, { type: PersistanceParamsController }, { type: QueryParamsController }, { type: SavedFiltersController }]; } });
-
-class FsFilterActionButtonComponent {
-    constructor() {
-        this.ActionType = ActionType;
-    }
-}
-FsFilterActionButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterActionButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-FsFilterActionButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FsFilterActionButtonComponent, selector: "fs-filter-action-button", inputs: { action: "action" }, host: { classAttribute: "action-button" }, ngImport: i0, template: "<ng-container [ngSwitch]=\"action.type\">\n  <button\n      type=\"button\"\n      *ngSwitchCase=\"ActionType.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    <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n  </button>\n\n  <!-- Fab button -->\n  <button \n      type=\"button\"\n      *ngSwitchCase=\"ActionType.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    <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n  </button>\n\n  <!-- Mini Fab button -->\n  <button \n      type=\"button\"\n      *ngSwitchCase=\"ActionType.MiniFab\"\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    <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n  </button>\n\n  <button \n      type=\"button\"\n      *ngSwitchDefault\n      mat-button\n      [ngClass]=\"{        \n        'mat-raised-button': action.type === ActionType.Raised,\n        'mat-flat-button': action.type === ActionType.Flat,\n        'mat-stroked-button': action.type === ActionType.Stroked,\n        'mat-button': action.type === ActionType.Basic,\n        'mat-icon-button': action.type === ActionType.Icon\n      }\"\n      (click)=\"action.click && action.click($event)\"\n      [color]=\"action.color\"\n      [class]=\"action.classArray.join(' ')\"\n      [disabled]=\"action.disabled$ | async\"\n      [tabIndex]=\"action.tabIndex\">\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", dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3$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"] }, { kind: "directive", type: i9.FsButtonDirective, selector: "[mat-raised-button]:not([fsFormButtonStandalone]),[mat-button]:not([fsFormButtonStandalone]),[mat-flat-button]:not([fsFormButtonStandalone]),[mat-stroked-button]:not([fsFormButtonStandalone])", inputs: ["name", "dirtySubmit", "form"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterActionButtonComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'fs-filter-action-button', host: { class: 'action-button' }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container [ngSwitch]=\"action.type\">\n  <button\n      type=\"button\"\n      *ngSwitchCase=\"ActionType.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    <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n  </button>\n\n  <!-- Fab button -->\n  <button \n      type=\"button\"\n      *ngSwitchCase=\"ActionType.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    <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n  </button>\n\n  <!-- Mini Fab button -->\n  <button \n      type=\"button\"\n      *ngSwitchCase=\"ActionType.MiniFab\"\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    <ng-template [ngTemplateOutlet]=\"buttonContent\"></ng-template>\n  </button>\n\n  <button \n      type=\"button\"\n      *ngSwitchDefault\n      mat-button\n      [ngClass]=\"{        \n        'mat-raised-button': action.type === ActionType.Raised,\n        'mat-flat-button': action.type === ActionType.Flat,\n        'mat-stroked-button': action.type === ActionType.Stroked,\n        'mat-button': action.type === ActionType.Basic,\n        'mat-icon-button': action.type === ActionType.Icon\n      }\"\n      (click)=\"action.click && action.click($event)\"\n      [color]=\"action.color\"\n      [class]=\"action.classArray.join(' ')\"\n      [disabled]=\"action.disabled$ | async\"\n      [tabIndex]=\"action.tabIndex\">\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" }]
-        }], propDecorators: { action: [{
-                type: Input
-            }] } });
-
-class FsFilterActionKebabActionsComponent {
-}
-FsFilterActionKebabActionsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterActionKebabActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-FsFilterActionKebabActionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FsFilterActionKebabActionsComponent, selector: "fs-filter-action-kebab-actions", inputs: { kebabActions: "kebabActions" }, ngImport: i0, template: "<button \n    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 \n                    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 \n                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 \n            fs-menu-file-item\n            [fsClass]=\"action.classArray\"\n            [multiple]=\"action.multiple\"\n            [accept]=\"action.accept || '*'\"\n            [minWidth]=\"action.minWidth\"\n            [minHeight]=\"action.minHeight\"\n            [imageWidth]=\"action.maxWidth\"\n            [imageHeight]=\"action.maxHeight\"\n            (error)=\"action.fileError($event)\"\n            (select)=\"action.fileSelected($event)\"\n            (click)=\"action.click($event)\">\n          <mat-icon *ngIf=\"action.icon\">{{action.icon}}</mat-icon> {{action.label}}\n        </ng-template>\n      </ng-container>\n\n      <ng-container *ngSwitchDefault>\n        <ng-template \n            fs-menu-item\n            (click)=\"action.click($event)\"\n            [fsClass]=\"action.classArray\">\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", styles: [".menu-button{width:36px;height:36px;line-height:36px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3$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"] }, { kind: "component", type: i6$1.FsMenuComponent, selector: "fs-menu", inputs: ["class", "buttonClass", "buttonType", "buttonColor"], outputs: ["opened", "closed"] }, { kind: "directive", type: i6$1.FsMenuItemDirective, selector: "fs-menu-group,[fs-menu-item]" }, { kind: "directive", type: i6$1.FsMenuTriggerDirective, selector: "[fsMenuTriggerFor]", inputs: ["fsMenuTriggerFor"] }, { kind: "directive", type: i6$1.FsMenuFileItemDirective, selector: "[fs-menu-file-item]", inputs: ["multiple", "accept", "minWidth", "minHeight", "imageWidth", "imageHeight"], outputs: ["select", "error"] }, { kind: "directive", type: i6$1.FsGroupMenuItemTemplateDirective, selector: "[fs-group-menu-item-template]" }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterActionKebabActionsComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'fs-filter-action-kebab-actions', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button \n    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 \n                    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 \n                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 \n            fs-menu-file-item\n            [fsClass]=\"action.classArray\"\n            [multiple]=\"action.multiple\"\n            [accept]=\"action.accept || '*'\"\n            [minWidth]=\"action.minWidth\"\n            [minHeight]=\"action.minHeight\"\n            [imageWidth]=\"action.maxWidth\"\n            [imageHeight]=\"action.maxHeight\"\n            (error)=\"action.fileError($event)\"\n            (select)=\"action.fileSelected($event)\"\n            (click)=\"action.click($event)\">\n          <mat-icon *ngIf=\"action.icon\">{{action.icon}}</mat-icon> {{action.label}}\n        </ng-template>\n      </ng-container>\n\n      <ng-container *ngSwitchDefault>\n        <ng-template \n            fs-menu-item\n            (click)=\"action.click($event)\"\n            [fsClass]=\"action.classArray\">\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", styles: [".menu-button{width:36px;height:36px;line-height:36px}\n"] }]
-        }], propDecorators: { kebabActions: [{
-                type: Input
-            }] } });
-
-class FsFilterActionsComponent {
-    constructor() {
-        this.kebabActions = [];
-        this.actions = [];
-        this.ActionType = ActionType;
-        this.ActionMode = ActionMode;
-    }
-    actionChange(action, value, selectButton) {
-        if (action.change) {
-            action.change(value);
-            if (action.deselect) {
-                selectButton.writeValue(null);
-            }
-        }
-    }
-}
-FsFilterActionsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-FsFilterActionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FsFilterActionsComponent, selector: "fs-filter-actions", inputs: { kebabActions: "kebabActions", actions: "actions" }, ngImport: i0, template: "<ng-container *ngFor=\"let action of actions\">\n  <ng-container [ngSwitch]=\"action.mode\">\n    <ng-container *ngSwitchCase=\"ActionMode.Button\">\n      <fs-filter-action-button\n        [action]=\"action\"\n        class=\"action\"\n        fsPopover\n        [enabled]=\"!!action.tooltip\"\n        [text]=\"action.tooltip\">\n      </fs-filter-action-button>\n    </ng-container>\n\n    <ng-container *ngSwitchCase=\"ActionMode.Menu\">\n      <fs-filter-action-button\n        class=\"action\"\n        [action]=\"action\"\n        [fsMenuTriggerFor]=\"someRef\"\n        fsPopover\n        [enabled]=\"!!action.tooltip\"\n        [text]=\"action.tooltip\">\n      </fs-filter-action-button>\n\n      <fs-menu #someRef class=\"action\">\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\n                    fs-menu-item\n                    [link]=\"subAction.routerLink?.link\"\n                    [queryParams]=\"subAction.routerLink?.queryParams\"\n                    [hidden]=\"(subAction.visible$ | async) === false\"\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\n                fs-menu-item\n                [link]=\"childAction.routerLink?.link\"\n                [queryParams]=\"childAction.routerLink?.queryParams\"\n                [hidden]=\"(childAction.visible$ | async) === false\"\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=\"ActionMode.SelectButton\">\n      <mat-select \n          class=\"action\"\n          [ngClass]=\"{ \n            'mat-stroked-button': action.type === ActionType.Stroked,\n            'mat-raised-button': action.type === ActionType.Raised,\n            'mat-flat-button': action.type === ActionType.Flat,\n            'mat-basic-button': action.type === ActionType.Basic\n          }\"\n          [placeholder]=\"action.label\"\n          [(ngModel)]=\"action.value\" \n          (ngModelChange)=\"actionChange(action, $event, selectButton)\"\n          fsSelectButton\n          #selectButton\n          [deselectOnChange]=\"false\">\n        <mat-option \n            *ngFor=\"let item of action.values\" \n            [value]=\"item.value\">\n          {{ item.name }}\n        </mat-option>\n      </mat-select>\n    </ng-container>\n\n    <ng-container *ngSwitchCase=\"ActionMode.File\">\n      <fs-file\n          class=\"action 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          fsPopover\n          [enabled]=\"!!action.tooltip\"\n          [text]=\"action.tooltip\">\n        <fs-filter-action-button \n          [action]=\"action\">\n        </fs-filter-action-button>\n      </fs-file>\n    </ng-container>\n  </ng-container>\n</ng-container>\n<ng-container *ngIf=\"kebabActions?.length\">\n  <fs-filter-action-kebab-actions\n    [kebabActions]=\"kebabActions\">\n  </fs-filter-action-kebab-actions>\n</ng-container>\n", styles: [":host{display:inline-flex}.action-button{display:block}.action+.action{margin-left:5px}.menu-button{width:36px;height:36px;line-height:36px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4$1.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i6$1.FsMenuComponent, selector: "fs-menu", inputs: ["class", "buttonClass", "buttonType", "buttonColor"], outputs: ["opened", "closed"] }, { kind: "directive", type: i6$1.FsMenuItemDirective, selector: "fs-menu-group,[fs-menu-item]" }, { kind: "directive", type: i6$1.FsMenuTriggerDirective, selector: "[fsMenuTriggerFor]", inputs: ["fsMenuTriggerFor"] }, { kind: "directive", type: i9.FsFormNoFsValidatorsDirective, selector: "[ngModel]:not([required]):not([fsFormRequired]):not([fsFormCompare]):not([fsFormDateRange]):not([fsFormEmail]):not([fsFormEmails]):not([fsFormFunction]):not([fsFormGreater]):not([fsFormGreaterEqual]):not([fsFormInteger]):not([fsFormLesser]):not([fsFormMax]):not([fsFormMaxLength]):not([fsFormMin]):not([fsFormMinLength]):not([fsFormNumeric]):not([fsFormPattern]):not([fsFormPhone]):not([fsFormUrl]):not([validate])" }, { kind: "component", type: i8.FsFileComponent, selector: "fs-file", inputs: ["minHeight", "minWidth", "orientate", "multiple", "capture", "allowClick", "allowDrop", "accept", "disabled", "imageWidth", "imageHeight", "imageQuality"], outputs: ["select", "error", "beforeProcessing", "clicked", "declined"] }, { kind: "directive", type: i9$1.FsSelectButtonDirective, selector: "[fsSelectButton]", inputs: ["color", "width", "buttonType", "deselectOnChange"] }, { kind: "directive", type: i10.FsPopoverDirective, selector: "[fsPopover]", inputs: ["text", "template", "data", "leaveDelay", "showDelay", "maxWidth", "wrapperClass", "autoShow", "autoClose", "loadingDiameter", "loading", "indication", "position", "theme", "size", "trigger", "enabled"] }, { kind: "component", type: FsFilterActionButtonComponent, selector: "fs-filter-action-button", inputs: ["action"] }, { kind: "component", type: FsFilterActionKebabActionsComponent, selector: "fs-filter-action-kebab-actions", inputs: ["kebabActions"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterActionsComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'fs-filter-actions', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngFor=\"let action of actions\">\n  <ng-container [ngSwitch]=\"action.mode\">\n    <ng-container *ngSwitchCase=\"ActionMode.Button\">\n      <fs-filter-action-button\n        [action]=\"action\"\n        class=\"action\"\n        fsPopover\n        [enabled]=\"!!action.tooltip\"\n        [text]=\"action.tooltip\">\n      </fs-filter-action-button>\n    </ng-container>\n\n    <ng-container *ngSwitchCase=\"ActionMode.Menu\">\n      <fs-filter-action-button\n        class=\"action\"\n        [action]=\"action\"\n        [fsMenuTriggerFor]=\"someRef\"\n        fsPopover\n        [enabled]=\"!!action.tooltip\"\n        [text]=\"action.tooltip\">\n      </fs-filter-action-button>\n\n      <fs-menu #someRef class=\"action\">\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\n                    fs-menu-item\n                    [link]=\"subAction.routerLink?.link\"\n                    [queryParams]=\"subAction.routerLink?.queryParams\"\n                    [hidden]=\"(subAction.visible$ | async) === false\"\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\n                fs-menu-item\n                [link]=\"childAction.routerLink?.link\"\n                [queryParams]=\"childAction.routerLink?.queryParams\"\n                [hidden]=\"(childAction.visible$ | async) === false\"\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=\"ActionMode.SelectButton\">\n      <mat-select \n          class=\"action\"\n          [ngClass]=\"{ \n            'mat-stroked-button': action.type === ActionType.Stroked,\n            'mat-raised-button': action.type === ActionType.Raised,\n            'mat-flat-button': action.type === ActionType.Flat,\n            'mat-basic-button': action.type === ActionType.Basic\n          }\"\n          [placeholder]=\"action.label\"\n          [(ngModel)]=\"action.value\" \n          (ngModelChange)=\"actionChange(action, $event, selectButton)\"\n          fsSelectButton\n          #selectButton\n          [deselectOnChange]=\"false\">\n        <mat-option \n            *ngFor=\"let item of action.values\" \n            [value]=\"item.value\">\n          {{ item.name }}\n        </mat-option>\n      </mat-select>\n    </ng-container>\n\n    <ng-container *ngSwitchCase=\"ActionMode.File\">\n      <fs-file\n          class=\"action 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          fsPopover\n          [enabled]=\"!!action.tooltip\"\n          [text]=\"action.tooltip\">\n        <fs-filter-action-button \n          [action]=\"action\">\n        </fs-filter-action-button>\n      </fs-file>\n    </ng-container>\n  </ng-container>\n</ng-container>\n<ng-container *ngIf=\"kebabActions?.length\">\n  <fs-filter-action-kebab-actions\n    [kebabActions]=\"kebabActions\">\n  </fs-filter-action-kebab-actions>\n</ng-container>\n", styles: [":host{display:inline-flex}.action-button{display:block}.action+.action{margin-left:5px}.menu-button{width:36px;height:36px;line-height:36px}\n"] }]
-        }], propDecorators: { kebabActions: [{
-                type: Input
-            }], actions: [{
-                type: Input
-            }] } });
-
-class FsFilterChipContentComponent {
-    constructor(_cdRef) {
-        this._cdRef = _cdRef;
-        this._destroy$ = new Subject();
-    }
-    ngOnInit() {
-        this.listenValueChangesForRanges();
-    }
-    ngOnDestroy() {
-        this._destroy$.next();
-        this._destroy$.complete();
-    }
-    listenValueChangesForRanges() {
-        this.item.value$
-            .pipe(takeUntil(this._destroy$))
-            .subscribe(() => {
-            this.content = this._getContent();
-            this._cdRef.detectChanges();
-        });
-    }
-    _getContent() {
-        const result = this.item.getChipsContent(this.type);
-        if (this.item.chipLabel !== undefined) {
-            if (this.item.chipLabel === '') {
-                return `${result}`;
-            }
-            else {
-                if (Array.isArray(this.item.chipLabel)) {
-                    const label = getLabelFromArray(this.item.chipLabel, this.type);
-                    return `${label}: ${result}`;
-                }
-                else {
-                    return `${this.item.chipLabel}: ${result}`;
-                }
-            }
-        }
-        else {
-            if (Array.isArray(this.item.label)) {
-                const label = getLabelFromArray(this.item.label, this.type);
-                return `${label}: ${result}`;
-            }
-            else {
-                if (this.item.isTypeCheckbox) {
-                    return result;
-                }
-                else {
-                    return `${this.item.label}: ${result}`;
-                }
-            }
-        }
-    }
-}
-FsFilterChipContentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterChipContentComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-FsFilterChipContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FsFilterChipContentComponent, selector: "fs-filter-chip-content", inputs: { item: "item", type: "type" }, ngImport: i0, template: "{{ content }}\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterChipContentComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'fs-filter-chip-content', changeDetection: ChangeDetectionStrategy.OnPush, template: "{{ content }}\n" }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { item: [{
-                type: Input
-            }], type: [{
-                type: Input
-            }] } });
-function getLabelFromArray(labelArr, type) {
-    if (type === 'from' && labelArr[0]) {
-        return `${labelArr[0]}`;
-    }
-    else if (type === 'to' && labelArr[1]) {
-        return `${labelArr[1]}`;
-    }
-    else {
-        return '';
-    }
-}
-
-class FocusControllerService {
-    constructor() {
-        this._focusOn = new BehaviorSubject(null);
-    }
-    get focusOn$() {
-        return this._focusOn.asObservable();
-    }
-    click(item, type = null) {
-        this._focusOn.next({ item, type });
-    }
-    listenFocusFor$(targetItem, targetType = null) {
-        return this._focusOn
-            .pipe(filter$1((event) => !!event), filter$1(({ item, type }) => {
-            return targetItem === item && targetType === type;
-        }), tap(() => this.clearFocus()));
-    }
-    clearFocus() {
-        this._focusOn.next(null);
-    }
-}
-FocusControllerService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FocusControllerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-FocusControllerService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FocusControllerService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FocusControllerService, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return []; } });
-
-class FsFilterChipComponent {
-    constructor(_cdRef, _focusController) {
-        this._cdRef = _cdRef;
-        this._focusController = _focusController;
-        this._chipRenderTimer$ = timer(500)
-            .pipe(mapTo(true));
-        this._destroy$ = new Subject();
-    }
-    ngOnInit() {
-        this.rangeItem = this.item.isTypeDateRange
-            || this.item.isTypeRange
-            || this.item.isTypeDateTimeRange;
-        this.listenValueChangesForRanges();
-        this._updateVisibility();
-        if (this.item.hasPendingValues) {
-            this.item.loadAsyncValues(false);
-            this.item.values$
-                .pipe(take(2), takeUntil(this._destroy$))
-                .subscribe(() => {
-                this._updateVisibility();
-                this._cdRef.markForCheck();
-            });
-            this._initDelayRender();
-        }
-    }
-    ngOnDestroy() {
-        this._destroy$.next();
-        this._destroy$.complete();
-    }
-    focusOnItem(type = null) {
-        this._focusController.click(this.item, type);
-    }
-    removeItem(event, type = null) {
-        if (this.item instanceof RangeItem) {
-            this.item.clearRange(type);
-        }
-        else if (this.item instanceof DateRangeItem || this.item instanceof DateTimeRangeItem) {
-            this.item.clearDateRange(type);
-        }
-        else {
-            this.item.clear();
-        }
-    }
-    listenValueChangesForRanges() {
-        this.item.value$
-            .pipe(distinctUntilChanged(), takeUntil(this._destroy$))
-            .subscribe(() => {
-            this._updateVisibility();
-            this._cdRef.markForCheck();
-        });
-    }
-    _updateVisibility() {
-        this.itemVisible = this.item.isChipVisible;
-    }
-    _initDelayRender() {
-        this.chipDelayedRender$ = combineLatest([
-            this.item.values$,
-            this._chipRenderTimer$.pipe(startWith(false)),
-        ])
-            .pipe(map(([values, timerValue]) => {
-            return !!values || timerValue;
-        }));
-    }
-}
-FsFilterChipComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterChipComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: FocusControllerService }], target: i0.ɵɵFactoryTarget.Component });
-FsFilterChipComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FsFilterChipComponent, selector: "fs-filter-chip", inputs: { item: "item" }, ngImport: i0, template: "<ng-container *ngIf=\"!item.hasPendingValues || (chipDelayedRender$ | async)\">\n  <ng-container *ngIf=\"rangeItem; else defaultChip\">\n    <fs-chip\n      *ngIf=\"item.model?.min || item.model?.from\"\n      [value]=\"item\"\n      [selectable]=\"false\"\n      [removable]=\"item.showClear\"\n      size=\"small\"\n      (click)=\"focusOnItem('from')\"\n      (removed)=\"removeItem($event, 'from')\">\n      <ng-template\n        [ngTemplateOutlet]=\"chipContent\"\n        [ngTemplateOutletContext]=\"{ item: item, type: 'from' }\">\n      </ng-template>\n    </fs-chip>\n\n    <fs-chip\n      *ngIf=\"item.model?.max || item.model?.to\"\n      [value]=\"item\"\n      [selectable]=\"false\"\n      [removable]=\"item.showClear\"\n      size=\"small\"\n      (click)=\"focusOnItem('to')\"\n      (removed)=\"removeItem($event, 'to')\">\n      <ng-template\n        [ngTemplateOutlet]=\"chipContent\"\n        [ngTemplateOutletContext]=\"{ item: item, type: 'to' }\">\n      </ng-template>\n    </fs-chip>\n\n  </ng-container>\n\n  <ng-template #defaultChip>\n    <fs-chip\n      *ngIf=\"itemVisible\"\n      [value]=\"item\"\n      [selectable]=\"false\"\n      [removable]=\"item.showClear\"\n      size=\"small\"\n      (click)=\"focusOnItem()\"\n      (removed)=\"removeItem($event)\">\n      <ng-template\n        [ngTemplateOutlet]=\"chipContent\"\n        [ngTemplateOutletContext]=\"{ item: item }\">\n      </ng-template>\n    </fs-chip>\n  </ng-template>\n\n  <ng-template #chipContent let-item=\"item\" let-type=\"type\">\n    <ng-container *ngIf=\"!item.hasPendingValues && !item.loading; else lodaingValues\">\n      <fs-filter-chip-content [item]=\"item\" [type]=\"type\"></fs-filter-chip-content>\n    </ng-container>\n\n    <ng-template #lodaingValues>\n      Loading...\n    </ng-template>\n  </ng-template>\n</ng-container>\n\n", styles: ["fs-chip{cursor:pointer;color:#6f6f6f;margin-right:4px;margin-bottom:4px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3$2.FsChipComponent, selector: "fs-chip", inputs: ["selectable", "removable", "value", "icon", "image", "selected", "size", "backgroundColor", "borderColor", "color", "outlined"], outputs: ["selectedToggled", "removed"] }, { kind: "component", type: FsFilterChipContentComponent, selector: "fs-filter-chip-content", inputs: ["item", "type"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterChipComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'fs-filter-chip', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"!item.hasPendingValues || (chipDelayedRender$ | async)\">\n  <ng-container *ngIf=\"rangeItem; else defaultChip\">\n    <fs-chip\n      *ngIf=\"item.model?.min || item.model?.from\"\n      [value]=\"item\"\n      [selectable]=\"false\"\n      [removable]=\"item.showClear\"\n      size=\"small\"\n      (click)=\"focusOnItem('from')\"\n      (removed)=\"removeItem($event, 'from')\">\n      <ng-template\n        [ngTemplateOutlet]=\"chipContent\"\n        [ngTemplateOutletContext]=\"{ item: item, type: 'from' }\">\n      </ng-template>\n    </fs-chip>\n\n    <fs-chip\n      *ngIf=\"item.model?.max || item.model?.to\"\n      [value]=\"item\"\n      [selectable]=\"false\"\n      [removable]=\"item.showClear\"\n      size=\"small\"\n      (click)=\"focusOnItem('to')\"\n      (removed)=\"removeItem($event, 'to')\">\n      <ng-template\n        [ngTemplateOutlet]=\"chipContent\"\n        [ngTemplateOutletContext]=\"{ item: item, type: 'to' }\">\n      </ng-template>\n    </fs-chip>\n\n  </ng-container>\n\n  <ng-template #defaultChip>\n    <fs-chip\n      *ngIf=\"itemVisible\"\n      [value]=\"item\"\n      [selectable]=\"false\"\n      [removable]=\"item.showClear\"\n      size=\"small\"\n      (click)=\"focusOnItem()\"\n      (removed)=\"removeItem($event)\">\n      <ng-template\n        [ngTemplateOutlet]=\"chipContent\"\n        [ngTemplateOutletContext]=\"{ item: item }\">\n      </ng-template>\n    </fs-chip>\n  </ng-template>\n\n  <ng-template #chipContent let-item=\"item\" let-type=\"type\">\n    <ng-container *ngIf=\"!item.hasPendingValues && !item.loading; else lodaingValues\">\n      <fs-filter-chip-content [item]=\"item\" [type]=\"type\"></fs-filter-chip-content>\n    </ng-container>\n\n    <ng-template #lodaingValues>\n      Loading...\n    </ng-template>\n  </ng-template>\n</ng-container>\n\n", styles: ["fs-chip{cursor:pointer;color:#6f6f6f;margin-right:4px;margin-bottom:4px}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: FocusControllerService }]; }, propDecorators: { item: [{
-                type: Input
-            }] } });
-
-class FsFilterChipsComponent {
-    constructor() {
-        this.ItemType = ItemType;
-    }
-}
-FsFilterChipsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterChipsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-FsFilterChipsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FsFilterChipsComponent, selector: "fs-filter-chips", inputs: { filters: "filters" }, ngImport: i0, template: "<ng-container *ngFor=\"let item of filters\">\n  <ng-container *ngIf=\"(item.value$ | async) !== undefined && item.type !== ItemType.Keyword\">\n    <fs-filter-chip [item]=\"item\"></fs-filter-chip>\n  </ng-container>\n</ng-container>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FsFilterChipComponent, selector: "fs-filter-chip", inputs: ["item"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterChipsComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'fs-filter-chips', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngFor=\"let item of filters\">\n  <ng-container *ngIf=\"(item.value$ | async) !== undefined && item.type !== ItemType.Keyword\">\n    <fs-filter-chip [item]=\"item\"></fs-filter-chip>\n  </ng-container>\n</ng-container>\n" }]
-        }], propDecorators: { filters: [{
-                type: Input
-            }] } });
-
-class FsFilterDrawerActionsComponent {
-    constructor() {
-        this._clear = new EventEmitter();
-        this._done = new EventEmitter();
-    }
-    done() {
-        this._done.emit();
-    }
-    clear() {
-        this._clear.emit();
-    }
-}
-FsFilterDrawerActionsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterDrawerActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-FsFilterDrawerActionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FsFilterDrawerActionsComponent, selector: "fs-filter-drawer-actions", outputs: { _clear: "clear", _done: "done" }, ngImport: i0, template: "<a mat-button color=\"primary\" (click)=\"done()\">Done</a>\n<a mat-button (click)=\"clear()\">Clear</a>\n\n\n", styles: ["@charset \"UTF-8\";@media (max-width: 599px){h1[class*=\".top\"][fs\\.lt-xs*=fs-heading][fs\\.lt-xs*=\".top-none\"],h2[class*=\".top\"][fs\\.lt-xs*=fs-heading][fs\\.lt-xs*=\".top-none\"],h3[class*=\".top\"][fs\\.lt-xs*=fs-heading][fs\\.lt-xs*=\".top-none\"]{margin-top:0}}@media (max-width: 1023px){h1[class*=\".top\"][fs\\.lt-sm*=fs-heading][fs\\.lt-sm*=\".top-none\"],h2[class*=\".top\"][fs\\.lt-sm*=fs-heading][fs\\.lt-sm*=\".top-none\"],h3[class*=\".top\"][fs\\.lt-sm*=fs-heading][fs\\.lt-sm*=\".top-none\"]{margin-top:0}}@media (max-width: 1439px){h1[class*=\".top\"][fs\\.lt-md*=fs-heading][fs\\.lt-md*=\".top-none\"],h2[class*=\".top\"][fs\\.lt-md*=fs-heading][fs\\.lt-md*=\".top-none\"],h3[class*=\".top\"][fs\\.lt-md*=fs-heading][fs\\.lt-md*=\".top-none\"]{margin-top:0}}.fs-delimit>*:not(:last-child):after{content:\",\\a0\"}@media (max-width: 599px){a{width:100%}}\n"], dependencies: [{ kind: "component", type: i3$1.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"] }, { kind: "directive", type: i9.FsButtonDirective, selector: "[mat-raised-button]:not([fsFormButtonStandalone]),[mat-button]:not([fsFormButtonStandalone]),[mat-flat-button]:not([fsFormButtonStandalone]),[mat-stroked-button]:not([fsFormButtonStandalone])", inputs: ["name", "dirtySubmit", "form"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterDrawerActionsComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'fs-filter-drawer-actions', changeDetection: ChangeDetectionStrategy.OnPush, template: "<a mat-button color=\"primary\" (click)=\"done()\">Done</a>\n<a mat-button (click)=\"clear()\">Clear</a>\n\n\n", styles: ["@charset \"UTF-8\";@media (max-width: 599px){h1[class*=\".top\"][fs\\.lt-xs*=fs-heading][fs\\.lt-xs*=\".top-none\"],h2[class*=\".top\"][fs\\.lt-xs*=fs-heading][fs\\.lt-xs*=\".top-none\"],h3[class*=\".top\"][fs\\.lt-xs*=fs-heading][fs\\.lt-xs*=\".top-none\"]{margin-top:0}}@media (max-width: 1023px){h1[class*=\".top\"][fs\\.lt-sm*=fs-heading][fs\\.lt-sm*=\".top-none\"],h2[class*=\".top\"][fs\\.lt-sm*=fs-heading][fs\\.lt-sm*=\".top-none\"],h3[class*=\".top\"][fs\\.lt-sm*=fs-heading][fs\\.lt-sm*=\".top-none\"]{margin-top:0}}@media (max-width: 1439px){h1[class*=\".top\"][fs\\.lt-md*=fs-heading][fs\\.lt-md*=\".top-none\"],h2[class*=\".top\"][fs\\.lt-md*=fs-heading][fs\\.lt-md*=\".top-none\"],h3[class*=\".top\"][fs\\.lt-md*=fs-heading][fs\\.lt-md*=\".top-none\"]{margin-top:0}}.fs-delimit>*:not(:last-child):after{content:\",\\a0\"}@media (max-width: 599px){a{width:100%}}\n"] }]
-        }], propDecorators: { _clear: [{
-                type: Output,
-                args: ['clear']
-            }], _done: [{
-                type: Output,
-                args: ['done']
-            }] } });
-
-const FILTER_DRAWER_DATA = new InjectionToken('fs.filter-drawer-data');
-
-const FILTER_DRAWER_OVERLAY = new InjectionToken('fs.filter-drawer-overlay');
-
-class BaseItemComponent {
-    constructor(_kvDiffers, _cd) {
-        this._kvDiffers = _kvDiffers;
-        this._cd = _cd;
-        this.inline = false;
-        this._destroy$ = new Subject();
-        this._debouncer$ = new Subject();
-        this._kvDiffer = this._kvDiffers.find(this.item || {}).create();
-        this.listenWithDebounce();
-    }
-    set item(value) {
-        this._item = value;
-    }
-    get item() {
-        return this._item;
-    }
-    ngDoCheck() {
-        if (this._kvDiffer) {
-            const changes = this._kvDiffer.diff(this.item);
-            if (changes) {
-                this._cd.detectChanges();
-            }
-        }
-    }
-    ngOnChanges(changes) {
-        if (changes.item) {
-            this.label = Array.isArray(this.item.label) ? this.item.label[0] : this.item.label;
-        }
-    }
-    ngOnDestroy() {
-        this._destroy$.next();
-        this._destroy$.complete();
-    }
-    listenWithDebounce() {
-        this._debouncer$
-            .pipe(debounceTime(150), takeUntil(this._destroy$))
-            .subscribe(() => {
-            this.item.valueChanged();
-        });
-    }
-    itemChange() {
-        this._debouncer$.next();
-    }
-}
-BaseItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: BaseItemComponent, deps: [{ token: i0.KeyValueDiffers }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-BaseItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: BaseItemComponent, selector: "base-item", inputs: { item: "item", inline: "inline" }, usesOnChanges: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: BaseItemComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'base-item',
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: function () { return [{ type: i0.KeyValueDiffers }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { item: [{
-                type: Input
-            }], inline: [{
-                type: Input
-            }] } });
-
-class FocusToItemDirective {
-    constructor(_el, _focusController, _targetSelect, _targetDate, _targetDateScroll, _targetDateRangeFrom, _targetDateRangeTo, _targetAutocomplete, _targetAutocompleteChips) {
-        this._el = _el;
-        this._focusController = _focusController;
-        this._targetSelect = _targetSelect;
-        this._targetDate = _targetDate;
-        this._targetDateScroll = _targetDateScroll;
-        this._targetDateRangeFrom = _targetDateRangeFrom;
-        this._targetDateRangeTo = _targetDateRangeTo;
-        this._targetAutocomplete = _targetAutocomplete;
-        this._targetAutocompleteChips = _targetAutocompleteChips;
-        this._destroy$ = new Subject();
-    }
-    ngOnInit() {
-        this._focusController
-            .listenFocusFor$(this._item, this._focusTargetType)
-            .pipe(delay(500), takeUntil(this._destroy$))
-            .subscribe(() => {
-            this._focus();
-        });
-    }
-    ngOnDestroy() {
-        this._destroy$.next();
-        this._destroy$.complete();
-    }
-    _focus() {
-        switch (this._item.type) {
-            case ItemType.Select:
-                {
-                    this._targetSelect.open();
-                }
-                break;
-            case ItemType.Text:
-            case ItemType.Range:
-                {
-                    this._el.nativeElement.focus();
-                }
-                break;
-            case ItemType.Date:
-                {
-                    if (this._item.mode === ItemDateMode.Calendar) {
-                        this._targetDate.open();
-                    }
-                    else {
-                        this._targetDateScroll.open();
-                    }
-                }
-                break;
-            case ItemType.DateRange:
-                {
-                    if (this._focusTargetType === 'from') {
-                        this._targetDateRangeFrom.open();
-                    }
-                    else {
-                        this._targetDateRangeTo.open();
-                    }
-                }
-                break;
-            case ItemType.AutoComplete:
-                {
-                    this._targetAutocomplete.focus();
-                }
-                break;
-            case ItemType.AutoCompleteChips:
-                {
-                    this._targetAutocompleteChips.focus();
-                }
-                break;
-        }
-    }
-}
-FocusToItemDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FocusToItemDirective, deps: [{ token: i0.ElementRef }, { token: FocusControllerService }, { token: i4$1.MatSelect, optional: true, self: true }, { token: i3$3.FsDatePickerComponent, optional: true, self: true }, { token: i3$3.FsDateScrollPickerComponent, optional: true, self: true }, { token: i3$3.DateRangePickerFromComponent, optional: true, self: true }, { token: i3$3.DateRangePickerToComponent, optional: true, self: true }, { token: i4$2.FsAutocompleteComponent, optional: true, self: true }, { token: i5$1.FsAutocompleteChipsComponent, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Directive });
-FocusToItemDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FocusToItemDirective, selector: "[fsFilterFocusTrigger]", inputs: { _item: ["fsFilterFocusTrigger", "_item"], _focusTargetType: ["focusTargetType", "_focusTargetType"] }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FocusToItemDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[fsFilterFocusTrigger]',
-                }]
-        }], ctorParameters: function () {
-        return [{ type: i0.ElementRef }, { type: FocusControllerService }, { type: i4$1.MatSelect, decorators: [{
-                        type: Optional
-                    }, {
-                        type: Self
-                    }] }, { type: i3$3.FsDatePickerComponent, decorators: [{
-                        type: Optional
-                    }, {
-                        type: Self
-                    }] }, { type: i3$3.FsDateScrollPickerComponent, decorators: [{
-                        type: Optional
-                    }, {
-                        type: Self
-                    }] }, { type: i3$3.DateRangePickerFromComponent, decorators: [{
-                        type: Optional
-                    }, {
-                        type: Self
-                    }] }, { type: i3$3.DateRangePickerToComponent, decorators: [{
-                        type: Optional
-                    }, {
-                        type: Self
-                    }] }, { type: i4$2.FsAutocompleteComponent, decorators: [{
-                        type: Optional
-                    }, {
-                        type: Self
-                    }] }, { type: i5$1.FsAutocompleteChipsComponent, decorators: [{
-                        type: Optional
-                    }, {
-                        type: Self
-                    }] }];
-    }, propDecorators: { _item: [{
-                type: Input,
-                args: ['fsFilterFocusTrigger']
-            }], _focusTargetType: [{
-                type: Input,
-                args: ['focusTargetType']
-            }] } });
-
-class SelectGroupsComponent {
-    constructor(cd) {
-        this.cd = cd;
-    }
-    compare(o1, o2) {
-        return o1 == o2;
-    }
-}
-SelectGroupsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectGroupsComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-SelectGroupsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SelectGroupsComponent, selector: "filter-item-select-groups", inputs: { item: "item" }, viewQueries: [{ propertyName: "select", first: true, predicate: ["select"], descendants: true, static: true }], ngImport: i0, template: "<mat-form-field>\n  <mat-label>{{item.label}}</mat-label>\n  <mat-select\n    #select\n    [fsFilterFocusTrigger]=\"item\"\n    [(ngModel)]=\"item.model\"\n    [compareWith]=\"compare\">\n    <ng-container *ngFor=\"let selectItem of item.values\">\n      <ng-container *ngIf=\"selectItem[item.children]; else simpleOption\">\n        <mat-optgroup [label]=\"selectItem.name\">\n          <mat-option *ngFor=\"let subItem of selectItem[item.children]\"\n                      [value]=\"subItem.value\"\n                      [ngStyle]=\"selectItem.style\">\n            {{ subItem.name }}\n          </mat-option>\n        </mat-optgroup>\n      </ng-container>\n\n      <ng-template #simpleOption>\n        <mat-option\n        [value]=\"selectItem.value\"\n        [ngStyle]=\"selectItem.style\">\n          {{ selectItem.name }}\n        </mat-option>\n      </ng-template>\n    </ng-container>\n  </mat-select>\n</mat-form-field>\n", dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "component", type: i4$1.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i5.MatOptgroup, selector: "mat-optgroup", inputs: ["disabled"], exportAs: ["matOptgroup"] }, { kind: "directive", type: i9.FsFormNoFsValidatorsDirective, selector: "[ngModel]:not([required]):not([fsFormRequired]):not([fsFormCompare]):not([fsFormDateRange]):not([fsFormEmail]):not([fsFormEmails]):not([fsFormFunction]):not([fsFormGreater]):not([fsFormGreaterEqual]):not([fsFormInteger]):not([fsFormLesser]):not([fsFormMax]):not([fsFormMaxLength]):not([fsFormMin]):not([fsFormMinLength]):not([fsFormNumeric]):not([fsFormPattern]):not([fsFormPhone]):not([fsFormUrl]):not([validate])" }, { kind: "directive", type: FocusToItemDirective, selector: "[fsFilterFocusTrigger]", inputs: ["fsFilterFocusTrigger", "focusTargetType"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectGroupsComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'filter-item-select-groups', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-form-field>\n  <mat-label>{{item.label}}</mat-label>\n  <mat-select\n    #select\n    [fsFilterFocusTrigger]=\"item\"\n    [(ngModel)]=\"item.model\"\n    [compareWith]=\"compare\">\n    <ng-container *ngFor=\"let selectItem of item.values\">\n      <ng-container *ngIf=\"selectItem[item.children]; else simpleOption\">\n        <mat-optgroup [label]=\"selectItem.name\">\n          <mat-option *ngFor=\"let subItem of selectItem[item.children]\"\n                      [value]=\"subItem.value\"\n                      [ngStyle]=\"selectItem.style\">\n            {{ subItem.name }}\n          </mat-option>\n        </mat-optgroup>\n      </ng-container>\n\n      <ng-template #simpleOption>\n        <mat-option\n        [value]=\"selectItem.value\"\n        [ngStyle]=\"selectItem.style\">\n          {{ selectItem.name }}\n        </mat-option>\n      </ng-template>\n    </ng-container>\n  </mat-select>\n</mat-form-field>\n" }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { select: [{
-                type: ViewChild,
-                args: ['select', { static: true }]
-            }], item: [{
-                type: Input
-            }] } });
-
-class FsFilterIsolateValues {
-    transform(values, isolate) {
-        if (!isolate) {
-            return values;
-        }
-        return values.filter((value) => {
-            return value.value !== isolate.value;
-        });
-    }
-}
-FsFilterIsolateValues.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterIsolateValues, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
-FsFilterIsolateValues.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: FsFilterIsolateValues, name: "fsFilterIsolateValues" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterIsolateValues, decorators: [{
-            type: Pipe,
-            args: [{
-                    name: 'fsFilterIsolateValues',
-                }]
-        }] });
-
-class SelectSimpleComponent {
-    constructor(cd) {
-        this.cd = cd;
-    }
-    changed() {
-        if (this.item.isolate) {
-            this.item.isolate.enabled = false;
-        }
-    }
-    isolateChange(filter) {
-        if (filter.isolate.enabled) {
-            filter.model = filter.isolate.value;
-        }
-        else {
-            filter.model = null;
-        }
-    }
-}
-SelectSimpleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectSimpleComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-SelectSimpleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SelectSimpleComponent, selector: "filter-item-select-simple", inputs: { item: "item" }, viewQueries: [{ propertyName: "select", first: true, predicate: ["select"], descendants: true, static: true }], ngImport: i0, template: "<mat-form-field [ngClass]=\"{ isolate: item.isolate }\">\n  <mat-label>{{item.label}}</mat-label>\n  <mat-select\n    #select\n    [fsFilterFocusTrigger]=\"item\"\n    [(ngModel)]=\"item.model\"\n    (ngModelChange)=\"changed()\">\n    <mat-option *ngFor=\"let item of item.values | fsFilterIsolateValues: item.isolate\"\n                [value]=\"item.value\"\n    >\n      {{ item.name }}\n    </mat-option>\n  </mat-select>\n\n  <mat-hint>\n    <div *ngIf=\"item.isolate\">\n      <mat-checkbox (change)=\"isolateChange(item)\" [(ngModel)]=\"item.isolate.enabled\">\n        <span class=\"checkbox-label\">{{ item.isolate.label }}</span>\n      </mat-checkbox>\n    </div>\n  </mat-hint>\n</mat-form-field>\n", styles: [".isolate{margin-bottom:25px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "component", type: i4$1.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i6$2.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i9.FsFormNoFsValidatorsDirective, selector: "[ngModel]:not([required]):not([fsFormRequired]):not([fsFormCompare]):not([fsFormDateRange]):not([fsFormEmail]):not([fsFormEmails]):not([fsFormFunction]):not([fsFormGreater]):not([fsFormGreaterEqual]):not([fsFormInteger]):not([fsFormLesser]):not([fsFormMax]):not([fsFormMaxLength]):not([fsFormMin]):not([fsFormMinLength]):not([fsFormNumeric]):not([fsFormPattern]):not([fsFormPhone]):not([fsFormUrl]):not([validate])" }, { kind: "directive", type: FocusToItemDirective, selector: "[fsFilterFocusTrigger]", inputs: ["fsFilterFocusTrigger", "focusTargetType"] }, { kind: "pipe", type: FsFilterIsolateValues, name: "fsFilterIsolateValues" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectSimpleComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'filter-item-select-simple', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-form-field [ngClass]=\"{ isolate: item.isolate }\">\n  <mat-label>{{item.label}}</mat-label>\n  <mat-select\n    #select\n    [fsFilterFocusTrigger]=\"item\"\n    [(ngModel)]=\"item.model\"\n    (ngModelChange)=\"changed()\">\n    <mat-option *ngFor=\"let item of item.values | fsFilterIsolateValues: item.isolate\"\n                [value]=\"item.value\"\n    >\n      {{ item.name }}\n    </mat-option>\n  </mat-select>\n\n  <mat-hint>\n    <div *ngIf=\"item.isolate\">\n      <mat-checkbox (change)=\"isolateChange(item)\" [(ngModel)]=\"item.isolate.enabled\">\n        <span class=\"checkbox-label\">{{ item.isolate.label }}</span>\n      </mat-checkbox>\n    </div>\n  </mat-hint>\n</mat-form-field>\n", styles: [".isolate{margin-bottom:25px}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { item: [{
-                type: Input
-            }], select: [{
-                type: ViewChild,
-                args: ['select', { static: true }]
-            }] } });
-
-class SelectMultipleComponent {
-    constructor(cd) {
-        this.cd = cd;
-    }
-    changed() {
-        if (this.item.isolate) {
-            this.item.isolate.enabled = false;
-            if (this.item.multiple && Array.isArray(this.item.model)) {
-                const index = this.item.model.indexOf(this.item.isolate.value);
-                if (index > -1) {
-                    this.item.model.splice(index, 1);
-                }
-            }
-        }
-    }
-    close() {
-        this.select.close();
-    }
-    isolateChange(filter) {
-        if (filter.isolate.enabled) {
-            filter.model = filter.multiple ? [filter.isolate.value] : filter.isolate.value;
-        }
-        else {
-            if (filter.multiple) {
-                filter.model = filter.defaultValue ? filter.defaultValue : [];
-            }
-            else {
-                filter.model = filter.defaultValue ? filter.defaultValue : null;
-            }
-        }
-    }
-}
-SelectMultipleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectMultipleComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-SelectMultipleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SelectMultipleComponent, selector: "filter-item-select-multiple", inputs: { item: "item" }, viewQueries: [{ propertyName: "select", first: true, predicate: ["select"], descendants: true, static: true }], ngImport: i0, template: "<mat-form-field [ngClass]=\"{ isolate: item.isolate }\">\n  <mat-label>{{item.label}}</mat-label>\n  <mat-select\n    #select\n    [fsFilterFocusTrigger]=\"item\"\n    [(ngModel)]=\"item.model\"\n    (ngModelChange)=\"changed()\"\n    [multiple]=\"item.multiple\">\n      <mat-option\n        *ngFor=\"let item of item.values | fsFilterIsolateValues: item.isolate\"\n        [value]=\"item.value\">\n          {{ item.name }}\n    </mat-option>\n  </mat-select>\n\n  <mat-hint>\n    <div *ngIf=\"item.isolate\">\n      <mat-checkbox (change)=\"isolateChange(item)\" [(ngModel)]=\"item.isolate.enabled\">\n        <span class=\"checkbox-label\">{{ item.isolate.label }}</span>\n      </mat-checkbox>\n    </div>\n  </mat-hint>\n</mat-form-field>\n", styles: [".isolate{margin-bottom:25px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "component", type: i4$1.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i5.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i6$2.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i9.FsFormNoFsValidatorsDirective, selector: "[ngModel]:not([required]):not([fsFormRequired]):not([fsFormCompare]):not([fsFormDateRange]):not([fsFormEmail]):not([fsFormEmails]):not([fsFormFunction]):not([fsFormGreater]):not([fsFormGreaterEqual]):not([fsFormInteger]):not([fsFormLesser]):not([fsFormMax]):not([fsFormMaxLength]):not([fsFormMin]):not([fsFormMinLength]):not([fsFormNumeric]):not([fsFormPattern]):not([fsFormPhone]):not([fsFormUrl]):not([validate])" }, { kind: "directive", type: FocusToItemDirective, selector: "[fsFilterFocusTrigger]", inputs: ["fsFilterFocusTrigger", "focusTargetType"] }, { kind: "pipe", type: FsFilterIsolateValues, name: "fsFilterIsolateValues" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectMultipleComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'filter-item-select-multiple', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-form-field [ngClass]=\"{ isolate: item.isolate }\">\n  <mat-label>{{item.label}}</mat-label>\n  <mat-select\n    #select\n    [fsFilterFocusTrigger]=\"item\"\n    [(ngModel)]=\"item.model\"\n    (ngModelChange)=\"changed()\"\n    [multiple]=\"item.multiple\">\n      <mat-option\n        *ngFor=\"let item of item.values | fsFilterIsolateValues: item.isolate\"\n        [value]=\"item.value\">\n          {{ item.name }}\n    </mat-option>\n  </mat-select>\n\n  <mat-hint>\n    <div *ngIf=\"item.isolate\">\n      <mat-checkbox (change)=\"isolateChange(item)\" [(ngModel)]=\"item.isolate.enabled\">\n        <span class=\"checkbox-label\">{{ item.isolate.label }}</span>\n      </mat-checkbox>\n    </div>\n  </mat-hint>\n</mat-form-field>\n", styles: [".isolate{margin-bottom:25px}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { item: [{
-                type: Input
-            }], select: [{
-                type: ViewChild,
-                args: ['select', { static: true }]
-            }] } });
-
-class SelectComponent extends BaseItemComponent {
-    constructor(_kvDiffers, _cd) {
-        super(_kvDiffers, _cd);
-        this._kvDiffers = _kvDiffers;
-        this._cd = _cd;
-        // For case when we have multiple selection with __all option
-        // If _all has been selected than we must disable all other items
-        this.allItemsOptionSelected = false;
-    }
-    get multipleSelectItem() {
-        return this.item;
-    }
-    get simpleSelectItem() {
-        return this.item;
-    }
-    ngOnChanges(changes) {
-        if (changes.item) {
-            this.values$ = this.item.values$;
-        }
-    }
-    ngDoCheck() {
-        if (this._kvDiffer) {
-            const changes = this._kvDiffer.diff(this.item);
-            if (changes) {
-                this._cd.markForCheck();
-                if (this.selectedItem) {
-                    this.selectedItem.cd.markForCheck();
-                }
-            }
-        }
-    }
-}
-SelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectComponent, deps: [{ token: i0.KeyValueDiffers }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-SelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SelectComponent, selector: "filter-item-select", viewQueries: [{ propertyName: "selectedItem", first: true, predicate: ["selectItem"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"(item.loading$ | async) else itemSelect\">\n  <mat-form-field>\n    <mat-label>{{item.label}}</mat-label>\n    <mat-select disabled></mat-select>\n  </mat-form-field>\n</ng-container>\n\n<ng-template #itemSelect>\n  <ng-container *ngIf=\"(values$ | async)?.length\">\n    <ng-container *ngIf=\"item.multiple && !item.children\">\n      <filter-item-select-multiple\n        [item]=\"multipleSelectItem\"\n        #selectItem>\n      </filter-item-select-multiple>\n    </ng-container>\n\n    <ng-container *ngIf=\"!item.multiple && !item.children\">\n      <filter-item-select-simple\n        [item]=\"simpleSelectItem\"\n        #selectItem>\n      </filter-item-select-simple>\n    </ng-container>\n\n    <ng-container *ngIf=\"item.children\">\n      <filter-item-select-groups\n        [item]=\"item\"\n        #selectItem>\n      </filter-item-select-groups>\n    </ng-container>\n  </ng-container>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "component", type: i4$1.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: SelectGroupsComponent, selector: "filter-item-select-groups", inputs: ["item"] }, { kind: "component", type: SelectSimpleComponent, selector: "filter-item-select-simple", inputs: ["item"] }, { kind: "component", type: SelectMultipleComponent, selector: "filter-item-select-multiple", inputs: ["item"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'filter-item-select', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"(item.loading$ | async) else itemSelect\">\n  <mat-form-field>\n    <mat-label>{{item.label}}</mat-label>\n    <mat-select disabled></mat-select>\n  </mat-form-field>\n</ng-container>\n\n<ng-template #itemSelect>\n  <ng-container *ngIf=\"(values$ | async)?.length\">\n    <ng-container *ngIf=\"item.multiple && !item.children\">\n      <filter-item-select-multiple\n        [item]=\"multipleSelectItem\"\n        #selectItem>\n      </filter-item-select-multiple>\n    </ng-container>\n\n    <ng-container *ngIf=\"!item.multiple && !item.children\">\n      <filter-item-select-simple\n        [item]=\"simpleSelectItem\"\n        #selectItem>\n      </filter-item-select-simple>\n    </ng-container>\n\n    <ng-container *ngIf=\"item.children\">\n      <filter-item-select-groups\n        [item]=\"item\"\n        #selectItem>\n      </filter-item-select-groups>\n    </ng-container>\n  </ng-container>\n</ng-template>\n" }]
-        }], ctorParameters: function () { return [{ type: i0.KeyValueDiffers }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { selectedItem: [{
-                type: ViewChild,
-                args: ['selectItem']
-            }] } });
-
-class ChipsComponent extends BaseItemComponent {
-    constructor(_kvDiffers, _cd) {
-        super(_kvDiffers, _cd);
-        this._kvDiffers = _kvDiffers;
-        this._cd = _cd;
-    }
-    modelChange() {
-        this.itemChange();
-    }
-    compareFn(modelValue, chipValue) {
-        return String(modelValue.value) === String(chipValue.value);
-    }
-}
-ChipsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ChipsComponent, deps: [{ token: i0.KeyValueDiffers }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-ChipsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ChipsComponent, selector: "filter-item-chips", usesInheritance: true, ngImport: i0, template: "<ng-template [ngIf]=\"item.values?.length\">\n  <fs-label-field>\n    <fs-label>{{item.label}}</fs-label>\n    <fs-chips \n        [(ngModel)]=\"item.model\"\n        [compare]=\"compareFn\"\n        [multiple]=\"item.multiple\">\n      <fs-chip \n          *ngFor=\"let value of item.values\"\n          [value]=\"value\"\n          [selectable]=\"true\">\n        {{ value.name }}\n      </fs-chip>\n    </fs-chips>\n  </fs-label-field>\n</ng-template>\n\n<ng-template [ngIf]=\"item.loading\">{{ item.label }} loading...</ng-template>\n", styles: ["fs-chip{line-height:40px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$2.FsChipsComponent, selector: "fs-chips", inputs: ["compare", "multiple"] }, { kind: "component", type: i3$2.FsChipComponent, selector: "fs-chip", inputs: ["selectable", "removable", "value", "icon", "image", "selected", "size", "backgroundColor", "borderColor", "color", "outlined"], outputs: ["selectedToggled", "removed"] }, { kind: "component", type: i4$3.FsLabelComponent, selector: "fs-label" }, { kind: "component", type: i4$3.FsLabelFieldComponent, selector: "fs-label-field", inputs: ["bottomMargin", "topMargin", "labelMargin"] }, { kind: "directive", type: i9.FsFormNoFsValidatorsDirective, selector: "[ngModel]:not([required]):not([fsFormRequired]):not([fsFormCompare]):not([fsFormDateRange]):not([fsFormEmail]):not([fsFormEmails]):not([fsFormFunction]):not([fsFormGreater]):not([fsFormGreaterEqual]):not([fsFormInteger]):not([fsFormLesser]):not([fsFormMax]):not([fsFormMaxLength]):not([fsFormMin]):not([fsFormMinLength]):not([fsFormNumeric]):not([fsFormPattern]):not([fsFormPhone]):not([fsFormUrl]):not([validate])" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ChipsComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'filter-item-chips', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template [ngIf]=\"item.values?.length\">\n  <fs-label-field>\n    <fs-label>{{item.label}}</fs-label>\n    <fs-chips \n        [(ngModel)]=\"item.model\"\n        [compare]=\"compareFn\"\n        [multiple]=\"item.multiple\">\n      <fs-chip \n          *ngFor=\"let value of item.values\"\n          [value]=\"value\"\n          [selectable]=\"true\">\n        {{ value.name }}\n      </fs-chip>\n    </fs-chips>\n  </fs-label-field>\n</ng-template>\n\n<ng-template [ngIf]=\"item.loading\">{{ item.label }} loading...</ng-template>\n", styles: ["fs-chip{line-height:40px}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.KeyValueDiffers }, { type: i0.ChangeDetectorRef }]; } });
-
-class TextComponent extends BaseItemComponent {
-    constructor(_kvDiffers, _cd) {
-        super(_kvDiffers, _cd);
-        this._kvDiffers = _kvDiffers;
-        this._cd = _cd;
-        this.textControl = new UntypedFormControl();
-        this.destroy$ = new Subject();
-    }
-    ngOnInit() {
-        this._listenControlValueChanges();
-        this._listenModelChanges();
-    }
-    ngOnDestroy() {
-        this.destroy$.next();
-        this.destroy$.complete();
-    }
-    _listenControlValueChanges() {
-        this.textControl.valueChanges
-            .pipe(distinctUntilChanged(), debounceTime(200), takeUntil(this.destroy$))
-            .subscribe((value) => {
-            this.item.model = value;
-        });
-    }
-    _listenModelChanges() {
-        this._item.value$
-            .pipe(takeUntil(this.destroy$))
-            .subscribe(() => {
-            this.textControl.setValue(this.item.model, { emitEvent: false });
-        });
-    }
-}
-TextComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TextComponent, deps: [{ token: i0.KeyValueDiffers }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-TextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: TextComponent, selector: "filter-item-text", usesInheritance: true, ngImport: i0, template: "<mat-form-field>\n  <mat-label>{{item.label}}</mat-label>\n  <span matPrefix *ngIf=\"item.prefix\" [innerHtml]=\"item.prefix\"></span>\n  <input matInput [formControl]=\"textControl\" [fsFilterFocusTrigger]=\"item\">\n  <span matSuffix *ngIf=\"item.suffix\" [innerHtml]=\"item.suffix\"></span>\n</mat-form-field>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatPrefix, selector: "[matPrefix]" }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix]" }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: FocusToItemDirective, selector: "[fsFilterFocusTrigger]", inputs: ["fsFilterFocusTrigger", "focusTargetType"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TextComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'filter-item-text', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-form-field>\n  <mat-label>{{item.label}}</mat-label>\n  <span matPrefix *ngIf=\"item.prefix\" [innerHtml]=\"item.prefix\"></span>\n  <input matInput [formControl]=\"textControl\" [fsFilterFocusTrigger]=\"item\">\n  <span matSuffix *ngIf=\"item.suffix\" [innerHtml]=\"item.suffix\"></span>\n</mat-form-field>\n" }]
-        }], ctorParameters: function () { return [{ type: i0.KeyValueDiffers }, { type: i0.ChangeDetectorRef }]; } });
-
-class WeekComponent extends BaseItemComponent {
-    constructor(_kvDiffers, _cd) {
-        super(_kvDiffers, _cd);
-        this._kvDiffers = _kvDiffers;
-        this._cd = _cd;
-    }
-    ngOnInit() { }
-}
-WeekComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WeekComponent, deps: [{ token: i0.KeyValueDiffers }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-WeekComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: WeekComponent, selector: "filter-item-week", usesInheritance: true, ngImport: i0, template: "<mat-form-field>\n  <mat-label>{{item.label}}</mat-label>\n  <input matInput\n         fsDateWeekPicker\n         [fsFilterFocusTrigger]=\"item\"\n         [(ngModel)]=\"item.model\"\n         [seedDate]=\"item.seedDate\"\n         [clear]=\"item.showClear\"\n         [name]=\"item.name\">\n  <mat-placeholder *ngIf=\"inline\">{{ item.label }}</mat-placeholder>\n</mat-form-field>\n", dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatPlaceholder, selector: "mat-placeholder" }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i3$3.FsDateWeekPickerComponent, selector: "[fsDateWeekPicker]", inputs: ["minYear", "maxYear", "minDate", "maxDate", "seedDate", "period", "view", "weekStartsOn"], outputs: ["change"] }, { kind: "directive", type: i9.FsFormNoFsValidatorsDirective, selector: "[ngModel]:not([required]):not([fsFormRequired]):not([fsFormCompare]):not([fsFormDateRange]):not([fsFormEmail]):not([fsFormEmails]):not([fsFormFunction]):not([fsFormGreater]):not([fsFormGreaterEqual]):not([fsFormInteger]):not([fsFormLesser]):not([fsFormMax]):not([fsFormMaxLength]):not([fsFormMin]):not([fsFormMinLength]):not([fsFormNumeric]):not([fsFormPattern]):not([fsFormPhone]):not([fsFormUrl]):not([validate])" }, { kind: "directive", type: FocusToItemDirective, selector: "[fsFilterFocusTrigger]", inputs: ["fsFilterFocusTrigger", "focusTargetType"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WeekComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'filter-item-week', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-form-field>\n  <mat-label>{{item.label}}</mat-label>\n  <input matInput\n         fsDateWeekPicker\n         [fsFilterFocusTrigger]=\"item\"\n         [(ngModel)]=\"item.model\"\n         [seedDate]=\"item.seedDate\"\n         [clear]=\"item.showClear\"\n         [name]=\"item.name\">\n  <mat-placeholder *ngIf=\"inline\">{{ item.label }}</mat-placeholder>\n</mat-form-field>\n" }]
-        }], ctorParameters: function () { return [{ type: i0.KeyValueDiffers }, { type: i0.ChangeDetectorRef }]; } });
-
-class RangeComponent extends BaseItemComponent {
-    constructor(_kvDiffers, _cd) {
-        super(_kvDiffers, _cd);
-        this._kvDiffers = _kvDiffers;
-        this._cd = _cd;
-    }
-    ngOnInit() {
-        this.listenChanges();
-    }
-    listenChanges() {
-        const fromListener = fromEvent(this.from.nativeElement, 'keyup')
-            .pipe(distinctUntilChanged());
-        const toListener = fromEvent(this.to.nativeElement, 'keyup')
-            .pipe(distinctUntilChanged());
-        merge(fromListener, toListener)
-            .pipe(takeUntil(this._destroy$))
-            .subscribe(() => {
-            this.itemChange();
-        });
-    }
-}
-RangeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: RangeComponent, deps: [{ token: i0.KeyValueDiffers }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-RangeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: RangeComponent, selector: "filter-item-range", viewQueries: [{ propertyName: "from", first: true, predicate: ["from"], descendants: true, static: true }, { propertyName: "to", first: true, predicate: ["to"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"form-field\">\n  <mat-form-field class=\"filter-range-min\">\n    <mat-label>{{item.label[0]}}</mat-label>\n    <span \n      matPrefix \n      class=\"text-prefix\"\n      *ngIf=\"item.prefix\"\n      [innerHtml]=\"item.prefix\">\n    </span>\n    <input \n      matInput\n      [fsFilterFocusTrigger]=\"item\"\n      [focusTargetType]=\"'from'\"\n      type=\"text\"\n      inputmode=\"decimal\"\n      [(ngModel)]=\"item.model.min\"\n      #from>\n    <span \n      matSuffix \n      class=\"text-suffix\"\n      *ngIf=\"item.suffix\" \n      [innerHtml]=\"item.suffix\">\n    </span>\n  </mat-form-field>\n\n  <mat-form-field class=\"filter-range-max\">\n    <mat-label>{{item.label[1]}}</mat-label>\n    <span \n      matPrefix \n      class=\"text-prefix\"\n      *ngIf=\"item.prefix\"\n      [innerHtml]=\"item.prefix\">\n    </span>\n    <input \n      matInput\n      [fsFilterFocusTrigger]=\"item\"\n      [focusTargetType]=\"'to'\"\n      type=\"text\"\n      inputmode=\"decimal\"\n      [(ngModel)]=\"item.model.max\"\n      #to>\n    <span \n      matSuffix \n      class=\"text-suffix\"\n      *ngIf=\"item.suffix\"\n      [innerHtml]=\"item.suffix\">\n    </span>\n  </mat-form-field>\n</div>\n", styles: [".form-field{display:flex}.form-field mat-form-field{min-width:0}.form-field mat-form-field+mat-form-field{margin-left:10px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatPrefix, selector: "[matPrefix]" }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix]" }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i9.FsFormNoFsValidatorsDirective, selector: "[ngModel]:not([required]):not([fsFormRequired]):not([fsFormCompare]):not([fsFormDateRange]):not([fsFormEmail]):not([fsFormEmails]):not([fsFormFunction]):not([fsFormGreater]):not([fsFormGreaterEqual]):not([fsFormInteger]):not([fsFormLesser]):not([fsFormMax]):not([fsFormMaxLength]):not([fsFormMin]):not([fsFormMinLength]):not([fsFormNumeric]):not([fsFormPattern]):not([fsFormPhone]):not([fsFormUrl]):not([validate])" }, { kind: "directive", type: FocusToItemDirective, selector: "[fsFilterFocusTrigger]", inputs: ["fsFilterFocusTrigger", "focusTargetType"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: RangeComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'filter-item-range', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"form-field\">\n  <mat-form-field class=\"filter-range-min\">\n    <mat-label>{{item.label[0]}}</mat-label>\n    <span \n      matPrefix \n      class=\"text-prefix\"\n      *ngIf=\"item.prefix\"\n      [innerHtml]=\"item.prefix\">\n    </span>\n    <input \n      matInput\n      [fsFilterFocusTrigger]=\"item\"\n      [focusTargetType]=\"'from'\"\n      type=\"text\"\n      inputmode=\"decimal\"\n      [(ngModel)]=\"item.model.min\"\n      #from>\n    <span \n      matSuffix \n      class=\"text-suffix\"\n      *ngIf=\"item.suffix\" \n      [innerHtml]=\"item.suffix\">\n    </span>\n  </mat-form-field>\n\n  <mat-form-field class=\"filter-range-max\">\n    <mat-label>{{item.label[1]}}</mat-label>\n    <span \n      matPrefix \n      class=\"text-prefix\"\n      *ngIf=\"item.prefix\"\n      [innerHtml]=\"item.prefix\">\n    </span>\n    <input \n      matInput\n      [fsFilterFocusTrigger]=\"item\"\n      [focusTargetType]=\"'to'\"\n      type=\"text\"\n      inputmode=\"decimal\"\n      [(ngModel)]=\"item.model.max\"\n      #to>\n    <span \n      matSuffix \n      class=\"text-suffix\"\n      *ngIf=\"item.suffix\"\n      [innerHtml]=\"item.suffix\">\n    </span>\n  </mat-form-field>\n</div>\n", styles: [".form-field{display:flex}.form-field mat-form-field{min-width:0}.form-field mat-form-field+mat-form-field{margin-left:10px}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.KeyValueDiffers }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { from: [{
-                type: ViewChild,
-                args: ['from', { static: true }]
-            }], to: [{
-                type: ViewChild,
-                args: ['to', { static: true }]
-            }] } });
-
-class AutocompleteComponent extends BaseItemComponent {
-    constructor(_kvDiffers, _cd) {
-        super(_kvDiffers, _cd);
-        this._kvDiffers = _kvDiffers;
-        this._cd = _cd;
-        this.displayWith = (data) => {
-            return data ? data.name : data;
-        };
-        this.fetch = (keyword) => {
-            return this.item.valuesFn(keyword, this.item.filter);
-        };
-    }
-}
-AutocompleteComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AutocompleteComponent, deps: [{ token: i0.KeyValueDiffers }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-AutocompleteComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: AutocompleteComponent, selector: "filter-item-autocomplete", usesInheritance: true, ngImport: i0, template: "<fs-autocomplete\n    [fsFilterFocusTrigger]=\"item\"\n    [fetch]=\"fetch\"\n    [displayWith]=\"displayWith\"\n    [(ngModel)]=\"item.model\"\n    [placeholder]=\"label\"\n    [fetchOnFocus]=\"item.fetchOnFocus\"\n    [showClear]=\"item.showClear\"\n    name=\"item.name\">\n  <ng-template fsAutocompleteTemplate let-data=\"data\">\n    {{data.name}}\n  </ng-template>\n</fs-autocomplete>\n", dependencies: [{ kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4$2.FsAutocompleteComponent, selector: "fs-autocomplete", inputs: ["fetch", "displayWith", "placeholder", "fetchOnFocus", "readonly", "required", "disabled", "formFieldClass", "appearance", "hint", "panelWidth", "panelClass", "showClear"], outputs: ["cleared", "opened", "closed"] }, { kind: "directive", type: i4$2.FsAutocompleteTemplateDirective, selector: "[fsAutocompleteTemplate]" }, { kind: "directive", type: i9.FsFormNoFsValidatorsDirective, selector: "[ngModel]:not([required]):not([fsFormRequired]):not([fsFormCompare]):not([fsFormDateRange]):not([fsFormEmail]):not([fsFormEmails]):not([fsFormFunction]):not([fsFormGreater]):not([fsFormGreaterEqual]):not([fsFormInteger]):not([fsFormLesser]):not([fsFormMax]):not([fsFormMaxLength]):not([fsFormMin]):not([fsFormMinLength]):not([fsFormNumeric]):not([fsFormPattern]):not([fsFormPhone]):not([fsFormUrl]):not([validate])" }, { kind: "directive", type: FocusToItemDirective, selector: "[fsFilterFocusTrigger]", inputs: ["fsFilterFocusTrigger", "focusTargetType"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AutocompleteComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'filter-item-autocomplete', changeDetection: ChangeDetectionStrategy.OnPush, template: "<fs-autocomplete\n    [fsFilterFocusTrigger]=\"item\"\n    [fetch]=\"fetch\"\n    [displayWith]=\"displayWith\"\n    [(ngModel)]=\"item.model\"\n    [placeholder]=\"label\"\n    [fetchOnFocus]=\"item.fetchOnFocus\"\n    [showClear]=\"item.showClear\"\n    name=\"item.name\">\n  <ng-template fsAutocompleteTemplate let-data=\"data\">\n    {{data.name}}\n  </ng-template>\n</fs-autocomplete>\n" }]
-        }], ctorParameters: function () { return [{ type: i0.KeyValueDiffers }, { type: i0.ChangeDetectorRef }]; } });
-
-class AutocompletechipsComponent extends BaseItemComponent {
-    constructor(_kvDiffers, _cd) {
-        super(_kvDiffers, _cd);
-        this._kvDiffers = _kvDiffers;
-        this._cd = _cd;
-        this.fetch = (keyword) => {
-            return this.item.valuesFn(keyword, this.item.filter);
-        };
-    }
-    addAutocompleteChipItem(event) {
-        if (event.data && this.item.model.indexOf(event.data.value) === -1) {
-            this.item.model.push(event.data);
-            this.itemChange();
-        }
-    }
-    removeAutocompleteChipItem(event) {
-        remove(this.item.model, { value: event.data.value });
-        this.itemChange();
-    }
-    clearAutocompleteChipItem() {
-        this.item.clear();
-        this.itemChange();
-    }
-    compareItems(item1, item2) {
-        return (item1 === null || item1 === void 0 ? void 0 : item1.value) === (item2 === null || item2 === void 0 ? void 0 : item2.value);
-    }
-}
-AutocompletechipsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AutocompletechipsComponent, deps: [{ token: i0.KeyValueDiffers }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-AutocompletechipsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: AutocompletechipsComponent, selector: "filter-item-autocompletechips", usesInheritance: true, ngImport: i0, template: "<fs-autocomplete-chips\n  [fsFilterFocusTrigger]=\"item\"\n  [fetch]=\"fetch\"\n  [ngModel]=\"item.model\"\n  (selected)=\"addAutocompleteChipItem($event)\"\n  (removed)=\"removeAutocompleteChipItem($event)\"\n  (clear)=\"clearAutocompleteChipItem()\"\n  [allowText]=\"false\"\n  [fetchOnFocus]=\"item.fetchOnFocus\"\n  [placeholder]=\"label\"\n  [chipImage]=\"item.chipImage\"\n  [chipColor]=\"item.chipColor\"\n  [chipIconColor]=\"item.chipIcon\"\n  [chipBackground]=\"item.chipBackground\"\n  [chipIcon]=\"item.chipIcon\"\n  [chipClass]=\"item.chipClass\"\n  [allowClear]=\"item.showClear\"\n  [removable]=\"item.showClear\"\n  [compareWith]=\"compareItems\"\n  [panelWidth]=\"300\"\n  name=\"model\">\n  <ng-template fsAutocompleteObject let-object=\"object\">\n    {{ object.name }}\n  </ng-template>\n</fs-autocomplete-chips>\n\n<!--<mat-form-field floatLabel=\"auto\">\n  <mat-label>{{item.label}}</mat-label>\n  <mat-chip-list #chipList>\n    <mat-chip *ngFor=\"let item of item.model\"\n              (removed)=\"removeAutocompleteChipItem(item)\">\n      {{ item.name }}\n      <mat-icon matChipRemove>cancel</mat-icon>\n    </mat-chip>\n\n    <input #chipsInput\n           type=\"text\"\n           matInput\n           [(ngModel)]=\"item.selectedValue\"\n           (ngModelChange)=\"onAutocompleteChipsChange(chipsInput)\"\n           [name]=\"item.name\"\n           [matChipInputFor]=\"chipList\"\n           [matAutocomplete]=\"autocompleteChipsInput\">\n  </mat-chip-list>\n\n  <mat-autocomplete #autocompleteChipsInput=\"matAutocomplete\"\n                    (optionSelected)=\"addAutocompleteChipItem( $event)\"\n  >\n    <mat-option *ngFor=\"let item of item.values$ | async\" [value]=\"item\">\n      {{ item.name }}\n    </mat-option>\n  </mat-autocomplete>\n  <mat-placeholder *ngIf=\"inline\">{{ item.label }}</mat-placeholder>\n</mat-form-field>-->\n", dependencies: [{ kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5$1.FsAutocompleteChipsComponent, selector: "fs-autocomplete-chips", inputs: ["fetch", "appearance", "floatLabel", "readonly", "size", "placeholder", "label", "chipImage", "chipBackground", "chipColor", "chipIcon", "chipIconColor", "chipClass", "hint", "allowText", "allowObject", "delay", "validateText", "removable", "allowClear", "color", "background", "orderable", "limit", "initOnClick", "fetchOnFocus", "multiple", "confirm", "disabled", "panelWidth", "panelClass", "compareWith"], outputs: ["selected", "removed", "reordered", "clear"] }, { kind: "directive", type: i5$1.FsAutocompleteObjectDirective, selector: "[fsAutocompleteObject],[fsAutocompleteChipsTemplate]" }, { kind: "directive", type: i9.FsFormNoFsValidatorsDirective, selector: "[ngModel]:not([required]):not([fsFormRequired]):not([fsFormCompare]):not([fsFormDateRange]):not([fsFormEmail]):not([fsFormEmails]):not([fsFormFunction]):not([fsFormGreater]):not([fsFormGreaterEqual]):not([fsFormInteger]):not([fsFormLesser]):not([fsFormMax]):not([fsFormMaxLength]):not([fsFormMin]):not([fsFormMinLength]):not([fsFormNumeric]):not([fsFormPattern]):not([fsFormPhone]):not([fsFormUrl]):not([validate])" }, { kind: "directive", type: FocusToItemDirective, selector: "[fsFilterFocusTrigger]", inputs: ["fsFilterFocusTrigger", "focusTargetType"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AutocompletechipsComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'filter-item-autocompletechips', changeDetection: ChangeDetectionStrategy.OnPush, template: "<fs-autocomplete-chips\n  [fsFilterFocusTrigger]=\"item\"\n  [fetch]=\"fetch\"\n  [ngModel]=\"item.model\"\n  (selected)=\"addAutocompleteChipItem($event)\"\n  (removed)=\"removeAutocompleteChipItem($event)\"\n  (clear)=\"clearAutocompleteChipItem()\"\n  [allowText]=\"false\"\n  [fetchOnFocus]=\"item.fetchOnFocus\"\n  [placeholder]=\"label\"\n  [chipImage]=\"item.chipImage\"\n  [chipColor]=\"item.chipColor\"\n  [chipIconColor]=\"item.chipIcon\"\n  [chipBackground]=\"item.chipBackground\"\n  [chipIcon]=\"item.chipIcon\"\n  [chipClass]=\"item.chipClass\"\n  [allowClear]=\"item.showClear\"\n  [removable]=\"item.showClear\"\n  [compareWith]=\"compareItems\"\n  [panelWidth]=\"300\"\n  name=\"model\">\n  <ng-template fsAutocompleteObject let-object=\"object\">\n    {{ object.name }}\n  </ng-template>\n</fs-autocomplete-chips>\n\n<!--<mat-form-field floatLabel=\"auto\">\n  <mat-label>{{item.label}}</mat-label>\n  <mat-chip-list #chipList>\n    <mat-chip *ngFor=\"let item of item.model\"\n              (removed)=\"removeAutocompleteChipItem(item)\">\n      {{ item.name }}\n      <mat-icon matChipRemove>cancel</mat-icon>\n    </mat-chip>\n\n    <input #chipsInput\n           type=\"text\"\n           matInput\n           [(ngModel)]=\"item.selectedValue\"\n           (ngModelChange)=\"onAutocompleteChipsChange(chipsInput)\"\n           [name]=\"item.name\"\n           [matChipInputFor]=\"chipList\"\n           [matAutocomplete]=\"autocompleteChipsInput\">\n  </mat-chip-list>\n\n  <mat-autocomplete #autocompleteChipsInput=\"matAutocomplete\"\n                    (optionSelected)=\"addAutocompleteChipItem( $event)\"\n  >\n    <mat-option *ngFor=\"let item of item.values$ | async\" [value]=\"item\">\n      {{ item.name }}\n    </mat-option>\n  </mat-autocomplete>\n  <mat-placeholder *ngIf=\"inline\">{{ item.label }}</mat-placeholder>\n</mat-form-field>-->\n" }]
-        }], ctorParameters: function () { return [{ type: i0.KeyValueDiffers }, { type: i0.ChangeDetectorRef }]; } });
-
-class DateComponent extends BaseItemComponent {
-    constructor(_kvDiffers, _cd) {
-        super(_kvDiffers, _cd);
-        this._kvDiffers = _kvDiffers;
-        this._cd = _cd;
-        this.viewType = PickerViewType.Date;
-        this.itemDateMode = ItemDateMode;
-        this.showYear = true;
-        this.showMonth = true;
-        this.showDay = true;
-    }
-    ngOnInit() {
-        if (this.item.type === ItemType.DateTime) {
-            this.viewType = PickerViewType.DateTime;
-        }
-        else {
-            this.viewType = PickerViewType.Date;
-        }
-        if (this.item.mode === ItemDateMode.ScrollMonthYear) {
-            this.showDay = false;
-        }
-    }
-}
-DateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DateComponent, deps: [{ token: i0.KeyValueDiffers }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-DateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: DateComponent, selector: "filter-item-date", usesInheritance: true, ngImport: i0, template: "<mat-form-field *ngIf=\"item.mode===itemDateMode.Calendar; else elseMode\">\n  <mat-label>{{item.label}}</mat-label>\n  <input matInput\n         fsDatePicker\n         [fsFilterFocusTrigger]=\"item\"\n         [(ngModel)]=\"item.model\"\n         [maxYear]=\"item.maxYear\"\n         [view]=\"viewType\"\n         [clear]=\"item.showClear\"\n         [name]=\"item.name\">\n  <mat-placeholder *ngIf=\"inline\">{{ item.label }}</mat-placeholder>\n</mat-form-field>\n\n<ng-template #elseMode>\n  <mat-form-field>\n    <mat-label>{{item.label}}</mat-label>\n    <input matInput\n          fsDateScrollPicker\n           [fsFilterFocusTrigger]=\"item\"\n          [(ngModel)]=\"item.model\"\n          [maxYear]=\"item.maxYear\"\n          [showMonth]=\"showMonth\"\n          [showDay]=\"showDay\"\n          [showYear]=\"showYear\"\n          [clear]=\"item.showClear\"\n          [name]=\"item.name\">\n    <mat-placeholder *ngIf=\"inline\">{{ item.label }}</mat-placeholder>\n  </mat-form-field>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatPlaceholder, selector: "mat-placeholder" }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i3$3.FsDatePickerComponent, selector: "[fsDatePicker]", inputs: ["minYear", "maxYear", "minDate", "maxDate", "startOfDay", "view", "format", "minutes", "weekStartsOn"], outputs: ["change"] }, { kind: "component", type: i3$3.FsDateScrollPickerComponent, selector: "[fsDateScrollPicker]", inputs: ["minYear", "maxYear", "minDate", "maxDate", "showMonth", "showYear", "showDay"] }, { kind: "directive", type: i9.FsFormNoFsValidatorsDirective, selector: "[ngModel]:not([required]):not([fsFormRequired]):not([fsFormCompare]):not([fsFormDateRange]):not([fsFormEmail]):not([fsFormEmails]):not([fsFormFunction]):not([fsFormGreater]):not([fsFormGreaterEqual]):not([fsFormInteger]):not([fsFormLesser]):not([fsFormMax]):not([fsFormMaxLength]):not([fsFormMin]):not([fsFormMinLength]):not([fsFormNumeric]):not([fsFormPattern]):not([fsFormPhone]):not([fsFormUrl]):not([validate])" }, { kind: "directive", type: FocusToItemDirective, selector: "[fsFilterFocusTrigger]", inputs: ["fsFilterFocusTrigger", "focusTargetType"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DateComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'filter-item-date', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-form-field *ngIf=\"item.mode===itemDateMode.Calendar; else elseMode\">\n  <mat-label>{{item.label}}</mat-label>\n  <input matInput\n         fsDatePicker\n         [fsFilterFocusTrigger]=\"item\"\n         [(ngModel)]=\"item.model\"\n         [maxYear]=\"item.maxYear\"\n         [view]=\"viewType\"\n         [clear]=\"item.showClear\"\n         [name]=\"item.name\">\n  <mat-placeholder *ngIf=\"inline\">{{ item.label }}</mat-placeholder>\n</mat-form-field>\n\n<ng-template #elseMode>\n  <mat-form-field>\n    <mat-label>{{item.label}}</mat-label>\n    <input matInput\n          fsDateScrollPicker\n           [fsFilterFocusTrigger]=\"item\"\n          [(ngModel)]=\"item.model\"\n          [maxYear]=\"item.maxYear\"\n          [showMonth]=\"showMonth\"\n          [showDay]=\"showDay\"\n          [showYear]=\"showYear\"\n          [clear]=\"item.showClear\"\n          [name]=\"item.name\">\n    <mat-placeholder *ngIf=\"inline\">{{ item.label }}</mat-placeholder>\n  </mat-form-field>\n</ng-template>\n" }]
-        }], ctorParameters: function () { return [{ type: i0.KeyValueDiffers }, { type: i0.ChangeDetectorRef }]; } });
-
-class DateRangeComponent extends BaseItemComponent {
-    constructor(_kvDiffers, _cd) {
-        super(_kvDiffers, _cd);
-        this._kvDiffers = _kvDiffers;
-        this._cd = _cd;
-        this.viewType = PickerViewType.Date;
-    }
-    ngOnInit() {
-        if (this.item.type === ItemType.DateTimeRange) {
-            this.viewType = PickerViewType.DateTime;
-        }
-        else {
-            this.viewType = PickerViewType.Date;
-        }
-    }
-}
-DateRangeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DateRangeComponent, deps: [{ token: i0.KeyValueDiffers }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-DateRangeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: DateRangeComponent, selector: "filter-item-date-range", usesInheritance: true, ngImport: i0, template: "<mat-form-field>\n  <mat-label>{{item.label[0]}}</mat-label>\n  <input\n    matInput\n    [fsFilterFocusTrigger]=\"item\"\n    [focusTargetType]=\"'from'\"\n    [fsDateRangeFrom]=\"item.name\"\n    [(ngModel)]=\"item.model.from\"\n    (ngModelChange)=\"itemChange()\"\n    [clear]=\"item.showClear\"\n    [view]=\"viewType\"\n    name=\"date_from\">\n</mat-form-field>\n\n<mat-form-field>\n  <mat-label>{{item.label[1]}}</mat-label>\n  <input\n    matInput\n    [fsFilterFocusTrigger]=\"item\"\n    [focusTargetType]=\"'to'\"\n    [fsDateRangeTo]=\"item.name\"\n    [(ngModel)]=\"item.model.to\"\n    (ngModelChange)=\"itemChange()\"\n    [clear]=\"item.showClear\"\n    [view]=\"viewType\"\n    name=\"date_to\">\n</mat-form-field>\n", dependencies: [{ kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i3$3.DateRangePickerFromComponent, selector: "[fsDateRangeFrom],[fsDateRangeFromPicker]", inputs: ["fsDateRangeFrom", "fsDateRangeFromPicker"] }, { kind: "component", type: i3$3.DateRangePickerToComponent, selector: "[fsDateRangeTo],[fsDateRangeToPicker]", inputs: ["fsDateRangeTo", "fsDateRangeToPicker"] }, { kind: "directive", type: i9.FsFormNoFsValidatorsDirective, selector: "[ngModel]:not([required]):not([fsFormRequired]):not([fsFormCompare]):not([fsFormDateRange]):not([fsFormEmail]):not([fsFormEmails]):not([fsFormFunction]):not([fsFormGreater]):not([fsFormGreaterEqual]):not([fsFormInteger]):not([fsFormLesser]):not([fsFormMax]):not([fsFormMaxLength]):not([fsFormMin]):not([fsFormMinLength]):not([fsFormNumeric]):not([fsFormPattern]):not([fsFormPhone]):not([fsFormUrl]):not([validate])" }, { kind: "directive", type: FocusToItemDirective, selector: "[fsFilterFocusTrigger]", inputs: ["fsFilterFocusTrigger", "focusTargetType"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DateRangeComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'filter-item-date-range', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-form-field>\n  <mat-label>{{item.label[0]}}</mat-label>\n  <input\n    matInput\n    [fsFilterFocusTrigger]=\"item\"\n    [focusTargetType]=\"'from'\"\n    [fsDateRangeFrom]=\"item.name\"\n    [(ngModel)]=\"item.model.from\"\n    (ngModelChange)=\"itemChange()\"\n    [clear]=\"item.showClear\"\n    [view]=\"viewType\"\n    name=\"date_from\">\n</mat-form-field>\n\n<mat-form-field>\n  <mat-label>{{item.label[1]}}</mat-label>\n  <input\n    matInput\n    [fsFilterFocusTrigger]=\"item\"\n    [focusTargetType]=\"'to'\"\n    [fsDateRangeTo]=\"item.name\"\n    [(ngModel)]=\"item.model.to\"\n    (ngModelChange)=\"itemChange()\"\n    [clear]=\"item.showClear\"\n    [view]=\"viewType\"\n    name=\"date_to\">\n</mat-form-field>\n" }]
-        }], ctorParameters: function () { return [{ type: i0.KeyValueDiffers }, { type: i0.ChangeDetectorRef }]; } });
-
-class CheckboxComponent extends BaseItemComponent {
-    constructor(_kvDiffers, _cd) {
-        super(_kvDiffers, _cd);
-        this._kvDiffers = _kvDiffers;
-        this._cd = _cd;
-    }
-}
-CheckboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CheckboxComponent, deps: [{ token: i0.KeyValueDiffers }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-CheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CheckboxComponent, selector: "filter-item-checkbox", usesInheritance: true, ngImport: i0, template: "<fs-label-field>\n  <mat-checkbox [(ngModel)]=\"item.model\">\n    {{ item.label }}\n  </mat-checkbox>\n</fs-label-field>\n", styles: ["fs-label-field{margin:0}\n"], dependencies: [{ kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i6$2.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "component", type: i4$3.FsLabelFieldComponent, selector: "fs-label-field", inputs: ["bottomMargin", "topMargin", "labelMargin"] }, { kind: "directive", type: i9.FsFormNoFsValidatorsDirective, selector: "[ngModel]:not([required]):not([fsFormRequired]):not([fsFormCompare]):not([fsFormDateRange]):not([fsFormEmail]):not([fsFormEmails]):not([fsFormFunction]):not([fsFormGreater]):not([fsFormGreaterEqual]):not([fsFormInteger]):not([fsFormLesser]):not([fsFormMax]):not([fsFormMaxLength]):not([fsFormMin]):not([fsFormMinLength]):not([fsFormNumeric]):not([fsFormPattern]):not([fsFormPhone]):not([fsFormUrl]):not([validate])" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CheckboxComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'filter-item-checkbox', changeDetection: ChangeDetectionStrategy.OnPush, template: "<fs-label-field>\n  <mat-checkbox [(ngModel)]=\"item.model\">\n    {{ item.label }}\n  </mat-checkbox>\n</fs-label-field>\n", styles: ["fs-label-field{margin:0}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.KeyValueDiffers }, { type: i0.ChangeDetectorRef }]; } });
-
-class FilterItemComponent {
-    constructor(_cdRef) {
-        this._cdRef = _cdRef;
-        this.itemType = ItemType;
-        this._destroy$ = new Subject();
-    }
-    get textItem() {
-        return this.item;
-    }
-    get chipsItem() {
-        return this.item;
-    }
-    get baseSelectItem() {
-        return this.item;
-    }
-    get rangeItem() {
-        return this.item;
-    }
-    get autocompleteItem() {
-        return this.item;
-    }
-    get autocompleteChipsItem() {
-        return this.item;
-    }
-    get dateItem() {
-        return this.item;
-    }
-    get dateRangeItem() {
-        return this.item;
-    }
-    get dateTimeItem() {
-        return this.item;
-    }
-    get dateTimeRangeItem() {
-        return this.item;
-    }
-    get weekItem() {
-        return this.item;
-    }
-    get checkboxItem() {
-        return this.item;
-    }
-    ngOnInit() {
-        this.item.value$
-            .pipe(takeUntil(this._destroy$))
-            .subscribe(() => {
-            this._cdRef.markForCheck();
-        });
-    }
-    ngOnDestroy() {
-        this._destroy$.next();
-        this._destroy$.complete();
-    }
-}
-FilterItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FilterItemComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-FilterItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FilterItemComponent, selector: "filter-item", inputs: { item: "item" }, ngImport: i0, template: "<div class=\"filter filter-{{ item.type }}\">\n\n  <ng-container [ngSwitch]=\"item.type\">\n    <filter-item-text \n      class=\"interface\"\n      *ngSwitchCase=\"itemType.Text\"\n      [item]=\"textItem\">\n    </filter-item-text>\n\n    <filter-item-select \n      class=\"interface\"\n      *ngSwitchCase=\"itemType.Select\"\n      [item]=\"baseSelectItem\">\n    </filter-item-select>\n\n    <filter-item-chips \n      class=\"interface\"\n      *ngSwitchCase=\"itemType.Chips\"\n      [item]=\"chipsItem\">\n    </filter-item-chips>\n\n    <filter-item-range \n      class=\"interface interface-range\"\n      *ngSwitchCase=\"itemType.Range\"\n      [item]=\"rangeItem\">\n    </filter-item-range>\n\n    <filter-item-autocomplete \n      class=\"interface\"\n      *ngSwitchCase=\"itemType.AutoComplete\"\n      [item]=\"autocompleteItem\">\n    </filter-item-autocomplete>\n\n    <filter-item-autocompletechips \n      class=\"interface\"\n      *ngSwitchCase=\"itemType.AutoCompleteChips\"\n      [item]=\"autocompleteChipsItem\">\n    </filter-item-autocompletechips>\n\n    <filter-item-date \n      class=\"interface interface-date\"\n      *ngSwitchCase=\"itemType.Date\"\n      [item]=\"dateItem\">\n    </filter-item-date>\n\n    <filter-item-date \n      class=\"interface interface-date\"\n      *ngSwitchCase=\"itemType.DateTime\"\n      [item]=\"dateTimeItem\">\n    </filter-item-date>\n\n    <filter-item-date-range \n      class=\"interface interface-date\"\n      *ngSwitchCase=\"itemType.DateRange\"\n      [item]=\"dateRangeItem\">\n    </filter-item-date-range>\n\n    <filter-item-date-range \n      class=\"interface interface-date\"\n      *ngSwitchCase=\"itemType.DateTimeRange\"\n      [item]=\"dateTimeRangeItem\">\n    </filter-item-date-range>\n\n    <filter-item-week \n      class=\"interface\"\n      *ngSwitchCase=\"itemType.Week\"\n      [item]=\"weekItem\">\n    </filter-item-week>\n\n    <filter-item-checkbox \n      class=\"interface interface-checkbox\"\n      *ngSwitchCase=\"itemType.Checkbox\"\n      [item]=\"checkboxItem\">\n    </filter-item-checkbox>\n  </ng-container>\n\n</div>\n", styles: [":host ::ng-deep mat-form-field .mat-form-field-prefix .text-prefix,:host ::ng-deep mat-form-field .mat-form-field-prefix .text-suffix,:host ::ng-deep mat-form-field .mat-form-field-suffix .text-prefix,:host ::ng-deep mat-form-field .mat-form-field-suffix .text-suffix{top:-.25em;position:relative}:host ::ng-deep mat-form-field:not(.mat-form-field-should-float) .mat-form-field-prefix .text-prefix,:host ::ng-deep mat-form-field:not(.mat-form-field-should-float) .mat-form-field-suffix .text-suffix{display:none}\n"], dependencies: [{ kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: SelectComponent, selector: "filter-item-select" }, { kind: "component", type: ChipsComponent, selector: "filter-item-chips" }, { kind: "component", type: TextComponent, selector: "filter-item-text" }, { kind: "component", type: WeekComponent, selector: "filter-item-week" }, { kind: "component", type: RangeComponent, selector: "filter-item-range" }, { kind: "component", type: AutocompleteComponent, selector: "filter-item-autocomplete" }, { kind: "component", type: AutocompletechipsComponent, selector: "filter-item-autocompletechips" }, { kind: "component", type: DateComponent, selector: "filter-item-date" }, { kind: "component", type: DateRangeComponent, selector: "filter-item-date-range" }, { kind: "component", type: CheckboxComponent, selector: "filter-item-checkbox" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FilterItemComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'filter-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"filter filter-{{ item.type }}\">\n\n  <ng-container [ngSwitch]=\"item.type\">\n    <filter-item-text \n      class=\"interface\"\n      *ngSwitchCase=\"itemType.Text\"\n      [item]=\"textItem\">\n    </filter-item-text>\n\n    <filter-item-select \n      class=\"interface\"\n      *ngSwitchCase=\"itemType.Select\"\n      [item]=\"baseSelectItem\">\n    </filter-item-select>\n\n    <filter-item-chips \n      class=\"interface\"\n      *ngSwitchCase=\"itemType.Chips\"\n      [item]=\"chipsItem\">\n    </filter-item-chips>\n\n    <filter-item-range \n      class=\"interface interface-range\"\n      *ngSwitchCase=\"itemType.Range\"\n      [item]=\"rangeItem\">\n    </filter-item-range>\n\n    <filter-item-autocomplete \n      class=\"interface\"\n      *ngSwitchCase=\"itemType.AutoComplete\"\n      [item]=\"autocompleteItem\">\n    </filter-item-autocomplete>\n\n    <filter-item-autocompletechips \n      class=\"interface\"\n      *ngSwitchCase=\"itemType.AutoCompleteChips\"\n      [item]=\"autocompleteChipsItem\">\n    </filter-item-autocompletechips>\n\n    <filter-item-date \n      class=\"interface interface-date\"\n      *ngSwitchCase=\"itemType.Date\"\n      [item]=\"dateItem\">\n    </filter-item-date>\n\n    <filter-item-date \n      class=\"interface interface-date\"\n      *ngSwitchCase=\"itemType.DateTime\"\n      [item]=\"dateTimeItem\">\n    </filter-item-date>\n\n    <filter-item-date-range \n      class=\"interface interface-date\"\n      *ngSwitchCase=\"itemType.DateRange\"\n      [item]=\"dateRangeItem\">\n    </filter-item-date-range>\n\n    <filter-item-date-range \n      class=\"interface interface-date\"\n      *ngSwitchCase=\"itemType.DateTimeRange\"\n      [item]=\"dateTimeRangeItem\">\n    </filter-item-date-range>\n\n    <filter-item-week \n      class=\"interface\"\n      *ngSwitchCase=\"itemType.Week\"\n      [item]=\"weekItem\">\n    </filter-item-week>\n\n    <filter-item-checkbox \n      class=\"interface interface-checkbox\"\n      *ngSwitchCase=\"itemType.Checkbox\"\n      [item]=\"checkboxItem\">\n    </filter-item-checkbox>\n  </ng-container>\n\n</div>\n", styles: [":host ::ng-deep mat-form-field .mat-form-field-prefix .text-prefix,:host ::ng-deep mat-form-field .mat-form-field-prefix .text-suffix,:host ::ng-deep mat-form-field .mat-form-field-suffix .text-prefix,:host ::ng-deep mat-form-field .mat-form-field-suffix .text-suffix{top:-.25em;position:relative}:host ::ng-deep mat-form-field:not(.mat-form-field-should-float) .mat-form-field-prefix .text-prefix,:host ::ng-deep mat-form-field:not(.mat-form-field-should-float) .mat-form-field-suffix .text-suffix{display:none}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { item: [{
-                type: Input
-            }] } });
-
-class FilterDrawerComponent {
-    constructor(_overlayRef, _data, externalParams, _cd, _itemsStore) {
-        this._overlayRef = _overlayRef;
-        this._data = _data;
-        this.externalParams = externalParams;
-        this._cd = _cd;
-        this._itemsStore = _itemsStore;
-        this.inline = false;
-        this.windowDesktop = false;
-        this._itemsStore.prepareItems();
-        this._clear = this._data.clear;
-        this._done = this._data.done;
-        this.updateWindowWidth();
-    }
-    updateWindowWidth() {
-        this.windowDesktop = window.innerWidth > 1200;
-    }
-    get items$() {
-        return this._itemsStore.visibleItems$;
-    }
-    get sortItem() {
-        return this._itemsStore.sortByItem;
-    }
-    get sortDirectionItem() {
-        return this._itemsStore.sortDirectionItem;
-    }
-    clear() {
-        this._clear();
-        // this.overlayRef.detach();
-    }
-    done() {
-        this._done();
-        this._overlayRef.detach();
-    }
-    backdropClick() {
-        this.done();
-    }
-}
-FilterDrawerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FilterDrawerComponent, deps: [{ token: FILTER_DRAWER_OVERLAY }, { token: FILTER_DRAWER_DATA }, { token: ExternalParamsController }, { token: i0.ChangeDetectorRef }, { token: FsFilterItemsStore }], target: i0.ɵɵFactoryTarget.Component });
-FilterDrawerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FilterDrawerComponent, selector: "ng-component", inputs: { inline: "inline" }, host: { listeners: { "window:resize": "updateWindowWidth()" } }, ngImport: i0, template: "<div class=\"filters\">\n  <div class=\"filters-wrap\">\n\n    <div class=\"filter-by\">\n      <mat-icon>tune</mat-icon>\n      <span class=\"text\">Filters</span>\n    </div>\n\n    <div class=\"overflow-shadow filter-items\">\n      <div class=\"overflow-shadow-content\">\n        <ng-container *fsSkeleton=\"(externalParams.pending$ | async) !== true\">\n          <filter-item \n            *ngFor=\"let filterItem of items$ | async\"\n            class=\"filter-group\"\n            [item]=\"filterItem\">\n          </filter-item>\n\n          <ng-container *ngIf=\"sortItem && sortItem.values && sortItem.values.length > 0\">\n            <filter-item \n              class=\"filter-group sort\"\n              [item]=\"sortItem\">\n            </filter-item>\n            <filter-item \n              class=\"filter-group sort\"\n              [item]=\"sortDirectionItem\">\n            </filter-item>\n          </ng-container>\n        </ng-container>\n      </div>\n    </div>\n\n    <fs-filter-drawer-actions \n      class=\"filter-actions\"\n      *ngIf=\"(externalParams.pending$ | async) !== true\"\n      (clear)=\"clear()\"\n      (done)=\"done()\">\n    </fs-filter-drawer-actions>\n  </div>\n</div>\n<div class=\"backdrop\" *ngIf=\"!windowDesktop\" (click)=\"backdropClick()\"></div>\n", styles: ["@charset \"UTF-8\";@media (max-width: 599px){h1[class*=\".top\"][fs\\.lt-xs*=fs-heading][fs\\.lt-xs*=\".top-none\"],h2[class*=\".top\"][fs\\.lt-xs*=fs-heading][fs\\.lt-xs*=\".top-none\"],h3[class*=\".top\"][fs\\.lt-xs*=fs-heading][fs\\.lt-xs*=\".top-none\"]{margin-top:0}}@media (max-width: 1023px){h1[class*=\".top\"][fs\\.lt-sm*=fs-heading][fs\\.lt-sm*=\".top-none\"],h2[class*=\".top\"][fs\\.lt-sm*=fs-heading][fs\\.lt-sm*=\".top-none\"],h3[class*=\".top\"][fs\\.lt-sm*=fs-heading][fs\\.lt-sm*=\".top-none\"]{margin-top:0}}@media (max-width: 1439px){h1[class*=\".top\"][fs\\.lt-md*=fs-heading][fs\\.lt-md*=\".top-none\"],h2[class*=\".top\"][fs\\.lt-md*=fs-heading][fs\\.lt-md*=\".top-none\"],h3[class*=\".top\"][fs\\.lt-md*=fs-heading][fs\\.lt-md*=\".top-none\"]{margin-top:0}}.fs-delimit>*:not(:last-child):after{content:\",\\a0\"}:host ::ng-deep mat-form-field{width:100%}.filter-by{display:flex;flex-direction:row;align-items:center;box-sizing:border-box;padding:20px 25px}.filter-by mat-icon{margin-right:8px}.filter-by .text{font-weight:400;font-size:19px}.filter-actions{display:block;box-sizing:border-box;padding:13px}.filter-actions button{margin-right:6px}.filter-actions button:last-child{margin-right:0}.filters{position:fixed;display:block;top:0;right:0;z-index:1002;bottom:0}.filters .filters-wrap{background:#fff;box-shadow:0 2px 4px -1px #0003,0 4px 5px #00000024,0 1px 10px #0000001f;width:100vw;max-width:350px;display:flex;flex-direction:column;padding-top:env(safe-area-inset-top);box-sizing:border-box;height:100%}.filters .filters-wrap .filter-items{overflow-y:auto;height:auto}.filters .filters-wrap .filter-items .overflow-shadow-content{padding:0 25px;box-sizing:border-box}.filters .filter-group{margin:10px 0 0}.filters .filter-group:first-child{margin:0}.filters .filter label{white-space:nowrap;color:#0000008a}.filters .filter .interface.interface-range input,.filters .filter .interface.interface-range .mat-input-wrapper,.filters .filter .interface.interface-range{text-align:center}.filters .filter .interface.interface-datetime fs-datetime.has-time .md-input{width:100%}.filters .filter .interface fs-datetime-range input{text-align:center}.filters .filter .filter-label{width:1%;white-space:nowrap;vertical-align:middle;padding-right:15px}.filters md-autocomplete-container md-input-container{margin:0}.filters .isolate{margin-top:-12px}.filters .isolate .interface{line-height:20px;padding-bottom:1.25em}.filters .isolate md-checkbox{margin:0 0 0 2px}.backdrop{position:fixed;inset:0;z-index:900;outline:none}@media (max-width: 599px){.filters .filters-wrap{max-width:none}}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i5$2.FsSkeletonContentDirective, selector: "[fsSkeleton]", inputs: ["fsSkeleton", "fsSkeletonPattern"] }, { kind: "component", type: FilterItemComponent, selector: "filter-item", inputs: ["item"] }, { kind: "component", type: FsFilterDrawerActionsComponent, selector: "fs-filter-drawer-actions", outputs: ["clear", "done"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FilterDrawerComponent, decorators: [{
-            type: Component,
-            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"filters\">\n  <div class=\"filters-wrap\">\n\n    <div class=\"filter-by\">\n      <mat-icon>tune</mat-icon>\n      <span class=\"text\">Filters</span>\n    </div>\n\n    <div class=\"overflow-shadow filter-items\">\n      <div class=\"overflow-shadow-content\">\n        <ng-container *fsSkeleton=\"(externalParams.pending$ | async) !== true\">\n          <filter-item \n            *ngFor=\"let filterItem of items$ | async\"\n            class=\"filter-group\"\n            [item]=\"filterItem\">\n          </filter-item>\n\n          <ng-container *ngIf=\"sortItem && sortItem.values && sortItem.values.length > 0\">\n            <filter-item \n              class=\"filter-group sort\"\n              [item]=\"sortItem\">\n            </filter-item>\n            <filter-item \n              class=\"filter-group sort\"\n              [item]=\"sortDirectionItem\">\n            </filter-item>\n          </ng-container>\n        </ng-container>\n      </div>\n    </div>\n\n    <fs-filter-drawer-actions \n      class=\"filter-actions\"\n      *ngIf=\"(externalParams.pending$ | async) !== true\"\n      (clear)=\"clear()\"\n      (done)=\"done()\">\n    </fs-filter-drawer-actions>\n  </div>\n</div>\n<div class=\"backdrop\" *ngIf=\"!windowDesktop\" (click)=\"backdropClick()\"></div>\n", styles: ["@charset \"UTF-8\";@media (max-width: 599px){h1[class*=\".top\"][fs\\.lt-xs*=fs-heading][fs\\.lt-xs*=\".top-none\"],h2[class*=\".top\"][fs\\.lt-xs*=fs-heading][fs\\.lt-xs*=\".top-none\"],h3[class*=\".top\"][fs\\.lt-xs*=fs-heading][fs\\.lt-xs*=\".top-none\"]{margin-top:0}}@media (max-width: 1023px){h1[class*=\".top\"][fs\\.lt-sm*=fs-heading][fs\\.lt-sm*=\".top-none\"],h2[class*=\".top\"][fs\\.lt-sm*=fs-heading][fs\\.lt-sm*=\".top-none\"],h3[class*=\".top\"][fs\\.lt-sm*=fs-heading][fs\\.lt-sm*=\".top-none\"]{margin-top:0}}@media (max-width: 1439px){h1[class*=\".top\"][fs\\.lt-md*=fs-heading][fs\\.lt-md*=\".top-none\"],h2[class*=\".top\"][fs\\.lt-md*=fs-heading][fs\\.lt-md*=\".top-none\"],h3[class*=\".top\"][fs\\.lt-md*=fs-heading][fs\\.lt-md*=\".top-none\"]{margin-top:0}}.fs-delimit>*:not(:last-child):after{content:\",\\a0\"}:host ::ng-deep mat-form-field{width:100%}.filter-by{display:flex;flex-direction:row;align-items:center;box-sizing:border-box;padding:20px 25px}.filter-by mat-icon{margin-right:8px}.filter-by .text{font-weight:400;font-size:19px}.filter-actions{display:block;box-sizing:border-box;padding:13px}.filter-actions button{margin-right:6px}.filter-actions button:last-child{margin-right:0}.filters{position:fixed;display:block;top:0;right:0;z-index:1002;bottom:0}.filters .filters-wrap{background:#fff;box-shadow:0 2px 4px -1px #0003,0 4px 5px #00000024,0 1px 10px #0000001f;width:100vw;max-width:350px;display:flex;flex-direction:column;padding-top:env(safe-area-inset-top);box-sizing:border-box;height:100%}.filters .filters-wrap .filter-items{overflow-y:auto;height:auto}.filters .filters-wrap .filter-items .overflow-shadow-content{padding:0 25px;box-sizing:border-box}.filters .filter-group{margin:10px 0 0}.filters .filter-group:first-child{margin:0}.filters .filter label{white-space:nowrap;color:#0000008a}.filters .filter .interface.interface-range input,.filters .filter .interface.interface-range .mat-input-wrapper,.filters .filter .interface.interface-range{text-align:center}.filters .filter .interface.interface-datetime fs-datetime.has-time .md-input{width:100%}.filters .filter .interface fs-datetime-range input{text-align:center}.filters .filter .filter-label{width:1%;white-space:nowrap;vertical-align:middle;padding-right:15px}.filters md-autocomplete-container md-input-container{margin:0}.filters .isolate{margin-top:-12px}.filters .isolate .interface{line-height:20px;padding-bottom:1.25em}.filters .isolate md-checkbox{margin:0 0 0 2px}.backdrop{position:fixed;inset:0;z-index:900;outline:none}@media (max-width: 599px){.filters .filters-wrap{max-width:none}}\n"] }]
-        }], ctorParameters: function () {
-        return [{ type: i1$3.OverlayRef, decorators: [{
-                        type: Inject,
-                        args: [FILTER_DRAWER_OVERLAY]
-                    }] }, { type: undefined, decorators: [{
-                        type: Inject,
-                        args: [FILTER_DRAWER_DATA]
-                    }] }, { type: ExternalParamsController }, { type: i0.ChangeDetectorRef }, { type: FsFilterItemsStore }];
-    }, propDecorators: { inline: [{
-                type: Input
-            }], updateWindowWidth: [{
-                type: HostListener,
-                args: ['window:resize']
-            }] } });
-
-class ActionMenuItem {
-    constructor(config = {}, _parent) {
-        this._parent = _parent;
-        this.items = [];
-        this._isGroup = false;
-        this._visible$ = new BehaviorSubject(true);
-        this._disabled$ = new BehaviorSubject(false);
-        this._init(config);
-    }
-    get isGroup() {
-        return this._isGroup;
-    }
-    get visible() {
-        return this._visible$.getValue();
-    }
-    get visible$() {
-        return this._visible$.asObservable();
-    }
-    set disabled(value) {
-        this._disabled$.next(value);
-    }
-    get disabled() {
-        return this._disabled$.getValue();
-    }
-    get disabled$() {
-        return this._disabled$.asObservable();
-    }
-    updateVisibility() {
-        const visible = this._showFn ? this._showFn() : true;
-        if (!visible || !this.isGroup) {
-            this._visible$.next(visible);
-            return;
-        }
-        const numberOfVisibleChildren = this.items
-            .reduce((acc, item) => {
-            item.updateVisibility();
-            if (item.visible) {
-                acc++;
-            }
-            return acc;
-        }, 0);
-        this._visible$.next(!!numberOfVisibleChildren);
-    }
-    _init(config) {
-        this.label = config.label;
-        this.icon = config.icon;
-        this._showFn = config.show;
-        if ('items' in config) {
-            this._isGroup = true;
-            if (Array.isArray(config.items)) {
-                this.items = config
-                    .items
-                    .map((item) => new ActionMenuItem(item, this));
-            }
-            this.updateVisibility();
-        }
-        else {
-            this.click = config.click;
-            this.routerLink = config.link;
-            if (!this._parent) {
-                this.updateVisibility();
-            }
-        }
-    }
-}
-
-class Action {
-    constructor(filterConfig, actionConfig = {}) {
-        this.primary = true;
-        this.isReorderAction = false;
-        this.deselect = false;
-        this.classArray = [];
-        this.items = [];
-        this._visible$ = new BehaviorSubject(true);
-        this._disabled$ = new BehaviorSubject(false);
-        this._init(filterConfig, actionConfig);
-    }
-    get visible() {
-        return this._visible$.getValue();
-    }
-    get visible$() {
-        return this._visible$.asObservable();
-    }
-    set disabled(value) {
-        this._disabled$.next(value);
-    }
-    get disabled() {
-        return this._disabled$.getValue();
-    }
-    get disabled$() {
-        return this._disabled$.asObservable();
-    }
-    updateVisibility() {
-        const visible = this._showFn ? this._showFn() : true;
-        if (!visible || this.mode !== ActionMode.Menu) {
-            this._visible$.next(visible);
-            return;
-        }
-        const hasVisibleChildren = this.items.some((item) => item.visible);
-        this._visible$.next(hasVisibleChildren);
-    }
-    updateDisabledState() {
-        if (this._disabledFn) {
-            this.disabled = this._disabledFn();
-        }
-    }
-    _init(filterConfig, config = {}) {
-        var _a, _b;
-        config.mode = (_a = config.mode) !== null && _a !== void 0 ? _a : ActionMode.Button;
-        this._initCore(filterConfig, config);
-        switch (config.mode) {
-            case ActionMode.Button:
-                {
-                    this.customize = config.customize;
-                    this.click = (_b = config.click) !== null && _b !== void 0 ? _b : (() => {
-                        // do nothing
-                    });
-                    this._disabledFn = config.disabled;
-                    this.updateDisabledState();
-                }
-                break;
-            case ActionMode.Menu:
-                {
-                    if (config.items && Array.isArray(config.items)) {
-                        this.items = config.items.map((item) => new ActionMenuItem(item));
-                    }
-                }
-                break;
-            case ActionMode.SelectButton:
-                {
-                    this._initSelectButton(config);
-                }
-                break;
-            case ActionMode.File:
-                {
-                    this._initFile(config);
-                }
-                break;
-        }
-        this.updateVisibility();
-    }
-    _initCore(filterConfig, config) {
-        var _a, _b, _c;
-        this.primary = (_a = config.primary) !== null && _a !== void 0 ? _a : true;
-        this.color = config.color;
-        this.tooltip = config.tooltip;
-        this.label = config.label;
-        this.mode = config.mode;
-        this.icon = config.icon;
-        this.iconPlacement = config.iconPlacement;
-        this._showFn = config.show;
-        this.tabIndex = (_b = config.tabIndex) !== null && _b !== void 0 ? _b : 0;
-        this.menu = config.menu;
-        if (!this.type) {
-            this.type = (config.type || ((_c = filterConfig.button) === null || _c === void 0 ? void 0 : _c.style) || ActionType.Raised);
-            if (this.type === ActionType.Stroked && this.primary) {
-                this.type = ActionType.Flat;
-            }
-        }
-        if (config.className) {
-            this.className = config.className;
-            this.classArray = this.className
-                .split(' ');
-        }
-        if (this.primary) {
-            this.color = 'primary';
-        }
-    }
-    _initSelectButton(config) {
-        var _a;
-        this.values = config.values;
-        this.value = config.default;
-        this.change = config.change;
-        this.deselect = (_a = config.deselect) !== null && _a !== void 0 ? _a : false;
-    }
-    _initFile(config) {
-        var _a;
-        this.fileSelected = config.select;
-        this.fileError = config.error;
-        this.accept = config.accept;
-        this.imageQuality = config.imageQuality;
-        this.minWidth = config.minWidth;
-        this.minHeight = config.minHeight;
-        this.maxWidth = config.maxWidth;
-        this.maxHeight = config.maxHeight;
-        this.click = (_a = config.click) !== null && _a !== void 0 ? _a : (() => {
-            //
-        });
-        this._disabledFn = config.disabled;
-        if ((config).multiple !== undefined) {
-            this.multiple = (config).multiple;
-        }
-        this.updateDisabledState();
-    }
-}
-
-class ActionsController {
-    constructor(_breakpointObserver) {
-        this._breakpointObserver = _breakpointObserver;
-        this._visible$ = new BehaviorSubject(false);
-        this._actions$ = new BehaviorSubject([]);
-        this._menuActions$ = new BehaviorSubject([]);
-        this._destroy$ = new Subject();
-        this._mobileMedia = '(max-width: 799px)';
-        this._allActions = [];
-        this._listenMobileMedia();
-    }
-    get menuActions() {
-        return this._menuActions$.value;
-    }
-    get actions() {
-        return this._actions$.value;
-    }
-    get actions$() {
-        return this._actions$.asObservable();
-    }
-    get menuActions$() {
-        return this._menuActions$.asObservable();
-    }
-    get visible$() {
-        return this._visible$.asObservable();
-    }
-    get mobileMode() {
-        return this._breakpointObserver.isMatched(this._mobileMedia);
-    }
-    ngOnDestroy() {
-        this._destroy$.next();
-        this._destroy$.complete();
-    }
-    setConfig(config) {
-        this._config = config;
-        this.initActions(config.actions);
-    }
-    initActions(rawActions) {
-        if (!rawActions || !Array.isArray(rawActions)) {
-            return;
-        }
-        this.show();
-        this._allActions = rawActions
-            .map((action) => new Action(this._config, action));
-        if (this._reorderAction) {
-            this._allActions.unshift(this._reorderAction);
-        }
-        this._classifyActions();
-    }
-    show() {
-        this._visible$.next(true);
-    }
-    hide() {
-        this._visible$.next(false);
-    }
-    addReorderAction(action) {
-        this._allActions.unshift(action);
-        action.isReorderAction = true;
-        this._classifyAction(action);
-        this._reorderAction = action;
-    }
-    clearActions() {
-        this._allActions = [];
-        this._setActions([]);
-        this._setKebabActions([]);
-    }
-    updateActionsVisibility() {
-        this._allActions.forEach((action) => action.updateVisibility());
-        this._classifyActions();
-    }
-    updateDisabledState() {
-        this.actions.forEach((action) => action.updateDisabledState());
-    }
-    _setKebabActions(actions) {
-        this._menuActions$.next(actions);
-    }
-    _setActions(actions) {
-        this._actions$.next(actions);
-    }
-    _classifyActions() {
-        const kebabActions = [];
-        const actions = [];
-        const mobileMode = this.mobileMode;
-        this._allActions
-            .filter((action) => {
-            return action.visible;
-        })
-            .forEach((action) => {
-            if (action.menu !== false && (action.menu || mobileMode)) {
-                kebabActions.push(action);
-            }
-            else {
-                actions.push(action);
-            }
-        });
-        this._setKebabActions(kebabActions);
-        this._setActions(actions);
-    }
-    _classifyAction(action) {
-        if (action.menu) {
-            this._setKebabActions([...this.menuActions, action]);
-        }
-        else {
-            this._setActions([...this.actions, action]);
-        }
-    }
-    _listenMobileMedia() {
-        this._breakpointObserver.observe(this._mobileMedia)
-            .pipe(skip(1), takeUntil(this._destroy$))
-            .subscribe(() => {
-            this._classifyActions();
-        });
-    }
-}
-ActionsController.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ActionsController, deps: [{ token: i1$4.BreakpointObserver }], target: i0.ɵɵFactoryTarget.Injectable });
-ActionsController.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ActionsController });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ActionsController, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: i1$4.BreakpointObserver }]; } });
-
-const FS_FILTER_META = new InjectionToken('fs.filter.meta', {
-    providedIn: 'root',
-    factory: () => {
-        return {
-            openedFilters: 0,
-        };
-    }
-});
-
-class FsFilterOverlayService {
-    constructor(_filterMeta, _injector, _overlay, _focusController, _htmlClassRenderer) {
-        this._filterMeta = _filterMeta;
-        this._injector = _injector;
-        this._overlay = _overlay;
-        this._focusController = _focusController;
-        this._htmlClassRenderer = _htmlClassRenderer;
-        this.detach$ = new Subject();
-        this.attach$ = new Subject();
-        this._destroy$ = new Subject();
-        this._openWhenChipClicked();
-    }
-    get isOpened() {
-        return !!this._overlayRef;
-    }
-    setClearFn(fn) {
-        this._clearFn = fn;
-    }
-    setDoneFn(fn) {
-        this._doneFn = fn;
-    }
-    close() {
-        if (this._overlayRef) {
-            this._overlayRef.detach();
-            this._overlayRef = null;
-            this._removeFilterClass();
-        }
-    }
-    open() {
-        this._overlayRef = this._createOverlay();
-        this._overlayRef.backdropClick()
-            .pipe(takeUntil(this._destroy$))
-            .subscribe(() => {
-            this._overlayRef.detach();
-        });
-        this._overlayRef.detachments()
-            .pipe(takeUntil(this._destroy$))
-            .subscribe(() => {
-            this.detach$.next();
-        });
-        this._overlayRef.attachments()
-            .pipe(takeUntil(this._destroy$))
-            .subscribe(() => {
-            this.attach$.next();
-        });
-        this._addFilterClass();
-        return this._openPortalPreview();
-    }
-    ngOnDestroy() {
-        this._destroy$.next();
-        this._destroy$.complete();
-    }
-    _createOverlay() {
-        const overlayConfig = new OverlayConfig({
-            hasBackdrop: true,
-            backdropClass: 'fs-filter-backdrop',
-        });
-        return this._overlay.create(overlayConfig);
-    }
-    _openPortalPreview() {
-        const data = {
-            done: this._doneFn,
-            clear: this._clearFn,
-        };
-        const injector = this._createInjector(this._injector, data, this._overlayRef);
-        const containerPortal = new ComponentPortal(FilterDrawerComponent, undefined, injector);
-        const containerRef = this._overlayRef.attach(containerPortal);
-        return containerRef.instance;
-    }
-    _createInjector(parentInjector, data, overlayRef) {
-        const injectionTokens = new WeakMap([
-            [FILTER_DRAWER_DATA, data],
-            [FILTER_DRAWER_OVERLAY, overlayRef],
-        ]);
-        return new PortalInjector(parentInjector, injectionTokens);
-    }
-    _removeFilterClass() {
-        this._filterMeta.openedFilters--;
-        if (this._filterMeta.openedFilters === 0) {
-            this._htmlClassRenderer.removeClass('fs-filter-open');
-        }
-    }
-    _addFilterClass() {
-        this._filterMeta.openedFilters++;
-        if (this._filterMeta.openedFilters === 1) {
-            this._htmlClassRenderer.addClass('fs-filter-open');
-        }
-    }
-    _openWhenChipClicked() {
-        this._focusController.focusOn$
-            .pipe(filter$1((v) => !!v), takeUntil(this._destroy$))
-            .subscribe(() => {
-            if (!this.isOpened) {
-                this.open();
-            }
-        });
-    }
-}
-FsFilterOverlayService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterOverlayService, deps: [{ token: FS_FILTER_META }, { token: i0.Injector }, { token: i1$3.Overlay }, { token: FocusControllerService }, { token: i3$4.HtmlClassRenderer }], target: i0.ɵɵFactoryTarget.Injectable });
-FsFilterOverlayService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterOverlayService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterOverlayService, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () {
-        return [{ type: undefined, decorators: [{
-                        type: Inject,
-                        args: [FS_FILTER_META]
-                    }] }, { type: i0.Injector }, { type: i1$3.Overlay }, { type: FocusControllerService }, { type: i3$4.HtmlClassRenderer }];
-    } });
-
-class FilterStatusBarDirective {
-    constructor(templateRef) {
-        this.templateRef = templateRef;
-    }
-}
-FilterStatusBarDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FilterStatusBarDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
-FilterStatusBarDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: FilterStatusBarDirective, selector: "[fsFilterStatusBar]", ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FilterStatusBarDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[fsFilterStatusBar]',
-                }]
-        }], ctorParameters: function () { return [{ type: i0.TemplateRef }]; } });
-
-const FS_FILTER_CONFIG = new InjectionToken('fs.filter-config');
-
-class FilterComponent {
-    constructor(_defaultConfig, _filterOverlay, _zone, _externalParams, _filterItems, _actions, _savedFiltersController, _externalParamsController) {
-        this._defaultConfig = _defaultConfig;
-        this._filterOverlay = _filterOverlay;
-        this._zone = _zone;
-        this._externalParams = _externalParams;
-        this._filterItems = _filterItems;
-        this._actions = _actions;
-        this._savedFiltersController = _savedFiltersController;
-        this._externalParamsController = _externalParamsController;
-        this.showSortBy = true;
-        this.showFilterInput = true;
-        this.closed = new EventEmitter();
-        this.opened = new EventEmitter();
-        this.ready = new EventEmitter();
-        this.showFilterMenu = false;
-        this.windowDesktop = false;
-        this.fsFilterClass = true;
-        this.searchPlaceholder = 'Search';
-        this.keyword = '';
-        this.autoReload = true;
-        this._config = null;
-        this._filtersBtnVisible$ = new BehaviorSubject(true);
-        this._keywordVisible$ = new BehaviorSubject(true);
-        this._hasFilterChips$ = new BehaviorSubject(false);
-        this._keyword$ = new Subject();
-        this._destroy$ = new Subject();
-        this._filterItems.filter = this;
-        this._listenWhenFilterReady();
-        this._updateWindowWidth();
-        this._filterOverlay.attach$
-            .pipe(takeUntil(this._destroy$))
-            .subscribe(() => {
-            this.showFilterMenu = true;
-        });
-        this._filterOverlay.detach$
-            .pipe(takeUntil(this._destroy$))
-            .subscribe(() => {
-            this.showFilterMenu = false;
-        });
-        this._listenWindowResize();
-    }
-    set setConfig(config) {
-        this._initFilterWithConfig(config);
-    }
-    set setFilter(config) {
-        this._initFilterWithConfig(config);
-    }
-    get hasKeyword() {
-        return this._filterItems.hasKeyword;
-    }
-    get config() {
-        return this._config;
-    }
-    get filterParams() {
-        return this._filterItems.values();
-    }
-    get filterParamsQuery() {
-        return this._filterItems.valuesAsQuery();
-    }
-    get items() {
-        return this._filterItems.items;
-    }
-    get visibleItems() {
-        return this._filterItems.visibleItems;
-    }
-    get keywordItem() {
-        return this._filterItems.keywordItem;
-    }
-    get itemsReady$() {
-        return this._filterItems.ready$;
-    }
-    get hasFilterChips$() {
-        return this._hasFilterChips$.asObservable();
-    }
-    get hasVisibleItemOrSorting() {
-        return this.visibleItems.length > 0 || !!this._filterItems.sortByItem;
-    }
-    get filtersBtnVisible$() {
-        return this._filtersBtnVisible$.asObservable();
-    }
-    get keywordVisible$() {
-        return this._keywordVisible$.asObservable();
-    }
-    get actionsVisible$() {
-        return this._actions.visible$;
-    }
-    get actions$() {
-        return this._actions.actions$;
-    }
-    get menuActions$() {
-        return this._actions.menuActions$;
-    }
-    set activeSavedFilter(savedFilter) {
-        this._externalParams.setActiveSavedFilter(savedFilter);
-    }
-    get activeSavedFilter() {
-        return this._savedFiltersController.activeFilter;
-    }
-    get savedFilters() {
-        return this._savedFiltersController.savedFilters;
-    }
-    ngOnInit() {
-        // Avoid ngChanges error
-        setTimeout(() => {
-            if (this.config.autofocus) {
-                this.focus();
-            }
-        });
-        this._initAutoReload();
-        this._listenInputChanges();
-        this._listenInternalItemsChange();
-        this._initOverlay();
-    }
-    ngOnDestroy() {
-        this._destroyFilterDrawer();
-        this._destroy$.next();
-        this._destroy$.complete();
-    }
-    focus() {
-        var _a;
-        (_a = this.keywordMatInput) === null || _a === void 0 ? void 0 : _a.focus();
-    }
-    updateSort(sort) {
-        this._filterItems.updateSort(sort);
-    }
-    /**
-     *
-     * Do update value of some field
-     *
-     * @param values - values for update
-     *
-     * To update text value just pass new text value
-     *
-     * public updateSelectValue(val) {
-     *   this.filterEl.updateValues({ keyword: val });
-     * }
-     *
-     * To update select or observable select you could pass suitable value
-     *
-     * public updateSelectValue(val: number) {
-     *   this.filterEl.updateValues({ simple_select: val }, { observable_select: val });
-     * }
-     *
-     * To update checkbox value just pass true/false as value
-     *
-     * public updateCheckox(val: boolean) {
-     *   this.filterEl.updateValues({ checkbox: val });
-     * }
-     *
-     * To update range value just pass object with min&max object or just with one of targets
-     *
-     * Ex.: { min: 10, max 15 }, { min: 5 }, { max 5 }
-     *
-     * public updateRange(val) {
-     *   this.filterEl.updateValues({ range: val });
-     * }
-     *
-     * To update autocomplete just pass object with name/value fields
-     *
-     * Ex.: { name: 'John Doe', value: 1 }
-     *
-     * public updateAutocomplete(val) {
-     *   this.filterEl.updateValues({ autocomplete_user_id: val });
-     * }
-     *
-     * To update autocompletechips just pass:
-     *
-     * 1) object with name/value fields - will be appended to existing set of values
-     *
-     * { name: 'John Doe', value: 1 }
-     *
-     * 2) array of objects - will be appended to existing set of values
-     *
-     * [{ name: 'John Doe', value: 1 }, { name: 'Darya Filipova', value: 2 }]
-     *
-     * 3) null - clear existing set of values
-     *
-     * public updateAutocomplete(val) {
-     *   this.filterEl.updateValues({ autocompletechips_user_id: val });
-     * }
-     *
-     */
-    updateValues(values) {
-        Object.keys(values).forEach((key) => {
-            const filterItem = this.items
-                .find((item) => item.name === key);
-            if (!filterItem) {
-                return;
-            }
-            filterItem.model = values[key];
-        });
-    }
-    hide() {
-        this.changeVisibility(false);
-    }
-    show() {
-        this.changeVisibility(true);
-    }
-    changeVisibilityClick(value, event = null) {
-        if (event) {
-            event.stopPropagation();
-        }
-        this.changeVisibility(value);
-    }
-    get itemValues() {
-        return this.items
-            .map((item) => item.value);
-    }
-    get nonEmptyItemValues() {
-        return this.items
-            .filter((item) => item.value !== undefined)
-            .map((item) => item.value);
-    }
-    get hasItemValues() {
-        return this.items
-            .some((item) => item.value !== undefined);
-    }
-    getItemValue(name) {
-        const item = this.items
-            .find((_item) => _item.name === name);
-        return item === null || item === void 0 ? void 0 : item.value;
-    }
-    showItem(name) {
-        const item = this.getItem(name);
-        if (item) {
-            item.hide = false;
-            this._filterItems.updateItemsVisiblity();
-        }
-    }
-    hideItem(name) {
-        const item = this.getItem(name);
-        if (!item) {
-            return;
-        }
-        item.hide = true;
-        this._filterItems.updateItemsVisiblity();
-    }
-    clearItem(name) {
-        const item = this.getItem(name);
-        if (!item) {
-            return;
-        }
-        item.clear();
-    }
-    updateItemConfig(name, params) {
-        var _a, _b;
-        const item = this.getItem(name);
-        if (!item) {
-            return;
-        }
-        item.label = (_a = params.label) !== null && _a !== void 0 ? _a : item.label;
-        item.chipLabel = (_b = params.chipLabel) !== null && _b !== void 0 ? _b : item.chipLabel;
-        this._filterItems.updateItemsVisiblity();
-    }
-    getItemValueChange$(name) {
-        const item = this.items.find((i) => i.name === name);
-        if (item) {
-            return item.value$
-                .pipe(map(() => {
-                return item.model;
-            }));
-        }
-        return null;
-    }
-    changeVisibility(state) {
-        if (state === this.showFilterMenu) {
-            return;
-        }
-        if (!state) {
-            this.closed.emit();
-            return this._destroyFilterDrawer();
-        }
-        if (!this.hasVisibleItemOrSorting) {
-            return;
-        }
-        this._listenEscButton();
-        this.opened.emit();
-        this._filterOverlay.open();
-    }
-    init() {
-        const data = this._filterItems.valuesAsQuery();
-        this._sort = this._filterItems.getSort();
-        if (this.config.init) {
-            this.config.init(data, this._sort, this);
-        }
-        this._updateChipsVisibility();
-        this.items
-            .forEach((item) => {
-            item.init(item, this);
-        });
-    }
-    clear(event = null) {
-        if (event) {
-            event.stopPropagation();
-        }
-        this._filterItems.filtersClear();
-        if (this.config.clear) {
-            this.config.clear();
-        }
-        this.keyword = '';
-    }
-    /**
-     * Close filter window and do change callback
-     */
-    search(event) {
-        this.changeVisibilityClick(false, event);
-    }
-    reload(event = null) {
-        var _a;
-        if (event) {
-            event.preventDefault();
-            event.stopPropagation();
-        }
-        const data = this._filterItems.valuesAsQuery();
-        const el = (_a = this.reloadEl) === null || _a === void 0 ? void 0 : _a.nativeElement;
-        if (el) {
-            el.style.transition = 'all 0.75s 0.0s';
-            el.style.transform = 'rotate(360deg)';
-            setTimeout(() => {
-                el.style.transition = null;
-                el.style.transform = null;
-            }, 1000);
-        }
-        if (this.config.reload) {
-            this.config.reload(data, this._filterItems.getSort());
-        }
-    }
-    getItem(name) {
-        return this.items
-            .find((item) => item.name === name);
-    }
-    fetchQueryParams() {
-        this._externalParams.fetchQueryParams();
-    }
-    /**
-     * Call change callback and apply new filter values
-     */
-    change() {
-        const data = this._filterItems.valuesAsQuery();
-        const sort = this._filterItems.getSort();
-        const sortingChanged = ((!sort || !this._sort) && sort !== this._sort)
-            || (sort && this._sort && !objectsAreEquals(this._sort, sort));
-        if (sortingChanged) {
-            this._sort = sort;
-            if (this.config.sortChange) {
-                this.config.sortChange(data, sort);
-            }
-        }
-        if (this.config.change) {
-            this.config.change(data, sort);
-        }
-        this._updateChipsVisibility();
-        // visibility for actions can depend on filters state
-        this._actions.updateActionsVisibility();
-    }
-    /**
-     * Update filter actions config
-     *
-     * @param actions
-     */
-    updateActions(actions) {
-        this._actions.initActions(actions);
-    }
-    /**
-     * Show "Filters" button
-     */
-    showFiltersBtn() {
-        this._filtersBtnVisible$.next(true);
-    }
-    /**
-     * Hide "Filters" button
-     */
-    hideFiltersBtn() {
-        this._filtersBtnVisible$.next(false);
-    }
-    /**
-     * Show "Keyword" field if it present
-     */
-    showKeywordField() {
-        this._keywordVisible$.next(true);
-    }
-    /**
-     * Hide "Keyword" field if it present
-     */
-    hideKeywordField() {
-        this._keywordVisible$.next(false);
-    }
-    /**
-     * Go through actions and check show() callback and update visible actions
-     */
-    updateActionsVisibility() {
-        this._actions.updateActionsVisibility();
-    }
-    /**
-     * Go through actions and check disabled() callback and update disabled state
-     */
-    updateDisabledState() {
-        this._actions.updateDisabledState();
-    }
-    setItems(items) {
-        this._filterItems.destroyItems();
-        this.config.items = items;
-        this._filterItems.setConfig(this._config);
-        this._externalParams.initItems();
-        this._syncSearchInputWithKeyword();
-    }
-    keywordChange(keyword) {
-        this._keyword$.next(keyword);
-    }
-    updateSortings(items) {
-        this._filterItems.updateSortingItemsValues(items);
-    }
-    _initFilterWithConfig(config) {
-        if (this.config) {
-            this._filterItems.destroyItems();
-        }
-        config = Object.assign(Object.assign({}, (this._defaultConfig || {})), config);
-        this._config = new FsFilterConfig(config);
-        this._actions.setConfig(this._config);
-        this._filterItems.setConfig(this._config);
-        this._externalParams.setConfig(this._config);
-        this._syncSearchInputWithKeyword();
-        if (this.config.reloadWhenConfigChanged) {
-            this.change();
-        }
-    }
-    _destroyFilterDrawer() {
-        this._filterOverlay.close();
-    }
-    _updateWindowWidth() {
-        this.windowDesktop = window.innerWidth > 1200;
-    }
-    _listenEscButton() {
-        this._zone.runOutsideAngular(() => {
-            fromEvent(window, 'keyup')
-                .pipe(filter$1((event) => event.code === 'Escape'), takeUntil(this.closed), takeUntil(this._destroy$))
-                .subscribe(() => {
-                this._zone.run(() => {
-                    this.changeVisibility(false);
-                });
-            });
-        });
-    }
-    _listenWindowResize() {
-        this._zone.runOutsideAngular(() => {
-            fromEvent(window, 'resize')
-                .pipe(debounceTime(100), takeUntil(this._destroy$))
-                .subscribe(() => {
-                this._zone.run(() => {
-                    this._updateWindowWidth();
-                });
-            });
-        });
-    }
-    _initAutoReload() {
-        if (this.config.autoReload) {
-            interval(this.config.autoReload.seconds * 1000)
-                .pipe(filter$1(() => this.autoReload), takeUntil(this._destroy$))
-                .subscribe(() => {
-                this.reload(null);
-            });
-        }
-    }
-    _listenInputChanges() {
-        this._keyword$
-            .pipe(debounceTime(200), distinctUntilChanged(), takeUntil(this._destroy$))
-            .subscribe((value) => {
-            const keywordItem = this._filterItems.keywordItem;
-            keywordItem.model = value;
-            this.change();
-        });
-    }
-    _syncSearchInputWithKeyword() {
-        const keywordItem = this._filterItems.keywordItem;
-        if (keywordItem) {
-            this.keyword = keywordItem.model;
-            this.searchPlaceholder = keywordItem.label || 'Search';
-        }
-    }
-    _listenInternalItemsChange() {
-        this._filterItems
-            .itemsChange$
-            .pipe(takeUntil(this._destroy$))
-            .subscribe(() => {
-            this.change();
-        });
-    }
-    _initOverlay() {
-        this._filterOverlay.setClearFn(this.clear.bind(this));
-        this._filterOverlay.setDoneFn(this.hide.bind(this));
-    }
-    // We may need some time to recieve external params and after that ready can be emitted
-    _listenWhenFilterReady() {
-        combineLatest([
-            this._externalParams.pending$,
-            this.itemsReady$,
-        ])
-            .pipe(filter$1(([pendingParams, itemsReady]) => !pendingParams && itemsReady), takeUntil(this._destroy$))
-            .subscribe(() => {
-            this.init();
-            this._syncSearchInputWithKeyword();
-            this.ready.emit();
-        });
-    }
-    _updateChipsVisibility() {
-        const hasFilterChips = this._filterItems.items
-            .some((item) => {
-            return item.isChipVisible;
-        });
-        this._hasFilterChips$.next(hasFilterChips);
-    }
-}
-FilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FilterComponent, deps: [{ token: FS_FILTER_CONFIG, optional: true }, { token: FsFilterOverlayService }, { token: i0.NgZone }, { token: ExternalParamsController }, { token: FsFilterItemsStore }, { token: ActionsController }, { token: SavedFiltersController }, { token: ExternalParamsController }], target: i0.ɵɵFactoryTarget.Component });
-FilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FilterComponent, selector: "fs-filter", inputs: { setConfig: ["config", "setConfig"], setFilter: ["filter", "setFilter"], showSortBy: "showSortBy", showFilterInput: "showFilterInput" }, outputs: { closed: "closed", opened: "opened", ready: "ready" }, host: { properties: { "class.filters-open": "this.showFilterMenu", "class.window-desktop": "this.windowDesktop", "class.fs-filter": "this.fsFilterClass", "class.has-keyword": "this.hasKeyword" } }, providers: [
-        FsFilterOverlayService,
-        ExternalParamsController,
-        PersistanceParamsController,
-        QueryParamsController,
-        FocusControllerService,
-        FsFilterItemsStore,
-        SavedFiltersController,
-        ActionsController,
-    ], queries: [{ propertyName: "statusBar", first: true, predicate: FilterStatusBarDirective, descendants: true }], viewQueries: [{ propertyName: "keywordMatInput", first: true, predicate: ["keywordMatInput"], descendants: true, read: MatInput }, { propertyName: "reloadEl", first: true, predicate: ["reloadEl"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"filter-container\">\n  <div class=\"filter-inner-container\">\n    <ng-container *ngIf=\"!hasKeyword; else filterKeyword\">\n      <div>\n        <ng-container *ngTemplateOutlet=\"filterStatusBarChips\"></ng-container>\n      </div>\n    </ng-container>\n\n    <ng-container [ngTemplateOutlet]=\"filterToolbar\"></ng-container>\n    <ng-container [ngTemplateOutlet]=\"filterActions\"></ng-container>\n  </div>\n\n  <ng-container *ngIf=\"hasKeyword\">\n    <ng-container *ngTemplateOutlet=\"filterStatusBarChips\"></ng-container>\n  </ng-container>\n</div>\n\n<ng-template #filterStatusBarChips>\n  <ng-container *ngIf=\"statusBar\">\n    <div class=\"filter-status-container\" [ngClass]=\"{ 'has-status': !!filterStatus.textContent }\">\n      <div class=\"filter-status\" #filterStatus>\n        <ng-container *ngTemplateOutlet=\"statusBar.templateRef\"></ng-container>\n      </div>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"config.chips && hasFilterChips$ | async\">\n    <fs-filter-chips\n      class=\"filter-chips\"\n      [filters]=\"items\">\n    </fs-filter-chips>\n  </ng-container>\n</ng-template>\n\n<ng-template #filterKeyword>\n  <div class=\"filter-keyword\">\n    <ng-container *ngIf=\"(keywordVisible$ | async) && !keywordItem?.hide \">\n      <mat-form-field\n          [floatLabel]=\"'never'\"\n          class=\"form-field-padless\"\n          [ngClass]=\"search\"\n          appearance=\"outline\">\n        <span matPrefix>\n          <mat-icon matPrefix>search</mat-icon>\n        </span>\n        <input\n          #keywordMatInput\n          matInput\n          [(ngModel)]=\"keyword\"\n          (ngModelChange)=\"keywordChange($event)\"\n          name=\"filter-input\"\n          [fsClear]=\"true\"\n          [placeholder]=\"searchPlaceholder\">\n      </mat-form-field>\n    </ng-container>\n  </div>\n</ng-template>\n\n<ng-template #filterActions>\n  <div class=\"filter-actions\">\n    <fs-filter-actions\n      *ngIf=\"actionsVisible$ | async\"\n      [actions]=\"actions$ | async\"\n      [kebabActions]=\"menuActions$ | async\">\n    </fs-filter-actions>\n  </div>\n</ng-template>\n\n<ng-template #filterToolbar>\n  <div class=\"filter-toobar\">\n    <ng-container *ngIf=\"filtersBtnVisible$ | async\">\n      <ng-container *ngIf=\"hasVisibleItemOrSorting\">\n        <a\n            mat-button\n            class=\"filters-button\"\n            [ngClass]=\"{\n              'mat-raised-button': config.button.style === 'raised' && config.button.label,\n              'mat-flat-button': config.button.style === 'flat' && config.button.label,\n              'mat-stroked-button': config.button.style === 'stroked' && config.button.label,\n              'mat-button': config.button.style === 'basic' && config.button.label,\n              'mat-icon-button': config.button.style === 'icon' || !config.button.label\n            }\"\n            (click)=\"changeVisibilityClick(!showFilterMenu, $event)\"\n            [color]=\"config.button.color\">\n          <mat-icon *ngIf=\"config.button.icon\">{{config.button.icon}}</mat-icon>\n          {{ config.button.label }}\n        </a>\n      </ng-container>\n    </ng-container>    \n    <ng-container *ngIf=\"config.reload\">\n      <a\n          mat-icon-button\n          (click)=\"reload($event)\"\n          class=\"reload\">\n        <mat-icon #reloadEl>refresh</mat-icon>\n      </a>\n    </ng-container>\n    <ng-container *ngIf=\"config.autoReload\">\n      <mat-slide-toggle \n          name=\"autoReload\" \n          class=\"auto-reload\"\n          [(ngModel)]=\"autoReload\">\n        Auto refresh\n      </mat-slide-toggle>\n    </ng-container>\n  </div>\n</ng-template>\n", styles: [":host{margin-bottom:20px;display:block}:host.has-keyword .filter-status-container.has-status{margin-top:4px}:host:not(.has-keyword) .filter-status-container:not(.has-status)+fs-filter-chips{margin-top:0}:host:not(.has-keyword) .filter-inner-container{display:flex}:host:not(.has-keyword) .filter-toobar{justify-content:flex-end}.filter-status-container{flex-grow:1;display:flex;justify-content:center;flex-direction:column;align-self:flex-end}.filter-status-container .filter-status{overflow:hidden;text-overflow:ellipsis;line-height:17px}.filter-container{width:100%}.filter-inner-container{flex-direction:row;box-sizing:border-box;display:flex;position:relative;align-items:center}.filter-inner-container .filter-keyword{flex-direction:row;box-sizing:border-box;display:flex;align-items:center;min-width:0}.filter-inner-container .filter-keyword mat-form-field{max-width:100%;min-width:100px;margin-right:6px}.filter-inner-container .filter-keyword mat-form-field .mat-form-field-wrapper{margin-bottom:0}.filter-inner-container .filter-keyword mat-form-field .mat-form-field-prefix .mat-icon{font-size:22px;color:#626262}.filter-inner-container .filter-keyword mat-form-field .mat-form-field-infix{width:250px}.filter-inner-container .filter-keyword mat-form-field .mat-form-field-prefix,.filter-inner-container .filter-keyword mat-form-field .mat-form-field-suffix{top:.45em}.filter-inner-container .filter-keyword .mat-form-field-suffix{display:flex}.filter-inner-container .filter-keyword .mat-form-field-suffix .mat-icon-button{height:24px;width:24px}.filter-actions{display:flex;align-items:center}.filter-toobar{flex:1;white-space:nowrap;display:flex;align-items:center}.filter-toobar .reload{margin-left:-6px}.results{min-height:90px;position:relative;overflow-x:auto;overflow-y:hidden}fs-filter-chips{margin-top:4px;display:block}@media screen and (min-width: 599px){.filter-actions{margin-left:10px}.filters-button+fs-filter-actions:not(:empty){margin-left:5px}}@media screen and (max-width: 600px){.filter-actions{margin-left:5px}.filter-actions .filters-button{font-size:0;padding:0;min-width:unset;width:36px;height:36px;border-radius:50%;box-shadow:unset!important}}@media screen and (min-width: 1200px){html.fs-filter-open body{margin-right:350px}.fs-filter-backdrop{display:none}}html.fs-filter-open{scrollbar-width:none}:host ::ng-deep .auto-reload.mat-checked .mat-slide-toggle-thumb-container{transform:translate3d(12px,0,0)}:host ::ng-deep .auto-reload:not(.mat-checked) .mat-slide-toggle-content{color:#ccc}:host ::ng-deep .auto-reload .mat-slide-toggle-thumb,:host ::ng-deep .auto-reload .mat-slide-toggle-thumb-container{height:15px;width:15px}:host ::ng-deep .auto-reload .mat-slide-toggle-content{font-size:90%}:host ::ng-deep .auto-reload .mat-slide-toggle-bar{width:26px;height:10px;border-radius:10px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatPrefix, selector: "[matPrefix]" }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i3$1.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"] }, { kind: "component", type: i12.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matSlideToggle"] }, { kind: "directive", type: i9.FsFormNoFsValidatorsDirective, selector: "[ngModel]:not([required]):not([fsFormRequired]):not([fsFormCompare]):not([fsFormDateRange]):not([fsFormEmail]):not([fsFormEmails]):not([fsFormFunction]):not([fsFormGreater]):not([fsFormGreaterEqual]):not([fsFormInteger]):not([fsFormLesser]):not([fsFormMax]):not([fsFormMaxLength]):not([fsFormMin]):not([fsFormMinLength]):not([fsFormNumeric]):not([fsFormPattern]):not([fsFormPhone]):not([fsFormUrl]):not([validate])" }, { kind: "directive", type: i9.FsButtonDirective, selector: "[mat-raised-button]:not([fsFormButtonStandalone]),[mat-button]:not([fsFormButtonStandalone]),[mat-flat-button]:not([fsFormButtonStandalone]),[mat-stroked-button]:not([fsFormButtonStandalone])", inputs: ["name", "dirtySubmit", "form"] }, { kind: "component", type: i14.FsClearComponent, selector: "[fsClear]", inputs: ["ngModel", "fsClear"], outputs: ["ngModelChange", "cleared"] }, { kind: "component", type: FsFilterChipsComponent, selector: "fs-filter-chips", inputs: ["filters"] }, { kind: "component", type: FsFilterActionsComponent, selector: "fs-filter-actions", inputs: ["kebabActions", "actions"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FilterComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'fs-filter', providers: [
-                        FsFilterOverlayService,
-                        ExternalParamsController,
-                        PersistanceParamsController,
-                        QueryParamsController,
-                        FocusControllerService,
-                        FsFilterItemsStore,
-                        SavedFiltersController,
-                        ActionsController,
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"filter-container\">\n  <div class=\"filter-inner-container\">\n    <ng-container *ngIf=\"!hasKeyword; else filterKeyword\">\n      <div>\n        <ng-container *ngTemplateOutlet=\"filterStatusBarChips\"></ng-container>\n      </div>\n    </ng-container>\n\n    <ng-container [ngTemplateOutlet]=\"filterToolbar\"></ng-container>\n    <ng-container [ngTemplateOutlet]=\"filterActions\"></ng-container>\n  </div>\n\n  <ng-container *ngIf=\"hasKeyword\">\n    <ng-container *ngTemplateOutlet=\"filterStatusBarChips\"></ng-container>\n  </ng-container>\n</div>\n\n<ng-template #filterStatusBarChips>\n  <ng-container *ngIf=\"statusBar\">\n    <div class=\"filter-status-container\" [ngClass]=\"{ 'has-status': !!filterStatus.textContent }\">\n      <div class=\"filter-status\" #filterStatus>\n        <ng-container *ngTemplateOutlet=\"statusBar.templateRef\"></ng-container>\n      </div>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"config.chips && hasFilterChips$ | async\">\n    <fs-filter-chips\n      class=\"filter-chips\"\n      [filters]=\"items\">\n    </fs-filter-chips>\n  </ng-container>\n</ng-template>\n\n<ng-template #filterKeyword>\n  <div class=\"filter-keyword\">\n    <ng-container *ngIf=\"(keywordVisible$ | async) && !keywordItem?.hide \">\n      <mat-form-field\n          [floatLabel]=\"'never'\"\n          class=\"form-field-padless\"\n          [ngClass]=\"search\"\n          appearance=\"outline\">\n        <span matPrefix>\n          <mat-icon matPrefix>search</mat-icon>\n        </span>\n        <input\n          #keywordMatInput\n          matInput\n          [(ngModel)]=\"keyword\"\n          (ngModelChange)=\"keywordChange($event)\"\n          name=\"filter-input\"\n          [fsClear]=\"true\"\n          [placeholder]=\"searchPlaceholder\">\n      </mat-form-field>\n    </ng-container>\n  </div>\n</ng-template>\n\n<ng-template #filterActions>\n  <div class=\"filter-actions\">\n    <fs-filter-actions\n      *ngIf=\"actionsVisible$ | async\"\n      [actions]=\"actions$ | async\"\n      [kebabActions]=\"menuActions$ | async\">\n    </fs-filter-actions>\n  </div>\n</ng-template>\n\n<ng-template #filterToolbar>\n  <div class=\"filter-toobar\">\n    <ng-container *ngIf=\"filtersBtnVisible$ | async\">\n      <ng-container *ngIf=\"hasVisibleItemOrSorting\">\n        <a\n            mat-button\n            class=\"filters-button\"\n            [ngClass]=\"{\n              'mat-raised-button': config.button.style === 'raised' && config.button.label,\n              'mat-flat-button': config.button.style === 'flat' && config.button.label,\n              'mat-stroked-button': config.button.style === 'stroked' && config.button.label,\n              'mat-button': config.button.style === 'basic' && config.button.label,\n              'mat-icon-button': config.button.style === 'icon' || !config.button.label\n            }\"\n            (click)=\"changeVisibilityClick(!showFilterMenu, $event)\"\n            [color]=\"config.button.color\">\n          <mat-icon *ngIf=\"config.button.icon\">{{config.button.icon}}</mat-icon>\n          {{ config.button.label }}\n        </a>\n      </ng-container>\n    </ng-container>    \n    <ng-container *ngIf=\"config.reload\">\n      <a\n          mat-icon-button\n          (click)=\"reload($event)\"\n          class=\"reload\">\n        <mat-icon #reloadEl>refresh</mat-icon>\n      </a>\n    </ng-container>\n    <ng-container *ngIf=\"config.autoReload\">\n      <mat-slide-toggle \n          name=\"autoReload\" \n          class=\"auto-reload\"\n          [(ngModel)]=\"autoReload\">\n        Auto refresh\n      </mat-slide-toggle>\n    </ng-container>\n  </div>\n</ng-template>\n", styles: [":host{margin-bottom:20px;display:block}:host.has-keyword .filter-status-container.has-status{margin-top:4px}:host:not(.has-keyword) .filter-status-container:not(.has-status)+fs-filter-chips{margin-top:0}:host:not(.has-keyword) .filter-inner-container{display:flex}:host:not(.has-keyword) .filter-toobar{justify-content:flex-end}.filter-status-container{flex-grow:1;display:flex;justify-content:center;flex-direction:column;align-self:flex-end}.filter-status-container .filter-status{overflow:hidden;text-overflow:ellipsis;line-height:17px}.filter-container{width:100%}.filter-inner-container{flex-direction:row;box-sizing:border-box;display:flex;position:relative;align-items:center}.filter-inner-container .filter-keyword{flex-direction:row;box-sizing:border-box;display:flex;align-items:center;min-width:0}.filter-inner-container .filter-keyword mat-form-field{max-width:100%;min-width:100px;margin-right:6px}.filter-inner-container .filter-keyword mat-form-field .mat-form-field-wrapper{margin-bottom:0}.filter-inner-container .filter-keyword mat-form-field .mat-form-field-prefix .mat-icon{font-size:22px;color:#626262}.filter-inner-container .filter-keyword mat-form-field .mat-form-field-infix{width:250px}.filter-inner-container .filter-keyword mat-form-field .mat-form-field-prefix,.filter-inner-container .filter-keyword mat-form-field .mat-form-field-suffix{top:.45em}.filter-inner-container .filter-keyword .mat-form-field-suffix{display:flex}.filter-inner-container .filter-keyword .mat-form-field-suffix .mat-icon-button{height:24px;width:24px}.filter-actions{display:flex;align-items:center}.filter-toobar{flex:1;white-space:nowrap;display:flex;align-items:center}.filter-toobar .reload{margin-left:-6px}.results{min-height:90px;position:relative;overflow-x:auto;overflow-y:hidden}fs-filter-chips{margin-top:4px;display:block}@media screen and (min-width: 599px){.filter-actions{margin-left:10px}.filters-button+fs-filter-actions:not(:empty){margin-left:5px}}@media screen and (max-width: 600px){.filter-actions{margin-left:5px}.filter-actions .filters-button{font-size:0;padding:0;min-width:unset;width:36px;height:36px;border-radius:50%;box-shadow:unset!important}}@media screen and (min-width: 1200px){html.fs-filter-open body{margin-right:350px}.fs-filter-backdrop{display:none}}html.fs-filter-open{scrollbar-width:none}:host ::ng-deep .auto-reload.mat-checked .mat-slide-toggle-thumb-container{transform:translate3d(12px,0,0)}:host ::ng-deep .auto-reload:not(.mat-checked) .mat-slide-toggle-content{color:#ccc}:host ::ng-deep .auto-reload .mat-slide-toggle-thumb,:host ::ng-deep .auto-reload .mat-slide-toggle-thumb-container{height:15px;width:15px}:host ::ng-deep .auto-reload .mat-slide-toggle-content{font-size:90%}:host ::ng-deep .auto-reload .mat-slide-toggle-bar{width:26px;height:10px;border-radius:10px}\n"] }]
-        }], ctorParameters: function () {
-        return [{ type: FsFilterConfig, decorators: [{
-                        type: Optional
-                    }, {
-                        type: Inject,
-                        args: [FS_FILTER_CONFIG]
-                    }] }, { type: FsFilterOverlayService }, { type: i0.NgZone }, { type: ExternalParamsController }, { type: FsFilterItemsStore }, { type: ActionsController }, { type: SavedFiltersController }, { type: ExternalParamsController }];
-    }, propDecorators: { setConfig: [{
-                type: Input,
-                args: ['config']
-            }], setFilter: [{
-                type: Input,
-                args: ['filter']
-            }], showSortBy: [{
-                type: Input
-            }], showFilterInput: [{
-                type: Input
-            }], closed: [{
-                type: Output
-            }], opened: [{
-                type: Output
-            }], ready: [{
-                type: Output
-            }], statusBar: [{
-                type: ContentChild,
-                args: [FilterStatusBarDirective]
-            }], keywordMatInput: [{
-                type: ViewChild,
-                args: ['keywordMatInput', { read: MatInput }]
-            }], reloadEl: [{
-                type: ViewChild,
-                args: ['reloadEl', { read: ElementRef }]
-            }], showFilterMenu: [{
-                type: HostBinding,
-                args: ['class.filters-open']
-            }], windowDesktop: [{
-                type: HostBinding,
-                args: ['class.window-desktop']
-            }], fsFilterClass: [{
-                type: HostBinding,
-                args: ['class.fs-filter']
-            }], hasKeyword: [{
-                type: HostBinding,
-                args: ['class.has-keyword']
-            }] } });
-
-class SelectBackdropComponent {
-    constructor() { }
-}
-SelectBackdropComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectBackdropComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SelectBackdropComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SelectBackdropComponent, selector: "filter-item-select-backdrop", ngImport: i0, template: "", styles: [":host{position:absolute;z-index:1002;inset:0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SelectBackdropComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'filter-item-select-backdrop', changeDetection: ChangeDetectionStrategy.OnPush, template: "", styles: [":host{position:absolute;z-index:1002;inset:0}\n"] }]
-        }], ctorParameters: function () { return []; } });
-
-class FsFilterSavedFilterManageComponent {
-    constructor(data, _cdRef) {
-        this.data = data;
-        this._cdRef = _cdRef;
-        this._savedFiltersController = this.data.savedFiltersController;
-        this.savedFilters = [...this._savedFiltersController.savedFilters];
-    }
-    remove(savedFilter) {
-        this._savedFiltersController.delete(savedFilter)
-            .subscribe(() => {
-            this.savedFilters = [...this._savedFiltersController.savedFilters];
-            this._cdRef.markForCheck();
-        });
-    }
-    drop(event) {
-        moveItemInArray(this.savedFilters, event.previousIndex, event.currentIndex);
-        this._savedFiltersController.order(this.savedFilters)
-            .subscribe();
-    }
-}
-FsFilterSavedFilterManageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterSavedFilterManageComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-FsFilterSavedFilterManageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FsFilterSavedFilterManageComponent, selector: "ng-component", ngImport: i0, template: "<h1 mat-dialog-title>\n  Manage saved filters\n</h1>\n<div mat-dialog-content>\n  <div\n      cdkDropList \n      [cdkDropListData]=\"savedFilters\"\n      cdkDropListOrientation=\"vertical\"\n      (cdkDropListDropped)=\"drop($event)\">  \n    <ng-container \n        *ngFor=\"let savedFilter of savedFilters\">\n      <div class=\"chip-container\">\n        <fs-chip \n            class=\"saved-filter-manage-chip\"\n            cdkDrag\n            (removed)=\"remove(savedFilter)\">\n          {{savedFilter.name}}\n        </fs-chip>\n      </div>\n    </ng-container>\n  </div>\n</div>\n<div mat-dialog-actions>\n  <button \n      mat-button\n      color=\"primary\"\n      type=\"button\"\n      [mat-dialog-close]=\"null\">\n    Done\n  </button>\n</div>\n", styles: [".chip-container{padding:5px 0}::ng-deep fs-chip.saved-filter-manage-chip{cursor:move;width:100%;box-sizing:border-box}::ng-deep fs-chip.saved-filter-manage-chip .fs-chip-content{flex:1}.cdk-drag-preview{box-sizing:border-box}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.example-box:last-child{border:none}.example-list.cdk-drop-list-dragging .example-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$3.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2$3.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: i3$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"] }, { kind: "directive", type: i1$2.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1$2.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$2.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i1$2.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "component", type: i3$2.FsChipComponent, selector: "fs-chip", inputs: ["selectable", "removable", "value", "icon", "image", "selected", "size", "backgroundColor", "borderColor", "color", "outlined"], outputs: ["selectedToggled", "removed"] }, { kind: "directive", type: i9.FsButtonDirective, selector: "[mat-raised-button]:not([fsFormButtonStandalone]),[mat-button]:not([fsFormButtonStandalone]),[mat-flat-button]:not([fsFormButtonStandalone]),[mat-stroked-button]:not([fsFormButtonStandalone])", inputs: ["name", "dirtySubmit", "form"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterSavedFilterManageComponent, decorators: [{
-            type: Component,
-            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, template: "<h1 mat-dialog-title>\n  Manage saved filters\n</h1>\n<div mat-dialog-content>\n  <div\n      cdkDropList \n      [cdkDropListData]=\"savedFilters\"\n      cdkDropListOrientation=\"vertical\"\n      (cdkDropListDropped)=\"drop($event)\">  \n    <ng-container \n        *ngFor=\"let savedFilter of savedFilters\">\n      <div class=\"chip-container\">\n        <fs-chip \n            class=\"saved-filter-manage-chip\"\n            cdkDrag\n            (removed)=\"remove(savedFilter)\">\n          {{savedFilter.name}}\n        </fs-chip>\n      </div>\n    </ng-container>\n  </div>\n</div>\n<div mat-dialog-actions>\n  <button \n      mat-button\n      color=\"primary\"\n      type=\"button\"\n      [mat-dialog-close]=\"null\">\n    Done\n  </button>\n</div>\n", styles: [".chip-container{padding:5px 0}::ng-deep fs-chip.saved-filter-manage-chip{cursor:move;width:100%;box-sizing:border-box}::ng-deep fs-chip.saved-filter-manage-chip .fs-chip-content{flex:1}.cdk-drag-preview{box-sizing:border-box}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.example-box:last-child{border:none}.example-list.cdk-drop-list-dragging .example-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}\n"] }]
-        }], ctorParameters: function () {
-        return [{ type: undefined, decorators: [{
-                        type: Inject,
-                        args: [MAT_DIALOG_DATA]
-                    }] }, { type: i0.ChangeDetectorRef }];
-    } });
-
-class FsSavedFiltersMenuComponent {
-    constructor(_itemsStore, _externalParams, _savedFilters, _dialog) {
-        this._itemsStore = _itemsStore;
-        this._externalParams = _externalParams;
-        this._savedFilters = _savedFilters;
-        this._dialog = _dialog;
-        this.clear = new EventEmitter();
-    }
-    get filters$() {
-        return this._savedFilters.savedFilters$;
-    }
-    get activeFilter$() {
-        return this._savedFilters.activeFilter$;
-    }
-    selectFilter(savedFilter) {
-        this._externalParams.setActiveSavedFilter(savedFilter);
-    }
-    removeActiveFilter() {
-        this._itemsStore.filtersClear();
-        this._externalParams.setActiveSavedFilter(null);
-        this.clear.emit();
-    }
-    saveFilters() {
-        this._externalParams
-            .savedFiltersController
-            .openSavedFilterEditDialog();
-    }
-    manageFilters() {
-        this._dialog.open(FsFilterSavedFilterManageComponent, {
-            data: {
-                savedFiltersController: this._savedFilters,
-            },
-        });
-    }
-}
-FsSavedFiltersMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsSavedFiltersMenuComponent, deps: [{ token: FsFilterItemsStore }, { token: ExternalParamsController }, { token: SavedFiltersController }, { token: i1$2.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
-FsSavedFiltersMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FsSavedFiltersMenuComponent, selector: "fs-filter-saved-filters-menu", outputs: { clear: "clear" }, ngImport: i0, template: "<a [fsMenuTriggerFor]=\"menu\" class=\"selector\">{{ (activeFilter$ | async)?.name || 'None' }}</a>\n\n<fs-menu #menu>\n  <ng-template fs-menu-item (click)=\"removeActiveFilter()\">\n    None\n  </ng-template>\n  <ng-container *ngIf=\"(filters$ | async).length !==0\">\n    <ng-container *ngFor=\"let filter of filters$ | async\">\n      <ng-template fs-menu-item (click)=\"selectFilter(filter)\">\n        {{ filter.name }}\n      </ng-template>\n    </ng-container>\n    <ng-template fs-menu-divider-item></ng-template>\n  </ng-container>\n\n  <ng-template \n      fs-menu-item \n      (click)=\"saveFilters()\">\n    Save\n  </ng-template>\n  \n  <ng-template \n      fs-menu-item \n      (click)=\"manageFilters()\">\n    Manage\n  </ng-template>\n</fs-menu>\n", styles: [":host ::ng-deep .selector{cursor:pointer}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6$1.FsMenuComponent, selector: "fs-menu", inputs: ["class", "buttonClass", "buttonType", "buttonColor"], outputs: ["opened", "closed"] }, { kind: "directive", type: i6$1.FsMenuItemDirective, selector: "fs-menu-group,[fs-menu-item]" }, { kind: "directive", type: i6$1.FsMenuTriggerDirective, selector: "[fsMenuTriggerFor]", inputs: ["fsMenuTriggerFor"] }, { kind: "directive", type: i6$1.FsMenuDividerItemDirective, selector: "[fs-menu-divider-item]" }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsSavedFiltersMenuComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'fs-filter-saved-filters-menu', changeDetection: ChangeDetectionStrategy.OnPush, template: "<a [fsMenuTriggerFor]=\"menu\" class=\"selector\">{{ (activeFilter$ | async)?.name || 'None' }}</a>\n\n<fs-menu #menu>\n  <ng-template fs-menu-item (click)=\"removeActiveFilter()\">\n    None\n  </ng-template>\n  <ng-container *ngIf=\"(filters$ | async).length !==0\">\n    <ng-container *ngFor=\"let filter of filters$ | async\">\n      <ng-template fs-menu-item (click)=\"selectFilter(filter)\">\n        {{ filter.name }}\n      </ng-template>\n    </ng-container>\n    <ng-template fs-menu-divider-item></ng-template>\n  </ng-container>\n\n  <ng-template \n      fs-menu-item \n      (click)=\"saveFilters()\">\n    Save\n  </ng-template>\n  \n  <ng-template \n      fs-menu-item \n      (click)=\"manageFilters()\">\n    Manage\n  </ng-template>\n</fs-menu>\n", styles: [":host ::ng-deep .selector{cursor:pointer}\n"] }]
-        }], ctorParameters: function () { return [{ type: FsFilterItemsStore }, { type: ExternalParamsController }, { type: SavedFiltersController }, { type: i1$2.MatDialog }]; }, propDecorators: { clear: [{
-                type: Output
-            }] } });
-
-class FsFilterModule {
-    static forRoot(config = {}) {
-        return {
-            ngModule: FsFilterModule,
-            providers: [
-                {
-                    provide: FS_FILTER_CONFIG,
-                    useValue: Object.assign({ button: {
-                            label: '',
-                        } }, config),
-                },
-            ],
-        };
-    }
-}
-FsFilterModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-FsFilterModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: FsFilterModule, declarations: [BaseItemComponent,
-        FilterComponent,
-        FilterItemComponent,
-        FsFilterChipsComponent,
-        SelectComponent,
-        SelectGroupsComponent,
-        SelectSimpleComponent,
-        SelectMultipleComponent,
-        ChipsComponent,
-        TextComponent,
-        WeekComponent,
-        RangeComponent,
-        AutocompleteComponent,
-        AutocompletechipsComponent,
-        DateComponent,
-        DateRangeComponent,
-        CheckboxComponent,
-        FilterDrawerComponent,
-        SelectBackdropComponent,
-        FsFilterChipComponent,
-        FsFilterChipContentComponent,
-        FsFilterDrawerActionsComponent,
-        FsFilterSavedFilterEditComponent,
-        FsSavedFiltersMenuComponent,
-        FsFilterActionsComponent,
-        FsFilterActionButtonComponent,
-        FsFilterActionKebabActionsComponent,
-        FsFilterSavedFilterManageComponent,
-        FilterStatusBarDirective,
-        FocusToItemDirective,
-        // Pipes
-        FsFilterIsolateValues], imports: [CommonModule,
-        RouterModule,
-        FormsModule,
-        ReactiveFormsModule,
-        DragDropModule,
-        MatIconModule,
-        MatInputModule,
-        MatSelectModule,
-        MatChipsModule,
-        MatCheckboxModule,
-        MatAutocompleteModule,
-        MatButtonModule,
-        MatDialogModule,
-        MatTooltipModule,
-        MatSlideToggleModule,
-        FsChipModule,
-        FsCommonModule,
-        FsStoreModule,
-        FsDatePickerModule,
-        FsLabelModule,
-        FsAutocompleteModule,
-        FsAutocompleteChipsModule,
-        FsScrollModule,
-        FsMenuModule,
-        FsSkeletonModule,
-        FsFormModule,
-        FsFileModule,
-        FsSelectButtonModule,
-        FsClearModule,
-        FsPopoverModule,
-        PortalModule], exports: [FilterComponent,
-        FilterStatusBarDirective,
-        FsSavedFiltersMenuComponent] });
-FsFilterModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterModule, providers: [
-        FsStore,
-    ], imports: [CommonModule,
-        RouterModule,
-        FormsModule,
-        ReactiveFormsModule,
-        DragDropModule,
-        MatIconModule,
-        MatInputModule,
-        MatSelectModule,
-        MatChipsModule,
-        MatCheckboxModule,
-        MatAutocompleteModule,
-        MatButtonModule,
-        MatDialogModule,
-        MatTooltipModule,
-        MatSlideToggleModule,
-        FsChipModule,
-        FsCommonModule,
-        FsStoreModule,
-        FsDatePickerModule,
-        FsLabelModule,
-        FsAutocompleteModule,
-        FsAutocompleteChipsModule,
-        FsScrollModule,
-        FsMenuModule,
-        FsSkeletonModule,
-        FsFormModule,
-        FsFileModule,
-        FsSelectButtonModule,
-        FsClearModule,
-        FsPopoverModule,
-        PortalModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FsFilterModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [
-                        CommonModule,
-                        RouterModule,
-                        FormsModule,
-                        ReactiveFormsModule,
-                        DragDropModule,
-                        MatIconModule,
-                        MatInputModule,
-                        MatSelectModule,
-                        MatChipsModule,
-                        MatCheckboxModule,
-                        MatAutocompleteModule,
-                        MatButtonModule,
-                        MatDialogModule,
-                        MatTooltipModule,
-                        MatSlideToggleModule,
-                        FsChipModule,
-                        FsCommonModule,
-                        FsStoreModule,
-                        FsDatePickerModule,
-                        FsLabelModule,
-                        FsAutocompleteModule,
-                        FsAutocompleteChipsModule,
-                        FsScrollModule,
-                        FsMenuModule,
-                        FsSkeletonModule,
-                        FsFormModule,
-                        FsFileModule,
-                        FsSelectButtonModule,
-                        FsClearModule,
-                        FsPopoverModule,
-                        PortalModule,
-                    ],
-                    declarations: [
-                        BaseItemComponent,
-                        FilterComponent,
-                        FilterItemComponent,
-                        FsFilterChipsComponent,
-                        SelectComponent,
-                        SelectGroupsComponent,
-                        SelectSimpleComponent,
-                        SelectMultipleComponent,
-                        ChipsComponent,
-                        TextComponent,
-                        WeekComponent,
-                        RangeComponent,
-                        AutocompleteComponent,
-                        AutocompletechipsComponent,
-                        DateComponent,
-                        DateRangeComponent,
-                        CheckboxComponent,
-                        FilterDrawerComponent,
-                        SelectBackdropComponent,
-                        FsFilterChipComponent,
-                        FsFilterChipContentComponent,
-                        FsFilterDrawerActionsComponent,
-                        FsFilterSavedFilterEditComponent,
-                        FsSavedFiltersMenuComponent,
-                        FsFilterActionsComponent,
-                        FsFilterActionButtonComponent,
-                        FsFilterActionKebabActionsComponent,
-                        FsFilterSavedFilterManageComponent,
-                        FilterStatusBarDirective,
-                        FocusToItemDirective,
-                        // Pipes
-                        FsFilterIsolateValues,
-                    ],
-                    providers: [
-                        FsStore,
-                    ],
-                    exports: [
-                        FilterComponent,
-                        FilterStatusBarDirective,
-                        FsSavedFiltersMenuComponent,
-                    ],
-                }]
-        }] });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { ActionMode, ActionType, AutocompleteChipsItem, AutocompleteItem, BaseItem, ButtonStyle, CheckboxItem, ChipsItem, DateItem, DateRangeItem, DateTimeItem, DateTimeRangeItem, ExternalParamsController, FS_FILTER_CONFIG, FilterComponent, FilterItemComponent, FilterStatusBarDirective, FsFilterModule, FsSavedFiltersMenuComponent, ItemDateMode, ItemType, QUERY_PARAM_DELIMITER, RangeItem, SavedFiltersController, SelectItem, TextItem, buildQueryParams, filterFromQueryParam, filterToQueryParam };
-//# sourceMappingURL=firestitch-filter.mjs.map