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

package/public/components/header/Header.js

@@ -1,2 +1,919 @@
-import{S as e,i as t,a,_ as i,b as r,f as s,s as n,c as d,e as l,d as c,t as o,n as m,g as h,h as b,z as g,j as p,C as u,D as _,E as f,k as x,m as $,o as w,p as y,a0 as k,q as M,x as z,A,G as v,l as D,M as I,v as S}from"../../index-c33b3772.js";import{E as j}from"../../EventHandler-02058705.js";import N from"../breadcrumb/Breadcrumb.nested.js";import T from"../tabs/Tabs.nested.js";import L from"../badge/Badge.nested.js";function E(e){let t,a,i;return a=new N({props:{items:JSON.stringify(e[17]),nopadding:e[6]}}),a.$on("link-clicked",e[26]),{c(){t=l("div"),z(a.$$.fragment),h(t,"class","mc-header__breadcrumb")},m(e,s){r(e,t,s),A(a,t,null),i=!0},p(e,t){const i={};131072&t[0]&&(i.items=JSON.stringify(e[17])),64&t[0]&&(i.nopadding=e[6]),a.$set(i)},i(e){i||(u(a.$$.fragment,e),i=!0)},o(e){_(a.$$.fragment,e),i=!1},d(e){e&&w(t),v(a)}}}function C(e){let t,a,i,s,n,d=(e[15]?.back||"Back")+"";return{c(){t=l("button"),a=l("span"),i=o(d),h(a,"class","mc-header__back__label"),h(t,"class","mc-header__back")},m(d,l){r(d,t,l),p(t,a),p(a,i),s||(n=D(t,"click",e[19]),s=!0)},p(e,t){32768&t[0]&&d!==(d=(e[15]?.back||"Back")+"")&&x(i,d)},d(e){e&&w(t),s=!1,n()}}}function O(e){let t,a;return{c(){t=l("div"),a=o(e[1]),h(t,"class","mc-header__heading__subtitle")},m(e,i){r(e,t,i),p(t,a)},p(e,t){2&t[0]&&x(a,e[1])},d(e){e&&w(t)}}}function H(e){let t,a,i;return a=new L({props:{label:e[3],type:e[4]}}),{c(){t=l("div"),z(a.$$.fragment),h(t,"class","mc-header__heading__status")},m(e,s){r(e,t,s),A(a,t,null),i=!0},p(e,t){const i={};8&t[0]&&(i.label=e[3]),16&t[0]&&(i.type=e[4]),a.$set(i)},i(e){i||(u(a.$$.fragment,e),i=!0)},o(e){_(a.$$.fragment,e),i=!1},d(e){e&&w(t),v(a)}}}function J(e){let t,a,i=(e[20]?.icons||e[7])&&B(),s=(e[20]?.selector||e[8])&&Z(e);return{c(){t=l("div"),i&&i.c(),a=c(),s&&s.c(),h(t,"class","mc-header__right")},m(e,n){r(e,t,n),i&&i.m(t,null),p(t,a),s&&s.m(t,null)},p(e,r){e[20]?.icons||e[7]?i||(i=B(),i.c(),i.m(t,a)):i&&(i.d(1),i=null),e[20]?.selector||e[8]?s?s.p(e,r):(s=Z(e),s.c(),s.m(t,null)):s&&(s.d(1),s=null)},d(e){e&&w(t),i&&i.d(),s&&s.d()}}}function B(e){let t;return{c(){t=l("div"),t.innerHTML='<slot name="icons"></slot>',h(t,"class","mc-header__icons")},m(e,a){r(e,t,a)},d(e){e&&w(t)}}}function Z(e){let t;return{c(){t=l("div"),t.innerHTML='<slot name="selector"></slot>',h(t,"class","mc-header__selector"),g(t,"mc-header__selector--show-separator",(e[20]?.icons||e[7])&&(e[20]?.selector||e[8]))},m(e,a){r(e,t,a)},p(e,a){1048960&a[0]&&g(t,"mc-header__selector--show-separator",(e[20]?.icons||e[7])&&(e[20]?.selector||e[8]))},d(e){e&&w(t)}}}function G(e){let t,a,i;return a=new T({props:{tabs:JSON.stringify(e[16]),nodivider:!0}}),a.$on("tab-clicked",e[27]),{c(){t=l("div"),z(a.$$.fragment),h(t,"class","mc-header__tabs")},m(e,s){r(e,t,s),A(a,t,null),i=!0},p(e,t){const i={};65536&t[0]&&(i.tabs=JSON.stringify(e[16])),a.$set(i)},i(e){i||(u(a.$$.fragment,e),i=!0)},o(e){_(a.$$.fragment,e),i=!1},d(e){e&&w(t),v(a)}}}function R(e){let t,a,i,s,n,y,k,M,z,A,v,D,S,j=e[5]&&E(e),N=e[14]&&C(e),T=e[1]&&O(e),L=e[3]&&H(e),B=!e[9]&&J(e),Z=e[16]&&e[16].length>0&&G(e),R=[{class:D="mc-header "+(e[2]?`mc-header--${e[2]}`:"")},e[10]],W={};for(let e=0;e<R.length;e+=1)W=d(W,R[e]);return{c(){t=l("div"),a=l("div"),j&&j.c(),i=c(),N&&N.c(),s=c(),n=l("div"),y=l("h1"),k=o(e[0]),M=c(),T&&T.c(),z=c(),L&&L.c(),A=c(),B&&B.c(),v=c(),Z&&Z.c(),this.c=m,h(y,"class","mc-header__heading__title"),h(n,"class","mc-header__heading"),h(a,"class","mc-header__left"),b(t,W),g(t,"mc-header--no-shadow",e[13]),g(t,"mc-header--animate",e[11])},m(d,l){r(d,t,l),p(t,a),j&&j.m(a,null),p(a,i),N&&N.m(a,null),p(a,s),p(a,n),p(n,y),p(y,k),p(n,M),T&&T.m(n,null),p(n,z),L&&L.m(n,null),p(t,A),B&&B.m(t,null),p(t,v),Z&&Z.m(t,null),e[28](t),S=!0},p(e,r){e[5]?j?(j.p(e,r),32&r[0]&&u(j,1)):(j=E(e),j.c(),u(j,1),j.m(a,i)):j&&(I(),_(j,1,1,(()=>{j=null})),f()),e[14]?N?N.p(e,r):(N=C(e),N.c(),N.m(a,s)):N&&(N.d(1),N=null),(!S||1&r[0])&&x(k,e[0]),e[1]?T?T.p(e,r):(T=O(e),T.c(),T.m(n,z)):T&&(T.d(1),T=null),e[3]?L?(L.p(e,r),8&r[0]&&u(L,1)):(L=H(e),L.c(),u(L,1),L.m(n,null)):L&&(I(),_(L,1,1,(()=>{L=null})),f()),e[9]?B&&(B.d(1),B=null):B?B.p(e,r):(B=J(e),B.c(),B.m(t,v)),e[16]&&e[16].length>0?Z?(Z.p(e,r),65536&r[0]&&u(Z,1)):(Z=G(e),Z.c(),u(Z,1),Z.m(t,null)):Z&&(I(),_(Z,1,1,(()=>{Z=null})),f()),b(t,W=$(R,[(!S||4&r[0]&&D!==(D="mc-header "+(e[2]?`mc-header--${e[2]}`:"")))&&{class:D},1024&r[0]&&e[10]])),g(t,"mc-header--no-shadow",e[13]),g(t,"mc-header--animate",e[11])},i(e){S||(u(j),u(L),u(Z),S=!0)},o(e){_(j),_(L),_(Z),S=!1},d(a){a&&w(t),j&&j.d(),N&&N.d(),T&&T.d(),L&&L.d(),B&&B.d(),Z&&Z.d(),e[28](null)}}}function W(e,t,a){let i,r,s,n,l,c;const o=["title","subtitle","size","status","statustype","back","breadcrumb","tabs","noshadow","a11ylabels","scrollcontainer","nopaddingbreadcrumb","hasicons","hasselector","hideoptions"];let m=y(t,o),{$$slots:h={},$$scope:b}=t;const g=k(h);let p,u,{title:_}=t,{subtitle:f}=t,{size:x="m"}=t,{status:$}=t,{statustype:w}=t,{back:z}=t,{breadcrumb:A}=t,{tabs:v}=t,{noshadow:D}=t,{a11ylabels:I}=t,{scrollcontainer:N}=t,{nopaddingbreadcrumb:T}=t,{hasicons:L}=t,{hasselector:E}=t,{hideoptions:C=!1}=t,O=new j,H=0;function J(){const e=N.scrollTop,t=Number(u.style.marginTop.replace("px",""));H>e?e<u.offsetHeight?a(12,u.style.marginTop=`${Math.max(-e,t)}px`,u):a(12,u.style.marginTop="0",u):e<u.offsetHeight?(a(12,u.style.transition="none",u),a(12,u.style.marginTop=-e+"px",u)):(a(12,u.style.transition="margin-top ease-out 0.4s",u),a(12,u.style.marginTop=-u.offsetHeight-5+"px",u)),H=e}return e.$$set=e=>{t=d(d({},t),M(e)),a(32,m=y(t,o)),"title"in e&&a(0,_=e.title),"subtitle"in e&&a(1,f=e.subtitle),"size"in e&&a(2,x=e.size),"status"in e&&a(3,$=e.status),"statustype"in e&&a(4,w=e.statustype),"back"in e&&a(21,z=e.back),"breadcrumb"in e&&a(5,A=e.breadcrumb),"tabs"in e&&a(22,v=e.tabs),"noshadow"in e&&a(23,D=e.noshadow),"a11ylabels"in e&&a(24,I=e.a11ylabels),"scrollcontainer"in e&&a(25,N=e.scrollcontainer),"nopaddingbreadcrumb"in e&&a(6,T=e.nopaddingbreadcrumb),"hasicons"in e&&a(7,L=e.hasicons),"hasselector"in e&&a(8,E=e.hasselector),"hideoptions"in e&&a(9,C=e.hideoptions)},e.$$.update=()=>{32&e.$$.dirty[0]&&a(17,i="string"==typeof A?JSON.parse(A):A),4194304&e.$$.dirty[0]&&a(16,r="string"==typeof v?JSON.parse(v):v),16777216&e.$$.dirty[0]&&a(15,s="string"==typeof I?JSON.parse(I):I),2097152&e.$$.dirty[0]&&a(14,n=z&&"false"!==z),8388608&e.$$.dirty[0]&&a(13,l=D&&"false"!==D),33554432&e.$$.dirty[0]&&(a(11,p=Boolean(N)),function(e){e&&(e.removeEventListener("scroll",J),e.addEventListener("scroll",J))}(N)),a(10,c=Object.assign({},m)),1024&e.$$.dirty[0]&&delete c.class},[_,f,x,$,w,A,T,L,E,C,c,p,u,l,n,s,r,i,O,function(){O.dispatch("on-back-click",{})},g,z,v,D,I,N,e=>O.dispatch("link-clicked",e.detail),e=>O.dispatch("tab-clicked",e.detail),function(e){S[e?"unshift":"push"]((()=>{u=e,a(12,u)}))}]}class Y extends e{constructor(e){super();const d=document.createElement("style");d.textContent='.mc-header{background-color:#ffffff;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-shadow:0px 4px 5px rgba(0, 0, 0, 0.2);box-shadow:0px 4px 5px rgba(0, 0, 0, 0.2);font-family:"LeroyMerlin", sans-serif;font-weight:400}.mc-header .mc-header__back{height:2.25rem}.mc-header .mc-header__heading__title{font-size:1.75rem;line-height:1.2857142857}.mc-header__left{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex:1;flex:1;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-bottom:1rem;padding-top:0.5rem;padding-left:2rem}.mc-header__right{-webkit-box-flex:0;-ms-flex:0;flex:0;display:-webkit-box;display:-ms-flexbox;display:flex;margin-left:1.5rem;margin-bottom:1rem;padding-top:1rem;padding-right:2rem;height:2rem;width:28rem;min-width:28rem;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.mc-header__tabs{width:100%;position:relative;padding-left:2rem;padding-right:2rem}.mc-header__tabs::before{content:"";background-color:#b3b3b3;top:0;right:0;height:1px;position:absolute;width:100%;z-index:1}.mc-header__breadcrumb{height:3rem;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.mc-header__back{margin:0;-webkit-box-shadow:none;box-shadow:none;text-decoration:none;outline:none;border:none;cursor:pointer;padding:0;background-color:transparent;background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMnJlbSIgd2lkdGg9IjJyZW0iIHZpZXdCb3g9IjAgMCAzMiAzMiIgZmlsbD0iIzMzMzMzMyI+PHBhdGggZD0iTTI4IDE1SDYuNDFsNi4zLTYuMjlhMSAxIDAgMTAtMS40Mi0xLjQybC04IDhhMS4xNSAxLjE1IDAgMDAtLjIxLjMzIDEgMSAwIDAwMCAuNzYuOTMuOTMgMCAwMC4yMS4zM2w4IDhhMSAxIDAgMDAxLjQyIDAgMSAxIDAgMDAwLTEuNDJMNi40MSAxN0gyOGExIDEgMCAwMDAtMnoiLz48L3N2Zz4=");background-repeat:no-repeat;background-position:center;background-size:2rem;color:currentColor;display:inline-block;-webkit-box-flex:0;-ms-flex:0 0 2rem;flex:0 0 2rem;margin-top:0.5rem;margin-right:1rem;height:2rem}.mc-header__back__label{font-size:0;height:1px;overflow:hidden;display:block}.mc-header__heading{display:inline-block;width:calc(100% - 3em)}.mc-header__heading__title{font-weight:600;color:#191919;width:100%;margin-top:0.5rem;margin-bottom:0}.mc-header__heading__subtitle{font-weight:400;color:#191919;display:inline-block;margin-top:0.25rem;margin-bottom:0}.mc-header__heading__status{font-weight:400;display:inline-block;margin-top:0.25rem;margin-bottom:0}.mc-header__heading__subtitle+.mc-header__heading__status{margin-left:1rem}.mc-header__icons{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex:1;flex:1;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;max-width:9rem;width:9rem}.mc-header__selector{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;padding-left:0;margin-left:1.5rem;max-width:16rem;width:16rem}.mc-header__selector--show-separator{padding-left:1.5rem}.mc-header__selector--show-separator::before{content:"";background-color:#b3b3b3;left:0;height:100%;position:absolute;width:1px}.mc-header--no-shadow{-webkit-box-shadow:none;box-shadow:none}.mc-header--animate{margin-top:0px;-webkit-transition:margin-top ease-out 0.4s;-o-transition:margin-top ease-out 0.4s;transition:margin-top ease-out 0.4s;width:100%}@media screen and (min-width: 360px){.mc-header__breadcrumb{margin-left:-1.25rem;margin-right:1.25rem}.mc-header__left{padding-left:1rem}.mc-header__right{padding-right:1rem}.mc-header__tabs{padding-left:1rem;padding-right:1rem}}@media screen and (min-width: 390px){.mc-header__breadcrumb{margin-left:-magic-unit-rem(1.375, "true");margin-right:1.375rem}}@media screen and (min-width: 680px){.mc-header__breadcrumb{margin-left:-2rem;margin-right:2rem}}@media screen and (min-width: 769px){.mc-header__breadcrumb{margin-left:-magic-unit-rem(2.125, "true");margin-right:2.125rem}.mc-header__left{padding-left:2rem}.mc-header__right{padding-right:2rem}.mc-header__tabs{padding-left:2rem;padding-right:2rem}}@media screen and (min-width: 1024px){.mc-header__breadcrumb{margin-left:-3rem;margin-right:3rem}.mc-header__left{padding-left:3rem}.mc-header__right{padding-right:3rem}.mc-header__tabs{padding-left:3rem;padding-right:3rem}}@media screen and (min-width: 1280px){.mc-header__breadcrumb{margin-left:-2rem;margin-right:2rem}.mc-header__left{padding-left:2rem}.mc-header__right{padding-right:2rem}.mc-header__tabs{padding-left:2rem;padding-right:2rem}}@media screen and (min-width: 1440px){.mc-header__breadcrumb{margin-left:-7rem;margin-right:7rem}}@media screen and (min-width: 1680px){.mc-header__breadcrumb{margin-left:-2rem;margin-right:2rem}}@media screen and (min-width: 1920px){.mc-header__breadcrumb{margin-left:-2.5rem;margin-right:2.5rem}}.mc-header--s .mc-header__back{height:2rem}.mc-header--s .mc-header__heading__title{font-size:1.4375rem;line-height:1.3913043478}.mc-header--l .mc-header__back{height:2.75rem}.mc-header--l .mc-header__heading__title{font-size:2.125rem;line-height:1.2941176471}:host{display:block;line-height:0}',this.shadowRoot.appendChild(d),t(this,{target:this.shadowRoot,props:{...a(this.attributes),$$slots:i(this)},customElement:!0},W,R,n,{title:0,subtitle:1,size:2,status:3,statustype:4,back:21,breadcrumb:5,tabs:22,noshadow:23,a11ylabels:24,scrollcontainer:25,nopaddingbreadcrumb:6,hasicons:7,hasselector:8,hideoptions:9},null,[-1,-1]),e&&(e.target&&r(e.target,this,e.anchor),e.props&&(this.$set(e.props),s()))}static get observedAttributes(){return["title","subtitle","size","status","statustype","back","breadcrumb","tabs","noshadow","a11ylabels","scrollcontainer","nopaddingbreadcrumb","hasicons","hasselector","hideoptions"]}get title(){return this.$$.ctx[0]}set title(e){this.$$set({title:e}),s()}get subtitle(){return this.$$.ctx[1]}set subtitle(e){this.$$set({subtitle:e}),s()}get size(){return this.$$.ctx[2]}set size(e){this.$$set({size:e}),s()}get status(){return this.$$.ctx[3]}set status(e){this.$$set({status:e}),s()}get statustype(){return this.$$.ctx[4]}set statustype(e){this.$$set({statustype:e}),s()}get back(){return this.$$.ctx[21]}set back(e){this.$$set({back:e}),s()}get breadcrumb(){return this.$$.ctx[5]}set breadcrumb(e){this.$$set({breadcrumb:e}),s()}get tabs(){return this.$$.ctx[22]}set tabs(e){this.$$set({tabs:e}),s()}get noshadow(){return this.$$.ctx[23]}set noshadow(e){this.$$set({noshadow:e}),s()}get a11ylabels(){return this.$$.ctx[24]}set a11ylabels(e){this.$$set({a11ylabels:e}),s()}get scrollcontainer(){return this.$$.ctx[25]}set scrollcontainer(e){this.$$set({scrollcontainer:e}),s()}get nopaddingbreadcrumb(){return this.$$.ctx[6]}set nopaddingbreadcrumb(e){this.$$set({nopaddingbreadcrumb:e}),s()}get hasicons(){return this.$$.ctx[7]}set hasicons(e){this.$$set({hasicons:e}),s()}get hasselector(){return this.$$.ctx[8]}set hasselector(e){this.$$set({hasselector:e}),s()}get hideoptions(){return this.$$.ctx[9]}set hideoptions(e){this.$$set({hideoptions:e}),s()}}export{Y as default};
+import { S as SvelteElement, i as init, a as attribute_to_object, _ as get_custom_elements_slots, b as insert, f as flush, s as safe_not_equal, c as assign, e as element, d as space, t as text, n as noop, g as attr, h as set_attributes, z as toggle_class, j as append, C as transition_in, D as transition_out, E as check_outros, k as set_data, m as get_spread_update, o as detach, p as compute_rest_props, a0 as compute_slots, q as exclude_internal_props, x as create_component, A as mount_component, G as destroy_component, l as listen, M as group_outros, v as binding_callbacks } from '../../index-c33b3772.js';
+import { E as EventHandler } from '../../EventHandler-02058705.js';
+import Breadcrumb_nested from '../breadcrumb/Breadcrumb.nested.js';
+import Tabs_nested from '../tabs/Tabs.nested.js';
+import Badge_nested from '../badge/Badge.nested.js';
+
+/* src/components/header/Header.svelte generated by Svelte v3.58.0 */
+
+function create_if_block_7(ctx) {
+	let div;
+	let breadcrumb_1;
+	let current;
+
+	breadcrumb_1 = new Breadcrumb_nested({
+			props: {
+				items: JSON.stringify(/*parsedBreadcrumb*/ ctx[17]),
+				nopadding: /*nopaddingbreadcrumb*/ ctx[6]
+			}
+		});
+
+	breadcrumb_1.$on("link-clicked", /*link_clicked_handler*/ ctx[26]);
+
+	return {
+		c() {
+			div = element("div");
+			create_component(breadcrumb_1.$$.fragment);
+			attr(div, "class", "mc-header__breadcrumb");
+		},
+		m(target, anchor) {
+			insert(target, div, anchor);
+			mount_component(breadcrumb_1, div, null);
+			current = true;
+		},
+		p(ctx, dirty) {
+			const breadcrumb_1_changes = {};
+			if (dirty[0] & /*parsedBreadcrumb*/ 131072) breadcrumb_1_changes.items = JSON.stringify(/*parsedBreadcrumb*/ ctx[17]);
+			if (dirty[0] & /*nopaddingbreadcrumb*/ 64) breadcrumb_1_changes.nopadding = /*nopaddingbreadcrumb*/ ctx[6];
+			breadcrumb_1.$set(breadcrumb_1_changes);
+		},
+		i(local) {
+			if (current) return;
+			transition_in(breadcrumb_1.$$.fragment, local);
+			current = true;
+		},
+		o(local) {
+			transition_out(breadcrumb_1.$$.fragment, local);
+			current = false;
+		},
+		d(detaching) {
+			if (detaching) detach(div);
+			destroy_component(breadcrumb_1);
+		}
+	};
+}
+
+// (98:4) {#if hasBack}
+function create_if_block_6(ctx) {
+	let button;
+	let span;
+	let t_value = (/*parsedA11yLabels*/ ctx[15]?.['back'] || 'Back') + "";
+	let t;
+	let mounted;
+	let dispose;
+
+	return {
+		c() {
+			button = element("button");
+			span = element("span");
+			t = text(t_value);
+			attr(span, "class", "mc-header__back__label");
+			attr(button, "class", "mc-header__back");
+		},
+		m(target, anchor) {
+			insert(target, button, anchor);
+			append(button, span);
+			append(span, t);
+
+			if (!mounted) {
+				dispose = listen(button, "click", /*goBack*/ ctx[19]);
+				mounted = true;
+			}
+		},
+		p(ctx, dirty) {
+			if (dirty[0] & /*parsedA11yLabels*/ 32768 && t_value !== (t_value = (/*parsedA11yLabels*/ ctx[15]?.['back'] || 'Back') + "")) set_data(t, t_value);
+		},
+		d(detaching) {
+			if (detaching) detach(button);
+			mounted = false;
+			dispose();
+		}
+	};
+}
+
+// (110:6) {#if subtitle}
+function create_if_block_5(ctx) {
+	let div;
+	let t;
+
+	return {
+		c() {
+			div = element("div");
+			t = text(/*subtitle*/ ctx[1]);
+			attr(div, "class", "mc-header__heading__subtitle");
+		},
+		m(target, anchor) {
+			insert(target, div, anchor);
+			append(div, t);
+		},
+		p(ctx, dirty) {
+			if (dirty[0] & /*subtitle*/ 2) set_data(t, /*subtitle*/ ctx[1]);
+		},
+		d(detaching) {
+			if (detaching) detach(div);
+		}
+	};
+}
+
+// (115:6) {#if status}
+function create_if_block_4(ctx) {
+	let div;
+	let badge;
+	let current;
+
+	badge = new Badge_nested({
+			props: {
+				label: /*status*/ ctx[3],
+				type: /*statustype*/ ctx[4]
+			}
+		});
+
+	return {
+		c() {
+			div = element("div");
+			create_component(badge.$$.fragment);
+			attr(div, "class", "mc-header__heading__status");
+		},
+		m(target, anchor) {
+			insert(target, div, anchor);
+			mount_component(badge, div, null);
+			current = true;
+		},
+		p(ctx, dirty) {
+			const badge_changes = {};
+			if (dirty[0] & /*status*/ 8) badge_changes.label = /*status*/ ctx[3];
+			if (dirty[0] & /*statustype*/ 16) badge_changes.type = /*statustype*/ ctx[4];
+			badge.$set(badge_changes);
+		},
+		i(local) {
+			if (current) return;
+			transition_in(badge.$$.fragment, local);
+			current = true;
+		},
+		o(local) {
+			transition_out(badge.$$.fragment, local);
+			current = false;
+		},
+		d(detaching) {
+			if (detaching) detach(div);
+			destroy_component(badge);
+		}
+	};
+}
+
+// (122:2) {#if !hideoptions}
+function create_if_block_1(ctx) {
+	let div;
+	let t;
+	let if_block0 = (/*$$slots*/ ctx[20]?.icons || /*hasicons*/ ctx[7]) && create_if_block_3();
+	let if_block1 = (/*$$slots*/ ctx[20]?.selector || /*hasselector*/ ctx[8]) && create_if_block_2(ctx);
+
+	return {
+		c() {
+			div = element("div");
+			if (if_block0) if_block0.c();
+			t = space();
+			if (if_block1) if_block1.c();
+			attr(div, "class", "mc-header__right");
+		},
+		m(target, anchor) {
+			insert(target, div, anchor);
+			if (if_block0) if_block0.m(div, null);
+			append(div, t);
+			if (if_block1) if_block1.m(div, null);
+		},
+		p(ctx, dirty) {
+			if (/*$$slots*/ ctx[20]?.icons || /*hasicons*/ ctx[7]) {
+				if (if_block0) ; else {
+					if_block0 = create_if_block_3();
+					if_block0.c();
+					if_block0.m(div, t);
+				}
+			} else if (if_block0) {
+				if_block0.d(1);
+				if_block0 = null;
+			}
+
+			if (/*$$slots*/ ctx[20]?.selector || /*hasselector*/ ctx[8]) {
+				if (if_block1) {
+					if_block1.p(ctx, dirty);
+				} else {
+					if_block1 = create_if_block_2(ctx);
+					if_block1.c();
+					if_block1.m(div, null);
+				}
+			} else if (if_block1) {
+				if_block1.d(1);
+				if_block1 = null;
+			}
+		},
+		d(detaching) {
+			if (detaching) detach(div);
+			if (if_block0) if_block0.d();
+			if (if_block1) if_block1.d();
+		}
+	};
+}
+
+// (124:6) {#if $$slots?.icons || hasicons}
+function create_if_block_3(ctx) {
+	let div;
+
+	return {
+		c() {
+			div = element("div");
+			div.innerHTML = `<slot name="icons"></slot>`;
+			attr(div, "class", "mc-header__icons");
+		},
+		m(target, anchor) {
+			insert(target, div, anchor);
+		},
+		d(detaching) {
+			if (detaching) detach(div);
+		}
+	};
+}
+
+// (129:6) {#if $$slots?.selector || hasselector}
+function create_if_block_2(ctx) {
+	let div;
+
+	return {
+		c() {
+			div = element("div");
+			div.innerHTML = `<slot name="selector"></slot>`;
+			attr(div, "class", "mc-header__selector");
+			toggle_class(div, "mc-header__selector--show-separator", (/*$$slots*/ ctx[20]?.icons || /*hasicons*/ ctx[7]) && (/*$$slots*/ ctx[20]?.selector || /*hasselector*/ ctx[8]));
+		},
+		m(target, anchor) {
+			insert(target, div, anchor);
+		},
+		p(ctx, dirty) {
+			if (dirty[0] & /*$$slots, hasicons, hasselector*/ 1048960) {
+				toggle_class(div, "mc-header__selector--show-separator", (/*$$slots*/ ctx[20]?.icons || /*hasicons*/ ctx[7]) && (/*$$slots*/ ctx[20]?.selector || /*hasselector*/ ctx[8]));
+			}
+		},
+		d(detaching) {
+			if (detaching) detach(div);
+		}
+	};
+}
+
+// (141:2) {#if parsedTabs && parsedTabs.length > 0}
+function create_if_block(ctx) {
+	let div;
+	let tabs_1;
+	let current;
+
+	tabs_1 = new Tabs_nested({
+			props: {
+				tabs: JSON.stringify(/*parsedTabs*/ ctx[16]),
+				nodivider: true
+			}
+		});
+
+	tabs_1.$on("tab-clicked", /*tab_clicked_handler*/ ctx[27]);
+
+	return {
+		c() {
+			div = element("div");
+			create_component(tabs_1.$$.fragment);
+			attr(div, "class", "mc-header__tabs");
+		},
+		m(target, anchor) {
+			insert(target, div, anchor);
+			mount_component(tabs_1, div, null);
+			current = true;
+		},
+		p(ctx, dirty) {
+			const tabs_1_changes = {};
+			if (dirty[0] & /*parsedTabs*/ 65536) tabs_1_changes.tabs = JSON.stringify(/*parsedTabs*/ ctx[16]);
+			tabs_1.$set(tabs_1_changes);
+		},
+		i(local) {
+			if (current) return;
+			transition_in(tabs_1.$$.fragment, local);
+			current = true;
+		},
+		o(local) {
+			transition_out(tabs_1.$$.fragment, local);
+			current = false;
+		},
+		d(detaching) {
+			if (detaching) detach(div);
+			destroy_component(tabs_1);
+		}
+	};
+}
+
+function create_fragment(ctx) {
+	let div2;
+	let div1;
+	let t0;
+	let t1;
+	let div0;
+	let h1;
+	let t2;
+	let t3;
+	let t4;
+	let t5;
+	let t6;
+	let div2_class_value;
+	let current;
+	let if_block0 = /*breadcrumb*/ ctx[5] && create_if_block_7(ctx);
+	let if_block1 = /*hasBack*/ ctx[14] && create_if_block_6(ctx);
+	let if_block2 = /*subtitle*/ ctx[1] && create_if_block_5(ctx);
+	let if_block3 = /*status*/ ctx[3] && create_if_block_4(ctx);
+	let if_block4 = !/*hideoptions*/ ctx[9] && create_if_block_1(ctx);
+	let if_block5 = /*parsedTabs*/ ctx[16] && /*parsedTabs*/ ctx[16].length > 0 && create_if_block(ctx);
+
+	let div2_levels = [
+		{
+			class: div2_class_value = "mc-header " + (/*size*/ ctx[2] ? `mc-header--${/*size*/ ctx[2]}` : '')
+		},
+		/*attributes*/ ctx[10]
+	];
+
+	let div_data_2 = {};
+
+	for (let i = 0; i < div2_levels.length; i += 1) {
+		div_data_2 = assign(div_data_2, div2_levels[i]);
+	}
+
+	return {
+		c() {
+			div2 = element("div");
+			div1 = element("div");
+			if (if_block0) if_block0.c();
+			t0 = space();
+			if (if_block1) if_block1.c();
+			t1 = space();
+			div0 = element("div");
+			h1 = element("h1");
+			t2 = text(/*title*/ ctx[0]);
+			t3 = space();
+			if (if_block2) if_block2.c();
+			t4 = space();
+			if (if_block3) if_block3.c();
+			t5 = space();
+			if (if_block4) if_block4.c();
+			t6 = space();
+			if (if_block5) if_block5.c();
+			this.c = noop;
+			attr(h1, "class", "mc-header__heading__title");
+			attr(div0, "class", "mc-header__heading");
+			attr(div1, "class", "mc-header__left");
+			set_attributes(div2, div_data_2);
+			toggle_class(div2, "mc-header--no-shadow", /*hasNoShadow*/ ctx[13]);
+			toggle_class(div2, "mc-header--animate", /*hasAnimation*/ ctx[11]);
+		},
+		m(target, anchor) {
+			insert(target, div2, anchor);
+			append(div2, div1);
+			if (if_block0) if_block0.m(div1, null);
+			append(div1, t0);
+			if (if_block1) if_block1.m(div1, null);
+			append(div1, t1);
+			append(div1, div0);
+			append(div0, h1);
+			append(h1, t2);
+			append(div0, t3);
+			if (if_block2) if_block2.m(div0, null);
+			append(div0, t4);
+			if (if_block3) if_block3.m(div0, null);
+			append(div2, t5);
+			if (if_block4) if_block4.m(div2, null);
+			append(div2, t6);
+			if (if_block5) if_block5.m(div2, null);
+			/*div2_binding*/ ctx[28](div2);
+			current = true;
+		},
+		p(ctx, dirty) {
+			if (/*breadcrumb*/ ctx[5]) {
+				if (if_block0) {
+					if_block0.p(ctx, dirty);
+
+					if (dirty[0] & /*breadcrumb*/ 32) {
+						transition_in(if_block0, 1);
+					}
+				} else {
+					if_block0 = create_if_block_7(ctx);
+					if_block0.c();
+					transition_in(if_block0, 1);
+					if_block0.m(div1, t0);
+				}
+			} else if (if_block0) {
+				group_outros();
+
+				transition_out(if_block0, 1, 1, () => {
+					if_block0 = null;
+				});
+
+				check_outros();
+			}
+
+			if (/*hasBack*/ ctx[14]) {
+				if (if_block1) {
+					if_block1.p(ctx, dirty);
+				} else {
+					if_block1 = create_if_block_6(ctx);
+					if_block1.c();
+					if_block1.m(div1, t1);
+				}
+			} else if (if_block1) {
+				if_block1.d(1);
+				if_block1 = null;
+			}
+
+			if (!current || dirty[0] & /*title*/ 1) set_data(t2, /*title*/ ctx[0]);
+
+			if (/*subtitle*/ ctx[1]) {
+				if (if_block2) {
+					if_block2.p(ctx, dirty);
+				} else {
+					if_block2 = create_if_block_5(ctx);
+					if_block2.c();
+					if_block2.m(div0, t4);
+				}
+			} else if (if_block2) {
+				if_block2.d(1);
+				if_block2 = null;
+			}
+
+			if (/*status*/ ctx[3]) {
+				if (if_block3) {
+					if_block3.p(ctx, dirty);
+
+					if (dirty[0] & /*status*/ 8) {
+						transition_in(if_block3, 1);
+					}
+				} else {
+					if_block3 = create_if_block_4(ctx);
+					if_block3.c();
+					transition_in(if_block3, 1);
+					if_block3.m(div0, null);
+				}
+			} else if (if_block3) {
+				group_outros();
+
+				transition_out(if_block3, 1, 1, () => {
+					if_block3 = null;
+				});
+
+				check_outros();
+			}
+
+			if (!/*hideoptions*/ ctx[9]) {
+				if (if_block4) {
+					if_block4.p(ctx, dirty);
+				} else {
+					if_block4 = create_if_block_1(ctx);
+					if_block4.c();
+					if_block4.m(div2, t6);
+				}
+			} else if (if_block4) {
+				if_block4.d(1);
+				if_block4 = null;
+			}
+
+			if (/*parsedTabs*/ ctx[16] && /*parsedTabs*/ ctx[16].length > 0) {
+				if (if_block5) {
+					if_block5.p(ctx, dirty);
+
+					if (dirty[0] & /*parsedTabs*/ 65536) {
+						transition_in(if_block5, 1);
+					}
+				} else {
+					if_block5 = create_if_block(ctx);
+					if_block5.c();
+					transition_in(if_block5, 1);
+					if_block5.m(div2, null);
+				}
+			} else if (if_block5) {
+				group_outros();
+
+				transition_out(if_block5, 1, 1, () => {
+					if_block5 = null;
+				});
+
+				check_outros();
+			}
+
+			set_attributes(div2, div_data_2 = get_spread_update(div2_levels, [
+				(!current || dirty[0] & /*size*/ 4 && div2_class_value !== (div2_class_value = "mc-header " + (/*size*/ ctx[2] ? `mc-header--${/*size*/ ctx[2]}` : ''))) && { class: div2_class_value },
+				dirty[0] & /*attributes*/ 1024 && /*attributes*/ ctx[10]
+			]));
+
+			toggle_class(div2, "mc-header--no-shadow", /*hasNoShadow*/ ctx[13]);
+			toggle_class(div2, "mc-header--animate", /*hasAnimation*/ ctx[11]);
+		},
+		i(local) {
+			if (current) return;
+			transition_in(if_block0);
+			transition_in(if_block3);
+			transition_in(if_block5);
+			current = true;
+		},
+		o(local) {
+			transition_out(if_block0);
+			transition_out(if_block3);
+			transition_out(if_block5);
+			current = false;
+		},
+		d(detaching) {
+			if (detaching) detach(div2);
+			if (if_block0) if_block0.d();
+			if (if_block1) if_block1.d();
+			if (if_block2) if_block2.d();
+			if (if_block3) if_block3.d();
+			if (if_block4) if_block4.d();
+			if (if_block5) if_block5.d();
+			/*div2_binding*/ ctx[28](null);
+		}
+	};
+}
+
+const headerAnimationThreshold = 5;
+
+function instance($$self, $$props, $$invalidate) {
+	let parsedBreadcrumb;
+	let parsedTabs;
+	let parsedA11yLabels;
+	let hasBack;
+	let hasNoShadow;
+	let attributes;
+
+	const omit_props_names = [
+		"title","subtitle","size","status","statustype","back","breadcrumb","tabs","noshadow","a11ylabels","scrollcontainer","nopaddingbreadcrumb","hasicons","hasselector","hideoptions"
+	];
+
+	let $$restProps = compute_rest_props($$props, omit_props_names);
+	let { $$slots: slots = {}, $$scope } = $$props;
+	const $$slots = compute_slots(slots);
+	let { title } = $$props;
+	let { subtitle } = $$props;
+	let { size = 'm' } = $$props;
+	let { status } = $$props;
+	let { statustype } = $$props;
+	let { back } = $$props;
+	let { breadcrumb } = $$props;
+	let { tabs } = $$props;
+	let { noshadow } = $$props;
+	let { a11ylabels } = $$props;
+	let { scrollcontainer } = $$props;
+	let { nopaddingbreadcrumb } = $$props;
+	let { hasicons } = $$props;
+	let { hasselector } = $$props;
+	let { hideoptions = false } = $$props;
+	let eventHandler = new EventHandler();
+	let originalScrollPos = 0;
+	let hasAnimation;
+	let root;
+
+	function goBack() {
+		eventHandler.dispatch('on-back-click', {});
+	}
+
+	function updateAnimation(element) {
+		if (element) {
+			element.removeEventListener('scroll', handleScroll);
+			element.addEventListener('scroll', handleScroll);
+		}
+	}
+
+	function handleScroll() {
+		const currentScrollPos = scrollcontainer.scrollTop;
+		const originHeaderMargin = Number(root.style.marginTop.replace('px', ''));
+
+		if (originalScrollPos > currentScrollPos) {
+			if (currentScrollPos < root.offsetHeight) {
+				$$invalidate(12, root.style.marginTop = `${Math.max(-currentScrollPos, originHeaderMargin)}px`, root);
+			} else {
+				$$invalidate(12, root.style.marginTop = '0', root);
+			}
+		} else {
+			if (currentScrollPos < root.offsetHeight) {
+				$$invalidate(12, root.style.transition = 'none', root);
+				$$invalidate(12, root.style.marginTop = `${-currentScrollPos}px`, root);
+			} else {
+				$$invalidate(12, root.style.transition = 'margin-top ease-out 0.4s', root);
+				$$invalidate(12, root.style.marginTop = `${-root.offsetHeight - headerAnimationThreshold}px`, root);
+			}
+		}
+
+		originalScrollPos = currentScrollPos;
+	}
+
+	const link_clicked_handler = event => eventHandler.dispatch('link-clicked', event.detail);
+	const tab_clicked_handler = event => eventHandler.dispatch('tab-clicked', event.detail);
+
+	function div2_binding($$value) {
+		binding_callbacks[$$value ? 'unshift' : 'push'](() => {
+			root = $$value;
+			$$invalidate(12, root);
+		});
+	}
+
+	$$self.$$set = $$new_props => {
+		$$props = assign(assign({}, $$props), exclude_internal_props($$new_props));
+		$$invalidate(32, $$restProps = compute_rest_props($$props, omit_props_names));
+		if ('title' in $$new_props) $$invalidate(0, title = $$new_props.title);
+		if ('subtitle' in $$new_props) $$invalidate(1, subtitle = $$new_props.subtitle);
+		if ('size' in $$new_props) $$invalidate(2, size = $$new_props.size);
+		if ('status' in $$new_props) $$invalidate(3, status = $$new_props.status);
+		if ('statustype' in $$new_props) $$invalidate(4, statustype = $$new_props.statustype);
+		if ('back' in $$new_props) $$invalidate(21, back = $$new_props.back);
+		if ('breadcrumb' in $$new_props) $$invalidate(5, breadcrumb = $$new_props.breadcrumb);
+		if ('tabs' in $$new_props) $$invalidate(22, tabs = $$new_props.tabs);
+		if ('noshadow' in $$new_props) $$invalidate(23, noshadow = $$new_props.noshadow);
+		if ('a11ylabels' in $$new_props) $$invalidate(24, a11ylabels = $$new_props.a11ylabels);
+		if ('scrollcontainer' in $$new_props) $$invalidate(25, scrollcontainer = $$new_props.scrollcontainer);
+		if ('nopaddingbreadcrumb' in $$new_props) $$invalidate(6, nopaddingbreadcrumb = $$new_props.nopaddingbreadcrumb);
+		if ('hasicons' in $$new_props) $$invalidate(7, hasicons = $$new_props.hasicons);
+		if ('hasselector' in $$new_props) $$invalidate(8, hasselector = $$new_props.hasselector);
+		if ('hideoptions' in $$new_props) $$invalidate(9, hideoptions = $$new_props.hideoptions);
+	};
+
+	$$self.$$.update = () => {
+		if ($$self.$$.dirty[0] & /*breadcrumb*/ 32) {
+			$$invalidate(17, parsedBreadcrumb = typeof breadcrumb === 'string'
+			? JSON.parse(breadcrumb)
+			: breadcrumb);
+		}
+
+		if ($$self.$$.dirty[0] & /*tabs*/ 4194304) {
+			$$invalidate(16, parsedTabs = typeof tabs === 'string' ? JSON.parse(tabs) : tabs);
+		}
+
+		if ($$self.$$.dirty[0] & /*a11ylabels*/ 16777216) {
+			$$invalidate(15, parsedA11yLabels = typeof a11ylabels === 'string'
+			? JSON.parse(a11ylabels)
+			: a11ylabels);
+		}
+
+		if ($$self.$$.dirty[0] & /*back*/ 2097152) {
+			$$invalidate(14, hasBack = back && back !== 'false');
+		}
+
+		if ($$self.$$.dirty[0] & /*noshadow*/ 8388608) {
+			$$invalidate(13, hasNoShadow = noshadow && noshadow !== 'false');
+		}
+
+		if ($$self.$$.dirty[0] & /*scrollcontainer*/ 33554432) {
+			{
+				$$invalidate(11, hasAnimation = Boolean(scrollcontainer));
+				updateAnimation(scrollcontainer);
+			}
+		}
+
+		$$invalidate(10, attributes = Object.assign({}, $$restProps));
+
+		if ($$self.$$.dirty[0] & /*attributes*/ 1024) {
+			delete attributes.class;
+		}
+	};
+
+	return [
+		title,
+		subtitle,
+		size,
+		status,
+		statustype,
+		breadcrumb,
+		nopaddingbreadcrumb,
+		hasicons,
+		hasselector,
+		hideoptions,
+		attributes,
+		hasAnimation,
+		root,
+		hasNoShadow,
+		hasBack,
+		parsedA11yLabels,
+		parsedTabs,
+		parsedBreadcrumb,
+		eventHandler,
+		goBack,
+		$$slots,
+		back,
+		tabs,
+		noshadow,
+		a11ylabels,
+		scrollcontainer,
+		link_clicked_handler,
+		tab_clicked_handler,
+		div2_binding
+	];
+}
+
+class Header extends SvelteElement {
+	constructor(options) {
+		super();
+		const style = document.createElement('style');
+		style.textContent = `.mc-header{background-color:#ffffff;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-shadow:0px 4px 5px rgba(0, 0, 0, 0.2);box-shadow:0px 4px 5px rgba(0, 0, 0, 0.2);font-family:"LeroyMerlin", sans-serif;font-weight:400}.mc-header .mc-header__back{height:2.25rem}.mc-header .mc-header__heading__title{font-size:1.75rem;line-height:1.2857142857}.mc-header__left{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex:1;flex:1;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-bottom:1rem;padding-top:0.5rem;padding-left:2rem}.mc-header__right{-webkit-box-flex:0;-ms-flex:0;flex:0;display:-webkit-box;display:-ms-flexbox;display:flex;margin-left:1.5rem;margin-bottom:1rem;padding-top:1rem;padding-right:2rem;height:2rem;width:28rem;min-width:28rem;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.mc-header__tabs{width:100%;position:relative;padding-left:2rem;padding-right:2rem}.mc-header__tabs::before{content:"";background-color:#b3b3b3;top:0;right:0;height:1px;position:absolute;width:100%;z-index:1}.mc-header__breadcrumb{height:3rem;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.mc-header__back{margin:0;-webkit-box-shadow:none;box-shadow:none;text-decoration:none;outline:none;border:none;cursor:pointer;padding:0;background-color:transparent;background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMnJlbSIgd2lkdGg9IjJyZW0iIHZpZXdCb3g9IjAgMCAzMiAzMiIgZmlsbD0iIzMzMzMzMyI+PHBhdGggZD0iTTI4IDE1SDYuNDFsNi4zLTYuMjlhMSAxIDAgMTAtMS40Mi0xLjQybC04IDhhMS4xNSAxLjE1IDAgMDAtLjIxLjMzIDEgMSAwIDAwMCAuNzYuOTMuOTMgMCAwMC4yMS4zM2w4IDhhMSAxIDAgMDAxLjQyIDAgMSAxIDAgMDAwLTEuNDJMNi40MSAxN0gyOGExIDEgMCAwMDAtMnoiLz48L3N2Zz4=");background-repeat:no-repeat;background-position:center;background-size:2rem;color:currentColor;display:inline-block;-webkit-box-flex:0;-ms-flex:0 0 2rem;flex:0 0 2rem;margin-top:0.5rem;margin-right:1rem;height:2rem}.mc-header__back__label{font-size:0;height:1px;overflow:hidden;display:block}.mc-header__heading{display:inline-block;width:calc(100% - 3em)}.mc-header__heading__title{font-weight:600;color:#191919;width:100%;margin-top:0.5rem;margin-bottom:0}.mc-header__heading__subtitle{font-weight:400;color:#191919;display:inline-block;margin-top:0.25rem;margin-bottom:0}.mc-header__heading__status{font-weight:400;display:inline-block;margin-top:0.25rem;margin-bottom:0}.mc-header__heading__subtitle+.mc-header__heading__status{margin-left:1rem}.mc-header__icons{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex:1;flex:1;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;max-width:9rem;width:9rem}.mc-header__selector{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;padding-left:0;margin-left:1.5rem;max-width:16rem;width:16rem}.mc-header__selector--show-separator{padding-left:1.5rem}.mc-header__selector--show-separator::before{content:"";background-color:#b3b3b3;left:0;height:100%;position:absolute;width:1px}.mc-header--no-shadow{-webkit-box-shadow:none;box-shadow:none}.mc-header--animate{margin-top:0px;-webkit-transition:margin-top ease-out 0.4s;-o-transition:margin-top ease-out 0.4s;transition:margin-top ease-out 0.4s;width:100%}@media screen and (min-width: 360px){.mc-header__breadcrumb{margin-left:-1.25rem;margin-right:1.25rem}.mc-header__left{padding-left:1rem}.mc-header__right{padding-right:1rem}.mc-header__tabs{padding-left:1rem;padding-right:1rem}}@media screen and (min-width: 390px){.mc-header__breadcrumb{margin-left:-magic-unit-rem(1.375, "true");margin-right:1.375rem}}@media screen and (min-width: 680px){.mc-header__breadcrumb{margin-left:-2rem;margin-right:2rem}}@media screen and (min-width: 769px){.mc-header__breadcrumb{margin-left:-magic-unit-rem(2.125, "true");margin-right:2.125rem}.mc-header__left{padding-left:2rem}.mc-header__right{padding-right:2rem}.mc-header__tabs{padding-left:2rem;padding-right:2rem}}@media screen and (min-width: 1024px){.mc-header__breadcrumb{margin-left:-3rem;margin-right:3rem}.mc-header__left{padding-left:3rem}.mc-header__right{padding-right:3rem}.mc-header__tabs{padding-left:3rem;padding-right:3rem}}@media screen and (min-width: 1280px){.mc-header__breadcrumb{margin-left:-2rem;margin-right:2rem}.mc-header__left{padding-left:2rem}.mc-header__right{padding-right:2rem}.mc-header__tabs{padding-left:2rem;padding-right:2rem}}@media screen and (min-width: 1440px){.mc-header__breadcrumb{margin-left:-7rem;margin-right:7rem}}@media screen and (min-width: 1680px){.mc-header__breadcrumb{margin-left:-2rem;margin-right:2rem}}@media screen and (min-width: 1920px){.mc-header__breadcrumb{margin-left:-2.5rem;margin-right:2.5rem}}.mc-header--s .mc-header__back{height:2rem}.mc-header--s .mc-header__heading__title{font-size:1.4375rem;line-height:1.3913043478}.mc-header--l .mc-header__back{height:2.75rem}.mc-header--l .mc-header__heading__title{font-size:2.125rem;line-height:1.2941176471}:host{display:block;line-height:0}`;
+		this.shadowRoot.appendChild(style);
+
+		init(
+			this,
+			{
+				target: this.shadowRoot,
+				props: {
+					...attribute_to_object(this.attributes),
+					$$slots: get_custom_elements_slots(this)
+				},
+				customElement: true
+			},
+			instance,
+			create_fragment,
+			safe_not_equal,
+			{
+				title: 0,
+				subtitle: 1,
+				size: 2,
+				status: 3,
+				statustype: 4,
+				back: 21,
+				breadcrumb: 5,
+				tabs: 22,
+				noshadow: 23,
+				a11ylabels: 24,
+				scrollcontainer: 25,
+				nopaddingbreadcrumb: 6,
+				hasicons: 7,
+				hasselector: 8,
+				hideoptions: 9
+			},
+			null,
+			[-1, -1]
+		);
+
+		if (options) {
+			if (options.target) {
+				insert(options.target, this, options.anchor);
+			}
+
+			if (options.props) {
+				this.$set(options.props);
+				flush();
+			}
+		}
+	}
+
+	static get observedAttributes() {
+		return [
+			"title",
+			"subtitle",
+			"size",
+			"status",
+			"statustype",
+			"back",
+			"breadcrumb",
+			"tabs",
+			"noshadow",
+			"a11ylabels",
+			"scrollcontainer",
+			"nopaddingbreadcrumb",
+			"hasicons",
+			"hasselector",
+			"hideoptions"
+		];
+	}
+
+	get title() {
+		return this.$$.ctx[0];
+	}
+
+	set title(title) {
+		this.$$set({ title });
+		flush();
+	}
+
+	get subtitle() {
+		return this.$$.ctx[1];
+	}
+
+	set subtitle(subtitle) {
+		this.$$set({ subtitle });
+		flush();
+	}
+
+	get size() {
+		return this.$$.ctx[2];
+	}
+
+	set size(size) {
+		this.$$set({ size });
+		flush();
+	}
+
+	get status() {
+		return this.$$.ctx[3];
+	}
+
+	set status(status) {
+		this.$$set({ status });
+		flush();
+	}
+
+	get statustype() {
+		return this.$$.ctx[4];
+	}
+
+	set statustype(statustype) {
+		this.$$set({ statustype });
+		flush();
+	}
+
+	get back() {
+		return this.$$.ctx[21];
+	}
+
+	set back(back) {
+		this.$$set({ back });
+		flush();
+	}
+
+	get breadcrumb() {
+		return this.$$.ctx[5];
+	}
+
+	set breadcrumb(breadcrumb) {
+		this.$$set({ breadcrumb });
+		flush();
+	}
+
+	get tabs() {
+		return this.$$.ctx[22];
+	}
+
+	set tabs(tabs) {
+		this.$$set({ tabs });
+		flush();
+	}
+
+	get noshadow() {
+		return this.$$.ctx[23];
+	}
+
+	set noshadow(noshadow) {
+		this.$$set({ noshadow });
+		flush();
+	}
+
+	get a11ylabels() {
+		return this.$$.ctx[24];
+	}
+
+	set a11ylabels(a11ylabels) {
+		this.$$set({ a11ylabels });
+		flush();
+	}
+
+	get scrollcontainer() {
+		return this.$$.ctx[25];
+	}
+
+	set scrollcontainer(scrollcontainer) {
+		this.$$set({ scrollcontainer });
+		flush();
+	}
+
+	get nopaddingbreadcrumb() {
+		return this.$$.ctx[6];
+	}
+
+	set nopaddingbreadcrumb(nopaddingbreadcrumb) {
+		this.$$set({ nopaddingbreadcrumb });
+		flush();
+	}
+
+	get hasicons() {
+		return this.$$.ctx[7];
+	}
+
+	set hasicons(hasicons) {
+		this.$$set({ hasicons });
+		flush();
+	}
+
+	get hasselector() {
+		return this.$$.ctx[8];
+	}
+
+	set hasselector(hasselector) {
+		this.$$set({ hasselector });
+		flush();
+	}
+
+	get hideoptions() {
+		return this.$$.ctx[9];
+	}
+
+	set hideoptions(hideoptions) {
+		this.$$set({ hideoptions });
+		flush();
+	}
+}
+
+export { Header as default };
 //# sourceMappingURL=Header.js.map