vue-numeric-keypad - npm Package Compare versions

Comparing version 1.2.3 to 1.2.4

dist/vue-numeric-keypad.esm.js

@@ -19,2 +19,3 @@ //
 //
+//
 if (!Object.entries) {
@@ -97,4 +98,4 @@ Object.entries = function (obj) {
     return {
+      encrypt: Boolean(this.options.encrypt),
       encryptedChar: typeof this.options.encryptedChar === 'string' ? this.options.encryptedChar.substring(0, 1) : "0",
-      encrypt: Boolean(this.options.encrypt),
       keyArray: this.options.keyArray || (columns === 3 ? arr1 : arr2),
@@ -116,2 +117,4 @@ keyRandomize: Boolean(this.options.keyRandomize === undefined || this.options.keyRandomize),
       pseudoClickBlankKey: this.options.pseudoClickBlankKey === undefined ? Boolean(this.options.pseudoClick) : Boolean(this.options.pseudoClickBlankKey),
+      vibrate: Boolean(this.options.vibrate),
+      vibratePattern: this.options.vibratePattern || 200,
       rows: Number(this.options.rows) || 4,
@@ -151,2 +154,4 @@ columns,
         this.pseudoClickBlankKey = options.pseudoClickBlankKey === undefined ? Boolean(options.pseudoClick) : Boolean(options.pseudoClickBlankKey);
+        this.vibrate = Boolean(options.vibrate);
+        this.vibratePattern = this.vibratePattern || 200;
         this.rows = Number(options.rows) || 4;
@@ -230,2 +235,3 @@ this.zIndex = Number(options.zIndex) || 1;
       this.activeButton(idx);
+      if (this.vibrate && window.navigator.vibrate) window.navigator.vibrate(this.vibratePattern);
       let newVal = this.value;
@@ -488,2 +494,6 @@ const encryptedValue = [...this.encryptedValue];
           return _vm.click(val, idx);
+        },
+        "touchend": function ($event) {
+          $event.preventDefault();
+          return _vm.click(val, idx);
         }
@@ -490,0 +500,0 @@ }

dist/vue-numeric-keypad.min.js

@@ -1,1 +0,1 @@
-var VueNumericKeypad=function(){"use strict";function t(e){return t="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},t(e)}function e(t,e){return function(t){if(Array.isArray(t))return t}(t)||function(t,e){var n=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null==n)return;var o,i,s=[],r=!0,a=!1;try{for(n=n.call(t);!(r=(o=n.next()).done)&&(s.push(o.value),!e||s.length!==e);r=!0);}catch(t){a=!0,i=t}finally{try{r||null==n.return||n.return()}finally{if(a)throw i}}return s}(t,e)||o(t,e)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function n(t){return function(t){if(Array.isArray(t))return i(t)}(t)||function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}(t)||o(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function o(t,e){if(t){if("string"==typeof t)return i(t,e);var n=Object.prototype.toString.call(t).slice(8,-1);return"Object"===n&&t.constructor&&(n=t.constructor.name),"Map"===n||"Set"===n?Array.from(t):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?i(t,e):void 0}}function i(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,o=new Array(e);n<e;n++)o[n]=t[n];return o}Object.entries||(Object.entries=function(t){for(var e=Object.keys(t),n=e.length,o=new Array(n);n--;)o[n]=[e[n],t[e[n]]];return o});var s=[1,2,3,4,5,6,7,8,9,"",0,-1],r=[1,2,3,4,5,6,7,8,9,0,"",-1];function a(t,e,n,o,i,s,r,a,l,u){"boolean"!=typeof r&&(l=a,a=r,r=!1);const c="function"==typeof n?n.options:n;let d;if(t&&t.render&&(c.render=t.render,c.staticRenderFns=t.staticRenderFns,c._compiled=!0,i&&(c.functional=!0)),o&&(c._scopeId=o),s?(d=function(t){(t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),e&&e.call(this,l(t)),t&&t._registeredComponents&&t._registeredComponents.add(s)},c._ssrRegister=d):e&&(d=r?function(t){e.call(this,u(t,this.$root.$options.shadowRoot))}:function(t){e.call(this,a(t))}),d)if(c.functional){const t=c.render;c.render=function(e,n){return d.call(n),t(e,n)}}else{const t=c.beforeCreate;c.beforeCreate=t?[].concat(t,d):[d]}return n}var l=a({render:function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",{directives:[{name:"show",rawName:"v-show",value:t.show,expression:"show"}],class:t.keypadClass,attrs:{id:t.id},on:{click:function(e){t.stopPropagation&&e.stopPropagation()}}},[n("div",{class:t.buttonWrapClass},t._l(t.keyArray,(function(e,o){return n("button",{key:o,ref:"button",refInFor:!0,class:t.setClass(e,o),attrs:{type:"button"},on:{click:function(n){return t.click(e,o)}}},[t._v("\n      "+t._s(t.showKey(e))+"\n    ")])})),0),t._v(" "),t._t("default")],2)},staticRenderFns:[]},undefined,{name:"VueNumericKeypad",props:{id:{type:String,required:!1},value:{type:String,default:"",required:!0},show:{type:[Boolean,Number],default:!1,required:!0},encryptFunc:{type:Function,default:function(t){return t}},encryptedValue:{type:Array,default:function(){return[]}},options:{type:Object,default:function(){return{}},validator:function(e){return(e.keyArray||[]).some((function(e){switch(t(e)){case"number":return!Number.isInteger(e)||e<-1||e>9;case"string":return e;default:return!1}}))?(console.error("KeyArray can contain only an integer 'number' between -1 and 9 and an empty 'string'."),!1):!Object.keys(e).some((function(t){return/Class/.test(t)&&/[^0-9A-z\-_ ]/.test(e[t])}))||(console.error("Class name can contain only 'a-z' and 'A-Z', '0-9', '_', '-', ' '."),!1)},required:!1}},data:function(){var t=this,e=Number(this.options.columns)||3;return{encryptedChar:"string"==typeof this.options.encryptedChar?this.options.encryptedChar.substring(0,1):"0",encrypt:Boolean(this.options.encrypt),keyArray:this.options.keyArray||(3===e?s:r),keyRandomize:Boolean(void 0===this.options.keyRandomize||this.options.keyRandomize),randomizeWhenClick:Boolean(this.options.randomizeWhenClick),fixDeleteKey:Boolean(void 0===this.options.fixDeleteKey||this.options.fixDeleteKey),stopPropagation:Boolean(void 0===this.options.stopPropagation||this.options.stopPropagation),keypadClass:this.options.keypadClass||"numeric-keypad",buttonWrapClass:this.options.buttonWrapClass||"numeric-keypad__button-wrap",buttonClass:this.options.buttonClass||"numeric-keypad__button",deleteButtonClass:this.options.deleteButtonClass||"numeric-keypad__button--delete",blankButtonClass:this.options.blankButtonClass||"numeric-keypad__button--blank",activeButtonClass:this.options.activeButtonClass||"numeric-keypad__button--active",activeButtonIndexes:{},activeButtonDelay:Number(this.options.activeButtonDelay)||300,pseudoClick:Boolean(this.options.pseudoClick),pseudoClickDeleteKey:void 0===this.options.pseudoClickDeleteKey?Boolean(this.options.pseudoClick):Boolean(this.options.pseudoClickDeleteKey),pseudoClickBlankKey:void 0===this.options.pseudoClickBlankKey?Boolean(this.options.pseudoClick):Boolean(this.options.pseudoClickBlankKey),rows:Number(this.options.rows)||4,columns:e,zIndex:Number(this.options.zIndex)||1,cellWidth:0,cellHeight:0,defaultStyleSheet:document.createElement("style"),defaultStyle:["all","button","wrap","none"].find((function(e){return e===t.options.defaultStyle}))||"all",keypadStylesIndex:null}},watch:{show:function(){this.$nextTick((function(){this.show&&this.resize()})),this.keyRandomize&&this.randomize()},options:{deep:!0,handler:function(e){if("object"===t(e)){var n=Number(e.columns)||3;this.encryptedChar="string"==typeof e.encryptedChar?e.encryptedChar.substring(0,1):"0",this.keyArray=e.keyArray||(3===n?s:r),this.keyRandomize=Boolean(void 0===e.keyRandomize||e.keyRandomize),this.randomizeWhenClick=Boolean(e.randomizeWhenClick),this.fixDeleteKey=Boolean(void 0===e.fixDeleteKey||e.fixDeleteKey),this.stopPropagation=Boolean(void 0===e.stopPropagation||e.stopPropagation),this.activeButtonDelay=Number(e.activeButtonDelay)||300,this.pseudoClick=Boolean(e.pseudoClick),this.pseudoClickDeleteKey=void 0===e.pseudoClickDeleteKey?Boolean(e.pseudoClick):Boolean(e.pseudoClickDeleteKey),this.pseudoClickBlankKey=void 0===e.pseudoClickBlankKey?Boolean(e.pseudoClick):Boolean(e.pseudoClickBlankKey),this.rows=Number(e.rows)||4,this.zIndex=Number(e.zIndex)||1;var o=["all","button","wrap","none"].find((function(t){return t===e.defaultStyle}))||"all";this.defaultStyle!==o&&(this.defaultStyle=o,document.head.removeChild(this.defaultStyleSheet),this.defaultStyleSheet=document.createElement("style"),"none"!==this.defaultStyle&&(document.head.appendChild(this.defaultStyleSheet),this.initDefaultStyles(this.defaultStyleSheet.sheet))),this.keyRandomize&&this.randomize()}}}},computed:{keypadStyles:function(){var t=Math.round(.3*Math.min(this.cellWidth,this.cellHeight)),e="\n        position: fixed;\n        z-index: ".concat(this.zIndex,";\n        bottom: 0;\n        left: 0;\n        right: 0;\n        height: 40vh;\n        padding: 10px;\n        background-color: #fff;\n        border-radius: 12px 12px 0 0;\n        box-shadow: 0 -4px 4px rgba(0, 0, 0, 0.15);\n        color: #000;\n        overflow: hidden;\n      ");return t?e+"\nfont-size: ".concat(t,"px;"):e},buttonWrapStyles:function(){return"\n        display: flex;\n        witdth: 100%;\n        height: 100%;\n        justify-content: space-between;\n        align-content: space-between;\n        flex-wrap: wrap;\n        gridGap: 5px;\n      "},buttonStyles:function(){var t="calc(".concat(Math.round(1e3/this.columns)/10,"% - ").concat(Math.ceil(5*(this.columns-1)/this.columns),"px)"),e="calc(".concat(Math.round(1e3/this.rows)/10,"% - ").concat(Math.ceil(5*(this.rows-1)/this.rows),"px)");return"\n        flex: 0 0 auto;\n        display: flex;\n        width: ".concat(t,";\n        height: ").concat(e,";\n        justify-content: center;\n        align-items: center;\n        background-color: #fff;\n        border: 1px solid #000;\n        border-radius: 8px;\n        font-size: inherit;\n      ")}},methods:{click:function(t,e){if(this.pseudoClick&&(-1!=t||this.pseudoClickDeleteKey)&&(""!=t||this.pseudoClickBlankKey)){var o=this.keyArray.length,i=Math.floor(Math.random()*(o-1)+e+1)%o;this.activeButton(i)}this.activeButton(e);var s=this.value,r=n(this.encryptedValue);this.encrypt?-1===t?(s=this.value.slice(0,-1),r.pop()):""!==t&&(s+=this.encryptedChar,r.push(this.encryptFunc(t.toString()))):-1===t?s=this.value.slice(0,-1):s+=t,this.$emit("update:value",String(s)),this.$emit("update:encryptedValue",r),this.keyRandomize&&this.randomizeWhenClick&&this.randomize()},randomize:function(){for(var t=[],e=0,n=0;n<this.keyArray.length;n++){var o=Math.random();this.fixDeleteKey&&-1==this.keyArray[n]?e++:o<.5?t.push(this.keyArray[n]):t.unshift(this.keyArray[n])}if(e)for(var i=0;i<e;i++)t.push(-1);this.keyArray=t},showKey:function(t){return-1===t?"del":t},resize:function(){this.cellWidth=this.$refs.button[0].offsetWidth,this.cellHeight=this.$refs.button[0].offsetHeight;var t=this.defaultStyleSheet.sheet;t&&null!==this.keypadStylesIndex&&(t.deleteRule(0),t.insertRule(".".concat(this.keypadClass.trim().split(" ")[0]," {").concat(this.keypadStyles,"}"),0))},setClass:function(t,e){var n=[this.buttonClass];return-1===t&&n.push(this.deleteButtonClass),""===t&&n.push(this.blankButtonClass),this.activeButtonIndexes[e]&&n.push(this.activeButtonClass),n},activeButton:function(t){var e=this;this.activeButtonIndexes[t]?clearTimeout(this.activeButtonIndexes[t]):this.$refs.button[t].classList.add(this.activeButtonClass),this.activeButtonIndexes[t]=setTimeout((function(){e.$refs.button[t].classList.remove(e.activeButtonClass),clearTimeout(e.activeButtonIndexes[t]),delete e.activeButtonIndexes[t]}),this.activeButtonDelay)},initDefaultStyles:function(t){if("none"!==this.defaultStyle){var e=/[^0-9A-z\-_ ]/,n=0;"button"!==this.defaultStyle&&(e.test(this.keypadClass)||(this.keypadStylesIndex=n,t.insertRule(".".concat(this.keypadClass.trim().split(" ")[0]," {").concat(this.keypadStyles,"}"),n++)),e.test(this.buttonWrapClass)||t.insertRule(".".concat(this.buttonWrapClass.trim().split(" ")[0]," {").concat(this.buttonWrapStyles,"}"),n++)),"wrap"!==this.defaultStyle&&(e.test(this.buttonClass)||(t.insertRule(".".concat(this.buttonClass.trim().split(" ")[0]," {").concat(this.buttonStyles,"}"),n++),e.test(this.activeButtonClass)||t.insertRule(".".concat(this.buttonClass.trim().split(" ")[0],".").concat(this.activeButtonClass.trim().split(" ")[0]," {background-color: #eaeaea;}"),n++)))}}},mounted:function(){window.addEventListener("resize",this.resize),"none"!==this.defaultStyle&&(document.head.appendChild(this.defaultStyleSheet),this.initDefaultStyles(this.defaultStyleSheet.sheet)),this.keyRandomize&&this.randomize(),this.resize()},beforeDestroy:function(){window.removeEventListener("resize",this.resize)}},undefined,false,undefined,!1,void 0,void 0,void 0),u=function(){var t=l;return t.install=function(e){e.component("VueNumericKeypad",t)},t}(),c=Object.freeze({__proto__:null,default:u});return Object.entries(c).forEach((function(t){var n=e(t,2),o=n[0],i=n[1];"default"!==o&&(u[o]=i)})),u}();
+var VueNumericKeypad=function(){"use strict";function t(e){return t="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},t(e)}function e(t,e){return function(t){if(Array.isArray(t))return t}(t)||function(t,e){var n=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null==n)return;var i,o,s=[],r=!0,a=!1;try{for(n=n.call(t);!(r=(i=n.next()).done)&&(s.push(i.value),!e||s.length!==e);r=!0);}catch(t){a=!0,o=t}finally{try{r||null==n.return||n.return()}finally{if(a)throw o}}return s}(t,e)||i(t,e)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function n(t){return function(t){if(Array.isArray(t))return o(t)}(t)||function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}(t)||i(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function i(t,e){if(t){if("string"==typeof t)return o(t,e);var n=Object.prototype.toString.call(t).slice(8,-1);return"Object"===n&&t.constructor&&(n=t.constructor.name),"Map"===n||"Set"===n?Array.from(t):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?o(t,e):void 0}}function o(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,i=new Array(e);n<e;n++)i[n]=t[n];return i}Object.entries||(Object.entries=function(t){for(var e=Object.keys(t),n=e.length,i=new Array(n);n--;)i[n]=[e[n],t[e[n]]];return i});var s=[1,2,3,4,5,6,7,8,9,"",0,-1],r=[1,2,3,4,5,6,7,8,9,0,"",-1];function a(t,e,n,i,o,s,r,a,l,u){"boolean"!=typeof r&&(l=a,a=r,r=!1);const c="function"==typeof n?n.options:n;let d;if(t&&t.render&&(c.render=t.render,c.staticRenderFns=t.staticRenderFns,c._compiled=!0,o&&(c.functional=!0)),i&&(c._scopeId=i),s?(d=function(t){(t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),e&&e.call(this,l(t)),t&&t._registeredComponents&&t._registeredComponents.add(s)},c._ssrRegister=d):e&&(d=r?function(t){e.call(this,u(t,this.$root.$options.shadowRoot))}:function(t){e.call(this,a(t))}),d)if(c.functional){const t=c.render;c.render=function(e,n){return d.call(n),t(e,n)}}else{const t=c.beforeCreate;c.beforeCreate=t?[].concat(t,d):[d]}return n}var l=a({render:function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("div",{directives:[{name:"show",rawName:"v-show",value:t.show,expression:"show"}],class:t.keypadClass,attrs:{id:t.id},on:{click:function(e){t.stopPropagation&&e.stopPropagation()}}},[n("div",{class:t.buttonWrapClass},t._l(t.keyArray,(function(e,i){return n("button",{key:i,ref:"button",refInFor:!0,class:t.setClass(e,i),attrs:{type:"button"},on:{click:function(n){return t.click(e,i)},touchend:function(n){return n.preventDefault(),t.click(e,i)}}},[t._v("\n      "+t._s(t.showKey(e))+"\n    ")])})),0),t._v(" "),t._t("default")],2)},staticRenderFns:[]},undefined,{name:"VueNumericKeypad",props:{id:{type:String,required:!1},value:{type:String,default:"",required:!0},show:{type:[Boolean,Number],default:!1,required:!0},encryptFunc:{type:Function,default:function(t){return t}},encryptedValue:{type:Array,default:function(){return[]}},options:{type:Object,default:function(){return{}},validator:function(e){return(e.keyArray||[]).some((function(e){switch(t(e)){case"number":return!Number.isInteger(e)||e<-1||e>9;case"string":return e;default:return!1}}))?(console.error("KeyArray can contain only an integer 'number' between -1 and 9 and an empty 'string'."),!1):!Object.keys(e).some((function(t){return/Class/.test(t)&&/[^0-9A-z\-_ ]/.test(e[t])}))||(console.error("Class name can contain only 'a-z' and 'A-Z', '0-9', '_', '-', ' '."),!1)},required:!1}},data:function(){var t=this,e=Number(this.options.columns)||3;return{encrypt:Boolean(this.options.encrypt),encryptedChar:"string"==typeof this.options.encryptedChar?this.options.encryptedChar.substring(0,1):"0",keyArray:this.options.keyArray||(3===e?s:r),keyRandomize:Boolean(void 0===this.options.keyRandomize||this.options.keyRandomize),randomizeWhenClick:Boolean(this.options.randomizeWhenClick),fixDeleteKey:Boolean(void 0===this.options.fixDeleteKey||this.options.fixDeleteKey),stopPropagation:Boolean(void 0===this.options.stopPropagation||this.options.stopPropagation),keypadClass:this.options.keypadClass||"numeric-keypad",buttonWrapClass:this.options.buttonWrapClass||"numeric-keypad__button-wrap",buttonClass:this.options.buttonClass||"numeric-keypad__button",deleteButtonClass:this.options.deleteButtonClass||"numeric-keypad__button--delete",blankButtonClass:this.options.blankButtonClass||"numeric-keypad__button--blank",activeButtonClass:this.options.activeButtonClass||"numeric-keypad__button--active",activeButtonIndexes:{},activeButtonDelay:Number(this.options.activeButtonDelay)||300,pseudoClick:Boolean(this.options.pseudoClick),pseudoClickDeleteKey:void 0===this.options.pseudoClickDeleteKey?Boolean(this.options.pseudoClick):Boolean(this.options.pseudoClickDeleteKey),pseudoClickBlankKey:void 0===this.options.pseudoClickBlankKey?Boolean(this.options.pseudoClick):Boolean(this.options.pseudoClickBlankKey),vibrate:Boolean(this.options.vibrate),vibratePattern:this.options.vibratePattern||200,rows:Number(this.options.rows)||4,columns:e,zIndex:Number(this.options.zIndex)||1,cellWidth:0,cellHeight:0,defaultStyleSheet:document.createElement("style"),defaultStyle:["all","button","wrap","none"].find((function(e){return e===t.options.defaultStyle}))||"all",keypadStylesIndex:null}},watch:{show:function(){this.$nextTick((function(){this.show&&this.resize()})),this.keyRandomize&&this.randomize()},options:{deep:!0,handler:function(e){if("object"===t(e)){var n=Number(e.columns)||3;this.encryptedChar="string"==typeof e.encryptedChar?e.encryptedChar.substring(0,1):"0",this.keyArray=e.keyArray||(3===n?s:r),this.keyRandomize=Boolean(void 0===e.keyRandomize||e.keyRandomize),this.randomizeWhenClick=Boolean(e.randomizeWhenClick),this.fixDeleteKey=Boolean(void 0===e.fixDeleteKey||e.fixDeleteKey),this.stopPropagation=Boolean(void 0===e.stopPropagation||e.stopPropagation),this.activeButtonDelay=Number(e.activeButtonDelay)||300,this.pseudoClick=Boolean(e.pseudoClick),this.pseudoClickDeleteKey=void 0===e.pseudoClickDeleteKey?Boolean(e.pseudoClick):Boolean(e.pseudoClickDeleteKey),this.pseudoClickBlankKey=void 0===e.pseudoClickBlankKey?Boolean(e.pseudoClick):Boolean(e.pseudoClickBlankKey),this.vibrate=Boolean(e.vibrate),this.vibratePattern=this.vibratePattern||200,this.rows=Number(e.rows)||4,this.zIndex=Number(e.zIndex)||1;var i=["all","button","wrap","none"].find((function(t){return t===e.defaultStyle}))||"all";this.defaultStyle!==i&&(this.defaultStyle=i,document.head.removeChild(this.defaultStyleSheet),this.defaultStyleSheet=document.createElement("style"),"none"!==this.defaultStyle&&(document.head.appendChild(this.defaultStyleSheet),this.initDefaultStyles(this.defaultStyleSheet.sheet))),this.keyRandomize&&this.randomize()}}}},computed:{keypadStyles:function(){var t=Math.round(.3*Math.min(this.cellWidth,this.cellHeight)),e="\n        position: fixed;\n        z-index: ".concat(this.zIndex,";\n        bottom: 0;\n        left: 0;\n        right: 0;\n        height: 40vh;\n        padding: 10px;\n        background-color: #fff;\n        border-radius: 12px 12px 0 0;\n        box-shadow: 0 -4px 4px rgba(0, 0, 0, 0.15);\n        color: #000;\n        overflow: hidden;\n      ");return t?e+"\nfont-size: ".concat(t,"px;"):e},buttonWrapStyles:function(){return"\n        display: flex;\n        witdth: 100%;\n        height: 100%;\n        justify-content: space-between;\n        align-content: space-between;\n        flex-wrap: wrap;\n        gridGap: 5px;\n      "},buttonStyles:function(){var t="calc(".concat(Math.round(1e3/this.columns)/10,"% - ").concat(Math.ceil(5*(this.columns-1)/this.columns),"px)"),e="calc(".concat(Math.round(1e3/this.rows)/10,"% - ").concat(Math.ceil(5*(this.rows-1)/this.rows),"px)");return"\n        flex: 0 0 auto;\n        display: flex;\n        width: ".concat(t,";\n        height: ").concat(e,";\n        justify-content: center;\n        align-items: center;\n        background-color: #fff;\n        border: 1px solid #000;\n        border-radius: 8px;\n        font-size: inherit;\n      ")}},methods:{click:function(t,e){if(this.pseudoClick&&(-1!=t||this.pseudoClickDeleteKey)&&(""!=t||this.pseudoClickBlankKey)){var i=this.keyArray.length,o=Math.floor(Math.random()*(i-1)+e+1)%i;this.activeButton(o)}this.activeButton(e),this.vibrate&&window.navigator.vibrate&&window.navigator.vibrate(this.vibratePattern);var s=this.value,r=n(this.encryptedValue);this.encrypt?-1===t?(s=this.value.slice(0,-1),r.pop()):""!==t&&(s+=this.encryptedChar,r.push(this.encryptFunc(t.toString()))):-1===t?s=this.value.slice(0,-1):s+=t,this.$emit("update:value",String(s)),this.$emit("update:encryptedValue",r),this.keyRandomize&&this.randomizeWhenClick&&this.randomize()},randomize:function(){for(var t=[],e=0,n=0;n<this.keyArray.length;n++){var i=Math.random();this.fixDeleteKey&&-1==this.keyArray[n]?e++:i<.5?t.push(this.keyArray[n]):t.unshift(this.keyArray[n])}if(e)for(var o=0;o<e;o++)t.push(-1);this.keyArray=t},showKey:function(t){return-1===t?"del":t},resize:function(){this.cellWidth=this.$refs.button[0].offsetWidth,this.cellHeight=this.$refs.button[0].offsetHeight;var t=this.defaultStyleSheet.sheet;t&&null!==this.keypadStylesIndex&&(t.deleteRule(0),t.insertRule(".".concat(this.keypadClass.trim().split(" ")[0]," {").concat(this.keypadStyles,"}"),0))},setClass:function(t,e){var n=[this.buttonClass];return-1===t&&n.push(this.deleteButtonClass),""===t&&n.push(this.blankButtonClass),this.activeButtonIndexes[e]&&n.push(this.activeButtonClass),n},activeButton:function(t){var e=this;this.activeButtonIndexes[t]?clearTimeout(this.activeButtonIndexes[t]):this.$refs.button[t].classList.add(this.activeButtonClass),this.activeButtonIndexes[t]=setTimeout((function(){e.$refs.button[t].classList.remove(e.activeButtonClass),clearTimeout(e.activeButtonIndexes[t]),delete e.activeButtonIndexes[t]}),this.activeButtonDelay)},initDefaultStyles:function(t){if("none"!==this.defaultStyle){var e=/[^0-9A-z\-_ ]/,n=0;"button"!==this.defaultStyle&&(e.test(this.keypadClass)||(this.keypadStylesIndex=n,t.insertRule(".".concat(this.keypadClass.trim().split(" ")[0]," {").concat(this.keypadStyles,"}"),n++)),e.test(this.buttonWrapClass)||t.insertRule(".".concat(this.buttonWrapClass.trim().split(" ")[0]," {").concat(this.buttonWrapStyles,"}"),n++)),"wrap"!==this.defaultStyle&&(e.test(this.buttonClass)||(t.insertRule(".".concat(this.buttonClass.trim().split(" ")[0]," {").concat(this.buttonStyles,"}"),n++),e.test(this.activeButtonClass)||t.insertRule(".".concat(this.buttonClass.trim().split(" ")[0],".").concat(this.activeButtonClass.trim().split(" ")[0]," {background-color: #eaeaea;}"),n++)))}}},mounted:function(){window.addEventListener("resize",this.resize),"none"!==this.defaultStyle&&(document.head.appendChild(this.defaultStyleSheet),this.initDefaultStyles(this.defaultStyleSheet.sheet)),this.keyRandomize&&this.randomize(),this.resize()},beforeDestroy:function(){window.removeEventListener("resize",this.resize)}},undefined,false,undefined,!1,void 0,void 0,void 0),u=function(){var t=l;return t.install=function(e){e.component("VueNumericKeypad",t)},t}(),c=Object.freeze({__proto__:null,default:u});return Object.entries(c).forEach((function(t){var n=e(t,2),i=n[0],o=n[1];"default"!==i&&(u[i]=o)})),u}();

dist/vue-numeric-keypad.ssr.js

@@ -108,2 +108,3 @@ 'use strict';function _typeof(obj) {
 //
+//
 if (!Object.entries) {
@@ -197,4 +198,4 @@ Object.entries = function (obj) {
     return {
+      encrypt: Boolean(this.options.encrypt),
       encryptedChar: typeof this.options.encryptedChar === 'string' ? this.options.encryptedChar.substring(0, 1) : "0",
-      encrypt: Boolean(this.options.encrypt),
       keyArray: this.options.keyArray || (columns === 3 ? arr1 : arr2),
@@ -216,2 +217,4 @@ keyRandomize: Boolean(this.options.keyRandomize === undefined || this.options.keyRandomize),
       pseudoClickBlankKey: this.options.pseudoClickBlankKey === undefined ? Boolean(this.options.pseudoClick) : Boolean(this.options.pseudoClickBlankKey),
+      vibrate: Boolean(this.options.vibrate),
+      vibratePattern: this.options.vibratePattern || 200,
       rows: Number(this.options.rows) || 4,
@@ -251,2 +254,4 @@ columns: columns,
         this.pseudoClickBlankKey = options.pseudoClickBlankKey === undefined ? Boolean(options.pseudoClick) : Boolean(options.pseudoClickBlankKey);
+        this.vibrate = Boolean(options.vibrate);
+        this.vibratePattern = this.vibratePattern || 200;
         this.rows = Number(options.rows) || 4;
@@ -299,2 +304,3 @@ this.zIndex = Number(options.zIndex) || 1;
       this.activeButton(idx);
+      if (this.vibrate && window.navigator.vibrate) window.navigator.vibrate(this.vibratePattern);
       var newVal = this.value;
@@ -549,3 +555,3 @@
 
-var __vue_module_identifier__ = "data-v-758f4dcf";
+var __vue_module_identifier__ = "data-v-7091597c";
 /* functional template */
@@ -552,0 +558,0 @@

package.json

 {
   "name": "vue-numeric-keypad",
-  "version": "1.2.3",
+  "version": "1.2.4",
   "description": "The virtual numeric keypad that can be used on Vue.",
@@ -5,0 +5,0 @@ "main": "dist/vue-numeric-keypad.ssr.js",

README.md

@@ -87,5 +87,5 @@ # Vue Numeric Keypad [![npm](https://img.shields.io/npm/v/vue-numeric-keypad)](https://www.npmjs.com/package/vue-numeric-keypad) [![npm dev dependency version](https://img.shields.io/npm/dependency-version/vue-numeric-keypad/dev/vue)](https://www.npmjs.com/package/vue/v/2.6.14)
 |`id`|ID of the keypad.|False|String|
-|`:value.sync`|The value to change when entering the keypad.|True|String variable|
-|`:encryptedValue.sync` \| `:encrypted-value.sync`|Array in which encrypted values will be entered<br>when `options.encrypt: true`.|False|Array variable|
-|`:show.sync`|Bind to the v-show on the keypad. And adjust the font size and randomize the key arrangement.|True|(Boolean \| Number) variable|
+|`:value` \| `:value.sync`|The value to change when entering the keypad.|True|String \| <br> String variable|
+|`:encryptedValue.sync` \| `:encrypted-value.sync`|Array in which encrypted values will be entered<br>when `options.encrypt: true`.|False|Array&lt;string&gt; variable|
+|`:show.sync`|Bind to the v-show on the keypad. And adjust the font size and randomize the key arrangement.|True|Boolean variable \|<br> Number variable |
 |`:encryptFunc` \| `:encrypt-func`|A function that encrypts the input<br>when `options.encrypt: true`.|False|Function|
@@ -102,3 +102,3 @@ |`:options`|Set several values.<br>(details can be found below)|False|Object|
 |`columns`|Sets the number of columns in the key array.<br>Valid when `buttonWrapStyles` is the default.|Number|3|
-|`keyArray`|Can only have an integer 'number' between -1 and 9 and an empty 'string' type.<br>-1 means the delete key|Array|`columns` === 3 ?<br>[1, 2, 3, 4, 5, 6, 7, 8, 9, "", 0, -1] :<br>[1, 2, 3, 4, 5, 6, 7, 8, 9, 0, "", -1]|
+|`keyArray`|Can only have an integer 'number' between -1 and 9 and an empty 'string' type.<br>-1 means the delete key|Array&lt;number\|string&gt;|`columns` === 3 ?<br>[1, 2, 3, 4, 5, 6, 7, 8, 9, "", 0, -1] :<br>[1, 2, 3, 4, 5, 6, 7, 8, 9, 0, "", -1]|
 |`encrypt`|Using encryption|Boolean|false|
@@ -110,4 +110,6 @@ |`encryptedChar`|Will be placed in `:value.sync` of the original value.<br>For strings of length greater than 1, only the first character is valid.|String|'0'|
 |`pseudoClickBlankKey`|Clicking the blank button triggers a pseudo click on another button|Boolean|`pseudoClick`|
-|`defaultStyle`|'all': Use All default styles<br>'button': Use `buttonStyles`, `activeButtonStyles` default styles<br>'wrap': Use `keypadStyles`, `buttonWrapStyles` default styles<br>'none': Not use all default styles|['all', 'button', 'wrap', 'none']|'all'|
+|`defaultStyle`|'all': Use All default styles<br>'button': Use `buttonStyles`, `activeButtonStyles` default styles<br>'wrap': Use `keypadStyles`, `buttonWrapStyles` default styles<br>'none': Not use all default styles|'all' \| 'button' \| 'wrap' \| 'none'|'all'|
 |`stopPropagation`|Prevents the propagation of events that turn off `:show.sync`.|Boolean|true|
+|`vibrate`|Using vibrate ([reference](https://developer.mozilla.org/en-US/docs/Web/API/Vibration_API))|Boolean|true|
+|`vibratePattern`|Vibrate pattern ([reference](https://developer.mozilla.org/en-US/docs/Web/API/Vibration_API))|Number \| <br>Array&lt;number&gt;|true|
 
@@ -114,0 +116,0 @@ > #### class option

No alert changes

Improved metrics

Total package byte prevSize

73338

increased by2.46%

Lines of code

994

increased by1.64%

Number of lines in readme file

211

increased by0.96%

No dependency changes