Show label colors when searching for labels

src/components/input/multiselect.vue

@@ -44,7 +44,9 @@
 				>
 					<span>
 						<slot name="searchResult" :option="query">
-							{{ query }}
+							<span class="search-result">
+								{{ query }}
+							</span>
 						</slot>
 					</span>
 					<span class="hint-text">
@@ -63,7 +65,7 @@
 				>
 					<span>
 						<slot name="searchResult" :option="data">
-							{{ label !== '' ? data[label] : data }}
+							<span class="search-result">{{ label !== '' ? data[label] : data }}</span>
 						</slot>
 					</span>
 					<span class="hint-text">

src/components/tasks/partials/editLabels.vue

@@ -20,6 +20,19 @@
 				<a @click="removeLabel(props.item)" class="delete is-small"></a>
 			</span>
 		</template>
+		<template v-slot:searchResult="props">
+			<span
+				v-if="typeof props.option === 'string'"
+				class="tag ml-2">
+				<span>{{ props.option }}</span>
+			</span>
+			<span
+				v-else
+				:style="{'background': props.option.hexColor, 'color': props.option.textColor}"
+				class="tag ml-2">
+				<span>{{ props.option.title }}</span>
+			</span>
+		</template>
 	</multiselect>
 </template>