npm - @mozaic-ds/web-components - Versions diffs - 0.11.0 → 0.11.1 - Mend

@mozaic-ds/web-components 0.11.0 → 0.11.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (38) hide show

package/public/components/sidebar/sidebar-feature-group.nested.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{P as e,i as t,s as r,Q as i,e as o,d as s,g as n,b as l,j as a,C as d,E as p,D as c,o as u,J as m,ab as f,K as b,t as v,k as g,x as h,A as x,l as _,I as w,G as y,M as k,v as $,Z as L,T as H}from"../../index-c33b3772.js";import j from"./sidebar-feature.nested.js";import{a as z,i as E,s as G}from"../../sidebar-service-275bf9ef.js";import{E as M}from"../../EventHandler-02058705.js";function A(e){i(e,"svelte-dmrpr2",".mc-feature-group.svelte-dmrpr2.svelte-dmrpr2{background:none;border:none;color:#191919;cursor:pointer;font-size:inherit;font-family:inherit;text-align:initial;margin:0;padding:0;overflow:hidden}.mc-feature-group__icon.svelte-dmrpr2.svelte-dmrpr2{fill:#191919}.mc-feature-group__container.svelte-dmrpr2.svelte-dmrpr2{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin:5px 0;padding:8px 0px;-o-transition:margin 300ms ease-in-out;-webkit-transition:margin 300ms ease-in-out;transition:margin 300ms ease-in-out}.mc-feature-group__label.svelte-dmrpr2.svelte-dmrpr2{margin:0 8px;width:200px;min-width:200px;overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical}.mc-feature-group__label__tooltip.svelte-dmrpr2.svelte-dmrpr2{opacity:0;-webkit-transition:0s opacity;-o-transition:0s opacity;transition:0s opacity;background-color:#b3b3b3;border:1px solid #191919;border-radius:4px;position:absolute;pointer-events:none;left:calc(100% - 16px);padding:8px 16px;width:188px}.mc-feature-group__label__tooltip__pointer.svelte-dmrpr2.svelte-dmrpr2{position:absolute;top:50%;left:-8px;top:calc(50% - 6px);width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-right:8px solid white}.mc-feature-group__label__tooltip__pointer.svelte-dmrpr2 div.svelte-dmrpr2{position:relative;top:-6px;left:2px;width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-right:8px solid #b3b3b3}.mc-feature-group__label.svelte-dmrpr2:hover+.mc-feature-group__label__tooltip.svelte-dmrpr2{opacity:1;-webkit-transition-delay:1s;-o-transition-delay:1s;transition-delay:1s}.mc-feature-group__content.svelte-dmrpr2.svelte-dmrpr2{overflow:hidden;-o-transition:height 300ms ease-in-out;-webkit-transition:height 300ms ease-in-out;transition:height 300ms ease-in-out}.mc-feature-group__content.is-close.svelte-dmrpr2.svelte-dmrpr2{height:0}.mc-feature-group.is-selected.svelte-dmrpr2.svelte-dmrpr2{background:#cfd2d8}.mc-feature-group.is-close.svelte-dmrpr2 .mc-feature-group__container.svelte-dmrpr2{margin:0 20px;width:24px}.mc-feature-group.is-open.svelte-dmrpr2 .mc-feature-group__container.svelte-dmrpr2{margin:0 32px}.mc-feature-group.svelte-dmrpr2.svelte-dmrpr2:hover{background:#b3b7c1}.mc-feature-group.svelte-dmrpr2.svelte-dmrpr2:focus-visible{-webkit-box-shadow:none;box-shadow:none;border:none;outline:none}.mc-feature-group.svelte-dmrpr2:focus-visible .mc-feature-group__container.svelte-dmrpr2{-webkit-box-shadow:none;box-shadow:none;border:none;border-radius:6px;outline:1px solid #0b96cc}ul.svelte-dmrpr2.svelte-dmrpr2,li.svelte-dmrpr2.svelte-dmrpr2{list-style-type:none;margin:0;padding:0;display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}ul.svelte-dmrpr2.svelte-dmrpr2{-webkit-box-align:start;-ms-flex-align:start;align-items:start;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}ul.svelte-dmrpr2 li.svelte-dmrpr2{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-sizing:border-box;box-sizing:border-box}")}function B(e,t,r){const i=e.slice();return i[15]=t[r],i}function C(e){let t,r,i=`<${D(e[0].icon)} class="mc-feature-group__icon" />`;return{c(){t=new L(!1),r=b(),t.a=r},m(e,o){t.m(i,e,o),l(e,r,o)},p(e,r){1&r&&i!==(i=`<${D(e[0].icon)} class="mc-feature-group__icon" />`)&&t.p(i)},d(e){e&&u(r),e&&t.d()}}}function q(e){let t,r,i,d,p,c=e[0].label+"",m=e[6]?.offsetHeight<e[6]?.scrollHeight&&F(e);function f(e,t){return e[1]?N:S}let h=f(e),x=h(e);return{c(){t=o("span"),r=v(c),i=s(),m&&m.c(),d=s(),x.c(),p=b(),n(t,"class","mc-feature-group__label svelte-dmrpr2")},m(o,s){l(o,t,s),a(t,r),e[9](t),l(o,i,s),m&&m.m(o,s),l(o,d,s),x.m(o,s),l(o,p,s)},p(e,t){1&t&&c!==(c=e[0].label+"")&&g(r,c),e[6]?.offsetHeight<e[6]?.scrollHeight?m?m.p(e,t):(m=F(e),m.c(),m.m(d.parentNode,d)):m&&(m.d(1),m=null),h!==(h=f(e))&&(x.d(1),x=h(e),x&&(x.c(),x.m(p.parentNode,p)))},d(r){r&&u(t),e[9](null),r&&u(i),m&&m.d(r),r&&u(d),x.d(r),r&&u(p)}}}function F(e){let t,r,i,d,p,c=e[0].label+"";return{c(){t=o("div"),r=o("div"),r.innerHTML='<div class="svelte-dmrpr2"></div>',i=s(),d=o("span"),p=v(c),n(r,"class","mc-feature-group__label__tooltip__pointer svelte-dmrpr2"),n(t,"aria-hidden","true"),n(t,"class","mc-feature-group__label__tooltip svelte-dmrpr2")},m(e,o){l(e,t,o),a(t,r),a(t,i),a(t,d),a(d,p)},p(e,t){1&t&&c!==(c=e[0].label+"")&&g(p,c)},d(e){e&&u(t)}}}function N(e){let t,r;return{c(){t=H("svg"),r=H("path"),n(r,"d","M12 9H4a1 1 0 010-2h8a1 1 0 010 2z"),n(t,"class","mc-feature-group__icon svelte-dmrpr2"),n(t,"width","16px"),n(t,"height","16px"),n(t,"viewBox","0 0 16 16")},m(e,i){l(e,t,i),a(t,r)},d(e){e&&u(t)}}}function S(e){let t,r;return{c(){t=H("svg"),r=H("path"),n(r,"d","M13 7H9V3a1 1 0 00-2 0v4H3a1 1 0 000 2h4v4a1 1 0 002 0V9h4a1 1 0 000-2z"),n(t,"class","mc-feature-group__icon svelte-dmrpr2"),n(t,"width","16px"),n(t,"height","16px"),n(t,"viewBox","0 0 16 16")},m(e,i){l(e,t,i),a(t,r)},d(e){e&&u(t)}}}function T(e){let t,r,i,p,m,f;function b(){return e[10](e[15])}return r=new j({props:{feature:e[15],a11yLabels:e[2]}}),{c(){t=o("li"),h(r.$$.fragment),i=s(),n(t,"class","svelte-dmrpr2")},m(e,o){l(e,t,o),x(r,t,null),a(t,i),p=!0,m||(f=_(t,"click",w(b)),m=!0)},p(t,i){e=t;const o={};1&i&&(o.feature=e[15]),4&i&&(o.a11yLabels=e[2]),r.$set(o)},i(e){p||(d(r.$$.fragment,e),p=!0)},o(e){c(r.$$.fragment,e),p=!1},d(e){e&&u(t),y(r),m=!1,f()}}}function V(e){let t,r,i,f,b,v,g,h,x,_,w,y,$,L=e[0].icon&&C(e),H=e[3]&&q(e),j=e[0].items,z=[];for(let t=0;t<j.length;t+=1)z[t]=T(B(e,j,t));const E=e=>c(z[e],1,1,(()=>{z[e]=null}));return{c(){t=o("button"),r=o("span"),L&&L.c(),i=s(),H&&H.c(),x=s(),_=o("ul");for(let e=0;e<z.length;e+=1)z[e].c();n(r,"class","mc-feature-group__container svelte-dmrpr2"),n(t,"class",f="mc-feature-group "+(e[5]?"is-selected":"")+" "+(e[3]?"is-open":"is-close")+" svelte-dmrpr2"),n(t,"aria-label",b=e[0].label),n(t,"aria-expanded",v=e[3]&&e[1]),n(t,"aria-controls",g=e[0].code+"-list"),n(t,"id",h=e[0].code),n(_,"class","mc-feature-group__content is-close svelte-dmrpr2"),n(_,"aria-hidden",w=!e[3]||!e[1]),n(_,"id",y=e[0].code+"-list")},m(o,s){l(o,t,s),a(t,r),L&&L.m(r,null),a(r,i),H&&H.m(r,null),l(o,x,s),l(o,_,s);for(let e=0;e<z.length;e+=1)z[e]&&z[e].m(_,null);e[11](_),$=!0},p(e,[o]){if(e[0].icon?L?L.p(e,o):(L=C(e),L.c(),L.m(r,i)):L&&(L.d(1),L=null),e[3]?H?H.p(e,o):(H=q(e),H.c(),H.m(r,null)):H&&(H.d(1),H=null),(!$||40&o&&f!==(f="mc-feature-group "+(e[5]?"is-selected":"")+" "+(e[3]?"is-open":"is-close")+" svelte-dmrpr2"))&&n(t,"class",f),(!$||1&o&&b!==(b=e[0].label))&&n(t,"aria-label",b),(!$||10&o&&v!==(v=e[3]&&e[1]))&&n(t,"aria-expanded",v),(!$||1&o&&g!==(g=e[0].code+"-list"))&&n(t,"aria-controls",g),(!$||1&o&&h!==(h=e[0].code))&&n(t,"id",h),133&o){let t;for(j=e[0].items,t=0;t<j.length;t+=1){const r=B(e,j,t);z[t]?(z[t].p(r,o),d(z[t],1)):(z[t]=T(r),z[t].c(),d(z[t],1),z[t].m(_,null))}for(k(),t=j.length;t<z.length;t+=1)E(t);p()}(!$||10&o&&w!==(w=!e[3]||!e[1]))&&n(_,"aria-hidden",w),(!$||1&o&&y!==(y=e[0].code+"-list"))&&n(_,"id",y)},i(e){if(!$){for(let e=0;e<j.length;e+=1)d(z[e]);$=!0}},o(e){z=z.filter(Boolean);for(let e=0;e<z.length;e+=1)c(z[e]);$=!1},d(r){r&&u(t),L&&L.d(),H&&H.d(),r&&u(x),r&&u(_),m(z,r),e[11](null)}}}function D(e){return`${e} size="1.5rem"`}function I(e,t,r){let i,o;f(e,E,(e=>r(3,i=e))),f(e,G,(e=>r(8,o=e)));let s,n,{featureGroup:l}=t,{expand:a}=t,{a11yLabels:d}=t,p=new M,c=!1;function u(e){var t;e.disabled||((null===(t=e.items)||void 0===t?void 0:t.length)?p.dispatch("feature-click",e):z(e.code))}return e.$$set=e=>{"featureGroup"in e&&r(0,l=e.featureGroup),"expand"in e&&r(1,a=e.expand),"a11yLabels"in e&&r(2,d=e.a11yLabels)},e.$$.update=()=>{var t,n,d,p,u,m;267&e.$$.dirty&&(t=a,n=i,d=l,r(5,c=null!==(m=(null==(p=o)?void 0:p.lv0)&&d.code===(null===(u=null==p?void 0:p.lv0)||void 0===u?void 0:u.code)&&(!p.lv1||!t||!n))&&void 0!==m&&m)),10&e.$$.dirty&&function(e,t){if(s){r(4,s.style.height="",s),r(4,s.style.transition="none",s);const i=window.getComputedStyle(s).height;s.classList.add(t&&e?"is-open":"is-close"),s.classList.remove(t&&e?"is-close":"is-open");const o=window.getComputedStyle(s).height;r(4,s.style.height=i,s),requestAnimationFrame((()=>{r(4,s.style.transition="",s),requestAnimationFrame((()=>{r(4,s.style.height=o,s)}))}));const n=()=>{r(4,s.style.height="",s),s.removeEventListener("transitionend",n)};s.addEventListener("transitionend",n)}}(a,i)},[l,a,d,i,s,c,n,u,o,function(e){$[e?"unshift":"push"]((()=>{n=e,r(6,n)}))},e=>u(e),function(e){$[e?"unshift":"push"]((()=>{s=e,r(4,s)}))}]}class J extends e{constructor(e){super(),t(this,e,I,V,r,{featureGroup:0,expand:1,a11yLabels:2},A)}}export{J as default};
+import{P as e,i as t,s as r,Q as i,e as o,d as s,g as l,b as n,j as a,C as d,E as p,D as c,o as m,J as u,ab as f,K as b,t as v,k as g,x as h,A as x,l as _,I as w,G as y,M as k,v as $,Z as L,T as H}from"../../index-c33b3772.js";import j from"./sidebar-feature.nested.js";import{a as z,i as E,s as G}from"../../sidebar-service-275bf9ef.js";import{E as M}from"../../EventHandler-02058705.js";function A(e){i(e,"svelte-dmrpr2",".mc-feature-group.svelte-dmrpr2.svelte-dmrpr2{background:none;border:none;color:#191919;cursor:pointer;font-size:inherit;font-family:inherit;text-align:initial;margin:0;padding:0;overflow:hidden}.mc-feature-group__icon.svelte-dmrpr2.svelte-dmrpr2{fill:#191919}.mc-feature-group__container.svelte-dmrpr2.svelte-dmrpr2{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin:5px 0;padding:8px 0px;-o-transition:margin 300ms ease-in-out;-webkit-transition:margin 300ms ease-in-out;transition:margin 300ms ease-in-out}.mc-feature-group__label.svelte-dmrpr2.svelte-dmrpr2{margin:0 8px;width:200px;min-width:200px;overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical}.mc-feature-group__label__tooltip.svelte-dmrpr2.svelte-dmrpr2{opacity:0;-webkit-transition:0s opacity;-o-transition:0s opacity;transition:0s opacity;background-color:#b3b3b3;border:1px solid #191919;border-radius:4px;position:absolute;pointer-events:none;left:calc(100% - 16px);padding:8px 16px;width:188px}.mc-feature-group__label__tooltip__pointer.svelte-dmrpr2.svelte-dmrpr2{position:absolute;top:50%;left:-8px;top:calc(50% - 6px);width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-right:8px solid white}.mc-feature-group__label__tooltip__pointer.svelte-dmrpr2 div.svelte-dmrpr2{position:relative;top:-6px;left:2px;width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-right:8px solid #b3b3b3}.mc-feature-group__label.svelte-dmrpr2:hover+.mc-feature-group__label__tooltip.svelte-dmrpr2{opacity:1;-webkit-transition-delay:1s;-o-transition-delay:1s;transition-delay:1s}.mc-feature-group__content.svelte-dmrpr2.svelte-dmrpr2{overflow:hidden;-o-transition:height 300ms ease-in-out;-webkit-transition:height 300ms ease-in-out;transition:height 300ms ease-in-out}.mc-feature-group__content.is-close.svelte-dmrpr2.svelte-dmrpr2{height:0}.mc-feature-group.is-selected.svelte-dmrpr2.svelte-dmrpr2{background:#cfd2d8}.mc-feature-group.is-close.svelte-dmrpr2 .mc-feature-group__container.svelte-dmrpr2{margin:0 20px;width:24px}.mc-feature-group.is-open.svelte-dmrpr2 .mc-feature-group__container.svelte-dmrpr2{margin:0 32px}.mc-feature-group.svelte-dmrpr2.svelte-dmrpr2:hover{background:#b3b7c1}.mc-feature-group.svelte-dmrpr2.svelte-dmrpr2:focus-visible{-webkit-box-shadow:none;box-shadow:none;border:none;outline:none}.mc-feature-group.svelte-dmrpr2:focus-visible .mc-feature-group__container.svelte-dmrpr2{-webkit-box-shadow:none;box-shadow:none;border:none;border-radius:6px;outline:1px solid #0b96cc}ul.svelte-dmrpr2.svelte-dmrpr2,li.svelte-dmrpr2.svelte-dmrpr2{list-style-type:none;margin:0;padding:0;display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}ul.svelte-dmrpr2.svelte-dmrpr2{-webkit-box-align:start;-ms-flex-align:start;align-items:start;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}ul.svelte-dmrpr2 li.svelte-dmrpr2{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-sizing:border-box;box-sizing:border-box}")}function B(e,t,r){const i=e.slice();return i[15]=t[r],i}function C(e){let t,r,i=`<${D(e[0].icon)} class="mc-feature-group__icon" />`;return{c(){t=new L(!1),r=b(),t.a=r},m(e,o){t.m(i,e,o),n(e,r,o)},p(e,r){1&r&&i!==(i=`<${D(e[0].icon)} class="mc-feature-group__icon" />`)&&t.p(i)},d(e){e&&m(r),e&&t.d()}}}function q(e){let t,r,i,d,p,c=e[0].label+"",u=e[6]?.offsetHeight<e[6]?.scrollHeight&&F(e);function f(e,t){return e[1]?N:S}let h=f(e),x=h(e);return{c(){t=o("span"),r=v(c),i=s(),u&&u.c(),d=s(),x.c(),p=b(),l(t,"class","mc-feature-group__label svelte-dmrpr2")},m(o,s){n(o,t,s),a(t,r),e[9](t),n(o,i,s),u&&u.m(o,s),n(o,d,s),x.m(o,s),n(o,p,s)},p(e,t){1&t&&c!==(c=e[0].label+"")&&g(r,c),e[6]?.offsetHeight<e[6]?.scrollHeight?u?u.p(e,t):(u=F(e),u.c(),u.m(d.parentNode,d)):u&&(u.d(1),u=null),h!==(h=f(e))&&(x.d(1),x=h(e),x&&(x.c(),x.m(p.parentNode,p)))},d(r){r&&m(t),e[9](null),r&&m(i),u&&u.d(r),r&&m(d),x.d(r),r&&m(p)}}}function F(e){let t,r,i,d,p,c=e[0].label+"";return{c(){t=o("div"),r=o("div"),r.innerHTML='<div class="svelte-dmrpr2"></div>',i=s(),d=o("span"),p=v(c),l(r,"class","mc-feature-group__label__tooltip__pointer svelte-dmrpr2"),l(t,"aria-hidden","true"),l(t,"class","mc-feature-group__label__tooltip svelte-dmrpr2")},m(e,o){n(e,t,o),a(t,r),a(t,i),a(t,d),a(d,p)},p(e,t){1&t&&c!==(c=e[0].label+"")&&g(p,c)},d(e){e&&m(t)}}}function N(e){let t,r;return{c(){t=H("svg"),r=H("path"),l(r,"d","M12 9H4a1 1 0 010-2h8a1 1 0 010 2z"),l(t,"class","mc-feature-group__icon svelte-dmrpr2"),l(t,"width","16px"),l(t,"height","16px"),l(t,"viewBox","0 0 16 16")},m(e,i){n(e,t,i),a(t,r)},d(e){e&&m(t)}}}function S(e){let t,r;return{c(){t=H("svg"),r=H("path"),l(r,"d","M13 7H9V3a1 1 0 00-2 0v4H3a1 1 0 000 2h4v4a1 1 0 002 0V9h4a1 1 0 000-2z"),l(t,"class","mc-feature-group__icon svelte-dmrpr2"),l(t,"width","16px"),l(t,"height","16px"),l(t,"viewBox","0 0 16 16")},m(e,i){n(e,t,i),a(t,r)},d(e){e&&m(t)}}}function T(e){let t,r,i,p,u,f;function b(){return e[10](e[15])}return r=new j({props:{feature:e[15],a11yLabels:e[2]}}),{c(){t=o("li"),h(r.$$.fragment),i=s(),l(t,"class","svelte-dmrpr2")},m(e,o){n(e,t,o),x(r,t,null),a(t,i),p=!0,u||(f=_(t,"click",w(b)),u=!0)},p(t,i){e=t;const o={};1&i&&(o.feature=e[15]),4&i&&(o.a11yLabels=e[2]),r.$set(o)},i(e){p||(d(r.$$.fragment,e),p=!0)},o(e){c(r.$$.fragment,e),p=!1},d(e){e&&m(t),y(r),u=!1,f()}}}function V(e){let t,r,i,f,b,v,g,h,x,_,w,y,$,L=e[0].icon&&C(e),H=e[3]&&q(e),j=e[0].items,z=[];for(let t=0;t<j.length;t+=1)z[t]=T(B(e,j,t));const E=e=>c(z[e],1,1,(()=>{z[e]=null}));return{c(){t=o("button"),r=o("span"),L&&L.c(),i=s(),H&&H.c(),x=s(),_=o("ul");for(let e=0;e<z.length;e+=1)z[e].c();l(r,"class","mc-feature-group__container svelte-dmrpr2"),l(t,"class",f="mc-feature-group "+(e[5]?"is-selected":"")+" "+(e[3]?"is-open":"is-close")+" svelte-dmrpr2"),l(t,"aria-label",b=e[0].label),l(t,"aria-expanded",v=e[3]&&e[1]),l(t,"aria-controls",g=e[0].code+"-list"),l(t,"id",h=e[0].code),l(_,"class","mc-feature-group__content is-close svelte-dmrpr2"),l(_,"aria-hidden",w=!e[3]||!e[1]),l(_,"id",y=e[0].code+"-list")},m(o,s){n(o,t,s),a(t,r),L&&L.m(r,null),a(r,i),H&&H.m(r,null),n(o,x,s),n(o,_,s);for(let e=0;e<z.length;e+=1)z[e]&&z[e].m(_,null);e[11](_),$=!0},p(e,[o]){if(e[0].icon?L?L.p(e,o):(L=C(e),L.c(),L.m(r,i)):L&&(L.d(1),L=null),e[3]?H?H.p(e,o):(H=q(e),H.c(),H.m(r,null)):H&&(H.d(1),H=null),(!$||40&o&&f!==(f="mc-feature-group "+(e[5]?"is-selected":"")+" "+(e[3]?"is-open":"is-close")+" svelte-dmrpr2"))&&l(t,"class",f),(!$||1&o&&b!==(b=e[0].label))&&l(t,"aria-label",b),(!$||10&o&&v!==(v=e[3]&&e[1]))&&l(t,"aria-expanded",v),(!$||1&o&&g!==(g=e[0].code+"-list"))&&l(t,"aria-controls",g),(!$||1&o&&h!==(h=e[0].code))&&l(t,"id",h),133&o){let t;for(j=e[0].items,t=0;t<j.length;t+=1){const r=B(e,j,t);z[t]?(z[t].p(r,o),d(z[t],1)):(z[t]=T(r),z[t].c(),d(z[t],1),z[t].m(_,null))}for(k(),t=j.length;t<z.length;t+=1)E(t);p()}(!$||10&o&&w!==(w=!e[3]||!e[1]))&&l(_,"aria-hidden",w),(!$||1&o&&y!==(y=e[0].code+"-list"))&&l(_,"id",y)},i(e){if(!$){for(let e=0;e<j.length;e+=1)d(z[e]);$=!0}},o(e){z=z.filter(Boolean);for(let e=0;e<z.length;e+=1)c(z[e]);$=!1},d(r){r&&m(t),L&&L.d(),H&&H.d(),r&&m(x),r&&m(_),u(z,r),e[11](null)}}}function D(e){return`${e} size="1.5rem" style="height: 1.5rem; width: 1.5rem;"`}function I(e,t,r){let i,o;f(e,E,(e=>r(3,i=e))),f(e,G,(e=>r(8,o=e)));let s,l,{featureGroup:n}=t,{expand:a}=t,{a11yLabels:d}=t,p=new M,c=!1;function m(e){var t;e.disabled||((null===(t=e.items)||void 0===t?void 0:t.length)?p.dispatch("feature-click",e):z(e.code))}return e.$$set=e=>{"featureGroup"in e&&r(0,n=e.featureGroup),"expand"in e&&r(1,a=e.expand),"a11yLabels"in e&&r(2,d=e.a11yLabels)},e.$$.update=()=>{var t,l,d,p,m,u;267&e.$$.dirty&&(t=a,l=i,d=n,r(5,c=null!==(u=(null==(p=o)?void 0:p.lv0)&&d.code===(null===(m=null==p?void 0:p.lv0)||void 0===m?void 0:m.code)&&(!p.lv1||!t||!l))&&void 0!==u&&u)),10&e.$$.dirty&&function(e,t){if(s){r(4,s.style.height="",s),r(4,s.style.transition="none",s);const i=window.getComputedStyle(s).height;s.classList.add(t&&e?"is-open":"is-close"),s.classList.remove(t&&e?"is-close":"is-open");const o=window.getComputedStyle(s).height;r(4,s.style.height=i,s),requestAnimationFrame((()=>{r(4,s.style.transition="",s),requestAnimationFrame((()=>{r(4,s.style.height=o,s)}))}));const l=()=>{r(4,s.style.height="",s),s.removeEventListener("transitionend",l)};s.addEventListener("transitionend",l)}}(a,i)},[n,a,d,i,s,c,l,m,o,function(e){$[e?"unshift":"push"]((()=>{l=e,r(6,l)}))},e=>m(e),function(e){$[e?"unshift":"push"]((()=>{s=e,r(4,s)}))}]}class J extends e{constructor(e){super(),t(this,e,I,V,r,{featureGroup:0,expand:1,a11yLabels:2},A)}}export{J as default};
 //# sourceMappingURL=sidebar-feature-group.nested.js.map

package/public/components/sidebar/sidebar-feature-group.nested.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sidebar-feature-group.nested.js","sources":["../../../src/components/sidebar/sidebar-feature-group.nested.svelte"],"sourcesContent":["<svelte:options />\n\n<script lang=\"ts\">\n import type { FeatureGroup, Feature, A11yLabels } from './sidebar.types';\n import FeatureComponent from './sidebar-feature.nested.svelte';\n import {\n isSidebarOpen,\n selectedFeature,\n selectFeature,\n Selection,\n } from './sidebar-service';\n import { EventHandler } from '../../utilities/EventHandler';\n\n export let featureGroup: FeatureGroup;\n export let expand: boolean;\n export let a11yLabels: A11yLabels;\n let eventHandler = new EventHandler();\n let content: HTMLElement;\n\n $: updateSelection(expand, $isSidebarOpen, featureGroup, $selectedFeature);\n $: updateContentCSS(expand, $isSidebarOpen);\n\n let isSelected = false;\n\n let label: HTMLElement;\n\n function updateSelection(\n isExpanded: boolean,\n isOpen: boolean,\n group: FeatureGroup,\n selection?: Selection,\n ): void {\n isSelected =\n (selection?.lv0 &&\n group.code === selection?.lv0?.code &&\n (!selection.lv1 \|\| !isExpanded \|\| !isOpen)) ??\n false;\n }\n\n // Update the CSS programatically to have a nice animation on height between 0px and 'auto'\n function updateContentCSS(isExpanded: boolean, isOpen: boolean): void {\n if (content) {\n content.style.height = '';\n content.style.transition = 'none';\n const startHeight = window.getComputedStyle(content).height;\n\n content.classList.add(isOpen && isExpanded ? 'is-open' : 'is-close');\n content.classList.remove(isOpen && isExpanded ? 'is-close' : 'is-open');\n\n const height = window.getComputedStyle(content).height;\n content.style.height = startHeight;\n\n // wait until the next frame so that everything has time to update before starting the transition\n requestAnimationFrame(() => {\n content.style.transition = '';\n requestAnimationFrame(() => {\n content.style.height = height;\n });\n });\n\n // Clear the saved height values after the transition\n const handler = () => {\n content.style.height = '';\n content.removeEventListener('transitionend', handler);\n };\n\n content.addEventListener('transitionend', handler);\n }\n }\n\n function generateIcon(iconname: string): string {\n return `${iconname} size=\"1.5rem\"`;\n }\n\n function handleClick(feature: Feature) {\n if (!feature.disabled) {\n // Only select the feature if it is the last level item\n if (feature.items?.length) {\n eventHandler.dispatch('feature-click', feature);\n } else {\n selectFeature(feature.code);\n }\n }\n }\n</script>\n\n<button\n class=\"mc-feature-group {isSelected ? 'is-selected' : ''} {$isSidebarOpen\n ? 'is-open'\n : 'is-close'}\"\n aria-label={featureGroup.label}\n aria-expanded={$isSidebarOpen && expand}\n aria-controls=\"{featureGroup.code}-list\"\n id={featureGroup.code}\n>\n <span class=\"mc-feature-group__container\">\n {#if featureGroup.icon}\n {@html `<${generateIcon(\n featureGroup.icon,\n )} class=\"mc-feature-group__icon\" />`}\n {/if}\n {#if $isSidebarOpen}\n <span class=\"mc-feature-group__label\" bind:this={label}>\n {featureGroup.label}\n </span>\n {#if label?.offsetHeight < label?.scrollHeight}\n <div aria-hidden=\"true\" class=\"mc-feature-group__label__tooltip\">\n <div class=\"mc-feature-group__label__tooltip__pointer\"><div /></div>\n <span>{featureGroup.label}</span>\n </div>\n {/if}\n {#if !expand}\n <svg\n class=\"mc-feature-group__icon\"\n width=\"16px\"\n height=\"16px\"\n viewBox=\"0 0 16 16\"\n ><path\n d=\"M13 7H9V3a1 1 0 00-2 0v4H3a1 1 0 000 2h4v4a1 1 0 002 0V9h4a1 1 0 000-2z\"\n /></svg\n >\n {:else}\n <svg\n class=\"mc-feature-group__icon\"\n width=\"16px\"\n height=\"16px\"\n viewBox=\"0 0 16 16\"\n ><path d=\"M12 9H4a1 1 0 010-2h8a1 1 0 010 2z\" /></svg\n >\n {/if}\n {/if}\n </span>\n</button>\n<ul\n class=\"mc-feature-group__content is-close\"\n aria-hidden={!$isSidebarOpen \|\| !expand}\n id=\"{featureGroup.code}-list\"\n bind:this={content}\n>\n {#each featureGroup.items as feature}\n <li on:click\|stopPropagation={() => handleClick(feature)}>\n <FeatureComponent {feature} {a11yLabels} />\n </li>\n {/each}\n</ul>\n\n<style lang=\"scss\">\n @import '@mozaic-ds/styles/settings-tools/_all-settings';\n @import './sidebar-variables';\n\n .mc-feature-group {\n background: none;\n border: none;\n color: $color-sidebar-text-color;\n cursor: pointer;\n font-size: inherit;\n font-family: inherit;\n text-align: initial;\n margin: 0;\n padding: 0;\n overflow: hidden;\n\n &__icon {\n fill: $color-sidebar-icon;\n }\n\n &__container {\n display: flex;\n align-items: center;\n margin: 5px 0;\n padding: 8px 0px;\n @include transition(margin 300ms ease-in-out);\n }\n\n &__label {\n margin: 0 8px;\n width: 200px;\n min-width: 200px;\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n line-clamp: 2;\n -webkit-box-orient: vertical;\n\n &__tooltip {\n opacity: 0;\n transition: 0s opacity;\n background-color: $color-sidebar-divider-background;\n border: 1px solid $color-sidebar-text-color;\n border-radius: 4px;\n position: absolute;\n pointer-events: none;\n left: calc(100% - 16px);\n padding: 8px 16px;\n width: 188px;\n\n &__pointer {\n position: absolute;\n top: 50%;\n left: -8px;\n top: calc(50% - 6px);\n width: 0;\n height: 0;\n border-top: 6px solid transparent;\n border-bottom: 6px solid transparent;\n border-right: 8px solid white;\n\n & div {\n position: relative;\n top: -6px;\n left: 2px;\n width: 0;\n height: 0;\n border-top: 6px solid transparent;\n border-bottom: 6px solid transparent;\n border-right: 8px solid $color-sidebar-divider-background;\n }\n }\n }\n\n &:hover + .mc-feature-group__label__tooltip {\n opacity: 1;\n transition-delay: 1s;\n }\n }\n\n &__content {\n overflow: hidden;\n @include transition(height 300ms ease-in-out);\n &.is-close {\n height: 0;\n }\n\n &.is-open {\n height: auto;\n }\n }\n\n &.is-selected {\n background: $color-sidebar-feature-selected-background;\n }\n\n &.is-close {\n .mc-feature-group__container {\n margin: 0 20px;\n width: 24px;\n }\n }\n\n &.is-open {\n .mc-feature-group__container {\n margin: 0 32px;\n }\n }\n\n &:hover {\n background: $color-sidebar-feature-hover-background;\n }\n\n &:focus-visible {\n box-shadow: none;\n border: none;\n outline: none;\n\n .mc-feature-group__container {\n box-shadow: none;\n border: none;\n border-radius: 6px;\n outline: 1px solid #0b96cc;\n }\n }\n }\n\n ul,\n li {\n list-style-type: none;\n margin: 0;\n padding: 0;\n display: flex;\n width: 100%;\n }\n\n ul {\n align-items: start;\n flex-direction: column;\n justify-content: center;\n\n li {\n flex-direction: column;\n box-sizing: border-box;\n }\n }\n</style>\n"],"names":["generateIcon","ctx","icon","html_tag","p","raw_value","t0_value","label","if_block0","offsetHeight","scrollHeight","create_if_block_2","create_if_block_1","insert","target","span","anchor","dirty","set_data","t0","t1_value","div2","append","div1","t1","svg","path","li","create_if_block_3","create_if_block","each_value","items","length","i","attr","button","button_aria_label_value","button_aria_expanded_value","button_aria_controls_value","code","button_id_value","ul","ul_aria_hidden_value","ul_id_value","current","each_blocks","iconname","content","featureGroup","$$props","expand","a11yLabels","eventHandler","EventHandler","isSelected","handleClick","feature","disabled","_a","dispatch","selectFeature","isExpanded","isOpen","group","selection","$isSidebarOpen","_b","$selectedFeature","lv0","lv1","$$invalidate","style","height","transition","startHeight","window","getComputedStyle","classList","add","remove","requestAnimationFrame","handler","removeEventListener","addEventListener","updateContentCSS","$$value"],"mappings":"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"}
1	+ {"version":3,"file":"sidebar-feature-group.nested.js","sources":["../../../src/components/sidebar/sidebar-feature-group.nested.svelte"],"sourcesContent":["<svelte:options />\n\n<script lang=\"ts\">\n import type { FeatureGroup, Feature, A11yLabels } from './sidebar.types';\n import FeatureComponent from './sidebar-feature.nested.svelte';\n import {\n isSidebarOpen,\n selectedFeature,\n selectFeature,\n Selection,\n } from './sidebar-service';\n import { EventHandler } from '../../utilities/EventHandler';\n\n export let featureGroup: FeatureGroup;\n export let expand: boolean;\n export let a11yLabels: A11yLabels;\n let eventHandler = new EventHandler();\n let content: HTMLElement;\n\n $: updateSelection(expand, $isSidebarOpen, featureGroup, $selectedFeature);\n $: updateContentCSS(expand, $isSidebarOpen);\n\n let isSelected = false;\n\n let label: HTMLElement;\n\n function updateSelection(\n isExpanded: boolean,\n isOpen: boolean,\n group: FeatureGroup,\n selection?: Selection,\n ): void {\n isSelected =\n (selection?.lv0 &&\n group.code === selection?.lv0?.code &&\n (!selection.lv1 \|\| !isExpanded \|\| !isOpen)) ??\n false;\n }\n\n // Update the CSS programatically to have a nice animation on height between 0px and 'auto'\n function updateContentCSS(isExpanded: boolean, isOpen: boolean): void {\n if (content) {\n content.style.height = '';\n content.style.transition = 'none';\n const startHeight = window.getComputedStyle(content).height;\n\n content.classList.add(isOpen && isExpanded ? 'is-open' : 'is-close');\n content.classList.remove(isOpen && isExpanded ? 'is-close' : 'is-open');\n\n const height = window.getComputedStyle(content).height;\n content.style.height = startHeight;\n\n // wait until the next frame so that everything has time to update before starting the transition\n requestAnimationFrame(() => {\n content.style.transition = '';\n requestAnimationFrame(() => {\n content.style.height = height;\n });\n });\n\n // Clear the saved height values after the transition\n const handler = () => {\n content.style.height = '';\n content.removeEventListener('transitionend', handler);\n };\n\n content.addEventListener('transitionend', handler);\n }\n }\n\n function generateIcon(iconname: string): string {\n return `${iconname} size=\"1.5rem\" style=\"height: 1.5rem; width: 1.5rem;\"`;\n }\n\n function handleClick(feature: Feature) {\n if (!feature.disabled) {\n // Only select the feature if it is the last level item\n if (feature.items?.length) {\n eventHandler.dispatch('feature-click', feature);\n } else {\n selectFeature(feature.code);\n }\n }\n }\n</script>\n\n<button\n class=\"mc-feature-group {isSelected ? 'is-selected' : ''} {$isSidebarOpen\n ? 'is-open'\n : 'is-close'}\"\n aria-label={featureGroup.label}\n aria-expanded={$isSidebarOpen && expand}\n aria-controls=\"{featureGroup.code}-list\"\n id={featureGroup.code}\n>\n <span class=\"mc-feature-group__container\">\n {#if featureGroup.icon}\n {@html `<${generateIcon(\n featureGroup.icon,\n )} class=\"mc-feature-group__icon\" />`}\n {/if}\n {#if $isSidebarOpen}\n <span class=\"mc-feature-group__label\" bind:this={label}>\n {featureGroup.label}\n </span>\n {#if label?.offsetHeight < label?.scrollHeight}\n <div aria-hidden=\"true\" class=\"mc-feature-group__label__tooltip\">\n <div class=\"mc-feature-group__label__tooltip__pointer\"><div /></div>\n <span>{featureGroup.label}</span>\n </div>\n {/if}\n {#if !expand}\n <svg\n class=\"mc-feature-group__icon\"\n width=\"16px\"\n height=\"16px\"\n viewBox=\"0 0 16 16\"\n ><path\n d=\"M13 7H9V3a1 1 0 00-2 0v4H3a1 1 0 000 2h4v4a1 1 0 002 0V9h4a1 1 0 000-2z\"\n /></svg\n >\n {:else}\n <svg\n class=\"mc-feature-group__icon\"\n width=\"16px\"\n height=\"16px\"\n viewBox=\"0 0 16 16\"\n ><path d=\"M12 9H4a1 1 0 010-2h8a1 1 0 010 2z\" /></svg\n >\n {/if}\n {/if}\n </span>\n</button>\n<ul\n class=\"mc-feature-group__content is-close\"\n aria-hidden={!$isSidebarOpen \|\| !expand}\n id=\"{featureGroup.code}-list\"\n bind:this={content}\n>\n {#each featureGroup.items as feature}\n <li on:click\|stopPropagation={() => handleClick(feature)}>\n <FeatureComponent {feature} {a11yLabels} />\n </li>\n {/each}\n</ul>\n\n<style lang=\"scss\">\n @import '@mozaic-ds/styles/settings-tools/_all-settings';\n @import './sidebar-variables';\n\n .mc-feature-group {\n background: none;\n border: none;\n color: $color-sidebar-text-color;\n cursor: pointer;\n font-size: inherit;\n font-family: inherit;\n text-align: initial;\n margin: 0;\n padding: 0;\n overflow: hidden;\n\n &__icon {\n fill: $color-sidebar-icon;\n }\n\n &__container {\n display: flex;\n align-items: center;\n margin: 5px 0;\n padding: 8px 0px;\n @include transition(margin 300ms ease-in-out);\n }\n\n &__label {\n margin: 0 8px;\n width: 200px;\n min-width: 200px;\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n line-clamp: 2;\n -webkit-box-orient: vertical;\n\n &__tooltip {\n opacity: 0;\n transition: 0s opacity;\n background-color: $color-sidebar-divider-background;\n border: 1px solid $color-sidebar-text-color;\n border-radius: 4px;\n position: absolute;\n pointer-events: none;\n left: calc(100% - 16px);\n padding: 8px 16px;\n width: 188px;\n\n &__pointer {\n position: absolute;\n top: 50%;\n left: -8px;\n top: calc(50% - 6px);\n width: 0;\n height: 0;\n border-top: 6px solid transparent;\n border-bottom: 6px solid transparent;\n border-right: 8px solid white;\n\n & div {\n position: relative;\n top: -6px;\n left: 2px;\n width: 0;\n height: 0;\n border-top: 6px solid transparent;\n border-bottom: 6px solid transparent;\n border-right: 8px solid $color-sidebar-divider-background;\n }\n }\n }\n\n &:hover + .mc-feature-group__label__tooltip {\n opacity: 1;\n transition-delay: 1s;\n }\n }\n\n &__content {\n overflow: hidden;\n @include transition(height 300ms ease-in-out);\n &.is-close {\n height: 0;\n }\n\n &.is-open {\n height: auto;\n }\n }\n\n &.is-selected {\n background: $color-sidebar-feature-selected-background;\n }\n\n &.is-close {\n .mc-feature-group__container {\n margin: 0 20px;\n width: 24px;\n }\n }\n\n &.is-open {\n .mc-feature-group__container {\n margin: 0 32px;\n }\n }\n\n &:hover {\n background: $color-sidebar-feature-hover-background;\n }\n\n &:focus-visible {\n box-shadow: none;\n border: none;\n outline: none;\n\n .mc-feature-group__container {\n box-shadow: none;\n border: none;\n border-radius: 6px;\n outline: 1px solid #0b96cc;\n }\n }\n }\n\n ul,\n li {\n list-style-type: none;\n margin: 0;\n padding: 0;\n display: flex;\n width: 100%;\n }\n\n ul {\n align-items: start;\n flex-direction: column;\n justify-content: center;\n\n li {\n flex-direction: column;\n box-sizing: border-box;\n }\n }\n</style>\n"],"names":["generateIcon","ctx","icon","html_tag","p","raw_value","t0_value","label","if_block0","offsetHeight","scrollHeight","create_if_block_2","create_if_block_1","insert","target","span","anchor","dirty","set_data","t0","t1_value","div2","append","div1","t1","svg","path","li","create_if_block_3","create_if_block","each_value","items","length","i","attr","button","button_aria_label_value","button_aria_expanded_value","button_aria_controls_value","code","button_id_value","ul","ul_aria_hidden_value","ul_id_value","current","each_blocks","iconname","content","featureGroup","$$props","expand","a11yLabels","eventHandler","EventHandler","isSelected","handleClick","feature","disabled","_a","dispatch","selectFeature","isExpanded","isOpen","group","selection","$isSidebarOpen","_b","$selectedFeature","lv0","lv1","$$invalidate","style","height","transition","startHeight","window","getComputedStyle","classList","add","remove","requestAnimationFrame","handler","removeEventListener","addEventListener","updateContentCSS","$$value"],"mappings":"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"}

package/public/components/sidebar/sidebar-segment.nested.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{P as e,i as s,s as t,Q as i,K as n,b as a,n as c,o as l,ab as o,e as r,d,t as m,g as b,j as h,l as w,k as g,Z as k}from"../../index-c33b3772.js";import{a as v,s as p,i as x}from"../../sidebar-service-275bf9ef.js";function u(e){i(e,"svelte-1wk2sch",".mc-sidebar-segment.svelte-1wk2sch.svelte-1wk2sch{cursor:pointer;-webkit-box-flex:0;-ms-flex:0;flex:0;text-decoration:none;color:#191919;line-height:22px;display:-webkit-box;display:-ms-flexbox;display:flex;overflow:hidden;min-height:40px}.mc-sidebar-segment__icon.svelte-1wk2sch.svelte-1wk2sch{fill:#191919}.mc-sidebar-segment.svelte-1wk2sch span.svelte-1wk2sch{width:200px;min-width:200px}.mc-sidebar-segment__container.svelte-1wk2sch.svelte-1wk2sch{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;padding:8px 0px}.mc-sidebar-segment__text.svelte-1wk2sch.svelte-1wk2sch{margin-left:10px}.mc-sidebar-segment.is-selected.svelte-1wk2sch.svelte-1wk2sch{background:#cfd2d8}.mc-sidebar-segment.svelte-1wk2sch .svelte-1wk2sch:last-child{margin-left:10px}.mc-sidebar-segment.svelte-1wk2sch.svelte-1wk2sch:focus-visible{-webkit-box-shadow:none;box-shadow:none;border:none;outline:none}.mc-sidebar-segment.svelte-1wk2sch:focus-visible .mc-sidebar-segment__container.svelte-1wk2sch{-webkit-box-shadow:none;box-shadow:none;border:none;border-radius:6px;outline:1px solid #0b96cc}.mc-sidebar-segment.svelte-1wk2sch.svelte-1wk2sch:hover{background:#b3b7c1}.mc-sidebar-segment.is-close.svelte-1wk2sch .mc-sidebar-segment__container.svelte-1wk2sch{-o-transition:margin 300ms ease-in-out;-webkit-transition:margin 300ms ease-in-out;transition:margin 300ms ease-in-out;margin:0 20px;width:24px}.mc-sidebar-segment.is-close.svelte-1wk2sch .mc-sidebar-segment__text.svelte-1wk2sch{opacity:0}.mc-sidebar-segment.is-open.svelte-1wk2sch .mc-sidebar-segment__container.svelte-1wk2sch{-o-transition:margin 300ms ease-in-out;-webkit-transition:margin 300ms ease-in-out;transition:margin 300ms ease-in-out;margin:0 32px}.mc-sidebar-segment.is-open.svelte-1wk2sch .mc-sidebar-segment__text.svelte-1wk2sch{opacity:1}")}function f(e){let s,t,i,n,c,o,k,v,p,x,u,f,y=e[0].label+"",j=e[0].icon&&_(e);return{c(){s=r("a"),t=r("div"),j&&j.c(),i=d(),n=r("span"),c=m(y),b(n,"aria-hidden",o=!e[2]),b(n,"class","mc-sidebar-segment__text svelte-1wk2sch"),b(t,"class","mc-sidebar-segment__container mc-sidebar-segment__icon svelte-1wk2sch"),b(s,"aria-label",k=e[0].label),b(s,"class",v="mc-sidebar-segment "+(e[0].code===e[1]?.lv0?.code?"is-selected":"")+" "+(e[2]?"is-open":"is-close")+" svelte-1wk2sch"),b(s,"href",p=e[0].href??"javascript:void(null)"),b(s,"id",x=e[0].code)},m(l,o){a(l,s,o),h(s,t),j&&j.m(t,null),h(t,i),h(t,n),h(n,c),u||(f=w(s,"click",e[3]),u=!0)},p(e,a){e[0].icon?j?j.p(e,a):(j=_(e),j.c(),j.m(t,i)):j&&(j.d(1),j=null),1&a&&y!==(y=e[0].label+"")&&g(c,y),4&a&&o!==(o=!e[2])&&b(n,"aria-hidden",o),1&a&&k!==(k=e[0].label)&&b(s,"aria-label",k),7&a&&v!==(v="mc-sidebar-segment "+(e[0].code===e[1]?.lv0?.code?"is-selected":"")+" "+(e[2]?"is-open":"is-close")+" svelte-1wk2sch")&&b(s,"class",v),1&a&&p!==(p=e[0].href??"javascript:void(null)")&&b(s,"href",p),1&a&&x!==(x=e[0].code)&&b(s,"id",x)},d(e){e&&l(s),j&&j.d(),u=!1,f()}}}function _(e){let s,t,i=`<${j(e[0].icon)} class="mc-sidebar-segment__icon"/>`;return{c(){s=new k(!1),t=n(),s.a=t},m(e,n){s.m(i,e,n),a(e,t,n)},p(e,t){1&t&&i!==(i=`<${j(e[0].icon)} class="mc-sidebar-segment__icon"/>`)&&s.p(i)},d(e){e&&l(t),e&&s.d()}}}function y(e){let s,t=e[0]&&f(e);return{c(){t&&t.c(),s=n()},m(e,i){t&&t.m(e,i),a(e,s,i)},p(e,[i]){e[0]?t?t.p(e,i):(t=f(e),t.c(),t.m(s.parentNode,s)):t&&(t.d(1),t=null)},i:c,o:c,d(e){t&&t.d(e),e&&l(s)}}}function j(e){return`${e} size="1.5rem"`}function $(e,s,t){let i,n;o(e,p,(e=>t(1,i=e))),o(e,x,(e=>t(2,n=e)));let{data:a}=s;return e.$$set=e=>{"data"in e&&t(0,a=e.data)},[a,i,n,function(){v(a.code)}]}class z extends e{constructor(e){super(),s(this,e,$,y,t,{data:0},u)}}export{z as default};
+import{P as e,i as s,s as t,Q as i,K as n,b as a,n as c,o as l,ab as o,e as r,d,t as m,g as b,j as h,l as w,k as g,Z as k}from"../../index-c33b3772.js";import{a as v,s as p,i as x}from"../../sidebar-service-275bf9ef.js";function u(e){i(e,"svelte-1wk2sch",".mc-sidebar-segment.svelte-1wk2sch.svelte-1wk2sch{cursor:pointer;-webkit-box-flex:0;-ms-flex:0;flex:0;text-decoration:none;color:#191919;line-height:22px;display:-webkit-box;display:-ms-flexbox;display:flex;overflow:hidden;min-height:40px}.mc-sidebar-segment__icon.svelte-1wk2sch.svelte-1wk2sch{fill:#191919}.mc-sidebar-segment.svelte-1wk2sch span.svelte-1wk2sch{width:200px;min-width:200px}.mc-sidebar-segment__container.svelte-1wk2sch.svelte-1wk2sch{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;padding:8px 0px}.mc-sidebar-segment__text.svelte-1wk2sch.svelte-1wk2sch{margin-left:10px}.mc-sidebar-segment.is-selected.svelte-1wk2sch.svelte-1wk2sch{background:#cfd2d8}.mc-sidebar-segment.svelte-1wk2sch .svelte-1wk2sch:last-child{margin-left:10px}.mc-sidebar-segment.svelte-1wk2sch.svelte-1wk2sch:focus-visible{-webkit-box-shadow:none;box-shadow:none;border:none;outline:none}.mc-sidebar-segment.svelte-1wk2sch:focus-visible .mc-sidebar-segment__container.svelte-1wk2sch{-webkit-box-shadow:none;box-shadow:none;border:none;border-radius:6px;outline:1px solid #0b96cc}.mc-sidebar-segment.svelte-1wk2sch.svelte-1wk2sch:hover{background:#b3b7c1}.mc-sidebar-segment.is-close.svelte-1wk2sch .mc-sidebar-segment__container.svelte-1wk2sch{-o-transition:margin 300ms ease-in-out;-webkit-transition:margin 300ms ease-in-out;transition:margin 300ms ease-in-out;margin:0 20px;width:24px}.mc-sidebar-segment.is-close.svelte-1wk2sch .mc-sidebar-segment__text.svelte-1wk2sch{opacity:0}.mc-sidebar-segment.is-open.svelte-1wk2sch .mc-sidebar-segment__container.svelte-1wk2sch{-o-transition:margin 300ms ease-in-out;-webkit-transition:margin 300ms ease-in-out;transition:margin 300ms ease-in-out;margin:0 32px}.mc-sidebar-segment.is-open.svelte-1wk2sch .mc-sidebar-segment__text.svelte-1wk2sch{opacity:1}")}function f(e){let s,t,i,n,c,o,k,v,p,x,u,f,y=e[0].label+"",j=e[0].icon&&_(e);return{c(){s=r("a"),t=r("div"),j&&j.c(),i=d(),n=r("span"),c=m(y),b(n,"aria-hidden",o=!e[2]),b(n,"class","mc-sidebar-segment__text svelte-1wk2sch"),b(t,"class","mc-sidebar-segment__container mc-sidebar-segment__icon svelte-1wk2sch"),b(s,"aria-label",k=e[0].label),b(s,"class",v="mc-sidebar-segment "+(e[0].code===e[1]?.lv0?.code?"is-selected":"")+" "+(e[2]?"is-open":"is-close")+" svelte-1wk2sch"),b(s,"href",p=e[0].href??"javascript:void(null)"),b(s,"id",x=e[0].code)},m(l,o){a(l,s,o),h(s,t),j&&j.m(t,null),h(t,i),h(t,n),h(n,c),u||(f=w(s,"click",e[3]),u=!0)},p(e,a){e[0].icon?j?j.p(e,a):(j=_(e),j.c(),j.m(t,i)):j&&(j.d(1),j=null),1&a&&y!==(y=e[0].label+"")&&g(c,y),4&a&&o!==(o=!e[2])&&b(n,"aria-hidden",o),1&a&&k!==(k=e[0].label)&&b(s,"aria-label",k),7&a&&v!==(v="mc-sidebar-segment "+(e[0].code===e[1]?.lv0?.code?"is-selected":"")+" "+(e[2]?"is-open":"is-close")+" svelte-1wk2sch")&&b(s,"class",v),1&a&&p!==(p=e[0].href??"javascript:void(null)")&&b(s,"href",p),1&a&&x!==(x=e[0].code)&&b(s,"id",x)},d(e){e&&l(s),j&&j.d(),u=!1,f()}}}function _(e){let s,t,i=`<${j(e[0].icon)} class="mc-sidebar-segment__icon"/>`;return{c(){s=new k(!1),t=n(),s.a=t},m(e,n){s.m(i,e,n),a(e,t,n)},p(e,t){1&t&&i!==(i=`<${j(e[0].icon)} class="mc-sidebar-segment__icon"/>`)&&s.p(i)},d(e){e&&l(t),e&&s.d()}}}function y(e){let s,t=e[0]&&f(e);return{c(){t&&t.c(),s=n()},m(e,i){t&&t.m(e,i),a(e,s,i)},p(e,[i]){e[0]?t?t.p(e,i):(t=f(e),t.c(),t.m(s.parentNode,s)):t&&(t.d(1),t=null)},i:c,o:c,d(e){t&&t.d(e),e&&l(s)}}}function j(e){return`${e} size="1.5rem" style="height: 1.5rem; width: 1.5rem;"`}function $(e,s,t){let i,n;o(e,p,(e=>t(1,i=e))),o(e,x,(e=>t(2,n=e)));let{data:a}=s;return e.$$set=e=>{"data"in e&&t(0,a=e.data)},[a,i,n,function(){v(a.code)}]}class z extends e{constructor(e){super(),s(this,e,$,y,t,{data:0},u)}}export{z as default};
 //# sourceMappingURL=sidebar-segment.nested.js.map

package/public/components/sidebar/sidebar-segment.nested.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sidebar-segment.nested.js","sources":["../../../src/components/sidebar/sidebar-segment.nested.svelte"],"sourcesContent":["<svelte:options />\n\n<script lang=\"ts\">\n import type { Segment } from './sidebar.types';\n import {\n isSidebarOpen,\n selectedFeature,\n selectFeature,\n } from './sidebar-service';\n\n export let data: Segment;\n\n function generateIcon(iconname: string): string {\n return `${iconname} size=\"1.5rem\"`;\n }\n\n function handleClick() {\n selectFeature(data.code);\n }\n</script>\n\n{#if data}\n <a\n aria-label={data.label}\n class=\"mc-sidebar-segment {data.code === $selectedFeature?.lv0?.code\n ? 'is-selected'\n : ''} {$isSidebarOpen ? 'is-open' : 'is-close'}\"\n href={data.href ?? 'javascript:void(null)'}\n id={data.code}\n on:click={handleClick}\n >\n <div class=\"mc-sidebar-segment__container mc-sidebar-segment__icon\">\n {#if data.icon}\n {@html `<${generateIcon(data.icon)} class=\"mc-sidebar-segment__icon\"/>`}\n {/if}\n <span aria-hidden={!$isSidebarOpen} class=\"mc-sidebar-segment__text\">\n {data.label}\n </span>\n </div>\n </a>\n{/if}\n\n<style lang=\"scss\">\n @import '@mozaic-ds/styles/settings-tools/_all-settings';\n @import './sidebar-variables';\n\n .mc-sidebar-segment {\n cursor: pointer;\n flex: 0;\n text-decoration: none;\n color: $color-sidebar-text-color;\n line-height: 22px;\n display: flex;\n overflow: hidden;\n min-height: 40px;\n\n &__icon {\n fill: $color-sidebar-icon;\n }\n\n span {\n width: 200px;\n min-width: 200px;\n }\n\n &__container {\n display: flex;\n align-items: center;\n width: 100%;\n padding: 8px 0px;\n }\n\n svg {\n fill: $color-sidebar-icon;\n }\n\n &__text {\n margin-left: 10px;\n }\n\n &.is-selected {\n background: $color-sidebar-feature-selected-background;\n }\n\n :last-child {\n margin-left: 10px;\n }\n\n &:focus-visible {\n box-shadow: none;\n border: none;\n outline: none;\n\n .mc-sidebar-segment__container {\n box-shadow: none;\n border: none;\n border-radius: 6px;\n outline: 1px solid #0b96cc;\n }\n }\n\n &:hover {\n background: $color-sidebar-feature-hover-background;\n }\n\n &.is-close {\n .mc-sidebar-segment__container {\n @include transition(margin 300ms ease-in-out);\n margin: 0 20px;\n width: 24px;\n }\n\n .mc-sidebar-segment__text {\n opacity: 0;\n }\n }\n\n &.is-open {\n .mc-sidebar-segment__container {\n @include transition(margin 300ms ease-in-out);\n margin: 0 32px;\n }\n\n .mc-sidebar-segment__text {\n opacity: 1;\n }\n }\n }\n</style>\n"],"names":["t1_value","ctx","label","if_block","icon","create_if_block_1","attr","a","a_aria_label_value","a_class_value","code","lv0","href","a_id_value","insert","target","anchor","append","div","span","dirty","set_data","t1","generateIcon","html_tag","p","raw_value","create_if_block","iconname","data","$$props","selectFeature"],"mappings":"4nEAoCSA,EAAAC,KAAKC,MAAK,GAJRC,EAAAF,KAAKG,MAAIC,EAAAJ,yFAGMA,EAAc,gJAZxBK,EAAAC,EAAA,aAAAC,EAAAP,KAAKC,OACUI,EAAAC,EAAA,QAAAE,EAAA,uBAAAR,KAAKS,OAAST,EAAkB,IAAAU,KAAKD,KAC5D,cACA,IAAK,KAAAT,EAAiB,GAAA,UAAY,YAAU,gCAC1CA,EAAI,GAACW,MAAQ,yBACfN,EAAAC,EAAA,KAAAM,EAAAZ,KAAKS,cANXI,EAiBGC,EAAAR,EAAAS,GARDC,EAOKV,EAAAW,yBAHHD,EAEMC,EAAAC,4BARElB,EAAW,kBAGdA,KAAKG,2DAIP,EAAAgB,GAAApB,KAAAA,EAAAC,KAAKC,MAAK,KAAAmB,EAAAC,EAAAtB,gBADOC,EAAc,0BAZxB,EAAAmB,GAAAZ,KAAAA,EAAAP,KAAKC,4BACU,EAAAkB,GAAAX,KAAAA,EAAA,uBAAAR,KAAKS,OAAST,EAAkB,IAAAU,KAAKD,KAC5D,cACA,IAAK,KAAAT,EAAiB,GAAA,UAAY,YAAU,+CAC1CA,EAAI,GAACW,MAAQ,wCACf,EAAAQ,GAAAP,KAAAA,EAAAZ,KAAKS,iFAKMa,EAAatB,EAAI,GAACG,kIAAlBmB,EAAatB,EAAI,GAACG,6CAAIoB,EAAAC,EAAAC,kDAZpCzB,EAAI,IAAA0B,EAAA1B,oEAAJA,EAAI,sGATE,SAAAsB,EAAaK,YACVA~~,+FAHDC~~,GAAaC,kEAOtBC,EAAcF,EAAKnB"}
1	+ {"version":3,"file":"sidebar-segment.nested.js","sources":["../../../src/components/sidebar/sidebar-segment.nested.svelte"],"sourcesContent":["<svelte:options />\n\n<script lang=\"ts\">\n import type { Segment } from './sidebar.types';\n import {\n isSidebarOpen,\n selectedFeature,\n selectFeature,\n } from './sidebar-service';\n\n export let data: Segment;\n\n function generateIcon(iconname: string): string {\n return `${iconname} size=\"1.5rem\" style=\"height: 1.5rem; width: 1.5rem;\"`;\n }\n\n function handleClick() {\n selectFeature(data.code);\n }\n</script>\n\n{#if data}\n <a\n aria-label={data.label}\n class=\"mc-sidebar-segment {data.code === $selectedFeature?.lv0?.code\n ? 'is-selected'\n : ''} {$isSidebarOpen ? 'is-open' : 'is-close'}\"\n href={data.href ?? 'javascript:void(null)'}\n id={data.code}\n on:click={handleClick}\n >\n <div class=\"mc-sidebar-segment__container mc-sidebar-segment__icon\">\n {#if data.icon}\n {@html `<${generateIcon(data.icon)} class=\"mc-sidebar-segment__icon\"/>`}\n {/if}\n <span aria-hidden={!$isSidebarOpen} class=\"mc-sidebar-segment__text\">\n {data.label}\n </span>\n </div>\n </a>\n{/if}\n\n<style lang=\"scss\">\n @import '@mozaic-ds/styles/settings-tools/_all-settings';\n @import './sidebar-variables';\n\n .mc-sidebar-segment {\n cursor: pointer;\n flex: 0;\n text-decoration: none;\n color: $color-sidebar-text-color;\n line-height: 22px;\n display: flex;\n overflow: hidden;\n min-height: 40px;\n\n &__icon {\n fill: $color-sidebar-icon;\n }\n\n span {\n width: 200px;\n min-width: 200px;\n }\n\n &__container {\n display: flex;\n align-items: center;\n width: 100%;\n padding: 8px 0px;\n }\n\n svg {\n fill: $color-sidebar-icon;\n }\n\n &__text {\n margin-left: 10px;\n }\n\n &.is-selected {\n background: $color-sidebar-feature-selected-background;\n }\n\n :last-child {\n margin-left: 10px;\n }\n\n &:focus-visible {\n box-shadow: none;\n border: none;\n outline: none;\n\n .mc-sidebar-segment__container {\n box-shadow: none;\n border: none;\n border-radius: 6px;\n outline: 1px solid #0b96cc;\n }\n }\n\n &:hover {\n background: $color-sidebar-feature-hover-background;\n }\n\n &.is-close {\n .mc-sidebar-segment__container {\n @include transition(margin 300ms ease-in-out);\n margin: 0 20px;\n width: 24px;\n }\n\n .mc-sidebar-segment__text {\n opacity: 0;\n }\n }\n\n &.is-open {\n .mc-sidebar-segment__container {\n @include transition(margin 300ms ease-in-out);\n margin: 0 32px;\n }\n\n .mc-sidebar-segment__text {\n opacity: 1;\n }\n }\n }\n</style>\n"],"names":["t1_value","ctx","label","if_block","icon","create_if_block_1","attr","a","a_aria_label_value","a_class_value","code","lv0","href","a_id_value","insert","target","anchor","append","div","span","dirty","set_data","t1","generateIcon","html_tag","p","raw_value","create_if_block","iconname","data","$$props","selectFeature"],"mappings":"4nEAoCSA,EAAAC,KAAKC,MAAK,GAJRC,EAAAF,KAAKG,MAAIC,EAAAJ,yFAGMA,EAAc,gJAZxBK,EAAAC,EAAA,aAAAC,EAAAP,KAAKC,OACUI,EAAAC,EAAA,QAAAE,EAAA,uBAAAR,KAAKS,OAAST,EAAkB,IAAAU,KAAKD,KAC5D,cACA,IAAK,KAAAT,EAAiB,GAAA,UAAY,YAAU,gCAC1CA,EAAI,GAACW,MAAQ,yBACfN,EAAAC,EAAA,KAAAM,EAAAZ,KAAKS,cANXI,EAiBGC,EAAAR,EAAAS,GARDC,EAOKV,EAAAW,yBAHHD,EAEMC,EAAAC,4BARElB,EAAW,kBAGdA,KAAKG,2DAIP,EAAAgB,GAAApB,KAAAA,EAAAC,KAAKC,MAAK,KAAAmB,EAAAC,EAAAtB,gBADOC,EAAc,0BAZxB,EAAAmB,GAAAZ,KAAAA,EAAAP,KAAKC,4BACU,EAAAkB,GAAAX,KAAAA,EAAA,uBAAAR,KAAKS,OAAST,EAAkB,IAAAU,KAAKD,KAC5D,cACA,IAAK,KAAAT,EAAiB,GAAA,UAAY,YAAU,+CAC1CA,EAAI,GAACW,MAAQ,wCACf,EAAAQ,GAAAP,KAAAA,EAAAZ,KAAKS,iFAKMa,EAAatB,EAAI,GAACG,kIAAlBmB,EAAatB,EAAI,GAACG,6CAAIoB,EAAAC,EAAAC,kDAZpCzB,EAAI,IAAA0B,EAAA1B,oEAAJA,EAAI,sGATE,SAAAsB,EAAaK,YACVA,sIAHDC,GAAaC,kEAOtBC,EAAcF,EAAKnB"}

package/public/components/sidebar-feature-group/sidebar-feature-group.nested.svelte CHANGED Viewed

@@ -69,7 +69,7 @@
   }
   function generateIcon(iconname: string): string {
-    return `${iconname} size="1.5rem"`;
+    return `${iconname} size="1.5rem" style="height: 1.5rem; width: 1.5rem;"`;
   }
   function handleClick(feature: Feature) {

package/public/components/sidebar-segment/sidebar-segment.nested.svelte CHANGED Viewed

@@ -11,7 +11,7 @@
   export let data: Segment;
   function generateIcon(iconname: string): string {
-    return `${iconname} size="1.5rem"`;
+    return `${iconname} size="1.5rem" style="height: 1.5rem; width: 1.5rem;"`;
   }
   function handleClick() {