quarkd
Version:
Mobile UI Components built on Web Components.
2 lines (1 loc) • 6.25 kB
JavaScript
import{_ as e,a as n}from"../typeof.js";import{_ as r,a as t,b as o,c as i,P as l,H as a,A as s,d,N as u,O as p,B as f}from"../index2.js";import{_ as c}from"../defineProperty.js";function h(e){var n=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}();return function(){var o,i=r(e);if(n){var l=r(this).constructor;o=Reflect.construct(i,arguments,l)}else o=i.apply(this,arguments);return t(this,o)}}var v=function(r){o(d,a);var t=h(d);function d(){var n;e(this,d);for(var r=arguments.length,o=new Array(r),a=0;a<r;a++)o[a]=arguments[a];return n=t.call.apply(t,[this].concat(o)),c(i(n),"name",""),c(i(n),"label",""),c(i(n),"defaultvalue",""),c(i(n),"value",""),c(i(n),"type",""),c(i(n),"placeholder",""),c(i(n),"max",""),c(i(n),"maxlength",""),c(i(n),"autofocus",!1),c(i(n),"min",""),c(i(n),"minlength",""),c(i(n),"errormsg",""),c(i(n),"disabled",!1),c(i(n),"readonly",!1),c(i(n),"required",!1),c(i(n),"rules",[]),c(i(n),"inputRef",l()),c(i(n),"errorRef",l()),c(i(n),"showError",!1),c(i(n),"evenFn",(function(e){return function(r){if((n.inputRef||n.inputRef.current)&&(!n.readonly&&!n.disabled||"blur"!==e&&"focus"!==e)){r.stopPropagation();var t=n.inputRef.current.value;n.value=t,n.$emit(e,{detail:{value:t}}),"blur"!==e&&"change"!==e||n.validRules()}}})),c(i(n),"validRules",(function(){if(n.errorRef&&n.errorRef.current){var e=n.errorRef.current;if(n.rules&&n.rules.length>0){for(var r=0;r<n.rules.length;r+=1){var t=n.rules[r];if(t.validator){if(!t.validator(n.value)&&t.message)return n.errormsg=t.message,void(t.message&&(e.style.display="inline-block"))}else if(t.required&&t.message&&!n.value)return n.errormsg=t.message,void(t.message&&(e.style.display="inline-block"))}e.style.display="none",n.errormsg=""}n.required&&(e.style.display=!n.value&&n.errormsg?"inline-block":"none")}})),n}return n(d,[{key:"setRules",value:function(e){if(!Array.isArray(e))throw new Error("rules need array");this.rules=e}},{key:"render",value:function(){var e=this.label?a.h("label",{class:"quark-field-label",part:"label"},this.label):null;return a.h(s,null,a.h("slot",{name:"label"},e),a.h("div",{class:"quark-field-input-container",part:"container"},a.h("div",{class:"quark-field-input-inner",part:"inner"},a.h("input",{part:"input",ref:this.inputRef,name:this.name,value:this.value,type:this.type,placeholder:this.placeholder,autofocus:this.autofocus,min:this.min,max:this.max,minlength:this.minlength,maxlength:this.maxlength,disabled:this.disabled,readonly:this.readonly,onChange:this.evenFn("change"),onInput:this.evenFn("change"),onBlur:this.evenFn("blur"),onFocus:this.evenFn("focus"),onClick:this.evenFn("click")})),a.h("div",{class:"quark-field-error-msg",part:"error-msg",ref:this.errorRef},this.errormsg)))}}]),d}();d([u()],v.prototype,"name",void 0),d([u()],v.prototype,"label",void 0),d([u()],v.prototype,"defaultvalue",void 0),d([u()],v.prototype,"value",void 0),d([u()],v.prototype,"type",void 0),d([u()],v.prototype,"placeholder",void 0),d([u()],v.prototype,"max",void 0),d([u()],v.prototype,"maxlength",void 0),d([u({type:Boolean})],v.prototype,"autofocus",void 0),d([u()],v.prototype,"min",void 0),d([u()],v.prototype,"minlength",void 0),d([u()],v.prototype,"errormsg",void 0),d([u({type:Boolean})],v.prototype,"disabled",void 0),d([u({type:Boolean})],v.prototype,"readonly",void 0),d([u({type:Boolean})],v.prototype,"required",void 0),d([p()],v.prototype,"showError",void 0);var g=v=d([f({tag:"quark-field",style:':host {\n display: flex;\n width: 100%;\n position: relative;\n display: -webkit-box;\n display: -webkit-flex;\n box-sizing: border-box;\n padding: var(--field-padding, 4.26667vw);\n overflow: hidden;\n background: #fff;\n font-family: PingFangSC-Regular, PingFang SC;\n color: #242729;\n line-height: 6.4vw;\n}\n\n:host label {\n flex: none;\n box-sizing: border-box;\n width: var(--field-label-width, 31.73333vw);\n flex-shrink: 0;\n font-size: var(--field-label-font-size, 4vw);\n display: -webkit-box;\n overflow: hidden;\n text-align: left;\n word-wrap: break-word;\n margin-right: var(--field-label-margin-right, 3.2vw);\n color: var(--field-label-text-color, #242729);\n font-weight: var(--field-label-font-weight);\n}\n\n:host([required]) .quark-field-label::before {\n width: 1em;\n height: 1em;\n margin-right: 1.06667vw;\n color: #F72626;\n font-size: 3.73333vw;\n content: "*";\n}\n\n:host input {\n display: block;\n box-sizing: border-box;\n min-width: 0;\n line-height: inherit;\n align-items: center;\n width: 100%;\n margin: 0;\n padding: 0;\n background-color: transparent;\n border: 0;\n text-shadow: none;\n cursor: text;\n border: none;\n outline: none;\n font-size: var(--field-input-font-size, 4vw);\n color: var(--field-input-text-color, #242729);\n caret-color: var(--field-input-caret-color);\n text-align: var(--field-input-align, left);\n resize: none;\n}\n\n:host label[disabled] {\n opacity: 0.6;\n cursor: not-allowed;\n color: var(--field-disabled-text-color, #c8c9cc);\n}\n\n:host input[disabled] {\n opacity: 0.6;\n cursor: not-allowed;\n color: var(--field-disabled-text-color, #c8c9cc);\n}\n\n:host input[readonly] {\n /* cursor: not-allowed; */\n}\n\n:host input::placeholder {\n color: var(--field-placeholder-text-color, #c8c9cc);\n font-size: var(--field-placeholder-font-size, 4vw);\n}\n\n:host input[type="number"]::-webkit-inner-spin-button,\n:host input[type="number"]::-webkit-outer-spin-button {\n -webkit-appearance: none;\n margin: 0;\n}\n\n:host input[type="number"] {\n -moz-appearance: textfield;\n}\n\n:host .quark-field-input-container {\n position: relative;\n text-align: right;\n vertical-align: middle;\n word-wrap: break-word;\n overflow: visible;\n width: 100%;\n}\n\n:host .quark-field-input-inner {\n display: flex;\n align-items: center;\n}\n\n:host .quark-field-error-msg {\n display: none;\n width: 100%;\n color: var(--field-error-text-color, #F72626);\n font-size: var(--field-error-font-size, 3.2vw);\n text-align: var(--field-error-text-align, left);\n}'})],v);export{g as default};