diff --git a/README.md b/README.md index 5b17a63..d778c40 100644 --- a/README.md +++ b/README.md @@ -130,19 +130,20 @@ simply chain your rules with pipes `|'. Additional arguments can be passed to validation rules by using parenthesis after the rule name: ``` -validation="required(My Label)|confirmed(Password Field, confirmation_field)" +validation="required|confirmed(confirmation_field)" ``` -By convention the first argument is an alternate label for use in error messages. -This is still a fresh project, so pull requests for more built-in rules are -appreciated! +The field label used in built in validation methods is the `validationLabel` +attribute on your `formulate-element`. If no `validationLabel` is found then +the `label` attribute is used, and if no `label` attribute is found it will +fall back to the field’s `name` attribute (which is required). #### Custom Validation Rules Validation rules are easy to write! They're just simple functions that are always passed at least one argument, an object containing the `field` name, -`value` of the field, `error` function to generate an error message, and all the -`values` of the entire form. +`value` of the field, validation `label`, `error` function to generate an error +message, and an object containing all the `values` for the entire form. Additionally, validation rules can pass an unlimited number of extra arguments. These arguments are passed as the 2nd-nth arguments to the validation rule. @@ -151,10 +152,10 @@ attribute on the `formulate-element`. ```html ``` @@ -167,8 +168,8 @@ of rule functions in the plugin’s installation call: ```js Vue.use(formulate, { rules: { - isPizza ({field, value, error, values}, label) { - return value === 'pizza' ? false : `That is not pizza.` + isPizza ({field, value, error, values, label}) { + return value === 'pizza' ? false : `label is not pizza.` } } }) diff --git a/dist/index.js b/dist/index.js index 91f73c6..5de4b4c 100644 --- a/dist/index.js +++ b/dist/index.js @@ -1 +1 @@ -!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define("vue-formulate",[],e):"object"==typeof exports?exports["vue-formulate"]=e():t["vue-formulate"]=e()}("undefined"!=typeof self?self:this,function(){return function(t){function e(n){if(r[n])return r[n].exports;var o=r[n]={i:n,l:!1,exports:{}};return t[n].call(o.exports,o,o.exports,e),o.l=!0,o.exports}var r={};return e.m=t,e.c=r,e.d=function(t,r,n){e.o(t,r)||Object.defineProperty(t,r,{configurable:!1,enumerable:!0,get:n})},e.n=function(t){var r=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(r,"a",r),r},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=7)}([function(t,e,r){"use strict";function n(){d=!1}function o(t){if(!t)return void(c!==h&&(c=h,n()));if(t!==c){if(t.length!==h.length)throw new Error("Custom alphabet for shortid must be "+h.length+" unique characters. You submitted "+t.length+" characters: "+t);var e=t.split("").filter(function(t,e,r){return e!==r.lastIndexOf(t)});if(e.length)throw new Error("Custom alphabet for shortid must be "+h.length+" unique characters. These characters were not unique: "+e.join(", "));c=t,n()}}function i(t){return o(t),c}function a(t){p.seed(t),f!==t&&(n(),f=t)}function u(){c||o(h);for(var t,e=c.split(""),r=[],n=p.nextValue();e.length>0;)n=p.nextValue(),t=Math.floor(n*e.length),r.push(e.splice(t,1)[0]);return r.join("")}function s(){return d||(d=u())}function l(t){return s()[t]}var c,f,d,p=r(16),h="0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ_-";t.exports={characters:i,seed:a,lookup:l,shuffled:s}},function(t,e,r){t.exports=r(8)},function(t,e,r){"use strict";function n(t,e){var r=t.length;if(r!==e.length)return!1;for(var n=0;n1&&(t=[])}return t},module:function(){return this.form.$props.module},formName:function(){return this.form.$props.name},classes:function(){return{"formulate-element":!0,"formulate-element--has-value":!!this.value,"formulate-element--has-errors":this.localAndValidationErrors.length&&this.shouldShowErrors}},validationErrors:function(){return this.form.validationErrors[this.name]||[]},storeErrors:function(){return this.form.errors[this.name]||[]},localAndValidationErrors:function(){return this.errors.concat(this.validationErrors)},shouldShowErrors:function(){var t=this.form.shouldShowErrors;return"blur"===this.form.behavior&&(t=this.errorBlurState),!1!==this.showErrors&&!0!==this.showErrors||(t=this.showErrors),t},attributes:function(){var t=this;return["min","max","placeholder","id","multiple"].filter(function(e){return!1!==t[e]}).reduce(function(e,r){return e[r]=t[r],e},{})},optionList:function(){return Array.isArray(this.options)?Array.isArray(this.options)&&!this.options.length?[{value:this.name,label:this.label||this.name,id:a.default.generate()}]:this.options:(0,o.reduce)(this.options,function(t,e,r){return t.concat({value:e,label:r,id:a.default.generate()})},[])},val:{set:function(t){this.form.update({field:this.name,value:t}),this.isTextInput&&(this.$refs.input.value=t)},get:function(){return this.value}}},watch:{localAndValidationErrors:function(){(0,o.equals)(this.localAndValidationErrors,this.storeErrors)||this.form.updateFieldErrors({field:this.name,errors:this.localAndValidationErrors})}},created:function(){!1!==this.initial&&this.form.hydrate(n({},this.name,this.initial))}}},function(t,e,r){"use strict";function n(t,e){for(var r,n=0,i="";!r;)i+=t(e>>4*n&15|o()),r=e1&&void 0!==arguments[1]?arguments[1]:{};t.prototype.$formulate=this,e=Object.assign(this.defaultOptions,e),e.registerComponents&&(t.component(e.tags.Formulate,p.default),t.component(e.tags.FormulateElement,v.default)),e.errors&&(this.errors=Object.assign(this.errors,e.errors)),e.rules&&(this.rules=Object.assign(this.rules,e.rules)),this.options=e}},{key:"parseRules",value:function(t){return t.split("|").map(function(t){return t.trim()}).map(function(t){return t.match(/([a-zA-Z0-9]+)\((.*)?\)/)||[null,t,""]}).map(function(t){var e=l(t,3),r=(e[0],e[1]),n=e[2];return Object.assign({},{rule:r},n?{args:n.split(",").map(function(t){return t.trim()})}:{args:[]})})}},{key:"errorFactory",value:function(t){return this.errors[t]?this.errors[t]:this.errors.default}},{key:"fields",value:function(t){var e=this,r=[],n=!1;return t&&t.componentOptions&&t.componentOptions.children&&t.componentOptions.children.length?n=t.componentOptions.children:t&&t.children&&t.children.length&&(n=t.children),n&&(r=r.concat(n.reduce(function(t,r){return r.componentOptions&&r.componentOptions.tag===e.options.tags.FormulateElement&&t.push(r.componentOptions.propsData),t.concat(e.fields(r))},[]))),r}},{key:"validationErrors",value:function(){function t(t,r,n){return e.apply(this,arguments)}var e=i(s.default.mark(function t(e,r,n){var i=e.field,a=e.value,u=this;return s.default.wrap(function(t){for(;;)switch(t.prev=t.next){case 0:return t.abrupt("return",!!r&&Promise.all(this.parseRules(r).map(function(t){var e,r=t.rule,s=t.args;return(e=u.rules)[r].apply(e,[{field:i,value:a,error:u.errorFactory(r),values:n}].concat(o(s)))})).then(function(t){return t.reduce(function(t,e){return e?Array.isArray(t)?t.concat(e):[e]:t},!1)}));case 1:case"end":return t.stop()}},t,this)}));return t}()}]),t}(),w=new x;e.default=w;e.mapModels=function(t){var e={};for(var r in t)!function(r){var n=t[r].split("/"),o=l(n,2),i=o[0],a=o[1];e[r]={set:function(t){var e=w.options.vuexModule?w.options.vuexModule+"/":"";this.$store.commit(e+"setFieldValue",{form:i,field:a,value:t})},get:function(){var t=w.options.vuexModule?w.options.vuexModule+"/":"";return this.$store.getters[t+"formValues"][i]?this.$store.getters[t+"formValues"][i][a]:""}}}(r);return e}},function(t,e,r){var n=function(){return this}()||Function("return this")(),o=n.regeneratorRuntime&&Object.getOwnPropertyNames(n).indexOf("regeneratorRuntime")>=0,i=o&&n.regeneratorRuntime;if(n.regeneratorRuntime=void 0,t.exports=r(9),o)n.regeneratorRuntime=i;else try{delete n.regeneratorRuntime}catch(t){n.regeneratorRuntime=void 0}},function(t,e){!function(e){"use strict";function r(t,e,r,n){var i=e&&e.prototype instanceof o?e:o,a=Object.create(i.prototype),u=new p(n||[]);return a._invoke=l(t,r,u),a}function n(t,e,r){try{return{type:"normal",arg:t.call(e,r)}}catch(t){return{type:"throw",arg:t}}}function o(){}function i(){}function a(){}function u(t){["next","throw","return"].forEach(function(e){t[e]=function(t){return this._invoke(e,t)}})}function s(t){function e(r,o,i,a){var u=n(t[r],t,o);if("throw"!==u.type){var s=u.arg,l=s.value;return l&&"object"==typeof l&&g.call(l,"__await")?Promise.resolve(l.__await).then(function(t){e("next",t,i,a)},function(t){e("throw",t,i,a)}):Promise.resolve(l).then(function(t){s.value=t,i(s)},a)}a(u.arg)}function r(t,r){function n(){return new Promise(function(n,o){e(t,r,n,o)})}return o=o?o.then(n,n):n()}var o;this._invoke=r}function l(t,e,r){var o=j;return function(i,a){if(o===S)throw new Error("Generator is already running");if(o===P){if("throw"===i)throw a;return v()}for(r.method=i,r.arg=a;;){var u=r.delegate;if(u){var s=c(u,r);if(s){if(s===F)continue;return s}}if("next"===r.method)r.sent=r._sent=r.arg;else if("throw"===r.method){if(o===j)throw o=P,r.arg;r.dispatchException(r.arg)}else"return"===r.method&&r.abrupt("return",r.arg);o=S;var l=n(t,e,r);if("normal"===l.type){if(o=r.done?P:k,l.arg===F)continue;return{value:l.arg,done:r.done}}"throw"===l.type&&(o=P,r.method="throw",r.arg=l.arg)}}}function c(t,e){var r=t.iterator[e.method];if(r===m){if(e.delegate=null,"throw"===e.method){if(t.iterator.return&&(e.method="return",e.arg=m,c(t,e),"throw"===e.method))return F;e.method="throw",e.arg=new TypeError("The iterator does not provide a 'throw' method")}return F}var o=n(r,t.iterator,e.arg);if("throw"===o.type)return e.method="throw",e.arg=o.arg,e.delegate=null,F;var i=o.arg;return i?i.done?(e[t.resultName]=i.value,e.next=t.nextLoc,"return"!==e.method&&(e.method="next",e.arg=m),e.delegate=null,F):i:(e.method="throw",e.arg=new TypeError("iterator result is not an object"),e.delegate=null,F)}function f(t){var e={tryLoc:t[0]};1 in t&&(e.catchLoc=t[1]),2 in t&&(e.finallyLoc=t[2],e.afterLoc=t[3]),this.tryEntries.push(e)}function d(t){var e=t.completion||{};e.type="normal",delete e.arg,t.completion=e}function p(t){this.tryEntries=[{tryLoc:"root"}],t.forEach(f,this),this.reset(!0)}function h(t){if(t){var e=t[x];if(e)return e.call(t);if("function"==typeof t.next)return t;if(!isNaN(t.length)){var r=-1,n=function e(){for(;++r=0;--n){var o=this.tryEntries[n],i=o.completion;if("root"===o.tryLoc)return e("end");if(o.tryLoc<=this.prev){var a=g.call(o,"catchLoc"),u=g.call(o,"finallyLoc");if(a&&u){if(this.prev=0;--r){var n=this.tryEntries[r];if(n.tryLoc<=this.prev&&g.call(n,"finallyLoc")&&this.prev=0;--e){var r=this.tryEntries[e];if(r.finallyLoc===t)return this.complete(r.completion,r.afterLoc),d(r),F}},catch:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.tryLoc===t){var n=r.completion;if("throw"===n.type){var o=n.arg;d(r)}return o}}throw new Error("illegal catch attempt")},delegateYield:function(t,e,r){return this.delegate={iterator:h(t),resultName:e,nextLoc:r},"next"===this.method&&(this.arg=m),F}}}(function(){return this}()||Function("return this")())},function(t,e,r){"use strict";function n(t,e,r){return e in t?Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}):t[e]=r,t}Object.defineProperty(e,"__esModule",{value:!0}),e.formulateModule=e.formulateMutations=e.formulateActions=e.formulateGetters=e.formulateState=void 0;var o=r(2),i=e.formulateState=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return function(){return Object.assign({values:{},errors:{},validationErrors:{}},t)}},a=e.formulateGetters=function(){var t=(arguments.length>0&&void 0!==arguments[0]&&arguments[0],arguments.length>1&&void 0!==arguments[1]?arguments[1]:{});return Object.assign({formValues:function(t){return t.values},formErrors:function(t){return t.errors},formValidationErrors:function(t){return t.validationErrors},hasErrors:function(t){return(0,o.map)(t.errors,function(t,e){return(0,o.reduce)(e,function(t,e,r){return t||!!r.length},!1)})}},t)},u=e.formulateActions=function(){var t=(arguments.length>0&&void 0!==arguments[0]&&arguments[0],arguments.length>1&&void 0!==arguments[1]?arguments[1]:{});return Object.assign({},t)},s=e.formulateMutations=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return Object.assign({setFieldValue:function(t,e){var r=e.form,o=e.field,i=e.value;t.values=Object.assign({},t.values,n({},r,Object.assign({},t.values[r]||{},n({},o,i))))},setFieldErrors:function(t,e){var r=e.form,o=e.field,i=e.errors;t.errors=Object.assign({},t.errors,n({},r,Object.assign({},t.errors[r]||{},n({},o,i))))},setFieldValidationErrors:function(t,e){var r=e.form,o=e.field,i=e.errors;t.validationErrors=Object.assign({},t.validationErrors,n({},r,Object.assign({},t.validationErrors[r]||{},n({},o,i))))}},t)};e.formulateModule=function(t){return{state:i(),getters:a(t),actions:u(t),mutations:s(),namespaced:!0}}},function(t,e,r){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var n=r(4),o=r.n(n);for(var i in n)"default"!==i&&function(t){r.d(e,t,function(){return n[t]})}(i);var a=r(12),u=r(3),s=u(o.a,a.a,!1,null,null,null);s.options.__file="src/components/Formulate.vue",e.default=s.exports},function(t,e,r){"use strict";var n=function(){var t=this,e=t.$createElement;return(t._self._c||e)("form",{staticClass:"formulate-element",on:{submit:function(e){e.preventDefault(),t.submit(e)}}},[t._t("default")],2)},o=[];n._withStripped=!0;var i={render:n,staticRenderFns:o};e.a=i},function(t,e,r){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var n=r(5),o=r.n(n);for(var i in n)"default"!==i&&function(t){r.d(e,t,function(){return n[t]})}(i);var a=r(22),u=r(3),s=u(o.a,a.a,!1,null,null,null);s.options.__file="src/components/FormulateElement.vue",e.default=s.exports},function(t,e,r){"use strict";t.exports=r(15)},function(t,e,r){"use strict";function n(e){return u.seed(e),t.exports}function o(e){return f=e,t.exports}function i(t){return void 0!==t&&u.characters(t),u.shuffled()}function a(){return l(f)}var u=r(0),s=(r(6),r(18)),l=r(19),c=r(20),f=r(21)||0;t.exports=a,t.exports.generate=a,t.exports.seed=n,t.exports.worker=o,t.exports.characters=i,t.exports.decode=s,t.exports.isValid=c},function(t,e,r){"use strict";function n(){return(i=(9301*i+49297)%233280)/233280}function o(t){i=t}var i=1;t.exports={nextValue:n,seed:o}},function(t,e,r){"use strict";function n(){if(!o||!o.getRandomValues)return 48&Math.floor(256*Math.random());var t=new Uint8Array(1);return o.getRandomValues(t),48&t[0]}var o="object"==typeof window&&(window.crypto||window.msCrypto);t.exports=n},function(t,e,r){"use strict";function n(t){var e=o.shuffled();return{version:15&e.indexOf(t.substr(0,1)),worker:15&e.indexOf(t.substr(1,1))}}var o=r(0);t.exports=n},function(t,e,r){"use strict";function n(t){var e="",r=Math.floor(.001*(Date.now()-s));return r===i?o++:(o=0,i=r),e+=a(u.lookup,l),e+=a(u.lookup,t),o>0&&(e+=a(u.lookup,o)),e+=a(u.lookup,r)}var o,i,a=r(6),u=r(0),s=1459707606518,l=6;t.exports=n},function(t,e,r){"use strict";function n(t){if(!t||"string"!=typeof t||t.length<6)return!1;for(var e=o.characters(),r=t.length,n=0;n1)?r("label",{attrs:{for:t.id},domProps:{textContent:t._s(t.label)}}):t._e(),t._v(" "),"checkbox"===t.type&&t.isTextInput?r("input",t._b({directives:[{name:"model",rawName:"v-model",value:t.val,expression:"val"}],ref:"input",attrs:{name:t.name,type:"checkbox"},domProps:{checked:Array.isArray(t.val)?t._i(t.val,null)>-1:t.val},on:{blur:function(e){t.errorBlurState=!0},change:function(e){var r=t.val,n=e.target,o=!!n.checked;if(Array.isArray(r)){var i=t._i(r,null);n.checked?i<0&&(t.val=r.concat([null])):i>-1&&(t.val=r.slice(0,i).concat(r.slice(i+1)))}else t.val=o}}},"input",t.attributes,!1)):"radio"===t.type&&t.isTextInput?r("input",t._b({directives:[{name:"model",rawName:"v-model",value:t.val,expression:"val"}],ref:"input",attrs:{name:t.name,type:"radio"},domProps:{checked:t._q(t.val,null)},on:{blur:function(e){t.errorBlurState=!0},change:function(e){t.val=null}}},"input",t.attributes,!1)):t.isTextInput?r("input",t._b({directives:[{name:"model",rawName:"v-model",value:t.val,expression:"val"}],ref:"input",attrs:{name:t.name,type:t.type},domProps:{value:t.val},on:{blur:function(e){t.errorBlurState=!0},input:function(e){e.target.composing||(t.val=e.target.value)}}},"input",t.attributes,!1)):t._e(),t._v(" "),t.isButtonInput?r("button",{attrs:{type:t.type,disabled:"submit"===t.type&&t.form.hasErrors&&"live"===t.form.behavior},domProps:{textContent:t._s(t.label||t.name)}}):t._e(),t._v(" "),t.isSelectInput?r("select",t._b({directives:[{name:"model",rawName:"v-model",value:t.val,expression:"val"}],attrs:{name:t.name},on:{blur:function(e){t.errorBlurState=!0},change:function(e){var r=Array.prototype.filter.call(e.target.options,function(t){return t.selected}).map(function(t){return"_value"in t?t._value:t.value});t.val=e.target.multiple?r:r[0]}}},"select",t.attributes,!1),t._l(t.optionList,function(e){return r("option",{key:e.id,domProps:{value:e.value,textContent:t._s(e.label)}})})):t._e(),t._v(" "),t.isBoxInput?r("div",{staticClass:"formulate-element-box-input-group"},[t._l(t.optionList,function(e){return["radio"===t.type?r("input",t._b({directives:[{name:"model",rawName:"v-model",value:t.val,expression:"val"}],key:e.id+"-input",attrs:{type:"radio",name:t.name,id:e.id},domProps:{value:e.value,checked:t._q(t.val,e.value)},on:{blur:function(e){t.errorBlurState=!0},change:function(r){t.val=e.value}}},"input",t.attributes,!1)):t._e(),t._v(" "),"checkbox"===t.type?r("input",t._b({directives:[{name:"model",rawName:"v-model",value:t.val,expression:"val"}],key:e.id+"-input",attrs:{type:"checkbox",name:t.name,id:e.id},domProps:{value:e.value,checked:Array.isArray(t.val)?t._i(t.val,e.value)>-1:t.val},on:{blur:function(e){t.errorBlurState=!0},change:function(r){var n=t.val,o=r.target,i=!!o.checked;if(Array.isArray(n)){var a=e.value,u=t._i(n,a);o.checked?u<0&&(t.val=n.concat([a])):u>-1&&(t.val=n.slice(0,u).concat(n.slice(u+1)))}else t.val=i}}},"input",t.attributes,!1)):t._e(),t._v(" "),r("label",{key:e.id+"-label",attrs:{for:e.id},domProps:{textContent:t._s(e.label)}})]})],2):t._e(),t._v(" "),t.hasCustomInput?t._t("default"):t._e(),t._v(" "),t.isUnsupportedInput?r("div",{staticStyle:{"background-color":"red",color:"white"},domProps:{textContent:t._s("Unsupported field type: “"+t.type+"”.")}}):t._e()],2),t._v(" "),t.shouldShowErrors&&t.localAndValidationErrors.length?r("ul",{staticClass:"formulate-errors"},t._l(t.localAndValidationErrors,function(e){return r("li",{key:e,domProps:{textContent:t._s(e)}})})):t._e()])},o=[];n._withStripped=!0;var i={render:n,staticRenderFns:o};e.a=i},function(t,e,r){"use strict";function n(t){return function(){var e=t.apply(this,arguments);return new Promise(function(t,r){function n(o,i){try{var a=e[o](i),u=a.value}catch(t){return void r(t)}if(!a.done)return Promise.resolve(u).then(function(t){n("next",t)},function(t){n("throw",t)});t(u)}return n("next")})}}Object.defineProperty(e,"__esModule",{value:!0});var o=r(1),i=function(t){return t&&t.__esModule?t:{default:t}}(o);e.default={required:function(){function t(t,r){return e.apply(this,arguments)}var e=n(i.default.mark(function t(e,r){var n=(e.field,e.value),o=e.error,a=arguments;return i.default.wrap(function(t){for(;;)switch(t.prev=t.next){case 0:return t.abrupt("return",!(n&&(!Array.isArray(n)||n.length))&&o.apply(void 0,a));case 1:case"end":return t.stop()}},t,this)}));return t}(),email:function(){function t(t,r){return e.apply(this,arguments)}var e=n(i.default.mark(function t(e,r){var n,o=(e.field,e.value),a=e.error,u=arguments;return i.default.wrap(function(t){for(;;)switch(t.prev=t.next){case 0:return n=/^(?:[a-z0-9!#$%&'*+\/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+\/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])$/,t.abrupt("return",!(!o||n.test(o.toLowerCase()))&&a.apply(void 0,u));case 2:case"end":return t.stop()}},t,this)}));return t}(),confirmed:function(){function t(t,r,n){return e.apply(this,arguments)}var e=n(i.default.mark(function t(e,r,n){var o=e.field,a=e.value,u=e.error,s=e.values,l=arguments;return i.default.wrap(function(t){for(;;)switch(t.prev=t.next){case 0:return n=n||o+"_confirmation",t.abrupt("return",!(!a||a===s[n])&&u.apply(void 0,l));case 2:case"end":return t.stop()}},t,this)}));return t}()}},function(t,e,r){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.default={required:function(t,e){var r=t.field;t.value;return(e||r)+" is required"},email:function(t,e){t.field,t.value;return(e||"Email address")+" is invalid."},confirmed:function(t,e){var r=t.field;t.value;return(e||r)+" does not match the confirmation field."},default:function(t){var e=t.field;t.value;return"The "+e+" field is invalid."}}}])}); \ No newline at end of file +!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define("vue-formulate",[],e):"object"==typeof exports?exports["vue-formulate"]=e():t["vue-formulate"]=e()}("undefined"!=typeof self?self:this,function(){return function(t){function e(n){if(r[n])return r[n].exports;var o=r[n]={i:n,l:!1,exports:{}};return t[n].call(o.exports,o,o.exports,e),o.l=!0,o.exports}var r={};return e.m=t,e.c=r,e.d=function(t,r,n){e.o(t,r)||Object.defineProperty(t,r,{configurable:!1,enumerable:!0,get:n})},e.n=function(t){var r=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(r,"a",r),r},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=7)}([function(t,e,r){"use strict";function n(){d=!1}function o(t){if(!t)return void(c!==h&&(c=h,n()));if(t!==c){if(t.length!==h.length)throw new Error("Custom alphabet for shortid must be "+h.length+" unique characters. You submitted "+t.length+" characters: "+t);var e=t.split("").filter(function(t,e,r){return e!==r.lastIndexOf(t)});if(e.length)throw new Error("Custom alphabet for shortid must be "+h.length+" unique characters. These characters were not unique: "+e.join(", "));c=t,n()}}function i(t){return o(t),c}function a(t){p.seed(t),f!==t&&(n(),f=t)}function u(){c||o(h);for(var t,e=c.split(""),r=[],n=p.nextValue();e.length>0;)n=p.nextValue(),t=Math.floor(n*e.length),r.push(e.splice(t,1)[0]);return r.join("")}function s(){return d||(d=u())}function l(t){return s()[t]}var c,f,d,p=r(16),h="0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ_-";t.exports={characters:i,seed:a,lookup:l,shuffled:s}},function(t,e,r){t.exports=r(8)},function(t,e,r){"use strict";function n(t,e){var r=t.length;if(r!==e.length)return!1;for(var n=0;n1&&(t=[])}return t},module:function(){return this.form.$props.module},formName:function(){return this.form.$props.name},classes:function(){return{"formulate-element":!0,"formulate-element--has-value":!!this.value,"formulate-element--has-errors":this.localAndValidationErrors.length&&this.shouldShowErrors}},validationErrors:function(){return this.form.validationErrors[this.name]||[]},storeErrors:function(){return this.form.errors[this.name]||[]},localAndValidationErrors:function(){return this.errors.concat(this.validationErrors)},shouldShowErrors:function(){var t=this.form.shouldShowErrors;return"blur"===this.form.behavior&&(t=this.errorBlurState),!1!==this.showErrors&&!0!==this.showErrors||(t=this.showErrors),t},attributes:function(){var t=this;return["min","max","placeholder","id","multiple"].filter(function(e){return!1!==t[e]}).reduce(function(e,r){return e[r]=t[r],e},{})},optionList:function(){return Array.isArray(this.options)?Array.isArray(this.options)&&!this.options.length?[{value:this.name,label:this.label||this.name,id:a.default.generate()}]:this.options:(0,o.reduce)(this.options,function(t,e,r){return t.concat({value:e,label:r,id:a.default.generate()})},[])},val:{set:function(t){this.form.update({field:this.name,value:t}),this.isTextInput&&(this.$refs.input.value=t)},get:function(){return this.value}}},watch:{localAndValidationErrors:function(){(0,o.equals)(this.localAndValidationErrors,this.storeErrors)||this.form.updateFieldErrors({field:this.name,errors:this.localAndValidationErrors})}},created:function(){!1!==this.initial&&this.form.hydrate(n({},this.name,this.initial))}}},function(t,e,r){"use strict";function n(t,e){for(var r,n=0,i="";!r;)i+=t(e>>4*n&15|o()),r=e1&&void 0!==arguments[1]?arguments[1]:{};t.prototype.$formulate=this,e=Object.assign(this.defaultOptions,e),e.registerComponents&&(t.component(e.tags.Formulate,p.default),t.component(e.tags.FormulateElement,v.default)),e.errors&&(this.errors=Object.assign(this.errors,e.errors)),e.rules&&(this.rules=Object.assign(this.rules,e.rules)),this.options=e}},{key:"parseRules",value:function(t){return t.split("|").map(function(t){return t.trim()}).map(function(t){return t.match(/([a-zA-Z0-9]+)\((.*)?\)/)||[null,t,""]}).map(function(t){var e=l(t,3),r=(e[0],e[1]),n=e[2];return Object.assign({},{rule:r},n?{args:n.split(",").map(function(t){return t.trim()})}:{args:[]})})}},{key:"errorFactory",value:function(t){return this.errors[t]?this.errors[t]:this.errors.default}},{key:"fields",value:function(t){var e=this,r=[],n=!1;return t&&t.componentOptions&&t.componentOptions.children&&t.componentOptions.children.length?n=t.componentOptions.children:t&&t.children&&t.children.length&&(n=t.children),n&&(r=r.concat(n.reduce(function(t,r){return r.componentOptions&&r.componentOptions.tag===e.options.tags.FormulateElement&&t.push(r.componentOptions.propsData),t.concat(e.fields(r))},[]))),r}},{key:"validationErrors",value:function(){function t(t,r,n){return e.apply(this,arguments)}var e=i(s.default.mark(function t(e,r,n){var i=e.field,a=e.value,u=e.label,l=this;return s.default.wrap(function(t){for(;;)switch(t.prev=t.next){case 0:return t.abrupt("return",!!r&&Promise.all(this.parseRules(r).map(function(t){var e,r=t.rule,s=t.args;return(e=l.rules)[r].apply(e,[{field:i,value:a,label:u,error:l.errorFactory(r),values:n}].concat(o(s)))})).then(function(t){return t.reduce(function(t,e){return e?Array.isArray(t)?t.concat(e):[e]:t},!1)}));case 1:case"end":return t.stop()}},t,this)}));return t}()}]),t}(),w=new x;e.default=w;e.mapModels=function(t){var e={};for(var r in t)!function(r){var n=t[r].split("/"),o=l(n,2),i=o[0],a=o[1];e[r]={set:function(t){var e=w.options.vuexModule?w.options.vuexModule+"/":"";this.$store.commit(e+"setFieldValue",{form:i,field:a,value:t})},get:function(){var t=w.options.vuexModule?w.options.vuexModule+"/":"";return this.$store.getters[t+"formValues"][i]?this.$store.getters[t+"formValues"][i][a]:""}}}(r);return e}},function(t,e,r){var n=function(){return this}()||Function("return this")(),o=n.regeneratorRuntime&&Object.getOwnPropertyNames(n).indexOf("regeneratorRuntime")>=0,i=o&&n.regeneratorRuntime;if(n.regeneratorRuntime=void 0,t.exports=r(9),o)n.regeneratorRuntime=i;else try{delete n.regeneratorRuntime}catch(t){n.regeneratorRuntime=void 0}},function(t,e){!function(e){"use strict";function r(t,e,r,n){var i=e&&e.prototype instanceof o?e:o,a=Object.create(i.prototype),u=new p(n||[]);return a._invoke=l(t,r,u),a}function n(t,e,r){try{return{type:"normal",arg:t.call(e,r)}}catch(t){return{type:"throw",arg:t}}}function o(){}function i(){}function a(){}function u(t){["next","throw","return"].forEach(function(e){t[e]=function(t){return this._invoke(e,t)}})}function s(t){function e(r,o,i,a){var u=n(t[r],t,o);if("throw"!==u.type){var s=u.arg,l=s.value;return l&&"object"==typeof l&&g.call(l,"__await")?Promise.resolve(l.__await).then(function(t){e("next",t,i,a)},function(t){e("throw",t,i,a)}):Promise.resolve(l).then(function(t){s.value=t,i(s)},a)}a(u.arg)}function r(t,r){function n(){return new Promise(function(n,o){e(t,r,n,o)})}return o=o?o.then(n,n):n()}var o;this._invoke=r}function l(t,e,r){var o=j;return function(i,a){if(o===S)throw new Error("Generator is already running");if(o===P){if("throw"===i)throw a;return v()}for(r.method=i,r.arg=a;;){var u=r.delegate;if(u){var s=c(u,r);if(s){if(s===F)continue;return s}}if("next"===r.method)r.sent=r._sent=r.arg;else if("throw"===r.method){if(o===j)throw o=P,r.arg;r.dispatchException(r.arg)}else"return"===r.method&&r.abrupt("return",r.arg);o=S;var l=n(t,e,r);if("normal"===l.type){if(o=r.done?P:k,l.arg===F)continue;return{value:l.arg,done:r.done}}"throw"===l.type&&(o=P,r.method="throw",r.arg=l.arg)}}}function c(t,e){var r=t.iterator[e.method];if(r===m){if(e.delegate=null,"throw"===e.method){if(t.iterator.return&&(e.method="return",e.arg=m,c(t,e),"throw"===e.method))return F;e.method="throw",e.arg=new TypeError("The iterator does not provide a 'throw' method")}return F}var o=n(r,t.iterator,e.arg);if("throw"===o.type)return e.method="throw",e.arg=o.arg,e.delegate=null,F;var i=o.arg;return i?i.done?(e[t.resultName]=i.value,e.next=t.nextLoc,"return"!==e.method&&(e.method="next",e.arg=m),e.delegate=null,F):i:(e.method="throw",e.arg=new TypeError("iterator result is not an object"),e.delegate=null,F)}function f(t){var e={tryLoc:t[0]};1 in t&&(e.catchLoc=t[1]),2 in t&&(e.finallyLoc=t[2],e.afterLoc=t[3]),this.tryEntries.push(e)}function d(t){var e=t.completion||{};e.type="normal",delete e.arg,t.completion=e}function p(t){this.tryEntries=[{tryLoc:"root"}],t.forEach(f,this),this.reset(!0)}function h(t){if(t){var e=t[x];if(e)return e.call(t);if("function"==typeof t.next)return t;if(!isNaN(t.length)){var r=-1,n=function e(){for(;++r=0;--n){var o=this.tryEntries[n],i=o.completion;if("root"===o.tryLoc)return e("end");if(o.tryLoc<=this.prev){var a=g.call(o,"catchLoc"),u=g.call(o,"finallyLoc");if(a&&u){if(this.prev=0;--r){var n=this.tryEntries[r];if(n.tryLoc<=this.prev&&g.call(n,"finallyLoc")&&this.prev=0;--e){var r=this.tryEntries[e];if(r.finallyLoc===t)return this.complete(r.completion,r.afterLoc),d(r),F}},catch:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.tryLoc===t){var n=r.completion;if("throw"===n.type){var o=n.arg;d(r)}return o}}throw new Error("illegal catch attempt")},delegateYield:function(t,e,r){return this.delegate={iterator:h(t),resultName:e,nextLoc:r},"next"===this.method&&(this.arg=m),F}}}(function(){return this}()||Function("return this")())},function(t,e,r){"use strict";function n(t,e,r){return e in t?Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}):t[e]=r,t}Object.defineProperty(e,"__esModule",{value:!0}),e.formulateModule=e.formulateMutations=e.formulateActions=e.formulateGetters=e.formulateState=void 0;var o=r(2),i=e.formulateState=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return function(){return Object.assign({values:{},errors:{},validationErrors:{}},t)}},a=e.formulateGetters=function(){var t=(arguments.length>0&&void 0!==arguments[0]&&arguments[0],arguments.length>1&&void 0!==arguments[1]?arguments[1]:{});return Object.assign({formValues:function(t){return t.values},formErrors:function(t){return t.errors},formValidationErrors:function(t){return t.validationErrors},hasErrors:function(t){return(0,o.map)(t.errors,function(t,e){return(0,o.reduce)(e,function(t,e,r){return t||!!r.length},!1)})}},t)},u=e.formulateActions=function(){var t=(arguments.length>0&&void 0!==arguments[0]&&arguments[0],arguments.length>1&&void 0!==arguments[1]?arguments[1]:{});return Object.assign({},t)},s=e.formulateMutations=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return Object.assign({setFieldValue:function(t,e){var r=e.form,o=e.field,i=e.value;t.values=Object.assign({},t.values,n({},r,Object.assign({},t.values[r]||{},n({},o,i))))},setFieldErrors:function(t,e){var r=e.form,o=e.field,i=e.errors;t.errors=Object.assign({},t.errors,n({},r,Object.assign({},t.errors[r]||{},n({},o,i))))},setFieldValidationErrors:function(t,e){var r=e.form,o=e.field,i=e.errors;t.validationErrors=Object.assign({},t.validationErrors,n({},r,Object.assign({},t.validationErrors[r]||{},n({},o,i))))}},t)};e.formulateModule=function(t){return{state:i(),getters:a(t),actions:u(t),mutations:s(),namespaced:!0}}},function(t,e,r){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var n=r(4),o=r.n(n);for(var i in n)"default"!==i&&function(t){r.d(e,t,function(){return n[t]})}(i);var a=r(12),u=r(3),s=u(o.a,a.a,!1,null,null,null);s.options.__file="src/components/Formulate.vue",e.default=s.exports},function(t,e,r){"use strict";var n=function(){var t=this,e=t.$createElement;return(t._self._c||e)("form",{staticClass:"formulate-element",on:{submit:function(e){e.preventDefault(),t.submit(e)}}},[t._t("default")],2)},o=[];n._withStripped=!0;var i={render:n,staticRenderFns:o};e.a=i},function(t,e,r){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var n=r(5),o=r.n(n);for(var i in n)"default"!==i&&function(t){r.d(e,t,function(){return n[t]})}(i);var a=r(22),u=r(3),s=u(o.a,a.a,!1,null,null,null);s.options.__file="src/components/FormulateElement.vue",e.default=s.exports},function(t,e,r){"use strict";t.exports=r(15)},function(t,e,r){"use strict";function n(e){return u.seed(e),t.exports}function o(e){return f=e,t.exports}function i(t){return void 0!==t&&u.characters(t),u.shuffled()}function a(){return l(f)}var u=r(0),s=(r(6),r(18)),l=r(19),c=r(20),f=r(21)||0;t.exports=a,t.exports.generate=a,t.exports.seed=n,t.exports.worker=o,t.exports.characters=i,t.exports.decode=s,t.exports.isValid=c},function(t,e,r){"use strict";function n(){return(i=(9301*i+49297)%233280)/233280}function o(t){i=t}var i=1;t.exports={nextValue:n,seed:o}},function(t,e,r){"use strict";function n(){if(!o||!o.getRandomValues)return 48&Math.floor(256*Math.random());var t=new Uint8Array(1);return o.getRandomValues(t),48&t[0]}var o="object"==typeof window&&(window.crypto||window.msCrypto);t.exports=n},function(t,e,r){"use strict";function n(t){var e=o.shuffled();return{version:15&e.indexOf(t.substr(0,1)),worker:15&e.indexOf(t.substr(1,1))}}var o=r(0);t.exports=n},function(t,e,r){"use strict";function n(t){var e="",r=Math.floor(.001*(Date.now()-s));return r===i?o++:(o=0,i=r),e+=a(u.lookup,l),e+=a(u.lookup,t),o>0&&(e+=a(u.lookup,o)),e+=a(u.lookup,r)}var o,i,a=r(6),u=r(0),s=1459707606518,l=6;t.exports=n},function(t,e,r){"use strict";function n(t){if(!t||"string"!=typeof t||t.length<6)return!1;for(var e=o.characters(),r=t.length,n=0;n1)?r("label",{attrs:{for:t.id},domProps:{textContent:t._s(t.label)}}):t._e(),t._v(" "),"checkbox"===t.type&&t.isTextInput?r("input",t._b({directives:[{name:"model",rawName:"v-model",value:t.val,expression:"val"}],ref:"input",attrs:{name:t.name,type:"checkbox"},domProps:{checked:Array.isArray(t.val)?t._i(t.val,null)>-1:t.val},on:{blur:function(e){t.errorBlurState=!0},change:function(e){var r=t.val,n=e.target,o=!!n.checked;if(Array.isArray(r)){var i=t._i(r,null);n.checked?i<0&&(t.val=r.concat([null])):i>-1&&(t.val=r.slice(0,i).concat(r.slice(i+1)))}else t.val=o}}},"input",t.attributes,!1)):"radio"===t.type&&t.isTextInput?r("input",t._b({directives:[{name:"model",rawName:"v-model",value:t.val,expression:"val"}],ref:"input",attrs:{name:t.name,type:"radio"},domProps:{checked:t._q(t.val,null)},on:{blur:function(e){t.errorBlurState=!0},change:function(e){t.val=null}}},"input",t.attributes,!1)):t.isTextInput?r("input",t._b({directives:[{name:"model",rawName:"v-model",value:t.val,expression:"val"}],ref:"input",attrs:{name:t.name,type:t.type},domProps:{value:t.val},on:{blur:function(e){t.errorBlurState=!0},input:function(e){e.target.composing||(t.val=e.target.value)}}},"input",t.attributes,!1)):t._e(),t._v(" "),t.isButtonInput?r("button",{attrs:{type:t.type,disabled:"submit"===t.type&&t.form.hasErrors&&"live"===t.form.behavior},domProps:{textContent:t._s(t.label||t.name)}}):t._e(),t._v(" "),t.isSelectInput?r("select",t._b({directives:[{name:"model",rawName:"v-model",value:t.val,expression:"val"}],attrs:{name:t.name},on:{blur:function(e){t.errorBlurState=!0},change:function(e){var r=Array.prototype.filter.call(e.target.options,function(t){return t.selected}).map(function(t){return"_value"in t?t._value:t.value});t.val=e.target.multiple?r:r[0]}}},"select",t.attributes,!1),t._l(t.optionList,function(e){return r("option",{key:e.id,domProps:{value:e.value,textContent:t._s(e.label)}})})):t._e(),t._v(" "),t.isBoxInput?r("div",{staticClass:"formulate-element-box-input-group"},[t._l(t.optionList,function(e){return["radio"===t.type?r("input",t._b({directives:[{name:"model",rawName:"v-model",value:t.val,expression:"val"}],key:e.id+"-input",attrs:{type:"radio",name:t.name,id:e.id},domProps:{value:e.value,checked:t._q(t.val,e.value)},on:{blur:function(e){t.errorBlurState=!0},change:function(r){t.val=e.value}}},"input",t.attributes,!1)):t._e(),t._v(" "),"checkbox"===t.type?r("input",t._b({directives:[{name:"model",rawName:"v-model",value:t.val,expression:"val"}],key:e.id+"-input",attrs:{type:"checkbox",name:t.name,id:e.id},domProps:{value:e.value,checked:Array.isArray(t.val)?t._i(t.val,e.value)>-1:t.val},on:{blur:function(e){t.errorBlurState=!0},change:function(r){var n=t.val,o=r.target,i=!!o.checked;if(Array.isArray(n)){var a=e.value,u=t._i(n,a);o.checked?u<0&&(t.val=n.concat([a])):u>-1&&(t.val=n.slice(0,u).concat(n.slice(u+1)))}else t.val=i}}},"input",t.attributes,!1)):t._e(),t._v(" "),r("label",{key:e.id+"-label",attrs:{for:e.id},domProps:{textContent:t._s(e.label)}})]})],2):t._e(),t._v(" "),t.hasCustomInput?t._t("default"):t._e(),t._v(" "),t.isUnsupportedInput?r("div",{staticStyle:{"background-color":"red",color:"white"},domProps:{textContent:t._s("Unsupported field type: “"+t.type+"”.")}}):t._e()],2),t._v(" "),t.shouldShowErrors&&t.localAndValidationErrors.length?r("ul",{staticClass:"formulate-errors"},t._l(t.localAndValidationErrors,function(e){return r("li",{key:e,domProps:{textContent:t._s(e)}})})):t._e()])},o=[];n._withStripped=!0;var i={render:n,staticRenderFns:o};e.a=i},function(t,e,r){"use strict";function n(t){return function(){var e=t.apply(this,arguments);return new Promise(function(t,r){function n(o,i){try{var a=e[o](i),u=a.value}catch(t){return void r(t)}if(!a.done)return Promise.resolve(u).then(function(t){n("next",t)},function(t){n("throw",t)});t(u)}return n("next")})}}Object.defineProperty(e,"__esModule",{value:!0});var o=r(1),i=function(t){return t&&t.__esModule?t:{default:t}}(o);e.default={required:function(){function t(t){return e.apply(this,arguments)}var e=n(i.default.mark(function t(e){var r=e.value,n=e.error,o=arguments;return i.default.wrap(function(t){for(;;)switch(t.prev=t.next){case 0:return t.abrupt("return",!(r&&(!Array.isArray(r)||r.length))&&n.apply(void 0,o));case 1:case"end":return t.stop()}},t,this)}));return t}(),email:function(){function t(t){return e.apply(this,arguments)}var e=n(i.default.mark(function t(e){var r,n=e.value,o=e.error,a=arguments;return i.default.wrap(function(t){for(;;)switch(t.prev=t.next){case 0:return r=/^(?:[a-z0-9!#$%&'*+\/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+\/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])$/,t.abrupt("return",!(!n||r.test(n.toLowerCase()))&&o.apply(void 0,a));case 2:case"end":return t.stop()}},t,this)}));return t}(),confirmed:function(){function t(t,r){return e.apply(this,arguments)}var e=n(i.default.mark(function t(e,r){var n=e.field,o=e.value,a=e.error,u=e.values,s=arguments;return i.default.wrap(function(t){for(;;)switch(t.prev=t.next){case 0:return r=r||n+"_confirmation",t.abrupt("return",!(!o||o===u[r])&&a.apply(void 0,s));case 2:case"end":return t.stop()}},t,this)}));return t}()}},function(t,e,r){"use strict";Object.defineProperty(e,"__esModule",{value:!0}),e.default={required:function(t){var e=t.label;t.value;return e+" is required"},email:function(t){var e=t.label;t.value;return e+" is invalid."},confirmed:function(t){var e=t.label;t.value;return e+" does not match the confirmation field."},default:function(t){t.label,t.value;return"This field is invalid."}}}])}); \ No newline at end of file diff --git a/src/components/Formulate.vue b/src/components/Formulate.vue index 243dc6a..054bad5 100644 --- a/src/components/Formulate.vue +++ b/src/components/Formulate.vue @@ -100,10 +100,11 @@ export default { form: this.name })) }, - async validateField ({field, validation}) { + async validateField ({field, validation, label}) { let errors = await this.$formulate.validationErrors({ field, - value: this.values[field] + value: this.values[field], + label }, validation, this.values) if (!equals(errors || [], (this.validationErrors[field] || []))) { this.updateFieldValidationErrors({field, errors: errors || []}) @@ -111,9 +112,13 @@ export default { return errors }, updateFormValidation () { + this.fields.map(field => { + console.log(field.validationLabel || field.label || field.name) + }) this.fields.map(async field => this.validateField({ field: field.name, - validation: field.validation + validation: field.validation, + label: field.validationLabel || field.label || field.name })) }, submit () { diff --git a/src/errors.js b/src/errors.js index 11b45a7..bc554bd 100644 --- a/src/errors.js +++ b/src/errors.js @@ -1,6 +1,6 @@ export default { - required: ({field, value}, label) => `${label || field} is required`, - email: ({field, value}, label) => `${label || 'Email address'} is invalid.`, - confirmed: ({field, value}, label) => `${label || field} does not match the confirmation field.`, - default: ({field, value}) => `The ${field} field is invalid.` + required: ({label, value}) => `${label} is required`, + email: ({label, value}) => `${label} is invalid.`, + confirmed: ({label, value}) => `${label} does not match the confirmation field.`, + default: ({label, value}) => `This field is invalid.` } diff --git a/src/formulate.js b/src/formulate.js index af74b34..7867e54 100644 --- a/src/formulate.js +++ b/src/formulate.js @@ -93,10 +93,10 @@ class Formulate { * @param {string} rulesString * @param {Object} values */ - async validationErrors ({field, value}, rulesString, values) { + async validationErrors ({field, value, label}, rulesString, values) { return rulesString ? Promise.all( this.parseRules(rulesString) - .map(({rule, args}) => this.rules[rule]({field, value, error: this.errorFactory(rule), values}, ...args)) + .map(({rule, args}) => this.rules[rule]({field, value, label, error: this.errorFactory(rule), values}, ...args)) ).then(responses => responses.reduce((errors, error) => { return error ? (Array.isArray(errors) ? errors.concat(error) : [error]) : errors }, false)) : false diff --git a/src/rules.js b/src/rules.js index 18e82bb..56b8d41 100644 --- a/src/rules.js +++ b/src/rules.js @@ -4,7 +4,7 @@ export default { * @param {Object} field * @param {string} label */ - async required ({field, value, error}, label) { + async required ({value, error}) { return (!value || (Array.isArray(value) && !value.length)) ? error(...arguments) : false }, @@ -13,7 +13,7 @@ export default { * @param {Object} field * @param {string} label */ - async email ({field, value, error}, label) { + async email ({value, error}) { // eslint-disable-next-line var re = /^(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])$/; return (value && !re.test(value.toLowerCase())) ? error(...arguments) : false @@ -25,7 +25,7 @@ export default { * @param {string} label * @param {string} confirmField (uses `${field}_confirmation` by default) */ - async confirmed ({field, value, error, values}, label, confirmField) { + async confirmed ({field, value, error, values}, confirmField) { confirmField = confirmField || `${field}_confirmation` return (value && value !== values[confirmField]) ? error(...arguments) : false } diff --git a/tests/rules.test.js b/tests/rules.test.js index 7c5c3f3..18cfb1d 100644 --- a/tests/rules.test.js +++ b/tests/rules.test.js @@ -2,18 +2,18 @@ import test from 'ava' import f from '../dist' const rules = f.rules -const error = ({field, value}, label) => { +const error = ({field, value, label}) => { return `${field}${label}` } test('test required rule failure', async t => { - let v = await rules.required({field: 'name', value: '', error}, 'xyz') + let v = await rules.required({field: 'name', value: '', error, label: 'xyz'}) t.is('string', typeof v) t.is('namexyz', v) }) test('test required rule empty array failure', async t => { - let v = await rules.required({field: 'name', value: [], error}, 'xyz') + let v = await rules.required({field: 'name', value: [], error, label: 'xyz'}) t.is('namexyz', v) }) @@ -26,7 +26,7 @@ test('test email rule with valid email', async t => { }) test('test email rule with invalid email', async t => { - t.is('email123', await rules.email({field: 'email', value: 'invalid@example', error}, '123')) + t.is('email123', await rules.email({field: 'email', value: 'invalid@example', error, label: '123'})) }) test('test email with empty email', async t => { @@ -37,34 +37,38 @@ test('test confirmed passes', async t => { t.is(false, await rules.confirmed({ field: 'password', value: 'password', + label: '123', error, values: {password_confirmation: 'password'} - }, '123')) + })) }) test('test confirmed passes custom field', async t => { t.is(false, await rules.confirmed({ field: 'password', value: 'password', + label: '123', error, values: {customfield: 'password'} - }, '123', 'customfield')) + }, 'customfield')) }) test('test confirmed fails', async t => { t.is('password123', await rules.confirmed({ field: 'password', value: 'password', + label: '123', error, values: {password_confirmation: 'pAssword'} - }, '123')) + })) }) test('test empty confirmed passes', async t => { t.is(false, await rules.confirmed({ field: 'password', value: '', + label: '123', error, values: {password_confirmation: ''} - }, '123')) + })) })