UNPKG

valy

Version:

Intuitive frontend form validation

2 lines 10.8 kB
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define("Valy",[],t):"object"==typeof exports?exports.Valy=t():e.Valy=t()}(this,function(){return function(e){function t(n){if(r[n])return r[n].exports;var a=r[n]={exports:{},id:n,loaded:!1};return e[n].call(a.exports,a,a.exports,t),a.loaded=!0,a.exports}var r={};return t.m=e,t.c=r,t.p="",t(0)}([function(e,t,r){"use strict";function n(e){return e&&e.__esModule?e:{"default":e}}function a(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var o=function(){function e(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}return function(t,r,n){return r&&e(t.prototype,r),n&&e(t,n),t}}();r(1);var i=r(2),l=n(i),u=r(3),s=n(u),c=["text","password","color","date","datetime","datetime","email","month","number","range","search","tel","time","url","week"],d=function(){function e(t){var r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};a(this,e),t&&(this.formElement=t,this.settings=r,this.init())}return o(e,[{key:"init",value:function(){this.formElement.setAttribute("novalidate",!0),this.bind()}},{key:"bind",value:function(){var e=this;this.formElement.addEventListener("submit",function(t){return e.handleSubmit(t)}),l["default"].collectFormElements(this.formElement).forEach(function(t){t.addEventListener(c.includes(t.type.toLowerCase())?"input":"change",function(t){return e.handleElementChange(t)})})}},{key:"handleSubmit",value:function(t){e.validateForm(this.formElement).valid||t.preventDefault()}},{key:"handleElementChange",value:function(t){e.validateElement(t.target),"radio"===t.target.type.toLowerCase()&&l["default"].getRadioSiblings(t.target).forEach(function(r){r!==t.target&&e.validateElement(r)})}}],[{key:"validateForm",value:function(t){var r=l["default"].collectFormElements(t).map(function(t){return{element:t,validation:e.validateElement(t)}}).filter(function(e){return e.validation.errors.length}),n=!r.length;return n?e.setFormValid(t):e.setFormInvalid(t,r),{valid:n,errors:r}}},{key:"validateElement",value:function(t){var r=l["default"].determineValidationType(t),n=l["default"].getValidationRules(t),a={valid:!0,errors:[]};switch(r){case"file":a=l["default"].validateFile(t,n);break;case"checkbox":a=l["default"].validateCheckbox(t,n);break;case"radio":a=l["default"].validateRadio(t,n);break;case"select":a=l["default"].validateSelect(t,n);break;case"field":a=l["default"].validateField(t,n);break;default:console.error("ValyJS: Can't validate \""+(t.name||t.type)+'" element!')}return a.valid?e.setElementValid(t):e.setElementInvalid(t,a.errors),a}},{key:"setElementValid",value:function(e){s["default"].setElementValid(e)}},{key:"setElementInvalid",value:function(e,t){s["default"].setElementInvalid(e,t)}},{key:"setFormValid",value:function(e){s["default"].setFormValid(e)}},{key:"setFormInvalid",value:function(e,t){s["default"].setFormInvalid(e,t)}}]),e}();t["default"]=d,e.exports=t["default"]},function(e,t){"use strict";"closest"in Element.prototype||(Element.prototype.closest=function(e){for(var t=Array.from(document.querySelectorAll(e)),r=this;r&&!t.includes(r);)r=r.parentNode;return r}),"remove"in Element.prototype||(Element.prototype.remove=function(){this.parentNode&&this.parentNode.removeChild(this)})},function(e,t){"use strict";function r(e){if(Array.isArray(e)){for(var t=0,r=Array(e.length);t<e.length;t++)r[t]=e[t];return r}return Array.from(e)}function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var a=function(){function e(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}return function(t,r,n){return r&&e(t.prototype,r),n&&e(t,n),t}}(),o=["text","password","color","date","datetime","datetime","email","month","number","range","search","tel","time","url","week","file"],i=["button","keygen","output"],l=["submit","reset","button","datetime-local","hidden"],u=/^(([^<>()\[\]\.,;:\s@\"]+(\.[^<>()\[\]\.,;:\s@\"]+)*)|(\".+\"))@(([^<>()[\]\.,;:\s@\"]+\.)+[^<>()[\]\.,;:\s@\"]{2,})$/i,s="data-valy-rules",c=function(){function e(){n(this,e)}return a(e,null,[{key:"getRegExpFromString",value:function(e){return new RegExp(e.match(/^\/(.+)\/(\w*)$/)[1],e.match(/^\/(.+)\/(\w*)$/)[2])}},{key:"getRadioSiblings",value:function(e){return Array.from((e.form||document).querySelectorAll('[name="'+e.name+'"]'))}},{key:"determineValidationType",value:function(e){var t=e.nodeName.toLowerCase(),r=e.type.toLowerCase();switch(!0){case"textarea"===t:case"input"===t&&o.includes(r):return"field";case"input"===t&&"checkbox"===r:return"checkbox";case"input"===t&&"radio"===r:return"radio";case"select"===t:return"select";default:return null}}},{key:"collectFormElements",value:function(e){return Array.from(e.elements).filter(function(e){var t=e.nodeName.toLowerCase(),r=e.type.toLowerCase();return!(i.includes(t)||"input"===t&&l.includes(r))})}},{key:"getCustomValidationRules",value:function(t){var r=[];return t.getAttribute(s).replace(/\\\//g,"@@escapedRegexSlash@@").replace(/\/.*?\/\w*/g,function(e){return r.push(e),"@@escapedRegex"+(r.length-1)+"@@"}).split(/;\s?/).filter(function(e){return!!e}).map(function(t){var n=t.split("(")[0],a=t.replace(n,"").replace(/\(|\)/g,"").split(/,\s?/).filter(function(e){return""!==e}).map(function(t){return isNaN(t)?t.match(/@@escapedRegex(\d+)@@/)?e.getRegExpFromString(t.replace(/@@escapedRegex(\d+)@@/,function(e,t){return r[t-0].replace(/@@escapedRegexSlash@@/g,"\\/")})):t:Number(t)});return{key:n,options:a}})}},{key:"getValidationRules",value:function(t){var n=[];return t.required&&n.push({key:"required",options:[]}),t.pattern&&n.push({key:"pattern",options:new RegExp(t.pattern)}),t.type&&"email"===t.type&&n.push({key:"email"}),t.getAttribute(s)&&n.push.apply(n,r(e.getCustomValidationRules(t))),n}},{key:"validateFile",value:function(e,t){var r=!0,n=[];return t.forEach(function(t){switch(t.key){case"required":e.value||(r=!1,n.push("required"))}}),{valid:r,errors:n}}},{key:"validateCheckbox",value:function(e,t){var r=!0,n=[];return t.forEach(function(t){switch(t.key){case"required":e.checked||(r=!1,n.push("required"));break;case"unchecked":e.checked&&(r=!1,n.push("unchecked"))}}),{valid:r,errors:n}}},{key:"validateRadio",value:function(t,r){var n=!0,a=[],o=e.getRadioSiblings(t);return r.forEach(function(e){switch(e.key){case"required":var r=!1;o.forEach(function(e){e.checked&&(r=!0)}),r||(n=!1,a.push("required"));break;case"selected":t.checked||(n=!1,a.push("selected"));break;case"unselected":t.checked&&(n=!1,a.push("unselected"))}}),{valid:n,errors:a}}},{key:"validateSelect",value:function(e,t){var r=!0,n=[];return t.forEach(function(t){switch(t.key){case"required":""===e.value&&(r=!1,n.push("required"));break;case"exact":e.value!==t.options[0]&&(r=!1,n.push("exact"));break;case"selectedCount":var a=Array.from(e.options).filter(function(e){return e.selected}).length;(a<t.options[0]||a>t.options[1])&&(r=!1,n.push("selectedCount"))}}),{valid:r,errors:n}}},{key:"validateField",value:function(e,t){var r=!0,n=e.value,a=[];return t.forEach(function(e){switch(e.key){case"required":""===n&&(r=!1,a.push("required"));break;case"pattern":""===n||(e.options[0]||e.options).test(n)||(r=!1,a.push("pattern"));break;case"email":""===n||n.match(u)||(r=!1,a.push("email"));break;case"presence":(n.length<(e.options.length?e.options[0]:1)||n.length>e.options[1])&&(r=!1,a.push("presence"));break;case"exact":n!==e.options[0]&&(r=!1,a.push("exact"));break;case"number":(isNaN(n)||Number(n)<e.options[0]||Number(n)>e.options[1])&&(r=!1,a.push("number"));break;case"matchField":document.querySelector(e.options[0])&&n!==document.querySelector(e.options[0]).value&&(r=!1,a.push("matchField"))}}),{valid:r,errors:a}}}]),e}();t["default"]=c,e.exports=t["default"]},function(e,t){"use strict";function r(e){if(Array.isArray(e)){for(var t=0,r=Array(e.length);t<e.length;t++)r[t]=e[t];return r}return Array.from(e)}function n(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(t,"__esModule",{value:!0});var a=function(){function e(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}return function(t,r,n){return r&&e(t.prototype,r),n&&e(t,n),t}}(),o="data-valy-class-holder",i="data-valy-message-container",l="data-valy-error-",u="valy-invalid",s="valy-valid",c="valy-error-message",d="valy-form-invalid",f="valy-form-valid",m=function(){function e(){n(this,e)}return a(e,null,[{key:"getHTMLClassHolder",value:function(e){return e.closest(e.getAttribute(o))||e}},{key:"getMessageContainer",value:function(e){var t=e.getAttribute(i),r=null,n=e;if(!t)return null;for(;n&&!r;)r=n.querySelector(t),n=n.parentNode;return r}},{key:"getErrorMessageByType",value:function(e,t){return e.getAttribute(l+t)}},{key:"setElementValid",value:function(t){var r=e.getHTMLClassHolder(t);t.setCustomValidity(""),r.classList.add(s),r.classList.remove(u),e.clearElementErrorMessages(t)}},{key:"setElementInvalid",value:function(t,r){var n=e.getHTMLClassHolder(t);t.setCustomValidity(r.join(", ")),n.classList.add(u),n.classList.remove(s),e.setElementErrorMessages(t,r)}},{key:"setFormValid",value:function(t){t.classList.add(f),t.classList.remove(d),e.clearElementErrorMessages(t)}},{key:"setFormInvalid",value:function(t,r){t.classList.add(d),t.classList.remove(f),e.setFormErrorMessages(t,r)}},{key:"clearElementErrorMessages",value:function(t){var r=e.getMessageContainer(t);r&&r.querySelectorAll("."+c).forEach(function(e){return e.remove()})}},{key:"setElementErrorMessages",value:function(t,n){var a=e.getMessageContainer(t);a&&!function(){var o=document.createDocumentFragment();[].concat(r(new Set(n))).forEach(function(r){var n=e.getErrorMessageByType(t,r);if(n){var a=document.createElement("span");a.textContent=n,a.classList.add(c),o.appendChild(a)}}),e.clearElementErrorMessages(t),a.appendChild(o)}()}},{key:"setFormErrorMessages",value:function(t,n){var a=e.getMessageContainer(t);a&&!function(){var o=document.createDocumentFragment();n.forEach(function(t){[].concat(r(new Set(t.validation.errors))).forEach(function(r){var n=e.getErrorMessageByType(t.element,r);if(n){var a=document.createElement("span");a.textContent=n,a.classList.add(c),o.appendChild(a)}})}),e.clearElementErrorMessages(t),a.appendChild(o)}()}}]),e}();t["default"]=m,e.exports=t["default"]}])}); //# sourceMappingURL=valy.min.js.map