mirrors/maska
2
0
Fork 0
mirror of https://github.com/tenrok/maska.git synced 2026-05-30 15:24:06 +03:00
Code Activity

Fixed bug with dynamic mask boundaries

Browse Source
This commit is contained in:
Alexander Shabunevich
2021-02-23 13:59:32 +03:00
parent 99013bd69d
commit b6266789e5
10 changed files with 41 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dist/es6/maska.esm.js
Vendored
+2 -2
View File
@@ -1,6 +1,6 @@
/*!
* maska v1.4.0
* maska v1.4.1
* (c) 2019-2021 Alexander Shabunevich
* Released under the MIT License.
*/
function t(t,a,s,r=!0){return e(a).length>1?function(t){const a=e(t).sort(((t,e)=>t.length-e.length));return function(t,e,s,r=!0){let o=0;for(;o<a.length;){const e=a[o];o++;const i=a[o];if(!(i&&n(t,i,s,!0).length>e.length))return n(t,e,s,r)}return""}}(a)(t,a,s,r):n(t,a,s,r)}function e(t){try{return JSON.parse(t)}catch{return[t]}}function n(t,e,n,s=!0){let r=0,o=0,i="",u="";for(;r<e.length&&o<t.length;){let u=e[r];const l=t[o],p=n[u];if(p&&p.pattern)p.pattern.test(l)&&(i+=a(l,p),r++,s&&e[r]&&!n[e[r]]&&(i+=e[r],r++)),o++;else if(p&&p.repeat){const t=n[e[r-1]];t&&!t.pattern.test(l)?r++:r--}else p&&p.escape&&(r++,u=e[r]),s&&(i+=u),l===u&&o++,r++}for(;s&&r<e.length;){const t=e[r];if(n[t]){u="";break}u+=t,r++}return i+u}function a(t,e){return e.transform&&(t=e.transform(t)),e.uppercase?t.toLocaleUpperCase():e.lowercase?t.toLocaleLowerCase():t}var s={"#":{pattern:/[0-9]/},X:{pattern:/[0-9a-zA-Z]/},S:{pattern:/[a-zA-Z]/},A:{pattern:/[a-zA-Z]/,uppercase:!0},a:{pattern:/[a-zA-Z]/,lowercase:!0},"!":{escape:!0},"*":{repeat:!0}};function r(t){return t instanceof HTMLInputElement?t:t.querySelector("input")||t}function o(t){return"[object String]"===Object.prototype.toString.call(t)}class i{constructor(t,e={}){if(!t)throw new Error("Maska: no element for mask");if(e.tokens)for(const t in e.tokens)e.tokens[t]={...e.tokens[t]},e.tokens[t].pattern&&o(e.tokens[t].pattern)&&(e.tokens[t].pattern=new RegExp(e.tokens[t].pattern));this._opts={mask:e.mask,tokens:{...s,...e.tokens}},this._el=o(t)?document.querySelectorAll(t):t.length?t:[t],this.init()}init(){for(let t=0;t<this._el.length;t++){const e=r(this._el[t]);!this._opts.mask||e.dataset.mask&&e.dataset.mask===this._opts.mask||(e.dataset.mask=this._opts.mask),this.updateValue(e),e.dataset.maskInited||(e.dataset.maskInited=!0,e.addEventListener("input",(t=>this.updateValue(t.target,t))),e.addEventListener("beforeinput",(t=>this.beforeInput(t))))}}destroy(){for(let t=0;t<this._el.length;t++){const e=r(this._el[t]);e.removeEventListener("input",(t=>this.updateValue(t.target,t))),e.removeEventListener("beforeinput",(t=>this.beforeInput(t))),delete e.dataset.mask,delete e.dataset.maskInited}}updateValue(e,n){const a=e.type.match(/^number$/i)&&e.validity.badInput;if(!e.value&&!a||!e.dataset.mask)return e.dataset.maskRawValue="",void this.dispatch("maska",e,n);let s=e.selectionEnd;const r=e.value,o=r[s-1];e.dataset.maskRawValue=t(e.value,e.dataset.mask,this._opts.tokens,!1),e.value=t(e.value,e.dataset.mask,this._opts.tokens),n&&"insertText"===n.inputType&&s===r.length&&(s=e.value.length),function(t,e,n){for(;e&&e<t.value.length&&t.value.charAt(e-1)!==n;)e++;(t.type?t.type.match(/^(text|search|password|tel|url)$/i):!t.type)&&t===document.activeElement&&(t.setSelectionRange(e,e),setTimeout((function(){t.setSelectionRange(e,e)}),0))}(e,s,o),this.dispatch("maska",e,n),e.value!==r&&this.dispatch("input",e,n)}beforeInput(t){t.target.type.match(/^number$/i)&&t.data&&isNaN(t.target.value+t.data)&&t.preventDefault()}dispatch(t,e,n){e.dispatchEvent(function(t,e=null){const n=document.createEvent("Event");return n.initEvent(t,!0,!0),e&&(n.inputType=e),n}(t,n&&n.inputType||null))}}function u(t,e){if(e.value)return e.value&&function(t){return!(o(t.value)&&t.value===t.oldValue||Array.isArray(t.value)&&JSON.stringify(t.value)===JSON.stringify(t.oldValue)||t.value&&t.value.mask&&t.oldValue&&t.oldValue.mask&&t.value.mask===t.oldValue.mask)}(e)?new i(t,function(t){const e={};return t.mask?(e.mask=Array.isArray(t.mask)?JSON.stringify(t.mask):t.mask,e.tokens=t.tokens?{...t.tokens}:{}):e.mask=Array.isArray(t)?JSON.stringify(t):t,e}(e.value)):void 0}function l(t){t.directive("maska",u)}function p(t,e){return new i(t,e)}"undefined"!=typeof window&&window.Vue&&window.Vue.use&&window.Vue.use(l);export default l;export{p as create,l as install,t as mask,u as maska,s as tokens};
function t(t,a,s,r=!0){return e(a).length>1?function(t){const a=e(t).sort(((t,e)=>t.length-e.length));return function(t,e,r,i=!0){const o=a.map((e=>n(t,e,r,!1))).pop();for(let e in a)if(s(o,a[e],r))return n(t,a[e],r,i);return""};function s(t,e,n){for(let t in n)n[t].escape&&(e=e.replace(new RegExp(t+".{1}","g"),""));return e.split("").filter((t=>n[t]&&n[t].pattern)).length>=t.length}}(a)(t,a,s,r):n(t,a,s,r)}function e(t){try{return JSON.parse(t)}catch{return[t]}}function n(t,e,n,s=!0){let r=0,i=0,o="",u="";for(;r<e.length&&i<t.length;){let u=e[r];const l=t[i],p=n[u];if(p&&p.pattern)p.pattern.test(l)&&(o+=a(l,p),r++,s&&e[r]&&!n[e[r]]&&(o+=e[r],r++)),i++;else if(p&&p.repeat){const t=n[e[r-1]];t&&!t.pattern.test(l)?r++:r--}else p&&p.escape&&(r++,u=e[r]),s&&(o+=u),l===u&&i++,r++}for(;s&&r<e.length;){const t=e[r];if(n[t]){u="";break}u+=t,r++}return o+u}function a(t,e){return e.transform&&(t=e.transform(t)),e.uppercase?t.toLocaleUpperCase():e.lowercase?t.toLocaleLowerCase():t}var s={"#":{pattern:/[0-9]/},X:{pattern:/[0-9a-zA-Z]/},S:{pattern:/[a-zA-Z]/},A:{pattern:/[a-zA-Z]/,uppercase:!0},a:{pattern:/[a-zA-Z]/,lowercase:!0},"!":{escape:!0},"*":{repeat:!0}};function r(t){return t instanceof HTMLInputElement?t:t.querySelector("input")||t}function i(t){return"[object String]"===Object.prototype.toString.call(t)}class o{constructor(t,e={}){if(!t)throw new Error("Maska: no element for mask");if(e.tokens)for(const t in e.tokens)e.tokens[t]={...e.tokens[t]},e.tokens[t].pattern&&i(e.tokens[t].pattern)&&(e.tokens[t].pattern=new RegExp(e.tokens[t].pattern));this._opts={mask:e.mask,tokens:{...s,...e.tokens}},this._el=i(t)?document.querySelectorAll(t):t.length?t:[t],this.init()}init(){for(let t=0;t<this._el.length;t++){const e=r(this._el[t]);!this._opts.mask||e.dataset.mask&&e.dataset.mask===this._opts.mask||(e.dataset.mask=this._opts.mask),this.updateValue(e),e.dataset.maskInited||(e.dataset.maskInited=!0,e.addEventListener("input",(t=>this.updateValue(t.target,t))),e.addEventListener("beforeinput",(t=>this.beforeInput(t))))}}destroy(){for(let t=0;t<this._el.length;t++){const e=r(this._el[t]);e.removeEventListener("input",(t=>this.updateValue(t.target,t))),e.removeEventListener("beforeinput",(t=>this.beforeInput(t))),delete e.dataset.mask,delete e.dataset.maskInited}}updateValue(e,n){const a=e.type.match(/^number$/i)&&e.validity.badInput;if(!e.value&&!a||!e.dataset.mask)return e.dataset.maskRawValue="",void this.dispatch("maska",e,n);let s=e.selectionEnd;const r=e.value,i=r[s-1];e.dataset.maskRawValue=t(e.value,e.dataset.mask,this._opts.tokens,!1),e.value=t(e.value,e.dataset.mask,this._opts.tokens),n&&"insertText"===n.inputType&&s===r.length&&(s=e.value.length),function(t,e,n){for(;e&&e<t.value.length&&t.value.charAt(e-1)!==n;)e++;(t.type?t.type.match(/^(text|search|password|tel|url)$/i):!t.type)&&t===document.activeElement&&(t.setSelectionRange(e,e),setTimeout((function(){t.setSelectionRange(e,e)}),0))}(e,s,i),this.dispatch("maska",e,n),e.value!==r&&this.dispatch("input",e,n)}beforeInput(t){t.target.type.match(/^number$/i)&&t.data&&isNaN(t.target.value+t.data)&&t.preventDefault()}dispatch(t,e,n){e.dispatchEvent(function(t,e=null){const n=document.createEvent("Event");return n.initEvent(t,!0,!0),e&&(n.inputType=e),n}(t,n&&n.inputType||null))}}function u(t,e){if(e.value)return e.value&&function(t){return!(i(t.value)&&t.value===t.oldValue||Array.isArray(t.value)&&JSON.stringify(t.value)===JSON.stringify(t.oldValue)||t.value&&t.value.mask&&t.oldValue&&t.oldValue.mask&&t.value.mask===t.oldValue.mask)}(e)?new o(t,function(t){const e={};return t.mask?(e.mask=Array.isArray(t.mask)?JSON.stringify(t.mask):t.mask,e.tokens=t.tokens?{...t.tokens}:{}):e.mask=Array.isArray(t)?JSON.stringify(t):t,e}(e.value)):void 0}function l(t){t.directive("maska",u)}function p(t,e){return new o(t,e)}"undefined"!=typeof window&&window.Vue&&window.Vue.use&&window.Vue.use(l);export default l;export{p as create,l as install,t as mask,u as maska,s as tokens};
dist/es6/maska.js
Vendored
+2 -2
View File
@@ -1,6 +1,6 @@
/*!
* maska v1.4.0
* maska v1.4.1
* (c) 2019-2021 Alexander Shabunevich
* Released under the MIT License.
*/
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).Maska={})}(this,(function(t){"use strict";function e(t,e,s,r=!0){return n(e).length>1?function(t){const e=n(t).sort(((t,e)=>t.length-e.length));return function(t,n,s,r=!0){let o=0;for(;o<e.length;){const n=e[o];o++;const i=e[o];if(!(i&&a(t,i,s,!0).length>n.length))return a(t,n,s,r)}return""}}(e)(t,e,s,r):a(t,e,s,r)}function n(t){try{return JSON.parse(t)}catch{return[t]}}function a(t,e,n,a=!0){let r=0,o=0,i="",u="";for(;r<e.length&&o<t.length;){let u=e[r];const l=t[o],c=n[u];if(c&&c.pattern)c.pattern.test(l)&&(i+=s(l,c),r++,a&&e[r]&&!n[e[r]]&&(i+=e[r],r++)),o++;else if(c&&c.repeat){const t=n[e[r-1]];t&&!t.pattern.test(l)?r++:r--}else c&&c.escape&&(r++,u=e[r]),a&&(i+=u),l===u&&o++,r++}for(;a&&r<e.length;){const t=e[r];if(n[t]){u="";break}u+=t,r++}return i+u}function s(t,e){return e.transform&&(t=e.transform(t)),e.uppercase?t.toLocaleUpperCase():e.lowercase?t.toLocaleLowerCase():t}var r={"#":{pattern:/[0-9]/},X:{pattern:/[0-9a-zA-Z]/},S:{pattern:/[a-zA-Z]/},A:{pattern:/[a-zA-Z]/,uppercase:!0},a:{pattern:/[a-zA-Z]/,lowercase:!0},"!":{escape:!0},"*":{repeat:!0}};function o(t){return t instanceof HTMLInputElement?t:t.querySelector("input")||t}function i(t){return"[object String]"===Object.prototype.toString.call(t)}class u{constructor(t,e={}){if(!t)throw new Error("Maska: no element for mask");if(e.tokens)for(const t in e.tokens)e.tokens[t]={...e.tokens[t]},e.tokens[t].pattern&&i(e.tokens[t].pattern)&&(e.tokens[t].pattern=new RegExp(e.tokens[t].pattern));this._opts={mask:e.mask,tokens:{...r,...e.tokens}},this._el=i(t)?document.querySelectorAll(t):t.length?t:[t],this.init()}init(){for(let t=0;t<this._el.length;t++){const e=o(this._el[t]);!this._opts.mask||e.dataset.mask&&e.dataset.mask===this._opts.mask||(e.dataset.mask=this._opts.mask),this.updateValue(e),e.dataset.maskInited||(e.dataset.maskInited=!0,e.addEventListener("input",(t=>this.updateValue(t.target,t))),e.addEventListener("beforeinput",(t=>this.beforeInput(t))))}}destroy(){for(let t=0;t<this._el.length;t++){const e=o(this._el[t]);e.removeEventListener("input",(t=>this.updateValue(t.target,t))),e.removeEventListener("beforeinput",(t=>this.beforeInput(t))),delete e.dataset.mask,delete e.dataset.maskInited}}updateValue(t,n){const a=t.type.match(/^number$/i)&&t.validity.badInput;if(!t.value&&!a||!t.dataset.mask)return t.dataset.maskRawValue="",void this.dispatch("maska",t,n);let s=t.selectionEnd;const r=t.value,o=r[s-1];t.dataset.maskRawValue=e(t.value,t.dataset.mask,this._opts.tokens,!1),t.value=e(t.value,t.dataset.mask,this._opts.tokens),n&&"insertText"===n.inputType&&s===r.length&&(s=t.value.length),function(t,e,n){for(;e&&e<t.value.length&&t.value.charAt(e-1)!==n;)e++;(t.type?t.type.match(/^(text|search|password|tel|url)$/i):!t.type)&&t===document.activeElement&&(t.setSelectionRange(e,e),setTimeout((function(){t.setSelectionRange(e,e)}),0))}(t,s,o),this.dispatch("maska",t,n),t.value!==r&&this.dispatch("input",t,n)}beforeInput(t){t.target.type.match(/^number$/i)&&t.data&&isNaN(t.target.value+t.data)&&t.preventDefault()}dispatch(t,e,n){e.dispatchEvent(function(t,e=null){const n=document.createEvent("Event");return n.initEvent(t,!0,!0),e&&(n.inputType=e),n}(t,n&&n.inputType||null))}}function l(t,e){if(e.value)return e.value&&function(t){return!(i(t.value)&&t.value===t.oldValue||Array.isArray(t.value)&&JSON.stringify(t.value)===JSON.stringify(t.oldValue)||t.value&&t.value.mask&&t.oldValue&&t.oldValue.mask&&t.value.mask===t.oldValue.mask)}(e)?new u(t,function(t){const e={};return t.mask?(e.mask=Array.isArray(t.mask)?JSON.stringify(t.mask):t.mask,e.tokens=t.tokens?{...t.tokens}:{}):e.mask=Array.isArray(t)?JSON.stringify(t):t,e}(e.value)):void 0}function c(t){t.directive("maska",l)}"undefined"!=typeof window&&window.Vue&&window.Vue.use&&window.Vue.use(c),t.create=function(t,e){return new u(t,e)},t.default=c,t.install=c,t.mask=e,t.maska=l,t.tokens=r,Object.defineProperty(t,"__esModule",{value:!0})}));
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).Maska={})}(this,(function(e){"use strict";function t(e,t,s,r=!0){return n(t).length>1?function(e){const t=n(e).sort(((e,t)=>e.length-t.length));return function(e,n,r,o=!0){const i=t.map((t=>a(e,t,r,!1))).pop();for(let n in t)if(s(i,t[n],r))return a(e,t[n],r,o);return""};function s(e,t,n){for(let e in n)n[e].escape&&(t=t.replace(new RegExp(e+".{1}","g"),""));return t.split("").filter((e=>n[e]&&n[e].pattern)).length>=e.length}}(t)(e,t,s,r):a(e,t,s,r)}function n(e){try{return JSON.parse(e)}catch{return[e]}}function a(e,t,n,a=!0){let r=0,o=0,i="",u="";for(;r<t.length&&o<e.length;){let u=t[r];const l=e[o],p=n[u];if(p&&p.pattern)p.pattern.test(l)&&(i+=s(l,p),r++,a&&t[r]&&!n[t[r]]&&(i+=t[r],r++)),o++;else if(p&&p.repeat){const e=n[t[r-1]];e&&!e.pattern.test(l)?r++:r--}else p&&p.escape&&(r++,u=t[r]),a&&(i+=u),l===u&&o++,r++}for(;a&&r<t.length;){const e=t[r];if(n[e]){u="";break}u+=e,r++}return i+u}function s(e,t){return t.transform&&(e=t.transform(e)),t.uppercase?e.toLocaleUpperCase():t.lowercase?e.toLocaleLowerCase():e}var r={"#":{pattern:/[0-9]/},X:{pattern:/[0-9a-zA-Z]/},S:{pattern:/[a-zA-Z]/},A:{pattern:/[a-zA-Z]/,uppercase:!0},a:{pattern:/[a-zA-Z]/,lowercase:!0},"!":{escape:!0},"*":{repeat:!0}};function o(e){return e instanceof HTMLInputElement?e:e.querySelector("input")||e}function i(e){return"[object String]"===Object.prototype.toString.call(e)}class u{constructor(e,t={}){if(!e)throw new Error("Maska: no element for mask");if(t.tokens)for(const e in t.tokens)t.tokens[e]={...t.tokens[e]},t.tokens[e].pattern&&i(t.tokens[e].pattern)&&(t.tokens[e].pattern=new RegExp(t.tokens[e].pattern));this._opts={mask:t.mask,tokens:{...r,...t.tokens}},this._el=i(e)?document.querySelectorAll(e):e.length?e:[e],this.init()}init(){for(let e=0;e<this._el.length;e++){const t=o(this._el[e]);!this._opts.mask||t.dataset.mask&&t.dataset.mask===this._opts.mask||(t.dataset.mask=this._opts.mask),this.updateValue(t),t.dataset.maskInited||(t.dataset.maskInited=!0,t.addEventListener("input",(e=>this.updateValue(e.target,e))),t.addEventListener("beforeinput",(e=>this.beforeInput(e))))}}destroy(){for(let e=0;e<this._el.length;e++){const t=o(this._el[e]);t.removeEventListener("input",(e=>this.updateValue(e.target,e))),t.removeEventListener("beforeinput",(e=>this.beforeInput(e))),delete t.dataset.mask,delete t.dataset.maskInited}}updateValue(e,n){const a=e.type.match(/^number$/i)&&e.validity.badInput;if(!e.value&&!a||!e.dataset.mask)return e.dataset.maskRawValue="",void this.dispatch("maska",e,n);let s=e.selectionEnd;const r=e.value,o=r[s-1];e.dataset.maskRawValue=t(e.value,e.dataset.mask,this._opts.tokens,!1),e.value=t(e.value,e.dataset.mask,this._opts.tokens),n&&"insertText"===n.inputType&&s===r.length&&(s=e.value.length),function(e,t,n){for(;t&&t<e.value.length&&e.value.charAt(t-1)!==n;)t++;(e.type?e.type.match(/^(text|search|password|tel|url)$/i):!e.type)&&e===document.activeElement&&(e.setSelectionRange(t,t),setTimeout((function(){e.setSelectionRange(t,t)}),0))}(e,s,o),this.dispatch("maska",e,n),e.value!==r&&this.dispatch("input",e,n)}beforeInput(e){e.target.type.match(/^number$/i)&&e.data&&isNaN(e.target.value+e.data)&&e.preventDefault()}dispatch(e,t,n){t.dispatchEvent(function(e,t=null){const n=document.createEvent("Event");return n.initEvent(e,!0,!0),t&&(n.inputType=t),n}(e,n&&n.inputType||null))}}function l(e,t){if(t.value)return t.value&&function(e){return!(i(e.value)&&e.value===e.oldValue||Array.isArray(e.value)&&JSON.stringify(e.value)===JSON.stringify(e.oldValue)||e.value&&e.value.mask&&e.oldValue&&e.oldValue.mask&&e.value.mask===e.oldValue.mask)}(t)?new u(e,function(e){const t={};return e.mask?(t.mask=Array.isArray(e.mask)?JSON.stringify(e.mask):e.mask,t.tokens=e.tokens?{...e.tokens}:{}):t.mask=Array.isArray(e)?JSON.stringify(e):e,t}(t.value)):void 0}function p(e){e.directive("maska",l)}"undefined"!=typeof window&&window.Vue&&window.Vue.use&&window.Vue.use(p),e.create=function(e,t){return new u(e,t)},e.default=p,e.install=p,e.mask=t,e.maska=l,e.tokens=r,Object.defineProperty(e,"__esModule",{value:!0})}));
dist/es6/maska.umd.js
Vendored
+2 -2
View File
@@ -1,6 +1,6 @@
/*!
* maska v1.4.0
* maska v1.4.1
* (c) 2019-2021 Alexander Shabunevich
* Released under the MIT License.
*/
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).Maska={})}(this,(function(t){"use strict";function e(t,e,s,r=!0){return n(e).length>1?function(t){const e=n(t).sort(((t,e)=>t.length-e.length));return function(t,n,s,r=!0){let o=0;for(;o<e.length;){const n=e[o];o++;const i=e[o];if(!(i&&a(t,i,s,!0).length>n.length))return a(t,n,s,r)}return""}}(e)(t,e,s,r):a(t,e,s,r)}function n(t){try{return JSON.parse(t)}catch{return[t]}}function a(t,e,n,a=!0){let r=0,o=0,i="",u="";for(;r<e.length&&o<t.length;){let u=e[r];const l=t[o],c=n[u];if(c&&c.pattern)c.pattern.test(l)&&(i+=s(l,c),r++,a&&e[r]&&!n[e[r]]&&(i+=e[r],r++)),o++;else if(c&&c.repeat){const t=n[e[r-1]];t&&!t.pattern.test(l)?r++:r--}else c&&c.escape&&(r++,u=e[r]),a&&(i+=u),l===u&&o++,r++}for(;a&&r<e.length;){const t=e[r];if(n[t]){u="";break}u+=t,r++}return i+u}function s(t,e){return e.transform&&(t=e.transform(t)),e.uppercase?t.toLocaleUpperCase():e.lowercase?t.toLocaleLowerCase():t}var r={"#":{pattern:/[0-9]/},X:{pattern:/[0-9a-zA-Z]/},S:{pattern:/[a-zA-Z]/},A:{pattern:/[a-zA-Z]/,uppercase:!0},a:{pattern:/[a-zA-Z]/,lowercase:!0},"!":{escape:!0},"*":{repeat:!0}};function o(t){return t instanceof HTMLInputElement?t:t.querySelector("input")||t}function i(t){return"[object String]"===Object.prototype.toString.call(t)}class u{constructor(t,e={}){if(!t)throw new Error("Maska: no element for mask");if(e.tokens)for(const t in e.tokens)e.tokens[t]={...e.tokens[t]},e.tokens[t].pattern&&i(e.tokens[t].pattern)&&(e.tokens[t].pattern=new RegExp(e.tokens[t].pattern));this._opts={mask:e.mask,tokens:{...r,...e.tokens}},this._el=i(t)?document.querySelectorAll(t):t.length?t:[t],this.init()}init(){for(let t=0;t<this._el.length;t++){const e=o(this._el[t]);!this._opts.mask||e.dataset.mask&&e.dataset.mask===this._opts.mask||(e.dataset.mask=this._opts.mask),this.updateValue(e),e.dataset.maskInited||(e.dataset.maskInited=!0,e.addEventListener("input",(t=>this.updateValue(t.target,t))),e.addEventListener("beforeinput",(t=>this.beforeInput(t))))}}destroy(){for(let t=0;t<this._el.length;t++){const e=o(this._el[t]);e.removeEventListener("input",(t=>this.updateValue(t.target,t))),e.removeEventListener("beforeinput",(t=>this.beforeInput(t))),delete e.dataset.mask,delete e.dataset.maskInited}}updateValue(t,n){const a=t.type.match(/^number$/i)&&t.validity.badInput;if(!t.value&&!a||!t.dataset.mask)return t.dataset.maskRawValue="",void this.dispatch("maska",t,n);let s=t.selectionEnd;const r=t.value,o=r[s-1];t.dataset.maskRawValue=e(t.value,t.dataset.mask,this._opts.tokens,!1),t.value=e(t.value,t.dataset.mask,this._opts.tokens),n&&"insertText"===n.inputType&&s===r.length&&(s=t.value.length),function(t,e,n){for(;e&&e<t.value.length&&t.value.charAt(e-1)!==n;)e++;(t.type?t.type.match(/^(text|search|password|tel|url)$/i):!t.type)&&t===document.activeElement&&(t.setSelectionRange(e,e),setTimeout((function(){t.setSelectionRange(e,e)}),0))}(t,s,o),this.dispatch("maska",t,n),t.value!==r&&this.dispatch("input",t,n)}beforeInput(t){t.target.type.match(/^number$/i)&&t.data&&isNaN(t.target.value+t.data)&&t.preventDefault()}dispatch(t,e,n){e.dispatchEvent(function(t,e=null){const n=document.createEvent("Event");return n.initEvent(t,!0,!0),e&&(n.inputType=e),n}(t,n&&n.inputType||null))}}function l(t,e){if(e.value)return e.value&&function(t){return!(i(t.value)&&t.value===t.oldValue||Array.isArray(t.value)&&JSON.stringify(t.value)===JSON.stringify(t.oldValue)||t.value&&t.value.mask&&t.oldValue&&t.oldValue.mask&&t.value.mask===t.oldValue.mask)}(e)?new u(t,function(t){const e={};return t.mask?(e.mask=Array.isArray(t.mask)?JSON.stringify(t.mask):t.mask,e.tokens=t.tokens?{...t.tokens}:{}):e.mask=Array.isArray(t)?JSON.stringify(t):t,e}(e.value)):void 0}function c(t){t.directive("maska",l)}"undefined"!=typeof window&&window.Vue&&window.Vue.use&&window.Vue.use(c),t.create=function(t,e){return new u(t,e)},t.default=c,t.install=c,t.mask=e,t.maska=l,t.tokens=r,Object.defineProperty(t,"__esModule",{value:!0})}));
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).Maska={})}(this,(function(e){"use strict";function t(e,t,s,r=!0){return n(t).length>1?function(e){const t=n(e).sort(((e,t)=>e.length-t.length));return function(e,n,r,o=!0){const i=t.map((t=>a(e,t,r,!1))).pop();for(let n in t)if(s(i,t[n],r))return a(e,t[n],r,o);return""};function s(e,t,n){for(let e in n)n[e].escape&&(t=t.replace(new RegExp(e+".{1}","g"),""));return t.split("").filter((e=>n[e]&&n[e].pattern)).length>=e.length}}(t)(e,t,s,r):a(e,t,s,r)}function n(e){try{return JSON.parse(e)}catch{return[e]}}function a(e,t,n,a=!0){let r=0,o=0,i="",u="";for(;r<t.length&&o<e.length;){let u=t[r];const l=e[o],p=n[u];if(p&&p.pattern)p.pattern.test(l)&&(i+=s(l,p),r++,a&&t[r]&&!n[t[r]]&&(i+=t[r],r++)),o++;else if(p&&p.repeat){const e=n[t[r-1]];e&&!e.pattern.test(l)?r++:r--}else p&&p.escape&&(r++,u=t[r]),a&&(i+=u),l===u&&o++,r++}for(;a&&r<t.length;){const e=t[r];if(n[e]){u="";break}u+=e,r++}return i+u}function s(e,t){return t.transform&&(e=t.transform(e)),t.uppercase?e.toLocaleUpperCase():t.lowercase?e.toLocaleLowerCase():e}var r={"#":{pattern:/[0-9]/},X:{pattern:/[0-9a-zA-Z]/},S:{pattern:/[a-zA-Z]/},A:{pattern:/[a-zA-Z]/,uppercase:!0},a:{pattern:/[a-zA-Z]/,lowercase:!0},"!":{escape:!0},"*":{repeat:!0}};function o(e){return e instanceof HTMLInputElement?e:e.querySelector("input")||e}function i(e){return"[object String]"===Object.prototype.toString.call(e)}class u{constructor(e,t={}){if(!e)throw new Error("Maska: no element for mask");if(t.tokens)for(const e in t.tokens)t.tokens[e]={...t.tokens[e]},t.tokens[e].pattern&&i(t.tokens[e].pattern)&&(t.tokens[e].pattern=new RegExp(t.tokens[e].pattern));this._opts={mask:t.mask,tokens:{...r,...t.tokens}},this._el=i(e)?document.querySelectorAll(e):e.length?e:[e],this.init()}init(){for(let e=0;e<this._el.length;e++){const t=o(this._el[e]);!this._opts.mask||t.dataset.mask&&t.dataset.mask===this._opts.mask||(t.dataset.mask=this._opts.mask),this.updateValue(t),t.dataset.maskInited||(t.dataset.maskInited=!0,t.addEventListener("input",(e=>this.updateValue(e.target,e))),t.addEventListener("beforeinput",(e=>this.beforeInput(e))))}}destroy(){for(let e=0;e<this._el.length;e++){const t=o(this._el[e]);t.removeEventListener("input",(e=>this.updateValue(e.target,e))),t.removeEventListener("beforeinput",(e=>this.beforeInput(e))),delete t.dataset.mask,delete t.dataset.maskInited}}updateValue(e,n){const a=e.type.match(/^number$/i)&&e.validity.badInput;if(!e.value&&!a||!e.dataset.mask)return e.dataset.maskRawValue="",void this.dispatch("maska",e,n);let s=e.selectionEnd;const r=e.value,o=r[s-1];e.dataset.maskRawValue=t(e.value,e.dataset.mask,this._opts.tokens,!1),e.value=t(e.value,e.dataset.mask,this._opts.tokens),n&&"insertText"===n.inputType&&s===r.length&&(s=e.value.length),function(e,t,n){for(;t&&t<e.value.length&&e.value.charAt(t-1)!==n;)t++;(e.type?e.type.match(/^(text|search|password|tel|url)$/i):!e.type)&&e===document.activeElement&&(e.setSelectionRange(t,t),setTimeout((function(){e.setSelectionRange(t,t)}),0))}(e,s,o),this.dispatch("maska",e,n),e.value!==r&&this.dispatch("input",e,n)}beforeInput(e){e.target.type.match(/^number$/i)&&e.data&&isNaN(e.target.value+e.data)&&e.preventDefault()}dispatch(e,t,n){t.dispatchEvent(function(e,t=null){const n=document.createEvent("Event");return n.initEvent(e,!0,!0),t&&(n.inputType=t),n}(e,n&&n.inputType||null))}}function l(e,t){if(t.value)return t.value&&function(e){return!(i(e.value)&&e.value===e.oldValue||Array.isArray(e.value)&&JSON.stringify(e.value)===JSON.stringify(e.oldValue)||e.value&&e.value.mask&&e.oldValue&&e.oldValue.mask&&e.value.mask===e.oldValue.mask)}(t)?new u(e,function(e){const t={};return e.mask?(t.mask=Array.isArray(e.mask)?JSON.stringify(e.mask):e.mask,t.tokens=e.tokens?{...e.tokens}:{}):t.mask=Array.isArray(e)?JSON.stringify(e):e,t}(t.value)):void 0}function p(e){e.directive("maska",l)}"undefined"!=typeof window&&window.Vue&&window.Vue.use&&window.Vue.use(p),e.create=function(e,t){return new u(e,t)},e.default=p,e.install=p,e.mask=t,e.maska=l,e.tokens=r,Object.defineProperty(e,"__esModule",{value:!0})}));
dist/maska.esm.js
Vendored
+2 -2
View File
File diff suppressed because one or more lines are too long
dist/maska.js
Vendored
+2 -2
View File
File diff suppressed because one or more lines are too long
dist/maska.umd.js
Vendored
+2 -2
View File
File diff suppressed because one or more lines are too long
docs/index.htm
+1 -1
View File
@@ -148,7 +148,7 @@
</section>
<script src="https://cdn.jsdelivr.net/npm/vue@2.6/dist/vue.js"></script>
<script src="https://cdn.jsdelivr.net/npm/maska@1.4.0/dist/maska.js"></script>
<script src="https://cdn.jsdelivr.net/npm/maska@1.4.1/dist/maska.js"></script>
<script>
// vue
new Vue({
package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "maska",
"version": "1.4.0",
"version": "1.4.1",
"description": "Simple zero-dependency input mask for Vue.js and vanilla JS",
"keywords": [
"mask",
src/mask.js
+17 -7
View File
@@ -16,17 +16,27 @@ function dynamic (mask) {
const masks = processMask(mask).sort((a, b) => a.length - b.length)
return function (value, mask, tokens, masked = true) {
let i = 0
while (i < masks.length) {
const currentMask = masks[i]
i++
const nextMask = masks[i]
if (!(nextMask && process(value, nextMask, tokens, true).length > currentMask.length)) {
return process(value, currentMask, tokens, masked)
const processed = masks.map(m => process(value, m, tokens, false))
const last = processed.pop()
for (let i in masks) {
if (checkMask(last, masks[i], tokens)) {
return process(value, masks[i], tokens, masked)
}
}
return '' // empty masks
}
function checkMask (variant, mask, tokens) {
for (let tok in tokens) {
if (tokens[tok].escape) {
mask = mask.replace(new RegExp(tok + '.{1}', 'g'), '')
}
}
return (mask.split('').filter(el => tokens[el] && tokens[el].pattern).length >= variant.length)
}
}
function process (value, mask, tokens, masked = true) {
test/mask.test.js
+10 -1
View File
@@ -121,6 +121,15 @@ test('Dynamic CPF/CNPJ', () => {
expect(mask('12345678901234', '["###.###.###-##", "##.###.###/####-##"]', tokens)).toBe('12.345.678/9012-34')
})
test('Dynamic boundaries', () => {
expect(mask('12', '["!###", "!###-##", "!###-##-##"]', tokens)).toBe('#12')
expect(mask('1234', '["!###", "!###-##", "!###-##-##"]', tokens)).toBe('#12-34')
expect(mask('1234567', '["!###", "!###-##", "!###-##-##"]', tokens)).toBe('#12-34-56')
expect(mask('123', '["###", "###-##", "###.##.##"]', tokens)).toBe('123')
expect(mask('12345', '["###", "###-##", "###.##.##"]', tokens)).toBe('123-45')
expect(mask('12345678', '["###", "###-##", "###.##.##"]', tokens)).toBe('123.45.67')
})
test('Custom transform: odd number -> 1, even number -> 0', () => {
// isOdd
const transform = (numberLike) => String(Number(numberLike) % 2)
@@ -191,4 +200,4 @@ test('Custom transform with `uppercase` and `lowercase` enabled: abkTYX -> АВ
}
}
})).toBe('авктух')
})
})