1 files changed, 30 insertions, 0 deletions
diff --git a/src/angular/filterbar/filter-bar.component.ts b/src/angular/filterbar/filter-bar.component.ts
new file mode 100644
index 0000000..49cc154
--- /dev/null
+++ b/src/angular/filterbar/filter-bar.component.ts
@@ -0,0 +1,30 @@
+import { Component, Input, Output, EventEmitter, HostBinding } from '@angular/core';
+import template from "./filter-bar.component.html";
+
+@Component({
+    selector: 'sdc-filter-bar',
+    template: template
+})
+export class FilterBarComponent {
+
+    @HostBinding('class') classes = 'sdc-filter-bar';
+
+    @Input() public placeholder: string;
+    @Input() public label: string;
+    @Input() public debounceTime: number;
+
+    @Input() public searchQuery: string;
+    @Output() public searchQueryChange: EventEmitter<any> = new EventEmitter<any>();
+
+    constructor() {
+        this.debounceTime = 200;
+    }
+
+    private searchTextChange = ($event): void => {
+        this.searchQueryChange.emit($event);
+    }
+
+    private clearSearchQuery = (): void => {
+        this.searchQuery = "";
+    }
+}