@mgdis/mg-components 6.21.0 → 6.22.0

package/dist/components/mg-message2.js

@@ -1 +1 @@
-import{transformTag as e,proxyCustomElement as a,HTMLElement as s,h as c}from"@stencil/core/internal/client";import{C as g,t as r}from"./index2.js";import{d as m}from"./mg-card2.js";import{d as o}from"./mg-icon2.js";const t=["info","warning","success","danger"],n=["bar-left","background"],i=a(class extends s{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.classBase="mg-c-message",this.variant="info",this.variantStyle="bar-left",this.classCollection=new g(["mg-c-message"]),this.hasActions=!1,this.getIcon=()=>{switch(this.variant){case"info":return"info-circle";case"warning":return"exclamation-triangle";case"success":return"check-circle";case"danger":return"exclamation-circle"}}}watchVariant(e,a){if(!t.includes(e))throw new Error(`<mg-message> prop "variant" must be one of: ${t.join(", ")}. Passed value: ${r(e)}.`);void 0!==e&&this.classCollection.add(`${this.classBase}--${e}`),void 0!==a&&this.classCollection.delete(`${this.classBase}--${a}`)}watchVariantStyle(e,a){if(!n.includes(e))throw new Error(`<mg-message> prop "variantStyle" must be one of: ${n.join(", ")}. Passed value: ${r(e)}.`);void 0!==e&&this.classCollection.add(`${this.classBase}--${e}`),void 0!==a&&this.classCollection.delete(`${this.classBase}--${a}`)}componentWillLoad(){this.watchVariant(this.variant),this.watchVariantStyle(this.variantStyle),this.hasActions=null!==this.element.querySelector('[slot="actions"]')}render(){return c("div",{key:"9619c3fe51c76045c7c2ac7be24d71f317749f3d",class:this.classCollection.join()},c("mg-card",{key:"270c8b9b0479a1762fb0b180b99bab8fcf92be40",shadow:!0},"bar-left"===this.variantStyle&&c("span",{key:"8d568740eb1a579cc8e3b447aa1df27691fd3473",class:"mg-c-message__bar"}),c("span",{key:"96bbd399ce78b312755f238d68f46c4c633b898a",class:"mg-c-message__icon"},c("mg-icon",{key:"ebaa2fd3d7d60ae8f9864afdb6fd0fa79e7b1d40",icon:this.getIcon()})),c("div",{key:"8ff7552abb158fa9787f8501b2068254455b8cbb",class:"mg-c-message__content"},c("span",{key:"1af60ee247054d5ce5ae1d8bf0a33503cdebf857",class:"mg-c-message__content-slot"},c("slot",{key:"d35b2cca2ac8231e257972bb1251f318c10e6e2f"})),this.hasActions&&[c("span",{class:"mg-c-message__content-separator",key:"content-separator"}),c("span",{class:"mg-c-message__content-actions-slot",key:"content-actions-slot"},c("slot",{key:"90a115e7e49ea5058da58d096184151f7aa7b7d8",name:"actions"}))])))}get element(){return this}static get watchers(){return{variant:[{watchVariant:0}],variantStyle:[{watchVariantStyle:0}]}}static get style(){return":host{--mg-c-card-spacing:0;--mg-c-card-border-radius:var(--mg-c-message-border-radius);--mg-c-card-border:none;--mg-c-card-overflow:hidden}.mg-c-message{display:inline-block;min-height:var(--mg-b-size-min-height)}.mg-c-message.mg-c-message--danger .mg-c-message__icon{color:var(--mg-b-color-danger)}.mg-c-message.mg-c-message--danger.mg-c-message--bar-left .mg-c-message__bar{background-color:var(--mg-b-color-danger)}.mg-c-message.mg-c-message--danger.mg-c-message--background{--mg-c-card-color-background:var(--mg-b-color-red-20, color-mix(in srgb, var(--mg-b-color-danger), white 80%))}.mg-c-message.mg-c-message--info .mg-c-message__icon{color:var(--mg-b-color-info)}.mg-c-message.mg-c-message--info.mg-c-message--bar-left .mg-c-message__bar{background-color:var(--mg-b-color-info)}.mg-c-message.mg-c-message--info.mg-c-message--background{--mg-c-card-color-background:var(--mg-b-color-blue-20, color-mix(in srgb, var(--mg-b-color-info), white 80%))}.mg-c-message.mg-c-message--success .mg-c-message__icon{color:var(--mg-b-color-success)}.mg-c-message.mg-c-message--success.mg-c-message--bar-left .mg-c-message__bar{background-color:var(--mg-b-color-success)}.mg-c-message.mg-c-message--success.mg-c-message--background{--mg-c-card-color-background:var(--mg-b-color-green-20, color-mix(in srgb, var(--mg-b-color-success), white 80%))}.mg-c-message.mg-c-message--warning .mg-c-message__icon{color:var(--mg-b-color-warning)}.mg-c-message.mg-c-message--warning.mg-c-message--bar-left .mg-c-message__bar{background-color:var(--mg-b-color-warning)}.mg-c-message.mg-c-message--warning.mg-c-message--background{--mg-c-card-color-background:var(--mg-b-color-yellow-20, color-mix(in srgb, var(--mg-b-color-warning), white 80%))}.mg-c-message ::slotted(*){padding:0;margin:0}.mg-c-message__icon{position:absolute;top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2);left:calc(var(--mg-b-size-4) + var(--mg-b-size-8));line-height:1}.mg-c-message__content{display:flex;flex-wrap:wrap;padding:0 var(--mg-b-size-8) 0 calc(var(--mg-b-size-4) + var(--mg-b-size-8) + var(--mg-b-size-16) + var(--mg-b-size-8));place-content:stretch flex-end}.mg-c-message__content-slot{flex-grow:1;margin:var(--mg-b-size-8) 0}.mg-c-message__content-separator{display:inline-block;width:var(--mg-b-size-40);height:0}.mg-c-message__content-actions-slot{padding:var(--mg-b-size-8) 0;text-align:right}.mg-c-message__bar{position:absolute;top:0;left:0;width:var(--mg-b-size-4);height:100%}.mg-c-message ::slotted(*:not(mg-panel,mg-message,mg-modal)){--mg-c-card-border:var(--mg-c-card-border-default);--mg-c-card-spacing:var(--mg-c-card-spacing-default);--mg-c-card-border-radius:var(--mg-c-card-border-radius-default);--mg-c-card-color-background:var(--mg-c-card-color-background-default);--mg-c-card-box-shadow:var(--mg-c-card-box-shadow-default);--mg-c-card-max-width:unset;--mg-c-card-min-width:unset;--mg-c-card-max-height:unset;--mg-c-card-overflow:var(--mg-c-card-overflow-default)}.mg-c-message,.mg-c-message mg-message{max-width:100%}"}},[257,"mg-message",{variant:[1],variantStyle:[1,"variant-style"],classCollection:[32],hasActions:[32]},void 0,{variant:[{watchVariant:0}],variantStyle:[{watchVariantStyle:0}]}]);function d(){"undefined"!=typeof customElements&&["mg-message","mg-card","mg-icon"].forEach((a=>{switch(a){case"mg-message":customElements.get(e(a))||customElements.define(e(a),i);break;case"mg-card":customElements.get(e(a))||m();break;case"mg-icon":customElements.get(e(a))||o()}}))}d();export{i as M,d}
+import{transformTag as e,proxyCustomElement as a,HTMLElement as s,h as c}from"@stencil/core/internal/client";import{C as g,t as r}from"./index2.js";import{d as m}from"./mg-card2.js";import{d as o}from"./mg-icon2.js";const t=["info","warning","success","danger"],n=["bar-left","background"],i=a(class extends s{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.classBase="mg-c-message",this.variant="info",this.variantStyle="bar-left",this.classCollection=new g(["mg-c-message"]),this.hasActions=!1,this.getIcon=()=>{switch(this.variant){case"info":return"info-circle";case"warning":return"exclamation-triangle";case"success":return"check-circle";case"danger":return"exclamation-circle"}}}watchVariant(e,a){if(!t.includes(e))throw new Error(`<mg-message> prop "variant" must be one of: ${t.join(", ")}. Passed value: ${r(e)}.`);void 0!==e&&this.classCollection.add(`${this.classBase}--${e}`),void 0!==a&&this.classCollection.delete(`${this.classBase}--${a}`)}watchVariantStyle(e,a){if(!n.includes(e))throw new Error(`<mg-message> prop "variantStyle" must be one of: ${n.join(", ")}. Passed value: ${r(e)}.`);void 0!==e&&this.classCollection.add(`${this.classBase}--${e}`),void 0!==a&&this.classCollection.delete(`${this.classBase}--${a}`)}componentWillLoad(){this.watchVariant(this.variant),this.watchVariantStyle(this.variantStyle),this.hasActions=null!==this.element.querySelector('[slot="actions"]')}render(){return c("div",{key:"516691c613b30edf92d43fb9596169459dd8058a",class:this.classCollection.join()},c("mg-card",{key:"2be929dd6ed5458927b155d2f4c94fa15f9717e9",shadow:!0},"bar-left"===this.variantStyle&&c("span",{key:"604d5a7bd37abc571b40f8be09ac5dadbde69ec1",class:"mg-c-message__bar"}),c("span",{key:"837cce7c506997955de6efb4cffc53e5107fb602",class:"mg-c-message__icon"},c("mg-icon",{key:"3fd70f747cad5605f129bec491aa1bfd5ea42a95",icon:this.getIcon()})),c("div",{key:"bf0b166fee2c94014fc35980b06a45dfc91b8596",class:"mg-c-message__content"},c("span",{key:"305f79545b87055a954831c7355e7685340d1aa6",class:"mg-c-message__content-slot"},c("slot",{key:"d25113f6305d8ceaa39d12672fecc4e4bf6ffb49"})),this.hasActions&&[c("span",{class:"mg-c-message__content-separator",key:"content-separator"}),c("span",{class:"mg-c-message__content-actions-slot",key:"content-actions-slot"},c("slot",{key:"744098ecfdcc8bb5f5e0b913884126498c21d3f0",name:"actions"}))])))}get element(){return this}static get watchers(){return{variant:[{watchVariant:0}],variantStyle:[{watchVariantStyle:0}]}}static get style(){return":host{--mg-c-card-spacing:0;--mg-c-card-border-radius:var(--mg-c-message-border-radius);--mg-c-card-border:none;--mg-c-card-overflow:hidden}.mg-c-message{display:inline-block;min-height:var(--mg-b-size-min-height)}.mg-c-message.mg-c-message--danger .mg-c-message__icon{color:var(--mg-b-color-danger)}.mg-c-message.mg-c-message--danger.mg-c-message--bar-left .mg-c-message__bar{background-color:var(--mg-b-color-danger)}.mg-c-message.mg-c-message--danger.mg-c-message--background{--mg-c-card-color-background:var(--mg-b-color-red-20, color-mix(in srgb, var(--mg-b-color-danger), white 80%))}.mg-c-message.mg-c-message--info .mg-c-message__icon{color:var(--mg-b-color-info)}.mg-c-message.mg-c-message--info.mg-c-message--bar-left .mg-c-message__bar{background-color:var(--mg-b-color-info)}.mg-c-message.mg-c-message--info.mg-c-message--background{--mg-c-card-color-background:var(--mg-b-color-blue-20, color-mix(in srgb, var(--mg-b-color-info), white 80%))}.mg-c-message.mg-c-message--success .mg-c-message__icon{color:var(--mg-b-color-success)}.mg-c-message.mg-c-message--success.mg-c-message--bar-left .mg-c-message__bar{background-color:var(--mg-b-color-success)}.mg-c-message.mg-c-message--success.mg-c-message--background{--mg-c-card-color-background:var(--mg-b-color-green-20, color-mix(in srgb, var(--mg-b-color-success), white 80%))}.mg-c-message.mg-c-message--warning .mg-c-message__icon{color:var(--mg-b-color-warning)}.mg-c-message.mg-c-message--warning.mg-c-message--bar-left .mg-c-message__bar{background-color:var(--mg-b-color-warning)}.mg-c-message.mg-c-message--warning.mg-c-message--background{--mg-c-card-color-background:var(--mg-b-color-yellow-20, color-mix(in srgb, var(--mg-b-color-warning), white 80%))}.mg-c-message ::slotted(*){padding:0;margin:0}.mg-c-message__icon{position:absolute;top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2);left:calc(var(--mg-b-size-4) + var(--mg-b-size-8));line-height:1}.mg-c-message__content{display:flex;flex-wrap:wrap;padding:0 var(--mg-b-size-8) 0 calc(var(--mg-b-size-4) + var(--mg-b-size-8) + var(--mg-b-size-16) + var(--mg-b-size-8));place-content:stretch flex-end}.mg-c-message__content-slot{flex-grow:1;margin:var(--mg-b-size-8) 0}.mg-c-message__content-separator{display:inline-block;width:var(--mg-b-size-40);height:0}.mg-c-message__content-actions-slot{padding:var(--mg-b-size-8) 0;text-align:right}.mg-c-message__bar{position:absolute;top:0;left:0;width:var(--mg-b-size-4);height:100%}.mg-c-message ::slotted(*:not(mg-panel,mg-message,mg-modal)){--mg-c-card-border:var(--mg-c-card-border-default);--mg-c-card-spacing:var(--mg-c-card-spacing-default);--mg-c-card-border-radius:var(--mg-c-card-border-radius-default);--mg-c-card-color-background:var(--mg-c-card-color-background-default);--mg-c-card-box-shadow:var(--mg-c-card-box-shadow-default);--mg-c-card-max-width:unset;--mg-c-card-min-width:unset;--mg-c-card-max-height:unset;--mg-c-card-overflow:var(--mg-c-card-overflow-default)}.mg-c-message,.mg-c-message mg-message{max-width:100%}"}},[257,"mg-message",{variant:[1],variantStyle:[1,"variant-style"],classCollection:[32],hasActions:[32]},void 0,{variant:[{watchVariant:0}],variantStyle:[{watchVariantStyle:0}]}]);function d(){"undefined"!=typeof customElements&&["mg-message","mg-card","mg-icon"].forEach((a=>{switch(a){case"mg-message":customElements.get(e(a))||customElements.define(e(a),i);break;case"mg-card":customElements.get(e(a))||m();break;case"mg-icon":customElements.get(e(a))||o()}}))}d();export{i as M,d}

package/dist/components/mg-modal.js

@@ -1 +1 @@
-import{transformTag as a,proxyCustomElement as e,HTMLElement as t,createEvent as i,h as o}from"@stencil/core/internal/client";import{c,C as d,a as s,t as l,i as r}from"./index2.js";import{i as m}from"./index3.js";import{d as n}from"./mg-button2.js";import{d as g}from"./mg-card2.js";import{d as h}from"./mg-icon2.js";const b=["dialog","alertdialog"],f=e(class extends t{constructor(a){super(),!1!==a&&this.__registerHost(),this.__attachShadow(),this.componentShow=i(this,"component-show",7),this.componentHide=i(this,"component-hide",7),this.componentClose=i(this,"component-close",7),this.titleId="",this.identifier=c("mg-modal"),this.dialogRole="dialog",this.closeButton=!1,this.open=!1,this.hasActions=!1,this.classCollection=new d(["mg-c-modal"]),this.handleClose=()=>{this.open=!1,this.componentClose.emit()}}watchIdentifier(a){if(!s(a))throw Error(`<mg-modal> prop "identifier" value is invalid. Passed value: ${l(a)}.`)}validateDialogRole(a){if(!b.includes(a))throw Error(`<mg-modal> prop "dialogRole" must be one of: ${b.join(", ")}. Passed value: ${l(a)}.`)}validateModalTitle(a){if(!r(a))throw Error(`<mg-modal> prop "modalTitle" is required. Passed value: ${l(a)}.`)}watchOpen(a){a?(this.dialog.showModal(),this.componentShow.emit(),document.body.style.overflow="hidden"):(this.dialog.close(),this.componentHide.emit(),document.body.style.overflow=this.bodyOverflow)}componentWillLoad(){this.bodyOverflow=document.body.style.overflow,this.messages=m(this.element).messages,this.hasActions=null!==this.element.querySelector('[slot="actions"]'),this.titleId=this.identifier+"-title",this.watchIdentifier(this.identifier),this.validateModalTitle(this.modalTitle),this.validateDialogRole(this.dialogRole)}componentDidLoad(){this.watchOpen(this.open),this.dialog.addEventListener("close",(()=>{this.open=!1,this.componentClose.emit()}))}render(){return o("dialog",{key:"e104352d5cdb04886d4db6bac62ecb772c6df004",role:this.dialogRole,id:this.identifier,class:this.classCollection.join(),"aria-labelledby":this.titleId,ref:a=>{null!==a&&(this.dialog=a)}},o("mg-card",{key:"d69679cb9118dfe4b141c1dcf6d1ef0fd53d9df9",shadow:!0},o("div",{key:"29e0a092a73d4e05c300c0840191823d3e3bbd30",class:"mg-c-modal__dialog"},o("header",{key:"c3a595adc778b67e5cafbbb964741ebc56c2dba5",class:"mg-c-modal__header"},this.closeButton&&o("span",{key:"f19447c5c29ae4fdaa46c2e35629622091b172d6",class:"mg-c-modal__close-button"},o("mg-button",{key:"af85956cc5e16e2c8c05156a4f54f63ad35b913a","is-icon":!0,variant:"flat",label:this.messages.modal.closeButton,onClick:this.handleClose},o("mg-icon",{key:"fd6aa0394f8b39bacd50e7b087f1b155c38e1bc9",icon:"cross"}))),o("h1",{key:"0e80bdf6182c01257f487741661754a1224b802d",class:"mg-c-modal__title",id:this.titleId},this.modalTitle)),o("article",{key:"c23c02cc9046545b4b851ce640ed8409fa190511",class:"mg-c-modal__content"},o("slot",{key:"db7c708e38ff3e7de6e4a7d299cd7a3c1e9d1e00"})),this.hasActions&&o("footer",{key:"4ba012a916db38e219287a5ea9ca7b4644dd96d9",class:"mg-c-modal__footer"},o("slot",{key:"c541075b02466d95defae7831c3fc7e4b786d7fc",name:"actions"})))))}get element(){return this}static get watchers(){return{identifier:[{watchIdentifier:0}],dialogRole:[{validateDialogRole:0}],modalTitle:[{validateModalTitle:0}],open:[{watchOpen:0}]}}static get style(){return":host{--mg-c-card-border-radius:var(--mg-c-modal-border-radius);--mg-c-card-spacing:var(--mg-b-size-16) var(--mg-b-size-24);--mg-c-card-border:none}.mg-c-modal{border:none;background:none;color:inherit}.mg-c-modal[open]{display:flex;padding:var(--mg-b-size-24) var(--mg-b-size-8)}.mg-c-modal::backdrop{background-color:var(--mg-b-color-dark);opacity:.65}.mg-c-modal mg-card{display:flex;width:calc(75*var(--mg-b-size-8));max-width:100%;max-height:100%}.mg-c-modal__dialog{position:relative;display:flex;height:fit-content;max-height:100%;flex-direction:column;align-self:center;row-gap:var(--mg-b-size-24)}.mg-c-modal__title{margin:0;font-family:var(--mg-b-font-family-heading);font-size:var(--mg-c-modal-title-font-size);font-weight:600}.mg-c-modal__close-button{height:var(--mg-c-modal-title-font-size);margin-top:calc((var(--mg-b-size-min-height) - var(--mg-c-modal-title-font-size)*var(--mg-b-line-height))/2*-1);margin-right:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2*-1);margin-left:var(--mg-b-size-16);float:right}.mg-c-modal__content{padding:var(--mg-b-size-16);margin:calc(var(--mg-b-size-16)*-1);overflow-y:auto}.mg-c-modal ::slotted(*:not(mg-panel,mg-message,mg-modal)){--mg-c-card-border:var(--mg-c-card-border-default);--mg-c-card-spacing:var(--mg-c-card-spacing-default);--mg-c-card-border-radius:var(--mg-c-card-border-radius-default);--mg-c-card-color-background:var(--mg-c-card-color-background-default);--mg-c-card-box-shadow:var(--mg-c-card-box-shadow-default);--mg-c-card-max-width:unset;--mg-c-card-min-width:unset;--mg-c-card-max-height:unset;--mg-c-card-overflow:var(--mg-c-card-overflow-default)}"}},[257,"mg-modal",{identifier:[1],dialogRole:[1,"dialog-role"],modalTitle:[1,"modal-title"],closeButton:[4,"close-button"],open:[1028],hasActions:[32],classCollection:[32]},void 0,{identifier:[{watchIdentifier:0}],dialogRole:[{validateDialogRole:0}],modalTitle:[{validateModalTitle:0}],open:[{watchOpen:0}]}]);function u(){"undefined"!=typeof customElements&&["mg-modal","mg-button","mg-card","mg-icon"].forEach((e=>{switch(e){case"mg-modal":customElements.get(a(e))||customElements.define(a(e),f);break;case"mg-button":customElements.get(a(e))||n();break;case"mg-card":customElements.get(a(e))||g();break;case"mg-icon":customElements.get(a(e))||h()}}))}u();const v=f,p=u;export{v as MgModal,p as defineCustomElement}
+import{transformTag as a,proxyCustomElement as e,HTMLElement as t,createEvent as i,h as o}from"@stencil/core/internal/client";import{c as d,C as c,a as s,t as l,i as r}from"./index2.js";import{i as m}from"./index3.js";import{d as n}from"./mg-button2.js";import{d as g}from"./mg-card2.js";import{d as h}from"./mg-icon2.js";const f=["dialog","alertdialog"],b=e(class extends t{constructor(a){super(),!1!==a&&this.__registerHost(),this.__attachShadow(),this.componentShow=i(this,"component-show",7),this.componentHide=i(this,"component-hide",7),this.componentClose=i(this,"component-close",7),this.titleId="",this.identifier=d("mg-modal"),this.dialogRole="dialog",this.closeButton=!1,this.open=!1,this.hasActions=!1,this.classCollection=new c(["mg-c-modal"]),this.handleClose=()=>{this.open=!1,this.componentClose.emit()}}watchIdentifier(a){if(!s(a))throw Error(`<mg-modal> prop "identifier" value is invalid. Passed value: ${l(a)}.`)}validateDialogRole(a){if(!f.includes(a))throw Error(`<mg-modal> prop "dialogRole" must be one of: ${f.join(", ")}. Passed value: ${l(a)}.`)}validateModalTitle(a){if(!r(a))throw Error(`<mg-modal> prop "modalTitle" is required. Passed value: ${l(a)}.`)}watchOpen(a){a?(this.dialog.showModal(),this.componentShow.emit(),document.body.style.overflow="hidden"):(this.dialog.close(),this.componentHide.emit(),document.body.style.overflow=this.bodyOverflow)}componentWillLoad(){this.bodyOverflow=document.body.style.overflow,this.messages=m(this.element).messages,this.hasActions=null!==this.element.querySelector('[slot="actions"]'),this.titleId=this.identifier+"-title",this.watchIdentifier(this.identifier),this.validateModalTitle(this.modalTitle),this.validateDialogRole(this.dialogRole)}componentDidLoad(){this.watchOpen(this.open),this.dialog.addEventListener("close",(()=>{this.open=!1,this.componentClose.emit()}))}render(){return o("dialog",{key:"fe7c7abaf53fbc5c87d2855cc72de2212dfe8642",role:this.dialogRole,id:this.identifier,class:this.classCollection.join(),"aria-labelledby":this.titleId,ref:a=>{null!==a&&(this.dialog=a)}},o("mg-card",{key:"4b361ad45cd0b20253cf82e8f68c574429dd451c",shadow:!0},o("div",{key:"90f5490fb82f2900403f0a7549b338e884eea171",class:"mg-c-modal__dialog"},o("header",{key:"a58be90f41ad4448c387b1d18372aa31522d8d35",class:"mg-c-modal__header"},this.closeButton&&o("span",{key:"d9a0f9c1944b89b4a64f35fc9c1b70bea60f5423",class:"mg-c-modal__close-button"},o("mg-button",{key:"d7ecae6a2c2b2b094fea6b4a6d3c761f0f975b29","is-icon":!0,variant:"flat",label:this.messages.modal.closeButton,onClick:this.handleClose},o("mg-icon",{key:"54b91decfd0deb5e452e03c23f68bac58d97677a",icon:"cross"}))),o("h1",{key:"7dc2519bdf97ebc5cc18505fbbd347c7b1a4c336",class:"mg-c-modal__title",id:this.titleId},this.modalTitle)),o("article",{key:"b6a27c0bb6e5a350e10addbd0325b04626b07239",class:"mg-c-modal__content"},o("slot",{key:"41acebdafae6289d2f03fc3226eb7f3c4334e33f"})),this.hasActions&&o("footer",{key:"04a934a044bfbfa64f65642361e1962d2f599bf9",class:"mg-c-modal__footer"},o("slot",{key:"8d72488a4095c245b638d7d0e5fdbda77fa5ab01",name:"actions"})))))}get element(){return this}static get watchers(){return{identifier:[{watchIdentifier:0}],dialogRole:[{validateDialogRole:0}],modalTitle:[{validateModalTitle:0}],open:[{watchOpen:0}]}}static get style(){return":host{--mg-c-card-border-radius:var(--mg-c-modal-border-radius);--mg-c-card-spacing:var(--mg-b-size-16) var(--mg-b-size-24);--mg-c-card-border:none}.mg-c-modal{border:none;background:none;color:inherit}.mg-c-modal[open]{display:flex;padding:var(--mg-b-size-24) var(--mg-b-size-8)}.mg-c-modal::backdrop{background-color:var(--mg-b-color-dark);opacity:.65}.mg-c-modal mg-card{display:flex;width:calc(75*var(--mg-b-size-8));max-width:100%;max-height:100%}.mg-c-modal__dialog{position:relative;display:flex;height:fit-content;max-height:100%;flex-direction:column;align-self:center;row-gap:var(--mg-b-size-24)}.mg-c-modal__title{margin:0;font-family:var(--mg-b-font-family-heading);font-size:var(--mg-c-modal-title-font-size);font-weight:600}.mg-c-modal__close-button{height:var(--mg-c-modal-title-font-size);margin-top:calc((var(--mg-b-size-min-height) - var(--mg-c-modal-title-font-size)*var(--mg-b-line-height))/2*-1);margin-right:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2*-1);margin-left:var(--mg-b-size-16);float:right}.mg-c-modal__content{padding:var(--mg-b-size-16);margin:calc(var(--mg-b-size-16)*-1);overflow-y:auto}.mg-c-modal ::slotted(*:not(mg-panel,mg-message,mg-modal)){--mg-c-card-border:var(--mg-c-card-border-default);--mg-c-card-spacing:var(--mg-c-card-spacing-default);--mg-c-card-border-radius:var(--mg-c-card-border-radius-default);--mg-c-card-color-background:var(--mg-c-card-color-background-default);--mg-c-card-box-shadow:var(--mg-c-card-box-shadow-default);--mg-c-card-max-width:unset;--mg-c-card-min-width:unset;--mg-c-card-max-height:unset;--mg-c-card-overflow:var(--mg-c-card-overflow-default)}"}},[257,"mg-modal",{identifier:[1],dialogRole:[1,"dialog-role"],modalTitle:[1,"modal-title"],closeButton:[4,"close-button"],open:[1028],hasActions:[32],classCollection:[32]},void 0,{identifier:[{watchIdentifier:0}],dialogRole:[{validateDialogRole:0}],modalTitle:[{validateModalTitle:0}],open:[{watchOpen:0}]}]);function u(){"undefined"!=typeof customElements&&["mg-modal","mg-button","mg-card","mg-icon"].forEach((e=>{switch(e){case"mg-modal":customElements.get(a(e))||customElements.define(a(e),b);break;case"mg-button":customElements.get(a(e))||n();break;case"mg-card":customElements.get(a(e))||g();break;case"mg-icon":customElements.get(a(e))||h()}}))}u();const v=b,p=u;export{v as MgModal,p as defineCustomElement}

package/dist/components/mg-panel.js

@@ -1 +1 @@
-import{transformTag as t,proxyCustomElement as e,HTMLElement as i,createEvent as a,h as s}from"@stencil/core/internal/client";import{c as n,C as l,a as o,t as r,i as c}from"./index2.js";import{i as d}from"./index3.js";import{d as h}from"./mg-button2.js";import{d as m}from"./mg-card2.js";import{d as g}from"./mg-character-left2.js";import{d as p}from"./mg-icon2.js";import{d as u}from"./mg-input2.js";import{d as b}from"./mg-input-text2.js";import{d as f}from"./mg-input-title2.js";import{d as v}from"./mg-tooltip2.js";import{d as x}from"./mg-tooltip-content2.js";const _=["text","icon"],E=["left","right"],w=e(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.titleChange=a(this,"title-change",7),this.expandedChange=a(this,"expanded-change",7),this.identifier=n("mg-panel"),this.titleEditable=!1,this.titlePosition="left",this.expanded=!1,this.expandToggleDisplay="text",this.expandToggleDisabled=!1,this.shadow=!1,this.classCollection=new l(["mg-c-panel"]),this.isEditing=!1,this.hasPanelTitleSlot=()=>null!==this.element.querySelector('[slot="panel-title"]'),this.toggleIsEditing=()=>{this.isEditing=!this.isEditing},this.handleCollapseButton=()=>{this.expandToggleDisabled||(this.expanded=!this.expanded)},this.handleEditButton=()=>{this.toggleIsEditing()},this.handleUpdateTitle=t=>{this.updatedPanelTitle=t.detail},this.handleCancelEditButton=()=>{this.updatedPanelTitle=void 0,this.toggleIsEditing()},this.handleValidateEditButton=()=>{this.editInputElement.valid&&(void 0!==this.updatedPanelTitle&&(this.panelTitle=this.updatedPanelTitle),this.toggleIsEditing())},this.renderCollapseButton=()=>s("mg-button",{onClick:this.handleCollapseButton,variant:"flat","aria-expanded":""+this.expanded,"aria-controls":this.identifier+"-content",disabled:this.expandToggleDisabled,isIcon:"icon"===this.expandToggleDisplay,label:"icon"===this.expandToggleDisplay?this.panelTitle:void 0},s("span",{class:"mg-c-panel__collapse-button-content"},s("mg-icon",{icon:"chevron-up",class:{"mg-c-panel__collapse-button-icon":!0,"mg-c-panel__collapse-button-icon--reverse":!this.expanded}}),!this.isEditing&&"icon"!==this.expandToggleDisplay&&(this.hasPanelTitleSlot()?s("slot",{name:"panel-title"}):this.panelTitle))),this.renderEditButton=()=>s("mg-button",{key:"edit-button","is-icon":!0,variant:"flat",label:this.messages.panel.editLabel,onClick:this.handleEditButton},s("mg-icon",{icon:"pen"})),this.renderEditInput=()=>s("mg-input-text",{key:"edition-input",label:this.messages.panel.editLabel,"label-hide":!0,value:this.panelTitle,"onValue-change":this.handleUpdateTitle,characterLeftHide:!0,pattern:this.titlePattern,"pattern-error-message":this.titlePatternErrorMessage,identifier:this.identifier+"-edition-input",ref:t=>this.editInputElement=t},s("mg-button",{slot:"append-input",label:this.messages.general.cancel,"is-icon":!0,variant:"secondary",onClick:this.handleCancelEditButton},s("mg-icon",{icon:"cross"})),s("mg-button",{slot:"append-input",label:this.messages.general.confirm,"is-icon":!0,variant:"secondary",onClick:this.handleValidateEditButton},s("mg-icon",{icon:"check"}))),this.renderTitle=()=>{const t=[this.renderCollapseButton()];return this.titleEditable&&!this.hasPanelTitleSlot()&&t.push(this.isEditing?this.renderEditInput():this.renderEditButton()),"right"===this.titlePosition?t.reverse():t},this.renderHeaderChildren=()=>{const t=[s("div",{class:{"mg-c-panel__header-title":!0,"mg-c-panel__header-title--full":this.isEditing,"mg-c-panel__header-title--reverse":"right"===this.titlePosition},key:this.panelTitle},this.renderTitle()),s("div",{class:"mg-c-panel__header-content",key:"slot-header"},s("slot",{name:"header-right"}))];return"right"===this.titlePosition?t.reverse():t}}watchIdentifier(t){o(t)||console.error(`<mg-panel> prop "identifier" value is invalid. Passed value: ${r(t)}.`)}validatePanelTitle(t){if(void 0!==t){if(!c(t))throw Error(`<mg-panel> prop "panelTitle" must be a string. Passed value: ${r(t)}.`);this.titleChange.emit(t)}}validateTitlePattern(t){if(void 0!==t&&!this.titleEditable)throw Error('<mg-panel> prop "titleEditable" must be set to "true".')}validateTitleEditable(t){if(t&&this.hasPanelTitleSlot())throw Error('<mg-panel> prop "titleEditable" cannot be used with panel-title slot.')}validateTitlePosition(t){if(!E.includes(t))throw Error(`<mg-panel> prop "titlePosition" must be one of: ${E.join(", ")}. Passed value: ${r(t)}.`)}handleExpanded(t){this.expandedChange.emit(t)}validateExpandToggleDisplay(t){if(!_.includes(t))throw Error(`<mg-panel> prop "expandToggleDisplay" must be one of: ${_.join(", ")}. Passed value: ${r(t)}.`);if("icon"===t&&this.titleEditable&&(this.titleEditable=!1),"icon"===t&&this.hasPanelTitleSlot())throw Error('<mg-panel> prop "expandToggleDisplay" cannot be "icon" when panel-title slot is used.')}componentWillLoad(){if(this.messages=d(this.element).messages,this.watchIdentifier(this.identifier),this.validateTitlePattern(this.titlePattern),this.validateTitlePattern(this.titlePatternErrorMessage),!this.hasPanelTitleSlot()){if(!c(this.panelTitle))throw Error('<mg-panel> prop "panelTitle" is required when panel-title slot is not used.');this.validatePanelTitle(this.panelTitle)}this.validateExpandToggleDisplay(this.expandToggleDisplay),this.validateTitlePosition(this.titlePosition),this.validateTitleEditable(this.titleEditable)}componentDidRender(){this.isEditing&&this.editInputElement.setFocus()}render(){const t=this.identifier+"-header";return s("section",{key:"6604c4a895a244a5e47d6ec138ddc0d931c07d59",class:this.classCollection.join(),id:this.identifier},s("mg-card",{key:"28d2de8b8796dbd42b9da5302c4e7e4d3503b2ae",shadow:this.shadow},s("header",{key:"74fd2c618f57a0e3089f6908b184223c1586cf00",class:{"mg-c-panel__header":!0,"mg-c-panel__header--reverse":"right"===this.titlePosition},id:t},this.renderHeaderChildren()),s("article",{key:"811fffa80ba75ed57ffecbcf7bc4e6f94f75faa2",class:"mg-c-panel__content",id:this.identifier+"-content","aria-labelledby":t,hidden:!this.expanded},s("slot",{key:"27b372c17275726113a02b8e6bda9333a73b806f"}))))}get element(){return this}static get watchers(){return{identifier:[{watchIdentifier:0}],panelTitle:[{validatePanelTitle:0}],titlePattern:[{validateTitlePattern:0}],titlePatternErrorMessage:[{validateTitlePattern:0}],titleEditable:[{validateTitleEditable:0}],titlePosition:[{validateTitlePosition:0}],expanded:[{handleExpanded:0}],expandToggleDisplay:[{validateExpandToggleDisplay:0}]}}static get style(){return":host{--mg-c-card-spacing:0;--mg-c-card-border-radius:var(--mg-c-panel-border-radius);--mg-c-card-color-background:var(--mg-c-panel-color-background);--mg-c-card-box-shadow:var(--mg-c-panel-box-shadow)}.mg-c-panel__header{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;padding:0 var(--mg-b-size-4)}.mg-c-panel__header-title,.mg-c-panel__header-content{display:flex;margin:var(--mg-b-size-4) 0}.mg-c-panel__header-content{min-height:var(--mg-b-size-min-height);flex:1 auto;align-items:center;padding-left:var(--mg-b-size-4)}.mg-c-panel__header-title mg-input-text{flex-grow:1;margin-left:var(--mg-b-size-4)}.mg-c-panel__header-title mg-button+mg-button:not([slot=append-input]){margin-left:var(--mg-b-size-4)}.mg-c-panel__header-title.mg-c-panel__header-title--full{flex:1 1 auto}.mg-c-panel__collapse-button-content{--mg-b-font-size:var(--mg-b-font-size-h5);--mg-c-button-font-weight:600}.mg-c-panel__collapse-button-icon.mg-c-panel__collapse-button-icon--reverse{transform:rotate(180deg)}.mg-c-panel__content{padding:var(--mg-c-panel-content-spacing)}.mg-c-panel ::slotted([slot=header-right]){display:flex;flex-wrap:wrap;margin-left:auto;gap:var(--mg-b-spacing-actions)}.mg-c-panel ::slotted(*:not(mg-panel,mg-message,mg-modal)){--mg-c-card-border:var(--mg-c-card-border-default);--mg-c-card-spacing:var(--mg-c-card-spacing-default);--mg-c-card-border-radius:var(--mg-c-card-border-radius-default);--mg-c-card-color-background:var(--mg-c-card-color-background-default);--mg-c-card-box-shadow:var(--mg-c-card-box-shadow-default);--mg-c-card-max-width:unset;--mg-c-card-min-width:unset;--mg-c-card-max-height:unset;--mg-c-card-overflow:var(--mg-c-card-overflow-default)}"}},[257,"mg-panel",{identifier:[1],panelTitle:[1025,"panel-title"],titlePattern:[1,"title-pattern"],titlePatternErrorMessage:[1,"title-pattern-error-message"],titleEditable:[1028,"title-editable"],titlePosition:[1,"title-position"],expanded:[1028],expandToggleDisplay:[1,"expand-toggle-display"],expandToggleDisabled:[4,"expand-toggle-disabled"],shadow:[4],classCollection:[32],isEditing:[32],updatedPanelTitle:[32]},void 0,{identifier:[{watchIdentifier:0}],panelTitle:[{validatePanelTitle:0}],titlePattern:[{validateTitlePattern:0}],titlePatternErrorMessage:[{validateTitlePattern:0}],titleEditable:[{validateTitleEditable:0}],titlePosition:[{validateTitlePosition:0}],expanded:[{handleExpanded:0}],expandToggleDisplay:[{validateExpandToggleDisplay:0}]}]);function T(){"undefined"!=typeof customElements&&["mg-panel","mg-button","mg-card","mg-character-left","mg-icon","mg-input","mg-input-text","mg-input-title","mg-tooltip","mg-tooltip-content"].forEach((e=>{switch(e){case"mg-panel":customElements.get(t(e))||customElements.define(t(e),w);break;case"mg-button":customElements.get(t(e))||h();break;case"mg-card":customElements.get(t(e))||m();break;case"mg-character-left":customElements.get(t(e))||g();break;case"mg-icon":customElements.get(t(e))||p();break;case"mg-input":customElements.get(t(e))||u();break;case"mg-input-text":customElements.get(t(e))||b();break;case"mg-input-title":customElements.get(t(e))||f();break;case"mg-tooltip":customElements.get(t(e))||v();break;case"mg-tooltip-content":customElements.get(t(e))||x()}}))}T();const k=w,y=T;export{k as MgPanel,y as defineCustomElement}
+import{transformTag as t,proxyCustomElement as e,HTMLElement as i,createEvent as a,h as s}from"@stencil/core/internal/client";import{c as n,C as l,a as o,t as r,i as c}from"./index2.js";import{i as d}from"./index3.js";import{d as h}from"./mg-button2.js";import{d as m}from"./mg-card2.js";import{d as g}from"./mg-character-left2.js";import{d as p}from"./mg-icon2.js";import{d as u}from"./mg-input2.js";import{d as f}from"./mg-input-text2.js";import{d as b}from"./mg-input-title2.js";import{d as v}from"./mg-tooltip2.js";import{d as x}from"./mg-tooltip-content2.js";const _=["text","icon"],E=["left","right"],w=e(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.titleChange=a(this,"title-change",7),this.expandedChange=a(this,"expanded-change",7),this.identifier=n("mg-panel"),this.titleEditable=!1,this.titlePosition="left",this.expanded=!1,this.expandToggleDisplay="text",this.expandToggleDisabled=!1,this.shadow=!1,this.classCollection=new l(["mg-c-panel"]),this.isEditing=!1,this.hasPanelTitleSlot=()=>null!==this.element.querySelector('[slot="panel-title"]'),this.toggleIsEditing=()=>{this.isEditing=!this.isEditing},this.handleCollapseButton=()=>{this.expandToggleDisabled||(this.expanded=!this.expanded)},this.handleEditButton=()=>{this.toggleIsEditing()},this.handleUpdateTitle=t=>{this.updatedPanelTitle=t.detail},this.handleCancelEditButton=()=>{this.updatedPanelTitle=void 0,this.toggleIsEditing()},this.handleValidateEditButton=()=>{this.editInputElement.valid&&(void 0!==this.updatedPanelTitle&&(this.panelTitle=this.updatedPanelTitle),this.toggleIsEditing())},this.renderCollapseButton=()=>s("mg-button",{onClick:this.handleCollapseButton,variant:"flat","aria-expanded":""+this.expanded,"aria-controls":this.identifier+"-content",disabled:this.expandToggleDisabled,isIcon:"icon"===this.expandToggleDisplay,label:"icon"===this.expandToggleDisplay?this.panelTitle:void 0},s("span",{class:"mg-c-panel__collapse-button-content"},s("mg-icon",{icon:"chevron-up",class:{"mg-c-panel__collapse-button-icon":!0,"mg-c-panel__collapse-button-icon--reverse":!this.expanded}}),!this.isEditing&&"icon"!==this.expandToggleDisplay&&(this.hasPanelTitleSlot()?s("slot",{name:"panel-title"}):this.panelTitle))),this.renderEditButton=()=>s("mg-button",{key:"edit-button","is-icon":!0,variant:"flat",label:this.messages.panel.editLabel,onClick:this.handleEditButton},s("mg-icon",{icon:"pen"})),this.renderEditInput=()=>s("mg-input-text",{key:"edition-input",label:this.messages.panel.editLabel,"label-hide":!0,value:this.panelTitle,"onValue-change":this.handleUpdateTitle,characterLeftHide:!0,pattern:this.titlePattern,"pattern-error-message":this.titlePatternErrorMessage,identifier:this.identifier+"-edition-input",ref:t=>this.editInputElement=t},s("mg-button",{slot:"append-input",label:this.messages.general.cancel,"is-icon":!0,variant:"secondary",onClick:this.handleCancelEditButton},s("mg-icon",{icon:"cross"})),s("mg-button",{slot:"append-input",label:this.messages.general.confirm,"is-icon":!0,variant:"secondary",onClick:this.handleValidateEditButton},s("mg-icon",{icon:"check"}))),this.renderTitle=()=>{const t=[this.renderCollapseButton()];return this.titleEditable&&!this.hasPanelTitleSlot()&&t.push(this.isEditing?this.renderEditInput():this.renderEditButton()),"right"===this.titlePosition?t.reverse():t},this.renderHeaderChildren=()=>{const t=[s("div",{class:{"mg-c-panel__header-title":!0,"mg-c-panel__header-title--full":this.isEditing,"mg-c-panel__header-title--reverse":"right"===this.titlePosition},key:this.panelTitle},this.renderTitle()),s("div",{class:"mg-c-panel__header-content",key:"slot-header"},s("slot",{name:"header-right"}))];return"right"===this.titlePosition?t.reverse():t}}watchIdentifier(t){o(t)||console.error(`<mg-panel> prop "identifier" value is invalid. Passed value: ${r(t)}.`)}validatePanelTitle(t){if(void 0!==t){if(!c(t))throw Error(`<mg-panel> prop "panelTitle" must be a string. Passed value: ${r(t)}.`);this.titleChange.emit(t)}}validateTitlePattern(t){if(void 0!==t&&!this.titleEditable)throw Error('<mg-panel> prop "titleEditable" must be set to "true".')}validateTitleEditable(t){if(t&&this.hasPanelTitleSlot())throw Error('<mg-panel> prop "titleEditable" cannot be used with panel-title slot.')}validateTitlePosition(t){if(!E.includes(t))throw Error(`<mg-panel> prop "titlePosition" must be one of: ${E.join(", ")}. Passed value: ${r(t)}.`)}handleExpanded(t){this.expandedChange.emit(t)}validateExpandToggleDisplay(t){if(!_.includes(t))throw Error(`<mg-panel> prop "expandToggleDisplay" must be one of: ${_.join(", ")}. Passed value: ${r(t)}.`);if("icon"===t&&this.titleEditable&&(this.titleEditable=!1),"icon"===t&&this.hasPanelTitleSlot())throw Error('<mg-panel> prop "expandToggleDisplay" cannot be "icon" when panel-title slot is used.')}componentWillLoad(){if(this.messages=d(this.element).messages,this.watchIdentifier(this.identifier),this.validateTitlePattern(this.titlePattern),this.validateTitlePattern(this.titlePatternErrorMessage),!this.hasPanelTitleSlot()){if(!c(this.panelTitle))throw Error('<mg-panel> prop "panelTitle" is required when panel-title slot is not used.');this.validatePanelTitle(this.panelTitle)}this.validateExpandToggleDisplay(this.expandToggleDisplay),this.validateTitlePosition(this.titlePosition),this.validateTitleEditable(this.titleEditable)}componentDidRender(){this.isEditing&&this.editInputElement.setFocus()}render(){const t=this.identifier+"-header";return s("section",{key:"e92b270e15717a1b6ab7d938674ccd785fe3ee97",class:this.classCollection.join(),id:this.identifier},s("mg-card",{key:"40647ea277463f5e915c2fb5aa982f22527545ea",shadow:this.shadow},s("header",{key:"604611af47d683cf1f0d3ffc8b5873be390e3fb9",class:{"mg-c-panel__header":!0,"mg-c-panel__header--reverse":"right"===this.titlePosition},id:t},this.renderHeaderChildren()),s("article",{key:"ff640071dd4813aa113f5928b2a0350f4528a22c",class:"mg-c-panel__content",id:this.identifier+"-content","aria-labelledby":t,hidden:!this.expanded},s("slot",{key:"fe54d2ca332c573e8dfa782a3e72454501b47adf"}))))}get element(){return this}static get watchers(){return{identifier:[{watchIdentifier:0}],panelTitle:[{validatePanelTitle:0}],titlePattern:[{validateTitlePattern:0}],titlePatternErrorMessage:[{validateTitlePattern:0}],titleEditable:[{validateTitleEditable:0}],titlePosition:[{validateTitlePosition:0}],expanded:[{handleExpanded:0}],expandToggleDisplay:[{validateExpandToggleDisplay:0}]}}static get style(){return":host{--mg-c-card-spacing:0;--mg-c-card-border-radius:var(--mg-c-panel-border-radius);--mg-c-card-color-background:var(--mg-c-panel-color-background);--mg-c-card-box-shadow:var(--mg-c-panel-box-shadow)}.mg-c-panel__header{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;padding:0 var(--mg-b-size-4)}.mg-c-panel__header-title,.mg-c-panel__header-content{display:flex;margin:var(--mg-b-size-4) 0}.mg-c-panel__header-content{min-height:var(--mg-b-size-min-height);flex:1 auto;align-items:center;padding-left:var(--mg-b-size-4)}.mg-c-panel__header-title mg-input-text{flex-grow:1;margin-left:var(--mg-b-size-4)}.mg-c-panel__header-title mg-button+mg-button:not([slot=append-input]){margin-left:var(--mg-b-size-4)}.mg-c-panel__header-title.mg-c-panel__header-title--full{flex:1 1 auto}.mg-c-panel__collapse-button-content{--mg-b-font-size:var(--mg-b-font-size-h5);--mg-c-button-font-weight:600}.mg-c-panel__collapse-button-icon.mg-c-panel__collapse-button-icon--reverse{transform:rotate(180deg)}.mg-c-panel__content{padding:var(--mg-c-panel-content-spacing)}.mg-c-panel ::slotted([slot=header-right]){display:flex;flex-wrap:wrap;margin-left:auto;gap:var(--mg-b-spacing-actions)}.mg-c-panel ::slotted(*:not(mg-panel,mg-message,mg-modal)){--mg-c-card-border:var(--mg-c-card-border-default);--mg-c-card-spacing:var(--mg-c-card-spacing-default);--mg-c-card-border-radius:var(--mg-c-card-border-radius-default);--mg-c-card-color-background:var(--mg-c-card-color-background-default);--mg-c-card-box-shadow:var(--mg-c-card-box-shadow-default);--mg-c-card-max-width:unset;--mg-c-card-min-width:unset;--mg-c-card-max-height:unset;--mg-c-card-overflow:var(--mg-c-card-overflow-default)}"}},[257,"mg-panel",{identifier:[1],panelTitle:[1025,"panel-title"],titlePattern:[1,"title-pattern"],titlePatternErrorMessage:[1,"title-pattern-error-message"],titleEditable:[1028,"title-editable"],titlePosition:[1,"title-position"],expanded:[1028],expandToggleDisplay:[1,"expand-toggle-display"],expandToggleDisabled:[4,"expand-toggle-disabled"],shadow:[4],classCollection:[32],isEditing:[32],updatedPanelTitle:[32]},void 0,{identifier:[{watchIdentifier:0}],panelTitle:[{validatePanelTitle:0}],titlePattern:[{validateTitlePattern:0}],titlePatternErrorMessage:[{validateTitlePattern:0}],titleEditable:[{validateTitleEditable:0}],titlePosition:[{validateTitlePosition:0}],expanded:[{handleExpanded:0}],expandToggleDisplay:[{validateExpandToggleDisplay:0}]}]);function T(){"undefined"!=typeof customElements&&["mg-panel","mg-button","mg-card","mg-character-left","mg-icon","mg-input","mg-input-text","mg-input-title","mg-tooltip","mg-tooltip-content"].forEach((e=>{switch(e){case"mg-panel":customElements.get(t(e))||customElements.define(t(e),w);break;case"mg-button":customElements.get(t(e))||h();break;case"mg-card":customElements.get(t(e))||m();break;case"mg-character-left":customElements.get(t(e))||g();break;case"mg-icon":customElements.get(t(e))||p();break;case"mg-input":customElements.get(t(e))||u();break;case"mg-input-text":customElements.get(t(e))||f();break;case"mg-input-title":customElements.get(t(e))||b();break;case"mg-tooltip":customElements.get(t(e))||v();break;case"mg-tooltip-content":customElements.get(t(e))||x()}}))}T();const k=w,y=T;export{k as MgPanel,y as defineCustomElement}

package/dist/components/mg-popover-content2.js

@@ -1 +1 @@
-import{transformTag as t,proxyCustomElement as o,HTMLElement as e,createEvent as r,h as a,Host as s}from"@stencil/core/internal/client";import{C as p,b as d}from"./index2.js";import{i as c}from"./index3.js";import{d as l}from"./mg-button2.js";import{d as i}from"./mg-card2.js";import{d as m}from"./mg-icon2.js";const n=o(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.hideContent=r(this,"hide-content",7),this.closeButton=!1,this.classCollection=new p(["mg-c-popover-content"]),this.handleCloseButton=()=>{this.hideContent.emit()}}componentWillLoad(){this.messages=c(this.element).messages}componentDidLoad(){const t=["h1","h2","h3","h4","h5","h6"],o=this.element.querySelector('[slot="title"]');if(o&&!d(o,t))throw new Error(`<mg-popover> Slotted title must be a heading: ${t.join(", ")}.`)}render(){return a(s,{key:"c87fe52d52b80954170963fd1378b3a05313f9c6"},a("mg-card",{key:"a38755a5a7055d4bd4166531326b1be245d2906f",class:this.classCollection.join(),shadow:!0},this.closeButton&&a("mg-button",{key:"823e99beb15aa19f6f2f7cee2c5e1088cc116425","is-icon":!0,variant:"flat",label:this.messages.general.close,onClick:this.handleCloseButton},a("mg-icon",{key:"70daf81e59533585b6a051a6d97539a75833432e",icon:"cross"})),a("div",{key:"cccf70c8fba6906e6724629642383fad0c98656e",class:"mg-c-popover-content__title"},a("slot",{key:"b05acb47b32d27d1629d39451e4a786d2f404406",name:"title"})),a("slot",{key:"40de167b1fb77c7d8fc557f60cf176c0991e991d",name:"content"})),a("slot",{key:"c6c1305d5ff51d2af0d56b1199731cd41645c99d",name:"arrow"}))}get element(){return this}static get style(){return':host{position:relative;z-index:2000;display:none;padding:var(--mg-b-size-8);color:var(--mg-c-popover-color-text)}:host([data-show]){display:block}:host([data-popper-placement^=left-start]),:host([data-popper-placement^=left-end]),:host([data-popper-placement^=right-start]),:host([data-popper-placement^=right-end]){padding:0 var(--mg-b-size-8)}.mg-c-popover-content{--mg-c-card-max-width:var(--mg-c-popover-max-width);--mg-c-card-min-width:var(--mg-c-popover-min-width);--mg-c-card-max-height:min( var(--mg-c-popover-max-height), 100vh - calc(var(--mg-b-size-min-height) + var(--mg-b-size-32)) );--mg-c-card-overflow:var(--mg-c-popover-overflow)}.mg-c-popover-content mg-button{margin-top:calc(-1*(var(--mg-b-size-min-height) - var(--mg-c-popover-title-font-size)*var(--mg-b-line-height))/2);margin-right:calc(-1*(var(--mg-b-size-min-height) - var(--mg-b-size-16))/2);margin-left:var(--mg-b-size-32);float:right}.mg-c-popover-content__title ::slotted([slot=title]){margin:0 0 var(--mg-b-size-12) !important;font-size:var(--mg-c-popover-title-font-size) !important;font-weight:600 !important}.mg-c-popover-content ::slotted(*:not(mg-panel,mg-message,mg-modal)){--mg-c-card-border:var(--mg-c-card-border-default);--mg-c-card-spacing:var(--mg-c-card-spacing-default);--mg-c-card-border-radius:var(--mg-c-card-border-radius-default);--mg-c-card-color-background:var(--mg-c-card-color-background-default);--mg-c-card-box-shadow:var(--mg-c-card-box-shadow-default);--mg-c-card-max-width:unset;--mg-c-card-min-width:unset;--mg-c-card-max-height:unset;--mg-c-card-overflow:var(--mg-c-card-overflow-default)}:host([data-popper-placement^=top][data-arrow-hide]){padding-bottom:0}:host([data-popper-placement^=bottom][data-arrow-hide]){padding-top:0}:host([data-popper-placement$=end][data-arrow-hide]),:host([data-popper-placement^=left][data-arrow-hide]){padding-right:0}:host([data-popper-placement$=start][data-arrow-hide]),:host([data-popper-placement^=right][data-arrow-hide]){padding-left:0}::slotted([slot=arrow]){position:absolute;width:calc(var(--mg-b-size-24) + 2*var(--mg-c-popover-border-radius) + 2*var(--mg-b-size-8));height:calc(var(--mg-b-size-24) + 2*var(--mg-c-popover-border-radius) + 2*var(--mg-b-size-8));visibility:hidden}::slotted([slot=arrow])::before{position:absolute;content:"";visibility:visible}:host([data-arrow-hide]) ::slotted([slot=arrow]){display:none}:host([data-popper-placement^=top]) ::slotted([slot=arrow]),:host([data-popper-placement^=bottom]) ::slotted([slot=arrow]){height:var(--mg-b-size-8)}:host([data-popper-placement^=top]) ::slotted([slot=arrow])::before,:host([data-popper-placement^=bottom]) ::slotted([slot=arrow])::before{left:calc(var(--mg-c-popover-border-radius) + var(--mg-b-size-8));border-right:calc(var(--mg-b-size-24)/2) solid rgba(0,0,0,0);border-left:calc(var(--mg-b-size-24)/2) solid rgba(0,0,0,0)}:host([data-popper-placement^=top]) ::slotted([slot=arrow]){bottom:var(--mg-b-size-border);filter:drop-shadow(0 0.5rem 0.25rem color-mix(in srgb, var(--mg-b-color-dark), transparent 85%))}:host([data-popper-placement^=top]) ::slotted([slot=arrow])::before{border-top:var(--mg-b-size-8) solid var(--mg-c-popover-color-background)}:host([data-popper-placement^=bottom]) ::slotted([slot=arrow]){top:var(--mg-b-size-border);filter:drop-shadow(0 -0.5rem 0.25rem color-mix(in srgb, var(--mg-b-color-dark), transparent 85%))}:host([data-popper-placement^=bottom]) ::slotted([slot=arrow])::before{border-bottom:var(--mg-b-size-8) solid var(--mg-c-popover-color-background)}:host([data-popper-placement^=left]) ::slotted([slot=arrow]),:host([data-popper-placement^=right]) ::slotted([slot=arrow]){width:var(--mg-b-size-8)}:host([data-popper-placement^=left]) ::slotted([slot=arrow])::before,:host([data-popper-placement^=right]) ::slotted([slot=arrow])::before{top:calc(var(--mg-c-popover-border-radius) + var(--mg-b-size-8));border-top:calc(var(--mg-b-size-24)/2) solid rgba(0,0,0,0);border-bottom:calc(var(--mg-b-size-24)/2) solid rgba(0,0,0,0)}:host([data-popper-placement^=left]) ::slotted([slot=arrow]){right:var(--mg-b-size-border);filter:drop-shadow(0.5rem 0 0.25rem color-mix(in srgb, var(--mg-b-color-dark), transparent 85%))}:host([data-popper-placement^=left]) ::slotted([slot=arrow])::before{border-left:var(--mg-b-size-8) solid var(--mg-c-popover-color-background)}:host([data-popper-placement^=right]) ::slotted([slot=arrow]){left:var(--mg-b-size-border);filter:drop-shadow(-0.5rem 0 0.25rem color-mix(in srgb, var(--mg-b-color-dark), transparent 85%))}:host([data-popper-placement^=right]) ::slotted([slot=arrow])::before{border-right:var(--mg-b-size-8) solid var(--mg-c-popover-color-background)}:host([data-popper-placement^=left-start]) ::slotted([slot=arrow]),:host([data-popper-placement^=left-end]) ::slotted([slot=arrow]),:host([data-popper-placement^=right-start]) ::slotted([slot=arrow]),:host([data-popper-placement^=right-end]) ::slotted([slot=arrow]){height:calc(var(--mg-b-size-24) + 2*var(--mg-c-popover-border-radius))}:host([data-popper-placement^=left-start]) ::slotted([slot=arrow])::before,:host([data-popper-placement^=left-end]) ::slotted([slot=arrow])::before,:host([data-popper-placement^=right-start]) ::slotted([slot=arrow])::before,:host([data-popper-placement^=right-end]) ::slotted([slot=arrow])::before{top:var(--mg-c-popover-border-radius)}'}},[257,"mg-popover-content",{closeButton:[4,"close-button"],classCollection:[32]}]);function g(){"undefined"!=typeof customElements&&["mg-popover-content","mg-button","mg-card","mg-icon"].forEach((o=>{switch(o){case"mg-popover-content":customElements.get(t(o))||customElements.define(t(o),n);break;case"mg-button":customElements.get(t(o))||l();break;case"mg-card":customElements.get(t(o))||i();break;case"mg-icon":customElements.get(t(o))||m()}}))}g();export{n as M,g as d}
+import{transformTag as t,proxyCustomElement as o,HTMLElement as e,createEvent as r,h as a,Host as s}from"@stencil/core/internal/client";import{C as p,b as d}from"./index2.js";import{i as c}from"./index3.js";import{d as l}from"./mg-button2.js";import{d as i}from"./mg-card2.js";import{d as m}from"./mg-icon2.js";const n=o(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.hideContent=r(this,"hide-content",7),this.closeButton=!1,this.classCollection=new p(["mg-c-popover-content"]),this.handleCloseButton=()=>{this.hideContent.emit()}}componentWillLoad(){this.messages=c(this.element).messages}componentDidLoad(){const t=["h1","h2","h3","h4","h5","h6"],o=this.element.querySelector('[slot="title"]');if(o&&!d(o,t))throw new Error(`<mg-popover> Slotted title must be a heading: ${t.join(", ")}.`)}render(){return a(s,{key:"56962c792e0015e1b52f8121914829b7da136283"},a("mg-card",{key:"05b557704fd10e1be87e1931fe672f5c29d3afc4",class:this.classCollection.join(),shadow:!0},this.closeButton&&a("mg-button",{key:"d2fc38c5be7ea92d0d0efc36133d6c683baa4e68","is-icon":!0,variant:"flat",label:this.messages.general.close,onClick:this.handleCloseButton},a("mg-icon",{key:"5d2091d064f3908a291af3b90acaddc59e2b9268",icon:"cross"})),a("div",{key:"d599231cfe330cdbc73f4bf7553b2cc66baf4889",class:"mg-c-popover-content__title"},a("slot",{key:"fbb836bac9d9f5f2327ecba13ddc3b1cab974930",name:"title"})),a("slot",{key:"bdb29d255f35931efa24be57c13c4303ba326778",name:"content"})),a("slot",{key:"b09b667ea04096baaeac07fac9097a3a22335f2b",name:"arrow"}))}get element(){return this}static get style(){return':host{position:relative;z-index:2000;display:none;padding:var(--mg-b-size-8);color:var(--mg-c-popover-color-text)}:host([data-show]){display:block}:host([data-popper-placement^=left-start]),:host([data-popper-placement^=left-end]),:host([data-popper-placement^=right-start]),:host([data-popper-placement^=right-end]){padding:0 var(--mg-b-size-8)}.mg-c-popover-content{--mg-c-card-max-width:var(--mg-c-popover-max-width);--mg-c-card-min-width:var(--mg-c-popover-min-width);--mg-c-card-max-height:min( var(--mg-c-popover-max-height), 100vh - calc(var(--mg-b-size-min-height) + var(--mg-b-size-32)) );--mg-c-card-overflow:var(--mg-c-popover-overflow)}.mg-c-popover-content mg-button{margin-top:calc(-1*(var(--mg-b-size-min-height) - var(--mg-c-popover-title-font-size)*var(--mg-b-line-height))/2);margin-right:calc(-1*(var(--mg-b-size-min-height) - var(--mg-b-size-16))/2);margin-left:var(--mg-b-size-32);float:right}.mg-c-popover-content__title ::slotted([slot=title]){margin:0 0 var(--mg-b-size-12) !important;font-size:var(--mg-c-popover-title-font-size) !important;font-weight:600 !important}.mg-c-popover-content ::slotted(*:not(mg-panel,mg-message,mg-modal)){--mg-c-card-border:var(--mg-c-card-border-default);--mg-c-card-spacing:var(--mg-c-card-spacing-default);--mg-c-card-border-radius:var(--mg-c-card-border-radius-default);--mg-c-card-color-background:var(--mg-c-card-color-background-default);--mg-c-card-box-shadow:var(--mg-c-card-box-shadow-default);--mg-c-card-max-width:unset;--mg-c-card-min-width:unset;--mg-c-card-max-height:unset;--mg-c-card-overflow:var(--mg-c-card-overflow-default)}:host([data-popper-placement^=top][data-arrow-hide]){padding-bottom:0}:host([data-popper-placement^=bottom][data-arrow-hide]){padding-top:0}:host([data-popper-placement$=end][data-arrow-hide]),:host([data-popper-placement^=left][data-arrow-hide]){padding-right:0}:host([data-popper-placement$=start][data-arrow-hide]),:host([data-popper-placement^=right][data-arrow-hide]){padding-left:0}::slotted([slot=arrow]){position:absolute;width:calc(var(--mg-b-size-24) + 2*var(--mg-c-popover-border-radius) + 2*var(--mg-b-size-8));height:calc(var(--mg-b-size-24) + 2*var(--mg-c-popover-border-radius) + 2*var(--mg-b-size-8));visibility:hidden}::slotted([slot=arrow])::before{position:absolute;content:"";visibility:visible}:host([data-arrow-hide]) ::slotted([slot=arrow]){display:none}:host([data-popper-placement^=top]) ::slotted([slot=arrow]),:host([data-popper-placement^=bottom]) ::slotted([slot=arrow]){height:var(--mg-b-size-8)}:host([data-popper-placement^=top]) ::slotted([slot=arrow])::before,:host([data-popper-placement^=bottom]) ::slotted([slot=arrow])::before{left:calc(var(--mg-c-popover-border-radius) + var(--mg-b-size-8));border-right:calc(var(--mg-b-size-24)/2) solid rgba(0,0,0,0);border-left:calc(var(--mg-b-size-24)/2) solid rgba(0,0,0,0)}:host([data-popper-placement^=top]) ::slotted([slot=arrow]){bottom:var(--mg-b-size-border);filter:drop-shadow(0 0.5rem 0.25rem color-mix(in srgb, var(--mg-b-color-dark), transparent 85%))}:host([data-popper-placement^=top]) ::slotted([slot=arrow])::before{border-top:var(--mg-b-size-8) solid var(--mg-c-popover-color-background)}:host([data-popper-placement^=bottom]) ::slotted([slot=arrow]){top:var(--mg-b-size-border);filter:drop-shadow(0 -0.5rem 0.25rem color-mix(in srgb, var(--mg-b-color-dark), transparent 85%))}:host([data-popper-placement^=bottom]) ::slotted([slot=arrow])::before{border-bottom:var(--mg-b-size-8) solid var(--mg-c-popover-color-background)}:host([data-popper-placement^=left]) ::slotted([slot=arrow]),:host([data-popper-placement^=right]) ::slotted([slot=arrow]){width:var(--mg-b-size-8)}:host([data-popper-placement^=left]) ::slotted([slot=arrow])::before,:host([data-popper-placement^=right]) ::slotted([slot=arrow])::before{top:calc(var(--mg-c-popover-border-radius) + var(--mg-b-size-8));border-top:calc(var(--mg-b-size-24)/2) solid rgba(0,0,0,0);border-bottom:calc(var(--mg-b-size-24)/2) solid rgba(0,0,0,0)}:host([data-popper-placement^=left]) ::slotted([slot=arrow]){right:var(--mg-b-size-border);filter:drop-shadow(0.5rem 0 0.25rem color-mix(in srgb, var(--mg-b-color-dark), transparent 85%))}:host([data-popper-placement^=left]) ::slotted([slot=arrow])::before{border-left:var(--mg-b-size-8) solid var(--mg-c-popover-color-background)}:host([data-popper-placement^=right]) ::slotted([slot=arrow]){left:var(--mg-b-size-border);filter:drop-shadow(-0.5rem 0 0.25rem color-mix(in srgb, var(--mg-b-color-dark), transparent 85%))}:host([data-popper-placement^=right]) ::slotted([slot=arrow])::before{border-right:var(--mg-b-size-8) solid var(--mg-c-popover-color-background)}:host([data-popper-placement^=left-start]) ::slotted([slot=arrow]),:host([data-popper-placement^=left-end]) ::slotted([slot=arrow]),:host([data-popper-placement^=right-start]) ::slotted([slot=arrow]),:host([data-popper-placement^=right-end]) ::slotted([slot=arrow]){height:calc(var(--mg-b-size-24) + 2*var(--mg-c-popover-border-radius))}:host([data-popper-placement^=left-start]) ::slotted([slot=arrow])::before,:host([data-popper-placement^=left-end]) ::slotted([slot=arrow])::before,:host([data-popper-placement^=right-start]) ::slotted([slot=arrow])::before,:host([data-popper-placement^=right-end]) ::slotted([slot=arrow])::before{top:var(--mg-c-popover-border-radius)}'}},[257,"mg-popover-content",{closeButton:[4,"close-button"],classCollection:[32]}]);function g(){"undefined"!=typeof customElements&&["mg-popover-content","mg-button","mg-card","mg-icon"].forEach((o=>{switch(o){case"mg-popover-content":customElements.get(t(o))||customElements.define(t(o),n);break;case"mg-button":customElements.get(t(o))||l();break;case"mg-card":customElements.get(t(o))||i();break;case"mg-icon":customElements.get(t(o))||m()}}))}g();export{n as M,g as d}

package/dist/components/mg-popover2.js

@@ -1 +1 @@
-import{transformTag as t,proxyCustomElement as e,HTMLElement as i,createEvent as s,h as o,Host as a}from"@stencil/core/internal/client";import{c as r,a as n,t as d,g as h}from"./index2.js";import{d as c}from"./mg-button2.js";import{d as l}from"./mg-card2.js";import{d as p}from"./mg-icon2.js";import{d as m}from"./mg-popover-content2.js";import{c as v}from"./popper.js";const g=e(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.displayChange=s(this,"display-change",7),this.componentClose=s(this,"component-close",7),this.identifier=r("mg-popover"),this.placement="bottom",this.arrowHide=!1,this.closeButton=!1,this.display=!1,this.disabled=!1,this.clickOutside=t=>{this.disabled||t.target.closest("mg-popover")===this.element||null!==t.target.closest(`[data-mg-popover-guard="${this.identifier}"]`)||(this.display=!1)},this.show=()=>{this.mgPopover.dataset.show="",this.interactiveElement.setAttribute("aria-expanded","true"),this.setPopperListeners(!0),setTimeout((()=>{this.manageClickOutsideListeners("addEventListener")}))},this.hide=()=>{this.mgPopover.removeAttribute("data-show"),this.interactiveElement.setAttribute("aria-expanded","false"),this.setPopperListeners(!1),this.manageClickOutsideListeners("removeEventListener")},this.setPopperListeners=t=>{this.popper.setOptions((e=>Object.assign(Object.assign({},e),{modifiers:[...e.modifiers,{name:"eventListeners",enabled:t}]})))},this.manageClickOutsideListeners=t=>{var e,i;[...Array.from((null===(i=null===(e=document.querySelector(`[data-mg-popover-guard="${this.identifier}"]`))||void 0===e?void 0:e.shadowRoot)||void 0===i?void 0:i.children)||new Set),...this.windows].forEach((e=>{null!==e&&e[t]("click",this.clickOutside,!1)}))},this.handleHideContent=()=>{this.display=!1,this.componentClose.emit()},this.renderPopoverContent=()=>{const t=this.element.querySelector("mg-popover-content");if(null===t){this.mgPopoverContent=document.createElement("mg-popover-content"),this.mgPopoverContent.setAttribute("slot","content"),this.mgPopoverContent.setAttribute("id",this.identifier),this.mgPopoverContent.addEventListener("hide-content",this.handleHideContent);const t=document.createElement("div");t.setAttribute("slot","arrow"),t.dataset.popperArrow="",this.mgPopoverContent.appendChild(t),['[slot="title"]','[slot="content"]:not(mg-popover-content)'].forEach((t=>{Array.from(this.element.querySelectorAll(t)).forEach((t=>{this.mgPopoverContent.appendChild(t)}))})),this.element.appendChild(this.mgPopoverContent)}else t.setAttribute("id",this.identifier)}}validateIdentifier(t){if(!n(t))throw new Error(`<mg-popover> prop "identifier" value is invalid. Passed value: ${d(t)}.`);this.renderPopoverContent()}validateArrowHide(t){t?this.mgPopoverContent.dataset.arrowHide="":delete this.mgPopoverContent.dataset.arrowHide}validateCloseButton(t){this.mgPopoverContent.closeButton=t}handleDisplay(t){t?this.show():this.hide(),this.displayChange.emit(t)}componentDidUpdate(){this.popper.update()}componentWillLoad(){this.windows=h(window),this.renderPopoverContent(),this.validateCloseButton(this.closeButton),this.validateIdentifier(this.identifier),this.validateArrowHide(this.arrowHide)}componentDidLoad(){this.mgPopover=this.element.querySelector(`#${this.identifier}`),this.interactiveElement=this.element.querySelector(":not([slot])"),this.interactiveElement.setAttribute("aria-controls",this.identifier),this.interactiveElement.setAttribute("aria-expanded",`${this.display}`);const t=[];void 0!==this.element.dataset.fallbackPlacement&&t.push(this.element.dataset.fallbackPlacement),this.popper=v(this.interactiveElement,this.mgPopover,{placement:this.placement,strategy:"fixed",modifiers:[{name:"offset",options:{offset:[0,0]}},{name:"flip",options:{fallbackPlacements:[...t,"auto"]}}]}),[this.interactiveElement,this.element.querySelector("mg-popover-content")].forEach((t=>{new ResizeObserver((()=>{this.popper.update()})).observe(t)})),this.interactiveElement.addEventListener("click",(()=>{this.disabled||(this.display=!this.display)})),this.element.addEventListener("click",(t=>{const e=t.target.closest("[popovertargetaction]");!0===this.display&&null!==e&&"hide"===e.getAttribute("popovertargetaction")&&(this.display=!1)})),this.element.addEventListener("keydown",(t=>{this.disabled||"Escape"!==t.code||(this.display=!1,this.componentClose.emit(),this.interactiveElement.focus())})),this.handleDisplay(this.display)}render(){return o(a,{key:"c25d773831395cf154f85cda3be67af22d6d8767"},o("slot",{key:"c6fb5897222e527cc36c78e1f32aaadc4d3c4b01"}),o("slot",{key:"d7f682fdf78caa8491b8e9a74e6d5e91dbf5ef84",name:"content"}))}get element(){return this}static get watchers(){return{identifier:[{validateIdentifier:0}],arrowHide:[{validateArrowHide:0}],closeButton:[{validateCloseButton:0}],display:[{handleDisplay:0}]}}static get style(){return":host{--mg-c-card-spacing:var(--mg-c-popover-padding-vertical, var(--mg-b-size-16)) var(--mg-c-popover-padding-horizontal, var(--mg-b-size-16));--mg-c-card-border:none;--mg-c-card-border-radius:var(--mg-c-popover-border-radius);--mg-c-card-color-background:var(--mg-c-popover-color-background);position:relative;display:contents}:host::slotted(*){display:inline-block}"}},[257,"mg-popover",{identifier:[1],placement:[1],arrowHide:[4,"arrow-hide"],closeButton:[4,"close-button"],display:[1028],disabled:[4]},void 0,{identifier:[{validateIdentifier:0}],arrowHide:[{validateArrowHide:0}],closeButton:[{validateCloseButton:0}],display:[{handleDisplay:0}]}]);function u(){"undefined"!=typeof customElements&&["mg-popover","mg-button","mg-card","mg-icon","mg-popover-content"].forEach((e=>{switch(e){case"mg-popover":customElements.get(t(e))||customElements.define(t(e),g);break;case"mg-button":customElements.get(t(e))||c();break;case"mg-card":customElements.get(t(e))||l();break;case"mg-icon":customElements.get(t(e))||p();break;case"mg-popover-content":customElements.get(t(e))||m()}}))}u();export{g as M,u as d}
+import{transformTag as t,proxyCustomElement as e,HTMLElement as i,createEvent as s,h as o,Host as a}from"@stencil/core/internal/client";import{c as r,a as n,t as h,g as c}from"./index2.js";import{d}from"./mg-button2.js";import{d as l}from"./mg-card2.js";import{d as p}from"./mg-icon2.js";import{d as m}from"./mg-popover-content2.js";import{c as v}from"./popper.js";const g=e(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.displayChange=s(this,"display-change",7),this.componentClose=s(this,"component-close",7),this.identifier=r("mg-popover"),this.placement="bottom",this.arrowHide=!1,this.closeButton=!1,this.display=!1,this.disabled=!1,this.clickOutside=t=>{this.disabled||t.target.closest("mg-popover")===this.element||null!==t.target.closest(`[data-mg-popover-guard="${this.identifier}"]`)||(this.display=!1)},this.show=()=>{this.mgPopover.dataset.show="",this.interactiveElement.setAttribute("aria-expanded","true"),this.setPopperListeners(!0),setTimeout((()=>{this.manageClickOutsideListeners("addEventListener")}))},this.hide=()=>{this.mgPopover.removeAttribute("data-show"),this.interactiveElement.setAttribute("aria-expanded","false"),this.setPopperListeners(!1),this.manageClickOutsideListeners("removeEventListener")},this.setPopperListeners=t=>{this.popper.setOptions((e=>Object.assign(Object.assign({},e),{modifiers:[...e.modifiers,{name:"eventListeners",enabled:t}]})))},this.manageClickOutsideListeners=t=>{var e,i;[...Array.from((null===(i=null===(e=document.querySelector(`[data-mg-popover-guard="${this.identifier}"]`))||void 0===e?void 0:e.shadowRoot)||void 0===i?void 0:i.children)||new Set),...this.windows].forEach((e=>{null!==e&&e[t]("click",this.clickOutside,!1)}))},this.handleHideContent=()=>{this.display=!1,this.componentClose.emit()},this.renderPopoverContent=()=>{const t=this.element.querySelector("mg-popover-content");if(null===t){this.mgPopoverContent=document.createElement("mg-popover-content"),this.mgPopoverContent.setAttribute("slot","content"),this.mgPopoverContent.setAttribute("id",this.identifier),this.mgPopoverContent.addEventListener("hide-content",this.handleHideContent);const t=document.createElement("div");t.setAttribute("slot","arrow"),t.dataset.popperArrow="",this.mgPopoverContent.appendChild(t),['[slot="title"]','[slot="content"]:not(mg-popover-content)'].forEach((t=>{Array.from(this.element.querySelectorAll(t)).forEach((t=>{this.mgPopoverContent.appendChild(t)}))})),this.element.appendChild(this.mgPopoverContent)}else t.setAttribute("id",this.identifier)}}validateIdentifier(t){if(!n(t))throw new Error(`<mg-popover> prop "identifier" value is invalid. Passed value: ${h(t)}.`);this.renderPopoverContent()}validateArrowHide(t){t?this.mgPopoverContent.dataset.arrowHide="":delete this.mgPopoverContent.dataset.arrowHide}validateCloseButton(t){this.mgPopoverContent.closeButton=t}handleDisplay(t){t?this.show():this.hide(),this.displayChange.emit(t)}componentDidUpdate(){this.popper.update()}componentWillLoad(){this.windows=c(window),this.renderPopoverContent(),this.validateCloseButton(this.closeButton),this.validateIdentifier(this.identifier),this.validateArrowHide(this.arrowHide)}componentDidLoad(){this.mgPopover=this.element.querySelector(`#${this.identifier}`),this.interactiveElement=this.element.querySelector(":not([slot])"),this.interactiveElement.setAttribute("aria-controls",this.identifier),this.interactiveElement.setAttribute("aria-expanded",`${this.display}`);const t=[];void 0!==this.element.dataset.fallbackPlacement&&t.push(this.element.dataset.fallbackPlacement),this.popper=v(this.interactiveElement,this.mgPopover,{placement:this.placement,strategy:"fixed",modifiers:[{name:"offset",options:{offset:[0,0]}},{name:"flip",options:{fallbackPlacements:[...t,"auto"]}}]}),[this.interactiveElement,this.element.querySelector("mg-popover-content")].forEach((t=>{new ResizeObserver((()=>{this.popper.update()})).observe(t)})),this.interactiveElement.addEventListener("click",(()=>{this.disabled||(this.display=!this.display)})),this.element.addEventListener("click",(t=>{const e=t.target.closest("[popovertargetaction]");!0===this.display&&null!==e&&"hide"===e.getAttribute("popovertargetaction")&&(this.display=!1)})),this.element.addEventListener("keydown",(t=>{this.disabled||"Escape"!==t.code||(this.display=!1,this.componentClose.emit(),this.interactiveElement.focus())})),this.handleDisplay(this.display)}render(){return o(a,{key:"530971c84be3edae39c5aed0013d0c5b9005a1c1"},o("slot",{key:"6e717bc8c5aa3d58fc048c4232e706cc78ab66ec"}),o("slot",{key:"e779db01e55a28ffaedde21e9944f5ef3c79fa29",name:"content"}))}get element(){return this}static get watchers(){return{identifier:[{validateIdentifier:0}],arrowHide:[{validateArrowHide:0}],closeButton:[{validateCloseButton:0}],display:[{handleDisplay:0}]}}static get style(){return":host{--mg-c-card-spacing:var(--mg-c-popover-spacing-vertical, var(--mg-b-size-16)) var(--mg-c-popover-spacing-horizontal, var(--mg-b-size-16));--mg-c-card-border:none;--mg-c-card-border-radius:var(--mg-c-popover-border-radius);--mg-c-card-color-background:var(--mg-c-popover-color-background);position:relative;display:contents}:host::slotted(*){display:inline-block}"}},[257,"mg-popover",{identifier:[1],placement:[1],arrowHide:[4,"arrow-hide"],closeButton:[4,"close-button"],display:[1028],disabled:[4]},void 0,{identifier:[{validateIdentifier:0}],arrowHide:[{validateArrowHide:0}],closeButton:[{validateCloseButton:0}],display:[{handleDisplay:0}]}]);function u(){"undefined"!=typeof customElements&&["mg-popover","mg-button","mg-card","mg-icon","mg-popover-content"].forEach((e=>{switch(e){case"mg-popover":customElements.get(t(e))||customElements.define(t(e),g);break;case"mg-button":customElements.get(t(e))||d();break;case"mg-card":customElements.get(t(e))||l();break;case"mg-icon":customElements.get(t(e))||p();break;case"mg-popover-content":customElements.get(t(e))||m()}}))}u();export{g as M,u as d}

package/dist/components/mg-progress.js

@@ -1 +1 @@
-import{transformTag as r,proxyCustomElement as s,HTMLElement as e,h as a,Host as t}from"@stencil/core/internal/client";import{i,t as o,q as c}from"./index2.js";const l=["progressbar","meter"],h=s(class extends e{constructor(r){super(),!1!==r&&this.__registerHost(),this.__attachShadow(),this.ariaRole="progressbar",this.value=0,this.min=0,this.max=100}watchLabel(r){if(!i(r))throw Error(`<mg-progress> prop "label" must be a valid string. Passed value: ${o(r)}.`)}watchAriaRole(r){if(r&&!l.includes(r))throw Error(`<mg-progress> prop "ariaRole" must be one of: ${l.join(", ")}. Passed value: ${o(r)}.`)}watchValue(r){if(!(void 0===r||c(r)&&r>=this.min&&r<=this.max))throw Error(`<mg-progress> prop “value” must be a number within the range ${this.min} to ${this.max}. Passed value: ${o(r)}.`)}watchMin(r){if(0!==r&&void 0!==r&&(!c(r)||r>=this.max))throw Error(`<mg-progress> prop “min” must be a number lower than: ${this.max}. Passed value: ${o(r)}.`)}watchMax(r){if(100!==r&&void 0!==r&&(!c(r)||r<=this.min))throw Error(`<mg-progress> prop “max” must be a number greater than: ${this.min}. Passed value: ${o(r)}.`)}componentWillLoad(){this.watchLabel(this.label),this.watchAriaRole(this.ariaRole),this.watchMin(this.min),this.watchMax(this.max),this.watchValue(this.value)}render(){return a(t,{key:"e6d254a68f35c5019158ab17fcb0e4dfd1943ef8",role:this.ariaRole,"aria-label":this.label,"aria-valuenow":this.value,"aria-valuemin":this.min,"aria-valuemax":this.max},a("div",{key:"5b427579ad97336076504a45013a0be00673f9a9",class:"mg-c-progress"},a("div",{key:"76dbdf88550caf51890e10c45c034d73cd02db5d",class:{"mg-c-progress__bar":!0,"mg-c-progress__bar--active":this.value>this.min}},a("div",{key:"b0ab6f784cdb8cc25a40b83a0d97bcda5b5c1f9b",class:"mg-c-progress__fill",style:{width:Math.round((this.value-this.min)/(this.max-this.min)*100)+"%"}}))))}static get watchers(){return{label:[{watchLabel:0}],ariaRole:[{watchAriaRole:0}],value:[{watchValue:0}],min:[{watchMin:0}],max:[{watchMax:0}]}}static get style(){return".mg-c-progress{min-width:calc(var(--mg-b-size-16)*4)}.mg-c-progress__bar{position:relative;overflow:hidden;height:var(--mg-c-progress-size);border-width:var(--mg-b-size-border);border-style:solid;border-color:var(--mg-c-progress-border-color);border-radius:calc((var(--mg-c-progress-size) + var(--mg-b-size-border)*2)/2);background-color:var(--mg-c-progress-bar-color-background)}.mg-c-progress__fill{height:100%;border-radius:calc((var(--mg-c-progress-size) + var(--mg-b-size-border)*2)/2);transition:width 300ms ease-in-out}.mg-c-progress__bar.mg-c-progress__bar--active .mg-c-progress__fill{background-color:var(--mg-c-progress-fill-color-background)}"}},[1,"mg-progress",{label:[1],ariaRole:[1,"aria-role"],value:[2],min:[2],max:[2]},void 0,{label:[{watchLabel:0}],ariaRole:[{watchAriaRole:0}],value:[{watchValue:0}],min:[{watchMin:0}],max:[{watchMax:0}]}]);function g(){"undefined"!=typeof customElements&&["mg-progress"].forEach((s=>{"mg-progress"===s&&(customElements.get(r(s))||customElements.define(r(s),h))}))}g();const m=h,b=g;export{m as MgProgress,b as defineCustomElement}
+import{transformTag as r,proxyCustomElement as e,HTMLElement as s,h as a,Host as t}from"@stencil/core/internal/client";import{i,t as o,q as c}from"./index2.js";const l=["progressbar","meter"],h=e(class extends s{constructor(r){super(),!1!==r&&this.__registerHost(),this.__attachShadow(),this.ariaRole="progressbar",this.value=0,this.min=0,this.max=100}watchLabel(r){if(!i(r))throw Error(`<mg-progress> prop "label" must be a valid string. Passed value: ${o(r)}.`)}watchAriaRole(r){if(r&&!l.includes(r))throw Error(`<mg-progress> prop "ariaRole" must be one of: ${l.join(", ")}. Passed value: ${o(r)}.`)}watchValue(r){if(!(void 0===r||c(r)&&r>=this.min&&r<=this.max))throw Error(`<mg-progress> prop “value” must be a number within the range ${this.min} to ${this.max}. Passed value: ${o(r)}.`)}watchMin(r){if(0!==r&&void 0!==r&&(!c(r)||r>=this.max))throw Error(`<mg-progress> prop “min” must be a number lower than: ${this.max}. Passed value: ${o(r)}.`)}watchMax(r){if(100!==r&&void 0!==r&&(!c(r)||r<=this.min))throw Error(`<mg-progress> prop “max” must be a number greater than: ${this.min}. Passed value: ${o(r)}.`)}componentWillLoad(){this.watchLabel(this.label),this.watchAriaRole(this.ariaRole),this.watchMin(this.min),this.watchMax(this.max),this.watchValue(this.value)}render(){return a(t,{key:"02466f9df3e5204eef158b9f733ba0af811ad9ed",role:this.ariaRole,"aria-label":this.label,"aria-valuenow":this.value,"aria-valuemin":this.min,"aria-valuemax":this.max},a("div",{key:"88c2eafe55d169502ef5afccfbde3371fee5165f",class:"mg-c-progress"},a("div",{key:"b46159dbed388c58b198bdc330096669c454bcd3",class:{"mg-c-progress__bar":!0,"mg-c-progress__bar--active":this.value>this.min}},a("div",{key:"0faebcc86cc7a55ccab3d9fb8dce4403bff16ebf",class:"mg-c-progress__fill",style:{width:Math.round((this.value-this.min)/(this.max-this.min)*100)+"%"}}))))}static get watchers(){return{label:[{watchLabel:0}],ariaRole:[{watchAriaRole:0}],value:[{watchValue:0}],min:[{watchMin:0}],max:[{watchMax:0}]}}static get style(){return".mg-c-progress{min-width:calc(var(--mg-b-size-16)*4)}.mg-c-progress__bar{position:relative;overflow:hidden;height:var(--mg-c-progress-size);border-width:var(--mg-b-size-border);border-style:solid;border-color:var(--mg-c-progress-border-color);border-radius:calc((var(--mg-c-progress-size) + var(--mg-b-size-border)*2)/2);background-color:var(--mg-c-progress-bar-color-background)}.mg-c-progress__fill{height:100%;border-radius:calc((var(--mg-c-progress-size) + var(--mg-b-size-border)*2)/2);transition:width 300ms ease-in-out}.mg-c-progress__bar.mg-c-progress__bar--active .mg-c-progress__fill{background-color:var(--mg-c-progress-fill-color-background)}"}},[1,"mg-progress",{label:[1],ariaRole:[1,"aria-role"],value:[2],min:[2],max:[2]},void 0,{label:[{watchLabel:0}],ariaRole:[{watchAriaRole:0}],value:[{watchValue:0}],min:[{watchMin:0}],max:[{watchMax:0}]}]);function g(){"undefined"!=typeof customElements&&["mg-progress"].forEach((e=>{"mg-progress"===e&&(customElements.get(r(e))||customElements.define(r(e),h))}))}g();const m=h,b=g;export{m as MgProgress,b as defineCustomElement}

package/dist/components/mg-skip-links.js

@@ -1 +1 @@
-import{transformTag as i,proxyCustomElement as s,HTMLElement as t,createEvent as n,h as e}from"@stencil/core/internal/client";import{i as a}from"./index3.js";import{i as l}from"./index2.js";const r=s(class extends t{constructor(i){super(),!1!==i&&this.__registerHost(),this.__attachShadow(),this.goToAnchor=n(this,"go-to-anchor",7),this.handleLinkCLick=i=>{const s=i.currentTarget;s.blur(),this.goToAnchor.emit(s.getAttribute("href"))}}validateLinks(i){if(void 0===i||0===i.length||i.some((i=>!l(i.href)||!i.href.startsWith("#")||!l(i.label))))throw Error('<mg-skip-links> prop "links": Cannot be empty and each link must contains an href starting with a "#" and a non empty label attributes.')}componentWillLoad(){this.validateLinks(this.links),this.messages=a(this.element).messages}render(){return e("nav",{key:"9df42d332b207abf989ef73f3c83ebbcfcf222a6",class:"mg-c-skip-links",role:"navigation","aria-label":this.messages.skipLinks.navLabel},e("ul",{key:"0185490dbd3dfb08b534a898fe779850ce96c427",class:"mg-c-skip-links__list",role:"list"},this.links.map((i=>e("li",{key:i.href},e("a",{class:"mg-c-skip-links__link",href:i.href,onClick:this.handleLinkCLick},i.label))))))}get element(){return this}static get watchers(){return{links:[{validateLinks:0}]}}static get style(){return".mg-c-skip-links{position:absolute;display:flex;min-height:var(--mg-b-size-56);align-items:center;background:var(--mg-b-color-light);opacity:0;transform:translateY(-100%)}.mg-c-skip-links:focus-within{position:relative;opacity:1;transform:translateY(0)}.mg-c-skip-links__list{display:flex;flex-wrap:wrap;align-items:center;padding:0 var(--mg-b-size-16);margin:0;gap:var(--mg-b-spacing-actions);list-style:none}.mg-c-skip-links__link{display:inline-block;padding:var(--mg-b-size-8) var(--mg-b-size-16);color:var(--mg-b-color-dark)}.mg-c-skip-links__link:hover{background:hsl(var(--mg-b-color-dark-h), var(--mg-b-color-dark-s), var(--mg-b-color-dark-l), 10%)}"}},[1,"mg-skip-links",{links:[16]},void 0,{links:[{validateLinks:0}]}]);function o(){"undefined"!=typeof customElements&&["mg-skip-links"].forEach((s=>{"mg-skip-links"===s&&(customElements.get(i(s))||customElements.define(i(s),r))}))}o();const c=r,k=o;export{c as MgSkipLinks,k as defineCustomElement}
+import{transformTag as i,proxyCustomElement as s,HTMLElement as t,createEvent as n,h as e}from"@stencil/core/internal/client";import{i as a}from"./index3.js";import{i as l}from"./index2.js";const r=s(class extends t{constructor(i){super(),!1!==i&&this.__registerHost(),this.__attachShadow(),this.goToAnchor=n(this,"go-to-anchor",7),this.handleLinkCLick=i=>{const s=i.currentTarget;s.blur(),this.goToAnchor.emit(s.getAttribute("href"))}}validateLinks(i){if(void 0===i||0===i.length||i.some((i=>!l(i.href)||!i.href.startsWith("#")||!l(i.label))))throw Error('<mg-skip-links> prop "links": Cannot be empty and each link must contains an href starting with a "#" and a non empty label attributes.')}componentWillLoad(){this.validateLinks(this.links),this.messages=a(this.element).messages}render(){return e("nav",{key:"b126d6fe3aa2553562fe18a0d4340205e178fbe0",class:"mg-c-skip-links",role:"navigation","aria-label":this.messages.skipLinks.navLabel},e("ul",{key:"1028704238d5119f67cf2e7a77282dec504bbc4f",class:"mg-c-skip-links__list",role:"list"},this.links.map((i=>e("li",{key:i.href},e("a",{class:"mg-c-skip-links__link",href:i.href,onClick:this.handleLinkCLick},i.label))))))}get element(){return this}static get watchers(){return{links:[{validateLinks:0}]}}static get style(){return".mg-c-skip-links{position:absolute;display:flex;min-height:var(--mg-b-size-56);align-items:center;background:var(--mg-b-color-light);opacity:0;transform:translateY(-100%)}.mg-c-skip-links:focus-within{position:relative;opacity:1;transform:translateY(0)}.mg-c-skip-links__list{display:flex;flex-wrap:wrap;align-items:center;padding:0 var(--mg-b-size-16);margin:0;gap:var(--mg-b-spacing-actions);list-style:none}.mg-c-skip-links__link{display:inline-block;padding:var(--mg-b-size-8) var(--mg-b-size-16);color:var(--mg-b-color-dark)}.mg-c-skip-links__link:hover{background:hsl(var(--mg-b-color-dark-h), var(--mg-b-color-dark-s), var(--mg-b-color-dark-l), 10%)}"}},[1,"mg-skip-links",{links:[16]},void 0,{links:[{validateLinks:0}]}]);function o(){"undefined"!=typeof customElements&&["mg-skip-links"].forEach((s=>{"mg-skip-links"===s&&(customElements.get(i(s))||customElements.define(i(s),r))}))}o();const c=r,k=o;export{c as MgSkipLinks,k as defineCustomElement}

package/dist/components/mg-table.js

@@ -1 +1 @@
-import{transformTag as t,proxyCustomElement as e,HTMLElement as a}from"@stencil/core/internal/client";import{C as i,t as o,i as n,c as l}from"./index2.js";import{i as r}from"./index3.js";import{d as s}from"./mg-icon2.js";const c=["small","medium","large","xlarge"],h=["left","center","right"],m=["string","numeric","date"],g=e(class extends a{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.componentClass="mg-c-table",this.componentWrapperClass="mg-c-table-wrapper",this.classFullWidth="mg-c-table--full-width",this.alignmentStylesheet=new CSSStyleSheet,this.size="medium",this.fullWidth=!1,this.classCollection=new i([this.componentClass])}watchSize(t,e){if(!c.includes(t))throw Error(`<mg-table> prop "size" must be one of: ${c.join(", ")}. Passed value: ${o(t)}.`);void 0!==e&&this.classCollection.delete("mg-c-table--size-"+e),this.classCollection.add("mg-c-table--size-"+t)}watchFullWidth(t){t?this.classCollection.add(this.classFullWidth):this.classCollection.delete(this.classFullWidth)}watchColumns(t){if(void 0!==t&&!(t=>"object"==typeof t&&!Array.isArray(t)&&Object.entries(t).every((([t,e])=>!isNaN(parseInt(t))&&"object"==typeof e&&!Array.isArray(e)&&(void 0!==e.align&&h.includes(e.align)||void 0!==e.sortable&&"boolean"==typeof e.sortable||void 0!==e.datatype&&m.includes(e.datatype))&&Object.keys(e).every((t=>["align","sortable","datatype"].includes(t))))))(t))throw Error(`<mg-table> prop "columns" must be a ColumnsType object. Passed value: ${o(t)}.`)}renderTable(t){let e=!1;if(t.className="",t.classList.add(...this.classCollection.classes),void 0!==this.columns){const a=Array.from(t.querySelectorAll("tbody tr"));Object.entries(this.columns).forEach((([i,o])=>{if(void 0!==o.align?this.alignmentStylesheet.insertRule(`.${this.componentClass} th:nth-child(${i}),td:nth-child(${i}){text-align:${o.align};&>*{display:inline-block;}}`):"numeric"===o.datatype&&this.alignmentStylesheet.insertRule(`.${this.componentClass} th:nth-child(${i}),td:nth-child(${i}){text-align:right;&>*{display:inline-block;}}`),o.sortable){e=!0;const n=t.querySelector(`thead td:nth-child(${i}),thead th:nth-child(${i})`),l=document.createElement("button");l.classList.add("mg-c-table__sort-button");const r=n.innerHTML;n.innerHTML="",l.innerHTML=r;const s=document.createElement("mg-icon");s.setAttribute("icon","arrows-up-down"),l.append(s),n.append(l),l.addEventListener("click",(()=>{t.querySelectorAll(`thead td:not(:nth-child(${i})) [aria-pressed],thead th:not(:nth-child(${i})) [aria-pressed]`).forEach((t=>{t.removeAttribute("aria-pressed"),t.querySelector("mg-icon").setAttribute("icon","arrows-up-down")})),t.querySelectorAll(`thead td:not(:nth-child(${i}))[aria-sort],thead th:not(:nth-child(${i}))[aria-sort]`).forEach((t=>{t.removeAttribute("aria-sort")})),l.setAttribute("aria-pressed","true");let e=n.getAttribute("aria-sort");n.setAttribute("aria-sort",[null,"none"].includes(e)?"ascending":"ascending"===e?"descending":"none"),e=n.getAttribute("aria-sort");const r=l.querySelector("mg-icon");let s="arrows-up-down";if("ascending"===e?s="arrow-up":"descending"===e&&(s="arrow-down"),r.setAttribute("icon",s),"none"===e)return void a.forEach((e=>t.querySelector("tbody").append(e)));const c=Array.from(t.querySelectorAll("tbody tr"));c.sort(((t,a)=>{var n,l;const r=t.querySelector(`td:nth-child(${i}),th:nth-child(${i})`),s=a.querySelector(`td:nth-child(${i}),th:nth-child(${i})`);return((t,e,a,i)=>{if(a){const a=t;t=e,e=a}return"date"===i?new Date(t).getTime()-new Date(e).getTime():t.localeCompare(e,void 0,{numeric:"numeric"===i})})(null!==(n=r.dataset.sort)&&void 0!==n?n:r.textContent,null!==(l=s.dataset.sort)&&void 0!==l?l:s.textContent,"descending"===e,o.datatype)})),c.forEach((e=>t.querySelector("tbody").append(e)))}))}}))}this.element.shadowRoot.adoptedStyleSheets.push(this.alignmentStylesheet);const a=document.createElement("div");a.setAttribute("class",this.componentWrapperClass),a.setAttribute("tabindex","0"),a.setAttribute("role","region");let i=t.querySelector("caption");null===i&&e&&(i=document.createElement("caption"),t.prepend(i)),null!==i&&(i.className="mg-u-visually-hidden",n(i.id)||i.setAttribute("id",l(this.componentClass+"-caption")),a.setAttribute("aria-labelledby",i.id),e&&(i.innerHTML=`${i.innerHTML} ${this.messages.table.sortableCaption}`.trim())),a.append(t);const o=this.element.shadowRoot.querySelector("."+this.componentWrapperClass);null!==o&&o.remove(),this.element.shadowRoot.append(a)}componentWillLoad(){this.messages=r(this.element).messages}componentDidLoad(){this.watchSize(this.size),this.watchFullWidth(this.fullWidth),this.watchColumns(this.columns),this.renderTable(this.element.querySelector("table"))}componentWillUpdate(){this.renderTable(this.element.shadowRoot.querySelector("table"))}get element(){return this}static get watchers(){return{size:[{watchSize:0}],fullWidth:[{watchFullWidth:0}],columns:[{watchColumns:0}]}}static get style(){return'.mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip:rect(0.1rem, 0.1rem, 0.1rem, 0.1rem) !important;clip-path:inset(50%) !important;white-space:nowrap !important}*:focus:not(:focus-visible){outline:none}@media (prefers-reduced-motion){*{animation:none !important;transition:none !important}}a{color:inherit;text-decoration:underline}a:hover,a:focus,a:active{text-decoration:none}@font-face{font-family:"Open Sans";src:url("fonts/OpenSans-Regular.ttf") format("truetype")}@font-face{font-family:"Open Sans";font-weight:600;src:url("fonts/OpenSans-SemiBold.ttf") format("truetype")}@font-face{font-family:"Open Sans";font-weight:700;src:url("fonts/OpenSans-Bold.ttf") format("truetype")}p{margin:0}p+p{margin-top:var(--mg-b-size-8)}h1,.mg-u-h1{font-family:var(--mg-b-font-family-heading);font-size:var(--mg-b-font-size-h1);font-weight:bold}h2,.mg-u-h2{font-family:var(--mg-b-font-family-heading);font-size:var(--mg-b-font-size-h2);font-weight:bold}h3,.mg-u-h3{font-family:var(--mg-b-font-family-heading);font-size:var(--mg-b-font-size-h3);font-weight:bold}h4,.mg-u-h4{font-family:var(--mg-b-font-family-heading);font-size:var(--mg-b-font-size-h4);font-weight:bold}h5,.mg-u-h5{font-family:var(--mg-b-font-family-heading);font-size:var(--mg-b-font-size-h5);font-weight:bold}h6,.mg-u-h6{font-family:var(--mg-b-font-family-heading);font-size:var(--mg-b-font-size-h6);font-weight:bold}small{font-size:var(--mg-b-small-font-size)}.mg-u-text-left{text-align:left !important}.mg-u-text-center{text-align:center !important}.mg-u-text-right{text-align:right !important}.mg-c-table{--mg-c-table-cell-spacing:var(--mg-b-size-8) var(--mg-b-size-16);--mg-c-table-cell-height:var(--mg-b-size-40);--mg-c-table-header-cell-height:calc(var(--mg-b-size-min-height) + 2 * var(--mg-b-size-8));overflow:hidden;border:var(--mg-b-size-border) solid var(--mg-b-color-neutral-30);border-radius:var(--mg-b-size-12);background:var(--mg-b-color-light);border-spacing:0;color:var(--mg-b-color-dark)}.mg-c-table td,.mg-c-table th{height:var(--mg-c-table-cell-height);box-sizing:border-box;padding:var(--mg-c-table-cell-spacing);text-align:start}.mg-c-table thead{height:var(--mg-c-table-header-cell-height)}.mg-c-table thead,.mg-c-table tfoot{background-color:var(--mg-b-color-neutral-10)}.mg-c-table thead td,.mg-c-table tfoot td,.mg-c-table th{font-weight:600}.mg-c-table tr th,.mg-c-table tr td{border-block-end:var(--mg-b-size-border) solid var(--mg-b-color-neutral-30)}.mg-c-table tfoot tr:last-of-type th,.mg-c-table tfoot tr:last-of-type td{border-block-end:none}.mg-c-table.mg-c-table--size-small{--mg-c-table-cell-spacing:var(--mg-b-size-4) var(--mg-b-size-16);--mg-c-table-cell-height:var(--mg-b-size-32);--mg-c-table-header-cell-height:var(--mg-b-size-32)}.mg-c-table.mg-c-table--size-large{--mg-c-table-cell-height:var(--mg-c-table-header-cell-height)}.mg-c-table.mg-c-table--size-xlarge{--mg-c-table-cell-spacing:var(--mg-b-size-12) var(--mg-b-size-16);--mg-c-table-cell-height:var(--mg-b-size-64);--mg-c-table-header-cell-height:var(--mg-b-size-64)}.mg-c-table.mg-c-table--full-width{width:100%}.mg-c-table-wrapper{overflow:auto}.mg-c-table thead td,.mg-c-table thead th{position:relative}.mg-c-table thead td .mg-c-table__sort-button,.mg-c-table thead th .mg-c-table__sort-button{display:inline-flex;align-items:center;padding:0;border:none;margin:0;background:none;color:inherit;font-size:inherit;font-weight:600;gap:var(--mg-b-size-4);text-align:left}.mg-c-table thead td .mg-c-table__sort-button::after,.mg-c-table thead th .mg-c-table__sort-button::after{position:absolute;content:"";inset:0}.mg-c-table thead td .mg-c-table__sort-button:hover,.mg-c-table thead th .mg-c-table__sort-button:hover{cursor:pointer}.mg-c-table thead td:has(.mg-c-table__sort-button):hover,.mg-c-table thead td[aria-sort=descending],.mg-c-table thead td[aria-sort=ascending],.mg-c-table thead th:has(.mg-c-table__sort-button):hover,.mg-c-table thead th[aria-sort=descending],.mg-c-table thead th[aria-sort=ascending]{background-color:var(--mg-b-color-neutral-20)}'}},[1,"mg-table",{size:[1],fullWidth:[4,"full-width"],columns:[16],classCollection:[32]},void 0,{size:[{watchSize:0}],fullWidth:[{watchFullWidth:0}],columns:[{watchColumns:0}]}]);function d(){"undefined"!=typeof customElements&&["mg-table","mg-icon"].forEach((e=>{switch(e){case"mg-table":customElements.get(t(e))||customElements.define(t(e),g);break;case"mg-icon":customElements.get(t(e))||s()}}))}d();const b=g,f=d;export{b as MgTable,f as defineCustomElement}
+import{transformTag as t,proxyCustomElement as e,HTMLElement as a}from"@stencil/core/internal/client";import{C as o,t as i,i as r,c as n}from"./index2.js";import{i as l}from"./index3.js";import{d as s}from"./mg-icon2.js";const h=["small","medium","large","xlarge"],c=["left","center","right"],d=["string","numeric","date"],m=e(class extends a{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.componentClass="mg-c-table",this.componentWrapperClass="mg-c-table-wrapper",this.classFullWidth="mg-c-table--full-width",this.classBorderHide="mg-c-table--border-hide",this.alignmentStylesheet=new CSSStyleSheet,this.size="medium",this.fullWidth=!1,this.borderHide=!1,this.classCollection=new o([this.componentClass])}watchSize(t,e){if(!h.includes(t))throw Error(`<mg-table> prop "size" must be one of: ${h.join(", ")}. Passed value: ${i(t)}.`);void 0!==e&&this.classCollection.delete("mg-c-table--size-"+e),this.classCollection.add("mg-c-table--size-"+t)}watchFullWidth(t){t?this.classCollection.add(this.classFullWidth):this.classCollection.delete(this.classFullWidth)}watchBorderHide(t){t?this.classCollection.add(this.classBorderHide):this.classCollection.delete(this.classBorderHide)}watchColumns(t){if(void 0!==t&&!(t=>"object"==typeof t&&!Array.isArray(t)&&Object.entries(t).every((([t,e])=>!isNaN(parseInt(t))&&"object"==typeof e&&!Array.isArray(e)&&(void 0!==e.align&&c.includes(e.align)||void 0!==e.sortable&&"boolean"==typeof e.sortable||void 0!==e.datatype&&d.includes(e.datatype))&&Object.keys(e).every((t=>["align","sortable","datatype"].includes(t))))))(t))throw Error(`<mg-table> prop "columns" must be a ColumnsType object. Passed value: ${i(t)}.`)}renderTable(t){let e=!1;if(t.className="",t.classList.add(...this.classCollection.classes),void 0!==this.columns){const a=Array.from(t.querySelectorAll("tbody tr"));Object.entries(this.columns).forEach((([o,i])=>{if(void 0!==i.align?this.alignmentStylesheet.insertRule(`.${this.componentClass} th:nth-child(${o}),td:nth-child(${o}){text-align:${i.align};&>*{display:inline-block;}}`):"numeric"===i.datatype&&this.alignmentStylesheet.insertRule(`.${this.componentClass} th:nth-child(${o}),td:nth-child(${o}){text-align:right;&>*{display:inline-block;}}`),i.sortable){e=!0;const r=t.querySelector(`thead td:nth-child(${o}),thead th:nth-child(${o})`),n=document.createElement("button");n.classList.add("mg-c-table__sort-button");const l=r.innerHTML;r.innerHTML="",n.innerHTML=l;const s=document.createElement("mg-icon");s.setAttribute("icon","arrows-up-down"),n.append(s),r.append(n),n.addEventListener("click",(()=>{t.querySelectorAll(`thead td:not(:nth-child(${o})) [aria-pressed],thead th:not(:nth-child(${o})) [aria-pressed]`).forEach((t=>{t.removeAttribute("aria-pressed"),t.querySelector("mg-icon").setAttribute("icon","arrows-up-down")})),t.querySelectorAll(`thead td:not(:nth-child(${o}))[aria-sort],thead th:not(:nth-child(${o}))[aria-sort]`).forEach((t=>{t.removeAttribute("aria-sort")})),n.setAttribute("aria-pressed","true");let e=r.getAttribute("aria-sort");r.setAttribute("aria-sort",[null,"none"].includes(e)?"ascending":"ascending"===e?"descending":"none"),e=r.getAttribute("aria-sort");const l=n.querySelector("mg-icon");let s="arrows-up-down";if("ascending"===e?s="arrow-up":"descending"===e&&(s="arrow-down"),l.setAttribute("icon",s),"none"===e)return void a.forEach((e=>t.querySelector("tbody").append(e)));const h=Array.from(t.querySelectorAll("tbody tr"));h.sort(((t,a)=>{var r,n;const l=t.querySelector(`td:nth-child(${o}),th:nth-child(${o})`),s=a.querySelector(`td:nth-child(${o}),th:nth-child(${o})`);return((t,e,a,o)=>{if(a){const a=t;t=e,e=a}return"date"===o?new Date(t).getTime()-new Date(e).getTime():t.localeCompare(e,void 0,{numeric:"numeric"===o})})(null!==(r=l.dataset.sort)&&void 0!==r?r:l.textContent,null!==(n=s.dataset.sort)&&void 0!==n?n:s.textContent,"descending"===e,i.datatype)})),h.forEach((e=>t.querySelector("tbody").append(e)))}))}}))}this.element.shadowRoot.adoptedStyleSheets.push(this.alignmentStylesheet);const a=document.createElement("div");a.setAttribute("class",this.componentWrapperClass),a.setAttribute("tabindex","0"),a.setAttribute("role","region");let o=t.querySelector("caption");null===o&&e&&(o=document.createElement("caption"),t.prepend(o)),null!==o&&(o.className="mg-u-visually-hidden",r(o.id)||o.setAttribute("id",n(this.componentClass+"-caption")),a.setAttribute("aria-labelledby",o.id),e&&(o.innerHTML=`${o.innerHTML} ${this.messages.table.sortableCaption}`.trim())),a.append(t);const i=this.element.shadowRoot.querySelector("."+this.componentWrapperClass);null!==i&&i.remove(),this.element.shadowRoot.append(a)}componentWillLoad(){this.messages=l(this.element).messages}componentDidLoad(){this.watchSize(this.size),this.watchFullWidth(this.fullWidth),this.watchBorderHide(this.borderHide),this.watchColumns(this.columns),this.renderTable(this.element.querySelector("table"))}componentWillUpdate(){this.renderTable(this.element.shadowRoot.querySelector("table"))}get element(){return this}static get watchers(){return{size:[{watchSize:0}],fullWidth:[{watchFullWidth:0}],borderHide:[{watchBorderHide:0}],columns:[{watchColumns:0}]}}static get style(){return'.mg-u-visually-hidden{position:absolute !important;overflow:hidden !important;width:.1rem !important;height:.1rem !important;padding:0 !important;border:0 !important;margin:-0.1rem !important;clip:rect(0.1rem, 0.1rem, 0.1rem, 0.1rem) !important;clip-path:inset(50%) !important;white-space:nowrap !important}*:focus:not(:focus-visible){outline:none}@media (prefers-reduced-motion){*{animation:none !important;transition:none !important}}a{color:inherit;text-decoration:underline}a:hover,a:focus,a:active{text-decoration:none}@font-face{font-family:"Open Sans";src:url("fonts/OpenSans-Regular.ttf") format("truetype")}@font-face{font-family:"Open Sans";font-weight:600;src:url("fonts/OpenSans-SemiBold.ttf") format("truetype")}@font-face{font-family:"Open Sans";font-weight:700;src:url("fonts/OpenSans-Bold.ttf") format("truetype")}p{margin:0}p+p{margin-top:var(--mg-b-size-8)}h1,.mg-u-h1{font-family:var(--mg-b-font-family-heading);font-size:var(--mg-b-font-size-h1);font-weight:bold}h2,.mg-u-h2{font-family:var(--mg-b-font-family-heading);font-size:var(--mg-b-font-size-h2);font-weight:bold}h3,.mg-u-h3{font-family:var(--mg-b-font-family-heading);font-size:var(--mg-b-font-size-h3);font-weight:bold}h4,.mg-u-h4{font-family:var(--mg-b-font-family-heading);font-size:var(--mg-b-font-size-h4);font-weight:bold}h5,.mg-u-h5{font-family:var(--mg-b-font-family-heading);font-size:var(--mg-b-font-size-h5);font-weight:bold}h6,.mg-u-h6{font-family:var(--mg-b-font-family-heading);font-size:var(--mg-b-font-size-h6);font-weight:bold}small{font-size:var(--mg-b-small-font-size)}.mg-u-text-left{text-align:left !important}.mg-u-text-center{text-align:center !important}.mg-u-text-right{text-align:right !important}.mg-c-table{--mg-c-table-cell-spacing:var(--mg-b-size-8) var(--mg-b-size-16);--mg-c-table-cell-height:var(--mg-b-size-40);overflow:hidden;border:var(--mg-b-size-border) solid var(--mg-b-color-neutral-30);border-radius:var(--mg-b-size-12);background:var(--mg-b-color-light);border-spacing:0;color:var(--mg-b-color-dark)}.mg-c-table td,.mg-c-table th{height:var(--mg-c-table-cell-height);box-sizing:border-box;padding:var(--mg-c-table-cell-spacing);text-align:start}.mg-c-table thead{height:var(--mg-c-table-header-cell-height)}.mg-c-table thead,.mg-c-table tfoot{background-color:var(--mg-c-table-color-head-foot-background, var(--mg-b-color-neutral-10));color:var(--mg-b-color-neutral-90)}.mg-c-table tfoot tr:first-of-type :where(th,td){border-block-start:var(--mg-b-size-border) solid var(--mg-b-color-neutral-30)}.mg-c-table thead td,.mg-c-table tfoot td,.mg-c-table th{font-weight:600}.mg-c-table tr :where(th,td){border-block-end:var(--mg-b-size-border) solid var(--mg-b-color-neutral-30)}.mg-c-table tbody:last-of-type tr:last-of-type :where(th,td),.mg-c-table tfoot tr:last-of-type :where(th,td){border-block-end:none}.mg-c-table tfoot :where(th,td)[rowspan][scope=rowgroup],.mg-c-table tbody:last-of-type :where(th,td)[rowspan][scope=rowgroup]{border-block-end:none}.mg-c-table.mg-c-table--size-small{--mg-c-table-cell-spacing:var(--mg-b-size-4) var(--mg-b-size-16);--mg-c-table-cell-height:var(--mg-b-size-32)}.mg-c-table.mg-c-table--size-large{--mg-c-table-cell-height:calc(var(--mg-b-size-min-height) + 2 * var(--mg-b-size-8))}.mg-c-table.mg-c-table--size-xlarge{--mg-c-table-cell-spacing:var(--mg-b-size-12) var(--mg-b-size-16);--mg-c-table-cell-height:var(--mg-b-size-64)}.mg-c-table.mg-c-table--full-width{width:100%}.mg-c-table.mg-c-table--border-hide{border:unset;border-radius:unset}.mg-c-table-wrapper{overflow:auto}.mg-c-table thead td,.mg-c-table thead th{position:relative}.mg-c-table thead td .mg-c-table__sort-button,.mg-c-table thead th .mg-c-table__sort-button{display:inline-flex;align-items:center;padding:0;border:none;margin:0;background:none;color:inherit;font-size:inherit;font-weight:600;gap:var(--mg-b-size-4);text-align:left}.mg-c-table thead td .mg-c-table__sort-button::after,.mg-c-table thead th .mg-c-table__sort-button::after{position:absolute;content:"";inset:0}.mg-c-table thead td .mg-c-table__sort-button:hover,.mg-c-table thead th .mg-c-table__sort-button:hover{cursor:pointer}.mg-c-table thead td:has(.mg-c-table__sort-button):hover,.mg-c-table thead td[aria-sort=descending],.mg-c-table thead td[aria-sort=ascending],.mg-c-table thead th:has(.mg-c-table__sort-button):hover,.mg-c-table thead th[aria-sort=descending],.mg-c-table thead th[aria-sort=ascending]{background-color:var(--mg-b-color-neutral-20)}'}},[1,"mg-table",{size:[1],fullWidth:[4,"full-width"],borderHide:[4,"border-hide"],columns:[16],classCollection:[32]},void 0,{size:[{watchSize:0}],fullWidth:[{watchFullWidth:0}],borderHide:[{watchBorderHide:0}],columns:[{watchColumns:0}]}]);function g(){"undefined"!=typeof customElements&&["mg-table","mg-icon"].forEach((e=>{switch(e){case"mg-table":customElements.get(t(e))||customElements.define(t(e),m);break;case"mg-icon":customElements.get(t(e))||s()}}))}g();const b=m,f=g;export{b as MgTable,f as defineCustomElement}

package/dist/components/mg-tabs2.js

@@ -1 +1 @@
-import{transformTag as t,proxyCustomElement as a,HTMLElement as i,createEvent as s,h as e}from"@stencil/core/internal/client";import{c as n,C as o,n as b,a as g,t as m,i as c,d as r}from"./index2.js";import{K as l}from"./events.utils.js";import{d}from"./mg-badge2.js";import{d as h}from"./mg-icon2.js";const v={VISIBLE:"visible",HIDDEN:"hidden",DISABLED:"disabled",ACTIVE:"active"},_=["medium","large"],u=t=>"object"==typeof t&&"string"==typeof t.label,z=a(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.activeTabChange=s(this,"active-tab-change",7),this.tabPanel="panel",this.buttonTabBaseClass="mg-c-tabs__navigation-button",this.startIndex=1,this.identifier=n("mg-tabs"),this.size="medium",this.tabs=[],this.classCollection=new o(["mg-c-tabs"]),this.isActivableTab=t=>[void 0,v.ACTIVE,v.VISIBLE].includes(t.status),this.tabHasStatus=(t,a)=>t.status===a,this.getElementId=(t,a)=>`${t}-${this.getTabItemIndex(a)}`,this.getTabItemIndex=t=>t+this.startIndex,this.handleClick=t=>{const a=t.currentTarget.dataset.index;this.isActivableTab(this.tabs[Number(a)-this.startIndex])?(this.activeTab=Number(a),this.tabFocus=void 0):t.preventDefault()},this.getNavigationButtonClass=t=>`${this.buttonTabBaseClass}--${t}`,this.handleKeydown=t=>{const a=t.target.parentElement;if([l.ARROWLEFT,l.ARROWRIGHT].includes(t.key)){this.tabFocus=Number(t.target.dataset.index),a.querySelector(`[data-index="${this.tabFocus}"]`).setAttribute("tabindex","-1"),t.key===l.ARROWRIGHT?(this.tabFocus++,this.tabFocus>this.tabs.length&&(this.tabFocus=this.startIndex)):t.key===l.ARROWLEFT&&(this.tabFocus--,this.tabFocus<this.startIndex&&(this.tabFocus=this.tabs.length));const i=a.querySelector(`[data-index="${this.tabFocus}"]`);this.tabHasStatus(this.tabs[this.tabFocus-1],v.HIDDEN)?i.dispatchEvent(new KeyboardEvent("keydown",{key:t.key,bubbles:!0})):(i.setAttribute("tabindex","0"),i.focus())}else t.key===l.TAB&&this.resetFocus()},this.handleDocumentClick=t=>{t.target.closest("mg-tabs")!==this.element&&this.resetFocus()},this.resetFocus=()=>{b((()=>{this.tabFocus=void 0,Array.from(this.element.shadowRoot.querySelectorAll("[data-index]")).forEach(((t,a)=>{t.setAttribute("tabindex",this.activeTab-this.startIndex!==a?"-1":"0")}))}))},this.validateSlots=()=>{if(Array.from(this.element.children).filter((t=>{var a;return null===(a=t.getAttribute("slot"))||void 0===a?void 0:a.includes("tab_content-")})).length!==this.tabs.length)throw new Error("<mg-tabs> Must have slots counts equal to tabs count.")}}watchIdentifier(t){g(t)||console.error(`<mg-tabs> prop "identifier" value is invalid. Passed value: ${m(t)}.`)}validateLabel(t){if(!c(t))throw new Error(`<mg-tabs> prop "label" is required and must be a string. Passed value: ${m(t)}.`)}validateSize(t){if(!_.includes(t))throw new Error(`<mg-tabs> prop "size" must be one of: ${_.join(", ")}. Passed value: ${m(t)}.`);this.classCollection.add(`mg-c-tabs--size-${this.size}`)}validateItems(t){if(r(t))this.tabs=t.map((t=>({label:t,status:v.VISIBLE})));else{if(!(Array.isArray(t)&&t.length>0&&t.every(u)))throw new Error(`<mg-tabs> prop "items" is required and all items must be the same type: TabItem. Passed value: ${m(t)}.`);this.tabs=t}}validateActiveTab(t){if(void 0===t)this.activeTab=this.tabs.some((t=>this.tabHasStatus(t,v.ACTIVE)))?this.getTabItemIndex(this.tabs.findIndex((t=>this.tabHasStatus(t,v.ACTIVE)))):this.startIndex;else{if(!("number"==typeof t&&t>=this.startIndex&&t<=this.tabs.length&&this.isActivableTab(this.tabs[t-this.startIndex])))throw new Error(`<mg-tabs> prop "activeTab" must be a number between ${this.startIndex} and ${this.tabs.length} and new value must be "activable". Passed value: ${m(t)}.`);this.tabs.forEach(((a,i)=>{const s=i===t-this.startIndex;this.tabHasStatus(a,v.ACTIVE)&&!s?a.status=v.VISIBLE:this.isActivableTab(a)&&s&&(a.status=v.ACTIVE)})),this.activeTabChange.emit(t)}}componentWillLoad(){this.watchIdentifier(this.identifier),this.validateLabel(this.label),this.validateItems(this.items),this.validateActiveTab(this.activeTab),this.validateSize(this.size),this.validateSlots()}componentDidLoad(){document.addEventListener("click",this.handleDocumentClick,!1)}disconnectedCallback(){document.removeEventListener("keydown",this.handleDocumentClick)}render(){return e("div",{key:"06dd97d9d4e77f606dee3c4a8960b51265345666",class:this.classCollection.join()},e("header",{key:"ea3771bdfe8576bb8b443823a2c338a51ed3ba69",role:"tablist","aria-label":this.label,class:"mg-c-tabs__header"},this.tabs.map(((t,a)=>e("button",{key:t.label,role:"tab",id:this.getElementId(this.identifier,a),class:{[`${this.buttonTabBaseClass}`]:!0,[`${this.buttonTabBaseClass}--horizontal`]:!0,[`${this.getNavigationButtonClass(v.ACTIVE)}`]:this.tabHasStatus(t,v.ACTIVE),[`${this.getNavigationButtonClass(v.DISABLED)}`]:this.tabHasStatus(t,v.DISABLED),[`${this.getNavigationButtonClass(v.HIDDEN)}`]:this.tabHasStatus(t,v.HIDDEN)},tabindex:this.tabHasStatus(t,v.ACTIVE)?0:-1,"aria-selected":this.tabHasStatus(t,v.ACTIVE).toString(),"aria-controls":this.getElementId(this.tabPanel,a),"aria-disabled":this.tabHasStatus(t,v.DISABLED),onClick:this.handleClick,onKeyDown:this.handleKeydown,"data-index":this.getTabItemIndex(a)},void 0!==t.icon&&e("mg-icon",{icon:t.icon}),t.label,void 0!==t.badge&&e("mg-badge",{variant:"text-color",value:t.badge.value,label:t.badge.label,outline:"information"===t.badge.role}))))),this.tabs.map(((t,a)=>e("article",{key:t.label,role:"tabpanel",id:this.getElementId(this.tabPanel,a),hidden:!this.tabHasStatus(t,v.ACTIVE),"aria-labelledby":this.getElementId(this.identifier,a),tabindex:this.tabHasStatus(t,v.ACTIVE)?0:-1,class:"mg-c-tabs__content-container"},e("slot",{name:this.getElementId("tab_content",a)})))))}get element(){return this}static get watchers(){return{identifier:[{watchIdentifier:0}],label:[{validateLabel:0}],size:[{validateSize:0}],items:[{validateItems:0}],activeTab:[{validateActiveTab:0}]}}static get style(){return".mg-c-tabs.mg-c-tabs--size-medium .mg-c-tabs__navigation-button,.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--size-medium{padding:var(--mg-b-size-12) var(--mg-b-size-16)}.mg-c-tabs.mg-c-tabs--size-medium .mg-c-tabs__navigation-button,.mg-c-tabs.mg-c-tabs--size-medium .mg-c-tabs__navigation-button ::slotted([slot=label]),.mg-c-tabs.mg-c-tabs--size-medium .mg-c-tabs__navigation-button ::slotted([slot=metadata]),.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--size-medium,.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--size-medium ::slotted([slot=label]),.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--size-medium ::slotted([slot=metadata]){font-size:var(--mg-b-font-size)}.mg-c-tabs.mg-c-tabs--size-medium .mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--horizontal,.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--size-medium.mg-c-tabs__navigation-button--horizontal{padding-bottom:var(--mg-b-size-12)}.mg-c-tabs.mg-c-tabs--size-medium .mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--vertical,.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--size-medium.mg-c-tabs__navigation-button--vertical{padding-left:var(--mg-b-size-16)}.mg-c-tabs.mg-c-tabs--size-large .mg-c-tabs__navigation-button,.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--size-large{padding:var(--mg-b-size-16) var(--mg-b-size-32)}.mg-c-tabs.mg-c-tabs--size-large .mg-c-tabs__navigation-button,.mg-c-tabs.mg-c-tabs--size-large .mg-c-tabs__navigation-button ::slotted([slot=label]),.mg-c-tabs.mg-c-tabs--size-large .mg-c-tabs__navigation-button ::slotted([slot=metadata]),.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--size-large,.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--size-large ::slotted([slot=label]),.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--size-large ::slotted([slot=metadata]){font-size:var(--mg-b-font-size-h4)}.mg-c-tabs.mg-c-tabs--size-large .mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--horizontal,.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--size-large.mg-c-tabs__navigation-button--horizontal{padding-bottom:var(--mg-b-size-16)}.mg-c-tabs.mg-c-tabs--size-large .mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--vertical,.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--size-large.mg-c-tabs__navigation-button--vertical{padding-left:var(--mg-b-size-32)}.mg-c-tabs__navigation-button{display:flex;box-sizing:border-box;align-items:center;border:none;background-color:unset;color:var(--mg-c-tabs-color-text, var(--mg-b-color-dark));column-gap:var(--mg-c-tabs-navigation-button-column-gap, var(--mg-b-size-8));cursor:pointer;font-family:var(--mg-b-font-family);font-weight:400;line-height:var(--mg-b-line-height);text-decoration:none;white-space:nowrap}.mg-c-tabs__navigation-button:disabled,.mg-c-tabs__navigation-button--disabled{cursor:default;opacity:var(--mg-b-opacity-element-disabled)}.mg-c-tabs__navigation-button:focus-visible{z-index:10}.mg-c-tabs__navigation-button:hover:not(.mg-c-tabs__navigation-button--disabled),.mg-c-tabs__navigation-button:focus-visible:not(.mg-c-tabs__navigation-button--disabled){background-color:color-mix(in srgb, var(--mg-c-tabs-color), transparent 90%)}.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--active{color:var(--mg-c-tabs-color);font-weight:600}.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--active.mg-c-tabs__navigation-button--horizontal{box-shadow:inset 0 calc(-1*var(--mg-b-size-4)) var(--mg-c-tabs-color)}.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--active.mg-c-tabs__navigation-button--vertical{box-shadow:inset var(--mg-b-size-4) 0 var(--mg-c-tabs-color)}.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--hidden{display:none}.mg-c-tabs__header{display:flex;flex-flow:row wrap;border-bottom:var(--mg-b-size-border) solid color-mix(in srgb, var(--mg-c-tabs-color), transparent 90%)}.mg-c-tabs__content-container:focus-visible{outline:none}.mg-c-tabs__navigation-button-text{flex:0 0 content}"}},[257,"mg-tabs",{identifier:[1],label:[1],size:[1],items:[16],activeTab:[1538,"active-tab"],tabs:[32],classCollection:[32]},void 0,{identifier:[{watchIdentifier:0}],label:[{validateLabel:0}],size:[{validateSize:0}],items:[{validateItems:0}],activeTab:[{validateActiveTab:0}]}]);function f(){"undefined"!=typeof customElements&&["mg-tabs","mg-badge","mg-icon"].forEach((a=>{switch(a){case"mg-tabs":customElements.get(t(a))||customElements.define(t(a),z);break;case"mg-badge":customElements.get(t(a))||d();break;case"mg-icon":customElements.get(t(a))||h()}}))}f();export{z as M,v as S,f as d}
+import{transformTag as t,proxyCustomElement as a,HTMLElement as i,createEvent as s,h as e}from"@stencil/core/internal/client";import{c as o,C as n,n as r,a as b,t as c,i as g,d as h}from"./index2.js";import{K as l}from"./events.utils.js";import{d as m}from"./mg-badge2.js";import{d}from"./mg-icon2.js";const v={VISIBLE:"visible",HIDDEN:"hidden",DISABLED:"disabled",ACTIVE:"active"},u=t=>"object"==typeof t&&"string"==typeof t.label,_=a(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.activeTabChange=s(this,"active-tab-change",7),this.tabPanel="panel",this.buttonTabBaseClass="mg-c-tabs__navigation-button",this.startIndex=1,this.identifier=o("mg-tabs"),this.tabs=[],this.classCollection=new n(["mg-c-tabs"]),this.isActivableTab=t=>[void 0,v.ACTIVE,v.VISIBLE].includes(t.status),this.tabHasStatus=(t,a)=>t.status===a,this.getElementId=(t,a)=>`${t}-${this.getTabItemIndex(a)}`,this.getTabItemIndex=t=>t+this.startIndex,this.handleClick=t=>{const a=t.currentTarget.dataset.index;this.isActivableTab(this.tabs[Number(a)-this.startIndex])?(this.activeTab=Number(a),this.tabFocus=void 0):t.preventDefault()},this.getNavigationButtonClass=t=>`${this.buttonTabBaseClass}--${t}`,this.handleKeydown=t=>{const a=t.target.parentElement;if([l.ARROWLEFT,l.ARROWRIGHT].includes(t.key)){this.tabFocus=Number(t.target.dataset.index),a.querySelector(`[data-index="${this.tabFocus}"]`).setAttribute("tabindex","-1"),t.key===l.ARROWRIGHT?(this.tabFocus++,this.tabFocus>this.tabs.length&&(this.tabFocus=this.startIndex)):t.key===l.ARROWLEFT&&(this.tabFocus--,this.tabFocus<this.startIndex&&(this.tabFocus=this.tabs.length));const i=a.querySelector(`[data-index="${this.tabFocus}"]`);this.tabHasStatus(this.tabs[this.tabFocus-1],v.HIDDEN)?i.dispatchEvent(new KeyboardEvent("keydown",{key:t.key,bubbles:!0})):(i.setAttribute("tabindex","0"),i.focus())}else t.key===l.TAB&&this.resetFocus()},this.handleDocumentClick=t=>{t.target.closest("mg-tabs")!==this.element&&this.resetFocus()},this.resetFocus=()=>{r((()=>{this.tabFocus=void 0,Array.from(this.element.shadowRoot.querySelectorAll("[data-index]")).forEach(((t,a)=>{t.setAttribute("tabindex",this.activeTab-this.startIndex!==a?"-1":"0")}))}))},this.validateSlots=()=>{if(Array.from(this.element.children).filter((t=>{var a;return null===(a=t.getAttribute("slot"))||void 0===a?void 0:a.includes("tab_content-")})).length!==this.tabs.length)throw new Error("<mg-tabs> Must have slots counts equal to tabs count.")}}watchIdentifier(t){b(t)||console.error(`<mg-tabs> prop "identifier" value is invalid. Passed value: ${c(t)}.`)}validateLabel(t){if(!g(t))throw new Error(`<mg-tabs> prop "label" is required and must be a string. Passed value: ${c(t)}.`)}validateItems(t){if(h(t))this.tabs=t.map((t=>({label:t,status:v.VISIBLE})));else{if(!(Array.isArray(t)&&t.length>0&&t.every(u)))throw new Error(`<mg-tabs> prop "items" is required and all items must be the same type: TabItem. Passed value: ${c(t)}.`);this.tabs=t}}validateActiveTab(t){if(void 0===t)this.activeTab=this.tabs.some((t=>this.tabHasStatus(t,v.ACTIVE)))?this.getTabItemIndex(this.tabs.findIndex((t=>this.tabHasStatus(t,v.ACTIVE)))):this.startIndex;else{if(!("number"==typeof t&&t>=this.startIndex&&t<=this.tabs.length&&this.isActivableTab(this.tabs[t-this.startIndex])))throw new Error(`<mg-tabs> prop "activeTab" must be a number between ${this.startIndex} and ${this.tabs.length} and new value must be "activable". Passed value: ${c(t)}.`);this.tabs.forEach(((a,i)=>{const s=i===t-this.startIndex;this.tabHasStatus(a,v.ACTIVE)&&!s?a.status=v.VISIBLE:this.isActivableTab(a)&&s&&(a.status=v.ACTIVE)})),this.activeTabChange.emit(t)}}componentWillLoad(){this.watchIdentifier(this.identifier),this.validateLabel(this.label),this.validateItems(this.items),this.validateActiveTab(this.activeTab),this.validateSlots()}componentDidLoad(){document.addEventListener("click",this.handleDocumentClick,!1)}disconnectedCallback(){document.removeEventListener("keydown",this.handleDocumentClick)}render(){return e("div",{key:"c971ca94267dd64a173740d9d7a81c0ea00852b9",class:this.classCollection.join()},e("header",{key:"d160fdca50842a310fe2b710f8ffcc6f7cd1bd3d",role:"tablist","aria-label":this.label,class:"mg-c-tabs__header"},this.tabs.map(((t,a)=>e("button",{key:t.label,role:"tab",id:this.getElementId(this.identifier,a),class:{[`${this.buttonTabBaseClass}`]:!0,[`${this.buttonTabBaseClass}--horizontal`]:!0,[`${this.getNavigationButtonClass(v.ACTIVE)}`]:this.tabHasStatus(t,v.ACTIVE),[`${this.getNavigationButtonClass(v.DISABLED)}`]:this.tabHasStatus(t,v.DISABLED),[`${this.getNavigationButtonClass(v.HIDDEN)}`]:this.tabHasStatus(t,v.HIDDEN)},tabindex:this.tabHasStatus(t,v.ACTIVE)?0:-1,"aria-selected":this.tabHasStatus(t,v.ACTIVE).toString(),"aria-controls":this.getElementId(this.tabPanel,a),"aria-disabled":this.tabHasStatus(t,v.DISABLED),onClick:this.handleClick,onKeyDown:this.handleKeydown,"data-index":this.getTabItemIndex(a)},void 0!==t.icon&&e("mg-icon",{icon:t.icon,size:"small"}),t.label,void 0!==t.badge&&e("mg-badge",{variant:"text-color",value:t.badge.value,label:t.badge.label,outline:"information"===t.badge.role}))))),this.tabs.map(((t,a)=>e("article",{key:t.label,role:"tabpanel",id:this.getElementId(this.tabPanel,a),hidden:!this.tabHasStatus(t,v.ACTIVE),"aria-labelledby":this.getElementId(this.identifier,a),tabindex:this.tabHasStatus(t,v.ACTIVE)?0:-1,class:"mg-c-tabs__content-container"},e("slot",{name:this.getElementId("tab_content",a)})))))}get element(){return this}static get watchers(){return{identifier:[{watchIdentifier:0}],label:[{validateLabel:0}],items:[{validateItems:0}],activeTab:[{validateActiveTab:0}]}}static get style(){return'.mg-c-tabs__navigation-button{position:relative;display:flex;height:calc(var(--mg-c-tabs-button-spacing-vertical)*2 + var(--mg-c-tabs-height));box-sizing:border-box;align-items:center;padding:var(--mg-c-tabs-button-spacing-vertical) calc(var(--mg-c-tabs-button-margin-horizontal) + var(--mg-c-tabs-button-padding-horizontal)) var(--mg-c-tabs-button-spacing-vertical) calc(var(--mg-c-tabs-button-margin-horizontal) + var(--mg-c-tabs-button-padding-horizontal));border:none;border-radius:var(--mg-b-size-8);background-color:unset;color:var(--mg-c-tabs-color-text, var(--mg-b-color-dark));column-gap:var(--mg-b-size-8);cursor:pointer;font-family:var(--mg-b-font-family);font-weight:400;line-height:var(--mg-b-line-height);text-decoration:none;white-space:nowrap}.mg-c-tabs__navigation-button::after{position:absolute;background-color:var(--mg-c-tabs-color);content:""}.mg-c-tabs__navigation-button:disabled,.mg-c-tabs__navigation-button--disabled{cursor:default;opacity:var(--mg-b-opacity-element-disabled)}.mg-c-tabs__navigation-button:hover,.mg-c-tabs__navigation-button:focus-visible{z-index:10}.mg-c-tabs__navigation-button:hover:not(.mg-c-tabs__navigation-button--disabled)::before,.mg-c-tabs__navigation-button:focus-visible:not(.mg-c-tabs__navigation-button--disabled)::before{position:absolute;z-index:-1;top:0;left:0;width:stretch;height:var(--mg-c-tabs-height);box-sizing:border-box;border-radius:var(--mg-b-size-8);margin-right:var(--mg-c-tabs-button-margin-horizontal);margin-left:var(--mg-c-tabs-button-margin-horizontal);background-color:color-mix(in srgb, var(--mg-c-tabs-color-text, var(--mg-b-color-dark)), transparent 90%);content:""}.mg-c-tabs__navigation-button,.mg-c-tabs__navigation-button ::slotted([slot=label]),.mg-c-tabs__navigation-button ::slotted([slot=metadata]){font-size:var(--mg-b-font-size)}.mg-c-tabs__navigation-button:not(.mg-c-tabs__navigation-button--disabled).mg-c-tabs__navigation-button--horizontal::before{margin:var(--mg-c-tabs-button-spacing-vertical) var(--mg-c-tabs-button-margin-horizontal)}.mg-c-tabs__navigation-button:not(.mg-c-tabs__navigation-button--disabled).mg-c-tabs__navigation-button--vertical::before{height:100%;margin:0 var(--mg-c-tabs-button-margin-horizontal)}.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--active{color:var(--mg-c-tabs-color);font-weight:600}.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--active.mg-c-tabs__navigation-button--horizontal::after{bottom:0;left:50%;width:calc(100% - var(--mg-b-size-12)*2);height:var(--mg-b-size-4);border-top-left-radius:var(--mg-b-size-8);border-top-right-radius:var(--mg-b-size-8);transform:translateX(-50%)}.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--active.mg-c-tabs__navigation-button--vertical::after{top:50%;left:0;width:var(--mg-b-size-4);height:calc(100% - var(--mg-b-size-8)*2);border-bottom-right-radius:var(--mg-b-size-8);border-top-right-radius:var(--mg-b-size-8);transform:translateY(-50%)}.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--hidden{display:none}.mg-c-tabs__header{display:flex;flex-flow:row wrap;border-bottom:var(--mg-b-size-border) solid var(--mg-b-color-neutral-30)}.mg-c-tabs__content-container:focus-visible{outline:none}.mg-c-tabs__navigation-button-text{flex:0 0 content}.mg-c-tabs__navigation-button.mg-c-tabs__navigation-button--horizontal{--mg-c-tabs-height:var(--mg-b-size-24);--mg-c-tabs-button-spacing-vertical:var(--mg-b-size-8);--mg-c-tabs-button-margin-horizontal:var(--mg-b-size-4);--mg-c-tabs-button-padding-horizontal:var(--mg-b-size-8)}'}},[257,"mg-tabs",{identifier:[1],label:[1],size:[16],items:[16],activeTab:[1538,"active-tab"],tabs:[32],classCollection:[32]},void 0,{identifier:[{watchIdentifier:0}],label:[{validateLabel:0}],items:[{validateItems:0}],activeTab:[{validateActiveTab:0}]}]);function f(){"undefined"!=typeof customElements&&["mg-tabs","mg-badge","mg-icon"].forEach((a=>{switch(a){case"mg-tabs":customElements.get(t(a))||customElements.define(t(a),_);break;case"mg-badge":customElements.get(t(a))||m();break;case"mg-icon":customElements.get(t(a))||d()}}))}f();export{_ as M,v as S,f as d}

package/dist/components/mg-tag.js

@@ -1 +1 @@
-import{transformTag as o,proxyCustomElement as r,HTMLElement as g,h as a}from"@stencil/core/internal/client";import{C as t,t as c,i as e}from"./index2.js";const l=["primary","secondary","success","warning","danger","info"],n=r(class extends g{constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow(),this.classOutline="mg-c-tag--outline",this.classSoft="mg-c-tag--soft",this.variant="primary",this.outline=!1,this.soft=!1,this.classCollection=new t(["mg-c-tag"])}validateVariant(o,r){if(!l.includes(o))throw Error(`<mg-tag> prop "variant" must be one of: ${l.join(", ")}. Passed value: ${c(o)}.`);void 0!==r&&this.classCollection.delete("mg-c-tag--"+r),this.classCollection.add("mg-c-tag--"+o)}validateOutline(o){o?this.classCollection.add(this.classOutline):this.classCollection.delete(this.classOutline)}validateSoft(o){if(o&&this.outline)throw Error('<mg-tag> prop "soft" can NOT be used with prop "outline".');o?this.classCollection.add(this.classSoft):this.classCollection.delete(this.classSoft)}validateTextContent(o){if(!e(o))throw Error("<mg-tag> slot must contain a text content.")}componentWillLoad(){this.validateVariant(this.variant),this.validateOutline(this.outline),this.validateSoft(this.soft),this.validateTextContent(this.element.textContent)}render(){return a("span",{key:"8edd72c80d7179fdb5c1c37caeaecb54c086df8c",class:this.classCollection.join()},a("slot",{key:"e6bf4574a943f83856a6a61cba480d54ff153cb3"}))}get element(){return this}static get watchers(){return{variant:[{validateVariant:0}],outline:[{validateOutline:0}],soft:[{validateSoft:0}]}}static get style(){return":host{display:inline-block}.mg-c-tag{display:inline-flex;min-height:var(--mg-c-tag-height);box-sizing:border-box;align-items:center;padding:calc((var(--mg-c-tag-height) - 2*var(--mg-b-size-border) - var(--mg-c-tag-font-size)*var(--mg-b-line-height))/2) calc(var(--mg-b-size-8) - var(--mg-b-size-border));border:var(--mg-b-size-border) solid;border-radius:var(--mg-c-tag-border-radius);font-size:var(--mg-c-tag-font-size);font-weight:600;vertical-align:middle}.mg-c-tag.mg-c-tag--primary{border-color:var(--mg-b-color-neutral-110);background-color:var(--mg-b-color-neutral-110);color:var(--mg-b-color-text-on-primary)}.mg-c-tag.mg-c-tag--primary.mg-c-tag--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-neutral-110)}.mg-c-tag.mg-c-tag--primary.mg-c-tag--soft{border-color:var(--mg-b-color-neutral-20);background-color:var(--mg-b-color-neutral-20);color:var(--mg-b-color-dark);font-weight:400}.mg-c-tag.mg-c-tag--primary.mg-c-tag--soft ::slotted(mg-icon){color:var(--mg-b-color-neutral-110)}.mg-c-tag.mg-c-tag--secondary{border-color:var(--mg-b-color-neutral-10);background-color:var(--mg-b-color-neutral-10);color:var(--mg-b-color-text-on-secondary)}.mg-c-tag.mg-c-tag--secondary.mg-c-tag--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-neutral-10)}.mg-c-tag.mg-c-tag--secondary.mg-c-tag--soft{border-color:var(--mg-b-color-neutral-20);background-color:var(--mg-b-color-neutral-20);color:var(--mg-b-color-dark);font-weight:400}.mg-c-tag.mg-c-tag--secondary.mg-c-tag--soft ::slotted(mg-icon){color:var(--mg-b-color-text-on-secondary)}.mg-c-tag.mg-c-tag--danger{border-color:var(--mg-b-color-danger);background-color:var(--mg-b-color-danger);color:var(--mg-b-color-text-on-danger)}.mg-c-tag.mg-c-tag--danger.mg-c-tag--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-danger)}.mg-c-tag.mg-c-tag--danger.mg-c-tag--soft{border-color:var(--mg-b-color-red-20);background-color:var(--mg-b-color-red-20);color:var(--mg-b-color-dark);font-weight:400}.mg-c-tag.mg-c-tag--danger.mg-c-tag--soft ::slotted(mg-icon){color:var(--mg-b-color-danger)}.mg-c-tag.mg-c-tag--info{border-color:var(--mg-b-color-info);background-color:var(--mg-b-color-info);color:var(--mg-b-color-text-on-info)}.mg-c-tag.mg-c-tag--info.mg-c-tag--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-info)}.mg-c-tag.mg-c-tag--info.mg-c-tag--soft{border-color:var(--mg-b-color-blue-20);background-color:var(--mg-b-color-blue-20);color:var(--mg-b-color-dark);font-weight:400}.mg-c-tag.mg-c-tag--info.mg-c-tag--soft ::slotted(mg-icon){color:var(--mg-b-color-info)}.mg-c-tag.mg-c-tag--success{border-color:var(--mg-b-color-success);background-color:var(--mg-b-color-success);color:var(--mg-b-color-text-on-success)}.mg-c-tag.mg-c-tag--success.mg-c-tag--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-success)}.mg-c-tag.mg-c-tag--success.mg-c-tag--soft{border-color:var(--mg-b-color-green-20);background-color:var(--mg-b-color-green-20);color:var(--mg-b-color-dark);font-weight:400}.mg-c-tag.mg-c-tag--success.mg-c-tag--soft ::slotted(mg-icon){color:var(--mg-b-color-success)}.mg-c-tag.mg-c-tag--warning{border-color:var(--mg-b-color-warning);background-color:var(--mg-b-color-warning);color:var(--mg-b-color-text-on-warning)}.mg-c-tag.mg-c-tag--warning.mg-c-tag--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-warning)}.mg-c-tag.mg-c-tag--warning.mg-c-tag--soft{border-color:var(--mg-b-color-yellow-20);background-color:var(--mg-b-color-yellow-20);color:var(--mg-b-color-dark);font-weight:400}.mg-c-tag.mg-c-tag--warning.mg-c-tag--soft ::slotted(mg-icon){color:var(--mg-b-color-warning)}::slotted(mg-icon){align-self:start;margin-right:var(--mg-b-size-4)}::slotted(mg-icon[size=small]){margin-top:calc(var(--mg-b-line-height)*1rem - var(--mg-b-size-12))}slot{display:inline-flex;align-items:center}"}},[257,"mg-tag",{variant:[1],outline:[4],soft:[4],classCollection:[32]},void 0,{variant:[{validateVariant:0}],outline:[{validateOutline:0}],soft:[{validateSoft:0}]}]);function m(){"undefined"!=typeof customElements&&["mg-tag"].forEach((r=>{"mg-tag"===r&&(customElements.get(o(r))||customElements.define(o(r),n))}))}m();const i=n,s=m;export{i as MgTag,s as defineCustomElement}
+import{transformTag as o,proxyCustomElement as r,HTMLElement as g,h as a}from"@stencil/core/internal/client";import{C as t,t as c,i as e}from"./index2.js";const l=["primary","secondary","success","warning","danger","info"],n=r(class extends g{constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow(),this.classOutline="mg-c-tag--outline",this.classSoft="mg-c-tag--soft",this.variant="primary",this.outline=!1,this.soft=!1,this.classCollection=new t(["mg-c-tag"])}validateVariant(o,r){if(!l.includes(o))throw Error(`<mg-tag> prop "variant" must be one of: ${l.join(", ")}. Passed value: ${c(o)}.`);void 0!==r&&this.classCollection.delete("mg-c-tag--"+r),this.classCollection.add("mg-c-tag--"+o)}validateOutline(o){o?this.classCollection.add(this.classOutline):this.classCollection.delete(this.classOutline)}validateSoft(o){if(o&&this.outline)throw Error('<mg-tag> prop "soft" can NOT be used with prop "outline".');o?this.classCollection.add(this.classSoft):this.classCollection.delete(this.classSoft)}validateTextContent(o){if(!e(o))throw Error("<mg-tag> slot must contain a text content.")}componentWillLoad(){this.validateVariant(this.variant),this.validateOutline(this.outline),this.validateSoft(this.soft),this.validateTextContent(this.element.textContent)}render(){return a("span",{key:"3604851191691e002f8f7a701e37abe0059238e3",class:this.classCollection.join()},a("slot",{key:"c51e18e61908772878f380d1ae798e5e5f43ca02"}))}get element(){return this}static get watchers(){return{variant:[{validateVariant:0}],outline:[{validateOutline:0}],soft:[{validateSoft:0}]}}static get style(){return":host{display:inline-block}.mg-c-tag{display:inline-flex;min-height:var(--mg-c-tag-height);box-sizing:border-box;align-items:center;padding:calc((var(--mg-c-tag-height) - 2*var(--mg-b-size-border) - var(--mg-c-tag-font-size)*var(--mg-b-line-height))/2) calc(var(--mg-b-size-8) - var(--mg-b-size-border));border:var(--mg-b-size-border) solid;border-radius:var(--mg-c-tag-border-radius);font-size:var(--mg-c-tag-font-size);font-weight:600;vertical-align:middle}.mg-c-tag.mg-c-tag--primary{border-color:var(--mg-b-color-neutral-110);background-color:var(--mg-b-color-neutral-110);color:var(--mg-b-color-text-on-primary)}.mg-c-tag.mg-c-tag--primary.mg-c-tag--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-neutral-110)}.mg-c-tag.mg-c-tag--primary.mg-c-tag--soft{border-color:var(--mg-b-color-neutral-20);background-color:var(--mg-b-color-neutral-20);color:var(--mg-b-color-dark);font-weight:400}.mg-c-tag.mg-c-tag--primary.mg-c-tag--soft ::slotted(mg-icon){color:var(--mg-b-color-neutral-110)}.mg-c-tag.mg-c-tag--secondary{border-color:var(--mg-b-color-neutral-10);background-color:var(--mg-b-color-neutral-10);color:var(--mg-b-color-text-on-secondary)}.mg-c-tag.mg-c-tag--secondary.mg-c-tag--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-neutral-10)}.mg-c-tag.mg-c-tag--secondary.mg-c-tag--soft{border-color:var(--mg-b-color-neutral-20);background-color:var(--mg-b-color-neutral-20);color:var(--mg-b-color-dark);font-weight:400}.mg-c-tag.mg-c-tag--secondary.mg-c-tag--soft ::slotted(mg-icon){color:var(--mg-b-color-text-on-secondary)}.mg-c-tag.mg-c-tag--danger{border-color:var(--mg-b-color-danger);background-color:var(--mg-b-color-danger);color:var(--mg-b-color-text-on-danger)}.mg-c-tag.mg-c-tag--danger.mg-c-tag--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-danger)}.mg-c-tag.mg-c-tag--danger.mg-c-tag--soft{border-color:var(--mg-b-color-red-20);background-color:var(--mg-b-color-red-20);color:var(--mg-b-color-dark);font-weight:400}.mg-c-tag.mg-c-tag--danger.mg-c-tag--soft ::slotted(mg-icon){color:var(--mg-b-color-danger)}.mg-c-tag.mg-c-tag--info{border-color:var(--mg-b-color-info);background-color:var(--mg-b-color-info);color:var(--mg-b-color-text-on-info)}.mg-c-tag.mg-c-tag--info.mg-c-tag--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-info)}.mg-c-tag.mg-c-tag--info.mg-c-tag--soft{border-color:var(--mg-b-color-blue-20);background-color:var(--mg-b-color-blue-20);color:var(--mg-b-color-dark);font-weight:400}.mg-c-tag.mg-c-tag--info.mg-c-tag--soft ::slotted(mg-icon){color:var(--mg-b-color-info)}.mg-c-tag.mg-c-tag--success{border-color:var(--mg-b-color-success);background-color:var(--mg-b-color-success);color:var(--mg-b-color-text-on-success)}.mg-c-tag.mg-c-tag--success.mg-c-tag--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-success)}.mg-c-tag.mg-c-tag--success.mg-c-tag--soft{border-color:var(--mg-b-color-green-20);background-color:var(--mg-b-color-green-20);color:var(--mg-b-color-dark);font-weight:400}.mg-c-tag.mg-c-tag--success.mg-c-tag--soft ::slotted(mg-icon){color:var(--mg-b-color-success)}.mg-c-tag.mg-c-tag--warning{border-color:var(--mg-b-color-warning);background-color:var(--mg-b-color-warning);color:var(--mg-b-color-text-on-warning)}.mg-c-tag.mg-c-tag--warning.mg-c-tag--outline{background-color:rgba(0,0,0,0);color:var(--mg-b-color-warning)}.mg-c-tag.mg-c-tag--warning.mg-c-tag--soft{border-color:var(--mg-b-color-yellow-20);background-color:var(--mg-b-color-yellow-20);color:var(--mg-b-color-dark);font-weight:400}.mg-c-tag.mg-c-tag--warning.mg-c-tag--soft ::slotted(mg-icon){color:var(--mg-b-color-warning)}::slotted(mg-icon){align-self:start;margin-right:var(--mg-b-size-4)}::slotted(mg-icon[size=small]){margin-top:calc(var(--mg-b-line-height)*1rem - var(--mg-b-size-12))}slot{display:inline-flex;align-items:center}"}},[257,"mg-tag",{variant:[1],outline:[4],soft:[4],classCollection:[32]},void 0,{variant:[{validateVariant:0}],outline:[{validateOutline:0}],soft:[{validateSoft:0}]}]);function m(){"undefined"!=typeof customElements&&["mg-tag"].forEach((r=>{"mg-tag"===r&&(customElements.get(o(r))||customElements.define(o(r),n))}))}m();const i=n,s=m;export{i as MgTag,s as defineCustomElement}

package/dist/components/mg-tooltip-content2.js

@@ -1 +1 @@
-import{transformTag as t,proxyCustomElement as o,HTMLElement as e,h as r,Host as a}from"@stencil/core/internal/client";const s=o(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow()}render(){return r(a,{key:"2221de3ca0ef7c9d6e46e24b19c69007fababf81",role:"tooltip"},r("span",{key:"9e14f7f5b3f5e5060ed9f42e8d7259b17575168e",innerHTML:this.message,class:"mg-tooltip-content__message"}),r("slot",{key:"bc083567d77e8f4ffccee98b96036ba8ac494fb6",name:"arrow"}))}static get style(){return':host{z-index:1000;display:none;max-width:var(--mg-b-size-floating-element-max-width);box-sizing:border-box;padding:var(--mg-b-size-4) var(--mg-b-size-8);border-radius:var(--mg-c-tooltip-border-radius);background-color:var(--mg-c-tooltip-color-background);color:var(--mg-c-tooltip-color-text);font-family:var(--mg-b-font-family);font-size:var(--mg-b-font-size);font-weight:400;text-align:start}:host([data-show]){display:block}::slotted([slot=arrow]){visibility:hidden}::slotted([slot=arrow])::before{content:"";transform:rotate(45deg);visibility:visible}::slotted([slot=arrow]),::slotted([slot=arrow])::before{position:absolute;z-index:9999;width:var(--mg-b-size-8);height:var(--mg-b-size-8);background-color:var(--mg-c-tooltip-color-background)}:host([data-popper-placement^=top])>::slotted([slot=arrow]){bottom:calc(-1*var(--mg-b-size-4))}:host([data-popper-placement^=bottom])>::slotted([slot=arrow]){top:calc(-1*var(--mg-b-size-4))}:host([data-popper-placement^=left])>::slotted([slot=arrow]){right:calc(-1*var(--mg-b-size-4))}:host([data-popper-placement^=right])>::slotted([slot=arrow]){left:calc(-1*var(--mg-b-size-4))}'}},[257,"mg-tooltip-content",{message:[1]}]);function i(){"undefined"!=typeof customElements&&["mg-tooltip-content"].forEach((o=>{"mg-tooltip-content"===o&&(customElements.get(t(o))||customElements.define(t(o),s))}))}i();export{s as M,i as d}
+import{transformTag as t,proxyCustomElement as o,HTMLElement as e,h as a,Host as r}from"@stencil/core/internal/client";const s=o(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow()}render(){return a(r,{key:"efe7a2b2622713929caf9a2e114e7a1267643f5e",role:"tooltip"},a("span",{key:"00f0066cfa058e55a88533f8b6daaa8ab283b29c",innerHTML:this.message,class:"mg-tooltip-content__message"}),a("slot",{key:"fd952c4db7b77b54591bf2c58012096579de45c2",name:"arrow"}))}static get style(){return':host{z-index:1000;display:none;max-width:var(--mg-b-size-floating-element-max-width);box-sizing:border-box;padding:var(--mg-b-size-4) var(--mg-b-size-8);border-radius:var(--mg-c-tooltip-border-radius);background-color:var(--mg-c-tooltip-color-background);color:var(--mg-c-tooltip-color-text);font-family:var(--mg-b-font-family);font-size:var(--mg-b-font-size);font-weight:400;text-align:start}:host([data-show]){display:block}::slotted([slot=arrow]){visibility:hidden}::slotted([slot=arrow])::before{content:"";transform:rotate(45deg);visibility:visible}::slotted([slot=arrow]),::slotted([slot=arrow])::before{position:absolute;z-index:9999;width:var(--mg-b-size-8);height:var(--mg-b-size-8);background-color:var(--mg-c-tooltip-color-background)}:host([data-popper-placement^=top])>::slotted([slot=arrow]){bottom:calc(-1*var(--mg-b-size-4))}:host([data-popper-placement^=bottom])>::slotted([slot=arrow]){top:calc(-1*var(--mg-b-size-4))}:host([data-popper-placement^=left])>::slotted([slot=arrow]){right:calc(-1*var(--mg-b-size-4))}:host([data-popper-placement^=right])>::slotted([slot=arrow]){left:calc(-1*var(--mg-b-size-4))}'}},[257,"mg-tooltip-content",{message:[1]}]);function i(){"undefined"!=typeof customElements&&["mg-tooltip-content"].forEach((o=>{"mg-tooltip-content"===o&&(customElements.get(t(o))||customElements.define(t(o),s))}))}i();export{s as M,i as d}

package/dist/components/mg-tooltip2.js

@@ -1 +1 @@
-import{transformTag as t,proxyCustomElement as i,HTMLElement as s,h as e,Host as h}from"@stencil/core/internal/client";import{c as o,n as a,a as n,t as d,i as c,g as l,l as r}from"./index2.js";import{d as m}from"./mg-tooltip-content2.js";import{c as p}from"./popper.js";const b={FOCUS:"focus",HOVER_TOOLTIP_ELEMENT:"hoverTooltip",HOVER_TOOLTIPED_ELEMENT:"hoverTooltiped",DISABLE_ON_CLICK:"disableOnClick"},u=i(class extends s{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.identifier=o("mg-tooltip"),this.placement="bottom",this.display=!1,this.disabled=!1,this.show=()=>{this.mgTooltipContent.dataset.show="",this.popper.setOptions((t=>Object.assign(Object.assign({},t),{modifiers:[...t.modifiers,{name:"eventListeners",enabled:!0}]}))),a((()=>{this.windows.forEach((t=>{t.addEventListener("click",this.handleClickOutside,!1),t.addEventListener("keydown",this.handlePressEscape,!1)}))}))},this.hide=()=>{this.mgTooltipContent.removeAttribute("data-show"),this.popper.setOptions((t=>Object.assign(Object.assign({},t),{modifiers:[...t.modifiers,{name:"eventListeners",enabled:!1}]}))),this.windows.forEach((t=>{t.removeEventListener("click",this.handleClickOutside,!1),t.removeEventListener("keyboard",this.handlePressEscape,!1)}))},this.handleClickOutside=t=>{t.target.closest("mg-tooltip")!==this.element&&this.setDisplay(!1)},this.handlePressEscape=t=>{"Escape"===t.code&&(this.setDisplay(!1),this.resetGuard())},this.setDisplay=(t,i=!0)=>{!this.disabled&&i&&(this.display=t)},this.tooltipMouseListenerAction=(t,i,s)=>{[b.FOCUS,b.DISABLE_ON_CLICK].includes(this.guard)||(this.guard=t,"mouseenter"!==i?setTimeout((()=>{this.setDisplay(!1,this.guard!==s),this.resetGuard()}),100):this.guard===b.HOVER_TOOLTIPED_ELEMENT&&this.setDisplay(!0))},this.resetGuard=()=>{this.guard=void 0},this.setMgButtonWrapper=t=>{const i="mg-c-tooltip__mg-button-wrapper",s=t.parentElement.classList.contains(i);if(t.disabled&&!s){const s=document.createElement("div");s.classList.add(i),t.parentNode.insertBefore(s,t),s.appendChild(t),this.setTooltipedElement(s)}else!t.disabled&&s&&(this.element.firstElementChild.replaceWith(t),this.setTooltipedElement(t))},this.setPopper=t=>{this.popper=p(this.tooltipedElement,this.mgTooltipContent,{placement:this.placement,strategy:t,modifiers:[{name:"offset",options:{offset:[0,8]}},{name:"flip",options:{fallbackPlacements:["auto"]}}]})},this.setTooltipedElement=t=>{this.tooltipedElement=t,this.tooltipedElement.addEventListener("focus",(()=>{this.guard=b.FOCUS,this.setDisplay(!0)})),this.tooltipedElement.addEventListener("mouseup",(()=>{this.resetGuard()})),this.tooltipedElement.addEventListener("blur",(()=>{this.resetGuard(),this.setDisplay(!1)})),this.tooltipedElement.addEventListener("mouseenter",(()=>{this.tooltipMouseListenerAction(b.HOVER_TOOLTIPED_ELEMENT,"mouseenter",b.HOVER_TOOLTIP_ELEMENT)})),this.tooltipedElement.addEventListener("mouseleave",(()=>{this.tooltipMouseListenerAction(b.HOVER_TOOLTIPED_ELEMENT,"mouseleave",b.HOVER_TOOLTIP_ELEMENT)}))},this.setMgButtonMutationObserver=t=>{new MutationObserver((i=>{i.some((t=>["aria-disabled","disabled"].includes(t.attributeName)))&&(i.some((t=>t.target.disabled&&t.target.disableOnClick))&&(this.guard=b.DISABLE_ON_CLICK),this.guard!==b.DISABLE_ON_CLICK&&(this.setMgButtonWrapper(t),this.resetGuard(),this.popper.update()))})).observe(t,{attributes:!0})},this.setAriaDescribedby=t=>{t.hasAttribute("aria-describedby")?t.setAttribute("aria-describedby",`${[...new Set([...t.getAttribute("aria-describedby").split(" "),this.identifier])].join(" ")}`):this.tooltipedElement.setAttribute("aria-describedby",this.identifier)}}watchIdentifier(t){if(!n(t))throw new Error(`<mg-tooltip> prop "identifier" value is invalid. Passed value: ${d(t)}.`);this.renderTooltipContent()}watchMessage(t){if(!c(t))throw new Error(`<mg-tooltip> prop "message" is required and must be a string. Passed value: ${d(t)}.`);void 0!==this.mgTooltipContent&&(this.mgTooltipContent.message=t)}watchDisplay(t){t?this.show():this.hide()}watchDisabled(t){this.hasCustomTabIndex&&(t?this.tooltipedElement.removeAttribute("tabindex"):this.tooltipedElement.hasAttribute("tabindex")||this.tooltipedElement.setAttribute("tabindex","0"))}renderTooltipContent(){if(void 0!==this.mgTooltipContent)this.mgTooltipContent.setAttribute("id",this.identifier);else{this.mgTooltipContent=document.createElement("mg-tooltip-content"),this.mgTooltipContent.setAttribute("slot","content"),this.mgTooltipContent.setAttribute("id",this.identifier);const t=document.createElement("div");t.setAttribute("slot","arrow"),t.dataset.popperArrow="",this.mgTooltipContent.appendChild(t),this.mgTooltipContent.addEventListener("mouseenter",(()=>{this.tooltipMouseListenerAction(b.HOVER_TOOLTIP_ELEMENT,"mouseenter",b.HOVER_TOOLTIPED_ELEMENT)})),this.mgTooltipContent.addEventListener("mouseleave",(()=>{this.tooltipMouseListenerAction(b.HOVER_TOOLTIP_ELEMENT,"mouseleave",b.HOVER_TOOLTIPED_ELEMENT)})),this.element.appendChild(this.mgTooltipContent)}}componentWillLoad(){this.windows=l(window),this.renderTooltipContent(),this.watchDisabled(this.disabled),this.watchMessage(this.message),this.watchIdentifier(this.identifier)}componentDidLoad(){var t;const i=this.element.querySelector(`*:not(#${this.identifier})`),s=i.matches(r)?i:null===(t=i.shadowRoot)||void 0===t?void 0:t.querySelector(r);var e;this.setTooltipedElement(s||i),"object"==typeof(e=i)&&["MG-BUTTON","BUTTON"].includes(e.tagName)&&(this.setMgButtonMutationObserver(i),this.setMgButtonWrapper(i)),!this.disabled&&[void 0,null].includes(s)&&(this.hasCustomTabIndex=!0,i.tabIndex=0,i.setAttribute("role","button")),this.setAriaDescribedby(i),this.setPopper(null!==this.element.closest("mg-popover")?"absolute":"fixed"),document.addEventListener("keydown",this.handlePressEscape),this.watchDisplay(this.display)}componentDidUpdate(){this.popper.update()}disconnectedCallback(){var t;document.removeEventListener("keydown",this.handlePressEscape),null===(t=this.windows)||void 0===t||t.forEach((t=>{t.removeEventListener("click",this.handleClickOutside,!1),t.removeEventListener("keydown",this.handlePressEscape,!1)}))}render(){return e(h,{key:"1f5ee653d58185c2ab15b213ad323adaabca605f"},e("slot",{key:"d0c615db4429e84a295d01269c268f9239da85c5"}),e("slot",{key:"e6c6deb2f94ab883da2a62fa53cb299f5ec83a06",name:"content"}))}get element(){return this}static get watchers(){return{identifier:[{watchIdentifier:0}],message:[{watchMessage:0}],display:[{watchDisplay:0}],disabled:[{watchDisabled:0}]}}static get style(){return":host{display:inline-block}"}},[257,"mg-tooltip",{identifier:[1],message:[1],placement:[1],display:[1028],disabled:[4]},void 0,{identifier:[{watchIdentifier:0}],message:[{watchMessage:0}],display:[{watchDisplay:0}],disabled:[{watchDisabled:0}]}]);function f(){"undefined"!=typeof customElements&&["mg-tooltip","mg-tooltip-content"].forEach((i=>{switch(i){case"mg-tooltip":customElements.get(t(i))||customElements.define(t(i),u);break;case"mg-tooltip-content":customElements.get(t(i))||m()}}))}f();export{u as M,f as d}
+import{transformTag as t,proxyCustomElement as i,HTMLElement as s,h as e,Host as h}from"@stencil/core/internal/client";import{c as o,n as a,a as n,t as d,i as c,g as l,l as r}from"./index2.js";import{d as m}from"./mg-tooltip-content2.js";import{c as p}from"./popper.js";const b={FOCUS:"focus",HOVER_TOOLTIP_ELEMENT:"hoverTooltip",HOVER_TOOLTIPED_ELEMENT:"hoverTooltiped",DISABLE_ON_CLICK:"disableOnClick"},u=i(class extends s{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.identifier=o("mg-tooltip"),this.placement="bottom",this.display=!1,this.disabled=!1,this.show=()=>{this.mgTooltipContent.dataset.show="",this.popper.setOptions((t=>Object.assign(Object.assign({},t),{modifiers:[...t.modifiers,{name:"eventListeners",enabled:!0}]}))),a((()=>{this.windows.forEach((t=>{t.addEventListener("click",this.handleClickOutside,!1),t.addEventListener("keydown",this.handlePressEscape,!1)}))}))},this.hide=()=>{this.mgTooltipContent.removeAttribute("data-show"),this.popper.setOptions((t=>Object.assign(Object.assign({},t),{modifiers:[...t.modifiers,{name:"eventListeners",enabled:!1}]}))),this.windows.forEach((t=>{t.removeEventListener("click",this.handleClickOutside,!1),t.removeEventListener("keyboard",this.handlePressEscape,!1)}))},this.handleClickOutside=t=>{t.target.closest("mg-tooltip")!==this.element&&this.setDisplay(!1)},this.handlePressEscape=t=>{"Escape"===t.code&&(this.setDisplay(!1),this.resetGuard())},this.setDisplay=(t,i=!0)=>{!this.disabled&&i&&(this.display=t)},this.tooltipMouseListenerAction=(t,i,s)=>{[b.FOCUS,b.DISABLE_ON_CLICK].includes(this.guard)||(this.guard=t,"mouseenter"!==i?setTimeout((()=>{this.setDisplay(!1,this.guard!==s),this.resetGuard()}),100):this.guard===b.HOVER_TOOLTIPED_ELEMENT&&this.setDisplay(!0))},this.resetGuard=()=>{this.guard=void 0},this.setMgButtonWrapper=t=>{const i="mg-c-tooltip__mg-button-wrapper",s=t.parentElement.classList.contains(i);if(t.disabled&&!s){const s=document.createElement("div");s.classList.add(i),t.parentNode.insertBefore(s,t),s.appendChild(t),this.setTooltipedElement(s)}else!t.disabled&&s&&(this.element.firstElementChild.replaceWith(t),this.setTooltipedElement(t))},this.setPopper=t=>{this.popper=p(this.tooltipedElement,this.mgTooltipContent,{placement:this.placement,strategy:t,modifiers:[{name:"offset",options:{offset:[0,8]}},{name:"flip",options:{fallbackPlacements:["auto"]}}]})},this.setTooltipedElement=t=>{this.tooltipedElement=t,this.tooltipedElement.addEventListener("focus",(()=>{this.guard=b.FOCUS,this.setDisplay(!0)})),this.tooltipedElement.addEventListener("mouseup",(()=>{this.resetGuard()})),this.tooltipedElement.addEventListener("blur",(()=>{this.resetGuard(),this.setDisplay(!1)})),this.tooltipedElement.addEventListener("mouseenter",(()=>{this.tooltipMouseListenerAction(b.HOVER_TOOLTIPED_ELEMENT,"mouseenter",b.HOVER_TOOLTIP_ELEMENT)})),this.tooltipedElement.addEventListener("mouseleave",(()=>{this.tooltipMouseListenerAction(b.HOVER_TOOLTIPED_ELEMENT,"mouseleave",b.HOVER_TOOLTIP_ELEMENT)}))},this.setMgButtonMutationObserver=t=>{new MutationObserver((i=>{i.some((t=>["aria-disabled","disabled"].includes(t.attributeName)))&&(i.some((t=>t.target.disabled&&t.target.disableOnClick))&&(this.guard=b.DISABLE_ON_CLICK),this.guard!==b.DISABLE_ON_CLICK&&(this.setMgButtonWrapper(t),this.resetGuard(),this.popper.update()))})).observe(t,{attributes:!0})},this.setAriaDescribedby=t=>{t.hasAttribute("aria-describedby")?t.setAttribute("aria-describedby",`${[...new Set([...t.getAttribute("aria-describedby").split(" "),this.identifier])].join(" ")}`):this.tooltipedElement.setAttribute("aria-describedby",this.identifier)}}watchIdentifier(t){if(!n(t))throw new Error(`<mg-tooltip> prop "identifier" value is invalid. Passed value: ${d(t)}.`);this.renderTooltipContent()}watchMessage(t){if(!c(t))throw new Error(`<mg-tooltip> prop "message" is required and must be a string. Passed value: ${d(t)}.`);void 0!==this.mgTooltipContent&&(this.mgTooltipContent.message=t)}watchDisplay(t){t?this.show():this.hide()}watchDisabled(t){this.hasCustomTabIndex&&(t?this.tooltipedElement.removeAttribute("tabindex"):this.tooltipedElement.hasAttribute("tabindex")||this.tooltipedElement.setAttribute("tabindex","0"))}renderTooltipContent(){if(void 0!==this.mgTooltipContent)this.mgTooltipContent.setAttribute("id",this.identifier);else{this.mgTooltipContent=document.createElement("mg-tooltip-content"),this.mgTooltipContent.setAttribute("slot","content"),this.mgTooltipContent.setAttribute("id",this.identifier);const t=document.createElement("div");t.setAttribute("slot","arrow"),t.dataset.popperArrow="",this.mgTooltipContent.appendChild(t),this.mgTooltipContent.addEventListener("mouseenter",(()=>{this.tooltipMouseListenerAction(b.HOVER_TOOLTIP_ELEMENT,"mouseenter",b.HOVER_TOOLTIPED_ELEMENT)})),this.mgTooltipContent.addEventListener("mouseleave",(()=>{this.tooltipMouseListenerAction(b.HOVER_TOOLTIP_ELEMENT,"mouseleave",b.HOVER_TOOLTIPED_ELEMENT)})),this.element.appendChild(this.mgTooltipContent)}}componentWillLoad(){this.windows=l(window),this.renderTooltipContent(),this.watchDisabled(this.disabled),this.watchMessage(this.message),this.watchIdentifier(this.identifier)}componentDidLoad(){var t;const i=this.element.querySelector(`*:not(#${this.identifier})`),s=i.matches(r)?i:null===(t=i.shadowRoot)||void 0===t?void 0:t.querySelector(r);var e;this.setTooltipedElement(s||i),"object"==typeof(e=i)&&["MG-BUTTON","BUTTON"].includes(e.tagName)&&(this.setMgButtonMutationObserver(i),this.setMgButtonWrapper(i)),!this.disabled&&[void 0,null].includes(s)&&(this.hasCustomTabIndex=!0,i.tabIndex=0,i.setAttribute("role","button")),this.setAriaDescribedby(i),this.setPopper(null!==this.element.closest("mg-popover")?"absolute":"fixed"),document.addEventListener("keydown",this.handlePressEscape),this.watchDisplay(this.display)}componentDidUpdate(){this.popper.update()}disconnectedCallback(){var t;document.removeEventListener("keydown",this.handlePressEscape),null===(t=this.windows)||void 0===t||t.forEach((t=>{t.removeEventListener("click",this.handleClickOutside,!1),t.removeEventListener("keydown",this.handlePressEscape,!1)}))}render(){return e(h,{key:"8d1a0690f0b44381de181c2ea1f9e4c883a1af57"},e("slot",{key:"ae45df312e6a251a72b8ace11eb154c5ad13b4ae"}),e("slot",{key:"fdbb17e42291cd785ff188df14029bcd59ba4c13",name:"content"}))}get element(){return this}static get watchers(){return{identifier:[{watchIdentifier:0}],message:[{watchMessage:0}],display:[{watchDisplay:0}],disabled:[{watchDisabled:0}]}}static get style(){return":host{display:inline-block}"}},[257,"mg-tooltip",{identifier:[1],message:[1],placement:[1],display:[1028],disabled:[4]},void 0,{identifier:[{watchIdentifier:0}],message:[{watchMessage:0}],display:[{watchDisplay:0}],disabled:[{watchDisabled:0}]}]);function f(){"undefined"!=typeof customElements&&["mg-tooltip","mg-tooltip-content"].forEach((i=>{switch(i){case"mg-tooltip":customElements.get(t(i))||customElements.define(t(i),u);break;case"mg-tooltip-content":customElements.get(t(i))||m()}}))}f();export{u as M,f as d}

package/dist/esm/index-DFwaH2hS.js

@@ -351,6 +351,10 @@ var loadModule = (cmpMeta, hostRef, hmrVersionId) => {
                     return import(
                       /* webpackMode: "lazy" */
                       './mg-fieldset.entry.js').then(processMod, consoleError);
+                case 'mg-breadcrumb':
+                    return import(
+                      /* webpackMode: "lazy" */
+                      './mg-breadcrumb.entry.js').then(processMod, consoleError);
                 case 'mg-input-combobox':
                     return import(
                       /* webpackMode: "lazy" */

package/dist/esm/{index-D-uaxCxH.js → index-DSEloqPn.js}

@@ -123,6 +123,9 @@ const panel$1 = {
 const skipLinks$1 = {
 	navLabel: "Quick access"
 };
+const breadcrumb$1 = {
+	label: "Breadcrumb"
+};
 const general$1 = {
 	confirm: "Confirm",
 	cancel: "Cancel",
@@ -157,6 +160,7 @@ var en = {
 	pagination: pagination$1,
 	panel: panel$1,
 	skipLinks: skipLinks$1,
+	breadcrumb: breadcrumb$1,
 	general: general$1,
 	menuItem: menuItem$1,
 	itemMore: itemMore$1,
@@ -290,6 +294,9 @@ const panel = {
 const skipLinks = {
 	navLabel: "Accès rapide"
 };
+const breadcrumb = {
+	label: "Fil d'Ariane"
+};
 const general = {
 	confirm: "Valider",
 	cancel: "Annuler",
@@ -324,6 +331,7 @@ var fr = {
 	pagination: pagination,
 	panel: panel,
 	skipLinks: skipLinks,
+	breadcrumb: breadcrumb,
 	general: general,
 	menuItem: menuItem,
 	itemMore: itemMore,