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

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

@@ -1,2 +1,473 @@
-import{P as e,i as t,s,Q as n,e as i,g as l,b as a,j as c,n as o,o as r,J as d,d as b,v as x,t as m,R as v,l as f,k as q,K as _}from"../../index-c33b3772.js";import{E as u}from"../../EventHandler-02058705.js";function p(e){n(e,"svelte-1qi4xn5",'.mc-tabs.svelte-1qi4xn5.svelte-1qi4xn5{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-1qi4xn5.svelte-1qi4xn5::after{background:#b3b3b3;content:"";display:block;margin:0 auto;height:1px;width:100%;bottom:0;left:0;position:absolute}.mc-tabs--no-shadow.svelte-1qi4xn5.svelte-1qi4xn5::after,.mc-tabs--no-divider.svelte-1qi4xn5.svelte-1qi4xn5::after{display:none}.mc-tabs__nav.svelte-1qi4xn5.svelte-1qi4xn5{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-1qi4xn5.svelte-1qi4xn5,.mc-tabs__select.svelte-1qi4xn5.svelte-1qi4xn5{position:relative}.mc-tabs__link.svelte-1qi4xn5.svelte-1qi4xn5,.mc-tabs__element.svelte-1qi4xn5.svelte-1qi4xn5{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-1qi4xn5.svelte-1qi4xn5::before,.mc-tabs__element.svelte-1qi4xn5.svelte-1qi4xn5::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-1qi4xn5.svelte-1qi4xn5::after,.mc-tabs__element.svelte-1qi4xn5.svelte-1qi4xn5::after{background-color:transparent;bottom:0;content:"";height:0.25rem;left:1.5rem;position:absolute;right:1.5rem}.mc-tabs__link.svelte-1qi4xn5:hover .mc-tabs__text.svelte-1qi4xn5,.mc-tabs__element.svelte-1qi4xn5:hover .mc-tabs__text.svelte-1qi4xn5{background-color:#eeeff1}.mc-tabs__link.svelte-1qi4xn5.svelte-1qi4xn5:active,.mc-tabs__element.svelte-1qi4xn5.svelte-1qi4xn5:active{color:#4d4d4d}.mc-tabs__link.svelte-1qi4xn5:active .mc-tabs__text.svelte-1qi4xn5,.mc-tabs__element.svelte-1qi4xn5:active .mc-tabs__text.svelte-1qi4xn5{background-color:#cfd2d8}.mc-tabs__link.svelte-1qi4xn5.svelte-1qi4xn5:focus::before,.mc-tabs__element.svelte-1qi4xn5.svelte-1qi4xn5: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-1qi4xn5.svelte-1qi4xn5,.mc-tabs__element--selected.svelte-1qi4xn5.svelte-1qi4xn5{color:#000000}.mc-tabs__link--selected.svelte-1qi4xn5.svelte-1qi4xn5::after,.mc-tabs__element--selected.svelte-1qi4xn5.svelte-1qi4xn5::after{background-color:#000000}.mc-tabs__link--selected.svelte-1qi4xn5.svelte-1qi4xn5:hover,.mc-tabs__element--selected.svelte-1qi4xn5.svelte-1qi4xn5:hover{color:#000000}.mc-tabs__link--selected.svelte-1qi4xn5.svelte-1qi4xn5:active,.mc-tabs__element--selected.svelte-1qi4xn5.svelte-1qi4xn5:active{color:#000000}.mc-tabs__link--disabled.svelte-1qi4xn5.svelte-1qi4xn5,.mc-tabs__element--disabled.svelte-1qi4xn5.svelte-1qi4xn5{cursor:not-allowed;background-color:#cccccc;pointer-events:none}.mc-tabs__link--disabled.svelte-1qi4xn5.svelte-1qi4xn5,.mc-tabs__link--disabled.svelte-1qi4xn5.svelte-1qi4xn5:hover,.mc-tabs__link--disabled.svelte-1qi4xn5.svelte-1qi4xn5:focus,.mc-tabs__link--disabled.svelte-1qi4xn5.svelte-1qi4xn5:active,.mc-tabs__element--disabled.svelte-1qi4xn5.svelte-1qi4xn5,.mc-tabs__element--disabled.svelte-1qi4xn5.svelte-1qi4xn5:hover,.mc-tabs__element--disabled.svelte-1qi4xn5.svelte-1qi4xn5:focus,.mc-tabs__element--disabled.svelte-1qi4xn5.svelte-1qi4xn5:active{-webkit-box-shadow:none;box-shadow:none}.mc-tabs__text.svelte-1qi4xn5.svelte-1qi4xn5{-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-1qi4xn5.svelte-1qi4xn5{fill:currentColor;height:1.5rem;width:1.5rem}.mc-tabs--full-centered.svelte-1qi4xn5.svelte-1qi4xn5{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.mc-tabs--dropdown.svelte-1qi4xn5.svelte-1qi4xn5{padding:1rem;width:auto}@media screen and (min-width: 680px){.mc-tabs.svelte-1qi4xn5.svelte-1qi4xn5{width:auto}.mc-tabs--full.svelte-1qi4xn5.svelte-1qi4xn5,.mc-tabs--full-centered.svelte-1qi4xn5.svelte-1qi4xn5{width:100%}}@media screen and (max-width: 679px){.mc-tabs.svelte-1qi4xn5.svelte-1qi4xn5:not(.mc-tabs--dropdown)::before{bottom:0.125rem}.mc-tabs__nav.svelte-1qi4xn5.svelte-1qi4xn5{overflow:auto hidden;white-space:nowrap}}')}function h(e,t,s){const n=e.slice();return n[12]=t[s],n[14]=s,n}function k(e){let t,s,n,o,d,b,x,_,u,p=e[12].text+"";function h(...t){return e[9](e[14],e[12],...t)}return{c(){t=i("button"),s=i("span"),n=m(p),l(s,"class","mc-tabs__text svelte-1qi4xn5"),l(t,"role","tab"),l(t,"type","button"),l(t,"class",o=v($(e[12]))+" svelte-1qi4xn5"),l(t,"id",d=e[12].id),t.disabled=b=e[12].disabled,l(t,"aria-selected",x=e[12].isActive?"true":"false")},m(e,i){a(e,t,i),c(t,s),c(s,n),_||(u=f(t,"click",h),_=!0)},p(s,i){e=s,32&i&&p!==(p=e[12].text+"")&&q(n,p),32&i&&o!==(o=v($(e[12]))+" svelte-1qi4xn5")&&l(t,"class",o),32&i&&d!==(d=e[12].id)&&l(t,"id",d),32&i&&b!==(b=e[12].disabled)&&(t.disabled=b),32&i&&x!==(x=e[12].isActive?"true":"false")&&l(t,"aria-selected",x)},d(e){e&&r(t),_=!1,u()}}}function g(e){let t;function s(e,t){return e[12].disabled?w:y}let n=s(e),i=n(e);return{c(){i.c(),t=_()},m(e,s){i.m(e,s),a(e,t,s)},p(e,l){n===(n=s(e))&&i?i.p(e,l):(i.d(1),i=n(e),i&&(i.c(),i.m(t.parentNode,t)))},d(e){i.d(e),e&&r(t)}}}function w(e){let t,s,n,o,d,b,x=e[12].text+"";return{c(){t=i("span"),s=i("span"),n=m(x),l(s,"class","mc-tabs__text svelte-1qi4xn5"),l(t,"role","tab"),l(t,"class",o=v($(e[12]))+" svelte-1qi4xn5"),l(t,"id",d=e[12].id),l(t,"aria-selected",b=e[12].isActive?"true":"false")},m(e,i){a(e,t,i),c(t,s),c(s,n)},p(e,s){32&s&&x!==(x=e[12].text+"")&&q(n,x),32&s&&o!==(o=v($(e[12]))+" svelte-1qi4xn5")&&l(t,"class",o),32&s&&d!==(d=e[12].id)&&l(t,"id",d),32&s&&b!==(b=e[12].isActive?"true":"false")&&l(t,"aria-selected",b)},d(e){e&&r(t)}}}function y(e){let t,s,n,o,d,b,x,_,u,p=e[12].text+"";function h(...t){return e[8](e[14],e[12],...t)}return{c(){t=i("a"),s=i("span"),n=m(p),l(s,"class","mc-tabs__text svelte-1qi4xn5"),l(t,"href",o=e[12].href),l(t,"role","tab"),l(t,"class",d=v($(e[12]))+" svelte-1qi4xn5"),l(t,"id",b=e[12].id),l(t,"aria-selected",x=e[12].isActive?"true":"false")},m(e,i){a(e,t,i),c(t,s),c(s,n),_||(u=f(t,"click",h),_=!0)},p(s,i){e=s,32&i&&p!==(p=e[12].text+"")&&q(n,p),32&i&&o!==(o=e[12].href)&&l(t,"href",o),32&i&&d!==(d=v($(e[12]))+" svelte-1qi4xn5")&&l(t,"class",d),32&i&&b!==(b=e[12].id)&&l(t,"id",b),32&i&&x!==(x=e[12].isActive?"true":"false")&&l(t,"aria-selected",x)},d(e){e&&r(t),_=!1,u()}}}function j(e){let t,s;function n(e,t){return e[12].href?g:k}let o=n(e),d=o(e);return{c(){t=i("li"),d.c(),s=b(),l(t,"class","mc-tabs__item"),l(t,"role","presentation")},m(e,n){a(e,t,n),d.m(t,null),c(t,s)},p(e,i){o===(o=n(e))&&d?d.p(e,i):(d.d(1),d=o(e),d&&(d.c(),d.m(t,s)))},d(e){e&&r(t),d.d()}}}function A(e){let t,s,n,b=e[5],x=[];for(let t=0;t<b.length;t+=1)x[t]=j(h(e,b,t));return{c(){t=i("div"),s=i("ul");for(let e=0;e<x.length;e+=1)x[e].c();l(s,"class","mc-tabs__nav svelte-1qi4xn5"),l(s,"role","tablist"),l(s,"aria-label",e[1]),l(t,"class",n="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-1qi4xn5")},m(n,i){a(n,t,i),c(t,s);for(let e=0;e<x.length;e+=1)x[e]&&x[e].m(s,null);e[10](s)},p(e,[i]){if(96&i){let t;for(b=e[5],t=0;t<b.length;t+=1){const n=h(e,b,t);x[t]?x[t].p(n,i):(x[t]=j(n),x[t].c(),x[t].m(s,null))}for(;t<x.length;t+=1)x[t].d(1);x.length=b.length}2&i&&l(s,"aria-label",e[1]),13&i&&n!==(n="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-1qi4xn5")&&l(t,"class",n)},i:o,o:o,d(s){s&&r(t),d(x,s),e[10](null)}}}function $(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 O(e,t,s){let n,i,{align:l="auto"}=t,{description:a="Tabs"}=t,{nodivider:c=!1}=t,{tabs:o}=t,{type:r="tabs"}=t,d=new u;function b(e,t){const s=e.target;i.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"),d.dispatch("tab-clicked",Object.assign(t,{target:s}))}return e.$$set=e=>{"align"in e&&s(0,l=e.align),"description"in e&&s(1,a=e.description),"nodivider"in e&&s(2,c=e.nodivider),"tabs"in e&&s(7,o=e.tabs),"type"in e&&s(3,r=e.type)},e.$$.update=()=>{128&e.$$.dirty&&s(5,n=o?JSON.parse(o):[])},[l,a,c,r,i,n,b,o,(e,t,s)=>b(s,Object.assign({index:e},t)),(e,t,s)=>b(s,Object.assign({index:e},t)),function(e){x[e?"unshift":"push"]((()=>{i=e,s(4,i)}))}]}class E extends e{constructor(e){super(),t(this,e,O,A,s,{align:0,description:1,nodivider:2,tabs:7,type:3},p)}}export{E as default};
+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-1kp2usd", ".mc-tabs.svelte-1kp2usd.svelte-1kp2usd{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-1kp2usd.svelte-1kp2usd::after{background:#b3b3b3;content:\"\";display:block;margin:0 auto;height:1px;width:100%;bottom:0;left:0;position:absolute}.mc-tabs--no-shadow.svelte-1kp2usd.svelte-1kp2usd::after,.mc-tabs--no-divider.svelte-1kp2usd.svelte-1kp2usd::after{display:none}.mc-tabs__nav.svelte-1kp2usd.svelte-1kp2usd{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-1kp2usd.svelte-1kp2usd,.mc-tabs__select.svelte-1kp2usd.svelte-1kp2usd{position:relative}.mc-tabs__link.svelte-1kp2usd.svelte-1kp2usd,.mc-tabs__element.svelte-1kp2usd.svelte-1kp2usd{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-1kp2usd.svelte-1kp2usd::before,.mc-tabs__element.svelte-1kp2usd.svelte-1kp2usd::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-1kp2usd.svelte-1kp2usd::after,.mc-tabs__element.svelte-1kp2usd.svelte-1kp2usd::after{background-color:transparent;bottom:0;content:\"\";height:0.25rem;left:1.5rem;position:absolute;right:1.5rem}.mc-tabs__link.svelte-1kp2usd:hover .mc-tabs__text.svelte-1kp2usd,.mc-tabs__element.svelte-1kp2usd:hover .mc-tabs__text.svelte-1kp2usd{background-color:#eeeff1}.mc-tabs__link.svelte-1kp2usd.svelte-1kp2usd:active,.mc-tabs__element.svelte-1kp2usd.svelte-1kp2usd:active{color:#333333}.mc-tabs__link.svelte-1kp2usd:active .mc-tabs__text.svelte-1kp2usd,.mc-tabs__element.svelte-1kp2usd:active .mc-tabs__text.svelte-1kp2usd{background-color:#cfd2d8}.mc-tabs__link.svelte-1kp2usd.svelte-1kp2usd:focus::before,.mc-tabs__element.svelte-1kp2usd.svelte-1kp2usd: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-1kp2usd.svelte-1kp2usd,.mc-tabs__element--selected.svelte-1kp2usd.svelte-1kp2usd{color:#000000}.mc-tabs__link--selected.svelte-1kp2usd.svelte-1kp2usd::after,.mc-tabs__element--selected.svelte-1kp2usd.svelte-1kp2usd::after{background-color:#000000}.mc-tabs__link--disabled.svelte-1kp2usd.svelte-1kp2usd,.mc-tabs__element--disabled.svelte-1kp2usd.svelte-1kp2usd{cursor:not-allowed;background-color:#cccccc;pointer-events:none}.mc-tabs__link--disabled.svelte-1kp2usd.svelte-1kp2usd,.mc-tabs__link--disabled.svelte-1kp2usd.svelte-1kp2usd:hover,.mc-tabs__link--disabled.svelte-1kp2usd.svelte-1kp2usd:focus,.mc-tabs__link--disabled.svelte-1kp2usd.svelte-1kp2usd:active,.mc-tabs__element--disabled.svelte-1kp2usd.svelte-1kp2usd,.mc-tabs__element--disabled.svelte-1kp2usd.svelte-1kp2usd:hover,.mc-tabs__element--disabled.svelte-1kp2usd.svelte-1kp2usd:focus,.mc-tabs__element--disabled.svelte-1kp2usd.svelte-1kp2usd:active{-webkit-box-shadow:none;box-shadow:none}.mc-tabs__text.svelte-1kp2usd.svelte-1kp2usd{-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-1kp2usd.svelte-1kp2usd{fill:currentColor;height:1.5rem;width:1.5rem}.mc-tabs--full-centered.svelte-1kp2usd.svelte-1kp2usd{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.mc-tabs--dropdown.svelte-1kp2usd.svelte-1kp2usd{padding:1rem;width:auto}@media screen and (min-width: 680px){.mc-tabs.svelte-1kp2usd.svelte-1kp2usd{width:auto}.mc-tabs--full.svelte-1kp2usd.svelte-1kp2usd,.mc-tabs--full-centered.svelte-1kp2usd.svelte-1kp2usd{width:100%}}@media screen and (max-width: 679px){.mc-tabs.svelte-1kp2usd.svelte-1kp2usd:not(.mc-tabs--dropdown)::before{bottom:0.125rem}.mc-tabs__nav.svelte-1kp2usd.svelte-1kp2usd{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-1kp2usd");
+			attr(button, "role", "tab");
+			attr(button, "type", "button");
+			attr(button, "class", button_class_value = "" + (null_to_empty(setActiveClass(/*tab*/ ctx[12])) + " svelte-1kp2usd"));
+			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-1kp2usd"))) {
+				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-1kp2usd");
+			attr(span1, "role", "tab");
+			attr(span1, "class", span1_class_value = "" + (null_to_empty(setActiveClass(/*tab*/ ctx[12])) + " svelte-1kp2usd"));
+			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-1kp2usd"))) {
+				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-1kp2usd");
+			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-1kp2usd"));
+			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-1kp2usd"))) {
+				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-1kp2usd");
+			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-1kp2usd");
+		},
+		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-1kp2usd")) {
+				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 };
 //# 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":["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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"}
+{"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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"}