npm - @mozaic-ds/web-components - Versions diffs - 0.17.1 → 0.18.0-beta.0 - Mend

@mozaic-ds/web-components 0.17.1 → 0.18.0-beta.0

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 (548) hide show

package/public/components/button/Button.nested.svelte CHANGED Viewed

@@ -120,32 +120,36 @@
   {disabled}
   {...attributes}
 >
-  {#if iconname && iconmode === 'left'}
+  {#if (iconname || $$slots.icon) && iconmode === 'left'}
     <span class="mc-button__icon">
       {#if isLoading && loaderPosition === 'left'}
-        <Loader size="s" theme={loaderTheme} text="TEST" />
-      {:else}
+        <Loader size="s" theme={loaderTheme} text="" />
+      {:else if $$slots.icon}
+        <slot name="icon" />
+      {:else if iconname}
         {@html `<${generateIconName(size, iconmode, iconname)} />`}
       {/if}
     </span>
   {/if}
-  {#if iconname && iconmode === 'only'}
+  {#if (iconname || $$slots.icon) && iconmode === 'only'}
     <span class="mc-button__icon">
       {#if isLoading}
         <Loader size="m" theme={loaderTheme} text="" />
-      {:else}
-        {@html `<${generateIconName(size, iconmode, iconname)} size="100%" />`}
+      {:else if $$slots.icon}
+        <slot name="icon" />
+      {:else if iconname}
+        {@html `<${generateIconName(size, iconmode, iconname)} />`}
       {/if}
     </span>
   {:else}
-    {#if isLoading && loaderPosition === 'left' && !iconname}
+    {#if isLoading && loaderPosition === 'left' && !iconname && !$$slots.icon}
       <span class="mc-button__icon">
         <Loader size="s" theme={loaderTheme} text="" />
       </span>
     {/if}
     <span class="mc-button__label">{label}</span>
-    {#if isLoading && loaderPosition === 'right' && !iconname}
+    {#if isLoading && loaderPosition === 'right' && !iconname && !$$slots.icon}
       <span class="mc-button__icon">
         <Loader size="s" theme={loaderTheme} text="" />
       </span>
@@ -156,6 +160,8 @@
     <span class="mc-button__icon">
       {#if isLoading && loaderPosition === 'right'}
         <Loader size="s" theme={loaderTheme} text="" />
+      {:else if $$slots.icon}
+        <slot name="icon" />
       {:else}
         {@html `<${generateIconName(size, iconmode, iconname)} />`}
       {/if}

package/public/components/button/Button.svelte CHANGED Viewed

@@ -120,43 +120,49 @@
   {disabled}
   {...attributes}
 >
-  {#if iconname && iconmode === 'left'}
+  {#if (iconname || $$slots.icon) && iconmode === 'left'}
     <span class="mc-button__icon">
       {#if isLoading && loaderPosition === 'left'}
         <Loader size="s" theme={loaderTheme} text="" />
-      {:else}
+      {:else if $$slots.icon}
+        <slot name="icon" />
+      {:else if iconname}
         {@html `<${generateIconName(size, iconmode, iconname)} />`}
       {/if}
     </span>
   {/if}
-  {#if iconname && iconmode === 'only'}
+  {#if (iconname || $$slots.icon) && iconmode === 'only'}
     <span class="mc-button__icon">
       {#if isLoading}
         <Loader size="m" theme={loaderTheme} text="" />
-      {:else}
-        {@html `<${generateIconName(size, iconmode, iconname)} size="100%" />`}
+      {:else if $$slots.icon}
+        <slot name="icon" />
+      {:else if iconname}
+        {@html `<${generateIconName(size, iconmode, iconname)} />`}
       {/if}
     </span>
   {:else}
-    {#if isLoading && loaderPosition === 'left' && !iconname}
+    {#if isLoading && loaderPosition === 'left' && !iconname && !$$slots.icon}
       <span class="mc-button__icon">
         <Loader size="s" theme={loaderTheme} text="" />
       </span>
     {/if}
     <span class="mc-button__label">{label}</span>
-    {#if isLoading && loaderPosition === 'right' && !iconname}
+    {#if isLoading && loaderPosition === 'right' && !iconname && !$$slots.icon}
       <span class="mc-button__icon">
         <Loader size="s" theme={loaderTheme} text="" />
       </span>
     {/if}
   {/if}
-  {#if iconname && iconmode === 'right'}
+  {#if (iconname || $$slots.icon) && iconmode === 'right'}
     <span class="mc-button__icon">
       {#if isLoading && loaderPosition === 'right'}
         <Loader size="s" theme={loaderTheme} text="" />
-      {:else}
+      {:else if $$slots.icon}
+        <slot name="icon" />
+      {:else if iconname}
         {@html `<${generateIconName(size, iconmode, iconname)} />`}
       {/if}
     </span>

package/public/components/button/ButtonSlot.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{S as t,i as o,a as e,b as i,f as n,s as r,c as m,e as c,d as l,n as d,h as s,v as a,j as b,K as u,y as h,w as f,x as g,m as p,o as x,p as w,q as _,u as $,g as y,z as v,B as k,C as z,D as j,P as q}from"../../index-9ffad6d0.js";import{c as C}from"../../EventForward-24fc0272.js";import E from"../loader/Loader.nested.js";function L(t){let o,e,n,r;const m=[M,N],l=[];function d(t,o){return t[11]&&"left"===t[10]?0:1}return e=d(t),n=l[e]=m[e](t),{c(){o=c("span"),n.c(),y(o,"class","mc-button__icon")},m(t,n){i(t,o,n),l[e].m(o,null),r=!0},p(t,i){let r=e;e=d(t),e===r?l[e].p(t,i):(v(),f(l[r],1,1,(()=>{l[r]=null})),g(),n=l[e],n?n.p(t,i):(n=l[e]=m[e](t),n.c()),h(n,1),n.m(o,null))},i(t){r||(h(n),r=!0)},o(t){f(n),r=!1},d(t){t&&x(o),l[e].d()}}}function N(t){let o;return{c(){o=c("slot"),y(o,"name","icon")},m(t,e){i(t,o,e)},p:d,i:d,o:d,d(t){t&&x(o)}}}function M(t){let o,e;return o=new E({props:{size:"s",theme:t[9],text:""}}),{c(){k(o.$$.fragment)},m(t,i){z(o,t,i),e=!0},p(t,e){const i={};512&e&&(i.theme=t[9]),o.$set(i)},i(t){e||(h(o.$$.fragment,t),e=!0)},o(t){f(o.$$.fragment,t),e=!1},d(t){j(o,t)}}}function O(t){let o,e,n,r,m,d=t[11]&&"left"===t[10]&&!t[4]&&S(t),s=t[11]&&"right"===t[10]&&!t[4]&&A(t);return{c(){d&&d.c(),o=l(),e=c("span"),e.innerHTML="<slot></slot>",n=l(),s&&s.c(),r=q(),y(e,"class","mc-button__label")},m(t,c){d&&d.m(t,c),i(t,o,c),i(t,e,c),i(t,n,c),s&&s.m(t,c),i(t,r,c),m=!0},p(t,e){t[11]&&"left"===t[10]&&!t[4]?d?(d.p(t,e),3088&e&&h(d,1)):(d=S(t),d.c(),h(d,1),d.m(o.parentNode,o)):d&&(v(),f(d,1,1,(()=>{d=null})),g()),t[11]&&"right"===t[10]&&!t[4]?s?(s.p(t,e),3088&e&&h(s,1)):(s=A(t),s.c(),h(s,1),s.m(r.parentNode,r)):s&&(v(),f(s,1,1,(()=>{s=null})),g())},i(t){m||(h(d),h(s),m=!0)},o(t){f(d),f(s),m=!1},d(t){d&&d.d(t),t&&x(o),t&&x(e),t&&x(n),s&&s.d(t),t&&x(r)}}}function R(t){let o,e,n,r;const m=[D,B],l=[];function d(t,o){return t[11]?0:1}return e=d(t),n=l[e]=m[e](t),{c(){o=c("span"),n.c(),y(o,"class","mc-button__icon")},m(t,n){i(t,o,n),l[e].m(o,null),r=!0},p(t,i){let r=e;e=d(t),e===r?l[e].p(t,i):(v(),f(l[r],1,1,(()=>{l[r]=null})),g(),n=l[e],n?n.p(t,i):(n=l[e]=m[e](t),n.c()),h(n,1),n.m(o,null))},i(t){r||(h(n),r=!0)},o(t){f(n),r=!1},d(t){t&&x(o),l[e].d()}}}function S(t){let o,e,n;return e=new E({props:{size:"s",theme:t[9],text:""}}),{c(){o=c("span"),k(e.$$.fragment),y(o,"class","mc-button__icon")},m(t,r){i(t,o,r),z(e,o,null),n=!0},p(t,o){const i={};512&o&&(i.theme=t[9]),e.$set(i)},i(t){n||(h(e.$$.fragment,t),n=!0)},o(t){f(e.$$.fragment,t),n=!1},d(t){t&&x(o),j(e)}}}function A(t){let o,e,n;return e=new E({props:{size:"s",theme:t[9],text:""}}),{c(){o=c("span"),k(e.$$.fragment),y(o,"class","mc-button__icon")},m(t,r){i(t,o,r),z(e,o,null),n=!0},p(t,o){const i={};512&o&&(i.theme=t[9]),e.$set(i)},i(t){n||(h(e.$$.fragment,t),n=!0)},o(t){f(e.$$.fragment,t),n=!1},d(t){t&&x(o),j(e)}}}function B(t){let o;return{c(){o=c("slot"),y(o,"name","icon")},m(t,e){i(t,o,e)},p:d,i:d,o:d,d(t){t&&x(o)}}}function D(t){let o,e;return o=new E({props:{size:"m",theme:t[9],text:""}}),{c(){k(o.$$.fragment)},m(t,i){z(o,t,i),e=!0},p(t,e){const i={};512&e&&(i.theme=t[9]),o.$set(i)},i(t){e||(h(o.$$.fragment,t),e=!0)},o(t){f(o.$$.fragment,t),e=!1},d(t){j(o,t)}}}function F(t){let o,e,n,r;const m=[J,H],l=[];function d(t,o){return t[11]&&"right"===t[10]?0:1}return e=d(t),n=l[e]=m[e](t),{c(){o=c("span"),n.c(),y(o,"class","mc-button__icon")},m(t,n){i(t,o,n),l[e].m(o,null),r=!0},p(t,i){let r=e;e=d(t),e===r?l[e].p(t,i):(v(),f(l[r],1,1,(()=>{l[r]=null})),g(),n=l[e],n?n.p(t,i):(n=l[e]=m[e](t),n.c()),h(n,1),n.m(o,null))},i(t){r||(h(n),r=!0)},o(t){f(n),r=!1},d(t){t&&x(o),l[e].d()}}}function H(t){let o;return{c(){o=c("slot"),y(o,"name","icon")},m(t,e){i(t,o,e)},p:d,i:d,o:d,d(t){t&&x(o)}}}function J(t){let o,e;return o=new E({props:{size:"s",theme:t[9],text:""}}),{c(){k(o.$$.fragment)},m(t,i){z(o,t,i),e=!0},p(t,e){const i={};512&e&&(i.theme=t[9]),o.$set(i)},i(t){e||(h(o.$$.fragment,t),e=!0)},o(t){f(o.$$.fragment,t),e=!1},d(t){j(o,t)}}}function K(t){let o,e,n,r,w,_,$,y,k,z="left"===t[4]&&L(t);const j=[R,O],q=[];function C(t,o){return"only"===t[4]?0:1}n=C(t),r=q[n]=j[n](t);let E="right"===t[4]&&F(t),N=[{type:t[6]},{class:_=t[13](t[1],t[0],t[2],t[3])+" "+t[8]},{disabled:t[5]},t[7]],M={};for(let t=0;t<N.length;t+=1)M=m(M,N[t]);return{c(){o=c("button"),z&&z.c(),e=l(),r.c(),w=l(),E&&E.c(),this.c=d,s(o,M),a(o,"mc-button--square","only"===t[4])},m(r,m){i(r,o,m),z&&z.m(o,null),b(o,e),q[n].m(o,null),b(o,w),E&&E.m(o,null),o.autofocus&&o.focus(),$=!0,y||(k=u(t[12].call(null,o)),y=!0)},p(t,[i]){"left"===t[4]?z?(z.p(t,i),16&i&&h(z,1)):(z=L(t),z.c(),h(z,1),z.m(o,e)):z&&(v(),f(z,1,1,(()=>{z=null})),g());let m=n;n=C(t),n===m?q[n].p(t,i):(v(),f(q[m],1,1,(()=>{q[m]=null})),g(),r=q[n],r?r.p(t,i):(r=q[n]=j[n](t),r.c()),h(r,1),r.m(o,w)),"right"===t[4]?E?(E.p(t,i),16&i&&h(E,1)):(E=F(t),E.c(),h(E,1),E.m(o,null)):E&&(v(),f(E,1,1,(()=>{E=null})),g()),s(o,M=p(N,[(!$||64&i)&&{type:t[6]},(!$||271&i&&_!==(_=t[13](t[1],t[0],t[2],t[3])+" "+t[8]))&&{class:_},(!$||32&i)&&{disabled:t[5]},128&i&&t[7]])),a(o,"mc-button--square","only"===t[4])},i(t){$||(h(z),h(r),h(E),$=!0)},o(t){f(z),f(r),f(E),$=!1},d(t){t&&x(o),z&&z.d(),q[n].d(),E&&E.d(),y=!1,k()}}}function P(t,o,e){let i,n,r,c,l,d;const s=["bordered","theme","size","full","iconmode","disabled","responsivesize","responsivewidth","type","loader"];let a=w(o,s);var b,u,h;let{bordered:f=!1}=o,{theme:g}=o,{size:p="m"}=o,{full:x=!1}=o,{iconmode:y}=o,{disabled:v=!1}=o,{responsivesize:k}=o,{responsivewidth:z}=o,{type:j="button"}=o,{loader:q}=o;const E=C(_());return t.$$set=t=>{e(22,o=m(m({},o),$(t))),e(21,a=w(o,s)),"bordered"in t&&e(0,f=t.bordered),"theme"in t&&e(1,g=t.theme),"size"in t&&e(2,p=t.size),"full"in t&&e(3,x=t.full),"iconmode"in t&&e(4,y=t.iconmode),"disabled"in t&&e(5,v=t.disabled),"responsivesize"in t&&e(14,k=t.responsivesize),"responsivewidth"in t&&e(15,z=t.responsivewidth),"type"in t&&e(6,j=t.type),"loader"in t&&e(16,q=t.loader)},t.$$.update=()=>{65536&t.$$.dirty&&e(20,i=q?JSON.parse(q):void 0),1179648&t.$$.dirty&&e(11,n=null!==e(17,b=null==i?void 0:i.enabled)&&void 0!==b&&b),1310720&t.$$.dirty&&e(10,r=null!==e(18,u=null==i?void 0:i.position)&&void 0!==u?u:"left"),1572864&t.$$.dirty&&e(9,c=null!==e(19,h=null==i?void 0:i.theme)&&void 0!==h?h:"primary"),e(8,l=o.class),e(7,d=Object.assign({},a)),128&t.$$.dirty&&delete d.class},o=$(o),[f,g,p,x,y,v,j,d,l,c,r,n,E,function(t,o,e,i){const n=["mc-button"],r=function(t,o){if(!o&&!t)return"";const e=o?"bordered":"solid";return t?`mc-button--${e}-${t}`:`mc-button--${e}`}(t,o);return r&&n.push(r),e&&n.push(`mc-button--${e}`),i?n.push("mc-button--full"):n.push("mc-button--fit"),"only"===y&&n.push("mc-button--square"),k&&n.push(`mc-button--${k}`),z&&n.push(`mc-button--${z}`),n.join(" ")},k,z,q,b,u,h,i]}class T extends t{constructor(t){super();const m=document.createElement("style");m.textContent='.mc-button{margin:0;-webkit-box-shadow:none;box-shadow:none;text-decoration:none;outline:none;border:none;cursor:pointer;padding:0;color:#ffffff;background-color:#188803;font-family:"LeroyMerlin", sans-serif;font-weight:600;font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem;cursor:pointer;border-radius:4px;text-align:center;border:2px solid transparent;-webkit-transition:all ease 200ms;-o-transition:all ease 200ms;transition:all ease 200ms;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;vertical-align:middle;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;-webkit-box-sizing:border-box;box-sizing:border-box;fill:currentColor}.mc-button.is-hover,.mc-button:hover{background-color:#006902;color:#ffffff}.mc-button.is-active,.mc-button:active{background-color:#006902}.mc-button:disabled,.mc-button.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button .mc-button__icon:first-child,.mc-button .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button.is-focus,.mc-button:focus{-webkit-box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #0b96cc;box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #0b96cc}.mc-button--s{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s .mc-button__icon:first-child,.mc-button--s .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m .mc-button__icon:first-child,.mc-button--m .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l .mc-button__icon{width:2rem;height:2rem}.mc-button--l .mc-button__icon:first-child,.mc-button--l .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full{width:-webkit-fill-available;width:-moz-available;width:stretch}}.mc-button--square{-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:0;padding:0}.mc-button__icon{-ms-flex-negative:0;flex-shrink:0}.mc-button__icon:last-child{margin-left:0.5rem;margin-right:-0.25rem}.mc-button__icon:first-child{margin-right:0.5rem;margin-left:-0.25rem}.mc-button__icon:only-child{margin:0}.mc-button__label{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;pointer-events:none}.mc-button--solid-primary-02{background-color:#6a7081}.mc-button--solid-primary-02.is-hover,.mc-button--solid-primary-02:hover{background-color:#242938}.mc-button--solid-primary-02.is-active,.mc-button--solid-primary-02:active{background-color:#171b26}.mc-button--solid-primary-02:disabled,.mc-button--solid-primary-02.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--solid-neutral{background-color:#333333}.mc-button--solid-neutral.is-hover,.mc-button--solid-neutral:hover{background-color:#191919}.mc-button--solid-neutral.is-active,.mc-button--solid-neutral:active{background-color:#333333}.mc-button--solid-neutral:disabled,.mc-button--solid-neutral.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--solid-danger{background-color:#c61112}.mc-button--solid-danger.is-hover,.mc-button--solid-danger:hover{background-color:#8c0003}.mc-button--solid-danger.is-active,.mc-button--solid-danger:active{background-color:#8c0003}.mc-button--solid-danger:disabled,.mc-button--solid-danger.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--bordered{color:#188803;border-color:#188803;background-color:#ffffff}.mc-button--bordered.is-hover,.mc-button--bordered:hover{background-color:#ebf5de;color:#006902}.mc-button--bordered.is-active,.mc-button--bordered:active{background-color:#c5e39e;color:#035010}.mc-button--bordered.is-active,.mc-button--bordered:active{background-color:#c5e39e;color:#035010}.mc-button--bordered:disabled,.mc-button--bordered.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--bordered-primary-02{color:#6a7081;border-color:#6a7081;background-color:#ffffff}.mc-button--bordered-primary-02.is-hover,.mc-button--bordered-primary-02:hover{background-color:#eeeff1;color:#6a7081}.mc-button--bordered-primary-02.is-active,.mc-button--bordered-primary-02:active{background-color:#cfd2d8}.mc-button--bordered-primary-02:disabled,.mc-button--bordered-primary-02.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--bordered-neutral{color:#333333;border-color:#333333;background-color:#ffffff}.mc-button--bordered-neutral.is-hover,.mc-button--bordered-neutral:hover{background-color:#e6e6e6;color:#333333}.mc-button--bordered-neutral.is-active,.mc-button--bordered-neutral:active{background-color:#cccccc}.mc-button--bordered-neutral:disabled,.mc-button--bordered-neutral.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--bordered-danger{color:#c61112;border-color:#c61112;background-color:#ffffff}.mc-button--bordered-danger.is-hover,.mc-button--bordered-danger:hover{background-color:#fdeaea;color:#8c0003}.mc-button--bordered-danger.is-active,.mc-button--bordered-danger:active{background-color:#f8bcbb;color:#530000}.mc-button--bordered-danger.is-active,.mc-button--bordered-danger:active{background-color:#f8bcbb;color:#530000}.mc-button--bordered-danger:disabled,.mc-button--bordered-danger.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}@media screen and (min-width: 680px){.mc-button--s\\@from-m{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-m .mc-button__icon:first-child,.mc-button--s\\@from-m .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m\\@from-m{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-m .mc-button__icon:first-child,.mc-button--m\\@from-m .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l\\@from-m{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-m .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-m .mc-button__icon:first-child,.mc-button--l\\@from-m .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit\\@from-m{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full\\@from-m{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full\\@from-m{width:-webkit-fill-available;width:-moz-available;width:stretch}}}@media screen and (min-width: 1024px){.mc-button--s\\@from-l{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-l .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-l .mc-button__icon:first-child,.mc-button--s\\@from-l .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m\\@from-l{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-l .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-l .mc-button__icon:first-child,.mc-button--m\\@from-l .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l\\@from-l{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-l .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-l .mc-button__icon:first-child,.mc-button--l\\@from-l .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit\\@from-l{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full\\@from-l{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full\\@from-l{width:-webkit-fill-available;width:-moz-available;width:stretch}}.mc-button--square{padding:0}}@media screen and (min-width: 1280px){.mc-button--s\\@from-xl{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-xl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-xl .mc-button__icon:first-child,.mc-button--s\\@from-xl .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m\\@from-xl{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-xl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-xl .mc-button__icon:first-child,.mc-button--m\\@from-xl .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l\\@from-xl{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-xl .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-xl .mc-button__icon:first-child,.mc-button--l\\@from-xl .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit\\@from-xl{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full\\@from-xl{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full\\@from-xl{width:-webkit-fill-available;width:-moz-available;width:stretch}}}@media screen and (min-width: 1920px){.mc-button--s\\@from-xxl{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-xxl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-xxl .mc-button__icon:first-child,.mc-button--s\\@from-xxl .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m\\@from-xxl{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-xxl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-xxl .mc-button__icon:first-child,.mc-button--m\\@from-xxl .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l\\@from-xxl{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-xxl .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-xxl .mc-button__icon:first-child,.mc-button--l\\@from-xxl .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit\\@from-xxl{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full\\@from-xxl{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full\\@from-xxl{width:-webkit-fill-available;width:-moz-available;width:stretch}}}.mc-button__icon{pointer-events:none}',this.shadowRoot.appendChild(m),o(this,{target:this.shadowRoot,props:e(this.attributes),customElement:!0},P,K,r,{bordered:0,theme:1,size:2,full:3,iconmode:4,disabled:5,responsivesize:14,responsivewidth:15,type:6,loader:16},null),t&&(t.target&&i(t.target,this,t.anchor),t.props&&(this.$set(t.props),n()))}static get observedAttributes(){return["bordered","theme","size","full","iconmode","disabled","responsivesize","responsivewidth","type","loader"]}get bordered(){return this.$$.ctx[0]}set bordered(t){this.$$set({bordered:t}),n()}get theme(){return this.$$.ctx[1]}set theme(t){this.$$set({theme:t}),n()}get size(){return this.$$.ctx[2]}set size(t){this.$$set({size:t}),n()}get full(){return this.$$.ctx[3]}set full(t){this.$$set({full:t}),n()}get iconmode(){return this.$$.ctx[4]}set iconmode(t){this.$$set({iconmode:t}),n()}get disabled(){return this.$$.ctx[5]}set disabled(t){this.$$set({disabled:t}),n()}get responsivesize(){return this.$$.ctx[14]}set responsivesize(t){this.$$set({responsivesize:t}),n()}get responsivewidth(){return this.$$.ctx[15]}set responsivewidth(t){this.$$set({responsivewidth:t}),n()}get type(){return this.$$.ctx[6]}set type(t){this.$$set({type:t}),n()}get loader(){return this.$$.ctx[16]}set loader(t){this.$$set({loader:t}),n()}}export{T as default};
+import{S as t,i as o,a as e,b as i,f as n,s as r,c as m,e as c,d as l,n as d,j as s,k as a,l as b,M as u,A as h,y as f,z as g,p,q as x,r as w,v as _,x as $,h as y,B as v,D as k,E as z,F as j,R as q}from"../../index-d12e76e8.js";import{c as E}from"../../EventForward-e61ea03d.js";import C from"../loader/Loader.nested.js";function L(t){let o,e,n,r;const m=[N,M],l=[];function d(t,o){return t[11]&&"left"===t[10]?0:1}return e=d(t),n=l[e]=m[e](t),{c(){o=c("span"),n.c(),y(o,"class","mc-button__icon")},m(t,n){i(t,o,n),l[e].m(o,null),r=!0},p(t,i){let r=e;e=d(t),e===r?l[e].p(t,i):(v(),f(l[r],1,1,(()=>{l[r]=null})),g(),n=l[e],n?n.p(t,i):(n=l[e]=m[e](t),n.c()),h(n,1),n.m(o,null))},i(t){r||(h(n),r=!0)},o(t){f(n),r=!1},d(t){t&&x(o),l[e].d()}}}function M(t){let o;return{c(){o=c("slot"),y(o,"name","icon")},m(t,e){i(t,o,e)},p:d,i:d,o:d,d(t){t&&x(o)}}}function N(t){let o,e;return o=new C({props:{size:"s",theme:t[9],text:""}}),{c(){k(o.$$.fragment)},m(t,i){z(o,t,i),e=!0},p(t,e){const i={};512&e&&(i.theme=t[9]),o.$set(i)},i(t){e||(h(o.$$.fragment,t),e=!0)},o(t){f(o.$$.fragment,t),e=!1},d(t){j(o,t)}}}function R(t){let o,e,n,r,m,d=t[11]&&"left"===t[10]&&!t[4]&&F(t),s=t[11]&&"right"===t[10]&&!t[4]&&O(t);return{c(){d&&d.c(),o=l(),e=c("span"),e.innerHTML="<slot></slot>",n=l(),s&&s.c(),r=q(),y(e,"class","mc-button__label")},m(t,c){d&&d.m(t,c),i(t,o,c),i(t,e,c),i(t,n,c),s&&s.m(t,c),i(t,r,c),m=!0},p(t,e){t[11]&&"left"===t[10]&&!t[4]?d?(d.p(t,e),3088&e&&h(d,1)):(d=F(t),d.c(),h(d,1),d.m(o.parentNode,o)):d&&(v(),f(d,1,1,(()=>{d=null})),g()),t[11]&&"right"===t[10]&&!t[4]?s?(s.p(t,e),3088&e&&h(s,1)):(s=O(t),s.c(),h(s,1),s.m(r.parentNode,r)):s&&(v(),f(s,1,1,(()=>{s=null})),g())},i(t){m||(h(d),h(s),m=!0)},o(t){f(d),f(s),m=!1},d(t){d&&d.d(t),t&&x(o),t&&x(e),t&&x(n),s&&s.d(t),t&&x(r)}}}function A(t){let o,e,n,r;const m=[B,S],l=[];function d(t,o){return t[11]?0:1}return e=d(t),n=l[e]=m[e](t),{c(){o=c("span"),n.c(),y(o,"class","mc-button__icon")},m(t,n){i(t,o,n),l[e].m(o,null),r=!0},p(t,i){let r=e;e=d(t),e===r?l[e].p(t,i):(v(),f(l[r],1,1,(()=>{l[r]=null})),g(),n=l[e],n?n.p(t,i):(n=l[e]=m[e](t),n.c()),h(n,1),n.m(o,null))},i(t){r||(h(n),r=!0)},o(t){f(n),r=!1},d(t){t&&x(o),l[e].d()}}}function F(t){let o,e,n;return e=new C({props:{size:"s",theme:t[9],text:""}}),{c(){o=c("span"),k(e.$$.fragment),y(o,"class","mc-button__icon")},m(t,r){i(t,o,r),z(e,o,null),n=!0},p(t,o){const i={};512&o&&(i.theme=t[9]),e.$set(i)},i(t){n||(h(e.$$.fragment,t),n=!0)},o(t){f(e.$$.fragment,t),n=!1},d(t){t&&x(o),j(e)}}}function O(t){let o,e,n;return e=new C({props:{size:"s",theme:t[9],text:""}}),{c(){o=c("span"),k(e.$$.fragment),y(o,"class","mc-button__icon")},m(t,r){i(t,o,r),z(e,o,null),n=!0},p(t,o){const i={};512&o&&(i.theme=t[9]),e.$set(i)},i(t){n||(h(e.$$.fragment,t),n=!0)},o(t){f(e.$$.fragment,t),n=!1},d(t){t&&x(o),j(e)}}}function S(t){let o;return{c(){o=c("slot"),y(o,"name","icon")},m(t,e){i(t,o,e)},p:d,i:d,o:d,d(t){t&&x(o)}}}function B(t){let o,e;return o=new C({props:{size:"m",theme:t[9],text:""}}),{c(){k(o.$$.fragment)},m(t,i){z(o,t,i),e=!0},p(t,e){const i={};512&e&&(i.theme=t[9]),o.$set(i)},i(t){e||(h(o.$$.fragment,t),e=!0)},o(t){f(o.$$.fragment,t),e=!1},d(t){j(o,t)}}}function D(t){let o,e,n,r;const m=[J,H],l=[];function d(t,o){return t[11]&&"right"===t[10]?0:1}return e=d(t),n=l[e]=m[e](t),{c(){o=c("span"),n.c(),y(o,"class","mc-button__icon")},m(t,n){i(t,o,n),l[e].m(o,null),r=!0},p(t,i){let r=e;e=d(t),e===r?l[e].p(t,i):(v(),f(l[r],1,1,(()=>{l[r]=null})),g(),n=l[e],n?n.p(t,i):(n=l[e]=m[e](t),n.c()),h(n,1),n.m(o,null))},i(t){r||(h(n),r=!0)},o(t){f(n),r=!1},d(t){t&&x(o),l[e].d()}}}function H(t){let o;return{c(){o=c("slot"),y(o,"name","icon")},m(t,e){i(t,o,e)},p:d,i:d,o:d,d(t){t&&x(o)}}}function J(t){let o,e;return o=new C({props:{size:"s",theme:t[9],text:""}}),{c(){k(o.$$.fragment)},m(t,i){z(o,t,i),e=!0},p(t,e){const i={};512&e&&(i.theme=t[9]),o.$set(i)},i(t){e||(h(o.$$.fragment,t),e=!0)},o(t){f(o.$$.fragment,t),e=!1},d(t){j(o,t)}}}function T(t){let o,e,n,r,w,_,$,y,k,z="left"===t[4]&&L(t);const j=[A,R],q=[];function E(t,o){return"only"===t[4]?0:1}n=E(t),r=q[n]=j[n](t);let C="right"===t[4]&&D(t),M=[{type:t[6]},{class:_=t[13](t[1],t[0],t[2],t[3])+" "+t[8]},{disabled:t[5]},t[7]],N={};for(let t=0;t<M.length;t+=1)N=m(N,M[t]);return{c(){o=c("button"),z&&z.c(),e=l(),r.c(),w=l(),C&&C.c(),this.c=d,s(o,N),a(o,"mc-button--square","only"===t[4])},m(r,m){i(r,o,m),z&&z.m(o,null),b(o,e),q[n].m(o,null),b(o,w),C&&C.m(o,null),o.autofocus&&o.focus(),$=!0,y||(k=u(t[12].call(null,o)),y=!0)},p(t,[i]){"left"===t[4]?z?(z.p(t,i),16&i&&h(z,1)):(z=L(t),z.c(),h(z,1),z.m(o,e)):z&&(v(),f(z,1,1,(()=>{z=null})),g());let m=n;n=E(t),n===m?q[n].p(t,i):(v(),f(q[m],1,1,(()=>{q[m]=null})),g(),r=q[n],r?r.p(t,i):(r=q[n]=j[n](t),r.c()),h(r,1),r.m(o,w)),"right"===t[4]?C?(C.p(t,i),16&i&&h(C,1)):(C=D(t),C.c(),h(C,1),C.m(o,null)):C&&(v(),f(C,1,1,(()=>{C=null})),g()),s(o,N=p(M,[(!$||64&i)&&{type:t[6]},(!$||271&i&&_!==(_=t[13](t[1],t[0],t[2],t[3])+" "+t[8]))&&{class:_},(!$||32&i)&&{disabled:t[5]},128&i&&t[7]])),a(o,"mc-button--square","only"===t[4])},i(t){$||(h(z),h(r),h(C),$=!0)},o(t){f(z),f(r),f(C),$=!1},d(t){t&&x(o),z&&z.d(),q[n].d(),C&&C.d(),y=!1,k()}}}function G(t,o,e){let i,n,r,c,l,d;const s=["bordered","theme","size","full","iconmode","disabled","responsivesize","responsivewidth","type","loader"];let a=w(o,s);var b,u,h;let{bordered:f=!1}=o,{theme:g}=o,{size:p="m"}=o,{full:x=!1}=o,{iconmode:y}=o,{disabled:v=!1}=o,{responsivesize:k}=o,{responsivewidth:z}=o,{type:j="button"}=o,{loader:q}=o;const C=E(_());return t.$$set=t=>{e(22,o=m(m({},o),$(t))),e(21,a=w(o,s)),"bordered"in t&&e(0,f=t.bordered),"theme"in t&&e(1,g=t.theme),"size"in t&&e(2,p=t.size),"full"in t&&e(3,x=t.full),"iconmode"in t&&e(4,y=t.iconmode),"disabled"in t&&e(5,v=t.disabled),"responsivesize"in t&&e(14,k=t.responsivesize),"responsivewidth"in t&&e(15,z=t.responsivewidth),"type"in t&&e(6,j=t.type),"loader"in t&&e(16,q=t.loader)},t.$$.update=()=>{65536&t.$$.dirty&&e(20,i=q?JSON.parse(q):void 0),1179648&t.$$.dirty&&e(11,n=null!==e(17,b=null==i?void 0:i.enabled)&&void 0!==b&&b),1310720&t.$$.dirty&&e(10,r=null!==e(18,u=null==i?void 0:i.position)&&void 0!==u?u:"left"),1572864&t.$$.dirty&&e(9,c=null!==e(19,h=null==i?void 0:i.theme)&&void 0!==h?h:"primary"),e(8,l=o.class),e(7,d=Object.assign({},a)),128&t.$$.dirty&&delete d.class},o=$(o),[f,g,p,x,y,v,j,d,l,c,r,n,C,function(t,o,e,i){const n=["mc-button"],r=function(t,o){if(!o&&!t)return"";const e=o?"bordered":"solid";return t?`mc-button--${e}-${t}`:`mc-button--${e}`}(t,o);return r&&n.push(r),e&&n.push(`mc-button--${e}`),i?n.push("mc-button--full"):n.push("mc-button--fit"),"only"===y&&n.push("mc-button--square"),k&&n.push(`mc-button--${k}`),z&&n.push(`mc-button--${z}`),n.join(" ")},k,z,q,b,u,h,i]}class I extends t{constructor(t){super();const m=document.createElement("style");m.textContent='.mc-button{margin:0;-webkit-box-shadow:none;box-shadow:none;text-decoration:none;outline:none;border:none;cursor:pointer;padding:0;color:#ffffff;background-color:#188803;font-family:"LeroyMerlin", sans-serif;font-weight:600;font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem;cursor:pointer;border-radius:4px;text-align:center;border:2px solid transparent;-webkit-transition:all ease 200ms;-o-transition:all ease 200ms;transition:all ease 200ms;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;vertical-align:middle;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;-webkit-box-sizing:border-box;box-sizing:border-box;fill:currentColor}.mc-button.is-hover,.mc-button:hover{background-color:#006902;color:#ffffff}.mc-button.is-active,.mc-button:active{background-color:#006902}.mc-button:disabled,.mc-button.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button .mc-button__icon:first-child,.mc-button .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button.is-focus,.mc-button:focus{-webkit-box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #0b96cc;box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #0b96cc}.mc-button--s{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s .mc-button__icon:first-child,.mc-button--s .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m .mc-button__icon:first-child,.mc-button--m .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l .mc-button__icon{width:2rem;height:2rem}.mc-button--l .mc-button__icon:first-child,.mc-button--l .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full{width:-webkit-fill-available;width:-moz-available;width:stretch}}.mc-button--square{-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:0;padding:0}.mc-button__icon{-ms-flex-negative:0;flex-shrink:0}.mc-button__icon:last-child{margin-left:0.5rem;margin-right:-0.25rem}.mc-button__icon:first-child{margin-right:0.5rem;margin-left:-0.25rem}.mc-button__icon:only-child{margin:0}.mc-button__label{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;pointer-events:none}.mc-button--solid-primary-02{background-color:#6a7081}.mc-button--solid-primary-02.is-hover,.mc-button--solid-primary-02:hover{background-color:#242938}.mc-button--solid-primary-02.is-active,.mc-button--solid-primary-02:active{background-color:#171b26}.mc-button--solid-primary-02:disabled,.mc-button--solid-primary-02.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--solid-neutral{background-color:#333333}.mc-button--solid-neutral.is-hover,.mc-button--solid-neutral:hover{background-color:#191919}.mc-button--solid-neutral.is-active,.mc-button--solid-neutral:active{background-color:#333333}.mc-button--solid-neutral:disabled,.mc-button--solid-neutral.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--solid-danger{background-color:#c61112}.mc-button--solid-danger.is-hover,.mc-button--solid-danger:hover{background-color:#8c0003}.mc-button--solid-danger.is-active,.mc-button--solid-danger:active{background-color:#8c0003}.mc-button--solid-danger:disabled,.mc-button--solid-danger.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--bordered{color:#188803;border-color:#188803;background-color:#ffffff}.mc-button--bordered.is-hover,.mc-button--bordered:hover{background-color:#ebf5de;color:#006902}.mc-button--bordered.is-active,.mc-button--bordered:active{background-color:#c5e39e;color:#035010}.mc-button--bordered.is-active,.mc-button--bordered:active{background-color:#c5e39e;color:#035010}.mc-button--bordered:disabled,.mc-button--bordered.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--bordered-primary-02{color:#6a7081;border-color:#6a7081;background-color:#ffffff}.mc-button--bordered-primary-02.is-hover,.mc-button--bordered-primary-02:hover{background-color:#eeeff1;color:#6a7081}.mc-button--bordered-primary-02.is-active,.mc-button--bordered-primary-02:active{background-color:#cfd2d8}.mc-button--bordered-primary-02:disabled,.mc-button--bordered-primary-02.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--bordered-neutral{color:#333333;border-color:#333333;background-color:#ffffff}.mc-button--bordered-neutral.is-hover,.mc-button--bordered-neutral:hover{background-color:#e6e6e6;color:#333333}.mc-button--bordered-neutral.is-active,.mc-button--bordered-neutral:active{background-color:#cccccc}.mc-button--bordered-neutral:disabled,.mc-button--bordered-neutral.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--bordered-danger{color:#c61112;border-color:#c61112;background-color:#ffffff}.mc-button--bordered-danger.is-hover,.mc-button--bordered-danger:hover{background-color:#fdeaea;color:#8c0003}.mc-button--bordered-danger.is-active,.mc-button--bordered-danger:active{background-color:#f8bcbb;color:#530000}.mc-button--bordered-danger.is-active,.mc-button--bordered-danger:active{background-color:#f8bcbb;color:#530000}.mc-button--bordered-danger:disabled,.mc-button--bordered-danger.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}@media screen and (min-width: 680px){.mc-button--s\\@from-m{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-m .mc-button__icon:first-child,.mc-button--s\\@from-m .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m\\@from-m{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-m .mc-button__icon:first-child,.mc-button--m\\@from-m .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l\\@from-m{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-m .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-m .mc-button__icon:first-child,.mc-button--l\\@from-m .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit\\@from-m{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full\\@from-m{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full\\@from-m{width:-webkit-fill-available;width:-moz-available;width:stretch}}}@media screen and (min-width: 1024px){.mc-button--s\\@from-l{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-l .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-l .mc-button__icon:first-child,.mc-button--s\\@from-l .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m\\@from-l{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-l .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-l .mc-button__icon:first-child,.mc-button--m\\@from-l .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l\\@from-l{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-l .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-l .mc-button__icon:first-child,.mc-button--l\\@from-l .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit\\@from-l{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full\\@from-l{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full\\@from-l{width:-webkit-fill-available;width:-moz-available;width:stretch}}.mc-button--square{padding:0}}@media screen and (min-width: 1280px){.mc-button--s\\@from-xl{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-xl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-xl .mc-button__icon:first-child,.mc-button--s\\@from-xl .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m\\@from-xl{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-xl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-xl .mc-button__icon:first-child,.mc-button--m\\@from-xl .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l\\@from-xl{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-xl .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-xl .mc-button__icon:first-child,.mc-button--l\\@from-xl .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit\\@from-xl{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full\\@from-xl{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full\\@from-xl{width:-webkit-fill-available;width:-moz-available;width:stretch}}}@media screen and (min-width: 1920px){.mc-button--s\\@from-xxl{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-xxl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-xxl .mc-button__icon:first-child,.mc-button--s\\@from-xxl .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m\\@from-xxl{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-xxl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-xxl .mc-button__icon:first-child,.mc-button--m\\@from-xxl .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l\\@from-xxl{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-xxl .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-xxl .mc-button__icon:first-child,.mc-button--l\\@from-xxl .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit\\@from-xxl{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full\\@from-xxl{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full\\@from-xxl{width:-webkit-fill-available;width:-moz-available;width:stretch}}}.mc-button__icon{pointer-events:none}',this.shadowRoot.appendChild(m),o(this,{target:this.shadowRoot,props:e(this.attributes),customElement:!0},G,T,r,{bordered:0,theme:1,size:2,full:3,iconmode:4,disabled:5,responsivesize:14,responsivewidth:15,type:6,loader:16},null),t&&(t.target&&i(t.target,this,t.anchor),t.props&&(this.$set(t.props),n()))}static get observedAttributes(){return["bordered","theme","size","full","iconmode","disabled","responsivesize","responsivewidth","type","loader"]}get bordered(){return this.$$.ctx[0]}set bordered(t){this.$$set({bordered:t}),n()}get theme(){return this.$$.ctx[1]}set theme(t){this.$$set({theme:t}),n()}get size(){return this.$$.ctx[2]}set size(t){this.$$set({size:t}),n()}get full(){return this.$$.ctx[3]}set full(t){this.$$set({full:t}),n()}get iconmode(){return this.$$.ctx[4]}set iconmode(t){this.$$set({iconmode:t}),n()}get disabled(){return this.$$.ctx[5]}set disabled(t){this.$$set({disabled:t}),n()}get responsivesize(){return this.$$.ctx[14]}set responsivesize(t){this.$$set({responsivesize:t}),n()}get responsivewidth(){return this.$$.ctx[15]}set responsivewidth(t){this.$$set({responsivewidth:t}),n()}get type(){return this.$$.ctx[6]}set type(t){this.$$set({type:t}),n()}get loader(){return this.$$.ctx[16]}set loader(t){this.$$set({loader:t}),n()}}export{I as default};
 //# sourceMappingURL=ButtonSlot.js.map

package/public/components/button/ButtonSlot.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ButtonSlot.js","sources":["../../../src/components/button/ButtonSlot.svelte"],"sourcesContent":["<svelte:options tag={null} />\n\n<script lang=\"ts\">\n import { get_current_component } from 'svelte/internal';\n import { createEventForwarder } from '../../utilities/EventForward';\n import Loader from '../loader/Loader.nested.svelte';\n import type {\n ButtonIconMode,\n ButtonSize,\n ButtonTheme,\n ButtonResponsiveSize,\n ButtonResponsiveWidth,\n ButtonType,\n ButtonLoader,\n } from './button.types';\n\n export let bordered = false;\n export let theme: ButtonTheme \| undefined = undefined;\n export let size: ButtonSize = 'm';\n export let full = false;\n export let iconmode: ButtonIconMode \| undefined;\n export let disabled = false;\n export let responsivesize: ButtonResponsiveSize = undefined;\n export let responsivewidth: ButtonResponsiveWidth = undefined;\n export let type: ButtonType = 'button';\n export let loader: string;\n\n const forwardEvents = createEventForwarder(get_current_component());\n\n $: loaderOpts = loader ? (JSON.parse(loader) as ButtonLoader) : undefined;\n $: isLoading = loaderOpts?.enabled ?? false;\n $: loaderPosition = loaderOpts?.position ?? 'left';\n $: loaderTheme = loaderOpts?.theme ?? 'primary';\n $: userClass = $$props.class;\n $: attributes = { ...$$restProps };\n $: delete attributes.class;\n\n function getAppearanceClass(theme: ButtonTheme, isBordered: boolean): string {\n if (!isBordered && !theme) {\n return '';\n }\n\n const type = isBordered ? 'bordered' : 'solid';\n\n if (theme) {\n return `mc-button--${type}-${theme}`;\n }\n return `mc-button--${type}`;\n }\n\n function getClasses(\n theme: ButtonTheme,\n isBordered: boolean,\n size: ButtonSize,\n isFull: boolean,\n ): string {\n const classes = ['mc-button'];\n\n const appearanceClass = getAppearanceClass(theme, isBordered);\n if (appearanceClass) {\n classes.push(appearanceClass);\n }\n\n if (size) {\n classes.push(`mc-button--${size}`);\n }\n\n if (isFull) {\n classes.push(`mc-button--full`);\n } else {\n classes.push(`mc-button--fit`);\n }\n\n if (iconmode === 'only') {\n classes.push('mc-button--square');\n }\n\n if (responsivesize) {\n classes.push(`mc-button--${responsivesize}`);\n }\n\n if (responsivewidth) {\n classes.push(`mc-button--${responsivewidth}`);\n }\n\n return classes.join(' ');\n }\n</script>\n\n<button\n use:forwardEvents\n {type}\n class=\"{getClasses(theme, bordered, size, full)} {userClass}\"\n class:mc-button--square={iconmode === 'only'}\n {disabled}\n {...attributes}\n>\n {#if iconmode === 'left'}\n <span class=\"mc-button__icon\">\n {#if isLoading && loaderPosition === 'left'}\n <Loader size=\"s\" theme={loaderTheme} text=\"\" />\n {:else}\n <slot name=\"icon\" />\n {/if}\n </span>\n {/if}\n\n {#if iconmode === 'only'}\n <span class=\"mc-button__icon\">\n {#if isLoading}\n <Loader size=\"m\" theme={loaderTheme} text=\"\" />\n {:else}\n <slot name=\"icon\" />\n {/if}\n </span>\n {:else}\n {#if isLoading && loaderPosition === 'left' && !iconmode}\n <span class=\"mc-button__icon\">\n <Loader size=\"s\" theme={loaderTheme} text=\"\" />\n </span>\n {/if}\n <span class=\"mc-button__label\"><slot/></span>\n {#if isLoading && loaderPosition === 'right' && !iconmode}\n <span class=\"mc-button__icon\">\n <Loader size=\"s\" theme={loaderTheme} text=\"\" />\n </span>\n {/if}\n {/if}\n\n {#if iconmode === 'right'}\n <span class=\"mc-button__icon\">\n {#if isLoading && loaderPosition === 'right'}\n <Loader size=\"s\" theme={loaderTheme} text=\"\" />\n {:else}\n <slot name=\"icon\" />\n {/if}\n </span>\n {/if}\n</button>\n\n<style lang=\"scss\">\n @import '@mozaic-ds/styles/settings-tools/_all-settings';\n @import '@mozaic-ds/styles/components/c.button';\n\n .mc-button__icon {\n pointer-events: none;\n }\n</style>\n"],"names":["ctx","insert","target","span","anchor","slot","if_block0","create_if_block_5","if_block1","create_if_block_4","create_if_block_6","if_block2","create_if_block","toggle_class","button","class","button_class_value","_a","_b","_c","bordered","$$props","theme","size","full","iconmode","disabled","responsivesize","responsivewidth","type","loader","forwardEvents","createEventForwarder","get_current_component","$$invalidate","loaderOpts","JSON","parse","undefined","isLoading","enabled","loaderPosition","position","loaderTheme","userClass","attributes","Object","assign","$$restProps","isBordered","isFull","classes","appearanceClass","getAppearanceClass","push","join"],"mappings":"~~0YAmGWA~~,EAAS,KAAuB,SAAnBA,EAAc,IAAW,+FAD7CC,EAMMC,EAAAC,EAAAC,wSAFFH,EAAmBC,EAAAG,EAAAD,2FAFKJ,EAAW,6FAAXA,EAAW,0HAgBlCM,EAAAN,EAAa,KAAmB,SAAnBA,EAAmB,MAAWA,EAAQ,IAAAO,EAAAP,GAMnDQ,EAAAR,EAAa,KAAmB,UAAnBA,EAAmB,MAAYA,EAAQ,IAAAS,EAAAT,uJADzDC,~~EAA4CC~~,EAAAC,EAAAC,~~8CALvCJ~~,EAAa,KAAmB,SAAnBA,EAAmB,MAAWA,EAAQ,8GAMnDA,EAAa,KAAmB,UAAnBA,EAAmB,MAAYA,EAAQ,6RAblDA,EAAS,IAAA,+FADhBC,EAMMC,EAAAC,EAAAC,gSAIsBJ,EAAW,uFADrCC,EAEMC,EAAAC,EAAAC,uDADoBJ,EAAW,kKAMXA,EAAW,uFADrCC,EAEMC,EAAAC,EAAAC,uDADoBJ,EAAW,0KAZnCC,EAAmBC,EAAAG,EAAAD,2FAFKJ,EAAW,6FAAXA,EAAW,kKAqBhCA,EAAS,KAAuB,UAAnBA,EAAc,IAAY,+FAD9CC,EAMMC,EAAAC,EAAAC,wSAFFH,EAAmBC,EAAAG,EAAAD,2FAFKJ,EAAW,6FAAXA,EAAW,kIAnCpCM,EAAa,SAAbN,MAAmBU,EAAAV,sCAUnB,MAAa,SAAbA,KAAmB,0BAsBnB,IAAAW,EAAa,UAAbX,MAAoBY,EAAAZ,2BArCjBA,EAAU,IAACA,EAAO,GAAAA,KAAUA,EAAI,GAAEA,EAAI,IAAA,IAAIA,EAAS,oBAGvDA,EAAU,8HAFWa,EAAAC,EAAA,oBAAa,SAAbd,cAJ3BC,EAiDQC,EAAAY,EAAAV,sIAzCY,SAAbJ,qOAgCa,UAAbA,4JArCGA,EAAU,IAACA,EAAO,GAAAA,KAAUA,EAAI,GAAEA,EAAI,IAAA,IAAIA,EAAS,MAAA,CAAAe,MAAAC,sCAGvDhB,EAAU,MAFWa,EAAAC,EAAA,oBAAa,SAAbd,0RA3FViB,EAAAC,EAAAC,EAcJ,IAAAC,SAAAA,GAAW,GAAKC,GAChBC,MAAAA,GAA0CD,GAC1CE,KAAAA,EAAmB,KAAGF,GACtBG,KAAAA,GAAO,GAAKH,YACZI,GAAoCJ,GACpCK,SAAAA,GAAW,GAAKL,GAChBM,eAAAA,GAAgDN,GAChDO,gBAAAA,GAAkDP,GAClDQ,KAAAA,EAAmB,UAAQR,UAC3BS,GAAcT,QAEnBU,EAAgBC,EAAqBC,kbAE1CC,EAAA,GAAEC,EAAaL,EAAUM,KAAKC,MAAMP,QAA2BQ,uBAC/DJ,EAAA,GAAEK,EAAL,OAAcL,EAAA,GAAdjB,EAAiBkB,eAAAA,EAAYK,mBAA7BvB,GAAAA,uBACGiB,EAAA,GAAEO,EAAL,OAAmBP,EAAA,GAAnBhB,EAAsBiB,eAAAA,EAAYO,oBAAlCxB,EAAAA,EAA8C,4BAC3CgB,EAAA,EAAES,EAAL,OAAgBT,EAAA,GAAhBf,EAAmBgB,eAAAA,EAAYb,iBAA/BH,EAAAA,EAAwC,WACnCe,EAAA,EAAAU,EAAYvB,EAAQN,WACpB8B,EAALC,OAAAC,UAAuBC,2BACXH,EAAW9B,yCAeZ,SACPO,EACA2B,EACA1B,EACA2B,GAEM,MAAAC,GAAW,aAEXC,WArBoB9B,EAAoB2B,GACzC,IAAAA,IAAe3B,QACX,GAGH,MAAAO,EAAOoB,EAAa,WAAa,eAEnC3B,EACmB,cAAAO,KAAQP,kBAEVO,IAWGwB,CAAmB/B,EAAO2B,UAC9CG,GACFD,EAAQG,KAAKF,GAGX7B,GACF4B,EAAQG,KAAI,cAAe/B,KAGzB2B,EACFC,EAAQG,KAAI,mBAEZH,EAAQG,KAAI,kBAGG,SAAb7B,GACF0B,EAAQG,KAAK,qBAGX3B,GACFwB,EAAQG,KAAI,cAAe3B,KAGzBC,GACFuB,EAAQG,KAAI,cAAe1B,KAGtBuB,EAAQI,KAAK"}
1	+ {"version":3,"file":"ButtonSlot.js","sources":["../../../src/components/button/ButtonSlot.svelte"],"sourcesContent":["<svelte:options tag={null} />\n\n<script lang=\"ts\">\n import { get_current_component } from 'svelte/internal';\n import { createEventForwarder } from '../../utilities/EventForward';\n import Loader from '../loader/Loader.nested.svelte';\n import type {\n ButtonIconMode,\n ButtonSize,\n ButtonTheme,\n ButtonResponsiveSize,\n ButtonResponsiveWidth,\n ButtonType,\n ButtonLoader,\n } from './button.types';\n\n export let bordered = false;\n export let theme: ButtonTheme \| undefined = undefined;\n export let size: ButtonSize = 'm';\n export let full = false;\n export let iconmode: ButtonIconMode \| undefined;\n export let disabled = false;\n export let responsivesize: ButtonResponsiveSize = undefined;\n export let responsivewidth: ButtonResponsiveWidth = undefined;\n export let type: ButtonType = 'button';\n export let loader: string;\n\n const forwardEvents = createEventForwarder(get_current_component());\n\n $: loaderOpts = loader ? (JSON.parse(loader) as ButtonLoader) : undefined;\n $: isLoading = loaderOpts?.enabled ?? false;\n $: loaderPosition = loaderOpts?.position ?? 'left';\n $: loaderTheme = loaderOpts?.theme ?? 'primary';\n $: userClass = $$props.class;\n $: attributes = { ...$$restProps };\n $: delete attributes.class;\n\n function getAppearanceClass(theme: ButtonTheme, isBordered: boolean): string {\n if (!isBordered && !theme) {\n return '';\n }\n\n const type = isBordered ? 'bordered' : 'solid';\n\n if (theme) {\n return `mc-button--${type}-${theme}`;\n }\n return `mc-button--${type}`;\n }\n\n function getClasses(\n theme: ButtonTheme,\n isBordered: boolean,\n size: ButtonSize,\n isFull: boolean,\n ): string {\n const classes = ['mc-button'];\n\n const appearanceClass = getAppearanceClass(theme, isBordered);\n if (appearanceClass) {\n classes.push(appearanceClass);\n }\n\n if (size) {\n classes.push(`mc-button--${size}`);\n }\n\n if (isFull) {\n classes.push(`mc-button--full`);\n } else {\n classes.push(`mc-button--fit`);\n }\n\n if (iconmode === 'only') {\n classes.push('mc-button--square');\n }\n\n if (responsivesize) {\n classes.push(`mc-button--${responsivesize}`);\n }\n\n if (responsivewidth) {\n classes.push(`mc-button--${responsivewidth}`);\n }\n\n return classes.join(' ');\n }\n</script>\n\n<button\n use:forwardEvents\n {type}\n class=\"{getClasses(theme, bordered, size, full)} {userClass}\"\n class:mc-button--square={iconmode === 'only'}\n {disabled}\n {...attributes}\n>\n {#if iconmode === 'left'}\n <span class=\"mc-button__icon\">\n {#if isLoading && loaderPosition === 'left'}\n <Loader size=\"s\" theme={loaderTheme} text=\"\" />\n {:else}\n <slot name=\"icon\" />\n {/if}\n </span>\n {/if}\n\n {#if iconmode === 'only'}\n <span class=\"mc-button__icon\">\n {#if isLoading}\n <Loader size=\"m\" theme={loaderTheme} text=\"\" />\n {:else}\n <slot name=\"icon\" />\n {/if}\n </span>\n {:else}\n {#if isLoading && loaderPosition === 'left' && !iconmode}\n <span class=\"mc-button__icon\">\n <Loader size=\"s\" theme={loaderTheme} text=\"\" />\n </span>\n {/if}\n <span class=\"mc-button__label\"><slot /></span>\n {#if isLoading && loaderPosition === 'right' && !iconmode}\n <span class=\"mc-button__icon\">\n <Loader size=\"s\" theme={loaderTheme} text=\"\" />\n </span>\n {/if}\n {/if}\n\n {#if iconmode === 'right'}\n <span class=\"mc-button__icon\">\n {#if isLoading && loaderPosition === 'right'}\n <Loader size=\"s\" theme={loaderTheme} text=\"\" />\n {:else}\n <slot name=\"icon\" />\n {/if}\n </span>\n {/if}\n</button>\n\n<style lang=\"scss\">\n @import '@mozaic-ds/styles/settings-tools/_all-settings';\n @import '@mozaic-ds/styles/components/c.button';\n\n .mc-button__icon {\n pointer-events: none;\n }\n</style>\n"],"names":["ctx","insert","target","span","anchor","slot","if_block0","create_if_block_5","if_block1","create_if_block_4","create_if_block_6","if_block2","create_if_block","toggle_class","button","class","button_class_value","_a","_b","_c","bordered","$$props","theme","size","full","iconmode","disabled","responsivesize","responsivewidth","type","loader","forwardEvents","createEventForwarder","get_current_component","$$invalidate","loaderOpts","JSON","parse","undefined","isLoading","enabled","loaderPosition","position","loaderTheme","userClass","attributes","Object","assign","$$restProps","isBordered","isFull","classes","appearanceClass","getAppearanceClass","push","join"],"mappings":"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"}

package/public/components/buttonslot/ButtonSlot.svelte CHANGED Viewed

@@ -119,7 +119,7 @@
         <Loader size="s" theme={loaderTheme} text="" />
       </span>
     {/if}
-    <span class="mc-button__label"><slot/></span>
+    <span class="mc-button__label"><slot /></span>
     {#if isLoading && loaderPosition === 'right' && !iconmode}
       <span class="mc-button__icon">
         <Loader size="s" theme={loaderTheme} text="" />

package/public/components/card/Card.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{S as t,i,a as o,_ as e,b as r,f as m,s as n,c,e as l,d as a,n as d,$ as s,g as b,h,j as u,m as g,o as f,p,a0 as x,u as _,P as w,Z as k}from"../../index-9ffad6d0.js";function v(t){let i,o,e=`<${t[6]} class="mc-card__subtitle">${t[5]}</${t[6]}>`;return{c(){i=new k(!1),o=w(),i.a=o},m(t,m){i.m(e,t,m),r(t,o,m)},p(t,o){96&o&&e!==(e=`<${t[6]} class="mc-card__subtitle">${t[5]}</${t[6]}>`)&&i.p(e)},d(t){t&&f(o),t&&i.d()}}}function y(t){let i;return{c(){i=l("footer"),i.innerHTML='<slot name="footer"></slot>',b(i,"class","mc-card__footer")},m(t,o){r(t,i,o)},d(t){t&&f(i)}}}function $(t){let i,o,e,m,n,p,x,_,w,$,z,j,C,L=`<${t[3]} class="mc-card__title">${t[0]}</${t[3]}>`,M=t[5]&&v(t),Y=t[10].footer&&y(),q=[{class:C="mc-card"+(t[2]?" mc-card--bordered":"")+" "+t[9]},t[8]],E={};for(let t=0;t<q.length;t+=1)E=c(E,q[t]);return{c(){i=l("div"),o=l("figure"),e=l("img"),p=a(),x=l("article"),_=new k(!1),w=a(),M&&M.c(),$=a(),z=l("div"),z.innerHTML="<slot></slot>",j=a(),Y&&Y.c(),this.c=d,s(e.src,m=t[1])||b(e,"src",m),b(e,"alt",t[4]),b(e,"class","mc-card__img"),b(o,"class",n="mc-card__visual "+(t[7]?`mc-card__visual--${t[7]}`:"")),_.a=w,b(z,"class","mc-card__body"),b(x,"class","mc-card__content"),h(i,E)},m(t,m){r(t,i,m),u(i,o),u(o,e),u(i,p),u(i,x),_.m(L,x),u(x,w),M&&M.m(x,null),u(x,$),u(x,z),u(x,j),Y&&Y.m(x,null)},p(t,[r]){2&r&&!s(e.src,m=t[1])&&b(e,"src",m),16&r&&b(e,"alt",t[4]),128&r&&n!==(n="mc-card__visual "+(t[7]?`mc-card__visual--${t[7]}`:""))&&b(o,"class",n),9&r&&L!==(L=`<${t[3]} class="mc-card__title">${t[0]}</${t[3]}>`)&&_.p(L),t[5]?M?M.p(t,r):(M=v(t),M.c(),M.m(x,$)):M&&(M.d(1),M=null),t[10].footer?Y||(Y=y(),Y.c(),Y.m(x,null)):Y&&(Y.d(1),Y=null),h(i,E=g(q,[516&r&&C!==(C="mc-card"+(t[2]?" mc-card--bordered":"")+" "+t[9])&&{class:C},256&r&&t[8]]))},i:d,o:d,d(t){t&&f(i),M&&M.d(),Y&&Y.d()}}}function z(t,i,o){let e,r;const m=["title","imgsrc","outlined","titletag","imgalt","subtitle","subtitletag","imageratio"];let n=p(i,m),{$$slots:l={},$$scope:a}=i;const d=x(l);let{title:s}=i,{imgsrc:b}=i,{outlined:h=!1}=i,{titletag:u="h1"}=i,{imgalt:g}=i,{subtitle:f}=i,{subtitletag:w="h2"}=i,{imageratio:k="4x3"}=i;return t.$$set=t=>{o(12,i=c(c({},i),_(t))),o(11,n=p(i,m)),"title"in t&&o(0,s=t.title),"imgsrc"in t&&o(1,b=t.imgsrc),"outlined"in t&&o(2,h=t.outlined),"titletag"in t&&o(3,u=t.titletag),"imgalt"in t&&o(4,g=t.imgalt),"subtitle"in t&&o(5,f=t.subtitle),"subtitletag"in t&&o(6,w=t.subtitletag),"imageratio"in t&&o(7,k=t.imageratio)},t.$$.update=()=>{o(9,e=i.class),o(8,r=Object.assign({},n)),256&t.$$.dirty&&delete r.class},i=_(i),[s,b,h,u,g,f,w,k,r,e,d]}class j extends t{constructor(t){super();const c=document.createElement("style");c.textContent='.mc-button{margin:0;-webkit-box-shadow:none;box-shadow:none;text-decoration:none;outline:none;border:none;cursor:pointer;padding:0;color:#ffffff;background-color:#188803;font-family:"LeroyMerlin", sans-serif;font-weight:600;font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem;cursor:pointer;border-radius:4px;text-align:center;border:2px solid transparent;-webkit-transition:all ease 200ms;-o-transition:all ease 200ms;transition:all ease 200ms;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;vertical-align:middle;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;-webkit-box-sizing:border-box;box-sizing:border-box;fill:currentColor}.mc-button.is-hover,.mc-button:hover{background-color:#006902;color:#ffffff}.mc-button.is-active,.mc-button:active{background-color:#006902}.mc-button:disabled,.mc-button.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button .mc-button__icon:first-child,.mc-button .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button.is-focus,.mc-button:focus{-webkit-box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #0b96cc;box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #0b96cc}.mc-button--s{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s .mc-button__icon:first-child,.mc-button--s .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m .mc-button__icon:first-child,.mc-button--m .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l .mc-button__icon{width:2rem;height:2rem}.mc-button--l .mc-button__icon:first-child,.mc-button--l .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full{width:-webkit-fill-available;width:-moz-available;width:stretch}}.mc-button--square{-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:0;padding:0}.mc-button__icon{-ms-flex-negative:0;flex-shrink:0}.mc-button__icon:last-child{margin-left:0.5rem;margin-right:-0.25rem}.mc-button__icon:first-child{margin-right:0.5rem;margin-left:-0.25rem}.mc-button__icon:only-child{margin:0}.mc-button__label{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;pointer-events:none}.mc-button--solid-primary-02{background-color:#6a7081}.mc-button--solid-primary-02.is-hover,.mc-button--solid-primary-02:hover{background-color:#242938}.mc-button--solid-primary-02.is-active,.mc-button--solid-primary-02:active{background-color:#171b26}.mc-button--solid-primary-02:disabled,.mc-button--solid-primary-02.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--solid-neutral{background-color:#333333}.mc-button--solid-neutral.is-hover,.mc-button--solid-neutral:hover{background-color:#191919}.mc-button--solid-neutral.is-active,.mc-button--solid-neutral:active{background-color:#333333}.mc-button--solid-neutral:disabled,.mc-button--solid-neutral.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--solid-danger{background-color:#c61112}.mc-button--solid-danger.is-hover,.mc-button--solid-danger:hover{background-color:#8c0003}.mc-button--solid-danger.is-active,.mc-button--solid-danger:active{background-color:#8c0003}.mc-button--solid-danger:disabled,.mc-button--solid-danger.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--bordered{color:#188803;border-color:#188803;background-color:#ffffff}.mc-button--bordered.is-hover,.mc-button--bordered:hover{background-color:#ebf5de;color:#006902}.mc-button--bordered.is-active,.mc-button--bordered:active{background-color:#c5e39e;color:#035010}.mc-button--bordered.is-active,.mc-button--bordered:active{background-color:#c5e39e;color:#035010}.mc-button--bordered:disabled,.mc-button--bordered.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--bordered-primary-02{color:#6a7081;border-color:#6a7081;background-color:#ffffff}.mc-button--bordered-primary-02.is-hover,.mc-button--bordered-primary-02:hover{background-color:#eeeff1;color:#6a7081}.mc-button--bordered-primary-02.is-active,.mc-button--bordered-primary-02:active{background-color:#cfd2d8}.mc-button--bordered-primary-02:disabled,.mc-button--bordered-primary-02.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--bordered-neutral{color:#333333;border-color:#333333;background-color:#ffffff}.mc-button--bordered-neutral.is-hover,.mc-button--bordered-neutral:hover{background-color:#e6e6e6;color:#333333}.mc-button--bordered-neutral.is-active,.mc-button--bordered-neutral:active{background-color:#cccccc}.mc-button--bordered-neutral:disabled,.mc-button--bordered-neutral.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--bordered-danger{color:#c61112;border-color:#c61112;background-color:#ffffff}.mc-button--bordered-danger.is-hover,.mc-button--bordered-danger:hover{background-color:#fdeaea;color:#8c0003}.mc-button--bordered-danger.is-active,.mc-button--bordered-danger:active{background-color:#f8bcbb;color:#530000}.mc-button--bordered-danger.is-active,.mc-button--bordered-danger:active{background-color:#f8bcbb;color:#530000}.mc-button--bordered-danger:disabled,.mc-button--bordered-danger.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}@media screen and (min-width: 680px){.mc-button--s\\@from-m{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-m .mc-button__icon:first-child,.mc-button--s\\@from-m .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m\\@from-m{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-m .mc-button__icon:first-child,.mc-button--m\\@from-m .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l\\@from-m{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-m .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-m .mc-button__icon:first-child,.mc-button--l\\@from-m .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit\\@from-m{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full\\@from-m{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full\\@from-m{width:-webkit-fill-available;width:-moz-available;width:stretch}}}@media screen and (min-width: 1024px){.mc-button--s\\@from-l{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-l .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-l .mc-button__icon:first-child,.mc-button--s\\@from-l .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m\\@from-l{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-l .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-l .mc-button__icon:first-child,.mc-button--m\\@from-l .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l\\@from-l{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-l .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-l .mc-button__icon:first-child,.mc-button--l\\@from-l .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit\\@from-l{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full\\@from-l{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full\\@from-l{width:-webkit-fill-available;width:-moz-available;width:stretch}}.mc-button--square{padding:0}}@media screen and (min-width: 1280px){.mc-button--s\\@from-xl{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-xl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-xl .mc-button__icon:first-child,.mc-button--s\\@from-xl .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m\\@from-xl{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-xl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-xl .mc-button__icon:first-child,.mc-button--m\\@from-xl .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l\\@from-xl{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-xl .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-xl .mc-button__icon:first-child,.mc-button--l\\@from-xl .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit\\@from-xl{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full\\@from-xl{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full\\@from-xl{width:-webkit-fill-available;width:-moz-available;width:stretch}}}@media screen and (min-width: 1920px){.mc-button--s\\@from-xxl{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-xxl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-xxl .mc-button__icon:first-child,.mc-button--s\\@from-xxl .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m\\@from-xxl{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-xxl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-xxl .mc-button__icon:first-child,.mc-button--m\\@from-xxl .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l\\@from-xxl{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-xxl .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-xxl .mc-button__icon:first-child,.mc-button--l\\@from-xxl .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit\\@from-xxl{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full\\@from-xxl{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full\\@from-xxl{width:-webkit-fill-available;width:-moz-available;width:stretch}}}.mc-link{-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-sizing:border-box;box-sizing:border-box;cursor:pointer;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;font-size:inherit;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;line-height:inherit;text-decoration:underline;-webkit-transition:color ease 200ms;-o-transition:color ease 200ms;transition:color ease 200ms;gap:0.25rem;color:#000000;position:relative;font-size:1rem;line-height:1.375}.mc-link:focus{outline:none}.mc-link:focus::after{-webkit-box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #0b96cc;box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #0b96cc}.mc-link.is-visited,.mc-link:visited{color:#333333}.mc-link.is-hover,.mc-link:hover{color:#666666}.mc-link.is-active,.mc-link:active{color:#333333}.mc-link.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-link--s{font-size:0.875rem;line-height:1.2857142857}.mc-link--m{font-size:1rem;line-height:1.375}.mc-link::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease}.mc-link__icon{display:block;height:1rem;fill:currentColor;-ms-flex-negative:0;flex-shrink:0;width:1rem}.mc-link--light{color:#ffffff}.mc-link--light.is-visited,.mc-link--light:visited{color:#cccccc}.mc-link--light.is-hover,.mc-link--light:hover{color:#999999}.mc-link--light.is-active,.mc-link--light:active{color:#cccccc}.mc-link--light.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-link--primary{color:#188803}.mc-link--primary.is-visited,.mc-link--primary:visited{color:#006902}.mc-link--primary.is-hover,.mc-link--primary:hover{color:#035010}.mc-link--primary.is-active,.mc-link--primary:active{color:#006902}.mc-link--primary.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-link--primary-02{color:#494f60}.mc-link--primary-02.is-visited,.mc-link--primary-02:visited{color:#343b4c}.mc-link--primary-02.is-hover,.mc-link--primary-02:hover{color:#171b26}.mc-link--primary-02.is-active,.mc-link--primary-02:active{color:#343b4c}.mc-link--primary-02.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-link--danger{color:#c61112}.mc-link--danger.is-visited,.mc-link--danger:visited{color:#8c0003}.mc-link--danger.is-hover,.mc-link--danger:hover{color:#530000}.mc-link--danger.is-active,.mc-link--danger:active{color:#8c0003}.mc-link--danger.is-disabled{color:#e6e6e6;cursor:not-allowed}@media screen and (min-width: 680px){.mc-link--s\\@from-m{font-size:0.875rem;line-height:1.2857142857}.mc-link--m\\@from-m{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1024px){.mc-link--s\\@from-l{font-size:0.875rem;line-height:1.2857142857}.mc-link--m\\@from-l{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1280px){.mc-link--s\\@from-xl{font-size:0.875rem;line-height:1.2857142857}.mc-link--m\\@from-xl{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1920px){.mc-link--s\\@from-xxl{font-size:0.875rem;line-height:1.2857142857}.mc-link--m\\@from-xxl{font-size:1rem;line-height:1.375}}.mc-card{font-family:"LeroyMerlin", sans-serif;max-width:17.75rem}.mc-card,.mc-card *{-webkit-box-sizing:border-box;box-sizing:border-box}@media screen and (min-width: 680px){.mc-card{max-width:18.25rem}}@media screen and (min-width: 1024px){.mc-card{max-width:18rem}}@media screen and (min-width: 1280px){.mc-card{max-width:17.5rem}}@media screen and (min-width: 1920px){.mc-card{max-width:27.25rem}}.mc-card__visual{margin:0;overflow:hidden;position:relative}.mc-card__visual::before{content:"";display:block;width:100%;padding-top:75%}.mc-card__visual--1x1::before{padding-top:100%}.mc-card__visual--16x9::before{padding-top:56.25%}.mc-card__img{height:auto;left:0;position:absolute;top:50%;width:100%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%)}.mc-card__content{padding-top:1rem}.mc-card__title,.mc-card__subtitle{margin-top:0;margin-bottom:0.5rem}.mc-card__title{font-size:1.125rem;line-height:1.3333333333;font-weight:600;color:#000000}.mc-card__subtitle{font-size:0.875rem;line-height:1.2857142857;font-weight:400;color:#333333}.mc-card__body{font-size:1rem;line-height:1.375;color:#191919}.mc-card__body:not(:last-child){margin-bottom:1rem}.mc-card--bordered{background:#ffffff;border:2px solid #808080;border-radius:0.25rem;overflow:hidden}.mc-card--bordered .mc-card__content{padding-bottom:1.5rem;padding-left:1rem;padding-right:1rem}.mc-card--fluid{max-width:none}',this.shadowRoot.appendChild(c),i(this,{target:this.shadowRoot,props:{...o(this.attributes),$$slots:e(this)},customElement:!0},z,$,n,{title:0,imgsrc:1,outlined:2,titletag:3,imgalt:4,subtitle:5,subtitletag:6,imageratio:7},null),t&&(t.target&&r(t.target,this,t.anchor),t.props&&(this.$set(t.props),m()))}static get observedAttributes(){return["title","imgsrc","outlined","titletag","imgalt","subtitle","subtitletag","imageratio"]}get title(){return this.$$.ctx[0]}set title(t){this.$$set({title:t}),m()}get imgsrc(){return this.$$.ctx[1]}set imgsrc(t){this.$$set({imgsrc:t}),m()}get outlined(){return this.$$.ctx[2]}set outlined(t){this.$$set({outlined:t}),m()}get titletag(){return this.$$.ctx[3]}set titletag(t){this.$$set({titletag:t}),m()}get imgalt(){return this.$$.ctx[4]}set imgalt(t){this.$$set({imgalt:t}),m()}get subtitle(){return this.$$.ctx[5]}set subtitle(t){this.$$set({subtitle:t}),m()}get subtitletag(){return this.$$.ctx[6]}set subtitletag(t){this.$$set({subtitletag:t}),m()}get imageratio(){return this.$$.ctx[7]}set imageratio(t){this.$$set({imageratio:t}),m()}}export{j as default};
+import{S as t,i,a as o,g as e,b as r,f as m,s as n,c,e as l,d as a,n as d,a4 as s,h as b,j as h,l as u,p as g,q as f,r as p,u as x,x as w,t as _,a5 as k,o as v,R as y}from"../../index-d12e76e8.js";function $(t){let i,o,e;return{c(){i=l(t[3]),o=_("$"),e=_(t[0]),k(t[3])(i,{class:"mc-card__title"})},m(t,m){r(t,i,m),u(i,o),u(i,e)},p(t,i){1&i&&v(e,t[0])},d(t){t&&f(i)}}}function z(t){let i,o=t[6],e=t[6]&&j(t);return{c(){e&&e.c(),i=y()},m(t,o){e&&e.m(t,o),r(t,i,o)},p(t,r){t[6]?o?n(o,t[6])?(e.d(1),e=j(t),o=t[6],e.c(),e.m(i.parentNode,i)):e.p(t,r):(e=j(t),o=t[6],e.c(),e.m(i.parentNode,i)):o&&(e.d(1),e=null,o=t[6])},d(t){t&&f(i),e&&e.d(t)}}}function j(t){let i,o,e;return{c(){i=l(t[6]),o=_("$"),e=_(t[5]),k(t[6])(i,{class:"mc-card__subtitle"})},m(t,m){r(t,i,m),u(i,o),u(i,e)},p(t,i){32&i&&v(e,t[5])},d(t){t&&f(i)}}}function C(t){let i;return{c(){i=l("footer"),i.innerHTML='<slot name="footer"></slot>',b(i,"class","mc-card__footer")},m(t,o){r(t,i,o)},d(t){t&&f(i)}}}function L(t){let i,o,e,m,p,x,w,_,k,v,y,j,L=t[3],M=t[3]&&$(t),q=t[5]&&z(t),R=t[10].footer&&C(),Y=[{class:j="mc-card"+(t[2]?" mc-card--bordered":"")+" "+t[9]},t[8]],E={};for(let t=0;t<Y.length;t+=1)E=c(E,Y[t]);return{c(){i=l("div"),o=l("figure"),e=l("img"),x=a(),w=l("article"),M&&M.c(),_=a(),q&&q.c(),k=a(),v=l("div"),v.innerHTML="<slot></slot>",y=a(),R&&R.c(),this.c=d,s(e.src,m=t[1])||b(e,"src",m),b(e,"alt",t[4]),b(e,"class","mc-card__img"),b(o,"class",p="mc-card__visual "+(t[7]?`mc-card__visual--${t[7]}`:"")),b(v,"class","mc-card__body"),b(w,"class","mc-card__content"),h(i,E)},m(t,m){r(t,i,m),u(i,o),u(o,e),u(i,x),u(i,w),M&&M.m(w,null),u(w,_),q&&q.m(w,null),u(w,k),u(w,v),u(w,y),R&&R.m(w,null)},p(t,[r]){2&r&&!s(e.src,m=t[1])&&b(e,"src",m),16&r&&b(e,"alt",t[4]),128&r&&p!==(p="mc-card__visual "+(t[7]?`mc-card__visual--${t[7]}`:""))&&b(o,"class",p),t[3]?L?n(L,t[3])?(M.d(1),M=$(t),L=t[3],M.c(),M.m(w,_)):M.p(t,r):(M=$(t),L=t[3],M.c(),M.m(w,_)):L&&(M.d(1),M=null,L=t[3]),t[5]?q?q.p(t,r):(q=z(t),q.c(),q.m(w,k)):q&&(q.d(1),q=null),t[10].footer?R||(R=C(),R.c(),R.m(w,null)):R&&(R.d(1),R=null),h(i,E=g(Y,[516&r&&j!==(j="mc-card"+(t[2]?" mc-card--bordered":"")+" "+t[9])&&{class:j},256&r&&t[8]]))},i:d,o:d,d(t){t&&f(i),M&&M.d(t),q&&q.d(),R&&R.d()}}}function M(t,i,o){let e,r;const m=["title","imgsrc","outlined","titletag","imgalt","subtitle","subtitletag","imageratio"];let n=p(i,m),{$$slots:l={},$$scope:a}=i;const d=x(l);let{title:s}=i,{imgsrc:b}=i,{outlined:h=!1}=i,{titletag:u="h1"}=i,{imgalt:g}=i,{subtitle:f}=i,{subtitletag:_="h2"}=i,{imageratio:k="4x3"}=i;return t.$$set=t=>{o(12,i=c(c({},i),w(t))),o(11,n=p(i,m)),"title"in t&&o(0,s=t.title),"imgsrc"in t&&o(1,b=t.imgsrc),"outlined"in t&&o(2,h=t.outlined),"titletag"in t&&o(3,u=t.titletag),"imgalt"in t&&o(4,g=t.imgalt),"subtitle"in t&&o(5,f=t.subtitle),"subtitletag"in t&&o(6,_=t.subtitletag),"imageratio"in t&&o(7,k=t.imageratio)},t.$$.update=()=>{o(9,e=i.class),o(8,r=Object.assign({},n)),256&t.$$.dirty&&delete r.class},i=w(i),[s,b,h,u,g,f,_,k,r,e,d]}class q extends t{constructor(t){super();const c=document.createElement("style");c.textContent='.mc-button{margin:0;-webkit-box-shadow:none;box-shadow:none;text-decoration:none;outline:none;border:none;cursor:pointer;padding:0;color:#ffffff;background-color:#188803;font-family:"LeroyMerlin", sans-serif;font-weight:600;font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem;cursor:pointer;border-radius:4px;text-align:center;border:2px solid transparent;-webkit-transition:all ease 200ms;-o-transition:all ease 200ms;transition:all ease 200ms;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;vertical-align:middle;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;-webkit-box-sizing:border-box;box-sizing:border-box;fill:currentColor}.mc-button.is-hover,.mc-button:hover{background-color:#006902;color:#ffffff}.mc-button.is-active,.mc-button:active{background-color:#006902}.mc-button:disabled,.mc-button.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button .mc-button__icon:first-child,.mc-button .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button.is-focus,.mc-button:focus{-webkit-box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #0b96cc;box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #0b96cc}.mc-button--s{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s .mc-button__icon:first-child,.mc-button--s .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m .mc-button__icon:first-child,.mc-button--m .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l .mc-button__icon{width:2rem;height:2rem}.mc-button--l .mc-button__icon:first-child,.mc-button--l .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full{width:-webkit-fill-available;width:-moz-available;width:stretch}}.mc-button--square{-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:0;padding:0}.mc-button__icon{-ms-flex-negative:0;flex-shrink:0}.mc-button__icon:last-child{margin-left:0.5rem;margin-right:-0.25rem}.mc-button__icon:first-child{margin-right:0.5rem;margin-left:-0.25rem}.mc-button__icon:only-child{margin:0}.mc-button__label{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;pointer-events:none}.mc-button--solid-primary-02{background-color:#6a7081}.mc-button--solid-primary-02.is-hover,.mc-button--solid-primary-02:hover{background-color:#242938}.mc-button--solid-primary-02.is-active,.mc-button--solid-primary-02:active{background-color:#171b26}.mc-button--solid-primary-02:disabled,.mc-button--solid-primary-02.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--solid-neutral{background-color:#333333}.mc-button--solid-neutral.is-hover,.mc-button--solid-neutral:hover{background-color:#191919}.mc-button--solid-neutral.is-active,.mc-button--solid-neutral:active{background-color:#333333}.mc-button--solid-neutral:disabled,.mc-button--solid-neutral.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--solid-danger{background-color:#c61112}.mc-button--solid-danger.is-hover,.mc-button--solid-danger:hover{background-color:#8c0003}.mc-button--solid-danger.is-active,.mc-button--solid-danger:active{background-color:#8c0003}.mc-button--solid-danger:disabled,.mc-button--solid-danger.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--bordered{color:#188803;border-color:#188803;background-color:#ffffff}.mc-button--bordered.is-hover,.mc-button--bordered:hover{background-color:#ebf5de;color:#006902}.mc-button--bordered.is-active,.mc-button--bordered:active{background-color:#c5e39e;color:#035010}.mc-button--bordered.is-active,.mc-button--bordered:active{background-color:#c5e39e;color:#035010}.mc-button--bordered:disabled,.mc-button--bordered.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--bordered-primary-02{color:#6a7081;border-color:#6a7081;background-color:#ffffff}.mc-button--bordered-primary-02.is-hover,.mc-button--bordered-primary-02:hover{background-color:#eeeff1;color:#6a7081}.mc-button--bordered-primary-02.is-active,.mc-button--bordered-primary-02:active{background-color:#cfd2d8}.mc-button--bordered-primary-02:disabled,.mc-button--bordered-primary-02.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--bordered-neutral{color:#333333;border-color:#333333;background-color:#ffffff}.mc-button--bordered-neutral.is-hover,.mc-button--bordered-neutral:hover{background-color:#e6e6e6;color:#333333}.mc-button--bordered-neutral.is-active,.mc-button--bordered-neutral:active{background-color:#cccccc}.mc-button--bordered-neutral:disabled,.mc-button--bordered-neutral.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}.mc-button--bordered-danger{color:#c61112;border-color:#c61112;background-color:#ffffff}.mc-button--bordered-danger.is-hover,.mc-button--bordered-danger:hover{background-color:#fdeaea;color:#8c0003}.mc-button--bordered-danger.is-active,.mc-button--bordered-danger:active{background-color:#f8bcbb;color:#530000}.mc-button--bordered-danger.is-active,.mc-button--bordered-danger:active{background-color:#f8bcbb;color:#530000}.mc-button--bordered-danger:disabled,.mc-button--bordered-danger.is-disabled{background-color:#cccccc;border-color:transparent;color:#666666;cursor:not-allowed}@media screen and (min-width: 680px){.mc-button--s\\@from-m{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-m .mc-button__icon:first-child,.mc-button--s\\@from-m .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m\\@from-m{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-m .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-m .mc-button__icon:first-child,.mc-button--m\\@from-m .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l\\@from-m{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-m .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-m .mc-button__icon:first-child,.mc-button--l\\@from-m .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l\\@from-m .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit\\@from-m{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full\\@from-m{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full\\@from-m{width:-webkit-fill-available;width:-moz-available;width:stretch}}}@media screen and (min-width: 1024px){.mc-button--s\\@from-l{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-l .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-l .mc-button__icon:first-child,.mc-button--s\\@from-l .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m\\@from-l{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-l .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-l .mc-button__icon:first-child,.mc-button--m\\@from-l .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l\\@from-l{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-l .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-l .mc-button__icon:first-child,.mc-button--l\\@from-l .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l\\@from-l .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit\\@from-l{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full\\@from-l{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full\\@from-l{width:-webkit-fill-available;width:-moz-available;width:stretch}}.mc-button--square{padding:0}}@media screen and (min-width: 1280px){.mc-button--s\\@from-xl{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-xl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-xl .mc-button__icon:first-child,.mc-button--s\\@from-xl .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m\\@from-xl{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-xl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-xl .mc-button__icon:first-child,.mc-button--m\\@from-xl .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l\\@from-xl{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-xl .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-xl .mc-button__icon:first-child,.mc-button--l\\@from-xl .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l\\@from-xl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit\\@from-xl{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full\\@from-xl{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full\\@from-xl{width:-webkit-fill-available;width:-moz-available;width:stretch}}}@media screen and (min-width: 1920px){.mc-button--s\\@from-xxl{font-size:0.875rem;line-height:1.2857142857;padding:0.3125rem 1rem;min-height:2rem;min-width:2rem}.mc-button--s\\@from-xxl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--s\\@from-xxl .mc-button__icon:first-child,.mc-button--s\\@from-xxl .mc-button__icon:last-child{margin-bottom:-0.1875rem;margin-top:-0.1875rem}.mc-button--s\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:1.5rem;height:1.5rem}.mc-button--m\\@from-xxl{font-size:1rem;line-height:1.375;padding:0.6875rem 1.5rem;min-height:3rem;min-width:3rem}.mc-button--m\\@from-xxl .mc-button__icon{width:1.5rem;height:1.5rem}.mc-button--m\\@from-xxl .mc-button__icon:first-child,.mc-button--m\\@from-xxl .mc-button__icon:last-child{margin-bottom:-1px;margin-top:-1px}.mc-button--m\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--l\\@from-xxl{font-size:1.125rem;line-height:1.3333333333;padding:0.875rem 1.5rem;min-height:3.5rem;min-width:3.5rem}.mc-button--l\\@from-xxl .mc-button__icon{width:2rem;height:2rem}.mc-button--l\\@from-xxl .mc-button__icon:first-child,.mc-button--l\\@from-xxl .mc-button__icon:last-child{margin-bottom:-0.25rem;margin-top:-0.25rem}.mc-button--l\\@from-xxl .mc-button__icon:only-child{margin-bottom:0;margin-top:0;width:2rem;height:2rem}.mc-button--fit\\@from-xxl{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;width:auto}.mc-button--full\\@from-xxl{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){.mc-button--full\\@from-xxl{width:-webkit-fill-available;width:-moz-available;width:stretch}}}.mc-link{-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-sizing:border-box;box-sizing:border-box;cursor:pointer;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;font-size:inherit;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;line-height:inherit;text-decoration:underline;-webkit-transition:color ease 200ms;-o-transition:color ease 200ms;transition:color ease 200ms;gap:0.25rem;color:#000000;position:relative;font-size:1rem;line-height:1.375}.mc-link:focus{outline:none}.mc-link:focus::after{-webkit-box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #0b96cc;box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #0b96cc}.mc-link.is-visited,.mc-link:visited{color:#333333}.mc-link.is-hover,.mc-link:hover{color:#666666}.mc-link.is-active,.mc-link:active{color:#333333}.mc-link.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-link--s{font-size:0.875rem;line-height:1.2857142857}.mc-link--m{font-size:1rem;line-height:1.375}.mc-link::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease}.mc-link__icon{display:block;height:1rem;fill:currentColor;-ms-flex-negative:0;flex-shrink:0;width:1rem}.mc-link--light{color:#ffffff}.mc-link--light.is-visited,.mc-link--light:visited{color:#cccccc}.mc-link--light.is-hover,.mc-link--light:hover{color:#999999}.mc-link--light.is-active,.mc-link--light:active{color:#cccccc}.mc-link--light.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-link--primary{color:#188803}.mc-link--primary.is-visited,.mc-link--primary:visited{color:#006902}.mc-link--primary.is-hover,.mc-link--primary:hover{color:#035010}.mc-link--primary.is-active,.mc-link--primary:active{color:#006902}.mc-link--primary.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-link--primary-02{color:#494f60}.mc-link--primary-02.is-visited,.mc-link--primary-02:visited{color:#343b4c}.mc-link--primary-02.is-hover,.mc-link--primary-02:hover{color:#171b26}.mc-link--primary-02.is-active,.mc-link--primary-02:active{color:#343b4c}.mc-link--primary-02.is-disabled{color:#e6e6e6;cursor:not-allowed}.mc-link--danger{color:#c61112}.mc-link--danger.is-visited,.mc-link--danger:visited{color:#8c0003}.mc-link--danger.is-hover,.mc-link--danger:hover{color:#530000}.mc-link--danger.is-active,.mc-link--danger:active{color:#8c0003}.mc-link--danger.is-disabled{color:#e6e6e6;cursor:not-allowed}@media screen and (min-width: 680px){.mc-link--s\\@from-m{font-size:0.875rem;line-height:1.2857142857}.mc-link--m\\@from-m{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1024px){.mc-link--s\\@from-l{font-size:0.875rem;line-height:1.2857142857}.mc-link--m\\@from-l{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1280px){.mc-link--s\\@from-xl{font-size:0.875rem;line-height:1.2857142857}.mc-link--m\\@from-xl{font-size:1rem;line-height:1.375}}@media screen and (min-width: 1920px){.mc-link--s\\@from-xxl{font-size:0.875rem;line-height:1.2857142857}.mc-link--m\\@from-xxl{font-size:1rem;line-height:1.375}}.mc-card{font-family:"LeroyMerlin", sans-serif;max-width:17.75rem}.mc-card,.mc-card *{-webkit-box-sizing:border-box;box-sizing:border-box}@media screen and (min-width: 680px){.mc-card{max-width:18.25rem}}@media screen and (min-width: 1024px){.mc-card{max-width:18rem}}@media screen and (min-width: 1280px){.mc-card{max-width:17.5rem}}@media screen and (min-width: 1920px){.mc-card{max-width:27.25rem}}.mc-card__visual{margin:0;overflow:hidden;position:relative}.mc-card__visual::before{content:"";display:block;width:100%;padding-top:75%}.mc-card__visual--1x1::before{padding-top:100%}.mc-card__visual--16x9::before{padding-top:56.25%}.mc-card__img{height:auto;left:0;position:absolute;top:50%;width:100%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%)}.mc-card__content{padding-top:1rem}.mc-card__title,.mc-card__subtitle{margin-top:0;margin-bottom:0.5rem}.mc-card__title{font-size:1.125rem;line-height:1.3333333333;font-weight:600;color:#000000}.mc-card__subtitle{font-size:0.875rem;line-height:1.2857142857;font-weight:400;color:#333333}.mc-card__body{font-size:1rem;line-height:1.375;color:#191919}.mc-card__body:not(:last-child){margin-bottom:1rem}.mc-card--bordered{background:#ffffff;border:2px solid #808080;border-radius:0.25rem;overflow:hidden}.mc-card--bordered .mc-card__content{padding-bottom:1.5rem;padding-left:1rem;padding-right:1rem}.mc-card--fluid{max-width:none}',this.shadowRoot.appendChild(c),i(this,{target:this.shadowRoot,props:{...o(this.attributes),$$slots:e(this)},customElement:!0},M,L,n,{title:0,imgsrc:1,outlined:2,titletag:3,imgalt:4,subtitle:5,subtitletag:6,imageratio:7},null),t&&(t.target&&r(t.target,this,t.anchor),t.props&&(this.$set(t.props),m()))}static get observedAttributes(){return["title","imgsrc","outlined","titletag","imgalt","subtitle","subtitletag","imageratio"]}get title(){return this.$$.ctx[0]}set title(t){this.$$set({title:t}),m()}get imgsrc(){return this.$$.ctx[1]}set imgsrc(t){this.$$set({imgsrc:t}),m()}get outlined(){return this.$$.ctx[2]}set outlined(t){this.$$set({outlined:t}),m()}get titletag(){return this.$$.ctx[3]}set titletag(t){this.$$set({titletag:t}),m()}get imgalt(){return this.$$.ctx[4]}set imgalt(t){this.$$set({imgalt:t}),m()}get subtitle(){return this.$$.ctx[5]}set subtitle(t){this.$$set({subtitle:t}),m()}get subtitletag(){return this.$$.ctx[6]}set subtitletag(t){this.$$set({subtitletag:t}),m()}get imageratio(){return this.$$.ctx[7]}set imageratio(t){this.$$set({imageratio:t}),m()}}export{q as default};
 //# sourceMappingURL=Card.js.map

package/public/components/card/Card.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Card.js","sources":["../../../src/components/card/Card.svelte"],"sourcesContent":["<svelte:options tag={null} />\n\n<script lang=\"ts\">\n import type { CardTitleTag, CardSubtitleTag, CardRatio } from './card.types';\n\n export let title: string;\n export let imgsrc: string;\n export let outlined = false;\n export let titletag: CardTitleTag = 'h1';\n export let imgalt: string;\n export let subtitle: string;\n export let subtitletag: CardSubtitleTag = 'h2';\n export let imageratio: CardRatio = '4x3';\n $: userClass = $$props.class;\n $: attributes = { ...$$restProps };\n $: delete attributes.class;\n</script>\n\n<div\n class=\"mc-card{outlined ? ' mc-card--bordered' : ''} {userClass}\"\n {...attributes}\n>\n <figure\n class=\"mc-card__visual {imageratio ? `mc-card__visual--${imageratio}` : ''}\"\n >\n <img src={imgsrc} alt={imgalt} class=\"mc-card__img\" />\n </figure>\n <article class=\"mc-card__content\">\n ~~{@html~~ ~~`<$~~{titletag} class=\"mc-card__title\">${title}~~</${titletag}>`}~~\n\n {#if subtitle}\n ~~{@html~~ ~~`<$~~{subtitletag} class=\"mc-card__subtitle\">${subtitle}~~</${subtitletag}>`}~~\n {/if}\n\n <div class=\"mc-card__body\">\n <slot />\n </div>\n\n {#if $$slots.footer}\n <footer class=\"mc-card__footer\">\n <slot name=\"footer\" />\n </footer>\n {/if}\n </article>\n</div>\n\n<style lang=\"scss\">\n @import '@mozaic-ds/styles/settings-tools/_all-settings';\n @import '@mozaic-ds/styles/components/c.button';\n @import '@mozaic-ds/styles/components/c.links';\n @import '@mozaic-ds/styles/components/c.card';\n</style>\n"],"names":["ctx","~~html_tag~~","p","~~raw_value~~","~~insert~~","~~target~~","footer","~~anchor~~","create_if_block_1","if_block1","create_if_block","~~class","~~div1_class_value","attr","img","img_src_value","div1","append","figure","article","div0","dirty","title","$$props","imgsrc","outlined","titletag","imgalt","subtitle","subtitletag","imageratio","$$invalidate","userClass","attributes","Object","assign","$$restProps"],"mappings":"~~wMA+BiBA~~,~~EAAW~~,~~gCAA8BA~~,EAAQ,~~OAAKA~~,EAAW,~~8FAAjEA~~,EAAW,~~gCAA8BA~~,EAAQ,~~OAAKA~~,EAAW,~~QAAAC~~,~~EAAAC~~,~~EAAAC~~,~~0JAQ5EC~~,~~EAEQC~~,~~EAAAC~~,~~EAAAC~~,~~qEAbCP~~,EAAQ,~~6BAA2BA~~,~~EAAK~~,~~OAAKA~~,EAAQ,~~QAE3DA~~,EAAQ,IAAAQ,EAAAR,~~GAQRS~~,EAAAT,~~MAAQM~~,QAAMI,~~QAnBNC~~,~~MAAAC~~,EAAA,WAAAZ,EAAW,GAAA,qBAAuB,QAAKA,EAAS,IAC3DA,EAAU~~,+NAKFA~~,EAAM,KAAAa,EAAAC,EAAA,MAAAC,aAAOf,EAAM,kEAFLA,EAAU,uBAAuBA,EAAU,KAAK,~~uFAL5EI~~,~~EA0BKC~~,~~EAAAW~~,~~EAAAT~~,~~GAtBHU~~,EAIQD,EAAAE,GADND,EAAqDC,EAAAJ,UAEvDG,~~EAgBSD~~,EAAAG,~~yCATPF,~~EAEKE,EAAAC,~~mDAXKpB~~,EAAM,kCAAOA,EAAM,sCAFLA,EAAU,uBAAuBA,EAAU,KAAK,~~qCAK7DA~~,EAAQ,~~6BAA2BA~~,~~EAAK~~,~~OAAKA~~,EAAQ,~~QAAAC~~,~~EAAAC~~,~~EAAAC~~,~~GAE3DH~~,EAAQ,~~yDAQRA~~,~~MAAQM~~,~~kEAnBA~~,~~IAAAe~~,GAAAT,KAAAA,EAAA,WAAAZ,EAAW,GAAA,qBAAuB,QAAKA,EAAS,KAAA,~~CAAAW~~,~~MAAAC~~,UAC3DZ,EAAU,~~yOAfHsB~~,GAAaC,UACbC,GAAcD,GACdE,SAAAA,GAAW,GAAKF,GAChBG,SAAAA,EAAyB,MAAIH,UAC7BI,GAAcJ,YACdK,GAAgBL,GAChBM,YAAAA,EAA+B,MAAIN,GACnCO,WAAAA,EAAwB,OAAKP,0VACrCQ,EAAA,EAAAC,EAAYT,~~EAAQZ~~,~~WACpBsB~~,EAALC,OAAAC,UAAuBC,2BACXH,~~EAAWtB~~"}
1	+ {"version":3,"file":"Card.js","sources":["../../../src/components/card/Card.svelte"],"sourcesContent":["<svelte:options tag={null} />\n\n<script lang=\"ts\">\n import type { CardTitleTag, CardSubtitleTag, CardRatio } from './card.types';\n\n export let title: string;\n export let imgsrc: string;\n export let outlined = false;\n export let titletag: CardTitleTag = 'h1';\n export let imgalt: string;\n export let subtitle: string;\n export let subtitletag: CardSubtitleTag = 'h2';\n export let imageratio: CardRatio = '4x3';\n $: userClass = $$props.class;\n $: attributes = { ...$$restProps };\n $: delete attributes.class;\n</script>\n\n<div\n class=\"mc-card{outlined ? ' mc-card--bordered' : ''} {userClass}\"\n {...attributes}\n>\n <figure\n class=\"mc-card__visual {imageratio ? `mc-card__visual--${imageratio}` : ''}\"\n >\n <img src={imgsrc} alt={imgalt} class=\"mc-card__img\" />\n </figure>\n <article class=\"mc-card__content\">\n <svelte:element this={titletag} class=\"mc-card__title\"\n >${title}</svelte:element\n >\n\n {#if subtitle}\n <svelte:element this={subtitletag} class=\"mc-card__subtitle\"\n >${subtitle}</svelte:element\n >\n {/if}\n\n <div class=\"mc-card__body\">\n <slot />\n </div>\n\n {#if $$slots.footer}\n <footer class=\"mc-card__footer\">\n <slot name=\"footer\" />\n </footer>\n {/if}\n </article>\n</div>\n\n<style lang=\"scss\">\n @import '@mozaic-ds/styles/settings-tools/_all-settings';\n @import '@mozaic-ds/styles/components/c.button';\n @import '@mozaic-ds/styles/components/c.links';\n @import '@mozaic-ds/styles/components/c.card';\n</style>\n"],"names":["ctx","svelte_element","class","insert","target","anchor","create_dynamic_element","footer","create_dynamic_element_1","create_if_block_1","if_block1","create_if_block","div1_class_value","attr","img","img_src_value","div1","append","figure","article","div0","dirty","title","$$props","imgsrc","outlined","titletag","imgalt","subtitle","subtitletag","imageratio","$$invalidate","userClass","attributes","Object","assign","$$restProps"],"mappings":"4OA4B0BA,EAAQ,QAC3B,SAAEA,EAAK,MADYA,EAAQ,IAAAC,EAAA,CAAAC,MAAA,2BAA9BC,EAEAC,EAAAH,EAAAI,kCADKL,EAAK,0CAIcA,EAAW,KAAXA,EAAW,IAAAM,EAAAN,kEAAXA,EAAW,SAAXA,EAAW,qBAAXA,EAAW,iDAAXA,EAAW,kDAAXA,EAAW,qEAAXA,EAAW,QAC9B,SAAEA,EAAQ,MADSA,EAAW,IAAAC,EAAA,CAAAC,MAAA,8BAAjCC,EAEAC,EAAAH,EAAAI,mCADKL,EAAQ,kJASbG,EAEQC,EAAAG,EAAAF,+DAjBYL,EAAQ,KAARA,EAAQ,IAAAQ,EAAAR,KAIzBA,EAAQ,IAAAS,EAAAT,GAURU,EAAAV,MAAQO,QAAMI,QAvBNT,MAAAU,EAAA,WAAAZ,EAAW,GAAA,qBAAuB,QAAKA,EAAS,IAC3DA,EAAU,4NAKFA,EAAM,KAAAa,EAAAC,EAAA,MAAAC,aAAOf,EAAM,kEAFLA,EAAU,uBAAuBA,EAAU,KAAK,iFAL5EG,EA8BKC,EAAAY,EAAAX,GA1BHY,EAIQD,EAAAE,GADND,EAAqDC,EAAAJ,UAEvDG,EAoBSD,EAAAG,+CATPF,EAEKE,EAAAC,mDAfKpB,EAAM,kCAAOA,EAAM,sCAFLA,EAAU,uBAAuBA,EAAU,KAAK,qBAKlDA,EAAQ,SAARA,EAAQ,qBAARA,EAAQ,sCAARA,EAAQ,uCAARA,EAAQ,IAIzBA,EAAQ,yDAURA,MAAQO,kEAvBA,IAAAc,GAAAT,KAAAA,EAAA,WAAAZ,EAAW,GAAA,qBAAuB,QAAKA,EAAS,KAAA,CAAAE,MAAAU,UAC3DZ,EAAU,mPAfHsB,GAAaC,UACbC,GAAcD,GACdE,SAAAA,GAAW,GAAKF,GAChBG,SAAAA,EAAyB,MAAIH,UAC7BI,GAAcJ,YACdK,GAAgBL,GAChBM,YAAAA,EAA+B,MAAIN,GACnCO,WAAAA,EAAwB,OAAKP,0VACrCQ,EAAA,EAAAC,EAAYT,EAAQrB,WACpB+B,EAALC,OAAAC,UAAuBC,2BACXH,EAAW/B"}

package/public/components/card/Card.svelte CHANGED Viewed

@@ -26,10 +26,14 @@
     <img src={imgsrc} alt={imgalt} class="mc-card__img" />
   </figure>
   <article class="mc-card__content">
-    {@html `<${titletag} class="mc-card__title">${title}</${titletag}>`}
+    <svelte:element this={titletag} class="mc-card__title"
+      >${title}</svelte:element
+    >
     {#if subtitle}
-      {@html `<${subtitletag} class="mc-card__subtitle">${subtitle}</${subtitletag}>`}
+      <svelte:element this={subtitletag} class="mc-card__subtitle"
+        >${subtitle}</svelte:element
+      >
     {/if}
     <div class="mc-card__body">

package/public/components/carousel/Carousel.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{S as e,i as t,a as i,b as s,f as a,s as o,e as l,d as r,B as n,n as c,g as d,J as m,j as u,C as p,l as b,y as h,x as f,w,o as x,D as _,O as g,q as $,r as v,a1 as k,Z as y,z,H as j}from"../../index-9ffad6d0.js";import L from"../link/Link.nested.js";import V from"./CarouselCard.nested.js";import W from"../button/Button.nested.js";import{E as S}from"../../EventHandler-f7ee47ca.js";import"../../EventForward-24fc0272.js";import"../loader/Loader.nested.js";function H(e,t,i){const s=e.slice();return s[33]=t[i],s}function A(e){let t,i,a,o,c,m;function f(...t){return e[24](e[33],...t)}return i=new V({props:{title:e[33].title,imgSrc:e[33].imgSrc,imgAlt:e[33].imgAlt}}),{c(){t=l("button"),n(i.$$.fragment),a=r(),d(t,"class","mc-carousel__item")},m(e,l){s(e,t,l),p(i,t,null),u(t,a),o=!0,c||(m=b(t,"click",f),c=!0)},p(t,s){e=t;const a={};32&s[0]&&(a.title=e[33].title),32&s[0]&&(a.imgSrc=e[33].imgSrc),32&s[0]&&(a.imgAlt=e[33].imgAlt),i.$set(a)},i(e){o||(h(i.$$.fragment,e),o=!0)},o(e){w(i.$$.fragment,e),o=!1},d(e){e&&x(t),_(i),c=!1,m()}}}function C(e){let t,i,a,o,$,v,k,j,V,S,C,O,B,J,M,P,R,q,D,F=`<${e[1]} style="margin:0">${e[0]}</${e[1]}>`;k=new L({props:{href:"#layer",iconname:"navigation-arrow-arrow--right-24px",iconposition:"right",label:e[2],size:"s",target:"_self"}}),k.$on("click",e[16]),S=new W({props:{theme:"neutral",size:"s",bordered:!0,iconmode:"only",iconname:"navigation-arrow-arrow--left-32px","aria-label":"Previous page",disabled:e[7],label:"Previous",loader:""}}),S.$on("click",e[13]),O=new W({props:{theme:"neutral",size:"s",type:"button",bordered:!0,disabled:e[8],iconmode:"only",iconname:"navigation-arrow-arrow--right-32px","aria-label":"Next Page",label:"Next",loader:""}}),O.$on("click",e[12]);let T=e[5],Z=[];for(let t=0;t<T.length;t+=1)Z[t]=A(H(e,T,t));const G=e=>w(Z[e],1,1,(()=>{Z[e]=null}));return{c(){t=l("div"),i=l("div"),a=l("div"),o=new y(!1),$=r(),v=l("div"),n(k.$$.fragment),j=r(),V=l("nav"),n(S.$$.fragment),C=r(),n(O.$$.fragment),J=r(),M=l("div"),P=l("div");for(let e=0;e<Z.length;e+=1)Z[e].c();this.c=c,o.a=$,d(v,"class","mc-carousel__subtitle"),d(a,"class","mc-carousel__titles"),d(V,"aria-label","pagination"),d(V,"class",B="mc-carousel__nav "+(e[3]?"mc-carousel__nav--mobile":"mc-carousel__nav--desktop")),d(i,"class","mc-carousel__header"),d(P,"class","mc-carousel__content"),m(P,"--carousel__container-width-space",e[10]+"px"),m(P,"--carousel__items-count",e[4]),m(P,"--carousel__item-width-space",e[11]+"px"),m(P,"--carousel__items-visible",e[9]),m(P,"--carousel__scrollbar-left",N),m(P,"--carousel__container-separate-item-size",E+"px"),d(M,"class","mc-carousel__body"),m(M,"--carousel__accessibility-focus-padding",I+"px"),d(t,"class","mc-carousel")},m(l,r){s(l,t,r),u(t,i),u(i,a),o.m(F,a),u(a,$),u(a,v),p(k,v,null),u(i,j),u(i,V),p(S,V,null),u(V,C),p(O,V,null),u(t,J),u(t,M),u(M,P);for(let e=0;e<Z.length;e+=1)Z[e]&&Z[e].m(P,null);e[25](M),R=!0,q||(D=b(M,"scroll",e[14]),q=!0)},p(e,t){(!R||3&t[0])&&F!==(F=`<${e[1]} style="margin:0">${e[0]}</${e[1]}>`)&&o.p(F);const i={};4&t[0]&&(i.label=e[2]),k.$set(i);const s={};128&t[0]&&(s.disabled=e[7]),S.$set(s);const a={};if(256&t[0]&&(a.disabled=e[8]),O.$set(a),(!R||8&t[0]&&B!==(B="mc-carousel__nav "+(e[3]?"mc-carousel__nav--mobile":"mc-carousel__nav--desktop")))&&d(V,"class",B),32800&t[0]){let i;for(T=e[5],i=0;i<T.length;i+=1){const s=H(e,T,i);Z[i]?(Z[i].p(s,t),h(Z[i],1)):(Z[i]=A(s),Z[i].c(),h(Z[i],1),Z[i].m(P,null))}for(z(),i=T.length;i<Z.length;i+=1)G(i);f()}(!R||1024&t[0])&&m(P,"--carousel__container-width-space",e[10]+"px"),(!R||16&t[0])&&m(P,"--carousel__items-count",e[4]),(!R||2048&t[0])&&m(P,"--carousel__item-width-space",e[11]+"px"),(!R||512&t[0])&&m(P,"--carousel__items-visible",e[9])},i(e){if(!R){h(k.$$.fragment,e),h(S.$$.fragment,e),h(O.$$.fragment,e);for(let e=0;e<T.length;e+=1)h(Z[e]);R=!0}},o(e){w(k.$$.fragment,e),w(S.$$.fragment,e),w(O.$$.fragment,e),Z=Z.filter(Boolean);for(let e=0;e<Z.length;e+=1)w(Z[e]);R=!1},d(i){i&&x(t),_(k),_(S),_(O),g(Z,i),e[25](null),q=!1,D()}}}let E=16,I=4,N=0;function O(e,t){return t?e*E:(e-1)*E}function B(e,t,i){let s,a,o,l,r,n,c,d,m,{title:u}=t,{titletag:p="h1"}=t,{subtitlelink:b}=t,{mobile:h=!1}=t,{options:f}=t,{items:w}=t;const x=window.matchMedia("(max-width: 679px)"),_=window.matchMedia("(min-width: 680px) and (max-width: 1279px)"),g=window.matchMedia("(min-width: 1280px)"),y={s:{itemsVisible:1,hasHalfItemVisible:!0},m:{itemsVisible:3,hasHalfItemVisible:!1},xl:{itemsVisible:5,hasHalfItemVisible:!1}};let z,L=new S($(),v()),V=function(e,t){return t.matches?"xl":e.matches?"m":"s"}(_,g),W=!0,H=!1;function A(e){z.scrollTo({behavior:"smooth",left:function(){if(!r)return z.scrollLeft+e*(z.clientWidth+E-2*I);const t=function(){const e=O(l,r);return r?(z.clientWidth-e)/c:(z.clientWidth-e)/l}();return W?z.scrollLeft+(e*(z.clientWidth-3/4*t-E)+I):H?z.scrollLeft+e*(z.clientWidth-3/4*t-E):z.scrollLeft+e*(z.clientWidth-t/2-E+2*I)}()})}function C(e,t){return L.dispatch("carousel-item-clicked",e),t}function N(e,t){return e.matches&&i(19,V=t),e}k((()=>{x.onchange=e=>{N(e,"s")},_.onchange=e=>{N(e,"m")},g.onchange=e=>{N(e,"xl")}}));return e.$$set=e=>{"title"in e&&i(0,u=e.title),"titletag"in e&&i(1,p=e.titletag),"subtitlelink"in e&&i(2,b=e.subtitlelink),"mobile"in e&&i(3,h=e.mobile),"options"in e&&i(17,f=e.options),"items"in e&&i(18,w=e.items)},e.$$.update=()=>{262144&e.$$.dirty[0]&&i(5,s=w?JSON.parse(w):[]),131072&e.$$.dirty[0]&&i(23,a=f?Object.assign({},y,JSON.parse(f)):y),32&e.$$.dirty[0]&&i(22,o=null==s?void 0:s.length),8912896&e.$$.dirty[0]&&i(21,l=a[V].itemsVisible),8912896&e.$$.dirty[0]&&i(20,r=a[V].hasHalfItemVisible||!1),6291456&e.$$.dirty[0]&&i(4,n=o<l?l:o),3145728&e.$$.dirty[0]&&i(9,c=r?l+.5:l),3145728&e.$$.dirty[0]&&i(11,d=O(l,r)),16&e.$$.dirty[0]&&i(10,m=(n-1)*E)},[u,p,b,h,n,s,z,W,H,c,m,d,function(){A(1)},function(){A(-1)},function(){i(7,W=(null==z?void 0:z.scrollLeft)<=0),i(8,H=(null==z?void 0:z.scrollWidth)-(null==z?void 0:z.scrollLeft)<=z.offsetWidth)},C,function(e){return L.dispatch("carousel-link-clicked",{}),e},f,w,V,r,l,o,a,(e,t)=>C(e,t),function(e){j[e?"unshift":"push"]((()=>{z=e,i(6,z)}))}]}class J extends e{constructor(e){super();const l=document.createElement("style");l.textContent='@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){}@media screen and (min-width: 680px){@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){}}@media screen and (min-width: 1024px){@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){}}@media screen and (min-width: 1280px){@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){}}@media screen and (min-width: 1920px){@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){}}@media screen and (min-width: 680px){}@media screen and (min-width: 1024px){}@media screen and (min-width: 1280px){}@media screen and (min-width: 1920px){}@media screen and (min-width: 1024px){}.mc-carousel{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:1rem}.mc-carousel__header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.mc-carousel__titles{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:0.25rem}.mc-carousel__nav{gap:0.5rem}.mc-carousel__nav--mobile{display:none}.mc-carousel__nav--desktop{display:-webkit-box;display:-ms-flexbox;display:flex}.mc-carousel__body{position:relative;overflow-x:auto;overflow-y:hidden;padding:var(--carousel__accessibility-focus-padding)}.mc-carousel__content{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-column-gap:var(--carousel__container-separate-item-size);-moz-column-gap:var(--carousel__container-separate-item-size);column-gap:var(--carousel__container-separate-item-size);width:calc((100% - var(--carousel__item-width-space)) / var(--carousel__items-visible) * var(--carousel__items-count) + var(--carousel__container-width-space));margin-bottom:1.25rem}.mc-carousel__item{display:-webkit-box;display:-ms-flexbox;display:flex;background:none;border:none;margin:0;padding:0;cursor:pointer;width:calc((100% - var(--carousel__item-width-space)) / var(--carousel__items-visible));position:relative}.mc-carousel__item::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease}.mc-carousel__item:focus::after{-webkit-box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #0b96cc;box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #0b96cc}::-webkit-scrollbar{border-radius:0.25rem;height:6px;background:#e6e6e6;border-top:1px solid white;border-bottom:1px solid white}::-webkit-scrollbar-thumb{background:#333333;border-radius:6px}',this.shadowRoot.appendChild(l),t(this,{target:this.shadowRoot,props:i(this.attributes),customElement:!0},B,C,o,{title:0,titletag:1,subtitlelink:2,mobile:3,options:17,items:18},null,[-1,-1]),e&&(e.target&&s(e.target,this,e.anchor),e.props&&(this.$set(e.props),a()))}static get observedAttributes(){return["title","titletag","subtitlelink","mobile","options","items"]}get title(){return this.$$.ctx[0]}set title(e){this.$$set({title:e}),a()}get titletag(){return this.$$.ctx[1]}set titletag(e){this.$$set({titletag:e}),a()}get subtitlelink(){return this.$$.ctx[2]}set subtitlelink(e){this.$$set({subtitlelink:e}),a()}get mobile(){return this.$$.ctx[3]}set mobile(e){this.$$set({mobile:e}),a()}get options(){return this.$$.ctx[17]}set options(e){this.$$set({options:e}),a()}get items(){return this.$$.ctx[18]}set items(e){this.$$set({items:e}),a()}}export{J as default};
+import{S as e,i as t,a as i,b as s,f as a,s as l,e as o,d as n,D as r,n as c,h as d,L as m,l as u,E as p,m as b,A as h,z as f,y as w,q as x,F as _,Q as g,v as $,w as v,a6 as k,t as y,a5 as z,o as j,B as L,J as V}from"../../index-d12e76e8.js";import W from"../link/Link.nested.js";import S from"./CarouselCard.nested.js";import A from"../button/Button.nested.js";import{E}from"../../EventHandler-f7ee47ca.js";import"../../EventForward-e61ea03d.js";import"../loader/Loader.nested.js";function H(e,t,i){const s=e.slice();return s[33]=t[i],s}function C(e){let t,i;return{c(){t=o(e[1]),i=y(e[0]),z(e[1])(t,{style:"margin:0"})},m(e,a){s(e,t,a),u(t,i)},p(e,t){1&t[0]&&j(i,e[0])},d(e){e&&x(t)}}}function I(e){let t,i,a,l,c,m;function f(...t){return e[24](e[33],...t)}return i=new S({props:{title:e[33].title,imgSrc:e[33].imgSrc,imgAlt:e[33].imgAlt}}),{c(){t=o("button"),r(i.$$.fragment),a=n(),d(t,"class","mc-carousel__item")},m(e,o){s(e,t,o),p(i,t,null),u(t,a),l=!0,c||(m=b(t,"click",f),c=!0)},p(t,s){e=t;const a={};32&s[0]&&(a.title=e[33].title),32&s[0]&&(a.imgSrc=e[33].imgSrc),32&s[0]&&(a.imgAlt=e[33].imgAlt),i.$set(a)},i(e){l||(h(i.$$.fragment,e),l=!0)},o(e){w(i.$$.fragment,e),l=!1},d(e){e&&x(t),_(i),c=!1,m()}}}function N(e){let t,i,a,$,v,k,y,z,j,V,S,E,N,O,P,F,R,q,D=e[1],Q=e[1]&&C(e);k=new W({props:{href:"#layer",iconname:"navigation-arrow-arrow--right-24px",iconposition:"right",label:e[2],size:"s",target:"_self"}}),k.$on("click",e[16]),j=new A({props:{theme:"neutral",size:"s",bordered:!0,iconmode:"only",iconname:"navigation-arrow-arrow--left-32px","aria-label":"Previous page",disabled:e[7],label:"Previous",loader:""}}),j.$on("click",e[13]),S=new A({props:{theme:"neutral",size:"s",type:"button",bordered:!0,disabled:e[8],iconmode:"only",iconname:"navigation-arrow-arrow--right-32px","aria-label":"Next Page",label:"Next",loader:""}}),S.$on("click",e[12]);let T=e[5],G=[];for(let t=0;t<T.length;t+=1)G[t]=I(H(e,T,t));const K=e=>w(G[e],1,1,(()=>{G[e]=null}));return{c(){t=o("div"),i=o("div"),a=o("div"),Q&&Q.c(),$=n(),v=o("div"),r(k.$$.fragment),y=n(),z=o("nav"),r(j.$$.fragment),V=n(),r(S.$$.fragment),N=n(),O=o("div"),P=o("div");for(let e=0;e<G.length;e+=1)G[e].c();this.c=c,d(v,"class","mc-carousel__subtitle"),d(a,"class","mc-carousel__titles"),d(z,"aria-label","pagination"),d(z,"class",E="mc-carousel__nav "+(e[3]?"mc-carousel__nav--mobile":"mc-carousel__nav--desktop")),d(i,"class","mc-carousel__header"),d(P,"class","mc-carousel__content"),m(P,"--carousel__container-width-space",e[10]+"px"),m(P,"--carousel__items-count",e[4]),m(P,"--carousel__item-width-space",e[11]+"px"),m(P,"--carousel__items-visible",e[9]),m(P,"--carousel__scrollbar-left",M),m(P,"--carousel__container-separate-item-size",B+"px"),d(O,"class","mc-carousel__body"),m(O,"--carousel__accessibility-focus-padding",J+"px"),d(t,"class","mc-carousel")},m(l,o){s(l,t,o),u(t,i),u(i,a),Q&&Q.m(a,null),u(a,$),u(a,v),p(k,v,null),u(i,y),u(i,z),p(j,z,null),u(z,V),p(S,z,null),u(t,N),u(t,O),u(O,P);for(let e=0;e<G.length;e+=1)G[e]&&G[e].m(P,null);e[25](O),F=!0,R||(q=b(O,"scroll",e[14]),R=!0)},p(e,t){e[1]?D?l(D,e[1])?(Q.d(1),Q=C(e),D=e[1],Q.c(),Q.m(a,$)):Q.p(e,t):(Q=C(e),D=e[1],Q.c(),Q.m(a,$)):D&&(Q.d(1),Q=null,D=e[1]);const i={};4&t[0]&&(i.label=e[2]),k.$set(i);const s={};128&t[0]&&(s.disabled=e[7]),j.$set(s);const o={};if(256&t[0]&&(o.disabled=e[8]),S.$set(o),(!F||8&t[0]&&E!==(E="mc-carousel__nav "+(e[3]?"mc-carousel__nav--mobile":"mc-carousel__nav--desktop")))&&d(z,"class",E),32800&t[0]){let i;for(T=e[5],i=0;i<T.length;i+=1){const s=H(e,T,i);G[i]?(G[i].p(s,t),h(G[i],1)):(G[i]=I(s),G[i].c(),h(G[i],1),G[i].m(P,null))}for(L(),i=T.length;i<G.length;i+=1)K(i);f()}(!F||1024&t[0])&&m(P,"--carousel__container-width-space",e[10]+"px"),(!F||16&t[0])&&m(P,"--carousel__items-count",e[4]),(!F||2048&t[0])&&m(P,"--carousel__item-width-space",e[11]+"px"),(!F||512&t[0])&&m(P,"--carousel__items-visible",e[9])},i(e){if(!F){h(k.$$.fragment,e),h(j.$$.fragment,e),h(S.$$.fragment,e);for(let e=0;e<T.length;e+=1)h(G[e]);F=!0}},o(e){w(k.$$.fragment,e),w(j.$$.fragment,e),w(S.$$.fragment,e),G=G.filter(Boolean);for(let e=0;e<G.length;e+=1)w(G[e]);F=!1},d(i){i&&x(t),Q&&Q.d(i),_(k),_(j),_(S),g(G,i),e[25](null),R=!1,q()}}}let B=16,J=4,M=0;function O(e,t){return t?e*B:(e-1)*B}function P(e,t,i){let s,a,l,o,n,r,c,d,m,{title:u}=t,{titletag:p="h1"}=t,{subtitlelink:b}=t,{mobile:h=!1}=t,{options:f}=t,{items:w}=t;const x=window.matchMedia("(max-width: 679px)"),_=window.matchMedia("(min-width: 680px) and (max-width: 1279px)"),g=window.matchMedia("(min-width: 1280px)"),y={s:{itemsVisible:1,hasHalfItemVisible:!0},m:{itemsVisible:3,hasHalfItemVisible:!1},xl:{itemsVisible:5,hasHalfItemVisible:!1}};let z,j=new E($(),v()),L=function(e,t){return t.matches?"xl":e.matches?"m":"s"}(_,g),W=!0,S=!1;function A(e){z.scrollTo({behavior:"smooth",left:function(){if(!n)return z.scrollLeft+e*(z.clientWidth+B-2*J);const t=function(){const e=O(o,n);return n?(z.clientWidth-e)/c:(z.clientWidth-e)/o}();return W?z.scrollLeft+(e*(z.clientWidth-3/4*t-B)+J):S?z.scrollLeft+e*(z.clientWidth-3/4*t-B):z.scrollLeft+e*(z.clientWidth-t/2-B+2*J)}()})}function H(e,t){return j.dispatch("carousel-item-clicked",e),t}function C(e,t){return e.matches&&i(19,L=t),e}k((()=>{x.onchange=e=>{C(e,"s")},_.onchange=e=>{C(e,"m")},g.onchange=e=>{C(e,"xl")}}));return e.$$set=e=>{"title"in e&&i(0,u=e.title),"titletag"in e&&i(1,p=e.titletag),"subtitlelink"in e&&i(2,b=e.subtitlelink),"mobile"in e&&i(3,h=e.mobile),"options"in e&&i(17,f=e.options),"items"in e&&i(18,w=e.items)},e.$$.update=()=>{262144&e.$$.dirty[0]&&i(5,s=w?JSON.parse(w):[]),131072&e.$$.dirty[0]&&i(23,a=f?Object.assign({},y,JSON.parse(f)):y),32&e.$$.dirty[0]&&i(22,l=null==s?void 0:s.length),8912896&e.$$.dirty[0]&&i(21,o=a[L].itemsVisible),8912896&e.$$.dirty[0]&&i(20,n=a[L].hasHalfItemVisible||!1),6291456&e.$$.dirty[0]&&i(4,r=l<o?o:l),3145728&e.$$.dirty[0]&&i(9,c=n?o+.5:o),3145728&e.$$.dirty[0]&&i(11,d=O(o,n)),16&e.$$.dirty[0]&&i(10,m=(r-1)*B)},[u,p,b,h,r,s,z,W,S,c,m,d,function(){A(1)},function(){A(-1)},function(){i(7,W=(null==z?void 0:z.scrollLeft)<=0),i(8,S=(null==z?void 0:z.scrollWidth)-(null==z?void 0:z.scrollLeft)<=z.offsetWidth)},H,function(e){return j.dispatch("carousel-link-clicked",{}),e},f,w,L,n,o,l,a,(e,t)=>H(e,t),function(e){V[e?"unshift":"push"]((()=>{z=e,i(6,z)}))}]}class F extends e{constructor(e){super();const o=document.createElement("style");o.textContent='@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){}@media screen and (min-width: 680px){@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){}}@media screen and (min-width: 1024px){@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){}}@media screen and (min-width: 1280px){@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){}}@media screen and (min-width: 1920px){@supports (width: -webkit-fill-available) or (width: -moz-available) or (width: stretch){}}@media screen and (min-width: 680px){}@media screen and (min-width: 1024px){}@media screen and (min-width: 1280px){}@media screen and (min-width: 1920px){}@media screen and (min-width: 1024px){}.mc-carousel{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:1rem}.mc-carousel__header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.mc-carousel__titles{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:0.25rem}.mc-carousel__nav{gap:0.5rem}.mc-carousel__nav--mobile{display:none}.mc-carousel__nav--desktop{display:-webkit-box;display:-ms-flexbox;display:flex}.mc-carousel__body{position:relative;overflow-x:auto;overflow-y:hidden;padding:var(--carousel__accessibility-focus-padding)}.mc-carousel__content{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-column-gap:var(--carousel__container-separate-item-size);-moz-column-gap:var(--carousel__container-separate-item-size);column-gap:var(--carousel__container-separate-item-size);width:calc((100% - var(--carousel__item-width-space)) / var(--carousel__items-visible) * var(--carousel__items-count) + var(--carousel__container-width-space));margin-bottom:1.25rem}.mc-carousel__item{display:-webkit-box;display:-ms-flexbox;display:flex;background:none;border:none;margin:0;padding:0;cursor:pointer;width:calc((100% - var(--carousel__item-width-space)) / var(--carousel__items-visible));position:relative}.mc-carousel__item::after{border-radius:2px;-webkit-box-shadow:0 0 0 0 transparent;box-shadow:0 0 0 0 transparent;content:"";display:block;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;-webkit-transition:-webkit-box-shadow 200ms ease;transition:-webkit-box-shadow 200ms ease;-o-transition:box-shadow 200ms ease;transition:box-shadow 200ms ease;transition:box-shadow 200ms ease, -webkit-box-shadow 200ms ease}.mc-carousel__item:focus::after{-webkit-box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #0b96cc;box-shadow:0 0 0 0.125rem #ffffff, 0 0 0 0.25rem #0b96cc}::-webkit-scrollbar{border-radius:0.25rem;height:6px;background:#e6e6e6;border-top:1px solid white;border-bottom:1px solid white}::-webkit-scrollbar-thumb{background:#333333;border-radius:6px}',this.shadowRoot.appendChild(o),t(this,{target:this.shadowRoot,props:i(this.attributes),customElement:!0},P,N,l,{title:0,titletag:1,subtitlelink:2,mobile:3,options:17,items:18},null,[-1,-1]),e&&(e.target&&s(e.target,this,e.anchor),e.props&&(this.$set(e.props),a()))}static get observedAttributes(){return["title","titletag","subtitlelink","mobile","options","items"]}get title(){return this.$$.ctx[0]}set title(e){this.$$set({title:e}),a()}get titletag(){return this.$$.ctx[1]}set titletag(e){this.$$set({titletag:e}),a()}get subtitlelink(){return this.$$.ctx[2]}set subtitlelink(e){this.$$set({subtitlelink:e}),a()}get mobile(){return this.$$.ctx[3]}set mobile(e){this.$$set({mobile:e}),a()}get options(){return this.$$.ctx[17]}set options(e){this.$$set({options:e}),a()}get items(){return this.$$.ctx[18]}set items(e){this.$$set({items:e}),a()}}export{F as default};
 //# sourceMappingURL=Carousel.js.map

package/public/components/carousel/Carousel.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Carousel.js","sources":["../../../src/components/carousel/Carousel.svelte"],"sourcesContent":["<svelte:options tag={null} />\n\n<script lang=\"ts\">\n import type {\n CarouselDevice,\n CarouselItem,\n CarouselOptions,\n CarouselTitleTag,\n } from './carousel.types';\n import Link from '../link/Link.nested.svelte';\n import CarouselCard from './CarouselCard.nested.svelte';\n import Button from '../button/Button.nested.svelte';\n import { EventHandler } from '../../utilities/EventHandler';\n import { onMount } from 'svelte';\n import {\n get_current_component,\n createEventDispatcher,\n } from 'svelte/internal';\n\n export let title: string;\n export let titletag: CarouselTitleTag = 'h1';\n export let subtitlelink: string;\n export let mobile = false;\n export let options: string;\n export let items: string;\n\n const mediaQueryS: MediaQueryList = window.matchMedia('(max-width: 679px)');\n const mediaQueryM: MediaQueryList = window.matchMedia(\n '(min-width: 680px) and (max-width: 1279px)',\n );\n const mediaQueryXL: MediaQueryList = window.matchMedia('(min-width: 1280px)');\n\n // default options for all 3 screen sizes (s = <m ; m = >=m to <xl ; xl = >=xl)\n const defaultCarouselOptions: CarouselOptions = {\n s: {\n itemsVisible: 1,\n hasHalfItemVisible: true,\n },\n m: {\n itemsVisible: 3,\n hasHalfItemVisible: false,\n },\n xl: {\n itemsVisible: 5,\n hasHalfItemVisible: false,\n },\n };\n\n // size using to separate item. Useful for gap in css and for move the scroll.\n let betweenItemsPixelSize = 16;\n\n // needed padding to display the outlined focus border on carousel items\n let accessibilityFocusPadding = 4;\n\n let eventHandler = new EventHandler(\n get_current_component(),\n createEventDispatcher(),\n );\n\n let currentDevice: CarouselDevice = initCurrentDevice(\n mediaQueryM,\n mediaQueryXL,\n );\n\n let carouselContainer: HTMLDivElement;\n let carouselScrollbarLeft = 0;\n\n let isScrollBeginning = true;\n let isScrollEnd = false;\n\n $: carouselItems = items ? (JSON.parse(items) as CarouselItem[]) : [];\n $: carouselOptions = options\n ? Object.assign(\n {},\n defaultCarouselOptions,\n JSON.parse(options) as CarouselOptions,\n )\n : defaultCarouselOptions;\n $: carouselItemsSize = carouselItems?.length;\n\n $: carouselCurrentItemsVisible = carouselOptions[currentDevice].itemsVisible;\n $: carouselCurrentHasHalfItemVisible =\n carouselOptions[currentDevice].hasHalfItemVisible \|\| false;\n $: carouselCurrentItemsSize =\n carouselItemsSize < carouselCurrentItemsVisible\n ? carouselCurrentItemsVisible\n : carouselItemsSize;\n\n $: carouselCurrentItemsVisibleAndHalf = carouselCurrentHasHalfItemVisible\n ? carouselCurrentItemsVisible + 0.5\n : carouselCurrentItemsVisible;\n\n $: carouselItemWidthSpace = getCarouselItemsWidthSpace(\n carouselCurrentItemsVisible,\n carouselCurrentHasHalfItemVisible,\n );\n $: carouselContainerWidthSpace = getCarouselContainerWidthSpace(\n carouselCurrentItemsSize,\n );\n\n /* returns the total size of the spacing between items for the big container /\n function getCarouselContainerWidthSpace(totalItems: number) {\n return (totalItems - 1) betweenItemsPixelSize;\n }\n\n /* returns the total size of the spacing between items for the screen size /\n function getCarouselItemsWidthSpace(\n itemsVisible: number,\n itemsAndHalfVisible: boolean,\n ) {\n if (itemsAndHalfVisible) {\n return itemsVisible betweenItemsPixelSize;\n }\n return (itemsVisible - 1) * betweenItemsPixelSize;\n }\n\n /* move the scroll to change the displaying items.\n 1 to move right, -1 to move left\n /\n function moveScroll(signe: 1 \| -1) {\n / returns the size in pixel of an item according to screen size and the number of items visible. /\n function getCarouselItemWidth() {\n const carouselItemsWidthSpace = getCarouselItemsWidthSpace(\n carouselCurrentItemsVisible,\n carouselCurrentHasHalfItemVisible,\n );\n if (carouselCurrentHasHalfItemVisible) {\n return (\n (carouselContainer.clientWidth - carouselItemsWidthSpace) /\n carouselCurrentItemsVisibleAndHalf\n );\n } else {\n return (\n (carouselContainer.clientWidth - carouselItemsWidthSpace) /\n carouselCurrentItemsVisible\n );\n }\n }\n\n / returns the new left position of the scrollbar\n * in the case of visible half items, the calculation depends if the carousel is at the beginnind, at the end or in the middle.\n \n /\n function getLeft() {\n if (!carouselCurrentHasHalfItemVisible) {\n return (\n carouselContainer.scrollLeft +\n signe \n (carouselContainer.clientWidth +\n betweenItemsPixelSize -\n accessibilityFocusPadding 2)\n );\n }\n const itemWidth = getCarouselItemWidth();\n if (isScrollBeginning) {\n return (\n carouselContainer.scrollLeft +\n (signe \n (carouselContainer.clientWidth -\n (3 / 4) itemWidth -\n betweenItemsPixelSize) +\n accessibilityFocusPadding)\n );\n }\n if (isScrollEnd) {\n return (\n carouselContainer.scrollLeft +\n signe \n (carouselContainer.clientWidth -\n (3 / 4) itemWidth -\n betweenItemsPixelSize)\n );\n }\n return (\n carouselContainer.scrollLeft +\n signe \n (carouselContainer.clientWidth -\n itemWidth / 2 -\n betweenItemsPixelSize +\n accessibilityFocusPadding 2)\n );\n }\n\n carouselContainer.scrollTo({ behavior: 'smooth', left: getLeft() });\n }\n\n function nextCards() {\n moveScroll(1);\n }\n\n function previousCards() {\n moveScroll(-1);\n }\n\n function handleScrollCarousel() {\n isScrollBeginning = carouselContainer?.scrollLeft <= 0;\n isScrollEnd =\n carouselContainer?.scrollWidth - carouselContainer?.scrollLeft <=\n carouselContainer.offsetWidth;\n }\n\n function handleClickCard(item: CarouselItem, event: MouseEvent): MouseEvent {\n eventHandler.dispatch('carousel-item-clicked', item);\n return event;\n }\n function handleClickLink(event: MouseEvent): MouseEvent {\n eventHandler.dispatch('carousel-link-clicked', {});\n return event;\n }\n\n // returns device according to screen size\n function initCurrentDevice(\n mediaQueryM: MediaQueryList,\n mediaQueryXL: MediaQueryList,\n ) {\n if (mediaQueryXL.matches) {\n return 'xl';\n }\n if (mediaQueryM.matches) {\n return 'm';\n }\n return 's';\n }\n\n function handleMediaQueryChange(\n event: MediaQueryListEvent,\n matchingDevice: CarouselDevice,\n ): MediaQueryListEvent {\n if (event.matches) {\n currentDevice = matchingDevice;\n }\n return event;\n }\n\n onMount(() => {\n mediaQueryS.onchange = (e) => {\n handleMediaQueryChange(e, 's');\n };\n mediaQueryM.onchange = (e) => {\n handleMediaQueryChange(e, 'm');\n };\n mediaQueryXL.onchange = (e) => {\n handleMediaQueryChange(e, 'xl');\n };\n });\n</script>\n\n<div class=\"mc-carousel\">\n <div class=\"mc-carousel__header\">\n <div class=\"mc-carousel__titles\">\n {@html `<${titletag} style=\"margin:0\">${title}</${titletag}>`}\n <div class=\"mc-carousel__subtitle\">\n <Link\n href=\"#layer\"\n iconname=\"navigation-arrow-arrow--right-24px\"\n iconposition=\"right\"\n label={subtitlelink}\n on:click={handleClickLink}\n size=\"s\"\n target=\"_self\"\n />\n </div>\n </div>\n <nav\n aria-label=\"pagination\"\n class=\"mc-carousel__nav {mobile\n ? 'mc-carousel__nav--mobile'\n : 'mc-carousel__nav--desktop'}\"\n >\n <Button\n theme=\"neutral\"\n size=\"s\"\n bordered={true}\n iconmode=\"only\"\n iconname=\"navigation-arrow-arrow--left-32px\"\n aria-label=\"Previous page\"\n disabled={isScrollBeginning}\n on:click={previousCards}\n label=\"Previous\"\n loader=\"\"\n />\n <Button\n theme=\"neutral\"\n size=\"s\"\n type=\"button\"\n bordered={true}\n disabled={isScrollEnd}\n iconmode=\"only\"\n iconname=\"navigation-arrow-arrow--right-32px\"\n aria-label=\"Next Page\"\n on:click={nextCards}\n label=\"Next\"\n loader=\"\"\n />\n </nav>\n </div>\n <div\n class=\"mc-carousel__body\"\n bind:this={carouselContainer}\n on:scroll={handleScrollCarousel}\n style=\"--carousel__accessibility-focus-padding: {accessibilityFocusPadding}px;\"\n >\n <div\n class=\"mc-carousel__content\"\n style=\"\n --carousel__container-width-space: {carouselContainerWidthSpace}px;\n --carousel__items-count: {carouselCurrentItemsSize};\n --carousel__item-width-space: {carouselItemWidthSpace}px;\n --carousel__items-visible: {carouselCurrentItemsVisibleAndHalf};\n --carousel__scrollbar-left: {carouselScrollbarLeft};\n --carousel__container-separate-item-size: {betweenItemsPixelSize}px;\"\n >\n {#each carouselItems as item}\n <button\n class=\"mc-carousel__item\"\n on:click={(event) => handleClickCard(item, event)}\n >\n <CarouselCard\n title={item.title}\n imgSrc={item.imgSrc}\n imgAlt={item.imgAlt}\n />\n </button>\n {/each}\n </div>\n </div>\n</div>\n\n<style lang=\"scss\">\n @import '@mozaic-ds/styles/settings-tools/_all-settings';\n @import '@mozaic-ds/styles/components/c.button';\n @import '@mozaic-ds/styles/components/c.links';\n @import '@mozaic-ds/styles/components/c.pagination';\n\n .mc-carousel {\n display: flex;\n flex-direction: column;\n gap: $mu100;\n\n &__header {\n /* Auto layout /\n\n display: flex;\n align-items: flex-end;\n justify-content: space-between;\n }\n &__titles {\n display: flex;\n flex-direction: column;\n gap: $mu025;\n }\n &__nav {\n gap: $mu050;\n &--mobile {\n display: none;\n }\n &--desktop {\n display: flex;\n }\n }\n\n &__body {\n position: relative;\n overflow-x: auto;\n overflow-y: hidden;\n padding: var(--carousel__accessibility-focus-padding);\n }\n\n &__content {\n display: flex;\n flex-wrap: nowrap;\n column-gap: var(--carousel__container-separate-item-size);\n // the total size of the big container for all items: taille d'un item le nbre d'items + espace entre chaque item\n width: calc(\n (\n (100% - var(--carousel__item-width-space)) /\n var(--carousel__items-visible)\n ) * var(--carousel__items-count) +\n var(--carousel__container-width-space)\n );\n margin-bottom: $mu125;\n }\n\n &__item {\n display: flex;\n background: none;\n border: none;\n margin: 0;\n padding: 0;\n cursor: pointer;\n // taille d'un item: (100% - les espaces entre chaque item isible) / le nombre d'items visible\n width: calc(\n (100% - var(--carousel__item-width-space)) /\n var(--carousel__items-visible)\n );\n @include set-focus-floating-base();\n\n &:focus {\n @include set-focus-floating();\n }\n }\n\n &-footer {\n display: flex;\n flex-direction: column;\n }\n }\n\n ::-webkit-scrollbar {\n border-radius: $mu025;\n height: 6px;\n background: $color-grey-100;\n border-top: 1px solid white;\n border-bottom: 1px solid white;\n }\n\n ::-webkit-scrollbar-thumb {\n background: $color-grey-800;\n border-radius: 6px;\n }\n</style>\n"],"names":["title","ctx","imgSrc","imgAlt","insert","target","button","anchor","dirty","carouselcard_changes","length","i","carouselScrollbarLeft","betweenItemsPixelSize","accessibilityFocusPadding","div5","append","div2","div1","div0","nav","div4","div3","html_tag","p","raw_value","each_blocks","getCarouselItemsWidthSpace","itemsVisible","itemsAndHalfVisible","$$props","titletag","subtitlelink","mobile","options","items","mediaQueryS","window","matchMedia","mediaQueryM","mediaQueryXL","defaultCarouselOptions","s","hasHalfItemVisible","m","xl","carouselContainer","eventHandler","EventHandler","get_current_component","createEventDispatcher","currentDevice","matches","initCurrentDevice","isScrollBeginning","isScrollEnd","moveScroll","signe","scrollTo","behavior","left","carouselCurrentHasHalfItemVisible","scrollLeft","clientWidth","itemWidth","carouselItemsWidthSpace","carouselCurrentItemsVisible","carouselCurrentItemsVisibleAndHalf","getCarouselItemWidth","getLeft","handleClickCard","item","event","dispatch","handleMediaQueryChange","matchingDevice","$$invalidate","onMount","onchange","e","carouselItems","JSON","parse","carouselOptions","Object","assign","carouselItemsSize","carouselCurrentItemsSize","carouselItemWidthSpace","carouselContainerWidthSpace","scrollWidth","offsetWidth","$$value"],"mappings":"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"}
1	+ {"version":3,"file":"Carousel.js","sources":["../../../src/components/carousel/Carousel.svelte"],"sourcesContent":["<svelte:options tag={null} />\n\n<script lang=\"ts\">\n import type {\n CarouselDevice,\n CarouselItem,\n CarouselOptions,\n CarouselTitleTag,\n } from './carousel.types';\n import Link from '../link/Link.nested.svelte';\n import CarouselCard from './CarouselCard.nested.svelte';\n import Button from '../button/Button.nested.svelte';\n import { EventHandler } from '../../utilities/EventHandler';\n import { onMount } from 'svelte';\n import {\n get_current_component,\n createEventDispatcher,\n } from 'svelte/internal';\n\n export let title: string;\n export let titletag: CarouselTitleTag = 'h1';\n export let subtitlelink: string;\n export let mobile = false;\n export let options: string;\n export let items: string;\n\n const mediaQueryS: MediaQueryList = window.matchMedia('(max-width: 679px)');\n const mediaQueryM: MediaQueryList = window.matchMedia(\n '(min-width: 680px) and (max-width: 1279px)',\n );\n const mediaQueryXL: MediaQueryList = window.matchMedia('(min-width: 1280px)');\n\n // default options for all 3 screen sizes (s = <m ; m = >=m to <xl ; xl = >=xl)\n const defaultCarouselOptions: CarouselOptions = {\n s: {\n itemsVisible: 1,\n hasHalfItemVisible: true,\n },\n m: {\n itemsVisible: 3,\n hasHalfItemVisible: false,\n },\n xl: {\n itemsVisible: 5,\n hasHalfItemVisible: false,\n },\n };\n\n // size using to separate item. Useful for gap in css and for move the scroll.\n let betweenItemsPixelSize = 16;\n\n // needed padding to display the outlined focus border on carousel items\n let accessibilityFocusPadding = 4;\n\n let eventHandler = new EventHandler(\n get_current_component(),\n createEventDispatcher(),\n );\n\n let currentDevice: CarouselDevice = initCurrentDevice(\n mediaQueryM,\n mediaQueryXL,\n );\n\n let carouselContainer: HTMLDivElement;\n let carouselScrollbarLeft = 0;\n\n let isScrollBeginning = true;\n let isScrollEnd = false;\n\n $: carouselItems = items ? (JSON.parse(items) as CarouselItem[]) : [];\n $: carouselOptions = options\n ? Object.assign(\n {},\n defaultCarouselOptions,\n JSON.parse(options) as CarouselOptions,\n )\n : defaultCarouselOptions;\n $: carouselItemsSize = carouselItems?.length;\n\n $: carouselCurrentItemsVisible = carouselOptions[currentDevice].itemsVisible;\n $: carouselCurrentHasHalfItemVisible =\n carouselOptions[currentDevice].hasHalfItemVisible \|\| false;\n $: carouselCurrentItemsSize =\n carouselItemsSize < carouselCurrentItemsVisible\n ? carouselCurrentItemsVisible\n : carouselItemsSize;\n\n $: carouselCurrentItemsVisibleAndHalf = carouselCurrentHasHalfItemVisible\n ? carouselCurrentItemsVisible + 0.5\n : carouselCurrentItemsVisible;\n\n $: carouselItemWidthSpace = getCarouselItemsWidthSpace(\n carouselCurrentItemsVisible,\n carouselCurrentHasHalfItemVisible,\n );\n $: carouselContainerWidthSpace = getCarouselContainerWidthSpace(\n carouselCurrentItemsSize,\n );\n\n /* returns the total size of the spacing between items for the big container /\n function getCarouselContainerWidthSpace(totalItems: number) {\n return (totalItems - 1) betweenItemsPixelSize;\n }\n\n /* returns the total size of the spacing between items for the screen size /\n function getCarouselItemsWidthSpace(\n itemsVisible: number,\n itemsAndHalfVisible: boolean,\n ) {\n if (itemsAndHalfVisible) {\n return itemsVisible betweenItemsPixelSize;\n }\n return (itemsVisible - 1) * betweenItemsPixelSize;\n }\n\n /* move the scroll to change the displaying items.\n 1 to move right, -1 to move left\n /\n function moveScroll(signe: 1 \| -1) {\n / returns the size in pixel of an item according to screen size and the number of items visible. /\n function getCarouselItemWidth() {\n const carouselItemsWidthSpace = getCarouselItemsWidthSpace(\n carouselCurrentItemsVisible,\n carouselCurrentHasHalfItemVisible,\n );\n if (carouselCurrentHasHalfItemVisible) {\n return (\n (carouselContainer.clientWidth - carouselItemsWidthSpace) /\n carouselCurrentItemsVisibleAndHalf\n );\n } else {\n return (\n (carouselContainer.clientWidth - carouselItemsWidthSpace) /\n carouselCurrentItemsVisible\n );\n }\n }\n\n / returns the new left position of the scrollbar\n * in the case of visible half items, the calculation depends if the carousel is at the beginnind, at the end or in the middle.\n \n /\n function getLeft() {\n if (!carouselCurrentHasHalfItemVisible) {\n return (\n carouselContainer.scrollLeft +\n signe \n (carouselContainer.clientWidth +\n betweenItemsPixelSize -\n accessibilityFocusPadding 2)\n );\n }\n const itemWidth = getCarouselItemWidth();\n if (isScrollBeginning) {\n return (\n carouselContainer.scrollLeft +\n (signe \n (carouselContainer.clientWidth -\n (3 / 4) itemWidth -\n betweenItemsPixelSize) +\n accessibilityFocusPadding)\n );\n }\n if (isScrollEnd) {\n return (\n carouselContainer.scrollLeft +\n signe \n (carouselContainer.clientWidth -\n (3 / 4) itemWidth -\n betweenItemsPixelSize)\n );\n }\n return (\n carouselContainer.scrollLeft +\n signe \n (carouselContainer.clientWidth -\n itemWidth / 2 -\n betweenItemsPixelSize +\n accessibilityFocusPadding 2)\n );\n }\n\n carouselContainer.scrollTo({ behavior: 'smooth', left: getLeft() });\n }\n\n function nextCards() {\n moveScroll(1);\n }\n\n function previousCards() {\n moveScroll(-1);\n }\n\n function handleScrollCarousel() {\n isScrollBeginning = carouselContainer?.scrollLeft <= 0;\n isScrollEnd =\n carouselContainer?.scrollWidth - carouselContainer?.scrollLeft <=\n carouselContainer.offsetWidth;\n }\n\n function handleClickCard(item: CarouselItem, event: MouseEvent): MouseEvent {\n eventHandler.dispatch('carousel-item-clicked', item);\n return event;\n }\n function handleClickLink(event: MouseEvent): MouseEvent {\n eventHandler.dispatch('carousel-link-clicked', {});\n return event;\n }\n\n // returns device according to screen size\n function initCurrentDevice(\n mediaQueryM: MediaQueryList,\n mediaQueryXL: MediaQueryList,\n ) {\n if (mediaQueryXL.matches) {\n return 'xl';\n }\n if (mediaQueryM.matches) {\n return 'm';\n }\n return 's';\n }\n\n function handleMediaQueryChange(\n event: MediaQueryListEvent,\n matchingDevice: CarouselDevice,\n ): MediaQueryListEvent {\n if (event.matches) {\n currentDevice = matchingDevice;\n }\n return event;\n }\n\n onMount(() => {\n mediaQueryS.onchange = (e) => {\n handleMediaQueryChange(e, 's');\n };\n mediaQueryM.onchange = (e) => {\n handleMediaQueryChange(e, 'm');\n };\n mediaQueryXL.onchange = (e) => {\n handleMediaQueryChange(e, 'xl');\n };\n });\n</script>\n\n<div class=\"mc-carousel\">\n <div class=\"mc-carousel__header\">\n <div class=\"mc-carousel__titles\">\n <svelte:element this={titletag} style=\"margin:0\">{title}</svelte:element>\n <div class=\"mc-carousel__subtitle\">\n <Link\n href=\"#layer\"\n iconname=\"navigation-arrow-arrow--right-24px\"\n iconposition=\"right\"\n label={subtitlelink}\n on:click={handleClickLink}\n size=\"s\"\n target=\"_self\"\n />\n </div>\n </div>\n <nav\n aria-label=\"pagination\"\n class=\"mc-carousel__nav {mobile\n ? 'mc-carousel__nav--mobile'\n : 'mc-carousel__nav--desktop'}\"\n >\n <Button\n theme=\"neutral\"\n size=\"s\"\n bordered={true}\n iconmode=\"only\"\n iconname=\"navigation-arrow-arrow--left-32px\"\n aria-label=\"Previous page\"\n disabled={isScrollBeginning}\n on:click={previousCards}\n label=\"Previous\"\n loader=\"\"\n />\n <Button\n theme=\"neutral\"\n size=\"s\"\n type=\"button\"\n bordered={true}\n disabled={isScrollEnd}\n iconmode=\"only\"\n iconname=\"navigation-arrow-arrow--right-32px\"\n aria-label=\"Next Page\"\n on:click={nextCards}\n label=\"Next\"\n loader=\"\"\n />\n </nav>\n </div>\n <div\n class=\"mc-carousel__body\"\n bind:this={carouselContainer}\n on:scroll={handleScrollCarousel}\n style=\"--carousel__accessibility-focus-padding: {accessibilityFocusPadding}px;\"\n >\n <div\n class=\"mc-carousel__content\"\n style=\"\n --carousel__container-width-space: {carouselContainerWidthSpace}px;\n --carousel__items-count: {carouselCurrentItemsSize};\n --carousel__item-width-space: {carouselItemWidthSpace}px;\n --carousel__items-visible: {carouselCurrentItemsVisibleAndHalf};\n --carousel__scrollbar-left: {carouselScrollbarLeft};\n --carousel__container-separate-item-size: {betweenItemsPixelSize}px;\"\n >\n {#each carouselItems as item}\n <button\n class=\"mc-carousel__item\"\n on:click={(event) => handleClickCard(item, event)}\n >\n <CarouselCard\n title={item.title}\n imgSrc={item.imgSrc}\n imgAlt={item.imgAlt}\n />\n </button>\n {/each}\n </div>\n </div>\n</div>\n\n<style lang=\"scss\">\n @import '@mozaic-ds/styles/settings-tools/_all-settings';\n @import '@mozaic-ds/styles/components/c.button';\n @import '@mozaic-ds/styles/components/c.links';\n @import '@mozaic-ds/styles/components/c.pagination';\n\n .mc-carousel {\n display: flex;\n flex-direction: column;\n gap: $mu100;\n\n &__header {\n /* Auto layout /\n\n display: flex;\n align-items: flex-end;\n justify-content: space-between;\n }\n &__titles {\n display: flex;\n flex-direction: column;\n gap: $mu025;\n }\n &__nav {\n gap: $mu050;\n &--mobile {\n display: none;\n }\n &--desktop {\n display: flex;\n }\n }\n\n &__body {\n position: relative;\n overflow-x: auto;\n overflow-y: hidden;\n padding: var(--carousel__accessibility-focus-padding);\n }\n\n &__content {\n display: flex;\n flex-wrap: nowrap;\n column-gap: var(--carousel__container-separate-item-size);\n // the total size of the big container for all items: taille d'un item le nbre d'items + espace entre chaque item\n width: calc(\n (\n (100% - var(--carousel__item-width-space)) /\n var(--carousel__items-visible)\n ) * var(--carousel__items-count) +\n var(--carousel__container-width-space)\n );\n margin-bottom: $mu125;\n }\n\n &__item {\n display: flex;\n background: none;\n border: none;\n margin: 0;\n padding: 0;\n cursor: pointer;\n // taille d'un item: (100% - les espaces entre chaque item isible) / le nombre d'items visible\n width: calc(\n (100% - var(--carousel__item-width-space)) /\n var(--carousel__items-visible)\n );\n @include set-focus-floating-base();\n\n &:focus {\n @include set-focus-floating();\n }\n }\n\n &-footer {\n display: flex;\n flex-direction: column;\n }\n }\n\n ::-webkit-scrollbar {\n border-radius: $mu025;\n height: 6px;\n background: $color-grey-100;\n border-top: 1px solid white;\n border-bottom: 1px solid white;\n }\n\n ::-webkit-scrollbar-thumb {\n background: $color-grey-800;\n border-radius: 6px;\n }\n</style>\n"],"names":["ctx","svelte_element","style","insert","target","anchor","title","imgSrc","imgAlt","button","dirty","carouselcard_changes","create_dynamic_element","length","i","carouselScrollbarLeft","betweenItemsPixelSize","accessibilityFocusPadding","div5","append","div2","div1","div0","nav","div4","div3","each_blocks","getCarouselItemsWidthSpace","itemsVisible","itemsAndHalfVisible","$$props","titletag","subtitlelink","mobile","options","items","mediaQueryS","window","matchMedia","mediaQueryM","mediaQueryXL","defaultCarouselOptions","s","hasHalfItemVisible","m","xl","carouselContainer","eventHandler","EventHandler","get_current_component","createEventDispatcher","currentDevice","matches","initCurrentDevice","isScrollBeginning","isScrollEnd","moveScroll","signe","scrollTo","behavior","left","carouselCurrentHasHalfItemVisible","scrollLeft","clientWidth","itemWidth","carouselItemsWidthSpace","carouselCurrentItemsVisible","carouselCurrentItemsVisibleAndHalf","getCarouselItemWidth","getLeft","handleClickCard","item","event","dispatch","handleMediaQueryChange","matchingDevice","$$invalidate","onMount","onchange","e","carouselItems","JSON","parse","carouselOptions","Object","assign","carouselItemsSize","carouselCurrentItemsSize","carouselItemWidthSpace","carouselContainerWidthSpace","scrollWidth","offsetWidth","$$value"],"mappings":"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"}

package/public/components/carousel/Carousel.svelte CHANGED Viewed

@@ -248,7 +248,7 @@
 <div class="mc-carousel">
   <div class="mc-carousel__header">
     <div class="mc-carousel__titles">
-      {@html `<${titletag} style="margin:0">${title}</${titletag}>`}
+      <svelte:element this={titletag} style="margin:0">{title}</svelte:element>
       <div class="mc-carousel__subtitle">
         <Link
           href="#layer"