Add option to disable the entire component

src/components/Select.vue

@@ -3,6 +3,10 @@
 		position: relative;
 	}
 
+  .v-select .disabled {
+    cursor: not-allowed !important;
+  }
+
 	.v-select .open-indicator {
 		position: absolute;
 		bottom: 6px;
@@ -193,13 +197,13 @@
 							@blur="open = false"
 							@focus="open = true"
 							type="search"
-							class="form-control"
+              :class="[{'disabled': disabled}, 'form-control']"
 							:placeholder="searchPlaceholder"
 							:readonly="!searchable"
 							:style="{ width: isValueEmpty ? '100%' : 'auto' }"
 			>
 
-			<i v-el:open-indicator role="presentation" class="open-indicator"></i>
+      <i v-el:open-indicator role="presentation" :class="[{'disabled': disabled}, 'open-indicator']"></i>
 
 			<slot name="spinner">
 				<div class="spinner" v-show="loading">Loading...</div>
@@ -284,6 +288,15 @@
 				default: false
 			},
 
+      /**
+       * Disable the entire component.
+       * @type {Boolean}
+       */
+      disabled: {
+        type: Boolean,
+        default: false
+      },
+
 			/**
 			 * Equivalent to the `placeholder` attribute on an `<input>`.
 			 * @type {Object}
@@ -495,8 +508,10 @@
 					if (this.open) {
 						this.$els.search.blur() // dropdown will close on blur
 					} else {
-						this.open = true
-						this.$els.search.focus()
+            if (!this.disabled) {
+              this.open = true
+              this.$els.search.focus()
+            }
 					}
 				}
 			},

test/unit/specs/Select.spec.js

@@ -253,6 +253,25 @@ describe('Select.vue', () => {
 	})
 
 	describe('Toggling Dropdown', () => {
+		it('should not open the dropdown when the el is clicked but the component is disabled', (done) => {
+			const vm = new Vue({
+				template: '<div><v-select :options="options" :value.sync="value" disabled></v-select></div>',
+				components: {vSelect},
+				data: {
+					value: [{label: 'one'}],
+					options: [{label: 'one'}]
+				}
+			}).$mount()
+
+			vm.$children[0].toggleDropdown({target: vm.$children[0].$els.search})
+			Vue.nextTick(() => {
+				Vue.nextTick(() => {
+					expect(vm.$children[0].open).toEqual(false)
+					done()
+				})
+			})
+		})
+
 		it('should open the dropdown when the el is clicked', (done) => {
 			const vm = new Vue({
 				template: '<div><v-select :options="options" :value.sync="value"></v-select></div>',
@@ -896,4 +915,4 @@ describe('Select.vue', () => {
 			})
 		})
 	})
-})
+})