feat(lib): add new props

Adding new props to allow specific styles; Make country select readonly when input is also readonly
yogakurniawan · Sep 1, 2021 · 8c4e6bc · 8c4e6bc
1 parent 430d273
commit 8c4e6bc
Show file tree

Hide file tree

Showing 4 changed files with 71 additions and 12 deletions.
diff --git a/dist/vue-tel-input-vuetify.esm.js b/dist/vue-tel-input-vuetify.esm.js
diff --git a/dist/vue-tel-input-vuetify.min.js b/dist/vue-tel-input-vuetify.min.js
diff --git a/dist/vue-tel-input-vuetify.umd.js b/dist/vue-tel-input-vuetify.umd.js
diff --git a/lib/vue-tel-input-vuetify.vue b/lib/vue-tel-input-vuetify.vue
@@ -2,20 +2,23 @@
   <div :class="['vue-tel-input-vuetify', wrapperClasses]">
     <div class="country-code">
       <v-select
-        :label="selectLabel"
         v-model="countryCode"
+        :class="selectClasses"
+        :label="selectLabel"
         @change="onChangeCountryCode"
         :items="sortedCountries"
         :disabled="disabled"
         :outlined="outlined"
         :filled="filled"
         :flat="flat"
         :light="light"
+        :readonly="readonly"
         :shaped="shaped"
         :rounded="rounded"
         :background-color="backgroundColor"
         :dense="dense"
         :menu-props="menuProps"
+        :height="inputHeight"
         item-text="name"
         item-value="iso2"
         return-object
@@ -32,6 +35,7 @@
     <v-text-field
       ref="input"
       type="tel"
+      :class="textFieldClasses"
       :messages="messages"
       :error-messages="errorMessages"
       :success-messages="successMessages"
@@ -70,6 +74,7 @@
       :id="inputId"
       :maxlength="maxLen"
       :tabindex="inputOptions && inputOptions.tabindex ? inputOptions.tabindex : 0"
+      :height="inputHeight"
       @input="onInput"
       @blur="onBlur"
       @focus="onFocus"
@@ -261,6 +266,10 @@ export default {
       type: Boolean,
       default: false,
     },
+    inputHeight: {
+      type: String,
+      default: '',
+    },
     value: {
       type: String,
       default: '',
@@ -339,6 +348,14 @@ export default {
       type: [String, Array, Object],
       default: () => getDefault('wrapperClasses'),
     },
+    selectClasses: {
+      type: [String, Array, Object],
+      default: () => '',
+    },
+    inputClasses: {
+      type: [String, Array, Object],
+      default: () => '',
+    },
     inputId: {
       type: String,
       default: () => getDefault('inputId'),