From bce655d394ee1215d5f355abd65064775d975d23 Mon Sep 17 00:00:00 2001
From: Mario Rodrigues <mario@loba.pt>
Date: Sat, 16 Jun 2018 17:42:38 +0100
Subject: [PATCH] Added: inputclass prop to specify a diferent class name for
 the input element

---
 README.md   | 2 ++
 app/app.vue | 7 +++++--
 index.vue   | 6 +++++-
 3 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/README.md b/README.md
index d8d3fa2..187e700 100644
--- a/README.md
+++ b/README.md
@@ -29,6 +29,7 @@ npm install vue-input-number --save-dev
         :min="10"
         :max="100"
         :maxlength="3"
+        :inputclass="'v-input-number-input'"
         @onInputNumberChange="onChange"></input-number>
 
 </template>
@@ -68,6 +69,7 @@ For more detailed example check out [the app directory](./app).
 - __mousedown:__ Enable mousedown for increment or decrement value.
 - __integer:__ Enable integer value only.
 - __placeholder:__ Set a input placeholder. If `placeholder` has some value then `min` is not used as a placeholder.
+- __inputclass:__ Set a diferent class for the input element. For example, if you use Bootstrap default input class you can set `:inputclass="'form-control'"` to use `form-control` class in the input element.
 
 ## Events
 
diff --git a/app/app.vue b/app/app.vue
index 72ebc20..928b0d5 100644
--- a/app/app.vue
+++ b/app/app.vue
@@ -18,6 +18,7 @@
         :max="options.max"
         :maxlength="options.maxlength"
         :placeholder="options.placeholder"
+        :class="options.inputclass"
         @onInputNumberChange="inputChange"></input-number>
     </p>
 
@@ -35,7 +36,8 @@ interface Options {
   min: number,
   max: number,
   maxlength: number,
-  placeholder: String
+  placeholder: String,
+  inputclass: String
 }
 
 @Component
@@ -45,7 +47,8 @@ export default class App extends Vue {
     min: 1,
     max: 100,
     maxlength: 3,
-    placeholder: 'Enter a number'
+    placeholder: 'Enter a number',
+    inputclass: 'v-input-number-input'
   }
 
   inputValue: number = 1
diff --git a/index.vue b/index.vue
index 68f5ec4..a6ce16c 100644
--- a/index.vue
+++ b/index.vue
@@ -18,7 +18,7 @@
       :maxlength="maxlength" 
       autocomplete="off"
       :placeholder="placeholder"
-      class="v-input-number-input"
+      :class="inputclass"
       v-model.number="quantity"
       @keyup="onKeyup($event)"
       @keydown="onKeydown($event)"
@@ -65,6 +65,10 @@ export default {
     placeholder: {
       type: String,
       default: ''
+    },
+    inputclass: {
+      type: String,
+      default: 'v-input-number-input'
     }
   },