@mozaic-ds/web-components 0.11.0 → 0.12.0-beta.0

package/public/components/textinput/Textinput.js

@@ -1,2 +1,498 @@
-import{S as e,i as t,a as i,b as n,f as m,s as l,c as r,e as o,d as s,n as a,g as h,h as c,j as p,U as d,B as u,l as g,m as f,o as x,H as z,p as b,r as $,a4 as v,q as w}from"../../index-c33b3772.js";import{c as _}from"../../EventForward-8492ff62.js";import{E as k}from"../../EventHandler-02058705.js";function y(e){let t,i=`<${C(e[7])} />`;return{c(){t=o("span"),h(t,"class","mc-left-icon-input__icon")},m(e,m){n(e,t,m),t.innerHTML=i},p(e,n){128&n&&i!==(i=`<${C(e[7])} />`)&&(t.innerHTML=i)},d(e){e&&x(t)}}}function E(e){let t,i,m,l,b,$,v,w=e[7]&&y(e),_=[{class:b=(e[7]?"mc-left-icon-input":"")+" "+e[13]},e[12]],k={};for(let e=0;e<_.length;e+=1)k=r(k,_[e]);return{c(){t=o("div"),w&&w.c(),i=s(),m=o("input"),this.c=a,h(m,"class",l=e[16](e[3],e[4],e[6],e[7])+" "+e[18].class),h(m,"aria-invalid",e[4]),h(m,"name",e[1]),h(m,"id",e[1]),h(m,"placeholder",e[2]),m.disabled=e[5],h(m,"min",e[8]),h(m,"max",e[9]),h(m,"minlength",e[10]),h(m,"maxlength",e[11]),h(m,"spellcheck","false"),c(t,k)},m(l,r){n(l,t,r),w&&w.m(t,null),p(t,i),p(t,m),d(m,e[0]),$||(v=[u(e[14].call(null,m)),g(m,"input",e[21]),u(e[17].call(null,m)),g(m,"keydown",e[22])],$=!0)},p(e,[n]){e[7]?w?w.p(e,n):(w=y(e),w.c(),w.m(t,i)):w&&(w.d(1),w=null),262360&n&&l!==(l=e[16](e[3],e[4],e[6],e[7])+" "+e[18].class)&&h(m,"class",l),16&n&&h(m,"aria-invalid",e[4]),2&n&&h(m,"name",e[1]),2&n&&h(m,"id",e[1]),4&n&&h(m,"placeholder",e[2]),32&n&&(m.disabled=e[5]),256&n&&h(m,"min",e[8]),512&n&&h(m,"max",e[9]),1024&n&&h(m,"minlength",e[10]),2048&n&&h(m,"maxlength",e[11]),1&n&&m.value!==e[0]&&d(m,e[0]),c(t,k=f(_,[8320&n&&b!==(b=(e[7]?"mc-left-icon-input":"")+" "+e[13])&&{class:b},4096&n&&e[12]]))},i:a,o:a,d(e){e&&x(t),w&&w.d(),$=!1,z(v)}}}function C(e){return`${e}`}function j(e,t,i){let n,m,l;const o=["name","value","placeholder","inputtype","isvalid","isinvalid","disabled","size","iconname","rightalign","min","max","minlength","maxlength"];let s=b(t,o),{name:a}=t,{value:h}=t,{placeholder:c}=t,{inputtype:p="text"}=t,{isvalid:d}=t,{isinvalid:u}=t,{disabled:g=!1}=t,{size:f="m"}=t,{iconname:x}=t,{rightalign:z}=t,{min:y}=t,{max:E}=t,{minlength:C}=t,{maxlength:j}=t;const M=_($());let q=new k;const H=$();v((()=>{H.shadowRoot.querySelector(".mc-text-input").type=n}));return e.$$set=e=>{i(18,t=r(r({},t),w(e))),i(25,s=b(t,o)),"name"in e&&i(1,a=e.name),"value"in e&&i(0,h=e.value),"placeholder"in e&&i(2,c=e.placeholder),"inputtype"in e&&i(19,p=e.inputtype),"isvalid"in e&&i(3,d=e.isvalid),"isinvalid"in e&&i(4,u=e.isinvalid),"disabled"in e&&i(5,g=e.disabled),"size"in e&&i(6,f=e.size),"iconname"in e&&i(7,x=e.iconname),"rightalign"in e&&i(20,z=e.rightalign),"min"in e&&i(8,y=e.min),"max"in e&&i(9,E=e.max),"minlength"in e&&i(10,C=e.minlength),"maxlength"in e&&i(11,j=e.maxlength)},e.$$.update=()=>{524288&e.$$.dirty&&(n=p),i(13,m=t.class),i(12,l=Object.assign({},s)),4096&e.$$.dirty&&delete l.class},t=w(t),[h,a,c,d,u,g,f,x,y,E,C,j,l,m,M,q,function(e,t,i,n){const m=["mc-text-input","mc-field__input"];return e&&m.push("is-valid"),t&&m.push("is-invalid"),"s"===i&&m.push("mc-text-input--s"),n&&m.push("mc-left-icon-input__input"),z&&m.push("right-align"),m.join(" ")},e=>{e.type=n},t,p,z,function(){h=this.value,i(0,h)},e=>{"Enter"===e?.key&&q.dispatch("submit-search",h)}]}class M extends e{constructor(e){super();const r=document.createElement("style");r.textContent="@charset \"UTF-8\";.mc-text-input{font-family:\"LeroyMerlin\", sans-serif;font-weight:400;-webkit-box-sizing:border-box;box-sizing:border-box;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0;margin:0;-webkit-box-shadow:none;box-shadow:none;border:none;font-size:1rem;line-height:1.375;min-height:3rem;padding:0.75rem 0.6875rem;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;display:block;width:100%;position:relative;border:1px solid #666666;color:#191919;background-color:#ffffff;border-radius:4px}.mc-text-input[type=number]::-webkit-inner-spin-button,.mc-text-input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;margin:0}.mc-text-input[type=number]{-moz-appearance:textfield}.mc-text-input[type=search]::-webkit-search-decoration:hover,.mc-text-input[type=search]::-webkit-search-cancel-button:hover{cursor:pointer}.mc-text-input::-webkit-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input::-moz-placeholder{font-size:1rem;line-height:1.375}.mc-text-input:-ms-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input::-ms-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input::placeholder{font-size:1rem;line-height:1.375}.mc-text-input::-webkit-input-placeholder{margin:0;color:#666666;opacity:1}.mc-text-input::-moz-placeholder{margin:0;color:#666666;opacity:1}.mc-text-input:-ms-input-placeholder{margin:0;color:#666666;opacity:1}.mc-text-input::-ms-input-placeholder{margin:0;color:#666666;opacity:1}.mc-text-input::placeholder{margin:0;color:#666666;opacity:1}.mc-text-input.is-valid,.mc-text-input.is-invalid{background-repeat:no-repeat;background-size:1.5rem 1.5rem;background-position:right 0.4375rem center;padding-right:2.5rem}.mc-text-input.is-valid{border-color:#46a610;background-image:url(\"data:image/svg+xml,\")}.mc-text-input.is-valid:hover,.mc-text-input.is-valid.is-hover{border-color:#035010}.mc-text-input.is-invalid{border-color:#c61112;background-image:url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1.5rem' width='1.5rem' viewBox='0 0 24 24' fill='%23c61112'%3E%3Cpath d='M12 2a10 10 0 1010 10A10 10 0 0012 2zm0 18a8 8 0 118-8 8 8 0 01-8 8z'/%3E%3Cpath d='M12 7a1 1 0 00-1 1v4.38a1 1 0 002 0V8a1 1 0 00-1-1z'/%3E%3Ccircle cx='12' cy='16' r='1'/%3E%3C/svg%3E\")}.mc-text-input.is-invalid:hover,.mc-text-input.is-invalid.is-hover{border-color:#530000}.mc-text-input.is-hover,.mc-text-input:hover{border-color:#191919}.mc-text-input.is-focus,.mc-text-input:focus{-webkit-box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #0b96cc;box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #0b96cc}.mc-text-input:disabled{background:#e6e6e6;border-color:#e6e6e6;color:#666666;cursor:not-allowed}.mc-text-input--s{font-size:0.875rem;line-height:1.2857142857;min-height:2rem;padding:0.375rem 0.4375rem}.mc-text-input--s::-webkit-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s::-moz-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s:-ms-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s::-ms-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s::placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--m{font-size:1rem;line-height:1.375;min-height:3rem;padding:0.75rem 0.6875rem}.mc-text-input--m::-webkit-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m::-moz-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m:-ms-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m::-ms-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m::placeholder{font-size:1rem;line-height:1.375}@media screen and (min-width: 680px){.mc-text-input--s\\@from-m{font-size:0.875rem;line-height:1.2857142857;min-height:2rem;padding:0.375rem 0.4375rem}.mc-text-input--s\\@from-m::-webkit-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-m::-moz-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-m:-ms-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-m::-ms-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-m::placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--m\\@from-m{font-size:1rem;line-height:1.375;min-height:3rem;padding:0.75rem 0.6875rem}.mc-text-input--m\\@from-m::-webkit-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-m::-moz-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-m:-ms-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-m::-ms-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-m::placeholder{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1024px){.mc-text-input--s\\@from-l{font-size:0.875rem;line-height:1.2857142857;min-height:2rem;padding:0.375rem 0.4375rem}.mc-text-input--s\\@from-l::-webkit-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-l::-moz-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-l:-ms-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-l::-ms-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-l::placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--m\\@from-l{font-size:1rem;line-height:1.375;min-height:3rem;padding:0.75rem 0.6875rem}.mc-text-input--m\\@from-l::-webkit-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-l::-moz-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-l:-ms-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-l::-ms-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-l::placeholder{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1280px){.mc-text-input--s\\@from-xl{font-size:0.875rem;line-height:1.2857142857;min-height:2rem;padding:0.375rem 0.4375rem}.mc-text-input--s\\@from-xl::-webkit-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-xl::-moz-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-xl:-ms-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-xl::-ms-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-xl::placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--m\\@from-xl{font-size:1rem;line-height:1.375;min-height:3rem;padding:0.75rem 0.6875rem}.mc-text-input--m\\@from-xl::-webkit-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-xl::-moz-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-xl:-ms-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-xl::-ms-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-xl::placeholder{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1920px){.mc-text-input--s\\@from-xxl{font-size:0.875rem;line-height:1.2857142857;min-height:2rem;padding:0.375rem 0.4375rem}.mc-text-input--s\\@from-xxl::-webkit-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-xxl::-moz-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-xxl:-ms-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-xxl::-ms-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-xxl::placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--m\\@from-xxl{font-size:1rem;line-height:1.375;min-height:3rem;padding:0.75rem 0.6875rem}.mc-text-input--m\\@from-xxl::-webkit-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-xxl::-moz-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-xxl:-ms-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-xxl::-ms-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-xxl::placeholder{font-size:1rem;line-height:1.375}}.mc-left-icon-input{position:relative}.mc-left-icon-input__icon{position:absolute;z-index:1;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);fill:#666666;pointer-events:none}.mc-left-icon-input .mc-left-icon-input__icon{left:0.75rem;top:50%;width:1.5rem;height:1.5rem}.mc-left-icon-input .mc-left-icon-input__input{padding-left:2.9375rem}.mc-left-icon-input--s .mc-left-icon-input__icon{left:0.5rem;top:50%;width:1.5rem;height:1.5rem}.mc-left-icon-input--s .mc-left-icon-input__input{padding-left:2.4375rem}.mc-field__label,.mc-field__legend{font-size:0.875rem;line-height:1.2857142857;font-weight:400;color:#333333}.mc-field__legend{padding-left:0;padding-right:0}.mc-field__requirement,.mc-field__help{font-size:0.75rem;line-height:1.3333333333;font-weight:400;color:#666666}.mc-field__requirement::before{content:\" - \"}.mc-field__help{display:block;margin-top:0.125rem}.mc-field .mc-field__input,.mc-field .mc-field__element{margin-top:0.5rem}@media screen and (min-width: 769px){.mc-field__container--inline,.mc-field__element--inline{display:-webkit-box;display:-ms-flexbox;display:flex}}@media screen and (min-width: 769px){.mc-field__container--inline .mc-field__item:not(:last-child),.mc-field__element--inline .mc-field__item:not(:last-child){margin-bottom:0;margin-right:1rem}}@media screen and (min-width: 1024px){.mc-field__container--inline .mc-field__item:not(:last-child),.mc-field__element--inline .mc-field__item:not(:last-child){margin-right:2rem}}.mc-field__item:not(:last-child){margin-bottom:1rem}.mc-field__error-message{font-size:0.875rem;line-height:1.2857142857;color:#c61112;display:inline-block;margin-top:0.25rem}.mc-field--group{border:none;margin-left:0;margin-right:0;padding:0}.mc-field--group .mc-field__error-message{margin-top:0.5rem}.right-align{text-align:right}",this.shadowRoot.appendChild(r),t(this,{target:this.shadowRoot,props:i(this.attributes),customElement:!0},j,E,l,{name:1,value:0,placeholder:2,inputtype:19,isvalid:3,isinvalid:4,disabled:5,size:6,iconname:7,rightalign:20,min:8,max:9,minlength:10,maxlength:11},null),e&&(e.target&&n(e.target,this,e.anchor),e.props&&(this.$set(e.props),m()))}static get observedAttributes(){return["name","value","placeholder","inputtype","isvalid","isinvalid","disabled","size","iconname","rightalign","min","max","minlength","maxlength"]}get name(){return this.$$.ctx[1]}set name(e){this.$$set({name:e}),m()}get value(){return this.$$.ctx[0]}set value(e){this.$$set({value:e}),m()}get placeholder(){return this.$$.ctx[2]}set placeholder(e){this.$$set({placeholder:e}),m()}get inputtype(){return this.$$.ctx[19]}set inputtype(e){this.$$set({inputtype:e}),m()}get isvalid(){return this.$$.ctx[3]}set isvalid(e){this.$$set({isvalid:e}),m()}get isinvalid(){return this.$$.ctx[4]}set isinvalid(e){this.$$set({isinvalid:e}),m()}get disabled(){return this.$$.ctx[5]}set disabled(e){this.$$set({disabled:e}),m()}get size(){return this.$$.ctx[6]}set size(e){this.$$set({size:e}),m()}get iconname(){return this.$$.ctx[7]}set iconname(e){this.$$set({iconname:e}),m()}get rightalign(){return this.$$.ctx[20]}set rightalign(e){this.$$set({rightalign:e}),m()}get min(){return this.$$.ctx[8]}set min(e){this.$$set({min:e}),m()}get max(){return this.$$.ctx[9]}set max(e){this.$$set({max:e}),m()}get minlength(){return this.$$.ctx[10]}set minlength(e){this.$$set({minlength:e}),m()}get maxlength(){return this.$$.ctx[11]}set maxlength(e){this.$$set({maxlength:e}),m()}}export{M as default};
+import { S as SvelteElement, i as init, a as attribute_to_object, b as insert, f as flush, s as safe_not_equal, c as assign, e as element, d as space, n as noop, g as attr, h as set_attributes, j as append, U as set_input_value, B as action_destroyer, l as listen, m as get_spread_update, o as detach, H as run_all, p as compute_rest_props, r as get_current_component, a4 as afterUpdate, q as exclude_internal_props } from '../../index-c33b3772.js';
+import { c as createEventForwarder } from '../../EventForward-8492ff62.js';
+import { E as EventHandler } from '../../EventHandler-02058705.js';
+
+/* src/components/textinput/Textinput.svelte generated by Svelte v3.58.0 */
+
+function create_if_block(ctx) {
+	let span;
+	let raw_value = `<${generateIconName(/*iconname*/ ctx[7])} />` + "";
+
+	return {
+		c() {
+			span = element("span");
+			attr(span, "class", "mc-left-icon-input__icon");
+		},
+		m(target, anchor) {
+			insert(target, span, anchor);
+			span.innerHTML = raw_value;
+		},
+		p(ctx, dirty) {
+			if (dirty & /*iconname*/ 128 && raw_value !== (raw_value = `<${generateIconName(/*iconname*/ ctx[7])} />` + "")) span.innerHTML = raw_value;		},
+		d(detaching) {
+			if (detaching) detach(span);
+		}
+	};
+}
+
+function create_fragment(ctx) {
+	let div;
+	let t;
+	let input;
+	let input_class_value;
+	let div_class_value;
+	let mounted;
+	let dispose;
+	let if_block = /*iconname*/ ctx[7] && create_if_block(ctx);
+
+	let div_levels = [
+		{
+			class: div_class_value = "" + ((/*iconname*/ ctx[7] ? 'mc-left-icon-input' : '') + " " + /*userClass*/ ctx[13])
+		},
+		/*attributes*/ ctx[12]
+	];
+
+	let div_data = {};
+
+	for (let i = 0; i < div_levels.length; i += 1) {
+		div_data = assign(div_data, div_levels[i]);
+	}
+
+	return {
+		c() {
+			div = element("div");
+			if (if_block) if_block.c();
+			t = space();
+			input = element("input");
+			this.c = noop;
+			attr(input, "class", input_class_value = "" + (/*getClasses*/ ctx[16](/*isvalid*/ ctx[3], /*isinvalid*/ ctx[4], /*size*/ ctx[6], /*iconname*/ ctx[7]) + " " + /*$$props*/ ctx[18].class));
+			attr(input, "aria-invalid", /*isinvalid*/ ctx[4]);
+			attr(input, "name", /*name*/ ctx[1]);
+			attr(input, "id", /*name*/ ctx[1]);
+			attr(input, "placeholder", /*placeholder*/ ctx[2]);
+			input.disabled = /*disabled*/ ctx[5];
+			attr(input, "min", /*min*/ ctx[8]);
+			attr(input, "max", /*max*/ ctx[9]);
+			attr(input, "minlength", /*minlength*/ ctx[10]);
+			attr(input, "maxlength", /*maxlength*/ ctx[11]);
+			attr(input, "spellcheck", "false");
+			set_attributes(div, div_data);
+		},
+		m(target, anchor) {
+			insert(target, div, anchor);
+			if (if_block) if_block.m(div, null);
+			append(div, t);
+			append(div, input);
+			set_input_value(input, /*value*/ ctx[0]);
+
+			if (!mounted) {
+				dispose = [
+					action_destroyer(/*forwardEvents*/ ctx[14].call(null, input)),
+					listen(input, "input", /*input_input_handler*/ ctx[21]),
+					action_destroyer(/*setType*/ ctx[17].call(null, input)),
+					listen(input, "keydown", /*keydown_handler*/ ctx[22])
+				];
+
+				mounted = true;
+			}
+		},
+		p(ctx, [dirty]) {
+			if (/*iconname*/ ctx[7]) {
+				if (if_block) {
+					if_block.p(ctx, dirty);
+				} else {
+					if_block = create_if_block(ctx);
+					if_block.c();
+					if_block.m(div, t);
+				}
+			} else if (if_block) {
+				if_block.d(1);
+				if_block = null;
+			}
+
+			if (dirty & /*isvalid, isinvalid, size, iconname, $$props*/ 262360 && input_class_value !== (input_class_value = "" + (/*getClasses*/ ctx[16](/*isvalid*/ ctx[3], /*isinvalid*/ ctx[4], /*size*/ ctx[6], /*iconname*/ ctx[7]) + " " + /*$$props*/ ctx[18].class))) {
+				attr(input, "class", input_class_value);
+			}
+
+			if (dirty & /*isinvalid*/ 16) {
+				attr(input, "aria-invalid", /*isinvalid*/ ctx[4]);
+			}
+
+			if (dirty & /*name*/ 2) {
+				attr(input, "name", /*name*/ ctx[1]);
+			}
+
+			if (dirty & /*name*/ 2) {
+				attr(input, "id", /*name*/ ctx[1]);
+			}
+
+			if (dirty & /*placeholder*/ 4) {
+				attr(input, "placeholder", /*placeholder*/ ctx[2]);
+			}
+
+			if (dirty & /*disabled*/ 32) {
+				input.disabled = /*disabled*/ ctx[5];
+			}
+
+			if (dirty & /*min*/ 256) {
+				attr(input, "min", /*min*/ ctx[8]);
+			}
+
+			if (dirty & /*max*/ 512) {
+				attr(input, "max", /*max*/ ctx[9]);
+			}
+
+			if (dirty & /*minlength*/ 1024) {
+				attr(input, "minlength", /*minlength*/ ctx[10]);
+			}
+
+			if (dirty & /*maxlength*/ 2048) {
+				attr(input, "maxlength", /*maxlength*/ ctx[11]);
+			}
+
+			if (dirty & /*value*/ 1 && input.value !== /*value*/ ctx[0]) {
+				set_input_value(input, /*value*/ ctx[0]);
+			}
+
+			set_attributes(div, div_data = get_spread_update(div_levels, [
+				dirty & /*iconname, userClass*/ 8320 && div_class_value !== (div_class_value = "" + ((/*iconname*/ ctx[7] ? 'mc-left-icon-input' : '') + " " + /*userClass*/ ctx[13])) && { class: div_class_value },
+				dirty & /*attributes*/ 4096 && /*attributes*/ ctx[12]
+			]));
+		},
+		i: noop,
+		o: noop,
+		d(detaching) {
+			if (detaching) detach(div);
+			if (if_block) if_block.d();
+			mounted = false;
+			run_all(dispose);
+		}
+	};
+}
+
+function generateIconName(iconName) {
+	return `${iconName}`;
+}
+
+function instance($$self, $$props, $$invalidate) {
+	let inputType;
+	let userClass;
+	let attributes;
+
+	const omit_props_names = [
+		"name","value","placeholder","inputtype","isvalid","isinvalid","disabled","size","iconname","rightalign","min","max","minlength","maxlength"
+	];
+
+	let $$restProps = compute_rest_props($$props, omit_props_names);
+	let { name } = $$props;
+	let { value } = $$props;
+	let { placeholder } = $$props;
+	let { inputtype = 'text' } = $$props;
+	let { isvalid } = $$props;
+	let { isinvalid } = $$props;
+	let { disabled = false } = $$props;
+	let { size = 'm' } = $$props;
+	let { iconname } = $$props;
+	let { rightalign } = $$props;
+	let { min } = $$props;
+	let { max } = $$props;
+	let { minlength } = $$props;
+	let { maxlength } = $$props;
+	const forwardEvents = createEventForwarder(get_current_component());
+	let eventHandler = new EventHandler();
+
+	function getClasses(isValid, isInvalid, size, iconname) {
+		const classes = ['mc-text-input', 'mc-field__input'];
+
+		if (isValid) {
+			classes.push('is-valid');
+		}
+
+		if (isInvalid) {
+			classes.push('is-invalid');
+		}
+
+		if (size === 's') {
+			classes.push('mc-text-input--s');
+		}
+
+		if (iconname) {
+			classes.push('mc-left-icon-input__input');
+		}
+
+		if (rightalign) {
+			classes.push('right-align');
+		}
+
+		return classes.join(' ');
+	}
+
+	const setType = node => {
+		node.type = inputType;
+	};
+
+	const component = get_current_component();
+
+	afterUpdate(() => {
+		const input = component.shadowRoot.querySelector('.mc-text-input');
+		input.type = inputType;
+	});
+
+	function input_input_handler() {
+		value = this.value;
+		$$invalidate(0, value);
+	}
+
+	const keydown_handler = event => {
+		if (event?.key === 'Enter') {
+			eventHandler.dispatch('submit-search', value);
+		}
+	};
+
+	$$self.$$set = $$new_props => {
+		$$invalidate(18, $$props = assign(assign({}, $$props), exclude_internal_props($$new_props)));
+		$$invalidate(25, $$restProps = compute_rest_props($$props, omit_props_names));
+		if ('name' in $$new_props) $$invalidate(1, name = $$new_props.name);
+		if ('value' in $$new_props) $$invalidate(0, value = $$new_props.value);
+		if ('placeholder' in $$new_props) $$invalidate(2, placeholder = $$new_props.placeholder);
+		if ('inputtype' in $$new_props) $$invalidate(19, inputtype = $$new_props.inputtype);
+		if ('isvalid' in $$new_props) $$invalidate(3, isvalid = $$new_props.isvalid);
+		if ('isinvalid' in $$new_props) $$invalidate(4, isinvalid = $$new_props.isinvalid);
+		if ('disabled' in $$new_props) $$invalidate(5, disabled = $$new_props.disabled);
+		if ('size' in $$new_props) $$invalidate(6, size = $$new_props.size);
+		if ('iconname' in $$new_props) $$invalidate(7, iconname = $$new_props.iconname);
+		if ('rightalign' in $$new_props) $$invalidate(20, rightalign = $$new_props.rightalign);
+		if ('min' in $$new_props) $$invalidate(8, min = $$new_props.min);
+		if ('max' in $$new_props) $$invalidate(9, max = $$new_props.max);
+		if ('minlength' in $$new_props) $$invalidate(10, minlength = $$new_props.minlength);
+		if ('maxlength' in $$new_props) $$invalidate(11, maxlength = $$new_props.maxlength);
+	};
+
+	$$self.$$.update = () => {
+		if ($$self.$$.dirty & /*inputtype*/ 524288) {
+			inputType = inputtype;
+		}
+
+		$$invalidate(13, userClass = $$props.class);
+		$$invalidate(12, attributes = Object.assign({}, $$restProps));
+
+		if ($$self.$$.dirty & /*attributes*/ 4096) {
+			delete attributes.class;
+		}
+	};
+
+	$$props = exclude_internal_props($$props);
+
+	return [
+		value,
+		name,
+		placeholder,
+		isvalid,
+		isinvalid,
+		disabled,
+		size,
+		iconname,
+		min,
+		max,
+		minlength,
+		maxlength,
+		attributes,
+		userClass,
+		forwardEvents,
+		eventHandler,
+		getClasses,
+		setType,
+		$$props,
+		inputtype,
+		rightalign,
+		input_input_handler,
+		keydown_handler
+	];
+}
+
+class Textinput extends SvelteElement {
+	constructor(options) {
+		super();
+		const style = document.createElement('style');
+		style.textContent = `@charset "UTF-8";.mc-text-input{font-family:"LeroyMerlin", sans-serif;font-weight:400;-webkit-box-sizing:border-box;box-sizing:border-box;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0;margin:0;-webkit-box-shadow:none;box-shadow:none;border:none;font-size:1rem;line-height:1.375;min-height:3rem;padding:0.75rem 0.6875rem;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease;display:block;width:100%;position:relative;border:1px solid #666666;color:#191919;background-color:#ffffff;border-radius:4px}.mc-text-input[type=number]::-webkit-inner-spin-button,.mc-text-input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;margin:0}.mc-text-input[type=number]{-moz-appearance:textfield}.mc-text-input[type=search]::-webkit-search-decoration:hover,.mc-text-input[type=search]::-webkit-search-cancel-button:hover{cursor:pointer}.mc-text-input::-webkit-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input::-moz-placeholder{font-size:1rem;line-height:1.375}.mc-text-input:-ms-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input::-ms-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input::placeholder{font-size:1rem;line-height:1.375}.mc-text-input::-webkit-input-placeholder{margin:0;color:#666666;opacity:1}.mc-text-input::-moz-placeholder{margin:0;color:#666666;opacity:1}.mc-text-input:-ms-input-placeholder{margin:0;color:#666666;opacity:1}.mc-text-input::-ms-input-placeholder{margin:0;color:#666666;opacity:1}.mc-text-input::placeholder{margin:0;color:#666666;opacity:1}.mc-text-input.is-valid,.mc-text-input.is-invalid{background-repeat:no-repeat;background-size:1.5rem 1.5rem;background-position:right 0.4375rem center;padding-right:2.5rem}.mc-text-input.is-valid{border-color:#46a610;background-image:url("data:image/svg+xml,")}.mc-text-input.is-valid:hover,.mc-text-input.is-valid.is-hover{border-color:#035010}.mc-text-input.is-invalid{border-color:#c61112;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1.5rem' width='1.5rem' viewBox='0 0 24 24' fill='%23c61112'%3E%3Cpath d='M12 2a10 10 0 1010 10A10 10 0 0012 2zm0 18a8 8 0 118-8 8 8 0 01-8 8z'/%3E%3Cpath d='M12 7a1 1 0 00-1 1v4.38a1 1 0 002 0V8a1 1 0 00-1-1z'/%3E%3Ccircle cx='12' cy='16' r='1'/%3E%3C/svg%3E")}.mc-text-input.is-invalid:hover,.mc-text-input.is-invalid.is-hover{border-color:#530000}.mc-text-input.is-hover,.mc-text-input:hover{border-color:#191919}.mc-text-input.is-focus,.mc-text-input:focus{-webkit-box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #0b96cc;box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #0b96cc}.mc-text-input:disabled{background:#e6e6e6;border-color:#e6e6e6;color:#666666;cursor:not-allowed}.mc-text-input--s{font-size:0.875rem;line-height:1.2857142857;min-height:2rem;padding:0.375rem 0.4375rem}.mc-text-input--s::-webkit-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s::-moz-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s:-ms-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s::-ms-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s::placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--m{font-size:1rem;line-height:1.375;min-height:3rem;padding:0.75rem 0.6875rem}.mc-text-input--m::-webkit-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m::-moz-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m:-ms-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m::-ms-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m::placeholder{font-size:1rem;line-height:1.375}@media screen and (min-width: 680px){.mc-text-input--s\\@from-m{font-size:0.875rem;line-height:1.2857142857;min-height:2rem;padding:0.375rem 0.4375rem}.mc-text-input--s\\@from-m::-webkit-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-m::-moz-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-m:-ms-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-m::-ms-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-m::placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--m\\@from-m{font-size:1rem;line-height:1.375;min-height:3rem;padding:0.75rem 0.6875rem}.mc-text-input--m\\@from-m::-webkit-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-m::-moz-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-m:-ms-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-m::-ms-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-m::placeholder{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1024px){.mc-text-input--s\\@from-l{font-size:0.875rem;line-height:1.2857142857;min-height:2rem;padding:0.375rem 0.4375rem}.mc-text-input--s\\@from-l::-webkit-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-l::-moz-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-l:-ms-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-l::-ms-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-l::placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--m\\@from-l{font-size:1rem;line-height:1.375;min-height:3rem;padding:0.75rem 0.6875rem}.mc-text-input--m\\@from-l::-webkit-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-l::-moz-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-l:-ms-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-l::-ms-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-l::placeholder{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1280px){.mc-text-input--s\\@from-xl{font-size:0.875rem;line-height:1.2857142857;min-height:2rem;padding:0.375rem 0.4375rem}.mc-text-input--s\\@from-xl::-webkit-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-xl::-moz-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-xl:-ms-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-xl::-ms-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-xl::placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--m\\@from-xl{font-size:1rem;line-height:1.375;min-height:3rem;padding:0.75rem 0.6875rem}.mc-text-input--m\\@from-xl::-webkit-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-xl::-moz-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-xl:-ms-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-xl::-ms-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-xl::placeholder{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1920px){.mc-text-input--s\\@from-xxl{font-size:0.875rem;line-height:1.2857142857;min-height:2rem;padding:0.375rem 0.4375rem}.mc-text-input--s\\@from-xxl::-webkit-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-xxl::-moz-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-xxl:-ms-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-xxl::-ms-input-placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--s\\@from-xxl::placeholder{font-size:0.875rem;line-height:1.2857142857}.mc-text-input--m\\@from-xxl{font-size:1rem;line-height:1.375;min-height:3rem;padding:0.75rem 0.6875rem}.mc-text-input--m\\@from-xxl::-webkit-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-xxl::-moz-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-xxl:-ms-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-xxl::-ms-input-placeholder{font-size:1rem;line-height:1.375}.mc-text-input--m\\@from-xxl::placeholder{font-size:1rem;line-height:1.375}}.mc-left-icon-input{position:relative}.mc-left-icon-input__icon{position:absolute;z-index:1;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);fill:#666666;pointer-events:none}.mc-left-icon-input .mc-left-icon-input__icon{left:0.75rem;top:50%;width:1.5rem;height:1.5rem}.mc-left-icon-input .mc-left-icon-input__input{padding-left:2.9375rem}.mc-left-icon-input--s .mc-left-icon-input__icon{left:0.5rem;top:50%;width:1.5rem;height:1.5rem}.mc-left-icon-input--s .mc-left-icon-input__input{padding-left:2.4375rem}.mc-field__label,.mc-field__legend{font-size:0.875rem;line-height:1.2857142857;font-weight:400;color:#333333}.mc-field__legend{padding-left:0;padding-right:0}.mc-field__requirement,.mc-field__help{font-size:0.75rem;line-height:1.3333333333;font-weight:400;color:#666666}.mc-field__requirement::before{content:" - "}.mc-field__help{display:block;margin-top:0.125rem}.mc-field .mc-field__input,.mc-field .mc-field__element{margin-top:0.5rem}@media screen and (min-width: 769px){.mc-field__container--inline{display:-webkit-box;display:-ms-flexbox;display:flex}}@media screen and (min-width: 769px){.mc-field__container--inline .mc-field__item:not(:last-child){margin-bottom:0;margin-right:1rem}}@media screen and (min-width: 1024px){.mc-field__container--inline .mc-field__item:not(:last-child){margin-right:2rem}}.mc-field__item:not(:last-child){margin-bottom:1rem}.mc-field__error-message{font-size:0.875rem;line-height:1.2857142857;color:#c61112;display:inline-block;margin-top:0.25rem}.mc-field--group{border:none;margin-left:0;margin-right:0;padding:0}.mc-field--group .mc-field__error-message{margin-top:0.5rem}.right-align{text-align:right}`;
+		this.shadowRoot.appendChild(style);
+
+		init(
+			this,
+			{
+				target: this.shadowRoot,
+				props: attribute_to_object(this.attributes),
+				customElement: true
+			},
+			instance,
+			create_fragment,
+			safe_not_equal,
+			{
+				name: 1,
+				value: 0,
+				placeholder: 2,
+				inputtype: 19,
+				isvalid: 3,
+				isinvalid: 4,
+				disabled: 5,
+				size: 6,
+				iconname: 7,
+				rightalign: 20,
+				min: 8,
+				max: 9,
+				minlength: 10,
+				maxlength: 11
+			},
+			null
+		);
+
+		if (options) {
+			if (options.target) {
+				insert(options.target, this, options.anchor);
+			}
+
+			if (options.props) {
+				this.$set(options.props);
+				flush();
+			}
+		}
+	}
+
+	static get observedAttributes() {
+		return [
+			"name",
+			"value",
+			"placeholder",
+			"inputtype",
+			"isvalid",
+			"isinvalid",
+			"disabled",
+			"size",
+			"iconname",
+			"rightalign",
+			"min",
+			"max",
+			"minlength",
+			"maxlength"
+		];
+	}
+
+	get name() {
+		return this.$$.ctx[1];
+	}
+
+	set name(name) {
+		this.$$set({ name });
+		flush();
+	}
+
+	get value() {
+		return this.$$.ctx[0];
+	}
+
+	set value(value) {
+		this.$$set({ value });
+		flush();
+	}
+
+	get placeholder() {
+		return this.$$.ctx[2];
+	}
+
+	set placeholder(placeholder) {
+		this.$$set({ placeholder });
+		flush();
+	}
+
+	get inputtype() {
+		return this.$$.ctx[19];
+	}
+
+	set inputtype(inputtype) {
+		this.$$set({ inputtype });
+		flush();
+	}
+
+	get isvalid() {
+		return this.$$.ctx[3];
+	}
+
+	set isvalid(isvalid) {
+		this.$$set({ isvalid });
+		flush();
+	}
+
+	get isinvalid() {
+		return this.$$.ctx[4];
+	}
+
+	set isinvalid(isinvalid) {
+		this.$$set({ isinvalid });
+		flush();
+	}
+
+	get disabled() {
+		return this.$$.ctx[5];
+	}
+
+	set disabled(disabled) {
+		this.$$set({ disabled });
+		flush();
+	}
+
+	get size() {
+		return this.$$.ctx[6];
+	}
+
+	set size(size) {
+		this.$$set({ size });
+		flush();
+	}
+
+	get iconname() {
+		return this.$$.ctx[7];
+	}
+
+	set iconname(iconname) {
+		this.$$set({ iconname });
+		flush();
+	}
+
+	get rightalign() {
+		return this.$$.ctx[20];
+	}
+
+	set rightalign(rightalign) {
+		this.$$set({ rightalign });
+		flush();
+	}
+
+	get min() {
+		return this.$$.ctx[8];
+	}
+
+	set min(min) {
+		this.$$set({ min });
+		flush();
+	}
+
+	get max() {
+		return this.$$.ctx[9];
+	}
+
+	set max(max) {
+		this.$$set({ max });
+		flush();
+	}
+
+	get minlength() {
+		return this.$$.ctx[10];
+	}
+
+	set minlength(minlength) {
+		this.$$set({ minlength });
+		flush();
+	}
+
+	get maxlength() {
+		return this.$$.ctx[11];
+	}
+
+	set maxlength(maxlength) {
+		this.$$set({ maxlength });
+		flush();
+	}
+}
+
+export { Textinput as default };
 //# sourceMappingURL=Textinput.js.map

package/public/components/textinput/Textinput.js.map

@@ -1 +1 @@
-{"version":3,"file":"Textinput.js","sources":["../../../src/components/textinput/Textinput.svelte"],"sourcesContent":["<svelte:options tag={null} />\n\n<script lang=\"ts\">\n  import { afterUpdate } from 'svelte';\n  import { createEventForwarder } from '../../utilities/EventForward';\n  import { EventHandler } from '../../utilities/EventHandler';\n  import { get_current_component } from 'svelte/internal';\n\n  import type { TextInputSize, TextInputType } from './textinput.types';\n\n  export let name: string;\n  export let value: string;\n  export let placeholder: string;\n  export let inputtype: TextInputType = 'text';\n  export let isvalid: boolean;\n  export let isinvalid: boolean;\n  export let disabled = false;\n  export let size: TextInputSize = 'm';\n  export let iconname: string;\n  export let rightalign: boolean;\n  export let min: string;\n  export let max: string;\n  export let minlength: number;\n  export let maxlength: number;\n  const forwardEvents = createEventForwarder(get_current_component());\n  let eventHandler = new EventHandler();\n  $: inputType = inputtype;\n  $: userClass = $$props.class;\n  $: attributes = { ...$$restProps };\n  $: delete attributes.class;\n  function generateIconName(iconName: string): string {\n    return `${iconName}`;\n  }\n\n  function getClasses(\n    isValid: boolean,\n    isInvalid: boolean,\n    size: TextInputSize,\n    iconname: string,\n  ): string {\n    const classes = ['mc-text-input', 'mc-field__input'];\n\n    if (isValid) {\n      classes.push('is-valid');\n    }\n\n    if (isInvalid) {\n      classes.push('is-invalid');\n    }\n\n    if (size === 's') {\n      classes.push('mc-text-input--s');\n    }\n\n    if (iconname) {\n      classes.push('mc-left-icon-input__input');\n    }\n\n    if (rightalign) {\n      classes.push('right-align');\n    }\n\n    return classes.join(' ');\n  }\n\n  const setType = (node: any) => {\n    // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n    node.type = inputType;\n  };\n\n  // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n  const component: any = get_current_component();\n\n  afterUpdate(() => {\n    /* eslint-disable @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-assignment */\n    const input = component.shadowRoot.querySelector('.mc-text-input');\n    input.type = inputType;\n    /* eslint-enable @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-assignment */\n  });\n</script>\n\n<div class=\"{iconname ? 'mc-left-icon-input' : ''} {userClass}\" {...attributes}>\n  {#if iconname}\n    <span class=\"mc-left-icon-input__icon\">\n      {@html `<${generateIconName(iconname)} />`}\n    </span>\n  {/if}\n  <input\n    use:forwardEvents\n    bind:value\n    use:setType\n    class=\"{getClasses(isvalid, isinvalid, size, iconname)} {$$props.class}\"\n    aria-invalid={isinvalid}\n    {name}\n    id={name}\n    {placeholder}\n    {disabled}\n    {min}\n    {max}\n    {minlength}\n    {maxlength}\n    spellcheck=\"false\"\n    on:keydown={(event) => {\n      if (event?.key === 'Enter') {\n        eventHandler.dispatch('submit-search', value);\n      }\n    }}\n  />\n</div>\n\n<style lang=\"scss\">\n  @import '@mozaic-ds/styles/settings-tools/_all-settings';\n  @import '@mozaic-ds/styles/components/c.text-input';\n  @import '@mozaic-ds/styles/components/c.left-icon-input';\n  @import '@mozaic-ds/styles/components/c.fields';\n\n  .right-align {\n    text-align: right;\n  }\n</style>\n"],"names":["raw_value","generateIconName","ctx","insert","target","span","anchor","dirty","innerHTML","create_if_block","class","div_class_value","div","append","input","iconName","name","$$props","value","placeholder","inputtype","isvalid","isinvalid","disabled","size","iconname","rightalign","min","max","minlength","maxlength","forwardEvents","createEventForwarder","get_current_component","eventHandler","EventHandler","component","afterUpdate","shadowRoot","querySelector","type","inputType","$$invalidate","userClass","attributes","Object","assign","$$restProps","isValid","isInvalid","classes","push","join","node","event","key","dispatch"],"mappings":"iUAoFiBA,EAAA,IAAAC,EAAiBC,EAAQ,gFADtCC,EAEMC,EAAAC,EAAAC,yBADO,IAAAC,GAAAP,KAAAA,EAAA,IAAAC,EAAiBC,EAAQ,YAAAG,EAAAG,UAAAR,qDAFnCE,EAAQ,IAAAO,EAAAP,OADFQ,MAAAC,GAAAT,EAAW,GAAA,qBAAuB,QAAKA,EAAS,KAAOA,EAAU,2HAUlEA,EAAU,IAACA,EAAO,GAAEA,EAAS,GAAEA,EAAI,GAAEA,EAAQ,IAAA,IAAIA,EAAO,IAACQ,0BACnDR,EAAS,8BAEnBA,EAAI,mKAbZC,EA2BKC,EAAAQ,EAAAN,yBArBHO,EAoBCD,EAAAE,yHAzBIZ,EAAQ,0EASHA,EAAU,IAACA,EAAO,GAAEA,EAAS,GAAEA,EAAI,GAAEA,EAAQ,IAAA,IAAIA,EAAO,IAACQ,gDACnDR,EAAS,wCAEnBA,EAAI,+MAbC,KAAAK,GAAAI,KAAAA,GAAAT,EAAW,GAAA,qBAAuB,QAAKA,EAAS,MAAA,CAAAQ,MAAAC,WAAOT,EAAU,kDAnDnE,SAAAD,EAAiBc,YACdA,0MArBDC,GAAYC,SACZC,GAAaD,eACbE,GAAmBF,GACnBG,UAAAA,EAA2B,QAAMH,WACjCI,GAAgBJ,aAChBK,GAAkBL,GAClBM,SAAAA,GAAW,GAAKN,GAChBO,KAAAA,EAAsB,KAAGP,YACzBQ,GAAgBR,cAChBS,GAAmBT,OACnBU,GAAWV,OACXW,GAAWX,aACXY,GAAiBZ,aACjBa,GAAiBb,QACtBc,EAAgBC,EAAqBC,KACvC,IAAAC,MAAmBC,EAwCjB,MAMAC,EAAiBH,IAEvBI,GAAW,KAEKD,EAAUE,WAAWC,cAAc,kBAC3CC,KAAOC,CAAS,0iBAlDrBA,EAAYrB,GACZsB,EAAA,GAAAC,EAAY1B,EAAQP,YACpBkC,EAALC,OAAAC,UAAuBC,4BACXH,EAAWlC,+CAKZ,SACPsC,EACAC,EACAzB,EACAC,SAEMyB,EAAO,CAAI,gBAAiB,0BAE9BF,GACFE,EAAQC,KAAK,YAGXF,GACFC,EAAQC,KAAK,cAGF,MAAT3B,GACF0B,EAAQC,KAAK,oBAGX1B,GACFyB,EAAQC,KAAK,6BAGXzB,GACFwB,EAAQC,KAAK,eAGRD,EAAQE,KAAK,MAGLC,IAEfA,EAAKb,KAAOC,CAAS,wCAmCRa,IACQ,UAAfA,GAAOC,KACTrB,EAAasB,SAAS,gBAAiBtC"}
+{"version":3,"file":"Textinput.js","sources":["../../../src/components/textinput/Textinput.svelte"],"sourcesContent":["<svelte:options tag={null} />\n\n<script lang=\"ts\">\n  import { afterUpdate } from 'svelte';\n  import { createEventForwarder } from '../../utilities/EventForward';\n  import { EventHandler } from '../../utilities/EventHandler';\n  import { get_current_component } from 'svelte/internal';\n\n  import type { TextInputSize, TextInputType } from './textinput.types';\n\n  export let name: string;\n  export let value: string;\n  export let placeholder: string;\n  export let inputtype: TextInputType = 'text';\n  export let isvalid: boolean;\n  export let isinvalid: boolean;\n  export let disabled = false;\n  export let size: TextInputSize = 'm';\n  export let iconname: string;\n  export let rightalign: boolean;\n  export let min: string;\n  export let max: string;\n  export let minlength: number;\n  export let maxlength: number;\n  const forwardEvents = createEventForwarder(get_current_component());\n  let eventHandler = new EventHandler();\n  $: inputType = inputtype;\n  $: userClass = $$props.class;\n  $: attributes = { ...$$restProps };\n  $: delete attributes.class;\n  function generateIconName(iconName: string): string {\n    return `${iconName}`;\n  }\n\n  function getClasses(\n    isValid: boolean,\n    isInvalid: boolean,\n    size: TextInputSize,\n    iconname: string,\n  ): string {\n    const classes = ['mc-text-input', 'mc-field__input'];\n\n    if (isValid) {\n      classes.push('is-valid');\n    }\n\n    if (isInvalid) {\n      classes.push('is-invalid');\n    }\n\n    if (size === 's') {\n      classes.push('mc-text-input--s');\n    }\n\n    if (iconname) {\n      classes.push('mc-left-icon-input__input');\n    }\n\n    if (rightalign) {\n      classes.push('right-align');\n    }\n\n    return classes.join(' ');\n  }\n\n  const setType = (node: any) => {\n    // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n    node.type = inputType;\n  };\n\n  // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n  const component: any = get_current_component();\n\n  afterUpdate(() => {\n    /* eslint-disable @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-assignment */\n    const input = component.shadowRoot.querySelector('.mc-text-input');\n    input.type = inputType;\n    /* eslint-enable @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-assignment */\n  });\n</script>\n\n<div class=\"{iconname ? 'mc-left-icon-input' : ''} {userClass}\" {...attributes}>\n  {#if iconname}\n    <span class=\"mc-left-icon-input__icon\">\n      {@html `<${generateIconName(iconname)} />`}\n    </span>\n  {/if}\n  <input\n    use:forwardEvents\n    bind:value\n    use:setType\n    class=\"{getClasses(isvalid, isinvalid, size, iconname)} {$$props.class}\"\n    aria-invalid={isinvalid}\n    {name}\n    id={name}\n    {placeholder}\n    {disabled}\n    {min}\n    {max}\n    {minlength}\n    {maxlength}\n    spellcheck=\"false\"\n    on:keydown={(event) => {\n      if (event?.key === 'Enter') {\n        eventHandler.dispatch('submit-search', value);\n      }\n    }}\n  />\n</div>\n\n<style lang=\"scss\">\n  @import '@mozaic-ds/styles/settings-tools/_all-settings';\n  @import '@mozaic-ds/styles/components/c.text-input';\n  @import '@mozaic-ds/styles/components/c.left-icon-input';\n  @import '@mozaic-ds/styles/components/c.fields';\n\n  .right-align {\n    text-align: right;\n  }\n</style>\n"],"names":[],"mappings":"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"}