{"__symbolic":"module","version":4,"metadata":{"CovalentSearchModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":12,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":14,"character":4},{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":15,"character":4},{"__symbolic":"reference","module":"@angular/material/input","name":"MatInputModule","line":16,"character":4},{"__symbolic":"reference","module":"@angular/material/icon","name":"MatIconModule","line":17,"character":4},{"__symbolic":"reference","module":"@angular/material/button","name":"MatButtonModule","line":18,"character":4}],"declarations":[{"__symbolic":"reference","name":"TdSearchInputComponent"},{"__symbolic":"reference","name":"TdSearchBoxComponent"}],"exports":[{"__symbolic":"reference","name":"TdSearchInputComponent"},{"__symbolic":"reference","name":"TdSearchBoxComponent"}]}]}],"members":{}},"TdSearchBoxBase":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":8,"character":41}]}]}},"_TdSearchBoxMixinBase":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@covalent/core/common","name":"mixinControlValueAccessor","line":12,"character":37},"arguments":[{"__symbolic":"reference","name":"TdSearchBoxBase"}]},"TdSearchBoxComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","name":"_TdSearchBoxMixinBase"},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":14,"character":1},"arguments":[{"providers":[{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR","line":16,"character":13},"useExisting":{"__symbolic":"reference","name":"TdSearchBoxComponent"},"multi":true}],"selector":"td-search-box","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":23,"character":19},"member":"OnPush"},"inputs":["value"],"animations":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"trigger","line":26,"character":4},"arguments":["inputState",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"state","line":27,"character":6},"arguments":["0",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":27,"character":17},"arguments":[{"width":"0%","margin":"0px"}]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"state","line":31,"character":6},"arguments":["1",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":31,"character":18},"arguments":[{"width":"100%","margin":{"__symbolic":"reference","module":"@angular/animations","name":"AUTO_STYLE","line":33,"character":16}}]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":35,"character":6},"arguments":["0 => 1",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate","line":35,"character":27},"arguments":["200ms ease-in"]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":36,"character":6},"arguments":["1 => 0",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate","line":36,"character":27},"arguments":["200ms ease-out"]}]}]]}],"template":"<div class=\"td-search-box\">\n  <button mat-icon-button type=\"button\" class=\"td-search-icon\" (click)=\"searchClicked()\">\n    <mat-icon *ngIf=\"searchVisible && !alwaysVisible\">{{backIcon}}</mat-icon>\n    <mat-icon *ngIf=\"!searchVisible || alwaysVisible\">{{searchIcon}}</mat-icon>\n  </button>\n  <td-search-input #searchInput\n                   [@inputState]=\"alwaysVisible || searchVisible\"\n                   [debounce]=\"debounce\"\n                   [(ngModel)]=\"value\"\n                   [showUnderline]=\"showUnderline\"\n                   [placeholder]=\"placeholder\"\n                   [clearIcon]=\"clearIcon\"\n                   (searchDebounce)=\"handleSearchDebounce($event)\"\n                   (search)=\"handleSearch($event)\"\n                   (clear)=\"handleClear(); toggleVisibility()\"\n                   (blur)=\"handleBlur()\">\n  </td-search-input>\n</div>","styles":[":host{display:block}.td-search-box{box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:baseline;align-items:baseline;-ms-flex-line-pack:center;align-content:center;max-width:100%;-ms-flex-pack:end;justify-content:flex-end}.td-search-box .td-search-icon{-ms-flex:0 0 auto;flex:0 0 auto}.td-search-box td-search-input{margin-left:12px}::ng-deep [dir=rtl] .td-search-box td-search-input{margin-right:12px;margin-left:0!important}"]}]}],"members":{"_searchInput":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":43,"character":3},"arguments":[{"__symbolic":"reference","name":"TdSearchInputComponent"}]}]}],"backIcon":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":54,"character":3},"arguments":["backIcon"]}]}],"searchIcon":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":61,"character":3},"arguments":["searchIcon"]}]}],"clearIcon":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":68,"character":3},"arguments":["clearIcon"]}]}],"showUnderline":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":74,"character":3},"arguments":["showUnderline"]}]}],"debounce":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":80,"character":3},"arguments":["debounce"]}]}],"alwaysVisible":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":86,"character":3},"arguments":["alwaysVisible"]}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":92,"character":3},"arguments":["placeholder"]}]}],"onSearchDebounce":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":98,"character":3},"arguments":["searchDebounce"]}]}],"onSearch":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":104,"character":3},"arguments":["search"]}]}],"onClear":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":110,"character":3},"arguments":["clear"]}]}],"onBlur":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":116,"character":3},"arguments":["blur"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":8,"character":41}]}],"searchClicked":[{"__symbolic":"method"}],"toggleVisibility":[{"__symbolic":"method"}],"handleSearchDebounce":[{"__symbolic":"method"}],"handleSearch":[{"__symbolic":"method"}],"handleClear":[{"__symbolic":"method"}],"handleBlur":[{"__symbolic":"method"}]}},"TdSearchInputBase":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":12,"character":41}]}]}},"_TdSearchInputMixinBase":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@covalent/core/common","name":"mixinControlValueAccessor","line":16,"character":39},"arguments":[{"__symbolic":"reference","name":"TdSearchInputBase"}]},"TdSearchInputComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","name":"_TdSearchInputMixinBase"},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":18,"character":1},"arguments":[{"providers":[{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR","line":20,"character":13},"useExisting":{"__symbolic":"reference","name":"TdSearchInputComponent"},"multi":true}],"selector":"td-search-input","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":27,"character":19},"member":"OnPush"},"inputs":["value"],"animations":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"trigger","line":30,"character":4},"arguments":["searchState",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"state","line":31,"character":6},"arguments":["hide-left",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":31,"character":25},"arguments":[{"transform":"translateX(-150%)","display":"none"}]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"state","line":35,"character":6},"arguments":["hide-right",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":35,"character":26},"arguments":[{"transform":"translateX(150%)","display":"none"}]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"state","line":39,"character":6},"arguments":["show",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":39,"character":21},"arguments":[{"transform":"translateX(0%)","display":"block"}]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":43,"character":6},"arguments":["* => show",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate","line":43,"character":30},"arguments":["200ms ease-in"]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":44,"character":6},"arguments":["show => *",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate","line":44,"character":30},"arguments":["200ms ease-out"]}]}]]}],"template":"<div class=\"td-search-input\">\n  <mat-form-field class=\"td-search-input-field\"\n                  [class.mat-hide-underline]=\"!showUnderline\"\n                  floatLabel=\"never\">\n    <input matInput\n            #searchElement\n            type=\"search\"\n            [(ngModel)]=\"value\"\n            [placeholder]=\"placeholder\"\n            (blur)=\"handleBlur()\"\n            (search)=\"stopPropagation($event)\"\n            (keyup.enter)=\"handleSearch($event)\"/>\n  </mat-form-field>\n  <button mat-icon-button\n          class=\"td-search-input-clear\"\n          type=\"button\"\n          [@searchState]=\"(searchElement.value ?  'show' : (isRTL ? 'hide-left' : 'hide-right'))\"\n          (click)=\"clearSearch()\">\n    <mat-icon>{{clearIcon}}</mat-icon>\n  </button>\n</div>","styles":[":host .td-search-input{overflow-x:hidden;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:baseline;align-items:baseline;-ms-flex-line-pack:center;align-content:center;max-width:100%;-ms-flex-pack:end;justify-content:flex-end}:host .td-search-input .td-search-input-field{-ms-flex:1;flex:1}:host .td-search-input ::ng-deep mat-form-field .mat-input-element{caret-color:currentColor}:host .td-search-input ::ng-deep mat-form-field.mat-hide-underline .mat-form-field-underline{display:none}:host .td-search-input .td-search-input-clear{-ms-flex:0 0 auto;flex:0 0 auto}"]}]}],"members":{"_input":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":50,"character":3},"arguments":[{"__symbolic":"reference","module":"@angular/material/input","name":"MatInput","line":50,"character":13}]}]}],"showUnderline":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":56,"character":3},"arguments":["showUnderline"]}]}],"debounce":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":62,"character":3},"arguments":["debounce"]}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":68,"character":3},"arguments":["placeholder"]}]}],"clearIcon":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":75,"character":3},"arguments":["clearIcon"]}]}],"onSearchDebounce":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":81,"character":3},"arguments":["searchDebounce"]}]}],"onSearch":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":87,"character":3},"arguments":["search"]}]}],"onClear":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":93,"character":3},"arguments":["clear"]}]}],"onBlur":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":99,"character":3},"arguments":["blur"]}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":108,"character":15}}],null],"parameters":[{"__symbolic":"reference","module":"@angular/cdk/bidi","name":"Dir","line":108,"character":40},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":12,"character":41}]}],"ngOnInit":[{"__symbolic":"method"}],"focus":[{"__symbolic":"method"}],"handleBlur":[{"__symbolic":"method"}],"stopPropagation":[{"__symbolic":"method"}],"handleSearch":[{"__symbolic":"method"}],"clearSearch":[{"__symbolic":"method"}],"_searchTermChanged":[{"__symbolic":"method"}]}}},"origins":{"CovalentSearchModule":"./search.module","TdSearchBoxBase":"./search-box/search-box.component","_TdSearchBoxMixinBase":"./search-box/search-box.component","TdSearchBoxComponent":"./search-box/search-box.component","TdSearchInputBase":"./search-input/search-input.component","_TdSearchInputMixinBase":"./search-input/search-input.component","TdSearchInputComponent":"./search-input/search-input.component"},"importAs":"@nuarch/covalent.core/search"}