diff --git a/ng2-components/ng2-activiti-tasklist/src/components/activiti-people-search.component.css b/ng2-components/ng2-activiti-tasklist/src/components/activiti-people-search.component.css
new file mode 100644
index 0000000000..cd41a4d0df
--- /dev/null
+++ b/ng2-components/ng2-activiti-tasklist/src/components/activiti-people-search.component.css
@@ -0,0 +1,18 @@
+:host {
+ width: 100%;
+}
+
+.activiti-label {
+ font-weight: bolder;
+}
+
+.material-icons:hover {
+ color: rgb(255, 152, 0);
+}
+
+.fix-element-user-list{
+ padding-top: 0px;
+ padding-right: 0px;
+ padding-bottom: 0px;
+ padding-left: 0px;
+}
diff --git a/ng2-components/ng2-activiti-tasklist/src/components/activiti-people-search.component.html b/ng2-components/ng2-activiti-tasklist/src/components/activiti-people-search.component.html
new file mode 100644
index 0000000000..6cba3d51e5
--- /dev/null
+++ b/ng2-components/ng2-activiti-tasklist/src/components/activiti-people-search.component.html
@@ -0,0 +1,17 @@
+
+
+
+
+
diff --git a/ng2-components/ng2-activiti-tasklist/src/components/activiti-people-search.component.ts b/ng2-components/ng2-activiti-tasklist/src/components/activiti-people-search.component.ts
new file mode 100644
index 0000000000..d77de3ac88
--- /dev/null
+++ b/ng2-components/ng2-activiti-tasklist/src/components/activiti-people-search.component.ts
@@ -0,0 +1,81 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { Component, Input, Output, EventEmitter, OnInit, AfterViewInit } from '@angular/core';
+import { FormControl } from '@angular/forms';
+import { User } from '../models/user.model';
+import { Observable } from 'rxjs/Observable';
+
+declare let componentHandler: any;
+
+@Component({
+ selector: 'activiti-people-search',
+ moduleId: module.id,
+ templateUrl: './activiti-people-search.component.html',
+ styleUrls: ['./activiti-people-search.component.css']
+})
+
+export class ActivitiPeopleSearch implements OnInit, AfterViewInit {
+
+ @Input()
+ results: Observable;
+
+ @Output()
+ onSearch: EventEmitter = new EventEmitter();
+
+ @Output()
+ onModalRowClicked: EventEmitter = new EventEmitter();
+
+ private searchUser: FormControl = new FormControl();
+
+ userList: User[] = [];
+
+ constructor() {
+ this.searchUser
+ .valueChanges
+ .debounceTime(200)
+ .subscribe((event) => {
+ this.onSearch.emit(event);
+ });
+ }
+
+ ngOnInit() {
+ this.results.subscribe((list) => {
+ this.userList = list;
+ });
+ }
+
+ ngAfterViewInit() {
+ this.setupMaterialComponents(componentHandler);
+ }
+
+ setupMaterialComponents(handler?: any): boolean {
+ // workaround for MDL issues with dynamic components
+ if (handler) {
+ handler.upgradeAllRegistered();
+ return true;
+ }
+ return false;
+ }
+
+ onRowClick(userClicked: User) {
+ this.onModalRowClicked.emit(userClicked);
+ this.userList = this.userList.filter((user) => {
+ return user.id !== userClicked.id;
+ });
+ }
+}