enhance attribute handling of input-mask elemement

CHANGELOG.md

@@ -1,5 +1,9 @@
 # Change Log
 
+## [5.0.4 - UNRELEASED]
+### Updates
+- \<input-mask> enhance attribute handling
+
 ## [5.0.3 - 11/01/2020
 ### Fixed
 - Pasted value is getting mixed up #2255

bower.json

@@ -1,6 +1,6 @@
 {
   "name": "inputmask",
-  "version": "5.0.4-beta.1",
+  "version": "5.0.4-beta.2",
   "main": [
 	  "./index.js",
     "./css/inputmask.css"

composer.json

@@ -1,7 +1,7 @@
 {
   "name": "robinherbots/inputmask",
   "description": "Inputmask is a javascript library which creates an input mask.  Inputmask can run against vanilla javascript, jQuery and jqlite.",
-  "version": "5.0.4-beta.1",
+  "version": "5.0.4-beta.2",
   "type": "library",
   "keywords": ["jquery", "plugins", "input", "form", "inputmask", "mask"],
   "homepage": "http://robinherbots.github.io/Inputmask",

dist/inputmask.js

@@ -3,7 +3,7 @@
  * https://github.com/RobinHerbots/Inputmask
  * Copyright (c) 2010 - 2020 Robin Herbots
  * Licensed under the MIT license
- * Version: 5.0.4-beta.1
+ * Version: 5.0.4-beta.2
  */
 !function webpackUniversalModuleDefinition(root, factory) {
     if ("object" == typeof exports && "object" == typeof module) module.exports = factory(); else if ("function" == typeof define && define.amd) define([], factory); else {
@@ -41,7 +41,7 @@
         }
         function importAttributeOptions(npt, opts, userOptions, dataAttribute) {
             function importOption(option, optionData) {
-                optionData = void 0 !== optionData ? optionData : npt.getAttribute(dataAttribute + "-" + option), 
+                optionData = void 0 !== optionData ? optionData : npt.getAttribute(dataAttribute + option), 
                 null !== optionData && ("string" == typeof optionData && (0 === option.indexOf("on") ? optionData = window[optionData] : "false" === optionData ? optionData = !1 : "true" === optionData && (optionData = !0)), 
                 userOptions[option] = optionData);
             }
@@ -67,7 +67,7 @@
             opts.isRTL = !0), Object.keys(userOptions).length;
         }
         Inputmask.prototype = {
-            dataAttribute: "data-inputmask",
+            dataAttribute: "data-inputmask-",
             defaults: {
                 _maxTestPos: 500,
                 placeholder: "_",
@@ -2698,8 +2698,9 @@
                     var attributeNames = _this.getAttributeNames(), shadow = _this.attachShadow({
                         mode: "closed"
                     }), input = document.createElement("input");
-                    for (var attr in input.type = "text", shadow.appendChild(input), attributeNames) Object.prototype.hasOwnProperty.call(attributeNames, attr) && input.setAttribute("data-inputmask-" + attributeNames[attr], _this.getAttribute(attributeNames[attr]));
-                    return new _inputmask.default().mask(input), input.inputmask.shadowRoot = shadow, 
+                    for (var attr in input.type = "text", shadow.appendChild(input), attributeNames) Object.prototype.hasOwnProperty.call(attributeNames, attr) && input.setAttribute(attributeNames[attr], _this.getAttribute(attributeNames[attr]));
+                    var im = new _inputmask.default();
+                    return im.dataAttribute = "", im.mask(input), input.inputmask.shadowRoot = shadow, 
                     _this;
                 }
                 return _inherits(InputmaskElement, _HTMLElement), InputmaskElement;

dist/jquery.inputmask.js

@@ -3,7 +3,7 @@
  * https://github.com/RobinHerbots/Inputmask
  * Copyright (c) 2010 - 2020 Robin Herbots
  * Licensed under the MIT license
- * Version: 5.0.4-beta.1
+ * Version: 5.0.4-beta.2
  */
 !function webpackUniversalModuleDefinition(root, factory) {
     if ("object" == typeof exports && "object" == typeof module) module.exports = factory(require("jquery")); else if ("function" == typeof define && define.amd) define([ "jquery" ], factory); else {
@@ -41,7 +41,7 @@
         }
         function importAttributeOptions(npt, opts, userOptions, dataAttribute) {
             function importOption(option, optionData) {
-                optionData = void 0 !== optionData ? optionData : npt.getAttribute(dataAttribute + "-" + option), 
+                optionData = void 0 !== optionData ? optionData : npt.getAttribute(dataAttribute + option), 
                 null !== optionData && ("string" == typeof optionData && (0 === option.indexOf("on") ? optionData = window[optionData] : "false" === optionData ? optionData = !1 : "true" === optionData && (optionData = !0)), 
                 userOptions[option] = optionData);
             }
@@ -67,7 +67,7 @@
             opts.isRTL = !0), Object.keys(userOptions).length;
         }
         Inputmask.prototype = {
-            dataAttribute: "data-inputmask",
+            dataAttribute: "data-inputmask-",
             defaults: {
                 _maxTestPos: 500,
                 placeholder: "_",
@@ -2573,8 +2573,9 @@
                     var attributeNames = _this.getAttributeNames(), shadow = _this.attachShadow({
                         mode: "closed"
                     }), input = document.createElement("input");
-                    for (var attr in input.type = "text", shadow.appendChild(input), attributeNames) Object.prototype.hasOwnProperty.call(attributeNames, attr) && input.setAttribute("data-inputmask-" + attributeNames[attr], _this.getAttribute(attributeNames[attr]));
-                    return new _inputmask.default().mask(input), input.inputmask.shadowRoot = shadow, 
+                    for (var attr in input.type = "text", shadow.appendChild(input), attributeNames) Object.prototype.hasOwnProperty.call(attributeNames, attr) && input.setAttribute(attributeNames[attr], _this.getAttribute(attributeNames[attr]));
+                    var im = new _inputmask.default();
+                    return im.dataAttribute = "", im.mask(input), input.inputmask.shadowRoot = shadow, 
                     _this;
                 }
                 return _inherits(InputmaskElement, _HTMLElement), InputmaskElement;

lib/inputmask.js

@@ -50,7 +50,7 @@ function Inputmask(alias, options, internal) {
 }
 
 Inputmask.prototype = {
-	dataAttribute: "data-inputmask", //data attribute prefix used for attribute binding
+	dataAttribute: "data-inputmask-", //data attribute prefix used for attribute binding
 	//options default
 	defaults: {
 		_maxTestPos: 500,
@@ -248,7 +248,7 @@ function resolveAlias(aliasStr, options, opts) {
 
 function importAttributeOptions(npt, opts, userOptions, dataAttribute) {
 	function importOption(option, optionData) {
-		optionData = optionData !== undefined ? optionData : npt.getAttribute(dataAttribute + "-" + option);
+		optionData = optionData !== undefined ? optionData : npt.getAttribute(dataAttribute + option);
 		if (optionData !== null) {
 			if (typeof optionData === "string") {
 				if (option.indexOf("on") === 0) {

lib/inputmaskElement.js

@@ -3,25 +3,27 @@ import Inputmask from "./inputmask";
 // add check if it is supported by the browser
 // integrate shadowroot into maskcope
 if (document.head.createShadowRoot || document.head.attachShadow) {
-    class InputmaskElement extends HTMLElement {
-        constructor() {
-            super();
-            var attributeNames = this.getAttributeNames(),
-                shadow = this.attachShadow({ mode: "closed" }),
-                input = document.createElement("input");
-            input.type = "text";
-            shadow.appendChild(input);
+	class InputmaskElement extends HTMLElement {
+		constructor() {
+			super();
+			var attributeNames = this.getAttributeNames(),
+				shadow = this.attachShadow({mode: "closed"}),
+				input = document.createElement("input");
+			input.type = "text";
+			shadow.appendChild(input);
 
-            for (var attr in attributeNames) {
-                if (Object.prototype.hasOwnProperty.call(attributeNames, attr)) {
-                    input.setAttribute("data-inputmask-" + attributeNames[attr], this.getAttribute(attributeNames[attr]));
-                }
-            }
+			for (var attr in attributeNames) {
+				if (Object.prototype.hasOwnProperty.call(attributeNames, attr)) {
+					input.setAttribute( attributeNames[attr], this.getAttribute(attributeNames[attr]));
+				}
+			}
 
-            new Inputmask().mask(input);
-            input.inputmask.shadowRoot = shadow; //make the shadowRoot available
-        }
-    }
+			var im = new Inputmask();
+			im.dataAttribute = "";
+			im.mask(input);
+			input.inputmask.shadowRoot = shadow; //make the shadowRoot available
+		}
+	}
 
-    customElements.define("input-mask", InputmaskElement);
+	customElements.define("input-mask", InputmaskElement);
 }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "inputmask",
-  "version": "5.0.4-beta.1",
+  "version": "5.0.4-beta.2",
   "description": "Inputmask is a javascript library which creates an input mask.  Inputmask can run against vanilla javascript, jQuery and jqlite.",
   "main": "index.js",
   "files": [