UNPKG

radh-ui

Version:

Stencil Component Starter

1 lines 2.16 kB
System.register(["./p-72e8199d.system.js"],(function(t){"use strict";var e,r,n;return{setters:[function(t){e=t.r;r=t.c;n=t.h}],execute:function(){var a={validate:function(t){return true}};function i(t,e){var r;r={validate:function(n){var a=t.validate(n);var i=e.validate(n);if(!a){r.errorMessage=t.errorMessage}else if(!i){r.errorMessage=e.errorMessage}return a&&i}};return r}var u={validate:function(t){var e=["banana","apple","cherry"];return e.find((function(e){return e===t}))?true:false},errorMessage:"You must enter a valid fruit name"};function o(t,e){return{validate:function(r){r=r||"";if(t&&e){return t<=r.length&&r.length<=e}if(t){return t<=r.length}if(e){return r.length<=e}return true},errorMessage:t&&e?"You must enter between "+t+" and "+e+" characters":t?"You must enter at least "+t+" characters":e?"You must enter less than "+e+" characters":""}}var s;(function(t){t["fruit"]="fruit";t["length"]="length"})(s||(s={}));function l(t){return(t||[]).map((function(t){if(typeof t==="string"){return c(t,null)}else if(t&&t.name){t=t;return c(t.name,t.options)}else{return t}})).reduce(i,a)}function c(t,e){e=e||{};switch(t){case s.fruit:return u;case s.length:return o(e.min,e.max);default:return a}}var d=".input-container{padding:0.5rem;border-radius:1rem;border:1px solid grey}input{outline:none !important;border:none;width:100%;font-size:0.8rem}.validation-error{font-size:0.8rem;color:red}";var h=function(){function t(t){e(this,t);this._validator=a;this.changed=r(this,"changed",7)}t.prototype.componentWillLoad=function(){this._validator=l(this.validator)};t.prototype.componentWillUpdate=function(){this._validator=l(this.validator)};t.prototype.handleChange=function(t){this.value=t.target?t.target.value:null;this.changed.emit(this.value)};t.prototype.render=function(){var t=this;console.log(this._validator,this._validator.validate(this.value));return n("div",null,n("div",{class:"input-container"},n("input",{value:this.value,onInput:function(e){return t.handleChange(e)}})),!this._validator.validate(this.value)?n("span",{class:"validation-error"},this._validator.errorMessage):null)};return t}();t("radh_input",h);h.style=d}}}));