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

package/public/components/sidebar/sidebar-user.nested.js

@@ -1,2 +1,734 @@
-import{P as e,i as t,s,Q as a,K as i,b as n,C as r,D as l,E as o,o as d,ab as c,e as u,d as h,g as m,j as x,l as p,M as b,t as f,k as _,J as w,x as g,A as v,I as y,G as k,v as $,T as L,n as j,y as z,$ as B}from"../../index-c33b3772.js";import{t as C,a as M,i as A}from"../../sidebar-service-275bf9ef.js";import N from"./sidebar-feature.nested.js";function H(e){a(e,"svelte-h4x6wa",".mc-sidebar-user.svelte-h4x6wa.svelte-h4x6wa{left:0;right:0;bottom:0;position:absolute;background:#cfd2d8}.mc-sidebar-user__header.svelte-h4x6wa.svelte-h4x6wa{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:none;border:none;color:#191919;font-size:inherit;font-family:inherit;text-align:initial;margin:0;width:100%;overflow:hidden}.mc-sidebar-user__header.svelte-h4x6wa.svelte-h4x6wa:focus-visible{-webkit-box-shadow:none;box-shadow:none;border:none;border-radius:12px;outline:1px solid #0b96cc;outline-offset:-5px}.mc-sidebar-user__header.svelte-h4x6wa.svelte-h4x6wa:hover{cursor:pointer}.mc-sidebar-user__header.svelte-h4x6wa:hover .mc-sidebar-user__header__information__icon.svelte-h4x6wa{background:#b3b7c1}.mc-sidebar-user__header__picture.svelte-h4x6wa.svelte-h4x6wa{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;background:#5B737D;border-radius:24px;width:48px;min-width:48px;height:48px;overflow:hidden}.mc-sidebar-user__header__picture.svelte-h4x6wa img.svelte-h4x6wa{display:block}.mc-sidebar-user__header__information.svelte-h4x6wa.svelte-h4x6wa{-ms-flex-pack:distribute;justify-content:space-around;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-flex:1;-ms-flex:1;flex:1;margin:0;margin-left:8px;height:40px}.mc-sidebar-user__header__information__icon.svelte-h4x6wa.svelte-h4x6wa{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:32px;height:32px;border-radius:4px}.mc-sidebar-user__header__information__identity.svelte-h4x6wa.svelte-h4x6wa{font-size:16px;font-weight:bold}.mc-sidebar-user__header__information__title.svelte-h4x6wa.svelte-h4x6wa,.mc-sidebar-user__header__information__identity.svelte-h4x6wa.svelte-h4x6wa{white-space:nowrap;overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis;max-width:176px}.mc-sidebar-user__icon.svelte-h4x6wa.svelte-h4x6wa{fill:#191919}.mc-sidebar-user__content.svelte-h4x6wa.svelte-h4x6wa{list-style-type:none;padding:0;overflow:hidden;margin:-8px 0px 24px 0px;-o-transition:all 300ms ease-in-out;-webkit-transition:all 300ms ease-in-out;transition:all 300ms ease-in-out}.mc-sidebar-user__content.is-close.svelte-h4x6wa.svelte-h4x6wa{height:0;margin:0}.mc-sidebar-user.is-close.svelte-h4x6wa .mc-sidebar-user__header.svelte-h4x6wa{-o-transition:padding 300ms ease-in-out;-webkit-transition:padding 300ms ease-in-out;transition:padding 300ms ease-in-out;padding:12px 8px;margin:8px 0}.mc-sidebar-user.is-open.svelte-h4x6wa .mc-sidebar-user__header.svelte-h4x6wa{-o-transition:padding 300ms ease-in-out;-webkit-transition:padding 300ms ease-in-out;transition:padding 300ms ease-in-out;padding:12px 24px 12px 32px;margin:8px 0}")}function E(e,t,s){const a=e.slice();return a[11]=t[s],a}function V(e){let t,s,a,i,c,f,_,w,g,v,y;function k(e,t){return e[0].imageBase64?D:q}let $=k(e),L=$(e),j=e[4]&&F(e),z=e[1]?.length&&G(e);return{c(){t=u("div"),s=u("button"),a=u("span"),L.c(),i=h(),j&&j.c(),_=h(),z&&z.c(),m(a,"class","mc-sidebar-user__header__picture svelte-h4x6wa"),m(s,"aria-expanded",c=e[4]&&e[3]),m(s,"class","mc-sidebar-user__header svelte-h4x6wa"),m(s,"aria-label",f=e[4]&&e[3]?e[2]?.["close-user"]||"Close the user sub menu":e[2]?.["open-user"]||"Open the user sub menu"),m(s,"aria-controls","user-content"),m(s,"id","user-trigger"),m(t,"class",w="mc-sidebar-user "+(e[4]?"is-open":"is-close")+" svelte-h4x6wa")},m(r,l){n(r,t,l),x(t,s),x(s,a),L.m(a,null),x(s,i),j&&j.m(s,null),x(t,_),z&&z.m(t,null),g=!0,v||(y=p(t,"click",e[6]),v=!0)},p(e,i){$===($=k(e))&&L?L.p(e,i):(L.d(1),L=$(e),L&&(L.c(),L.m(a,null))),e[4]?j?j.p(e,i):(j=F(e),j.c(),j.m(s,null)):j&&(j.d(1),j=null),(!g||24&i&&c!==(c=e[4]&&e[3]))&&m(s,"aria-expanded",c),(!g||28&i&&f!==(f=e[4]&&e[3]?e[2]?.["close-user"]||"Close the user sub menu":e[2]?.["open-user"]||"Open the user sub menu"))&&m(s,"aria-label",f),e[1]?.length?z?(z.p(e,i),2&i&&r(z,1)):(z=G(e),z.c(),r(z,1),z.m(t,null)):z&&(b(),l(z,1,1,(()=>{z=null})),o()),(!g||16&i&&w!==(w="mc-sidebar-user "+(e[4]?"is-open":"is-close")+" svelte-h4x6wa"))&&m(t,"class",w)},i(e){g||(r(z),g=!0)},o(e){l(z),g=!1},d(e){e&&d(t),L.d(),j&&j.d(),z&&z.d(),v=!1,y()}}}function q(e){let t,s;return{c(){t=L("svg"),s=L("path"),m(s,"d","M12 12.76a5.38 5.38 0 115.38-5.38A5.39 5.39 0 0112 12.76zM12 4a3.38 3.38 0 103.38 3.38A3.39 3.39 0 0012 4zM16.48 13.58a1 1 0 00-.81.11 7.3 7.3 0 01-7.34 0 1 1 0 00-.81-.11l-2.81.87a1 1 0 00-.71 1V21a1 1 0 001 1h14a1 1 0 001-1v-5.59a1 1 0 00-.71-1zM18 20H6v-3.86l1.75-.53a9.36 9.36 0 008.5 0l1.75.53z"),m(t,"class","mc-sidebar-user__icon svelte-h4x6wa"),m(t,"width","24px"),m(t,"height","24px"),m(t,"viewBox","0 0 24 24")},m(e,a){n(e,t,a),x(t,s)},p:j,d(e){e&&d(t)}}}function D(e){let t,s;return{c(){t=u("img"),m(t,"class","base64 svelte-h4x6wa"),z(t,"display","block"),z(t,"width","auto"),z(t,"height","48px"),z(t,"max-width","48px"),m(t,"aria-hidden",""),m(t,"alt","User Picture"),B(t.src,s="data:image/png;base64, "+e[0].imageBase64)||m(t,"src",s)},m(e,s){n(e,t,s)},p(e,a){1&a&&!B(t.src,s="data:image/png;base64, "+e[0].imageBase64)&&m(t,"src",s)},d(e){e&&d(t)}}}function F(e){let t,s,a,r,l,o,c,p,b=(e[0]?.firstName||"")+"",w=(e[0]?.lastName||"")+"",g=e[0]?.title&&O(e),v=e[1]?.length&&P(e);return{c(){t=u("p"),s=u("span"),a=f(b),r=h(),l=f(w),o=h(),g&&g.c(),c=h(),v&&v.c(),p=i(),m(s,"class","mc-sidebar-user__header__information__identity svelte-h4x6wa"),m(t,"class","mc-sidebar-user__header__information svelte-h4x6wa")},m(e,i){n(e,t,i),x(t,s),x(s,a),x(s,r),x(s,l),x(t,o),g&&g.m(t,null),n(e,c,i),v&&v.m(e,i),n(e,p,i)},p(e,s){1&s&&b!==(b=(e[0]?.firstName||"")+"")&&_(a,b),1&s&&w!==(w=(e[0]?.lastName||"")+"")&&_(l,w),e[0]?.title?g?g.p(e,s):(g=O(e),g.c(),g.m(t,null)):g&&(g.d(1),g=null),e[1]?.length?v?v.p(e,s):(v=P(e),v.c(),v.m(p.parentNode,p)):v&&(v.d(1),v=null)},d(e){e&&d(t),g&&g.d(),e&&d(c),v&&v.d(e),e&&d(p)}}}function O(e){let t,s,a=K(e[0].title)+"";return{c(){t=u("span"),s=f(a),m(t,"class","mc-sidebar-user__header__information__title svelte-h4x6wa")},m(e,a){n(e,t,a),x(t,s)},p(e,t){1&t&&a!==(a=K(e[0].title)+"")&&_(s,a)},d(e){e&&d(t)}}}function P(e){let t;function s(e,t){return e[4]&&!e[3]?U:S}let a=s(e),i=a(e);return{c(){t=u("span"),i.c(),m(t,"class","mc-sidebar-user__header__information__icon svelte-h4x6wa")},m(e,s){n(e,t,s),i.m(t,null)},p(e,n){a!==(a=s(e))&&(i.d(1),i=a(e),i&&(i.c(),i.m(t,null)))},d(e){e&&d(t),i.d()}}}function S(e){let t,s;return{c(){t=L("svg"),s=L("path"),m(s,"d","M12 9H4a1 1 0 010-2h8a1 1 0 010 2z"),m(t,"width","16px"),m(t,"height","16px"),m(t,"class","mc-sidebar-user__icon svelte-h4x6wa"),m(t,"viewBox","0 0 16 16")},m(e,a){n(e,t,a),x(t,s)},d(e){e&&d(t)}}}function U(e){let t,s;return{c(){t=L("svg"),s=L("path"),m(s,"d","M13 7H9V3a1 1 0 00-2 0v4H3a1 1 0 000 2h4v4a1 1 0 002 0V9h4a1 1 0 000-2z"),m(t,"class","mc-sidebar-user__icon svelte-h4x6wa"),m(t,"width","16px"),m(t,"height","16px"),m(t,"viewBox","0 0 16 16")},m(e,a){n(e,t,a),x(t,s)},d(e){e&&d(t)}}}function G(e){let t,s,a,i=e[1],c=[];for(let t=0;t<i.length;t+=1)c[t]=I(E(e,i,t));const h=e=>l(c[e],1,1,(()=>{c[e]=null}));return{c(){t=u("ul");for(let e=0;e<c.length;e+=1)c[e].c();m(t,"aria-hidden",s=!e[4]||!e[3]),m(t,"class","mc-sidebar-user__content is-close svelte-h4x6wa"),m(t,"id","user-content")},m(s,i){n(s,t,i);for(let e=0;e<c.length;e+=1)c[e]&&c[e].m(t,null);e[9](t),a=!0},p(e,n){if(134&n){let s;for(i=e[1],s=0;s<i.length;s+=1){const a=E(e,i,s);c[s]?(c[s].p(a,n),r(c[s],1)):(c[s]=I(a),c[s].c(),r(c[s],1),c[s].m(t,null))}for(b(),s=i.length;s<c.length;s+=1)h(s);o()}(!a||24&n&&s!==(s=!e[4]||!e[3]))&&m(t,"aria-hidden",s)},i(e){if(!a){for(let e=0;e<i.length;e+=1)r(c[e]);a=!0}},o(e){c=c.filter(Boolean);for(let e=0;e<c.length;e+=1)l(c[e]);a=!1},d(s){s&&d(t),w(c,s),e[9](null)}}}function I(e){let t,s,a,i,o,c;function m(){return e[8](e[11])}return s=new N({props:{feature:e[11],a11yLabels:e[2]}}),{c(){t=u("li"),g(s.$$.fragment),a=h()},m(e,r){n(e,t,r),v(s,t,null),x(t,a),i=!0,o||(c=p(t,"click",y(m)),o=!0)},p(t,a){e=t;const i={};2&a&&(i.feature=e[11]),4&a&&(i.a11yLabels=e[2]),s.$set(i)},i(e){i||(r(s.$$.fragment,e),i=!0)},o(e){l(s.$$.fragment,e),i=!1},d(e){e&&d(t),k(s),o=!1,c()}}}function J(e){let t,s,a=e[0]&&V(e);return{c(){a&&a.c(),t=i()},m(e,i){a&&a.m(e,i),n(e,t,i),s=!0},p(e,[s]){e[0]?a?(a.p(e,s),1&s&&r(a,1)):(a=V(e),a.c(),r(a,1),a.m(t.parentNode,t)):a&&(b(),l(a,1,1,(()=>{a=null})),o())},i(e){s||(r(a),s=!0)},o(e){l(a),s=!1},d(e){a&&a.d(e),e&&d(t)}}}function K(e){let t=e.toLowerCase().split(" ");for(let e=0;e<t.length;e++)t[e]=t[e].charAt(0).toUpperCase()+t[e].substring(1);return t.join(" ")}function Q(e,t,s){let a;c(e,A,(e=>s(4,a=e)));let i,{user:n}=t,{data:r}=t,{a11yLabels:l}=t,o=!1;function d(e){e.disabled||M(e.code)}return e.$$set=e=>{"user"in e&&s(0,n=e.user),"data"in e&&s(1,r=e.data),"a11yLabels"in e&&s(2,l=e.a11yLabels)},e.$$.update=()=>{24&e.$$.dirty&&function(e,t){if(i){s(5,i.style.height="",i),s(5,i.style.transition="none",i);const a=window.getComputedStyle(i).height;i.classList.add(t&&e?"is-open":"is-close"),i.classList.remove(t&&e?"is-close":"is-open");const n=window.getComputedStyle(i).height;s(5,i.style.height=a,i),requestAnimationFrame((()=>{s(5,i.style.transition="",i),requestAnimationFrame((()=>{s(5,i.style.height=n,i)}))}));const r=()=>{s(5,i.style.height="",i),i.removeEventListener("transitionend",r)};i.addEventListener("transitionend",r)}}(o,a)},[n,r,l,o,a,i,function(){a?s(3,o=!o):(C(!0),s(3,o=!0))},d,e=>d(e),function(e){$[e?"unshift":"push"]((()=>{i=e,s(5,i)}))}]}class T extends e{constructor(e){super(),t(this,e,Q,J,s,{user:0,data:1,a11yLabels:2},H)}}export{T as default};
+import { P as SvelteComponent, i as init, s as safe_not_equal, Q as append_styles, K as empty, b as insert, C as transition_in, D as transition_out, E as check_outros, o as detach, ab as component_subscribe, e as element, d as space, g as attr, j as append, l as listen, M as group_outros, t as text, k as set_data, J as destroy_each, x as create_component, A as mount_component, I as stop_propagation, G as destroy_component, v as binding_callbacks, T as svg_element, n as noop, y as set_style, $ as src_url_equal } from '../../index-c33b3772.js';
+import { t as toggleSidebar, a as selectFeature, i as isSidebarOpen } from '../../sidebar-service-589b271b.js';
+import Sidebar_feature_nested from './sidebar-feature.nested.js';
+
+/* src/components/sidebar/sidebar-user.nested.svelte generated by Svelte v3.58.0 */
+
+function add_css(target) {
+	append_styles(target, "svelte-h4x6wa", ".mc-sidebar-user.svelte-h4x6wa.svelte-h4x6wa{left:0;right:0;bottom:0;position:absolute;background:#cfd2d8}.mc-sidebar-user__header.svelte-h4x6wa.svelte-h4x6wa{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:none;border:none;color:#191919;font-size:inherit;font-family:inherit;text-align:initial;margin:0;width:100%;overflow:hidden}.mc-sidebar-user__header.svelte-h4x6wa.svelte-h4x6wa:focus-visible{-webkit-box-shadow:none;box-shadow:none;border:none;border-radius:12px;outline:1px solid #0b96cc;outline-offset:-5px}.mc-sidebar-user__header.svelte-h4x6wa.svelte-h4x6wa:hover{cursor:pointer}.mc-sidebar-user__header.svelte-h4x6wa:hover .mc-sidebar-user__header__information__icon.svelte-h4x6wa{background:#b3b7c1}.mc-sidebar-user__header__picture.svelte-h4x6wa.svelte-h4x6wa{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;background:#5B737D;border-radius:24px;width:48px;min-width:48px;height:48px;overflow:hidden}.mc-sidebar-user__header__picture.svelte-h4x6wa img.svelte-h4x6wa{display:block}.mc-sidebar-user__header__information.svelte-h4x6wa.svelte-h4x6wa{-ms-flex-pack:distribute;justify-content:space-around;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-flex:1;-ms-flex:1;flex:1;margin:0;margin-left:8px;height:40px}.mc-sidebar-user__header__information__icon.svelte-h4x6wa.svelte-h4x6wa{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:32px;height:32px;border-radius:4px}.mc-sidebar-user__header__information__identity.svelte-h4x6wa.svelte-h4x6wa{font-size:16px;font-weight:bold}.mc-sidebar-user__header__information__title.svelte-h4x6wa.svelte-h4x6wa,.mc-sidebar-user__header__information__identity.svelte-h4x6wa.svelte-h4x6wa{white-space:nowrap;overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis;max-width:176px}.mc-sidebar-user__icon.svelte-h4x6wa.svelte-h4x6wa{fill:#191919}.mc-sidebar-user__content.svelte-h4x6wa.svelte-h4x6wa{list-style-type:none;padding:0;overflow:hidden;margin:-8px 0px 24px 0px;-o-transition:all 300ms ease-in-out;-webkit-transition:all 300ms ease-in-out;transition:all 300ms ease-in-out}.mc-sidebar-user__content.is-close.svelte-h4x6wa.svelte-h4x6wa{height:0;margin:0}.mc-sidebar-user.is-close.svelte-h4x6wa .mc-sidebar-user__header.svelte-h4x6wa{-o-transition:padding 300ms ease-in-out;-webkit-transition:padding 300ms ease-in-out;transition:padding 300ms ease-in-out;padding:12px 8px;margin:8px 0}.mc-sidebar-user.is-open.svelte-h4x6wa .mc-sidebar-user__header.svelte-h4x6wa{-o-transition:padding 300ms ease-in-out;-webkit-transition:padding 300ms ease-in-out;transition:padding 300ms ease-in-out;padding:12px 24px 12px 32px;margin:8px 0}");
+}
+
+function get_each_context(ctx, list, i) {
+	const child_ctx = ctx.slice();
+	child_ctx[11] = list[i];
+	return child_ctx;
+}
+
+// (57:0) {#if user}
+function create_if_block(ctx) {
+	let div;
+	let button;
+	let span;
+	let t0;
+	let button_aria_expanded_value;
+	let button_aria_label_value;
+	let t1;
+	let div_class_value;
+	let current;
+	let mounted;
+	let dispose;
+
+	function select_block_type(ctx, dirty) {
+		if (/*user*/ ctx[0].imageBase64) return create_if_block_6;
+		return create_else_block_1;
+	}
+
+	let current_block_type = select_block_type(ctx);
+	let if_block0 = current_block_type(ctx);
+	let if_block1 = /*$isSidebarOpen*/ ctx[4] && create_if_block_2(ctx);
+	let if_block2 = /*data*/ ctx[1]?.length && create_if_block_1(ctx);
+
+	return {
+		c() {
+			div = element("div");
+			button = element("button");
+			span = element("span");
+			if_block0.c();
+			t0 = space();
+			if (if_block1) if_block1.c();
+			t1 = space();
+			if (if_block2) if_block2.c();
+			attr(span, "class", "mc-sidebar-user__header__picture svelte-h4x6wa");
+			attr(button, "aria-expanded", button_aria_expanded_value = /*$isSidebarOpen*/ ctx[4] && /*isExpanded*/ ctx[3]);
+			attr(button, "class", "mc-sidebar-user__header svelte-h4x6wa");
+
+			attr(button, "aria-label", button_aria_label_value = /*$isSidebarOpen*/ ctx[4] && /*isExpanded*/ ctx[3]
+			? /*a11yLabels*/ ctx[2]?.['close-user'] || 'Close the user sub menu'
+			: /*a11yLabels*/ ctx[2]?.['open-user'] || 'Open the user sub menu');
+
+			attr(button, "aria-controls", "user-content");
+			attr(div, "class", div_class_value = "mc-sidebar-user " + (/*$isSidebarOpen*/ ctx[4] ? 'is-open' : 'is-close') + " svelte-h4x6wa");
+		},
+		m(target, anchor) {
+			insert(target, div, anchor);
+			append(div, button);
+			append(button, span);
+			if_block0.m(span, null);
+			append(button, t0);
+			if (if_block1) if_block1.m(button, null);
+			append(div, t1);
+			if (if_block2) if_block2.m(div, null);
+			current = true;
+
+			if (!mounted) {
+				dispose = listen(div, "click", /*toggle*/ ctx[6]);
+				mounted = true;
+			}
+		},
+		p(ctx, dirty) {
+			if (current_block_type === (current_block_type = select_block_type(ctx)) && if_block0) {
+				if_block0.p(ctx, dirty);
+			} else {
+				if_block0.d(1);
+				if_block0 = current_block_type(ctx);
+
+				if (if_block0) {
+					if_block0.c();
+					if_block0.m(span, null);
+				}
+			}
+
+			if (/*$isSidebarOpen*/ ctx[4]) {
+				if (if_block1) {
+					if_block1.p(ctx, dirty);
+				} else {
+					if_block1 = create_if_block_2(ctx);
+					if_block1.c();
+					if_block1.m(button, null);
+				}
+			} else if (if_block1) {
+				if_block1.d(1);
+				if_block1 = null;
+			}
+
+			if (!current || dirty & /*$isSidebarOpen, isExpanded*/ 24 && button_aria_expanded_value !== (button_aria_expanded_value = /*$isSidebarOpen*/ ctx[4] && /*isExpanded*/ ctx[3])) {
+				attr(button, "aria-expanded", button_aria_expanded_value);
+			}
+
+			if (!current || dirty & /*$isSidebarOpen, isExpanded, a11yLabels*/ 28 && button_aria_label_value !== (button_aria_label_value = /*$isSidebarOpen*/ ctx[4] && /*isExpanded*/ ctx[3]
+			? /*a11yLabels*/ ctx[2]?.['close-user'] || 'Close the user sub menu'
+			: /*a11yLabels*/ ctx[2]?.['open-user'] || 'Open the user sub menu')) {
+				attr(button, "aria-label", button_aria_label_value);
+			}
+
+			if (/*data*/ ctx[1]?.length) {
+				if (if_block2) {
+					if_block2.p(ctx, dirty);
+
+					if (dirty & /*data*/ 2) {
+						transition_in(if_block2, 1);
+					}
+				} else {
+					if_block2 = create_if_block_1(ctx);
+					if_block2.c();
+					transition_in(if_block2, 1);
+					if_block2.m(div, null);
+				}
+			} else if (if_block2) {
+				group_outros();
+
+				transition_out(if_block2, 1, 1, () => {
+					if_block2 = null;
+				});
+
+				check_outros();
+			}
+
+			if (!current || dirty & /*$isSidebarOpen*/ 16 && div_class_value !== (div_class_value = "mc-sidebar-user " + (/*$isSidebarOpen*/ ctx[4] ? 'is-open' : 'is-close') + " svelte-h4x6wa")) {
+				attr(div, "class", div_class_value);
+			}
+		},
+		i(local) {
+			if (current) return;
+			transition_in(if_block2);
+			current = true;
+		},
+		o(local) {
+			transition_out(if_block2);
+			current = false;
+		},
+		d(detaching) {
+			if (detaching) detach(div);
+			if_block0.d();
+			if (if_block1) if_block1.d();
+			if (if_block2) if_block2.d();
+			mounted = false;
+			dispose();
+		}
+	};
+}
+
+// (80:8) {:else}
+function create_else_block_1(ctx) {
+	let svg;
+	let path;
+
+	return {
+		c() {
+			svg = svg_element("svg");
+			path = svg_element("path");
+			attr(path, "d", "M12 12.76a5.38 5.38 0 115.38-5.38A5.39 5.39 0 0112 12.76zM12 4a3.38 3.38 0 103.38 3.38A3.39 3.39 0 0012 4zM16.48 13.58a1 1 0 00-.81.11 7.3 7.3 0 01-7.34 0 1 1 0 00-.81-.11l-2.81.87a1 1 0 00-.71 1V21a1 1 0 001 1h14a1 1 0 001-1v-5.59a1 1 0 00-.71-1zM18 20H6v-3.86l1.75-.53a9.36 9.36 0 008.5 0l1.75.53z");
+			attr(svg, "class", "mc-sidebar-user__icon svelte-h4x6wa");
+			attr(svg, "width", "24px");
+			attr(svg, "height", "24px");
+			attr(svg, "viewBox", "0 0 24 24");
+		},
+		m(target, anchor) {
+			insert(target, svg, anchor);
+			append(svg, path);
+		},
+		p: noop,
+		d(detaching) {
+			if (detaching) detach(svg);
+		}
+	};
+}
+
+// (72:8) {#if user.imageBase64}
+function create_if_block_6(ctx) {
+	let img;
+	let img_src_value;
+
+	return {
+		c() {
+			img = element("img");
+			attr(img, "class", "base64 svelte-h4x6wa");
+			set_style(img, "display", "block");
+			set_style(img, "width", "auto");
+			set_style(img, "height", "48px");
+			set_style(img, "max-width", "48px");
+			attr(img, "aria-hidden", "");
+			attr(img, "alt", "User Picture");
+			if (!src_url_equal(img.src, img_src_value = "data:image/png;base64, " + /*user*/ ctx[0].imageBase64)) attr(img, "src", img_src_value);
+		},
+		m(target, anchor) {
+			insert(target, img, anchor);
+		},
+		p(ctx, dirty) {
+			if (dirty & /*user*/ 1 && !src_url_equal(img.src, img_src_value = "data:image/png;base64, " + /*user*/ ctx[0].imageBase64)) {
+				attr(img, "src", img_src_value);
+			}
+		},
+		d(detaching) {
+			if (detaching) detach(img);
+		}
+	};
+}
+
+// (92:6) {#if $isSidebarOpen}
+function create_if_block_2(ctx) {
+	let p;
+	let span;
+	let t0_value = (/*user*/ ctx[0]?.firstName || '') + "";
+	let t0;
+	let t1;
+	let t2_value = (/*user*/ ctx[0]?.lastName || '') + "";
+	let t2;
+	let t3;
+	let t4;
+	let if_block1_anchor;
+	let if_block0 = /*user*/ ctx[0]?.title && create_if_block_5(ctx);
+	let if_block1 = /*data*/ ctx[1]?.length && create_if_block_3(ctx);
+
+	return {
+		c() {
+			p = element("p");
+			span = element("span");
+			t0 = text(t0_value);
+			t1 = space();
+			t2 = text(t2_value);
+			t3 = space();
+			if (if_block0) if_block0.c();
+			t4 = space();
+			if (if_block1) if_block1.c();
+			if_block1_anchor = empty();
+			attr(span, "class", "mc-sidebar-user__header__information__identity svelte-h4x6wa");
+			attr(p, "class", "mc-sidebar-user__header__information svelte-h4x6wa");
+		},
+		m(target, anchor) {
+			insert(target, p, anchor);
+			append(p, span);
+			append(span, t0);
+			append(span, t1);
+			append(span, t2);
+			append(p, t3);
+			if (if_block0) if_block0.m(p, null);
+			insert(target, t4, anchor);
+			if (if_block1) if_block1.m(target, anchor);
+			insert(target, if_block1_anchor, anchor);
+		},
+		p(ctx, dirty) {
+			if (dirty & /*user*/ 1 && t0_value !== (t0_value = (/*user*/ ctx[0]?.firstName || '') + "")) set_data(t0, t0_value);
+			if (dirty & /*user*/ 1 && t2_value !== (t2_value = (/*user*/ ctx[0]?.lastName || '') + "")) set_data(t2, t2_value);
+
+			if (/*user*/ ctx[0]?.title) {
+				if (if_block0) {
+					if_block0.p(ctx, dirty);
+				} else {
+					if_block0 = create_if_block_5(ctx);
+					if_block0.c();
+					if_block0.m(p, null);
+				}
+			} else if (if_block0) {
+				if_block0.d(1);
+				if_block0 = null;
+			}
+
+			if (/*data*/ ctx[1]?.length) {
+				if (if_block1) {
+					if_block1.p(ctx, dirty);
+				} else {
+					if_block1 = create_if_block_3(ctx);
+					if_block1.c();
+					if_block1.m(if_block1_anchor.parentNode, if_block1_anchor);
+				}
+			} else if (if_block1) {
+				if_block1.d(1);
+				if_block1 = null;
+			}
+		},
+		d(detaching) {
+			if (detaching) detach(p);
+			if (if_block0) if_block0.d();
+			if (detaching) detach(t4);
+			if (if_block1) if_block1.d(detaching);
+			if (detaching) detach(if_block1_anchor);
+		}
+	};
+}
+
+// (98:10) {#if user?.title}
+function create_if_block_5(ctx) {
+	let span;
+	let t_value = capitalizeTheFirstLetterOfEachWord(/*user*/ ctx[0].title) + "";
+	let t;
+
+	return {
+		c() {
+			span = element("span");
+			t = text(t_value);
+			attr(span, "class", "mc-sidebar-user__header__information__title svelte-h4x6wa");
+		},
+		m(target, anchor) {
+			insert(target, span, anchor);
+			append(span, t);
+		},
+		p(ctx, dirty) {
+			if (dirty & /*user*/ 1 && t_value !== (t_value = capitalizeTheFirstLetterOfEachWord(/*user*/ ctx[0].title) + "")) set_data(t, t_value);
+		},
+		d(detaching) {
+			if (detaching) detach(span);
+		}
+	};
+}
+
+// (104:8) {#if data?.length}
+function create_if_block_3(ctx) {
+	let span;
+
+	function select_block_type_1(ctx, dirty) {
+		if (/*$isSidebarOpen*/ ctx[4] && !/*isExpanded*/ ctx[3]) return create_if_block_4;
+		return create_else_block;
+	}
+
+	let current_block_type = select_block_type_1(ctx);
+	let if_block = current_block_type(ctx);
+
+	return {
+		c() {
+			span = element("span");
+			if_block.c();
+			attr(span, "class", "mc-sidebar-user__header__information__icon svelte-h4x6wa");
+		},
+		m(target, anchor) {
+			insert(target, span, anchor);
+			if_block.m(span, null);
+		},
+		p(ctx, dirty) {
+			if (current_block_type !== (current_block_type = select_block_type_1(ctx))) {
+				if_block.d(1);
+				if_block = current_block_type(ctx);
+
+				if (if_block) {
+					if_block.c();
+					if_block.m(span, null);
+				}
+			}
+		},
+		d(detaching) {
+			if (detaching) detach(span);
+			if_block.d();
+		}
+	};
+}
+
+// (116:12) {:else}
+function create_else_block(ctx) {
+	let svg;
+	let path;
+
+	return {
+		c() {
+			svg = svg_element("svg");
+			path = svg_element("path");
+			attr(path, "d", "M12 9H4a1 1 0 010-2h8a1 1 0 010 2z");
+			attr(svg, "width", "16px");
+			attr(svg, "height", "16px");
+			attr(svg, "class", "mc-sidebar-user__icon svelte-h4x6wa");
+			attr(svg, "viewBox", "0 0 16 16");
+		},
+		m(target, anchor) {
+			insert(target, svg, anchor);
+			append(svg, path);
+		},
+		d(detaching) {
+			if (detaching) detach(svg);
+		}
+	};
+}
+
+// (106:12) {#if $isSidebarOpen && !isExpanded}
+function create_if_block_4(ctx) {
+	let svg;
+	let path;
+
+	return {
+		c() {
+			svg = svg_element("svg");
+			path = svg_element("path");
+			attr(path, "d", "M13 7H9V3a1 1 0 00-2 0v4H3a1 1 0 000 2h4v4a1 1 0 002 0V9h4a1 1 0 000-2z");
+			attr(svg, "class", "mc-sidebar-user__icon svelte-h4x6wa");
+			attr(svg, "width", "16px");
+			attr(svg, "height", "16px");
+			attr(svg, "viewBox", "0 0 16 16");
+		},
+		m(target, anchor) {
+			insert(target, svg, anchor);
+			append(svg, path);
+		},
+		d(detaching) {
+			if (detaching) detach(svg);
+		}
+	};
+}
+
+// (129:4) {#if data?.length}
+function create_if_block_1(ctx) {
+	let ul;
+	let ul_aria_hidden_value;
+	let current;
+	let each_value = /*data*/ ctx[1];
+	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));
+	}
+
+	const out = i => transition_out(each_blocks[i], 1, 1, () => {
+		each_blocks[i] = null;
+	});
+
+	return {
+		c() {
+			ul = element("ul");
+
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].c();
+			}
+
+			attr(ul, "aria-hidden", ul_aria_hidden_value = !/*$isSidebarOpen*/ ctx[4] || !/*isExpanded*/ ctx[3]);
+			attr(ul, "class", "mc-sidebar-user__content is-close svelte-h4x6wa");
+			attr(ul, "id", "user-content");
+		},
+		m(target, anchor) {
+			insert(target, ul, anchor);
+
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				if (each_blocks[i]) {
+					each_blocks[i].m(ul, null);
+				}
+			}
+
+			/*ul_binding*/ ctx[9](ul);
+			current = true;
+		},
+		p(ctx, dirty) {
+			if (dirty & /*handleClick, data, a11yLabels*/ 134) {
+				each_value = /*data*/ ctx[1];
+				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);
+						transition_in(each_blocks[i], 1);
+					} else {
+						each_blocks[i] = create_each_block(child_ctx);
+						each_blocks[i].c();
+						transition_in(each_blocks[i], 1);
+						each_blocks[i].m(ul, null);
+					}
+				}
+
+				group_outros();
+
+				for (i = each_value.length; i < each_blocks.length; i += 1) {
+					out(i);
+				}
+
+				check_outros();
+			}
+
+			if (!current || dirty & /*$isSidebarOpen, isExpanded*/ 24 && ul_aria_hidden_value !== (ul_aria_hidden_value = !/*$isSidebarOpen*/ ctx[4] || !/*isExpanded*/ ctx[3])) {
+				attr(ul, "aria-hidden", ul_aria_hidden_value);
+			}
+		},
+		i(local) {
+			if (current) return;
+
+			for (let i = 0; i < each_value.length; i += 1) {
+				transition_in(each_blocks[i]);
+			}
+
+			current = true;
+		},
+		o(local) {
+			each_blocks = each_blocks.filter(Boolean);
+
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				transition_out(each_blocks[i]);
+			}
+
+			current = false;
+		},
+		d(detaching) {
+			if (detaching) detach(ul);
+			destroy_each(each_blocks, detaching);
+			/*ul_binding*/ ctx[9](null);
+		}
+	};
+}
+
+// (136:8) {#each data as feature}
+function create_each_block(ctx) {
+	let li;
+	let featurecomponent;
+	let t;
+	let current;
+	let mounted;
+	let dispose;
+
+	featurecomponent = new Sidebar_feature_nested({
+			props: {
+				feature: /*feature*/ ctx[11],
+				a11yLabels: /*a11yLabels*/ ctx[2]
+			}
+		});
+
+	function click_handler() {
+		return /*click_handler*/ ctx[8](/*feature*/ ctx[11]);
+	}
+
+	return {
+		c() {
+			li = element("li");
+			create_component(featurecomponent.$$.fragment);
+			t = space();
+		},
+		m(target, anchor) {
+			insert(target, li, anchor);
+			mount_component(featurecomponent, li, null);
+			append(li, t);
+			current = true;
+
+			if (!mounted) {
+				dispose = listen(li, "click", stop_propagation(click_handler));
+				mounted = true;
+			}
+		},
+		p(new_ctx, dirty) {
+			ctx = new_ctx;
+			const featurecomponent_changes = {};
+			if (dirty & /*data*/ 2) featurecomponent_changes.feature = /*feature*/ ctx[11];
+			if (dirty & /*a11yLabels*/ 4) featurecomponent_changes.a11yLabels = /*a11yLabels*/ ctx[2];
+			featurecomponent.$set(featurecomponent_changes);
+		},
+		i(local) {
+			if (current) return;
+			transition_in(featurecomponent.$$.fragment, local);
+			current = true;
+		},
+		o(local) {
+			transition_out(featurecomponent.$$.fragment, local);
+			current = false;
+		},
+		d(detaching) {
+			if (detaching) detach(li);
+			destroy_component(featurecomponent);
+			mounted = false;
+			dispose();
+		}
+	};
+}
+
+function create_fragment(ctx) {
+	let if_block_anchor;
+	let current;
+	let if_block = /*user*/ ctx[0] && create_if_block(ctx);
+
+	return {
+		c() {
+			if (if_block) if_block.c();
+			if_block_anchor = empty();
+		},
+		m(target, anchor) {
+			if (if_block) if_block.m(target, anchor);
+			insert(target, if_block_anchor, anchor);
+			current = true;
+		},
+		p(ctx, [dirty]) {
+			if (/*user*/ ctx[0]) {
+				if (if_block) {
+					if_block.p(ctx, dirty);
+
+					if (dirty & /*user*/ 1) {
+						transition_in(if_block, 1);
+					}
+				} else {
+					if_block = create_if_block(ctx);
+					if_block.c();
+					transition_in(if_block, 1);
+					if_block.m(if_block_anchor.parentNode, if_block_anchor);
+				}
+			} else if (if_block) {
+				group_outros();
+
+				transition_out(if_block, 1, 1, () => {
+					if_block = null;
+				});
+
+				check_outros();
+			}
+		},
+		i(local) {
+			if (current) return;
+			transition_in(if_block);
+			current = true;
+		},
+		o(local) {
+			transition_out(if_block);
+			current = false;
+		},
+		d(detaching) {
+			if (if_block) if_block.d(detaching);
+			if (detaching) detach(if_block_anchor);
+		}
+	};
+}
+
+function capitalizeTheFirstLetterOfEachWord(words) {
+	let separateWord = words.toLowerCase().split(' ');
+
+	for (let i = 0; i < separateWord.length; i++) {
+		separateWord[i] = separateWord[i].charAt(0).toUpperCase() + separateWord[i].substring(1);
+	}
+
+	return separateWord.join(' ');
+}
+
+function instance($$self, $$props, $$invalidate) {
+	let $isSidebarOpen;
+	component_subscribe($$self, isSidebarOpen, $$value => $$invalidate(4, $isSidebarOpen = $$value));
+	let { user } = $$props;
+	let { data } = $$props;
+	let { a11yLabels } = $$props;
+	let content;
+	let isExpanded = false;
+
+	function updateContentCSS(isExpanded, isOpen) {
+		if (content) {
+			$$invalidate(5, content.style.height = '', content);
+			$$invalidate(5, content.style.transition = 'none', content);
+			const startHeight = window.getComputedStyle(content).height;
+			content.classList.add(isOpen && isExpanded ? 'is-open' : 'is-close');
+			content.classList.remove(isOpen && isExpanded ? 'is-close' : 'is-open');
+			const height = window.getComputedStyle(content).height;
+			$$invalidate(5, content.style.height = startHeight, content);
+
+			requestAnimationFrame(() => {
+				$$invalidate(5, content.style.transition = '', content);
+
+				requestAnimationFrame(() => {
+					$$invalidate(5, content.style.height = height, content);
+				});
+			});
+
+			const handler = () => {
+				$$invalidate(5, content.style.height = '', content);
+				content.removeEventListener('transitionend', handler);
+			};
+
+			content.addEventListener('transitionend', handler);
+		}
+	}
+
+	function toggle() {
+		if (!$isSidebarOpen) {
+			toggleSidebar(true);
+			$$invalidate(3, isExpanded = true);
+		} else {
+			$$invalidate(3, isExpanded = !isExpanded);
+		}
+	}
+
+	function handleClick(feature) {
+		if (!feature.disabled) {
+			selectFeature(feature.code);
+		}
+	}
+
+	const click_handler = feature => handleClick(feature);
+
+	function ul_binding($$value) {
+		binding_callbacks[$$value ? 'unshift' : 'push'](() => {
+			content = $$value;
+			$$invalidate(5, content);
+		});
+	}
+
+	$$self.$$set = $$props => {
+		if ('user' in $$props) $$invalidate(0, user = $$props.user);
+		if ('data' in $$props) $$invalidate(1, data = $$props.data);
+		if ('a11yLabels' in $$props) $$invalidate(2, a11yLabels = $$props.a11yLabels);
+	};
+
+	$$self.$$.update = () => {
+		if ($$self.$$.dirty & /*isExpanded, $isSidebarOpen*/ 24) {
+			updateContentCSS(isExpanded, $isSidebarOpen);
+		}
+	};
+
+	return [
+		user,
+		data,
+		a11yLabels,
+		isExpanded,
+		$isSidebarOpen,
+		content,
+		toggle,
+		handleClick,
+		click_handler,
+		ul_binding
+	];
+}
+
+class Sidebar_user_nested extends SvelteComponent {
+	constructor(options) {
+		super();
+		init(this, options, instance, create_fragment, safe_not_equal, { user: 0, data: 1, a11yLabels: 2 }, add_css);
+	}
+}
+
+export { Sidebar_user_nested as default };
 //# sourceMappingURL=sidebar-user.nested.js.map