var _subscription;
import { __classPrivateFieldGet } from "tslib";
import { Component, Input, ViewChild, ChangeDetectionStrategy, ChangeDetectorRef, } from '@angular/core';
import { SdPopupFilter } from '../popup-filter/popup-filter.component';
import { BehaviorSubject, Subscription } from 'rxjs';
import { DeviceDetectorService } from 'ngx-device-detector';
import { startWith } from 'rxjs/operators';
export class SdTableFilter {
    constructor(ref, deviceService) {
        this.ref = ref;
        this.deviceService = deviceService;
        this.columns = [];
        this.externalFilters = [];
        this.filterDefs = [];
        this.filterRegisterChange = new BehaviorSubject(null);
        this.filterDef = {};
        this.inlineFilterDef = {};
        this.columnFilter = {};
        this.inlineColumn = {};
        this.externalFilter = {};
        this.inlineExternal = {};
        _subscription.set(this, new Subscription());
        this.onFilter = (item) => {
            this.filterRegister.value.set({
                columnFilter: this.columnFilter,
                externalFilter: this.externalFilter,
                filterDef: this.filterDef,
            });
        };
        this.updateFilter = () => {
            this.filterRegister.value.set({
                columnFilter: this.columnFilter,
                externalFilter: this.externalFilter,
                filterDef: this.filterDef,
                notReload: true
            });
        };
        this.open = () => {
            this.popupFilter.open();
        };
        this.isMobileOrTablet = !this.deviceService.isDesktop();
        this.ref.markForCheck();
    }
    set _filter(filter) {
        this.filter = filter;
    }
    set _externalFilters(value) {
        this.externalFilters = value || [];
    }
    set _filterRegister(value) {
        this.filterRegister = value;
        this.filterRegisterChange.next(this.filterRegister);
    }
    ngAfterViewInit() {
        __classPrivateFieldGet(this, _subscription).add(this.filterRegisterChange.pipe(startWith(this.filterRegister)).subscribe(filterRegister => {
            if (this.filterRegister) {
                __classPrivateFieldGet(this, _subscription).add(this.filterRegister.configuration.observer.subscribe(configuration => {
                    const { inlineColumn, inlineExternal, inlineFilterDef } = configuration;
                    this.inlineColumn = inlineColumn;
                    this.inlineExternal = inlineExternal;
                    this.inlineFilterDef = inlineFilterDef;
                    this.ref.markForCheck();
                }));
                __classPrivateFieldGet(this, _subscription).add(this.filterRegister.value.observer.subscribe(value => {
                    const { columnFilter, externalFilter, filterDef } = value;
                    this.columnFilter = columnFilter;
                    this.externalFilter = externalFilter;
                    this.filterDef = filterDef;
                    this.ref.markForCheck();
                }));
            }
        }));
    }
    ngOnDestroy() {
        __classPrivateFieldGet(this, _subscription).unsubscribe();
    }
}
_subscription = new WeakMap();
SdTableFilter.decorators = [
    { type: Component, args: [{
                selector: 'sd-table-filter',
                template: "<ng-container *ngIf=\"!filter?.disabled\">\r\n  <ng-container *ngIf=\"filter?.enableCollapse;else noCollapse\">\r\n    <sd-group class=\"p-12\" [isExpanded]=\"false\" title=\"T\u00ECm ki\u1EBFm\" expandable>\r\n      <div sdGroupBody>\r\n        <ng-container *ngTemplateOutlet=\"noCollapse\"></ng-container>\r\n      </div>\r\n    </sd-group>\r\n  </ng-container>\r\n  <ng-template #noCollapse>\r\n    <div *ngIf=\"!isMobileOrTablet && (externalFilters?.length || filterDefs?.length)\" class=\"row mx-0 mb-8\">\r\n      <ng-container *ngIf=\"filter?.sorts?.length\">\r\n        <ng-container *ngFor=\"let field of filter?.sorts\">\r\n          <ng-container *ngIf=\"externalFilters?.length\">\r\n            <ng-container *ngFor=\"let item of externalFilters | sdFilterExternal:field\">\r\n              <ng-container *ngTemplateOutlet=\"filterExternal; context: {item: item}\"></ng-container>\r\n            </ng-container>\r\n          </ng-container>\r\n          <ng-container *ngFor=\"let item of filterDefs\">\r\n            <div *ngIf=\"inlineFilterDef[item.sdMaterialFilterDef] && item.sdMaterialFilterDef === field\"\r\n              class=\"col-lg-2 col-md-3 col-sm-6 px-8\">\r\n              <ng-container *ngTemplateOutlet=\"item.templateRef;context:{filterDef:filterDef, isInline: true}\">\r\n              </ng-container>\r\n            </div>\r\n          </ng-container>\r\n        </ng-container>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"!filter?.sorts?.length\">\r\n        <ng-container *ngIf=\"externalFilters?.length\">\r\n          <ng-container *ngFor=\"let item of externalFilters | sdFilterExternal\">\r\n            <ng-container *ngTemplateOutlet=\"filterExternal; context: {item: item}\"></ng-container>\r\n          </ng-container>\r\n        </ng-container>\r\n        <ng-container *ngFor=\"let item of filterDefs\">\r\n          <div *ngIf=\"inlineFilterDef[item.sdMaterialFilterDef]\" class=\"col-lg-2 col-md-3 col-sm-6 px-8\">\r\n            <ng-container *ngTemplateOutlet=\"item.templateRef;context:{filterDef:filterDef, isInline: true}\">\r\n            </ng-container>\r\n          </div>\r\n        </ng-container>\r\n      </ng-container>\r\n    </div>\r\n    <ng-template #filterExternal let-item=\"item\">\r\n      <div *ngIf=\"inlineExternal[item.field]\" class=\"col-lg-2 col-md-3 col-sm-6 px-8\">\r\n        <sd-input [label]=\"item.title\" *ngIf=\"item.type === 'string'\" type=\"text\" [(model)]=\"externalFilter[item.field]\"\r\n          (keyupEnter)=\"onFilter(item)\" appearance=\"outline\">\r\n        </sd-input>\r\n        <sd-input-number [label]=\"item.title\" *ngIf=\"item.type === 'number'\" [(model)]=\"externalFilter[item.field]\"\r\n          (keyupEnter)=\"onFilter(item)\" appearance=\"outline\">\r\n        </sd-input-number>\r\n        <sd-select [label]=\"item.title\" *ngIf=\"item.type === 'bool'\" [items]=\"[{value:'1',display:item.option?.displayOnTrue || 'True' },\r\n        {value:'0',display:item.option?.displayOnFalse || 'False' }]\" valueField=\"value\" displayField=\"display\"\r\n          [(model)]=\"externalFilter[item.field]\" (sdChange)=\"onFilter(item)\" appearance=\"outline\">\r\n        </sd-select>\r\n        <ng-container *ngIf=\"(item.type === 'values' || item.type === 'lazy-values') && item.option\">\r\n          <sd-select *ngIf=\"item.option?.selection === 'MULTIPLE'\" [label]=\"item.title\" [items]=\"item.option.items\"\r\n            [valueField]=\"item.option.valueField\" [displayField]=\"item.option.displayField\"\r\n            [(model)]=\"externalFilter[item.field]\" (sdChange)=\"onFilter(item)\" [selectAll]=\"item.option.selectAll\"\r\n            appearance=\"outline\" multiple>\r\n          </sd-select>\r\n          <sd-autocomplete *ngIf=\"item.option?.selection === 'AUTOCOMPLETE'\" [label]=\"item.title\"\r\n            [items]=\"item.option.items\" [valueField]=\"item.option.valueField\" [displayField]=\"item.option.displayField\"\r\n            [(model)]=\"externalFilter[item.field]\" (sdChange)=\"onFilter(item)\" appearance=\"outline\">\r\n          </sd-autocomplete>\r\n          <sd-select *ngIf=\"item.option?.selection === 'MULTIPLEAUTOCOMPLETE'\" [label]=\"item.title\"\r\n            [items]=\"item.option.items\" [valueField]=\"item.option.valueField\" [displayField]=\"item.option.displayField\"\r\n            [(model)]=\"externalFilter[item.field]\" (sdChange)=\"onFilter(item)\" filtered=\"true\" appearance=\"outline\"\r\n            multiple>\r\n          </sd-select>\r\n          <sd-select *ngIf=\"!item.option?.selection\" [label]=\"item.title\" [items]=\"item.option.items\"\r\n            [valueField]=\"item.option.valueField\" [displayField]=\"item.option.displayField\"\r\n            [(model)]=\"externalFilter[item.field]\" (sdChange)=\"onFilter(item)\" appearance=\"outline\">\r\n          </sd-select>\r\n        </ng-container>\r\n        <sd-date-time [label]=\"item.title\" *ngIf=\"item.type ==='date' || item.type ==='datetime'\"\r\n          [(model)]=\"externalFilter[item.field]\" [type]=\"item.type\" (sdChange)=\"onFilter(item)\" appearance=\"outline\">\r\n        </sd-date-time>\r\n        <sd-date-range [label]=\"item.title\" *ngIf=\"item.type ==='daterange' && externalFilter[item.field]\"\r\n          [(from)]=\"externalFilter[item.field].from\" [(to)]=\"externalFilter[item.field].to\" [min]=\"item.minDate\"\r\n          [max]=\"item.maxDate\" (sdChange)=\"onFilter(item)\" appearance=\"outline\">\r\n        </sd-date-range>\r\n      </div>\r\n    </ng-template>\r\n    <sd-popup-filter [filterRegister]=\"filterRegister\" [columns]=\"columns\" [externalFilters]=\"externalFilters\"\r\n      [filterDefs]=\"filterDefs\">\r\n    </sd-popup-filter>\r\n  </ng-template>\r\n</ng-container>",
                changeDetection: ChangeDetectionStrategy.OnPush,
                styles: [":host{display:block;padding-left:0;padding-right:0}:host ::ng-deep .mat-form-field-wrapper{padding-bottom:0}"]
            },] }
];
SdTableFilter.ctorParameters = () => [
    { type: ChangeDetectorRef },
    { type: DeviceDetectorService }
];
SdTableFilter.propDecorators = {
    popupFilter: [{ type: ViewChild, args: [SdPopupFilter,] }],
    _filter: [{ type: Input, args: ['filter',] }],
    columns: [{ type: Input }],
    _externalFilters: [{ type: Input, args: ['externalFilters',] }],
    filterDefs: [{ type: Input }],
    _filterRegister: [{ type: Input, args: ['filterRegister',] }]
};
//# sourceMappingURL=data:application/json;base64, 