@coders-tm/vue-number-format - npm Package Compare versions

Comparing version 2.2.0 to 2.2.11

dist/index.cjs.js

 /**
- * Vue Number Input 1.0.0
- * (c) 2021-2022 Dipak Sarkar <[e-mail]> (https://dipaksarkar.in/)
+ * Vue Number Format 2.2.1
+ * (c) 2018-2022 Dipak Sarkar <[e-mail]> (https://dipaksarkar.in/)
  * @license MIT
  */
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var vue = require('vue');
-
-var options = {
+'use strict';Object.defineProperty(exports,'__esModule',{value:true});var options$1 = {
   prefix: '',
@@ -18,3 +12,2 @@ suffix: '',
   precision: 2,
-  minimumFractionDigits: false,
   prefill: true,
@@ -25,32 +18,35 @@ reverseFill: false,
   nullValue: ''
-};
-
-/**
+};/**
  * Number format function
  * @param {Object} options
  */
-function NumberFormat(config = options) {
-  this.options = Object.assign(options, config);
-  this.input = "";
-  this.number = "";
+function NumberFormat(config) {
+  var this$1$1 = this;
+  if ( config === void 0 ) config = options$1;
+
+  this.options = Object.assign(options$1, config);
+  this.input = '';
+  this.number = '';
   this.isClean = false;
 
-  this.isNull = (input = this.input) =>
-    !this.numberOnly(input, new RegExp("[^0-9]+", "gi"));
+  this.isNull = function (input) {
+    if ( input === void 0 ) input = this$1$1.input;
 
-  this.clean = (clean = false) => {
-    this.isClean = clean;
-    return this;
+    return !this$1$1.numberOnly(input, new RegExp('[^0-9]+', 'gi'));
   };
 
-  this.sign = () => {
-    const sign =
-      this.input.toString().indexOf("-") >= 0 && this.realNumber() > 0
-        ? "-"
-        : "";
-    return sign;
+  this.clean = function (clean) {
+    if ( clean === void 0 ) clean = false;
+
+    this$1$1.isClean = clean;
+    return this$1$1
   };
 
+  this.sign = function () {
+    var sign = (this$1$1.input.toString().indexOf('-') >= 0 && this$1$1.realNumber() > 0) ? '-' : '';
+    return sign
+  };
+
   function between(min, n, max) {
-    return Math.max(min, Math.min(n, max));
+    return Math.max(min, Math.min(n, max))
   }
@@ -60,3 +56,3 @@
   function fixed(precision) {
-    return between(0, precision, 20);
+    return between(0, precision, 20)
   }
@@ -67,75 +63,60 @@
     var exp = Math.pow(10, precision);
-    var float = parseFloat(numbers) / exp || 0;
-    return float.toFixed(fixed(precision));
+    var float = parseFloat(numbers) / exp;
+    return float.toFixed(fixed(precision))
   }
 
-  this.toNumber = (string) => Number(string);
+  this.toNumber = function (string) { return Number(string); };
 
-  this.numberOnly = (string, regExp) => string.toString().replace(regExp, "");
+  this.numberOnly = function (string, regExp) { return string.toString().replace(regExp, ''); };
 
-  this.isNegative = this.sign() === "-";
+  this.isNegative = this.sign() === '-';
 
-  this.numbers = () => {
-    if (this.options.reverseFill) {
-      this.number = toFixed(
-        this.numberOnly(this.input, /\D+/g),
-        this.options.precision
-      ).replace(".", this.options.decimal);
-    } else if (typeof this.input === "number") {
-      this.number = this.parts(
-        this.input.toString().replace("-", ""),
-        "."
-      ).join(this.options.decimal);
+  this.numbers = function () {
+    if (this$1$1.options.reverseFill) {
+      this$1$1.number = toFixed(this$1$1.numberOnly(this$1$1.input, /\D+/g), this$1$1.options.precision).replace('.', this$1$1.options.decimal);
+    } else if (typeof this$1$1.input === 'number') {
+      if (this$1$1.isClean) {
+        this$1$1.number = this$1$1.toNumber(this$1$1.input.toFixed(this$1$1.options.precision)).toString().replace('-', '').replace('.', this$1$1.options.decimal);
+      } else {
+        this$1$1.number = this$1$1.toNumber(this$1$1.input).toString().replace('-', '').replace('.', this$1$1.options.decimal);
+      }
     } else {
-      this.number = this.numberOnly(
-        this.input,
-        new RegExp(`[^0-9\\${this.options.decimal}]+`, "gi")
-      );
-      this.number = this.parts(this.number).join(this.options.decimal);
+      this$1$1.number = this$1$1.numberOnly(this$1$1.input, new RegExp(("[^0-9\\" + (this$1$1.options.decimal) + "]+"), 'gi'));
+      this$1$1.number = this$1$1.parts(this$1$1.number).join(this$1$1.options.decimal);
     }
-    return this.number;
+    return this$1$1.number
   };
 
-  this.realNumber = () => {
-    return this.numbers().toString().replace(this.options.decimal, ".");
+  this.realNumber = function () {
+    var number = this$1$1.numbers().toString().replace(this$1$1.options.decimal, '.');
+    if (this$1$1.options.reverseFill) {
+      return number
+    }
+    return this$1$1.toNumber(number)
   };
 
-  this.parts = (number = "", decimal = this.options.decimal) => {
+  this.parts = function (number, decimal) {
+    if ( number === void 0 ) number = '';
+    if ( decimal === void 0 ) decimal = this$1$1.options.decimal;
+
     var parts = number.toString().split(decimal);
-    parts[0] = this.toNumber(parts[0]) || 0;
-
+    parts[0] = this$1$1.toNumber(parts[0]) || 0;
     if (parts.length > 1) {
-      parts[1] = parts.slice(1, parts.length).join("");
+      parts[1] = parts.slice(1, parts.length).join('');
       parts = parts.slice(0, 2);
-    }
-
-    if (this.isClean) {
-      const newNumber = this.toNumber(parts.join(".")).toFixed(
-        this.options.precision
-      );
-      const cleanNumber = this.toNumber(newNumber);
-      const minimumDigits = cleanNumber.toFixed(
-        this.options.minimumFractionDigits
-      );
-
-      if (
-        this.options.minimumFractionDigits &&
-        this.options.minimumFractionDigits >= 0 &&
-        cleanNumber.toString().length < minimumDigits.length
-      ) {
-        parts = minimumDigits.toString().split(".");
-      } else {
-        parts = cleanNumber.toString().split(".");
+      if (this$1$1.isClean && parts[1].length > this$1$1.options.precision) {
+        parts[1] = this$1$1.toNumber(("." + (parts[1]))).toFixed(this$1$1.options.precision).toString().replace('0.', '');
       }
     }
-
-    return parts.slice(0, 2);
+    return parts.slice(0, 2)
   };
 
-  this.addSeparator = () => {
-    var parts = this.numbers().split(this.options.decimal);
-    parts[0] = parts[0]
-      .toString()
-      .replace(/(\d)(?=(?:\d{3})+\b)/gm, `$1${this.options.separator}`);
-    return parts.join(this.options.decimal);
+  this.addSeparator = function () {
+    var parts = this$1$1.numbers().split(this$1$1.options.decimal);
+    parts[0] = parts[0].toString().replace(/(\d)(?=(?:\d{3})+\b)/gm, ("$1" + (this$1$1.options.separator)));
+    if (this$1$1.isClean) {
+      parts[1] = this$1$1.toNumber(("." + (parts[1]))).toString().replace('0.', '');
+      return parts[1] && parts[1] > 0 ? parts.join(this$1$1.options.decimal) : parts[0]
+    }
+    return parts.join(this$1$1.options.decimal)
   };
@@ -148,13 +129,7 @@
    */
-  this.format = (input) => {
-    if (input === "") return this.options.nullValue;
-    this.input = input || this.options.nullValue;
-    if (this.isNull() && !this.options.reverseFill)
-      return this.options.nullValue;
-    return (
-      this.sign() +
-      this.options.prefix +
-      this.addSeparator() +
-      this.options.suffix
-    );
+  this.format = function (input) {
+    if (input === '') { return this$1$1.options.nullValue }
+    this$1$1.input = input || this$1$1.options.nullValue;
+    if (this$1$1.isNull()) { return this$1$1.options.nullValue }
+    return this$1$1.sign() + this$1$1.options.prefix + this$1$1.addSeparator() + this$1$1.options.suffix
   };
@@ -167,14 +142,20 @@
    */
-  this.unformat = (input) => {
-    if (input === "") return this.options.nullValue;
-    this.input = input || this.options.nullValue;
-    if (this.isNull() && !this.options.reverseFill)
-      return this.options.nullValue;
-    return this.sign() + this.realNumber();
+  this.unformat = function (input) {
+    if (input === '') { return this$1$1.options.nullValue }
+    this$1$1.input = input || this$1$1.options.nullValue;
+    if (this$1$1.isNull()) { return this$1$1.options.nullValue }
+    return this$1$1.sign() + this$1$1.realNumber()
   };
-}
+}// import options from './options'
 
-const CONFIG_KEY$1 = '__input-facade__';
+var CONFIG_KEY$1 = '__input-facade__';
 
 /**
+ * Creates a fuction to clone the objcet
+ */
+function cloneDeep(data) {
+  return JSON.parse(JSON.stringify(data))
+}
+
+/**
  * Creates a CustomEvent('input') with detail = { facade: true }
@@ -187,3 +168,3 @@ * used as a way to identify our own input event
     cancelable: true,
-    detail: { facade: true },
+    detail: { facade: true }
   })
@@ -200,3 +181,3 @@ }
     cancelable: true,
-    detail: { facade: true },
+    detail: { facade: true }
   })
@@ -212,4 +193,3 @@ }
 function getInputElement(el) {
-  const inputElement =
-    el instanceof HTMLInputElement ? el : el.querySelector('input');
+  var inputElement = el instanceof HTMLInputElement ? el : el.querySelector('input');
 
@@ -230,5 +210,3 @@ /* istanbul ignore next */
 function updateCursor(el, position) {
-  const setSelectionRange = () => {
-    el.setSelectionRange(position, position);
-  };
+  var setSelectionRange = function () { el.setSelectionRange(position, position); };
   setSelectionRange();
@@ -247,30 +225,34 @@ // Android Fix
  */
-function updateValue(
-  el,
-  vnode,
-  { emit = true, force = false, clean = false } = {}
-) {
-  const { config } = el[CONFIG_KEY$1];
-  let { oldValue } = el[CONFIG_KEY$1];
-  let currentValue = vnode && vnode.props ? vnode.props.value : el.value;
+function updateValue(el, vnode, ref) {
+  if ( ref === void 0 ) ref = {};
+  var emit = ref.emit; if ( emit === void 0 ) emit = true;
+  var force = ref.force; if ( force === void 0 ) force = false;
+  var clean = ref.clean; if ( clean === void 0 ) clean = false;
 
+  var ref$1 = el[CONFIG_KEY$1];
+  var config = ref$1.config;
+  var ref$2 = el[CONFIG_KEY$1];
+  var oldValue = ref$2.oldValue;
+
+  var currentValue = vnode && vnode.data.model ? vnode.data.model.value : el.value;
+
   oldValue = oldValue || '';
   currentValue = currentValue || '';
 
-  const number = new NumberFormat(config).clean(clean && !config.reverseFill);
-  let masked = number.format(currentValue);
-  let unmasked = number.clean(!config.reverseFill).unformat(currentValue);
+  if (force || oldValue !== currentValue) {
+    var number = new NumberFormat(config).clean(clean && !config.reverseFill);
+    var masked = number.format(currentValue);
+    var unmasked = number.clean(!config.reverseFill).unformat(currentValue);
 
-  // check value with in range max and min value
-  if (clean) {
-    if (Number(config.max) && unmasked > Number(config.max)) {
-      masked = number.format(config.max);
-      unmasked = number.unformat(config.max);
-    } else if (Number(config.min) && unmasked < Number(config.min)) {
-      masked = number.format(config.min);
-      unmasked = number.unformat(config.min);
+    // check value with in range max and min value
+    if (clean) {
+      if (Number(config.max) && unmasked > Number(config.max)) {
+        masked = number.format(config.max);
+        unmasked = number.unformat(config.max);
+      } else if (Number(config.min) && unmasked < Number(config.min)) {
+        masked = number.format(config.min);
+        unmasked = number.unformat(config.min);
+      }
     }
-  }
 
-  if (force || oldValue !== currentValue) {
     el[CONFIG_KEY$1].oldValue = masked;
@@ -285,7 +267,3 @@ el.unmaskedValue = unmasked;
     // drawback is that we endup with two's input events in firefox
-    return (
-      emit &&
-      el.dispatchEvent(FacadeInputEvent()) &&
-      el.dispatchEvent(FacadeChangeEvent())
-    )
+    return emit && el.dispatchEvent(FacadeInputEvent())
   }
@@ -300,3 +278,4 @@ }
 function inputHandler(event) {
-  const { target, detail } = event;
+  var target = event.target;
+  var detail = event.detail;
   // We dont need to run this method on the event we emit (prevent event loop)
@@ -311,6 +290,9 @@ if (detail && detail.facade) {
 
-  let positionFromEnd = target.value.length - target.selectionEnd;
-  const { oldValue, config } = target[CONFIG_KEY$1];
+  var positionFromEnd = target.value.length - target.selectionEnd;
+  var ref = target[CONFIG_KEY$1];
+  var oldValue = ref.oldValue;
+  var config = ref.config;
 
   updateValue(target, null, { emit: false });
+
   // updated cursor position
@@ -333,3 +315,4 @@ positionFromEnd = Math.max(positionFromEnd, config.suffix.length);
 function blurHandler(event) {
-  const { target, detail } = event;
+  var target = event.target;
+  var detail = event.detail;
   // We dont need to run this method on the event we emit (prevent event loop)
@@ -340,20 +323,22 @@ if (detail && detail.facade) {
 
-  const { oldValue } = target[CONFIG_KEY$1];
+  var ref = target[CONFIG_KEY$1];
+  var oldValue = ref.oldValue;
 
-  updateValue(target, null, { force: true, clean: true });
+  updateValue(target, null, { force: true, emit: false, clean: true });
 
   if (oldValue !== target.value) {
-    target.dispatchEvent(FacadeInputEvent());
+    target.dispatchEvent(FacadeChangeEvent());
   }
-}
+}/* eslint-disable prefer-object-spread */
 
-/* eslint-disable prefer-object-spread */
+var CONFIG_KEY = CONFIG_KEY$1;
 
-const CONFIG_KEY = CONFIG_KEY$1;
+var vNumber = {
+  bind: function (el, ref, vnode) {
+    var value = ref.value;
+    var modifiers = ref.modifiers;
 
-var vNumber = {
-  beforeMount: (el, { value, modifiers }, vnode) => {
     el = getInputElement(el);
-    const config = Object.assign({}, options, value, modifiers);
-    el[CONFIG_KEY] = { config };
+    var config = Object.assign({}, cloneDeep(options$1), value, modifiers);
+    el[CONFIG_KEY] = { config: config };
     // set initial value
@@ -363,37 +348,62 @@ updateValue(el, vnode, { force: config.prefill, clean: true });
 
-  mounted: (el) => {
+  inserted: function (el) {
     el = getInputElement(el);
-    const option = el[CONFIG_KEY];
-    const { config } = option;
+    var option = el[CONFIG_KEY];
+    var config = option.config;
     // prefer adding event listener to parent element to avoid Firefox bug which does not
     // execute `useCapture: true` event handlers before non-capturing event handlers
-    const handlerOwner = el.parentElement || el;
+    var handlerOwner = el.parentElement || el;
 
     // use anonymous event handler to avoid inadvertently removing masking for all inputs within a container
-    const oninput = (e) => inputHandler(e);
+    var oninput = function (e) {
+      if (e.target !== el) {
+        return
+      }
+      inputHandler(e);
+    };
 
     handlerOwner.addEventListener('input', oninput, true);
 
-    el.onblur = (e) => blurHandler(e);
+    el.onblur = function (e) { return blurHandler(e); };
 
     // check decimal key and insert to current element
     // updated cursor position after format the value
-    el.onkeydown = (e) => {
-      if (([110, 190].includes(e.keyCode) || e.key === config.decimal) && !el.value.includes(config.decimal)) {
+    el.onkeydown = function (e) {
+      if (
+        ([110, 190].includes(e.keyCode) || e.key === config.decimal) && el.value.includes(config.decimal)
+      ) {
         e.preventDefault();
-        el.setRangeText(config.decimal);
-        el.dispatchEvent(new Event('input'));
-        updateCursor(el, el.value.indexOf(config.decimal) + 1);
-      } else if (([110, 190].includes(e.keyCode) || e.key === config.decimal) && el.value.includes(config.decimal)) {
-        e.preventDefault();
+      } else if ([8].includes(e.keyCode)) {
+        // check current cursor position is after separator when backspace key down
+        var character = el.value.slice(el.selectionEnd - 1, el.selectionEnd);
+        var replace = el.value.slice(el.selectionEnd - 2, el.selectionEnd);
+        if (character === config.separator) {
+          e.preventDefault();
+
+          var positionFromEnd = el.value.length - el.selectionEnd;
+          // remove separator and before character
+          el.value = el.value.replace(replace, '');
+          // updated cursor position
+          positionFromEnd = Math.max(positionFromEnd, config.suffix.length);
+          positionFromEnd = el.value.length - positionFromEnd;
+          positionFromEnd = Math.max(positionFromEnd, config.prefix.length);
+          updateCursor(el, positionFromEnd);
+          // trigger input event
+          el.dispatchEvent(new Event('input'));
+        }
       }
     };
 
-    option.cleanup = () => handlerOwner.removeEventListener('input', oninput, true);
+    option.cleanup = function () { return handlerOwner.removeEventListener('input', oninput, true); };
   },
 
-  updated: (el, { value, oldValue, modifiers }, vnode) => {
+  update: function (el, ref, vnode) {
+    var value = ref.value;
+    var oldValue = ref.oldValue;
+    var modifiers = ref.modifiers;
+
     el = getInputElement(el);
     if (value !== oldValue) {
-      const { config } = el[CONFIG_KEY];
+      var ref$1 = el[CONFIG_KEY];
+      var config = ref$1.config;
       el[CONFIG_KEY].config = Object.assign({}, config, value, modifiers);
@@ -406,137 +416,221 @@ updateValue(el, vnode, { force: true, clean: true });
 
-  unmounted: (el) => {
+  unbind: function (el) {
     getInputElement(el)[CONFIG_KEY].cleanup();
   }
-};
+};//
 
+var options = cloneDeep(options$1);
+
 var script = {
   props: {
-    modelValue: {
+    value: {
       required: true,
+      type: [Number, String]
     },
     nullValue: {
       type: [Number, String],
-      default: () => options.nullValue,
+      default: function () { return options.nullValue; }
     },
     masked: {
       type: Boolean,
-      default: false,
+      default: false
     },
     reverseFill: {
       type: Boolean,
-      default: options.reverseFill,
+      default: options.reverseFill
     },
     prefill: {
       type: Boolean,
-      default: options.prefill,
+      default: options.prefill
     },
     precision: {
       type: Number,
-      default: () => options.precision,
+      default: function () { return options.precision; }
     },
     minimumFractionDigits: {
       type: [Number, Boolean],
-      default: () => options.minimumFractionDigits,
+      default: function () { return options.minimumFractionDigits; }
     },
     decimal: {
       type: String,
-      default: () => options.decimal,
+      default: function () { return options.decimal; }
     },
     min: {
       type: [Number, Boolean],
-      default: () => options.min,
+      default: function () { return options.min; }
     },
     max: {
       type: [Number, Boolean],
-      default: () => options.max,
+      default: function () { return options.max; }
     },
     separator: {
       type: String,
-      default: () => options.separator,
+      default: function () { return options.separator; }
     },
     prefix: {
       type: String,
-      default: () => options.prefix,
+      default: function () { return options.prefix; }
     },
     suffix: {
       type: String,
-      default: () => options.suffix,
-    },
+      default: function () { return options.suffix; }
+    }
   },
   directives: {
-    number: vNumber,
+    number: vNumber
   },
-  emits: ['update:model-value'],
-  data() {
+  data: function data() {
     return {
-      maskedValue: this.modelValue,
-      unmaskedValue: null,
+      maskedValue: this.value,
+      unmaskedValue: null
     }
   },
   methods: {
-    input({ target }) {
+    input: function input(ref) {
+      var target = ref.target;
+
       this.maskedValue = target.value;
       this.unmaskedValue = target.unmaskedValue;
+      this.$emit('input', this.emittedValue);
     },
-    change() {
-      this.$emit('update:model-value', this.emittedValue);
-    },
+    change: function change() {
+      this.$emit('change', this.emittedValue);
+    }
   },
   computed: {
-    emittedValue() {
+    emittedValue: function emittedValue() {
       return this.masked ? this.maskedValue : this.unmaskedValue
     },
-    config() {
-      const config = {};
+    config: function config() {
+      var this$1$1 = this;
+
+      var config = {};
       Object.keys(this.$props)
-        .filter((item) => item !== 'modelValue')
-        .forEach((item) => {
-          config[item] = this.$props[item];
+        .filter(function (item) { return item !== 'value'; })
+        .forEach(function (item) {
+          config[item] = this$1$1.$props[item];
         });
       return config
-    },
+    }
   },
   watch: {
-    modelValue(val) {
+    value: function value(val) {
       if (this.unmaskedValue !== val) {
         this.maskedValue = val;
       }
-    },
-  },
-};
+    }
+  }
+};function normalizeComponent(template, style, script, scopeId, isFunctionalTemplate, moduleIdentifier /* server only */, shadowMode, createInjector, createInjectorSSR, createInjectorShadow) {
+    if (typeof shadowMode !== 'boolean') {
+        createInjectorSSR = createInjector;
+        createInjector = shadowMode;
+        shadowMode = false;
+    }
+    // Vue.extend constructor export interop.
+    var options = typeof script === 'function' ? script.options : script;
+    // render functions
+    if (template && template.render) {
+        options.render = template.render;
+        options.staticRenderFns = template.staticRenderFns;
+        options._compiled = true;
+        // functional template
+        if (isFunctionalTemplate) {
+            options.functional = true;
+        }
+    }
+    // scopedId
+    if (scopeId) {
+        options._scopeId = scopeId;
+    }
+    var hook;
+    if (moduleIdentifier) {
+        // server build
+        hook = function (context) {
+            // 2.3 injection
+            context =
+                context || // cached call
+                    (this.$vnode && this.$vnode.ssrContext) || // stateful
+                    (this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext); // functional
+            // 2.2 with runInNewContext: true
+            if (!context && typeof __VUE_SSR_CONTEXT__ !== 'undefined') {
+                context = __VUE_SSR_CONTEXT__;
+            }
+            // inject component styles
+            if (style) {
+                style.call(this, createInjectorSSR(context));
+            }
+            // register component module identifier for async chunk inference
+            if (context && context._registeredComponents) {
+                context._registeredComponents.add(moduleIdentifier);
+            }
+        };
+        // used by ssr in case component is cached and beforeCreate
+        // never gets called
+        options._ssrRegister = hook;
+    }
+    else if (style) {
+        hook = shadowMode
+            ? function (context) {
+                style.call(this, createInjectorShadow(context, this.$root.$options.shadowRoot));
+            }
+            : function (context) {
+                style.call(this, createInjector(context));
+            };
+    }
+    if (hook) {
+        if (options.functional) {
+            // register for functional component in vue file
+            var originalRender = options.render;
+            options.render = function renderWithStyleInjection(h, context) {
+                hook.call(context);
+                return originalRender(h, context);
+            };
+        }
+        else {
+            // inject component registration as beforeCreate hook
+            var existing = options.beforeCreate;
+            options.beforeCreate = existing ? [].concat(existing, hook) : [hook];
+        }
+    }
+    return script;
+}/* script */
+var __vue_script__ = script;
 
-const _hoisted_1 = ["value"];
+/* template */
+var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('input',{directives:[{name:"number",rawName:"v-number",value:(_vm.config),expression:"config"}],staticClass:"v-number",attrs:{"type":"text","autocomplete":"off"},domProps:{"value":_vm.maskedValue},on:{"change":_vm.change,"input":_vm.input,"blur":function (evt) { return _vm.$emit('blur', evt); },"focus":function (evt) { return _vm.$emit('focus', evt); }}},[])};
+var __vue_staticRenderFns__ = [];
 
-function render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _directive_number = vue.resolveDirective("number");
+  /* style */
+  var __vue_inject_styles__ = undefined;
+  /* scoped */
+  var __vue_scope_id__ = undefined;
+  /* module identifier */
+  var __vue_module_identifier__ = "data-v-d0c33a18";
+  /* functional template */
+  var __vue_is_functional_template__ = false;
+  /* style inject */
+  
+  /* style inject SSR */
+  
+  /* style inject shadow dom */
+  
 
-  return vue.withDirectives((vue.openBlock(), vue.createElementBlock("input", {
-    type: "text",
-    autocomplete: "off",
-    value: $data.maskedValue,
-    onChange: _cache[0] || (_cache[0] = (...args) => ($options.change && $options.change(...args))),
-    onInput: _cache[1] || (_cache[1] = (...args) => ($options.input && $options.input(...args))),
-    class: "v-number"
-  }, null, 40 /* PROPS, HYDRATE_EVENTS */, _hoisted_1)), [
-    [_directive_number, $options.config]
-  ])
-}
-
-script.render = render;
-script.__file = "src/component.vue";
-
-var index = {
-  install(app, config) {
-    if (config) {
-      Object.assign(options, config);
-    }
-    app.directive('number', vNumber);
-    app.component('number', script);
+  
+  var __vue_component__ = /*#__PURE__*/normalizeComponent(
+    { render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ },
+    __vue_inject_styles__,
+    __vue_script__,
+    __vue_scope_id__,
+    __vue_is_functional_template__,
+    __vue_module_identifier__,
+    false,
+    undefined,
+    undefined,
+    undefined
+  );function install(Vue, globalOptions) {
+  if (globalOptions) {
+    Object.assign(options$1, globalOptions);
   }
-};
-
-exports.NumberFormat = NumberFormat;
-exports["default"] = index;
-exports.number = script;
-exports.options = options;
-exports.vNumber = vNumber;
+  Vue.directive('number', vNumber);
+  Vue.component('number', __vue_component__);
+}exports.NumberFormat=NumberFormat;exports['default']=install;exports.number=__vue_component__;exports.options=options$1;exports.vNumber=vNumber;//# sourceMappingURL=index.cjs.js.map

dist/index.esm.js

 /**
- * Vue Number Input 1.0.0
- * (c) 2021-2022 Dipak Sarkar <[e-mail]> (https://dipaksarkar.in/)
+ * Vue Number Format 2.2.1
+ * (c) 2018-2022 Dipak Sarkar <[e-mail]> (https://dipaksarkar.in/)
  * @license MIT
  */
-import { resolveDirective, withDirectives, openBlock, createElementBlock } from 'vue';
-
-var options = {
-  prefix: '',
-  suffix: '',
-  separator: ',',
-  decimal: '.',
-  precision: 2,
-  minimumFractionDigits: false,
-  prefill: true,
-  reverseFill: false,
-  min: false,
-  max: false,
-  nullValue: ''
-};
-
-/**
- * Number format function
- * @param {Object} options
- */
-function NumberFormat(config = options) {
-  this.options = Object.assign(options, config);
-  this.input = "";
-  this.number = "";
-  this.isClean = false;
-
-  this.isNull = (input = this.input) =>
-    !this.numberOnly(input, new RegExp("[^0-9]+", "gi"));
-
-  this.clean = (clean = false) => {
-    this.isClean = clean;
-    return this;
-  };
-
-  this.sign = () => {
-    const sign =
-      this.input.toString().indexOf("-") >= 0 && this.realNumber() > 0
-        ? "-"
-        : "";
-    return sign;
-  };
-
-  function between(min, n, max) {
-    return Math.max(min, Math.min(n, max));
-  }
-
-  // Uncaught RangeError: toFixed() digits argument must be between 0 and 20 at Number.toFixed
-  function fixed(precision) {
-    return between(0, precision, 20);
-  }
-
-  function toFixed(numbers, precision) {
-    // eslint-disable-next-line no-restricted-properties
-    var exp = Math.pow(10, precision);
-    var float = parseFloat(numbers) / exp || 0;
-    return float.toFixed(fixed(precision));
-  }
-
-  this.toNumber = (string) => Number(string);
-
-  this.numberOnly = (string, regExp) => string.toString().replace(regExp, "");
-
-  this.isNegative = this.sign() === "-";
-
-  this.numbers = () => {
-    if (this.options.reverseFill) {
-      this.number = toFixed(
-        this.numberOnly(this.input, /\D+/g),
-        this.options.precision
-      ).replace(".", this.options.decimal);
-    } else if (typeof this.input === "number") {
-      this.number = this.parts(
-        this.input.toString().replace("-", ""),
-        "."
-      ).join(this.options.decimal);
-    } else {
-      this.number = this.numberOnly(
-        this.input,
-        new RegExp(`[^0-9\\${this.options.decimal}]+`, "gi")
-      );
-      this.number = this.parts(this.number).join(this.options.decimal);
-    }
-    return this.number;
-  };
-
-  this.realNumber = () => {
-    return this.numbers().toString().replace(this.options.decimal, ".");
-  };
-
-  this.parts = (number = "", decimal = this.options.decimal) => {
-    var parts = number.toString().split(decimal);
-    parts[0] = this.toNumber(parts[0]) || 0;
-
-    if (parts.length > 1) {
-      parts[1] = parts.slice(1, parts.length).join("");
-      parts = parts.slice(0, 2);
-    }
-
-    if (this.isClean) {
-      const newNumber = this.toNumber(parts.join(".")).toFixed(
-        this.options.precision
-      );
-      const cleanNumber = this.toNumber(newNumber);
-      const minimumDigits = cleanNumber.toFixed(
-        this.options.minimumFractionDigits
-      );
-
-      if (
-        this.options.minimumFractionDigits &&
-        this.options.minimumFractionDigits >= 0 &&
-        cleanNumber.toString().length < minimumDigits.length
-      ) {
-        parts = minimumDigits.toString().split(".");
-      } else {
-        parts = cleanNumber.toString().split(".");
-      }
-    }
-
-    return parts.slice(0, 2);
-  };
-
-  this.addSeparator = () => {
-    var parts = this.numbers().split(this.options.decimal);
-    parts[0] = parts[0]
-      .toString()
-      .replace(/(\d)(?=(?:\d{3})+\b)/gm, `$1${this.options.separator}`);
-    return parts.join(this.options.decimal);
-  };
-
-  /**
-   * Format the input with default config if there is no constructor config
-   * @param {Number, String} input
-   * @return {String}
-   */
-  this.format = (input) => {
-    if (input === "") return this.options.nullValue;
-    this.input = input || this.options.nullValue;
-    if (this.isNull() && !this.options.reverseFill)
-      return this.options.nullValue;
-    return (
-      this.sign() +
-      this.options.prefix +
-      this.addSeparator() +
-      this.options.suffix
-    );
-  };
-
-  /**
-   * Unformat the input with default config if there is no constructor config
-   * @param {Number, String} input
-   * @return {String}
-   */
-  this.unformat = (input) => {
-    if (input === "") return this.options.nullValue;
-    this.input = input || this.options.nullValue;
-    if (this.isNull() && !this.options.reverseFill)
-      return this.options.nullValue;
-    return this.sign() + this.realNumber();
-  };
-}
-
-const CONFIG_KEY$1 = '__input-facade__';
-
-/**
- * Creates a CustomEvent('input') with detail = { facade: true }
- * used as a way to identify our own input event
- */
-function FacadeInputEvent() {
-  return new CustomEvent('input', {
-    bubbles: true,
-    cancelable: true,
-    detail: { facade: true },
-  })
-}
-
-/**
- * Creates a CustomEvent('change') with detail = { facade: true }
- * used as a way to identify our own change event
- */
-function FacadeChangeEvent() {
-  return new CustomEvent('change', {
-    bubbles: true,
-    cancelable: true,
-    detail: { facade: true },
-  })
-}
-
-/**
- * ensure that the element we're attaching to is an input element
- * if not try to find an input element in this elements childrens
- *
- * @param {HTMLInputElement} el
- */
-function getInputElement(el) {
-  const inputElement =
-    el instanceof HTMLInputElement ? el : el.querySelector('input');
-
-  /* istanbul ignore next */
-  if (!inputElement) {
-    throw new Error('facade directive requires an input element')
-  }
-
-  return inputElement
-}
-
-/**
- * Updates the cursor position to the right place after the masking rule was applied
- * @param {HTMLElement} el
- * @param {Number} position
- */
-function updateCursor(el, position) {
-  const setSelectionRange = () => {
-    el.setSelectionRange(position, position);
-  };
-  setSelectionRange();
-  // Android Fix
-  setTimeout(setSelectionRange(), 1);
-}
-
-/**
- * Updates the element's value and unmasked value based on the masking config rules
- *
- * @param {HTMLInputElement} el The input element to update
- * @param {object} [options]
- * @param {Boolean} options.emit Wether to dispatch a new InputEvent or not
- * @param {Boolean} options.force Forces the update even if the old value and the new value are the same
- */
-function updateValue(
-  el,
-  vnode,
-  { emit = true, force = false, clean = false } = {}
-) {
-  const { config } = el[CONFIG_KEY$1];
-  let { oldValue } = el[CONFIG_KEY$1];
-  let currentValue = vnode && vnode.props ? vnode.props.value : el.value;
-
-  oldValue = oldValue || '';
-  currentValue = currentValue || '';
-
-  const number = new NumberFormat(config).clean(clean && !config.reverseFill);
-  let masked = number.format(currentValue);
-  let unmasked = number.clean(!config.reverseFill).unformat(currentValue);
-
-  // check value with in range max and min value
-  if (clean) {
-    if (Number(config.max) && unmasked > Number(config.max)) {
-      masked = number.format(config.max);
-      unmasked = number.unformat(config.max);
-    } else if (Number(config.min) && unmasked < Number(config.min)) {
-      masked = number.format(config.min);
-      unmasked = number.unformat(config.min);
-    }
-  }
-
-  if (force || oldValue !== currentValue) {
-    el[CONFIG_KEY$1].oldValue = masked;
-    el.unmaskedValue = unmasked;
-    // safari makes the cursor jump to the end if el.value gets assign even if to the same value
-    if (el.value !== masked) {
-      el.value = masked;
-    }
-
-    // this part needs to be outside the above IF statement for vuetify in firefox
-    // drawback is that we endup with two's input events in firefox
-    return (
-      emit &&
-      el.dispatchEvent(FacadeInputEvent()) &&
-      el.dispatchEvent(FacadeChangeEvent())
-    )
-  }
-}
-
-/**
- * Input event handler
- *
- * @param {Event} event The event object
- */
-function inputHandler(event) {
-  const { target, detail } = event;
-  // We dont need to run this method on the event we emit (prevent event loop)
-  if (detail && detail.facade) {
-    return false
-  }
-
-  // since we will be emitting our own custom input event
-  // we can stop propagation of this native event
-  event.stopPropagation();
-
-  let positionFromEnd = target.value.length - target.selectionEnd;
-  const { oldValue, config } = target[CONFIG_KEY$1];
-
-  updateValue(target, null, { emit: false });
-  // updated cursor position
-  positionFromEnd = Math.max(positionFromEnd, config.suffix.length);
-  positionFromEnd = target.value.length - positionFromEnd;
-  positionFromEnd = Math.max(positionFromEnd, config.prefix.length + 1);
-  updateCursor(target, positionFromEnd);
-
-  if (oldValue !== target.value) {
-    target.dispatchEvent(FacadeInputEvent());
-  }
-}
-
-/**
- * Blur event handler
- *
- * @param {Event} event The event object
- */
-function blurHandler(event) {
-  const { target, detail } = event;
-  // We dont need to run this method on the event we emit (prevent event loop)
-  if (detail && detail.facade) {
-    return false
-  }
-
-  const { oldValue } = target[CONFIG_KEY$1];
-
-  updateValue(target, null, { force: true, clean: true });
-
-  if (oldValue !== target.value) {
-    target.dispatchEvent(FacadeInputEvent());
-  }
-}
-
-/* eslint-disable prefer-object-spread */
-
-const CONFIG_KEY = CONFIG_KEY$1;
-
-var vNumber = {
-  beforeMount: (el, { value, modifiers }, vnode) => {
-    el = getInputElement(el);
-    const config = Object.assign({}, options, value, modifiers);
-    el[CONFIG_KEY] = { config };
-    // set initial value
-    updateValue(el, vnode, { force: config.prefill, clean: true });
-  },
-
-  mounted: (el) => {
-    el = getInputElement(el);
-    const option = el[CONFIG_KEY];
-    const { config } = option;
-    // prefer adding event listener to parent element to avoid Firefox bug which does not
-    // execute `useCapture: true` event handlers before non-capturing event handlers
-    const handlerOwner = el.parentElement || el;
-
-    // use anonymous event handler to avoid inadvertently removing masking for all inputs within a container
-    const oninput = (e) => inputHandler(e);
-
-    handlerOwner.addEventListener('input', oninput, true);
-
-    el.onblur = (e) => blurHandler(e);
-
-    // check decimal key and insert to current element
-    // updated cursor position after format the value
-    el.onkeydown = (e) => {
-      if (([110, 190].includes(e.keyCode) || e.key === config.decimal) && !el.value.includes(config.decimal)) {
-        e.preventDefault();
-        el.setRangeText(config.decimal);
-        el.dispatchEvent(new Event('input'));
-        updateCursor(el, el.value.indexOf(config.decimal) + 1);
-      } else if (([110, 190].includes(e.keyCode) || e.key === config.decimal) && el.value.includes(config.decimal)) {
-        e.preventDefault();
-      }
-    };
-
-    option.cleanup = () => handlerOwner.removeEventListener('input', oninput, true);
-  },
-
-  updated: (el, { value, oldValue, modifiers }, vnode) => {
-    el = getInputElement(el);
-    if (value !== oldValue) {
-      const { config } = el[CONFIG_KEY];
-      el[CONFIG_KEY].config = Object.assign({}, config, value, modifiers);
-      updateValue(el, vnode, { force: true, clean: true });
-    } else {
-      updateValue(el, vnode);
-    }
-  },
-
-  unmounted: (el) => {
-    getInputElement(el)[CONFIG_KEY].cleanup();
-  }
-};
-
-var script = {
-  props: {
-    modelValue: {
-      required: true,
-    },
-    nullValue: {
-      type: [Number, String],
-      default: () => options.nullValue,
-    },
-    masked: {
-      type: Boolean,
-      default: false,
-    },
-    reverseFill: {
-      type: Boolean,
-      default: options.reverseFill,
-    },
-    prefill: {
-      type: Boolean,
-      default: options.prefill,
-    },
-    precision: {
-      type: Number,
-      default: () => options.precision,
-    },
-    minimumFractionDigits: {
-      type: [Number, Boolean],
-      default: () => options.minimumFractionDigits,
-    },
-    decimal: {
-      type: String,
-      default: () => options.decimal,
-    },
-    min: {
-      type: [Number, Boolean],
-      default: () => options.min,
-    },
-    max: {
-      type: [Number, Boolean],
-      default: () => options.max,
-    },
-    separator: {
-      type: String,
-      default: () => options.separator,
-    },
-    prefix: {
-      type: String,
-      default: () => options.prefix,
-    },
-    suffix: {
-      type: String,
-      default: () => options.suffix,
-    },
-  },
-  directives: {
-    number: vNumber,
-  },
-  emits: ['update:model-value'],
-  data() {
-    return {
-      maskedValue: this.modelValue,
-      unmaskedValue: null,
-    }
-  },
-  methods: {
-    input({ target }) {
-      this.maskedValue = target.value;
-      this.unmaskedValue = target.unmaskedValue;
-    },
-    change() {
-      this.$emit('update:model-value', this.emittedValue);
-    },
-  },
-  computed: {
-    emittedValue() {
-      return this.masked ? this.maskedValue : this.unmaskedValue
-    },
-    config() {
-      const config = {};
-      Object.keys(this.$props)
-        .filter((item) => item !== 'modelValue')
-        .forEach((item) => {
-          config[item] = this.$props[item];
-        });
-      return config
-    },
-  },
-  watch: {
-    modelValue(val) {
-      if (this.unmaskedValue !== val) {
-        this.maskedValue = val;
-      }
-    },
-  },
-};
-
-const _hoisted_1 = ["value"];
-
-function render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _directive_number = resolveDirective("number");
-
-  return withDirectives((openBlock(), createElementBlock("input", {
-    type: "text",
-    autocomplete: "off",
-    value: $data.maskedValue,
-    onChange: _cache[0] || (_cache[0] = (...args) => ($options.change && $options.change(...args))),
-    onInput: _cache[1] || (_cache[1] = (...args) => ($options.input && $options.input(...args))),
-    class: "v-number"
-  }, null, 40 /* PROPS, HYDRATE_EVENTS */, _hoisted_1)), [
-    [_directive_number, $options.config]
-  ])
-}
-
-script.render = render;
-script.__file = "src/component.vue";
-
-var index = {
-  install(app, config) {
-    if (config) {
-      Object.assign(options, config);
-    }
-    app.directive('number', vNumber);
-    app.component('number', script);
-  }
-};
-
-export { NumberFormat, index as default, script as number, options, vNumber };
+var e={prefix:"",suffix:"",separator:",",decimal:".",precision:2,prefill:!0,reverseFill:!1,min:!1,max:!1,nullValue:""};function n(n){var t=this;function i(e){return n=0,t=e,i=20,Math.max(n,Math.min(t,i));var n,t,i}void 0===n&&(n=e),this.options=Object.assign(e,n),this.input="",this.number="",this.isClean=!1,this.isNull=function(e){return void 0===e&&(e=t.input),!t.numberOnly(e,new RegExp("[^0-9]+","gi"))},this.clean=function(e){return void 0===e&&(e=!1),t.isClean=e,t},this.sign=function(){return t.input.toString().indexOf("-")>=0&&t.realNumber()>0?"-":""},this.toNumber=function(e){return Number(e)},this.numberOnly=function(e,n){return e.toString().replace(n,"")},this.isNegative="-"===this.sign(),this.numbers=function(){var e,n,r;return t.options.reverseFill?t.number=(e=t.numberOnly(t.input,/\D+/g),n=t.options.precision,r=Math.pow(10,n),(parseFloat(e)/r).toFixed(i(n))).replace(".",t.options.decimal):"number"==typeof t.input?t.isClean?t.number=t.toNumber(t.input.toFixed(t.options.precision)).toString().replace("-","").replace(".",t.options.decimal):t.number=t.toNumber(t.input).toString().replace("-","").replace(".",t.options.decimal):(t.number=t.numberOnly(t.input,new RegExp("[^0-9\\"+t.options.decimal+"]+","gi")),t.number=t.parts(t.number).join(t.options.decimal)),t.number},this.realNumber=function(){var e=t.numbers().toString().replace(t.options.decimal,".");return t.options.reverseFill?e:t.toNumber(e)},this.parts=function(e,n){void 0===e&&(e=""),void 0===n&&(n=t.options.decimal);var i=e.toString().split(n);return i[0]=t.toNumber(i[0])||0,i.length>1&&(i[1]=i.slice(1,i.length).join(""),i=i.slice(0,2),t.isClean&&i[1].length>t.options.precision&&(i[1]=t.toNumber("."+i[1]).toFixed(t.options.precision).toString().replace("0.",""))),i.slice(0,2)},this.addSeparator=function(){var e=t.numbers().split(t.options.decimal);return e[0]=e[0].toString().replace(/(\d)(?=(?:\d{3})+\b)/gm,"$1"+t.options.separator),t.isClean?(e[1]=t.toNumber("."+e[1]).toString().replace("0.",""),e[1]&&e[1]>0?e.join(t.options.decimal):e[0]):e.join(t.options.decimal)},this.format=function(e){return""===e?t.options.nullValue:(t.input=e||t.options.nullValue,t.isNull()?t.options.nullValue:t.sign()+t.options.prefix+t.addSeparator()+t.options.suffix)},this.unformat=function(e){return""===e?t.options.nullValue:(t.input=e||t.options.nullValue,t.isNull()?t.options.nullValue:t.sign()+t.realNumber())}}var t="__input-facade__";function i(e){return JSON.parse(JSON.stringify(e))}function r(){return new CustomEvent("input",{bubbles:!0,cancelable:!0,detail:{facade:!0}})}function a(e){var n=e instanceof HTMLInputElement?e:e.querySelector("input");if(!n)throw new Error("facade directive requires an input element");return n}function u(e,n){var t=function(){e.setSelectionRange(n,n)};t(),setTimeout(t(),1)}function o(e,i,a){void 0===a&&(a={});var u=a.emit;void 0===u&&(u=!0);var o=a.force;void 0===o&&(o=!1);var l=a.clean;void 0===l&&(l=!1);var s=e[t].config,c=e[t].oldValue,f=i&&i.data.model?i.data.model.value:e.value;if(c=c||"",f=f||"",o||c!==f){var p=new n(s).clean(l&&!s.reverseFill),d=p.format(f),m=p.clean(!s.reverseFill).unformat(f);return l&&(Number(s.max)&&m>Number(s.max)?(d=p.format(s.max),m=p.unformat(s.max)):Number(s.min)&&m<Number(s.min)&&(d=p.format(s.min),m=p.unformat(s.min))),e[t].oldValue=d,e.unmaskedValue=m,e.value!==d&&(e.value=d),u&&e.dispatchEvent(r())}}function l(e){var n=e.target,i=e.detail;if(i&&i.facade)return!1;var r=n[t].oldValue;o(n,null,{force:!0,emit:!1,clean:!0}),r!==n.value&&n.dispatchEvent(new CustomEvent("change",{bubbles:!0,cancelable:!0,detail:{facade:!0}}))}var s=t,c={bind:function(n,t,r){var u=t.value,l=t.modifiers;n=a(n);var c=Object.assign({},i(e),u,l);n[s]={config:c},o(n,r,{force:c.prefill,clean:!0})},inserted:function(e){var n=(e=a(e))[s],i=n.config,c=e.parentElement||e,f=function(n){n.target===e&&function(e){var n=e.target,i=e.detail;if(i&&i.facade)return!1;e.stopPropagation();var a=n.value.length-n.selectionEnd,l=n[t],s=l.oldValue,c=l.config;o(n,null,{emit:!1}),a=Math.max(a,c.suffix.length),a=n.value.length-a,u(n,a=Math.max(a,c.prefix.length+1)),s!==n.value&&n.dispatchEvent(r())}(n)};c.addEventListener("input",f,!0),e.onblur=function(e){return l(e)},e.onkeydown=function(n){if(([110,190].includes(n.keyCode)||n.key===i.decimal)&&e.value.includes(i.decimal))n.preventDefault();else if([8].includes(n.keyCode)){var t=e.value.slice(e.selectionEnd-1,e.selectionEnd),r=e.value.slice(e.selectionEnd-2,e.selectionEnd);if(t===i.separator){n.preventDefault();var a=e.value.length-e.selectionEnd;e.value=e.value.replace(r,""),a=Math.max(a,i.suffix.length),a=e.value.length-a,a=Math.max(a,i.prefix.length),u(e,a),e.dispatchEvent(new Event("input"))}}},n.cleanup=function(){return c.removeEventListener("input",f,!0)}},update:function(e,n,t){var i=n.value,r=n.oldValue,u=n.modifiers;if(e=a(e),i!==r){var l=e[s].config;e[s].config=Object.assign({},l,i,u),o(e,t,{force:!0,clean:!0})}else o(e,t)},unbind:function(e){a(e)[s].cleanup()}},f=i(e);function p(e,n,t,i,r,a,u,o,l,s){"boolean"!=typeof u&&(l=o,o=u,u=!1);var c,f="function"==typeof t?t.options:t;if(e&&e.render&&(f.render=e.render,f.staticRenderFns=e.staticRenderFns,f._compiled=!0,r&&(f.functional=!0)),i&&(f._scopeId=i),a?(c=function(e){(e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),n&&n.call(this,l(e)),e&&e._registeredComponents&&e._registeredComponents.add(a)},f._ssrRegister=c):n&&(c=u?function(e){n.call(this,s(e,this.$root.$options.shadowRoot))}:function(e){n.call(this,o(e))}),c)if(f.functional){var p=f.render;f.render=function(e,n){return c.call(n),p(e,n)}}else{var d=f.beforeCreate;f.beforeCreate=d?[].concat(d,c):[c]}return t}var d=p({render:function(){var e=this,n=e.$createElement;return(e._self._c||n)("input",{directives:[{name:"number",rawName:"v-number",value:e.config,expression:"config"}],staticClass:"v-number",attrs:{type:"text",autocomplete:"off"},domProps:{value:e.maskedValue},on:{change:e.change,input:e.input,blur:function(n){return e.$emit("blur",n)},focus:function(n){return e.$emit("focus",n)}}})},staticRenderFns:[]},void 0,{props:{value:{required:!0,type:[Number,String]},nullValue:{type:[Number,String],default:function(){return f.nullValue}},masked:{type:Boolean,default:!1},reverseFill:{type:Boolean,default:f.reverseFill},prefill:{type:Boolean,default:f.prefill},precision:{type:Number,default:function(){return f.precision}},minimumFractionDigits:{type:[Number,Boolean],default:function(){return f.minimumFractionDigits}},decimal:{type:String,default:function(){return f.decimal}},min:{type:[Number,Boolean],default:function(){return f.min}},max:{type:[Number,Boolean],default:function(){return f.max}},separator:{type:String,default:function(){return f.separator}},prefix:{type:String,default:function(){return f.prefix}},suffix:{type:String,default:function(){return f.suffix}}},directives:{number:c},data:function(){return{maskedValue:this.value,unmaskedValue:null}},methods:{input:function(e){var n=e.target;this.maskedValue=n.value,this.unmaskedValue=n.unmaskedValue,this.$emit("input",this.emittedValue)},change:function(){this.$emit("change",this.emittedValue)}},computed:{emittedValue:function(){return this.masked?this.maskedValue:this.unmaskedValue},config:function(){var e=this,n={};return Object.keys(this.$props).filter((function(e){return"value"!==e})).forEach((function(t){n[t]=e.$props[t]})),n}},watch:{value:function(e){this.unmaskedValue!==e&&(this.maskedValue=e)}}},void 0,!1,void 0,!1,void 0,void 0,void 0);function m(n,t){t&&Object.assign(e,t),n.directive("number",c),n.component("number",d)}export{n as NumberFormat,m as default,d as number,e as options,c as vNumber};
+//# sourceMappingURL=index.esm.js.map

package.json

 {
   "name": "@coders-tm/vue-number-format",
-  "version": "2.2.0",
+  "version": "2.2.11",
   "private": false,
@@ -18,4 +18,4 @@ "description": "Easy formatted numbers, currency and percentage with input/directive mask for Vue.js",
     "build": "rollup --c rollup.config.js",
+    "docs:build": "vuepress build docs",
     "docs:dev": "vuepress dev docs",
-    "docs:build": "vuepress build docs",
     "test": "jest tests/*",
@@ -25,2 +25,41 @@ "lint": "eslint 'src/**/*.{js,vue}'",
   },
+  "devDependencies": {
+    "@babel/core": "^7.9.0",
+    "@babel/preset-env": "^7.9.5",
+    "@vue/cli-plugin-unit-jest": "^4.5.13",
+    "@vue/cli-service": "^4.5.13",
+    "@vue/test-utils": "^1.2.2",
+    "@vuedoc/md": "^1.6.0",
+    "@vuepress/plugin-back-to-top": "^1.8.2",
+    "@vuepress/plugin-google-analytics": "^1.8.2",
+    "@vuepress/plugin-medium-zoom": "^1.8.2",
+    "@vuepress/plugin-register-components": "^1.4.1",
+    "babel-core": "^6.26.3",
+    "babel-jest": "^25.3.0",
+    "babel-preset-env": "^1.7.0",
+    "babel-preset-vue": "^2.0.2",
+    "eslint": "^6.8.0",
+    "eslint-config-airbnb-base": "^14.1.0",
+    "eslint-plugin-import": "^2.20.2",
+    "eslint-plugin-vue": "^6.2.2",
+    "jest": "^25.3.0",
+    "node-fetch": "^2.6.0",
+    "npm-run-all": "^4.1.5",
+    "postcss": "6.0",
+    "quasar": "^1.11.3",
+    "rollup": "^2.6.1",
+    "rollup-plugin-buble": "^0.19.8",
+    "rollup-plugin-commonjs": "^10.1.0",
+    "rollup-plugin-css-only": "^2.0.0",
+    "rollup-plugin-filesize": "^9.1.1",
+    "rollup-plugin-node-resolve": "^5.2.0",
+    "rollup-plugin-replace": "^2.2.0",
+    "rollup-plugin-terser": "^5.3.0",
+    "rollup-plugin-vue": "^5.1.6",
+    "vue": "^2.6.11",
+    "vue-jest": "^3.0.5",
+    "vue-template-compiler": "^2.6.11",
+    "vuepress": "^1.8.2",
+    "vuepress-plugin-demo-code": "^0.5.0"
+  },
   "bugs": {
@@ -40,4 +79,3 @@ "url": "https://github.com/coders-tm/vue-number-format/issues"
     "currency input",
-    "money input",
-    "v-number"
+    "money input"
   ],
@@ -51,32 +89,3 @@ "license": "MIT",
     "@coders-tm:registry": "https://npm.pkg.github.com"
-  },
-  "devDependencies": {
-    "@babel/core": "^7.15.5",
-    "@babel/preset-env": "^7.15.6",
-    "@vue/cli": "^4.5.13",
-    "@vue/cli-plugin-babel": "~4.5.0",
-    "@vue/cli-plugin-eslint": "~4.5.0",
-    "@vue/cli-service": "^4.5.13",
-    "@vue/compiler-sfc": "^3.0.0",
-    "@vuepress/plugin-google-analytics": "^2.0.0-beta.27",
-    "@vuepress/plugin-medium-zoom": "^2.0.0-beta.27",
-    "@vuepress/plugin-register-components": "^2.0.0-beta.27",
-    "@vuepress/plugin-search": "^2.0.0-beta.27",
-    "babel-eslint": "^10.1.0",
-    "babel-jest": "^27.2.0",
-    "core-js": "^3.6.5",
-    "eslint": "^7.32.0",
-    "eslint-plugin-import": "^2.24.2",
-    "eslint-plugin-vue": "^7.18.0",
-    "jest": "^27.2.0",
-    "prettier-config-vuepress": "^1.4.0",
-    "rollup": "^2.56.3",
-    "rollup-plugin-filesize": "^9.1.1",
-    "rollup-plugin-vue": "^6.0.0",
-    "vite-plugin-windicss": "^1.8.1",
-    "vue": "^3.0.0",
-    "vuepress-vite": "^2.0.0-beta.27",
-    "windicss": "^3.5.0"
-  },
-  "prettier": "prettier-config-vuepress"
+  }
 }

README.md

 [![npm Version](https://badgen.net/npm/v/@coders-tm/vue-number-format?color=green)](https://www.npmjs.com/package/@coders-tm/vue-number-format)
 [![npm Downloads](https://badgen.net/npm/dt/@coders-tm/vue-number-format?color=green)](https://www.npmjs.com/package/@coders-tm/vue-number-format)
-[![github Stars](https://badgen.net/github/stars/coders-tm/vue-number-format?color=green)](https://www.npmjs.com/package/@coders-tm/vue-number-format)
 [![Bundlephobia](https://badgen.net/bundlephobia/minzip/@coders-tm/vue-number-format?color=green)](https://bundlephobia.com/result?p=@coders-tm/vue-number-format)
 [![License](https://badgen.net/github/license/coders-tm/vue-number-format?color=green)](https://github.com/coders-tm/vue-number-format/blob/master/LICENSE)
-
 # vue-number-format
-
-<a href="https://vue-number-format.netlify.app" rel="nofollow"><img src="docs/vue-number-format.gif" alt="" style="width: 100%;"></a>
-
 Vue Number Format is used to format a number using fixed-point notation. It can be used to format a number with a specific number of digits to the right of the decimal.
-
-## Installation
-
+## Vue 3.0
 ```bash
@@ -20,3 +13,8 @@ npm install @coders-tm/vue-number-format
 ```
-
+## Vue 2.0
+```bash
+npm install @coders-tm/vue-number-format@2.0.7
+or
+yarn add @coders-tm/vue-number-format@2.0.7
+```
 ## Features
@@ -29,6 +27,5 @@
 - Built-in validation
-- Supports both Vue 3 and Vue 2.
 
 ## Documentation
+Please refer to the [project home page](https://vue-number-format.netlify.app) for a detailed documentation.
 
-Please refer to the [project home page](https://vue-number-format.netlify.app) for a detailed documentation.

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

131359

increased by269.25%

Number of package files

10

increased by66.67%

Worsened metrics

Dev dependency count

37

increased by42.31%

Lines of code

622

decreased by-32.1%

Number of lines in readme file

30

decreased by-9.09%

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes