[{"__symbolic":"module","version":4,"metadata":{"FilterControlComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":6,"character":1},"arguments":[{"selector":"app-filter-control","template":"\n    <div class=\"whole-filter\" (click)=\"preventPropagation($event)\" (keydown.space)=\"preventPropagation($event)\"\n      (keydown.enter)=\"preventPropagation($event)\">\n      <span [ngClass]=\"['open-filter', 'material-icons', filterField]\" (click)=\"openFilter()\">\n        expand_more\n      </span>\n      <div class=\"filter-box mat-elevation-z2 {{filterField}}\"\n        [ngClass]=\"{'last-filter': lastFilter, 'last-filter-mobile': lastFilterMobile}\">\n        <div class=\"w-100 d-flex justify-content-end mb-1\">\n          <button (click)=\"closeFilter()\" class=\"dismiss-filter d-flex\">\n            <span class=\"material-icons\">cancel</span>\n          </button>\n        </div>\n        <div class=\"mb-2 search-data\" *ngIf=\"typeControl == 'input'\">\n          <label for=\"search\">{{'search' | translate}}</label>\n          <input #filterInput class=\"form-control\" autocomplete=\"off\" matInput type=\"text\" id=\"search\"\n            [placeholder]=\"('FILTER_BY' | translate)+' '+(filterKey | lowercase)\" (keyup.enter)=\"emitFilterRequest()\">\n        </div>\n        <div class=\"mb-2 search-data\" *ngIf=\"typeControl == 'autocomplete' && componentModelLocal\">\n          <label for=\"search-autocomplete\">{{'search' | translate}}</label>\n          <app-search-combo-box-generic-local [id]=\"'search-autocomplete'\" [ngClass]=\"'w-100'\"\n            [componentModelData]=\"componentModelLocal\" [itemControl]=\"myControl\" [clearInput]=\"clearInput\"\n            (itemSelected)=\"sendItemSelectedEvent($event)\">\n          </app-search-combo-box-generic-local>\n        </div>\n        <button *ngIf=\"typeControl == 'input'\" (click)=\"emitFilterRequest()\" mat-button\n          class=\"btn filter-button\">{{'FILTER_VERB' | translate}}</button>\n      </div>\n    </div>\n  ","styles":["\n    app-filter-control {\n      display: flex;\n      align-items: center;\n      -webkit-touch-callout: none;\n      -webkit-user-select: none;\n      -khtml-user-select: none;\n      -moz-user-select: none;\n      -ms-user-select: none;\n    }\n\n    .open-filter {\n      width: auto;\n      height: auto;\n      font-size: 20px;\n      border: 1px solid #ffffff;\n      border-radius: 50%;\n      margin: 0 5px;\n      color: #ffffff;\n    }\n\n    .open-filter.active,\n    .open-filter:hover {\n      color: #ffffff;\n      background: #670075;\n    }\n\n    .whole-filter {\n      position: relative;\n    }\n\n    .filter-box {\n      display: none;\n      border: none;\n      position: absolute;\n      top: 100%;\n      left: 0;\n      background: #ffffff;\n      padding: 12px;\n      cursor: default;\n      border-radius: 5px;\n      z-index: 30 !important;\n      text-align: center;\n    }\n\n    .filter-box.active {\n      display: block;\n      left: 1vw;\n    }\n\n    .filter-box.last-filter {\n      left: initial;\n      right: 0;\n    }\n\n\n    @media (max-width: 575px) {\n      .filter-box.last-filter-mobile {\n        left: initial;\n        right: 0;\n      }\n    }\n\n    .filter-box button.dismiss-filter {\n      background: none;\n      border: none;\n      padding: 0;\n      margin: 0;\n    }\n\n    .filter-box button.dismiss-filter span {\n      color: #670075;\n    }\n\n    .filter-box button.filter-button {\n      color: white;\n      background: #670075;\n    }\n\n    .search-data {\n      text-align: left;\n    }\n\n    .search-data label {\n      color: #670075;\n    }\n\n    .search-data input{\n      min-width: 190px;\n      color: #868e96;\n    }\n  "],"encapsulation":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewEncapsulation","line":10,"character":17},"member":"None"}}]}],"members":{"filterInput":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":14,"character":3},"arguments":["filterInput"]}]}],"filterField":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":16,"character":3}}]}],"filterKey":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":3}}]}],"typeControl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":3}}]}],"lastFilter":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"clearInput":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":3}}]}],"lastFilterMobile":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":21,"character":3}}]}],"listData":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":3}}]}],"onFilterRequest":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":24,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"./filter-control.service","name":"FilterControlService","line":31,"character":28}]}],"ngOnChanges":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}],"preventPropagation":[{"__symbolic":"method"}],"openFilter":[{"__symbolic":"method"}],"closeFilter":[{"__symbolic":"method"}],"emitFilterRequest":[{"__symbolic":"method"}],"sendItemSelectedEvent":[{"__symbolic":"method"}]}}}}]