added mouse click event to change the cursor position on enter the elment

Author: Dipak Sarkar

docs/.vuepress/components/Example.vue

@@ -75,7 +75,7 @@ export default {
         decimal: ',',
         separator: '.',
         prefix: '$',
-        suffix: '',
+        suffix: ' %',
         precision: 2,
         masked: false
       }

src/core.js

@@ -115,6 +115,11 @@ export function inputHandler(event) {
   positionFromEnd = Math.max(positionFromEnd, config.suffix.length)
   positionFromEnd = target.value.length - positionFromEnd
   positionFromEnd = Math.max(positionFromEnd, config.prefix.length + 1)
+  const decimalPosition = target.value.indexOf(config.decimal)
+  if (decimalPosition > 0 && (positionFromEnd - decimalPosition) <= config.precision) {
+    // eslint-disable-next-line no-plusplus
+    positionFromEnd++
+  }
   updateCursor(target, positionFromEnd)
 
   if (oldValue !== target.value) {

src/directive.js

@@ -25,8 +25,14 @@ export default {
     handlerOwner.addEventListener('input', oninput, true)
 
     el.onblur = (e) => core.blurHandler(e)
+    el.onclick = ({ target }) => {
+      const { selectionStart, value } = target
+      if (config.suffix.length && (value.length - selectionStart) < config.suffix.length) core.updateCursor(el, el.value.length - config.suffix.length)
+      else if (config.prefix.length && selectionStart < config.prefix.length) core.updateCursor(el, config.prefix.length)
+    }
 
     // check decimal key and insert to current element
+    // updated cursor position after format the value
     el.onkeydown = (e) => {
       if (e.key === '.') {
         e.preventDefault()