@mozaic-ds/web-components 0.5.0 → 0.6.0

package/public/components/tabs/Tabs.nested.js

@@ -1,473 +1,2 @@
-import { P as SvelteComponent, i as init, s as safe_not_equal, Q as append_styles, e as element, g as attr, b as insert, j as append, n as noop, o as detach, J as destroy_each, d as space, v as binding_callbacks, t as text, R as null_to_empty, l as listen, k as set_data, K as empty } from '../../index-c33b3772.js';
-import { E as EventHandler } from '../../EventHandler-02058705.js';
-
-/* src/components/tabs/Tabs.nested.svelte generated by Svelte v3.58.0 */
-
-function add_css(target) {
-	append_styles(target, "svelte-1ygf0po", ".mc-tabs.svelte-1ygf0po.svelte-1ygf0po{font-family:\"LeroyMerlin\", sans-serif;font-weight:400;background-color:#ffffff;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;position:relative;width:100%}.mc-tabs.svelte-1ygf0po.svelte-1ygf0po::after{background:#b3b3b3;content:\"\";display:block;margin:0 auto;height:1px;width:100%;bottom:0;left:0;position:absolute}.mc-tabs--no-shadow.svelte-1ygf0po.svelte-1ygf0po::after,.mc-tabs--no-divider.svelte-1ygf0po.svelte-1ygf0po::after{display:none}.mc-tabs__nav.svelte-1ygf0po.svelte-1ygf0po{list-style:none;margin-left:0;padding-left:0;display:-webkit-box;display:-ms-flexbox;display:flex;margin-top:0;margin-bottom:0}.mc-tabs__nav.svelte-1ygf0po.svelte-1ygf0po,.mc-tabs__select.svelte-1ygf0po.svelte-1ygf0po{position:relative}.mc-tabs__link.svelte-1ygf0po.svelte-1ygf0po,.mc-tabs__element.svelte-1ygf0po.svelte-1ygf0po{font-size:0.875rem;line-height:1.2857142857;font-weight:600;position:relative;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:none;border:none;color:#666666;cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;height:3.5rem;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;outline:none;padding-left:0.75rem;padding-right:0.75rem;position:relative;text-decoration:none}.mc-tabs__link.svelte-1ygf0po.svelte-1ygf0po::before,.mc-tabs__element.svelte-1ygf0po.svelte-1ygf0po::before{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:\"\";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-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;bottom:-0.125rem;top:-0.125rem}.mc-tabs__link.svelte-1ygf0po.svelte-1ygf0po::after,.mc-tabs__element.svelte-1ygf0po.svelte-1ygf0po::after{background-color:transparent;bottom:0;content:\"\";height:0.25rem;left:1.5rem;position:absolute;right:1.5rem}.mc-tabs__link.svelte-1ygf0po:hover .mc-tabs__text.svelte-1ygf0po,.mc-tabs__element.svelte-1ygf0po:hover .mc-tabs__text.svelte-1ygf0po{background-color:#eeeff1}.mc-tabs__link.svelte-1ygf0po.svelte-1ygf0po:active,.mc-tabs__element.svelte-1ygf0po.svelte-1ygf0po:active{color:#333333}.mc-tabs__link.svelte-1ygf0po:active .mc-tabs__text.svelte-1ygf0po,.mc-tabs__element.svelte-1ygf0po:active .mc-tabs__text.svelte-1ygf0po{background-color:#cfd2d8}.mc-tabs__link.svelte-1ygf0po.svelte-1ygf0po:focus::before,.mc-tabs__element.svelte-1ygf0po.svelte-1ygf0po:focus::before{-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-tabs__link--selected.svelte-1ygf0po.svelte-1ygf0po,.mc-tabs__element--selected.svelte-1ygf0po.svelte-1ygf0po{color:#000000}.mc-tabs__link--selected.svelte-1ygf0po.svelte-1ygf0po::after,.mc-tabs__element--selected.svelte-1ygf0po.svelte-1ygf0po::after{background-color:#000000}.mc-tabs__link--disabled.svelte-1ygf0po.svelte-1ygf0po,.mc-tabs__element--disabled.svelte-1ygf0po.svelte-1ygf0po{cursor:not-allowed;background-color:#cccccc;pointer-events:none}.mc-tabs__link--disabled.svelte-1ygf0po.svelte-1ygf0po,.mc-tabs__link--disabled.svelte-1ygf0po.svelte-1ygf0po:hover,.mc-tabs__link--disabled.svelte-1ygf0po.svelte-1ygf0po:focus,.mc-tabs__link--disabled.svelte-1ygf0po.svelte-1ygf0po:active,.mc-tabs__element--disabled.svelte-1ygf0po.svelte-1ygf0po,.mc-tabs__element--disabled.svelte-1ygf0po.svelte-1ygf0po:hover,.mc-tabs__element--disabled.svelte-1ygf0po.svelte-1ygf0po:focus,.mc-tabs__element--disabled.svelte-1ygf0po.svelte-1ygf0po:active{-webkit-box-shadow:none;box-shadow:none}.mc-tabs__text.svelte-1ygf0po.svelte-1ygf0po{-webkit-box-align:center;-ms-flex-align:center;align-items:center;border-radius:0.25rem;display:-webkit-box;display:-ms-flexbox;display:flex;gap:0.25rem;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:relative;padding:0.4375rem 0.75rem;pointer-events:none}.mc-tabs__icon.svelte-1ygf0po.svelte-1ygf0po{fill:currentColor;height:1.5rem;width:1.5rem}.mc-tabs--full-centered.svelte-1ygf0po.svelte-1ygf0po{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.mc-tabs--dropdown.svelte-1ygf0po.svelte-1ygf0po{padding:1rem;width:auto}@media screen and (min-width: 680px){.mc-tabs.svelte-1ygf0po.svelte-1ygf0po{width:auto}.mc-tabs--full.svelte-1ygf0po.svelte-1ygf0po,.mc-tabs--full-centered.svelte-1ygf0po.svelte-1ygf0po{width:100%}}@media screen and (max-width: 679px){.mc-tabs.svelte-1ygf0po.svelte-1ygf0po:not(.mc-tabs--dropdown)::before{bottom:0.125rem}.mc-tabs__nav.svelte-1ygf0po.svelte-1ygf0po{overflow:auto hidden;white-space:nowrap}}");
-}
-
-function get_each_context(ctx, list, i) {
-	const child_ctx = ctx.slice();
-	child_ctx[12] = list[i];
-	child_ctx[14] = i;
-	return child_ctx;
-}
-
-// (75:8) {:else}
-function create_else_block_1(ctx) {
-	let button;
-	let span;
-	let t_value = /*tab*/ ctx[12].text + "";
-	let t;
-	let button_class_value;
-	let button_id_value;
-	let button_disabled_value;
-	let button_aria_selected_value;
-	let mounted;
-	let dispose;
-
-	function click_handler_1(...args) {
-		return /*click_handler_1*/ ctx[9](/*index*/ ctx[14], /*tab*/ ctx[12], ...args);
-	}
-
-	return {
-		c() {
-			button = element("button");
-			span = element("span");
-			t = text(t_value);
-			attr(span, "class", "mc-tabs__text svelte-1ygf0po");
-			attr(button, "role", "tab");
-			attr(button, "type", "button");
-			attr(button, "class", button_class_value = "" + (null_to_empty(setActiveClass(/*tab*/ ctx[12])) + " svelte-1ygf0po"));
-			attr(button, "id", button_id_value = /*tab*/ ctx[12].id);
-			button.disabled = button_disabled_value = /*tab*/ ctx[12].disabled;
-			attr(button, "aria-selected", button_aria_selected_value = /*tab*/ ctx[12].isActive ? 'true' : 'false');
-		},
-		m(target, anchor) {
-			insert(target, button, anchor);
-			append(button, span);
-			append(span, t);
-
-			if (!mounted) {
-				dispose = listen(button, "click", click_handler_1);
-				mounted = true;
-			}
-		},
-		p(new_ctx, dirty) {
-			ctx = new_ctx;
-			if (dirty & /*parsedTabs*/ 32 && t_value !== (t_value = /*tab*/ ctx[12].text + "")) set_data(t, t_value);
-
-			if (dirty & /*parsedTabs*/ 32 && button_class_value !== (button_class_value = "" + (null_to_empty(setActiveClass(/*tab*/ ctx[12])) + " svelte-1ygf0po"))) {
-				attr(button, "class", button_class_value);
-			}
-
-			if (dirty & /*parsedTabs*/ 32 && button_id_value !== (button_id_value = /*tab*/ ctx[12].id)) {
-				attr(button, "id", button_id_value);
-			}
-
-			if (dirty & /*parsedTabs*/ 32 && button_disabled_value !== (button_disabled_value = /*tab*/ ctx[12].disabled)) {
-				button.disabled = button_disabled_value;
-			}
-
-			if (dirty & /*parsedTabs*/ 32 && button_aria_selected_value !== (button_aria_selected_value = /*tab*/ ctx[12].isActive ? 'true' : 'false')) {
-				attr(button, "aria-selected", button_aria_selected_value);
-			}
-		},
-		d(detaching) {
-			if (detaching) detach(button);
-			mounted = false;
-			dispose();
-		}
-	};
-}
-
-// (48:8) {#if tab.href}
-function create_if_block(ctx) {
-	let if_block_anchor;
-
-	function select_block_type_1(ctx, dirty) {
-		if (!/*tab*/ ctx[12].disabled) return create_if_block_1;
-		return create_else_block;
-	}
-
-	let current_block_type = select_block_type_1(ctx);
-	let if_block = current_block_type(ctx);
-
-	return {
-		c() {
-			if_block.c();
-			if_block_anchor = empty();
-		},
-		m(target, anchor) {
-			if_block.m(target, anchor);
-			insert(target, if_block_anchor, anchor);
-		},
-		p(ctx, dirty) {
-			if (current_block_type === (current_block_type = select_block_type_1(ctx)) && if_block) {
-				if_block.p(ctx, dirty);
-			} else {
-				if_block.d(1);
-				if_block = current_block_type(ctx);
-
-				if (if_block) {
-					if_block.c();
-					if_block.m(if_block_anchor.parentNode, if_block_anchor);
-				}
-			}
-		},
-		d(detaching) {
-			if_block.d(detaching);
-			if (detaching) detach(if_block_anchor);
-		}
-	};
-}
-
-// (63:10) {:else}
-function create_else_block(ctx) {
-	let span1;
-	let span0;
-	let t_value = /*tab*/ ctx[12].text + "";
-	let t;
-	let span1_class_value;
-	let span1_id_value;
-	let span1_aria_selected_value;
-
-	return {
-		c() {
-			span1 = element("span");
-			span0 = element("span");
-			t = text(t_value);
-			attr(span0, "class", "mc-tabs__text svelte-1ygf0po");
-			attr(span1, "role", "tab");
-			attr(span1, "class", span1_class_value = "" + (null_to_empty(setActiveClass(/*tab*/ ctx[12])) + " svelte-1ygf0po"));
-			attr(span1, "id", span1_id_value = /*tab*/ ctx[12].id);
-			attr(span1, "aria-selected", span1_aria_selected_value = /*tab*/ ctx[12].isActive ? 'true' : 'false');
-		},
-		m(target, anchor) {
-			insert(target, span1, anchor);
-			append(span1, span0);
-			append(span0, t);
-		},
-		p(ctx, dirty) {
-			if (dirty & /*parsedTabs*/ 32 && t_value !== (t_value = /*tab*/ ctx[12].text + "")) set_data(t, t_value);
-
-			if (dirty & /*parsedTabs*/ 32 && span1_class_value !== (span1_class_value = "" + (null_to_empty(setActiveClass(/*tab*/ ctx[12])) + " svelte-1ygf0po"))) {
-				attr(span1, "class", span1_class_value);
-			}
-
-			if (dirty & /*parsedTabs*/ 32 && span1_id_value !== (span1_id_value = /*tab*/ ctx[12].id)) {
-				attr(span1, "id", span1_id_value);
-			}
-
-			if (dirty & /*parsedTabs*/ 32 && span1_aria_selected_value !== (span1_aria_selected_value = /*tab*/ ctx[12].isActive ? 'true' : 'false')) {
-				attr(span1, "aria-selected", span1_aria_selected_value);
-			}
-		},
-		d(detaching) {
-			if (detaching) detach(span1);
-		}
-	};
-}
-
-// (49:10) {#if !tab.disabled}
-function create_if_block_1(ctx) {
-	let a;
-	let span;
-	let t_value = /*tab*/ ctx[12].text + "";
-	let t;
-	let a_href_value;
-	let a_class_value;
-	let a_id_value;
-	let a_aria_selected_value;
-	let mounted;
-	let dispose;
-
-	function click_handler(...args) {
-		return /*click_handler*/ ctx[8](/*index*/ ctx[14], /*tab*/ ctx[12], ...args);
-	}
-
-	return {
-		c() {
-			a = element("a");
-			span = element("span");
-			t = text(t_value);
-			attr(span, "class", "mc-tabs__text svelte-1ygf0po");
-			attr(a, "href", a_href_value = /*tab*/ ctx[12].href);
-			attr(a, "role", "tab");
-			attr(a, "class", a_class_value = "" + (null_to_empty(setActiveClass(/*tab*/ ctx[12])) + " svelte-1ygf0po"));
-			attr(a, "id", a_id_value = /*tab*/ ctx[12].id);
-			attr(a, "aria-selected", a_aria_selected_value = /*tab*/ ctx[12].isActive ? 'true' : 'false');
-		},
-		m(target, anchor) {
-			insert(target, a, anchor);
-			append(a, span);
-			append(span, t);
-
-			if (!mounted) {
-				dispose = listen(a, "click", click_handler);
-				mounted = true;
-			}
-		},
-		p(new_ctx, dirty) {
-			ctx = new_ctx;
-			if (dirty & /*parsedTabs*/ 32 && t_value !== (t_value = /*tab*/ ctx[12].text + "")) set_data(t, t_value);
-
-			if (dirty & /*parsedTabs*/ 32 && a_href_value !== (a_href_value = /*tab*/ ctx[12].href)) {
-				attr(a, "href", a_href_value);
-			}
-
-			if (dirty & /*parsedTabs*/ 32 && a_class_value !== (a_class_value = "" + (null_to_empty(setActiveClass(/*tab*/ ctx[12])) + " svelte-1ygf0po"))) {
-				attr(a, "class", a_class_value);
-			}
-
-			if (dirty & /*parsedTabs*/ 32 && a_id_value !== (a_id_value = /*tab*/ ctx[12].id)) {
-				attr(a, "id", a_id_value);
-			}
-
-			if (dirty & /*parsedTabs*/ 32 && a_aria_selected_value !== (a_aria_selected_value = /*tab*/ ctx[12].isActive ? 'true' : 'false')) {
-				attr(a, "aria-selected", a_aria_selected_value);
-			}
-		},
-		d(detaching) {
-			if (detaching) detach(a);
-			mounted = false;
-			dispose();
-		}
-	};
-}
-
-// (46:4) {#each parsedTabs as tab, index}
-function create_each_block(ctx) {
-	let li;
-	let t;
-
-	function select_block_type(ctx, dirty) {
-		if (/*tab*/ ctx[12].href) return create_if_block;
-		return create_else_block_1;
-	}
-
-	let current_block_type = select_block_type(ctx);
-	let if_block = current_block_type(ctx);
-
-	return {
-		c() {
-			li = element("li");
-			if_block.c();
-			t = space();
-			attr(li, "class", "mc-tabs__item");
-			attr(li, "role", "presentation");
-		},
-		m(target, anchor) {
-			insert(target, li, anchor);
-			if_block.m(li, null);
-			append(li, t);
-		},
-		p(ctx, dirty) {
-			if (current_block_type === (current_block_type = select_block_type(ctx)) && if_block) {
-				if_block.p(ctx, dirty);
-			} else {
-				if_block.d(1);
-				if_block = current_block_type(ctx);
-
-				if (if_block) {
-					if_block.c();
-					if_block.m(li, t);
-				}
-			}
-		},
-		d(detaching) {
-			if (detaching) detach(li);
-			if_block.d();
-		}
-	};
-}
-
-function create_fragment(ctx) {
-	let div;
-	let ul;
-	let div_class_value;
-	let each_value = /*parsedTabs*/ ctx[5];
-	let each_blocks = [];
-
-	for (let i = 0; i < each_value.length; i += 1) {
-		each_blocks[i] = create_each_block(get_each_context(ctx, each_value, i));
-	}
-
-	return {
-		c() {
-			div = element("div");
-			ul = element("ul");
-
-			for (let i = 0; i < each_blocks.length; i += 1) {
-				each_blocks[i].c();
-			}
-
-			attr(ul, "class", "mc-tabs__nav svelte-1ygf0po");
-			attr(ul, "role", "tablist");
-			attr(ul, "aria-label", /*description*/ ctx[1]);
-
-			attr(div, "class", div_class_value = "mc-tabs " + (/*align*/ ctx[0] && /*align*/ ctx[0] === 'full'
-			? ' mc-tabs--full'
-			: '') + " " + (/*align*/ ctx[0] && /*align*/ ctx[0] === 'centered'
-			? ' mc-tabs--full-centered'
-			: '') + " " + (/*type*/ ctx[3] ? ` mc-tabs--${/*type*/ ctx[3]}` : '') + (/*nodivider*/ ctx[2] ? ' mc-tabs--no-divider' : '') + " svelte-1ygf0po");
-		},
-		m(target, anchor) {
-			insert(target, div, anchor);
-			append(div, ul);
-
-			for (let i = 0; i < each_blocks.length; i += 1) {
-				if (each_blocks[i]) {
-					each_blocks[i].m(ul, null);
-				}
-			}
-
-			/*ul_binding*/ ctx[10](ul);
-		},
-		p(ctx, [dirty]) {
-			if (dirty & /*parsedTabs, setActiveClass, manageTabs, Object*/ 96) {
-				each_value = /*parsedTabs*/ ctx[5];
-				let i;
-
-				for (i = 0; i < each_value.length; i += 1) {
-					const child_ctx = get_each_context(ctx, each_value, i);
-
-					if (each_blocks[i]) {
-						each_blocks[i].p(child_ctx, dirty);
-					} else {
-						each_blocks[i] = create_each_block(child_ctx);
-						each_blocks[i].c();
-						each_blocks[i].m(ul, null);
-					}
-				}
-
-				for (; i < each_blocks.length; i += 1) {
-					each_blocks[i].d(1);
-				}
-
-				each_blocks.length = each_value.length;
-			}
-
-			if (dirty & /*description*/ 2) {
-				attr(ul, "aria-label", /*description*/ ctx[1]);
-			}
-
-			if (dirty & /*align, type, nodivider*/ 13 && div_class_value !== (div_class_value = "mc-tabs " + (/*align*/ ctx[0] && /*align*/ ctx[0] === 'full'
-			? ' mc-tabs--full'
-			: '') + " " + (/*align*/ ctx[0] && /*align*/ ctx[0] === 'centered'
-			? ' mc-tabs--full-centered'
-			: '') + " " + (/*type*/ ctx[3] ? ` mc-tabs--${/*type*/ ctx[3]}` : '') + (/*nodivider*/ ctx[2] ? ' mc-tabs--no-divider' : '') + " svelte-1ygf0po")) {
-				attr(div, "class", div_class_value);
-			}
-		},
-		i: noop,
-		o: noop,
-		d(detaching) {
-			if (detaching) detach(div);
-			destroy_each(each_blocks, detaching);
-			/*ul_binding*/ ctx[10](null);
-		}
-	};
-}
-
-function setActiveClass(tab) {
-	const tabClasses = ['mc-tabs__element'];
-
-	if (tab.isActive) {
-		tabClasses.push('mc-tabs__element--selected');
-	}
-
-	if (tab.disabled) {
-		tabClasses.push('mc-tabs__element--disabled');
-	}
-
-	return tabClasses.join(' ');
-}
-
-function instance($$self, $$props, $$invalidate) {
-	let parsedTabs;
-	let { align = 'auto' } = $$props;
-	let { description = 'Tabs' } = $$props;
-	let { nodivider = false } = $$props;
-	let { tabs } = $$props;
-	let { type = 'tabs' } = $$props;
-	let eventHandler = new EventHandler();
-	let tablist;
-
-	function manageTabs(e, tabItem) {
-		const currentEl = e.target;
-
-		tablist.querySelectorAll('.mc-tabs__element').forEach(el => {
-			el.classList.remove('mc-tabs__element--selected');
-			el.setAttribute('aria-selected', 'false');
-		});
-
-		currentEl.classList.add('mc-tabs__element--selected');
-		currentEl.setAttribute('aria-selected', 'true');
-		eventHandler.dispatch('tab-clicked', Object.assign(tabItem, { target: currentEl }));
-	}
-
-	const click_handler = (index, tab, event) => manageTabs(event, Object.assign({ index }, tab));
-	const click_handler_1 = (index, tab, event) => manageTabs(event, Object.assign({ index }, tab));
-
-	function ul_binding($$value) {
-		binding_callbacks[$$value ? 'unshift' : 'push'](() => {
-			tablist = $$value;
-			$$invalidate(4, tablist);
-		});
-	}
-
-	$$self.$$set = $$props => {
-		if ('align' in $$props) $$invalidate(0, align = $$props.align);
-		if ('description' in $$props) $$invalidate(1, description = $$props.description);
-		if ('nodivider' in $$props) $$invalidate(2, nodivider = $$props.nodivider);
-		if ('tabs' in $$props) $$invalidate(7, tabs = $$props.tabs);
-		if ('type' in $$props) $$invalidate(3, type = $$props.type);
-	};
-
-	$$self.$$.update = () => {
-		if ($$self.$$.dirty & /*tabs*/ 128) {
-			$$invalidate(5, parsedTabs = tabs ? JSON.parse(tabs) : []);
-		}
-	};
-
-	return [
-		align,
-		description,
-		nodivider,
-		type,
-		tablist,
-		parsedTabs,
-		manageTabs,
-		tabs,
-		click_handler,
-		click_handler_1,
-		ul_binding
-	];
-}
-
-class Tabs_nested extends SvelteComponent {
-	constructor(options) {
-		super();
-
-		init(
-			this,
-			options,
-			instance,
-			create_fragment,
-			safe_not_equal,
-			{
-				align: 0,
-				description: 1,
-				nodivider: 2,
-				tabs: 7,
-				type: 3
-			},
-			add_css
-		);
-	}
-}
-
-export { Tabs_nested as default };
+import{P as e,i as t,s,Q as l,e as o,g as a,b as n,j as i,n as c,o as r,J as f,d as p,v as d,t as b,R as m,l as g,k as v,K as y}from"../../index-c33b3772.js";import{E as _}from"../../EventHandler-02058705.js";function u(e){l(e,"svelte-1ygf0po",'.mc-tabs.svelte-1ygf0po.svelte-1ygf0po{font-family:"LeroyMerlin", sans-serif;font-weight:400;background-color:#ffffff;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;position:relative;width:100%}.mc-tabs.svelte-1ygf0po.svelte-1ygf0po::after{background:#b3b3b3;content:"";display:block;margin:0 auto;height:1px;width:100%;bottom:0;left:0;position:absolute}.mc-tabs--no-shadow.svelte-1ygf0po.svelte-1ygf0po::after,.mc-tabs--no-divider.svelte-1ygf0po.svelte-1ygf0po::after{display:none}.mc-tabs__nav.svelte-1ygf0po.svelte-1ygf0po{list-style:none;margin-left:0;padding-left:0;display:-webkit-box;display:-ms-flexbox;display:flex;margin-top:0;margin-bottom:0}.mc-tabs__nav.svelte-1ygf0po.svelte-1ygf0po,.mc-tabs__select.svelte-1ygf0po.svelte-1ygf0po{position:relative}.mc-tabs__link.svelte-1ygf0po.svelte-1ygf0po,.mc-tabs__element.svelte-1ygf0po.svelte-1ygf0po{font-size:0.875rem;line-height:1.2857142857;font-weight:600;position:relative;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:none;border:none;color:#666666;cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;height:3.5rem;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;outline:none;padding-left:0.75rem;padding-right:0.75rem;position:relative;text-decoration:none}.mc-tabs__link.svelte-1ygf0po.svelte-1ygf0po::before,.mc-tabs__element.svelte-1ygf0po.svelte-1ygf0po::before{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-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;bottom:-0.125rem;top:-0.125rem}.mc-tabs__link.svelte-1ygf0po.svelte-1ygf0po::after,.mc-tabs__element.svelte-1ygf0po.svelte-1ygf0po::after{background-color:transparent;bottom:0;content:"";height:0.25rem;left:1.5rem;position:absolute;right:1.5rem}.mc-tabs__link.svelte-1ygf0po:hover .mc-tabs__text.svelte-1ygf0po,.mc-tabs__element.svelte-1ygf0po:hover .mc-tabs__text.svelte-1ygf0po{background-color:#eeeff1}.mc-tabs__link.svelte-1ygf0po.svelte-1ygf0po:active,.mc-tabs__element.svelte-1ygf0po.svelte-1ygf0po:active{color:#333333}.mc-tabs__link.svelte-1ygf0po:active .mc-tabs__text.svelte-1ygf0po,.mc-tabs__element.svelte-1ygf0po:active .mc-tabs__text.svelte-1ygf0po{background-color:#cfd2d8}.mc-tabs__link.svelte-1ygf0po.svelte-1ygf0po:focus::before,.mc-tabs__element.svelte-1ygf0po.svelte-1ygf0po:focus::before{-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-tabs__link--selected.svelte-1ygf0po.svelte-1ygf0po,.mc-tabs__element--selected.svelte-1ygf0po.svelte-1ygf0po{color:#000000}.mc-tabs__link--selected.svelte-1ygf0po.svelte-1ygf0po::after,.mc-tabs__element--selected.svelte-1ygf0po.svelte-1ygf0po::after{background-color:#000000}.mc-tabs__link--disabled.svelte-1ygf0po.svelte-1ygf0po,.mc-tabs__element--disabled.svelte-1ygf0po.svelte-1ygf0po{cursor:not-allowed;background-color:#cccccc;pointer-events:none}.mc-tabs__link--disabled.svelte-1ygf0po.svelte-1ygf0po,.mc-tabs__link--disabled.svelte-1ygf0po.svelte-1ygf0po:hover,.mc-tabs__link--disabled.svelte-1ygf0po.svelte-1ygf0po:focus,.mc-tabs__link--disabled.svelte-1ygf0po.svelte-1ygf0po:active,.mc-tabs__element--disabled.svelte-1ygf0po.svelte-1ygf0po,.mc-tabs__element--disabled.svelte-1ygf0po.svelte-1ygf0po:hover,.mc-tabs__element--disabled.svelte-1ygf0po.svelte-1ygf0po:focus,.mc-tabs__element--disabled.svelte-1ygf0po.svelte-1ygf0po:active{-webkit-box-shadow:none;box-shadow:none}.mc-tabs__text.svelte-1ygf0po.svelte-1ygf0po{-webkit-box-align:center;-ms-flex-align:center;align-items:center;border-radius:0.25rem;display:-webkit-box;display:-ms-flexbox;display:flex;gap:0.25rem;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:relative;padding:0.4375rem 0.75rem;pointer-events:none}.mc-tabs__icon.svelte-1ygf0po.svelte-1ygf0po{fill:currentColor;height:1.5rem;width:1.5rem}.mc-tabs--full-centered.svelte-1ygf0po.svelte-1ygf0po{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.mc-tabs--dropdown.svelte-1ygf0po.svelte-1ygf0po{padding:1rem;width:auto}@media screen and (min-width: 680px){.mc-tabs.svelte-1ygf0po.svelte-1ygf0po{width:auto}.mc-tabs--full.svelte-1ygf0po.svelte-1ygf0po,.mc-tabs--full-centered.svelte-1ygf0po.svelte-1ygf0po{width:100%}}@media screen and (max-width: 679px){.mc-tabs.svelte-1ygf0po.svelte-1ygf0po:not(.mc-tabs--dropdown)::before{bottom:0.125rem}.mc-tabs__nav.svelte-1ygf0po.svelte-1ygf0po{overflow:auto hidden;white-space:nowrap}}')}function x(e,t,s){const l=e.slice();return l[12]=t[s],l[14]=s,l}function h(e){let t,s,l,c,f,p,d,y,_,u=e[12].text+"";function x(...t){return e[9](e[14],e[12],...t)}return{c(){t=o("button"),s=o("span"),l=b(u),a(s,"class","mc-tabs__text svelte-1ygf0po"),a(t,"role","tab"),a(t,"type","button"),a(t,"class",c=m(O(e[12]))+" svelte-1ygf0po"),a(t,"id",f=e[12].id),t.disabled=p=e[12].disabled,a(t,"aria-selected",d=e[12].isActive?"true":"false")},m(e,o){n(e,t,o),i(t,s),i(s,l),y||(_=g(t,"click",x),y=!0)},p(s,o){e=s,32&o&&u!==(u=e[12].text+"")&&v(l,u),32&o&&c!==(c=m(O(e[12]))+" svelte-1ygf0po")&&a(t,"class",c),32&o&&f!==(f=e[12].id)&&a(t,"id",f),32&o&&p!==(p=e[12].disabled)&&(t.disabled=p),32&o&&d!==(d=e[12].isActive?"true":"false")&&a(t,"aria-selected",d)},d(e){e&&r(t),y=!1,_()}}}function k(e){let t;function s(e,t){return e[12].disabled?w:j}let l=s(e),o=l(e);return{c(){o.c(),t=y()},m(e,s){o.m(e,s),n(e,t,s)},p(e,a){l===(l=s(e))&&o?o.p(e,a):(o.d(1),o=l(e),o&&(o.c(),o.m(t.parentNode,t)))},d(e){o.d(e),e&&r(t)}}}function w(e){let t,s,l,c,f,p,d=e[12].text+"";return{c(){t=o("span"),s=o("span"),l=b(d),a(s,"class","mc-tabs__text svelte-1ygf0po"),a(t,"role","tab"),a(t,"class",c=m(O(e[12]))+" svelte-1ygf0po"),a(t,"id",f=e[12].id),a(t,"aria-selected",p=e[12].isActive?"true":"false")},m(e,o){n(e,t,o),i(t,s),i(s,l)},p(e,s){32&s&&d!==(d=e[12].text+"")&&v(l,d),32&s&&c!==(c=m(O(e[12]))+" svelte-1ygf0po")&&a(t,"class",c),32&s&&f!==(f=e[12].id)&&a(t,"id",f),32&s&&p!==(p=e[12].isActive?"true":"false")&&a(t,"aria-selected",p)},d(e){e&&r(t)}}}function j(e){let t,s,l,c,f,p,d,y,_,u=e[12].text+"";function x(...t){return e[8](e[14],e[12],...t)}return{c(){t=o("a"),s=o("span"),l=b(u),a(s,"class","mc-tabs__text svelte-1ygf0po"),a(t,"href",c=e[12].href),a(t,"role","tab"),a(t,"class",f=m(O(e[12]))+" svelte-1ygf0po"),a(t,"id",p=e[12].id),a(t,"aria-selected",d=e[12].isActive?"true":"false")},m(e,o){n(e,t,o),i(t,s),i(s,l),y||(_=g(t,"click",x),y=!0)},p(s,o){e=s,32&o&&u!==(u=e[12].text+"")&&v(l,u),32&o&&c!==(c=e[12].href)&&a(t,"href",c),32&o&&f!==(f=m(O(e[12]))+" svelte-1ygf0po")&&a(t,"class",f),32&o&&p!==(p=e[12].id)&&a(t,"id",p),32&o&&d!==(d=e[12].isActive?"true":"false")&&a(t,"aria-selected",d)},d(e){e&&r(t),y=!1,_()}}}function A(e){let t,s;function l(e,t){return e[12].href?k:h}let c=l(e),f=c(e);return{c(){t=o("li"),f.c(),s=p(),a(t,"class","mc-tabs__item"),a(t,"role","presentation")},m(e,l){n(e,t,l),f.m(t,null),i(t,s)},p(e,o){c===(c=l(e))&&f?f.p(e,o):(f.d(1),f=c(e),f&&(f.c(),f.m(t,s)))},d(e){e&&r(t),f.d()}}}function $(e){let t,s,l,p=e[5],d=[];for(let t=0;t<p.length;t+=1)d[t]=A(x(e,p,t));return{c(){t=o("div"),s=o("ul");for(let e=0;e<d.length;e+=1)d[e].c();a(s,"class","mc-tabs__nav svelte-1ygf0po"),a(s,"role","tablist"),a(s,"aria-label",e[1]),a(t,"class",l="mc-tabs "+(e[0]&&"full"===e[0]?" mc-tabs--full":"")+" "+(e[0]&&"centered"===e[0]?" mc-tabs--full-centered":"")+" "+(e[3]?` mc-tabs--${e[3]}`:"")+(e[2]?" mc-tabs--no-divider":"")+" svelte-1ygf0po")},m(l,o){n(l,t,o),i(t,s);for(let e=0;e<d.length;e+=1)d[e]&&d[e].m(s,null);e[10](s)},p(e,[o]){if(96&o){let t;for(p=e[5],t=0;t<p.length;t+=1){const l=x(e,p,t);d[t]?d[t].p(l,o):(d[t]=A(l),d[t].c(),d[t].m(s,null))}for(;t<d.length;t+=1)d[t].d(1);d.length=p.length}2&o&&a(s,"aria-label",e[1]),13&o&&l!==(l="mc-tabs "+(e[0]&&"full"===e[0]?" mc-tabs--full":"")+" "+(e[0]&&"centered"===e[0]?" mc-tabs--full-centered":"")+" "+(e[3]?` mc-tabs--${e[3]}`:"")+(e[2]?" mc-tabs--no-divider":"")+" svelte-1ygf0po")&&a(t,"class",l)},i:c,o:c,d(s){s&&r(t),f(d,s),e[10](null)}}}function O(e){const t=["mc-tabs__element"];return e.isActive&&t.push("mc-tabs__element--selected"),e.disabled&&t.push("mc-tabs__element--disabled"),t.join(" ")}function E(e,t,s){let l,o,{align:a="auto"}=t,{description:n="Tabs"}=t,{nodivider:i=!1}=t,{tabs:c}=t,{type:r="tabs"}=t,f=new _;function p(e,t){const s=e.target;o.querySelectorAll(".mc-tabs__element").forEach((e=>{e.classList.remove("mc-tabs__element--selected"),e.setAttribute("aria-selected","false")})),s.classList.add("mc-tabs__element--selected"),s.setAttribute("aria-selected","true"),f.dispatch("tab-clicked",Object.assign(t,{target:s}))}return e.$$set=e=>{"align"in e&&s(0,a=e.align),"description"in e&&s(1,n=e.description),"nodivider"in e&&s(2,i=e.nodivider),"tabs"in e&&s(7,c=e.tabs),"type"in e&&s(3,r=e.type)},e.$$.update=()=>{128&e.$$.dirty&&s(5,l=c?JSON.parse(c):[])},[a,n,i,r,o,l,p,c,(e,t,s)=>p(s,Object.assign({index:e},t)),(e,t,s)=>p(s,Object.assign({index:e},t)),function(e){d[e?"unshift":"push"]((()=>{o=e,s(4,o)}))}]}class L extends e{constructor(e){super(),t(this,e,E,$,s,{align:0,description:1,nodivider:2,tabs:7,type:3},u)}}export{L as default};
 //# sourceMappingURL=Tabs.nested.js.map

package/public/components/tabs/Tabs.nested.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.nested.js","sources":["../../../src/components/tabs/Tabs.nested.svelte"],"sourcesContent":["<svelte:options tag={null} />\n\n<script lang=\"ts\">\n  import type { TabsAlign, TabsItems, TabsType } from './tabs.types';\n  import { EventHandler } from '../../utilities/EventHandler';\n\n  export let align: TabsAlign = 'auto';\n  export let description = 'Tabs';\n  export let nodivider = false;\n  export let tabs: string;\n  export let type: TabsType = 'tabs';\n  let eventHandler = new EventHandler();\n  let tablist: HTMLElement;\n  $: parsedTabs = tabs ? (JSON.parse(tabs) as TabsItems[]) : [];\n\n  function setActiveClass(tab: TabsItems): string {\n    const tabClasses = ['mc-tabs__element'];\n\n    if (tab.isActive) {\n      tabClasses.push('mc-tabs__element--selected');\n    }\n\n    if (tab.disabled) {\n      tabClasses.push('mc-tabs__element--disabled');\n    }\n\n    return tabClasses.join(' ');\n  }\n\n  function manageTabs(e: Event, tabItem: TabsItems): void {\n    const currentEl = e.target as HTMLElement;\n\n    tablist.querySelectorAll('.mc-tabs__element').forEach((el): void => {\n      el.classList.remove('mc-tabs__element--selected');\n      el.setAttribute('aria-selected', 'false');\n    });\n\n    currentEl.classList.add('mc-tabs__element--selected');\n    currentEl.setAttribute('aria-selected', 'true');\n\n    eventHandler.dispatch(\n      'tab-clicked',\n      Object.assign(tabItem, { target: currentEl }),\n    );\n  }\n</script>\n\n<div\n  class=\"mc-tabs\n  {align && align === 'full' ? ' mc-tabs--full' : ''}\n  {align && align === 'centered' ? ' mc-tabs--full-centered' : ''}\n  {type ? ` mc-tabs--${type}` : ''}{nodivider ? ' mc-tabs--no-divider' : ''}\"\n>\n  <ul\n    class=\"mc-tabs__nav\"\n    bind:this={tablist}\n    role=\"tablist\"\n    aria-label={description}\n  >\n    {#each parsedTabs as tab, index}\n      <li class=\"mc-tabs__item\" role=\"presentation\">\n        {#if tab.href}\n          {#if !tab.disabled}\n            <a\n              href={tab.href}\n              role=\"tab\"\n              class={setActiveClass(tab)}\n              id={tab.id}\n              aria-selected={tab.isActive ? 'true' : 'false'}\n              on:click={(event) =>\n                manageTabs(event, Object.assign({ index: index }, tab))}\n            >\n              <span class=\"mc-tabs__text\">\n                {tab.text}\n              </span>\n            </a>\n          {:else}\n            <span\n              role=\"tab\"\n              class={setActiveClass(tab)}\n              id={tab.id}\n              aria-selected={tab.isActive ? 'true' : 'false'}\n            >\n              <span class=\"mc-tabs__text\">\n                {tab.text}\n              </span>\n            </span>\n          {/if}\n        {:else}\n          <button\n            role=\"tab\"\n            type=\"button\"\n            class={setActiveClass(tab)}\n            id={tab.id}\n            disabled={tab.disabled}\n            aria-selected={tab.isActive ? 'true' : 'false'}\n            on:click={(event) =>\n              manageTabs(event, Object.assign({ index: index }, tab))}\n          >\n            <span class=\"mc-tabs__text\">\n              {tab.text}\n            </span>\n          </button>\n        {/if}\n      </li>\n    {/each}\n  </ul>\n</div>\n\n<style lang=\"scss\">\n  @import '@mozaic-ds/styles/settings-tools/all-settings';\n  @import '@mozaic-ds/styles/components/c.tabs';\n</style>\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Tabs.nested.js","sources":["../../../src/components/tabs/Tabs.nested.svelte"],"sourcesContent":["<svelte:options tag={null} />\n\n<script lang=\"ts\">\n  import type { TabsAlign, TabsItems, TabsType } from './tabs.types';\n  import { EventHandler } from '../../utilities/EventHandler';\n\n  export let align: TabsAlign = 'auto';\n  export let description = 'Tabs';\n  export let nodivider = false;\n  export let tabs: string;\n  export let type: TabsType = 'tabs';\n  let eventHandler = new EventHandler();\n  let tablist: HTMLElement;\n  $: parsedTabs = tabs ? (JSON.parse(tabs) as TabsItems[]) : [];\n\n  function setActiveClass(tab: TabsItems): string {\n    const tabClasses = ['mc-tabs__element'];\n\n    if (tab.isActive) {\n      tabClasses.push('mc-tabs__element--selected');\n    }\n\n    if (tab.disabled) {\n      tabClasses.push('mc-tabs__element--disabled');\n    }\n\n    return tabClasses.join(' ');\n  }\n\n  function manageTabs(e: Event, tabItem: TabsItems): void {\n    const currentEl = e.target as HTMLElement;\n\n    tablist.querySelectorAll('.mc-tabs__element').forEach((el): void => {\n      el.classList.remove('mc-tabs__element--selected');\n      el.setAttribute('aria-selected', 'false');\n    });\n\n    currentEl.classList.add('mc-tabs__element--selected');\n    currentEl.setAttribute('aria-selected', 'true');\n\n    eventHandler.dispatch(\n      'tab-clicked',\n      Object.assign(tabItem, { target: currentEl }),\n    );\n  }\n</script>\n\n<div\n  class=\"mc-tabs\n  {align && align === 'full' ? ' mc-tabs--full' : ''}\n  {align && align === 'centered' ? ' mc-tabs--full-centered' : ''}\n  {type ? ` mc-tabs--${type}` : ''}{nodivider ? ' mc-tabs--no-divider' : ''}\"\n>\n  <ul\n    class=\"mc-tabs__nav\"\n    bind:this={tablist}\n    role=\"tablist\"\n    aria-label={description}\n  >\n    {#each parsedTabs as tab, index}\n      <li class=\"mc-tabs__item\" role=\"presentation\">\n        {#if tab.href}\n          {#if !tab.disabled}\n            <a\n              href={tab.href}\n              role=\"tab\"\n              class={setActiveClass(tab)}\n              id={tab.id}\n              aria-selected={tab.isActive ? 'true' : 'false'}\n              on:click={(event) =>\n                manageTabs(event, Object.assign({ index: index }, tab))}\n            >\n              <span class=\"mc-tabs__text\">\n                {tab.text}\n              </span>\n            </a>\n          {:else}\n            <span\n              role=\"tab\"\n              class={setActiveClass(tab)}\n              id={tab.id}\n              aria-selected={tab.isActive ? 'true' : 'false'}\n            >\n              <span class=\"mc-tabs__text\">\n                {tab.text}\n              </span>\n            </span>\n          {/if}\n        {:else}\n          <button\n            role=\"tab\"\n            type=\"button\"\n            class={setActiveClass(tab)}\n            id={tab.id}\n            disabled={tab.disabled}\n            aria-selected={tab.isActive ? 'true' : 'false'}\n            on:click={(event) =>\n              manageTabs(event, Object.assign({ index: index }, tab))}\n          >\n            <span class=\"mc-tabs__text\">\n              {tab.text}\n            </span>\n          </button>\n        {/if}\n      </li>\n    {/each}\n  </ul>\n</div>\n\n<style lang=\"scss\">\n  @import '@mozaic-ds/styles/settings-tools/all-settings';\n  @import '@mozaic-ds/styles/components/c.tabs';\n</style>\n"],"names":["t_value","ctx","text","attr","button","button_class_value","null_to_empty","setActiveClass","button_id_value","id","disabled","button_disabled_value","button_aria_selected_value","isActive","insert","target","anchor","append","span","dirty","set_data","t","create_if_block_1","span1","span1_class_value","span1_id_value","span1_aria_selected_value","span0","a","a_href_value","href","a_class_value","a_id_value","a_aria_selected_value","create_if_block","li","length","i","div","ul","tab","tabClasses","push","join","tablist","align","$$props","description","nodivider","tabs","type","eventHandler","EventHandler","manageTabs","e","tabItem","currentEl","querySelectorAll","forEach","el","classList","remove","setAttribute","add","dispatch","Object","assign","$$invalidate","parsedTabs","JSON","parse","event","index","$$value"],"mappings":"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"}