@mozaic-ds/web-components 1.0.0-beta.4 → 1.0.0-beta.6

package/dist/components/linearprogressbarbuffer/LinearProgressbarBuffer.js

@@ -1,4 +1,7 @@
-import{c as d,p as u,a as c,b as n,f as b,t as f,e as m,d as g,h,i as p,j as v,r as w}from"../../custom-element.js";import{c as _,s as z}from"../../attributes.js";var y=b('<div><div class="mc-linear-progressbar-buffer__indicator svelte-1dvhw96" role="progressbar" aria-valuemin="0" aria-valuemax="100"></div></div>');const k={hash:"svelte-1dvhw96",code:`/**
+import{c as d,p as c,a as f,b as n,f as m,t as v,e as b,d as g,h as p,i as h,j as u,r as _}from"../../custom-element.js";import{a as q,s as w}from"../../attributes.js";var z=m('<div><div class="mc-linear-progressbar-buffer__indicator svelte-1qoe39t" role="progressbar" aria-valuemin="0" aria-valuemax="100"></div></div>');const y={hash:"svelte-1qoe39t",code:`/**
  * Do not edit directly, this file was auto-generated.
- */.mc-linear-progressbar-buffer.svelte-1dvhw96 {--progress-value: 40;background-color:var(--progressbar-color-background, #c9d0de);height:0.25rem;position:relative;min-width:6rem;}.mc-linear-progressbar-buffer__indicator.svelte-1dvhw96 {background-color:var(--progressbar-color-indicator, #464e63);height:100%;transition:width 0.4s ease;overflow:hidden;border-radius:var(--radius-l, 1rem);box-sizing:border-box;width:calc(var(--progress-value) * 1%);}.mc-linear-progressbar-buffer--s.svelte-1dvhw96 {height:0.125rem;}.mc-linear-progressbar-buffer--l.svelte-1dvhw96 {height:0.5rem;}`};function x(i,t){u(t,!0),c(i,k);let r=n(t,"value",7,0),s=n(t,"size",7,"m");var a=y();let l;var o=g(a);return w(a),f(e=>{l=m(a,1,"mc-linear-progressbar-buffer svelte-1dvhw96",null,l,e),_(o,`--progress-value: ${r()};`),z(o,"aria-valuenow",r())},[()=>({"mc-linear-progressbar-buffer--s":s()==="s","mc-linear-progressbar-buffer--l":s()==="l"})]),h(i,a),p({get value(){return r()},set value(e=0){r(e),v()},get size(){return s()},set size(e="m"){s(e),v()}})}customElements.define("m-linear-progressbar-buffer",d(x,{value:{},size:{}},[],[],!0));
+ */
+/**
+ * Do not edit directly, this file was auto-generated.
+ */.mc-linear-progressbar-buffer.svelte-1qoe39t {--progress-value: 40;background-color:#c9d0de;height:0.25rem;position:relative;min-width:6rem;border-radius:1rem;}.mc-linear-progressbar-buffer__indicator.svelte-1qoe39t {background-color:#464e63;height:100%;transition:width 0.4s ease;overflow:hidden;border-radius:1rem;box-sizing:border-box;width:calc(var(--progress-value) * 1%);}.mc-linear-progressbar-buffer--s.svelte-1qoe39t {height:0.125rem;}.mc-linear-progressbar-buffer--l.svelte-1qoe39t {height:0.5rem;}`};function x(i,t){c(t,!0),f(i,y);let r=n(t,"value",7,0),s=n(t,"size",7,"m");var a=z();let o;var l=g(a);return _(a),v(e=>{o=b(a,1,"mc-linear-progressbar-buffer svelte-1qoe39t",null,o,e),q(l,`--progress-value: ${r()};`),w(l,"aria-valuenow",r())},[()=>({"mc-linear-progressbar-buffer--s":s()==="s","mc-linear-progressbar-buffer--l":s()==="l"})]),p(i,a),h({get value(){return r()},set value(e=0){r(e),u()},get size(){return s()},set size(e="m"){s(e),u()}})}customElements.define("m-linear-progressbar-buffer",d(x,{value:{},size:{}},[],[],!0));
 //# sourceMappingURL=LinearProgressbarBuffer.js.map

package/dist/components/linearprogressbarbuffer/LinearProgressbarBuffer.js.map

@@ -1 +1 @@
-{"version":3,"file":"LinearProgressbarBuffer.js","sources":["../../../src/components/linearprogressbarbuffer/LinearProgressbarBuffer.svelte"],"sourcesContent":["<svelte:options customElement={{ tag: 'm-linear-progressbar-buffer' }} />\n\n<script lang=\"ts\">\n  interface Props {\n    value?: number;\n    size?: 's' | 'm' | 'l';\n  }\n\n  let { value = 0, size = 'm' }: Props = $props();\n</script>\n\n<div\n  class=\"mc-linear-progressbar-buffer\"\n  class:mc-linear-progressbar-buffer--s={size === 's'}\n  class:mc-linear-progressbar-buffer--l={size === 'l'}\n>\n  <div\n    class=\"mc-linear-progressbar-buffer__indicator\"\n    role=\"progressbar\"\n    style={`--progress-value: ${value};`}\n    aria-valuenow={value}\n    aria-valuemin=\"0\"\n    aria-valuemax=\"100\"\n  />\n</div>\n\n<style lang=\"scss\">\n  @use '@mozaic-ds/styles/components/linear-progressbar-buffer';\n</style>\n"],"names":["value","size"],"mappings":";;wlBAAA,gBAQQ,IAAAA,gBAAQ,CAAC,EAAEC,eAAO,GAAG,wIAWGD,EAAK,CAAA,GAAA,sBAClBA,GAAK,UAPiB,kCAAAC,EAAI,IAAK,IACT,kCAAAA,EAAI,IAAK,sDANlC,EAAC,6CAAS,IAAG,YAC7B"}
+{"version":3,"file":"LinearProgressbarBuffer.js","sources":["../../../src/components/linearprogressbarbuffer/LinearProgressbarBuffer.svelte"],"sourcesContent":["<svelte:options customElement={{ tag: 'm-linear-progressbar-buffer' }} />\n\n<script lang=\"ts\">\n  interface Props {\n    value?: number;\n    size?: 's' | 'm' | 'l';\n  }\n\n  let { value = 0, size = 'm' }: Props = $props();\n</script>\n\n<div\n  class=\"mc-linear-progressbar-buffer\"\n  class:mc-linear-progressbar-buffer--s={size === 's'}\n  class:mc-linear-progressbar-buffer--l={size === 'l'}\n>\n  <div\n    class=\"mc-linear-progressbar-buffer__indicator\"\n    role=\"progressbar\"\n    style={`--progress-value: ${value};`}\n    aria-valuenow={value}\n    aria-valuemin=\"0\"\n    aria-valuemax=\"100\"\n  />\n</div>\n\n<style lang=\"scss\">\n  @use '@mozaic-ds/styles/components/linear-progressbar-buffer';\n</style>\n"],"names":["value","size"],"mappings":";;;;;ihBAAA,gBAQQ,IAAAA,gBAAQ,CAAC,EAAEC,eAAO,GAAG,wIAWGD,EAAK,CAAA,GAAA,sBAClBA,GAAK,UAPiB,kCAAAC,EAAI,IAAK,IACT,kCAAAA,EAAI,IAAK,sDANlC,EAAC,6CAAS,IAAG,YAC7B"}

package/dist/components/linearprogressbarbuffer/LinearProgressbarBuffer.svelte

@@ -27,19 +27,23 @@
 <style>/**
  * Do not edit directly, this file was auto-generated.
  */
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
 .mc-linear-progressbar-buffer {
   --progress-value: 40;
-  background-color: var(--progressbar-color-background, #c9d0de);
+  background-color: #c9d0de;
   height: 0.25rem;
   position: relative;
   min-width: 6rem;
+  border-radius: 1rem;
 }
 .mc-linear-progressbar-buffer__indicator {
-  background-color: var(--progressbar-color-indicator, #464e63);
+  background-color: #464e63;
   height: 100%;
   transition: width 0.4s ease;
   overflow: hidden;
-  border-radius: var(--radius-l, 1rem);
+  border-radius: 1rem;
   box-sizing: border-box;
   width: calc(var(--progress-value) * 1%);
 }

package/dist/components/linearprogressbarpercentage/LinearProgressbarPercentage.js

@@ -1,5 +1,7 @@
-import{c as p,p as v,a as g,b as m,f as u,t as b,h as f,i as w,j as h,d as a,D as _,r as s,g as k}from"../../custom-element.js";import{c as z,s as x}from"../../attributes.js";var y=u('<div class="mc-linear-progressbar-percentage svelte-1wdkc3z"><div class="mc-linear-progressbar-percentage__indicator svelte-1wdkc3z" role="progressbar" aria-valuemin="0" aria-valuemax="100"><div class="mc-linear-progressbar-percentage__label svelte-1wdkc3z"><p class="mc-linear-progressbar-percentage__value svelte-1wdkc3z"> <span class="mc-linear-progressbar-percentage__unit svelte-1wdkc3z">%</span></p></div></div></div>');const j={hash:"svelte-1wdkc3z",code:`/**
+import{c as d,p as g,a as b,b as v,f as m,t as u,h as f,i as x,j as _,d as a,E as h,r as s,g as w}from"../../custom-element.js";import{a as y,s as z}from"../../attributes.js";var j=m('<div class="mc-linear-progressbar-percentage svelte-1x8libo"><div class="mc-linear-progressbar-percentage__indicator svelte-1x8libo" role="progressbar" aria-valuemin="0" aria-valuemax="100"><div class="mc-linear-progressbar-percentage__label svelte-1x8libo"><p class="mc-linear-progressbar-percentage__value svelte-1x8libo"> <span class="mc-linear-progressbar-percentage__unit svelte-1x8libo">%</span></p></div></div></div>');const k={hash:"svelte-1x8libo",code:`/**
  * Do not edit directly, this file was auto-generated.
- */.mc-linear-progressbar-percentage.svelte-1wdkc3z {--progress-value: 40;font-family:var(--font-family, LeroyMerlin), sans-serif;background-color:var(--progressbar-color-background, #c9d0de);height:1.5rem;position:relative;min-width:6rem;}.mc-linear-progressbar-percentage__indicator.svelte-1wdkc3z {background-color:var(--progressbar-color-indicator, #464e63);min-width:40px;height:100%;top:0;left:0;position:absolute;transition:width 0.4s ease;overflow:hidden;display:flex;justify-content:flex-end;width:calc(40px + var(--progress-value) * (100% - 40px) / 100);}.mc-linear-progressbar-percentage__label.svelte-1wdkc3z {background-color:var(--color-background-primary, #ffffff);color:var(--progressbar-color-percentage, #464e63);height:1.5rem;width:2.5rem;border:0.125rem solid var(--progressbar-color-indicator, #464e63);display:flex;align-items:center;justify-content:center;font-size:var(--font-size-50, 0.75rem);font-weight:var(--font-weight-semi-bold, 600);margin:0;}.mc-linear-progressbar-percentage.svelte-1wdkc3z,
-.mc-linear-progressbar-percentage.svelte-1wdkc3z :where(.svelte-1wdkc3z) {border-radius:var(--radius-l, 1rem);box-sizing:border-box;}`};function D(o,i){v(i,!0),g(o,j);let e=m(i,"value",7,0);var t=y(),r=a(t),l=a(r),n=a(l),c=a(n);return _(),s(n),s(l),s(r),s(t),b(()=>{z(r,`--progress-value: ${e()};`),x(r,"aria-valuenow",e()),k(c,`${e()??""} `)}),f(o,t),w({get value(){return e()},set value(d=0){e(d),h()}})}customElements.define("m-linear-progressbar-percentage",p(D,{value:{}},[],[],!0));
+ */
+/**
+ * Do not edit directly, this file was auto-generated.
+ */.mc-linear-progressbar-percentage.svelte-1x8libo {--progress-value: 40;font-family:LeroyMerlin, sans-serif;background-color:#c9d0de;height:1.5rem;position:relative;min-width:6rem;border-radius:1rem;box-sizing:border-box;}.mc-linear-progressbar-percentage__indicator.svelte-1x8libo {border-radius:1rem;background-color:#464e63;min-width:40px;height:100%;top:0;left:0;position:absolute;transition:width 0.4s ease;overflow:hidden;display:flex;justify-content:flex-end;width:calc(40px + var(--progress-value) * (100% - 40px) / 100);}.mc-linear-progressbar-percentage__label.svelte-1x8libo {box-sizing:border-box;border-radius:1rem;background-color:#ffffff;color:#171b26;height:1.5rem;width:2.5rem;border:0.125rem solid #464e63;display:flex;align-items:center;justify-content:center;}.mc-linear-progressbar-percentage__value.svelte-1x8libo {font-size:0.75rem;font-weight:600;margin:0;}.mc-linear-progressbar-percentage__unit.svelte-1x8libo {font-size:0.625rem;font-weight:600;margin:0;position:relative;bottom:1px;}`};function D(i,o){g(o,!0),b(i,k);let e=v(o,"value",7,0);var t=j(),r=a(t),l=a(r),n=a(l),c=a(n);return h(),s(n),s(l),s(r),s(t),u(()=>{y(r,`--progress-value: ${e()};`),z(r,"aria-valuenow",e()),w(c,`${e()??""} `)}),f(i,t),x({get value(){return e()},set value(p=0){e(p),_()}})}customElements.define("m-linear-progressbar-percentage",d(D,{value:{}},[],[],!0));
 //# sourceMappingURL=LinearProgressbarPercentage.js.map

package/dist/components/linearprogressbarpercentage/LinearProgressbarPercentage.js.map

@@ -1 +1 @@
-{"version":3,"file":"LinearProgressbarPercentage.js","sources":["../../../src/components/linearprogressbarpercentage/LinearProgressbarPercentage.svelte"],"sourcesContent":["<svelte:options customElement={{ tag: 'm-linear-progressbar-percentage' }} />\n\n<script lang=\"ts\">\n  interface Props {\n    value?: number;\n  }\n\n  let { value = 0 }: Props = $props();\n</script>\n\n<div class=\"mc-linear-progressbar-percentage\">\n  <div\n    class=\"mc-linear-progressbar-percentage__indicator\"\n    role=\"progressbar\"\n    style={`--progress-value: ${value};`}\n    aria-valuenow={value}\n    aria-valuemin=\"0\"\n    aria-valuemax=\"100\"\n  >\n    <div class=\"mc-linear-progressbar-percentage__label\">\n      <p class=\"mc-linear-progressbar-percentage__value\">\n        {value}\n        <span class=\"mc-linear-progressbar-percentage__unit\">%</span>\n      </p>\n    </div>\n  </div>\n</div>\n\n<style lang=\"scss\">\n  @use '@mozaic-ds/styles/components/linear-progressbar-percentage';\n</style>\n"],"names":["value"],"mappings":";;;uJAAA,gBAOQ,IAAAA,gBAAQ,CAAC,uGAOeA,EAAK,CAAA,GAAA,sBAClBA,GAAK,SAMfA,EAAK,GAAA,EAAA,GAAA,kDAdE,EAAC,YACjB"}
+{"version":3,"file":"LinearProgressbarPercentage.js","sources":["../../../src/components/linearprogressbarpercentage/LinearProgressbarPercentage.svelte"],"sourcesContent":["<svelte:options customElement={{ tag: 'm-linear-progressbar-percentage' }} />\n\n<script lang=\"ts\">\n  interface Props {\n    value?: number;\n  }\n\n  let { value = 0 }: Props = $props();\n</script>\n\n<div class=\"mc-linear-progressbar-percentage\">\n  <div\n    class=\"mc-linear-progressbar-percentage__indicator\"\n    role=\"progressbar\"\n    style={`--progress-value: ${value};`}\n    aria-valuenow={value}\n    aria-valuemin=\"0\"\n    aria-valuemax=\"100\"\n  >\n    <div class=\"mc-linear-progressbar-percentage__label\">\n      <p class=\"mc-linear-progressbar-percentage__value\">\n        {value}\n        <span class=\"mc-linear-progressbar-percentage__unit\">%</span>\n      </p>\n    </div>\n  </div>\n</div>\n\n<style lang=\"scss\">\n  @use '@mozaic-ds/styles/components/linear-progressbar-percentage';\n</style>\n"],"names":["value"],"mappings":";;;;;ugCAAA,gBAOQ,IAAAA,gBAAQ,CAAC,uGAOeA,EAAK,CAAA,GAAA,sBAClBA,GAAK,SAMfA,EAAK,GAAA,EAAA,GAAA,kDAdE,EAAC,YACjB"}

package/dist/components/linearprogressbarpercentage/LinearProgressbarPercentage.svelte

@@ -29,16 +29,22 @@
 <style>/**
  * Do not edit directly, this file was auto-generated.
  */
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
 .mc-linear-progressbar-percentage {
   --progress-value: 40;
-  font-family: var(--font-family, LeroyMerlin), sans-serif;
-  background-color: var(--progressbar-color-background, #c9d0de);
+  font-family: LeroyMerlin, sans-serif;
+  background-color: #c9d0de;
   height: 1.5rem;
   position: relative;
   min-width: 6rem;
+  border-radius: 1rem;
+  box-sizing: border-box;
 }
 .mc-linear-progressbar-percentage__indicator {
-  background-color: var(--progressbar-color-indicator, #464e63);
+  border-radius: 1rem;
+  background-color: #464e63;
   min-width: 40px;
   height: 100%;
   top: 0;
@@ -51,20 +57,26 @@
   width: calc(40px + var(--progress-value) * (100% - 40px) / 100);
 }
 .mc-linear-progressbar-percentage__label {
-  background-color: var(--color-background-primary, #ffffff);
-  color: var(--progressbar-color-percentage, #464e63);
+  box-sizing: border-box;
+  border-radius: 1rem;
+  background-color: #ffffff;
+  color: #171b26;
   height: 1.5rem;
   width: 2.5rem;
-  border: 0.125rem solid var(--progressbar-color-indicator, #464e63);
+  border: 0.125rem solid #464e63;
   display: flex;
   align-items: center;
   justify-content: center;
-  font-size: var(--font-size-50, 0.75rem);
-  font-weight: var(--font-weight-semi-bold, 600);
+}
+.mc-linear-progressbar-percentage__value {
+  font-size: 0.75rem;
+  font-weight: 600;
   margin: 0;
 }
-.mc-linear-progressbar-percentage,
-.mc-linear-progressbar-percentage * {
-  border-radius: var(--radius-l, 1rem);
-  box-sizing: border-box;
+.mc-linear-progressbar-percentage__unit {
+  font-size: 0.625rem;
+  font-weight: 600;
+  margin: 0;
+  position: relative;
+  bottom: 1px;
 }</style>

package/dist/components/link/Link.js

@@ -1,4 +1,7 @@
-import{c as q,p as A,a as B,b as t,f as p,z as F,s as y,d as c,h as x,i as G,j as i,r as f}from"../../custom-element.js";import{i as z}from"../../if.js";import{s as _}from"../../slot.js";import{a as H}from"../../attributes.js";var I=p('<span class="mc-link__icon svelte-nebcxl"><!></span>'),J=p('<span class="mc-link__icon svelte-nebcxl"><!></span>'),K=p('<a><!> <span class="mc-link__label svelte-nebcxl"><!></span> <!></a>');const M={hash:"svelte-nebcxl",code:`/**
+import{c as q,p as A,a as B,b as i,f as g,D as F,s as y,d as c,h as x,i as G,j as l,r as f}from"../../custom-element.js";import{i as z}from"../../if.js";import{s as _}from"../../slot.js";import{b as H}from"../../attributes.js";var I=g('<span class="mc-link__icon svelte-bxn02o"><!></span>'),J=g('<span class="mc-link__icon svelte-bxn02o"><!></span>'),K=g('<a><!> <span class="mc-link__label svelte-bxn02o"><!></span> <!></a>');const M={hash:"svelte-bxn02o",code:`/**
  * Do not edit directly, this file was auto-generated.
- */.mc-link.svelte-nebcxl {transition:box-shadow 200ms ease;display:inline-flex;align-items:center;justify-content:center;gap:0.25rem;min-height:1.5rem;text-decoration:none;color:var(--link-color-text-primary, #000000);font-size:0.875rem;}.mc-link__label.svelte-nebcxl {line-height:1.3;}.mc-link__icon.svelte-nebcxl {display:block;height:1.25rem;width:1.25rem;flex-shrink:0;fill:currentcolor;}.mc-link.svelte-nebcxl:hover:not(.mc-link--stand-alone, .mc-link--inline) .mc-link__label:where(.svelte-nebcxl) {text-decoration:underline;}.mc-link.svelte-nebcxl:focus {box-shadow:0 0 0 0.125rem var(--focus-color-mid, var(--focus-color-outline-mid, #ffffff)), 0 0 0 0.25rem var(--focus-color-outer, var(--focus-color-outline-outer, #000000));outline:0.125rem solid transparent;outline-offset:0.125rem;}.mc-link--m.svelte-nebcxl {min-height:2rem;font-size:1rem;}.mc-link--secondary.svelte-nebcxl {color:var(--link-color-text-secondary, #666666);}.mc-link--accent.svelte-nebcxl {color:var(--link-color-text-accent, #117f03);}.mc-link--inverse.svelte-nebcxl {--focus-color-mid: var(--focus-color-outline-outer, #000000);--focus-color-outer: var(--focus-color-outline-mid, #ffffff);color:var(--link-color-text-inverse, #ffffff);}.mc-link--stand-alone.svelte-nebcxl {min-height:2rem;font-weight:var(--link-font-weight, 600);}.mc-link--stand-alone.svelte-nebcxl .mc-link__label:where(.svelte-nebcxl) {border-bottom:var(--border-s, 1px) solid currentColor;}.mc-link--stand-alone.svelte-nebcxl:hover .mc-link__label:where(.svelte-nebcxl) {border-color:transparent;}.mc-link--inline.svelte-nebcxl {font-weight:inherit;text-decoration:underline;}.mc-link--inline.svelte-nebcxl .mc-link__label:where(.svelte-nebcxl) {line-height:1;}.mc-link--inline.svelte-nebcxl:hover {text-decoration:none;}`};function N(g,n){A(n,!0),B(g,M);let m=t(n,"href",7),d=t(n,"target",7),v=t(n,"appearance",7,void 0),u=t(n,"disabled",7,!1),b=t(n,"size",7,"m"),h=t(n,"inline",7,!1),r=t(n,"iconposition",7,void 0),j=F(n,["$$slots","$$events","$$legacy","$$host","href","target","appearance","disabled","size","inline","iconposition"]);function C(e,l,s){const o=["mc-link"];return e&&o.push(`mc-link--${e}`),l&&o.push(`mc-link--${l}`),s?o.push("mc-link--inline"):o.push("mc-link--stand-alone"),o.join(" ")}var a=K();H(a,e=>({href:m(),target:d(),class:`${e??""} ${u()?"is-disabled":""} `,...j}),[()=>C(v(),b(),h())],void 0,"svelte-nebcxl");var w=c(a);{var D=e=>{var l=I(),s=c(l);_(s,n,"icon",{}),f(l),x(e,l)};z(w,e=>{r()==="left"&&e(D)})}var k=y(w,2),E=c(k);_(E,n,"default",{}),f(k);var L=y(k,2);{var S=e=>{var l=J(),s=c(l);_(s,n,"icon",{}),f(l),x(e,l)};z(L,e=>{r()==="right"&&e(S)})}return f(a),x(g,a),G({get href(){return m()},set href(e){m(e),i()},get target(){return d()},set target(e){d(e),i()},get appearance(){return v()},set appearance(e=void 0){v(e),i()},get disabled(){return u()},set disabled(e=!1){u(e),i()},get size(){return b()},set size(e="m"){b(e),i()},get inline(){return h()},set inline(e=!1){h(e),i()},get iconposition(){return r()},set iconposition(e=void 0){r(e),i()}})}customElements.define("m-link",q(N,{href:{},target:{},appearance:{},disabled:{},size:{},inline:{},iconposition:{}},["icon","default"],[],!0));
+ */
+/**
+ * Do not edit directly, this file was auto-generated.
+ */.mc-link.svelte-bxn02o {transition:box-shadow 200ms ease;display:inline-flex;align-items:center;justify-content:center;gap:0.25rem;min-height:1.5rem;text-decoration:none;color:#000000;font-size:0.875rem;}.mc-link__label.svelte-bxn02o {line-height:1.3;}.mc-link__icon.svelte-bxn02o {display:block;height:1.25rem;width:1.25rem;flex-shrink:0;fill:currentcolor;}.mc-link.svelte-bxn02o:hover:not(.mc-link--stand-alone, .mc-link--inline) .mc-link__label:where(.svelte-bxn02o) {text-decoration:underline;}.mc-link.svelte-bxn02o:focus {box-shadow:0 0 0 0.125rem var(--focus-color-mid, #ffffff), 0 0 0 0.25rem var(--focus-color-outer, #000000);outline:0.125rem solid transparent;outline-offset:0.125rem;}.mc-link--m.svelte-bxn02o {min-height:2rem;font-size:1rem;}.mc-link--secondary.svelte-bxn02o {color:#666666;}.mc-link--accent.svelte-bxn02o {color:#117f03;}.mc-link--inverse.svelte-bxn02o {--focus-color-mid: #000000;--focus-color-outer: #ffffff;color:#ffffff;}.mc-link--stand-alone.svelte-bxn02o {min-height:2rem;font-weight:600;}.mc-link--stand-alone.svelte-bxn02o .mc-link__label:where(.svelte-bxn02o) {border-bottom:1px solid currentColor;}.mc-link--stand-alone.svelte-bxn02o:hover .mc-link__label:where(.svelte-bxn02o) {border-color:transparent;}.mc-link--inline.svelte-bxn02o {font-weight:inherit;text-decoration:underline;}.mc-link--inline.svelte-bxn02o .mc-link__label:where(.svelte-bxn02o) {line-height:1;}.mc-link--inline.svelte-bxn02o:hover {text-decoration:none;}`};function N(p,n){A(n,!0),B(p,M);let m=i(n,"href",7),d=i(n,"target",7),b=i(n,"appearance",7,void 0),h=i(n,"disabled",7,!1),v=i(n,"size",7,"m"),u=i(n,"inline",7,!1),a=i(n,"iconposition",7,void 0),j=F(n,["$$slots","$$events","$$legacy","$$host","href","target","appearance","disabled","size","inline","iconposition"]);function D(e,t,o){const s=["mc-link"];return e&&s.push(`mc-link--${e}`),t&&s.push(`mc-link--${t}`),o?s.push("mc-link--inline"):s.push("mc-link--stand-alone"),s.join(" ")}var r=K();H(r,e=>({href:m(),target:d(),class:`${e??""} ${h()?"is-disabled":""} `,...j}),[()=>D(b(),v(),u())],void 0,"svelte-bxn02o");var w=c(r);{var C=e=>{var t=I(),o=c(t);_(o,n,"icon",{}),f(t),x(e,t)};z(w,e=>{a()==="left"&&e(C)})}var k=y(w,2),E=c(k);_(E,n,"default",{}),f(k);var L=y(k,2);{var S=e=>{var t=J(),o=c(t);_(o,n,"icon",{}),f(t),x(e,t)};z(L,e=>{a()==="right"&&e(S)})}return f(r),x(p,r),G({get href(){return m()},set href(e){m(e),l()},get target(){return d()},set target(e){d(e),l()},get appearance(){return b()},set appearance(e=void 0){b(e),l()},get disabled(){return h()},set disabled(e=!1){h(e),l()},get size(){return v()},set size(e="m"){v(e),l()},get inline(){return u()},set inline(e=!1){u(e),l()},get iconposition(){return a()},set iconposition(e=void 0){a(e),l()}})}customElements.define("m-link",q(N,{href:{},target:{},appearance:{},disabled:{},size:{},inline:{},iconposition:{}},["icon","default"],[],!0));
 //# sourceMappingURL=Link.js.map

package/dist/components/link/Link.js.map

@@ -1 +1 @@
-{"version":3,"file":"Link.js","sources":["../../../src/components/link/Link.svelte"],"sourcesContent":["<svelte:options customElement=\"m-link\" />\n\n<script lang=\"ts\">\n  import type { LinkIconPosition, LinkSize, LinkStyle } from './link.types';\n  interface Props {\n    href: string;\n    target: string;\n    appearance?: LinkStyle;\n    disabled?: boolean;\n    size?: LinkSize;\n    inline?: boolean;\n    iconposition?: LinkIconPosition | undefined;\n    [key: string]: any;\n  }\n\n  let {\n    href,\n    target,\n    appearance = undefined,\n    disabled = false,\n    size = 'm',\n    inline = false,\n    iconposition = undefined,\n    ...events\n  }: Props = $props();\n\n  function setClasses(\n    appearance: LinkStyle,\n    size: LinkSize,\n    inline: boolean,\n  ): string {\n    const classes = ['mc-link'];\n\n    if (appearance) {\n      classes.push(`mc-link--${appearance}`);\n    }\n    if (size) {\n      classes.push(`mc-link--${size}`);\n    }\n    if (inline) {\n      classes.push('mc-link--inline');\n    } else {\n      classes.push('mc-link--stand-alone');\n    }\n    return classes.join(' ');\n  }\n</script>\n\n<a\n  {href}\n  {target}\n  class=\"{setClasses(appearance, size, inline)} {disabled\n    ? 'is-disabled'\n    : ''} \"\n  {...events}\n>\n  {#if iconposition === 'left'}\n    <span class=\"mc-link__icon\">\n      <slot name=\"icon\" />\n    </span>\n  {/if}\n  <span class=\"mc-link__label\">\n    <slot />\n  </span>\n  {#if iconposition === 'right'}\n    <span class=\"mc-link__icon\">\n      <slot name=\"icon\" />\n    </span>\n  {/if}\n</a>\n\n<style lang=\"scss\">\n  @use '@mozaic-ds/styles/components/link';\n</style>\n"],"names":["href","$.prop","$$props","target","appearance","disabled","size","inline","iconposition","events","$.rest_props","setClasses","classes","$$render","consequent","consequent_1"],"mappings":";;iwDAAA,oBAgBIA,EAAIC,EAAAC,EAAA,OAAA,CAAA,EACJC,EAAMF,EAAAC,EAAA,SAAA,CAAA,EACNE,qBAAa,MAAS,EACtBC,mBAAW,EAAK,EAChBC,eAAO,GAAG,EACVC,iBAAS,EAAK,EACdC,uBAAe,MAAS,EACrBC,EAAAC,EAAAR,EAAA,mHAGI,SAAAS,EACPP,EACAE,EACAC,EACQ,CACF,MAAAK,GAAW,SAAS,EAEtB,OAAAR,GACFQ,EAAQ,KAAI,YAAaR,CAAU,EAAA,EAEjCE,GACFM,EAAQ,KAAI,YAAaN,CAAI,EAAA,EAE3BC,EACFK,EAAQ,KAAK,iBAAiB,EAE9BA,EAAQ,KAAK,sBAAsB,EAE9BA,EAAQ,KAAK,GAAG,CACzB,0DAM+CP,IAC3C,cACA,EAAE,OACFI,IAHI,CAAA,IAAAE,EAAWP,EAAU,EAAEE,IAAMC,EAAM,CAAA,CAAA,uGAKtCC,MAAiB,QAAMK,EAAAC,CAAA,gIAQvBN,MAAiB,SAAOK,EAAAE,CAAA,sKA9Cd,OAAS,qDACX,GAAK,6CACT,IAAG,iDACD,GAAK,6DACC,OAAS,YAwB5B"}
+{"version":3,"file":"Link.js","sources":["../../../src/components/link/Link.svelte"],"sourcesContent":["<svelte:options customElement=\"m-link\" />\n\n<script lang=\"ts\">\n  import type { LinkIconPosition, LinkSize, LinkStyle } from './link.types';\n  interface Props {\n    href: string;\n    target: string;\n    appearance?: LinkStyle;\n    disabled?: boolean;\n    size?: LinkSize;\n    inline?: boolean;\n    iconposition?: LinkIconPosition | undefined;\n    [key: string]: any;\n  }\n\n  let {\n    href,\n    target,\n    appearance = undefined,\n    disabled = false,\n    size = 'm',\n    inline = false,\n    iconposition = undefined,\n    ...events\n  }: Props = $props();\n\n  function setClasses(\n    appearance: LinkStyle,\n    size: LinkSize,\n    inline: boolean,\n  ): string {\n    const classes = ['mc-link'];\n\n    if (appearance) {\n      classes.push(`mc-link--${appearance}`);\n    }\n    if (size) {\n      classes.push(`mc-link--${size}`);\n    }\n    if (inline) {\n      classes.push('mc-link--inline');\n    } else {\n      classes.push('mc-link--stand-alone');\n    }\n    return classes.join(' ');\n  }\n</script>\n\n<a\n  {href}\n  {target}\n  class=\"{setClasses(appearance, size, inline)} {disabled\n    ? 'is-disabled'\n    : ''} \"\n  {...events}\n>\n  {#if iconposition === 'left'}\n    <span class=\"mc-link__icon\">\n      <slot name=\"icon\" />\n    </span>\n  {/if}\n  <span class=\"mc-link__label\">\n    <slot />\n  </span>\n  {#if iconposition === 'right'}\n    <span class=\"mc-link__icon\">\n      <slot name=\"icon\" />\n    </span>\n  {/if}\n</a>\n\n<style lang=\"scss\">\n  @use '@mozaic-ds/styles/components/link';\n</style>\n"],"names":["href","$.prop","$$props","target","appearance","disabled","size","inline","iconposition","events","$.rest_props","setClasses","classes","$$render","consequent","consequent_1"],"mappings":";;;;;k9CAAA,oBAgBIA,EAAIC,EAAAC,EAAA,OAAA,CAAA,EACJC,EAAMF,EAAAC,EAAA,SAAA,CAAA,EACNE,qBAAa,MAAS,EACtBC,mBAAW,EAAK,EAChBC,eAAO,GAAG,EACVC,iBAAS,EAAK,EACdC,uBAAe,MAAS,EACrBC,EAAAC,EAAAR,EAAA,mHAGI,SAAAS,EACPP,EACAE,EACAC,EACQ,CACF,MAAAK,GAAW,SAAS,EAEtB,OAAAR,GACFQ,EAAQ,KAAI,YAAaR,CAAU,EAAA,EAEjCE,GACFM,EAAQ,KAAI,YAAaN,CAAI,EAAA,EAE3BC,EACFK,EAAQ,KAAK,iBAAiB,EAE9BA,EAAQ,KAAK,sBAAsB,EAE9BA,EAAQ,KAAK,GAAG,CACzB,0DAM+CP,IAC3C,cACA,EAAE,OACFI,IAHI,CAAA,IAAAE,EAAWP,EAAU,EAAEE,IAAMC,EAAM,CAAA,CAAA,uGAKtCC,MAAiB,QAAMK,EAAAC,CAAA,gIAQvBN,MAAiB,SAAOK,EAAAE,CAAA,sKA9Cd,OAAS,qDACX,GAAK,6CACT,IAAG,iDACD,GAAK,6DACC,OAAS,YAwB5B"}

package/dist/components/link/Link.svelte

@@ -72,6 +72,9 @@
 <style>/**
  * Do not edit directly, this file was auto-generated.
  */
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
 .mc-link {
   transition: box-shadow 200ms ease;
   display: inline-flex;
@@ -80,7 +83,7 @@
   gap: 0.25rem;
   min-height: 1.5rem;
   text-decoration: none;
-  color: var(--link-color-text-primary, #000000);
+  color: #000000;
   font-size: 0.875rem;
 }
 .mc-link__label {
@@ -97,7 +100,7 @@
   text-decoration: underline;
 }
 .mc-link:focus {
-  box-shadow: 0 0 0 0.125rem var(--focus-color-mid, var(--focus-color-outline-mid, #ffffff)), 0 0 0 0.25rem var(--focus-color-outer, var(--focus-color-outline-outer, #000000));
+  box-shadow: 0 0 0 0.125rem var(--focus-color-mid, #ffffff), 0 0 0 0.25rem var(--focus-color-outer, #000000);
   outline: 0.125rem solid transparent;
   outline-offset: 0.125rem;
 }
@@ -106,22 +109,22 @@
   font-size: 1rem;
 }
 .mc-link--secondary {
-  color: var(--link-color-text-secondary, #666666);
+  color: #666666;
 }
 .mc-link--accent {
-  color: var(--link-color-text-accent, #117f03);
+  color: #117f03;
 }
 .mc-link--inverse {
-  --focus-color-mid: var(--focus-color-outline-outer, #000000);
-  --focus-color-outer: var(--focus-color-outline-mid, #ffffff);
-  color: var(--link-color-text-inverse, #ffffff);
+  --focus-color-mid: #000000;
+  --focus-color-outer: #ffffff;
+  color: #ffffff;
 }
 .mc-link--stand-alone {
   min-height: 2rem;
-  font-weight: var(--link-font-weight, 600);
+  font-weight: 600;
 }
 .mc-link--stand-alone .mc-link__label {
-  border-bottom: var(--border-s, 1px) solid currentColor;
+  border-bottom: 1px solid currentColor;
 }
 .mc-link--stand-alone:hover .mc-link__label {
   border-color: transparent;

package/dist/components/loader/Loader.js

@@ -1,10 +1,13 @@
-import{c as C,p as B,a as j,b as h,f as u,s as L,d,t as _,B as R,e as D,h as p,i as E,j as v,r as n,g as S}from"../../custom-element.js";import{i as V}from"../../if.js";import{s as f}from"../../attributes.js";var q=u('<span class="mc-loader__text svelte-12gr7md"> </span>'),A=u('<div><span class="mc-loader__spinner svelte-12gr7md"><svg class="mc-loader__icon svelte-12gr7md" xmlns="http://www.w3.org/2000/svg"><circle class="mc-loader__path svelte-12gr7md" cx="50%" cy="50%"></circle></svg></span> <!></div>');const F={hash:"svelte-12gr7md",code:`/**
+import{c as C,p as B,a as j,b as h,f as u,s as D,d as n,t as _,u as L,e as R,h as p,i as E,j as k,r as i,g as S}from"../../custom-element.js";import{i as V}from"../../if.js";import{s as f}from"../../attributes.js";var q=u('<span class="mc-loader__text svelte-ekl442"> </span>'),A=u('<div><span class="mc-loader__spinner svelte-ekl442"><svg class="mc-loader__icon svelte-ekl442" xmlns="http://www.w3.org/2000/svg"><circle class="mc-loader__path svelte-ekl442" cx="50%" cy="50%"></circle></svg></span> <!></div>');const F={hash:"svelte-ekl442",code:`/**
  * Do not edit directly, this file was auto-generated.
- */.mc-loader.svelte-12gr7md {color:var(--loader-color-standard, #464e63);align-items:center;display:inline-flex;flex-direction:column;}.mc-loader.svelte-12gr7md .mc-loader__spinner:where(.svelte-12gr7md) {height:2rem;width:2rem;}.mc-loader.svelte-12gr7md .mc-loader__path:where(.svelte-12gr7md) {stroke-width:4;}.mc-loader.svelte-12gr7md .mc-loader__path:where(.svelte-12gr7md) {stroke:currentColor;}.mc-loader__spinner.svelte-12gr7md:not(:only-child) {margin-bottom:1rem;}.mc-loader__icon.svelte-12gr7md {
-  animation: svelte-12gr7md-rotate-loader 2s linear infinite;transform-origin:center;}.mc-loader__path.svelte-12gr7md {fill:none;stroke-dasharray:1, 200;stroke-dashoffset:0;stroke-linecap:round;
-  animation: svelte-12gr7md-animate-dash-loader 2s ease-in-out infinite;}.mc-loader__text.svelte-12gr7md {font-size:var(--font-size-150, 1rem);color:currentcolor;}.mc-loader.svelte-12gr7md:not(.mc-loader--text-visible) .mc-loader__text:where(.svelte-12gr7md) {clip-path:inset(100%);clip:rect(1px, 1px, 1px, 1px);height:1px;overflow:hidden;position:absolute;white-space:nowrap;padding:0;width:1px;}.mc-loader--xs.svelte-12gr7md .mc-loader__spinner:where(.svelte-12gr7md) {height:1.25rem;width:1.25rem;}.mc-loader--xs.svelte-12gr7md .mc-loader__path:where(.svelte-12gr7md) {stroke-width:2;}.mc-loader--s.svelte-12gr7md .mc-loader__spinner:where(.svelte-12gr7md) {height:1.5rem;width:1.5rem;}.mc-loader--s.svelte-12gr7md .mc-loader__path:where(.svelte-12gr7md) {stroke-width:4;}.mc-loader--l.svelte-12gr7md .mc-loader__spinner:where(.svelte-12gr7md) {height:4rem;width:4rem;}.mc-loader--l.svelte-12gr7md .mc-loader__path:where(.svelte-12gr7md) {stroke-width:8;}.mc-loader--accent.svelte-12gr7md {color:var(--loader-color-accent, #117f03);}.mc-loader--accent.svelte-12gr7md .mc-loader__path:where(.svelte-12gr7md) {stroke:currentColor;}.mc-loader--inverse.svelte-12gr7md {color:var(--loader-color-inverse, #ffffff);}.mc-loader--inverse.svelte-12gr7md .mc-loader__path:where(.svelte-12gr7md) {stroke:currentColor;}
+ */
+/**
+ * Do not edit directly, this file was auto-generated.
+ */.mc-loader.svelte-ekl442 {color:#464e63;align-items:center;display:inline-flex;flex-direction:column;}.mc-loader.svelte-ekl442 .mc-loader__spinner:where(.svelte-ekl442) {height:2rem;width:2rem;}.mc-loader.svelte-ekl442 .mc-loader__path:where(.svelte-ekl442) {stroke-width:4;}.mc-loader.svelte-ekl442 .mc-loader__path:where(.svelte-ekl442) {stroke:currentColor;}.mc-loader__spinner.svelte-ekl442:not(:only-child) {margin-bottom:1rem;}.mc-loader__icon.svelte-ekl442 {
+  animation: svelte-ekl442-rotate-loader 2s linear infinite;transform-origin:center;}.mc-loader__path.svelte-ekl442 {fill:none;stroke-dasharray:1, 200;stroke-dashoffset:0;stroke-linecap:round;
+  animation: svelte-ekl442-animate-dash-loader 2s ease-in-out infinite;}.mc-loader__text.svelte-ekl442 {font-size:1rem;color:currentcolor;}.mc-loader.svelte-ekl442:not(.mc-loader--text-visible) .mc-loader__text:where(.svelte-ekl442) {clip-path:inset(100%);clip:rect(1px, 1px, 1px, 1px);height:1px;overflow:hidden;position:absolute;white-space:nowrap;padding:0;width:1px;}.mc-loader--xs.svelte-ekl442 .mc-loader__spinner:where(.svelte-ekl442) {height:1.25rem;width:1.25rem;}.mc-loader--xs.svelte-ekl442 .mc-loader__path:where(.svelte-ekl442) {stroke-width:2;}.mc-loader--s.svelte-ekl442 .mc-loader__spinner:where(.svelte-ekl442) {height:1.5rem;width:1.5rem;}.mc-loader--s.svelte-ekl442 .mc-loader__path:where(.svelte-ekl442) {stroke-width:4;}.mc-loader--l.svelte-ekl442 .mc-loader__spinner:where(.svelte-ekl442) {height:4rem;width:4rem;}.mc-loader--l.svelte-ekl442 .mc-loader__path:where(.svelte-ekl442) {stroke-width:8;}.mc-loader--accent.svelte-ekl442 {color:#117f03;}.mc-loader--accent.svelte-ekl442 .mc-loader__path:where(.svelte-ekl442) {stroke:currentColor;}.mc-loader--inverse.svelte-ekl442 {color:#ffffff;}.mc-loader--inverse.svelte-ekl442 .mc-loader__path:where(.svelte-ekl442) {stroke:currentColor;}
 
-@keyframes svelte-12gr7md-rotate-loader {
+@keyframes svelte-ekl442-rotate-loader {
   0% {
     transform: rotate(0deg);
   }
@@ -12,7 +15,7 @@ import{c as C,p as B,a as j,b as h,f as u,s as L,d,t as _,B as R,e as D,h as p,i
     transform: rotate(270deg);
   }
 }
-@keyframes svelte-12gr7md-animate-dash-loader {
+@keyframes svelte-ekl442-animate-dash-loader {
   0% {
     stroke-dasharray: 1, 200;
     stroke-dashoffset: 0;
@@ -25,5 +28,5 @@ import{c as C,p as B,a as j,b as h,f as u,s as L,d,t as _,B as R,e as D,h as p,i
     stroke-dasharray: 89, 200;
     stroke-dashoffset: -124px;
   }
-}`};function G(g,a){B(a,!0),j(g,F);let s=h(a,"size",7),m=h(a,"theme",7),l=h(a,"text",7);function w(e,r){const t=["mc-loader"];return e&&t.push(`mc-loader--${e}`),r&&t.push(`mc-loader--${r}`),t.join(" ")}function x(e){let r;switch(e){case"s":r="0 0 24 24";break;case"l":r="0 0 64 64";break;default:r="0 0 32 32"}return r}function k(e){let r;switch(e){case"s":r=6;break;case"l":r=19;break;default:r=9}return r}var o=A(),c=d(o),i=d(c),y=d(i);n(i),n(c);var b=L(c,2);{var z=e=>{var r=q(),t=d(r,!0);n(r),_(()=>S(t,l())),p(e,r)};V(b,e=>{l()&&e(z)})}return n(o),_((e,r,t)=>{D(o,1,e,"svelte-12gr7md"),f(i,"viewBox",r),f(y,"r",t)},[()=>R(w(s(),m())),()=>x(s()),()=>k(s())]),p(g,o),E({get size(){return s()},set size(e){s(e),v()},get theme(){return m()},set theme(e){m(e),v()},get text(){return l()},set text(e){l(e),v()}})}customElements.define("m-loader",C(G,{size:{},theme:{},text:{}},[],[],!0));export{G as L};
+}`};function G(v,s){B(s,!0),j(v,F);let l=h(s,"size",7),c=h(s,"theme",7),a=h(s,"text",7);function w(e,t){const r=["mc-loader"];return e&&r.push(`mc-loader--${e}`),t&&r.push(`mc-loader--${t}`),r.join(" ")}function x(e){let t;switch(e){case"s":t="0 0 24 24";break;case"l":t="0 0 64 64";break;default:t="0 0 32 32"}return t}function g(e){let t;switch(e){case"s":t=6;break;case"l":t=19;break;default:t=9}return t}var o=A(),d=n(o),m=n(d),y=n(m);i(m),i(d);var b=D(d,2);{var z=e=>{var t=q(),r=n(t,!0);i(t),_(()=>S(r,a())),p(e,t)};V(b,e=>{a()&&e(z)})}return i(o),_((e,t,r)=>{R(o,1,e,"svelte-ekl442"),f(m,"viewBox",t),f(y,"r",r)},[()=>L(w(l(),c())),()=>x(l()),()=>g(l())]),p(v,o),E({get size(){return l()},set size(e){l(e),k()},get theme(){return c()},set theme(e){c(e),k()},get text(){return a()},set text(e){a(e),k()}})}customElements.define("m-loader",C(G,{size:{},theme:{},text:{}},[],[],!0));export{G as L};
 //# sourceMappingURL=Loader.js.map

package/dist/components/loader/Loader.js.map

@@ -1 +1 @@
-{"version":3,"file":"Loader.js","sources":["../../../src/components/loader/Loader.svelte"],"sourcesContent":["<svelte:options customElement={{ tag: 'm-loader' }} />\n\n<script lang=\"ts\">\n  import type { LoaderSize, LoaderTheme } from './loader.types';\n\n  interface Props {\n    size: LoaderSize;\n    theme: LoaderTheme;\n    text?: string;\n  }\n\n  let { size, theme, text }: Props = $props();\n\n  function setClasses(size: LoaderSize, theme: LoaderTheme) {\n    const classes = ['mc-loader'];\n\n    if (size) {\n      classes.push(`mc-loader--${size}`);\n    }\n\n    if (theme) {\n      classes.push(`mc-loader--${theme}`);\n    }\n\n    return classes.join(' ');\n  }\n\n  function setViewBox(size: LoaderSize) {\n    let viewBox: string;\n\n    switch (size) {\n      case 's':\n        viewBox = '0 0 24 24';\n        break;\n      case 'l':\n        viewBox = '0 0 64 64';\n        break;\n      default:\n        viewBox = '0 0 32 32';\n    }\n\n    return viewBox;\n  }\n\n  function setCircleRadius(size: LoaderSize) {\n    let circleRadius: number;\n\n    switch (size) {\n      case 's':\n        circleRadius = 6;\n        break;\n      case 'l':\n        circleRadius = 19;\n        break;\n      default:\n        circleRadius = 9;\n    }\n\n    return circleRadius;\n  }\n</script>\n\n<div class={setClasses(size, theme)}>\n  <span class=\"mc-loader__spinner\">\n    <svg\n      class=\"mc-loader__icon\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox={setViewBox(size)}\n    >\n      <circle\n        class=\"mc-loader__path\"\n        cx=\"50%\"\n        cy=\"50%\"\n        r={setCircleRadius(size)}\n      />\n    </svg>\n  </span>\n\n  {#if text}\n    <span class=\"mc-loader__text\">\n      {text}\n    </span>\n  {/if}\n</div>\n\n<style lang=\"scss\">\n  @use '@mozaic-ds/styles/components/loader';\n</style>\n"],"names":["size","$.prop","$$props","theme","text","setClasses","classes","setViewBox","viewBox","setCircleRadius","circleRadius","$$render","consequent"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;mBAAA,oBAWQA,EAAIC,EAAAC,EAAA,OAAA,CAAA,EAAEC,EAAKF,EAAAC,EAAA,QAAA,CAAA,EAAEE,EAAIH,EAAAC,EAAA,OAAA,CAAA,EAEd,SAAAG,EAAWL,EAAkBG,EAAoB,CAClD,MAAAG,GAAW,WAAW,EAExB,OAAAN,GACFM,EAAQ,KAAI,cAAeN,CAAI,EAAA,EAG7BG,GACFG,EAAQ,KAAI,cAAeH,CAAK,EAAA,EAG3BG,EAAQ,KAAK,GAAG,CACzB,UAESC,EAAWP,EAAkB,KAChCQ,SAEIR,EAAI,KACL,IACHQ,EAAU,sBAEP,IACHA,EAAU,0BAGVA,EAAU,mBAGPA,CACT,UAESC,EAAgBT,EAAkB,KACrCU,SAEIV,EAAI,KACL,IACHU,EAAe,YAEZ,IACHA,EAAe,iBAGfA,EAAe,SAGZA,CACT,qGAqBKN,EAAI,CAAA,CAAA,kBAFJA,EAAI,GAAAO,EAAAC,CAAA,0FAhBCP,EAAWL,EAAI,EAAEG,EAAK,CAAA,CAAA,EAKnB,IAAAI,EAAWP,GAAI,EAMnB,IAAAS,EAAgBT,EAAI,CAAA,wJAb/B"}
+{"version":3,"file":"Loader.js","sources":["../../../src/components/loader/Loader.svelte"],"sourcesContent":["<svelte:options customElement={{ tag: 'm-loader' }} />\n\n<script lang=\"ts\">\n  import type { LoaderSize, LoaderTheme } from './loader.types';\n\n  interface Props {\n    size: LoaderSize;\n    theme: LoaderTheme;\n    text?: string;\n  }\n\n  let { size, theme, text }: Props = $props();\n\n  function setClasses(size: LoaderSize, theme: LoaderTheme) {\n    const classes = ['mc-loader'];\n\n    if (size) {\n      classes.push(`mc-loader--${size}`);\n    }\n\n    if (theme) {\n      classes.push(`mc-loader--${theme}`);\n    }\n\n    return classes.join(' ');\n  }\n\n  function setViewBox(size: LoaderSize) {\n    let viewBox: string;\n\n    switch (size) {\n      case 's':\n        viewBox = '0 0 24 24';\n        break;\n      case 'l':\n        viewBox = '0 0 64 64';\n        break;\n      default:\n        viewBox = '0 0 32 32';\n    }\n\n    return viewBox;\n  }\n\n  function setCircleRadius(size: LoaderSize) {\n    let circleRadius: number;\n\n    switch (size) {\n      case 's':\n        circleRadius = 6;\n        break;\n      case 'l':\n        circleRadius = 19;\n        break;\n      default:\n        circleRadius = 9;\n    }\n\n    return circleRadius;\n  }\n</script>\n\n<div class={setClasses(size, theme)}>\n  <span class=\"mc-loader__spinner\">\n    <svg\n      class=\"mc-loader__icon\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox={setViewBox(size)}\n    >\n      <circle\n        class=\"mc-loader__path\"\n        cx=\"50%\"\n        cy=\"50%\"\n        r={setCircleRadius(size)}\n      />\n    </svg>\n  </span>\n\n  {#if text}\n    <span class=\"mc-loader__text\">\n      {text}\n    </span>\n  {/if}\n</div>\n\n<style lang=\"scss\">\n  @use '@mozaic-ds/styles/components/loader';\n</style>\n"],"names":["size","$.prop","$$props","theme","text","setClasses","classes","setViewBox","viewBox","setCircleRadius","circleRadius","$$render","consequent"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;mBAAA,oBAWQA,EAAIC,EAAAC,EAAA,OAAA,CAAA,EAAEC,EAAKF,EAAAC,EAAA,QAAA,CAAA,EAAEE,EAAIH,EAAAC,EAAA,OAAA,CAAA,EAEd,SAAAG,EAAWL,EAAkBG,EAAoB,CAClD,MAAAG,GAAW,WAAW,EAExB,OAAAN,GACFM,EAAQ,KAAI,cAAeN,CAAI,EAAA,EAG7BG,GACFG,EAAQ,KAAI,cAAeH,CAAK,EAAA,EAG3BG,EAAQ,KAAK,GAAG,CACzB,UAESC,EAAWP,EAAkB,KAChCQ,SAEIR,EAAI,KACL,IACHQ,EAAU,sBAEP,IACHA,EAAU,0BAGVA,EAAU,mBAGPA,CACT,UAESC,EAAgBT,EAAkB,KACrCU,SAEIV,EAAI,KACL,IACHU,EAAe,YAEZ,IACHA,EAAe,iBAGfA,EAAe,SAGZA,CACT,qGAqBKN,EAAI,CAAA,CAAA,kBAFJA,EAAI,GAAAO,EAAAC,CAAA,yFAhBCP,EAAWL,EAAI,EAAEG,EAAK,CAAA,CAAA,EAKnB,IAAAI,EAAWP,GAAI,EAMnB,IAAAS,EAAgBT,EAAI,CAAA,wJAb/B"}

package/dist/components/loader/Loader.svelte

@@ -86,8 +86,11 @@
 <style>/**
  * Do not edit directly, this file was auto-generated.
  */
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
 .mc-loader {
-  color: var(--loader-color-standard, #464e63);
+  color: #464e63;
   align-items: center;
   display: inline-flex;
   flex-direction: column;
@@ -117,7 +120,7 @@
   animation: animate-dash-loader 2s ease-in-out infinite;
 }
 .mc-loader__text {
-  font-size: var(--font-size-150, 1rem);
+  font-size: 1rem;
   color: currentcolor;
 }
 .mc-loader:not(.mc-loader--text-visible) .mc-loader__text {
@@ -152,13 +155,13 @@
   stroke-width: 8;
 }
 .mc-loader--accent {
-  color: var(--loader-color-accent, #117f03);
+  color: #117f03;
 }
 .mc-loader--accent .mc-loader__path {
   stroke: currentColor;
 }
 .mc-loader--inverse {
-  color: var(--loader-color-inverse, #ffffff);
+  color: #ffffff;
 }
 .mc-loader--inverse .mc-loader__path {
   stroke: currentColor;

package/dist/components/modal/Modal.js

@@ -1,16 +1,19 @@
-import{n as P,c as Q,p as R,a as U,b as i,f as c,s,d as r,t as M,e as V,g as S,h as m,i as W,j as d,r as a}from"../../custom-element.js";import{i as u}from"../../if.js";import{s as f}from"../../slot.js";import{s as X}from"../../attributes.js";import{C as Z}from"../../Cross24.js";import{O as $}from"../overlay/Overlay.js";import"../../legacy.js";function ee(z,o){o(!1);const l=new CustomEvent("update:open",{detail:o(),bubbles:!0,composed:!0});this.dispatchEvent(l)}var te=c('<span class="mc-modal__icon svelte-11mv4zz"><!></span>'),oe=c('<button type="button" class="mc-modal__close mc-button mc-button--icon-button mc-button--ghost svelte-11mv4zz" aria-label="Close"><span class="mc-modal__icon svelte-11mv4zz"><!></span></button>'),re=c('<p class="svelte-11mv4zz"> </p>'),ae=c('<span class="mc-modal__link svelte-11mv4zz"><!></span>'),ne=c('<footer class="mc-modal__footer svelte-11mv4zz"><!> <!></footer>'),le=c('<section tabindex="-1" aria-labelledby="modalTitle"><div class="mc-modal__dialog svelte-11mv4zz" role="document"><header class="mc-modal__header svelte-11mv4zz"><!> <h2 class="mc-modal__title svelte-11mv4zz" id="modalTitle"> </h2> <!></header> <main class="mc-modal__body svelte-11mv4zz"><!> <!></main> <!></div> <!></section>');const ie={hash:"svelte-11mv4zz",code:`/**
+import{n as P,c as Q,p as R,a as U,b as l,f as c,s,d as r,t as M,e as V,g as S,h as m,i as W,j as d,r as a}from"../../custom-element.js";import{i as f}from"../../if.js";import{s as b}from"../../slot.js";import{s as X}from"../../attributes.js";import{C as Z}from"../../Cross24.js";import{O as $}from"../overlay/Overlay.js";import"../../legacy.js";function ee(_,o){o(!1);const n=new CustomEvent("update:open",{detail:o(),bubbles:!0,composed:!0});this.dispatchEvent(n)}var te=c('<span class="mc-modal__icon svelte-19ke250"><!></span>'),oe=c('<button type="button" class="mc-modal__close mc-button mc-button--icon-button mc-button--ghost svelte-19ke250" aria-label="Close"><span class="mc-modal__icon svelte-19ke250"><!></span></button>'),re=c('<p class="svelte-19ke250"> </p>'),ae=c('<span class="mc-modal__link svelte-19ke250"><!></span>'),ie=c('<footer class="mc-modal__footer svelte-19ke250"><!> <!></footer>'),ne=c('<section tabindex="-1" aria-labelledby="modalTitle"><div class="mc-modal__dialog svelte-19ke250" role="document"><header class="mc-modal__header svelte-19ke250"><!> <h2 class="mc-modal__title svelte-19ke250" id="modalTitle"> </h2> <!></header> <main class="mc-modal__body svelte-19ke250"><!> <!></main> <!></div> <!></section>');const le={hash:"svelte-19ke250",code:`/**
  * Do not edit directly, this file was auto-generated.
- */.mc-modal.svelte-11mv4zz {box-sizing:border-box;inset:0;outline:0;pointer-events:none;position:fixed;z-index:var(--modal-z-index, 3);display:flex;justify-content:center;align-items:flex-end;overflow:hidden auto;}
-@media (width >= 680px) {.mc-modal.svelte-11mv4zz {align-items:center;}
-}.mc-modal__dialog.svelte-11mv4zz {background:var(--modal-color-background, #ffffff);display:flex;flex-direction:column;opacity:0;position:relative;transform:translateY(-25%);transition:visibility 0s linear 0.4s, transform 0.4s ease, opacity 0.4s ease;visibility:hidden;width:100%;border-radius:var(--radius-l, 1rem) var(--radius-l, 1rem) 0 0;z-index:3;}
-@media (width >= 680px) {.mc-modal__dialog.svelte-11mv4zz {width:38rem;border-radius:var(--radius-l, 1rem);}
-}.mc-modal.is-open.svelte-11mv4zz .mc-modal__dialog:where(.svelte-11mv4zz) {opacity:1;pointer-events:all;transform:translateY(0);transition:visibility 0s linear 0s, transform 0.4s ease, opacity 0.4s ease;visibility:visible;}.mc-modal__header.svelte-11mv4zz {align-items:center;display:flex;gap:0.5rem;min-height:3rem;padding:1rem;position:relative;}
-@media (width >= 680px) {.mc-modal__header.svelte-11mv4zz {padding:1.5rem 1.5rem 1rem 1.5rem;}
-}.mc-modal__icon.svelte-11mv4zz {width:2rem;height:2rem;}.mc-modal__title.svelte-11mv4zz {font-size:var(--font-title-m, 1.5rem);font-weight:var(--font-weight-semi-bold, 600);color:var(--modal-color-title, #000000);margin-bottom:0.5rem;margin-top:0.5rem;padding-right:3rem;}.mc-modal__close.svelte-11mv4zz {position:absolute;top:0.75rem;right:0.75rem;}.mc-modal__body.svelte-11mv4zz {font-size:var(--font-size-150, 1rem);color:var(--modal-color-paragraph, #404040);padding:0 1rem;margin-bottom:1rem;}
-@media (width >= 680px) {.mc-modal__body.svelte-11mv4zz {padding:0 1.5rem;}
-}.mc-modal__body.svelte-11mv4zz p:where(.svelte-11mv4zz) {margin:0;line-height:var(--line-height-s, 1.3);}.mc-modal__footer.svelte-11mv4zz {align-items:stretch;display:flex;flex-direction:column-reverse;justify-content:flex-end;gap:1rem;padding:0.5rem 1rem 1rem 1rem;}
-@media (width >= 680px) {.mc-modal__footer.svelte-11mv4zz {flex-direction:row;padding:0.5rem 1.5rem 1.5rem 1.5rem;}
-}.mc-modal__link.svelte-11mv4zz {order:1;}
-@media (width >= 680px) {.mc-modal__link.svelte-11mv4zz {margin-right:auto;order:0;}
-}.mc-button.svelte-11mv4zz {color:var(--button-color-filled-standard-font, #ffffff);background-color:var(--button-color-filled-standard-background, #464e63);font-weight:var(--font-weight-semi-bold, 600);padding:0 calc(1rem - 0.125rem);min-height:3rem;min-width:3rem;display:inline-flex;justify-content:center;vertical-align:middle;text-align:center;border:2px solid transparent;border-radius:var(--button-radius, 0.25rem);transition:all ease 200ms;transition:box-shadow 200ms ease;align-items:center;box-sizing:border-box;font-family:inherit;fill:currentcolor;gap:0.25rem;cursor:pointer;}.mc-button.svelte-11mv4zz:hover {background-color:var(--button-color-filled-standard-hover-background, #343b4c);}.mc-button.svelte-11mv4zz:active {background-color:var(--button-color-filled-standard-active-background, #242938);}.mc-button.svelte-11mv4zz:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button.svelte-11mv4zz:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button.svelte-11mv4zz:focus-visible {box-shadow:0 0 0 0.125rem var(--focus-color-mid, var(--focus-color-outline-mid, #ffffff)), 0 0 0 0.25rem var(--focus-color-outer, var(--focus-color-outline-outer, #000000));outline:0.125rem solid transparent;outline-offset:0.125rem;}.mc-button--ghost.svelte-11mv4zz {color:var(--button-color-ghost-standard-font, #242938);background-color:var(--button-color-ghost-standard-background, rgba(255, 255, 255, 0.01));}.mc-button--ghost.svelte-11mv4zz:hover {background-color:var(--button-color-ghost-standard-hover-background, rgba(70, 78, 99, 0.1));}.mc-button--ghost.svelte-11mv4zz:active {background-color:var(--button-color-ghost-standard-active-background, rgba(70, 78, 99, 0.2));}.mc-button--ghost.svelte-11mv4zz:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button--icon-button.svelte-11mv4zz {border-radius:var(--radius-full, 100%);padding:0;}`};function se(z,o){R(o,!0),U(z,ie);let l=i(o,"open",7,!1),g=i(o,"title",7,""),b=i(o,"description",7,""),_=i(o,"closable",7,!0),h=i(o,"icon",7,void 0),p=i(o,"footer",7,void 0),k=i(o,"link",7,void 0);var v=le();let T;var x=r(v),y=r(x),Y=r(y);{var q=e=>{var t=te(),n=r(t);f(n,o,"icon",{}),a(t),m(e,t)};u(Y,e=>{h()&&e(q)})}var w=s(Y,2),A=r(w,!0);a(w);var B=s(w,2);{var F=e=>{var t=oe();t.__click=[ee,l];var n=r(t),j=r(n);Z(j,{"aria-hidden":"true"}),a(n),a(t),m(e,t)};u(B,e=>{_()&&e(F)})}a(y);var C=s(y,2),D=r(C);{var G=e=>{var t=re(),n=r(t,!0);a(t),M(()=>S(n,b())),m(e,t)};u(D,e=>{b()&&e(G)})}var H=s(D,2);f(H,o,"default",{}),a(C);var I=s(C,2);{var J=e=>{var t=ne(),n=r(t);{var j=E=>{var O=ae(),N=r(O);f(N,o,"link",{}),a(O),m(E,O)};u(n,E=>{k()&&E(j)})}var L=s(n,2);f(L,o,"footer",{}),a(t),m(e,t)};u(I,e=>{p()&&e(J)})}a(x);var K=s(x,2);return $(K,{get isvisible(){return l()},dialoglabel:"modal"}),a(v),M(e=>{T=V(v,1,"mc-modal svelte-11mv4zz",null,T,e),X(v,"aria-hidden",!l()),S(A,g())},[()=>({"is-open":l()})]),m(z,v),W({get open(){return l()},set open(e=!1){l(e),d()},get title(){return g()},set title(e=""){g(e),d()},get description(){return b()},set description(e=""){b(e),d()},get closable(){return _()},set closable(e=!0){_(e),d()},get icon(){return h()},set icon(e=void 0){h(e),d()},get footer(){return p()},set footer(e=void 0){p(e),d()},get link(){return k()},set link(e=void 0){k(e),d()}})}P(["click"]);customElements.define("m-modal",Q(se,{open:{},title:{},description:{},closable:{},icon:{},footer:{},link:{}},["icon","default","link","footer"],[],!0));
+ */
+/**
+ * Do not edit directly, this file was auto-generated.
+ */.mc-modal.svelte-19ke250 {box-sizing:border-box;inset:0;outline:0;pointer-events:none;position:fixed;z-index:var(--modal-z-index, 3);display:flex;justify-content:center;align-items:flex-end;overflow:hidden auto;}
+@media (width >= 680px) {.mc-modal.svelte-19ke250 {align-items:center;}
+}.mc-modal__dialog.svelte-19ke250 {background:#ffffff;display:flex;flex-direction:column;opacity:0;position:relative;transform:translateY(-25%);transition:visibility 0s linear 0.4s, transform 0.4s ease, opacity 0.4s ease;visibility:hidden;width:100%;border-radius:1rem 1rem 0 0;z-index:3;box-shadow:0px 10px 20px -4px rgba(36, 41, 56, 0.2);}
+@media (width >= 680px) {.mc-modal__dialog.svelte-19ke250 {width:38rem;border-radius:1rem;}
+}.mc-modal.is-open.svelte-19ke250 .mc-modal__dialog:where(.svelte-19ke250) {opacity:1;pointer-events:all;transform:translateY(0);transition:visibility 0s linear 0s, transform 0.4s ease, opacity 0.4s ease;visibility:visible;}.mc-modal__header.svelte-19ke250 {align-items:center;display:flex;gap:0.5rem;min-height:3rem;padding:1rem;position:relative;}
+@media (width >= 680px) {.mc-modal__header.svelte-19ke250 {padding:1.5rem 1.5rem 1rem 1.5rem;}
+}.mc-modal__icon.svelte-19ke250 {width:2rem;height:2rem;}.mc-modal__title.svelte-19ke250 {font-size:1.5rem;font-weight:600;color:#000000;margin-bottom:0.5rem;margin-top:0.5rem;padding-right:3rem;}.mc-modal__close.svelte-19ke250 {position:absolute;top:0.75rem;right:0.75rem;}.mc-modal__body.svelte-19ke250 {font-size:1rem;color:#404040;padding:0 1rem;margin-bottom:1rem;}
+@media (width >= 680px) {.mc-modal__body.svelte-19ke250 {padding:0 1.5rem;}
+}.mc-modal__body.svelte-19ke250 p:where(.svelte-19ke250) {margin:0;line-height:1.3;}.mc-modal__footer.svelte-19ke250 {align-items:stretch;display:flex;flex-direction:column-reverse;justify-content:flex-end;gap:1rem;padding:0.5rem 1rem 1rem 1rem;}
+@media (width >= 680px) {.mc-modal__footer.svelte-19ke250 {flex-direction:row;padding:0.5rem 1.5rem 1.5rem 1.5rem;}
+}.mc-modal__link.svelte-19ke250 {order:1;}
+@media (width >= 680px) {.mc-modal__link.svelte-19ke250 {margin-right:auto;order:0;}
+}.mc-button.svelte-19ke250 {color:#ffffff;background-color:#464e63;font-weight:600;padding:0 calc(1rem - 0.125rem);min-height:3rem;min-width:3rem;display:inline-flex;justify-content:center;vertical-align:middle;text-align:center;border:2px solid transparent;border-radius:0.25rem;transition:all ease 200ms;transition:box-shadow 200ms ease;align-items:center;box-sizing:border-box;font-family:inherit;fill:currentcolor;gap:0.25rem;cursor:pointer;}.mc-button.svelte-19ke250:hover {background-color:#343b4c;}.mc-button.svelte-19ke250:active {background-color:#242938;}.mc-button.svelte-19ke250:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button.svelte-19ke250:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button.svelte-19ke250:focus-visible {box-shadow:0 0 0 0.125rem var(--focus-color-mid, #ffffff), 0 0 0 0.25rem var(--focus-color-outer, #000000);outline:0.125rem solid transparent;outline-offset:0.125rem;}.mc-button--ghost.svelte-19ke250 {color:#242938;background-color:rgba(255, 255, 255, 0.01);}.mc-button--ghost.svelte-19ke250:hover {background-color:rgba(70, 78, 99, 0.1);}.mc-button--ghost.svelte-19ke250:active {background-color:rgba(70, 78, 99, 0.2);}.mc-button--ghost.svelte-19ke250:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button--icon-button.svelte-19ke250 {border-radius:100%;padding:0;}`};function se(_,o){R(o,!0),U(_,le);let n=l(o,"open",7,!1),g=l(o,"title",7,""),u=l(o,"description",7,""),p=l(o,"closable",7,!0),k=l(o,"icon",7,void 0),h=l(o,"footer",7,void 0),x=l(o,"link",7,void 0);var v=ne();let O;var y=r(v),w=r(y),T=r(w);{var q=e=>{var t=te(),i=r(t);b(i,o,"icon",{}),a(t),m(e,t)};f(T,e=>{k()&&e(q)})}var z=s(T,2),A=r(z,!0);a(z);var B=s(z,2);{var F=e=>{var t=oe();t.__click=[ee,n];var i=r(t),j=r(i);Z(j,{"aria-hidden":"true"}),a(i),a(t),m(e,t)};f(B,e=>{p()&&e(F)})}a(w);var C=s(w,2),Y=r(C);{var G=e=>{var t=re(),i=r(t,!0);a(t),M(()=>S(i,u())),m(e,t)};f(Y,e=>{u()&&e(G)})}var H=s(Y,2);b(H,o,"default",{}),a(C);var I=s(C,2);{var J=e=>{var t=ie(),i=r(t);{var j=E=>{var D=ae(),N=r(D);b(N,o,"link",{}),a(D),m(E,D)};f(i,E=>{x()&&E(j)})}var L=s(i,2);b(L,o,"footer",{}),a(t),m(e,t)};f(I,e=>{h()&&e(J)})}a(y);var K=s(y,2);return $(K,{get isvisible(){return n()},dialoglabel:"modal"}),a(v),M(e=>{O=V(v,1,"mc-modal svelte-19ke250",null,O,e),X(v,"aria-hidden",!n()),S(A,g())},[()=>({"is-open":n()})]),m(_,v),W({get open(){return n()},set open(e=!1){n(e),d()},get title(){return g()},set title(e=""){g(e),d()},get description(){return u()},set description(e=""){u(e),d()},get closable(){return p()},set closable(e=!0){p(e),d()},get icon(){return k()},set icon(e=void 0){k(e),d()},get footer(){return h()},set footer(e=void 0){h(e),d()},get link(){return x()},set link(e=void 0){x(e),d()}})}P(["click"]);customElements.define("m-modal",Q(se,{open:{},title:{},description:{},closable:{},icon:{},footer:{},link:{}},["icon","default","link","footer"],[],!0));
 //# sourceMappingURL=Modal.js.map

package/dist/components/modal/Modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.js","sources":["../../../src/components/modal/Modal.svelte"],"sourcesContent":["<svelte:options customElement={{ tag: 'm-modal' }} />\n\n<script lang=\"ts\">\n  import Cross24 from '@mozaic-ds/icons-svelte/svelte/Cross24/Cross24.svelte';\n  import MOverlay from '../overlay/Overlay.svelte';\n\n  interface Props {\n    open?: boolean;\n    title?: string;\n    description?: string;\n    closable?: boolean;\n    icon?: any;\n    footer?: any;\n    link?: any;\n    [key: string]: any;\n  }\n\n  let {\n    open = false,\n    title = '',\n    description = '',\n    closable = true,\n    icon = undefined,\n    footer = undefined,\n    link = undefined,\n  }: Props = $props();\n\n  function onClose() {\n    open = false;\n    // Manually emit event from the custom element\n    const event = new CustomEvent('update:open', {\n      detail: open,\n      bubbles: true,\n      composed: true,\n    });\n    // @ts-ignore: `this` is the custom element instance\n    this.dispatchEvent(event);\n  }\n  //   afterUpdate(() => {\n  //     dispatch('update:open', open);\n  //   });\n</script>\n\n<section\n  class=\"mc-modal\"\n  class:is-open={open}\n  tabindex=\"-1\"\n  aria-labelledby=\"modalTitle\"\n  aria-hidden={!open}\n>\n  <div class=\"mc-modal__dialog\" role=\"document\">\n    <header class=\"mc-modal__header\">\n      {#if icon}\n        <span class=\"mc-modal__icon\">\n          <slot name=\"icon\" />\n        </span>\n      {/if}\n      <h2 class=\"mc-modal__title\" id=\"modalTitle\">{title}</h2>\n      {#if closable}\n        <button\n          type=\"button\"\n          class=\"mc-modal__close mc-button mc-button--icon-button mc-button--ghost\"\n          aria-label=\"Close\"\n          onclick={onClose}\n        >\n          <span class=\"mc-modal__icon\">\n            <Cross24 aria-hidden=\"true\" />\n          </span>\n        </button>\n      {/if}\n    </header>\n\n    <main class=\"mc-modal__body\">\n      {#if description}\n        <p>{description}</p>\n      {/if}\n      <slot />\n    </main>\n\n    {#if footer}\n      <footer class=\"mc-modal__footer\">\n        {#if link}\n          <span class=\"mc-modal__link\">\n            <slot name=\"link\" />\n          </span>\n        {/if}\n        <slot name=\"footer\" />\n      </footer>\n    {/if}\n  </div>\n\n  <MOverlay isvisible={open} dialoglabel=\"modal\" />\n</section>\n\n<style lang=\"scss\">\n  @use '@mozaic-ds/styles/components/modal';\n  @use '@mozaic-ds/styles/components/button';\n</style>\n"],"names":["onClose","_","open","event","title","description","closable","icon","footer","link","$$render","consequent","consequent_1","consequent_2","consequent_3","consequent_4"],"mappings":"0VA2BW,SAAAA,GAAUC,EAAAC,EAAA,CACjBA,EAAO,EAAK,EAEN,MAAAC,EAAY,IAAA,YAAY,eAC5B,OAAQD,EAAI,EACZ,QAAS,GACT,SAAU,EAAI,CAAA,EAGhB,KAAK,cAAcC,CAAK,CAC1B;;;;;;;;;;;;;;qsEArCF,iBAkBI,IAAAD,eAAO,EAAK,EACZE,gBAAQ,EAAE,EACVC,sBAAc,EAAE,EAChBC,mBAAW,EAAI,EACfC,eAAO,MAAS,EAChBC,iBAAS,MAAS,EAClBC,eAAO,MAAS,+GA4BTF,EAAI,GAAAG,EAAAC,CAAA,8EAWIX,GAAOE,CAAA,0EALfI,EAAQ,GAAAI,EAAAE,CAAA,4EAgBPP,EAAW,CAAA,CAAA,kBADZA,EAAW,GAAAK,EAAAG,CAAA,uJAQTJ,EAAI,GAAAC,EAAAI,CAAA,yDAFRN,EAAM,GAAAE,EAAAK,CAAA,yDAYQb,EAAI,mGA3CXA,EAAI,CAAA,MAS+BE,GAAK,oBAZvCF,EAAI,GAAA,+CA3BV,GAAK,+CACJ,GAAE,2DACI,GAAE,qDACL,GAAI,6CACR,OAAS,iDACP,OAAS,6CACX,OAAS,YAiBpB"}
+{"version":3,"file":"Modal.js","sources":["../../../src/components/modal/Modal.svelte"],"sourcesContent":["<svelte:options customElement={{ tag: 'm-modal' }} />\n\n<script lang=\"ts\">\n  import Cross24 from '@mozaic-ds/icons-svelte/svelte/Cross24/Cross24.svelte';\n  import MOverlay from '../overlay/Overlay.svelte';\n\n  interface Props {\n    open?: boolean;\n    title?: string;\n    description?: string;\n    closable?: boolean;\n    icon?: any;\n    footer?: any;\n    link?: any;\n    [key: string]: any;\n  }\n\n  let {\n    open = false,\n    title = '',\n    description = '',\n    closable = true,\n    icon = undefined,\n    footer = undefined,\n    link = undefined,\n  }: Props = $props();\n\n  function onClose() {\n    open = false;\n    // Manually emit event from the custom element\n    const event = new CustomEvent('update:open', {\n      detail: open,\n      bubbles: true,\n      composed: true,\n    });\n    // @ts-ignore: `this` is the custom element instance\n    this.dispatchEvent(event);\n  }\n  //   afterUpdate(() => {\n  //     dispatch('update:open', open);\n  //   });\n</script>\n\n<section\n  class=\"mc-modal\"\n  class:is-open={open}\n  tabindex=\"-1\"\n  aria-labelledby=\"modalTitle\"\n  aria-hidden={!open}\n>\n  <div class=\"mc-modal__dialog\" role=\"document\">\n    <header class=\"mc-modal__header\">\n      {#if icon}\n        <span class=\"mc-modal__icon\">\n          <slot name=\"icon\" />\n        </span>\n      {/if}\n      <h2 class=\"mc-modal__title\" id=\"modalTitle\">{title}</h2>\n      {#if closable}\n        <button\n          type=\"button\"\n          class=\"mc-modal__close mc-button mc-button--icon-button mc-button--ghost\"\n          aria-label=\"Close\"\n          onclick={onClose}\n        >\n          <span class=\"mc-modal__icon\">\n            <Cross24 aria-hidden=\"true\" />\n          </span>\n        </button>\n      {/if}\n    </header>\n\n    <main class=\"mc-modal__body\">\n      {#if description}\n        <p>{description}</p>\n      {/if}\n      <slot />\n    </main>\n\n    {#if footer}\n      <footer class=\"mc-modal__footer\">\n        {#if link}\n          <span class=\"mc-modal__link\">\n            <slot name=\"link\" />\n          </span>\n        {/if}\n        <slot name=\"footer\" />\n      </footer>\n    {/if}\n  </div>\n\n  <MOverlay isvisible={open} dialoglabel=\"modal\" />\n</section>\n\n<style lang=\"scss\">\n  @use '@mozaic-ds/styles/components/modal';\n  @use '@mozaic-ds/styles/components/button';\n</style>\n"],"names":["onClose","open","event","title","description","closable","icon","footer","link","$$render","consequent","consequent_1","consequent_2","consequent_3","consequent_4"],"mappings":"0VA2BW,SAAAA,GAAU,EAAAC,EAAA,CACjBA,EAAO,EAAK,EAEN,MAAAC,EAAY,IAAA,YAAY,eAC5B,OAAQD,EAAI,EACZ,QAAS,GACT,SAAU,EAAI,CAAA,EAGhB,KAAK,cAAcC,CAAK,CAC1B;;;;;;;;;;;;;;;;;08CArCF,iBAkBI,IAAAD,eAAO,EAAK,EACZE,gBAAQ,EAAE,EACVC,sBAAc,EAAE,EAChBC,mBAAW,EAAI,EACfC,eAAO,MAAS,EAChBC,iBAAS,MAAS,EAClBC,eAAO,MAAS,+GA4BTF,EAAI,GAAAG,EAAAC,CAAA,8EAWIV,GAAOC,CAAA,0EALfI,EAAQ,GAAAI,EAAAE,CAAA,4EAgBPP,EAAW,CAAA,CAAA,kBADZA,EAAW,GAAAK,EAAAG,CAAA,uJAQTJ,EAAI,GAAAC,EAAAI,CAAA,yDAFRN,EAAM,GAAAE,EAAAK,CAAA,yDAYQb,EAAI,mGA3CXA,EAAI,CAAA,MAS+BE,GAAK,oBAZvCF,EAAI,GAAA,+CA3BV,GAAK,+CACJ,GAAE,2DACI,GAAE,qDACL,GAAI,6CACR,OAAS,iDACP,OAAS,6CACX,OAAS,YAiBpB"}

package/dist/components/modal/Modal.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.stories.d.ts","sourceRoot":"","sources":["../../../src/components/modal/Modal.stories.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;wBA4BtD,IAAI;AAzBT,wBAyBU;AAEV,KAAK,KAAK,GAAG,QAAQ,CAAC;AAiEtB,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,KAKlB,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAO5B,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAQxB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KASpB,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,KAalB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAQpB,CAAC"}
+{"version":3,"file":"Modal.stories.d.ts","sourceRoot":"","sources":["../../../src/components/modal/Modal.stories.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;wBA6BtD,IAAI;AAzBT,wBAyBU;AAEV,KAAK,KAAK,GAAG,QAAQ,CAAC;AAiEtB,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,KAKlB,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAO5B,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAQxB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KASpB,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,KAalB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAQpB,CAAC"}

package/dist/components/modal/Modal.stories.js

@@ -1,4 +1,5 @@
 import { action } from 'storybook/actions';
+import HelpCircle32 from '@mozaic-ds/icons-svelte/custom-elements/HelpCircle32/HelpCircle32.js';
 export default {
     title: 'Overlay/Modal',
     tags: ['autodocs', 'beta'],