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

package/dist/components/drawer/Drawer.js

@@ -1,14 +1,17 @@
-import{c as q,p as F,b as r,A as Z,t as E,h,i as G,j as a,e as I,B as $,a as ee,f as _,s as v,d,g as M,o as N,r as c}from"../../custom-element.js";import{i as C}from"../../if.js";import{a as te,s as S}from"../../slot.js";import{s as w,c as oe}from"../../attributes.js";import"../../legacy.js";import{C as re}from"../../Cross24.js";import{O as ae}from"../overlay/Overlay.js";var ne=Z('<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24px" height="24px"><path fill-rule="evenodd" d="M8.707 6.293a1 1 0 0 1 0 1.414L5.414 11H21a1 1 0 1 1 0 2H5.414l3.293 3.293a1 1 0 1 1-1.414 1.414l-5-5a1 1 0 0 1 0-1.414l5-5a1 1 0 0 1 1.414 0"></path></svg>');function J(k,t){F(t,!1);let g=r(t,"id",12,void 0),l=r(t,"style",12,void 0),s=r(t,"className",12,void 0),b=r(t,"fill",12,void 0),m=r(t,"size",12,"1.5rem");var i=ne();return E(()=>{w(i,"id",g()),oe(i,l()),I(i,0,$(s())),w(i,"fill",b())}),h(k,i),G({get id(){return g()},set id(o){g(o),a()},get style(){return l()},set style(o){l(o),a()},get className(){return s()},set className(o){s(o),a()},get fill(){return b()},set fill(o){b(o),a()},get size(){return m()},set size(o){m(o),a()}})}customElements.define("arrow-back-24",q(J,{id:{},style:{},className:{},fill:{},size:{}},[],[],!1));var le=_('<button class="mc-drawer__back mc-button mc-button--icon-button mc-button--ghost svelte-1lmi8ae" aria-label="Back"><!></button>'),de=_('<h2 class="mc-drawer__content__title svelte-1lmi8ae"> </h2>'),ce=_('<div class="mc-drawer__footer svelte-1lmi8ae"><!></div>'),ie=_('<section aria-labelledby="drawerTitle" tabindex="-1"><div class="mc-drawer__dialog svelte-1lmi8ae" role="document"><div class="mc-drawer__header svelte-1lmi8ae"><!> <h2 class="mc-drawer__title svelte-1lmi8ae" id="drawerTitle"> </h2> <button class="mc-drawer__close mc-button mc-button--icon-button mc-button--ghost svelte-1lmi8ae" aria-label="Close"><!></button></div> <div class="mc-drawer__body svelte-1lmi8ae"><div class="mc-drawer__content svelte-1lmi8ae" tabindex="0"><!> <!></div></div> <!></div> <!></section>');const se={hash:"svelte-1lmi8ae",code:`/**
+import{c as S,p as F,b as r,q as Z,t as D,h as g,i as G,j as a,e as I,u as $,a as ee,f as k,s as v,d as l,g as L,o as B,r as d}from"../../custom-element.js";import{i as C}from"../../if.js";import{a as te,s as M}from"../../slot.js";import{s as _,a as oe}from"../../attributes.js";import"../../legacy.js";import{C as re}from"../../Cross24.js";import{O as ae}from"../overlay/Overlay.js";var ne=Z('<svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24px" height="24px"><path fill-rule="evenodd" d="M8.707 6.293a1 1 0 0 1 0 1.414L5.414 11H21a1 1 0 1 1 0 2H5.414l3.293 3.293a1 1 0 1 1-1.414 1.414l-5-5a1 1 0 0 1 0-1.414l5-5a1 1 0 0 1 1.414 0"></path></svg>');function J(h,t){F(t,!1);let f=r(t,"id",12,void 0),c=r(t,"style",12,void 0),i=r(t,"className",12,void 0),b=r(t,"fill",12,void 0),m=r(t,"size",12,"1.5rem");var s=ne();return D(()=>{_(s,"id",f()),oe(s,c()),I(s,0,$(i())),_(s,"fill",b())}),g(h,s),G({get id(){return f()},set id(o){f(o),a()},get style(){return c()},set style(o){c(o),a()},get className(){return i()},set className(o){i(o),a()},get fill(){return b()},set fill(o){b(o),a()},get size(){return m()},set size(o){m(o),a()}})}customElements.define("arrow-back-24",S(J,{id:{},style:{},className:{},fill:{},size:{}},[],[],!1));var ce=k('<button class="mc-drawer__back mc-button mc-button--icon-button mc-button--ghost svelte-132ae2w" aria-label="Back"><!></button>'),le=k('<h2 class="mc-drawer__content__title svelte-132ae2w"> </h2>'),de=k('<div class="mc-drawer__footer svelte-132ae2w"><!></div>'),se=k('<section aria-labelledby="drawerTitle" tabindex="-1"><div class="mc-drawer__dialog svelte-132ae2w" role="document"><div class="mc-drawer__header svelte-132ae2w"><!> <h2 class="mc-drawer__title svelte-132ae2w" id="drawerTitle"> </h2> <button class="mc-drawer__close mc-button mc-button--icon-button mc-button--ghost svelte-132ae2w" aria-label="Close"><!></button></div> <div class="mc-drawer__body svelte-132ae2w"><div class="mc-drawer__content svelte-132ae2w" tabindex="0"><!> <!></div></div> <!></div> <!></section>');const ie={hash:"svelte-132ae2w",code:`/**
  * Do not edit directly, this file was auto-generated.
- */.mc-drawer.svelte-1lmi8ae {box-sizing:border-box;inset:0;outline:0;pointer-events:none;position:fixed;display:flex;overflow:hidden;padding:0.5rem;justify-content:flex-end;}
-@media (width >= 680px) {.mc-drawer.svelte-1lmi8ae {padding:1rem;}
-}.mc-drawer--left.svelte-1lmi8ae {justify-content:flex-start;}.mc-drawer--left.svelte-1lmi8ae .mc-drawer__dialog:where(.svelte-1lmi8ae) {transform:translate3d(-100%, 0, 0);}
-@media (width >= 680px) {.mc-drawer--extend.svelte-1lmi8ae .mc-drawer__dialog:where(.svelte-1lmi8ae) {max-width:39rem;}
-}.mc-drawer__dialog.svelte-1lmi8ae {background:var(--drawer-color-background, #ffffff);display:flex;flex-direction:column;height:100%;max-width:100%;transform:translate3d(100%, 0, 0);transition:visibility 0s linear 0.4s, transform 0.4s;visibility:hidden;width:100%;z-index:var(--drawer-z-index, 3);border-radius:var(--radius-l, 1rem);}
-@media (width >= 680px) {.mc-drawer__dialog.svelte-1lmi8ae {max-width:25rem;}
-}.mc-drawer__header.svelte-1lmi8ae {display:flex;align-items:center;justify-content:center;height:4rem;}.mc-drawer__icon.svelte-1lmi8ae {height:1.5rem;margin-right:0.75rem;width:1.5rem;}.mc-drawer__title.svelte-1lmi8ae {font-size:var(--font-body-s, 0.875rem);font-weight:var(--font-weight-semi-bold, 600);color:var(--drawer-color-title, #666666);margin-bottom:0;margin-top:0;text-align:center;flex-grow:1;}.mc-drawer__title.svelte-1lmi8ae:first-child {padding-left:4rem;}.mc-drawer__back.svelte-1lmi8ae, .mc-drawer__close.svelte-1lmi8ae {margin:0.5rem;}.mc-drawer__body.svelte-1lmi8ae {flex:1 1;overflow:hidden;}.mc-drawer__body.svelte-1lmi8ae:last-child {margin-bottom:1.5rem;padding-bottom:1.5rem;}.mc-drawer__content.svelte-1lmi8ae {max-height:100%;overflow:hidden auto;padding:0.5rem 1rem 0;color:var(--drawer-color-paragraph, #000000);}
-@media (width >= 680px) {.mc-drawer__content.svelte-1lmi8ae {padding:1.5rem;}
-}.mc-drawer__content__title.svelte-1lmi8ae {font-size:var(--font-title-m, 1.5rem);margin:0 0 0.5rem;}.mc-drawer__footer.svelte-1lmi8ae {display:flex;flex-direction:column;gap:1rem;padding:1rem 1.5rem;border-top:var(--border-s, 1px) solid var(--divider-color-primary, #cccccc);}
-@media (width >= 680px) {.mc-drawer__footer.svelte-1lmi8ae {justify-content:center;flex-direction:row;}
-}.mc-drawer-open.svelte-1lmi8ae {overflow:hidden;}.mc-drawer.is-open.svelte-1lmi8ae .mc-drawer__dialog:where(.svelte-1lmi8ae) {pointer-events:all;transform:translate3d(0, 0, 0);transition:visibility 0s linear 0s, transform 0.4s;visibility:visible;}.mc-button.svelte-1lmi8ae {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-1lmi8ae:hover {background-color:var(--button-color-filled-standard-hover-background, #343b4c);}.mc-button.svelte-1lmi8ae:active {background-color:var(--button-color-filled-standard-active-background, #242938);}.mc-button.svelte-1lmi8ae:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button__label.svelte-1lmi8ae {font-size:var(--font-size-150, 1rem);}.mc-button__icon.svelte-1lmi8ae {flex-shrink:0;width:1.5rem;height:1.5rem;}.mc-button.svelte-1lmi8ae: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-1lmi8ae: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-1lmi8ae {padding:0 calc(0.75rem - 0.125rem);min-height:2rem;min-width:2rem;}.mc-button--m.svelte-1lmi8ae {padding:0 calc(1rem - 0.125rem);min-height:3rem;min-width:3rem;}.mc-button--l.svelte-1lmi8ae {padding:0 calc(1.25rem - 0.125rem);min-height:4rem;min-width:4rem;}.mc-button--icon-only.svelte-1lmi8ae {padding:0.25rem;}.mc-button--outlined.svelte-1lmi8ae {color:var(--button-color-outlined-standard-font, #242938);border-color:var(--button-color-outlined-standard-border, #8891aa);background-color:var(--button-color-outlined-standard-background, #ffffff);}.mc-button--outlined.svelte-1lmi8ae:hover {background-color:var(--button-color-outlined-standard-hover-background, #eff1f6);}.mc-button--outlined.svelte-1lmi8ae:active {background-color:var(--button-color-outlined-standard-active-background, #c9d0de);}.mc-button--outlined.svelte-1lmi8ae:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button--ghost.svelte-1lmi8ae {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-1lmi8ae:hover {background-color:var(--button-color-ghost-standard-hover-background, rgba(70, 78, 99, 0.1));}.mc-button--ghost.svelte-1lmi8ae:active {background-color:var(--button-color-ghost-standard-active-background, rgba(70, 78, 99, 0.2));}.mc-button--ghost.svelte-1lmi8ae:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button--accent.svelte-1lmi8ae {color:var(--button-color-filled-accent-font, #ffffff);background-color:var(--button-color-filled-accent-background, #117f03);}.mc-button--accent.svelte-1lmi8ae:hover {background-color:var(--button-color-filled-accent-hover-background, #006902);}.mc-button--accent.svelte-1lmi8ae:active {background-color:var(--button-color-filled-accent-active-background, #035010);}.mc-button--accent.svelte-1lmi8ae:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button--danger.svelte-1lmi8ae {color:var(--button-color-filled-danger-font, #ffffff);background-color:var(--button-color-filled-danger-background, #c61112);}.mc-button--danger.svelte-1lmi8ae:hover {background-color:var(--button-color-filled-danger-hover-background, #8c0003);}.mc-button--danger.svelte-1lmi8ae:active {background-color:var(--button-color-filled-danger-active-background, #530000);}.mc-button--danger.svelte-1lmi8ae:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button--inverse.svelte-1lmi8ae {--focus-color-mid: var(--focus-color-outline-outer, #000000);--focus-color-outer: var(--focus-color-outline-mid, #ffffff);color:var(--button-color-filled-inverse-font, #242938);background-color:var(--button-color-filled-inverse-background, #ffffff);}.mc-button--inverse.svelte-1lmi8ae:hover {background-color:var(--button-color-filled-inverse-hover-background, #e6e6e6);}.mc-button--inverse.svelte-1lmi8ae:active {background-color:var(--button-color-filled-inverse-active-background, #cccccc);}.mc-button--inverse.svelte-1lmi8ae: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-1lmi8ae {border-radius:var(--radius-full, 100%);padding:0;}.mc-button--outlined.mc-button--standard.svelte-1lmi8ae {color:var(--button-color-outlined-standard-font, #242938);border-color:var(--button-color-outlined-standard-border, #8891aa);background-color:var(--button-color-outlined-standard-background, #ffffff);}.mc-button--outlined.mc-button--standard.svelte-1lmi8ae:hover {background-color:var(--button-color-outlined-standard-hover-background, #eff1f6);}.mc-button--outlined.mc-button--standard.svelte-1lmi8ae:active {background-color:var(--button-color-outlined-standard-active-background, #c9d0de);}.mc-button--outlined.mc-button--standard.svelte-1lmi8ae:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button--outlined.mc-button--accent.svelte-1lmi8ae {color:var(--button-color-outlined-accent-font, #117f03);border-color:var(--button-color-outlined-accent-border, #78be20);background-color:var(--button-color-outlined-accent-background, #ffffff);}.mc-button--outlined.mc-button--accent.svelte-1lmi8ae:hover {background-color:var(--button-color-outlined-accent-hover-background, #ebf5de);}.mc-button--outlined.mc-button--accent.svelte-1lmi8ae:active {background-color:var(--button-color-outlined-accent-active-background, #c5e39e);}.mc-button--outlined.mc-button--accent.svelte-1lmi8ae:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button--outlined.mc-button--danger.svelte-1lmi8ae {color:var(--button-color-outlined-danger-font, #c61112);border-color:var(--button-color-outlined-danger-border, #ef5f5c);background-color:var(--button-color-outlined-danger-background, #ffffff);}.mc-button--outlined.mc-button--danger.svelte-1lmi8ae:hover {background-color:var(--button-color-outlined-danger-hover-background, #fdeaea);}.mc-button--outlined.mc-button--danger.svelte-1lmi8ae:active {background-color:var(--button-color-outlined-danger-active-background, #f8bcbb);}.mc-button--outlined.mc-button--danger.svelte-1lmi8ae:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button--outlined.mc-button--inverse.svelte-1lmi8ae {color:var(--button-color-outlined-inverse-font, #ffffff);border-color:var(--button-color-outlined-inverse-border, #ffffff);background-color:var(--button-color-outlined-inverse-background, rgba(255, 255, 255, 0.01));}.mc-button--outlined.mc-button--inverse.svelte-1lmi8ae:hover {background-color:var(--button-color-outlined-inverse-hover-background, rgba(255, 255, 255, 0.1));}.mc-button--outlined.mc-button--inverse.svelte-1lmi8ae:active {background-color:var(--button-color-outlined-inverse-active-background, rgba(255, 255, 255, 0.2));}.mc-button--outlined.mc-button--inverse.svelte-1lmi8ae:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button--ghost.mc-button--standard.svelte-1lmi8ae {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.mc-button--standard.svelte-1lmi8ae:hover {background-color:var(--button-color-ghost-standard-hover-background, rgba(70, 78, 99, 0.1));}.mc-button--ghost.mc-button--standard.svelte-1lmi8ae:active {background-color:var(--button-color-ghost-standard-active-background, rgba(70, 78, 99, 0.2));}.mc-button--ghost.mc-button--standard.svelte-1lmi8ae:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button--ghost.mc-button--accent.svelte-1lmi8ae {color:var(--button-color-ghost-accent-font, #117f03);background-color:var(--button-color-ghost-accent-background, rgba(255, 255, 255, 0.01));}.mc-button--ghost.mc-button--accent.svelte-1lmi8ae:hover {background-color:var(--button-color-ghost-accent-hover-background, rgba(17, 127, 3, 0.1));}.mc-button--ghost.mc-button--accent.svelte-1lmi8ae:active {background-color:var(--button-color-ghost-accent-active-background, rgba(17, 127, 3, 0.2));}.mc-button--ghost.mc-button--accent.svelte-1lmi8ae:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button--ghost.mc-button--danger.svelte-1lmi8ae {color:var(--button-color-ghost-danger-font, #c61112);background-color:var(--button-color-ghost-danger-background, rgba(255, 255, 255, 0.01));}.mc-button--ghost.mc-button--danger.svelte-1lmi8ae:hover {background-color:var(--button-color-ghost-danger-hover-background, rgba(198, 17, 18, 0.1));}.mc-button--ghost.mc-button--danger.svelte-1lmi8ae:active {background-color:var(--button-color-ghost-danger-active-background, rgba(198, 17, 18, 0.2));}.mc-button--ghost.mc-button--danger.svelte-1lmi8ae:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-button--ghost.mc-button--inverse.svelte-1lmi8ae {color:var(--button-color-ghost-inverse-font, #ffffff);background-color:var(--button-color-ghost-inverse-background, rgba(255, 255, 255, 0.01));}.mc-button--ghost.mc-button--inverse.svelte-1lmi8ae:hover {background-color:var(--button-color-ghost-inverse-hover-background, rgba(255, 255, 255, 0.1));}.mc-button--ghost.mc-button--inverse.svelte-1lmi8ae:active {background-color:var(--button-color-ghost-inverse-active-background, rgba(255, 255, 255, 0.2));}.mc-button--ghost.mc-button--inverse.svelte-1lmi8ae:disabled {background-color:var(--button-state-disabled-background, #d9d9d9);border-color:transparent;color:var(--button-state-disabled-color, #737373);cursor:not-allowed;}.mc-overlay.svelte-1lmi8ae {filter:none;}`};function be(k,t){const g=te(t);F(t,!0),ee(k,se);let l=r(t,"open",7,!1),s=r(t,"position",7,"right"),b=r(t,"extended",7,!1),m=r(t,"back",7,!1),i=r(t,"title",7,""),o=r(t,"contentTitle",7,""),p=r(t,"updateopen",7,()=>{}),x=r(t,"backfn",7,()=>{});function A(){l(!1),p()(!1)}function K(){x()()}var u=ie();let D;var y=d(u),z=d(y),H=d(z);{var P=e=>{var n=le(),f=d(n);J(f,{"aria-hidden":"true"}),c(n),N("click",n,K),h(e,n)};C(H,e=>{m()&&e(P)})}var T=v(H,2),Q=d(T,!0);c(T);var j=v(T,2),R=d(j);re(R,{"aria-hidden":"true"}),c(j),c(z);var B=v(z,2),O=d(B),L=d(O);{var U=e=>{var n=de(),f=d(n,!0);c(n),E(()=>M(f,o())),h(e,n)};C(L,e=>{o()&&e(U)})}var V=v(L,2);S(V,t,"default",{}),c(O),c(B);var W=v(B,2);{var X=e=>{var n=ce(),f=d(n);S(f,t,"footer",{}),c(n),h(e,n)};C(W,e=>{g.footer&&e(X)})}c(y);var Y=v(y,2);return ae(Y,{get isvisible(){return l()},dialoglabel:"drawerTitle"}),c(u),E(e=>{D=I(u,1,`mc-drawer mc-drawer--${s()}`,"svelte-1lmi8ae",D,e),w(u,"aria-modal",l()?"true":"false"),w(u,"aria-hidden",!l()),M(Q,i())},[()=>({"is-open":l(),"mc-drawer--extend":b()})]),N("click",j,A),N("keydown",u,e=>e.key==="Escape"&&A()),h(k,u),G({get open(){return l()},set open(e=!1){l(e),a()},get position(){return s()},set position(e="right"){s(e),a()},get extended(){return b()},set extended(e=!1){b(e),a()},get back(){return m()},set back(e=!1){m(e),a()},get title(){return i()},set title(e=""){i(e),a()},get contentTitle(){return o()},set contentTitle(e=""){o(e),a()},get updateopen(){return p()},set updateopen(e=()=>{}){p(e),a()},get backfn(){return x()},set backfn(e=()=>{}){x(e),a()}})}customElements.define("m-drawer",q(be,{open:{},position:{},extended:{},back:{},title:{},contentTitle:{},updateopen:{},backfn:{}},["default","footer"],[],!0));
+ */
+/**
+ * Do not edit directly, this file was auto-generated.
+ */.mc-drawer.svelte-132ae2w {box-sizing:border-box;inset:0;outline:0;pointer-events:none;position:fixed;display:flex;overflow:hidden;padding:0.5rem;justify-content:flex-end;}
+@media (width >= 680px) {.mc-drawer.svelte-132ae2w {padding:1rem;}
+}.mc-drawer--left.svelte-132ae2w {justify-content:flex-start;}.mc-drawer--left.svelte-132ae2w .mc-drawer__dialog:where(.svelte-132ae2w) {transform:translate3d(-100%, 0, 0);}
+@media (width >= 680px) {.mc-drawer--extend.svelte-132ae2w .mc-drawer__dialog:where(.svelte-132ae2w) {max-width:39rem;}
+}.mc-drawer__dialog.svelte-132ae2w {background:#ffffff;display:flex;flex-direction:column;height:100%;max-width:100%;transform:translate3d(100%, 0, 0);transition:visibility 0s linear 0.4s, transform 0.4s;visibility:hidden;width:100%;z-index:var(--drawer-z-index, 3);border-radius:1rem;}
+@media (width >= 680px) {.mc-drawer__dialog.svelte-132ae2w {max-width:25rem;}
+}.mc-drawer__header.svelte-132ae2w {display:flex;align-items:center;justify-content:center;height:4rem;}.mc-drawer__icon.svelte-132ae2w {height:1.5rem;margin-right:0.75rem;width:1.5rem;}.mc-drawer__title.svelte-132ae2w {font-size:0.875rem;font-weight:600;color:#666666;margin-bottom:0;margin-top:0;text-align:center;flex-grow:1;}.mc-drawer__title.svelte-132ae2w:first-child {padding-left:4rem;}.mc-drawer__back.svelte-132ae2w, .mc-drawer__close.svelte-132ae2w {margin:0.5rem;}.mc-drawer__body.svelte-132ae2w {flex:1 1;overflow:hidden;}.mc-drawer__body.svelte-132ae2w:last-child {margin-bottom:1.5rem;padding-bottom:1.5rem;}.mc-drawer__content.svelte-132ae2w {max-height:100%;overflow:hidden auto;padding:0.5rem 1rem 0;color:#000000;}
+@media (width >= 680px) {.mc-drawer__content.svelte-132ae2w {padding:1.5rem;}
+}.mc-drawer__content__title.svelte-132ae2w {font-size:1.5rem;margin:0 0 0.5rem;}.mc-drawer__footer.svelte-132ae2w {display:flex;flex-direction:column;gap:1rem;padding:1rem 1.5rem;border-top:1px solid #cccccc;}
+@media (width >= 680px) {.mc-drawer__footer.svelte-132ae2w {justify-content:center;flex-direction:row;}
+}.mc-drawer-open.svelte-132ae2w {overflow:hidden;}.mc-drawer.is-open.svelte-132ae2w .mc-drawer__dialog:where(.svelte-132ae2w) {pointer-events:all;transform:translate3d(0, 0, 0);transition:visibility 0s linear 0s, transform 0.4s;visibility:visible;}.mc-button.svelte-132ae2w {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-132ae2w:hover {background-color:#343b4c;}.mc-button.svelte-132ae2w:active {background-color:#242938;}.mc-button.svelte-132ae2w:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button__label.svelte-132ae2w {font-size:1rem;}.mc-button__icon.svelte-132ae2w {flex-shrink:0;width:1.5rem;height:1.5rem;}.mc-button.svelte-132ae2w:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button.svelte-132ae2w: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--s.svelte-132ae2w {padding:0 calc(0.75rem - 0.125rem);min-height:2rem;min-width:2rem;}.mc-button--m.svelte-132ae2w {padding:0 calc(1rem - 0.125rem);min-height:3rem;min-width:3rem;}.mc-button--l.svelte-132ae2w {padding:0 calc(1.25rem - 0.125rem);min-height:4rem;min-width:4rem;}.mc-button--icon-only.svelte-132ae2w {padding:0.25rem;}.mc-button--outlined.svelte-132ae2w {color:#242938;border-color:#8891aa;background-color:#ffffff;}.mc-button--outlined.svelte-132ae2w:hover {background-color:#eff1f6;}.mc-button--outlined.svelte-132ae2w:active {background-color:#c9d0de;}.mc-button--outlined.svelte-132ae2w:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button--ghost.svelte-132ae2w {color:#242938;background-color:rgba(255, 255, 255, 0.01);}.mc-button--ghost.svelte-132ae2w:hover {background-color:rgba(70, 78, 99, 0.1);}.mc-button--ghost.svelte-132ae2w:active {background-color:rgba(70, 78, 99, 0.2);}.mc-button--ghost.svelte-132ae2w:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button--accent.svelte-132ae2w {color:#ffffff;background-color:#117f03;}.mc-button--accent.svelte-132ae2w:hover {background-color:#006902;}.mc-button--accent.svelte-132ae2w:active {background-color:#035010;}.mc-button--accent.svelte-132ae2w:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button--danger.svelte-132ae2w {color:#ffffff;background-color:#c61112;}.mc-button--danger.svelte-132ae2w:hover {background-color:#8c0003;}.mc-button--danger.svelte-132ae2w:active {background-color:#530000;}.mc-button--danger.svelte-132ae2w:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button--inverse.svelte-132ae2w {--focus-color-mid: #000000;--focus-color-outer: #ffffff;color:#242938;background-color:#ffffff;}.mc-button--inverse.svelte-132ae2w:hover {background-color:#e6e6e6;}.mc-button--inverse.svelte-132ae2w:active {background-color:#cccccc;}.mc-button--inverse.svelte-132ae2w:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button--icon-button.svelte-132ae2w {border-radius:100%;padding:0;}.mc-button--outlined.mc-button--standard.svelte-132ae2w {color:#242938;border-color:#8891aa;background-color:#ffffff;}.mc-button--outlined.mc-button--standard.svelte-132ae2w:hover {background-color:#eff1f6;}.mc-button--outlined.mc-button--standard.svelte-132ae2w:active {background-color:#c9d0de;}.mc-button--outlined.mc-button--standard.svelte-132ae2w:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button--outlined.mc-button--accent.svelte-132ae2w {color:#117f03;border-color:#78be20;background-color:#ffffff;}.mc-button--outlined.mc-button--accent.svelte-132ae2w:hover {background-color:#ebf5de;}.mc-button--outlined.mc-button--accent.svelte-132ae2w:active {background-color:#c5e39e;}.mc-button--outlined.mc-button--accent.svelte-132ae2w:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button--outlined.mc-button--danger.svelte-132ae2w {color:#c61112;border-color:#ef5f5c;background-color:#ffffff;}.mc-button--outlined.mc-button--danger.svelte-132ae2w:hover {background-color:#fdeaea;}.mc-button--outlined.mc-button--danger.svelte-132ae2w:active {background-color:#f8bcbb;}.mc-button--outlined.mc-button--danger.svelte-132ae2w:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button--outlined.mc-button--inverse.svelte-132ae2w {color:#ffffff;border-color:#ffffff;background-color:rgba(255, 255, 255, 0.01);}.mc-button--outlined.mc-button--inverse.svelte-132ae2w:hover {background-color:rgba(255, 255, 255, 0.1);}.mc-button--outlined.mc-button--inverse.svelte-132ae2w:active {background-color:rgba(255, 255, 255, 0.2);}.mc-button--outlined.mc-button--inverse.svelte-132ae2w:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button--ghost.mc-button--standard.svelte-132ae2w {color:#242938;background-color:rgba(255, 255, 255, 0.01);}.mc-button--ghost.mc-button--standard.svelte-132ae2w:hover {background-color:rgba(70, 78, 99, 0.1);}.mc-button--ghost.mc-button--standard.svelte-132ae2w:active {background-color:rgba(70, 78, 99, 0.2);}.mc-button--ghost.mc-button--standard.svelte-132ae2w:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button--ghost.mc-button--accent.svelte-132ae2w {color:#117f03;background-color:rgba(255, 255, 255, 0.01);}.mc-button--ghost.mc-button--accent.svelte-132ae2w:hover {background-color:rgba(17, 127, 3, 0.1);}.mc-button--ghost.mc-button--accent.svelte-132ae2w:active {background-color:rgba(17, 127, 3, 0.2);}.mc-button--ghost.mc-button--accent.svelte-132ae2w:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button--ghost.mc-button--danger.svelte-132ae2w {color:#c61112;background-color:rgba(255, 255, 255, 0.01);}.mc-button--ghost.mc-button--danger.svelte-132ae2w:hover {background-color:rgba(198, 17, 18, 0.1);}.mc-button--ghost.mc-button--danger.svelte-132ae2w:active {background-color:rgba(198, 17, 18, 0.2);}.mc-button--ghost.mc-button--danger.svelte-132ae2w:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-button--ghost.mc-button--inverse.svelte-132ae2w {color:#ffffff;background-color:rgba(255, 255, 255, 0.01);}.mc-button--ghost.mc-button--inverse.svelte-132ae2w:hover {background-color:rgba(255, 255, 255, 0.1);}.mc-button--ghost.mc-button--inverse.svelte-132ae2w:active {background-color:rgba(255, 255, 255, 0.2);}.mc-button--ghost.mc-button--inverse.svelte-132ae2w:disabled {background-color:#d9d9d9;border-color:transparent;color:#737373;cursor:not-allowed;}.mc-overlay.svelte-132ae2w {filter:none;}`};function be(h,t){const f=te(t);F(t,!0),ee(h,ie);let c=r(t,"open",7,!1),i=r(t,"position",7,"right"),b=r(t,"extended",7,!1),m=r(t,"back",7,!1),s=r(t,"title",7,""),o=r(t,"contentTitle",7,""),p=r(t,"updateopen",7,()=>{}),x=r(t,"backfn",7,()=>{});function E(){c(!1),p()(!1)}function K(){x()()}var u=se();let H;var y=l(u),z=l(y),O=l(z);{var P=e=>{var n=ce(),w=l(n);J(w,{"aria-hidden":"true"}),d(n),B("click",n,K),g(e,n)};C(O,e=>{m()&&e(P)})}var T=v(O,2),Q=l(T,!0);d(T);var j=v(T,2),R=l(j);re(R,{"aria-hidden":"true"}),d(j),d(z);var N=v(z,2),q=l(N),A=l(q);{var U=e=>{var n=le(),w=l(n,!0);d(n),D(()=>L(w,o())),g(e,n)};C(A,e=>{o()&&e(U)})}var V=v(A,2);M(V,t,"default",{}),d(q),d(N);var W=v(N,2);{var X=e=>{var n=de(),w=l(n);M(w,t,"footer",{}),d(n),g(e,n)};C(W,e=>{f.footer&&e(X)})}d(y);var Y=v(y,2);return ae(Y,{get isvisible(){return c()},dialoglabel:"drawerTitle"}),d(u),D(e=>{H=I(u,1,`mc-drawer mc-drawer--${i()}`,"svelte-132ae2w",H,e),_(u,"aria-modal",c()?"true":"false"),_(u,"aria-hidden",!c()),L(Q,s())},[()=>({"is-open":c(),"mc-drawer--extend":b()})]),B("click",j,E),B("keydown",u,e=>e.key==="Escape"&&E()),g(h,u),G({get open(){return c()},set open(e=!1){c(e),a()},get position(){return i()},set position(e="right"){i(e),a()},get extended(){return b()},set extended(e=!1){b(e),a()},get back(){return m()},set back(e=!1){m(e),a()},get title(){return s()},set title(e=""){s(e),a()},get contentTitle(){return o()},set contentTitle(e=""){o(e),a()},get updateopen(){return p()},set updateopen(e=()=>{}){p(e),a()},get backfn(){return x()},set backfn(e=()=>{}){x(e),a()}})}customElements.define("m-drawer",S(be,{open:{},position:{},extended:{},back:{},title:{},contentTitle:{},updateopen:{},backfn:{}},["default","footer"],[],!0));
 //# sourceMappingURL=Drawer.js.map

package/dist/components/drawer/Drawer.js.map

@@ -1 +1 @@
-{"version":3,"file":"Drawer.js","sources":["../../../node_modules/@mozaic-ds/icons-svelte/dist/components/ArrowBack24/ArrowBack24.svelte","../../../src/components/drawer/Drawer.svelte"],"sourcesContent":["<svelte:options customElement={{ tag: 'arrow-back-24', shadow: 'none' }} />\n<script>\n  export let id = undefined;\n  export let style = undefined;\n  export let className = undefined;\n  export let fill = undefined;\n  export let size = \"1.5rem\";\n</script>\n\n<svg aria-hidden=\"true\" id={id}  style={style} class={className} fill={fill} xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" width=\"24px\" height=\"24px\"><path fill-rule=\"evenodd\" d=\"M8.707 6.293a1 1 0 0 1 0 1.414L5.414 11H21a1 1 0 1 1 0 2H5.414l3.293 3.293a1 1 0 1 1-1.414 1.414l-5-5a1 1 0 0 1 0-1.414l5-5a1 1 0 0 1 1.414 0\"/></svg>","<svelte:options customElement={{ tag: 'm-drawer' }} />\n\n<script lang=\"ts\">\n  import ArrowBack24 from '@mozaic-ds/icons-svelte/svelte/ArrowBack24/ArrowBack24.svelte';\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    position?: 'left' | 'right';\n    extended?: boolean;\n    back?: boolean;\n    title: string;\n    contentTitle?: string;\n    updateopen?: (value: boolean) => void;\n    backfn?: () => void;\n    [key: string]: any;\n  }\n\n  let {\n    open = false,\n    position = 'right',\n    extended = false,\n    back = false,\n    title = '',\n    contentTitle = '',\n    updateopen = () => {},\n    backfn = () => {},\n  }: Props = $props();\n\n  function onClose() {\n    open = false;\n    updateopen(false);\n  }\n\n  function onBack() {\n    backfn();\n  }\n</script>\n\n<section\n  class={`mc-drawer mc-drawer--${position}`}\n  class:is-open={open}\n  class:mc-drawer--extend={extended}\n  aria-labelledby=\"drawerTitle\"\n  aria-modal={open ? 'true' : 'false'}\n  tabindex=\"-1\"\n  aria-hidden={!open}\n  on:keydown={(e) => e.key === 'Escape' && onClose()}\n>\n  <div class=\"mc-drawer__dialog\" role=\"document\">\n    <div class=\"mc-drawer__header\">\n      {#if back}\n        <button\n          class=\"mc-drawer__back mc-button mc-button--icon-button mc-button--ghost\"\n          aria-label=\"Back\"\n          on:click={onBack}\n        >\n          <ArrowBack24 aria-hidden=\"true\" />\n        </button>\n      {/if}\n      <h2 class=\"mc-drawer__title\" id=\"drawerTitle\">{title}</h2>\n      <button\n        class=\"mc-drawer__close mc-button mc-button--icon-button mc-button--ghost\"\n        aria-label=\"Close\"\n        on:click={onClose}\n      >\n        <Cross24 aria-hidden=\"true\" />\n      </button>\n    </div>\n\n    <div class=\"mc-drawer__body\">\n      <div class=\"mc-drawer__content\" tabindex=\"0\">\n        {#if contentTitle}\n          <h2 class=\"mc-drawer__content__title\">{contentTitle}</h2>\n        {/if}\n        <slot />\n      </div>\n    </div>\n\n    {#if $$slots.footer}\n      <div class=\"mc-drawer__footer\">\n        <slot name=\"footer\" />\n      </div>\n    {/if}\n  </div>\n  <MOverlay isvisible={open} dialoglabel=\"drawerTitle\" />\n</section>\n\n<style lang=\"scss\">\n  @use '@mozaic-ds/styles/components/drawer';\n  @use '@mozaic-ds/styles/components/button';\n\n  .mc-overlay {\n    filter: none;\n  }\n</style>\n"],"names":["id","style","className","fill","size","open","position","extended","back","title","contentTitle","updateopen","$.prop","$$props","backfn","onClose","onBack","$$render","consequent","consequent_1","$$slots","consequent_2","classes","$0","$.event","section","$$value"],"mappings":"qrBAAA,SAEa,IAAAA,cAAK,MAAS,EACdC,iBAAQ,MAAS,EACjBC,qBAAY,MAAS,EACrBC,gBAAO,MAAS,EAChBC,gBAAO,QAAQ,oCAGAJ,GAAE,OAAUC,GAAK,UAASC,EAAS,CAAA,CAAA,aAAQC,GAAI,wPAF3E;;;;;;;;;;;;+5WCPA,gCAoBI,IAAAE,eAAO,EAAK,EACZC,mBAAW,OAAO,EAClBC,mBAAW,EAAK,EAChBC,eAAO,EAAK,EACZC,gBAAQ,EAAE,EACVC,uBAAe,EAAE,EACjBC,EAAUC,EAAAC,EAAA,aAAA,EAAA,IAAS,CAAA,CAAE,EACrBC,EAAMF,EAAAC,EAAA,SAAA,EAAA,IAAS,CAAA,CAAE,EAGV,SAAAE,GAAU,CACjBV,EAAO,EAAK,EACZM,EAAU,EAAC,EAAK,CAClB,CAES,SAAAK,GAAS,CAChBF,IAAM,CACR,qHAmBkBE,CAAM,kBAJfR,EAAI,GAAAS,EAAAC,CAAA,qKAsBkCR,EAAY,CAAA,CAAA,kBADhDA,EAAY,GAAAO,EAAAE,CAAA,iIAOhBC,EAAQ,QAAMH,EAAAI,CAAA,0DAMAhB,EAAI,0EA7CMC,EAAQ,CAAA,GAAA,iBAAAgB,EAAAC,CAAA,mBAI3BlB,EAAI,EAAG,OAAS,OAAO,qBAErBA,EAAI,CAAA,MAciCI,GAAK,IAnBzC,KAAA,CAAA,UAAAJ,wBACUE,EAAQ,CAAA,iBAsBjBQ,CAAO,EAjBVS,EAAA,UAAAC,EAAA,GAAM,EAAE,MAAQ,UAAYV,GAAO,8CA5BvC,GAAK,qDACD,QAAO,qDACP,GAAK,6CACT,GAAK,+CACJ,GAAE,6DACK,GAAE,wCACE,IAAA,WAAAW,EAAA,IAAA,GAAE,oCACN,IAAA,OAAAA,EAAA,IAAA,GAAE,YAWrB","x_google_ignoreList":[0]}
+{"version":3,"file":"Drawer.js","sources":["../../../node_modules/@mozaic-ds/icons-svelte/dist/components/ArrowBack24/ArrowBack24.svelte","../../../src/components/drawer/Drawer.svelte"],"sourcesContent":["<svelte:options customElement={{ tag: 'arrow-back-24', shadow: 'none' }} />\n<script>\n  export let id = undefined;\n  export let style = undefined;\n  export let className = undefined;\n  export let fill = undefined;\n  export let size = \"1.5rem\";\n</script>\n\n<svg aria-hidden=\"true\" id={id}  style={style} class={className} fill={fill} xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" width=\"24px\" height=\"24px\"><path fill-rule=\"evenodd\" d=\"M8.707 6.293a1 1 0 0 1 0 1.414L5.414 11H21a1 1 0 1 1 0 2H5.414l3.293 3.293a1 1 0 1 1-1.414 1.414l-5-5a1 1 0 0 1 0-1.414l5-5a1 1 0 0 1 1.414 0\"/></svg>","<svelte:options customElement={{ tag: 'm-drawer' }} />\n\n<script lang=\"ts\">\n  import ArrowBack24 from '@mozaic-ds/icons-svelte/svelte/ArrowBack24/ArrowBack24.svelte';\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    position?: 'left' | 'right';\n    extended?: boolean;\n    back?: boolean;\n    title: string;\n    contentTitle?: string;\n    updateopen?: (value: boolean) => void;\n    backfn?: () => void;\n    [key: string]: any;\n  }\n\n  let {\n    open = false,\n    position = 'right',\n    extended = false,\n    back = false,\n    title = '',\n    contentTitle = '',\n    updateopen = () => {},\n    backfn = () => {},\n  }: Props = $props();\n\n  function onClose() {\n    open = false;\n    updateopen(false);\n  }\n\n  function onBack() {\n    backfn();\n  }\n</script>\n\n<section\n  class={`mc-drawer mc-drawer--${position}`}\n  class:is-open={open}\n  class:mc-drawer--extend={extended}\n  aria-labelledby=\"drawerTitle\"\n  aria-modal={open ? 'true' : 'false'}\n  tabindex=\"-1\"\n  aria-hidden={!open}\n  on:keydown={(e) => e.key === 'Escape' && onClose()}\n>\n  <div class=\"mc-drawer__dialog\" role=\"document\">\n    <div class=\"mc-drawer__header\">\n      {#if back}\n        <button\n          class=\"mc-drawer__back mc-button mc-button--icon-button mc-button--ghost\"\n          aria-label=\"Back\"\n          on:click={onBack}\n        >\n          <ArrowBack24 aria-hidden=\"true\" />\n        </button>\n      {/if}\n      <h2 class=\"mc-drawer__title\" id=\"drawerTitle\">{title}</h2>\n      <button\n        class=\"mc-drawer__close mc-button mc-button--icon-button mc-button--ghost\"\n        aria-label=\"Close\"\n        on:click={onClose}\n      >\n        <Cross24 aria-hidden=\"true\" />\n      </button>\n    </div>\n\n    <div class=\"mc-drawer__body\">\n      <div class=\"mc-drawer__content\" tabindex=\"0\">\n        {#if contentTitle}\n          <h2 class=\"mc-drawer__content__title\">{contentTitle}</h2>\n        {/if}\n        <slot />\n      </div>\n    </div>\n\n    {#if $$slots.footer}\n      <div class=\"mc-drawer__footer\">\n        <slot name=\"footer\" />\n      </div>\n    {/if}\n  </div>\n  <MOverlay isvisible={open} dialoglabel=\"drawerTitle\" />\n</section>\n\n<style lang=\"scss\">\n  @use '@mozaic-ds/styles/components/drawer';\n  @use '@mozaic-ds/styles/components/button';\n\n  .mc-overlay {\n    filter: none;\n  }\n</style>\n"],"names":["id","style","className","fill","size","open","position","extended","back","title","contentTitle","updateopen","$.prop","$$props","backfn","onClose","onBack","$$render","consequent","consequent_1","$$slots","consequent_2","classes","$0","$.event","section","$$value"],"mappings":"+rBAAA,SAEa,IAAAA,cAAK,MAAS,EACdC,iBAAQ,MAAS,EACjBC,qBAAY,MAAS,EACrBC,gBAAO,MAAS,EAChBC,gBAAO,QAAQ,oCAGAJ,GAAE,OAAUC,GAAK,UAASC,EAAS,CAAA,CAAA,aAAQC,GAAI,wPAF3E;;;;;;;;;;;;;;;+pOCPA,gCAoBI,IAAAE,eAAO,EAAK,EACZC,mBAAW,OAAO,EAClBC,mBAAW,EAAK,EAChBC,eAAO,EAAK,EACZC,gBAAQ,EAAE,EACVC,uBAAe,EAAE,EACjBC,EAAUC,EAAAC,EAAA,aAAA,EAAA,IAAS,CAAA,CAAE,EACrBC,EAAMF,EAAAC,EAAA,SAAA,EAAA,IAAS,CAAA,CAAE,EAGV,SAAAE,GAAU,CACjBV,EAAO,EAAK,EACZM,EAAU,EAAC,EAAK,CAClB,CAES,SAAAK,GAAS,CAChBF,IAAM,CACR,qHAmBkBE,CAAM,kBAJfR,EAAI,GAAAS,EAAAC,CAAA,qKAsBkCR,EAAY,CAAA,CAAA,kBADhDA,EAAY,GAAAO,EAAAE,CAAA,iIAOhBC,EAAQ,QAAMH,EAAAI,CAAA,0DAMAhB,EAAI,0EA7CMC,EAAQ,CAAA,GAAA,iBAAAgB,EAAAC,CAAA,mBAI3BlB,EAAI,EAAG,OAAS,OAAO,qBAErBA,EAAI,CAAA,MAciCI,GAAK,IAnBzC,KAAA,CAAA,UAAAJ,wBACUE,EAAQ,CAAA,iBAsBjBQ,CAAO,EAjBVS,EAAA,UAAAC,EAAA,GAAM,EAAE,MAAQ,UAAYV,GAAO,8CA5BvC,GAAK,qDACD,QAAO,qDACP,GAAK,6CACT,GAAK,+CACJ,GAAE,6DACK,GAAE,wCACE,IAAA,WAAAW,EAAA,IAAA,GAAE,oCACN,IAAA,OAAAA,EAAA,IAAA,GAAE,YAWrB","x_google_ignoreList":[0]}

package/dist/components/drawer/Drawer.svelte

@@ -90,6 +90,9 @@
 <style>/**
  * Do not edit directly, this file was auto-generated.
  */
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
 .mc-drawer {
   box-sizing: border-box;
   inset: 0;
@@ -118,7 +121,7 @@
   }
 }
 .mc-drawer__dialog {
-  background: var(--drawer-color-background, #ffffff);
+  background: #ffffff;
   display: flex;
   flex-direction: column;
   height: 100%;
@@ -128,7 +131,7 @@
   visibility: hidden;
   width: 100%;
   z-index: var(--drawer-z-index, 3);
-  border-radius: var(--radius-l, 1rem);
+  border-radius: 1rem;
 }
 @media (width >= 680px) {
   .mc-drawer__dialog {
@@ -147,9 +150,9 @@
   width: 1.5rem;
 }
 .mc-drawer__title {
-  font-size: var(--font-body-s, 0.875rem);
-  font-weight: var(--font-weight-semi-bold, 600);
-  color: var(--drawer-color-title, #666666);
+  font-size: 0.875rem;
+  font-weight: 600;
+  color: #666666;
   margin-bottom: 0;
   margin-top: 0;
   text-align: center;
@@ -173,7 +176,7 @@
   max-height: 100%;
   overflow: hidden auto;
   padding: 0.5rem 1rem 0;
-  color: var(--drawer-color-paragraph, #000000);
+  color: #000000;
 }
 @media (width >= 680px) {
   .mc-drawer__content {
@@ -181,7 +184,7 @@
   }
 }
 .mc-drawer__content__title {
-  font-size: var(--font-title-m, 1.5rem);
+  font-size: 1.5rem;
   margin: 0 0 0.5rem;
 }
 .mc-drawer__footer {
@@ -189,7 +192,7 @@
   flex-direction: column;
   gap: 1rem;
   padding: 1rem 1.5rem;
-  border-top: var(--border-s, 1px) solid var(--divider-color-primary, #cccccc);
+  border-top: 1px solid #cccccc;
 }
 @media (width >= 680px) {
   .mc-drawer__footer {
@@ -208,9 +211,9 @@
 }
 
 .mc-button {
-  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);
+  color: #ffffff;
+  background-color: #464e63;
+  font-weight: 600;
   padding: 0 calc(1rem - 0.125rem);
   min-height: 3rem;
   min-width: 3rem;
@@ -219,7 +222,7 @@
   vertical-align: middle;
   text-align: center;
   border: 2px solid transparent;
-  border-radius: var(--button-radius, 0.25rem);
+  border-radius: 0.25rem;
   transition: all ease 200ms;
   transition: box-shadow 200ms ease;
   align-items: center;
@@ -230,22 +233,22 @@
   cursor: pointer;
 }
 .mc-button:hover {
-  background-color: var(--button-color-filled-standard-hover-background, #343b4c);
+  background-color: #343b4c;
 }
 .mc-button:active {
-  background-color: var(--button-color-filled-standard-active-background, #242938);
+  background-color: #242938;
 }
 .mc-button:disabled {
-  background-color: var(--button-state-disabled-background, #d9d9d9);
+  background-color: #d9d9d9;
   border-color: transparent;
-  color: var(--button-state-disabled-color, #737373);
+  color: #737373;
   cursor: not-allowed;
 }
 .mc-button .mc-button__label {
-  font-size: var(--font-size-150, 1rem);
+  font-size: 1rem;
 }
 .mc-button__label {
-  font-size: var(--font-size-150, 1rem);
+  font-size: 1rem;
 }
 .mc-button__icon {
   flex-shrink: 0;
@@ -253,13 +256,13 @@
   height: 1.5rem;
 }
 .mc-button:disabled {
-  background-color: var(--button-state-disabled-background, #d9d9d9);
+  background-color: #d9d9d9;
   border-color: transparent;
-  color: var(--button-state-disabled-color, #737373);
+  color: #737373;
   cursor: not-allowed;
 }
 .mc-button: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));
+  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;
 }
@@ -269,7 +272,7 @@
   min-width: 2rem;
 }
 .mc-button--s .mc-button__label {
-  font-size: var(--font-size-100, 0.875rem);
+  font-size: 0.875rem;
 }
 .mc-button--s .mc-button__icon {
   width: 1.25rem;
@@ -285,7 +288,7 @@
   min-width: 3rem;
 }
 .mc-button--m .mc-button__label {
-  font-size: var(--font-size-150, 1rem);
+  font-size: 1rem;
 }
 .mc-button--m .mc-button__icon {
   width: 1.5rem;
@@ -301,7 +304,7 @@
   min-width: 4rem;
 }
 .mc-button--l .mc-button__label {
-  font-size: var(--font-size-200, 1.125rem);
+  font-size: 1.125rem;
 }
 .mc-button--l .mc-button__icon {
   width: 2rem;
@@ -315,90 +318,90 @@
   padding: 0.25rem;
 }
 .mc-button--outlined {
-  color: var(--button-color-outlined-standard-font, #242938);
-  border-color: var(--button-color-outlined-standard-border, #8891aa);
-  background-color: var(--button-color-outlined-standard-background, #ffffff);
+  color: #242938;
+  border-color: #8891aa;
+  background-color: #ffffff;
 }
 .mc-button--outlined:hover {
-  background-color: var(--button-color-outlined-standard-hover-background, #eff1f6);
+  background-color: #eff1f6;
 }
 .mc-button--outlined:active {
-  background-color: var(--button-color-outlined-standard-active-background, #c9d0de);
+  background-color: #c9d0de;
 }
 .mc-button--outlined:disabled {
-  background-color: var(--button-state-disabled-background, #d9d9d9);
+  background-color: #d9d9d9;
   border-color: transparent;
-  color: var(--button-state-disabled-color, #737373);
+  color: #737373;
   cursor: not-allowed;
 }
 .mc-button--ghost {
-  color: var(--button-color-ghost-standard-font, #242938);
-  background-color: var(--button-color-ghost-standard-background, rgba(255, 255, 255, 0.01));
+  color: #242938;
+  background-color: rgba(255, 255, 255, 0.01);
 }
 .mc-button--ghost:hover {
-  background-color: var(--button-color-ghost-standard-hover-background, rgba(70, 78, 99, 0.1));
+  background-color: rgba(70, 78, 99, 0.1);
 }
 .mc-button--ghost:active {
-  background-color: var(--button-color-ghost-standard-active-background, rgba(70, 78, 99, 0.2));
+  background-color: rgba(70, 78, 99, 0.2);
 }
 .mc-button--ghost:disabled {
-  background-color: var(--button-state-disabled-background, #d9d9d9);
+  background-color: #d9d9d9;
   border-color: transparent;
-  color: var(--button-state-disabled-color, #737373);
+  color: #737373;
   cursor: not-allowed;
 }
 .mc-button--accent {
-  color: var(--button-color-filled-accent-font, #ffffff);
-  background-color: var(--button-color-filled-accent-background, #117f03);
+  color: #ffffff;
+  background-color: #117f03;
 }
 .mc-button--accent:hover {
-  background-color: var(--button-color-filled-accent-hover-background, #006902);
+  background-color: #006902;
 }
 .mc-button--accent:active {
-  background-color: var(--button-color-filled-accent-active-background, #035010);
+  background-color: #035010;
 }
 .mc-button--accent:disabled {
-  background-color: var(--button-state-disabled-background, #d9d9d9);
+  background-color: #d9d9d9;
   border-color: transparent;
-  color: var(--button-state-disabled-color, #737373);
+  color: #737373;
   cursor: not-allowed;
 }
 .mc-button--danger {
-  color: var(--button-color-filled-danger-font, #ffffff);
-  background-color: var(--button-color-filled-danger-background, #c61112);
+  color: #ffffff;
+  background-color: #c61112;
 }
 .mc-button--danger:hover {
-  background-color: var(--button-color-filled-danger-hover-background, #8c0003);
+  background-color: #8c0003;
 }
 .mc-button--danger:active {
-  background-color: var(--button-color-filled-danger-active-background, #530000);
+  background-color: #530000;
 }
 .mc-button--danger:disabled {
-  background-color: var(--button-state-disabled-background, #d9d9d9);
+  background-color: #d9d9d9;
   border-color: transparent;
-  color: var(--button-state-disabled-color, #737373);
+  color: #737373;
   cursor: not-allowed;
 }
 .mc-button--inverse {
-  --focus-color-mid: var(--focus-color-outline-outer, #000000);
-  --focus-color-outer: var(--focus-color-outline-mid, #ffffff);
-  color: var(--button-color-filled-inverse-font, #242938);
-  background-color: var(--button-color-filled-inverse-background, #ffffff);
+  --focus-color-mid: #000000;
+  --focus-color-outer: #ffffff;
+  color: #242938;
+  background-color: #ffffff;
 }
 .mc-button--inverse:hover {
-  background-color: var(--button-color-filled-inverse-hover-background, #e6e6e6);
+  background-color: #e6e6e6;
 }
 .mc-button--inverse:active {
-  background-color: var(--button-color-filled-inverse-active-background, #cccccc);
+  background-color: #cccccc;
 }
 .mc-button--inverse:disabled {
-  background-color: var(--button-state-disabled-background, #d9d9d9);
+  background-color: #d9d9d9;
   border-color: transparent;
-  color: var(--button-state-disabled-color, #737373);
+  color: #737373;
   cursor: not-allowed;
 }
 .mc-button--icon-button {
-  border-radius: var(--radius-full, 100%);
+  border-radius: 100%;
   padding: 0;
 }
 .mc-button--loading .mc-button__loader {
@@ -410,135 +413,135 @@
   visibility: hidden;
 }
 .mc-button--outlined.mc-button--standard {
-  color: var(--button-color-outlined-standard-font, #242938);
-  border-color: var(--button-color-outlined-standard-border, #8891aa);
-  background-color: var(--button-color-outlined-standard-background, #ffffff);
+  color: #242938;
+  border-color: #8891aa;
+  background-color: #ffffff;
 }
 .mc-button--outlined.mc-button--standard:hover {
-  background-color: var(--button-color-outlined-standard-hover-background, #eff1f6);
+  background-color: #eff1f6;
 }
 .mc-button--outlined.mc-button--standard:active {
-  background-color: var(--button-color-outlined-standard-active-background, #c9d0de);
+  background-color: #c9d0de;
 }
 .mc-button--outlined.mc-button--standard:disabled {
-  background-color: var(--button-state-disabled-background, #d9d9d9);
+  background-color: #d9d9d9;
   border-color: transparent;
-  color: var(--button-state-disabled-color, #737373);
+  color: #737373;
   cursor: not-allowed;
 }
 .mc-button--outlined.mc-button--accent {
-  color: var(--button-color-outlined-accent-font, #117f03);
-  border-color: var(--button-color-outlined-accent-border, #78be20);
-  background-color: var(--button-color-outlined-accent-background, #ffffff);
+  color: #117f03;
+  border-color: #78be20;
+  background-color: #ffffff;
 }
 .mc-button--outlined.mc-button--accent:hover {
-  background-color: var(--button-color-outlined-accent-hover-background, #ebf5de);
+  background-color: #ebf5de;
 }
 .mc-button--outlined.mc-button--accent:active {
-  background-color: var(--button-color-outlined-accent-active-background, #c5e39e);
+  background-color: #c5e39e;
 }
 .mc-button--outlined.mc-button--accent:disabled {
-  background-color: var(--button-state-disabled-background, #d9d9d9);
+  background-color: #d9d9d9;
   border-color: transparent;
-  color: var(--button-state-disabled-color, #737373);
+  color: #737373;
   cursor: not-allowed;
 }
 .mc-button--outlined.mc-button--danger {
-  color: var(--button-color-outlined-danger-font, #c61112);
-  border-color: var(--button-color-outlined-danger-border, #ef5f5c);
-  background-color: var(--button-color-outlined-danger-background, #ffffff);
+  color: #c61112;
+  border-color: #ef5f5c;
+  background-color: #ffffff;
 }
 .mc-button--outlined.mc-button--danger:hover {
-  background-color: var(--button-color-outlined-danger-hover-background, #fdeaea);
+  background-color: #fdeaea;
 }
 .mc-button--outlined.mc-button--danger:active {
-  background-color: var(--button-color-outlined-danger-active-background, #f8bcbb);
+  background-color: #f8bcbb;
 }
 .mc-button--outlined.mc-button--danger:disabled {
-  background-color: var(--button-state-disabled-background, #d9d9d9);
+  background-color: #d9d9d9;
   border-color: transparent;
-  color: var(--button-state-disabled-color, #737373);
+  color: #737373;
   cursor: not-allowed;
 }
 .mc-button--outlined.mc-button--inverse {
-  color: var(--button-color-outlined-inverse-font, #ffffff);
-  border-color: var(--button-color-outlined-inverse-border, #ffffff);
-  background-color: var(--button-color-outlined-inverse-background, rgba(255, 255, 255, 0.01));
+  color: #ffffff;
+  border-color: #ffffff;
+  background-color: rgba(255, 255, 255, 0.01);
 }
 .mc-button--outlined.mc-button--inverse:hover {
-  background-color: var(--button-color-outlined-inverse-hover-background, rgba(255, 255, 255, 0.1));
+  background-color: rgba(255, 255, 255, 0.1);
 }
 .mc-button--outlined.mc-button--inverse:active {
-  background-color: var(--button-color-outlined-inverse-active-background, rgba(255, 255, 255, 0.2));
+  background-color: rgba(255, 255, 255, 0.2);
 }
 .mc-button--outlined.mc-button--inverse:disabled {
-  background-color: var(--button-state-disabled-background, #d9d9d9);
+  background-color: #d9d9d9;
   border-color: transparent;
-  color: var(--button-state-disabled-color, #737373);
+  color: #737373;
   cursor: not-allowed;
 }
 .mc-button--ghost.mc-button--standard {
-  color: var(--button-color-ghost-standard-font, #242938);
-  background-color: var(--button-color-ghost-standard-background, rgba(255, 255, 255, 0.01));
+  color: #242938;
+  background-color: rgba(255, 255, 255, 0.01);
 }
 .mc-button--ghost.mc-button--standard:hover {
-  background-color: var(--button-color-ghost-standard-hover-background, rgba(70, 78, 99, 0.1));
+  background-color: rgba(70, 78, 99, 0.1);
 }
 .mc-button--ghost.mc-button--standard:active {
-  background-color: var(--button-color-ghost-standard-active-background, rgba(70, 78, 99, 0.2));
+  background-color: rgba(70, 78, 99, 0.2);
 }
 .mc-button--ghost.mc-button--standard:disabled {
-  background-color: var(--button-state-disabled-background, #d9d9d9);
+  background-color: #d9d9d9;
   border-color: transparent;
-  color: var(--button-state-disabled-color, #737373);
+  color: #737373;
   cursor: not-allowed;
 }
 .mc-button--ghost.mc-button--accent {
-  color: var(--button-color-ghost-accent-font, #117f03);
-  background-color: var(--button-color-ghost-accent-background, rgba(255, 255, 255, 0.01));
+  color: #117f03;
+  background-color: rgba(255, 255, 255, 0.01);
 }
 .mc-button--ghost.mc-button--accent:hover {
-  background-color: var(--button-color-ghost-accent-hover-background, rgba(17, 127, 3, 0.1));
+  background-color: rgba(17, 127, 3, 0.1);
 }
 .mc-button--ghost.mc-button--accent:active {
-  background-color: var(--button-color-ghost-accent-active-background, rgba(17, 127, 3, 0.2));
+  background-color: rgba(17, 127, 3, 0.2);
 }
 .mc-button--ghost.mc-button--accent:disabled {
-  background-color: var(--button-state-disabled-background, #d9d9d9);
+  background-color: #d9d9d9;
   border-color: transparent;
-  color: var(--button-state-disabled-color, #737373);
+  color: #737373;
   cursor: not-allowed;
 }
 .mc-button--ghost.mc-button--danger {
-  color: var(--button-color-ghost-danger-font, #c61112);
-  background-color: var(--button-color-ghost-danger-background, rgba(255, 255, 255, 0.01));
+  color: #c61112;
+  background-color: rgba(255, 255, 255, 0.01);
 }
 .mc-button--ghost.mc-button--danger:hover {
-  background-color: var(--button-color-ghost-danger-hover-background, rgba(198, 17, 18, 0.1));
+  background-color: rgba(198, 17, 18, 0.1);
 }
 .mc-button--ghost.mc-button--danger:active {
-  background-color: var(--button-color-ghost-danger-active-background, rgba(198, 17, 18, 0.2));
+  background-color: rgba(198, 17, 18, 0.2);
 }
 .mc-button--ghost.mc-button--danger:disabled {
-  background-color: var(--button-state-disabled-background, #d9d9d9);
+  background-color: #d9d9d9;
   border-color: transparent;
-  color: var(--button-state-disabled-color, #737373);
+  color: #737373;
   cursor: not-allowed;
 }
 .mc-button--ghost.mc-button--inverse {
-  color: var(--button-color-ghost-inverse-font, #ffffff);
-  background-color: var(--button-color-ghost-inverse-background, rgba(255, 255, 255, 0.01));
+  color: #ffffff;
+  background-color: rgba(255, 255, 255, 0.01);
 }
 .mc-button--ghost.mc-button--inverse:hover {
-  background-color: var(--button-color-ghost-inverse-hover-background, rgba(255, 255, 255, 0.1));
+  background-color: rgba(255, 255, 255, 0.1);
 }
 .mc-button--ghost.mc-button--inverse:active {
-  background-color: var(--button-color-ghost-inverse-active-background, rgba(255, 255, 255, 0.2));
+  background-color: rgba(255, 255, 255, 0.2);
 }
 .mc-button--ghost.mc-button--inverse:disabled {
-  background-color: var(--button-state-disabled-background, #d9d9d9);
+  background-color: #d9d9d9;
   border-color: transparent;
-  color: var(--button-state-disabled-color, #737373);
+  color: #737373;
   cursor: not-allowed;
 }
 

package/dist/components/field/Field.js

@@ -1,7 +1,10 @@
-import{c as G,p as H,a as I,b as t,f as p,s as c,d as n,t as _,h,i as J,j as l,r,g as u,e as K}from"../../custom-element.js";import{i as Z}from"../../if.js";import{s as N}from"../../slot.js";import{s as z}from"../../attributes.js";var O=p('<span class="mc-field__requirement svelte-af7nn5" aria-hidden="true"> </span>'),P=p('<span class="mc-field__help svelte-af7nn5"> </span>'),Q=p("<span> </span>"),R=p('<div class="mc-field"><label class="mc-field__label svelte-af7nn5"> <!></label> <!> <div class="mc-field__content svelte-af7nn5"><!></div> <!></div>');const T={hash:"svelte-af7nn5",code:`/**
+import{c as G,p as H,a as I,b as i,f as p,s as f,d as r,t as _,h,i as J,j as a,r as d,g as u,e as K}from"../../custom-element.js";import{i as Z}from"../../if.js";import{s as N}from"../../slot.js";import{s as C}from"../../attributes.js";var O=p('<span class="mc-field__requirement svelte-7mv9l6" aria-hidden="true"> </span>'),P=p('<span class="mc-field__help svelte-7mv9l6"> </span>'),Q=p("<span> </span>"),R=p('<div class="mc-field"><label class="mc-field__label svelte-7mv9l6"> <!></label> <!> <div class="mc-field__content svelte-7mv9l6"><!></div> <!></div>');const T={hash:"svelte-7mv9l6",code:`/**
  * Do not edit directly, this file was auto-generated.
  */
-/* stylelint-disable string-no-newline */.mc-field__label.svelte-af7nn5 {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__requirement.svelte-af7nn5, .mc-field__help.svelte-af7nn5 {font-size:var(--font-size-50, 0.75rem);line-height:var(--line-height-m, 1.5);font-weight:var(--font-weight-regular, 400);vertical-align:top;color:var(--field-color-requirement, #666666);}.mc-field__help.svelte-af7nn5 {display:block;margin-top:0.125rem;}.mc-field__content.svelte-af7nn5 {margin-top:0.5rem;}.mc-field__validation-message.svelte-af7nn5 {font-size:var(--font-size-100, 0.875rem);line-height:var(--line-height-m, 1.5);display:inline-flex;gap:0.25rem;margin-top:0.25rem;}.mc-field__validation-message.is-valid.svelte-af7nn5::before, .mc-field__validation-message.is-invalid.svelte-af7nn5::before {content:"";height:1.25rem;width:1.25rem;}.mc-field__validation-message.is-valid.svelte-af7nn5 {color:var(--field-color-validation-valid, #117f03);}.mc-field__validation-message.is-valid.svelte-af7nn5::before {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' height='1.25rem' width='1.25rem' fill='var(--field-color-validation-valid, %23117f03)' viewBox='0 0 20 20'%3E%3Cpath fill-rule='evenodd' d='M3.25 10c0-3.72792 3.02208-6.75 6.75-6.75 3.7279 0 6.75 3.02208 6.75 6.75 0 3.7279-3.0221 6.75-6.75 6.75-3.72792 0-6.75-3.0221-6.75-6.75ZM10 1.75c-4.55635 0-8.25 3.69365-8.25 8.25 0 4.5563 3.69365 8.25 8.25 8.25 4.5563 0 8.25-3.6937 8.25-8.25 0-4.55635-3.6937-8.25-8.25-8.25Zm4.2803 6.697c.2929-.2929.2929-.76777 0-1.06066-.2929-.2929-.7677-.2929-1.0606 0L9.16667 11.4393 7.197 9.46967c-.2929-.29289-.76777-.29289-1.06066 0-.2929.29289-.2929.76773 0 1.06063l2.5 2.5c.29289.2929.76776.2929 1.06066 0l4.5833-4.5833Z'/%3E%3C/svg%3E");}.mc-field__validation-message.is-invalid.svelte-af7nn5 {color:var(--field-color-validation-invalid, #c61112);}.mc-field__validation-message.is-invalid.svelte-af7nn5::before {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' height='1.25rem' width='1.25rem' fill='var(--field-color-validation-invalid, %23c61112)' viewBox='0 0 20 20'%3E%3Cpath fill-rule='evenodd' d='M10 3.25c-3.72792 0-6.75 3.02208-6.75 6.75 0 3.7279 3.02208 6.75 6.75 6.75 3.7279 0 6.75-3.0221 6.75-6.75 0-3.72792-3.0221-6.75-6.75-6.75ZM1.75 10c0-4.55635 3.69365-8.25 8.25-8.25 4.5563 0 8.25 3.69365 8.25 8.25 0 4.5563-3.6937 8.25-8.25 8.25-4.55635 0-8.25-3.6937-8.25-8.25ZM10 5.91667c.4142 0 .75.33578.75.75v4.16663c0 .4142-.3358.75-.75.75-.41421 0-.75-.3358-.75-.75V6.66667c0-.41422.33579-.75.75-.75Zm0 8.25003c.4602 0 .8333-.3731.8333-.8334 0-.4602-.3731-.8333-.8333-.8333-.46024 0-.83333.3731-.83333.8333 0 .4603.37309.8334.83333.8334Z'/%3E%3C/svg%3E");}
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+/* stylelint-disable string-no-newline */.mc-field__label.svelte-7mv9l6 {font-size:0.875rem;line-height:1.3;font-weight:400;color:#000000;}.mc-field__requirement.svelte-7mv9l6, .mc-field__help.svelte-7mv9l6 {font-size:0.75rem;line-height:1.5;font-weight:400;vertical-align:top;color:#666666;}.mc-field__help.svelte-7mv9l6 {display:block;margin-top:0.125rem;}.mc-field__content.svelte-7mv9l6 {margin-top:0.5rem;}.mc-field__validation-message.svelte-7mv9l6 {font-size:0.875rem;line-height:1.5;display:inline-flex;gap:0.25rem;margin-top:0.25rem;}.mc-field__validation-message.is-valid.svelte-7mv9l6::before, .mc-field__validation-message.is-invalid.svelte-7mv9l6::before {content:"";height:1.25rem;width:1.25rem;}.mc-field__validation-message.is-valid.svelte-7mv9l6 {color:#117f03;}.mc-field__validation-message.is-valid.svelte-7mv9l6::before {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' height='1.25rem' width='1.25rem' fill='%23117f03' viewBox='0 0 20 20'%3E%3Cpath fill-rule='evenodd' d='M3.25 10c0-3.72792 3.02208-6.75 6.75-6.75 3.7279 0 6.75 3.02208 6.75 6.75 0 3.7279-3.0221 6.75-6.75 6.75-3.72792 0-6.75-3.0221-6.75-6.75ZM10 1.75c-4.55635 0-8.25 3.69365-8.25 8.25 0 4.5563 3.69365 8.25 8.25 8.25 4.5563 0 8.25-3.6937 8.25-8.25 0-4.55635-3.6937-8.25-8.25-8.25Zm4.2803 6.697c.2929-.2929.2929-.76777 0-1.06066-.2929-.2929-.7677-.2929-1.0606 0L9.16667 11.4393 7.197 9.46967c-.2929-.29289-.76777-.29289-1.06066 0-.2929.29289-.2929.76773 0 1.06063l2.5 2.5c.29289.2929.76776.2929 1.06066 0l4.5833-4.5833Z'/%3E%3C/svg%3E");}.mc-field__validation-message.is-invalid.svelte-7mv9l6 {color:#c61112;}.mc-field__validation-message.is-invalid.svelte-7mv9l6::before {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' height='1.25rem' width='1.25rem' fill='%23c61112' viewBox='0 0 20 20'%3E%3Cpath fill-rule='evenodd' d='M10 3.25c-3.72792 0-6.75 3.02208-6.75 6.75 0 3.7279 3.02208 6.75 6.75 6.75 3.7279 0 6.75-3.0221 6.75-6.75 0-3.72792-3.0221-6.75-6.75-6.75ZM1.75 10c0-4.55635 3.69365-8.25 8.25-8.25 4.5563 0 8.25 3.69365 8.25 8.25 0 4.5563-3.6937 8.25-8.25 8.25-4.55635 0-8.25-3.6937-8.25-8.25ZM10 5.91667c.4142 0 .75.33578.75.75v4.16663c0 .4142-.3358.75-.75.75-.41421 0-.75-.3358-.75-.75V6.66667c0-.41422.33579-.75.75-.75Zm0 8.25003c.4602 0 .8333-.3731.8333-.8334 0-.4602-.3731-.8333-.8333-.8333-.46024 0-.83333.3731-.83333.8333 0 .4603.37309.8334.83333.8334Z'/%3E%3C/svg%3E");}
 
-/* stylelint-enable string-no-newline */`};function U(C,a){H(a,!0),I(C,T);let b=t(a,"id",7),x=t(a,"label",7),d=t(a,"requirementtext",7),v=t(a,"helpid",7),m=t(a,"helptext",7),w=t(a,"messageid",7),q=t(a,"message",7),f=t(a,"isinvalid",7,!1),o=t(a,"isvalid",7,!1);var y=R(),g=n(y),M=n(g),B=c(M);{var j=e=>{var i=O(),s=n(i,!0);r(i),_(()=>u(s,d())),h(e,i)};Z(B,e=>{d()&&e(j)})}r(g);var k=c(g,2);{var D=e=>{var i=P(),s=n(i,!0);r(i),_(()=>{z(i,"id",v()),u(s,m())}),h(e,i)};Z(k,e=>{v()&&m()&&e(D)})}var E=c(k,2),F=n(E);N(F,a,"default",{}),r(E);var L=c(E,2);{var S=e=>{var i=Q();let s;var V=n(i,!0);r(i),_(A=>{z(i,"id",w()),s=K(i,1,"mc-field__validation-message svelte-af7nn5",null,s,A),u(V,q())},[()=>({"is-valid":o(),"is-invalid":f()})]),h(e,i)};Z(L,e=>{(f()||o())&&e(S)})}return r(y),_(()=>{z(g,"for",b()),u(M,`${x()??""} `)}),h(C,y),J({get id(){return b()},set id(e){b(e),l()},get label(){return x()},set label(e){x(e),l()},get requirementtext(){return d()},set requirementtext(e){d(e),l()},get helpid(){return v()},set helpid(e){v(e),l()},get helptext(){return m()},set helptext(e){m(e),l()},get messageid(){return w()},set messageid(e){w(e),l()},get message(){return q()},set message(e){q(e),l()},get isinvalid(){return f()},set isinvalid(e=!1){f(e),l()},get isvalid(){return o()},set isvalid(e=!1){o(e),l()}})}customElements.define("m-field",G(U,{id:{},label:{},requirementtext:{},helpid:{},helptext:{},messageid:{},message:{},isinvalid:{},isvalid:{}},["default"],[],!0));
+/* stylelint-enable string-no-newline */`};function U(M,t){H(t,!0),I(M,T);let b=i(t,"id",7),x=i(t,"label",7),n=i(t,"requirementtext",7),m=i(t,"helpid",7),v=i(t,"helptext",7),w=i(t,"messageid",7),y=i(t,"message",7),o=i(t,"isinvalid",7,!1),c=i(t,"isvalid",7,!1);var q=R(),g=r(q),k=r(g),B=f(k);{var D=e=>{var l=O(),s=r(l,!0);d(l),_(()=>u(s,n())),h(e,l)};Z(B,e=>{n()&&e(D)})}d(g);var z=f(g,2);{var j=e=>{var l=P(),s=r(l,!0);d(l),_(()=>{C(l,"id",m()),u(s,v())}),h(e,l)};Z(z,e=>{m()&&v()&&e(j)})}var E=f(z,2),F=r(E);N(F,t,"default",{}),d(E);var L=f(E,2);{var S=e=>{var l=Q();let s;var V=r(l,!0);d(l),_(A=>{C(l,"id",w()),s=K(l,1,"mc-field__validation-message svelte-7mv9l6",null,s,A),u(V,y())},[()=>({"is-valid":c(),"is-invalid":o()})]),h(e,l)};Z(L,e=>{(o()||c())&&e(S)})}return d(q),_(()=>{C(g,"for",b()),u(k,`${x()??""} `)}),h(M,q),J({get id(){return b()},set id(e){b(e),a()},get label(){return x()},set label(e){x(e),a()},get requirementtext(){return n()},set requirementtext(e){n(e),a()},get helpid(){return m()},set helpid(e){m(e),a()},get helptext(){return v()},set helptext(e){v(e),a()},get messageid(){return w()},set messageid(e){w(e),a()},get message(){return y()},set message(e){y(e),a()},get isinvalid(){return o()},set isinvalid(e=!1){o(e),a()},get isvalid(){return c()},set isvalid(e=!1){c(e),a()}})}customElements.define("m-field",G(U,{id:{},label:{},requirementtext:{},helpid:{},helptext:{},messageid:{},message:{},isinvalid:{},isvalid:{}},["default"],[],!0));
 //# sourceMappingURL=Field.js.map