@mozaic-ds/web-components 0.5.0 → 0.6.1

package/public/components/textinput/Textinput.js

@@ -1,498 +1,2 @@
-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;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMS41cmVtIiB3aWR0aD0iMS41cmVtIiBmaWxsPSIjNDZhNjEwIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGQ9Ik0xMiA0YTggOCAwIDExLTggOCA4IDggMCAwMTgtOG0wLTJhMTAgMTAgMCAxMDEwIDEwQTEwIDEwIDAgMDAxMiAyeiIvPjxwYXRoIGQ9Ik0xMC43MyAxNS43NWExIDEgMCAwMS0uNjgtLjI2bC0zLTIuNzRhMSAxIDAgMDExLjM2LTEuNDdsMi4yNSAyLjA4IDQuMzYtNC40MmExIDEgMCAxMTEuNDIgMS40MWwtNSA1LjFhMSAxIDAgMDEtLjcxLjN6Ii8+PC9zdmc+")}.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;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMS41cmVtIiB3aWR0aD0iMS41cmVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiIGZpbGw9IiNjNjExMTIiPjxwYXRoIGQ9Ik0xMiAyYTEwIDEwIDAgMTAxMCAxMEExMCAxMCAwIDAwMTIgMnptMCAxOGE4IDggMCAxMTgtOCA4IDggMCAwMS04IDh6Ii8+PHBhdGggZD0iTTEyIDdhMSAxIDAgMDAtMSAxdjQuMzhhMSAxIDAgMDAyIDBWOGExIDEgMCAwMC0xLTF6Ii8+PGNpcmNsZSBjeD0iMTIiIGN5PSIxNiIgcj0iMSIvPjwvc3ZnPg==")}.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 };
+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 x,o as f,H as z,p as b,r as w,a4 as $,q as v}from"../../index-c33b3772.js";import{c as M}from"../../EventForward-8492ff62.js";import{E as I}from"../../EventHandler-02058705.js";function _(e){let t,i=`<${A(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=`<${A(e[7])} />`)&&(t.innerHTML=i)},d(e){e&&f(t)}}}function y(e){let t,i,m,l,b,w,$,v=e[7]&&_(e),M=[{class:b=(e[7]?"mc-left-icon-input":"")+" "+e[13]},e[12]],I={};for(let e=0;e<M.length;e+=1)I=r(I,M[e]);return{c(){t=o("div"),v&&v.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,I)},m(l,r){n(l,t,r),v&&v.m(t,null),p(t,i),p(t,m),d(m,e[0]),w||($=[u(e[14].call(null,m)),g(m,"input",e[21]),u(e[17].call(null,m)),g(m,"keydown",e[22])],w=!0)},p(e,[n]){e[7]?v?v.p(e,n):(v=_(e),v.c(),v.m(t,i)):v&&(v.d(1),v=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,I=x(M,[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&&f(t),v&&v.d(),w=!1,z($)}}}function A(e){return`${e}`}function k(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:x="m"}=t,{iconname:f}=t,{rightalign:z}=t,{min:_}=t,{max:y}=t,{minlength:A}=t,{maxlength:k}=t;const D=M(w());let j=new I;const E=w();$((()=>{E.shadowRoot.querySelector(".mc-text-input").type=n}));return e.$$set=e=>{i(18,t=r(r({},t),v(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,x=e.size),"iconname"in e&&i(7,f=e.iconname),"rightalign"in e&&i(20,z=e.rightalign),"min"in e&&i(8,_=e.min),"max"in e&&i(9,y=e.max),"minlength"in e&&i(10,A=e.minlength),"maxlength"in e&&i(11,k=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=v(t),[h,a,c,d,u,g,x,f,_,y,A,k,l,m,D,j,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&&j.dispatch("submit-search",h)}]}class D 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;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMS41cmVtIiB3aWR0aD0iMS41cmVtIiBmaWxsPSIjNDZhNjEwIiB2aWV3Qm94PSIwIDAgMjQgMjQiPjxwYXRoIGQ9Ik0xMiA0YTggOCAwIDExLTggOCA4IDggMCAwMTgtOG0wLTJhMTAgMTAgMCAxMDEwIDEwQTEwIDEwIDAgMDAxMiAyeiIvPjxwYXRoIGQ9Ik0xMC43MyAxNS43NWExIDEgMCAwMS0uNjgtLjI2bC0zLTIuNzRhMSAxIDAgMDExLjM2LTEuNDdsMi4yNSAyLjA4IDQuMzYtNC40MmExIDEgMCAxMTEuNDIgMS40MWwtNSA1LjFhMSAxIDAgMDEtLjcxLjN6Ii8+PC9zdmc+")}.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;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMS41cmVtIiB3aWR0aD0iMS41cmVtIiB2aWV3Qm94PSIwIDAgMjQgMjQiIGZpbGw9IiNjNjExMTIiPjxwYXRoIGQ9Ik0xMiAyYTEwIDEwIDAgMTAxMCAxMEExMCAxMCAwIDAwMTIgMnptMCAxOGE4IDggMCAxMTgtOCA4IDggMCAwMS04IDh6Ii8+PHBhdGggZD0iTTEyIDdhMSAxIDAgMDAtMSAxdjQuMzhhMSAxIDAgMDAyIDBWOGExIDEgMCAwMC0xLTF6Ii8+PGNpcmNsZSBjeD0iMTIiIGN5PSIxNiIgcj0iMSIvPjwvc3ZnPg==")}.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(r),t(this,{target:this.shadowRoot,props:i(this.attributes),customElement:!0},k,y,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{D 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":[],"mappings":"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"}
+{"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"}