Fixing unexpected linebreak on single selects

What
---
- Hiding the search input field if the component is in the single value
option.
- Making the search input field full width if no options are selected in
	either single or multi select mode.
- Shrinking it to width auto if there are selected entries in multi
	mode.
Why
---
The component broke into two lines when selecting a a value in single
mode, because an empty, non-interactable input field was pushed down to
the next row if the selected entry had a long label.

test/unit/specs/Select.spec.js

@@ -249,6 +249,36 @@ describe('Select.vue', () => {
 			expect(vm.$children[0].isOptionSelected('foo')).toEqual(true)
 		}),
 
+    it('applies the "empty" class to the search input when no value is selected', () => {
+      const vm = new Vue({
+        template: '<div><v-select :options="options" multiple v-model="value"></v-select></div>',
+        components: {vSelect},
+        data: {
+          value: null,
+          options: [{label: 'one'}]
+        }
+      }).$mount()
+
+      expect(vm.$children[0].inputClasses.empty).toEqual(true)
+      expect(vm.$children[0].inputClasses.shrunk).toEqual(false)
+      expect(vm.$children[0].inputClasses.hidden).toEqual(false)
+    }),
+
+    it('applies the "shrunk" class to the search input when one or more value is selected', () => {
+      const vm = new Vue({
+        template: '<div><v-select :options="options" multiple v-model="value"></v-select></div>',
+        components: {vSelect},
+        data: {
+          value: [{label: 'one'}],
+          options: [{label: 'one'}]
+        }
+      }).$mount()
+
+      expect(vm.$children[0].inputClasses.shrunk).toEqual(true)
+      expect(vm.$children[0].inputClasses.empty).toEqual(false)
+      expect(vm.$children[0].inputClasses.hidden).toEqual(false)
+    }),
+
 		describe('change Event', () => {
 			it('will trigger the input event when the selection changes', (done) => {
 				const vm = new Vue({
@@ -1318,7 +1348,34 @@ describe('Select.vue', () => {
 				expect(vm.$refs.select.search).toEqual('')
 				done()
 			})
-		})
+    })
+
+    it('should apply the "empty" class to the search input when it does not have a selected value', () => {
+      const vm = new Vue({
+        template: '<div><v-select ref="select" :options="options" :value="value"></v-select></div>',
+        data: {
+          value: '',
+          options: ['one', 'two', 'three']
+        }
+      }).$mount()
+      expect(vm.$children[0].inputClasses.empty).toEqual(true)
+      expect(vm.$children[0].inputClasses.shrunk).toEqual(false)
+      expect(vm.$children[0].inputClasses.hidden).toEqual(false)
+    })
+
+    it('should apply the "hidden" class to the search input when a value is present', () => {
+      const vm = new Vue({
+        template: '<div><v-select ref="select" :options="options" :value="value"></v-select></div>',
+        data: {
+          value: 'one',
+          options: ['one', 'two', 'three']
+        }
+      }).$mount()
+
+      expect(vm.$children[0].inputClasses.hidden).toEqual(true)
+      expect(vm.$children[0].inputClasses.empty).toEqual(false)
+      expect(vm.$children[0].inputClasses.shrunk).toEqual(false)
+    })
 
 		it ('should not reset the search input on focus lost when clearSearchOnSelect is false', (done) => {
 			const vm = new Vue({