@maggioli-design-system/mds-modal 4.1.0 → 4.3.0

package/dist/esm-es5/mds-modal.entry.js

@@ -1 +1 @@
-import{r as registerInstance,c as createEvent,h,H as Host,g as getElement}from"./index-118e6bec.js";function r(t){var o,i,e="";if("string"==typeof t||"number"==typeof t)e+=t;else if("object"==typeof t)if(Array.isArray(t))for(o=0;o<t.length;o++)t[o]&&(i=r(t[o]))&&(e&&(e+=" "),e+=i);else for(o in t)t[o]&&(e&&(e+=" "),e+=o);return e}function clsx(){for(var t,o,i=0,e="";i<arguments.length;)(t=arguments[i++])&&(o=r(t))&&(e&&(e+=" "),e+=o);return e}var miBaselineClose='<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 6.41L17.59 5L12 10.59L6.41 5L5 6.41L10.59 12L5 17.59L6.41 19L12 13.41L17.59 19L19 17.59L13.41 12z"/></svg>';var KeyboardManager=function(){function t(){var t=this;this.elements=[];this.handleClickBehaviorDispatchEvent=function(t){if(t.code==="Space"||t.code==="Enter"||t.code==="NumpadEnter"){t.target.click()}};this.handleEscapeBehaviorDispatchEvent=function(o){if(o.code==="Escape"&&t.escapeCallback){t.escapeCallback()}};this.addElement=function(o,i){if(i===void 0){i="element"}t.elements[i]=o};this.attachClickBehavior=function(o){if(o===void 0){o="element"}if(t.elements[o]){t.elements[o].addEventListener("keydown",t.handleClickBehaviorDispatchEvent)}};this.detachClickBehavior=function(o){if(o===void 0){o="element"}if(t.elements[o]){t.elements[o].removeEventListener("keydown",t.handleClickBehaviorDispatchEvent)}};this.attachEscapeBehavior=function(o){t.escapeCallback=o;if(typeof window!==undefined){window.addEventListener("keydown",t.handleEscapeBehaviorDispatchEvent.bind(t))}};this.detachEscapeBehavior=function(){t.escapeCallback=null;if(typeof window!==undefined){window.removeEventListener("keydown",t.handleEscapeBehaviorDispatchEvent.bind(t))}}}return t}();var mdsModalCss="@tailwind components; .focus-off,.focusable,.focusable-light,.focusable-light-off{-webkit-transition-duration:200ms;transition-duration:200ms;-webkit-transition-timing-function:cubic-bezier(0, 0, 0.2, 1);transition-timing-function:cubic-bezier(0, 0, 0.2, 1);outline-offset:var(--magma-outline-blur-offset);outline:var(--magma-outline-blur);-webkit-transition-property:background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform;transition-property:background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform, -webkit-box-shadow, -webkit-transform}.focus-on,.focusable-light:focus-visible,.focusable:focus-visible{--magma-outline-blur-offset:var(--magma-outline-focus-offset);--magma-outline-blur:var(--magma-outline-focus)}.focus-light-on,.focusable-light:focus-visible{--magma-outline-blur:2px solid rgb(var(--tone-neutral))}.svg{display:-ms-flexbox;display:flex}.svg svg{aspect-ratio:1 / 1;height:100%;width:100%}.animate-left,.animate-right{opacity:0;-webkit-transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:500ms;transition-duration:500ms;-webkit-transition-timing-function:cubic-bezier(1, 0, 0, 1);transition-timing-function:cubic-bezier(1, 0, 0, 1)}.animate-right-intro,.animate-right-outro{-webkit-transform:translateX(calc(100% + 50px));transform:translateX(calc(100% + 50px))}.fixed{position:fixed}.absolute{position:absolute}.mx-6{margin-left:1.5rem;margin-right:1.5rem}.ml-auto{margin-left:auto}.flex{display:-ms-flexbox;display:flex}.w-16{width:4rem}.min-w-0{min-width:0px}.max-w-lg{max-width:32rem}.max-w-xl{max-width:36rem}.items-center{-ms-flex-align:center;align-items:center}.gap-4{gap:1rem}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rounded-full{border-radius:9999px}.border{border-width:1px}.border-b{border-bottom-width:1px}.border-t{border-top-width:1px}.border-tone-neutral-09{--tw-border-opacity:1;border-color:rgba(var(--tone-neutral-09), var(--tw-border-opacity))}.bg-transparent{background-color:transparent}.p-8{padding:2rem}.p-4{padding:1rem}.text-tone-neutral-02{--tw-text-opacity:1;color:rgba(var(--tone-neutral-02), var(--tw-text-opacity))}.text-tone-neutral-04{--tw-text-opacity:1;color:rgba(var(--tone-neutral-04), var(--tw-text-opacity))}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}:host{--mds-modal-overlay-color:var(--magma-overlay-color, 0 0 0);--mds-modal-overlay-opacity:var(--magma-overlay-opacity, 0.5);--mds-modal-window-background:rgb(var(--tone-neutral));--mds-modal-window-overflow:auto;--mds-modal-window-shadow:0 25px 50px -12px rgb(0 0 0 / 0.25);--mds-modal-z-index:var(--magma-modal-z-index);pointer-events:none;position:fixed;top:0px;right:0px;bottom:0px;left:0px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;-webkit-transition-duration:700ms;transition-duration:700ms;-webkit-transition-timing-function:cubic-bezier(1, 0, 0, 1);transition-timing-function:cubic-bezier(1, 0, 0, 1);background-color:rgba(var(--mds-modal-overlay-color) / 0);-webkit-perspective:600px;perspective:600px;z-index:var(--z-index, 1000)}:host([position=top]){-ms-flex-align:start;align-items:flex-start;-ms-flex-pack:center;justify-content:center}:host([position=bottom]){-ms-flex-align:end;align-items:flex-end;-ms-flex-pack:center;justify-content:center}:host(.animate-bottom-opened),:host(.animate-center-opened),:host(.animate-left-opened),:host(.animate-right-opened),:host(.animate-top-opened){pointer-events:auto;-webkit-transition-duration:500ms;transition-duration:500ms;background-color:rgba(var(--mds-modal-overlay-color) / var(--mds-modal-overlay-opacity))}.close{position:absolute;top:0px;height:2.25rem;width:2.25rem;-webkit-transform-origin:center;transform-origin:center;cursor:pointer;border-radius:9999px;fill:rgb(var(--tone-neutral-10));font-size:2.25rem;line-height:2.5rem;opacity:0;-webkit-transition-duration:500ms;transition-duration:500ms;-webkit-transition-timing-function:cubic-bezier(0.77, 0, 0.175, 1);transition-timing-function:cubic-bezier(0.77, 0, 0.175, 1);-webkit-transform:translate(0, 24px) rotate(90deg);transform:translate(0, 24px) rotate(90deg);-webkit-transition-property:opacity, outline, outline-offset, -webkit-transform;transition-property:opacity, outline, outline-offset, -webkit-transform;transition-property:opacity, outline, outline-offset, transform;transition-property:opacity, outline, outline-offset, transform, -webkit-transform}.window{display:grid;height:100%;gap:0px;background-color:var(--mds-modal-window-background);-webkit-box-shadow:var(--mds-modal-window-shadow);box-shadow:var(--mds-modal-window-shadow);grid-template-rows:1fr;max-width:calc(100vw - 80px);overflow:var(--mds-modal-window-overflow)}.window--top{grid-template-rows:auto 1fr}.window--bottom{grid-template-rows:1fr auto}.window--top-bottom{grid-template-rows:auto 1fr auto}:host(.animate-bottom){-ms-flex-pack:center;justify-content:center;padding:2rem}@media (max-width: 767px){:host(.animate-bottom){padding:1rem}}:host(.animate-bottom) .window,:host(.animate-bottom)>::slotted([slot=window]){opacity:0;-webkit-transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:500ms;transition-duration:500ms;-webkit-transition-timing-function:cubic-bezier(1, 0, 0, 1);transition-timing-function:cubic-bezier(1, 0, 0, 1)}:host(.animate-bottom-intro) .window,:host(.animate-bottom-intro)>::slotted([slot=window]){-webkit-transform:rotateX(-22deg) scale(0.5) translateY(40%);transform:rotateX(-22deg) scale(0.5) translateY(40%)}:host(.animate-bottom-opened.animate-bottom-outro) .window,:host(.animate-bottom-opened.animate-bottom-outro)>::slotted([slot=window]),:host(.animate-bottom-opened) .window,:host(.animate-bottom-opened)>::slotted([slot=window]){opacity:1;-webkit-transform:rotateX(0) scale(1) translateY(0);transform:rotateX(0) scale(1) translateY(0)}:host(.animate-bottom-outro) .window,:host(.animate-bottom-outro)>::slotted([slot=window]){-webkit-transform:rotateX(-22deg) scale(0.5) translateY(-40%);transform:rotateX(-22deg) scale(0.5) translateY(-40%)}:host(.animate-center){-ms-flex-pack:center;justify-content:center;padding:2rem}@media (max-width: 767px){:host(.animate-center){padding:1rem}}:host(.animate-center) .window,:host(.animate-center)>::slotted([slot=window]){opacity:0;-webkit-transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:500ms;transition-duration:500ms;-webkit-transition-timing-function:cubic-bezier(1, 0, 0, 1);transition-timing-function:cubic-bezier(1, 0, 0, 1)}:host(.animate-center-intro) .window,:host(.animate-center-intro)>::slotted([slot=window]){-webkit-transform:rotateX(-22deg) scale(0.5) translateY(40%);transform:rotateX(-22deg) scale(0.5) translateY(40%)}:host(.animate-center-opened.animate-center-outro) .window,:host(.animate-center-opened.animate-center-outro)>::slotted([slot=window]),:host(.animate-center-opened) .window,:host(.animate-center-opened)>::slotted([slot=window]){opacity:1;-webkit-transform:rotateX(0) scale(1) translateY(0);transform:rotateX(0) scale(1) translateY(0)}:host(.animate-center-outro) .window,:host(.animate-center-outro)>::slotted([slot=window]){-webkit-transform:rotateX(-22deg) scale(0.5) translateY(-40%);transform:rotateX(-22deg) scale(0.5) translateY(-40%)}:host(.animate-left){-ms-flex-pack:start;justify-content:flex-start}:host(.animate-left) .window,:host(.animate-left)>::slotted([slot=window]){opacity:0;-webkit-transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:500ms;transition-duration:500ms;-webkit-transition-timing-function:cubic-bezier(1, 0, 0, 1);transition-timing-function:cubic-bezier(1, 0, 0, 1)}:host(.animate-left-intro) .window,:host(.animate-left-intro)>::slotted([slot=window]){-webkit-transform:translateX(calc(-100% - 50px));transform:translateX(calc(-100% - 50px))}:host(.animate-left-opened.animate-left-outro) .window,:host(.animate-left-opened.animate-left-outro)>::slotted([slot=window]),:host(.animate-left-opened) .window,:host(.animate-left-opened)>::slotted([slot=window]){opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}:host(.animate-left-opened) .close,:host(.animate-left-opened.animate-left-outro) .close{opacity:1;-webkit-transform:translate(-24px, 24px) rotate(0);transform:translate(-24px, 24px) rotate(0)}:host(.animate-left-outro) .window,:host(.animate-left-outro)>::slotted([slot=window]){-webkit-transform:translateX(calc(-100% - 50px));transform:translateX(calc(-100% - 50px))}:host(.animate-left-outro) .close{-webkit-transform:translate(24px, 24px) rotate(-90deg);transform:translate(24px, 24px) rotate(-90deg)}:host(.animate-left) .close{right:0px;-webkit-transform:translate(36px, 24px) rotate(90deg);transform:translate(36px, 24px) rotate(90deg)}:host(.animate-right){-ms-flex-pack:end;justify-content:flex-end}:host(.animate-right) .window,:host(.animate-right)>::slotted([slot=window]){opacity:0;-webkit-transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:500ms;transition-duration:500ms;-webkit-transition-timing-function:cubic-bezier(1, 0, 0, 1);transition-timing-function:cubic-bezier(1, 0, 0, 1)}:host(.animate-right-intro) .window,:host(.animate-right-intro)>::slotted([slot=window]){-webkit-transform:translateX(calc(100% + 50px));transform:translateX(calc(100% + 50px))}:host(.animate-right-opened.animate-right-outro) .window,:host(.animate-right-opened.animate-right-outro)>::slotted([slot=window]),:host(.animate-right-opened) .window,:host(.animate-right-opened)>::slotted([slot=window]){opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}:host(.animate-right-opened) .close,:host(.animate-right-opened.animate-right-outro) .close{opacity:1;-webkit-transform:translate(24px, 24px) rotate(0);transform:translate(24px, 24px) rotate(0)}:host(.animate-right-outro) .window,:host(.animate-right-outro)>::slotted([slot=window]){-webkit-transform:translateX(calc(100% + 50px));transform:translateX(calc(100% + 50px))}:host(.animate-right-outro) .close{-webkit-transform:translate(-24px, 24px) rotate(90deg);transform:translate(-24px, 24px) rotate(90deg)}:host(.animate-right) .close{left:0px;-webkit-transform:translate(-36px, 24px) rotate(-90deg);transform:translate(-36px, 24px) rotate(-90deg)}:host(.animate-top){-ms-flex-pack:center;justify-content:center;padding:2rem}@media (max-width: 767px){:host(.animate-top){padding:1rem}}:host(.animate-top) .window,:host(.animate-top)>::slotted([slot=window]){opacity:0;-webkit-transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:500ms;transition-duration:500ms;-webkit-transition-timing-function:cubic-bezier(1, 0, 0, 1);transition-timing-function:cubic-bezier(1, 0, 0, 1)}:host(.animate-top-intro) .window,:host(.animate-top-intro)>::slotted([slot=window]){-webkit-transform:rotateX(-22deg) scale(0.5) translateY(40%);transform:rotateX(-22deg) scale(0.5) translateY(40%)}:host(.animate-top-opened.animate-top-outro) .window,:host(.animate-top-opened.animate-top-outro)>::slotted([slot=window]),:host(.animate-top-opened) .window,:host(.animate-top-opened)>::slotted([slot=window]){opacity:1;-webkit-transform:rotateX(0) scale(1) translateY(0);transform:rotateX(0) scale(1) translateY(0)}:host(.animate-top-outro) .window,:host(.animate-top-outro)>::slotted([slot=window]){-webkit-transform:rotateX(-22deg) scale(0.5) translateY(-40%);transform:rotateX(-22deg) scale(0.5) translateY(-40%)}@media (max-width: 767px){.mobile\\:w-12{width:3rem}}";var MdsModal=function(){function t(t){var o=this;registerInstance(this,t);this.closeEvent=createEvent(this,"mdsModalClose",7);this.window=null;this.top=null;this.bottom=null;this.animationState="intro";this.km=new KeyboardManager;this.componentDidLoad=function(){o.km.addElement(o.host,"host");o.km.addElement(o.host.shadowRoot.querySelector(".close"),"close");o.km.attachEscapeBehavior((function(){return o.closeEvent.emit()}));o.km.attachClickBehavior("close")};this.animationName=function(t,i){if(t===void 0){t=null}if(i===void 0){i=null}return"animate-".concat(i!==null?i:o.position).concat(t!==null?"-"+t:"")};this.closeModal=function(t){if(t===void 0){t=null}var i;if(((i=t.target)===null||i===void 0?void 0:i.localName)!=="mds-modal"){return}o.opened=t.target!==t.currentTarget;if(!o.opened){o.closeEvent.emit()}};this.stateOpened=undefined;this.opened=undefined;this.position=null}t.prototype.componentWillLoad=function(){this.bottom=this.host.querySelector('[slot="bottom"]')!==null;this.top=this.host.querySelector('[slot="top"]')!==null;this.window=this.host.querySelector('[slot="window"]')!==null;this.stateOpened=this.opened;if(this.window&&this.position===null){this.position="center"}if(this.position===null){this.position="right"}if(this.window){var t=this.host.querySelector('[slot="window"]');t.setAttribute("role","modal")}};t.prototype.componentWillRender=function(){this.animationState=this.opened?"intro":"outro";this.host.classList.add(this.animationName())};t.prototype.componentDidRender=function(){var t=this;this.animationDeelay=window.setTimeout((function(){t.animationState=t.animationState==="intro"?"outro":"intro";t.host.classList.remove(t.animationName(t.animationState==="intro"?"outro":"intro"));t.host.classList.add(t.animationName(t.animationState));window.clearTimeout(t.animationDeelay)}),500)};t.prototype.disconnectedCallback=function(){this.km.detachEscapeBehavior();this.km.detachClickBehavior("close")};t.prototype.positionChange=function(t,o){window.clearTimeout(this.animationDeelay);this.host.classList.remove(this.animationName(null,o));this.host.classList.remove(this.animationName("intro",o));this.host.classList.remove(this.animationName("outro",o))};t.prototype.openedChange=function(t){this.stateOpened=t;window.clearTimeout(this.animationDeelay)};t.prototype.onModalCloseListener=function(){this.opened=false};t.prototype.onBannerCloseListener=function(){this.opened=false};t.prototype.render=function(){var t=this;return h(Host,{"aria-modal":clsx(this.opened?"true":"false"),class:clsx(this.stateOpened&&this.animationName("opened")),onClick:function(o){t.closeModal(o)}},this.window?h("slot",{name:"window"}):h("div",{class:clsx("window",(this.top||this.bottom)&&"window-".concat(this.top?"-top":"").concat(this.bottom?"-bottom":"")),role:"dialog"},this.top&&h("slot",{name:"top"}),h("slot",null),this.bottom&&h("slot",{name:"bottom"})),!this.window&&h("i",{innerHTML:miBaselineClose,tabindex:"0",onClick:function(o){t.closeModal(o)},class:"svg close focusable-light"}))};Object.defineProperty(t.prototype,"host",{get:function(){return getElement(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{position:["positionChange"],opened:["openedChange"]}},enumerable:false,configurable:true});return t}();MdsModal.style=mdsModalCss;export{MdsModal as mds_modal};
+import{r as registerInstance,c as createEvent,h,H as Host,g as getElement}from"./index-118e6bec.js";function r(t){var o,e,i="";if("string"==typeof t||"number"==typeof t)i+=t;else if("object"==typeof t)if(Array.isArray(t))for(o=0;o<t.length;o++)t[o]&&(e=r(t[o]))&&(i&&(i+=" "),i+=e);else for(o in t)t[o]&&(i&&(i+=" "),i+=o);return i}function clsx(){for(var t,o,e=0,i="";e<arguments.length;)(t=arguments[e++])&&(o=r(t))&&(i&&(i+=" "),i+=o);return i}var miBaselineClose='<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 6.41L17.59 5L12 10.59L6.41 5L5 6.41L10.59 12L5 17.59L6.41 19L12 13.41L17.59 19L19 17.59L13.41 12z"/></svg>';var KeyboardManager=function(){function t(){var t=this;this.elements=[];this.handleClickBehaviorDispatchEvent=function(t){if(t.code==="Space"||t.code==="Enter"||t.code==="NumpadEnter"){t.target.click()}};this.handleEscapeBehaviorDispatchEvent=function(o){if(o.code==="Escape"&&t.escapeCallback){t.escapeCallback()}};this.addElement=function(o,e){if(e===void 0){e="element"}t.elements[e]=o};this.attachClickBehavior=function(o){if(o===void 0){o="element"}if(t.elements[o]){t.elements[o].addEventListener("keydown",t.handleClickBehaviorDispatchEvent)}};this.detachClickBehavior=function(o){if(o===void 0){o="element"}if(t.elements[o]){t.elements[o].removeEventListener("keydown",t.handleClickBehaviorDispatchEvent)}};this.attachEscapeBehavior=function(o){t.escapeCallback=o;if(typeof window!==undefined){window.addEventListener("keydown",t.handleEscapeBehaviorDispatchEvent.bind(t))}};this.detachEscapeBehavior=function(){t.escapeCallback=function(){return};if(typeof window!==undefined){window.removeEventListener("keydown",t.handleEscapeBehaviorDispatchEvent.bind(t))}}}return t}();var mdsModalCss='@tailwind components; @tailwind utilities; .focus-off,.focusable,.focusable-light,.focusable-light-off{-webkit-transition-duration:200ms;transition-duration:200ms;-webkit-transition-timing-function:cubic-bezier(0, 0, 0.2, 1);transition-timing-function:cubic-bezier(0, 0, 0.2, 1);outline-offset:var(--magma-outline-blur-offset);outline:var(--magma-outline-blur);-webkit-transition-property:background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform;transition-property:background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform, -webkit-box-shadow, -webkit-transform}.focus-on,.focusable-light:focus-visible,.focusable:focus-visible{--magma-outline-blur-offset:var(--magma-outline-focus-offset);--magma-outline-blur:var(--magma-outline-focus)}.focus-light-on,.focusable-light:focus-visible{--magma-outline-blur:2px solid rgb(var(--tone-neutral))}.svg{display:-ms-flexbox;display:flex}.svg svg{aspect-ratio:1 / 1;height:100%;width:100%}.animate-right-intro,.animate-right-outro{-webkit-transform:translateX(calc(100% + 50px));transform:translateX(calc(100% + 50px))}.fixed{position:fixed}.absolute{position:absolute}.mx-6{margin-left:1.5rem;margin-right:1.5rem}.ml-auto{margin-left:auto}.flex{display:-ms-flexbox;display:flex}.w-16{width:4rem}.min-w-0{min-width:0px}.max-w-lg{max-width:32rem}.max-w-xl{max-width:36rem}.items-center{-ms-flex-align:center;align-items:center}.gap-4{gap:1rem}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rounded-full{border-radius:9999px}.border{border-width:1px}.border-b{border-bottom-width:1px}.border-t{border-top-width:1px}.border-tone-neutral-09{--tw-border-opacity:1;border-color:rgba(var(--tone-neutral-09), var(--tw-border-opacity))}.bg-transparent{background-color:transparent}.p-4{padding:1rem}.p-8{padding:2rem}.text-tone-neutral-02{--tw-text-opacity:1;color:rgba(var(--tone-neutral-02), var(--tw-text-opacity))}.text-tone-neutral-04{--tw-text-opacity:1;color:rgba(var(--tone-neutral-04), var(--tw-text-opacity))}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}:host{--mds-modal-overlay-color:var(--magma-overlay-color, 0 0 0);--mds-modal-overlay-opacity:var(--magma-overlay-opacity, 0.5);--mds-modal-window-background:rgb(var(--tone-neutral));--mds-modal-window-overflow:auto;--mds-modal-window-shadow:0 25px 50px -12px rgb(0 0 0 / 0.25);--mds-modal-z-index:var(--magma-modal-z-index);pointer-events:none;position:fixed;inset:0px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;-webkit-transition-duration:700ms;transition-duration:700ms;-webkit-transition-timing-function:cubic-bezier(1, 0, 0, 1);transition-timing-function:cubic-bezier(1, 0, 0, 1);background-color:rgba(var(--mds-modal-overlay-color) / 0);fill:rgb(var(--tone-neutral));-webkit-perspective:600px;perspective:600px;z-index:var(--mds-modal-z-index, 1000)}:host([position=top]){-ms-flex-align:start;align-items:flex-start;-ms-flex-pack:center;justify-content:center}:host([position=bottom]){-ms-flex-align:end;align-items:flex-end;-ms-flex-pack:center;justify-content:center}:host(.to-bottom-opened),:host(.to-center-opened),:host(.to-left-opened),:host(.to-right-opened),:host(.to-top-opened){pointer-events:auto;-webkit-transition-duration:500ms;transition-duration:500ms;background-color:rgba(var(--mds-modal-overlay-color) / var(--mds-modal-overlay-opacity))}.close{position:absolute;top:0px;height:2.25rem;width:2.25rem;-webkit-transform-origin:center;transform-origin:center;cursor:pointer;border-radius:9999px;font-size:2.25rem;line-height:2.5rem;opacity:0;-webkit-transition-duration:500ms;transition-duration:500ms;-webkit-transition-timing-function:cubic-bezier(0.77, 0, 0.175, 1);transition-timing-function:cubic-bezier(0.77, 0, 0.175, 1);fill:inherit;-webkit-transform:translate(0, 24px) rotate(90deg);transform:translate(0, 24px) rotate(90deg);-webkit-transition-property:opacity, outline, outline-offset, -webkit-transform;transition-property:opacity, outline, outline-offset, -webkit-transform;transition-property:opacity, outline, outline-offset, transform;transition-property:opacity, outline, outline-offset, transform, -webkit-transform}.window{display:grid;height:100%;gap:0px;background-color:var(--mds-modal-window-background);-webkit-box-shadow:var(--mds-modal-window-shadow);box-shadow:var(--mds-modal-window-shadow);grid-template-rows:1fr;max-width:calc(100vw - 80px);overflow:var(--mds-modal-window-overflow)}.window--top{grid-template-rows:auto 1fr}.window--bottom{grid-template-rows:1fr auto}.window--top-bottom{grid-template-rows:auto 1fr auto}:host(.to-bottom){-ms-flex-pack:center;justify-content:center;padding:2rem}@media (max-width: 767px){:host(.to-bottom){padding:1rem}}:host(.to-bottom) .window,:host(.to-bottom)>::slotted([slot="window"]){opacity:0;-webkit-transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:500ms;transition-duration:500ms;-webkit-transition-timing-function:cubic-bezier(1, 0, 0, 1);transition-timing-function:cubic-bezier(1, 0, 0, 1)}:host(.to-bottom-intro) .window,:host(.to-bottom-intro)>::slotted([slot="window"]){-webkit-transform:rotateX(-22deg) scale(0.5) translateY(40%);transform:rotateX(-22deg) scale(0.5) translateY(40%)}:host(.to-bottom-opened.to-bottom-outro) .window,:host(.to-bottom-opened.to-bottom-outro)>::slotted([slot="window"]),:host(.to-bottom-opened) .window,:host(.to-bottom-opened)>::slotted([slot="window"]){opacity:1;-webkit-transform:rotateX(0) scale(1) translateY(0);transform:rotateX(0) scale(1) translateY(0)}:host(.to-bottom-outro) .window,:host(.to-bottom-outro)>::slotted([slot="window"]){-webkit-transform:rotateX(-22deg) scale(0.5) translateY(-40%);transform:rotateX(-22deg) scale(0.5) translateY(-40%)}:host(.to-center){-ms-flex-pack:center;justify-content:center;padding:2rem}@media (max-width: 767px){:host(.to-center){padding:1rem}}:host(.to-center) .window,:host(.to-center)>::slotted([slot="window"]){opacity:0;-webkit-transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:500ms;transition-duration:500ms;-webkit-transition-timing-function:cubic-bezier(1, 0, 0, 1);transition-timing-function:cubic-bezier(1, 0, 0, 1)}:host(.to-center-intro) .window,:host(.to-center-intro)>::slotted([slot="window"]){-webkit-transform:rotateX(-22deg) scale(0.5) translateY(40%);transform:rotateX(-22deg) scale(0.5) translateY(40%)}:host(.to-center-opened.to-center-outro) .window,:host(.to-center-opened.to-center-outro)>::slotted([slot="window"]),:host(.to-center-opened) .window,:host(.to-center-opened)>::slotted([slot="window"]){opacity:1;-webkit-transform:rotateX(0) scale(1) translateY(0);transform:rotateX(0) scale(1) translateY(0)}:host(.to-center-outro) .window,:host(.to-center-outro)>::slotted([slot="window"]){-webkit-transform:rotateX(-22deg) scale(0.5) translateY(-40%);transform:rotateX(-22deg) scale(0.5) translateY(-40%)}:host(.to-left){-ms-flex-pack:start;justify-content:flex-start}:host(.to-left) .window,:host(.to-left)>::slotted([slot="window"]){opacity:0;-webkit-transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:500ms;transition-duration:500ms;-webkit-transition-timing-function:cubic-bezier(1, 0, 0, 1);transition-timing-function:cubic-bezier(1, 0, 0, 1)}:host(.to-left-intro) .window,:host(.to-left-intro)>::slotted([slot="window"]){-webkit-transform:translateX(calc(-100% - 50px));transform:translateX(calc(-100% - 50px))}:host(.to-left-opened.to-left-outro) .window,:host(.to-left-opened.to-left-outro)>::slotted([slot="window"]),:host(.to-left-opened) .window,:host(.to-left-opened)>::slotted([slot="window"]){opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}:host(.to-left-opened) .close,:host(.to-left-opened.to-left-outro) .close{opacity:1;-webkit-transform:translate(-24px, 24px) rotate(0);transform:translate(-24px, 24px) rotate(0)}:host(.to-left-outro) .window,:host(.to-left-outro)>::slotted([slot="window"]){-webkit-transform:translateX(calc(-100% - 50px));transform:translateX(calc(-100% - 50px))}:host(.to-left-outro) .close{-webkit-transform:translate(24px, 24px) rotate(-90deg);transform:translate(24px, 24px) rotate(-90deg)}:host(.to-left) .close{right:0px;-webkit-transform:translate(36px, 24px) rotate(90deg);transform:translate(36px, 24px) rotate(90deg)}:host(.to-right){-ms-flex-pack:end;justify-content:flex-end}:host(.to-right) .window,:host(.to-right)>::slotted([slot="window"]){opacity:0;-webkit-transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:500ms;transition-duration:500ms;-webkit-transition-timing-function:cubic-bezier(1, 0, 0, 1);transition-timing-function:cubic-bezier(1, 0, 0, 1)}:host(.to-right-intro) .window,:host(.to-right-intro)>::slotted([slot="window"]){-webkit-transform:translateX(calc(100% + 50px));transform:translateX(calc(100% + 50px))}:host(.to-right-opened.to-right-outro) .window,:host(.to-right-opened.to-right-outro)>::slotted([slot="window"]),:host(.to-right-opened) .window,:host(.to-right-opened)>::slotted([slot="window"]){opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}:host(.to-right-opened) .close,:host(.to-right-opened.to-right-outro) .close{opacity:1;-webkit-transform:translate(24px, 24px) rotate(0);transform:translate(24px, 24px) rotate(0)}:host(.to-right-outro) .window,:host(.to-right-outro)>::slotted([slot="window"]){-webkit-transform:translateX(calc(100% + 50px));transform:translateX(calc(100% + 50px))}:host(.to-right-outro) .close{-webkit-transform:translate(-24px, 24px) rotate(90deg);transform:translate(-24px, 24px) rotate(90deg)}:host(.to-right) .close{left:0px;-webkit-transform:translate(-36px, 24px) rotate(-90deg);transform:translate(-36px, 24px) rotate(-90deg)}:host(.to-top){-ms-flex-pack:center;justify-content:center;padding:2rem}@media (max-width: 767px){:host(.to-top){padding:1rem}}:host(.to-top) .window,:host(.to-top)>::slotted([slot="window"]){opacity:0;-webkit-transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:500ms;transition-duration:500ms;-webkit-transition-timing-function:cubic-bezier(1, 0, 0, 1);transition-timing-function:cubic-bezier(1, 0, 0, 1)}:host(.to-top-intro) .window,:host(.to-top-intro)>::slotted([slot="window"]){-webkit-transform:rotateX(-22deg) scale(0.5) translateY(40%);transform:rotateX(-22deg) scale(0.5) translateY(40%)}:host(.to-top-opened.to-top-outro) .window,:host(.to-top-opened.to-top-outro)>::slotted([slot="window"]),:host(.to-top-opened) .window,:host(.to-top-opened)>::slotted([slot="window"]){opacity:1;-webkit-transform:rotateX(0) scale(1) translateY(0);transform:rotateX(0) scale(1) translateY(0)}:host(.to-top-outro) .window,:host(.to-top-outro)>::slotted([slot="window"]){-webkit-transform:rotateX(-22deg) scale(0.5) translateY(-40%);transform:rotateX(-22deg) scale(0.5) translateY(-40%)}@media (max-width: 767px){.mobile\\:w-12{width:3rem}}';var MdsModal=function(){function t(t){var o=this;registerInstance(this,t);this.closeEvent=createEvent(this,"mdsModalClose",7);this.window=false;this.top=false;this.bottom=false;this.animationState="intro";this.km=new KeyboardManager;this.componentDidLoad=function(){var t;o.km.addElement(o.host,"host");var e=(t=o.host.shadowRoot)===null||t===void 0?void 0:t.querySelector(".close");if(e)o.km.addElement(e,"close");o.km.attachEscapeBehavior((function(){return o.closeEvent.emit()}));o.km.attachClickBehavior("close")};this.animationName=function(t,e){if(t===void 0){t=""}if(e===void 0){e=""}return"to-".concat(e!==""?e:o.position).concat(t!==""?"-"+t:"")};this.closeModal=function(t){var e;if(((e=t.target)===null||e===void 0?void 0:e.localName)!=="mds-modal"){return}o.opened=t.target!==t.currentTarget;if(!o.opened){o.closeEvent.emit()}};this.stateOpened=undefined;this.opened=false;this.position="center"}t.prototype.componentWillLoad=function(){var t;this.bottom=this.host.querySelector('[slot="bottom"]')!==null;this.top=this.host.querySelector('[slot="top"]')!==null;this.window=this.host.querySelector('[slot="window"]')!==null;this.stateOpened=this.opened;if(!this.window){this.position="right"}if(this.window){(t=this.host.querySelector('[slot="window"]'))===null||t===void 0?void 0:t.setAttribute("role","modal")}};t.prototype.componentWillRender=function(){this.animationState=this.opened?"intro":"outro";this.host.classList.add(this.animationName())};t.prototype.componentDidRender=function(){var t=this;this.animationDeelay=window.setTimeout((function(){t.animationState=t.animationState==="intro"?"outro":"intro";t.host.classList.remove(t.animationName(t.animationState==="intro"?"outro":"intro"));t.host.classList.add(t.animationName(t.animationState));window.clearTimeout(t.animationDeelay)}),500)};t.prototype.disconnectedCallback=function(){this.km.detachEscapeBehavior();this.km.detachClickBehavior("close")};t.prototype.positionChange=function(t,o){window.clearTimeout(this.animationDeelay);this.host.classList.remove(this.animationName("",o));this.host.classList.remove(this.animationName("intro",o));this.host.classList.remove(this.animationName("outro",o))};t.prototype.openedChange=function(t){this.stateOpened=t;window.clearTimeout(this.animationDeelay)};t.prototype.onModalCloseListener=function(){this.opened=false};t.prototype.onBannerCloseListener=function(){this.opened=false};t.prototype.render=function(){var t=this;return h(Host,{"aria-modal":clsx(this.opened?"true":"false"),class:clsx(this.stateOpened&&this.animationName("opened")),onClick:function(o){t.closeModal(o)}},this.window?h("slot",{name:"window"}):h("div",{class:clsx("window",(this.top||this.bottom)&&"window-".concat(this.top?"-top":"").concat(this.bottom?"-bottom":"")),role:"dialog",part:"window"},this.top&&h("slot",{name:"top"}),h("slot",null),this.bottom&&h("slot",{name:"bottom"})),!this.window&&h("i",{innerHTML:miBaselineClose,tabindex:"0",onClick:function(o){t.closeModal(o)},class:"svg close focusable-light"}))};Object.defineProperty(t.prototype,"host",{get:function(){return getElement(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{position:["positionChange"],opened:["openedChange"]}},enumerable:false,configurable:true});return t}();MdsModal.style=mdsModalCss;export{MdsModal as mds_modal};

package/dist/mds-modal/mds-modal.esm.js

@@ -1 +1 @@
-import{p as e,b as o}from"./p-4fdbb5fc.js";export{s as setNonce}from"./p-4fdbb5fc.js";(()=>{const o=import.meta.url,s={};return""!==o&&(s.resourcesUrl=new URL(".",o).href),e(s)})().then((e=>o([["p-536e9f30",[[1,"mds-modal",{opened:[1540],position:[1537],stateOpened:[32]},[[4,"mdsModalClose","onModalCloseListener"],[4,"mdsBannerClose","onBannerCloseListener"]]]]]],e)));
+import{p as e,b as o}from"./p-4fdbb5fc.js";export{s as setNonce}from"./p-4fdbb5fc.js";(()=>{const o=import.meta.url,s={};return""!==o&&(s.resourcesUrl=new URL(".",o).href),e(s)})().then((e=>o([["p-24b3f7bd",[[1,"mds-modal",{opened:[1540],position:[1537],stateOpened:[32]},[[4,"mdsModalClose","onModalCloseListener"],[4,"mdsBannerClose","onBannerCloseListener"]]]]]],e)));

package/dist/mds-modal/mds-modal.js

@@ -115,7 +115,7 @@ DOMTokenList
   var resourcesUrl = scriptElm ? scriptElm.getAttribute('data-resources-url') || scriptElm.src : '';
   var start = function() {
     // if src is not present then origin is "null", and new URL() throws TypeError: Failed to construct 'URL': Invalid base URL
-    var url = new URL('./p-f856db3e.system.js', new URL(resourcesUrl, window.location.origin !== 'null' ? window.location.origin : undefined));
+    var url = new URL('./p-e2fdb863.system.js', new URL(resourcesUrl, window.location.origin !== 'null' ? window.location.origin : undefined));
     System.import(url.href);
   };
 

package/dist/mds-modal/p-24b3f7bd.entry.js

@@ -0,0 +1 @@
+import{r as t,c as o,h as i,H as r,g as e}from"./p-4fdbb5fc.js";function n(t){var o,i,r="";if("string"==typeof t||"number"==typeof t)r+=t;else if("object"==typeof t)if(Array.isArray(t))for(o=0;o<t.length;o++)t[o]&&(i=n(t[o]))&&(r&&(r+=" "),r+=i);else for(o in t)t[o]&&(r&&(r+=" "),r+=o);return r}function a(){for(var t,o,i=0,r="";i<arguments.length;)(t=arguments[i++])&&(o=n(t))&&(r&&(r+=" "),r+=o);return r}class s{constructor(){this.elements=[],this.handleClickBehaviorDispatchEvent=t=>{"Space"!==t.code&&"Enter"!==t.code&&"NumpadEnter"!==t.code||t.target.click()},this.handleEscapeBehaviorDispatchEvent=t=>{"Escape"===t.code&&this.escapeCallback&&this.escapeCallback()},this.addElement=(t,o="element")=>{this.elements[o]=t},this.attachClickBehavior=(t="element")=>{this.elements[t]&&this.elements[t].addEventListener("keydown",this.handleClickBehaviorDispatchEvent)},this.detachClickBehavior=(t="element")=>{this.elements[t]&&this.elements[t].removeEventListener("keydown",this.handleClickBehaviorDispatchEvent)},this.attachEscapeBehavior=t=>{this.escapeCallback=t,void 0!==typeof window&&window.addEventListener("keydown",this.handleEscapeBehaviorDispatchEvent.bind(this))},this.detachEscapeBehavior=()=>{this.escapeCallback=()=>{},void 0!==typeof window&&window.removeEventListener("keydown",this.handleEscapeBehaviorDispatchEvent.bind(this))}}}const l=class{constructor(i){t(this,i),this.closeEvent=o(this,"mdsModalClose",7),this.window=!1,this.top=!1,this.bottom=!1,this.animationState="intro",this.km=new s,this.componentDidLoad=()=>{var t;this.km.addElement(this.host,"host");const o=null===(t=this.host.shadowRoot)||void 0===t?void 0:t.querySelector(".close");o&&this.km.addElement(o,"close"),this.km.attachEscapeBehavior((()=>this.closeEvent.emit())),this.km.attachClickBehavior("close")},this.animationName=(t="",o="")=>`to-${""!==o?o:this.position}${""!==t?"-"+t:""}`,this.closeModal=t=>{var o;"mds-modal"===(null===(o=t.target)||void 0===o?void 0:o.localName)&&(this.opened=t.target!==t.currentTarget,this.opened||this.closeEvent.emit())},this.stateOpened=void 0,this.opened=!1,this.position="center"}componentWillLoad(){var t;this.bottom=null!==this.host.querySelector('[slot="bottom"]'),this.top=null!==this.host.querySelector('[slot="top"]'),this.window=null!==this.host.querySelector('[slot="window"]'),this.stateOpened=this.opened,this.window||(this.position="right"),this.window&&(null===(t=this.host.querySelector('[slot="window"]'))||void 0===t||t.setAttribute("role","modal"))}componentWillRender(){this.animationState=this.opened?"intro":"outro",this.host.classList.add(this.animationName())}componentDidRender(){this.animationDeelay=window.setTimeout((()=>{this.animationState="intro"===this.animationState?"outro":"intro",this.host.classList.remove(this.animationName("intro"===this.animationState?"outro":"intro")),this.host.classList.add(this.animationName(this.animationState)),window.clearTimeout(this.animationDeelay)}),500)}disconnectedCallback(){this.km.detachEscapeBehavior(),this.km.detachClickBehavior("close")}positionChange(t,o){window.clearTimeout(this.animationDeelay),this.host.classList.remove(this.animationName("",o)),this.host.classList.remove(this.animationName("intro",o)),this.host.classList.remove(this.animationName("outro",o))}openedChange(t){this.stateOpened=t,window.clearTimeout(this.animationDeelay)}onModalCloseListener(){this.opened=!1}onBannerCloseListener(){this.opened=!1}render(){return i(r,{"aria-modal":a(this.opened?"true":"false"),class:a(this.stateOpened&&this.animationName("opened")),onClick:t=>{this.closeModal(t)}},this.window?i("slot",{name:"window"}):i("div",{class:a("window",(this.top||this.bottom)&&`window-${this.top?"-top":""}${this.bottom?"-bottom":""}`),role:"dialog",part:"window"},this.top&&i("slot",{name:"top"}),i("slot",null),this.bottom&&i("slot",{name:"bottom"})),!this.window&&i("i",{innerHTML:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 6.41L17.59 5L12 10.59L6.41 5L5 6.41L10.59 12L5 17.59L6.41 19L12 13.41L17.59 19L19 17.59L13.41 12z"/></svg>',tabindex:"0",onClick:t=>{this.closeModal(t)},class:"svg close focusable-light"}))}get host(){return e(this)}static get watchers(){return{position:["positionChange"],opened:["openedChange"]}}};l.style='@tailwind components; @tailwind utilities; .focus-off,.focusable,.focusable-light,.focusable-light-off{-webkit-transition-duration:200ms;transition-duration:200ms;-webkit-transition-timing-function:cubic-bezier(0, 0, 0.2, 1);transition-timing-function:cubic-bezier(0, 0, 0.2, 1);outline-offset:var(--magma-outline-blur-offset);outline:var(--magma-outline-blur);-webkit-transition-property:background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform;transition-property:background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform, -webkit-box-shadow, -webkit-transform}.focus-on,.focusable-light:focus-visible,.focusable:focus-visible{--magma-outline-blur-offset:var(--magma-outline-focus-offset);--magma-outline-blur:var(--magma-outline-focus)}.focus-light-on,.focusable-light:focus-visible{--magma-outline-blur:2px solid rgb(var(--tone-neutral))}.svg{display:-ms-flexbox;display:flex}.svg svg{aspect-ratio:1 / 1;height:100%;width:100%}.animate-right-intro,.animate-right-outro{-webkit-transform:translateX(calc(100% + 50px));transform:translateX(calc(100% + 50px))}.fixed{position:fixed}.absolute{position:absolute}.mx-6{margin-left:1.5rem;margin-right:1.5rem}.ml-auto{margin-left:auto}.flex{display:-ms-flexbox;display:flex}.w-16{width:4rem}.min-w-0{min-width:0px}.max-w-lg{max-width:32rem}.max-w-xl{max-width:36rem}.items-center{-ms-flex-align:center;align-items:center}.gap-4{gap:1rem}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rounded-full{border-radius:9999px}.border{border-width:1px}.border-b{border-bottom-width:1px}.border-t{border-top-width:1px}.border-tone-neutral-09{--tw-border-opacity:1;border-color:rgba(var(--tone-neutral-09), var(--tw-border-opacity))}.bg-transparent{background-color:transparent}.p-4{padding:1rem}.p-8{padding:2rem}.text-tone-neutral-02{--tw-text-opacity:1;color:rgba(var(--tone-neutral-02), var(--tw-text-opacity))}.text-tone-neutral-04{--tw-text-opacity:1;color:rgba(var(--tone-neutral-04), var(--tw-text-opacity))}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}:host{--mds-modal-overlay-color:var(--magma-overlay-color, 0 0 0);--mds-modal-overlay-opacity:var(--magma-overlay-opacity, 0.5);--mds-modal-window-background:rgb(var(--tone-neutral));--mds-modal-window-overflow:auto;--mds-modal-window-shadow:0 25px 50px -12px rgb(0 0 0 / 0.25);--mds-modal-z-index:var(--magma-modal-z-index);pointer-events:none;position:fixed;inset:0px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;-webkit-transition-duration:700ms;transition-duration:700ms;-webkit-transition-timing-function:cubic-bezier(1, 0, 0, 1);transition-timing-function:cubic-bezier(1, 0, 0, 1);background-color:rgba(var(--mds-modal-overlay-color) / 0);fill:rgb(var(--tone-neutral));-webkit-perspective:600px;perspective:600px;z-index:var(--mds-modal-z-index, 1000)}:host([position=top]){-ms-flex-align:start;align-items:flex-start;-ms-flex-pack:center;justify-content:center}:host([position=bottom]){-ms-flex-align:end;align-items:flex-end;-ms-flex-pack:center;justify-content:center}:host(.to-bottom-opened),:host(.to-center-opened),:host(.to-left-opened),:host(.to-right-opened),:host(.to-top-opened){pointer-events:auto;-webkit-transition-duration:500ms;transition-duration:500ms;background-color:rgba(var(--mds-modal-overlay-color) / var(--mds-modal-overlay-opacity))}.close{position:absolute;top:0px;height:2.25rem;width:2.25rem;-webkit-transform-origin:center;transform-origin:center;cursor:pointer;border-radius:9999px;font-size:2.25rem;line-height:2.5rem;opacity:0;-webkit-transition-duration:500ms;transition-duration:500ms;-webkit-transition-timing-function:cubic-bezier(0.77, 0, 0.175, 1);transition-timing-function:cubic-bezier(0.77, 0, 0.175, 1);fill:inherit;-webkit-transform:translate(0, 24px) rotate(90deg);transform:translate(0, 24px) rotate(90deg);-webkit-transition-property:opacity, outline, outline-offset, -webkit-transform;transition-property:opacity, outline, outline-offset, -webkit-transform;transition-property:opacity, outline, outline-offset, transform;transition-property:opacity, outline, outline-offset, transform, -webkit-transform}.window{display:grid;height:100%;gap:0px;background-color:var(--mds-modal-window-background);-webkit-box-shadow:var(--mds-modal-window-shadow);box-shadow:var(--mds-modal-window-shadow);grid-template-rows:1fr;max-width:calc(100vw - 80px);overflow:var(--mds-modal-window-overflow)}.window--top{grid-template-rows:auto 1fr}.window--bottom{grid-template-rows:1fr auto}.window--top-bottom{grid-template-rows:auto 1fr auto}:host(.to-bottom){-ms-flex-pack:center;justify-content:center;padding:2rem}@media (max-width: 767px){:host(.to-bottom){padding:1rem}}:host(.to-bottom) .window,:host(.to-bottom)>::slotted([slot="window"]){opacity:0;-webkit-transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:500ms;transition-duration:500ms;-webkit-transition-timing-function:cubic-bezier(1, 0, 0, 1);transition-timing-function:cubic-bezier(1, 0, 0, 1)}:host(.to-bottom-intro) .window,:host(.to-bottom-intro)>::slotted([slot="window"]){-webkit-transform:rotateX(-22deg) scale(0.5) translateY(40%);transform:rotateX(-22deg) scale(0.5) translateY(40%)}:host(.to-bottom-opened.to-bottom-outro) .window,:host(.to-bottom-opened.to-bottom-outro)>::slotted([slot="window"]),:host(.to-bottom-opened) .window,:host(.to-bottom-opened)>::slotted([slot="window"]){opacity:1;-webkit-transform:rotateX(0) scale(1) translateY(0);transform:rotateX(0) scale(1) translateY(0)}:host(.to-bottom-outro) .window,:host(.to-bottom-outro)>::slotted([slot="window"]){-webkit-transform:rotateX(-22deg) scale(0.5) translateY(-40%);transform:rotateX(-22deg) scale(0.5) translateY(-40%)}:host(.to-center){-ms-flex-pack:center;justify-content:center;padding:2rem}@media (max-width: 767px){:host(.to-center){padding:1rem}}:host(.to-center) .window,:host(.to-center)>::slotted([slot="window"]){opacity:0;-webkit-transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:500ms;transition-duration:500ms;-webkit-transition-timing-function:cubic-bezier(1, 0, 0, 1);transition-timing-function:cubic-bezier(1, 0, 0, 1)}:host(.to-center-intro) .window,:host(.to-center-intro)>::slotted([slot="window"]){-webkit-transform:rotateX(-22deg) scale(0.5) translateY(40%);transform:rotateX(-22deg) scale(0.5) translateY(40%)}:host(.to-center-opened.to-center-outro) .window,:host(.to-center-opened.to-center-outro)>::slotted([slot="window"]),:host(.to-center-opened) .window,:host(.to-center-opened)>::slotted([slot="window"]){opacity:1;-webkit-transform:rotateX(0) scale(1) translateY(0);transform:rotateX(0) scale(1) translateY(0)}:host(.to-center-outro) .window,:host(.to-center-outro)>::slotted([slot="window"]){-webkit-transform:rotateX(-22deg) scale(0.5) translateY(-40%);transform:rotateX(-22deg) scale(0.5) translateY(-40%)}:host(.to-left){-ms-flex-pack:start;justify-content:flex-start}:host(.to-left) .window,:host(.to-left)>::slotted([slot="window"]){opacity:0;-webkit-transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:500ms;transition-duration:500ms;-webkit-transition-timing-function:cubic-bezier(1, 0, 0, 1);transition-timing-function:cubic-bezier(1, 0, 0, 1)}:host(.to-left-intro) .window,:host(.to-left-intro)>::slotted([slot="window"]){-webkit-transform:translateX(calc(-100% - 50px));transform:translateX(calc(-100% - 50px))}:host(.to-left-opened.to-left-outro) .window,:host(.to-left-opened.to-left-outro)>::slotted([slot="window"]),:host(.to-left-opened) .window,:host(.to-left-opened)>::slotted([slot="window"]){opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}:host(.to-left-opened) .close,:host(.to-left-opened.to-left-outro) .close{opacity:1;-webkit-transform:translate(-24px, 24px) rotate(0);transform:translate(-24px, 24px) rotate(0)}:host(.to-left-outro) .window,:host(.to-left-outro)>::slotted([slot="window"]){-webkit-transform:translateX(calc(-100% - 50px));transform:translateX(calc(-100% - 50px))}:host(.to-left-outro) .close{-webkit-transform:translate(24px, 24px) rotate(-90deg);transform:translate(24px, 24px) rotate(-90deg)}:host(.to-left) .close{right:0px;-webkit-transform:translate(36px, 24px) rotate(90deg);transform:translate(36px, 24px) rotate(90deg)}:host(.to-right){-ms-flex-pack:end;justify-content:flex-end}:host(.to-right) .window,:host(.to-right)>::slotted([slot="window"]){opacity:0;-webkit-transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:500ms;transition-duration:500ms;-webkit-transition-timing-function:cubic-bezier(1, 0, 0, 1);transition-timing-function:cubic-bezier(1, 0, 0, 1)}:host(.to-right-intro) .window,:host(.to-right-intro)>::slotted([slot="window"]){-webkit-transform:translateX(calc(100% + 50px));transform:translateX(calc(100% + 50px))}:host(.to-right-opened.to-right-outro) .window,:host(.to-right-opened.to-right-outro)>::slotted([slot="window"]),:host(.to-right-opened) .window,:host(.to-right-opened)>::slotted([slot="window"]){opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}:host(.to-right-opened) .close,:host(.to-right-opened.to-right-outro) .close{opacity:1;-webkit-transform:translate(24px, 24px) rotate(0);transform:translate(24px, 24px) rotate(0)}:host(.to-right-outro) .window,:host(.to-right-outro)>::slotted([slot="window"]){-webkit-transform:translateX(calc(100% + 50px));transform:translateX(calc(100% + 50px))}:host(.to-right-outro) .close{-webkit-transform:translate(-24px, 24px) rotate(90deg);transform:translate(-24px, 24px) rotate(90deg)}:host(.to-right) .close{left:0px;-webkit-transform:translate(-36px, 24px) rotate(-90deg);transform:translate(-36px, 24px) rotate(-90deg)}:host(.to-top){-ms-flex-pack:center;justify-content:center;padding:2rem}@media (max-width: 767px){:host(.to-top){padding:1rem}}:host(.to-top) .window,:host(.to-top)>::slotted([slot="window"]){opacity:0;-webkit-transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:500ms;transition-duration:500ms;-webkit-transition-timing-function:cubic-bezier(1, 0, 0, 1);transition-timing-function:cubic-bezier(1, 0, 0, 1)}:host(.to-top-intro) .window,:host(.to-top-intro)>::slotted([slot="window"]){-webkit-transform:rotateX(-22deg) scale(0.5) translateY(40%);transform:rotateX(-22deg) scale(0.5) translateY(40%)}:host(.to-top-opened.to-top-outro) .window,:host(.to-top-opened.to-top-outro)>::slotted([slot="window"]),:host(.to-top-opened) .window,:host(.to-top-opened)>::slotted([slot="window"]){opacity:1;-webkit-transform:rotateX(0) scale(1) translateY(0);transform:rotateX(0) scale(1) translateY(0)}:host(.to-top-outro) .window,:host(.to-top-outro)>::slotted([slot="window"]){-webkit-transform:rotateX(-22deg) scale(0.5) translateY(-40%);transform:rotateX(-22deg) scale(0.5) translateY(-40%)}@media (max-width: 767px){.mobile\\:w-12{width:3rem}}';export{l as mds_modal}

package/dist/mds-modal/p-b2f313ba.system.entry.js

@@ -0,0 +1 @@
+System.register(["./p-3aeea0b7.system.js"],(function(t){"use strict";var o,i,e,r,n;return{setters:[function(t){o=t.r;i=t.c;e=t.h;r=t.H;n=t.g}],execute:function(){function a(t){var o,i,e="";if("string"==typeof t||"number"==typeof t)e+=t;else if("object"==typeof t)if(Array.isArray(t))for(o=0;o<t.length;o++)t[o]&&(i=a(t[o]))&&(e&&(e+=" "),e+=i);else for(o in t)t[o]&&(e&&(e+=" "),e+=o);return e}function s(){for(var t,o,i=0,e="";i<arguments.length;)(t=arguments[i++])&&(o=a(t))&&(e&&(e+=" "),e+=o);return e}var l='<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 6.41L17.59 5L12 10.59L6.41 5L5 6.41L10.59 12L5 17.59L6.41 19L12 13.41L17.59 19L19 17.59L13.41 12z"/></svg>';var d=function(){function t(){var t=this;this.elements=[];this.handleClickBehaviorDispatchEvent=function(t){if(t.code==="Space"||t.code==="Enter"||t.code==="NumpadEnter"){t.target.click()}};this.handleEscapeBehaviorDispatchEvent=function(o){if(o.code==="Escape"&&t.escapeCallback){t.escapeCallback()}};this.addElement=function(o,i){if(i===void 0){i="element"}t.elements[i]=o};this.attachClickBehavior=function(o){if(o===void 0){o="element"}if(t.elements[o]){t.elements[o].addEventListener("keydown",t.handleClickBehaviorDispatchEvent)}};this.detachClickBehavior=function(o){if(o===void 0){o="element"}if(t.elements[o]){t.elements[o].removeEventListener("keydown",t.handleClickBehaviorDispatchEvent)}};this.attachEscapeBehavior=function(o){t.escapeCallback=o;if(typeof window!==undefined){window.addEventListener("keydown",t.handleEscapeBehaviorDispatchEvent.bind(t))}};this.detachEscapeBehavior=function(){t.escapeCallback=function(){return};if(typeof window!==undefined){window.removeEventListener("keydown",t.handleEscapeBehaviorDispatchEvent.bind(t))}}}return t}();var c='@tailwind components; @tailwind utilities; .focus-off,.focusable,.focusable-light,.focusable-light-off{-webkit-transition-duration:200ms;transition-duration:200ms;-webkit-transition-timing-function:cubic-bezier(0, 0, 0.2, 1);transition-timing-function:cubic-bezier(0, 0, 0.2, 1);outline-offset:var(--magma-outline-blur-offset);outline:var(--magma-outline-blur);-webkit-transition-property:background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, outline, outline-offset, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform;transition-property:background-color, border-color, box-shadow, color, fill, outline, outline-offset, transform, -webkit-box-shadow, -webkit-transform}.focus-on,.focusable-light:focus-visible,.focusable:focus-visible{--magma-outline-blur-offset:var(--magma-outline-focus-offset);--magma-outline-blur:var(--magma-outline-focus)}.focus-light-on,.focusable-light:focus-visible{--magma-outline-blur:2px solid rgb(var(--tone-neutral))}.svg{display:-ms-flexbox;display:flex}.svg svg{aspect-ratio:1 / 1;height:100%;width:100%}.animate-right-intro,.animate-right-outro{-webkit-transform:translateX(calc(100% + 50px));transform:translateX(calc(100% + 50px))}.fixed{position:fixed}.absolute{position:absolute}.mx-6{margin-left:1.5rem;margin-right:1.5rem}.ml-auto{margin-left:auto}.flex{display:-ms-flexbox;display:flex}.w-16{width:4rem}.min-w-0{min-width:0px}.max-w-lg{max-width:32rem}.max-w-xl{max-width:36rem}.items-center{-ms-flex-align:center;align-items:center}.gap-4{gap:1rem}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rounded-full{border-radius:9999px}.border{border-width:1px}.border-b{border-bottom-width:1px}.border-t{border-top-width:1px}.border-tone-neutral-09{--tw-border-opacity:1;border-color:rgba(var(--tone-neutral-09), var(--tw-border-opacity))}.bg-transparent{background-color:transparent}.p-4{padding:1rem}.p-8{padding:2rem}.text-tone-neutral-02{--tw-text-opacity:1;color:rgba(var(--tone-neutral-02), var(--tw-text-opacity))}.text-tone-neutral-04{--tw-text-opacity:1;color:rgba(var(--tone-neutral-04), var(--tw-text-opacity))}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}:host{--mds-modal-overlay-color:var(--magma-overlay-color, 0 0 0);--mds-modal-overlay-opacity:var(--magma-overlay-opacity, 0.5);--mds-modal-window-background:rgb(var(--tone-neutral));--mds-modal-window-overflow:auto;--mds-modal-window-shadow:0 25px 50px -12px rgb(0 0 0 / 0.25);--mds-modal-z-index:var(--magma-modal-z-index);pointer-events:none;position:fixed;inset:0px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;-webkit-transition-duration:700ms;transition-duration:700ms;-webkit-transition-timing-function:cubic-bezier(1, 0, 0, 1);transition-timing-function:cubic-bezier(1, 0, 0, 1);background-color:rgba(var(--mds-modal-overlay-color) / 0);fill:rgb(var(--tone-neutral));-webkit-perspective:600px;perspective:600px;z-index:var(--mds-modal-z-index, 1000)}:host([position=top]){-ms-flex-align:start;align-items:flex-start;-ms-flex-pack:center;justify-content:center}:host([position=bottom]){-ms-flex-align:end;align-items:flex-end;-ms-flex-pack:center;justify-content:center}:host(.to-bottom-opened),:host(.to-center-opened),:host(.to-left-opened),:host(.to-right-opened),:host(.to-top-opened){pointer-events:auto;-webkit-transition-duration:500ms;transition-duration:500ms;background-color:rgba(var(--mds-modal-overlay-color) / var(--mds-modal-overlay-opacity))}.close{position:absolute;top:0px;height:2.25rem;width:2.25rem;-webkit-transform-origin:center;transform-origin:center;cursor:pointer;border-radius:9999px;font-size:2.25rem;line-height:2.5rem;opacity:0;-webkit-transition-duration:500ms;transition-duration:500ms;-webkit-transition-timing-function:cubic-bezier(0.77, 0, 0.175, 1);transition-timing-function:cubic-bezier(0.77, 0, 0.175, 1);fill:inherit;-webkit-transform:translate(0, 24px) rotate(90deg);transform:translate(0, 24px) rotate(90deg);-webkit-transition-property:opacity, outline, outline-offset, -webkit-transform;transition-property:opacity, outline, outline-offset, -webkit-transform;transition-property:opacity, outline, outline-offset, transform;transition-property:opacity, outline, outline-offset, transform, -webkit-transform}.window{display:grid;height:100%;gap:0px;background-color:var(--mds-modal-window-background);-webkit-box-shadow:var(--mds-modal-window-shadow);box-shadow:var(--mds-modal-window-shadow);grid-template-rows:1fr;max-width:calc(100vw - 80px);overflow:var(--mds-modal-window-overflow)}.window--top{grid-template-rows:auto 1fr}.window--bottom{grid-template-rows:1fr auto}.window--top-bottom{grid-template-rows:auto 1fr auto}:host(.to-bottom){-ms-flex-pack:center;justify-content:center;padding:2rem}@media (max-width: 767px){:host(.to-bottom){padding:1rem}}:host(.to-bottom) .window,:host(.to-bottom)>::slotted([slot="window"]){opacity:0;-webkit-transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:500ms;transition-duration:500ms;-webkit-transition-timing-function:cubic-bezier(1, 0, 0, 1);transition-timing-function:cubic-bezier(1, 0, 0, 1)}:host(.to-bottom-intro) .window,:host(.to-bottom-intro)>::slotted([slot="window"]){-webkit-transform:rotateX(-22deg) scale(0.5) translateY(40%);transform:rotateX(-22deg) scale(0.5) translateY(40%)}:host(.to-bottom-opened.to-bottom-outro) .window,:host(.to-bottom-opened.to-bottom-outro)>::slotted([slot="window"]),:host(.to-bottom-opened) .window,:host(.to-bottom-opened)>::slotted([slot="window"]){opacity:1;-webkit-transform:rotateX(0) scale(1) translateY(0);transform:rotateX(0) scale(1) translateY(0)}:host(.to-bottom-outro) .window,:host(.to-bottom-outro)>::slotted([slot="window"]){-webkit-transform:rotateX(-22deg) scale(0.5) translateY(-40%);transform:rotateX(-22deg) scale(0.5) translateY(-40%)}:host(.to-center){-ms-flex-pack:center;justify-content:center;padding:2rem}@media (max-width: 767px){:host(.to-center){padding:1rem}}:host(.to-center) .window,:host(.to-center)>::slotted([slot="window"]){opacity:0;-webkit-transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:500ms;transition-duration:500ms;-webkit-transition-timing-function:cubic-bezier(1, 0, 0, 1);transition-timing-function:cubic-bezier(1, 0, 0, 1)}:host(.to-center-intro) .window,:host(.to-center-intro)>::slotted([slot="window"]){-webkit-transform:rotateX(-22deg) scale(0.5) translateY(40%);transform:rotateX(-22deg) scale(0.5) translateY(40%)}:host(.to-center-opened.to-center-outro) .window,:host(.to-center-opened.to-center-outro)>::slotted([slot="window"]),:host(.to-center-opened) .window,:host(.to-center-opened)>::slotted([slot="window"]){opacity:1;-webkit-transform:rotateX(0) scale(1) translateY(0);transform:rotateX(0) scale(1) translateY(0)}:host(.to-center-outro) .window,:host(.to-center-outro)>::slotted([slot="window"]){-webkit-transform:rotateX(-22deg) scale(0.5) translateY(-40%);transform:rotateX(-22deg) scale(0.5) translateY(-40%)}:host(.to-left){-ms-flex-pack:start;justify-content:flex-start}:host(.to-left) .window,:host(.to-left)>::slotted([slot="window"]){opacity:0;-webkit-transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:500ms;transition-duration:500ms;-webkit-transition-timing-function:cubic-bezier(1, 0, 0, 1);transition-timing-function:cubic-bezier(1, 0, 0, 1)}:host(.to-left-intro) .window,:host(.to-left-intro)>::slotted([slot="window"]){-webkit-transform:translateX(calc(-100% - 50px));transform:translateX(calc(-100% - 50px))}:host(.to-left-opened.to-left-outro) .window,:host(.to-left-opened.to-left-outro)>::slotted([slot="window"]),:host(.to-left-opened) .window,:host(.to-left-opened)>::slotted([slot="window"]){opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}:host(.to-left-opened) .close,:host(.to-left-opened.to-left-outro) .close{opacity:1;-webkit-transform:translate(-24px, 24px) rotate(0);transform:translate(-24px, 24px) rotate(0)}:host(.to-left-outro) .window,:host(.to-left-outro)>::slotted([slot="window"]){-webkit-transform:translateX(calc(-100% - 50px));transform:translateX(calc(-100% - 50px))}:host(.to-left-outro) .close{-webkit-transform:translate(24px, 24px) rotate(-90deg);transform:translate(24px, 24px) rotate(-90deg)}:host(.to-left) .close{right:0px;-webkit-transform:translate(36px, 24px) rotate(90deg);transform:translate(36px, 24px) rotate(90deg)}:host(.to-right){-ms-flex-pack:end;justify-content:flex-end}:host(.to-right) .window,:host(.to-right)>::slotted([slot="window"]){opacity:0;-webkit-transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:500ms;transition-duration:500ms;-webkit-transition-timing-function:cubic-bezier(1, 0, 0, 1);transition-timing-function:cubic-bezier(1, 0, 0, 1)}:host(.to-right-intro) .window,:host(.to-right-intro)>::slotted([slot="window"]){-webkit-transform:translateX(calc(100% + 50px));transform:translateX(calc(100% + 50px))}:host(.to-right-opened.to-right-outro) .window,:host(.to-right-opened.to-right-outro)>::slotted([slot="window"]),:host(.to-right-opened) .window,:host(.to-right-opened)>::slotted([slot="window"]){opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}:host(.to-right-opened) .close,:host(.to-right-opened.to-right-outro) .close{opacity:1;-webkit-transform:translate(24px, 24px) rotate(0);transform:translate(24px, 24px) rotate(0)}:host(.to-right-outro) .window,:host(.to-right-outro)>::slotted([slot="window"]){-webkit-transform:translateX(calc(100% + 50px));transform:translateX(calc(100% + 50px))}:host(.to-right-outro) .close{-webkit-transform:translate(-24px, 24px) rotate(90deg);transform:translate(-24px, 24px) rotate(90deg)}:host(.to-right) .close{left:0px;-webkit-transform:translate(-36px, 24px) rotate(-90deg);transform:translate(-36px, 24px) rotate(-90deg)}:host(.to-top){-ms-flex-pack:center;justify-content:center;padding:2rem}@media (max-width: 767px){:host(.to-top){padding:1rem}}:host(.to-top) .window,:host(.to-top)>::slotted([slot="window"]){opacity:0;-webkit-transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:500ms;transition-duration:500ms;-webkit-transition-timing-function:cubic-bezier(1, 0, 0, 1);transition-timing-function:cubic-bezier(1, 0, 0, 1)}:host(.to-top-intro) .window,:host(.to-top-intro)>::slotted([slot="window"]){-webkit-transform:rotateX(-22deg) scale(0.5) translateY(40%);transform:rotateX(-22deg) scale(0.5) translateY(40%)}:host(.to-top-opened.to-top-outro) .window,:host(.to-top-opened.to-top-outro)>::slotted([slot="window"]),:host(.to-top-opened) .window,:host(.to-top-opened)>::slotted([slot="window"]){opacity:1;-webkit-transform:rotateX(0) scale(1) translateY(0);transform:rotateX(0) scale(1) translateY(0)}:host(.to-top-outro) .window,:host(.to-top-outro)>::slotted([slot="window"]){-webkit-transform:rotateX(-22deg) scale(0.5) translateY(-40%);transform:rotateX(-22deg) scale(0.5) translateY(-40%)}@media (max-width: 767px){.mobile\\:w-12{width:3rem}}';var w=t("mds_modal",function(){function t(t){var e=this;o(this,t);this.closeEvent=i(this,"mdsModalClose",7);this.window=false;this.top=false;this.bottom=false;this.animationState="intro";this.km=new d;this.componentDidLoad=function(){var t;e.km.addElement(e.host,"host");var o=(t=e.host.shadowRoot)===null||t===void 0?void 0:t.querySelector(".close");if(o)e.km.addElement(o,"close");e.km.attachEscapeBehavior((function(){return e.closeEvent.emit()}));e.km.attachClickBehavior("close")};this.animationName=function(t,o){if(t===void 0){t=""}if(o===void 0){o=""}return"to-".concat(o!==""?o:e.position).concat(t!==""?"-"+t:"")};this.closeModal=function(t){var o;if(((o=t.target)===null||o===void 0?void 0:o.localName)!=="mds-modal"){return}e.opened=t.target!==t.currentTarget;if(!e.opened){e.closeEvent.emit()}};this.stateOpened=undefined;this.opened=false;this.position="center"}t.prototype.componentWillLoad=function(){var t;this.bottom=this.host.querySelector('[slot="bottom"]')!==null;this.top=this.host.querySelector('[slot="top"]')!==null;this.window=this.host.querySelector('[slot="window"]')!==null;this.stateOpened=this.opened;if(!this.window){this.position="right"}if(this.window){(t=this.host.querySelector('[slot="window"]'))===null||t===void 0?void 0:t.setAttribute("role","modal")}};t.prototype.componentWillRender=function(){this.animationState=this.opened?"intro":"outro";this.host.classList.add(this.animationName())};t.prototype.componentDidRender=function(){var t=this;this.animationDeelay=window.setTimeout((function(){t.animationState=t.animationState==="intro"?"outro":"intro";t.host.classList.remove(t.animationName(t.animationState==="intro"?"outro":"intro"));t.host.classList.add(t.animationName(t.animationState));window.clearTimeout(t.animationDeelay)}),500)};t.prototype.disconnectedCallback=function(){this.km.detachEscapeBehavior();this.km.detachClickBehavior("close")};t.prototype.positionChange=function(t,o){window.clearTimeout(this.animationDeelay);this.host.classList.remove(this.animationName("",o));this.host.classList.remove(this.animationName("intro",o));this.host.classList.remove(this.animationName("outro",o))};t.prototype.openedChange=function(t){this.stateOpened=t;window.clearTimeout(this.animationDeelay)};t.prototype.onModalCloseListener=function(){this.opened=false};t.prototype.onBannerCloseListener=function(){this.opened=false};t.prototype.render=function(){var t=this;return e(r,{"aria-modal":s(this.opened?"true":"false"),class:s(this.stateOpened&&this.animationName("opened")),onClick:function(o){t.closeModal(o)}},this.window?e("slot",{name:"window"}):e("div",{class:s("window",(this.top||this.bottom)&&"window-".concat(this.top?"-top":"").concat(this.bottom?"-bottom":"")),role:"dialog",part:"window"},this.top&&e("slot",{name:"top"}),e("slot",null),this.bottom&&e("slot",{name:"bottom"})),!this.window&&e("i",{innerHTML:l,tabindex:"0",onClick:function(o){t.closeModal(o)},class:"svg close focusable-light"}))};Object.defineProperty(t.prototype,"host",{get:function(){return n(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{position:["positionChange"],opened:["openedChange"]}},enumerable:false,configurable:true});return t}());w.style=c}}}));

package/{www/build/p-f856db3e.system.js → dist/mds-modal/p-e2fdb863.system.js}

@@ -1 +1 @@
-System.register(["./p-3aeea0b7.system.js"],(function(e,n){"use strict";var s,t;return{setters:[function(n){s=n.p;t=n.b;e("setNonce",n.s)}],execute:function(){var e=function(){var e=n.meta.url;var t={};if(e!==""){t.resourcesUrl=new URL(".",e).href}return s(t)};e().then((function(e){return t([["p-1e2f03d3.system",[[1,"mds-modal",{opened:[1540],position:[1537],stateOpened:[32]},[[4,"mdsModalClose","onModalCloseListener"],[4,"mdsBannerClose","onBannerCloseListener"]]]]]],e)}))}}}));
+System.register(["./p-3aeea0b7.system.js"],(function(e,n){"use strict";var s,t;return{setters:[function(n){s=n.p;t=n.b;e("setNonce",n.s)}],execute:function(){var e=function(){var e=n.meta.url;var t={};if(e!==""){t.resourcesUrl=new URL(".",e).href}return s(t)};e().then((function(e){return t([["p-b2f313ba.system",[[1,"mds-modal",{opened:[1540],position:[1537],stateOpened:[32]},[[4,"mdsModalClose","onModalCloseListener"],[4,"mdsBannerClose","onBannerCloseListener"]]]]]],e)}))}}}));

package/dist/stats.json

@@ -1,22 +1,23 @@
 {
-  "timestamp": "2023-03-14T15:08:57",
+  "timestamp": "2023-09-08T09:20:20",
   "compiler": {
     "name": "node",
-    "version": "18.3.0"
+    "version": "18.12.1"
   },
   "app": {
     "namespace": "MdsModal",
     "fsNamespace": "mds-modal",
     "components": 1,
     "entries": 1,
-    "bundles": 67,
+    "bundles": 68,
     "outputs": [
       {
         "name": "dist-collection",
-        "files": 26,
+        "files": 27,
         "generatedFiles": [
           "./dist/collection/common/aria.js",
           "./dist/collection/common/keyboard-manager.js",
+          "./dist/collection/common/unit.js",
           "./dist/collection/components/mds-modal/mds-modal.js",
           "./dist/collection/components/mds-modal/meta/dictionary.js",
           "./dist/collection/components/mds-modal/meta/types.js",
@@ -77,21 +78,21 @@
           "./dist/mds-modal/index.esm.js",
           "./dist/mds-modal/mds-modal.esm.js",
           "./dist/mds-modal/mds-modal.js",
-          "./dist/mds-modal/p-1e2f03d3.system.entry.js",
+          "./dist/mds-modal/p-24b3f7bd.entry.js",
           "./dist/mds-modal/p-3aeea0b7.system.js",
           "./dist/mds-modal/p-4fdbb5fc.js",
           "./dist/mds-modal/p-50ea2036.system.js",
-          "./dist/mds-modal/p-536e9f30.entry.js",
-          "./dist/mds-modal/p-f856db3e.system.js",
+          "./dist/mds-modal/p-b2f313ba.system.entry.js",
+          "./dist/mds-modal/p-e2fdb863.system.js",
           "./www/build/index.esm.js",
           "./www/build/mds-modal.esm.js",
           "./www/build/mds-modal.js",
-          "./www/build/p-1e2f03d3.system.entry.js",
+          "./www/build/p-24b3f7bd.entry.js",
           "./www/build/p-3aeea0b7.system.js",
           "./www/build/p-4fdbb5fc.js",
           "./www/build/p-50ea2036.system.js",
-          "./www/build/p-536e9f30.entry.js",
-          "./www/build/p-f856db3e.system.js"
+          "./www/build/p-b2f313ba.system.entry.js",
+          "./www/build/p-e2fdb863.system.js"
         ]
       },
       {
@@ -124,12 +125,12 @@
         "components": [
           "mds-modal"
         ],
-        "bundleId": "p-536e9f30",
-        "fileName": "p-536e9f30.entry.js",
+        "bundleId": "p-24b3f7bd",
+        "fileName": "p-24b3f7bd.entry.js",
         "imports": [
           "p-4fdbb5fc.js"
         ],
-        "originalByteSize": 21979
+        "originalByteSize": 20787
       }
     ],
     "esm": [
@@ -143,7 +144,7 @@
         "imports": [
           "index-118e6bec.js"
         ],
-        "originalByteSize": 21983
+        "originalByteSize": 20791
       }
     ],
     "es5": [
@@ -157,7 +158,7 @@
         "imports": [
           "index-118e6bec.js"
         ],
-        "originalByteSize": 21983
+        "originalByteSize": 20791
       }
     ],
     "system": [
@@ -166,12 +167,12 @@
         "components": [
           "mds-modal"
         ],
-        "bundleId": "p-1e2f03d3.system",
-        "fileName": "p-1e2f03d3.system.entry.js",
+        "bundleId": "p-b2f313ba.system",
+        "fileName": "p-b2f313ba.system.entry.js",
         "imports": [
           "p-3aeea0b7.system.js"
         ],
-        "originalByteSize": 23066
+        "originalByteSize": 21862
       }
     ],
     "commonjs": [
@@ -185,7 +186,7 @@
         "imports": [
           "index-f216518d.js"
         ],
-        "originalByteSize": 22060
+        "originalByteSize": 20868
       }
     ]
   },
@@ -255,7 +256,8 @@
           "reflect": true,
           "mutable": true,
           "required": false,
-          "optional": true,
+          "optional": false,
+          "defaultValue": "false",
           "complexType": {
             "original": "boolean",
             "resolved": "boolean",
@@ -275,10 +277,10 @@
           "mutable": true,
           "required": false,
           "optional": true,
-          "defaultValue": "null",
+          "defaultValue": "'center'",
           "complexType": {
             "original": "ModalPositionType",
-            "resolved": "\"bottom\" | \"center\" | \"left\" | \"right\" | \"top\"",
+            "resolved": "\"bottom\" | \"center\" | \"left\" | \"right\" | \"top\" | undefined",
             "references": {
               "ModalPositionType": {
                 "location": "import",
@@ -320,7 +322,8 @@
               "reflect": true,
               "mutable": true,
               "required": false,
-              "optional": true,
+              "optional": false,
+              "defaultValue": "false",
               "complexType": {
                 "original": "boolean",
                 "resolved": "boolean",
@@ -340,10 +343,10 @@
               "mutable": true,
               "required": false,
               "optional": true,
-              "defaultValue": "null",
+              "defaultValue": "'center'",
               "complexType": {
                 "original": "ModalPositionType",
-                "resolved": "\"bottom\" | \"center\" | \"left\" | \"right\" | \"top\"",
+                "resolved": "\"bottom\" | \"center\" | \"left\" | \"right\" | \"top\" | undefined",
                 "references": {
                   "ModalPositionType": {
                     "location": "import",
@@ -520,6 +523,7 @@
             "onClick",
             "name",
             "role",
+            "part",
             "innerHTML",
             "tabindex"
           ],
@@ -528,7 +532,9 @@
             "div",
             "i"
           ],
-          "htmlParts": [],
+          "htmlParts": [
+            "window"
+          ],
           "isUpdateable": true,
           "potentialCmpRefs": [],
           "directDependencies": [],
@@ -548,6 +554,7 @@
   "sourceGraph": {
     "./src/common/aria.ts": [],
     "./src/common/keyboard-manager.ts": [],
+    "./src/common/unit.ts": [],
     "./src/components/mds-modal/mds-modal.tsx": [],
     "./src/components/mds-modal/meta/dictionary.ts": [],
     "./src/components/mds-modal/meta/types.ts": [],

package/dist/types/common/unit.d.ts

@@ -0,0 +1,2 @@
+declare const cssDurationToMilliseconds: (duration: string, defaultValue?: number) => number;
+export { cssDurationToMilliseconds, };

package/dist/types/components.d.ts

@@ -11,7 +11,7 @@ export namespace Components {
         /**
           * Specifies if the modal is opened or not
          */
-        "opened"?: boolean;
+        "opened": boolean;
         /**
           * Specifies the animation position of the modal window
          */

package/dist/types/dictionary/button.d.ts

@@ -1,5 +1,6 @@
 declare const buttonVariantDictionary: string[];
 declare const buttonToneVariantDictionary: string[];
+declare const buttonTargetDictionary: string[];
 declare const buttonSizeDictionary: string[];
 declare const buttonIconPositionDictionary: string[];
-export { buttonSizeDictionary, buttonToneVariantDictionary, buttonVariantDictionary, buttonIconPositionDictionary, };
+export { buttonIconPositionDictionary, buttonSizeDictionary, buttonTargetDictionary, buttonToneVariantDictionary, buttonVariantDictionary, };

package/dist/types/dictionary/variant.d.ts

@@ -4,6 +4,7 @@ declare const themeStatusVariantDictionary: string[];
 declare const themeFullVariantDictionary: string[];
 declare const themeLabelVariantDictionary: string[];
 declare const toneVariantDictionary: string[];
+declare const toneActionVariantDictionary: string[];
 declare const toneSimpleVariantDictionary: string[];
 declare const toneMinimalVariantDictionary: string[];
-export { themeFullVariantDictionary, themeLabelVariantDictionary, themeLuminanceVariantDictionary, themeStatusVariantDictionary, themeVariantDictionary, toneMinimalVariantDictionary, toneSimpleVariantDictionary, toneVariantDictionary, };
+export { themeFullVariantDictionary, themeLabelVariantDictionary, themeLuminanceVariantDictionary, themeStatusVariantDictionary, themeVariantDictionary, toneActionVariantDictionary, toneMinimalVariantDictionary, toneSimpleVariantDictionary, toneVariantDictionary, };

package/dist/types/interface/input-value.d.ts

@@ -1,4 +1,4 @@
-import { InputValueType } from '../types/input-value-type';
+import { InputValueType } from '@type/input-value-type';
 export interface InputValue {
   value: InputValueType;
 }

package/dist/types/type/button.d.ts

@@ -1,4 +1,5 @@
 export type ButtonType = 'a' | 'button' | 'reset' | 'submit';
+export type ButtonTargetType = 'self' | 'blank';
 export type ButtonSizeType = 'sm' | 'md' | 'lg' | 'xl';
 export type ButtonIconPositionType = 'left' | 'right';
 export type ButtonVariantType = 'primary' | 'dark' | 'light' | 'error' | 'info' | 'success' | 'warning';

package/dist/types/type/variant.d.ts

@@ -5,6 +5,7 @@ export type ThemeLuminanceVariantType = 'dark' | 'light';
 export type LabelVariantType = 'amaranth' | 'aqua' | 'blue' | 'green' | 'lime' | 'orange' | 'orchid' | 'sky' | 'violet' | 'yellow';
 export type ActionVariantType = 'primary' | 'dark' | 'light';
 export type StateVariantType = 'disabled' | 'focused' | 'readonly';
+export type ToneActionVariantType = 'primary' | 'secondary' | 'tertiary' | 'strong' | 'weak' | 'ghost' | 'quiet';
 export type ToneVariantType = 'strong' | 'weak' | 'ghost' | 'quiet';
 export type ToneSimpleVariantType = 'strong' | 'weak' | 'quiet';
 export type ToneMinimalVariantType = 'strong' | 'weak';

package/documentation.json

@@ -0,0 +1,149 @@
+{
+  "timestamp": "2023-09-08T09:16:06",
+  "compiler": {
+    "name": "@stencil/core",
+    "version": "2.22.3",
+    "typescriptVersion": "4.9.4"
+  },
+  "components": [
+    {
+      "filePath": "./src/components/mds-modal/mds-modal.tsx",
+      "encapsulation": "shadow",
+      "tag": "mds-modal",
+      "readme": "# mds-modal\n\n\n",
+      "docs": "",
+      "docsTags": [],
+      "usage": {},
+      "props": [
+        {
+          "name": "opened",
+          "type": "boolean",
+          "mutable": true,
+          "attr": "opened",
+          "reflectToAttr": true,
+          "docs": "Specifies if the modal is opened or not",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
+        {
+          "name": "position",
+          "type": "\"bottom\" | \"center\" | \"left\" | \"right\" | \"top\" | undefined",
+          "mutable": true,
+          "attr": "position",
+          "reflectToAttr": true,
+          "docs": "Specifies the animation position of the modal window",
+          "docsTags": [],
+          "default": "'center'",
+          "values": [
+            {
+              "value": "bottom",
+              "type": "string"
+            },
+            {
+              "value": "center",
+              "type": "string"
+            },
+            {
+              "value": "left",
+              "type": "string"
+            },
+            {
+              "value": "right",
+              "type": "string"
+            },
+            {
+              "value": "top",
+              "type": "string"
+            },
+            {
+              "type": "undefined"
+            }
+          ],
+          "optional": true,
+          "required": false
+        }
+      ],
+      "methods": [],
+      "events": [
+        {
+          "event": "mdsModalClose",
+          "detail": "void",
+          "bubbles": true,
+          "cancelable": true,
+          "composed": true,
+          "docs": "Emits when a modal is closed",
+          "docsTags": []
+        }
+      ],
+      "listeners": [
+        {
+          "event": "mdsModalClose",
+          "target": "document",
+          "capture": false,
+          "passive": false
+        },
+        {
+          "event": "mdsBannerClose",
+          "target": "document",
+          "capture": false,
+          "passive": false
+        }
+      ],
+      "styles": [
+        {
+          "name": "--mds-modal-overlay-color",
+          "annotation": "prop",
+          "docs": "Set the overlay color of the background when the component is opened, this property can be inherited from `globals.css` in `styles^8.0.0`."
+        },
+        {
+          "name": "--mds-modal-overlay-opacity",
+          "annotation": "prop",
+          "docs": "Set the overlay color opacity of the background when the component is opened, this property can be inherited from `globals.css` in `styles^8.0.0`."
+        },
+        {
+          "name": "--mds-modal-window-background",
+          "annotation": "prop",
+          "docs": "Set the background color of the window"
+        },
+        {
+          "name": "--mds-modal-window-overflow",
+          "annotation": "prop",
+          "docs": "Set the overflow of the window"
+        },
+        {
+          "name": "--mds-modal-window-shadow",
+          "annotation": "prop",
+          "docs": "Set the box shadow of the window"
+        },
+        {
+          "name": "--mds-modal-z-index",
+          "annotation": "prop",
+          "docs": "Set the z-index of the window when the component is opened"
+        }
+      ],
+      "slots": [],
+      "parts": [
+        {
+          "name": "window",
+          "docs": ""
+        }
+      ],
+      "dependents": [
+        "mds-header"
+      ],
+      "dependencies": [],
+      "dependencyGraph": {
+        "mds-header": [
+          "mds-modal"
+        ]
+      }
+    }
+  ]
+}