From cbdc5982fd52d1d81838b7c42be29476ea5561fd Mon Sep 17 00:00:00 2001
From: Thom Hurks <thomhurks@gmail.com>
Date: Mon, 23 Oct 2017 22:16:41 +0200
Subject: [PATCH] Add a higher level slot to labels so they can be customized
 completely

---
 src/components/Select.vue | 19 +++++++++++--------
 1 file changed, 11 insertions(+), 8 deletions(-)

diff --git a/src/components/Select.vue b/src/components/Select.vue
index c8f29b5..ec23a71 100644
--- a/src/components/Select.vue
+++ b/src/components/Select.vue
@@ -282,14 +282,17 @@
   <div :dir="dir" class="dropdown v-select" :class="dropdownClasses">
     <div ref="toggle" @mousedown.prevent="toggleDropdown" :class="['dropdown-toggle', 'clearfix', {'disabled': disabled}]">
 
-      <span class="selected-tag" v-for="option in valueAsArray" v-bind:key="option.index">
-        <slot name="selected-option" v-bind="option">
-          {{ getOptionLabel(option) }}
-        </slot>
-        <button v-if="multiple" @click="deselect(option)" type="button" class="close" aria-label="Remove option">
-          <span aria-hidden="true">&times;</span>
-        </button>
-      </span>
+      <slot v-for="option in valueAsArray" name="selected-option-container"
+            :option="option" :deselect="deselect">
+        <span class="selected-tag" v-bind:key="option.index">
+          <slot name="selected-option" v-bind="option">
+            {{ getOptionLabel(option) }}
+          </slot>
+          <button v-if="multiple" @click="deselect(option)" type="button" class="close" aria-label="Remove option">
+            <span aria-hidden="true">&times;</span>
+          </button>
+        </span>
+    </slot>
 
       <input
               ref="search"