@covalent/core 4.1.6 → 4.1.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,5 @@
1
1
  import * as i0 from '@angular/core';
2
- import { EventEmitter, forwardRef, Component, ChangeDetectionStrategy, Optional, ViewChild, Input, Output, NgModule } from '@angular/core';
2
+ import { EventEmitter, forwardRef, ElementRef, Component, ChangeDetectionStrategy, Optional, ViewChild, Input, Output, NgModule } from '@angular/core';
3
3
  import * as i7 from '@angular/common';
4
4
  import { CommonModule } from '@angular/common';
5
5
  import * as i6 from '@angular/forms';
@@ -12,8 +12,8 @@ import * as i3 from '@angular/material/button';
12
12
  import { MatButtonModule } from '@angular/material/button';
13
13
  import { trigger, state, style, transition, animate, AUTO_STYLE } from '@angular/animations';
14
14
  import * as i1 from '@angular/cdk/bidi';
15
- import { debounceTime, skip } from 'rxjs/operators';
16
- import { noop } from 'rxjs';
15
+ import { debounceTime, skip, takeUntil } from 'rxjs/operators';
16
+ import { Subject, fromEvent, noop } from 'rxjs';
17
17
  import * as i2 from '@angular/material/form-field';
18
18
 
19
19
  class TdSearchInputBase {
@@ -22,9 +22,10 @@ class TdSearchInputBase {
22
22
  }
23
23
  }
24
24
  class TdSearchInputComponent {
25
- constructor(_dir, _changeDetectorRef) {
25
+ constructor(_dir, _changeDetectorRef, _ngZone) {
26
26
  this._dir = _dir;
27
27
  this._changeDetectorRef = _changeDetectorRef;
28
+ this._ngZone = _ngZone;
28
29
  /**
29
30
  * appearance?: MatFormFieldAppearance
30
31
  * Appearance style for the underlying input component.
@@ -71,6 +72,7 @@ class TdSearchInputComponent {
71
72
  * Event emitted after the blur event has been called in underlying input.
72
73
  */
73
74
  this.blurSearch = new EventEmitter();
75
+ this._destroy$ = new Subject();
74
76
  }
75
77
  get isRTL() {
76
78
  if (this._dir) {
@@ -80,11 +82,17 @@ class TdSearchInputComponent {
80
82
  }
81
83
  ngOnInit() {
82
84
  this._input?.ngControl?.valueChanges
83
- ?.pipe(debounceTime(this.debounce), skip(1) // skip first change when value is set to undefined
84
- )
85
+ ?.pipe(debounceTime(this.debounce), skip(1), // skip first change when value is set to undefined
86
+ takeUntil(this._destroy$))
85
87
  .subscribe((value) => {
86
88
  this._searchTermChanged(value);
87
89
  });
90
+ this._ngZone.runOutsideAngular(() => fromEvent(this._searchElement.nativeElement, 'search')
91
+ .pipe(takeUntil(this._destroy$))
92
+ .subscribe(this._stopPropagation));
93
+ }
94
+ ngOnDestroy() {
95
+ this._destroy$.next();
88
96
  }
89
97
  writeValue(value) {
90
98
  this.value = value;
@@ -105,11 +113,8 @@ class TdSearchInputComponent {
105
113
  handleBlur() {
106
114
  this.blurSearch.emit();
107
115
  }
108
- stopPropagation(event) {
109
- event.stopPropagation();
110
- }
111
116
  handleSearch(event) {
112
- this.stopPropagation(event);
117
+ this._stopPropagation(event);
113
118
  if (typeof this.value == 'string') {
114
119
  this.search.emit(this.value);
115
120
  }
@@ -125,15 +130,18 @@ class TdSearchInputComponent {
125
130
  _searchTermChanged(value) {
126
131
  this.searchDebounce.emit(value);
127
132
  }
133
+ _stopPropagation(event) {
134
+ event.stopPropagation();
135
+ }
128
136
  }
129
- TdSearchInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: TdSearchInputComponent, deps: [{ token: i1.Dir, optional: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
137
+ TdSearchInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: TdSearchInputComponent, deps: [{ token: i1.Dir, optional: true }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
130
138
  TdSearchInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: TdSearchInputComponent, selector: "td-search-input", inputs: { appearance: "appearance", showUnderline: "showUnderline", debounce: "debounce", placeholder: "placeholder", clearIcon: "clearIcon", value: "value" }, outputs: { searchDebounce: "searchDebounce", search: "search", clear: "clear", blurSearch: "blurSearch" }, providers: [
131
139
  {
132
140
  provide: NG_VALUE_ACCESSOR,
133
141
  useExisting: forwardRef(() => TdSearchInputComponent),
134
142
  multi: true,
135
143
  },
136
- ], viewQueries: [{ propertyName: "_input", first: true, predicate: MatInput, descendants: true, static: true }], ngImport: i0, template: "<div class=\"td-search-input\">\n <mat-form-field\n class=\"td-search-input-field\"\n [class.mat-hide-underline]=\"!showUnderline\"\n [appearance]=\"appearance\"\n floatLabel=\"never\"\n >\n <input\n 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 />\n <span\n matSuffix\n *ngIf=\"\n appearance === 'fill' ||\n appearance === 'outline' ||\n appearance === 'standard'\n \"\n >\n <ng-template [ngTemplateOutlet]=\"clearButton\"></ng-template>\n </span>\n </mat-form-field>\n <ng-template\n *ngIf=\"!appearance || appearance === 'legacy'\"\n [ngTemplateOutlet]=\"clearButton\"\n ></ng-template>\n</div>\n<ng-template #clearButton>\n <button\n mat-icon-button\n class=\"td-search-input-clear\"\n type=\"button\"\n [@searchState]=\"\n searchElement.value ? 'show' : isRTL ? 'hide-left' : 'hide-right'\n \"\n (click)=\"clearSearch()\"\n >\n <mat-icon>{{ clearIcon }}</mat-icon>\n </button>\n</ng-template>\n", styles: [":host .td-search-input{overflow-x:hidden;box-sizing:border-box;display:flex;flex-direction:row;align-items:baseline;align-content:center;max-width:100%;justify-content:flex-end}:host .td-search-input .td-search-input-field{flex:1}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-outline .mat-form-field-wrapper{padding-bottom:0}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-fill .mat-form-field-wrapper{padding-bottom:0}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-fill .mat-form-field-wrapper .mat-form-field-flex{height:52px}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-fill .mat-form-field-wrapper .mat-form-field-underline{bottom:0}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-standard .mat-form-field-wrapper{padding-bottom:0}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-standard .mat-form-field-wrapper .mat-form-field-infix{bottom:.4em}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-standard .mat-form-field-wrapper .mat-form-field-underline{bottom:0}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-legacy .mat-form-field-infix{align-self:center}: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{flex:0 0 auto;align-self:center}\n"], components: [{ type: i2.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i3.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"] }, { type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i5.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"] }, { type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.MatSuffix, selector: "[matSuffix]" }, { type: i7.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], animations: [
144
+ ], viewQueries: [{ propertyName: "_input", first: true, predicate: MatInput, descendants: true, static: true }, { propertyName: "_searchElement", first: true, predicate: ["searchElement"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<div class=\"td-search-input\">\n <mat-form-field\n class=\"td-search-input-field\"\n [class.mat-hide-underline]=\"!showUnderline\"\n [appearance]=\"appearance\"\n floatLabel=\"never\"\n >\n <input\n matInput\n #searchElement\n type=\"search\"\n [(ngModel)]=\"value\"\n [placeholder]=\"placeholder\"\n (blur)=\"handleBlur()\"\n (keyup.enter)=\"handleSearch($event)\"\n />\n <span\n matSuffix\n *ngIf=\"\n appearance === 'fill' ||\n appearance === 'outline' ||\n appearance === 'standard'\n \"\n >\n <ng-template [ngTemplateOutlet]=\"clearButton\"></ng-template>\n </span>\n </mat-form-field>\n <ng-template\n *ngIf=\"!appearance || appearance === 'legacy'\"\n [ngTemplateOutlet]=\"clearButton\"\n ></ng-template>\n</div>\n<ng-template #clearButton>\n <button\n mat-icon-button\n class=\"td-search-input-clear\"\n type=\"button\"\n [@searchState]=\"\n searchElement.value ? 'show' : isRTL ? 'hide-left' : 'hide-right'\n \"\n (click)=\"clearSearch()\"\n >\n <mat-icon>{{ clearIcon }}</mat-icon>\n </button>\n</ng-template>\n", styles: [":host .td-search-input{overflow-x:hidden;box-sizing:border-box;display:flex;flex-direction:row;align-items:baseline;align-content:center;max-width:100%;justify-content:flex-end}:host .td-search-input .td-search-input-field{flex:1}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-outline .mat-form-field-wrapper{padding-bottom:0}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-fill .mat-form-field-wrapper{padding-bottom:0}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-fill .mat-form-field-wrapper .mat-form-field-flex{height:52px}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-fill .mat-form-field-wrapper .mat-form-field-underline{bottom:0}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-standard .mat-form-field-wrapper{padding-bottom:0}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-standard .mat-form-field-wrapper .mat-form-field-infix{bottom:.4em}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-standard .mat-form-field-wrapper .mat-form-field-underline{bottom:0}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-legacy .mat-form-field-infix{align-self:center}: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{flex:0 0 auto;align-self:center}\n"], components: [{ type: i2.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i3.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"] }, { type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i5.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"] }, { type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.MatSuffix, selector: "[matSuffix]" }, { type: i7.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], animations: [
137
145
  trigger('searchState', [
138
146
  state('hide-left', style({
139
147
  transform: 'translateX(-150%)',
@@ -176,12 +184,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.2", ngImpor
176
184
  transition('* => show', animate('200ms ease-in')),
177
185
  transition('show => *', animate('200ms ease-out')),
178
186
  ]),
179
- ], template: "<div class=\"td-search-input\">\n <mat-form-field\n class=\"td-search-input-field\"\n [class.mat-hide-underline]=\"!showUnderline\"\n [appearance]=\"appearance\"\n floatLabel=\"never\"\n >\n <input\n 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 />\n <span\n matSuffix\n *ngIf=\"\n appearance === 'fill' ||\n appearance === 'outline' ||\n appearance === 'standard'\n \"\n >\n <ng-template [ngTemplateOutlet]=\"clearButton\"></ng-template>\n </span>\n </mat-form-field>\n <ng-template\n *ngIf=\"!appearance || appearance === 'legacy'\"\n [ngTemplateOutlet]=\"clearButton\"\n ></ng-template>\n</div>\n<ng-template #clearButton>\n <button\n mat-icon-button\n class=\"td-search-input-clear\"\n type=\"button\"\n [@searchState]=\"\n searchElement.value ? 'show' : isRTL ? 'hide-left' : 'hide-right'\n \"\n (click)=\"clearSearch()\"\n >\n <mat-icon>{{ clearIcon }}</mat-icon>\n </button>\n</ng-template>\n", styles: [":host .td-search-input{overflow-x:hidden;box-sizing:border-box;display:flex;flex-direction:row;align-items:baseline;align-content:center;max-width:100%;justify-content:flex-end}:host .td-search-input .td-search-input-field{flex:1}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-outline .mat-form-field-wrapper{padding-bottom:0}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-fill .mat-form-field-wrapper{padding-bottom:0}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-fill .mat-form-field-wrapper .mat-form-field-flex{height:52px}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-fill .mat-form-field-wrapper .mat-form-field-underline{bottom:0}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-standard .mat-form-field-wrapper{padding-bottom:0}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-standard .mat-form-field-wrapper .mat-form-field-infix{bottom:.4em}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-standard .mat-form-field-wrapper .mat-form-field-underline{bottom:0}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-legacy .mat-form-field-infix{align-self:center}: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{flex:0 0 auto;align-self:center}\n"] }]
187
+ ], template: "<div class=\"td-search-input\">\n <mat-form-field\n class=\"td-search-input-field\"\n [class.mat-hide-underline]=\"!showUnderline\"\n [appearance]=\"appearance\"\n floatLabel=\"never\"\n >\n <input\n matInput\n #searchElement\n type=\"search\"\n [(ngModel)]=\"value\"\n [placeholder]=\"placeholder\"\n (blur)=\"handleBlur()\"\n (keyup.enter)=\"handleSearch($event)\"\n />\n <span\n matSuffix\n *ngIf=\"\n appearance === 'fill' ||\n appearance === 'outline' ||\n appearance === 'standard'\n \"\n >\n <ng-template [ngTemplateOutlet]=\"clearButton\"></ng-template>\n </span>\n </mat-form-field>\n <ng-template\n *ngIf=\"!appearance || appearance === 'legacy'\"\n [ngTemplateOutlet]=\"clearButton\"\n ></ng-template>\n</div>\n<ng-template #clearButton>\n <button\n mat-icon-button\n class=\"td-search-input-clear\"\n type=\"button\"\n [@searchState]=\"\n searchElement.value ? 'show' : isRTL ? 'hide-left' : 'hide-right'\n \"\n (click)=\"clearSearch()\"\n >\n <mat-icon>{{ clearIcon }}</mat-icon>\n </button>\n</ng-template>\n", styles: [":host .td-search-input{overflow-x:hidden;box-sizing:border-box;display:flex;flex-direction:row;align-items:baseline;align-content:center;max-width:100%;justify-content:flex-end}:host .td-search-input .td-search-input-field{flex:1}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-outline .mat-form-field-wrapper{padding-bottom:0}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-fill .mat-form-field-wrapper{padding-bottom:0}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-fill .mat-form-field-wrapper .mat-form-field-flex{height:52px}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-fill .mat-form-field-wrapper .mat-form-field-underline{bottom:0}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-standard .mat-form-field-wrapper{padding-bottom:0}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-standard .mat-form-field-wrapper .mat-form-field-infix{bottom:.4em}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-standard .mat-form-field-wrapper .mat-form-field-underline{bottom:0}:host .td-search-input ::ng-deep mat-form-field.mat-form-field-appearance-legacy .mat-form-field-infix{align-self:center}: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{flex:0 0 auto;align-self:center}\n"] }]
180
188
  }], ctorParameters: function () { return [{ type: i1.Dir, decorators: [{
181
189
  type: Optional
182
- }] }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { _input: [{
190
+ }] }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }]; }, propDecorators: { _input: [{
183
191
  type: ViewChild,
184
192
  args: [MatInput, { static: true }]
193
+ }], _searchElement: [{
194
+ type: ViewChild,
195
+ args: ['searchElement', { static: true, read: ElementRef }]
185
196
  }], appearance: [{
186
197
  type: Input
187
198
  }], showUnderline: [{
@@ -1 +1 @@
1
- {"version":3,"file":"covalent-core-search.mjs","sources":["../../../../libs/angular/search/src/search-input/search-input.component.ts","../../../../libs/angular/search/src/search-input/search-input.component.html","../../../../libs/angular/search/src/search-box/search-box.component.ts","../../../../libs/angular/search/src/search-box/search-box.component.html","../../../../libs/angular/search/src/search.module.ts","../../../../libs/angular/search/src/covalent-core-search.ts"],"sourcesContent":["import {\n Component,\n ViewChild,\n OnInit,\n Input,\n Output,\n EventEmitter,\n Optional,\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n forwardRef,\n} from '@angular/core';\nimport {\n trigger,\n state,\n style,\n transition,\n animate,\n} from '@angular/animations';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { Dir } from '@angular/cdk/bidi';\nimport { MatInput } from '@angular/material/input';\nimport { MatFormFieldAppearance } from '@angular/material/form-field';\n\nimport { debounceTime, skip } from 'rxjs/operators';\nimport { noop } from 'rxjs';\n\nexport class TdSearchInputBase {\n constructor(public _changeDetectorRef: ChangeDetectorRef) {}\n}\n\n@Component({\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => TdSearchInputComponent),\n multi: true,\n },\n ],\n selector: 'td-search-input',\n templateUrl: './search-input.component.html',\n styleUrls: ['./search-input.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n animations: [\n trigger('searchState', [\n state(\n 'hide-left',\n style({\n transform: 'translateX(-150%)',\n display: 'none',\n })\n ),\n state(\n 'hide-right',\n style({\n transform: 'translateX(150%)',\n display: 'none',\n })\n ),\n state(\n 'show',\n style({\n transform: 'translateX(0%)',\n display: 'block',\n })\n ),\n transition('* => show', animate('200ms ease-in')),\n transition('show => *', animate('200ms ease-out')),\n ]),\n ],\n})\nexport class TdSearchInputComponent implements ControlValueAccessor, OnInit {\n @ViewChild(MatInput, { static: true }) _input?: MatInput;\n\n /**\n * appearance?: MatFormFieldAppearance\n * Appearance style for the underlying input component.\n */\n @Input() appearance: MatFormFieldAppearance = 'legacy';\n\n /**\n * showUnderline?: boolean\n * Sets if the input underline should be visible. Defaults to 'false'.\n */\n @Input() showUnderline = false;\n\n /**\n * debounce?: number\n * Debounce timeout between keypresses. Defaults to 400.\n */\n @Input() debounce = 400;\n\n /**\n * placeholder?: string\n * Placeholder for the underlying input component.\n */\n @Input() placeholder = '';\n\n /**\n * clearIcon?: string\n * The icon used to clear the search input.\n * Defaults to 'cancel' icon.\n */\n @Input() clearIcon = 'cancel';\n\n @Input() value?: unknown;\n\n /**\n * searchDebounce: function($event)\n * Event emitted after the [debounce] timeout.\n */\n @Output() searchDebounce: EventEmitter<string> = new EventEmitter<string>();\n\n /**\n * search: function($event)\n * Event emitted after the key enter has been pressed.\n */\n @Output() search: EventEmitter<string> = new EventEmitter<string>();\n\n /**\n * clear: function()\n * Event emitted after the clear icon has been clicked.\n */\n @Output() clear: EventEmitter<void> = new EventEmitter<void>();\n\n /**\n * blur: function()\n * Event emitted after the blur event has been called in underlying input.\n */\n @Output() blurSearch: EventEmitter<void> = new EventEmitter<void>();\n\n get isRTL(): boolean {\n if (this._dir) {\n return this._dir.dir === 'rtl';\n }\n return false;\n }\n\n constructor(\n @Optional() private _dir: Dir,\n private _changeDetectorRef: ChangeDetectorRef\n ) {}\n\n ngOnInit(): void {\n this._input?.ngControl?.valueChanges\n ?.pipe(\n debounceTime(this.debounce),\n skip(1) // skip first change when value is set to undefined\n )\n .subscribe((value: string) => {\n this._searchTermChanged(value);\n });\n }\n\n writeValue(value: unknown): void {\n this.value = value;\n this._changeDetectorRef.markForCheck();\n }\n\n registerOnChange(): void {\n noop;\n }\n\n registerOnTouched(): void {\n noop;\n }\n\n /**\n * Method to focus to underlying input.\n */\n focus(): void {\n this._input?.focus();\n }\n\n handleBlur(): void {\n this.blurSearch.emit();\n }\n\n stopPropagation(event: Event): void {\n event.stopPropagation();\n }\n\n handleSearch(event: Event): void {\n this.stopPropagation(event);\n if (typeof this.value == 'string') {\n this.search.emit(this.value);\n }\n }\n\n /**\n * Method to clear the underlying input.\n */\n clearSearch(): void {\n this.value = '';\n this._changeDetectorRef.markForCheck();\n this.clear.emit();\n }\n\n private _searchTermChanged(value: string): void {\n this.searchDebounce.emit(value);\n }\n}\n","<div class=\"td-search-input\">\n <mat-form-field\n class=\"td-search-input-field\"\n [class.mat-hide-underline]=\"!showUnderline\"\n [appearance]=\"appearance\"\n floatLabel=\"never\"\n >\n <input\n 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 />\n <span\n matSuffix\n *ngIf=\"\n appearance === 'fill' ||\n appearance === 'outline' ||\n appearance === 'standard'\n \"\n >\n <ng-template [ngTemplateOutlet]=\"clearButton\"></ng-template>\n </span>\n </mat-form-field>\n <ng-template\n *ngIf=\"!appearance || appearance === 'legacy'\"\n [ngTemplateOutlet]=\"clearButton\"\n ></ng-template>\n</div>\n<ng-template #clearButton>\n <button\n mat-icon-button\n class=\"td-search-input-clear\"\n type=\"button\"\n [@searchState]=\"\n searchElement.value ? 'show' : isRTL ? 'hide-left' : 'hide-right'\n \"\n (click)=\"clearSearch()\"\n >\n <mat-icon>{{ clearIcon }}</mat-icon>\n </button>\n</ng-template>\n","import {\n Component,\n ViewChild,\n Input,\n Output,\n EventEmitter,\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n forwardRef,\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport {\n trigger,\n state,\n style,\n transition,\n animate,\n AUTO_STYLE,\n} from '@angular/animations';\n\nimport { TdSearchInputComponent } from '../search-input/search-input.component';\nimport { noop } from 'rxjs';\n\nexport class TdSearchBoxBase {\n constructor(public _changeDetectorRef: ChangeDetectorRef) {}\n}\n\n@Component({\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => TdSearchBoxComponent),\n multi: true,\n },\n ],\n selector: 'td-search-box',\n templateUrl: './search-box.component.html',\n styleUrls: ['./search-box.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n animations: [\n trigger('inputState', [\n state(\n '0',\n style({\n width: '0%',\n margin: '0px',\n })\n ),\n state(\n '1',\n style({\n width: '100%',\n margin: AUTO_STYLE,\n })\n ),\n transition('0 => 1', animate('200ms ease-in')),\n transition('1 => 0', animate('200ms ease-out')),\n ]),\n ],\n})\nexport class TdSearchBoxComponent implements ControlValueAccessor {\n private _searchVisible = false;\n @ViewChild(TdSearchInputComponent, { static: true })\n _searchInput?: TdSearchInputComponent;\n\n get searchVisible(): boolean {\n return this._searchVisible;\n }\n\n /**\n * backIcon?: string\n * The icon used to close the search toggle, only shown when [alwaysVisible] is false.\n * Defaults to 'search' icon.\n */\n @Input() backIcon = 'search';\n\n /**\n * searchIcon?: string\n * The icon used to open/focus the search toggle.\n * Defaults to 'search' icon.\n */\n @Input() searchIcon = 'search';\n\n /**\n * clearIcon?: string\n * The icon used to clear the search input.\n * Defaults to 'cancel' icon.\n */\n @Input() clearIcon = 'cancel';\n\n /**\n * showUnderline?: boolean\n * Sets if the input underline should be visible. Defaults to 'false'.\n */\n @Input() showUnderline = false;\n\n /**\n * debounce?: number\n * Debounce timeout between keypresses. Defaults to 400.\n */\n @Input() debounce = 400;\n\n /**\n * alwaysVisible?: boolean\n * Sets if the input should always be visible. Defaults to 'false'.\n */\n @Input() alwaysVisible = false;\n\n /**\n * placeholder?: string\n * Placeholder for the underlying input component.\n */\n @Input() placeholder = '';\n\n @Input() value: unknown;\n\n /**\n * searchDebounce: function($event)\n * Event emitted after the [debounce] timeout.\n */\n @Output() searchDebounce: EventEmitter<string> = new EventEmitter<string>();\n\n /**\n * search: function($event)\n * Event emitted after the key enter has been pressed.\n */\n @Output() search: EventEmitter<string> = new EventEmitter<string>();\n\n /**\n * clear: function()\n * Event emitted after the clear icon has been clicked.\n */\n @Output() clear: EventEmitter<void> = new EventEmitter<void>();\n\n /**\n * blur: function()\n * Event emitted after the blur event has been called in underlying input.\n */\n @Output() blurSearch: EventEmitter<void> = new EventEmitter<void>();\n\n constructor(private _changeDetectorRef: ChangeDetectorRef) {}\n\n writeValue(value: unknown): void {\n this.value = value;\n this._changeDetectorRef.markForCheck();\n }\n\n registerOnChange(): void {\n noop;\n }\n\n registerOnTouched(): void {\n noop;\n }\n\n /**\n * Method executed when the search icon is clicked.\n */\n searchClicked(): void {\n if (!this.alwaysVisible && this._searchVisible) {\n this.value = '';\n this.handleClear();\n } else if (this.alwaysVisible || !this._searchVisible) {\n this._searchInput?.focus();\n }\n this.toggleVisibility();\n }\n\n toggleVisibility(): void {\n this._searchVisible = !this._searchVisible;\n this._changeDetectorRef.markForCheck();\n }\n\n handleSearchDebounce(value: string): void {\n this.searchDebounce.emit(value);\n }\n\n handleSearch(value: string): void {\n this.search.emit(value);\n }\n\n handleClear(): void {\n this.clear.emit();\n }\n\n handleBlur(): void {\n this.blurSearch.emit();\n }\n}\n","<div class=\"td-search-box\">\n <button\n mat-icon-button\n type=\"button\"\n class=\"td-search-icon\"\n (click)=\"searchClicked()\"\n >\n <mat-icon *ngIf=\"searchVisible && !alwaysVisible\">{{ backIcon }}</mat-icon>\n <mat-icon *ngIf=\"!searchVisible || alwaysVisible\">{{\n searchIcon\n }}</mat-icon>\n </button>\n <td-search-input\n #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>\n","import { NgModule } from '@angular/core';\n\nimport { CommonModule } from '@angular/common';\nimport { FormsModule } from '@angular/forms';\n\nimport { MatInputModule } from '@angular/material/input';\nimport { MatIconModule } from '@angular/material/icon';\nimport { MatButtonModule } from '@angular/material/button';\n\nimport { TdSearchInputComponent } from './search-input/search-input.component';\nimport { TdSearchBoxComponent } from './search-box/search-box.component';\n\n@NgModule({\n imports: [\n FormsModule,\n CommonModule,\n MatInputModule,\n MatIconModule,\n MatButtonModule,\n ],\n declarations: [TdSearchInputComponent, TdSearchBoxComponent],\n exports: [TdSearchInputComponent, TdSearchBoxComponent],\n})\nexport class CovalentSearchModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"covalent-core-search.mjs","sources":["../../../../libs/angular/search/src/search-input/search-input.component.ts","../../../../libs/angular/search/src/search-input/search-input.component.html","../../../../libs/angular/search/src/search-box/search-box.component.ts","../../../../libs/angular/search/src/search-box/search-box.component.html","../../../../libs/angular/search/src/search.module.ts","../../../../libs/angular/search/src/covalent-core-search.ts"],"sourcesContent":["import {\n Component,\n ViewChild,\n OnInit,\n Input,\n Output,\n EventEmitter,\n Optional,\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n forwardRef,\n OnDestroy,\n ElementRef,\n NgZone,\n} from '@angular/core';\nimport {\n trigger,\n state,\n style,\n transition,\n animate,\n} from '@angular/animations';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { Dir } from '@angular/cdk/bidi';\nimport { MatInput } from '@angular/material/input';\nimport { MatFormFieldAppearance } from '@angular/material/form-field';\n\nimport { debounceTime, skip, takeUntil } from 'rxjs/operators';\nimport { fromEvent, noop, Subject } from 'rxjs';\n\nexport class TdSearchInputBase {\n constructor(public _changeDetectorRef: ChangeDetectorRef) {}\n}\n\n@Component({\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => TdSearchInputComponent),\n multi: true,\n },\n ],\n selector: 'td-search-input',\n templateUrl: './search-input.component.html',\n styleUrls: ['./search-input.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n animations: [\n trigger('searchState', [\n state(\n 'hide-left',\n style({\n transform: 'translateX(-150%)',\n display: 'none',\n })\n ),\n state(\n 'hide-right',\n style({\n transform: 'translateX(150%)',\n display: 'none',\n })\n ),\n state(\n 'show',\n style({\n transform: 'translateX(0%)',\n display: 'block',\n })\n ),\n transition('* => show', animate('200ms ease-in')),\n transition('show => *', animate('200ms ease-out')),\n ]),\n ],\n})\nexport class TdSearchInputComponent\n implements ControlValueAccessor, OnInit, OnDestroy\n{\n @ViewChild(MatInput, { static: true }) _input?: MatInput;\n\n @ViewChild('searchElement', { static: true, read: ElementRef })\n _searchElement!: ElementRef<HTMLInputElement>;\n\n /**\n * appearance?: MatFormFieldAppearance\n * Appearance style for the underlying input component.\n */\n @Input() appearance: MatFormFieldAppearance = 'legacy';\n\n /**\n * showUnderline?: boolean\n * Sets if the input underline should be visible. Defaults to 'false'.\n */\n @Input() showUnderline = false;\n\n /**\n * debounce?: number\n * Debounce timeout between keypresses. Defaults to 400.\n */\n @Input() debounce = 400;\n\n /**\n * placeholder?: string\n * Placeholder for the underlying input component.\n */\n @Input() placeholder = '';\n\n /**\n * clearIcon?: string\n * The icon used to clear the search input.\n * Defaults to 'cancel' icon.\n */\n @Input() clearIcon = 'cancel';\n\n @Input() value?: unknown;\n\n /**\n * searchDebounce: function($event)\n * Event emitted after the [debounce] timeout.\n */\n @Output() searchDebounce: EventEmitter<string> = new EventEmitter<string>();\n\n /**\n * search: function($event)\n * Event emitted after the key enter has been pressed.\n */\n @Output() search: EventEmitter<string> = new EventEmitter<string>();\n\n /**\n * clear: function()\n * Event emitted after the clear icon has been clicked.\n */\n @Output() clear: EventEmitter<void> = new EventEmitter<void>();\n\n /**\n * blur: function()\n * Event emitted after the blur event has been called in underlying input.\n */\n @Output() blurSearch: EventEmitter<void> = new EventEmitter<void>();\n\n get isRTL(): boolean {\n if (this._dir) {\n return this._dir.dir === 'rtl';\n }\n return false;\n }\n\n private _destroy$ = new Subject<void>();\n\n constructor(\n @Optional() private _dir: Dir,\n private _changeDetectorRef: ChangeDetectorRef,\n private _ngZone: NgZone\n ) {}\n\n ngOnInit(): void {\n this._input?.ngControl?.valueChanges\n ?.pipe(\n debounceTime(this.debounce),\n skip(1), // skip first change when value is set to undefined\n takeUntil(this._destroy$)\n )\n .subscribe((value: string) => {\n this._searchTermChanged(value);\n });\n\n this._ngZone.runOutsideAngular(() =>\n fromEvent(this._searchElement.nativeElement, 'search')\n .pipe(takeUntil(this._destroy$))\n .subscribe(this._stopPropagation)\n );\n }\n\n ngOnDestroy(): void {\n this._destroy$.next();\n }\n\n writeValue(value: unknown): void {\n this.value = value;\n this._changeDetectorRef.markForCheck();\n }\n\n registerOnChange(): void {\n noop;\n }\n\n registerOnTouched(): void {\n noop;\n }\n\n /**\n * Method to focus to underlying input.\n */\n focus(): void {\n this._input?.focus();\n }\n\n handleBlur(): void {\n this.blurSearch.emit();\n }\n\n handleSearch(event: Event): void {\n this._stopPropagation(event);\n if (typeof this.value == 'string') {\n this.search.emit(this.value);\n }\n }\n\n /**\n * Method to clear the underlying input.\n */\n clearSearch(): void {\n this.value = '';\n this._changeDetectorRef.markForCheck();\n this.clear.emit();\n }\n\n private _searchTermChanged(value: string): void {\n this.searchDebounce.emit(value);\n }\n\n private _stopPropagation(event: Event): void {\n event.stopPropagation();\n }\n}\n","<div class=\"td-search-input\">\n <mat-form-field\n class=\"td-search-input-field\"\n [class.mat-hide-underline]=\"!showUnderline\"\n [appearance]=\"appearance\"\n floatLabel=\"never\"\n >\n <input\n matInput\n #searchElement\n type=\"search\"\n [(ngModel)]=\"value\"\n [placeholder]=\"placeholder\"\n (blur)=\"handleBlur()\"\n (keyup.enter)=\"handleSearch($event)\"\n />\n <span\n matSuffix\n *ngIf=\"\n appearance === 'fill' ||\n appearance === 'outline' ||\n appearance === 'standard'\n \"\n >\n <ng-template [ngTemplateOutlet]=\"clearButton\"></ng-template>\n </span>\n </mat-form-field>\n <ng-template\n *ngIf=\"!appearance || appearance === 'legacy'\"\n [ngTemplateOutlet]=\"clearButton\"\n ></ng-template>\n</div>\n<ng-template #clearButton>\n <button\n mat-icon-button\n class=\"td-search-input-clear\"\n type=\"button\"\n [@searchState]=\"\n searchElement.value ? 'show' : isRTL ? 'hide-left' : 'hide-right'\n \"\n (click)=\"clearSearch()\"\n >\n <mat-icon>{{ clearIcon }}</mat-icon>\n </button>\n</ng-template>\n","import {\n Component,\n ViewChild,\n Input,\n Output,\n EventEmitter,\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n forwardRef,\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport {\n trigger,\n state,\n style,\n transition,\n animate,\n AUTO_STYLE,\n} from '@angular/animations';\n\nimport { TdSearchInputComponent } from '../search-input/search-input.component';\nimport { noop } from 'rxjs';\n\nexport class TdSearchBoxBase {\n constructor(public _changeDetectorRef: ChangeDetectorRef) {}\n}\n\n@Component({\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => TdSearchBoxComponent),\n multi: true,\n },\n ],\n selector: 'td-search-box',\n templateUrl: './search-box.component.html',\n styleUrls: ['./search-box.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n animations: [\n trigger('inputState', [\n state(\n '0',\n style({\n width: '0%',\n margin: '0px',\n })\n ),\n state(\n '1',\n style({\n width: '100%',\n margin: AUTO_STYLE,\n })\n ),\n transition('0 => 1', animate('200ms ease-in')),\n transition('1 => 0', animate('200ms ease-out')),\n ]),\n ],\n})\nexport class TdSearchBoxComponent implements ControlValueAccessor {\n private _searchVisible = false;\n @ViewChild(TdSearchInputComponent, { static: true })\n _searchInput?: TdSearchInputComponent;\n\n get searchVisible(): boolean {\n return this._searchVisible;\n }\n\n /**\n * backIcon?: string\n * The icon used to close the search toggle, only shown when [alwaysVisible] is false.\n * Defaults to 'search' icon.\n */\n @Input() backIcon = 'search';\n\n /**\n * searchIcon?: string\n * The icon used to open/focus the search toggle.\n * Defaults to 'search' icon.\n */\n @Input() searchIcon = 'search';\n\n /**\n * clearIcon?: string\n * The icon used to clear the search input.\n * Defaults to 'cancel' icon.\n */\n @Input() clearIcon = 'cancel';\n\n /**\n * showUnderline?: boolean\n * Sets if the input underline should be visible. Defaults to 'false'.\n */\n @Input() showUnderline = false;\n\n /**\n * debounce?: number\n * Debounce timeout between keypresses. Defaults to 400.\n */\n @Input() debounce = 400;\n\n /**\n * alwaysVisible?: boolean\n * Sets if the input should always be visible. Defaults to 'false'.\n */\n @Input() alwaysVisible = false;\n\n /**\n * placeholder?: string\n * Placeholder for the underlying input component.\n */\n @Input() placeholder = '';\n\n @Input() value: unknown;\n\n /**\n * searchDebounce: function($event)\n * Event emitted after the [debounce] timeout.\n */\n @Output() searchDebounce: EventEmitter<string> = new EventEmitter<string>();\n\n /**\n * search: function($event)\n * Event emitted after the key enter has been pressed.\n */\n @Output() search: EventEmitter<string> = new EventEmitter<string>();\n\n /**\n * clear: function()\n * Event emitted after the clear icon has been clicked.\n */\n @Output() clear: EventEmitter<void> = new EventEmitter<void>();\n\n /**\n * blur: function()\n * Event emitted after the blur event has been called in underlying input.\n */\n @Output() blurSearch: EventEmitter<void> = new EventEmitter<void>();\n\n constructor(private _changeDetectorRef: ChangeDetectorRef) {}\n\n writeValue(value: unknown): void {\n this.value = value;\n this._changeDetectorRef.markForCheck();\n }\n\n registerOnChange(): void {\n noop;\n }\n\n registerOnTouched(): void {\n noop;\n }\n\n /**\n * Method executed when the search icon is clicked.\n */\n searchClicked(): void {\n if (!this.alwaysVisible && this._searchVisible) {\n this.value = '';\n this.handleClear();\n } else if (this.alwaysVisible || !this._searchVisible) {\n this._searchInput?.focus();\n }\n this.toggleVisibility();\n }\n\n toggleVisibility(): void {\n this._searchVisible = !this._searchVisible;\n this._changeDetectorRef.markForCheck();\n }\n\n handleSearchDebounce(value: string): void {\n this.searchDebounce.emit(value);\n }\n\n handleSearch(value: string): void {\n this.search.emit(value);\n }\n\n handleClear(): void {\n this.clear.emit();\n }\n\n handleBlur(): void {\n this.blurSearch.emit();\n }\n}\n","<div class=\"td-search-box\">\n <button\n mat-icon-button\n type=\"button\"\n class=\"td-search-icon\"\n (click)=\"searchClicked()\"\n >\n <mat-icon *ngIf=\"searchVisible && !alwaysVisible\">{{ backIcon }}</mat-icon>\n <mat-icon *ngIf=\"!searchVisible || alwaysVisible\">{{\n searchIcon\n }}</mat-icon>\n </button>\n <td-search-input\n #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>\n","import { NgModule } from '@angular/core';\n\nimport { CommonModule } from '@angular/common';\nimport { FormsModule } from '@angular/forms';\n\nimport { MatInputModule } from '@angular/material/input';\nimport { MatIconModule } from '@angular/material/icon';\nimport { MatButtonModule } from '@angular/material/button';\n\nimport { TdSearchInputComponent } from './search-input/search-input.component';\nimport { TdSearchBoxComponent } from './search-box/search-box.component';\n\n@NgModule({\n imports: [\n FormsModule,\n CommonModule,\n MatInputModule,\n MatIconModule,\n MatButtonModule,\n ],\n declarations: [TdSearchInputComponent, TdSearchBoxComponent],\n exports: [TdSearchInputComponent, TdSearchBoxComponent],\n})\nexport class CovalentSearchModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@covalent/core",
3
- "version": "4.1.6",
3
+ "version": "4.1.9",
4
4
  "exports": {
5
5
  ".": {
6
6
  "sass": "./theming/_all-theme.scss",
@@ -127,7 +127,7 @@
127
127
  "@angular/router": "^13.2.0",
128
128
  "@angular/cdk": "^13.2.1",
129
129
  "@angular/material": "^13.2.1",
130
- "@covalent/core": "4.1.6",
130
+ "@covalent/core": "4.1.9",
131
131
  "@angular/platform-browser": "^13.2.0",
132
132
  "rxjs": "~7.4.0",
133
133
  "@angular/animations": "^13.2.0",
@@ -1,4 +1,4 @@
1
- import { OnInit, EventEmitter, ChangeDetectorRef } from '@angular/core';
1
+ import { OnInit, EventEmitter, ChangeDetectorRef, OnDestroy, ElementRef, NgZone } from '@angular/core';
2
2
  import { ControlValueAccessor } from '@angular/forms';
3
3
  import { Dir } from '@angular/cdk/bidi';
4
4
  import { MatInput } from '@angular/material/input';
@@ -8,10 +8,12 @@ export declare class TdSearchInputBase {
8
8
  _changeDetectorRef: ChangeDetectorRef;
9
9
  constructor(_changeDetectorRef: ChangeDetectorRef);
10
10
  }
11
- export declare class TdSearchInputComponent implements ControlValueAccessor, OnInit {
11
+ export declare class TdSearchInputComponent implements ControlValueAccessor, OnInit, OnDestroy {
12
12
  private _dir;
13
13
  private _changeDetectorRef;
14
+ private _ngZone;
14
15
  _input?: MatInput;
16
+ _searchElement: ElementRef<HTMLInputElement>;
15
17
  /**
16
18
  * appearance?: MatFormFieldAppearance
17
19
  * Appearance style for the underlying input component.
@@ -60,8 +62,10 @@ export declare class TdSearchInputComponent implements ControlValueAccessor, OnI
60
62
  */
61
63
  blurSearch: EventEmitter<void>;
62
64
  get isRTL(): boolean;
63
- constructor(_dir: Dir, _changeDetectorRef: ChangeDetectorRef);
65
+ private _destroy$;
66
+ constructor(_dir: Dir, _changeDetectorRef: ChangeDetectorRef, _ngZone: NgZone);
64
67
  ngOnInit(): void;
68
+ ngOnDestroy(): void;
65
69
  writeValue(value: unknown): void;
66
70
  registerOnChange(): void;
67
71
  registerOnTouched(): void;
@@ -70,13 +74,13 @@ export declare class TdSearchInputComponent implements ControlValueAccessor, OnI
70
74
  */
71
75
  focus(): void;
72
76
  handleBlur(): void;
73
- stopPropagation(event: Event): void;
74
77
  handleSearch(event: Event): void;
75
78
  /**
76
79
  * Method to clear the underlying input.
77
80
  */
78
81
  clearSearch(): void;
79
82
  private _searchTermChanged;
80
- static ɵfac: i0.ɵɵFactoryDeclaration<TdSearchInputComponent, [{ optional: true; }, null]>;
83
+ private _stopPropagation;
84
+ static ɵfac: i0.ɵɵFactoryDeclaration<TdSearchInputComponent, [{ optional: true; }, null, null]>;
81
85
  static ɵcmp: i0.ɵɵComponentDeclaration<TdSearchInputComponent, "td-search-input", never, { "appearance": "appearance"; "showUnderline": "showUnderline"; "debounce": "debounce"; "placeholder": "placeholder"; "clearIcon": "clearIcon"; "value": "value"; }, { "searchDebounce": "searchDebounce"; "search": "search"; "clear": "clear"; "blurSearch": "blurSearch"; }, never, never>;
82
86
  }