UNPKG

and-component-library

Version:

Distribution of AND Web Components

3 lines (2 loc) 11.2 kB
function t(){}function e(t){return t()}function n(){return Object.create(null)}function i(t){t.forEach(e)}function s(t){return"function"==typeof t}function o(t,e){return t!=t?e==e:t!==e||t&&"object"==typeof t||"function"==typeof t}function r(t,e){t.appendChild(e)}function a(t,e,n){t.insertBefore(e,n||null)}function l(t){t.parentNode.removeChild(t)}function d(t){return document.createElement(t)}function c(t){return document.createTextNode(t)}function u(){return c(" ")}function p(t,e,n,i){return t.addEventListener(e,n,i),()=>t.removeEventListener(e,n,i)}function h(t,e,n){null==n?t.removeAttribute(e):t.getAttribute(e)!==n&&t.setAttribute(e,n)}function m(t,e){e=""+e,t.wholeText!==e&&(t.data=e)}function f(t,e,n){t.classList[n?"add":"remove"](e)}let g;function $(t){g=t}function x(){if(!g)throw new Error("Function called outside component initialization");return g}function b(){const t=x();return(e,n)=>{const i=t.$$.callbacks[e];if(i){const s=function(t,e){const n=document.createEvent("CustomEvent");return n.initCustomEvent(t,!1,!1,e),n}(e,n);i.slice().forEach(e=>{e.call(t,s)})}}}const v=[],y=[],E=[],k=[],_=Promise.resolve();let w=!1;function z(){w||(w=!0,_.then(j))}function C(t){E.push(t)}let q=!1;const F=new Set;function j(){if(!q){q=!0;do{for(let t=0;t<v.length;t+=1){const e=v[t];$(e),L(e.$$)}for($(null),v.length=0;y.length;)y.pop()();for(let t=0;t<E.length;t+=1){const e=E[t];F.has(e)||(F.add(e),e())}E.length=0}while(v.length);for(;k.length;)k.pop()();w=!1,q=!1,F.clear()}}function L(t){if(null!==t.fragment){t.update(),i(t.before_update);const e=t.dirty;t.dirty=[-1],t.fragment&&t.fragment.p(t.ctx,e),t.after_update.forEach(C)}}const M=new Set;function A(o,r,a,d,c,u,p=[-1]){const h=g;$(o);const m=r.props||{},f=o.$$={fragment:null,ctx:null,props:u,update:t,not_equal:c,bound:n(),on_mount:[],on_destroy:[],before_update:[],after_update:[],context:new Map(h?h.$$.context:[]),callbacks:n(),dirty:p,skip_bound:!1};let x=!1;if(f.ctx=a?a(o,m,(t,e,...n)=>{const i=n.length?n[0]:e;return f.ctx&&c(f.ctx[t],f.ctx[t]=i)&&(!f.skip_bound&&f.bound[t]&&f.bound[t](i),x&&function(t,e){-1===t.$$.dirty[0]&&(v.push(t),z(),t.$$.dirty.fill(0)),t.$$.dirty[e/31|0]|=1<<e%31}(o,t)),e}):[],f.update(),x=!0,i(f.before_update),f.fragment=!!d&&d(f.ctx),r.target){if(r.hydrate){const t=function(t){return Array.from(t.childNodes)}(r.target);f.fragment&&f.fragment.l(t),t.forEach(l)}else f.fragment&&f.fragment.c();r.intro&&((b=o.$$.fragment)&&b.i&&(M.delete(b),b.i(y))),function(t,n,o){const{fragment:r,on_mount:a,on_destroy:l,after_update:d}=t.$$;r&&r.m(n,o),C(()=>{const n=a.map(e).filter(s);l?l.push(...n):i(n),t.$$.on_mount=[]}),d.forEach(C)}(o,r.target,r.anchor),j()}var b,y;$(h)}let O;"function"==typeof HTMLElement&&(O=class extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){for(const t in this.$$.slotted)this.appendChild(this.$$.slotted[t])}attributeChangedCallback(t,e,n){this[t]=n}$destroy(){!function(t,e){const n=t.$$;null!==n.fragment&&(i(n.on_destroy),n.fragment&&n.fragment.d(e),n.on_destroy=n.fragment=null,n.ctx=[])}(this,1),this.$destroy=t}$on(t,e){const n=this.$$.callbacks[t]||(this.$$.callbacks[t]=[]);return n.push(e),()=>{const t=n.indexOf(e);-1!==t&&n.splice(t,1)}}$set(t){var e;this.$$set&&(e=t,0!==Object.keys(e).length)&&(this.$$.skip_bound=!0,this.$$set(t),this.$$.skip_bound=!1)}});var P={dispatch(t,e,n){t.dispatchEvent&&t.dispatchEvent(new CustomEvent(e,{detail:n}))},dispatchCustomEvent(t,e,n,i){let s=i||{};e&&e.type&&e.target&&(s={type:e.type,target:e.target},n||(n=e.type)),this.dispatch(t,n,s)}};function T(t){let e,n;return{c(){e=d("div"),n=c(t[2]),h(e,"class","errorMessage")},m(t,i){a(t,e,i),r(e,n)},p(t,e){4&e&&m(n,t[2])},d(t){t&&l(e)}}}function H(e){let n,s,o,g,$,x,b,v,y,E,k,_,w,z,C,q,F=e[9]&&!e[19]&&T(e);return{c(){n=d("link"),s=u(),o=d("div"),g=d("div"),$=d("label"),x=c(e[7]),v=d("br"),y=u(),E=d("input"),_=u(),w=d("i"),z=u(),F&&F.c(),this.c=t,h(n,"rel","stylesheet"),h(n,"href","and-component-styles.css"),h(n,"disabled",e[21]),h($,"class",b=["label",e[8]].join(" ")),h($,"for",e[5]),h(E,"type",e[1]),h(E,"placeholder",e[3]),E.value=e[0],h(E,"id",e[5]),h(E,"class",k=["input",e[4]].join(" ")),E.required=e[6],h(E,"name",e[15]),h(E,"max",e[11]),h(E,"min",e[12]),h(E,"list",e[18]),E.readOnly=e[17],h(E,"maxlength",e[13]),h(E,"minlength",e[14]),E.disabled=e[10],h(E,"autocomplete",e[16]),f(E,"validate",e[9]),h(g,"class","icons")},m(t,i){a(t,n,i),a(t,s,i),a(t,o,i),r(o,g),r(g,$),r($,x),r(g,v),r(g,y),r(g,E),e[26](E),r(g,_),r(g,w),r(o,z),F&&F.m(o,null),C||(q=[p(E,"input",e[22]),p(E,"focus",e[23]),p(E,"blur",e[24])],C=!0)},p(t,[e]){2097152&e&&h(n,"disabled",t[21]),128&e&&m(x,t[7]),256&e&&b!==(b=["label",t[8]].join(" "))&&h($,"class",b),32&e&&h($,"for",t[5]),2&e&&h(E,"type",t[1]),8&e&&h(E,"placeholder",t[3]),1&e&&E.value!==t[0]&&(E.value=t[0]),32&e&&h(E,"id",t[5]),16&e&&k!==(k=["input",t[4]].join(" "))&&h(E,"class",k),64&e&&(E.required=t[6]),32768&e&&h(E,"name",t[15]),2048&e&&h(E,"max",t[11]),4096&e&&h(E,"min",t[12]),262144&e&&h(E,"list",t[18]),131072&e&&(E.readOnly=t[17]),8192&e&&h(E,"maxlength",t[13]),16384&e&&h(E,"minlength",t[14]),1024&e&&(E.disabled=t[10]),65536&e&&h(E,"autocomplete",t[16]),528&e&&f(E,"validate",t[9]),t[9]&&!t[19]?F?F.p(t,e):(F=T(t),F.c(),F.m(o,null)):F&&(F.d(1),F=null)},i:t,o:t,d(t){t&&l(n),t&&l(s),t&&l(o),e[26](null),F&&F.d(),C=!1,i(q)}}}function N(t,e,n){let i,{type:s="text"}=e,{errormessage:o="invalid input"}=e,{placeholder:r=""}=e,{value:a=""}=e,{class:l=""}=e,{id:d="and-input"}=e,{required:c}=e,{label:u="Enter the value"}=e,{labelclass:p=""}=e,{validate:h=""}=e,m=!0;const f=x(),g=b(),$=()=>{n(19,m=!i||i.checkValidity())};var v;v=async()=>{await(z(),_),$()},x().$$.on_mount.push(v);let E,{disabled:k=!1}=e,{max:w}=e,{min:C}=e,{maxlength:q}=e,{minlength:F}=e,{name:j="input-box"}=e,{autocomplete:L}=e,{readonly:M}=e,{list:A}=e,{overidestyle:O=!1}=e;return t.$$set=t=>{"type"in t&&n(1,s=t.type),"errormessage"in t&&n(2,o=t.errormessage),"placeholder"in t&&n(3,r=t.placeholder),"value"in t&&n(0,a=t.value),"class"in t&&n(4,l=t.class),"id"in t&&n(5,d=t.id),"required"in t&&n(6,c=t.required),"label"in t&&n(7,u=t.label),"labelclass"in t&&n(8,p=t.labelclass),"validate"in t&&n(9,h=t.validate),"disabled"in t&&n(10,k=t.disabled),"max"in t&&n(11,w=t.max),"min"in t&&n(12,C=t.min),"maxlength"in t&&n(13,q=t.maxlength),"minlength"in t&&n(14,F=t.minlength),"name"in t&&n(15,j=t.name),"autocomplete"in t&&n(16,L=t.autocomplete),"readonly"in t&&n(17,M=t.readonly),"list"in t&&n(18,A=t.list),"overidestyle"in t&&n(25,O=t.overidestyle)},t.$$.update=()=>{33554432&t.$$.dirty&&n(21,E=!O||null)},[a,s,o,r,l,d,c,u,p,h,k,w,C,q,F,j,L,M,A,m,i,E,t=>{n(0,a=s.match(/^(number|range)$/)?+t.target.value:t.target.value),$(),g("change",t),P.dispatchCustomEvent(f,t,"change")},t=>{g("focus",t),P.dispatchCustomEvent(f,t,"focus")},t=>{g("blur",t),P.dispatchCustomEvent(f,t,"blur")},O,function(t){y[t?"unshift":"push"](()=>{i=t,n(20,i)})}]}class S extends O{constructor(t){super(),this.shadowRoot.innerHTML='<style>@import url(https://fonts.googleapis.com/css2?family=Poppins);:root{--step:50}.icons{display:inline-block;position:relative}.icons .input{font-family:"Poppins", sans-serif;border:0.8px solid #323232;border-radius:0.3125rem;min-width:13.75rem;min-height:2.5rem;padding:0.5rem;box-sizing:border-box;color:#323232;font-size:16px;font-size:torem(16px)}.icons .input:focus{outline:none !important;border:0.8px solid #2897FF}.icons ::placeholder{font-size:12px;font-size:torem(12px);color:#323232;opacity:1}.icons :-ms-input-placeholder{color:#323232;font-size:12px;font-size:torem(12px)}.icons ::-ms-input-placeholder{color:#323232;font-size:12px;font-size:torem(12px)}.icons .label{font-family:"Poppins", sans-serif;font-size:12px;font-size:torem(12px);color:#323232}.icons i{position:absolute;left:auto;right:10px;bottom:12px}.errorMessage{color:#FF323C;font-size:12px;font-size:torem(12px);font-family:"Poppins", sans-serif}.validate.input:invalid{outline:none !important;border:0.8px solid #FF323C !important}.validate.input:invalid+i{box-sizing:border-box;display:block;width:22px;height:22px;border:2px solid transparent;border-radius:40px}.validate.input:invalid+i::after,.validate.input:invalid+i::before{content:"";display:block;box-sizing:border-box;position:absolute;width:16px;height:2px;background:#FF323C;transform:rotate(45deg);border-radius:5px;top:10px;left:1px}.validate.input:invalid+i::after{transform:rotate(-45deg)}.validate.input:valid{outline:none !important;border:0.8px solid #46991F !important}.validate.input:valid+i{box-sizing:border-box;display:block;transform:scale(var(--ggs, 1));width:22px;height:22px;border:2px solid transparent;border-radius:100px}.validate.input:valid+i::after{content:"";display:block;box-sizing:border-box;position:absolute;left:3px;top:-2px;width:6px;height:15px;border-width:0 2px 2px 0;border-style:solid;border-color:#46991F;transform-origin:bottom left;transform:rotate(45deg)}</style>',A(this,{target:this.shadowRoot},N,H,o,{type:1,errormessage:2,placeholder:3,value:0,class:4,id:5,required:6,label:7,labelclass:8,validate:9,disabled:10,max:11,min:12,maxlength:13,minlength:14,name:15,autocomplete:16,readonly:17,list:18,overidestyle:25}),t&&(t.target&&a(t.target,this,t.anchor),t.props&&(this.$set(t.props),j()))}static get observedAttributes(){return["type","errormessage","placeholder","value","class","id","required","label","labelclass","validate","disabled","max","min","maxlength","minlength","name","autocomplete","readonly","list","overidestyle"]}get type(){return this.$$.ctx[1]}set type(t){this.$set({type:t}),j()}get errormessage(){return this.$$.ctx[2]}set errormessage(t){this.$set({errormessage:t}),j()}get placeholder(){return this.$$.ctx[3]}set placeholder(t){this.$set({placeholder:t}),j()}get value(){return this.$$.ctx[0]}set value(t){this.$set({value:t}),j()}get class(){return this.$$.ctx[4]}set class(t){this.$set({class:t}),j()}get id(){return this.$$.ctx[5]}set id(t){this.$set({id:t}),j()}get required(){return this.$$.ctx[6]}set required(t){this.$set({required:t}),j()}get label(){return this.$$.ctx[7]}set label(t){this.$set({label:t}),j()}get labelclass(){return this.$$.ctx[8]}set labelclass(t){this.$set({labelclass:t}),j()}get validate(){return this.$$.ctx[9]}set validate(t){this.$set({validate:t}),j()}get disabled(){return this.$$.ctx[10]}set disabled(t){this.$set({disabled:t}),j()}get max(){return this.$$.ctx[11]}set max(t){this.$set({max:t}),j()}get min(){return this.$$.ctx[12]}set min(t){this.$set({min:t}),j()}get maxlength(){return this.$$.ctx[13]}set maxlength(t){this.$set({maxlength:t}),j()}get minlength(){return this.$$.ctx[14]}set minlength(t){this.$set({minlength:t}),j()}get name(){return this.$$.ctx[15]}set name(t){this.$set({name:t}),j()}get autocomplete(){return this.$$.ctx[16]}set autocomplete(t){this.$set({autocomplete:t}),j()}get readonly(){return this.$$.ctx[17]}set readonly(t){this.$set({readonly:t}),j()}get list(){return this.$$.ctx[18]}set list(t){this.$set({list:t}),j()}get overidestyle(){return this.$$.ctx[25]}set overidestyle(t){this.$set({overidestyle:t}),j()}}customElements.define("and-input",S);export default S; //# sourceMappingURL=Input.js.map