diff --git a/dist/aspnet-validation.js b/dist/aspnet-validation.js index 289d13d..3f3917d 100644 --- a/dist/aspnet-validation.js +++ b/dist/aspnet-validation.js @@ -463,7 +463,7 @@ var ValidationService = /** @class */ (function () { */ this.providers = {}; /** - * A key-value collection of elements for displaying validation messages for an input (by DOM ID). + * A key-value collection of form UIDs and their elements for displaying validation messages for an input (by DOM name). */ this.messageFor = {}; /** @@ -506,29 +506,51 @@ var ValidationService = /** @class */ (function () { * Fires off validation for elements within the provided form and then calls the callback * @param form The form to validate. * @param callback Receives true or false indicating validity after all validation is complete. + * @returns Promise that resolves to true or false indicating validity after all validation is complete. */ - this.validateForm = function (form, callback) { - if (!(form instanceof HTMLFormElement)) { - throw new Error('validateForm() can only be called on
elements'); - } - var formUID = _this.getElementUID(form); - var formValidationEvent = _this.formEvents[formUID]; - if (formValidationEvent) { - formValidationEvent(undefined, callback); - } - }; + this.validateForm = function (form, callback) { return __awaiter(_this, void 0, void 0, function () { + var formUID, formValidationEvent, _a; + return __generator(this, function (_b) { + switch (_b.label) { + case 0: + if (!(form instanceof HTMLFormElement)) { + throw new Error('validateForm() can only be called on elements'); + } + formUID = this.getElementUID(form); + formValidationEvent = this.formEvents[formUID]; + _a = !formValidationEvent; + if (_a) return [3 /*break*/, 2]; + return [4 /*yield*/, formValidationEvent(undefined, callback)]; + case 1: + _a = (_b.sent()); + _b.label = 2; + case 2: return [2 /*return*/, _a]; + } + }); + }); }; /** * Fires off validation for the provided element and then calls the callback * @param field The element to validate. * @param callback Receives true or false indicating validity after all validation is complete. + * @returns Promise that resolves to true or false indicating validity after all validation is complete */ - this.validateField = function (field, callback) { - var fieldUID = _this.getElementUID(field); - var fieldValidationEvent = _this.inputEvents[fieldUID]; - if (fieldValidationEvent) { - fieldValidationEvent(undefined, callback); - } - }; + this.validateField = function (field, callback) { return __awaiter(_this, void 0, void 0, function () { + var fieldUID, fieldValidationEvent, _a; + return __generator(this, function (_b) { + switch (_b.label) { + case 0: + fieldUID = this.getElementUID(field); + fieldValidationEvent = this.inputEvents[fieldUID]; + _a = !fieldValidationEvent; + if (_a) return [3 /*break*/, 2]; + return [4 /*yield*/, fieldValidationEvent(undefined, callback)]; + case 1: + _a = (_b.sent()); + _b.label = 2; + case 2: return [2 /*return*/, _a]; + } + }); + }); }; /** * Called before validating form submit events. * Default calls `preventDefault()` and `stopImmediatePropagation()`. @@ -734,22 +756,18 @@ var ValidationService = /** @class */ (function () { this.addProvider('remote', mvc.remote); }; /** - * Scans document for all validation message generated by ASP.NET Core MVC, then tracks them. + * Scans `root` for all validation message generated by ASP.NET Core MVC, then calls `cb` for each. + * @param root The root node to scan + * @param cb The callback to invoke with each form and span */ - ValidationService.prototype.scanMessages = function (root, remove) { - if (remove === void 0) { remove = false; } + ValidationService.prototype.scanMessages = function (root, cb) { /* If a validation span explicitly declares a form, we group the span with that form. */ var validationMessageElements = Array.from(root.querySelectorAll('span[form]')); for (var _i = 0, validationMessageElements_1 = validationMessageElements; _i < validationMessageElements_1.length; _i++) { var span = validationMessageElements_1[_i]; var form = document.getElementById(span.getAttribute('form')); - if (form) { - if (remove) { - this.removeValidationMessageSpan(form, span); - } - else { - this.pushValidationMessageSpan(form, span); - } + if (form instanceof HTMLFormElement) { + cb.call(this, form, span); } } // Otherwise if a validation message span is inside a form, we group the span with the form it's inside. @@ -769,19 +787,19 @@ var ValidationService = /** @class */ (function () { var validationMessageElements_3 = Array.from(form.querySelectorAll('[data-valmsg-for]')); for (var _b = 0, validationMessageElements_2 = validationMessageElements_3; _b < validationMessageElements_2.length; _b++) { var span = validationMessageElements_2[_b]; - if (remove) { - this.removeValidationMessageSpan(form, span); - } - else { - this.pushValidationMessageSpan(form, span); - } + cb.call(this, form, span); } } }; ValidationService.prototype.pushValidationMessageSpan = function (form, span) { + var _a, _b; + var _c; var formId = this.getElementUID(form); - var name = "".concat(formId, ":").concat(span.getAttribute('data-valmsg-for')); - var spans = this.messageFor[name] || (this.messageFor[name] = []); + var formSpans = (_a = (_c = this.messageFor)[formId]) !== null && _a !== void 0 ? _a : (_c[formId] = {}); + var messageForId = span.getAttribute('data-valmsg-for'); + if (!messageForId) + return; + var spans = (_b = formSpans[messageForId]) !== null && _b !== void 0 ? _b : (formSpans[messageForId] = []); if (spans.indexOf(span) < 0) { spans.push(span); } @@ -791,8 +809,13 @@ var ValidationService = /** @class */ (function () { }; ValidationService.prototype.removeValidationMessageSpan = function (form, span) { var formId = this.getElementUID(form); - var name = "".concat(formId, ":").concat(span.getAttribute('data-valmsg-for')); - var spans = this.messageFor[name]; + var formSpans = this.messageFor[formId]; + if (!formSpans) + return; + var messageForId = span.getAttribute('data-valmsg-for'); + if (!messageForId) + return; + var spans = formSpans[messageForId]; if (!spans) { return; } @@ -894,12 +917,12 @@ var ValidationService = /** @class */ (function () { }; // Retrieves the validation span for the input. ValidationService.prototype.getMessageFor = function (input) { + var _a; if (!input.form) { - return []; + return undefined; } var formId = this.getElementUID(input.form); - var name = "".concat(formId, ":").concat(input.name); - return this.messageFor[name]; + return (_a = this.messageFor[formId]) === null || _a === void 0 ? void 0 : _a[input.name]; }; /** * Returns true if the event triggering the form submission indicates we should validate the form. @@ -937,26 +960,22 @@ var ValidationService = /** @class */ (function () { if (this.formEvents[formUID]) { return; } - var validating = false; + var validationTask = null; var cb = function (e, callback) { // Prevent recursion - if (validating) { - return; + if (validationTask) { + return validationTask; } if (!_this.shouldValidate(e)) { - return; - } - var validate = _this.getFormValidationTask(formUID); - if (!validate) { - return; + return Promise.resolve(true); } + validationTask = _this.getFormValidationTask(formUID); //`preValidate` typically prevents submit before validation if (e) { _this.preValidate(e); } - validating = true; _this.logger.log('Validating', form); - validate.then(function (success) { return __awaiter(_this, void 0, void 0, function () { + return validationTask.then(function (success) { return __awaiter(_this, void 0, void 0, function () { var validationEvent; return __generator(this, function (_a) { switch (_a.label) { @@ -964,7 +983,7 @@ var ValidationService = /** @class */ (function () { this.logger.log('Validated (success = %s)', success, form); if (callback) { callback(success); - return [2 /*return*/]; + return [2 /*return*/, success]; } validationEvent = new CustomEvent('validation', { detail: { valid: success } @@ -976,24 +995,30 @@ var ValidationService = /** @class */ (function () { // Firefox fix: redispatch 'submit' after finished handling this event _a.sent(); this.handleValidated(form, success, e); - return [2 /*return*/]; + return [2 /*return*/, success]; } }); }); }).catch(function (error) { _this.logger.log('Validation error', error); + return false; }).finally(function () { - validating = false; + validationTask = null; }); }; form.addEventListener('submit', cb); - form.addEventListener('reset', function (e) { + var cbReset = function (e) { var uids = _this.formInputs[formUID]; for (var _i = 0, uids_1 = uids; _i < uids_1.length; _i++) { var uid = uids_1[_i]; _this.resetField(uid); } _this.renderSummary(); - }); + }; + form.addEventListener('reset', cbReset); + cb.remove = function () { + form.removeEventListener('submit', cb); + form.removeEventListener('reset', cbReset); + }; this.formEvents[formUID] = cb; }; /* @@ -1009,28 +1034,34 @@ var ValidationService = /** @class */ (function () { }; ValidationService.prototype.resetField = function (inputUID) { var input = this.elementByUID[inputUID]; - if (input.classList.contains(this.ValidationInputCssClassName)) { - input.classList.remove(this.ValidationInputCssClassName); - } - if (input.classList.contains(this.ValidationInputValidCssClassName)) { - input.classList.remove(this.ValidationInputValidCssClassName); - } - var spans = this.getMessageFor(input); + this.swapClasses(input, '', this.ValidationInputCssClassName); + this.swapClasses(input, '', this.ValidationInputValidCssClassName); + var spans = isValidatable(input) && this.getMessageFor(input); if (spans) { for (var i = 0; i < spans.length; i++) { spans[i].innerHTML = ''; + this.swapClasses(spans[i], '', this.ValidationMessageCssClassName); + this.swapClasses(spans[i], '', this.ValidationMessageValidCssClassName); } } delete this.summary[inputUID]; }; ValidationService.prototype.untrackFormInput = function (form, inputUID) { + var _a; var formUID = this.getElementUID(form); - if (!this.formInputs[formUID]) { + var formInputs = this.formInputs[formUID]; + if (!formInputs) { return; } var indexToRemove = this.formInputs[formUID].indexOf(inputUID); if (indexToRemove >= 0) { - this.formInputs[formUID].splice(indexToRemove, 1); + formInputs[formUID].splice(indexToRemove, 1); + if (!formInputs.length) { + (_a = this.formEvents[formUID]) === null || _a === void 0 ? void 0 : _a.remove(); + delete this.formEvents[formUID]; + delete this.formInputs[formUID]; + delete this.messageFor[formUID]; + } } else { this.logger.log("Form input for UID '%s' was already removed", inputUID); @@ -1052,30 +1083,51 @@ var ValidationService = /** @class */ (function () { if (this.inputEvents[uid]) { return; } + var cb = function (event, callback) { return __awaiter(_this, void 0, void 0, function () { + var validate, success, error_1; + return __generator(this, function (_a) { + switch (_a.label) { + case 0: + validate = this.validators[uid]; + if (!validate) + return [2 /*return*/, true]; + this.logger.log('Validating', { event: event }); + _a.label = 1; + case 1: + _a.trys.push([1, 3, , 4]); + return [4 /*yield*/, validate()]; + case 2: + success = _a.sent(); + callback(success); + return [2 /*return*/, success]; + case 3: + error_1 = _a.sent(); + this.logger.log('Validation error', error_1); + return [2 /*return*/, false]; + case 4: return [2 /*return*/]; + } + }); + }); }; var debounceTimeoutID = 0; - var cb = function (e, callback) { - var validate = _this.validators[uid]; + cb.debounced = function (event, callback) { clearTimeout(debounceTimeoutID); debounceTimeoutID = setTimeout(function () { - validate() - .then(callback) - .catch(function (error) { - _this.logger.log('Validation error', error); - }); + cb(event, callback); }, _this.debounce); }; - var validateEvent = input.dataset.valEvent; - if (validateEvent) { - input.addEventListener(validateEvent, cb); - } - else { - var eventType = input instanceof HTMLSelectElement ? 'change' : 'input'; - input.addEventListener(eventType, cb); - } + var validateEvent = input.dataset.valEvent || input instanceof HTMLSelectElement ? 'change' : 'input'; + input.addEventListener(validateEvent, cb.debounced); + cb.remove = function () { return input.removeEventListener(validateEvent, cb.debounced); }; this.inputEvents[uid] = cb; }; ValidationService.prototype.removeInput = function (input) { var uid = this.getElementUID(input); + // Clean up event listener + var cb = this.inputEvents[uid]; + if (cb === null || cb === void 0 ? void 0 : cb.remove) { + cb.remove(); + delete cb.remove; + } delete this.summary[uid]; delete this.inputEvents[uid]; delete this.validators[uid]; @@ -1084,10 +1136,11 @@ var ValidationService = /** @class */ (function () { } }; /** - * Scans the entire document for input elements to be validated. + * Scans `root` for input elements to be validated, then calls `cb` for each. + * @param root The root node to scan + * @param cb The callback to invoke with each input */ - ValidationService.prototype.scanInputs = function (root, remove) { - if (remove === void 0) { remove = false; } + ValidationService.prototype.scanInputs = function (root, cb) { var inputs = Array.from(root.querySelectorAll(validatableSelector('[data-val="true"]'))); // querySelectorAll does not include the root element itself. // we could use 'matches', but that's newer than querySelectorAll so we'll keep it simple and compatible. @@ -1096,12 +1149,7 @@ var ValidationService = /** @class */ (function () { } for (var i = 0; i < inputs.length; i++) { var input = inputs[i]; - if (remove) { - this.removeInput(input); - } - else { - this.addInput(input); - } + cb.call(this, input); } }; /** @@ -1349,27 +1397,32 @@ var ValidationService = /** @class */ (function () { } }; /** - * Scans the provided root element for any validation directives and attaches behavior to them. + * Scans the root element for any validation directives and attaches behavior to them. + * @param root The root node to scan; if not provided, `options.root` (default: `document.body`) will be scanned */ ValidationService.prototype.scan = function (root) { + root !== null && root !== void 0 ? root : (root = this.options.root); this.logger.log('Scanning', root); - this.scanMessages(root); - this.scanInputs(root); + this.scanMessages(root, this.pushValidationMessageSpan); + this.scanInputs(root, this.addInput); }; /** - * Scans the provided root element for any validation directives and removes behavior from them. + * Scans the root element for any validation directives and removes behavior from them. + * @param root The root node to scan; if not provided, `options.root` (default: `document.body`) will be scanned */ ValidationService.prototype.remove = function (root) { + root !== null && root !== void 0 ? root : (root = this.options.root); this.logger.log('Removing', root); - this.scanMessages(root, true); - this.scanInputs(root, true); + this.scanMessages(root, this.removeValidationMessageSpan); + this.scanInputs(root, this.removeInput); }; /** * Watches the provided root element for mutations, and scans for new validation directives to attach behavior. - * @param root The root element to use, defaults to the document.documentElement. + * @param root The root node to watch; if not provided, `options.root` (default: `document.body`) will be watched */ ValidationService.prototype.watch = function (root) { var _this = this; + root !== null && root !== void 0 ? root : (root = this.options.root); this.observer = new MutationObserver(function (mutations) { mutations.forEach(function (mutation) { _this.observed(mutation); diff --git a/dist/aspnet-validation.min.js b/dist/aspnet-validation.min.js index 62e8583..0f54223 100644 --- a/dist/aspnet-validation.min.js +++ b/dist/aspnet-validation.min.js @@ -1,2 +1,2 @@ -!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.aspnetValidation=e():t.aspnetValidation=e()}(window,(function(){return function(t){var e={};function n(r){if(e[r])return e[r].exports;var a=e[r]={i:r,l:!1,exports:{}};return t[r].call(a.exports,a,a.exports,n),a.l=!0,a.exports}return n.m=t,n.c=e,n.d=function(t,e,r){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:r})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var a in t)n.d(r,a,function(e){return t[e]}.bind(null,a));return r},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=0)}([function(t,e,n){"use strict";n.r(e),n.d(e,"isValidatable",(function(){return s})),n.d(e,"MvcValidationProviders",(function(){return d})),n.d(e,"ValidationService",(function(){return c}));var r=function(t,e,n,r){return new(n||(n=Promise))((function(a,i){function s(t){try{l(r.next(t))}catch(t){i(t)}}function o(t){try{l(r.throw(t))}catch(t){i(t)}}function l(t){var e;t.done?a(t.value):(e=t.value,e instanceof n?e:new n((function(t){t(e)}))).then(s,o)}l((r=r.apply(t,e||[])).next())}))},a=function(t,e){var n,r,a,i,s={label:0,sent:function(){if(1&a[0])throw a[1];return a[1]},trys:[],ops:[]};return i={next:o(0),throw:o(1),return:o(2)},"function"==typeof Symbol&&(i[Symbol.iterator]=function(){return this}),i;function o(o){return function(l){return function(o){if(n)throw new TypeError("Generator is already executing.");for(;i&&(i=0,o[0]&&(s=0)),s;)try{if(n=1,r&&(a=2&o[0]?r.return:o[0]?r.throw||((a=r.return)&&a.call(r),0):r.next)&&!(a=a.call(r,o[1])).done)return a;switch(r=0,a&&(o=[2&o[0],a.value]),o[0]){case 0:case 1:a=o;break;case 4:return s.label++,{value:o[1],done:!1};case 5:s.label++,r=o[1],o=[0];continue;case 7:o=s.ops.pop(),s.trys.pop();continue;default:if(!(a=s.trys,(a=a.length>0&&a[a.length-1])||6!==o[0]&&2!==o[0])){s=0;continue}if(3===o[0]&&(!a||o[1]>a[0]&&o[1]-1){var i=n.substring(0,a)+"."+r,o=document.getElementsByName(i)[0];if(s(o))return o}return t.form.querySelector(l("[name=".concat(r,"]")))}var d=function(){this.required=function(t,e,n){var r=e.type.toLowerCase();if("checkbox"===r||"radio"===r){for(var a=0,i=Array.from(e.form.querySelectorAll(l("[name='".concat(e.name,"'][type='").concat(r,"']"))));aa)return!1}return!0},this.compare=function(t,e,n){if(!n.other)return!0;var r=u(e,n.other);return!r||r.value===t},this.range=function(t,e,n){if(!t)return!0;var r=parseFloat(t);return!isNaN(r)&&(!(n.min&&rparseFloat(n.max)))},this.regex=function(t,e,n){return!t||!n.pattern||new RegExp(n.pattern).test(t)},this.email=function(t,e,n){return!t||/^([^\x00-\x20\x22\x28\x29\x2c\x2e\x3a-\x3c\x3e\x40\x5b-\x5d\x7f-\xff]+|\x22([^\x0d\x22\x5c\x80-\xff]|\x5c[\x00-\x7f])*\x22)(\x2e([^\x00-\x20\x22\x28\x29\x2c\x2e\x3a-\x3c\x3e\x40\x5b-\x5d\x7f-\xff]+|\x22([^\x0d\x22\x5c\x80-\xff]|\x5c[\x00-\x7f])*\x22))*\x40([^\x00-\x20\x22\x28\x29\x2c\x2e\x3a-\x3c\x3e\x40\x5b-\x5d\x7f-\xff]+|\x5b([^\x0d\x5b-\x5d\x80-\xff]|\x5c[\x00-\x7f])*\x5d)(\x2e([^\x00-\x20\x22\x28\x29\x2c\x2e\x3a-\x3c\x3e\x40\x5b-\x5d\x7f-\xff]+|\x5b([^\x0d\x5b-\x5d\x80-\xff]|\x5c[\x00-\x7f])*\x5d))*(\.\w{2,})+$/.test(t)},this.creditcard=function(t,e,n){if(!t)return!0;if(/[^0-9 \-]+/.test(t))return!1;var r,a,i=0,s=0,o=!1;if((t=t.replace(/\D/g,"")).length<13||t.length>19)return!1;for(r=t.length-1;r>=0;r--)a=t.charAt(r),s=parseInt(a,10),o&&(s*=2)>9&&(s-=9),i+=s,o=!o;return i%10==0},this.url=function(t,e,n){if(!t)return!0;var r=t.toLowerCase();return r.indexOf("http://")>-1||r.indexOf("https://")>-1||r.indexOf("ftp://")>-1},this.phone=function(t,e,n){return!t||!/[\+\-\s][\-\s]/g.test(t)&&/^\+?[0-9\-\s]+$/.test(t)},this.remote=function(t,e,n){if(!t)return!0;for(var r=n.additionalfields.split(","),a={},i=0,s=r;i=200&&r.status<300){var a=JSON.parse(r.responseText);t(a)}else e({status:r.status,statusText:r.statusText,data:r.responseText})},r.onerror=function(t){e({status:r.status,statusText:r.statusText,data:r.responseText})}}))}},c=function(){function t(t){var e=this;this.providers={},this.messageFor={},this.elementUIDs=[],this.elementByUID={},this.formInputs={},this.validators={},this.formEvents={},this.inputEvents={},this.summary={},this.debounce=300,this.allowHiddenFields=!1,this.validateForm=function(t,n){if(!(t instanceof HTMLFormElement))throw new Error("validateForm() can only be called on elements");var r=e.getElementUID(t),a=e.formEvents[r];a&&a(void 0,n)},this.validateField=function(t,n){var r=e.getElementUID(t),a=e.inputEvents[r];a&&a(void 0,n)},this.preValidate=function(t){t.preventDefault(),t.stopImmediatePropagation()},this.handleValidated=function(t,n,r){if(!(t instanceof HTMLFormElement))throw new Error("handleValidated() can only be called on elements");n?r&&e.submitValidForm(t,r):e.focusFirstInvalid(t)},this.submitValidForm=function(t,e){if(!(t instanceof HTMLFormElement))throw new Error("submitValidForm() can only be called on elements");var n=new SubmitEvent("submit",e);if(t.dispatchEvent(n)){var r=e.submitter,a=t.action;if(r){var i=r.getAttribute("name");if(i){var s=document.createElement("input");s.type="hidden",s.name=i,s.value=r.getAttribute("value"),t.appendChild(s)}var o=r.getAttribute("formaction");o&&(t.action=o)}try{t.submit()}finally{t.action=a}}},this.focusFirstInvalid=function(t){if(!(t instanceof HTMLFormElement))throw new Error("focusFirstInvalid() can only be called on elements");var n=e.getElementUID(t),r=e.formInputs[n],a=null==r?void 0:r.find((function(t){return e.summary[t]}));if(a){var i=e.elementByUID[a];i instanceof HTMLElement&&i.focus()}},this.isValid=function(t,n,r){if(void 0===n&&(n=!0),!(t instanceof HTMLFormElement))throw new Error("isValid() can only be called on elements");n&&e.validateForm(t,r);var a=e.getElementUID(t),i=e.formInputs[a];return!(!0===(null==i?void 0:i.some((function(t){return e.summary[t]}))))},this.isFieldValid=function(t,n,r){void 0===n&&(n=!0),n&&e.validateField(t,r);var a=e.getElementUID(t);return void 0===e.summary[a]},this.options={root:document.body,watch:!1,addNoValidate:!0},this.ValidationInputCssClassName="input-validation-error",this.ValidationInputValidCssClassName="input-validation-valid",this.ValidationMessageCssClassName="field-validation-error",this.ValidationMessageValidCssClassName="field-validation-valid",this.ValidationSummaryCssClassName="validation-summary-errors",this.ValidationSummaryValidCssClassName="validation-summary-valid",this.logger=t||i}return t.prototype.addProvider=function(t,e){this.providers[t]||(this.logger.log("Registered provider: %s",t),this.providers[t]=e)},t.prototype.addMvcProviders=function(){var t=new d;this.addProvider("required",t.required),this.addProvider("length",t.stringLength),this.addProvider("maxlength",t.stringLength),this.addProvider("minlength",t.stringLength),this.addProvider("equalto",t.compare),this.addProvider("range",t.range),this.addProvider("regex",t.regex),this.addProvider("creditcard",t.creditcard),this.addProvider("email",t.email),this.addProvider("url",t.url),this.addProvider("phone",t.phone),this.addProvider("remote",t.remote)},t.prototype.scanMessages=function(t,e){void 0===e&&(e=!1);for(var n=0,r=Array.from(t.querySelectorAll("span[form]"));n=0?a.splice(i,1):this.logger.log("Validation element for '%s' was already removed",r,e)}},t.prototype.parseDirectives=function(t){for(var e={},n={},r="data-val-".length,a=0;a=0?this.formInputs[n].splice(r,1):this.logger.log("Form input for UID '%s' was already removed",e)}},t.prototype.addInput=function(t){var e=this,n=this.getElementUID(t),r=this.parseDirectives(t.attributes);if(this.validators[n]=this.createValidator(t,r),t.form&&this.trackFormInput(t.form,n),!this.inputEvents[n]){var a=0,i=function(t,r){var i=e.validators[n];clearTimeout(a),a=setTimeout((function(){i().then(r).catch((function(t){e.logger.log("Validation error",t)}))}),e.debounce)},s=t.dataset.valEvent;if(s)t.addEventListener(s,i);else{var o=t instanceof HTMLSelectElement?"change":"input";t.addEventListener(o,i)}this.inputEvents[n]=i}},t.prototype.removeInput=function(t){var e=this.getElementUID(t);delete this.summary[e],delete this.inputEvents[e],delete this.validators[e],t.form&&this.untrackFormInput(t.form,e)},t.prototype.scanInputs=function(t,e){void 0===e&&(e=!1);var n=Array.from(t.querySelectorAll(l('[data-val="true"]')));s(t)&&"true"===t.getAttribute("data-val")&&n.push(t);for(var r=0;r-1)){var a=document.createElement("li");a.innerHTML=this.summary[n],e.appendChild(a),t.push(this.summary[n])}}return e},t.prototype.renderSummary=function(){var t=document.querySelectorAll('[data-valmsg-summary="true"]');if(t.length){var e=JSON.stringify(this.summary,Object.keys(this.summary).sort());if(e!==this.renderedSummaryJSON){this.renderedSummaryJSON=e;for(var n=this.createSummaryDOM(),r=0;r0&&i[i.length-1])||6!==o[0]&&2!==o[0])){s=0;continue}if(3===o[0]&&(!i||o[1]>i[0]&&o[1]-1){var a=n.substring(0,i)+"."+r,o=document.getElementsByName(a)[0];if(s(o))return o}return e.form.querySelector(l("[name=".concat(r,"]")))}var d=function(){this.required=function(e,t,n){var r=t.type.toLowerCase();if("checkbox"===r||"radio"===r){for(var i=0,a=Array.from(t.form.querySelectorAll(l("[name='".concat(t.name,"'][type='").concat(r,"']"))));ii)return!1}return!0},this.compare=function(e,t,n){if(!n.other)return!0;var r=u(t,n.other);return!r||r.value===e},this.range=function(e,t,n){if(!e)return!0;var r=parseFloat(e);return!isNaN(r)&&(!(n.min&&rparseFloat(n.max)))},this.regex=function(e,t,n){return!e||!n.pattern||new RegExp(n.pattern).test(e)},this.email=function(e,t,n){return!e||/^([^\x00-\x20\x22\x28\x29\x2c\x2e\x3a-\x3c\x3e\x40\x5b-\x5d\x7f-\xff]+|\x22([^\x0d\x22\x5c\x80-\xff]|\x5c[\x00-\x7f])*\x22)(\x2e([^\x00-\x20\x22\x28\x29\x2c\x2e\x3a-\x3c\x3e\x40\x5b-\x5d\x7f-\xff]+|\x22([^\x0d\x22\x5c\x80-\xff]|\x5c[\x00-\x7f])*\x22))*\x40([^\x00-\x20\x22\x28\x29\x2c\x2e\x3a-\x3c\x3e\x40\x5b-\x5d\x7f-\xff]+|\x5b([^\x0d\x5b-\x5d\x80-\xff]|\x5c[\x00-\x7f])*\x5d)(\x2e([^\x00-\x20\x22\x28\x29\x2c\x2e\x3a-\x3c\x3e\x40\x5b-\x5d\x7f-\xff]+|\x5b([^\x0d\x5b-\x5d\x80-\xff]|\x5c[\x00-\x7f])*\x5d))*(\.\w{2,})+$/.test(e)},this.creditcard=function(e,t,n){if(!e)return!0;if(/[^0-9 \-]+/.test(e))return!1;var r,i,a=0,s=0,o=!1;if((e=e.replace(/\D/g,"")).length<13||e.length>19)return!1;for(r=e.length-1;r>=0;r--)i=e.charAt(r),s=parseInt(i,10),o&&(s*=2)>9&&(s-=9),a+=s,o=!o;return a%10==0},this.url=function(e,t,n){if(!e)return!0;var r=e.toLowerCase();return r.indexOf("http://")>-1||r.indexOf("https://")>-1||r.indexOf("ftp://")>-1},this.phone=function(e,t,n){return!e||!/[\+\-\s][\-\s]/g.test(e)&&/^\+?[0-9\-\s]+$/.test(e)},this.remote=function(e,t,n){if(!e)return!0;for(var r=n.additionalfields.split(","),i={},a=0,s=r;a=200&&r.status<300){var i=JSON.parse(r.responseText);e(i)}else t({status:r.status,statusText:r.statusText,data:r.responseText})},r.onerror=function(e){t({status:r.status,statusText:r.statusText,data:r.responseText})}}))}},f=function(){function e(e){var t=this;this.providers={},this.messageFor={},this.elementUIDs=[],this.elementByUID={},this.formInputs={},this.validators={},this.formEvents={},this.inputEvents={},this.summary={},this.debounce=300,this.allowHiddenFields=!1,this.validateForm=function(e,n){return r(t,void 0,void 0,(function(){var t,r,a;return i(this,(function(i){switch(i.label){case 0:if(!(e instanceof HTMLFormElement))throw new Error("validateForm() can only be called on elements");return t=this.getElementUID(e),r=this.formEvents[t],(a=!r)?[3,2]:[4,r(void 0,n)];case 1:a=i.sent(),i.label=2;case 2:return[2,a]}}))}))},this.validateField=function(e,n){return r(t,void 0,void 0,(function(){var t,r,a;return i(this,(function(i){switch(i.label){case 0:return t=this.getElementUID(e),r=this.inputEvents[t],(a=!r)?[3,2]:[4,r(void 0,n)];case 1:a=i.sent(),i.label=2;case 2:return[2,a]}}))}))},this.preValidate=function(e){e.preventDefault(),e.stopImmediatePropagation()},this.handleValidated=function(e,n,r){if(!(e instanceof HTMLFormElement))throw new Error("handleValidated() can only be called on elements");n?r&&t.submitValidForm(e,r):t.focusFirstInvalid(e)},this.submitValidForm=function(e,t){if(!(e instanceof HTMLFormElement))throw new Error("submitValidForm() can only be called on elements");var n=new SubmitEvent("submit",t);if(e.dispatchEvent(n)){var r=t.submitter,i=e.action;if(r){var a=r.getAttribute("name");if(a){var s=document.createElement("input");s.type="hidden",s.name=a,s.value=r.getAttribute("value"),e.appendChild(s)}var o=r.getAttribute("formaction");o&&(e.action=o)}try{e.submit()}finally{e.action=i}}},this.focusFirstInvalid=function(e){if(!(e instanceof HTMLFormElement))throw new Error("focusFirstInvalid() can only be called on elements");var n=t.getElementUID(e),r=t.formInputs[n],i=null==r?void 0:r.find((function(e){return t.summary[e]}));if(i){var a=t.elementByUID[i];a instanceof HTMLElement&&a.focus()}},this.isValid=function(e,n,r){if(void 0===n&&(n=!0),!(e instanceof HTMLFormElement))throw new Error("isValid() can only be called on elements");n&&t.validateForm(e,r);var i=t.getElementUID(e),a=t.formInputs[i];return!(!0===(null==a?void 0:a.some((function(e){return t.summary[e]}))))},this.isFieldValid=function(e,n,r){void 0===n&&(n=!0),n&&t.validateField(e,r);var i=t.getElementUID(e);return void 0===t.summary[i]},this.options={root:document.body,watch:!1,addNoValidate:!0},this.ValidationInputCssClassName="input-validation-error",this.ValidationInputValidCssClassName="input-validation-valid",this.ValidationMessageCssClassName="field-validation-error",this.ValidationMessageValidCssClassName="field-validation-valid",this.ValidationSummaryCssClassName="validation-summary-errors",this.ValidationSummaryValidCssClassName="validation-summary-valid",this.logger=e||a}return e.prototype.addProvider=function(e,t){this.providers[e]||(this.logger.log("Registered provider: %s",e),this.providers[e]=t)},e.prototype.addMvcProviders=function(){var e=new d;this.addProvider("required",e.required),this.addProvider("length",e.stringLength),this.addProvider("maxlength",e.stringLength),this.addProvider("minlength",e.stringLength),this.addProvider("equalto",e.compare),this.addProvider("range",e.range),this.addProvider("regex",e.regex),this.addProvider("creditcard",e.creditcard),this.addProvider("email",e.email),this.addProvider("url",e.url),this.addProvider("phone",e.phone),this.addProvider("remote",e.remote)},e.prototype.scanMessages=function(e,t){for(var n=0,r=Array.from(e.querySelectorAll("span[form]"));n=0?a.splice(s,1):this.logger.log("Validation element for '%s' was already removed",name,t)}}}},e.prototype.parseDirectives=function(e){for(var t={},n={},r="data-val-".length,i=0;i=0?(i[r].splice(a,1),i.length||(null===(n=this.formEvents[r])||void 0===n||n.remove(),delete this.formEvents[r],delete this.formInputs[r],delete this.messageFor[r])):this.logger.log("Form input for UID '%s' was already removed",t)}},e.prototype.addInput=function(e){var t=this,n=this.getElementUID(e),a=this.parseDirectives(e.attributes);if(this.validators[n]=this.createValidator(e,a),e.form&&this.trackFormInput(e.form,n),!this.inputEvents[n]){var s=function(e,a){return r(t,void 0,void 0,(function(){var t,r,s;return i(this,(function(i){switch(i.label){case 0:if(!(t=this.validators[n]))return[2,!0];this.logger.log("Validating",{event:e}),i.label=1;case 1:return i.trys.push([1,3,,4]),[4,t()];case 2:return r=i.sent(),a(r),[2,r];case 3:return s=i.sent(),this.logger.log("Validation error",s),[2,!1];case 4:return[2]}}))}))},o=0;s.debounced=function(e,n){clearTimeout(o),o=setTimeout((function(){s(e,n)}),t.debounce)};var l=e.dataset.valEvent||e instanceof HTMLSelectElement?"change":"input";e.addEventListener(l,s.debounced),s.remove=function(){return e.removeEventListener(l,s.debounced)},this.inputEvents[n]=s}},e.prototype.removeInput=function(e){var t=this.getElementUID(e),n=this.inputEvents[t];(null==n?void 0:n.remove)&&(n.remove(),delete n.remove),delete this.summary[t],delete this.inputEvents[t],delete this.validators[t],e.form&&this.untrackFormInput(e.form,t)},e.prototype.scanInputs=function(e,t){var n=Array.from(e.querySelectorAll(l('[data-val="true"]')));s(e)&&"true"===e.getAttribute("data-val")&&n.push(e);for(var r=0;r-1)){var i=document.createElement("li");i.innerHTML=this.summary[n],t.appendChild(i),e.push(this.summary[n])}}return t},e.prototype.renderSummary=function(){var e=document.querySelectorAll('[data-valmsg-summary="true"]');if(e.length){var t=JSON.stringify(this.summary,Object.keys(this.summary).sort());if(t!==this.renderedSummaryJSON){this.renderedSummaryJSON=t;for(var n=this.createSummaryDOM(),r=0;r\n */\nexport interface StringKeyValuePair {\n [key: string]: string\n}\n\n/**\n * A duplex key-value pair for an element, by GUID or its DOM object reference.\n */\ninterface ElementUID {\n node: Element,\n uid: string;\n}\n\n/**\n * A simple logging interface that mirrors the Console object.\n */\nexport interface Logger {\n log(message: string, ...args: any[]): void;\n warn(message: string, ...args: any[]): void;\n}\n\nconst nullLogger = new (class implements Logger {\n log(_: string, ..._args: any[]): void { }\n warn = globalThis.console.warn;\n})();\n\n/**\n * An `HTMLElement` that can be validated (`input`, `select`, `textarea`).\n */\nexport type ValidatableElement = HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement;\n\n/**\n * Checks if `element` is validatable (`input`, `select`, `textarea`).\n * @param element The element to check.\n * @returns `true` if validatable, otherwise `false`.\n */\nexport const isValidatable = (element: Node): element is ValidatableElement =>\n element instanceof HTMLInputElement\n || element instanceof HTMLSelectElement\n || element instanceof HTMLTextAreaElement;\n\nconst validatableElementTypes = ['input', 'select', 'textarea'];\n\n/**\n * Generates a selector to match validatable elements (`input`, `select`, `textarea`).\n * @param selector An optional selector to apply to the valid input types, e.g. `[data-val=\"true\"]`.\n * @returns The validatable elements.\n */\nconst validatableSelector = (selector?: string) =>\n validatableElementTypes.map(t => `${t}${selector || ''}`).join(',');\n\n/**\n * Parameters passed into validation providers from the element attributes.\n * error property is read from data-val-[Provider Name] attribute.\n * params property is populated from data-val-[Provider Name]-[Parameter Name] attributes.\n */\nexport interface ValidationDirectiveBindings {\n error: string,\n params: StringKeyValuePair\n}\n\n/**\n * A key-value pair describing what validations to enforce to an input element, with respective parameters.\n */\nexport type ValidationDirective = {\n [key: string]: ValidationDirectiveBindings\n};\n\n/**\n * Validation plugin signature with multitype return.\n * Boolean return signifies the validation result, which uses the default validation error message read from the element attribute.\n * String return signifies failed validation, which then will be used as the validation error message.\n * Promise return signifies asynchronous plugin behavior, with same behavior as Boolean or String.\n */\nexport type ValidationProvider = (value: string, element: ValidatableElement, params: StringKeyValuePair) => boolean | string | Promise;\n\n/**\n * Callback to receive the result of validating a form.\n */\nexport type ValidatedCallback = (success: boolean) => void;\n\n/**\n * A callback method signature that kickstarts a new validation task for an input element, as a Boolean Promise.\n */\ntype Validator = () => Promise;\n\n/**\n * Resolves and returns the element referred by original element using ASP.NET selector logic.\n * @param element - The input to validate\n * @param selector - Used to find the field. Ex. *.Password where * replaces whatever prefixes asp.net might add.\n */\nfunction getRelativeFormElement(element: ValidatableElement, selector: string): ValidatableElement {\n // example elementName: Form.PasswordConfirm, Form.Email\n // example selector (dafuq): *.Password, *.__RequestVerificationToken\n // example result element name: Form.Password, __RequestVerificationToken\n\n let elementName = element.name;\n let selectedName = selector.substring(2); // Password, __RequestVerificationToken\n let objectName = '';\n\n let dotLocation = elementName.lastIndexOf('.');\n if (dotLocation > -1) {\n // Form\n objectName = elementName.substring(0, dotLocation);\n\n // Form.Password\n const relativeElementName = objectName + '.' + selectedName;\n const relativeElement = document.getElementsByName(relativeElementName)[0];\n if (isValidatable(relativeElement)) {\n return relativeElement;\n }\n }\n\n // __RequestVerificationToken\n return element.form.querySelector(validatableSelector(`[name=${selectedName}]`));\n}\n\n/**\n * Contains default implementations for ASP.NET Core MVC validation attributes.\n */\nexport class MvcValidationProviders {\n /**\n * Validates whether the input has a value.\n */\n required: ValidationProvider = (value, element, params) => {\n // Handle single and multiple checkboxes/radio buttons.\n const elementType = element.type.toLowerCase();\n if (elementType === \"checkbox\" || elementType === \"radio\") {\n const allElementsOfThisName = Array.from(element.form.querySelectorAll(validatableSelector(`[name='${element.name}'][type='${elementType}']`)));\n for (let element of allElementsOfThisName) {\n if (element instanceof HTMLInputElement && element.checked === true) {\n return true;\n }\n }\n\n // Checkboxes do not submit a value when unchecked. To work around this, platforms such as ASP.NET render a\n // hidden input with the same name as the checkbox so that a value (\"false\") is still submitted even when\n // the checkbox is not checked. We check this special case here.\n if (elementType === \"checkbox\") {\n const checkboxHiddenInput = element.form.querySelector(`input[name='${element.name}'][type='hidden']`);\n if (checkboxHiddenInput instanceof HTMLInputElement && checkboxHiddenInput.value === \"false\") {\n return true;\n }\n }\n\n return false;\n }\n // Default behavior otherwise.\n return Boolean(value);\n }\n\n /**\n * Validates whether the input value satisfies the length contstraint.\n */\n stringLength: ValidationProvider = (value, element, params) => {\n if (!value) {\n return true;\n }\n\n if (params.min) {\n let min = parseInt(params.min);\n if (value.length < min) {\n return false;\n }\n }\n\n if (params.max) {\n let max = parseInt(params.max);\n if (value.length > max) {\n return false;\n }\n }\n\n return true;\n }\n\n /**\n * Validates whether the input value is equal to another input value.\n */\n compare: ValidationProvider = (value, element, params) => {\n if (!params.other) {\n return true;\n }\n\n let otherElement = getRelativeFormElement(element, params.other);\n if (!otherElement) {\n return true;\n }\n\n return (otherElement.value === value);\n }\n\n /**\n * Validates whether the input value is a number within a given range.\n */\n range: ValidationProvider = (value, element, params) => {\n if (!value) {\n return true;\n }\n\n let val = parseFloat(value);\n if (isNaN(val)) {\n return false;\n }\n\n if (params.min) {\n let min = parseFloat(params.min);\n if (val < min) {\n return false;\n }\n }\n\n if (params.max) {\n let max = parseFloat(params.max);\n if (val > max) {\n return false;\n }\n }\n\n return true;\n }\n\n /**\n * Validates whether the input value satisfies a regular expression pattern.\n */\n regex: ValidationProvider = (value, element, params) => {\n if (!value || !params.pattern) {\n return true;\n }\n\n let r = new RegExp(params.pattern);\n return r.test(value);\n }\n\n /**\n * Validates whether the input value is an email in accordance to RFC822 specification, with a top level domain.\n */\n email: ValidationProvider = (value, element, params) => {\n if (!value) {\n return true;\n }\n\n // RFC822 email address with .TLD validation\n // (c) Richard Willis, Chris Ferdinandi, MIT Licensed\n // https://gist.github.com/badsyntax/719800\n // https://gist.github.com/cferdinandi/d04aad4ce064b8da3edf21e26f8944c4\n\n let r = /^([^\\x00-\\x20\\x22\\x28\\x29\\x2c\\x2e\\x3a-\\x3c\\x3e\\x40\\x5b-\\x5d\\x7f-\\xff]+|\\x22([^\\x0d\\x22\\x5c\\x80-\\xff]|\\x5c[\\x00-\\x7f])*\\x22)(\\x2e([^\\x00-\\x20\\x22\\x28\\x29\\x2c\\x2e\\x3a-\\x3c\\x3e\\x40\\x5b-\\x5d\\x7f-\\xff]+|\\x22([^\\x0d\\x22\\x5c\\x80-\\xff]|\\x5c[\\x00-\\x7f])*\\x22))*\\x40([^\\x00-\\x20\\x22\\x28\\x29\\x2c\\x2e\\x3a-\\x3c\\x3e\\x40\\x5b-\\x5d\\x7f-\\xff]+|\\x5b([^\\x0d\\x5b-\\x5d\\x80-\\xff]|\\x5c[\\x00-\\x7f])*\\x5d)(\\x2e([^\\x00-\\x20\\x22\\x28\\x29\\x2c\\x2e\\x3a-\\x3c\\x3e\\x40\\x5b-\\x5d\\x7f-\\xff]+|\\x5b([^\\x0d\\x5b-\\x5d\\x80-\\xff]|\\x5c[\\x00-\\x7f])*\\x5d))*(\\.\\w{2,})+$/;\n return r.test(value);\n }\n\n /**\n * Validates whether the input value is a credit card number, with Luhn's Algorithm.\n */\n creditcard: ValidationProvider = (value, element, params) => {\n if (!value) {\n return true;\n }\n\n // (c) jquery-validation, MIT Licensed\n // https://github.com/jquery-validation/jquery-validation/blob/master/src/additional/creditcard.js\n // based on https://en.wikipedia.org/wiki/Luhn_algorithm\n\n // Accept only spaces, digits and dashes\n if (/[^0-9 \\-]+/.test(value)) {\n return false;\n }\n\n var nCheck = 0,\n nDigit = 0,\n bEven = false,\n n, cDigit;\n\n value = value.replace(/\\D/g, \"\");\n\n // Basing min and max length on https://developer.ean.com/general_info/Valid_Credit_Card_Types\n if (value.length < 13 || value.length > 19) {\n return false;\n }\n\n for (n = value.length - 1; n >= 0; n--) {\n cDigit = value.charAt(n);\n nDigit = parseInt(cDigit, 10);\n if (bEven) {\n if ((nDigit *= 2) > 9) {\n nDigit -= 9;\n }\n }\n\n nCheck += nDigit;\n bEven = !bEven;\n }\n\n return (nCheck % 10) === 0;\n }\n\n /**\n * Validates whether the input value is a URL.\n */\n url: ValidationProvider = (value, element, params) => {\n if (!value) {\n return true;\n }\n\n let lowerCaseValue = value.toLowerCase();\n\n // Match the logic in `UrlAttribute`\n return lowerCaseValue.indexOf('http://') > -1\n || lowerCaseValue.indexOf('https://') > -1\n || lowerCaseValue.indexOf('ftp://') > -1;\n }\n\n /**\n * Validates whether the input value is a phone number.\n */\n phone: ValidationProvider = (value, element, params) => {\n if (!value) {\n return true;\n }\n\n // Allows whitespace or dash as number separator because some people like to do that...\n let consecutiveSeparator = /[\\+\\-\\s][\\-\\s]/g;\n if (consecutiveSeparator.test(value)) {\n return false;\n }\n\n let r = /^\\+?[0-9\\-\\s]+$/;\n return r.test(value);\n }\n\n /**\n * Asynchronously validates the input value to a JSON GET API endpoint.\n */\n remote: ValidationProvider = (value, element, params) => {\n if (!value) {\n return true;\n }\n\n // params.additionalfields: *.Email,*.Username\n let fieldSelectors: string[] = (params.additionalfields as string).split(',');\n let fields: StringKeyValuePair = {};\n\n for (let fieldSelector of fieldSelectors) {\n let fieldName = fieldSelector.substr(2);\n let fieldElement = getRelativeFormElement(element, fieldSelector);\n\n let hasValue = Boolean(fieldElement && fieldElement.value);\n if (!hasValue) {\n continue;\n }\n\n if (fieldElement instanceof HTMLInputElement &&\n (fieldElement.type === 'checkbox' || fieldElement.type === 'radio')) {\n fields[fieldName] = fieldElement.checked ? fieldElement.value : '';\n } else {\n fields[fieldName] = fieldElement.value;\n }\n }\n\n let url: string = params['url'];\n\n let encodedParams: string[] = [];\n for (let fieldName in fields) {\n let encodedParam = encodeURIComponent(fieldName) + '=' + encodeURIComponent(fields[fieldName]);\n encodedParams.push(encodedParam);\n }\n let payload = encodedParams.join('&');\n\n return new Promise((ok, reject) => {\n let request = new XMLHttpRequest();\n\n if (params.type && params.type.toLowerCase() === 'post') {\n let postData = new FormData();\n for (let fieldName in fields) {\n postData.append(fieldName, fields[fieldName]);\n }\n request.open('post', url);\n request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');\n request.send(payload);\n } else {\n request.open('get', url + '?' + payload);\n request.send();\n }\n\n request.onload = e => {\n if (request.status >= 200 && request.status < 300) {\n let data = JSON.parse(request.responseText);\n ok(data);\n } else {\n reject({\n status: request.status,\n statusText: request.statusText,\n data: request.responseText\n });\n }\n };\n\n request.onerror = e => {\n reject({\n status: request.status,\n statusText: request.statusText,\n data: request.responseText\n });\n };\n });\n }\n}\n\n/**\n * Configuration for @type {ValidationService}.\n */\nexport interface ValidationServiceOptions {\n watch: boolean;\n root: ParentNode;\n addNoValidate: boolean;\n}\n\n/**\n * Responsible for managing the DOM elements and running the validation providers.\n */\nexport class ValidationService {\n /**\n * A key-value collection of loaded validation plugins.\n */\n private providers: { [name: string]: ValidationProvider } = {};\n\n /**\n * A key-value collection of elements for displaying validation messages for an input (by DOM ID).\n */\n private messageFor: { [id: string]: Element[] } = {};\n\n /**\n * A list of managed elements, each having a randomly assigned unique identifier (UID).\n */\n private elementUIDs: ElementUID[] = [];\n\n /**\n * A key-value collection of UID to Element for quick lookup.\n */\n private elementByUID: { [uid: string]: Element } = {};\n\n /**\n * A key-value collection of input UIDs for a UID.\n */\n private formInputs: { [formUID: string]: string[] } = {};\n\n /**\n * A key-value map for input UID to its validator factory.\n */\n private validators: { [inputUID: string]: Validator } = {};\n\n /**\n * A key-value map for form UID to its trigger element (submit event for ).\n */\n private formEvents: { [id: string]: (e?: SubmitEvent, callback?: ValidatedCallback) => void } = {};\n\n /**\n * A key-value map for element UID to its trigger element (input event for