From 75dd0b435d7cfc9c2d06d6699b78bf55aede5582 Mon Sep 17 00:00:00 2001
From: Adrian Oprea <adrian@oprea.rocks>
Date: Wed, 29 Aug 2018 15:50:20 +0300
Subject: [PATCH 1/2] feature: Add "disabled" component prop

Add "disabled" property on the component and pass it down to the select boxes.
The main usecase for this would be if users would like to programatically disable the elements using native DOM attributes and not having to go through CSS gymnastics to do that.
---
 src/DateDropdown.vue | 15 ++++++++++-----
 1 file changed, 10 insertions(+), 5 deletions(-)

diff --git a/src/DateDropdown.vue b/src/DateDropdown.vue
index d615579..68f0490 100644
--- a/src/DateDropdown.vue
+++ b/src/DateDropdown.vue
@@ -3,7 +3,7 @@
 
 		<!-- Day -->
 		<div :class="[selectWrapperClassName]">
-			<select v-model="selectedDay" :class="[selectClassName, selectDayClassName]">
+			<select v-model="selectedDay" :class="[selectClassName, selectDayClassName]" :disabled="disabled">
 				<option v-for="day in days" :key="day.day">
 					{{ day.day }}
 				</option>
@@ -12,7 +12,7 @@
 
 		<!-- Month -->
 		<div :class="[selectWrapperClassName]">
-			<select v-model="selectedMonth" @change="updateDays()" :class="[selectClassName, selectMonthClassName]">
+			<select v-model="selectedMonth" @change="updateDays()" :class="[selectClassName, selectMonthClassName]" :disabled="disabled">
 				<option v-for="(month, index) in months" :value="index" :key="month.month">
 					{{ month.month }}
 				</option>
@@ -21,7 +21,7 @@
 
 		<!-- Year -->
 		<div :class="[selectWrapperClassName]">
-			<select v-model="selectedYear" @change="updateDays()" :class="[selectClassName, selectYearClassName]">
+			<select v-model="selectedYear" @change="updateDays()" :class="[selectClassName, selectYearClassName]" :disabled="disabled">
 				<option v-for="year in years" :key="year.year">
 					{{ year.year }}
 				</option>
@@ -96,6 +96,11 @@
 				required: false,
 				default: 'date-dropdown-container'
 			},
+			disabled: {
+				type: string,
+				required: false,
+				default: null
+			}
 		},
 
 		data () {
@@ -103,7 +108,7 @@
 				days: [],
 				selectedDay: '',
 				selectedMonth: '',
-				selectedYear: ''
+				selectedYear: '',
 			}
 		},
 
@@ -269,4 +274,4 @@
 		padding: 8px;
 		margin-right: 10px;
 	}
-</style>
\ No newline at end of file
+</style>

From 7f528bf150f921309274cbd4d35982ee01d6ae97 Mon Sep 17 00:00:00 2001
From: Adrian Oprea <adrian@oprea.rocks>
Date: Wed, 29 Aug 2018 15:54:05 +0300
Subject: [PATCH 2/2] fix: Add proper type and default value (string=>Boolean)

The attribute in its current DOM form is null/string but to keep consistency with JavaScript practices it was converted to a Boolean.
The Vue.js Template Syntax documentation states that native attributes whose values are falsy (null, undefined or false) will not be rendered.
See https://vuejs.org/v2/guide/syntax.html#Attributes for more information.
---
 src/DateDropdown.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/DateDropdown.vue b/src/DateDropdown.vue
index 68f0490..122e5e6 100644
--- a/src/DateDropdown.vue
+++ b/src/DateDropdown.vue
@@ -97,9 +97,9 @@
 				default: 'date-dropdown-container'
 			},
 			disabled: {
-				type: string,
+				type: Boolean,
 				required: false,
-				default: null
+				default: false
 			}
 		},