@mgdis/mg-components 6.24.0 → 6.25.0

package/dist/components/mg-modal.js

@@ -1 +1 @@
-import{transformTag as e,proxyCustomElement as a,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"./index4.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=a(class extends t{constructor(e){super(),!1!==e&&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(e){if(!s(e))throw Error(`<mg-modal> prop "identifier" value is invalid. Passed value: ${l(e)}.`)}validateDialogRole(e){if(!f.includes(e))throw Error(`<mg-modal> prop "dialogRole" must be one of: ${f.join(", ")}. Passed value: ${l(e)}.`)}validateModalTitle(e){if(!r(e))throw Error(`<mg-modal> prop "modalTitle" is required. Passed value: ${l(e)}.`)}watchOpen(e){e?(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:"7e07f2e52ec70012b98a8cf1097a9a3fde516e90",role:this.dialogRole,id:this.identifier,class:this.classCollection.join(),"aria-labelledby":this.titleId,ref:e=>{null!==e&&(this.dialog=e)}},o("mg-card",{key:"8c1465a6bb2ee834dfb5e56c847ed989de3e7f85",shadow:!0},o("div",{key:"5897cc498704d96f11e0c164f6ca9f466dd796e2",class:"mg-c-modal__dialog"},o("header",{key:"362442dfe15aa7a1a0ee9c5d108eeb4d06267216",class:"mg-c-modal__header"},this.closeButton&&o("span",{key:"3e67791bec888b3d79433ecdfc61f47d6b3be8ec",class:"mg-c-modal__close-button"},o("mg-button",{key:"7d7c4b9947737392e178ce125f77bb6c7d376322","is-icon":!0,variant:"flat",label:this.messages.modal.closeButton,onClick:this.handleClose},o("mg-icon",{key:"27d293b26e3b2e7b36cf92fc02ed7ffae90da736",icon:"cross"}))),o("h1",{key:"fa0a8c9db3a3cd0e7facf944dd0e23786b59191d",class:"mg-c-modal__title",id:this.titleId},this.modalTitle)),o("article",{key:"60079c102f0db39e5b05613ed0b03db167740d47",class:"mg-c-modal__content"},o("slot",{key:"5c52b794b06d07c2206aa05e4ca809f369c06811"})),this.hasActions&&o("footer",{key:"793cf6f99e16b10f5af17691194fd2dd6101a3b7",class:"mg-c-modal__footer"},o("slot",{key:"7d2b3b264a7bf167d5066b14db8fed880e985013",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{max-height:100dvh;box-sizing:border-box;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:100dvh}.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((a=>{switch(a){case"mg-modal":customElements.get(e(a))||customElements.define(e(a),b);break;case"mg-button":customElements.get(e(a))||n();break;case"mg-card":customElements.get(e(a))||g();break;case"mg-icon":customElements.get(e(a))||h()}}))}u();const v=b,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"./index4.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=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(!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:"3b802b99d96be80d8071c89be6537269866e6fff",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:"4985b4af69968577ffd36a6a2b1f96274703d146",shadow:!0},o("div",{key:"c4aed6d29dc5ee00f323dcbaecff9532f370ec98",class:"mg-c-modal__dialog"},o("header",{key:"3bfeb66d59144c0cba3fd82c1fb4dee2ed62cea7",class:"mg-c-modal__header"},this.closeButton&&o("span",{key:"55205da6c8991444ff53da7224b28c7475b0e173",class:"mg-c-modal__close-button"},o("mg-button",{key:"da7fdea3a124a559cb637beea9d5565c1f777eea","is-icon":!0,variant:"flat",label:this.messages.modal.closeButton,onClick:this.handleClose},o("mg-icon",{key:"77c2ab2bcacdda9fa179b480651507a1d6584686",icon:"cross"}))),o("h1",{key:"cedb5efc709de2d18e81409139da790349a48bb8",class:"mg-c-modal__title",id:this.titleId},this.modalTitle)),o("article",{key:"7f24e65244836c08dbf7465f8c80970080003bcd",class:"mg-c-modal__content"},o("slot",{key:"36d7c2a0ef1bb1024887da08298391962285bbf8"})),this.hasActions&&o("footer",{key:"5967d650e4e58726641a3c960d82aa7ee588e38f",class:"mg-c-modal__footer"},o("slot",{key:"c275b8235acb658ded3db7c69b931000a5ff14d2",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{max-height:100dvh;box-sizing:border-box;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:100dvh}.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}

package/dist/components/mg-pagination.js

@@ -1 +1 @@
-import{transformTag as t,proxyCustomElement as i,HTMLElement as e,createEvent as a,h as s,Host as n}from"@stencil/core/internal/client";import{c as o,a as r,t as m,i as g}from"./index2.js";import{i as l}from"./index4.js";import{d as h}from"./mg-button2.js";import{d as p}from"./mg-icon2.js";import{d as c}from"./mg-input2.js";import{d as u}from"./mg-input-select2.js";import{d}from"./mg-input-title2.js";import{d as v}from"./mg-tooltip2.js";import{d as b}from"./mg-tooltip-content2.js";const f="next",P="previous",w=(t,i,e=1)=>Array.from(Array(Math.ceil((i+1-t)/e)).keys()).map((i=>t+i*e)),E=i(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.currentPageChange=a(this,"current-page-change",7),this.identifier=o("mg-pagination"),this.hideNavigationLabels=!1,this.hidePageCount=!1,this.totalPages=1,this.currentPage=1,this.goToPage=t=>{this.currentPage=t},this.handleSelect=t=>{const i=Number(t.target.value);this.goToPage(i>0?i:1)},this.handleGoToPage=(t,i)=>{!i&&this.goToPage(t===f?this.currentPage+1:this.currentPage-1)}}watchIdentifier(t){r(t)||console.error(`<mg-pagination> prop "identifier" value is invalid. Passed value: ${m(t)}.`)}validateTotalPages(t){if(t<1)throw Error(`<mg-pagination> prop "totalPages" must be greater than 0. Passed value: ${m(t)}.`)}validateCurrentPage(t){if(t<1)throw Error(`<mg-pagination> prop "currentPage" must be greater than 0. Passed value: ${m(t)}.`);if(t>this.totalPages)throw Error('<mg-pagination> prop "currentPage" can not be greater than total page.');this.currentPageChange.emit(t)}watchPaginationMessages(t){if(t&&("object"!=typeof t||!["next","previous","nextLabel","previousLabel"].every((i=>g(t[i])))))throw Error('<mg-pagination> prop "messages" must be a valid "PaginationMessagesType".')}componentWillLoad(){this.localesMessages=l(this.element).messages,this.watchIdentifier(this.identifier),this.validateTotalPages(this.totalPages),this.validateCurrentPage(this.currentPage),this.watchPaginationMessages(this.messages),void 0!==this.label&&""!==this.label||(this.label=this.localesMessages.pagination.label)}render(){var t,i,e,a,o,r,m,g;const l={next:null!==(i=null===(t=this.messages)||void 0===t?void 0:t.next)&&void 0!==i?i:this.localesMessages.general.next,previous:null!==(a=null===(e=this.messages)||void 0===e?void 0:e.previous)&&void 0!==a?a:this.localesMessages.general.previous,nextLabel:null!==(r=null===(o=this.messages)||void 0===o?void 0:o.nextLabel)&&void 0!==r?r:this.localesMessages.pagination.nextLabel,previousLabel:null!==(g=null===(m=this.messages)||void 0===m?void 0:m.previousLabel)&&void 0!==g?g:this.localesMessages.pagination.previousLabel},h=(t,i)=>s("mg-button",{label:l[i+"Label"],onClick:()=>this.handleGoToPage(i,t),disabled:t,variant:"flat",isIcon:this.hideNavigationLabels},i===P&&s("mg-icon",{icon:"chevron-left"}),!this.hideNavigationLabels&&l[i],i===f&&s("mg-icon",{icon:"chevron-right"}));return s(n,{hidden:this.totalPages<2},s("nav",{role:"navigation","aria-label":this.label,id:this.identifier,class:{"mg-c-pagination":!0,"mg-c-pagination--hide-page-count":this.hidePageCount}},h(this.currentPage<=1,P),!this.hidePageCount&&s("div",{class:"mg-c-pagination__page-count"},s("mg-input-select",{identifier:this.identifier+"-select",items:w(1,this.totalPages).map((t=>""+t)),label:this.localesMessages.pagination.selectPage,"label-hide":!0,"on-value-change":this.handleSelect,value:""+this.currentPage,"placeholder-hide":!0}),s("span",{class:"mg-u-visually-hidden"},this.localesMessages.pagination.page," ",this.currentPage),"/ ",this.totalPages," ",this.totalPages>1?this.localesMessages.pagination.pages:this.localesMessages.pagination.page),h(this.currentPage>=this.totalPages,f)))}get element(){return this}static get watchers(){return{identifier:[{watchIdentifier:0}],totalPages:[{validateTotalPages:0}],currentPage:[{validateCurrentPage:0}],messages:[{watchPaginationMessages: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}}.mg-c-pagination{display:flex;align-items:center;gap:var(--mg-b-spacing-actions)}.mg-c-pagination__page-count{display:flex;align-items:center;gap:var(--mg-b-size-4)}.mg-c-pagination.mg-c-pagination--hide-page-count{gap:0}"}},[1,"mg-pagination",{identifier:[1],label:[1025],hideNavigationLabels:[4,"hide-navigation-labels"],hidePageCount:[4,"hide-page-count"],totalPages:[2,"total-pages"],currentPage:[1538,"current-page"],messages:[16]},void 0,{identifier:[{watchIdentifier:0}],totalPages:[{validateTotalPages:0}],currentPage:[{validateCurrentPage:0}],messages:[{watchPaginationMessages:0}]}]);function x(){"undefined"!=typeof customElements&&["mg-pagination","mg-button","mg-icon","mg-input","mg-input-select","mg-input-title","mg-tooltip","mg-tooltip-content"].forEach((i=>{switch(i){case"mg-pagination":customElements.get(t(i))||customElements.define(t(i),E);break;case"mg-button":customElements.get(t(i))||h();break;case"mg-icon":customElements.get(t(i))||p();break;case"mg-input":customElements.get(t(i))||c();break;case"mg-input-select":customElements.get(t(i))||u();break;case"mg-input-title":customElements.get(t(i))||d();break;case"mg-tooltip":customElements.get(t(i))||v();break;case"mg-tooltip-content":customElements.get(t(i))||b()}}))}x();const j=E,y=x;export{j as MgPagination,y as defineCustomElement}
+import{transformTag as t,proxyCustomElement as i,HTMLElement as e,createEvent as a,h as s,Host as n}from"@stencil/core/internal/client";import{c as o,a as r,t as g,i as m}from"./index2.js";import{i as l}from"./index4.js";import{d as h}from"./mg-button2.js";import{d as p}from"./mg-icon2.js";import{d as c}from"./mg-input2.js";import{d as u}from"./mg-input-select2.js";import{d}from"./mg-input-title2.js";import{d as v}from"./mg-tooltip2.js";import{d as b}from"./mg-tooltip-content2.js";const f="next",P="previous",w=(t,i,e=1)=>Array.from(Array(Math.ceil((i+1-t)/e)).keys()).map((i=>t+i*e)),E=i(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.currentPageChange=a(this,"current-page-change",7),this.identifier=o("mg-pagination"),this.hideNavigationLabels=!1,this.hidePageCount=!1,this.totalPages=1,this.currentPage=1,this.goToPage=t=>{this.currentPage=t},this.handleSelect=t=>{const i=Number(t.target.value);this.goToPage(i>0?i:1)},this.handleGoToPage=(t,i)=>{i||this.goToPage(t===f?this.currentPage+1:this.currentPage-1)}}watchIdentifier(t){r(t)||console.error(`<mg-pagination> prop "identifier" value is invalid. Passed value: ${g(t)}.`)}validateTotalPages(t){if(t<1)throw Error(`<mg-pagination> prop "totalPages" must be greater than 0. Passed value: ${g(t)}.`)}validateCurrentPage(t){if(t<1)throw Error(`<mg-pagination> prop "currentPage" must be greater than 0. Passed value: ${g(t)}.`);if(t>this.totalPages)throw Error('<mg-pagination> prop "currentPage" can not be greater than total page.');this.currentPageChange.emit(t)}watchPaginationMessages(t){if(t&&("object"!=typeof t||!["next","previous","nextLabel","previousLabel"].every((i=>m(t[i])))))throw Error('<mg-pagination> prop "messages" must be a valid "PaginationMessagesType".')}componentWillLoad(){this.localesMessages=l(this.element).messages,this.watchIdentifier(this.identifier),this.validateTotalPages(this.totalPages),this.validateCurrentPage(this.currentPage),this.watchPaginationMessages(this.messages),void 0!==this.label&&""!==this.label||(this.label=this.localesMessages.pagination.label)}render(){var t,i,e,a,o,r,g,m;const l={next:null!==(i=null===(t=this.messages)||void 0===t?void 0:t.next)&&void 0!==i?i:this.localesMessages.general.next,previous:null!==(a=null===(e=this.messages)||void 0===e?void 0:e.previous)&&void 0!==a?a:this.localesMessages.general.previous,nextLabel:null!==(r=null===(o=this.messages)||void 0===o?void 0:o.nextLabel)&&void 0!==r?r:this.localesMessages.pagination.nextLabel,previousLabel:null!==(m=null===(g=this.messages)||void 0===g?void 0:g.previousLabel)&&void 0!==m?m:this.localesMessages.pagination.previousLabel},h=(t,i)=>s("mg-button",{label:l[i+"Label"],onClick:()=>this.handleGoToPage(i,t),disabled:t,variant:"flat",isIcon:this.hideNavigationLabels},i===P&&s("mg-icon",{icon:"chevron-left"}),!this.hideNavigationLabels&&l[i],i===f&&s("mg-icon",{icon:"chevron-right"}));return s(n,{hidden:this.totalPages<2},s("nav",{role:"navigation","aria-label":this.label,id:this.identifier,class:{"mg-c-pagination":!0,"mg-c-pagination--hide-page-count":this.hidePageCount}},h(this.currentPage<=1,P),!this.hidePageCount&&s("div",{class:"mg-c-pagination__page-count"},s("mg-input-select",{identifier:this.identifier+"-select",items:w(1,this.totalPages).map((t=>""+t)),label:this.localesMessages.pagination.selectPage,"label-hide":!0,"on-value-change":this.handleSelect,value:""+this.currentPage,"placeholder-hide":!0}),s("p",{class:"mg-c-pagination__page-count-text"},s("span",{class:"mg-u-visually-hidden"},this.localesMessages.pagination.page," ",this.currentPage),"/ ",this.totalPages," ",this.totalPages>1?this.localesMessages.pagination.pages:this.localesMessages.pagination.page)),h(this.currentPage>=this.totalPages,f)))}get element(){return this}static get watchers(){return{identifier:[{watchIdentifier:0}],totalPages:[{validateTotalPages:0}],currentPage:[{validateCurrentPage:0}],messages:[{watchPaginationMessages: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-path:inset(50%) !important;white-space:nowrap !important}.mg-u-visually-hidden *{overflow:hidden !important}*:focus:not(:focus-visible){outline:none}@media (prefers-reduced-motion){*{animation:none !important;transition:none !important}}.mg-c-pagination{display:flex;align-items:center;gap:var(--mg-b-spacing-actions)}.mg-c-pagination__page-count{display:flex;align-items:center;gap:var(--mg-b-size-4)}.mg-c-pagination__page-count-text{margin:0}.mg-c-pagination.mg-c-pagination--hide-page-count{gap:0}"}},[1,"mg-pagination",{identifier:[1],label:[1025],hideNavigationLabels:[4,"hide-navigation-labels"],hidePageCount:[4,"hide-page-count"],totalPages:[2,"total-pages"],currentPage:[1538,"current-page"],messages:[16]},void 0,{identifier:[{watchIdentifier:0}],totalPages:[{validateTotalPages:0}],currentPage:[{validateCurrentPage:0}],messages:[{watchPaginationMessages:0}]}]);function x(){"undefined"!=typeof customElements&&["mg-pagination","mg-button","mg-icon","mg-input","mg-input-select","mg-input-title","mg-tooltip","mg-tooltip-content"].forEach((i=>{switch(i){case"mg-pagination":customElements.get(t(i))||customElements.define(t(i),E);break;case"mg-button":customElements.get(t(i))||h();break;case"mg-icon":customElements.get(t(i))||p();break;case"mg-input":customElements.get(t(i))||c();break;case"mg-input-select":customElements.get(t(i))||u();break;case"mg-input-title":customElements.get(t(i))||d();break;case"mg-tooltip":customElements.get(t(i))||v();break;case"mg-tooltip-content":customElements.get(t(i))||b()}}))}x();const y=E,j=x;export{y as MgPagination,j 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{n as d}from"./index3.js";import{i as h}from"./index4.js";import{d as m}from"./mg-button2.js";import{d as g}from"./mg-card2.js";import{d as p}from"./mg-character-left2.js";import{d as u}from"./mg-icon2.js";import{d as f}from"./mg-input2.js";import{d as b}from"./mg-input-text2.js";import{d as v}from"./mg-input-title2.js";import{d as x}from"./mg-tooltip2.js";import{d as _}from"./mg-tooltip-content2.js";const E=["text","icon"],w=["left","right"],T=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(t+""!=""){if(!w.includes(t))throw Error(`<mg-panel> prop "titlePosition" must be one of: ${w.join(", ")}. Passed value: ${r(t)}.`)}else this.titlePosition="left"}handleExpanded(t){this.expandedChange.emit(t)}validateExpandToggleDisplay(t){if(t+""!=""){if(!E.includes(t))throw Error(`<mg-panel> prop "expandToggleDisplay" must be one of: ${E.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.')}else this.expandToggleDisplay="text"}componentWillLoad(){if(this.messages=h(this.element).messages,d(this),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:"39d956a9b2c54b794c7ab9f2896dd1152834e8ef",class:this.classCollection.join(),id:this.identifier},s("mg-card",{key:"13d0facc8eb2f4cf0c5cfc7580aafd49d3debf9a",shadow:this.shadow},s("header",{key:"e008bee0a091c655b41712f8f9dff3beadaf437d",class:{"mg-c-panel__header":!0,"mg-c-panel__header--reverse":"right"===this.titlePosition},id:t},this.renderHeaderChildren()),s("article",{key:"a2efbe980ed634f9aeb296eb4c0f7a3f117a8e51",class:"mg-c-panel__content",id:this.identifier+"-content","aria-labelledby":t,hidden:!this.expanded},s("slot",{key:"20849cd8295bed06e647e5befd3906e787dae698"}))))}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:[1025,"title-position"],expanded:[1028],expandToggleDisplay:[1025,"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 k(){"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),T);break;case"mg-button":customElements.get(t(e))||m();break;case"mg-card":customElements.get(t(e))||g();break;case"mg-character-left":customElements.get(t(e))||p();break;case"mg-icon":customElements.get(t(e))||u();break;case"mg-input":customElements.get(t(e))||f();break;case"mg-input-text":customElements.get(t(e))||b();break;case"mg-input-title":customElements.get(t(e))||v();break;case"mg-tooltip":customElements.get(t(e))||x();break;case"mg-tooltip-content":customElements.get(t(e))||_()}}))}k();const y=T,P=k;export{y as MgPanel,P 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{n as d}from"./index3.js";import{i as h}from"./index4.js";import{d as m}from"./mg-button2.js";import{d as g}from"./mg-card2.js";import{d as p}from"./mg-character-left2.js";import{d as u}from"./mg-icon2.js";import{d as b}from"./mg-input2.js";import{d as f}from"./mg-input-text2.js";import{d as v}from"./mg-input-title2.js";import{d as x}from"./mg-tooltip2.js";import{d as _}from"./mg-tooltip-content2.js";const E=["text","icon"],w=["left","right"],T=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(t+""!=""){if(!w.includes(t))throw Error(`<mg-panel> prop "titlePosition" must be one of: ${w.join(", ")}. Passed value: ${r(t)}.`)}else this.titlePosition="left"}handleExpanded(t){this.expandedChange.emit(t)}validateExpandToggleDisplay(t){if(t+""!=""){if(!E.includes(t))throw Error(`<mg-panel> prop "expandToggleDisplay" must be one of: ${E.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.')}else this.expandToggleDisplay="text"}componentWillLoad(){if(this.messages=h(this.element).messages,d(this),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:"33e6da36cbb92f19bcd957de7758c1a13ced5e83",class:this.classCollection.join(),id:this.identifier},s("mg-card",{key:"df278e46b4604d8c5dce2abeffb2e979b02f34e9",shadow:this.shadow},s("header",{key:"b68012115af4bb5b62b6357fc07cbf50876ac08f",class:{"mg-c-panel__header":!0,"mg-c-panel__header--reverse":"right"===this.titlePosition},id:t},this.renderHeaderChildren()),s("article",{key:"3dfec67e6531fc0dff866e102ac36bd6c6a48834",class:"mg-c-panel__content",id:this.identifier+"-content","aria-labelledby":t,hidden:!this.expanded},s("slot",{key:"56c63dd0b0e98968594ff713c2c6ee2a3269b74b"}))))}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:[1025,"title-position"],expanded:[1028],expandToggleDisplay:[1025,"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 k(){"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),T);break;case"mg-button":customElements.get(t(e))||m();break;case"mg-card":customElements.get(t(e))||g();break;case"mg-character-left":customElements.get(t(e))||p();break;case"mg-icon":customElements.get(t(e))||u();break;case"mg-input":customElements.get(t(e))||b();break;case"mg-input-text":customElements.get(t(e))||f();break;case"mg-input-title":customElements.get(t(e))||v();break;case"mg-tooltip":customElements.get(t(e))||x();break;case"mg-tooltip-content":customElements.get(t(e))||_()}}))}k();const y=T,P=k;export{y as MgPanel,P 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 d,b as p}from"./index2.js";import{i as c}from"./index4.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 d(["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&&!p(o,t))throw new Error(`<mg-popover> Slotted title must be a heading: ${t.join(", ")}.`)}render(){return a(s,{key:"e3de7dc2ddf9cba900f1980a6237e95f7a5daea1"},a("mg-card",{key:"775c623b0cfd3f5cb08ce34281ac558a5dfd52df",class:this.classCollection.join(),shadow:!0},this.closeButton&&a("mg-button",{key:"48269416813e32ef03cc4f02dae4e42fb542b053","is-icon":!0,variant:"flat",label:this.messages.general.close,onClick:this.handleCloseButton},a("mg-icon",{key:"d947151a3751052261c3a1d67eca570b6f991d80",icon:"cross"})),a("div",{key:"6c447184b41381b2563dcee874153a55521ff7aa",class:"mg-c-popover-content__title"},a("slot",{key:"5b05e6c30fa020a8765f83d7008b4b9ecad63433",name:"title"})),a("slot",{key:"386dbb305a8862cb55f8b06aa35d08b65051a07d",name:"content"})),a("slot",{key:"16093d6e34d8558677222da720142b7afe443adf",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 e,HTMLElement as o,createEvent as c,h as a,Host as r}from"@stencil/core/internal/client";import{C as m,b as i}from"./index2.js";import{i as n}from"./index4.js";import{d as s}from"./mg-button2.js";import{d}from"./mg-card2.js";import{d as g}from"./mg-icon2.js";const l=e(class extends o{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.hideContent=c(this,"hide-content",7),this.closeButton=!1,this.classCollection=new m(["mg-c-popover-content"]),this.handleCloseButton=()=>{this.hideContent.emit()}}componentWillLoad(){this.messages=n(this.element).messages}componentDidLoad(){const t=["h1","h2","h3","h4","h5","h6"],e=this.element.querySelector('[slot="title"]');if(e&&!i(e,t))throw new Error(`<mg-popover> Slotted title must be a heading: ${t.join(", ")}.`)}render(){return a(r,{key:"7035d8f560b811596c9c641abc7fe28ee9fdf3a2"},a("mg-card",{key:"badc81425100283dac69cad111514d8c3edfba45",class:this.classCollection.join(),shadow:!0},this.closeButton&&a("mg-button",{key:"cb20d8c7db741051b532c3b1653d578df859f0d0","is-icon":!0,variant:"flat",label:this.messages.general.close,onClick:this.handleCloseButton},a("mg-icon",{key:"389dc26f4cfdbb899b2b9eb4b27ceb6369209b2f",icon:"cross"})),a("div",{key:"29b6721af3b6e06760affd6565e740bbc667f457",class:"mg-c-popover-content__title"},a("slot",{key:"5834364d298a4e65a9170f003d0ec1f5e8868c4a",name:"title"})),a("slot",{key:"8398f497064fe097151ca263225349a9d84d4f36",name:"content"})))}get element(){return this}static get style(){return":host{position:relative;z-index:2000;display:none;color:var(--mg-c-popover-color-text)}:host([data-show]){display:block}.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)}"}},[257,"mg-popover-content",{closeButton:[4,"close-button"],classCollection:[32]}]);function h(){"undefined"!=typeof customElements&&["mg-popover-content","mg-button","mg-card","mg-icon"].forEach((e=>{switch(e){case"mg-popover-content":customElements.get(t(e))||customElements.define(t(e),l);break;case"mg-button":customElements.get(t(e))||s();break;case"mg-card":customElements.get(t(e))||d();break;case"mg-icon":customElements.get(t(e))||g()}}))}h();export{l as M,h as d}

package/dist/components/mg-popover2.js

@@ -1 +1 @@
-import{transformTag as t,proxyCustomElement as i,HTMLElement as e,createEvent as s,h as o,Host as a}from"@stencil/core/internal/client";import{c as n,a as r,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 m}from"./mg-icon2.js";import{d as p}from"./mg-popover-content2.js";import{c as v}from"./popper.js";const g=i(class extends e{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=n("mg-popover"),this.placement="bottom",this.arrowHide=!1,this.closeButton=!1,this.display=!1,this.disabled=!1,this.clickOutside=t=>{const i=t.composedPath(),s=i.includes(this.element)||i.some((t=>t instanceof e&&t.dataset.mgPopoverGuard===this.identifier));this.disabled||s||(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((i=>Object.assign(Object.assign({},i),{modifiers:[...i.modifiers,{name:"eventListeners",enabled:t}]})))},this.manageClickOutsideListeners=t=>{var i,e;[...Array.from((null===(e=null===(i=document.querySelector(`[data-mg-popover-guard="${this.identifier}"]`))||void 0===i?void 0:i.shadowRoot)||void 0===e?void 0:e.children)||new Set),...this.windows].forEach((i=>{null!==i&&i[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(!r(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 i=t.target.closest("[popovertargetaction]");!0===this.display&&null!==i&&"hide"===i.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:"422ac3fe8b6d3784bd667074096996ffe6f52cb6"},o("slot",{key:"c8a2b51b1ca454f823d73ed2e72fff9aa1162b3f"}),o("slot",{key:"3f7c21389b13c497204de5415613c90aeabe3c86",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((i=>{switch(i){case"mg-popover":customElements.get(t(i))||customElements.define(t(i),g);break;case"mg-button":customElements.get(t(i))||d();break;case"mg-card":customElements.get(t(i))||l();break;case"mg-icon":customElements.get(t(i))||m();break;case"mg-popover-content":customElements.get(t(i))||p()}}))}u();export{g as M,u as d}
+import{transformTag as t,proxyCustomElement as e,HTMLElement as s,createEvent as i,h as o,Host as n}from"@stencil/core/internal/client";import{c as a,a as r,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 s{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.displayChange=i(this,"display-change",7),this.componentClose=i(this,"component-close",7),this.identifier=a("mg-popover"),this.placement="bottom-start",this.closeButton=!1,this.display=!1,this.disabled=!1,this.clickOutside=t=>{const e=t.composedPath(),i=e.includes(this.element)||e.some((t=>t instanceof s&&t.dataset.mgPopoverGuard===this.identifier));this.disabled||i||(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,s;[...Array.from((null===(s=null===(e=document.querySelector(`[data-mg-popover-guard="${this.identifier}"]`))||void 0===e?void 0:e.shadowRoot)||void 0===s?void 0:s.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");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),['[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)):t.setAttribute("id",this.identifier)}}validateIdentifier(t){if(!r(t))throw new Error(`<mg-popover> prop "identifier" value is invalid. Passed value: ${h(t)}.`);this.renderPopoverContent()}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)}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,2]}},{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(n,{key:"9e62e60ba76045222b9c69b34245c3825004f8d6"},o("slot",{key:"4be1a5c1221e1985cd0c0b4f7b19435d097bee4e"}),o("slot",{key:"07c2003dc3ad0bb7059e75e95e0de2862a64fd22",name:"content"}))}get element(){return this}static get watchers(){return{identifier:[{validateIdentifier: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:[16],closeButton:[4,"close-button"],display:[1028],disabled:[4]},void 0,{identifier:[{validateIdentifier: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 e,HTMLElement as s,h as a,Host as t}from"@stencil/core/internal/client";import{i,t as o,p 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:"d5027418b3a6fe08cd7e6800fd1cb01a268750f6",role:this.ariaRole,"aria-label":this.label,"aria-valuenow":this.value,"aria-valuemin":this.min,"aria-valuemax":this.max},a("div",{key:"963659f80b05db089d564095a6eaa5558ece4ffd",class:"mg-c-progress"},a("div",{key:"ad019298b3d3ecf3df00946af3e7b897910bbaf7",class:{"mg-c-progress__bar":!0,"mg-c-progress__bar--active":this.value>this.min}},a("div",{key:"921f637985dc611a606ebc4c62da4ba188b3d407",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,d=g;export{m as MgProgress,d as defineCustomElement}
+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,p 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:"3682d5f1980678e39594dab8223805deb4b425d4",role:this.ariaRole,"aria-label":this.label,"aria-valuenow":this.value,"aria-valuemin":this.min,"aria-valuemax":this.max},a("div",{key:"001d511a866ec0526c4ffd01a8a90448b6f40819",class:"mg-c-progress"},a("div",{key:"504fa583f5b8186236871f3f2cd886acb40614ef",class:{"mg-c-progress__bar":!0,"mg-c-progress__bar--active":this.value>this.min}},a("div",{key:"044c9297d5a12c9d8c6d3b76d17dd2ba6a1a9719",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,d=g;export{m as MgProgress,d 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"./index4.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:"ddae15101123757391d8dced8c88854c852563c1",class:"mg-c-skip-links",role:"navigation","aria-label":this.messages.skipLinks.navLabel},e("ul",{key:"df27b144dbf68f3e2fceeeb8575a81c51b74c4d4",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:color-mix(in srgb, var(--mg-b-color-dark), transparent 90%)}"}},[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"./index4.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:"9208da538e001be23c8cc78e8a34498cd072cdc6",class:"mg-c-skip-links",role:"navigation","aria-label":this.messages.skipLinks.navLabel},e("ul",{key:"fcd69f398fad6964d5c017bb652ad7b8de34dee6",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:color-mix(in srgb, var(--mg-b-color-dark), transparent 90%)}"}},[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 o,t as i,i as r,c as n}from"./index2.js";import{i as l}from"./index4.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}
+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"./index4.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-path:inset(50%) !important;white-space:nowrap !important}.mg-u-visually-hidden *{overflow:hidden !important}*:focus:not(:focus-visible){outline:none}@media (prefers-reduced-motion){*{animation:none !important;transition:none !important}}a{color:inherit;text-decoration:underline}a:has(mg-icon){display:inline-flex;align-items:center;gap:var(--mg-b-size-4)}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}hgroup{display:flex;flex-direction:column;gap:var(--mg-b-size-4)}hgroup h1,hgroup h2,hgroup h3,hgroup h4,hgroup h5,hgroup h6{margin:0}hgroup p{color:var(--mg-b-color-neutral-90)}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,u=g;export{b as MgTable,u 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 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:"25edcc3793e5f060bd3df862ec0c2963c4ec6bdd",class:this.classCollection.join()},e("header",{key:"fe9f0e13f798bb88a4c00e2e5ad8e9adf841b05e",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}
+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:"37be8d325dfea3a7b828236f3cc21da57be28154",class:this.classCollection.join()},e("header",{key:"d88f10c0331984a759f8abc311f11d913fb25206",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:"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}
+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:"d0a9551f29695cd9c49751c4950db3c13065490e",class:this.classCollection.join()},a("slot",{key:"51f2a2e1c9578f6449bb9c124335ad707d5ebeb1"}))}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 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}
+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:"49dc32a8c7191fb291d2c47fc1e903d16e0774ab",role:"tooltip"},r("span",{key:"913adc1f23eec27eb4b83cc4f4d9b4c1d6f9b2c2",innerHTML:this.message,class:"mg-tooltip-content__message"}),r("slot",{key:"44da4832c535df385cbde0fd32791d901c538e84",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 o}from"@stencil/core/internal/client";import{c as h,n as a,a as n,t as l,i as d,g as c,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=h("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("keydown",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: ${l(t)}.`);this.renderTooltipContent()}watchMessage(t){if(!d(t))throw new Error(`<mg-tooltip> prop "message" is required and must be a string. Passed value: ${l(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=c(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)),null!==this.element.querySelector("mg-button[full-width]")&&this.element.classList.add("mg-c-tooltip--full-width"),!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(o,{key:"f8fe2bfb1fe70bf169abf8ddd77323342af2ac54"},e("slot",{key:"6d478d941b9cf9374395e597a703ba7c8411eb75"}),e("slot",{key:"bbbb59eda24731ec2fa54a909b0f3f93000083e5",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}:host(.mg-c-tooltip--full-width){display:block}:host(.mg-c-tooltip--full-width)::slotted(div.mg-c-tooltip__mg-button-wrapper){display:block;width:100%}"}},[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 o}from"@stencil/core/internal/client";import{c as h,n as a,a as n,t as l,i as d,g as c,l as r}from"./index2.js";import{d as m}from"./mg-tooltip-content2.js";import{c as p}from"./popper.js";const u={FOCUS:"focus",HOVER_TOOLTIP_ELEMENT:"hoverTooltip",HOVER_TOOLTIPED_ELEMENT:"hoverTooltiped",DISABLE_ON_CLICK:"disableOnClick"},b=i(class extends s{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.identifier=h("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("keydown",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)=>{[u.FOCUS,u.DISABLE_ON_CLICK].includes(this.guard)||(this.guard=t,"mouseenter"!==i?setTimeout((()=>{this.setDisplay(!1,this.guard!==s),this.resetGuard()}),100):this.guard===u.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=u.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(u.HOVER_TOOLTIPED_ELEMENT,"mouseenter",u.HOVER_TOOLTIP_ELEMENT)})),this.tooltipedElement.addEventListener("mouseleave",(()=>{this.tooltipMouseListenerAction(u.HOVER_TOOLTIPED_ELEMENT,"mouseleave",u.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=u.DISABLE_ON_CLICK),this.guard!==u.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: ${l(t)}.`);this.renderTooltipContent()}watchMessage(t){if(!d(t))throw new Error(`<mg-tooltip> prop "message" is required and must be a string. Passed value: ${l(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(u.HOVER_TOOLTIP_ELEMENT,"mouseenter",u.HOVER_TOOLTIPED_ELEMENT)})),this.mgTooltipContent.addEventListener("mouseleave",(()=>{this.tooltipMouseListenerAction(u.HOVER_TOOLTIP_ELEMENT,"mouseleave",u.HOVER_TOOLTIPED_ELEMENT)})),this.element.appendChild(this.mgTooltipContent)}}componentWillLoad(){this.windows=c(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)),null!==this.element.querySelector("mg-button[full-width]")&&this.element.classList.add("mg-c-tooltip--full-width"),!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(o,{key:"5cd926147c1b6723065c5334699764f32a8a06c9"},e("slot",{key:"a1b208798c79e34a207f3bedb2ad9662e02e83e2"}),e("slot",{key:"4f332961968fd3541caf47c2fd9072720fa2ee71",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}:host(.mg-c-tooltip--full-width){display:block}:host(.mg-c-tooltip--full-width)::slotted(div.mg-c-tooltip__mg-button-wrapper){display:block;width:100%}"}},[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),b);break;case"mg-tooltip-content":customElements.get(t(i))||m()}}))}f();export{b as M,f as d}