diff --git a/demo/demo.js b/demo/demo.js
index 64d5f14..f99d1a1 100644
--- a/demo/demo.js
+++ b/demo/demo.js
@@ -1,6 +1,6 @@
 (()=>{var t={2:(t,e,n)=>{"use strict";function r(t){return t.replace(/-(\w)/g,((t,e)=>e.toUpperCase()))}function i(t,e){t.firstChild&&(e.appendChild(t.firstChild),i(t,e))}function o(t){Array.from(t).forEach(s)}const s=t=>t&&t.parentNode&&t.parentNode.removeChild(t),a=(t,e)=>e&&e.parentNode&&e.parentNode.insertBefore(t,e),u=new Map,l=Symbol("riot-component"),c=new Set,f="is",d="mount",h="update",p="unmount",m="shouldUpdate",g="onBeforeMount",v="onMounted",b="onBeforeUpdate",y="onUpdated",E="onBeforeUnmount",x="onUnmounted",O="props",N="state",w="slots",T="root",j=Symbol.for("pure"),A=Symbol("parent"),S=Symbol("attributes"),M=Symbol("template");var _=Object.freeze({__proto__:null,COMPONENTS_IMPLEMENTATION_MAP:u,DOM_COMPONENT_INSTANCE_PROPERTY:l,PLUGINS_SET:c,IS_DIRECTIVE:f,VALUE_ATTRIBUTE:"value",MOUNT_METHOD_KEY:d,UPDATE_METHOD_KEY:h,UNMOUNT_METHOD_KEY:p,SHOULD_UPDATE_KEY:m,ON_BEFORE_MOUNT_KEY:g,ON_MOUNTED_KEY:v,ON_BEFORE_UPDATE_KEY:b,ON_UPDATED_KEY:y,ON_BEFORE_UNMOUNT_KEY:E,ON_UNMOUNTED_KEY:x,PROPS_KEY:O,STATE_KEY:N,SLOTS_KEY:w,ROOT_KEY:T,IS_PURE_SYMBOL:j,PARENT_KEY_SYMBOL:A,ATTRIBUTES_KEY_SYMBOL:S,TEMPLATE_KEY_SYMBOL:M});var D={EACH:0,IF:1,SIMPLE:2,TAG:3,SLOT:4};var P={ATTRIBUTE:0,EVENT:1,TEXT:2,VALUE:3};function C(t,e){return typeof t===e}function L(t){const e=t.ownerSVGElement;return!!e||null===e}function U(t){return!R(t.content)}function k(t){return C(t,"function")}function I(t){return!R(t)&&C(t,"object")}function R(t){return null==t}const z=Symbol("unmount"),V={nodes:[],mount(t,e){return this.update(t,e)},update(t,e){const{placeholder:n,nodes:r,childrenMap:i}=this,o=t===z?null:this.evaluate(t),u=o?Array.from(o):[],{newChildrenMap:l,batches:c,futureNodes:f}=(n.parentNode,function(t,e,n,r){const{condition:i,template:o,childrenMap:s,itemName:a,getKey:u,indexName:l,root:c,isTemplateTag:f}=r,d=new Map,h=[],p=[];return t.forEach(((t,r)=>{const m=function(t,e){let{itemName:n,indexName:r,index:i,item:o}=e;t[n]=o,r&&(t[r]=i);return t}(Object.create(e),{itemName:a,indexName:l,index:r,item:t}),g=u?u(m):r,v=s.get(g);if(function(t,e){return!!t&&!1===Boolean(t(e))}(i,m))return;const b=v?v.template:o.clone(),y=v?b.el:c.cloneNode(),E=!v,x=f&&E?function(t){const e=t.dom.cloneNode(!0);return{avoidDOMInjection:!0,fragment:e,children:Array.from(e.childNodes)}}(b):{};if(E?h.push((()=>b.mount(y,m,n,x))):h.push((()=>b.update(m,n))),f){const t=x.children||b.children;p.push(...t)}else p.push(y);s.delete(g),d.set(g,{template:b,context:m,index:r})})),{newChildrenMap:d,batches:h,futureNodes:p}}(u,t,e,this));return((t,e,n,r,i)=>{const o=n.length;let u=e.length,l=o,c=0,f=0,d=null;for(;c<u||f<l;)if(u===c){const t=l<o?f?r(n[f-1],-0).nextSibling:r(n[l-f],0):i;for(;f<l;)a(r(n[f++],1),t)}else if(l===f)for(;c<u;)d&&d.has(e[c])||s(r(e[c],-1)),c++;else if(e[c]===n[f])c++,f++;else if(e[u-1]===n[l-1])u--,l--;else if(e[c]===n[l-1]&&n[f]===e[u-1]){const t=r(e[--u],-1).nextSibling;a(r(n[f++],1),r(e[c++],-1).nextSibling),a(r(n[--l],1),t),e[u]=n[l]}else{if(!d){d=new Map;let t=f;for(;t<l;)d.set(n[t],t++)}if(d.has(e[c])){const t=d.get(e[c]);if(f<t&&t<l){let i=c,o=1;for(;++i<u&&i<l&&d.get(e[i])===t+o;)o++;if(o>t-f){const i=r(e[c],0);for(;f<t;)a(r(n[f++],1),i)}else h=r(n[f++],1),(p=r(e[c++],-1))&&p.parentNode&&p.parentNode.replaceChild(h,p)}else c++}else s(r(e[c++],-1))}var h,p})(0,r,f,function(t,e){return(n,r)=>{if(r<0){const n=t.pop();if(n){const{template:t,context:r}=n;t.unmount(r,e,null)}}return n}}(Array.from(i.values()),e),n),c.forEach((t=>t())),this.childrenMap=l,this.nodes=f,this},unmount(t,e){return this.update(z,e),this}};const F={mount(t,e){return this.update(t,e)},update(t,e){const n=!!this.evaluate(t),r=!this.value&&n,i=this.value&&!n,o=()=>{const n=this.node.cloneNode();a(n,this.placeholder),this.template=this.template.clone(),this.template.mount(n,t,e)};switch(!0){case r:o();break;case i:this.unmount(t);break;default:n&&this.template.update(t,e)}return this.value=n,this},unmount(t,e){return this.template.unmount(t,e,!0),this}};function K(t){throw new Error(t)}function B(t){return t.reduce(((t,e)=>{const{value:n,type:i}=e;switch(!0){case!e.name&&0===i:return Object.assign({},t,n);case 3===i:t.value=e.value;break;default:t[r(e.name)]=e.value}return t}),{})}const Y="removeAttribute",$="setAttribute",q="undefined"==typeof Element?{}:Element.prototype,H=function(t){const e=new Map,n=n=>(e.has(n)||e.set(n,t.call(this,n)))&&e.get(n);return n.cache=e,n}((t=>q.hasOwnProperty(t)));function G(t,e,n,r){let{name:i}=e;if(!i)return r&&function(t,e,n){const r=e?Object.keys(e):[];Object.keys(n).filter((t=>!r.includes(t))).forEach((e=>t.removeAttribute(e)))}(t,n,r),void(n&&function(t,e){Object.entries(e).forEach((e=>{let[n,r]=e;return G(t,{name:n},r)}))}(t,n));!H(i)&&(function(t){return C(t,"boolean")}(n)||I(n)||k(n))&&(t[i]=n),t[function(t){return R(t)||!1===t||""===t||I(t)||k(t)?Y:$}(n)](i,function(t,e){return!0===e?t:e}(i,n))}const X=/^on/,J={handleEvent(t){this[t.type](t)}},Z=new WeakMap;function W(t){return R(t)?"":t}const Q=(t,e)=>{const n=t.childNodes[e];if(n.nodeType===Node.COMMENT_NODE){const e=document.createTextNode("");return t.replaceChild(e,n),e}return n};var tt={0:G,1:function(t,e,n){let{name:r}=e;const i=r.replace(X,""),o=Z.get(t)||(t=>{const e=Object.create(J);return Z.set(t,e),e})(t),[s,a]=(t=>Array.isArray(t)?t:[t,!1])(n),u=o[i],l=s&&!u;u&&!s&&t.removeEventListener(i,o),l&&t.addEventListener(i,o,a),o[i]=s},2:function(t,e,n){t.data=W(n)},3:function(t,e,n){t.value=W(n)}};const et={mount(t){return this.value=this.evaluate(t),nt(this,this.value),this},update(t){const e=this.evaluate(t);return this.value!==e&&(nt(this,e),this.value=e),this},unmount(){return 1===this.type&&nt(this,null),this}};function nt(t,e){return tt[t.type](t.node,t,e,t.value)}function rt(t,e){return Object.assign({},et,e,{node:2===e.type?Q(t,e.childNodeIndex):t})}const it=(t,e)=>t[A]||e,ot={attributes:[],getTemplateScope(t,e){return function(t,e,n){if(!t||!t.length)return n;const r=t.map((t=>Object.assign({},t,{value:t.evaluate(e)})));return Object.assign(Object.create(n||null),B(r))}(this.attributes,t,e)},mount(t,e){const n=!!t.slots&&t.slots.find((t=>{let{id:e}=t;return e===this.name})),{parentNode:r}=this.node,i=it(t,e);return this.template=n&&mt(n.html,n.bindings).createDOM(r),this.template&&(this.template.mount(this.node,this.getTemplateScope(t,i),i),this.template.children=Array.from(this.node.childNodes),st(this.node)),s(this.node),this},update(t,e){if(this.template){const n=it(t,e);this.template.update(this.getTemplateScope(t,n),n)}return this},unmount(t,e,n){return this.template&&this.template.unmount(this.getTemplateScope(t,e),null,n),this}};function st(t){const e=t&&t.firstChild;e&&(a(e,t),st(t))}function at(t){return t.reduce(((t,e)=>{let{bindings:n}=e;return t.concat(n)}),[])}const ut={mount(t){return this.update(t)},update(t,e){const n=this.evaluate(t);return n===this.name?this.tag.update(t):(this.unmount(t,e,!0),this.name=n,this.tag=function(t,e,n){return void 0===e&&(e=[]),void 0===n&&(n=[]),t?t({slots:e,attributes:n}):mt(function(t){return t.reduce(((t,e)=>t+e.html),"")}(e),[...at(e),{expressions:n.map((t=>Object.assign({type:0},t)))}])}(this.getComponent(n),this.slots,this.attributes),this.tag.mount(this.node,t)),this},unmount(t,e,n){return this.tag&&this.tag.unmount(n),this}};var lt={1:function(t,e){let{evaluate:n,template:r}=e;const i=document.createTextNode("");return a(i,t),s(t),Object.assign({},F,{node:t,evaluate:n,placeholder:i,template:r.createDOM(t)})},2:function(t,e){let{expressions:n}=e;return Object.assign({},(r=n.map((e=>rt(t,e))),["mount","update","unmount"].reduce(((t,e)=>Object.assign({},t,{[e]:t=>r.map((n=>n[e](t)))&&i})),{})));var r,i},0:function(t,e){let{evaluate:n,condition:r,itemName:i,indexName:o,getKey:u,template:l}=e;const c=document.createTextNode(""),f=t.cloneNode();return a(c,t),s(t),Object.assign({},V,{childrenMap:new Map,node:t,root:f,condition:r,evaluate:n,isTemplateTag:U(f),template:l.createDOM(t),getKey:u,indexName:o,itemName:i,placeholder:c})},3:function(t,e){let{evaluate:n,getComponent:r,slots:i,attributes:o}=e;return Object.assign({},ut,{node:t,evaluate:n,slots:i,attributes:o,getComponent:r})},4:function(t,e){let{name:n,attributes:r}=e;return Object.assign({},ot,{attributes:r,node:t,name:n})}};function ct(t,e){return t.map((t=>2===t.type?Object.assign({},t,{childNodeIndex:t.childNodeIndex+e}):t))}function ft(t,e,n){const{selector:r,type:i,redundantAttribute:o,expressions:s}=e,a=r?t.querySelector(r):t;o&&a.removeAttribute(o);const u=s||[];return(lt[i]||lt[2])(a,Object.assign({},e,{expressions:n&&!r?ct(u,n):u}))}function dt(t,e){return L(t)?function(t,e){return e.ownerDocument.importNode((new window.DOMParser).parseFromString(`<svg xmlns="http://www.w3.org/2000/svg">${t}</svg>`,"application/xml").documentElement,!0)}(e,t):function(t,e){const n=U(e)?e:document.createElement("template");return n.innerHTML=t,n.content}(e,t)}function ht(t,e){switch(!0){case L(t):i(e,t);break;case U(t):t.parentNode.replaceChild(e,t);break;default:t.appendChild(e)}}const pt=Object.freeze({createDOM(t){return this.dom=this.dom||function(t,e){return e&&("string"==typeof e?dt(t,e):e)}(t,this.html),this},mount(t,e,n,r){if(void 0===r&&(r={}),!t)throw new Error("Please provide DOM node to mount properly your template");this.el&&this.unmount(e);const{fragment:i,children:o,avoidDOMInjection:s}=r,{parentNode:a}=o?o[0]:t,u=U(t),l=u?Math.max(Array.from(a.childNodes).indexOf(t),0):null;return this.isTemplateTag=u,this.createDOM(t),this.dom&&(this.fragment=i||this.dom.cloneNode(!0)),this.el=this.isTemplateTag?a:t,this.children=this.isTemplateTag?o||Array.from(this.fragment.childNodes):null,!s&&this.fragment&&ht(t,this.fragment),this.bindings=this.bindingsData.map((t=>ft(this.el,t,l))),this.bindings.forEach((t=>t.mount(e,n))),this},update(t,e){return this.bindings.forEach((n=>n.update(t,e))),this},unmount(t,e,n){if(this.el){switch(this.bindings.forEach((r=>r.unmount(t,e,n))),!0){case this.el[j]:break;case this.children&&null!==n:o(this.children);break;case!0===n:s(this.el);break;case null!==n:o(this.el.childNodes)}this.el=null}return this},clone(){return Object.assign({},this,{el:null})}});function mt(t,e){return void 0===e&&(e=[]),Object.assign({},pt,{html:t,bindingsData:e})}function gt(){return this}function vt(t){return k(t)?t.prototype&&t.prototype.constructor?new t:t():t}function bt(t,e,n,r){return void 0===r&&(r={}),Object.defineProperty(t,e,Object.assign({value:n,enumerable:!1,writable:!1,configurable:!0},r)),t}function yt(t,e,n){return Object.entries(e).forEach((e=>{let[r,i]=e;bt(t,r,i,n)})),t}function Et(t,e){return Object.entries(e).forEach((e=>{let[n,r]=e;t[n]||(t[n]=r)})),t}function xt(t){return Array.isArray(t)?t:/^\[object (HTMLCollection|NodeList|Object)\]$/.test(Object.prototype.toString.call(t))&&"number"==typeof t.length?Array.from(t):[t]}function Ot(t,e){return xt("string"==typeof t?(e||document).querySelectorAll(t):t)}const Nt=t=>1===t.length?t[0]:t;function wt(t,e,n){const r="object"==typeof e?e:{[e]:n},i=Object.keys(r);return xt(t).forEach((t=>{i.forEach((e=>t.setAttribute(e,r[e])))})),t}function Tt(t,e){return function(t,e,n){const r="string"==typeof e?[e]:e;return Nt(xt(t).map((t=>Nt(r.map((e=>t[n](e)))))))}(t,e,"getAttribute")}const jt=new Map,At=()=>St||(wt(St=Ot("style[riot]")[0]||document.createElement("style"),"type","text/css"),St.parentNode||document.head.appendChild(St),St);var St,Mt={CSS_BY_NAME:jt,add(t,e){return jt.has(t)||(jt.set(t,e),this.inject()),this},inject(){return At().innerHTML=[...jt.values()].join("\n"),this},remove(t){return jt.has(t)&&(jt.delete(t),this.inject()),this}};function _t(t){for(var e=arguments.length,n=new Array(e>1?e-1:0),r=1;r<e;r++)n[r-1]=arguments[r];return function(){for(var e=arguments.length,r=new Array(e),i=0;i<e;i++)r[i]=arguments[i];return(r=[...n,...r]).length<t.length?_t(t,...r):t(...r)}}function Dt(t){return Tt(t,f)||t.tagName.toLowerCase()}const Pt=Object.freeze({$(t){return Ot(t,this.root)[0]},$$(t){return Ot(t,this.root)}}),Ct=Object.freeze({[d]:gt,[h]:gt,[p]:gt}),Lt=Object.freeze({[m]:gt,[g]:gt,[v]:gt,[b]:gt,[y]:gt,[E]:gt,[x]:gt}),Ut=Object.assign({},Ct,{clone:gt,createDOM:gt});function kt(t,e){return void 0===e&&(e={}),Object.assign({},function(t){return Array.from(t.attributes).reduce(((t,e)=>(t[r(e.name)]=e.value,t)),{})}(t),vt(e))}const It=(t,e)=>t[l]=e;function Rt(t){return[d,h,p].reduce(((e,n)=>(e[n]=t(n),e)),{})}function zt(t){let{css:e,template:n,exports:r,name:i}=t;const o=n?function(t,e){return t(mt,P,D,(t=>e[t]||u.get(t)))}(n,r?function(t){void 0===t&&(t={});return Object.entries(vt(t)).reduce(((t,e)=>{let[n,r]=e;
 /* Riot v5.1.2, @license MIT */
-var i;return t[(i=n,i.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase())]=zt(r),t}),{})}(r.components):{}):Ut;return t=>{let{slots:s,attributes:a,props:u}=t;if(r&&r[j])return function(t,e){let{slots:n,attributes:r,props:i,css:o,template:s}=e;s&&K("Pure components can not have html"),o&&K("Pure components do not have css");const a=Et(t({slots:n,attributes:r,props:i}),Ct);return Rt((t=>function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];if(t===d){const[t]=n;t[j]=!0,It(t,a)}return a[t](...n),a}))}(r,{slots:s,attributes:a,props:u,css:e,template:n});const l=vt(r)||{},c=Vt({css:e,template:o,componentAPI:l,name:i})({slots:s,attributes:a,props:u});return{mount:(t,e,n)=>c.mount(t,n,e),update:(t,e)=>c.update(e,t),unmount:t=>c.unmount(t)}}}function Vt(t){let{css:e,template:n,componentAPI:r,name:i}=t;return e&&i&&Mt.add(i,e),_t(Kt)(yt(Et(r,Object.assign({},Lt,{[N]:{}})),Object.assign({[w]:null,[T]:null},Pt,{name:i,css:e,template:n})))}function Ft(t,e){return Object.assign({},t,vt(e))}function Kt(t,e){let{slots:n,attributes:r,props:i}=e;return o=function(t){return[...c].reduce(((t,e)=>e(t)||t),t)}(yt(Object.create(t),{mount(e,o,s){return void 0===o&&(o={}),this[S]=function(t,e){void 0===e&&(e=[]);const n=e.map((e=>rt(t,e))),r={};return Object.assign(r,Object.assign({expressions:n},Rt((t=>e=>(n.forEach((n=>n[t](e))),r)))))}(e,r).mount(s),bt(this,O,Object.freeze(Object.assign({},kt(e,i),B(this[S].expressions)))),this.state=Ft(this.state,o),this[M]=this.template.createDOM(e).clone(),It(e,this),t.name&&function(t,e){Dt(t)!==e&&wt(t,f,e)}(e,t.name),bt(this,T,e),bt(this,w,n),this.onBeforeMount(this.props,this.state),this[A]=s,this[M].mount(e,this,s),this.onMounted(this.props,this.state),this},update(t,e){void 0===t&&(t={}),e&&(this[A]=e,this[S].update(e));const n=B(this[S].expressions);if(!1!==this.shouldUpdate(n,this.props))return bt(this,O,Object.freeze(Object.assign({},this.props,n))),this.state=Ft(this.state,t),this.onBeforeUpdate(this.props,this.state),this[M].update(this,this[A]),this.onUpdated(this.props,this.state),this},unmount(t){return this.onBeforeUnmount(this.props,this.state),this[S].unmount(),this[M].unmount(this,this[A],null===t?null:!t),this.onUnmounted(this.props,this.state),this}})),Object.keys(t).filter((e=>k(t[e]))).forEach((t=>{o[t]=o[t].bind(o)})),o;var o}const{DOM_COMPONENT_INSTANCE_PROPERTY:Bt,COMPONENTS_IMPLEMENTATION_MAP:Yt,PLUGINS_SET:$t}=_;var qt=n(765),Ht=n.n(qt),Gt=n(422),Xt=n.n(Gt);function Jt(t,e){for(var n=0;n<e.length;n++){var r=e[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}const Zt=function(){function t(e,n){var r=this;!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),this.formSelector=e,this.constraits=n,this.form=document.querySelector(this.formSelector),this.elements=this.form.querySelectorAll("field-error"),this.form.addEventListener("submit",(function(t){r.onSubmit(t)})),this.form.addEventListener("field-update",(function(t){r.onFieldUpdate(t)}))}var e,n,r;return e=t,(n=[{key:"onSubmit",value:function(t){var e=this,n=Ht()(Xt()(t.target,{hash:!0}),this.constraits);n&&(t.preventDefault(),this.elements.forEach((function(t){var r=!1;n[t.attributes.name.nodeValue]&&(r=n[t.attributes.name.nodeValue]),e.dispatchCustomEvent(r,t)})))}},{key:"onFieldUpdate",value:function(t){var e=this;""==t.detail.value&&(t.detail.value=void 0);var n=Ht().single(t.detail.value,this.constraits[t.detail.name]);Array.from(this.elements).every((function(r){if(r.attributes.name.nodeValue==t.detail.name)return e.dispatchCustomEvent(n,r),!1}))}},{key:"dispatchCustomEvent",value:function(t,e){var n=!1;t&&(n=t);var r=new CustomEvent("form-validation",{detail:n});e.dispatchEvent(r)}}])&&Jt(e.prototype,n),r&&Jt(e,r),t}();var Wt,Qt;!function(t,e){let{css:n,template:r,exports:i}=e;Yt.has(t)&&K(`The component "${t}" was already registered`),Yt.set(t,zt({name:t,css:n,template:r,exports:i}))}("field-error",{css:null,exports:{state:{errors:[]},onMounted(t,e){const n=this.root.closest(".field"),r=document.querySelector('[name="'+t.name+'"]'),i=r.closest("form");r&&i&&!t.nofieldupdate&&r.addEventListener("input",(e=>{this.dispatchCustomEvent(e,i,t.name)})),this.root.addEventListener("form-validation",(t=>{this.onFormValidation(t,n)}))},onFormValidation(t,e){t.detail?(this.state.errors=t.detail,e.classList.add("field--error"),e.classList.remove("field--valid")):(this.state.errors=[],e.classList.remove("field--error"),e.classList.add("field--valid")),this.update()},dispatchCustomEvent(t,e,n){const r=new CustomEvent("field-update",{detail:{name:n,value:t.target.value}});e.dispatchEvent(r)}},template:function(t,e,n,r){return t('<div expr0="expr0" class="field__error"></div>',[{type:n.IF,evaluate:function(t){return t.state.errors.length>0},redundantAttribute:"expr0",selector:"[expr0]",template:t('<ul><li expr1="expr1"></li></ul>',[{type:n.EACH,getKey:null,condition:null,template:t(" ",[{expressions:[{type:e.TEXT,childNodeIndex:0,evaluate:function(t){return[t.error].join("")}}]}]),redundantAttribute:"expr1",selector:"[expr1]",itemName:"error",indexName:null,evaluate:function(t){return t.state.errors}}])}])},name:"field-error"}),Ot("field-error").map((t=>function(t,e,n){const r=n||Dt(t);return u.has(r)||K(`The component named "${r}" was never registered`),u.get(r)({props:e}).mount(t)}(t,Wt,Qt)));new Zt("form",{email:{presence:!0,email:!0},password:{presence:!0}})},422:t=>{var e=/^(?:submit|button|image|reset|file)$/i,n=/^(?:input|select|textarea|keygen)/i,r=/(\[[^\[\]]*\])/g;function i(t,e,n){if(0===e.length)return t=n;var r=e.shift(),o=r.match(/^\[(.+?)\]$/);if("[]"===r)return t=t||[],Array.isArray(t)?t.push(i(null,e,n)):(t._values=t._values||[],t._values.push(i(null,e,n))),t;if(o){var s=o[1],a=+s;isNaN(a)?(t=t||{})[s]=i(t[s],e,n):(t=t||[])[a]=i(t[a],e,n)}else t[r]=i(t[r],e,n);return t}function o(t,e,n){if(e.match(r)){i(t,function(t){var e=[],n=new RegExp(r),i=/^([^\[\]]*)/.exec(t);for(i[1]&&e.push(i[1]);null!==(i=n.exec(t));)e.push(i[1]);return e}(e),n)}else{var o=t[e];o?(Array.isArray(o)||(t[e]=[o]),t[e].push(n)):t[e]=n}return t}function s(t,e,n){return n=n.replace(/(\r)?\n/g,"\r\n"),n=(n=encodeURIComponent(n)).replace(/%20/g,"+"),t+(t?"&":"")+encodeURIComponent(e)+"="+n}t.exports=function(t,r){"object"!=typeof r?r={hash:!!r}:void 0===r.hash&&(r.hash=!0);for(var i=r.hash?{}:"",a=r.serializer||(r.hash?o:s),u=t&&t.elements?t.elements:[],l=Object.create(null),c=0;c<u.length;++c){var f=u[c];if((r.disabled||!f.disabled)&&f.name&&(n.test(f.nodeName)&&!e.test(f.type))){var d=f.name,h=f.value;if("checkbox"!==f.type&&"radio"!==f.type||f.checked||(h=void 0),r.empty){if("checkbox"!==f.type||f.checked||(h=""),"radio"===f.type&&(l[f.name]||f.checked?f.checked&&(l[f.name]=!0):l[f.name]=!1),null==h&&"radio"==f.type)continue}else if(!h)continue;if("select-multiple"!==f.type)i=a(i,d,h);else{h=[];for(var p=f.options,m=!1,g=0;g<p.length;++g){var v=p[g],b=r.empty&&!v.value,y=v.value||b;v.selected&&y&&(m=!0,i=r.hash&&"[]"!==d.slice(d.length-2)?a(i,d+"[]",v.value):a(i,d,v.value))}!m&&r.empty&&(i=a(i,d,""))}}}if(r.empty)for(var d in l)l[d]||(i=a(i,d,""));return i}},837:()=>{},765:function(t,e,n){t=n.nmd(t),
+var i;return t[(i=n,i.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase())]=zt(r),t}),{})}(r.components):{}):Ut;return t=>{let{slots:s,attributes:a,props:u}=t;if(r&&r[j])return function(t,e){let{slots:n,attributes:r,props:i,css:o,template:s}=e;s&&K("Pure components can not have html"),o&&K("Pure components do not have css");const a=Et(t({slots:n,attributes:r,props:i}),Ct);return Rt((t=>function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];if(t===d){const[t]=n;t[j]=!0,It(t,a)}return a[t](...n),a}))}(r,{slots:s,attributes:a,props:u,css:e,template:n});const l=vt(r)||{},c=Vt({css:e,template:o,componentAPI:l,name:i})({slots:s,attributes:a,props:u});return{mount:(t,e,n)=>c.mount(t,n,e),update:(t,e)=>c.update(e,t),unmount:t=>c.unmount(t)}}}function Vt(t){let{css:e,template:n,componentAPI:r,name:i}=t;return e&&i&&Mt.add(i,e),_t(Kt)(yt(Et(r,Object.assign({},Lt,{[N]:{}})),Object.assign({[w]:null,[T]:null},Pt,{name:i,css:e,template:n})))}function Ft(t,e){return Object.assign({},t,vt(e))}function Kt(t,e){let{slots:n,attributes:r,props:i}=e;return o=function(t){return[...c].reduce(((t,e)=>e(t)||t),t)}(yt(Object.create(t),{mount(e,o,s){return void 0===o&&(o={}),this[S]=function(t,e){void 0===e&&(e=[]);const n=e.map((e=>rt(t,e))),r={};return Object.assign(r,Object.assign({expressions:n},Rt((t=>e=>(n.forEach((n=>n[t](e))),r)))))}(e,r).mount(s),bt(this,O,Object.freeze(Object.assign({},kt(e,i),B(this[S].expressions)))),this.state=Ft(this.state,o),this[M]=this.template.createDOM(e).clone(),It(e,this),t.name&&function(t,e){Dt(t)!==e&&wt(t,f,e)}(e,t.name),bt(this,T,e),bt(this,w,n),this.onBeforeMount(this.props,this.state),this[A]=s,this[M].mount(e,this,s),this.onMounted(this.props,this.state),this},update(t,e){void 0===t&&(t={}),e&&(this[A]=e,this[S].update(e));const n=B(this[S].expressions);if(!1!==this.shouldUpdate(n,this.props))return bt(this,O,Object.freeze(Object.assign({},this.props,n))),this.state=Ft(this.state,t),this.onBeforeUpdate(this.props,this.state),this[M].update(this,this[A]),this.onUpdated(this.props,this.state),this},unmount(t){return this.onBeforeUnmount(this.props,this.state),this[S].unmount(),this[M].unmount(this,this[A],null===t?null:!t),this.onUnmounted(this.props,this.state),this}})),Object.keys(t).filter((e=>k(t[e]))).forEach((t=>{o[t]=o[t].bind(o)})),o;var o}const{DOM_COMPONENT_INSTANCE_PROPERTY:Bt,COMPONENTS_IMPLEMENTATION_MAP:Yt,PLUGINS_SET:$t}=_;var qt=n(765),Ht=n.n(qt),Gt=n(422),Xt=n.n(Gt);function Jt(t,e){for(var n=0;n<e.length;n++){var r=e[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}const Zt=function(){function t(e,n){var r=this;!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),this.formSelector=e,this.constraits=n,this.form=document.querySelector(this.formSelector),this.elements=this.form.querySelectorAll("field-error"),this.form.addEventListener("submit",(function(t){r.onSubmit(t)})),this.form.addEventListener("field-update",(function(t){r.onFieldUpdate(t)}))}var e,n,r;return e=t,(n=[{key:"onSubmit",value:function(t){var e=this,n=Ht()(Xt()(t.target,{hash:!0}),this.constraits);n&&(t.preventDefault(),this.elements.forEach((function(t){var r=!1;n[t.attributes.name.nodeValue]&&(r=n[t.attributes.name.nodeValue]),e.dispatchCustomEvent(r,t)})))}},{key:"onFieldUpdate",value:function(t){var e=this;""==t.detail.value&&(t.detail.value=void 0);var n=Ht().single(t.detail.value,this.constraits[t.detail.name]);this.elements.forEach((function(r){r.attributes.name.nodeValue==t.detail.name&&e.dispatchCustomEvent(n,r)}))}},{key:"dispatchCustomEvent",value:function(t,e){var n=!1;t&&(n=t);var r=new CustomEvent("form-validation",{detail:n});e.dispatchEvent(r)}}])&&Jt(e.prototype,n),r&&Jt(e,r),t}();var Wt,Qt;!function(t,e){let{css:n,template:r,exports:i}=e;Yt.has(t)&&K(`The component "${t}" was already registered`),Yt.set(t,zt({name:t,css:n,template:r,exports:i}))}("field-error",{css:null,exports:{state:{errors:[]},onMounted(t,e){const n=this.root.closest(".field"),r=document.querySelector('[name="'+t.name+'"]'),i=r.closest("form");r&&i&&!t.nofieldupdate&&r.addEventListener("input",(e=>{this.dispatchCustomEvent(e,i,t.name)})),this.root.addEventListener("form-validation",(t=>{this.onFormValidation(t,n)}))},onFormValidation(t,e){t.detail?(this.state.errors=t.detail,e.classList.add("field--error"),e.classList.remove("field--valid")):(this.state.errors=[],e.classList.remove("field--error"),e.classList.add("field--valid")),this.update()},dispatchCustomEvent(t,e,n){const r=new CustomEvent("field-update",{detail:{name:n,value:t.target.value}});e.dispatchEvent(r)}},template:function(t,e,n,r){return t('<div expr0="expr0" class="field__error"></div>',[{type:n.IF,evaluate:function(t){return t.state.errors.length>0},redundantAttribute:"expr0",selector:"[expr0]",template:t('<ul><li expr1="expr1"></li></ul>',[{type:n.EACH,getKey:null,condition:null,template:t(" ",[{expressions:[{type:e.TEXT,childNodeIndex:0,evaluate:function(t){return[t.error].join("")}}]}]),redundantAttribute:"expr1",selector:"[expr1]",itemName:"error",indexName:null,evaluate:function(t){return t.state.errors}}])}])},name:"field-error"}),Ot("field-error").map((t=>function(t,e,n){const r=n||Dt(t);return u.has(r)||K(`The component named "${r}" was never registered`),u.get(r)({props:e}).mount(t)}(t,Wt,Qt)));new Zt("form",{email:{presence:!0,email:!0},password:{presence:!0}})},422:t=>{var e=/^(?:submit|button|image|reset|file)$/i,n=/^(?:input|select|textarea|keygen)/i,r=/(\[[^\[\]]*\])/g;function i(t,e,n){if(0===e.length)return t=n;var r=e.shift(),o=r.match(/^\[(.+?)\]$/);if("[]"===r)return t=t||[],Array.isArray(t)?t.push(i(null,e,n)):(t._values=t._values||[],t._values.push(i(null,e,n))),t;if(o){var s=o[1],a=+s;isNaN(a)?(t=t||{})[s]=i(t[s],e,n):(t=t||[])[a]=i(t[a],e,n)}else t[r]=i(t[r],e,n);return t}function o(t,e,n){if(e.match(r)){i(t,function(t){var e=[],n=new RegExp(r),i=/^([^\[\]]*)/.exec(t);for(i[1]&&e.push(i[1]);null!==(i=n.exec(t));)e.push(i[1]);return e}(e),n)}else{var o=t[e];o?(Array.isArray(o)||(t[e]=[o]),t[e].push(n)):t[e]=n}return t}function s(t,e,n){return n=n.replace(/(\r)?\n/g,"\r\n"),n=(n=encodeURIComponent(n)).replace(/%20/g,"+"),t+(t?"&":"")+encodeURIComponent(e)+"="+n}t.exports=function(t,r){"object"!=typeof r?r={hash:!!r}:void 0===r.hash&&(r.hash=!0);for(var i=r.hash?{}:"",a=r.serializer||(r.hash?o:s),u=t&&t.elements?t.elements:[],l=Object.create(null),c=0;c<u.length;++c){var f=u[c];if((r.disabled||!f.disabled)&&f.name&&(n.test(f.nodeName)&&!e.test(f.type))){var d=f.name,h=f.value;if("checkbox"!==f.type&&"radio"!==f.type||f.checked||(h=void 0),r.empty){if("checkbox"!==f.type||f.checked||(h=""),"radio"===f.type&&(l[f.name]||f.checked?f.checked&&(l[f.name]=!0):l[f.name]=!1),null==h&&"radio"==f.type)continue}else if(!h)continue;if("select-multiple"!==f.type)i=a(i,d,h);else{h=[];for(var p=f.options,m=!1,g=0;g<p.length;++g){var v=p[g],b=r.empty&&!v.value,y=v.value||b;v.selected&&y&&(m=!0,i=r.hash&&"[]"!==d.slice(d.length-2)?a(i,d+"[]",v.value):a(i,d,v.value))}!m&&r.empty&&(i=a(i,d,""))}}}if(r.empty)for(var d in l)l[d]||(i=a(i,d,""));return i}},837:()=>{},765:function(t,e,n){t=n.nmd(t),
 /*!
  * validate.js 0.13.1
  *
diff --git a/src/FormValidator.js b/src/FormValidator.js
index e2a2573..116fc78 100644
--- a/src/FormValidator.js
+++ b/src/FormValidator.js
@@ -74,19 +74,17 @@ class FormValidator
      */
     onFieldUpdate(event)
     {
-        // if value is a empty string make him undefined
+        // workaround, make sure that value for single is undefined if it is empty
         if (event.detail.value == '') {
             event.detail.value = undefined
         }
 
-        let errors = validate.single(event.detail.value, this.constraits[event.detail.name]),
-            element
+        let errors = validate.single(event.detail.value, this.constraits[event.detail.name])
 
         // search for element by name and dispatch event
-        Array.from(this.elements).every((e) => {
-            if (e.attributes.name.nodeValue == event.detail.name) {
-                this.dispatchCustomEvent(errors, e)
-                return false
+        this.elements.forEach((element) => {
+            if (element.attributes.name.nodeValue == event.detail.name) {
+                this.dispatchCustomEvent(errors, element)
             }
         })
     }
diff --git a/src/demo/demo.riot b/src/demo/demo.riot
deleted file mode 100644
index 7bd8732..0000000
--- a/src/demo/demo.riot
+++ /dev/null
@@ -1,37 +0,0 @@
-<demo>
-    <form onsubmit={ (event) => { state.validator.handle(event) }} novalidate>
-        <div class="field">
-            <label>
-                email
-                <input type="email" name="email" onkeyup={ (event) => { state.validator.handle(event, 'email') }} />
-            </label>
-            <field-error errors={ state.validator.errors('email') } ></field-error>
-        </div>
-        <div class="field">
-            <label>
-                password
-                <input type="password" name="email" onkeyup={ (event) => { state.validator.handle(event, 'password') }} />
-            </label>
-            <field-error errors={ state.validator.errors('password') } ></field-error>
-        </div>
-        <button type="submit">Send</button>
-    </form>
-
-    <script>
-        import Validator from './../validator'
-
-        export default {
-            onBeforeMount() {
-                this.state.validator = new Validator({
-                    email: {
-                        presence: true,
-                        email: true
-                    },
-                    password: {
-                        presence: true
-                    }
-                }, this)
-            }
-        }
-    </script>
-</demo>
\ No newline at end of file