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

package/dist/components/radiogroup/RadioGroup.js

@@ -1,8 +1,8 @@
-import{n as J,c as K,p as L,a as M,b as d,f as j,s as S,d as u,t as z,h as E,i as N,j as i,r as a,e as q,g as B,m as l,o as O}from"../../custom-element.js";import{i as P}from"../../if.js";import{e as Q}from"../../each.js";import{s as _,r as T}from"../../attributes.js";import{b as U}from"../../input.js";import{c as V}from"../../custom-element-forward-events.js";var W=j('<legend class="mc-field__legend svelte-od5t2d"> </legend>'),X=j('<div class="mc-radio mc-field__item svelte-od5t2d"><input type="radio"/> <label class="mc-radio__label svelte-od5t2d"> </label></div>'),Y=j('<div class="radio-group-container"><fieldset class="mc-field mc-field--group svelte-od5t2d"><!> <div></div></fieldset></div>');const Z={hash:"svelte-od5t2d",code:`/**
+import{n as K,c as L,p as M,a as N,b as i,f as j,s as S,d as u,t as z,h as E,i as O,j as t,r as n,e as q,g as B,m as a,o as P}from"../../custom-element.js";import{i as Q}from"../../if.js";import{e as T}from"../../each.js";import{s as _,r as U}from"../../attributes.js";import{b as V}from"../../input.js";import{c as W}from"../../custom-element-forward-events.js";var X=j('<legend class="mc-field__legend svelte-clvmul"> </legend>'),Y=j('<div class="mc-radio mc-field__item svelte-clvmul"><input type="radio"/> <label class="mc-radio__label svelte-clvmul"> </label></div>'),Z=j('<div class="radio-group-container"><fieldset class="mc-field mc-field--group svelte-clvmul"><!> <div></div></fieldset></div>');const $={hash:"svelte-clvmul",code:`/**
  * Do not edit directly, this file was auto-generated.
- */.mc-radio.svelte-od5t2d {align-items:center;display:flex;gap:0.5rem;padding:0.375rem;}.mc-radio__label.svelte-od5t2d {font-size:var(--font-size-150, 1rem);line-height:var(--line-height-s, 1.3);color:var(--forms-color-text-default, #000000);cursor:pointer;}.mc-radio__input.svelte-od5t2d {appearance:none;margin:0;cursor:pointer;flex-shrink:0;transition:box-shadow 200ms ease;background-color:var(--forms-color-background-default, #ffffff);border:var(--border-m, 0.125rem) solid var(--forms-color-border-default, #666666);border-radius:100%;transition:all ease 200ms;height:1.25rem;width:1.25rem;position:relative;}.mc-radio__input.svelte-od5t2d::before {border-radius:var(--radius-full, 100%);content:"";display:block;height:0.5rem;left:50%;position:absolute;top:50%;transform:translate(-50%, -50%);width:0.5rem;}.mc-radio__input.svelte-od5t2d:hover {border-color:var(--forms-color-border-hover, #4d4d4d);}.mc-radio__input.svelte-od5t2d: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-radio__input.svelte-od5t2d:checked {background-color:var(--forms-color-background-checked, #117f03);}.mc-radio__input.svelte-od5t2d:checked::before {background-color:var(--forms-color-background-default, #ffffff);}.mc-radio__input.svelte-od5t2d:checked, .mc-radio__input.svelte-od5t2d:disabled {border-color:transparent;}.mc-radio__input.svelte-od5t2d:disabled {background-color:var(--forms-color-background-disabled, #d9d9d9);cursor:not-allowed;}.mc-radio__input.svelte-od5t2d:disabled:checked::before {background-color:var(--forms-color-icon-disabled, #737373);}.mc-radio__input.svelte-od5t2d:disabled + .mc-radio__label:where(.svelte-od5t2d) {color:var(--forms-color-text-disabled, #737373);cursor:not-allowed;}.mc-radio__input.svelte-od5t2d:not(:disabled):checked:hover {background-color:var(--forms-color-background-checked-hover, #006902);}.mc-radio__input.is-invalid.svelte-od5t2d:not(:checked) {border-color:var(--forms-color-border-invalid, #ea302d);}.mc-radio__input.is-invalid.svelte-od5t2d:not(:checked):hover {border-color:var(--forms-color-border-invalid-hover, #c61112);}
+ */.mc-radio.svelte-clvmul {align-items:center;display:flex;gap:0.5rem;padding:0.375rem;}.mc-radio__label.svelte-clvmul {font-size:var(--font-size-150, 1rem);line-height:var(--line-height-s, 1.3);color:var(--forms-color-text-default, #000000);cursor:pointer;}.mc-radio__input.svelte-clvmul {appearance:none;margin:0;cursor:pointer;flex-shrink:0;transition:box-shadow 200ms ease;background-color:var(--forms-color-background-default, #ffffff);border:var(--border-m, 0.125rem) solid var(--forms-color-border-default, #666666);border-radius:100%;transition:all ease 200ms;height:1.25rem;width:1.25rem;position:relative;}.mc-radio__input.svelte-clvmul::before {border-radius:var(--radius-full, 100%);content:"";display:block;height:0.5rem;left:50%;position:absolute;top:50%;transform:translate(-50%, -50%);width:0.5rem;}.mc-radio__input.svelte-clvmul:hover {border-color:var(--forms-color-border-hover, #4d4d4d);}.mc-radio__input.svelte-clvmul: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-radio__input.svelte-clvmul:checked {background-color:var(--forms-color-background-checked, #117f03);}.mc-radio__input.svelte-clvmul:checked::before {background-color:var(--forms-color-background-default, #ffffff);}.mc-radio__input.svelte-clvmul:checked, .mc-radio__input.svelte-clvmul:disabled {border-color:transparent;}.mc-radio__input.svelte-clvmul:disabled {background-color:var(--forms-color-background-disabled, #d9d9d9);cursor:not-allowed;}.mc-radio__input.svelte-clvmul:disabled:checked::before {background-color:var(--forms-color-icon-disabled, #737373);}.mc-radio__input.svelte-clvmul:disabled + .mc-radio__label:where(.svelte-clvmul) {color:var(--forms-color-text-disabled, #737373);cursor:not-allowed;}.mc-radio__input.svelte-clvmul:not(:disabled):checked:hover {background-color:var(--forms-color-background-checked-hover, #006902);}.mc-radio__input.is-invalid.svelte-clvmul:not(:checked) {border-color:var(--forms-color-border-invalid, #ea302d);}.mc-radio__input.is-invalid.svelte-clvmul:not(:checked):hover {border-color:var(--forms-color-border-invalid-hover, #c61112);}
 
-/* stylelint-disable string-no-newline */ .mc-field__legend.svelte-od5t2d {font-size:var(--font-size-100, 0.875rem);line-height:var(--line-height-s, 1.3);font-weight:var(--font-weight-regular, 400);color:var(--field-color-label, #000000);}.mc-field__legend.svelte-od5t2d {padding-inline:0;}.mc-field__content.svelte-od5t2d {margin-top:0.5rem;}.mc-field--group.svelte-od5t2d {border-width:0;margin-inline:0;padding:0;}.mc-field--group.svelte-od5t2d .mc-field__content:where(.svelte-od5t2d) {display:flex;flex-direction:column;flex-shrink:0;gap:0.25rem;}.mc-field--group.svelte-od5t2d .mc-field__content:where(.svelte-od5t2d):where(.mc-field__content--inline:where(.svelte-od5t2d)) {flex-flow:row wrap;gap:0.25rem 1rem;}
+/* stylelint-disable string-no-newline */ .mc-field__legend.svelte-clvmul {font-size:var(--font-size-100, 0.875rem);line-height:var(--line-height-s, 1.3);font-weight:var(--font-weight-regular, 400);color:var(--field-color-label, #000000);}.mc-field__legend.svelte-clvmul {padding-inline:0;}.mc-field__content.svelte-clvmul {margin-top:0.5rem;}.mc-field--group.svelte-clvmul {border-width:0;margin-inline:0;padding:0;}.mc-field--group.svelte-clvmul .mc-field__content:where(.svelte-clvmul) {display:flex;flex-direction:column;flex-shrink:0;gap:0.25rem;}.mc-field--group.svelte-clvmul .mc-field__content:where(.svelte-clvmul):where(.mc-field__content--inline:where(.svelte-clvmul)) {flex-flow:row wrap;gap:0.25rem 1rem;}
 
-/* stylelint-enable string-no-newline */`};function $(A,t){L(t,!0),M(A,Z);const C=[];let g=d(t,"id",7),f=d(t,"selectedvalue",15),b=d(t,"options",7),n=d(t,"legend",7),h=d(t,"inline",7),p=d(t,"isinvalid",7,!1),k=d(t,"onchange",7),w=d(t,"onblur",7);var m=Y(),D=u(m),F=u(D);{var H=e=>{var o=W(),s=u(o,!0);a(o),z(()=>B(s,n())),E(e,o)};P(F,e=>{n()&&n().length&&e(H)})}var x=S(F,2);return Q(x,21,b,e=>e.id,(e,o)=>{var s=X(),r=u(s);T(r);let G;r.__change=function(...c){var v;(v=k())==null||v.apply(this,c)};var R,y=S(r,2),I=u(y,!0);a(y),a(s),z(c=>{G=q(r,1,"mc-radio__input svelte-od5t2d",null,G,c),_(r,"id",l(o).id),_(r,"name",l(o).name),r.disabled=l(o).disabled,R!==(R=l(o).value)&&(r.value=(r.__value=l(o).value)??""),_(y,"for",l(o).id),B(I,l(o).label)},[()=>({"is-invalid":p()})]),O("blur",r,function(...c){var v;(v=w())==null||v.apply(this,c)}),U(C,[],r,()=>(l(o).value,f()),f),E(e,s)}),a(x),a(D),a(m),z(()=>{_(m,"id",g()),q(x,1,`mc-field__content ${h()?"mc-field__content--inline":""}`,"svelte-od5t2d")}),E(A,m),N({get id(){return g()},set id(e){g(e),i()},get selectedvalue(){return f()},set selectedvalue(e){f(e),i()},get options(){return b()},set options(e){b(e),i()},get legend(){return n()},set legend(e){n(e),i()},get inline(){return h()},set inline(e){h(e),i()},get isinvalid(){return p()},set isinvalid(e=!1){p(e),i()},get onchange(){return k()},set onchange(e){k(e),i()},get onblur(){return w()},set onblur(e){w(e),i()}})}J(["change"]);customElements.define("m-radio-group",K($,{options:{attribute:"options",type:"Array"},id:{},selectedvalue:{},legend:{},inline:{},isinvalid:{},onchange:{},onblur:{}},[],[],!0,V));
+/* stylelint-enable string-no-newline */`};function ee(A,o){M(o,!0),N(A,$);const C=[];let g=i(o,"id",7),m=i(o,"selectedvalue",15),b=i(o,"options",7),d=i(o,"legend",7),h=i(o,"inline",7),p=i(o,"isinvalid",7,!1),k=i(o,"onchange",7),w=i(o,"onblur",7);var H={get id(){return g()},set id(e){g(e),t()},get selectedvalue(){return m()},set selectedvalue(e){m(e),t()},get options(){return b()},set options(e){b(e),t()},get legend(){return d()},set legend(e){d(e),t()},get inline(){return h()},set inline(e){h(e),t()},get isinvalid(){return p()},set isinvalid(e=!1){p(e),t()},get onchange(){return k()},set onchange(e){k(e),t()},get onblur(){return w()},set onblur(e){w(e),t()}},f=Z(),D=u(f),F=u(D);{var I=e=>{var l=X(),s=u(l,!0);n(l),z(()=>B(s,d())),E(e,l)};Q(F,e=>{d()&&d().length&&e(I)})}var x=S(F,2);return T(x,21,b,e=>e.id,(e,l)=>{var s=Y(),r=u(s);U(r);let G;r.__change=function(...c){var v;(v=k())==null||v.apply(this,c)};var R,y=S(r,2),J=u(y,!0);n(y),n(s),z(c=>{G=q(r,1,"mc-radio__input svelte-clvmul",null,G,c),_(r,"id",a(l).id),_(r,"name",a(l).name),r.disabled=a(l).disabled,R!==(R=a(l).value)&&(r.value=(r.__value=a(l).value)??""),_(y,"for",a(l).id),B(J,a(l).label)},[()=>({"is-invalid":p()})]),P("blur",r,function(...c){var v;(v=w())==null||v.apply(this,c)}),V(C,[],r,()=>(a(l).value,m()),m),E(e,s)}),n(x),n(D),n(f),z(()=>{_(f,"id",g()),q(x,1,`mc-field__content ${h()?"mc-field__content--inline":""}`,"svelte-clvmul")}),E(A,f),O(H)}K(["change"]);customElements.define("m-radio-group",L(ee,{options:{attribute:"options",type:"Array"},id:{},selectedvalue:{},legend:{},inline:{},isinvalid:{},onchange:{},onblur:{}},[],[],!0,W));
 //# sourceMappingURL=RadioGroup.js.map

package/dist/components/radiogroup/RadioGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroup.js","sources":["../../../src/components/radiogroup/RadioGroup.svelte"],"sourcesContent":["<svelte:options\n  customElement={{\n    tag: 'm-radio-group',\n    props: {\n      options: { type: 'Array', attribute: 'options' },\n    },\n    extend: customElementForwardEvents,\n  }}\n/>\n\n<script lang=\"ts\">\n  import { customElementForwardEvents } from '../../utils';\n  import type { RadioGroupOption } from './radioGroup.types';\n\n  interface Props {\n    id: string;\n    selectedvalue?: string;\n    options: Array<RadioGroupOption>;\n    legend: string;\n    inline: boolean;\n    isinvalid?: boolean;\n    onchange?: (event: Event) => void;\n    onblur?: (event: FocusEvent) => void;\n  }\n\n  let {\n    id,\n    selectedvalue = $bindable(),\n    options,\n    legend,\n    inline,\n    isinvalid = false,\n    onchange,\n    onblur,\n  }: Props = $props();\n</script>\n\n<div {id} class=\"radio-group-container\">\n  <fieldset class=\"mc-field mc-field--group\">\n    {#if legend && legend.length}\n      <legend class=\"mc-field__legend\">\n        {legend}\n      </legend>\n    {/if}\n\n    <div class=\"mc-field__content {inline ? 'mc-field__content--inline' : ''}\">\n      {#each options as opt (opt.id)}\n        <div class=\"mc-radio mc-field__item\">\n          <input\n            type=\"radio\"\n            class=\"mc-radio__input\"\n            class:is-invalid={isinvalid}\n            id={opt.id}\n            name={opt.name}\n            bind:group={selectedvalue}\n            value={opt.value}\n            disabled={opt.disabled}\n            {onchange}\n            {onblur}\n          />\n          <label for={opt.id} class=\"mc-radio__label\">{opt.label}</label>\n        </div>\n      {/each}\n    </div>\n  </fieldset>\n</div>\n\n<style lang=\"scss\">\n  @use '@mozaic-ds/styles/components/radio';\n  @use '@mozaic-ds/styles/components/field';\n</style>\n"],"names":["id","$.prop","$$props","selectedvalue","options","legend","inline","isinvalid","onchange","onblur","$$render","consequent","$.each","div_1","opt","$.set_attribute","input","$.get","input_value","label","$.set_text","text_1","customElementForwardEvents"],"mappings":";;;;;;0DAAA,+BA0BIA,EAAEC,EAAAC,EAAA,KAAA,CAAA,EACFC,EAAaF,EAAAC,EAAA,gBAAA,EAAA,EACbE,EAAOH,EAAAC,EAAA,UAAA,CAAA,EACPG,EAAMJ,EAAAC,EAAA,SAAA,CAAA,EACNI,EAAML,EAAAC,EAAA,SAAA,CAAA,EACNK,oBAAY,EAAK,EACjBC,EAAQP,EAAAC,EAAA,WAAA,CAAA,EACRO,EAAMR,EAAAC,EAAA,SAAA,CAAA,wEAQDG,EAAM,CAAA,CAAA,kBAFNA,EAAM,GAAIA,EAAM,EAAC,QAAMK,EAAAC,CAAA,iBAOnBC,OAAAA,EAAAC,EAAA,GAAAT,EAAWU,GAAKA,EAAI,MAATA,IAAG,wLAMXC,EAAAC,EAAA,KAAAC,EAAAH,CAAG,EAAC,EAAE,EACJC,EAAAC,EAAA,OAAAC,EAAAH,CAAG,EAAC,IAAI,EAGJE,EAAA,SAAAC,EAAAH,CAAG,EAAC,SADPI,KAAAA,EAAAD,EAAAH,CAAG,EAAC,SAAJE,EAAA,OAAAA,EAAA,QAAAC,EAAAH,CAAG,EAAC,QAAK,IAKNC,EAAAI,EAAA,MAAAF,EAAAH,CAAG,EAAC,EAAE,EAA2BM,EAAAC,EAAAJ,EAAAH,CAAG,EAAC,KAAK,uBATlCP,EAAS,GAAA,kFAIpBU,EAAAH,CAAG,EAAC,MADCX,EAAa,GAAbA,2EATWG,EAAM,EAAG,4BAA8B,EAAE,GAAA,eAAA,uTAd5D,GAAK,kHAIrB,6LA7BYgB"}
+{"version":3,"file":"RadioGroup.js","sources":["../../../src/components/radiogroup/RadioGroup.svelte"],"sourcesContent":["<svelte:options\n  customElement={{\n    tag: 'm-radio-group',\n    props: {\n      options: { type: 'Array', attribute: 'options' },\n    },\n    extend: customElementForwardEvents,\n  }}\n/>\n\n<script lang=\"ts\">\n  import { customElementForwardEvents } from '../../utils';\n  import type { RadioGroupOption } from './radioGroup.types';\n\n  interface Props {\n    id: string;\n    selectedvalue?: string;\n    options: Array<RadioGroupOption>;\n    legend: string;\n    inline: boolean;\n    isinvalid?: boolean;\n    onchange?: (event: Event) => void;\n    onblur?: (event: FocusEvent) => void;\n  }\n\n  let {\n    id,\n    selectedvalue = $bindable(),\n    options,\n    legend,\n    inline,\n    isinvalid = false,\n    onchange,\n    onblur,\n  }: Props = $props();\n</script>\n\n<div {id} class=\"radio-group-container\">\n  <fieldset class=\"mc-field mc-field--group\">\n    {#if legend && legend.length}\n      <legend class=\"mc-field__legend\">\n        {legend}\n      </legend>\n    {/if}\n\n    <div class=\"mc-field__content {inline ? 'mc-field__content--inline' : ''}\">\n      {#each options as opt (opt.id)}\n        <div class=\"mc-radio mc-field__item\">\n          <input\n            type=\"radio\"\n            class=\"mc-radio__input\"\n            class:is-invalid={isinvalid}\n            id={opt.id}\n            name={opt.name}\n            bind:group={selectedvalue}\n            value={opt.value}\n            disabled={opt.disabled}\n            {onchange}\n            {onblur}\n          />\n          <label for={opt.id} class=\"mc-radio__label\">{opt.label}</label>\n        </div>\n      {/each}\n    </div>\n  </fieldset>\n</div>\n\n<style lang=\"scss\">\n  @use '@mozaic-ds/styles/components/radio';\n  @use '@mozaic-ds/styles/components/field';\n</style>\n"],"names":["id","$.prop","$$props","selectedvalue","options","legend","inline","isinvalid","onchange","onblur","$$render","consequent","$.each","div_1","opt","$.set_attribute","input","$.get","input_value","label","$.set_text","text_1","customElementForwardEvents"],"mappings":";;;;;;2DAAA,+BA0BIA,EAAEC,EAAAC,EAAA,KAAA,CAAA,EACFC,EAAaF,EAAAC,EAAA,gBAAA,EAAA,EACbE,EAAOH,EAAAC,EAAA,UAAA,CAAA,EACPG,EAAMJ,EAAAC,EAAA,SAAA,CAAA,EACNI,EAAML,EAAAC,EAAA,SAAA,CAAA,EACNK,oBAAY,EAAK,EACjBC,EAAQP,EAAAC,EAAA,WAAA,CAAA,EACRO,EAAMR,EAAAC,EAAA,SAAA,CAAA,kTAFM,GAAK,oLAUZG,EAAM,CAAA,CAAA,kBAFNA,EAAM,GAAIA,EAAM,EAAC,QAAMK,EAAAC,CAAA,iBAOnBC,OAAAA,EAAAC,EAAA,GAAAT,EAAWU,GAAKA,EAAI,MAATA,IAAG,wLAMXC,EAAAC,EAAA,KAAAC,EAAAH,CAAG,EAAC,EAAE,EACJC,EAAAC,EAAA,OAAAC,EAAAH,CAAG,EAAC,IAAI,EAGJE,EAAA,SAAAC,EAAAH,CAAG,EAAC,SADPI,KAAAA,EAAAD,EAAAH,CAAG,EAAC,SAAJE,EAAA,OAAAA,EAAA,QAAAC,EAAAH,CAAG,EAAC,QAAK,IAKNC,EAAAI,EAAA,MAAAF,EAAAH,CAAG,EAAC,EAAE,EAA2BM,EAAAC,EAAAJ,EAAAH,CAAG,EAAC,KAAK,uBATlCP,EAAS,GAAA,kFAIpBU,EAAAH,CAAG,EAAC,MADCX,EAAa,GAAbA,2EATWG,EAAM,EAAG,4BAA8B,EAAE,GAAA,eAAA,eAV5E,8LA7BYgB"}

package/dist/components/select/Select.js

@@ -1,7 +1,7 @@
-import{n as A,c as D,p as F,a as G,b as s,C as H,l as I,f as z,s as J,d as w,t as _,B as K,e as N,o as O,m as n,h as y,i as P,j as t,r as k,_ as Q,g as S}from"../../custom-element.js";import{i as R}from"../../if.js";import{e as T,i as U}from"../../each.js";import{s as V,d as W}from"../../attributes.js";import{c as X}from"../../custom-element-forward-events.js";var Y=z("<option disabled selected> </option>"),Z=z("<option> </option>"),$=z("<select><!><!></select>");const ee={hash:"svelte-13f62in",code:`/**
+import{n as D,c as F,p as G,a as H,b as s,v as I,l as J,f as k,s as K,d as w,t as _,u as N,e as O,o as P,m as n,h as z,i as Q,j as t,r as y,w as R,g as j}from"../../custom-element.js";import{i as T}from"../../if.js";import{e as U,i as V}from"../../each.js";import{s as W,d as X}from"../../attributes.js";import{c as Y}from"../../custom-element-forward-events.js";var Z=k("<option disabled selected> </option>"),$=k("<option> </option>"),ee=k("<select><!><!></select>");const re={hash:"svelte-6nznl5",code:`/**
  * Do not edit directly, this file was auto-generated.
  */
-/* stylelint-disable string-no-newline */.mc-select.svelte-13f62in {appearance:none;font-family:inherit;transition:box-shadow 200ms ease;font-size:var(--font-size-150, 1rem);line-height:var(--line-height-s, 1.3);height:3rem;padding:0 3rem 0 0.75rem;background-position:right 1rem center;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' height='1rem' width='1rem' fill='var(--forms-color-icon-interactive, %23000000)' viewBox='0 0 16 16'%3E%3Cpath d='M8 11.5a1 1 0 01-.71-.29l-5-5a1 1 0 011.42-1.42L8 9.09l4.29-4.3a1 1 0 111.42 1.42l-5 5a1 1 0 01-.71.29z'/%3E%3C/svg%3E");border:var(--border-s, 1px) solid var(--forms-color-border-default, #666666);border-radius:var(--radius-s, 0.25rem);display:block;width:100%;color:var(--forms-color-text-default, #000000);background-color:var(--forms-color-background-default, #ffffff);text-overflow:ellipsis;background-repeat:no-repeat;background-size:1rem;}.mc-select.svelte-13f62in:hover {border-color:var(--forms-color-border-hover, #4d4d4d);box-shadow:0 0 0 var(--border-s, 1px) var(--forms-color-border-hover, #4d4d4d);}.mc-select.svelte-13f62in: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-select.svelte-13f62in:disabled {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' height='1rem' width='1rem' fill='var(--forms-color-icon-disabled, %23737373)' viewBox='0 0 16 16'%3E%3Cpath d='M8 11.5a1 1 0 01-.71-.29l-5-5a1 1 0 011.42-1.42L8 9.09l4.29-4.3a1 1 0 111.42 1.42l-5 5a1 1 0 01-.71.29z'/%3E%3C/svg%3E");background-color:var(--forms-color-background-disabled, #d9d9d9);border-color:transparent;cursor:not-allowed;box-shadow:none;color:var(--forms-color-text-disabled, #737373);}.mc-select--readonly.svelte-13f62in {border-color:var(--forms-color-border-read-only, #cccccc);pointer-events:none;}.mc-select.is-invalid.svelte-13f62in {border-color:var(--forms-color-border-invalid, #ea302d);box-shadow:0 0 0 var(--border-s, 1px) var(--forms-color-border-invalid, #ea302d);}.mc-select.is-invalid.svelte-13f62in:hover {border-color:var(--forms-color-border-invalid-hover, #c61112);box-shadow:0 0 0 var(--border-s, 1px) var(--forms-color-border-invalid-hover, #c61112);}.mc-select--s.svelte-13f62in {font-size:var(--font-size-100, 0.875rem);line-height:var(--line-height-s, 1.3);height:2rem;padding:0 2rem 0 0.5rem;background-position:right 0.5rem center;}
+/* stylelint-disable string-no-newline */.mc-select.svelte-6nznl5 {appearance:none;font-family:inherit;transition:box-shadow 200ms ease;font-size:var(--font-size-150, 1rem);line-height:var(--line-height-s, 1.3);height:3rem;padding:0 3rem 0 0.75rem;background-position:right 1rem center;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' height='1rem' width='1rem' fill='var(--forms-color-icon-interactive, %23000000)' viewBox='0 0 16 16'%3E%3Cpath d='M8 11.5a1 1 0 01-.71-.29l-5-5a1 1 0 011.42-1.42L8 9.09l4.29-4.3a1 1 0 111.42 1.42l-5 5a1 1 0 01-.71.29z'/%3E%3C/svg%3E");border:var(--border-s, 1px) solid var(--forms-color-border-default, #666666);border-radius:var(--radius-s, 0.25rem);display:block;width:100%;color:var(--forms-color-text-default, #000000);background-color:var(--forms-color-background-default, #ffffff);text-overflow:ellipsis;background-repeat:no-repeat;background-size:1rem;}.mc-select.svelte-6nznl5:hover {border-color:var(--forms-color-border-hover, #4d4d4d);box-shadow:0 0 0 var(--border-s, 1px) var(--forms-color-border-hover, #4d4d4d);}.mc-select.svelte-6nznl5: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-select.svelte-6nznl5:disabled {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' height='1rem' width='1rem' fill='var(--forms-color-icon-disabled, %23737373)' viewBox='0 0 16 16'%3E%3Cpath d='M8 11.5a1 1 0 01-.71-.29l-5-5a1 1 0 011.42-1.42L8 9.09l4.29-4.3a1 1 0 111.42 1.42l-5 5a1 1 0 01-.71.29z'/%3E%3C/svg%3E");background-color:var(--forms-color-background-disabled, #d9d9d9);border-color:transparent;cursor:not-allowed;box-shadow:none;color:var(--forms-color-text-disabled, #737373);}.mc-select--readonly.svelte-6nznl5 {border-color:var(--forms-color-border-read-only, #cccccc);pointer-events:none;}.mc-select.is-invalid.svelte-6nznl5 {border-color:var(--forms-color-border-invalid, #ea302d);box-shadow:0 0 0 var(--border-s, 1px) var(--forms-color-border-invalid, #ea302d);}.mc-select.is-invalid.svelte-6nznl5:hover {border-color:var(--forms-color-border-invalid-hover, #c61112);box-shadow:0 0 0 var(--border-s, 1px) var(--forms-color-border-invalid-hover, #c61112);}.mc-select--s.svelte-6nznl5 {font-size:var(--font-size-100, 0.875rem);line-height:var(--line-height-s, 1.3);height:2rem;padding:0 2rem 0 0.5rem;background-position:right 0.5rem center;}
 
-/* stylelint-enable string-no-newline */`};function re(E,o){F(o,!0),G(E,ee);let c=s(o,"id",7),v=s(o,"valueselected",7,""),d=s(o,"placeholder",7),u=s(o,"size",7,"m"),f=s(o,"isvalid",7,!1),m=s(o,"isinvalid",7,!1),h=s(o,"disabled",7,!1),b=s(o,"required",7,!1),g=s(o,"options",7),p=s(o,"onchange",7),x=s(o,"onblur",7),C=H(I(v()));function j(e,r,a){const l=["mc-select"];return e&&l.push("is-valid"),r&&l.push("is-invalid"),a&&l.push(`mc-select--${a}`),l.join(" ")}var i=$();i.__change=function(...e){var r;(r=p())==null||r.apply(this,e)};var q=w(i);{var L=e=>{var r=Y(),a=w(r);k(r),r.value=r.__value="",_(()=>S(a,`-- ${d()??""} --`)),y(e,r)};R(q,e=>{d()&&e(L)})}var M=J(q);return T(M,17,g,U,(e,r)=>{var a=Z(),l=w(a,!0);k(a);var B={};_(()=>{a.disabled=n(r).disabled,S(l,n(r).text),B!==(B=n(r).value)&&(a.value=(a.__value=n(r).value)??"")}),y(e,a)}),k(i),_(e=>{V(i,"id",c()),N(i,1,e,"svelte-13f62in"),i.disabled=h(),i.required=b()},[()=>K(j(f(),m(),u()))]),O("blur",i,function(...e){var r;(r=x())==null||r.apply(this,e)}),W(i,()=>n(C),e=>Q(C,e)),y(E,i),P({get id(){return c()},set id(e){c(e),t()},get valueselected(){return v()},set valueselected(e=""){v(e),t()},get placeholder(){return d()},set placeholder(e){d(e),t()},get size(){return u()},set size(e="m"){u(e),t()},get isvalid(){return f()},set isvalid(e=!1){f(e),t()},get isinvalid(){return m()},set isinvalid(e=!1){m(e),t()},get disabled(){return h()},set disabled(e=!1){h(e),t()},get required(){return b()},set required(e=!1){b(e),t()},get options(){return g()},set options(e){g(e),t()},get onchange(){return p()},set onchange(e){p(e),t()},get onblur(){return x()},set onblur(e){x(e),t()}})}A(["change"]);customElements.define("m-select",D(re,{options:{attribute:"options",type:"Array"},id:{},valueselected:{},placeholder:{},size:{},isvalid:{},isinvalid:{},disabled:{},required:{},onchange:{},onblur:{}},[],[],!0,X));
+/* stylelint-enable string-no-newline */`};function oe(E,o){G(o,!0),H(E,re);let c=s(o,"id",7),v=s(o,"valueselected",7,""),d=s(o,"placeholder",7),u=s(o,"size",7,"m"),m=s(o,"isvalid",7,!1),f=s(o,"isinvalid",7,!1),h=s(o,"disabled",7,!1),b=s(o,"required",7,!1),g=s(o,"options",7),p=s(o,"onchange",7),x=s(o,"onblur",7),C=I(J(v()));function B(e,r,a){const i=["mc-select"];return e&&i.push("is-valid"),r&&i.push("is-invalid"),a&&i.push(`mc-select--${a}`),i.join(" ")}var L={get id(){return c()},set id(e){c(e),t()},get valueselected(){return v()},set valueselected(e=""){v(e),t()},get placeholder(){return d()},set placeholder(e){d(e),t()},get size(){return u()},set size(e="m"){u(e),t()},get isvalid(){return m()},set isvalid(e=!1){m(e),t()},get isinvalid(){return f()},set isinvalid(e=!1){f(e),t()},get disabled(){return h()},set disabled(e=!1){h(e),t()},get required(){return b()},set required(e=!1){b(e),t()},get options(){return g()},set options(e){g(e),t()},get onchange(){return p()},set onchange(e){p(e),t()},get onblur(){return x()},set onblur(e){x(e),t()}},l=ee();l.__change=function(...e){var r;(r=p())==null||r.apply(this,e)};var q=w(l);{var M=e=>{var r=Z(),a=w(r);y(r),r.value=r.__value="",_(()=>j(a,`-- ${d()??""} --`)),z(e,r)};T(q,e=>{d()&&e(M)})}var A=K(q);return U(A,17,g,V,(e,r)=>{var a=$(),i=w(a,!0);y(a);var S={};_(()=>{a.disabled=n(r).disabled,j(i,n(r).text),S!==(S=n(r).value)&&(a.value=(a.__value=n(r).value)??"")}),z(e,a)}),y(l),_(e=>{W(l,"id",c()),O(l,1,e,"svelte-6nznl5"),l.disabled=h(),l.required=b()},[()=>N(B(m(),f(),u()))]),P("blur",l,function(...e){var r;(r=x())==null||r.apply(this,e)}),X(l,()=>n(C),e=>R(C,e)),z(E,l),Q(L)}D(["change"]);customElements.define("m-select",F(oe,{options:{attribute:"options",type:"Array"},id:{},valueselected:{},placeholder:{},size:{},isvalid:{},isinvalid:{},disabled:{},required:{},onchange:{},onblur:{}},[],[],!0,Y));
 //# sourceMappingURL=Select.js.map

package/dist/components/select/Select.js.map

@@ -1 +1 @@
-{"version":3,"file":"Select.js","sources":["../../../src/components/select/Select.svelte"],"sourcesContent":["<svelte:options\n  customElement={{\n    tag: 'm-select',\n    props: {\n      options: { type: 'Array', attribute: 'options' },\n    },\n    extend: customElementForwardEvents,\n  }}\n/>\n\n<script lang=\"ts\">\n  import { customElementForwardEvents } from '../../utils';\n  import type { SelectOption, SelectSize } from './select.types';\n\n  interface Props {\n    id: string;\n    name: string;\n    valueselected?: string;\n    placeholder: string;\n    size?: SelectSize;\n    isvalid?: boolean;\n    isinvalid?: boolean;\n    disabled?: boolean;\n    required?: boolean;\n    options: Array<SelectOption>;\n    onchange?: (event: Event) => void;\n    onblur?: (event: FocusEvent) => void;\n  }\n\n  let {\n    id,\n    valueselected = '',\n    placeholder,\n    size = 'm',\n    isvalid = false,\n    isinvalid = false,\n    disabled = false,\n    required = false,\n    options,\n    onchange,\n    onblur,\n  }: Props = $props();\n  let valueSelected = $state(valueselected);\n\n  function setClasses(isvalid: boolean, isinvalid: boolean, size: SelectSize): string {\n    const classes = ['mc-select'];\n\n    if(isvalid) {\n      classes.push('is-valid');\n    }\n\n    if (isinvalid) {\n      classes.push('is-invalid');\n    }\n    if (size) {\n      classes.push(`mc-select--${size}`);\n    }\n\n    return classes.join(' ');\n  }\n</script>\n\n<select\n  {id}\n  class={setClasses(isvalid, isinvalid, size)}\n  {disabled}\n  {required}\n  bind:value={valueSelected}\n  {onchange}\n  {onblur}\n>\n  {#if placeholder}\n    <option value=\"\" disabled selected>\n      -- {placeholder} --\n    </option>\n  {/if}\n\n  {#each options as opt}\n    <option disabled={opt.disabled} value={opt.value}>\n      {opt.text}\n    </option>\n  {/each}\n</select>\n\n<style lang=\"scss\">\n  @use '@mozaic-ds/styles/components/select';\n</style>\n"],"names":["id","$.prop","$$props","valueselected","placeholder","size","isvalid","isinvalid","disabled","required","options","onchange","onblur","valueSelected","setClasses","classes","$$render","consequent","$.each","node_1","opt","option_1","$.get","$.set_text","text_1","option_1_value","$.clsx","$.bind_select_value","select","$$value","customElementForwardEvents"],"mappings":";;;;;2DAAA,qBA8BIA,EAAEC,EAAAC,EAAA,KAAA,CAAA,EACFC,wBAAgB,EAAE,EAClBC,EAAWH,EAAAC,EAAA,cAAA,CAAA,EACXG,eAAO,GAAG,EACVC,kBAAU,EAAK,EACfC,oBAAY,EAAK,EACjBC,mBAAW,EAAK,EAChBC,mBAAW,EAAK,EAChBC,EAAOT,EAAAC,EAAA,UAAA,CAAA,EACPS,EAAQV,EAAAC,EAAA,WAAA,CAAA,EACRU,EAAMX,EAAAC,EAAA,SAAA,CAAA,EAEJW,MAAuBV,EAAa,CAAA,CAAA,EAE/B,SAAAW,EAAWR,EAAkBC,EAAoBF,EAA0B,CAC5E,MAAAU,GAAW,WAAW,EAEzB,OAAAT,GACDS,EAAQ,KAAK,UAAU,EAGrBR,GACFQ,EAAQ,KAAK,YAAY,EAEvBV,GACFU,EAAQ,KAAI,cAAeV,CAAI,EAAA,EAG1BU,EAAQ,KAAK,GAAG,CACzB,4JAcQX,KAAW,EAAA,KAAA,CAAA,kBAFdA,EAAW,GAAAY,EAAAC,CAAA,eAMTC,OAAAA,EAAAC,EAAA,GAAAT,OAAWU,IAAG,0CACDC,EAAA,SAAAC,EAAAF,CAAG,EAAC,SACnBG,EAAAC,EAAAF,EAAAF,CAAG,EAAC,IAAI,EAD4BK,KAAAA,EAAAH,EAAAF,CAAG,EAAC,SAAJC,EAAA,OAAAA,EAAA,QAAAC,EAAAF,CAAG,EAAC,QAAK,iGAd3C,CAAA,IAAAM,EAAAZ,EAAWR,EAAS,EAAAC,IAAWF,EAAI,CAAA,CAAA,CAAA,oEAG9BsB,EAAAC,EAAA,IAAAN,EAAAT,CAAa,OAAbA,EAAagB,CAAA,CAAA,yGApCP,GAAE,wGAEX,IAAG,mDACA,GAAK,uDACH,GAAK,qDACN,GAAK,qDACL,GAAK,qKAuBpB,+NAtDYC"}
+{"version":3,"file":"Select.js","sources":["../../../src/components/select/Select.svelte"],"sourcesContent":["<svelte:options\n  customElement={{\n    tag: 'm-select',\n    props: {\n      options: { type: 'Array', attribute: 'options' },\n    },\n    extend: customElementForwardEvents,\n  }}\n/>\n\n<script lang=\"ts\">\n  import { customElementForwardEvents } from '../../utils';\n  import type { SelectOption, SelectSize } from './select.types';\n\n  interface Props {\n    id: string;\n    name: string;\n    valueselected?: string;\n    placeholder: string;\n    size?: SelectSize;\n    isvalid?: boolean;\n    isinvalid?: boolean;\n    disabled?: boolean;\n    required?: boolean;\n    options: Array<SelectOption>;\n    onchange?: (event: Event) => void;\n    onblur?: (event: FocusEvent) => void;\n  }\n\n  let {\n    id,\n    valueselected = '',\n    placeholder,\n    size = 'm',\n    isvalid = false,\n    isinvalid = false,\n    disabled = false,\n    required = false,\n    options,\n    onchange,\n    onblur,\n  }: Props = $props();\n  let valueSelected = $state(valueselected);\n\n  function setClasses(isvalid: boolean, isinvalid: boolean, size: SelectSize): string {\n    const classes = ['mc-select'];\n\n    if(isvalid) {\n      classes.push('is-valid');\n    }\n\n    if (isinvalid) {\n      classes.push('is-invalid');\n    }\n    if (size) {\n      classes.push(`mc-select--${size}`);\n    }\n\n    return classes.join(' ');\n  }\n</script>\n\n<select\n  {id}\n  class={setClasses(isvalid, isinvalid, size)}\n  {disabled}\n  {required}\n  bind:value={valueSelected}\n  {onchange}\n  {onblur}\n>\n  {#if placeholder}\n    <option value=\"\" disabled selected>\n      -- {placeholder} --\n    </option>\n  {/if}\n\n  {#each options as opt}\n    <option disabled={opt.disabled} value={opt.value}>\n      {opt.text}\n    </option>\n  {/each}\n</select>\n\n<style lang=\"scss\">\n  @use '@mozaic-ds/styles/components/select';\n</style>\n"],"names":["id","$.prop","$$props","valueselected","placeholder","size","isvalid","isinvalid","disabled","required","options","onchange","onblur","valueSelected","setClasses","classes","$$render","consequent","$.each","node_1","opt","option_1","$.get","$.set_text","text_1","option_1_value","$.clsx","$.bind_select_value","select","$$value","customElementForwardEvents"],"mappings":";;;;;2DAAA,qBA8BIA,EAAEC,EAAAC,EAAA,KAAA,CAAA,EACFC,wBAAgB,EAAE,EAClBC,EAAWH,EAAAC,EAAA,cAAA,CAAA,EACXG,eAAO,GAAG,EACVC,kBAAU,EAAK,EACfC,oBAAY,EAAK,EACjBC,mBAAW,EAAK,EAChBC,mBAAW,EAAK,EAChBC,EAAOT,EAAAC,EAAA,UAAA,CAAA,EACPS,EAAQV,EAAAC,EAAA,WAAA,CAAA,EACRU,EAAMX,EAAAC,EAAA,SAAA,CAAA,EAEJW,MAAuBV,EAAa,CAAA,CAAA,EAE/B,SAAAW,EAAWR,EAAkBC,EAAoBF,EAA0B,CAC5E,MAAAU,GAAW,WAAW,EAEzB,OAAAT,GACDS,EAAQ,KAAK,UAAU,EAGrBR,GACFQ,EAAQ,KAAK,YAAY,EAEvBV,GACFU,EAAQ,KAAI,cAAeV,CAAI,EAAA,EAG1BU,EAAQ,KAAK,GAAG,CACzB,qGA5BkB,GAAE,wGAEX,IAAG,mDACA,GAAK,uDACH,GAAK,qDACN,GAAK,qDACL,GAAK,6TAoCVX,KAAW,EAAA,KAAA,CAAA,kBAFdA,EAAW,GAAAY,EAAAC,CAAA,eAMTC,OAAAA,EAAAC,EAAA,GAAAT,OAAWU,IAAG,0CACDC,EAAA,SAAAC,EAAAF,CAAG,EAAC,SACnBG,EAAAC,EAAAF,EAAAF,CAAG,EAAC,IAAI,EAD4BK,KAAAA,EAAAH,EAAAF,CAAG,EAAC,SAAJC,EAAA,OAAAA,EAAA,QAAAC,EAAAF,CAAG,EAAC,QAAK,gGAd3C,CAAA,IAAAM,EAAAZ,EAAWR,EAAO,EAAEC,EAAS,EAAEF,EAAI,CAAA,CAAA,CAAA,oEAG9BsB,EAAAC,EAAA,IAAAN,EAAAT,CAAa,OAAbA,EAAagB,CAAA,CAAA,aAP3B,+NAtDYC"}

package/dist/components/statusbadge/StatusBadge.js

@@ -1,4 +1,4 @@
-import{c as u,p as i,a as b,b as g,f as m,d,s as v,t as f,h as p,i as h,j as k,r as c,e as q}from"../../custom-element.js";import{s as w}from"../../slot.js";import{S as _}from"../statusdot/StatusDot.js";var x=m('<div><!> <span class="mc-status-badge__label svelte-4n1qei"><!></span></div>');const y={hash:"svelte-4n1qei",code:`/**
+import{c as b,p as g,a as i,b as f,f as m,d,s as v,t as p,h,i as y,j as k,r as c,e as w}from"../../custom-element.js";import{s as _}from"../../slot.js";import{S as x}from"../statusdot/StatusDot.js";var S=m('<div><!> <span class="mc-status-badge__label svelte-1oceydf"><!></span></div>');const z={hash:"svelte-1oceydf",code:`/**
  * Do not edit directly, this file was auto-generated.
- */.mc-status-badge.svelte-4n1qei {background-color:var(--status-badge-color-background-information, #e1f3f9);border:var(--border-s, 1px) solid var(--status-badge-color-border-information, #a7d9ed);border-radius:var(--radius-s, 0.25rem);font-weight:var(--font-weight-regular, 400);font-size:var(--font-size-100, 0.875rem);display:inline-flex;align-items:center;gap:0.25rem;padding-right:0.5rem;padding-left:0.5rem;text-transform:lowercase;white-space:nowrap;min-height:1.5rem;}.mc-status-badge__label.svelte-4n1qei {color:var(--status-badge-color-label, #000000);}.mc-status-badge__label.svelte-4n1qei::first-letter {text-transform:uppercase;}.mc-status-badge--success.svelte-4n1qei {background-color:var(--status-badge-color-background-success, #ebf5de);border:var(--border-s, 1px) solid var(--status-badge-color-border-success, #c5e39e);}.mc-status-badge--error.svelte-4n1qei {background-color:var(--status-badge-color-background-error, #fdeaea);border:var(--border-s, 1px) solid var(--status-badge-color-border-error, #f8bcbb);}.mc-status-badge--warning.svelte-4n1qei {background-color:var(--status-badge-color-background-warning, #fdf1e8);border:var(--border-s, 1px) solid var(--status-badge-color-border-warning, #f8d2b3);}.mc-status-badge--neutral.svelte-4n1qei {background-color:var(--status-badge-color-background-neutral, #f2f2f2);border:var(--border-s, 1px) solid var(--status-badge-color-border-neutral, #cccccc);}.mc-status-dot.svelte-4n1qei {background-color:var(--status-dot-color-background-information, #0b96cc);height:0.5rem;width:0.5rem;border-radius:var(--radius-full, 100%);display:inline-block;}.mc-status-dot--s.svelte-4n1qei {height:0.25rem;width:0.25rem;}.mc-status-dot--l.svelte-4n1qei {height:1rem;width:1rem;}.mc-status-dot--success.svelte-4n1qei {background-color:var(--status-dot-color-background-success, #3f9e10);}.mc-status-dot--error.svelte-4n1qei {background-color:var(--status-dot-color-background-error, #ea302d);}.mc-status-dot--warning.svelte-4n1qei {background-color:var(--status-dot-color-background-warning, #ea7315);}.mc-status-dot--neutral.svelte-4n1qei {background-color:var(--status-dot-color-background-neutral, #808080);}`};function S(a,t){i(t,!0),b(a,y);let e=g(t,"status",7);var r=x(),s=d(r);_(s,{get status(){return e()},size:"m"});var o=v(s,2),n=d(o);return w(n,t,"default",{}),c(o),c(r),f(()=>q(r,1,`mc-status-badge ${e()?`mc-status-badge--${e()}`:""}`,"svelte-4n1qei")),p(a,r),h({get status(){return e()},set status(l){e(l),k()}})}customElements.define("m-status-badge",u(S,{status:{}},["default"],[],!0));
+ */.mc-status-badge.svelte-1oceydf {background-color:var(--status-badge-color-background-information, #e1f3f9);border:var(--border-s, 1px) solid var(--status-badge-color-border-information, #a7d9ed);border-radius:var(--radius-s, 0.25rem);font-weight:var(--font-weight-regular, 400);font-size:var(--font-size-100, 0.875rem);display:inline-flex;align-items:center;gap:0.25rem;padding-right:0.5rem;padding-left:0.5rem;text-transform:lowercase;white-space:nowrap;min-height:1.5rem;}.mc-status-badge__label.svelte-1oceydf {color:var(--status-badge-color-label, #000000);}.mc-status-badge__label.svelte-1oceydf::first-letter {text-transform:uppercase;}.mc-status-badge--success.svelte-1oceydf {background-color:var(--status-badge-color-background-success, #ebf5de);border:var(--border-s, 1px) solid var(--status-badge-color-border-success, #c5e39e);}.mc-status-badge--error.svelte-1oceydf {background-color:var(--status-badge-color-background-error, #fdeaea);border:var(--border-s, 1px) solid var(--status-badge-color-border-error, #f8bcbb);}.mc-status-badge--warning.svelte-1oceydf {background-color:var(--status-badge-color-background-warning, #fdf1e8);border:var(--border-s, 1px) solid var(--status-badge-color-border-warning, #f8d2b3);}.mc-status-badge--neutral.svelte-1oceydf {background-color:var(--status-badge-color-background-neutral, #f2f2f2);border:var(--border-s, 1px) solid var(--status-badge-color-border-neutral, #cccccc);}.mc-status-dot.svelte-1oceydf {background-color:var(--status-dot-color-background-information, #0b96cc);height:0.5rem;width:0.5rem;border-radius:var(--radius-full, 100%);display:inline-block;}.mc-status-dot--s.svelte-1oceydf {height:0.25rem;width:0.25rem;}.mc-status-dot--l.svelte-1oceydf {height:1rem;width:1rem;}.mc-status-dot--success.svelte-1oceydf {background-color:var(--status-dot-color-background-success, #3f9e10);}.mc-status-dot--error.svelte-1oceydf {background-color:var(--status-dot-color-background-error, #ea302d);}.mc-status-dot--warning.svelte-1oceydf {background-color:var(--status-dot-color-background-warning, #ea7315);}.mc-status-dot--neutral.svelte-1oceydf {background-color:var(--status-dot-color-background-neutral, #808080);}`};function D(a,t){g(t,!0),i(a,z);let e=f(t,"status",7);var l={get status(){return e()},set status(n){e(n),k()}},r=S(),s=d(r);x(s,{get status(){return e()},size:"m"});var o=v(s,2),u=d(o);return _(u,t,"default",{}),c(o),c(r),p(()=>w(r,1,`mc-status-badge ${e()?`mc-status-badge--${e()}`:""}`,"svelte-1oceydf")),h(a,r),y(l)}customElements.define("m-status-badge",b(D,{status:{}},["default"],[],!0));
 //# sourceMappingURL=StatusBadge.js.map

package/dist/components/statusbadge/StatusBadge.js.map

@@ -1 +1 @@
-{"version":3,"file":"StatusBadge.js","sources":["../../../src/components/statusbadge/StatusBadge.svelte"],"sourcesContent":["<svelte:options customElement={{ tag: 'm-status-badge' }} />\n\n<script lang=\"ts\">\n  import type { StatusBadgeStyle } from './StatusBadge.types';\n  import StatusDot from '../statusdot/StatusDot.svelte';\n\n  interface Props {\n    status: StatusBadgeStyle;\n  }\n\n  let { status }: Props = $props();\n</script>\n\n<div class=\"mc-status-badge {status ? `mc-status-badge--${status}` : ''}\">\n  <StatusDot {status} size=\"m\" />\n  <span class=\"mc-status-badge__label\"><slot /></span>\n</div>\n\n<style lang=\"scss\">\n  @use '@mozaic-ds/styles/components/status-badge';\n  @use '@mozaic-ds/styles/components/status-dot';\n</style>\n"],"names":["status","$.prop","$$props"],"mappings":";;0oEAAA,oBAUQA,EAAMC,EAAAC,EAAA,SAAA,CAAA,oJAGeF,EAAM,EAAA,oBAAuBA,EAAM,CAAA,GAAK,EAAE,GAAA,eAAA,CAAA,8DAFvE"}
+{"version":3,"file":"StatusBadge.js","sources":["../../../src/components/statusbadge/StatusBadge.svelte"],"sourcesContent":["<svelte:options customElement={{ tag: 'm-status-badge' }} />\n\n<script lang=\"ts\">\n  import type { StatusBadgeStyle } from './StatusBadge.types';\n  import StatusDot from '../statusdot/StatusDot.svelte';\n\n  interface Props {\n    status: StatusBadgeStyle;\n  }\n\n  let { status }: Props = $props();\n</script>\n\n<div class=\"mc-status-badge {status ? `mc-status-badge--${status}` : ''}\">\n  <StatusDot {status} size=\"m\" />\n  <span class=\"mc-status-badge__label\"><slot /></span>\n</div>\n\n<style lang=\"scss\">\n  @use '@mozaic-ds/styles/components/status-badge';\n  @use '@mozaic-ds/styles/components/status-dot';\n</style>\n"],"names":["status","$.prop","$$props"],"mappings":";;wpEAAA,oBAUQA,EAAMC,EAAAC,EAAA,SAAA,CAAA,yMAGeF,EAAM,EAAA,oBAAuBA,EAAM,CAAA,GAAK,EAAE,GAAA,gBAAA,CAAA,aAFvE"}

package/dist/components/statusdot/StatusDot.js

@@ -1,4 +1,4 @@
-import{c as d,p as l,a as n,b as u,f as i,t as v,h as m,i as y,j as c,e as g}from"../../custom-element.js";var h=i("<div></div>");const b={hash:"svelte-1yyojv2",code:`/**
+import{c as l,p as n,a as i,b as c,f as m,t as v,h as p,i as g,j as u,e as h}from"../../custom-element.js";var b=m("<div></div>");const f={hash:"svelte-14acsp3",code:`/**
  * Do not edit directly, this file was auto-generated.
- */.mc-status-dot.svelte-1yyojv2 {background-color:var(--status-dot-color-background-information, #0b96cc);height:0.5rem;width:0.5rem;border-radius:var(--radius-full, 100%);display:inline-block;}.mc-status-dot--s.svelte-1yyojv2 {height:0.25rem;width:0.25rem;}.mc-status-dot--l.svelte-1yyojv2 {height:1rem;width:1rem;}.mc-status-dot--success.svelte-1yyojv2 {background-color:var(--status-dot-color-background-success, #3f9e10);}.mc-status-dot--error.svelte-1yyojv2 {background-color:var(--status-dot-color-background-error, #ea302d);}.mc-status-dot--warning.svelte-1yyojv2 {background-color:var(--status-dot-color-background-warning, #ea7315);}.mc-status-dot--neutral.svelte-1yyojv2 {background-color:var(--status-dot-color-background-neutral, #808080);}`};function f(a,e){l(e,!0),n(a,b);let t=u(e,"size",7),s=u(e,"status",7);var r=h();return v(()=>g(r,1,`mc-status-dot ${t()?`mc-status-dot--${t()}`:""}  ${s()?`mc-status-dot--${s()}`:""}`,"svelte-1yyojv2")),m(a,r),y({get size(){return t()},set size(o){t(o),c()},get status(){return s()},set status(o){s(o),c()}})}customElements.define("m-status-dot",d(f,{size:{},status:{}},[],[],!0));export{f as S};
+ */.mc-status-dot.svelte-14acsp3 {background-color:var(--status-dot-color-background-information, #0b96cc);height:0.5rem;width:0.5rem;border-radius:var(--radius-full, 100%);display:inline-block;}.mc-status-dot--s.svelte-14acsp3 {height:0.25rem;width:0.25rem;}.mc-status-dot--l.svelte-14acsp3 {height:1rem;width:1rem;}.mc-status-dot--success.svelte-14acsp3 {background-color:var(--status-dot-color-background-success, #3f9e10);}.mc-status-dot--error.svelte-14acsp3 {background-color:var(--status-dot-color-background-error, #ea302d);}.mc-status-dot--warning.svelte-14acsp3 {background-color:var(--status-dot-color-background-warning, #ea7315);}.mc-status-dot--neutral.svelte-14acsp3 {background-color:var(--status-dot-color-background-neutral, #808080);}`};function k(o,a){n(a,!0),i(o,f);let t=c(a,"size",7,"m"),s=c(a,"status",7,"info");var d={get size(){return t()},set size(e="m"){t(e),u()},get status(){return s()},set status(e="info"){s(e),u()}},r=b();return v(()=>h(r,1,`mc-status-dot ${t()?`mc-status-dot--${t()}`:""}  ${s()?`mc-status-dot--${s()}`:""}`,"svelte-14acsp3")),p(o,r),g(d)}customElements.define("m-status-dot",l(k,{size:{},status:{}},[],[],!0));export{k as S};
 //# sourceMappingURL=StatusDot.js.map

package/dist/components/statusdot/StatusDot.js.map

@@ -1 +1 @@
-{"version":3,"file":"StatusDot.js","sources":["../../../src/components/statusdot/StatusDot.svelte"],"sourcesContent":["<svelte:options customElement={{ tag: 'm-status-dot' }} />\n\n<script lang=\"ts\">\n  import type { DotStyle, DotSize } from './StatusDot.types';\n\n  interface Props {\n    status: DotStyle;\n    size: DotSize;\n  }\n\n  let { size, status }: Props = $props();\n</script>\n\n<div\n  class=\"mc-status-dot {size ? `mc-status-dot--${size}` : ''}  {status\n    ? `mc-status-dot--${status}`\n    : ''}\"\n></div>\n\n<style lang=\"scss\">\n  @use '@mozaic-ds/styles/components/status-dot';\n</style>\n"],"names":["size","$.prop","$$props","status"],"mappings":";;mwBAAA,oBAUQA,EAAIC,EAAAC,EAAA,OAAA,CAAA,EAAEC,EAAMF,EAAAC,EAAA,SAAA,CAAA,gDAIIF,IAAI,kBAAqBA,GAAS,GAAA,EAAE,KAAIG,IACxC,kBAAAA,MAClB,EAAE,GAAA,gBAAA,CAAA,2GALR"}
+{"version":3,"file":"StatusDot.js","sources":["../../../src/components/statusdot/StatusDot.svelte"],"sourcesContent":["<svelte:options customElement={{ tag: 'm-status-dot' }} />\n\n<script lang=\"ts\">\n  /**\n   * A Status dot is a small visual indicator used to represent the state or condition of an element. It is often color-coded to convey different statuses at a glance, such as availability, activity, or urgency. Status Dots are commonly found in user presence indicators, system statuses, or process tracking to provide quick, unobtrusive feedback.\n   */\n  interface Props {\n    /**\n     * Allows to define the status dot type.\n     */\n    status: 'info' | 'success' | 'warning' | 'error' | 'neutral';\n    /**\n     * Determines the size of the status dot.\n     */\n\t\tsize: 's' | 'm' | 'l'\n\t}\n\n  let { size = 'm', status = 'info'}: Props = $props();\n</script>\n\n<div\n  class=\"mc-status-dot {size ? `mc-status-dot--${size}` : ''}  {status\n    ? `mc-status-dot--${status}`\n    : ''}\"\n></div>\n\n<style lang=\"scss\">\n  @use '@mozaic-ds/styles/components/status-dot';\n</style>\n"],"names":["size","status"],"mappings":";;mwBAAA,gBAiBQ,IAAAA,eAAO,GAAG,EAAEC,iBAAS,MAAM,2CAApB,IAAG,iDAAW,OAAM,sDAIXD,IAAI,kBAAqBA,GAAI,GAAK,EAAE,KAAIC,IAAA,kBACxCA,MAClB,EAAE,GAAA,gBAAA,CAAA,aALR"}

package/dist/components/statusdot/StatusDot.stories.d.ts

@@ -1,14 +1,11 @@
-import type { Meta } from '@storybook/html-vite';
-/**
- * A Status Dot indicates the status of an entity and can evolve at any time.
- *
- * The `MStatusDot` component is the **Svelte / WebComponent** implementation of the **Status Dot** component of Mozaic Design System.
- */
-declare const _default: Meta;
-export default _default;
-export declare const Default: any;
-export declare const Warning: any;
-export declare const Error: any;
-export declare const Success: any;
-export declare const Large: any;
+import type { Meta, StoryObj } from '@storybook/web-components-vite';
+declare const meta: Meta;
+export default meta;
+type Story = StoryObj;
+export declare const Info: Story;
+export declare const Success: Story;
+export declare const Warning: Story;
+export declare const Error: Story;
+export declare const Neutral: Story;
+export declare const Size: Story;
 //# sourceMappingURL=StatusDot.stories.d.ts.map

package/dist/components/statusdot/StatusDot.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StatusDot.stories.d.ts","sourceRoot":"","sources":["../../../src/components/statusdot/StatusDot.stories.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAW,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAG1D;;;;GAIG;wBAiBE,IAAI;AAfT,wBAeU;AASV,eAAO,MAAM,OAAO,KAAoB,CAAC;AAOzC,eAAO,MAAM,OAAO,KAAoB,CAAC;AAOzC,eAAO,MAAM,KAAK,KAAoB,CAAC;AAOvC,eAAO,MAAM,OAAO,KAAoB,CAAC;AAOzC,eAAO,MAAM,KAAK,KAAoB,CAAC"}
+{"version":3,"file":"StatusDot.stories.d.ts","sourceRoot":"","sources":["../../../src/components/statusdot/StatusDot.stories.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAIrE,QAAA,MAAM,IAAI,EAAE,IAgDX,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC;AAEtB,eAAO,MAAM,IAAI,EAAE,KAAU,CAAC;AAE9B,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAEnB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,KAElB,CAAC"}

package/dist/components/statusdot/StatusDot.stories.js

@@ -1,60 +1,66 @@
-import { expect } from 'storybook/test';
-/**
- * A Status Dot indicates the status of an entity and can evolve at any time.
- *
- * The `MStatusDot` component is the **Svelte / WebComponent** implementation of the **Status Dot** component of Mozaic Design System.
- */
-export default {
+import { html } from 'lit';
+import { unsafeHTML } from 'lit/directives/unsafe-html.js';
+const meta = {
     title: 'Status/Status Dot',
-    tags: ['autodocs', 'code-only'],
+    component: 'm-status-dot',
+    parameters: {
+        docs: {
+            description: {
+                component: 'A Status dot is a small visual indicator used to represent the state or condition of an element. It is often color-coded to convey different statuses at a glance, such as availability, activity, or urgency. Status Dots are commonly found in user presence indicators, system statuses, or process tracking to provide quick, unobtrusive feedback.',
+            },
+        },
+    },
     argTypes: {
         status: {
-            description: 'Specify the badge type',
+            description: 'Allows to define the status dot type.',
             control: { type: 'radio' },
             options: ['neutral', 'warning', 'error', 'success', 'info'],
+            table: {
+                type: {
+                    summary: 'neutral | warning | error | success | info',
+                },
+                defaultValue: {
+                    summary: 'info',
+                },
+                category: 'attributes',
+            },
         },
         size: {
-            description: 'Specify the size of the badge',
+            description: 'Determines the size of the status dot.',
             control: { type: 'radio' },
             options: ['s', 'm', 'l'],
+            table: {
+                type: {
+                    summary: 's | m | l',
+                },
+                defaultValue: {
+                    summary: 'm',
+                },
+                category: 'attributes',
+            },
         },
     },
+    render: (args) => {
+        const attributes = Object.entries(args)
+            .map(([key, value]) => `${key}="${value}"`)
+            .join(' ');
+        return html `${unsafeHTML(`<m-status-dot ${attributes}></m-status-dot>`)}`;
+    },
 };
-const Template = (args) => {
-    const primary = document.createElement('m-status-dot');
-    if (args.status)
-        primary.setAttribute('status', args.status);
-    if (args.size)
-        primary.setAttribute('size', args.size);
-    return primary;
-};
-export const Default = Template.bind({});
-Default.args = {};
-Default.play = async ({ canvasElement }) => {
-    const dot = canvasElement.querySelector('m-status-dot');
-    expect(dot).not.toBeNull();
+export default meta;
+export const Info = {};
+export const Success = {
+    args: { status: 'success' },
 };
-export const Warning = Template.bind({});
-Warning.args = { status: 'warning' };
-Warning.play = async ({ canvasElement }) => {
-    const dot = canvasElement.querySelector('m-status-dot');
-    expect(dot).toHaveAttribute('status', 'warning');
+export const Warning = {
+    args: { status: 'warning' },
 };
-export const Error = Template.bind({});
-Error.args = { status: 'error' };
-Error.play = async ({ canvasElement }) => {
-    const dot = canvasElement.querySelector('m-status-dot');
-    expect(dot).toHaveAttribute('status', 'error');
+export const Error = {
+    args: { status: 'error' },
 };
-export const Success = Template.bind({});
-Success.args = { status: 'success' };
-Success.play = async ({ canvasElement }) => {
-    const dot = canvasElement.querySelector('m-status-dot');
-    expect(dot).toHaveAttribute('status', 'success');
+export const Neutral = {
+    args: { status: 'neutral' },
 };
-export const Large = Template.bind({});
-Large.args = { size: 'l' };
-Large.play = async ({ canvasElement }) => {
-    const dot = canvasElement.querySelector('m-status-dot');
-    expect(dot).toHaveAttribute('size', 'l');
+export const Size = {
+    args: { size: 'l' },
 };

package/dist/components/statusdot/StatusDot.svelte

@@ -1,14 +1,21 @@
 <svelte:options customElement={{ tag: 'm-status-dot' }} />
 
 <script lang="ts">
-  import type { DotStyle, DotSize } from './StatusDot.types';
-
+  /**
+   * A Status dot is a small visual indicator used to represent the state or condition of an element. It is often color-coded to convey different statuses at a glance, such as availability, activity, or urgency. Status Dots are commonly found in user presence indicators, system statuses, or process tracking to provide quick, unobtrusive feedback.
+   */
   interface Props {
-    status: DotStyle;
-    size: DotSize;
-  }
+    /**
+     * Allows to define the status dot type.
+     */
+    status: 'info' | 'success' | 'warning' | 'error' | 'neutral';
+    /**
+     * Determines the size of the status dot.
+     */
+		size: 's' | 'm' | 'l'
+	}
 
-  let { size, status }: Props = $props();
+  let { size = 'm', status = 'info'}: Props = $props();
 </script>
 
 <div

package/dist/components/statusdot/StatusDot.svelte.d.ts

@@ -1,7 +1,15 @@
-import type { DotStyle, DotSize } from './StatusDot.types';
+/**
+ * A Status dot is a small visual indicator used to represent the state or condition of an element. It is often color-coded to convey different statuses at a glance, such as availability, activity, or urgency. Status Dots are commonly found in user presence indicators, system statuses, or process tracking to provide quick, unobtrusive feedback.
+ */
 interface Props {
-    status: DotStyle;
-    size: DotSize;
+    /**
+     * Allows to define the status dot type.
+     */
+    status: 'info' | 'success' | 'warning' | 'error' | 'neutral';
+    /**
+     * Determines the size of the status dot.
+     */
+    size: 's' | 'm' | 'l';
 }
 declare const StatusDot: import("svelte").Component<Props, {}, "">;
 type StatusDot = ReturnType<typeof StatusDot>;

package/dist/components/statusdot/StatusDot.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StatusDot.svelte.d.ts","sourceRoot":"","sources":["../../../src/components/statusdot/StatusDot.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAGzD,UAAU,KAAK;IACb,MAAM,EAAE,QAAQ,CAAC;IACjB,IAAI,EAAE,OAAO,CAAC;CACf;AAkBH,QAAA,MAAM,SAAS,2CAAwC,CAAC;AACxD,KAAK,SAAS,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,CAAC;AAC9C,eAAe,SAAS,CAAC"}
+{"version":3,"file":"StatusDot.svelte.d.ts","sourceRoot":"","sources":["../../../src/components/statusdot/StatusDot.svelte.ts"],"names":[],"mappings":"AAGE;;GAEG;AACH,UAAU,KAAK;IACb;;OAEG;IACH,MAAM,EAAE,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,CAAC;IAC7D;;OAEG;IACL,IAAI,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,CAAA;CACrB;AAiBF,QAAA,MAAM,SAAS,2CAAwC,CAAC;AACxD,KAAK,SAAS,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,CAAC;AAC9C,eAAe,SAAS,CAAC"}

package/dist/components/statusdot/StatusDot.types.d.ts

@@ -1,3 +1,3 @@
-export type DotStyle = 'error' | 'success' | 'warning' | 'neutral' | 'info';
+export type DotStatus = 'error' | 'success' | 'warning' | 'neutral' | 'info';
 export type DotSize = 's' | 'm' | 'l';
 //# sourceMappingURL=StatusDot.types.d.ts.map

package/dist/components/statusdot/StatusDot.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StatusDot.types.d.ts","sourceRoot":"","sources":["../../../src/components/statusdot/StatusDot.types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,QAAQ,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,CAAC;AAC5E,MAAM,MAAM,OAAO,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC"}
+{"version":3,"file":"StatusDot.types.d.ts","sourceRoot":"","sources":["../../../src/components/statusdot/StatusDot.types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,CAAC;AAC7E,MAAM,MAAM,OAAO,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC"}

package/dist/components/statusnotification/StatusNotification.js

@@ -1,7 +1,8 @@
-import{E as te,F as se,G as ae,H as ie,I as xe,J as ye,K as ne,L as w,M as K,N as O,O as pe,P as ze,Q as Ne,R as je,S as Ce,T as Y,U as q,V as ke,W as Ee,X as Se,c as S,p as M,b as i,A as P,t as N,h as g,i as L,j as n,e as k,B as R,n as Me,a as Le,C as Ae,l as Be,f as Q,s as B,d as j,m as Te,r as C,w as T,x as F,g as Z,Y as Fe}from"../../custom-element.js";import{s as $}from"../../snippet.js";import{i as D}from"../../if.js";import{s as ee}from"../../slot.js";import"../../legacy.js";import{s as b,c as G}from"../../attributes.js";function De(m,t,c){w&&K();var r=m,l,o,f=null,s=null;function e(){o&&(ne(o),o=null),f&&(f.lastChild.remove(),r.before(f),f=null),o=s,s=null}te(()=>{if(l!==(l=t())){var u=ye();if(l){var x=r;u&&(f=document.createDocumentFragment(),f.append(x=ae())),s=ie(()=>c(x,l))}u?xe.add_callback(e):e()}},se),w&&(r=O)}function Pe(m,t,c,r,l,o){let f=w;w&&K();var s,e,u=null;w&&O.nodeType===pe&&(u=O,K());var x=w?O:m,y;te(()=>{const v=t()||null;var I=v==="svg"?ze:null;v!==s&&(y&&(v===null?ne(y,()=>{y=null,e=null}):v===e?Ee(y):Se(y)),v&&v!==e&&(y=ie(()=>{if(u=w?u:I?document.createElementNS(I,v):document.createElement(v),Ne(u,u),r){w&&je(v)&&u.append(document.createComment(""));var p=w?Ce(u):u.appendChild(ae());w&&(p===null?Y(!1):q(p)),r(u,p)}ke.nodes_end=u,x.before(u)})),s=v,s&&(e=s))},se),f&&(Y(!0),q(x))}var Re=P('<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="20px" height="20px"><path fill-rule="evenodd" d="M14.697 6.364a.75.75 0 1 0-1.061-1.061L10 8.939 6.363 5.303a.75.75 0 0 0-1.06 1.06L8.939 10l-3.636 3.636a.75.75 0 1 0 1.06 1.06L10 11.062l3.636 3.636a.75.75 0 0 0 1.06-1.06L11.06 10z"></path></svg>');function le(m,t){M(t,!1);let c=i(t,"id",12,void 0),r=i(t,"style",12,void 0),l=i(t,"className",12,void 0),o=i(t,"fill",12,void 0),f=i(t,"size",12,"1.25rem");var s=Re();return N(()=>{b(s,"id",c()),G(s,r()),k(s,0,R(l())),b(s,"fill",o())}),g(m,s),L({get id(){return c()},set id(e){c(e),n()},get style(){return r()},set style(e){r(e),n()},get className(){return l()},set className(e){l(e),n()},get fill(){return o()},set fill(e){o(e),n()},get size(){return f()},set size(e){f(e),n()}})}customElements.define("cross-20",S(le,{id:{},style:{},className:{},fill:{},size:{}},[],[],!1));var Ge=P('<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32px" height="32px"><path fill-rule="evenodd" d="M16 5C9.925 5 5 9.925 5 16s4.925 11 11 11 11-4.925 11-11S22.075 5 16 5M3 16C3 8.82 8.82 3 16 3s13 5.82 13 13-5.82 13-13 13S3 23.18 3 16m13-2.333a1 1 0 0 1 1 1v6.666a1 1 0 1 1-2 0v-6.666a1 1 0 0 1 1-1M16 12a1.333 1.333 0 1 0 0-2.667A1.333 1.333 0 0 0 16 12"></path></svg>');function re(m,t){M(t,!1);let c=i(t,"id",12,void 0),r=i(t,"style",12,void 0),l=i(t,"className",12,void 0),o=i(t,"fill",12,void 0),f=i(t,"size",12,"2rem");var s=Ge();return N(()=>{b(s,"id",c()),G(s,r()),k(s,0,R(l())),b(s,"fill",o())}),g(m,s),L({get id(){return c()},set id(e){c(e),n()},get style(){return r()},set style(e){r(e),n()},get className(){return l()},set className(e){l(e),n()},get fill(){return o()},set fill(e){o(e),n()},get size(){return f()},set size(e){f(e),n()}})}customElements.define("info-circle-32",S(re,{id:{},style:{},className:{},fill:{},size:{}},[],[],!1));var Ie=P('<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32px" height="32px"><path fill-rule="evenodd" d="M16 5C9.925 5 5 9.925 5 16s4.925 11 11 11 11-4.925 11-11S22.075 5 16 5M3 16C3 8.82 8.82 3 16 3s13 5.82 13 13-5.82 13-13 13S3 23.18 3 16m13-6.333a1 1 0 0 1 1 1v6.666a1 1 0 1 1-2 0v-6.666a1 1 0 0 1 1-1m0 13A1.333 1.333 0 1 0 16 20a1.333 1.333 0 0 0 0 2.667"></path></svg>');function oe(m,t){M(t,!1);let c=i(t,"id",12,void 0),r=i(t,"style",12,void 0),l=i(t,"className",12,void 0),o=i(t,"fill",12,void 0),f=i(t,"size",12,"2rem");var s=Ie();return N(()=>{b(s,"id",c()),G(s,r()),k(s,0,R(l())),b(s,"fill",o())}),g(m,s),L({get id(){return c()},set id(e){c(e),n()},get style(){return r()},set style(e){r(e),n()},get className(){return l()},set className(e){l(e),n()},get fill(){return o()},set fill(e){o(e),n()},get size(){return f()},set size(e){f(e),n()}})}customElements.define("warning-circle-32",S(oe,{id:{},style:{},className:{},fill:{},size:{}},[],[],!1));var Oe=P('<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32px" height="32px"><path fill-rule="evenodd" d="M5 16C5 9.925 9.925 5 16 5s11 4.925 11 11-4.925 11-11 11S5 22.075 5 16M16 3C8.82 3 3 8.82 3 16s5.82 13 13 13 13-5.82 13-13S23.18 3 16 3m-3.293 8.293a1 1 0 0 0-1.414 1.414L14.586 16l-3.293 3.293a1 1 0 0 0 1.414 1.414L16 17.414l3.293 3.293a1 1 0 0 0 1.414-1.414L17.414 16l3.293-3.293a1 1 0 0 0-1.414-1.414L16 14.586z"></path></svg>');function ce(m,t){M(t,!1);let c=i(t,"id",12,void 0),r=i(t,"style",12,void 0),l=i(t,"className",12,void 0),o=i(t,"fill",12,void 0),f=i(t,"size",12,"2rem");var s=Oe();return N(()=>{b(s,"id",c()),G(s,r()),k(s,0,R(l())),b(s,"fill",o())}),g(m,s),L({get id(){return c()},set id(e){c(e),n()},get style(){return r()},set style(e){r(e),n()},get className(){return l()},set className(e){l(e),n()},get fill(){return o()},set fill(e){o(e),n()},get size(){return f()},set size(e){f(e),n()}})}customElements.define("cross-circle-32",S(ce,{id:{},style:{},className:{},fill:{},size:{}},[],[],!1));var Ve=P('<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32px" height="32px"><path fill-rule="evenodd" d="M5 16C5 9.925 9.925 5 16 5s11 4.925 11 11-4.925 11-11 11S5 22.075 5 16M16 3C8.82 3 3 8.82 3 16s5.82 13 13 13 13-5.82 13-13S23.18 3 16 3m6.707 10.374a1 1 0 0 0-1.414-1.414l-6.626 6.626-3.293-3.293a1 1 0 0 0-1.414 1.414l4 4a1 1 0 0 0 1.414 0z"></path></svg>');function fe(m,t){M(t,!1);let c=i(t,"id",12,void 0),r=i(t,"style",12,void 0),l=i(t,"className",12,void 0),o=i(t,"fill",12,void 0),f=i(t,"size",12,"2rem");var s=Ve();return N(()=>{b(s,"id",c()),G(s,r()),k(s,0,R(l())),b(s,"fill",o())}),g(m,s),L({get id(){return c()},set id(e){c(e),n()},get style(){return r()},set style(e){r(e),n()},get className(){return l()},set className(e){l(e),n()},get fill(){return o()},set fill(e){o(e),n()},get size(){return f()},set size(e){f(e),n()}})}customElements.define("check-circle-32",S(fe,{id:{},style:{},className:{},fill:{},size:{}},[],[],!1));var We=Q('<div class="mc-status-notification__footer svelte-1tn4grj"><!></div>'),He=Q('<button class="mc-status-notification-closable__close svelte-1tn4grj"><!> <span class="mc-status-notification-closable__text svelte-1tn4grj"> </span></button>'),Je=Q('<section role="status"><span class="mc-status-notification__icon svelte-1tn4grj" aria-hidden="true"><!></span> <div class="mc-status-notification__content svelte-1tn4grj"><!> <p class="mc-status-notification__message svelte-1tn4grj"><!></p> <!></div> <!></section>');const Ke={hash:"svelte-1tn4grj",code:`/**
+import{F as y,G as X,H as J,I as vt,J as bt,K as gt,L as ht,N as _t,M as yt,O as zt,P as wt,Q as xt,R as Y,S as Z,T as kt,U as pt,V as Nt,W as Ct,c as B,p as F,b as o,q as G,t as N,h as m,i as P,j as i,e as C,u as I,n as Et,a as St,v as Mt,l as At,f as K,m as Lt,d as k,s as D,r as p,A,B as L,X as Tt,g as Bt}from"../../custom-element.js";import{s as $}from"../../snippet.js";import{i as T}from"../../if.js";import{s as tt}from"../../slot.js";import{c as Ft,C as Pt}from"../../Cross20.js";import"../../legacy.js";import{s as z,a as O}from"../../attributes.js";function Rt(v,e,l,r,n,d){let u=y;y&&X();var f,a,t=null;y&&J.nodeType===vt&&(t=J,X());var w=y?J:v,g;bt(()=>{const b=e()||null;var R=b==="svg"?_t:null;b!==f&&(g&&(b===null?pt(g,()=>{g=null,a=null}):b===a?Nt(g):Ct(g)),b&&b!==a&&(g=ht(()=>{if(t=y?t:R?document.createElementNS(R,b):document.createElement(b),yt(t,t),r){y&&zt(b)&&t.append(document.createComment(""));var E=y?wt(t):t.appendChild(xt());y&&(E===null?Y(!1):Z(E)),r(t,E)}kt.nodes_end=t,w.before(t)})),f=b,f&&(a=f))},gt),u&&(Y(!0),Z(w))}var jt=G('<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32px" height="32px"><path fill-rule="evenodd" d="M16 5C9.925 5 5 9.925 5 16s4.925 11 11 11 11-4.925 11-11S22.075 5 16 5M3 16C3 8.82 8.82 3 16 3s13 5.82 13 13-5.82 13-13 13S3 23.18 3 16m13-2.333a1 1 0 0 1 1 1v6.666a1 1 0 1 1-2 0v-6.666a1 1 0 0 1 1-1M16 12a1.333 1.333 0 1 0 0-2.667A1.333 1.333 0 0 0 16 12"></path></svg>');function et(v,e){F(e,!1);let l=o(e,"id",12,void 0),r=o(e,"style",12,void 0),n=o(e,"className",12,void 0),d=o(e,"fill",12,void 0),u=o(e,"size",12,"2rem");var f={get id(){return l()},set id(t){l(t),i()},get style(){return r()},set style(t){r(t),i()},get className(){return n()},set className(t){n(t),i()},get fill(){return d()},set fill(t){d(t),i()},get size(){return u()},set size(t){u(t),i()}},a=jt();return N(()=>{z(a,"id",l()),O(a,r()),C(a,0,I(n())),z(a,"fill",d())}),m(v,a),P(f)}customElements.define("info-circle-32",B(et,{id:{},style:{},className:{},fill:{},size:{}},[],[],!1));var Dt=G('<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32px" height="32px"><path fill-rule="evenodd" d="M16 5C9.925 5 5 9.925 5 16s4.925 11 11 11 11-4.925 11-11S22.075 5 16 5M3 16C3 8.82 8.82 3 16 3s13 5.82 13 13-5.82 13-13 13S3 23.18 3 16m13-6.333a1 1 0 0 1 1 1v6.666a1 1 0 1 1-2 0v-6.666a1 1 0 0 1 1-1m0 13A1.333 1.333 0 1 0 16 20a1.333 1.333 0 0 0 0 2.667"></path></svg>');function st(v,e){F(e,!1);let l=o(e,"id",12,void 0),r=o(e,"style",12,void 0),n=o(e,"className",12,void 0),d=o(e,"fill",12,void 0),u=o(e,"size",12,"2rem");var f={get id(){return l()},set id(t){l(t),i()},get style(){return r()},set style(t){r(t),i()},get className(){return n()},set className(t){n(t),i()},get fill(){return d()},set fill(t){d(t),i()},get size(){return u()},set size(t){u(t),i()}},a=Dt();return N(()=>{z(a,"id",l()),O(a,r()),C(a,0,I(n())),z(a,"fill",d())}),m(v,a),P(f)}customElements.define("warning-circle-32",B(st,{id:{},style:{},className:{},fill:{},size:{}},[],[],!1));var Gt=G('<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32px" height="32px"><path fill-rule="evenodd" d="M5 16C5 9.925 9.925 5 16 5s11 4.925 11 11-4.925 11-11 11S5 22.075 5 16M16 3C8.82 3 3 8.82 3 16s5.82 13 13 13 13-5.82 13-13S23.18 3 16 3m-3.293 8.293a1 1 0 0 0-1.414 1.414L14.586 16l-3.293 3.293a1 1 0 0 0 1.414 1.414L16 17.414l3.293 3.293a1 1 0 0 0 1.414-1.414L17.414 16l3.293-3.293a1 1 0 0 0-1.414-1.414L16 14.586z"></path></svg>');function at(v,e){F(e,!1);let l=o(e,"id",12,void 0),r=o(e,"style",12,void 0),n=o(e,"className",12,void 0),d=o(e,"fill",12,void 0),u=o(e,"size",12,"2rem");var f={get id(){return l()},set id(t){l(t),i()},get style(){return r()},set style(t){r(t),i()},get className(){return n()},set className(t){n(t),i()},get fill(){return d()},set fill(t){d(t),i()},get size(){return u()},set size(t){u(t),i()}},a=Gt();return N(()=>{z(a,"id",l()),O(a,r()),C(a,0,I(n())),z(a,"fill",d())}),m(v,a),P(f)}customElements.define("cross-circle-32",B(at,{id:{},style:{},className:{},fill:{},size:{}},[],[],!1));var It=G('<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32px" height="32px"><path fill-rule="evenodd" d="M5 16C5 9.925 9.925 5 16 5s11 4.925 11 11-4.925 11-11 11S5 22.075 5 16M16 3C8.82 3 3 8.82 3 16s5.82 13 13 13 13-5.82 13-13S23.18 3 16 3m6.707 10.374a1 1 0 0 0-1.414-1.414l-6.626 6.626-3.293-3.293a1 1 0 0 0-1.414 1.414l4 4a1 1 0 0 0 1.414 0z"></path></svg>');function ot(v,e){F(e,!1);let l=o(e,"id",12,void 0),r=o(e,"style",12,void 0),n=o(e,"className",12,void 0),d=o(e,"fill",12,void 0),u=o(e,"size",12,"2rem");var f={get id(){return l()},set id(t){l(t),i()},get style(){return r()},set style(t){r(t),i()},get className(){return n()},set className(t){n(t),i()},get fill(){return d()},set fill(t){d(t),i()},get size(){return u()},set size(t){u(t),i()}},a=It();return N(()=>{z(a,"id",l()),O(a,r()),C(a,0,I(n())),z(a,"fill",d())}),m(v,a),P(f)}customElements.define("check-circle-32",B(ot,{id:{},style:{},className:{},fill:{},size:{}},[],[],!1));var Ot=K('<div class="mc-status-notification__footer svelte-18b6syz"><!></div>'),Vt=K('<button class="mc-status-notification-closable__close mc-button mc-button--s mc-button--icon-button mc-button--ghost svelte-18b6syz" aria-label="Close"><!></button>'),Wt=K('<section role="status"><span class="mc-status-notification__icon svelte-18b6syz" aria-hidden="true"><!></span> <div class="mc-status-notification__content svelte-18b6syz"><!> <p class="mc-status-notification__message svelte-18b6syz"><!></p> <!></div> <!></section>');const qt={hash:"svelte-18b6syz",code:`/**
  * Do not edit directly, this file was auto-generated.
- */
+ */.mc-button.svelte-18b6syz {color:var(--button-color-filled-standard-font, #ffffff);background-color:var(--button-color-filled-standard-background, #464e63);}.mc-button.svelte-18b6syz:hover {background-color:var(--button-color-filled-standard-hover-background, #343b4c);}.mc-button.svelte-18b6syz:active {background-color:var(--button-color-filled-standard-active-background, #242938);}.mc-button.svelte-18b6syz: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-18b6syz {font-weight:var(--font-weight-semi-bold, 600);padding:0 calc(1rem - 0.125rem);min-height:3rem;min-width:3rem;}.mc-button.svelte-18b6syz {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-18b6syz: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-18b6syz: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--s.svelte-18b6syz {padding:0 calc(0.75rem - 0.125rem);min-height:2rem;min-width:2rem;}.mc-button--ghost.svelte-18b6syz {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-18b6syz:hover {background-color:var(--button-color-ghost-standard-hover-background, rgba(70, 78, 99, 0.1));}.mc-button--ghost.svelte-18b6syz:active {background-color:var(--button-color-ghost-standard-active-background, rgba(70, 78, 99, 0.2));}.mc-button--ghost.svelte-18b6syz: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-18b6syz {border-radius:var(--radius-full, 100%);padding:0;}
+
 /* create columns */
 /* create columns */
-/* create custom named columns with custom content */.mc-status-notification.svelte-1tn4grj {border-radius:var(--radius-m, 0.5rem);display:flex;flex-flow:row wrap;align-items:flex-start;background:var(--status-notification-color-background-information, #e1f3f9);box-shadow:inset 0 0 0 var(--border-s, 1px) var(--status-notification-color-border-information, #3facd7);position:relative;box-sizing:border-box;color:var(--status-notification-color-text, #000000);}.mc-status-notification__icon.svelte-1tn4grj {width:2rem;height:2rem;margin:0.75rem;fill:var(--status-notification-color-icon-information, #0b96cc);}.mc-status-notification__content.svelte-1tn4grj {flex:1 1 0;padding:0.75rem 1rem 0.75rem 0;}.mc-status-notification__title.svelte-1tn4grj, .mc-status-notification__message.svelte-1tn4grj {line-height:var(--line-height-s, 1.3);margin-block:0;}.mc-status-notification__title.svelte-1tn4grj {font-weight:var(--font-weight-semi-bold, 600);font-size:var(--font-size-150, 1rem);margin-block-end:0.25rem;}.mc-status-notification__message.svelte-1tn4grj {font-size:var(--font-size-100, 0.875rem);}.mc-status-notification__footer.svelte-1tn4grj {align-items:flex-start;display:flex;flex-flow:row wrap;gap:0.5rem;margin-top:0.75rem;margin-bottom:0.5rem;}.mc-status-notification--success.svelte-1tn4grj {background:var(--status-notification-color-background-success, #ebf5de);box-shadow:inset 0 0 0 var(--border-s, 1px) var(--status-notification-color-border-success, #78be20);}.mc-status-notification--success.svelte-1tn4grj .mc-status-notification__icon:where(.svelte-1tn4grj) {fill:var(--status-notification-color-icon-success, #3f9e10);}.mc-status-notification--warning.svelte-1tn4grj {background:var(--status-notification-color-background-warning, #fdf1e8);box-shadow:inset 0 0 0 var(--border-s, 1px) var(--status-notification-color-border-warning, #ef934a);}.mc-status-notification--warning.svelte-1tn4grj .mc-status-notification__icon:where(.svelte-1tn4grj) {fill:var(--status-notification-color-icon-warning, #ea7315);}.mc-status-notification--error.svelte-1tn4grj {background:var(--status-notification-color-background-error, #fdeaea);box-shadow:inset 0 0 0 var(--border-s, 1px) var(--status-notification-color-border-error, #ef5f5c);}.mc-status-notification--error.svelte-1tn4grj .mc-status-notification__icon:where(.svelte-1tn4grj) {fill:var(--status-notification-color-icon-error, #ea302d);}.mc-status-notification-closable__close.svelte-1tn4grj {border:0;cursor:pointer;display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;padding:0;margin:0.25rem;outline:0;background:transparent;}.mc-status-notification-closable__text.svelte-1tn4grj {clip-path:inset(100%);clip:rect(1px, 1px, 1px, 1px);height:1px;overflow:hidden;position:absolute;white-space:nowrap;padding:0;width:1px;}`};function Qe(m,t){M(t,!0),Le(m,Ke);let c=i(t,"title",7),r=i(t,"children",7),l=i(t,"status",7,"information"),o=i(t,"closable",7,!1),f=i(t,"hasfooter",7,!1),s=i(t,"footer",7),e=i(t,"closelabel",7,"Close"),u=i(t,"titletag",7,"h2"),x=i(t,"onclose",7);const y=[{status:"information",component:re},{status:"success",component:fe},{status:"warning",component:oe},{status:"error",component:ce}];function v(a){return y.find(d=>d.status===a)||y[0]}let I=Ae(Be(v(l())));var p=Je();let U;var V=j(p),de=j(V);De(de,()=>Te(I).component,(a,d)=>{d(a,{class:"mc-status-notification__icon","aria-hidden":"true"})}),C(V);var W=B(V,2),X=j(W);{var ue=a=>{var d=T(),h=F(d);Pe(h,u,!1,(E,A)=>{k(E,0,"mc-status-notification__title svelte-1tn4grj");var _=Fe();N(()=>Z(_,c())),g(A,_)}),g(a,d)};D(X,a=>{c()&&a(ue)})}var H=B(X,2),me=j(H);{var ge=a=>{var d=T(),h=F(d);$(h,r),g(a,d)},ve=a=>{var d=T(),h=F(d);ee(h,t,"default",{}),g(a,d)};D(me,a=>{r()?a(ge):a(ve,!1)})}C(H);var _e=B(H,2);{var he=a=>{var d=We(),h=j(d);{var E=_=>{var z=T(),J=F(z);$(J,s),g(_,z)},A=_=>{var z=T(),J=F(z);ee(J,t,"footer",{}),g(_,z)};D(h,_=>{s()?_(E):_(A,!1)})}C(d),g(a,d)};D(_e,a=>{f()&&a(he)})}C(W);var we=B(W,2);{var be=a=>{var d=He();d.__click=function(..._){var z;(z=x())==null||z.apply(this,_)};var h=j(d);le(h,{class:"mc-status-notification-closable__icon","aria-hidden":"true"});var E=B(h,2),A=j(E,!0);C(E),C(d),N(()=>Z(A,e())),g(a,d)};D(we,a=>{o()&&a(be)})}return C(p),N(a=>U=k(p,1,"mc-status-notification svelte-1tn4grj",null,U,a),[()=>({"mc-status-notification--success":l()==="success","mc-status-notification--warning":l()==="warning","mc-status-notification--error":l()==="error"})]),g(m,p),L({get title(){return c()},set title(a){c(a),n()},get children(){return r()},set children(a){r(a),n()},get status(){return l()},set status(a="information"){l(a),n()},get closable(){return o()},set closable(a=!1){o(a),n()},get hasfooter(){return f()},set hasfooter(a=!1){f(a),n()},get footer(){return s()},set footer(a){s(a),n()},get closelabel(){return e()},set closelabel(a="Close"){e(a),n()},get titletag(){return u()},set titletag(a="h2"){u(a),n()},get onclose(){return x()},set onclose(a){x(a),n()}})}Me(["click"]);customElements.define("m-status-notification",S(Qe,{title:{},children:{},status:{},closable:{},hasfooter:{},footer:{},closelabel:{},titletag:{},onclose:{}},["default","footer"],[],!0));
+/* create custom named columns with custom content */.mc-status-notification.svelte-18b6syz {border-radius:var(--radius-m, 0.5rem);display:flex;flex-flow:row wrap;align-items:flex-start;background:var(--status-notification-color-background-information, #e1f3f9);box-shadow:inset 0 0 0 var(--border-s, 1px) var(--status-notification-color-border-information, #3facd7);position:relative;box-sizing:border-box;color:var(--status-notification-color-text, #000000);}.mc-status-notification__icon.svelte-18b6syz {width:2rem;height:2rem;margin:0.75rem;fill:var(--status-notification-color-icon-information, #0b96cc);}.mc-status-notification__content.svelte-18b6syz {flex:1 1 0;padding:0.75rem 1rem 0.75rem 0;}.mc-status-notification__title.svelte-18b6syz, .mc-status-notification__message.svelte-18b6syz {line-height:var(--line-height-s, 1.3);margin-block:0;}.mc-status-notification__title.svelte-18b6syz {font-weight:var(--font-weight-semi-bold, 600);font-size:var(--font-size-150, 1rem);margin-block-end:0.25rem;}.mc-status-notification__message.svelte-18b6syz {font-size:var(--font-size-100, 0.875rem);}.mc-status-notification__footer.svelte-18b6syz {align-items:flex-start;display:flex;flex-flow:row wrap;gap:0.5rem;margin-top:0.75rem;margin-bottom:0.5rem;}.mc-status-notification--success.svelte-18b6syz {background:var(--status-notification-color-background-success, #ebf5de);box-shadow:inset 0 0 0 var(--border-s, 1px) var(--status-notification-color-border-success, #78be20);}.mc-status-notification--success.svelte-18b6syz .mc-status-notification__icon:where(.svelte-18b6syz) {fill:var(--status-notification-color-icon-success, #3f9e10);}.mc-status-notification--warning.svelte-18b6syz {background:var(--status-notification-color-background-warning, #fdf1e8);box-shadow:inset 0 0 0 var(--border-s, 1px) var(--status-notification-color-border-warning, #ef934a);}.mc-status-notification--warning.svelte-18b6syz .mc-status-notification__icon:where(.svelte-18b6syz) {fill:var(--status-notification-color-icon-warning, #ea7315);}.mc-status-notification--error.svelte-18b6syz {background:var(--status-notification-color-background-error, #fdeaea);box-shadow:inset 0 0 0 var(--border-s, 1px) var(--status-notification-color-border-error, #ef5f5c);}.mc-status-notification--error.svelte-18b6syz .mc-status-notification__icon:where(.svelte-18b6syz) {fill:var(--status-notification-color-icon-error, #ea302d);}.mc-status-notification-closable__close.svelte-18b6syz {margin:0.25rem;}`};function Ht(v,e){F(e,!0),St(v,qt);let l=o(e,"title",7),r=o(e,"children",7),n=o(e,"status",7,"information"),d=o(e,"closable",7,!1),u=o(e,"hasfooter",7,!1),f=o(e,"footer",7),a=o(e,"closelabel",7,"Close"),t=o(e,"titletag",7,"h2"),w=o(e,"onclose",7);const g=[{status:"information",component:et},{status:"success",component:ot},{status:"warning",component:st},{status:"error",component:at}];function b(s){return g.find(c=>c.status===s)||g[0]}let R=Mt(At(b(n())));var E={get title(){return l()},set title(s){l(s),i()},get children(){return r()},set children(s){r(s),i()},get status(){return n()},set status(s="information"){n(s),i()},get closable(){return d()},set closable(s=!1){d(s),i()},get hasfooter(){return u()},set hasfooter(s=!1){u(s),i()},get footer(){return f()},set footer(s){f(s),i()},get closelabel(){return a()},set closelabel(s="Close"){a(s),i()},get titletag(){return t()},set titletag(s="h2"){t(s),i()},get onclose(){return w()},set onclose(s){w(s),i()}},j=Wt();let Q;var V=k(j),it=k(V);Ft(it,()=>Lt(R).component,(s,c)=>{c(s,{class:"mc-status-notification__icon","aria-hidden":"true"})}),p(V);var W=D(V,2),U=k(W);{var rt=s=>{var c=A(),h=L(c);Rt(h,t,!1,(S,x)=>{C(S,0,"mc-status-notification__title svelte-18b6syz");var _=Tt();N(()=>Bt(_,l())),m(x,_)}),m(s,c)};T(U,s=>{l()&&s(rt)})}var q=D(U,2),nt=k(q);{var lt=s=>{var c=A(),h=L(c);$(h,r),m(s,c)},ct=s=>{var c=A(),h=L(c);tt(h,e,"default",{}),m(s,c)};T(nt,s=>{r()?s(lt):s(ct,!1)})}p(q);var dt=D(q,2);{var ut=s=>{var c=Ot(),h=k(c);{var S=_=>{var M=A(),H=L(M);$(H,f),m(_,M)},x=_=>{var M=A(),H=L(M);tt(H,e,"footer",{}),m(_,M)};T(h,_=>{f()?_(S):_(x,!1)})}p(c),m(s,c)};T(dt,s=>{u()&&s(ut)})}p(W);var ft=D(W,2);{var mt=s=>{var c=Vt();c.__click=function(...S){var x;(x=w())==null||x.apply(this,S)};var h=k(c);Pt(h,{class:"mc-status-notification-closable__icon","aria-hidden":"true"}),p(c),m(s,c)};T(ft,s=>{d()&&s(mt)})}return p(j),N(s=>Q=C(j,1,"mc-status-notification svelte-18b6syz",null,Q,s),[()=>({"mc-status-notification--success":n()==="success","mc-status-notification--warning":n()==="warning","mc-status-notification--error":n()==="error"})]),m(v,j),P(E)}Et(["click"]);customElements.define("m-status-notification",B(Ht,{title:{},children:{},status:{},closable:{},hasfooter:{},footer:{},closelabel:{},titletag:{},onclose:{}},["default","footer"],[],!0));
 //# sourceMappingURL=StatusNotification.js.map