import { S as SvelteComponent, i as init, s as safe_not_equal, e as element, c as create_component, b as attr, d as toggle_class, f as insert, m as mount_component, j as transition_in, k as transition_out, n as detach, o as destroy_component, A as empty, C as group_outros, D as check_outros, E as createEventDispatcher, V as getContext, O as component_subscribe, a9 as onMount, a6 as tick, p as create_slot, u as update_slot_base, q as get_all_dirty_from_scope, r as get_slot_changes, J as bubble } from './index.4872dbae.js';
import { a as TABS } from './Tabs.4e472f72.js';
import { C as Column } from './Column.9013c6da.js';
import './styles.c72835fa.js';

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

function create_if_block(ctx) {
	let div;
	let column;
	let current;

	column = new Column({
			props: {
				$$slots: { default: [create_default_slot$1] },
				$$scope: { ctx }
			}
		});

	return {
		c() {
			div = element("div");
			create_component(column.$$.fragment);
			attr(div, "id", /*elem_id*/ ctx[0]);
			attr(div, "class", "tabitem p-2 border-2 border-t-0 border-gray-200 relative flex");
			toggle_class(div, "!hidden", !/*visible*/ ctx[1]);
		},
		m(target, anchor) {
			insert(target, div, anchor);
			mount_component(column, div, null);
			current = true;
		},
		p(ctx, dirty) {
			const column_changes = {};

			if (dirty & /*$$scope*/ 128) {
				column_changes.$$scope = { dirty, ctx };
			}

			column.$set(column_changes);

			if (!current || dirty & /*elem_id*/ 1) {
				attr(div, "id", /*elem_id*/ ctx[0]);
			}

			if (dirty & /*visible*/ 2) {
				toggle_class(div, "!hidden", !/*visible*/ ctx[1]);
			}
		},
		i(local) {
			if (current) return;
			transition_in(column.$$.fragment, local);
			current = true;
		},
		o(local) {
			transition_out(column.$$.fragment, local);
			current = false;
		},
		d(detaching) {
			if (detaching) detach(div);
			destroy_component(column);
		}
	};
}

// (23:2) <Column>
function create_default_slot$1(ctx) {
	let current;
	const default_slot_template = /*#slots*/ ctx[6].default;
	const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[7], null);

	return {
		c() {
			if (default_slot) default_slot.c();
		},
		m(target, anchor) {
			if (default_slot) {
				default_slot.m(target, anchor);
			}

			current = true;
		},
		p(ctx, dirty) {
			if (default_slot) {
				if (default_slot.p && (!current || dirty & /*$$scope*/ 128)) {
					update_slot_base(
						default_slot,
						default_slot_template,
						ctx,
						/*$$scope*/ ctx[7],
						!current
						? get_all_dirty_from_scope(/*$$scope*/ ctx[7])
						: get_slot_changes(default_slot_template, /*$$scope*/ ctx[7], dirty, null),
						null
					);
				}
			}
		},
		i(local) {
			if (current) return;
			transition_in(default_slot, local);
			current = true;
		},
		o(local) {
			transition_out(default_slot, local);
			current = false;
		},
		d(detaching) {
			if (default_slot) default_slot.d(detaching);
		}
	};
}

function create_fragment$1(ctx) {
	let if_block_anchor;
	let current;
	let if_block = /*$selected_tab*/ ctx[3] === /*id*/ ctx[2] && create_if_block(ctx);

	return {
		c() {
			if (if_block) if_block.c();
			if_block_anchor = empty();
		},
		m(target, anchor) {
			if (if_block) if_block.m(target, anchor);
			insert(target, if_block_anchor, anchor);
			current = true;
		},
		p(ctx, [dirty]) {
			if (/*$selected_tab*/ ctx[3] === /*id*/ ctx[2]) {
				if (if_block) {
					if_block.p(ctx, dirty);

					if (dirty & /*$selected_tab, id*/ 12) {
						transition_in(if_block, 1);
					}
				} else {
					if_block = create_if_block(ctx);
					if_block.c();
					transition_in(if_block, 1);
					if_block.m(if_block_anchor.parentNode, if_block_anchor);
				}
			} else if (if_block) {
				group_outros();

				transition_out(if_block, 1, 1, () => {
					if_block = null;
				});

				check_outros();
			}
		},
		i(local) {
			if (current) return;
			transition_in(if_block);
			current = true;
		},
		o(local) {
			transition_out(if_block);
			current = false;
		},
		d(detaching) {
			if (if_block) if_block.d(detaching);
			if (detaching) detach(if_block_anchor);
		}
	};
}

function instance$1($$self, $$props, $$invalidate) {
	let $selected_tab;
	let { $$slots: slots = {}, $$scope } = $$props;
	let { elem_id = "" } = $$props;
	let { visible = true } = $$props;
	let { name } = $$props;
	let { id = {} } = $$props;
	const dispatch = createEventDispatcher();
	const { register_tab, unregister_tab, selected_tab } = getContext(TABS);
	component_subscribe($$self, selected_tab, value => $$invalidate(3, $selected_tab = value));
	register_tab({ name, id });

	onMount(() => {
		return () => unregister_tab({ name, id });
	});

	$$self.$$set = $$props => {
		if ('elem_id' in $$props) $$invalidate(0, elem_id = $$props.elem_id);
		if ('visible' in $$props) $$invalidate(1, visible = $$props.visible);
		if ('name' in $$props) $$invalidate(5, name = $$props.name);
		if ('id' in $$props) $$invalidate(2, id = $$props.id);
		if ('$$scope' in $$props) $$invalidate(7, $$scope = $$props.$$scope);
	};

	$$self.$$.update = () => {
		if ($$self.$$.dirty & /*$selected_tab, id*/ 12) {
			$selected_tab === id && tick().then(() => dispatch("select"));
		}
	};

	return [elem_id, visible, id, $selected_tab, selected_tab, name, slots, $$scope];
}

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

/* src/components/TabItem/Tabs.svelte generated by Svelte v3.49.0 */

function create_default_slot(ctx) {
	let current;
	const default_slot_template = /*#slots*/ ctx[4].default;
	const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[6], null);

	return {
		c() {
			if (default_slot) default_slot.c();
		},
		m(target, anchor) {
			if (default_slot) {
				default_slot.m(target, anchor);
			}

			current = true;
		},
		p(ctx, dirty) {
			if (default_slot) {
				if (default_slot.p && (!current || dirty & /*$$scope*/ 64)) {
					update_slot_base(
						default_slot,
						default_slot_template,
						ctx,
						/*$$scope*/ ctx[6],
						!current
						? get_all_dirty_from_scope(/*$$scope*/ ctx[6])
						: get_slot_changes(default_slot_template, /*$$scope*/ ctx[6], dirty, null),
						null
					);
				}
			}
		},
		i(local) {
			if (current) return;
			transition_in(default_slot, local);
			current = true;
		},
		o(local) {
			transition_out(default_slot, local);
			current = false;
		},
		d(detaching) {
			if (default_slot) default_slot.d(detaching);
		}
	};
}

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

	tabitem = new TabItem({
			props: {
				elem_id: /*elem_id*/ ctx[0],
				visible: /*visible*/ ctx[1],
				name: /*label*/ ctx[2],
				id: /*id*/ ctx[3],
				$$slots: { default: [create_default_slot] },
				$$scope: { ctx }
			}
		});

	tabitem.$on("select", /*select_handler*/ ctx[5]);

	return {
		c() {
			create_component(tabitem.$$.fragment);
		},
		m(target, anchor) {
			mount_component(tabitem, target, anchor);
			current = true;
		},
		p(ctx, [dirty]) {
			const tabitem_changes = {};
			if (dirty & /*elem_id*/ 1) tabitem_changes.elem_id = /*elem_id*/ ctx[0];
			if (dirty & /*visible*/ 2) tabitem_changes.visible = /*visible*/ ctx[1];
			if (dirty & /*label*/ 4) tabitem_changes.name = /*label*/ ctx[2];
			if (dirty & /*id*/ 8) tabitem_changes.id = /*id*/ ctx[3];

			if (dirty & /*$$scope*/ 64) {
				tabitem_changes.$$scope = { dirty, ctx };
			}

			tabitem.$set(tabitem_changes);
		},
		i(local) {
			if (current) return;
			transition_in(tabitem.$$.fragment, local);
			current = true;
		},
		o(local) {
			transition_out(tabitem.$$.fragment, local);
			current = false;
		},
		d(detaching) {
			destroy_component(tabitem, detaching);
		}
	};
}

function instance($$self, $$props, $$invalidate) {
	let { $$slots: slots = {}, $$scope } = $$props;
	let { elem_id = "" } = $$props;
	let { visible = true } = $$props;
	let { label } = $$props;
	let { id } = $$props;

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

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

	return [elem_id, visible, label, id, slots, select_handler, $$scope];
}

class Tabs extends SvelteComponent {
	constructor(options) {
		super();
		init(this, options, instance, create_fragment, safe_not_equal, { elem_id: 0, visible: 1, label: 2, id: 3 });
	}
}

var Tabs$1 = Tabs;

const modes = ["static"];

export { Tabs$1 as Component, modes };
