import { S as SvelteComponent, i as init, s as safe_not_equal, e as element, b as attr, d as toggle_class, f as insert, w as noop, n as detach, E as createEventDispatcher, c as create_component, m as mount_component, j as transition_in, k as transition_out, o as destroy_component, J as bubble } from './index.b2f2b9fa.js';

/* home/runner/work/gradio/gradio/ui/packages/html/src/HTML.svelte generated by Svelte v3.49.0 */

function create_fragment$1(ctx) {
	let div;

	return {
		c() {
			div = element("div");
			attr(div, "class", "output-html");
			attr(div, "id", /*elem_id*/ ctx[0]);
			toggle_class(div, "!hidden", !/*visible*/ ctx[2]);
		},
		m(target, anchor) {
			insert(target, div, anchor);
			div.innerHTML = /*value*/ ctx[1];
		},
		p(ctx, [dirty]) {
			if (dirty & /*value*/ 2) div.innerHTML = /*value*/ ctx[1];
			if (dirty & /*elem_id*/ 1) {
				attr(div, "id", /*elem_id*/ ctx[0]);
			}

			if (dirty & /*visible*/ 4) {
				toggle_class(div, "!hidden", !/*visible*/ ctx[2]);
			}
		},
		i: noop,
		o: noop,
		d(detaching) {
			if (detaching) detach(div);
		}
	};
}

function instance$1($$self, $$props, $$invalidate) {
	let { elem_id = "" } = $$props;
	let { value } = $$props;
	let { visible = true } = $$props;
	const dispatch = createEventDispatcher();

	$$self.$$set = $$props => {
		if ('elem_id' in $$props) $$invalidate(0, elem_id = $$props.elem_id);
		if ('value' in $$props) $$invalidate(1, value = $$props.value);
		if ('visible' in $$props) $$invalidate(2, visible = $$props.visible);
	};

	$$self.$$.update = () => {
		if ($$self.$$.dirty & /*value*/ 2) {
			(dispatch("change"));
		}
	};

	return [elem_id, value, visible];
}

class HTML extends SvelteComponent {
	constructor(options) {
		super();
		init(this, options, instance$1, create_fragment$1, safe_not_equal, { elem_id: 0, value: 1, visible: 2 });
	}
}

/* src/components/HTML/HTML.svelte generated by Svelte v3.49.0 */

function create_fragment(ctx) {
	let html;
	let current;

	html = new HTML({
			props: {
				value: /*value*/ ctx[2],
				elem_id: /*elem_id*/ ctx[0],
				visible: /*visible*/ ctx[1]
			}
		});

	html.$on("change", /*change_handler*/ ctx[4]);

	return {
		c() {
			create_component(html.$$.fragment);
		},
		m(target, anchor) {
			mount_component(html, target, anchor);
			current = true;
		},
		p(ctx, [dirty]) {
			const html_changes = {};
			if (dirty & /*value*/ 4) html_changes.value = /*value*/ ctx[2];
			if (dirty & /*elem_id*/ 1) html_changes.elem_id = /*elem_id*/ ctx[0];
			if (dirty & /*visible*/ 2) html_changes.visible = /*visible*/ ctx[1];
			html.$set(html_changes);
		},
		i(local) {
			if (current) return;
			transition_in(html.$$.fragment, local);
			current = true;
		},
		o(local) {
			transition_out(html.$$.fragment, local);
			current = false;
		},
		d(detaching) {
			destroy_component(html, detaching);
		}
	};
}

function instance($$self, $$props, $$invalidate) {
	let { label } = $$props;
	let { elem_id = "" } = $$props;
	let { visible = true } = $$props;
	let { value = "" } = $$props;
	const dispatch = createEventDispatcher();

	function change_handler(event) {
		bubble.call(this, $$self, event);
	}

	$$self.$$set = $$props => {
		if ('label' in $$props) $$invalidate(3, label = $$props.label);
		if ('elem_id' in $$props) $$invalidate(0, elem_id = $$props.elem_id);
		if ('visible' in $$props) $$invalidate(1, visible = $$props.visible);
		if ('value' in $$props) $$invalidate(2, value = $$props.value);
	};

	$$self.$$.update = () => {
		if ($$self.$$.dirty & /*label*/ 8) {
			(dispatch("change"));
		}
	};

	return [elem_id, visible, value, label, change_handler];
}

class HTML_1 extends SvelteComponent {
	constructor(options) {
		super();

		init(this, options, instance, create_fragment, safe_not_equal, {
			label: 3,
			elem_id: 0,
			visible: 1,
			value: 2
		});
	}
}

var HTML_1$1 = HTML_1;

const modes = ["static"];

export { HTML_1$1 as Component, modes };
