From c318e013979743109350929c3b001592a1a3d5f0 Mon Sep 17 00:00:00 2001
From: Kevin Ongko <kevin.ongko@gmail.com>
Date: Mon, 9 Jan 2017 14:30:57 +0700
Subject: [PATCH 1/3] add min & max limiter

---
 .gitignore          |  1 +
 package.json        | 53 ++++++++++++++++++----------------
 src/vue-numeric.vue | 69 ++++++++++++++++++++++++++++++++-------------
 3 files changed, 79 insertions(+), 44 deletions(-)

diff --git a/.gitignore b/.gitignore
index c8f50f7..0db216b 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1 +1,2 @@
 npm-debug.log
+node_modules
diff --git a/package.json b/package.json
index aaf35d7..407f408 100644
--- a/package.json
+++ b/package.json
@@ -1,27 +1,30 @@
 {
-    "name": "vue-numeric",
-    "version": "1.0.2",
-    "description": "Numeric input component based on Vue",
-    "author": "Kevin Ongko",
-    "main": "src/vue-numeric.vue",
-    "repository": {
-        "type": "git",
-        "url": "git+https://github.com/kevinongko/vue-numeric.git"
-    },
-    "bugs": {
-        "url": "https://github.com/kevinongko/vue-numeric/issues"
-    },
-    "keywords": [
-        "component",
-        "currency",
-        "input",
-        "text",
-        "number",
-        "numeric",
-        "separator",
-        "vue",
-        "vue.js"
-    ],
-    "homepage": "https://github.com/kevinongko/vue-numeric#readme",
-    "license": "MIT"
+  "name": "vue-numeric",
+  "version": "1.0.2",
+  "description": "Numeric input component based on Vue",
+  "author": "Kevin Ongko",
+  "main": "src/vue-numeric.vue",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/kevinongko/vue-numeric.git"
+  },
+  "bugs": {
+    "url": "https://github.com/kevinongko/vue-numeric/issues"
+  },
+  "keywords": [
+    "component",
+    "currency",
+    "input",
+    "text",
+    "number",
+    "numeric",
+    "separator",
+    "vue",
+    "vue.js"
+  ],
+  "homepage": "https://github.com/kevinongko/vue-numeric#readme",
+  "license": "MIT",
+  "dependencies": {
+    "lodash": "^4.17.4"
+  }
 }
diff --git a/src/vue-numeric.vue b/src/vue-numeric.vue
index 8a4a4ac..21cf69a 100644
--- a/src/vue-numeric.vue
+++ b/src/vue-numeric.vue
@@ -1,18 +1,15 @@
 <template>
-  <input type="tel" ref="numeric" :value="value" @input="updateValue(amount)" v-model="amount">
+  <input type="tel" ref="numeric" :value="value" @input="updateValue(amountValue)" v-model="amount">
 </template>
 
 <script>
+import _ from 'lodash'
+
 export default {
 
-  name: 'Vue-Numeric',
+  name: 'vue-numeric',
 
   props: {
-    placeholder: {
-      required: false,
-      type: String
-    },
-
     value: {
       default: 0,
       required: true,
@@ -25,6 +22,16 @@ export default {
       type: String
     },
 
+    min: {
+      required: false,
+      type: Number
+    },
+
+    max: {
+      required: false,
+      type: Number
+    },
+
     separator: {
       default: '',
       required: false,
@@ -32,28 +39,52 @@ export default {
     }
   },
 
-  data () {
-    return {
-      amount: ''
-    }
-  },
+  data: () => ({
+    amount: ''
+  }),
 
-  mounted () {
-    this.updateValue(this.value)
+  computed: {
+    defaultValue () {
+      return _.toNumber(this.value)
+    },
+
+    amountValue () {
+      return _.toNumber(this.amount)
+    }
   },
 
   methods: {
-    updateValue (value) {
-      const number = +value.replace(/[^0-9]+/g, '')
-      this.amount = this.format(number)
-      this.$emit('input', number)
+    checkMinValue (value) {
+      if (this.min) {
+        if (value >= this.min) return true
+        return false
+      }
+      return true
+    },
+
+    checkMaxValue (value) {
+      if (this.max) {
+        if (value <= this.max) return true
+        return false
+      }
+      return true
     },
 
     format (value) {
       const numberWithSeparator = Number(value).toString().replace(/\B(?=(\d{3})+(?!\d))/g, this.separator)
       return this.currency + ' ' + numberWithSeparator
+    },
+
+    updateValue (value) {
+      if (this.checkMinValue(value) && this.checkMaxValue(value)) {
+        this.amount = this.format(value)
+        this.$emit('input', value)
+      }
     }
-  }
+  },
 
+  mounted () {
+    this.updateValue(this.defaultValue)
+  }
 }
 </script>

From cb097790584acea80e2aad4cb1167571d833b630 Mon Sep 17 00:00:00 2001
From: Kevin Ongko <kevin.ongko@gmail.com>
Date: Mon, 9 Jan 2017 14:49:59 +0700
Subject: [PATCH 2/3] fix number value

---
 package.json        |  5 +----
 src/vue-numeric.vue | 14 ++++++++------
 2 files changed, 9 insertions(+), 10 deletions(-)

diff --git a/package.json b/package.json
index 407f408..cd10f5a 100644
--- a/package.json
+++ b/package.json
@@ -23,8 +23,5 @@
     "vue.js"
   ],
   "homepage": "https://github.com/kevinongko/vue-numeric#readme",
-  "license": "MIT",
-  "dependencies": {
-    "lodash": "^4.17.4"
-  }
+  "license": "MIT"
 }
diff --git a/src/vue-numeric.vue b/src/vue-numeric.vue
index 21cf69a..103f77d 100644
--- a/src/vue-numeric.vue
+++ b/src/vue-numeric.vue
@@ -3,8 +3,6 @@
 </template>
 
 <script>
-import _ from 'lodash'
-
 export default {
 
   name: 'vue-numeric',
@@ -45,11 +43,11 @@ export default {
 
   computed: {
     defaultValue () {
-      return _.toNumber(this.value)
+      return this.formatToNumber(this.value)
     },
 
     amountValue () {
-      return _.toNumber(this.amount)
+      return this.formatToNumber(this.amount)
     }
   },
 
@@ -70,14 +68,18 @@ export default {
       return true
     },
 
-    format (value) {
+    formatToNumber (value) {
+      +value.replace(/[^0-9]+/g, '')
+    },
+
+    formatToCurrency (value) {
       const numberWithSeparator = Number(value).toString().replace(/\B(?=(\d{3})+(?!\d))/g, this.separator)
       return this.currency + ' ' + numberWithSeparator
     },
 
     updateValue (value) {
       if (this.checkMinValue(value) && this.checkMaxValue(value)) {
-        this.amount = this.format(value)
+        this.amount = this.formatToCurrency(value)
         this.$emit('input', value)
       }
     }

From 40acd546a15cbd54d75bf5de86adfdbbf1067c81 Mon Sep 17 00:00:00 2001
From: Kevin Ongko <kevin.ongko@gmail.com>
Date: Mon, 9 Jan 2017 16:11:49 +0700
Subject: [PATCH 3/3] fix bug and update version

---
 README.md           |  9 +++--
 package.json        |  2 +-
 src/vue-numeric.vue | 87 ++++++++++++++++++++++++++++-----------------
 3 files changed, 59 insertions(+), 39 deletions(-)

diff --git a/README.md b/README.md
index 6bd49f5..51f498e 100644
--- a/README.md
+++ b/README.md
@@ -1,8 +1,7 @@
 # vue-numeric
 
 [![npm version](https://badge.fury.io/js/vue-numeric.svg)](https://badge.fury.io/js/vue-numeric)
-[![npm](https://img.shields.io/npm/dt/vue-numeric.svg)](https://www.npmjs.com/package/vue-numeric)
-[![npm](https://img.shields.io/npm/l/vue-numeric.svg)](http://opensource.org/licenses/MIT)
+[![license](https://img.shields.io/github/license/mashape/apistatus.svg)](http://opensource.org/licenses/MIT)
 
 Numeric input component based on [Vue](https://vuejs.org/).
 
@@ -29,17 +28,17 @@ import VueNumeric from 'vue-numeric'
 export default {
 
   name: 'App',
-  
+
   components: {
     VueNumeric
   },
-  
+
   data () {
     return {
       price: ''
     }
   }
-  
+
 }
 </script>
 
diff --git a/package.json b/package.json
index cd10f5a..0c0726c 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-numeric",
-  "version": "1.0.2",
+  "version": "1.1.0",
   "description": "Numeric input component based on Vue",
   "author": "Kevin Ongko",
   "main": "src/vue-numeric.vue",
diff --git a/src/vue-numeric.vue b/src/vue-numeric.vue
index 103f77d..a462a65 100644
--- a/src/vue-numeric.vue
+++ b/src/vue-numeric.vue
@@ -1,33 +1,36 @@
 <template>
-  <input type="tel" ref="numeric" :value="value" @input="updateValue(amountValue)" v-model="amount">
+  <input type="tel" :placeholder="placeholder" ref="numeric" @input="processValue(amountValue)" v-model="amount">
 </template>
 
 <script>
 export default {
-
-  name: 'vue-numeric',
+  name: 'Vue-Numeric',
 
   props: {
-    value: {
-      default: 0,
-      required: true,
+    default: {
+      required: false,
       type: [String, Number]
     },
 
-    currency: {
-      default: '',
+    placeholder: {
       required: false,
       type: String
     },
 
     min: {
       required: false,
-      type: Number
+      type: [String, Number]
     },
 
     max: {
       required: false,
-      type: Number
+      type: [String, Number]
+    },
+
+    currency: {
+      default: '',
+      required: false,
+      type: String
     },
 
     separator: {
@@ -42,51 +45,69 @@ export default {
   }),
 
   computed: {
+    amountValue () {
+      return this.formatToNumber(this.amount)
+    },
+
     defaultValue () {
-      return this.formatToNumber(this.value)
+      if (this.default) return this.formatToNumber(this.default)
+      return 0
     },
 
-    amountValue () {
-      return this.formatToNumber(this.amount)
+    minValue () {
+      return this.formatToNumber(this.min)
+    },
+
+    maxValue () {
+      return this.formatToNumber(this.max)
     }
   },
 
+  mounted () {
+    if (this.default) this.processValue(this.defaultValue)
+  },
+
   methods: {
-    checkMinValue (value) {
-      if (this.min) {
-        if (value >= this.min) return true
-        return false
+    checkMaxValue (value) {
+      if (this.max) {
+        if (value <= this.maxValue) return false
+        return true
       }
-      return true
+      return false
     },
 
-    checkMaxValue (value) {
-      if (this.max) {
-        if (value <= this.max) return true
-        return false
+    checkMinValue (value) {
+      if (this.min) {
+        if (value >= this.minValue) return false
+        return true
       }
-      return true
+      return false
     },
 
     formatToNumber (value) {
-      +value.replace(/[^0-9]+/g, '')
+      return Number(+value.replace(/[^0-9]+/g, ''))
     },
 
     formatToCurrency (value) {
-      const numberWithSeparator = Number(value).toString().replace(/\B(?=(\d{3})+(?!\d))/g, this.separator)
+      const numberWithSeparator = value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, this.separator)
       return this.currency + ' ' + numberWithSeparator
     },
 
-    updateValue (value) {
-      if (this.checkMinValue(value) && this.checkMaxValue(value)) {
-        this.amount = this.formatToCurrency(value)
-        this.$emit('input', value)
+    processValue (value) {
+      if (this.checkMaxValue(value)) {
+        this.updateValue(this.maxValue)
+      } else if (this.checkMinValue(value)) {
+        this.updateValue(this.minValue)
+      } else {
+        this.updateValue(value)
       }
+    },
+
+    updateValue (value) {
+      this.amount = this.formatToCurrency(value)
+      this.$emit('input', value)
     }
-  },
 
-  mounted () {
-    this.updateValue(this.defaultValue)
   }
 }
-</script>
+</script>
\ No newline at end of file