@mgdis/mg-components 6.9.0 → 6.10.0

package/dist/esm/mg-action-more_37.entry.js

@@ -1,7 +1,8 @@
 import { r as registerInstance, h, H as Host, g as getElement, c as createEvent } from './index-CAuxALt5.js';
-import { x as xt, z as zt, k as kt, L as Le, M as Mt, O as Ot, T as Tt, a as Lt, w as wt, E as Et, H as Ht, B as Bt, G as Gt, X as Xt, W as Wt, P as Pt, A as At, R as Rt, j as jt } from './index.es-DDBtzymI.js';
-import { i as initLocales } from './index-SQlkEaXW.js';
-import { t as tooltipPositions, c as classFieldset, a as classReadonly, b as classDisabled, d as classVerticalList, w as widths } from './mg-input.conf-BtkqaBXm.js';
+import { P as Pt, G as Gt, Z as Zt, a as De, X as Xt, U as Ut, b as qt, J as Jt, L as Lt, F as Ft, c as ar, d as ir, l as lr, f as fr, e as cr, o as or, D as Dt, B as Bt, g as Ht } from './index.es-rLV3KFPd.js';
+import { i as initLocales } from './index-DmsGewMC.js';
+import { K as Keys } from './events.utils-yMGqY8YG.js';
+import { t as tooltipPositions, b as classFieldset, c as classReadonly, a as classDisabled, d as classVerticalList, w as widths } from './mg-input.conf-CNgv8hc5.js';
 
 /**
  * Available menu item status values
@@ -73,7 +74,7 @@ const MgActionMore = class {
          ************/
         this.name = 'mg-action-more';
         this.classBase = 'mg-c-action-more';
-        this.mgPopoverIdentifier = xt(this.name);
+        this.mgPopoverIdentifier = Pt(this.name);
         /**
          * Define button properties
          */
@@ -120,15 +121,15 @@ const MgActionMore = class {
     }
     validateItems(newValue) {
         if (!isMgActionMoreItems(newValue)) {
-            throw new Error(`<${this.name}> prop "items" is required and all values must be the same type, MgActionMoreItemType or MgActionMoreDividerType. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<${this.name}> prop "items" is required and all values must be the same type, MgActionMoreItemType or MgActionMoreDividerType. Passed value: ${Gt(newValue)}.`);
         }
         else if (isMgActionMoreItems(newValue) && newValue.length > 0 && (isMgActionMoreDivider(newValue[0]) || isMgActionMoreDivider(newValue[newValue.length - 1]))) {
-            throw new Error(`<${this.name}> prop "items" can’t have a divider at the beginning or the end of the array. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<${this.name}> prop "items" can’t have a divider at the beginning or the end of the array. Passed value: ${Gt(newValue)}.`);
         }
     }
     validateIcon(newValue) {
         if (newValue && !isMgActionMoreIcon(newValue)) {
-            throw new Error(`<${this.name}> prop "icon" must match MgActionMoreIconType. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<${this.name}> prop "icon" must match MgActionMoreIconType. Passed value: ${Gt(newValue)}.`);
         }
         else if ((newValue === null || newValue === void 0 ? void 0 : newValue.icon) === undefined && Boolean(this.button.isIcon)) {
             this.icon = { icon: 'ellipsis' };
@@ -136,7 +137,7 @@ const MgActionMore = class {
     }
     validateButton(newValue) {
         if (newValue && !isMgActionMoreButton(newValue)) {
-            throw new Error(`<${this.name}> prop "button" must match MgActionMoreButtonType. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<${this.name}> prop "button" must match MgActionMoreButtonType. Passed value: ${Gt(newValue)}.`);
         }
     }
     validateDisplayChevron(newValue) {
@@ -170,9 +171,9 @@ const MgActionMore = class {
                     [`${this.classBase}__chevron--rotate`]: this.expanded === true,
                 } }, h("mg-icon", { icon: "chevron-down" })));
         }
-        return (h(Host, { key: '2bb195242da00b4235d1c7e208d1f7ca72189a94', "data-mg-popover-guard": this.mgPopoverIdentifier }, h("span", { key: 'e9b1e0d8996886aef957f95e5c4276c584f80525', class: this.classBase }, h("mg-popover", { key: '8700af5584bb46e3b04b887b3d42d1660c0ef140', identifier: this.mgPopoverIdentifier, display: this.expanded, "onDisplay-change": this.handleDisplayChange }, h("mg-button", { key: '70442ce629cc40ea412ce3b6c93f8aab3abfa567', variant: this.button.variant, isIcon: this.button.isIcon, disabled: this.button.disabled, type: "button", label: buttonLabel, onClick: this.handleButton }, this.icon && h("mg-icon", Object.assign({ key: '85de555a598ac2097fb6586bbfab4ccda47721d1' }, this.icon)), !this.button.isIcon && buttonContent), h("div", { key: '3881ef2f2453a7f6bb8a16f56fd58899d4a44ab3', slot: "content" }, h("mg-menu", { key: 'ad3fb64141e696c4dfdf19743b035347ea212a39', direction: directions$1.VERTICAL, label: this.messages.label }, this.items.map(item => {
+        return (h(Host, { key: '655b4be7b0b17db8ad6e2d688f59c18f2750dfe4', "data-mg-popover-guard": this.mgPopoverIdentifier }, h("span", { key: '19f5763f7732fb156803fb6a24f776f182d230f4', class: this.classBase }, h("mg-popover", { key: '617fefddd54794e3f3da60e700e1c60e0758c66b', identifier: this.mgPopoverIdentifier, display: this.expanded, "onDisplay-change": this.handleDisplayChange }, h("mg-button", { key: 'c9ef1d8f771b015ddb5b8f280c3657e74606ef22', variant: this.button.variant, isIcon: this.button.isIcon, disabled: this.button.disabled, type: "button", label: buttonLabel, onClick: this.handleButton }, this.icon && h("mg-icon", Object.assign({ key: 'ded976da4cd3a457a232aee9613dc9e108c35358' }, this.icon)), !this.button.isIcon && buttonContent), h("div", { key: 'e3308c1e0ae198f204c283408f9c3afc154ddf21', slot: "content" }, h("mg-menu", { key: '70c222a09f42b938f56a5bb02fa4193ca8f47788', direction: directions$1.VERTICAL, label: this.messages.label }, this.items.map(item => {
             var _a, _b;
-            return isMgActionMoreDivider(item) ? (h("mg-divider", { class: "mg-c-action-more__divider", key: "divider" })) : (h("mg-menu-item", { key: item.label, status: item.status || Status$1.VISIBLE, target: item.target, href: item.href,
+            return isMgActionMoreDivider(item) ? (h("mg-divider", { class: "mg-c-action-more__divider", key: "divider", "full-width": true })) : (h("mg-menu-item", { key: item.label, status: item.status || Status$1.VISIBLE, target: item.target, href: item.href,
                 // eslint-disable-next-line react/jsx-no-bind
                 onClick: e => this.handleItemClick(e, item.mouseEventHandler) }, ((_a = item.icon) === null || _a === void 0 ? void 0 : _a.icon) && h("mg-icon", { icon: item.icon.icon, variant: item.icon.variant, variantStyle: item.icon.variantStyle, slot: "image" }), h("span", { slot: "label" }, item.label), ((_b = item.badge) === null || _b === void 0 ? void 0 : _b.label) && h("mg-badge", { label: item.badge.label, value: item.badge.value, slot: "information", variant: "text-color" })));
         })))))));
@@ -213,21 +214,21 @@ const MgBadge = class {
         /**
          * Component classes
          */
-        this.classCollection = new kt(['mg-c-badge']);
+        this.classCollection = new Zt(['mg-c-badge']);
     }
     validateValue(newValue) {
         if (/^[^A-Z]+$/i.exec(`${newValue}`) === null) {
-            throw new Error(`<mg-badge> prop "value" is required and must be integer and/or special character. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-badge> prop "value" is required and must be integer and/or special character. Passed value: ${Gt(newValue)}.`);
         }
     }
     validateLabel(newValue) {
-        if (!Le(newValue)) {
-            throw new Error(`<mg-badge> prop "label" is required and must be a string. Passed value: ${zt(newValue)}.`);
+        if (!De(newValue)) {
+            throw new Error(`<mg-badge> prop "label" is required and must be a string. Passed value: ${Gt(newValue)}.`);
         }
     }
     validateVariant(newValue, oldValue) {
         if (!variants$4.includes(newValue)) {
-            throw new Error(`<mg-badge> prop "variant" must be one of: ${variants$4.join(', ')}. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-badge> prop "variant" must be one of: ${variants$4.join(', ')}. Passed value: ${Gt(newValue)}.`);
         }
         else {
             if (oldValue !== undefined) {
@@ -320,7 +321,7 @@ const MgButton = class {
         /**
          * Component classes
          */
-        this.classCollection = new kt(['mg-c-button']);
+        this.classCollection = new Zt(['mg-c-button']);
         /**
          * Trigger actions onClick event
          * @param event - click event
@@ -342,7 +343,7 @@ const MgButton = class {
             if (!this.disabled && event.key === ' ') {
                 event.preventDefault();
             }
-            else if (!this.disabled && ['Enter', 'NumpadEnter', 'Space'].includes(event.key)) {
+            else if (!this.disabled && [Keys.ENTER, Keys.NUMPADENTER, Keys.SPACE].includes(event.key)) {
                 event.preventDefault();
                 this.element.dispatchEvent(new MouseEvent('click', { bubbles: true }));
             }
@@ -378,7 +379,7 @@ const MgButton = class {
                 this.variant = variants$3[0];
                 return;
             }
-            throw new Error(`<mg-button> prop "variant" must be one of: ${variants$3.join(', ')}. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-button> prop "variant" must be one of: ${variants$3.join(', ')}. Passed value: ${Gt(newValue)}.`);
         }
         else {
             if (oldValue !== undefined) {
@@ -390,7 +391,7 @@ const MgButton = class {
     validateSize(newValue, oldValue) {
         // validate new value
         if (!sizes$4.includes(newValue)) {
-            throw new Error(`<mg-button> prop "size" must be one of: ${sizes$4.join(', ')}. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-button> prop "size" must be one of: ${sizes$4.join(', ')}. Passed value: ${Gt(newValue)}.`);
         }
         else {
             if (oldValue !== undefined) {
@@ -432,7 +433,7 @@ const MgButton = class {
     watchIsIcon(newValue) {
         if (newValue) {
             this.classCollection.add(`mg-c-button--icon`);
-            if (!Le(this.label)) {
+            if (!De(this.label)) {
                 throw new Error(`<mg-button> prop "label" is mandatory when prop "isIcon" is set to true.`);
             }
         }
@@ -463,7 +464,7 @@ const MgButton = class {
      * Add listners
      */
     componentDidLoad() {
-        Mt(() => {
+        Xt(() => {
             var _a;
             const closestForm = this.element.closest('form') || ((_a = this.element.closest('mg-form')) === null || _a === void 0 ? void 0 : _a.shadowRoot.querySelector('form'));
             // submit buttons should trigger form submition;
@@ -480,7 +481,7 @@ const MgButton = class {
      */
     render() {
         var _a;
-        return (h(Host, { key: '73d97963f988261cec281f67842d71194513528b', role: "button", tabIndex: 0, type: this.type, form: this.form, "full-width": this.fullWidth, "aria-label": this.label, "aria-disabled": (_a = this.disabled) === null || _a === void 0 ? void 0 : _a.toString(), onClick: this.handleClick, onKeyup: this.handleKeyup, onKeydown: this.handleKeydown }, h("div", { key: 'c8ce88a3d9d67ce40cc9687b4ea192681d826896', class: this.classCollection.join() }, this.loading && h("mg-icon", { key: '5e8949fa49487deda3fdeb1fbb85b62d799e33c6', icon: "loader", spin: true }), h("div", { key: 'fc733614c9fb3e30c30c520e9ca3d8a4efd59efe', class: "mg-c-button__content" }, h("slot", { key: '1c2c5a91c44c8983d317a4f475ffe89fc21a36e5' })))));
+        return (h(Host, { key: '9cf0c234da7c2f0ca5ab1d6578fc1a00b7b6aa71', role: "button", tabIndex: 0, type: this.type, form: this.form, "full-width": this.fullWidth, "aria-label": this.label, "aria-disabled": (_a = this.disabled) === null || _a === void 0 ? void 0 : _a.toString(), onClick: this.handleClick, onKeyup: this.handleKeyup, onKeydown: this.handleKeydown }, h("div", { key: 'e4fc763ce10eb5958ebd9330f778380bb93100d6', class: this.classCollection.join() }, this.loading && h("mg-icon", { key: '6796487254b12a33339ac6b3a5f6c67000d8fe04', icon: "loader", spin: true }), h("div", { key: '469136ef8519825ebff3e6ee2bfe8c55e64a807d', class: "mg-c-button__content" }, h("slot", { key: 'eda514d71eaab7f7cf5cd3a65b64ffb6c9ed2e02' })))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -524,13 +525,13 @@ const MgCharacterLeft = class {
         this.characters = '';
     }
     watchIdentifier(newValue) {
-        if (newValue !== undefined && !Ot(newValue)) {
-            console.error(`<mg-character-left> prop "identifier" value is invalid. Passed value: ${zt(newValue)}.`);
+        if (newValue !== undefined && !Ut(newValue)) {
+            console.error(`<mg-character-left> prop "identifier" value is invalid. Passed value: ${Gt(newValue)}.`);
         }
     }
     validateMaxlength(newValue) {
         if (typeof newValue !== 'number') {
-            throw new Error(`<mg-character-left> prop "maxlength" is required and must be a number. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-character-left> prop "maxlength" is required and must be a number. Passed value: ${Gt(newValue)}.`);
         }
     }
     /*************
@@ -559,7 +560,7 @@ const MgCharacterLeft = class {
 };
 MgCharacterLeft.style = mgCharacterLeftCss;
 
-const mgDetailsCss = ".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}}/*!\n * @prop --mg-c-details-spacing: Defines the spacing between the summary and the details. Default value: `--mg-b-size-8`.\n */.mg-c-details summary{display:flex;align-items:baseline;cursor:pointer;gap:var(--mg-b-size-16)}.mg-c-details summary::-webkit-details-marker{display:none}.mg-c-details__toggle{display:flex;min-height:calc(var(--mg-b-font-size)*var(--mg-b-line-height));flex-shrink:0;align-items:center;align-self:flex-start;gap:var(--mg-b-size-4)}.mg-c-details__toggle-icon.mg-c-details__toggle-icon--reverse{transform:rotate(180deg)}.mg-c-details__details{margin-top:var(--mg-c-details-spacing)}@media (width < 43.75rem){.mg-c-details__toggle>span{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}}";
+const mgDetailsCss = ".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}}/*!\n * @prop --mg-c-details-spacing: Defines the spacing between the summary and the details. Default value: `--mg-b-size-8`.\n */.mg-c-details summary{display:inline-flex;align-items:baseline;cursor:pointer;gap:var(--mg-b-size-16)}.mg-c-details summary::-webkit-details-marker{display:none}.mg-c-details__toggle{display:flex;min-height:calc(var(--mg-b-font-size)*var(--mg-b-line-height));flex-shrink:0;align-items:center;align-self:flex-start;gap:var(--mg-b-size-4)}.mg-c-details__toggle-icon.mg-c-details__toggle-icon--reverse{transform:rotate(180deg)}.mg-c-details__details{margin-top:var(--mg-c-details-spacing)}@media (width < 43.75rem){.mg-c-details__toggle>span{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}}";
 
 const MgDetails = class {
     constructor(hostRef) {
@@ -581,7 +582,7 @@ const MgDetails = class {
         };
     }
     validateTitles(newValue) {
-        if (!Le(newValue)) {
+        if (!De(newValue)) {
             throw new Error(`<mg-details> prop "toggleClosed" and "toggleOpened" is required and must be a valid string. Passed value: "toggleClosed='${this.toggleClosed}'" and "toggleOpened='${this.toggleOpened}'".`);
         }
     }
@@ -608,7 +609,7 @@ const MgDetails = class {
      * @returns HTML Element
      */
     render() {
-        return (h("details", { key: '3f773b6c0d10c12049d62a9bbe3b24ce95329077', class: "mg-c-details", onToggle: this.handleToggle, open: this.expanded, ref: (el) => (this.details = el) }, h("summary", { key: 'c6378c290a253098a26e832dbc43c58182e1d90c' }, h("slot", { key: '033334926172ca422a1346085cfe5fb1adf33e9b', name: "summary" }), h("span", { key: '105cd284d2cf7363cd0ea85279c057471f2113c9', class: "mg-c-details__toggle" }, h("mg-icon", { key: 'c17df4c2813a346a4ced9be2f872dcdc688baa2e', icon: "chevron-up", class: { 'mg-c-details__toggle-icon': true, 'mg-c-details__toggle-icon--reverse': !this.expanded } }), h("span", { key: '5dc2078f2ba8808dbad0b75f2857173d2bd8d3e5', class: { 'mg-u-visually-hidden': this.hideSummary } }, this.expanded ? this.toggleOpened : this.toggleClosed))), h("div", { key: 'bf9883ad6dbf0c1014ad6559cb5d08b157d80d9b', class: "mg-c-details__details" }, h("slot", { key: '244092eb1aceb39143e53b63faf36ab2a5c4c205', name: "details" }))));
+        return (h("details", { key: 'e43aa4f4262d7006b9fdd0e75666649498081d55', class: "mg-c-details", onToggle: this.handleToggle, open: this.expanded, ref: (el) => (this.details = el) }, h("summary", { key: '050d5c0a645a017aaa784a4034201122b27238f0' }, h("slot", { key: 'e0d7ed83952bdd74a23ecabe93c4d0c922cda286', name: "summary" }), h("span", { key: '27238089072f0f0ca8f3263ec39e41291ab89907', class: "mg-c-details__toggle" }, h("mg-icon", { key: 'f1702911d70e2a95ecaac17a7a0c43a075ea8c18', icon: "chevron-up", class: { 'mg-c-details__toggle-icon': true, 'mg-c-details__toggle-icon--reverse': !this.expanded } }), h("span", { key: '6854f4ecd77d04e297b807060a0d064401d6537f', class: { 'mg-u-visually-hidden': this.hideSummary } }, this.expanded ? this.toggleOpened : this.toggleClosed))), h("div", { key: '85e57b346ff8327d31f92a1e86c42fd8f131f6dc', class: "mg-c-details__details" }, h("slot", { key: 'bd016ab29d695bb1ccd99b9fd402ed23bbdc19ea', name: "details" }))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -668,7 +669,7 @@ const MgForm = class {
          * Identifier is used for the element ID (id is a reserved prop in Stencil.js)
          * If not set, it will be created.
          */
-        this.identifier = xt('mg-form');
+        this.identifier = Pt('mg-form');
         /**
          * Input name
          * If not set the value equals the identifier
@@ -689,7 +690,7 @@ const MgForm = class {
         /**
          * Component classes
          */
-        this.classCollection = new kt(['mg-c-form']);
+        this.classCollection = new Zt(['mg-c-form']);
         /**
          * Define required message based on mg-inputs required elements
          */
@@ -777,18 +778,18 @@ const MgForm = class {
         };
     }
     watchIdentifier(newValue) {
-        if (!Ot(newValue)) {
-            console.error(`<mg-form> prop "identifier" value is invalid. Passed value: ${zt(newValue)}.`);
+        if (!Ut(newValue)) {
+            console.error(`<mg-form> prop "identifier" value is invalid. Passed value: ${Gt(newValue)}.`);
         }
     }
     validateRequiredMessage(newValue) {
         if (newValue && !requiredMessageStatus.includes(newValue)) {
-            throw new Error(`<mg-form> prop "requiredMessage" must be one of: ${requiredMessageStatus.join(', ')}. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-form> prop "requiredMessage" must be one of: ${requiredMessageStatus.join(', ')}. Passed value: ${Gt(newValue)}.`);
         }
     }
     validateAriaRole(newValue) {
         if (newValue && !roles.includes(newValue)) {
-            throw new Error(`<mg-form> prop "ariaRole" must be one of: ${roles.join(', ')}. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-form> prop "ariaRole" must be one of: ${roles.join(', ')}. Passed value: ${Gt(newValue)}.`);
         }
     }
     handlelabelOnTop(newValue) {
@@ -877,7 +878,7 @@ const MgForm = class {
      * @returns HTML Element
      */
     render() {
-        return (h("form", { key: '43c060c027330a9db84c469228536db8d2329c86', class: this.classCollection.join(), id: this.identifier, name: this.name, onSubmit: this.handleFormSubmit, role: this.ariaRole }, this.requiredMessageText && h("p", { key: '42cba44f2075371ae73b097b84012fdbd1b473d8', innerHTML: this.requiredMessageText }), h("slot", { key: '0797165b78e980ab2680f7a3a1c68b13c5140820' }), !this.readonly && !this.disabled && h("slot", { key: 'a13f2ac1e784b0e03408ed811b1c3bec4b730479', name: "actions" })));
+        return (h("form", { key: '444703cae8a5374a86adc1dcaf048665f06e795f', class: this.classCollection.join(), id: this.identifier, name: this.name, onSubmit: this.handleFormSubmit, role: this.ariaRole }, this.requiredMessageText && h("p", { key: '1a936dfeb41a257be7b44afada7bd435f9a357f0', innerHTML: this.requiredMessageText }), h("slot", { key: 'a446094e8658b02c5a9baf7b19d77ca11b1432e9' }), !this.readonly && !this.disabled && h("slot", { key: '41f4e1c80a0f78b112eaac1d5bc53a219eee926e', name: "actions" })));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -922,7 +923,7 @@ const MgIcon = class {
         /**
          * Component classes
          */
-        this.classCollection = new kt(['mg-c-icon']);
+        this.classCollection = new Zt(['mg-c-icon']);
         /**
          * Method to set default varianStyle props
          * needeed has stencil doesn't know that props is mutated when updated in prop watcher
@@ -953,7 +954,7 @@ const MgIcon = class {
     }
     validateIcon(newValue, oldValue) {
         if (!Object.keys(icons).includes(newValue)) {
-            throw new Error(`<mg-icon> prop "icon" must be one of: ${Object.keys(icons).join(', ')}. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-icon> prop "icon" must be one of: ${Object.keys(icons).join(', ')}. Passed value: ${Gt(newValue)}.`);
         }
         else {
             if (oldValue !== undefined) {
@@ -969,7 +970,7 @@ const MgIcon = class {
             newValue = 'medium';
         }
         if (!sizes$3.includes(newValue)) {
-            throw new Error(`<mg-icon> prop "size" must be one of: ${sizes$3.join(', ')}. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-icon> prop "size" must be one of: ${sizes$3.join(', ')}. Passed value: ${Gt(newValue)}.`);
         }
         else {
             if (oldValue !== undefined) {
@@ -981,7 +982,7 @@ const MgIcon = class {
     validateVariant(newValue, oldValue) {
         if (newValue !== undefined) {
             if (!variants$2.includes(newValue))
-                throw new Error(`<mg-icon> prop "variant" must be one of: ${variants$2.join(', ')}. Passed value: ${zt(newValue)}.`);
+                throw new Error(`<mg-icon> prop "variant" must be one of: ${variants$2.join(', ')}. Passed value: ${Gt(newValue)}.`);
             else {
                 this.setDefaultVariantStyle();
                 if (oldValue !== undefined)
@@ -993,7 +994,7 @@ const MgIcon = class {
     validateVariantStyle(newValue, oldValue) {
         if (newValue !== undefined) {
             if (!variantStyles$1.includes(newValue))
-                throw new Error(`<mg-icon> prop "variantStyle" must be one of: ${variantStyles$1.join(', ')}. Passed value: ${zt(newValue)}.`);
+                throw new Error(`<mg-icon> prop "variantStyle" must be one of: ${variantStyles$1.join(', ')}. Passed value: ${Gt(newValue)}.`);
             else {
                 if (oldValue !== undefined)
                     this.classCollection.delete(`mg-c-icon--variant-style-${oldValue}`);
@@ -1063,11 +1064,11 @@ const MgIllustratedMessage = class {
         /**
          * Component classes
          */
-        this.classCollection = new kt(['mg-c-illustrated-message']);
+        this.classCollection = new Zt(['mg-c-illustrated-message']);
     }
     watchSize(newValue, oldValue) {
         if (!sizes$2.includes(newValue)) {
-            throw new Error(`<mg-illustrated-message> prop "size" must be one of: ${sizes$2.join(', ')}. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-illustrated-message> prop "size" must be one of: ${sizes$2.join(', ')}. Passed value: ${Gt(newValue)}.`);
         }
         else {
             if (oldValue !== undefined) {
@@ -1078,7 +1079,7 @@ const MgIllustratedMessage = class {
     }
     watchDirection(newValue, oldValue) {
         if (newValue !== undefined && !directions.includes(newValue)) {
-            throw new Error(`<mg-illustrated-message> prop "direction" must be one of: ${directions.join(', ')}. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-illustrated-message> prop "direction" must be one of: ${directions.join(', ')}. Passed value: ${Gt(newValue)}.`);
         }
         else if (newValue === 'horizontal') {
             this.classCollection.add('mg-c-illustrated-message--direction-horizontal');
@@ -1101,7 +1102,7 @@ const MgIllustratedMessage = class {
         if (slottedDetails.length === 0 && slottedTitle === null) {
             throw new Error('<mg-illustrated-message> Slot "title" or "details" must be present.');
         }
-        else if (slottedTitle !== null && !Tt(slottedTitle, headingTags)) {
+        else if (slottedTitle !== null && !qt(slottedTitle, headingTags)) {
             throw new Error(`<mg-illustrated-message> Slotted title must be a heading: ${headingTags.join(', ')}.`);
         }
         else if (slottedIllustrations.length !== 1) {
@@ -1125,7 +1126,7 @@ const MgIllustratedMessage = class {
      * @returns HTML Element
      */
     render() {
-        return (h("div", { key: '2149de3930476c30fa95c8b117076751fff95029', class: this.classCollection.join() }, h("div", { key: '2795cb4895296c33b0aaf2ff8b2dcda464ce7f60', class: "mg-c-illustrated-message__illustration" }, h("slot", { key: 'fd9f3c1fbcd10bf220d6dd527bf5a8485c505078', name: "illustration" })), h("div", { key: '1acf58c99a54bc100b98ca4bf37ef4fd32242a5f', class: "mg-c-illustrated-message__slots" }, h("slot", { key: 'a1945bb8898198066958f06082e27c6fe3c26153', name: "title" }), h("slot", { key: '97b69594078389495397985e8ccb1e5e0dd4bc3f', name: "details" }))));
+        return (h("div", { key: '60c53ef4294aa36a8c354b42f47f5c7d9fc409f6', class: this.classCollection.join() }, h("div", { key: '254673ae5b7183a1adfa53c18d9e632bcdd67607', class: "mg-c-illustrated-message__illustration" }, h("slot", { key: '16b9bbe8abaae4d0f7b713fbe345e54b5b966ac0', name: "illustration" })), h("div", { key: 'c272c168ea520f8c71261e8f84297fb1bd44c044', class: "mg-c-illustrated-message__slots" }, h("slot", { key: '7ba11d5f5fe293175a01768619bc43b0632ba0a5', name: "title" }), h("slot", { key: 'f03540939af486bb44134298b12eaf9de32f814a', name: "details" }))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -1186,11 +1187,11 @@ const MgInput = class {
         this.renderTooltip = () => (h("mg-tooltip", { identifier: `${this.identifier}-tooltip`, message: this.tooltip }, h("mg-icon", { icon: "info-circle" })));
     }
     watchIdentifier(newValue) {
-        if (!Le(newValue)) {
-            throw new Error(`<mg-input> prop "identifier" is required and must be a string. Passed value: ${zt(newValue)}.`);
+        if (!De(newValue)) {
+            throw new Error(`<mg-input> prop "identifier" is required and must be a string. Passed value: ${Gt(newValue)}.`);
         }
-        else if (!Ot(newValue)) {
-            console.error(`<mg-input> prop "identifier" value is invalid. Passed value: ${zt(newValue)}.`);
+        else if (!Ut(newValue)) {
+            console.error(`<mg-input> prop "identifier" value is invalid. Passed value: ${Gt(newValue)}.`);
         }
         else {
             this.helpTextId = `${this.identifier}-help-text`;
@@ -1212,7 +1213,7 @@ const MgInput = class {
     }
     watchTooltipPosition(newValue) {
         if (!tooltipPositions.includes(newValue)) {
-            throw new Error(`<mg-input> prop "tooltipPosition" must be one of: ${tooltipPositions.join(', ')}. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-input> prop "tooltipPosition" must be one of: ${tooltipPositions.join(', ')}. Passed value: ${Gt(newValue)}.`);
         }
     }
     watchErrorMessage(newValue) {
@@ -1281,8 +1282,8 @@ const MgInput = class {
      */
     // eslint-disable-next-line @stencil-community/no-unused-watch
     watchLabel() {
-        if (!Le(this.label)) {
-            throw new Error(`<mg-input> prop "label" is required and must be a string. Passed value: ${zt(this.label)}.`);
+        if (!De(this.label)) {
+            throw new Error(`<mg-input> prop "label" is required and must be a string. Passed value: ${Gt(this.label)}.`);
         }
         else {
             this.watchAriaDescribedbyIDs();
@@ -1486,7 +1487,7 @@ const MgInputCheckbox = class {
         /**
          * Component classes
          */
-        this.classCollection = new kt([this.baseClassName, classFieldset]);
+        this.classCollection = new Zt([this.baseClassName, classFieldset]);
         /**
          * Formated value to display in list
          */
@@ -1604,7 +1605,7 @@ const MgInputCheckbox = class {
          * Method to update searchResults
          */
         this.updateSearchResults = () => {
-            this.searchResults = this.checkboxItems.filter(item => Lt(item.title).includes(Lt(this.searchValue)));
+            this.searchResults = this.checkboxItems.filter(item => Jt(item.title).includes(Jt(this.searchValue)));
         };
         /**
          * Method to validate if one of inputs value is checked id required
@@ -1636,13 +1637,13 @@ const MgInputCheckbox = class {
          * @returns message to display
          */
         this.getSelectValuesButtonMessage = () => {
-            if (this.selectValuesButtonKey === 'editButton' && Le(this.editButtonMessage)) {
+            if (this.selectValuesButtonKey === 'editButton' && De(this.editButtonMessage)) {
                 return this.editButtonMessage;
             }
-            else if (this.selectValuesButtonKey === 'showButton' && Le(this.showButtonMessage)) {
+            else if (this.selectValuesButtonKey === 'showButton' && De(this.showButtonMessage)) {
                 return this.showButtonMessage;
             }
-            else if (this.selectValuesButtonKey === 'selectButton' && Le(this.selectButtonMessage)) {
+            else if (this.selectValuesButtonKey === 'selectButton' && De(this.selectButtonMessage)) {
                 return this.selectButtonMessage;
             }
             else {
@@ -1698,12 +1699,12 @@ const MgInputCheckbox = class {
             this.valueChange.emit(newValue);
         }
         else {
-            throw new Error(`<mg-input-checkbox> prop "value" is required and all values must be the same type, CheckboxItem. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-input-checkbox> prop "value" is required and all values must be the same type, CheckboxItem. Passed value: ${Gt(newValue)}.`);
         }
     }
     validateType(newValue) {
         if (newValue !== undefined && !checkboxTypes.includes(newValue)) {
-            throw new Error(`<mg-input-checkbox> prop "type" must be a CheckboxType. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-input-checkbox> prop "type" must be a CheckboxType. Passed value: ${Gt(newValue)}.`);
         }
         else if (newValue === undefined) {
             this.mode = 'auto';
@@ -1803,7 +1804,7 @@ const MgInputCheckbox = class {
         if (typeof valid !== 'boolean') {
             throw new Error('<mg-input-checkbox> method "setError()" param "valid" must be a boolean.');
         }
-        else if (!Le(errorMessage)) {
+        else if (!De(errorMessage)) {
             throw new Error('<mg-input-checkbox> method "setError()" param "errorMessage" must be a string.');
         }
         else {
@@ -2075,7 +2076,7 @@ const MgInputCheckboxPaginated = class {
 
 const DEFAULT_MAX_DATE = '9999-12-31';
 
-const mgInputDateCss = ".mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);word-break:break-word}.mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:-0.2rem;outline-style:solid;outline-width:.2rem}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.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}}";
+const mgInputDateCss = ".mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);word-break:break-word}.mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:-0.2rem;outline-style:solid;outline-width:.2rem}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input.mg-c-input--has-icon .mg-c-input__with-character-left>mg-icon:first-of-type,.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container>mg-icon:first-of-type{position:absolute;top:50%;left:var(--mg-b-size-8);color:var(--mg-c-input-color-icon);transform:translateY(-50%)}.mg-c-input.mg-c-input--has-icon .mg-c-input__with-character-left .mg-c-input__box,.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container .mg-c-input__box{padding-left:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2)}.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}}";
 
 const MgInputDate = class {
     constructor(hostRef) {
@@ -2121,13 +2122,13 @@ const MgInputDate = class {
         /**
          * Component classes
          */
-        this.classCollection = new kt(['mg-c-input--date']);
+        this.classCollection = new Zt(['mg-c-input--date']);
         /**
          * Method to validate date pattern string
          * @param value - value to test
          * @returns truthy when value match the pattern
          */
-        this.isValidPattern = (value) => Le(value) && wt.test(value);
+        this.isValidPattern = (value) => De(value) && Lt.test(value);
         /**
          * Format help text to display
          * @param helpText - help text format
@@ -2141,23 +2142,23 @@ const MgInputDate = class {
             }
             const defaultHelpTextVariable = '{defaultHelpText}';
             // If a custom helpText is provided, store it but don't return it directly
-            let text = Le(helpText) ? helpText : this.messages.input.date.helpText.expectedFormat;
+            let text = De(helpText) ? helpText : this.messages.input.date.helpText.expectedFormat;
             // Handle defaultHelpText
             if (text.includes(defaultHelpTextVariable)) {
                 text = text.replace(defaultHelpTextVariable, this.formatHelpText(this.messages.input.date.helpText.expectedFormat));
             }
             // Replace pattern and date variables
-            text = text.replace('{pattern}', this.renderPattern()).replace('{date}', Et(Ht(new Date('2025-12-24')), this.systemLocale));
+            text = text.replace('{pattern}', this.renderPattern()).replace('{date}', Ft(ar(new Date('2025-12-24')), this.systemLocale));
             // Add additional message for min/max if necessary
             let rangeMessage;
             if (((_a = this.min) === null || _a === void 0 ? void 0 : _a.length) > 0 && this.max !== DEFAULT_MAX_DATE) {
-                rangeMessage = this.messages.input.date.helpText.minMax.replace('{min}', Et(this.min, this.systemLocale)).replace('{max}', Et(this.max, this.systemLocale));
+                rangeMessage = this.messages.input.date.helpText.minMax.replace('{min}', Ft(this.min, this.systemLocale)).replace('{max}', Ft(this.max, this.systemLocale));
             }
             else if (((_b = this.min) === null || _b === void 0 ? void 0 : _b.length) > 0) {
-                rangeMessage = this.messages.input.date.helpText.min.replace('{min}', Et(this.min, this.systemLocale));
+                rangeMessage = this.messages.input.date.helpText.min.replace('{min}', Ft(this.min, this.systemLocale));
             }
             else if (this.max !== DEFAULT_MAX_DATE) {
-                rangeMessage = this.messages.input.date.helpText.max.replace('{max}', Et(this.max, this.systemLocale));
+                rangeMessage = this.messages.input.date.helpText.max.replace('{max}', Ft(this.max, this.systemLocale));
             }
             // Combine custom helpText with range message if both exist
             if (text !== undefined && rangeMessage !== undefined) {
@@ -2254,15 +2255,15 @@ const MgInputDate = class {
                 // min, max & minMax
                 else if (['min', 'max', 'minMax'].includes(inputError)) {
                     this.errorMessage = this.messages.input.date.helpText[inputError]
-                        .replace('{min}', Et(this.min, this.systemLocale))
-                        .replace('{max}', Et(this.max, this.systemLocale));
+                        .replace('{min}', Ft(this.min, this.systemLocale))
+                        .replace('{max}', Ft(this.max, this.systemLocale));
                 }
                 // wrong date format
                 // element.validity.badInput is default error message
                 else {
                     this.errorMessage = this.messages.input.date.error.badInput
                         .replace('{pattern}', this.renderPattern())
-                        .replace('{date}', Et(Ht(new Date('2025-12-24')), this.systemLocale));
+                        .replace('{date}', Ft(ar(new Date('2025-12-24')), this.systemLocale));
                 }
             }
         };
@@ -2271,7 +2272,7 @@ const MgInputDate = class {
          * @returns translated html pattern
          */
         this.renderPattern = () => {
-            let patternLocal = Bt(this.systemLocale);
+            let patternLocal = ir(this.systemLocale);
             for (const key in this.messages.input.date.pattern) {
                 patternLocal = patternLocal.replace(key, this.messages.input.date.pattern[key]);
             }
@@ -2286,9 +2287,9 @@ const MgInputDate = class {
             // - `undefined` is not allowed in CustomEvent['detail']
             this.value = null;
         }
-        else if (newValue && !Le(newValue)) {
+        else if (newValue && !De(newValue)) {
             // check value validity
-            throw new Error(`<mg-input-date> props 'value' must be a valid string. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-input-date> props 'value' must be a valid string. Passed value: ${Gt(newValue)}.`);
         }
         else if (newValue === null || this.isValidPattern(newValue)) {
             this.valueChange.emit(newValue);
@@ -2305,7 +2306,7 @@ const MgInputDate = class {
     }
     validateMinMax(newValue) {
         if (newValue && !this.isValidPattern(newValue)) {
-            throw new Error(`<mg-input-date> props 'min/max' doesn't match pattern: 'yyyy-mm-dd'. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-input-date> props 'min/max' doesn't match pattern: 'yyyy-mm-dd'. Passed value: ${Gt(newValue)}.`);
         }
     }
     handleValidityChange(newValue, _oldValue, prop) {
@@ -2355,7 +2356,7 @@ const MgInputDate = class {
         if (typeof valid !== 'boolean') {
             throw new Error('<mg-input-date> method "setError()" param "valid" must be a boolean.');
         }
-        else if (!Le(errorMessage)) {
+        else if (!De(errorMessage)) {
             throw new Error('<mg-input-date> method "setError()" param "errorMessage" must be a string.');
         }
         else {
@@ -2421,7 +2422,7 @@ const MgInputDate = class {
      * @returns HTML Element
      */
     render() {
-        return (h("mg-input", { key: 'cd165b83782c74dab134a1315edd000ea3a9277b', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && this.value === null ? 'label' : this.tooltipPosition, helpText: this.formatHelpText(this.helpText), errorMessage: this.errorMessage }, this.readonly ? (this.value && h("b", { class: "mg-c-input__readonly-value" }, Et(this.value, this.locale))) : (h("input", { type: "date", class: "mg-c-input__box", min: this.min, max: this.max, value: this.value, id: this.identifier, name: this.name, disabled: this.disabled, required: this.required, "aria-invalid": (this.invalid === true).toString(), onInput: this.handleInput, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown, ref: (el) => {
+        return (h("mg-input", { key: '504777cb807b9747a6c854d7056cb5420eb2cdcf', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && this.value === null ? 'label' : this.tooltipPosition, helpText: this.formatHelpText(this.helpText), errorMessage: this.errorMessage }, this.readonly ? (this.value && h("b", { class: "mg-c-input__readonly-value" }, Ft(this.value, this.locale))) : (h("input", { type: "date", class: "mg-c-input__box", min: this.min, max: this.max, value: this.value, id: this.identifier, name: this.name, disabled: this.disabled, required: this.required, "aria-invalid": (this.invalid === true).toString(), onInput: this.handleInput, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown, ref: (el) => {
                 if (el !== null)
                     this.input = el;
             } }))));
@@ -2444,7 +2445,7 @@ MgInputDate.style = mgInputDateCss;
 const types = ['decimal', 'integer'];
 const formats = ['none', 'number', 'currency', 'percent', 'unit'];
 
-const mgInputNumericCss = ".mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:-0.2rem;outline-style:solid;outline-width:.2rem}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);word-break:break-word}.mg-c-input__input-container{width:100%;flex:1 auto}.mg-c-input.mg-c-input--width-full .mg-c-input__box{width:100%}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left{width:max-content}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:has(textarea){flex-grow:inherit}.mg-c-input.mg-c-input--width-2 .mg-c-input__box{width:var(--mg-b-size-48)}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-48) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-4 .mg-c-input__box{width:var(--mg-b-size-72)}.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-72) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-16 .mg-c-input__box{width:calc(26*var(--mg-b-size-8))}.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(calc(26 * var(--mg-b-size-8)) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-full:not(.mg-c-input--label-on-top){justify-content:stretch}.mg-c-input.mg-c-input--is-input-group-append ::slotted([slot=append-input]),.mg-c-input.mg-c-input--is-append-input-slot-content ::slotted([slot=append-input]){width:auto}:host(.mg-c-input.mg-c-input--width-full) ::slotted(*:not(mg-input-title)){width:100%;max-width:100%}.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-input .mg-c-input__box{width:auto;text-align:var(--mg-c-input-text-align, right)}";
+const mgInputNumericCss = ".mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:-0.2rem;outline-style:solid;outline-width:.2rem}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input.mg-c-input--has-icon .mg-c-input__with-character-left>mg-icon:first-of-type,.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container>mg-icon:first-of-type{position:absolute;top:50%;left:var(--mg-b-size-8);color:var(--mg-c-input-color-icon);transform:translateY(-50%)}.mg-c-input.mg-c-input--has-icon .mg-c-input__with-character-left .mg-c-input__box,.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container .mg-c-input__box{padding-left:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2)}.mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);word-break:break-word}.mg-c-input__input-container{width:100%;flex:1 auto}.mg-c-input.mg-c-input--width-full .mg-c-input__box{width:100%}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left{width:max-content}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:has(textarea){flex-grow:inherit}.mg-c-input.mg-c-input--width-2 .mg-c-input__box{width:var(--mg-b-size-48)}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-48) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-4 .mg-c-input__box{width:var(--mg-b-size-72)}.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-72) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-16 .mg-c-input__box{width:calc(26*var(--mg-b-size-8))}.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(calc(26 * var(--mg-b-size-8)) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-full:not(.mg-c-input--label-on-top){justify-content:stretch}.mg-c-input.mg-c-input--is-input-group-append ::slotted([slot=append-input]),.mg-c-input.mg-c-input--is-append-input-slot-content ::slotted([slot=append-input]){width:auto}:host(.mg-c-input.mg-c-input--width-full) ::slotted(*:not(mg-input-title)){width:100%;max-width:100%}.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-input .mg-c-input__box{width:auto;text-align:var(--mg-c-input-text-align, right)}";
 
 const MgInputNumeric = class {
     constructor(hostRef) {
@@ -2512,17 +2513,17 @@ const MgInputNumeric = class {
         /**
          * Component classes
          */
-        this.classCollection = new kt(['mg-c-input--numeric']);
+        this.classCollection = new Zt(['mg-c-input--numeric']);
         /**
          * Handle input event
          */
         this.handleInput = () => {
+            this.value = this.input.value;
             // Check validity
             this.checkValidity();
             if (this.hasDisplayedError) {
                 this.setErrorMessage();
             }
-            this.value = this.input.value;
         };
         /**
          * Handle focus event
@@ -2555,7 +2556,7 @@ const MgInputNumeric = class {
          * @param value - value to format
          * @returns formatted value according to locale
          */
-        this.formatErrorValue = (value) => Gt(value, this.locale, !Number.isInteger(value) && this.type === 'decimal' ? this.decimalLength : 0);
+        this.formatErrorValue = (value) => lr(value, this.locale, !Number.isInteger(value) && this.type === 'decimal' ? this.decimalLength : 0);
         /**
          * Set input error message
          * @param errorMessage - errorMessage override
@@ -2610,13 +2611,13 @@ const MgInputNumeric = class {
         this.formatValue = (value) => {
             switch (this.format) {
                 case 'number':
-                    return Gt(value, this.locale, this.type === 'decimal' ? this.decimalLength : undefined);
+                    return lr(value, this.locale, this.type === 'decimal' ? this.decimalLength : undefined);
                 case 'currency':
-                    return Pt(value, this.locale, this.currency);
+                    return or(value, this.locale, this.currency);
                 case 'percent':
-                    return Wt(value / 100, this.locale, this.type === 'decimal' ? this.decimalLength : undefined);
+                    return cr(value / 100, this.locale, this.type === 'decimal' ? this.decimalLength : undefined);
                 case 'unit':
-                    return Xt(value, this.locale, this.unit, this.unitDisplay, this.type === 'decimal' ? this.decimalLength : undefined);
+                    return fr(value, this.locale, this.unit, this.unitDisplay, this.type === 'decimal' ? this.decimalLength : undefined);
                 case 'none':
                     return value.toString();
             }
@@ -2647,7 +2648,7 @@ const MgInputNumeric = class {
                 return undefined;
             }
             // If a custom helpText is provided, store it but don't return it directly
-            const text = Le(helpText) ? helpText : undefined;
+            const text = De(helpText) ? helpText : undefined;
             // If neither min nor max are defined, and there's no custom helpText,
             // we can return undefined as there's no message to display
             if (this.min === undefined && this.max === undefined && text === undefined) {
@@ -2731,22 +2732,22 @@ const MgInputNumeric = class {
     }
     validateType(newValue) {
         if (!types.includes(newValue)) {
-            throw new Error(`<mg-input-numeric> prop "type" must be one of: ${types.join(', ')}. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-input-numeric> prop "type" must be one of: ${types.join(', ')}. Passed value: ${Gt(newValue)}.`);
         }
     }
     watchFormat(newValue) {
         if (!formats.includes(newValue)) {
-            throw new Error(`<mg-input-numeric> prop "format" must be one of: ${formats.join(', ')}. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-input-numeric> prop "format" must be one of: ${formats.join(', ')}. Passed value: ${Gt(newValue)}.`);
         }
     }
     validateIntegerLength(newValue) {
         if (newValue < 1) {
-            throw new Error(`<mg-input-numeric> prop "integer-length" must be a positive number. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-input-numeric> prop "integer-length" must be a positive number. Passed value: ${Gt(newValue)}.`);
         }
     }
     validateDecimalLength(newValue) {
         if (newValue < 1) {
-            throw new Error(`<mg-input-numeric> prop "decimal-length" must be a positive number, consider using prop "type" to "integer" instead. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-input-numeric> prop "decimal-length" must be a positive number, consider using prop "type" to "integer" instead. Passed value: ${Gt(newValue)}.`);
         }
     }
     /**
@@ -2780,7 +2781,7 @@ const MgInputNumeric = class {
         if (typeof valid !== 'boolean') {
             throw new Error('<mg-input-numeric> method "setError()" param "valid" must be a boolean.');
         }
-        else if (!Le(errorMessage)) {
+        else if (!De(errorMessage)) {
             throw new Error('<mg-input-numeric> method "setError()" param "errorMessage" must be a string.');
         }
         else {
@@ -2881,7 +2882,7 @@ const MgInputNumeric = class {
      * @returns HTML Element
      */
     render() {
-        return (h("mg-input", { key: '323e6dcdd6c2c416bfcbfa868f0fd685880f45be', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && this.value === undefined ? 'label' : this.tooltipPosition, helpText: this.formatHelpText(this.helpText), errorMessage: this.errorMessage }, this.readonly
+        return (h("mg-input", { key: '3f78e44ccfd37e0d9245b368e66d5650fa3c642c', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && this.value === undefined ? 'label' : this.tooltipPosition, helpText: this.formatHelpText(this.helpText), errorMessage: this.errorMessage }, this.readonly
             ? this.readonlyValue && this.renderReadonly()
             : [
                 h("input", { key: "input", type: "text", class: "mg-c-input__box mg-c-input__box--width", value: this.displayValue(), id: this.identifier, name: this.name, placeholder: this.placeholder, title: this.placeholder, disabled: this.disabled, required: this.required, autocomplete: "off", "aria-invalid": (this.invalid === true).toString(), onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur, ref: (el) => {
@@ -2908,7 +2909,7 @@ const MgInputNumeric = class {
 };
 MgInputNumeric.style = mgInputNumericCss;
 
-const mgInputPasswordCss = ".mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:-0.2rem;outline-style:solid;outline-width:.2rem}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);word-break:break-word}.mg-c-input__input-container{width:100%;flex:1 auto}.mg-c-input.mg-c-input--width-full .mg-c-input__box{width:100%}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left{width:max-content}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:has(textarea){flex-grow:inherit}.mg-c-input.mg-c-input--width-2 .mg-c-input__box{width:var(--mg-b-size-48)}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-48) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-4 .mg-c-input__box{width:var(--mg-b-size-72)}.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-72) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-16 .mg-c-input__box{width:calc(26*var(--mg-b-size-8))}.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(calc(26 * var(--mg-b-size-8)) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-full:not(.mg-c-input--label-on-top){justify-content:stretch}.mg-c-input.mg-c-input--is-input-group-append ::slotted([slot=append-input]),.mg-c-input.mg-c-input--is-append-input-slot-content ::slotted([slot=append-input]){width:auto}:host(.mg-c-input.mg-c-input--width-full) ::slotted(*:not(mg-input-title)){width:100%;max-width:100%}.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-input.mg-c-input--password .mg-c-input__input-icon{color:var(--mg-b-color-dark)}.mg-c-input.mg-c-input--password .mg-c-input__input-group{position:relative;flex-grow:1}.mg-c-input.mg-c-input--password .mg-c-input__append-button{position:absolute;right:0}.mg-c-input.mg-c-input--password .mg-c-input__box{padding-right:calc(var(--mg-b-size-min-height) + var(--mg-b-size-8))}.mg-c-input.mg-c-input--password .mg-c-input__box::-ms-reveal{display:none}";
+const mgInputPasswordCss = ".mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:-0.2rem;outline-style:solid;outline-width:.2rem}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input.mg-c-input--has-icon .mg-c-input__with-character-left>mg-icon:first-of-type,.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container>mg-icon:first-of-type{position:absolute;top:50%;left:var(--mg-b-size-8);color:var(--mg-c-input-color-icon);transform:translateY(-50%)}.mg-c-input.mg-c-input--has-icon .mg-c-input__with-character-left .mg-c-input__box,.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container .mg-c-input__box{padding-left:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2)}.mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);word-break:break-word}.mg-c-input__input-container{width:100%;flex:1 auto}.mg-c-input.mg-c-input--width-full .mg-c-input__box{width:100%}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left{width:max-content}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:has(textarea){flex-grow:inherit}.mg-c-input.mg-c-input--width-2 .mg-c-input__box{width:var(--mg-b-size-48)}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-48) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-4 .mg-c-input__box{width:var(--mg-b-size-72)}.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-72) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-16 .mg-c-input__box{width:calc(26*var(--mg-b-size-8))}.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(calc(26 * var(--mg-b-size-8)) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-full:not(.mg-c-input--label-on-top){justify-content:stretch}.mg-c-input.mg-c-input--is-input-group-append ::slotted([slot=append-input]),.mg-c-input.mg-c-input--is-append-input-slot-content ::slotted([slot=append-input]){width:auto}:host(.mg-c-input.mg-c-input--width-full) ::slotted(*:not(mg-input-title)){width:100%;max-width:100%}.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-input.mg-c-input--password .mg-c-input__input-icon{color:var(--mg-b-color-dark)}.mg-c-input.mg-c-input--password .mg-c-input__input-group{position:relative;flex-grow:1}.mg-c-input.mg-c-input--password .mg-c-input__append-button{position:absolute;right:0}.mg-c-input.mg-c-input--password .mg-c-input__box{padding-right:calc(var(--mg-b-size-min-height) + var(--mg-b-size-8))}.mg-c-input.mg-c-input--password .mg-c-input__box::-ms-reveal{display:none}";
 
 const MgInputPassword = class {
     constructor(hostRef) {
@@ -2953,7 +2954,7 @@ const MgInputPassword = class {
         /**
          * Component classes
          */
-        this.classCollection = new kt(['mg-c-input--password']);
+        this.classCollection = new Zt(['mg-c-input--password']);
         /**
          * Indicates if password is displayed or not
          */
@@ -3073,7 +3074,7 @@ const MgInputPassword = class {
         if (typeof valid !== 'boolean') {
             throw new Error('<mg-input-password> method "setError()" param "valid" must be a boolean.');
         }
-        else if (!Le(errorMessage)) {
+        else if (!De(errorMessage)) {
             throw new Error('<mg-input-password> method "setError()" param "errorMessage" must be a string.');
         }
         else {
@@ -3130,7 +3131,7 @@ const MgInputPassword = class {
      * @returns HTML Element
      */
     render() {
-        return (h("mg-input", { key: '7ee11e7f8788011f24bee13f379c6c07766ee37f', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && this.value === undefined ? 'label' : this.tooltipPosition, helpText: this.helpText, errorMessage: this.errorMessage }, this.readonly ? (this.value !== undefined && h("b", { class: "mg-c-input__readonly-value" }, '•'.repeat(this.value.length))) : (h("span", { class: "mg-c-input__input-group" }, h("input", { type: this.displayPassword ? 'text' : 'password', class: "mg-c-input__box mg-c-input__box--width", value: this.value, id: this.identifier, name: this.name, placeholder: this.placeholder, title: this.placeholder, disabled: this.disabled, required: this.required, maxlength: this.maxlength, "aria-invalid": (this.invalid === true).toString(), onInput: this.handleInput, onBlur: this.handleBlur, ref: (el) => {
+        return (h("mg-input", { key: 'ac5e6acb05dbad179aa6c216bf49531399276563', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && this.value === undefined ? 'label' : this.tooltipPosition, helpText: this.helpText, errorMessage: this.errorMessage }, this.readonly ? (this.value !== undefined && h("b", { class: "mg-c-input__readonly-value" }, '•'.repeat(this.value.length))) : (h("span", { class: "mg-c-input__input-group" }, h("input", { type: this.displayPassword ? 'text' : 'password', class: "mg-c-input__box mg-c-input__box--width", value: this.value, id: this.identifier, name: this.name, placeholder: this.placeholder, title: this.placeholder, disabled: this.disabled, required: this.required, maxlength: this.maxlength, "aria-invalid": (this.invalid === true).toString(), onInput: this.handleInput, onBlur: this.handleBlur, ref: (el) => {
                 if (el !== null)
                     this.input = el;
             } }), h("mg-button", { label: this.messages.input.password[this.displayPassword ? 'hide' : 'display'], disabled: this.disabled, variant: "flat", class: "mg-c-input__append-button", "is-icon": true, onClick: this.toggleDisplayPassword, "aria-controls": this.identifier }, h("mg-icon", { class: "mg-c-input__input-icon", icon: this.displayPassword ? 'eye-slash' : 'eye' }))))));
@@ -3204,7 +3205,7 @@ const MgInputRadio = class {
         /**
          * Component classes
          */
-        this.classCollection = new kt(['mg-c-input--radio', classFieldset]);
+        this.classCollection = new Zt(['mg-c-input--radio', classFieldset]);
         /**
          * Handle input event
          * @param event - input event
@@ -3255,7 +3256,7 @@ const MgInputRadio = class {
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     watchValue(newValue) {
         var _a;
-        if (At(this.items) && typeof newValue === 'string') {
+        if (Dt(this.items) && typeof newValue === 'string') {
             this.readonlyValue = newValue;
         }
         else if (Array.isArray(this.items) && this.items.every(isOption$3)) {
@@ -3269,10 +3270,10 @@ const MgInputRadio = class {
     validateItems(newValue) {
         // Validate if items have required min length
         if (typeof newValue === 'object' && newValue.length < 2) {
-            throw new Error(`<mg-input-radio> prop "items" require at least 2 items. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-input-radio> prop "items" require at least 2 items. Passed value: ${Gt(newValue)}.`);
         }
         // String array
-        else if (At(newValue)) {
+        else if (Dt(newValue)) {
             this.options = newValue.map(item => ({ title: item, value: item, disabled: this.disabled }));
         }
         // Object array
@@ -3280,7 +3281,7 @@ const MgInputRadio = class {
             this.options = newValue;
         }
         else {
-            throw new Error(`<mg-input-radio> prop "items" is required and all items must be the same type, string or RadioOption. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-input-radio> prop "items" is required and all items must be the same type, string or RadioOption. Passed value: ${Gt(newValue)}.`);
         }
     }
     watchInputVerticalList(newValue) {
@@ -3342,7 +3343,7 @@ const MgInputRadio = class {
         if (typeof valid !== 'boolean') {
             throw new Error('<mg-input-radio> method "setError()" param "valid" must be a boolean.');
         }
-        else if (!Le(errorMessage)) {
+        else if (!De(errorMessage)) {
             throw new Error('<mg-input-radio> method "setError()" param "errorMessage" must be a string.');
         }
         else {
@@ -3402,7 +3403,7 @@ const MgInputRadio = class {
      * @returns HTML Element
      */
     render() {
-        return (h("mg-input", { key: 'd03651917d40124900adbcfd6d5e8bdb44ba340d', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && !this.value ? 'label' : this.tooltipPosition, helpText: this.helpText, errorMessage: this.errorMessage }, this.readonly ? (this.readonlyValue && h("b", { class: "mg-c-input__readonly-value" }, this.readonlyValue)) : (h("ul", { class: "mg-c-input__input-group-container", role: "list" }, this.options.map((input, index) => (h("li", { key: input.title, class: { 'mg-c-input__input-group': true, 'mg-c-input__input-group--disabled': this.disabled || input.disabled } }, h("input", { type: "radio", id: this.identifier + '_' + index, name: this.identifier, value: index, checked: JSON.stringify(this.value) === JSON.stringify(this.options[index].value), disabled: this.disabled || input.disabled, required: this.required, onBlur: this.handleBlur, onInput: this.handleInput, ref: (el) => {
+        return (h("mg-input", { key: '9d8c6fb134330e0d126f3585f3c4c4145d39515a', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && !this.value ? 'label' : this.tooltipPosition, helpText: this.helpText, errorMessage: this.errorMessage }, this.readonly ? (this.readonlyValue && h("b", { class: "mg-c-input__readonly-value" }, this.readonlyValue)) : (h("ul", { class: "mg-c-input__input-group-container", role: "list" }, this.options.map((input, index) => (h("li", { key: input.title, class: { 'mg-c-input__input-group': true, 'mg-c-input__input-group--disabled': this.disabled || input.disabled } }, h("input", { type: "radio", id: this.identifier + '_' + index, name: this.identifier, value: index, checked: JSON.stringify(this.value) === JSON.stringify(this.options[index].value), disabled: this.disabled || input.disabled, required: this.required, onBlur: this.handleBlur, onInput: this.handleInput, ref: (el) => {
                 if (el !== null)
                     this.inputs[index] = el;
             } }), h("label", { htmlFor: this.identifier + '_' + index }, input.title))))))));
@@ -3419,7 +3420,7 @@ const MgInputRadio = class {
 };
 MgInputRadio.style = mgInputRadioCss;
 
-const mgInputSelectCss = ".mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:-0.2rem;outline-style:solid;outline-width:.2rem}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);word-break:break-word}.mg-c-input__input-container{width:100%;flex:1 auto}.mg-c-input.mg-c-input--width-full .mg-c-input__box{width:100%}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left{width:max-content}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:has(textarea){flex-grow:inherit}.mg-c-input.mg-c-input--width-2 .mg-c-input__box{width:var(--mg-b-size-48)}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-48) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-4 .mg-c-input__box{width:var(--mg-b-size-72)}.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-72) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-16 .mg-c-input__box{width:calc(26*var(--mg-b-size-8))}.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(calc(26 * var(--mg-b-size-8)) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-full:not(.mg-c-input--label-on-top){justify-content:stretch}.mg-c-input.mg-c-input--is-input-group-append ::slotted([slot=append-input]),.mg-c-input.mg-c-input--is-append-input-slot-content ::slotted([slot=append-input]){width:auto}:host(.mg-c-input.mg-c-input--width-full) ::slotted(*:not(mg-input-title)){width:100%;max-width:100%}.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-input__box{padding-top:0;padding-right:var(--mg-b-size-8);padding-bottom:0}@media screen and (max-width: 767px){.mg-c-input__box{width:100%}}";
+const mgInputSelectCss = ".mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:-0.2rem;outline-style:solid;outline-width:.2rem}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input.mg-c-input--has-icon .mg-c-input__with-character-left>mg-icon:first-of-type,.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container>mg-icon:first-of-type{position:absolute;top:50%;left:var(--mg-b-size-8);color:var(--mg-c-input-color-icon);transform:translateY(-50%)}.mg-c-input.mg-c-input--has-icon .mg-c-input__with-character-left .mg-c-input__box,.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container .mg-c-input__box{padding-left:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2)}.mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);word-break:break-word}.mg-c-input__input-container{width:100%;flex:1 auto}.mg-c-input.mg-c-input--width-full .mg-c-input__box{width:100%}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left{width:max-content}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:has(textarea){flex-grow:inherit}.mg-c-input.mg-c-input--width-2 .mg-c-input__box{width:var(--mg-b-size-48)}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-48) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-4 .mg-c-input__box{width:var(--mg-b-size-72)}.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-72) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-16 .mg-c-input__box{width:calc(26*var(--mg-b-size-8))}.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(calc(26 * var(--mg-b-size-8)) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-full:not(.mg-c-input--label-on-top){justify-content:stretch}.mg-c-input.mg-c-input--is-input-group-append ::slotted([slot=append-input]),.mg-c-input.mg-c-input--is-append-input-slot-content ::slotted([slot=append-input]){width:auto}:host(.mg-c-input.mg-c-input--width-full) ::slotted(*:not(mg-input-title)){width:100%;max-width:100%}.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-input__box{padding-top:0;padding-right:var(--mg-b-size-8);padding-bottom:0}@media screen and (max-width: 767px){.mg-c-input__box{width:100%}}";
 
 /**
  * Check if item is a well configured option
@@ -3510,7 +3511,7 @@ const MgInputSelect = class {
         /**
          * Component classes
          */
-        this.classCollection = new kt(['mg-c-input--select']);
+        this.classCollection = new Zt(['mg-c-input--select']);
         /**
          * Handle input event
          */
@@ -3540,7 +3541,7 @@ const MgInputSelect = class {
             if (this.input.value === '') {
                 this.setValue(null);
             }
-            else if (At(this.items) && this.items.includes(this.input.value)) {
+            else if (Dt(this.items) && this.items.includes(this.input.value)) {
                 this.setValue(this.input.value);
             }
             else if (allItemsAreOptions(this.items) && typeof this.input.value === 'string' && this.items.some(this.isInputValue)) {
@@ -3598,7 +3599,7 @@ const MgInputSelect = class {
     }
     validateValue(newValue) {
         var _a, _b;
-        if (At(this.items) && typeof newValue === 'string') {
+        if (Dt(this.items) && typeof newValue === 'string') {
             this.readonlyValue = ((_a = this.input) === null || _a === void 0 ? void 0 : _a.value) !== undefined ? this.input.value : newValue;
         }
         else if (allItemsAreOptions(this.items)) {
@@ -3615,7 +3616,7 @@ const MgInputSelect = class {
             this.options = [];
         }
         // String array
-        else if (At(newValue)) {
+        else if (Dt(newValue)) {
             if (typeof this.value === 'string')
                 this.valueExist = newValue.includes(this.value);
             this.options = newValue.map(item => ({ title: item, value: item }));
@@ -3633,7 +3634,7 @@ const MgInputSelect = class {
             }
         }
         else {
-            throw new Error(`<mg-input-select> prop "items" is required, can be an empty Array or all items must be the same type: string or Option. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-input-select> prop "items" is required, can be an empty Array or all items must be the same type: string or Option. Passed value: ${Gt(newValue)}.`);
         }
     }
     watchReadonly(newValue) {
@@ -3698,7 +3699,7 @@ const MgInputSelect = class {
         if (typeof valid !== 'boolean') {
             throw new Error('<mg-input-select> method "setError()" param "valid" must be a boolean.');
         }
-        else if (!Le(errorMessage)) {
+        else if (!De(errorMessage)) {
             throw new Error('<mg-input-select> method "setError()" param "errorMessage" must be a string.');
         }
         else {
@@ -3762,7 +3763,7 @@ const MgInputSelect = class {
      * @returns HTML Element
      */
     render() {
-        return (h("mg-input", { key: '29773c7b59849212a3ab91b3ec1b7070e9c22a66', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && this.readonlyValue === null ? 'label' : this.tooltipPosition, helpText: this.helpText, errorMessage: this.errorMessage }, this.readonly ? (this.readonlyValue && h("b", { class: "mg-c-input__readonly-value" }, this.readonlyValue)) : (h("select", { class: "mg-c-input__box", id: this.identifier, name: this.name, title: this.placeholder, disabled: this.disabled, required: this.required, "aria-invalid": (this.invalid === true).toString(), onInput: this.handleInput, onBlur: this.handleBlur, ref: (el) => {
+        return (h("mg-input", { key: '8fc77d20fe8fda510ea0352bc7246fafea31f8d8', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && this.readonlyValue === null ? 'label' : this.tooltipPosition, helpText: this.helpText, errorMessage: this.errorMessage }, this.readonly ? (this.readonlyValue && h("b", { class: "mg-c-input__readonly-value" }, this.readonlyValue)) : (h("select", { class: "mg-c-input__box", id: this.identifier, name: this.name, title: this.placeholder, disabled: this.disabled, required: this.required, "aria-invalid": (this.invalid === true).toString(), onInput: this.handleInput, onBlur: this.handleBlur, ref: (el) => {
                 if (el !== null)
                     this.input = el;
             } }, (!this.placeholderHide || !this.valueExist) && ( // In case passed value does not match any option we display the placeholder
@@ -3788,7 +3789,7 @@ const helpTextTypes = ['email', 'emails', 'url'];
 // Define possible text types
 const textTypes = ['text', 'search', 'tel', ...helpTextTypes];
 
-const mgInputTextCss = ".mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:-0.2rem;outline-style:solid;outline-width:.2rem}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input__input-container{width:100%;flex:1 auto}.mg-c-input.mg-c-input--width-full .mg-c-input__box{width:100%}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left{width:max-content}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:has(textarea){flex-grow:inherit}.mg-c-input.mg-c-input--width-2 .mg-c-input__box{width:var(--mg-b-size-48)}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-48) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-4 .mg-c-input__box{width:var(--mg-b-size-72)}.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-72) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-16 .mg-c-input__box{width:calc(26*var(--mg-b-size-8))}.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(calc(26 * var(--mg-b-size-8)) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-full:not(.mg-c-input--label-on-top){justify-content:stretch}.mg-c-input.mg-c-input--is-input-group-append ::slotted([slot=append-input]),.mg-c-input.mg-c-input--is-append-input-slot-content ::slotted([slot=append-input]){width:auto}:host(.mg-c-input.mg-c-input--width-full) ::slotted(*:not(mg-input-title)){width:100%;max-width:100%}.mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);word-break:break-word}.mg-c-input.mg-c-input--display-character-left mg-character-left{font-size:var(--mg-b-font-size-small);opacity:.6}.mg-c-input.mg-c-input--display-character-left .mg-c-input__input+.mg-c-input__help-text ::slotted(*),.mg-c-input.mg-c-input--display-character-left .mg-c-input__input+.mg-c-input__error ::slotted(*){margin-top:0}.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-input__with-character-left{position:relative;width:100%}.mg-c-input.mg-u-is-focused .mg-c-input__with-character-left .mg-c-input__box{padding-right:max(var(--mg-c-character-left-message-length)*(.35ch + .3rem) + var(--mg-b-size-16)*clamp(0,var(--mg-c-character-left-message-length),1),var(--mg-b-size-8))}.mg-c-input__with-character-left mg-character-left{position:absolute;top:50%;right:var(--mg-b-size-8);display:none;font-size:var(--mg-b-font-size-small);opacity:.6;transform:translateY(-50%)}.mg-c-input.mg-u-is-focused .mg-c-input__with-character-left mg-character-left{display:block}.mg-c-input.mg-c-input--readonly b{min-height:var(--mg-b-font-size);margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2)}.mg-c-input.mg-c-input--has-icon .mg-c-input__with-character-left>mg-icon{position:absolute;top:50%;left:var(--mg-b-size-8);color:var(--mg-c-input-color-icon);transform:translateY(-50%)}.mg-c-input.mg-c-input--has-icon .mg-c-input__with-character-left .mg-c-input__box{padding-left:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2)}";
+const mgInputTextCss = ".mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:-0.2rem;outline-style:solid;outline-width:.2rem}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input.mg-c-input--has-icon .mg-c-input__with-character-left>mg-icon:first-of-type,.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container>mg-icon:first-of-type{position:absolute;top:50%;left:var(--mg-b-size-8);color:var(--mg-c-input-color-icon);transform:translateY(-50%)}.mg-c-input.mg-c-input--has-icon .mg-c-input__with-character-left .mg-c-input__box,.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container .mg-c-input__box{padding-left:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2)}.mg-c-input__input-container{width:100%;flex:1 auto}.mg-c-input.mg-c-input--width-full .mg-c-input__box{width:100%}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left{width:max-content}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:has(textarea){flex-grow:inherit}.mg-c-input.mg-c-input--width-2 .mg-c-input__box{width:var(--mg-b-size-48)}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-48) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-4 .mg-c-input__box{width:var(--mg-b-size-72)}.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-72) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-16 .mg-c-input__box{width:calc(26*var(--mg-b-size-8))}.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(calc(26 * var(--mg-b-size-8)) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-full:not(.mg-c-input--label-on-top){justify-content:stretch}.mg-c-input.mg-c-input--is-input-group-append ::slotted([slot=append-input]),.mg-c-input.mg-c-input--is-append-input-slot-content ::slotted([slot=append-input]){width:auto}:host(.mg-c-input.mg-c-input--width-full) ::slotted(*:not(mg-input-title)){width:100%;max-width:100%}.mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);word-break:break-word}.mg-c-input.mg-c-input--display-character-left mg-character-left{font-size:var(--mg-b-font-size-small);opacity:.6}.mg-c-input.mg-c-input--display-character-left .mg-c-input__input+.mg-c-input__help-text ::slotted(*),.mg-c-input.mg-c-input--display-character-left .mg-c-input__input+.mg-c-input__error ::slotted(*){margin-top:0}.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-input__with-character-left{position:relative;width:100%}.mg-c-input.mg-u-is-focused .mg-c-input__with-character-left .mg-c-input__box{padding-right:max(var(--mg-c-character-left-message-length)*(.35ch + .3rem) + var(--mg-b-size-16)*clamp(0,var(--mg-c-character-left-message-length),1),var(--mg-b-size-8))}.mg-c-input__with-character-left mg-character-left{position:absolute;top:50%;right:var(--mg-b-size-8);display:none;font-size:var(--mg-b-font-size-small);opacity:.6;transform:translateY(-50%)}.mg-c-input.mg-u-is-focused .mg-c-input__with-character-left mg-character-left{display:block}";
 
 /**
  * Check if object is an option
@@ -3801,7 +3802,7 @@ const isOption$1 = (option) => typeof option === 'object' && typeof option.title
  * @param options - Datalist options to check.
  * @returns True if datalist is well structured.
  */
-const isDatalistOptions = (options) => At(options) || (Array.isArray(options) && options.every(isOption$1));
+const isDatalistOptions = (options) => Dt(options) || (Array.isArray(options) && options.every(isOption$1));
 const MgInputText = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
@@ -3866,13 +3867,13 @@ const MgInputText = class {
         /**
          * Component classes
          */
-        this.classCollection = new kt(['mg-c-input--text']);
+        this.classCollection = new Zt(['mg-c-input--text']);
         /**
          * Validate pattern configuration
          */
         this.validatePattern = () => {
             if ((this.pattern !== undefined || this.patternErrorMessage !== undefined) && // At least one is defined
-                (!Le(this.pattern) || (!helpTextTypes.includes(this.type) && !Le(this.patternErrorMessage))) // Both must be defined
+                (!De(this.pattern) || (!helpTextTypes.includes(this.type) && !De(this.patternErrorMessage))) // Both must be defined
             ) {
                 throw new Error(`<mg-input-text> props "pattern" and "patternErrorMessage" must be non-empty string and paired. Passed value: "pattern='${this.pattern}'" and "patternErrorMessage='${this.patternErrorMessage}'".`);
             }
@@ -3892,7 +3893,7 @@ const MgInputText = class {
          */
         this.handleFocus = () => {
             this.classCollection.add(this.classFocus);
-            this.classCollection = new kt(this.classCollection.classes);
+            this.classCollection = new Zt(this.classCollection.classes);
         };
         /**
          * Handle blur event
@@ -3900,7 +3901,7 @@ const MgInputText = class {
         this.handleBlur = () => {
             // Manage focus
             this.classCollection.delete(this.classFocus);
-            this.classCollection = new kt(this.classCollection.classes);
+            this.classCollection = new Zt(this.classCollection.classes);
             // Display Error
             this.handlerInProgress = 'blur';
             this.displayError().finally(() => {
@@ -3995,7 +3996,7 @@ const MgInputText = class {
     }
     validateDatalistoptions(newValue) {
         if (Boolean(newValue) && !isDatalistOptions(newValue)) {
-            throw new Error(`<mg-input-text> prop "datalistoptions" values must be the same type, string or OptionType. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-input-text> prop "datalistoptions" values must be the same type, string or OptionType. Passed value: ${Gt(newValue)}.`);
         }
     }
     watchReadonly(newValue) {
@@ -4033,7 +4034,7 @@ const MgInputText = class {
         this.validatePattern();
     }
     watchHelpText(newValue) {
-        if (!Le(newValue) && helpTextTypes.includes(this.type)) {
+        if (!De(newValue) && helpTextTypes.includes(this.type)) {
             this.helpText = this.messages.input.text.helpText[this.type];
         }
     }
@@ -4074,7 +4075,7 @@ const MgInputText = class {
         if (typeof valid !== 'boolean') {
             throw new Error('<mg-input-text> method "setError()" param "valid" must be a boolean.');
         }
-        else if (!Le(errorMessage)) {
+        else if (!De(errorMessage)) {
             throw new Error('<mg-input-text> method "setError()" param "errorMessage" must be a string.');
         }
         else {
@@ -4140,7 +4141,7 @@ const MgInputText = class {
      * @returns HTML Element
      */
     render() {
-        return (h("mg-input", { key: 'ee11d031a4bb2be299f594fee631be8fd1ef33e5', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [this.characterLeftId], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && this.value === undefined ? 'label' : this.tooltipPosition, helpText: this.helpText, errorMessage: this.errorMessage }, this.readonly
+        return (h("mg-input", { key: 'ef5b732baa01518f61610cfc36dc8574782f12cc', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [this.characterLeftId], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && this.value === undefined ? 'label' : this.tooltipPosition, helpText: this.helpText, errorMessage: this.errorMessage }, this.readonly
             ? this.value && this.renderReadonly()
             : [
                 h("div", { key: "input", class: "mg-c-input__with-character-left", style: {
@@ -4169,7 +4170,7 @@ const MgInputText = class {
 };
 MgInputText.style = mgInputTextCss;
 
-const mgInputTextareaCss = ".mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:-0.2rem;outline-style:solid;outline-width:.2rem}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input__input-container{width:100%;flex:1 auto}.mg-c-input.mg-c-input--width-full .mg-c-input__box{width:100%}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left{width:max-content}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:has(textarea){flex-grow:inherit}.mg-c-input.mg-c-input--width-2 .mg-c-input__box{width:var(--mg-b-size-48)}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-48) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-4 .mg-c-input__box{width:var(--mg-b-size-72)}.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-72) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-16 .mg-c-input__box{width:calc(26*var(--mg-b-size-8))}.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(calc(26 * var(--mg-b-size-8)) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-full:not(.mg-c-input--label-on-top){justify-content:stretch}.mg-c-input.mg-c-input--is-input-group-append ::slotted([slot=append-input]),.mg-c-input.mg-c-input--is-append-input-slot-content ::slotted([slot=append-input]){width:auto}:host(.mg-c-input.mg-c-input--width-full) ::slotted(*:not(mg-input-title)){width:100%;max-width:100%}.mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);word-break:break-word}.mg-c-input.mg-c-input--display-character-left mg-character-left{font-size:var(--mg-b-font-size-small);opacity:.6}.mg-c-input.mg-c-input--display-character-left .mg-c-input__input+.mg-c-input__help-text ::slotted(*),.mg-c-input.mg-c-input--display-character-left .mg-c-input__input+.mg-c-input__error ::slotted(*){margin-top:0}.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-input__input{align-items:start}.mg-c-input__box{display:block;height:auto;resize:none}.mg-c-input__box.mg-c-input__box--resizable{resize:both}.mg-c-input__box.mg-c-input__box--resizable-horizontal{resize:horizontal}.mg-c-input__box.mg-c-input__box--resizable-vertical{resize:vertical}.mg-c-input__readonly-value{white-space:pre-line}.mg-c-input__with-character-left{flex-grow:1}.mg-c-input__with-character-left mg-character-left{display:block;text-align:end;visibility:hidden}.mg-c-input.mg-u-is-focused .mg-c-input__with-character-left mg-character-left{visibility:visible}@-moz-document url-prefix(){.mg-c-input__box{overflow-x:hidden}}";
+const mgInputTextareaCss = ".mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:-0.2rem;outline-style:solid;outline-width:.2rem}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input.mg-c-input--has-icon .mg-c-input__with-character-left>mg-icon:first-of-type,.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container>mg-icon:first-of-type{position:absolute;top:50%;left:var(--mg-b-size-8);color:var(--mg-c-input-color-icon);transform:translateY(-50%)}.mg-c-input.mg-c-input--has-icon .mg-c-input__with-character-left .mg-c-input__box,.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container .mg-c-input__box{padding-left:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2)}.mg-c-input__input-container{width:100%;flex:1 auto}.mg-c-input.mg-c-input--width-full .mg-c-input__box{width:100%}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left{width:max-content}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:has(textarea){flex-grow:inherit}.mg-c-input.mg-c-input--width-2 .mg-c-input__box{width:var(--mg-b-size-48)}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-48) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-4 .mg-c-input__box{width:var(--mg-b-size-72)}.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-72) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-16 .mg-c-input__box{width:calc(26*var(--mg-b-size-8))}.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(calc(26 * var(--mg-b-size-8)) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-full:not(.mg-c-input--label-on-top){justify-content:stretch}.mg-c-input.mg-c-input--is-input-group-append ::slotted([slot=append-input]),.mg-c-input.mg-c-input--is-append-input-slot-content ::slotted([slot=append-input]){width:auto}:host(.mg-c-input.mg-c-input--width-full) ::slotted(*:not(mg-input-title)){width:100%;max-width:100%}.mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);word-break:break-word}.mg-c-input.mg-c-input--display-character-left mg-character-left{font-size:var(--mg-b-font-size-small);opacity:.6}.mg-c-input.mg-c-input--display-character-left .mg-c-input__input+.mg-c-input__help-text ::slotted(*),.mg-c-input.mg-c-input--display-character-left .mg-c-input__input+.mg-c-input__error ::slotted(*){margin-top:0}.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-input__input{align-items:start}.mg-c-input__box{display:block;height:auto;resize:none}.mg-c-input__box.mg-c-input__box--resizable{resize:both}.mg-c-input__box.mg-c-input__box--resizable-horizontal{resize:horizontal}.mg-c-input__box.mg-c-input__box--resizable-vertical{resize:vertical}.mg-c-input__readonly-value{white-space:pre-line}.mg-c-input__with-character-left{flex-grow:1}.mg-c-input__with-character-left mg-character-left{display:block;text-align:end;visibility:hidden}.mg-c-input.mg-u-is-focused .mg-c-input__with-character-left mg-character-left{visibility:visible}@-moz-document url-prefix(){.mg-c-input__box{overflow-x:hidden}}";
 
 const MgInputTextarea = class {
     constructor(hostRef) {
@@ -4236,7 +4237,7 @@ const MgInputTextarea = class {
         /**
          * Component classes
          */
-        this.classCollection = new kt(['mg-c-input--textarea']);
+        this.classCollection = new Zt(['mg-c-input--textarea']);
         /**
          * Handle input event
          */
@@ -4252,7 +4253,7 @@ const MgInputTextarea = class {
          */
         this.handleFocus = () => {
             this.classCollection.add(this.classFocus);
-            this.classCollection = new kt(this.classCollection.classes);
+            this.classCollection = new Zt(this.classCollection.classes);
         };
         /**
          * Handle blur event
@@ -4260,7 +4261,7 @@ const MgInputTextarea = class {
         this.handleBlur = () => {
             // Manage focus
             this.classCollection.delete(this.classFocus);
-            this.classCollection = new kt(this.classCollection.classes);
+            this.classCollection = new Zt(this.classCollection.classes);
             // Display Error
             this.handlerInProgress = 'blur';
             this.displayError().finally(() => {
@@ -4338,8 +4339,8 @@ const MgInputTextarea = class {
             this.classCollection.add(`mg-c-input--width-${this.mgWidth}`);
     }
     validatePattern(newValue) {
-        if (newValue !== undefined && !(Le(this.pattern) && Le(this.patternErrorMessage))) {
-            throw new Error(`<mg-input-textarea> props "pattern" and "patternErrorMessage" must be non-empty string and paired. Passed value: "pattern='${zt(this.pattern)}'" and "patternErrorMessage='${zt(this.patternErrorMessage)}'".`);
+        if (newValue !== undefined && !(De(this.pattern) && De(this.patternErrorMessage))) {
+            throw new Error(`<mg-input-textarea> props "pattern" and "patternErrorMessage" must be non-empty string and paired. Passed value: "pattern='${Gt(this.pattern)}'" and "patternErrorMessage='${Gt(this.patternErrorMessage)}'".`);
         }
     }
     validatecharacterLeftHide(newValue) {
@@ -4381,7 +4382,7 @@ const MgInputTextarea = class {
         if (typeof valid !== 'boolean') {
             throw new Error('<mg-input-textarea> method "setError()" param "valid" must be a boolean.');
         }
-        else if (!Le(errorMessage)) {
+        else if (!De(errorMessage)) {
             throw new Error('<mg-input-textarea> method "setError()" param "errorMessage" must be a string.');
         }
         else {
@@ -4443,7 +4444,7 @@ const MgInputTextarea = class {
      * @returns HTML Element
      */
     render() {
-        return (h("mg-input", { key: 'e7cc627386b7e46fdcb52758a525a729e55d572b', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [this.characterLeftId], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && this.value === undefined ? 'label' : this.tooltipPosition, helpText: this.helpText, errorMessage: this.errorMessage }, this.readonly ? (this.value && h("b", { class: "mg-c-input__readonly-value" }, this.value)) : (h("div", { class: "mg-c-input__with-character-left" }, h("textarea", { class: {
+        return (h("mg-input", { key: '6ae7c6f9cfce48886d68e079ed6ac7e5b6e52eb4', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [this.characterLeftId], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, tooltip: this.tooltip, tooltipPosition: this.readonly && this.value === undefined ? 'label' : this.tooltipPosition, helpText: this.helpText, errorMessage: this.errorMessage }, this.readonly ? (this.value && h("b", { class: "mg-c-input__readonly-value" }, this.value)) : (h("div", { class: "mg-c-input__with-character-left" }, h("textarea", { class: {
                 'mg-c-input__box': true,
                 'mg-c-input__box--width': true,
                 'mg-c-input__box--resizable': this.resizable === 'both',
@@ -4483,11 +4484,11 @@ const MgInputTitle = class {
         this.tagName = 'label';
     }
     validateIdentifier(newValue) {
-        if (!Le(newValue)) {
+        if (!De(newValue)) {
             throw new Error('<mg-input-title> prop "identifier" is required.');
         }
-        else if (!Ot(newValue)) {
-            console.error(`<mg-input-title> prop "identifier" value is invalid. Passed value: ${zt(newValue)}.`);
+        else if (!Ut(newValue)) {
+            console.error(`<mg-input-title> prop "identifier" value is invalid. Passed value: ${Gt(newValue)}.`);
         }
     }
     validateIsLegend(newValue) {
@@ -4575,7 +4576,7 @@ const MgInputToggle = class {
         /**
          * Component classes
          */
-        this.classCollection = new kt(['mg-c-input--toggle']);
+        this.classCollection = new Zt(['mg-c-input--toggle']);
         /**
          * Checked internal value
          */
@@ -4636,10 +4637,10 @@ const MgInputToggle = class {
     }
     validateItems(newValue) {
         if (typeof newValue === 'object' && this.items.length !== 2) {
-            throw new Error(`<mg-input-toggle> prop "items" require 2 items. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-input-toggle> prop "items" require 2 items. Passed value: ${Gt(newValue)}.`);
         }
         // String array
-        else if (At(newValue)) {
+        else if (Dt(newValue)) {
             this.options = newValue.map(item => ({ title: item, value: item }));
         }
         // Object array
@@ -4647,7 +4648,7 @@ const MgInputToggle = class {
             this.options = newValue;
         }
         else {
-            throw new Error(`<mg-input-toggle> prop "items" is required and all items must be the same type: ToggleValue. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-input-toggle> prop "items" is required and all items must be the same type: ToggleValue. Passed value: ${Gt(newValue)}.`);
         }
     }
     watchIsOnOff(newValue) {
@@ -4695,7 +4696,7 @@ const MgInputToggle = class {
         if (typeof valid !== 'boolean') {
             throw new Error('<mg-input-toggle> method "setError()" param "valid" must be a boolean.');
         }
-        else if (!Le(errorMessage)) {
+        else if (!De(errorMessage)) {
             throw new Error('<mg-input-toggle> method "setError()" param "errorMessage" must be a string.');
         }
         else {
@@ -4762,7 +4763,7 @@ const MgInputToggle = class {
      */
     render() {
         const checkedItem = this.getCheckedItem(this.checked);
-        return (h("mg-input", { key: '24c8068a592b0c49a0080931793de9f161b39c26', label: this.label, helpText: this.helpText, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: undefined, tooltip: this.tooltip, tooltipPosition: this.tooltipPosition, errorMessage: this.errorMessage }, this.readonly ? (checkedItem && h("b", { class: "mg-c-input__readonly-value" }, checkedItem.title)) : (h("button", { type: "button", role: "switch", "aria-checked": this.checked.toString(), "aria-readonly": this.disabled || this.readonly, id: this.identifier, class: "mg-c-input__button-toggle", disabled: this.disabled || this.readonly, onClick: this.toggleChecked }, h("span", { "aria-hidden": "true", class: "mg-c-input__toggle-item-container" }, h("slot", { name: "item-1" })), h("span", { "aria-hidden": "true", class: "mg-c-input__toggle-item-container" }, h("slot", { name: "item-2" }))))));
+        return (h("mg-input", { key: '3886ea7cfdb32db9bbc2b7d38760c91aac30c004', label: this.label, helpText: this.helpText, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: undefined, tooltip: this.tooltip, tooltipPosition: this.tooltipPosition, errorMessage: this.errorMessage }, this.readonly ? (checkedItem && h("b", { class: "mg-c-input__readonly-value" }, checkedItem.title)) : (h("button", { type: "button", role: "switch", "aria-checked": this.checked.toString(), "aria-readonly": this.disabled || this.readonly, id: this.identifier, class: "mg-c-input__button-toggle", disabled: this.disabled || this.readonly, onClick: this.toggleChecked }, h("span", { "aria-hidden": "true", class: "mg-c-input__toggle-item-container" }, h("slot", { name: "item-1" })), h("span", { "aria-hidden": "true", class: "mg-c-input__toggle-item-container" }, h("slot", { name: "item-2" }))))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -4835,8 +4836,8 @@ class OverflowBehavior {
             else if (!this.isMoreElement(item) && item.parentElement !== this.parentElement)
                 this.parentElement.insertBefore(item, this.itemMoreElement);
         };
-        if (!this.parentElement || !this.itemMoreElement || !this.itemMoreContainerElement) {
-            throw new Error('OverflowBehavior - all construtor params are required');
+        if (this.parentElement === null || this.itemMoreElement === null || this.itemMoreContainerElement === null) {
+            throw new Error('OverflowBehavior - all constructor params are required');
         }
         const items = Array.from(this.parentElement.children);
         this._resizeObserver = new ResizeObserver(entries => {
@@ -4849,7 +4850,7 @@ class OverflowBehavior {
             let accWidth = 0;
             items.forEach((item, index) => {
                 accWidth += item.offsetWidth;
-                if (index)
+                if (index > 0)
                     this.toggleItem(item, this.isOverflowElement(accWidth, item));
             });
         });
@@ -4877,17 +4878,17 @@ const MgItemMore = class {
     }
     validateIcon(newValue) {
         if (typeof newValue !== 'object' || (typeof newValue === 'object' && typeof newValue.icon !== 'string'))
-            throw new Error(`<${this.name}> prop "icon" must match MgItemMore['icon'] type. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<${this.name}> prop "icon" must match MgItemMore['icon'] type. Passed value: ${Gt(newValue)}.`);
     }
     validateSlotLabel(newValue) {
         if (typeof newValue !== 'object' || (typeof newValue === 'object' && typeof newValue.display !== 'boolean'))
-            throw new Error(`<${this.name}> prop "slotlabel" must match MgItemMore['slotlabel'] type. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<${this.name}> prop "slotlabel" must match MgItemMore['slotlabel'] type. Passed value: ${Gt(newValue)}.`);
         else if (typeof newValue.label !== 'string')
             this.slotlabel.label = this.messages.menuLabel;
     }
     validateSize(newValue) {
         if (newValue && !sizes$5.includes(newValue))
-            throw new Error(`<${this.name}> prop "size" must match MgItemMore['size'] type. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<${this.name}> prop "size" must match MgItemMore['size'] type. Passed value: ${Gt(newValue)}.`);
     }
     /*************
      * Lifecycle *
@@ -4981,7 +4982,7 @@ const MgMenu = class {
             var _a, _b;
             const menuItems = Array.from(menu.children).filter(child => child.nodeName === 'MG-MENU-ITEM');
             const itemMoreMenuItem = (_b = (_a = menu.querySelector('mg-item-more')) === null || _a === void 0 ? void 0 : _a.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('mg-menu-item');
-            if (itemMoreMenuItem) {
+            if (itemMoreMenuItem !== null && itemMoreMenuItem !== undefined) {
                 menuItems.push(itemMoreMenuItem);
             }
             return menuItems;
@@ -5020,12 +5021,12 @@ const MgMenu = class {
     }
     validateLabel(newValue) {
         if (newValue === undefined && !this.element.hasAttribute('aria-label')) {
-            throw new Error(`<${this.name}> prop "label" is required. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<${this.name}> prop "label" is required. Passed value: ${Gt(newValue)}.`);
         }
     }
     validateDirection(newValue) {
         if (![directions$1.VERTICAL, directions$1.HORIZONTAL].includes(newValue)) {
-            throw new Error(`<${this.name}> prop "direction" must be one of: ${directions$1.HORIZONTAL}, ${directions$1.VERTICAL}. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<${this.name}> prop "direction" must be one of: ${directions$1.HORIZONTAL}, ${directions$1.VERTICAL}. Passed value: ${Gt(newValue)}.`);
         }
         else {
             this.updateMenuItems();
@@ -5041,7 +5042,7 @@ const MgMenu = class {
     }
     validateSize(newValue) {
         if (!sizes$5.includes(newValue)) {
-            throw new Error(`<${this.name}> prop "size" must be one of: ${sizes$5.join(', ')}. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<${this.name}> prop "size" must be one of: ${sizes$5.join(', ')}. Passed value: ${Gt(newValue)}.`);
         }
     }
     /**
@@ -5109,7 +5110,7 @@ const MgMenu = class {
      * @returns HTML Element
      */
     render() {
-        return (h(Host, { key: 'b07fbc2127a17e22f41750c603a36c76924d97f3', role: "list", "aria-label": this.label }, h("slot", { key: '0f1070474d19411fc1e52b5151ad6c61c2f07627' })));
+        return (h(Host, { key: '027cd6b867d852c1d238ffedd9ea9c8d40eb82f0', role: "list", "aria-label": this.label }, h("slot", { key: 'cb6dfa4a26800f3dd3fc820954a45aad025cc4a3' })));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -5139,7 +5140,7 @@ const MgMenuItem = class {
         /**
          * Identifier is used to control mg-popover
          */
-        this.identifier = xt('mg-menu-item');
+        this.identifier = Pt('mg-menu-item');
         /**
          * Define menu-item status.
          */
@@ -5158,7 +5159,7 @@ const MgMenuItem = class {
         /**
          * Component button classes
          */
-        this.navigationButtonClassList = new kt([this.navigationButton]);
+        this.navigationButtonClassList = new Zt([this.navigationButton]);
         /**
          * Does component have children.
          */
@@ -5197,7 +5198,7 @@ const MgMenuItem = class {
          * Is component an interactive item
          * @returns truthy if element is clickable
          */
-        this.isInteractiveItem = () => this.hasChildren || !Le(this.href);
+        this.isInteractiveItem = () => this.hasChildren || !De(this.href);
         /**
          * Is component contextual direction match the given direction
          * @param direction - in parent menu
@@ -5250,7 +5251,7 @@ const MgMenuItem = class {
             }
             ['label', 'metadata'].forEach(slot => {
                 Array.from(this.element.querySelectorAll(`[slot="${slot}"]`)).forEach(element => {
-                    if (!Le(element.textContent))
+                    if (!De(element.textContent))
                         throw new Error(`<${this.name}> slot "${slot}" must have text content.`);
                     if ((guard && !element.hasAttribute('title')) || !guard)
                         element.setAttribute('title', element.textContent);
@@ -5291,7 +5292,7 @@ const MgMenuItem = class {
             // when item is the last clickable item we close the parent popover
             if (!this.isInteractiveItem()) {
                 const closePopover = (element) => {
-                    if (!element)
+                    if (element === null)
                         return;
                     else if (element !== this.element && element.expanded && element.shadowRoot.querySelector('mg-popover') !== null) {
                         element.expanded = false;
@@ -5317,8 +5318,8 @@ const MgMenuItem = class {
         this.renderSlot = () => h("slot", null);
     }
     watchIdentifier(newValue) {
-        if (!Ot(newValue)) {
-            console.error(`<mg-menu-item> prop "identifier" value is invalid. Passed value: ${zt(newValue)}.`);
+        if (!Ut(newValue)) {
+            console.error(`<mg-menu-item> prop "identifier" value is invalid. Passed value: ${Gt(newValue)}.`);
         }
         else {
             this.popoverIdentifier = `${this.identifier}-popover`;
@@ -5326,7 +5327,7 @@ const MgMenuItem = class {
     }
     watchTarget(newValue) {
         if (newValue && !targets.includes(newValue)) {
-            throw new Error(`<mg-link> prop "target" must be one of: ${targets.join(', ')}. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-link> prop "target" must be one of: ${targets.join(', ')}. Passed value: ${Gt(newValue)}.`);
         }
     }
     watchStatus(newValue, oldValue) {
@@ -5336,7 +5337,7 @@ const MgMenuItem = class {
     }
     watchExpanded(newValue) {
         if (typeof newValue !== 'boolean') {
-            throw new Error(`<${this.name}> prop "expanded" must be a boolean. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<${this.name}> prop "expanded" must be a boolean. Passed value: ${Gt(newValue)}.`);
         }
         else {
             this.updateExpanded(newValue);
@@ -5385,7 +5386,7 @@ const MgMenuItem = class {
      */
     // eslint-disable-next-line @stencil-community/no-unused-watch
     watchDataHasFocus(newValue) {
-        if (!newValue)
+        if (!De(newValue))
             this.updateExpanded(Boolean(newValue));
     }
     /**
@@ -5451,7 +5452,7 @@ const MgMenuItem = class {
      * @returns promise process wich emit the 'item-updated' event
      */
     componentShouldUpdate() {
-        return Mt(() => {
+        return Xt(() => {
             this.itemUpdated.emit();
         });
     }
@@ -5478,7 +5479,7 @@ const MgMenuItem = class {
             ['mg-c-menu-item__collapse-container']: true,
             ['mg-c-menu-item__collapse-container--first-level']: (this.isInMainMenu() || this.isItemMore) && this.isDirection(directions$1.HORIZONTAL),
         });
-        return (h(Host, { key: '6ef0374dfd3afdea0554df426c06e1fdc5549f82', role: this.isItemMore ? 'presentation' : 'listitem' }, this.hasPopover() ? (h("mg-popover", { display: this.expanded, placement: "bottom-start", arrowHide: true, "onDisplay-change": this.handlePopoverDisplay, identifier: this.popoverIdentifier, "data-fallback-placement": "bottom-end" // use for the last element of the menu if it is placed on the right side
+        return (h(Host, { key: 'caeeabd1d1c9f7de3c8ecda6a315b85215b9e656', role: this.isItemMore ? 'presentation' : 'listitem' }, this.hasPopover() ? (h("mg-popover", { display: this.expanded, placement: "bottom-start", arrowHide: true, "onDisplay-change": this.handlePopoverDisplay, identifier: this.popoverIdentifier, "data-fallback-placement": "bottom-end" // use for the last element of the menu if it is placed on the right side
         }, this.renderInteractiveElement(), h("div", { class: getContainerClasses(), slot: "content" }, this.renderSlot()))) : ([
             this.renderInteractiveElement(),
             h("div", { key: "vertical-container", class: getContainerClasses(), hidden: !this.expanded }, this.renderSlot()),
@@ -5528,7 +5529,7 @@ const MgMessage = class {
         /**
          * Component classes
          */
-        this.classCollection = new kt(['mg-c-message']);
+        this.classCollection = new Zt(['mg-c-message']);
         /**
          * Define if component is using actions slot
          */
@@ -5552,7 +5553,7 @@ const MgMessage = class {
     }
     watchVariant(newValue, oldValue) {
         if (!variants$1.includes(newValue)) {
-            throw new Error(`<mg-message> prop "variant" must be one of: ${variants$1.join(', ')}. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-message> prop "variant" must be one of: ${variants$1.join(', ')}. Passed value: ${Gt(newValue)}.`);
         }
         else {
             if (newValue !== undefined)
@@ -5563,7 +5564,7 @@ const MgMessage = class {
     }
     watchVariantStyle(newValue, oldValue) {
         if (!variantStyles.includes(newValue)) {
-            throw new Error(`<mg-message> prop "variantStyle" must be one of: ${variantStyles.join(', ')}. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-message> prop "variantStyle" must be one of: ${variantStyles.join(', ')}. Passed value: ${Gt(newValue)}.`);
         }
         else {
             if (newValue !== undefined)
@@ -5590,9 +5591,9 @@ const MgMessage = class {
      * @returns HTML Element
      */
     render() {
-        return (h("div", { key: 'd0a2c215951c0ef62588b5c1d13879a1ff9f8d1f', class: this.classCollection.join() }, h("mg-card", { key: '171d1c0452561a4a2729aea0a32d47e6831b1f50' }, this.variantStyle === 'bar-left' && h("span", { key: '482d2e6c2f51aafa1b434b24aab0fe9c3cb8141e', class: "mg-c-message__bar" }), h("span", { key: 'd6ec954a4eb499458bbdd0c7ba5fb5686c3afc0b', class: "mg-c-message__icon" }, h("mg-icon", { key: '32daba88c0c32cea0012ee6e80b97445aed3533c', icon: this.getIcon() })), h("div", { key: 'fc77d6745f2ae8d0c8de393598dad8d4c3b7f074', class: "mg-c-message__content" }, h("span", { key: 'e73d7327e259c457c66b2faf2ff26b3ca07bf24d', class: "mg-c-message__content-slot" }, h("slot", { key: 'c15d52b9cf7b4f974f0d92c7eceaeecba7708f37' })), this.hasActions && [
+        return (h("div", { key: '851d97fde6f05799e1420f8825fcff986d9af1d6', class: this.classCollection.join() }, h("mg-card", { key: '40f85f1fb3240ab709b1ab46286e9a953f2d5dc8' }, this.variantStyle === 'bar-left' && h("span", { key: '50b078ec379c7774d2f409c64b56108041bf3053', class: "mg-c-message__bar" }), h("span", { key: 'bc6b1019e1103fc8cd5e4e92f95b62374207be2b', class: "mg-c-message__icon" }, h("mg-icon", { key: 'e461ddc1eb1ddcb7ecc673f59dc59f400efbe916', icon: this.getIcon() })), h("div", { key: 'edf836b375d7f1fd413b53711b99acbe2bef3e92', class: "mg-c-message__content" }, h("span", { key: 'c6ce4628e450b7e89ef3715126b3a2dee081224e', class: "mg-c-message__content-slot" }, h("slot", { key: '36ecf7417e61ab84695078e2fd4ebe829bd769a7' })), this.hasActions && [
             h("span", { class: "mg-c-message__content-separator", key: "content-separator" }),
-            h("span", { class: "mg-c-message__content-actions-slot", key: "content-actions-slot" }, h("slot", { key: '0ebf36c9be1bed739bede04f4cf8352f0580f53f', name: "actions" })),
+            h("span", { class: "mg-c-message__content-actions-slot", key: "content-actions-slot" }, h("slot", { key: '43be5769165cac1ab702b2ba80fb885c2ec1834f', name: "actions" })),
         ]))));
     }
     get element() { return getElement(this); }
@@ -5622,7 +5623,7 @@ const MgModal = class {
          * Identifier is used for the element ID (id is a reserved prop in Stencil.js)
          * If not set, it will be created.
          */
-        this.identifier = xt('mg-modal');
+        this.identifier = Pt('mg-modal');
         /**
          * Modal dialog role.
          */
@@ -5642,7 +5643,7 @@ const MgModal = class {
         /**
          * Component classes
          */
-        this.classCollection = new kt(['mg-c-modal']);
+        this.classCollection = new Zt(['mg-c-modal']);
         /***********
          * Handles *
          ***********/
@@ -5655,17 +5656,17 @@ const MgModal = class {
         };
     }
     watchIdentifier(newValue) {
-        if (!Ot(newValue)) {
-            throw new Error(`<mg-modal> prop "identifier" value is invalid. Passed value: ${zt(newValue)}.`);
+        if (!Ut(newValue)) {
+            throw new Error(`<mg-modal> prop "identifier" value is invalid. Passed value: ${Gt(newValue)}.`);
         }
     }
     validateDialogRole(newValue) {
         if (!dialogRoles.includes(newValue))
-            throw new Error(`<mg-modal> prop "dialogRole" must be one of: ${dialogRoles.join(', ')}. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-modal> prop "dialogRole" must be one of: ${dialogRoles.join(', ')}. Passed value: ${Gt(newValue)}.`);
     }
     validateModalTitle(newValue) {
-        if (!Le(newValue)) {
-            throw new Error(`<mg-modal> prop "modalTitle" is required. Passed value: ${zt(newValue)}.`);
+        if (!De(newValue)) {
+            throw new Error(`<mg-modal> prop "modalTitle" is required. Passed value: ${Gt(newValue)}.`);
         }
     }
     watchOpen(newValue) {
@@ -5714,11 +5715,11 @@ const MgModal = class {
      * @returns HTML Element
      */
     render() {
-        return (h("dialog", { key: 'fff52c253f0aeaceec427982c5fea96fc948a4f5', role: this.dialogRole, id: this.identifier, class: this.classCollection.join(), "aria-labelledby": this.titleId, ref: (el) => {
+        return (h("dialog", { key: '4b7346b707b895a8a110bb7553f0db32d1c5778c', role: this.dialogRole, id: this.identifier, class: this.classCollection.join(), "aria-labelledby": this.titleId, ref: (el) => {
                 if (el !== null) {
                     this.dialog = el;
                 }
-            } }, h("mg-card", { key: '597aee771927b73fc59c082075d74c76c9d8130c' }, h("div", { key: '75136546eefd38191ecf536e5c10cfbeb7172dc4', class: "mg-c-modal__dialog" }, h("header", { key: '09c79927ddffa0d461eabfa195849cdabe37a6ac', class: "mg-c-modal__header" }, this.closeButton && (h("span", { key: 'b37aabbf4a77ebaa4ca72e72f477aece9c9484de', class: "mg-c-modal__close-button" }, h("mg-button", { key: 'a4ca599e0665489f2cba2d3e668c92baff0a3fdb', "is-icon": true, variant: "flat", label: this.messages.modal.closeButton, onClick: this.handleClose }, h("mg-icon", { key: 'd77c434f5e2aa6d82772ab3af10a93c6f580c709', icon: "cross" })))), h("h1", { key: '6daf305683895d5cc50960b4ce86dd2ffebc3246', class: "mg-c-modal__title", id: this.titleId }, this.modalTitle)), h("article", { key: '075ac4bfa9ab3e495b58a340719a8e0cefaac8c4', class: "mg-c-modal__content" }, h("slot", { key: '7013d03bfbd806671ad4cf081df9c7fe842f285c' })), this.hasActions && (h("footer", { key: '20ba80cc79e6d43cf2b820425ee0e4f75953da19', class: "mg-c-modal__footer" }, h("slot", { key: 'cfa6c3920891dfceecd0f01fbab2a1496db66f35', name: "actions" })))))));
+            } }, h("mg-card", { key: '2aaabab2e1be14013bcae66d100ac56c1a9bbf4d' }, h("div", { key: '56a03d6cbda094d7ae4444ca3fab924982f73e2a', class: "mg-c-modal__dialog" }, h("header", { key: 'e7eb70e614a9e6c6b3f14f9e165bf801b780b031', class: "mg-c-modal__header" }, this.closeButton && (h("span", { key: 'c57ccc8f049893c5e46d769b527cc2e2c5ff14c0', class: "mg-c-modal__close-button" }, h("mg-button", { key: 'b1b4357af8c875aab9f1104895de3cc228d12feb', "is-icon": true, variant: "flat", label: this.messages.modal.closeButton, onClick: this.handleClose }, h("mg-icon", { key: 'cfe5fba2577ece682368332d3836cf709bb1b0e1', icon: "cross" })))), h("h1", { key: '718527902ea4814d55bf4d1c89d111a965233f0a', class: "mg-c-modal__title", id: this.titleId }, this.modalTitle)), h("article", { key: '78603fdb8fffa93e5caa6cf0ece9c6dbdbdfefde', class: "mg-c-modal__content" }, h("slot", { key: '1cd5a0415e53cb836428f8b9c4fc02dac11447a9' })), this.hasActions && (h("footer", { key: 'da72e5c2f43308d0f94d4e2eb36e317a13b5b16e', class: "mg-c-modal__footer" }, h("slot", { key: '49467ef13123cb4f4e2b315d293379d857ca3245', name: "actions" })))))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -5767,7 +5768,7 @@ const MgPagination = class {
          * Identifier is used for the element ID (id is a reserved prop in Stencil.js)
          * If not set, it will be created.
          */
-        this.identifier = xt('mg-pagination');
+        this.identifier = Pt('mg-pagination');
         /**
          * Hide navigation label
          */
@@ -5812,18 +5813,18 @@ const MgPagination = class {
         };
     }
     watchIdentifier(newValue) {
-        if (!Ot(newValue)) {
-            console.error(`<mg-pagination> prop "identifier" value is invalid. Passed value: ${zt(newValue)}.`);
+        if (!Ut(newValue)) {
+            console.error(`<mg-pagination> prop "identifier" value is invalid. Passed value: ${Gt(newValue)}.`);
         }
     }
     validateTotalPages(newValue) {
         if (newValue < 1) {
-            throw new Error(`<mg-pagination> prop "totalPages" must be greater than 0. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-pagination> prop "totalPages" must be greater than 0. Passed value: ${Gt(newValue)}.`);
         }
     }
     validateCurrentPage(newValue) {
         if (newValue < 1) {
-            throw new Error(`<mg-pagination> prop "currentPage" must be greater than 0. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-pagination> prop "currentPage" must be greater than 0. Passed value: ${Gt(newValue)}.`);
         }
         else if (newValue > this.totalPages) {
             throw new Error('<mg-pagination> prop "currentPage" can not be greater than total page.');
@@ -5853,10 +5854,10 @@ const MgPagination = class {
      * @returns HTML Element
      */
     render() {
-        const navigationActionButton = (disabled, action) => (h("mg-button", { key: '3c29dbe0db55d6eda6d53ee174e0e38c086beddf', label: this.messages.pagination[`${action}Page`],
+        const navigationActionButton = (disabled, action) => (h("mg-button", { key: 'b6983bde889955b35b1e580ffd5ece96a2919eca', label: this.messages.pagination[`${action}Page`],
             // eslint-disable-next-line react/jsx-no-bind
-            onClick: () => this.handleGoToPage(action, disabled), disabled: disabled, variant: "flat", isIcon: this.hideNavigationLabels }, action === NavigationAction.PREVIOUS && h("mg-icon", { key: '677232241e8eb8beca9b9ce4a6f997dd69a5e3c1', icon: "chevron-left" }), !this.hideNavigationLabels && this.messages.general[action], action === NavigationAction.NEXT && h("mg-icon", { key: '83f0db42841d81a3bc2cea5bec4106b1f102a6e5', icon: "chevron-right" })));
-        return (h(Host, { key: '26dea8cd6c77188eddec2e1b35dcf01d8ee458eb', hidden: this.totalPages < 2 }, h("nav", { key: 'afe38df7e48edb84598774aad6ca72225ef074e8', role: "navigation", "aria-label": this.label, id: this.identifier, class: { 'mg-c-pagination': true, 'mg-c-pagination--hide-page-count': this.hidePageCount } }, navigationActionButton(this.currentPage <= 1, NavigationAction.PREVIOUS), !this.hidePageCount && (h("div", { key: '1cfd5d883a640fc274fe5f6c8baec734e4479486', class: "mg-c-pagination__page-count" }, h("mg-input-select", { key: 'e58e285a97a1dedf7410a0240ea5607808d66db1', identifier: `${this.identifier}-select`, items: range(1, this.totalPages).map(page => page.toString()), label: this.messages.pagination.selectPage, "label-hide": true, "on-value-change": this.handleSelect, value: this.currentPage.toString(), "placeholder-hide": true }), h("span", { key: 'd5d2cc3dc4324d1a3e2386eaf1da03024313fe24', class: "mg-u-visually-hidden" }, this.messages.pagination.page, " ", this.currentPage), "/ ", this.totalPages, " ", this.totalPages > 1 ? this.messages.pagination.pages : this.messages.pagination.page)), navigationActionButton(this.currentPage >= this.totalPages, NavigationAction.NEXT))));
+            onClick: () => this.handleGoToPage(action, disabled), disabled: disabled, variant: "flat", isIcon: this.hideNavigationLabels }, action === NavigationAction.PREVIOUS && h("mg-icon", { key: '64316742287d7cb9adf0c4bb3cb902a3c1cea6b5', icon: "chevron-left" }), !this.hideNavigationLabels && this.messages.general[action], action === NavigationAction.NEXT && h("mg-icon", { key: '2c405c1530509f3e6938e7c1d754b7aff216a6f7', icon: "chevron-right" })));
+        return (h(Host, { key: 'a341519e24868b594c1bb91c12549c0338fc0f49', hidden: this.totalPages < 2 }, h("nav", { key: '1102f256da9b8c25e8dbe6be64b934267d58f4b8', role: "navigation", "aria-label": this.label, id: this.identifier, class: { 'mg-c-pagination': true, 'mg-c-pagination--hide-page-count': this.hidePageCount } }, navigationActionButton(this.currentPage <= 1, NavigationAction.PREVIOUS), !this.hidePageCount && (h("div", { key: '32498b13867e363f6f51ffbaff6f18623cbd698d', class: "mg-c-pagination__page-count" }, h("mg-input-select", { key: 'ff80a43e9fa1bf7cc13c7104e41730df0c044c3e', identifier: `${this.identifier}-select`, items: range(1, this.totalPages).map(page => page.toString()), label: this.messages.pagination.selectPage, "label-hide": true, "on-value-change": this.handleSelect, value: this.currentPage.toString(), "placeholder-hide": true }), h("span", { key: 'c3e331768f997740ed95cde7dc7433df7d065122', class: "mg-u-visually-hidden" }, this.messages.pagination.page, " ", this.currentPage), "/ ", this.totalPages, " ", this.totalPages > 1 ? this.messages.pagination.pages : this.messages.pagination.page)), navigationActionButton(this.currentPage >= this.totalPages, NavigationAction.NEXT))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -5887,7 +5888,7 @@ const MgPanel = class {
          * Identifier is used for the element ID (id is a reserved prop in Stencil.js)
          * If not set, it will be created.
          */
-        this.identifier = xt('mg-panel');
+        this.identifier = Pt('mg-panel');
         /**
          * Define if panel title is editable
          */
@@ -5911,7 +5912,7 @@ const MgPanel = class {
         /**
          * Component classes
          */
-        this.classCollection = new kt(['mg-c-panel']);
+        this.classCollection = new Zt(['mg-c-panel']);
         /**
          * Title is in edition mode
          */
@@ -6010,13 +6011,13 @@ const MgPanel = class {
         };
     }
     watchIdentifier(newValue) {
-        if (!Ot(newValue)) {
-            console.error(`<mg-panel> prop "identifier" value is invalid. Passed value: ${zt(newValue)}.`);
+        if (!Ut(newValue)) {
+            console.error(`<mg-panel> prop "identifier" value is invalid. Passed value: ${Gt(newValue)}.`);
         }
     }
     validatePanelTitle(newValue) {
-        if (!Le(newValue))
-            throw new Error(`<mg-panel> prop "panelTitle" is required and must be a string. Passed value: ${zt(newValue)}.`);
+        if (!De(newValue))
+            throw new Error(`<mg-panel> prop "panelTitle" is required and must be a string. Passed value: ${Gt(newValue)}.`);
         this.titleChange.emit(newValue);
     }
     validateTitlePattern(newValue) {
@@ -6025,14 +6026,14 @@ const MgPanel = class {
     }
     validateTitlePosition(newValue) {
         if (!titlePositions.includes(newValue))
-            throw new Error(`<mg-panel> prop "titlePosition" must be one of: ${titlePositions.join(', ')}. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-panel> prop "titlePosition" must be one of: ${titlePositions.join(', ')}. Passed value: ${Gt(newValue)}.`);
     }
     handleExpanded(newValue) {
         this.expandedChange.emit(newValue);
     }
     validateExpandToggleDisplay(newValue) {
         if (!expandToggleDisplays.includes(newValue))
-            throw new Error(`<mg-panel> prop "expandToggleDisplay" must be one of: ${expandToggleDisplays.join(', ')}. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-panel> prop "expandToggleDisplay" must be one of: ${expandToggleDisplays.join(', ')}. Passed value: ${Gt(newValue)}.`);
         if (newValue === 'icon' && this.titleEditable)
             this.titleEditable = false;
     }
@@ -6067,7 +6068,7 @@ const MgPanel = class {
      */
     render() {
         const headerId = `${this.identifier}-header`;
-        return (h("section", { key: '82d79e85a6d6e376482b89fa9d03f5e381499dbc', class: this.classCollection.join(), id: this.identifier }, h("mg-card", { key: '6b1753575b2faece344d14d473ded961bc6ac7a1' }, h("header", { key: 'aae91889ab75aacfee1eb0b164fb60ee90d3be30', class: { 'mg-c-panel__header': true, 'mg-c-panel__header--reverse': this.titlePosition === 'right' }, id: headerId }, this.renderHeaderChildren()), h("article", { key: 'eb2cc533c8181e962c21666d67cf920b2e17cdd6', class: "mg-c-panel__content", id: `${this.identifier}-content`, "aria-labelledby": headerId, hidden: !this.expanded }, h("slot", { key: '8a638a7194bd57a4b3f849401436e5a05160080a' })))));
+        return (h("section", { key: '73b9b1ab03307718bc7085799675da7447787c73', class: this.classCollection.join(), id: this.identifier }, h("mg-card", { key: '91702feab4cde0548c276f3d32fa193ff1093cae' }, h("header", { key: '442a17d42f86e73648ffa33124a1745fef3b07e3', class: { 'mg-c-panel__header': true, 'mg-c-panel__header--reverse': this.titlePosition === 'right' }, id: headerId }, this.renderHeaderChildren()), h("article", { key: '0df72fb9e53f0a8307c062d506e8c744fd6780f3', class: "mg-c-panel__content", id: `${this.identifier}-content`, "aria-labelledby": headerId, hidden: !this.expanded }, h("slot", { key: '44fa7501182e1c671d229929ebc12031c3048fdb' })))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -7746,14 +7747,58 @@ const placements = [
     'left-start',
     'left-end',
 ];
+// Alignments constants
+const alignments = ['start', null, 'end'];
 /**
  * FloatingUI Placement type guard
  * @param placement - value to check
  * @returns truthy if placement is valid
  */
 const isFloatingUIPlacement = (placement) => placements.filter(p => !p.includes('auto')).includes(placement);
-// Alignments constants
-const alignments = ['start', null, 'end'];
+/**
+ * Round value by device pixel ratio
+ * @param value - value to round
+ * @returns rounded value
+ */
+const roundByDPR = (value) => {
+    const dpr = window.devicePixelRatio || 1;
+    return Math.round(value * dpr) / dpr;
+};
+/**
+ * Get translation for tooltip
+ * @param x - x-axis value
+ * @param y - y-axis value
+ * @returns translation string
+ */
+const getTransformation = (x, y) => {
+    const tooltipX = isNaN(x) ? 0 : roundByDPR(x);
+    const tooltipY = isNaN(y) ? 0 : roundByDPR(y);
+    // No translation needed
+    if (tooltipX === 0 && tooltipY === 0)
+        return '';
+    // Only one axis needs translation
+    if (tooltipX === 0)
+        return `translateY(${tooltipY}px)`;
+    if (tooltipY === 0)
+        return `translateX(${tooltipX}px)`;
+    // Both axes need translation
+    return `translate(${tooltipX}px,${tooltipY}px)`;
+};
+// https://floating-ui.com/docs/arrow
+// Unlike the floating element, which has both coordinates defined at all times, the arrow only has one defined.
+// Due to this, either x or y will be undefined, depending on the side of placement.
+// The above code uses `isNaN` to check for null and undefined simultaneously.
+// Don't remove `isNaN`, because either value can be falsy (0), causing a bug!
+const numberToPx = (number) => {
+    if (number !== null && !isNaN(number)) {
+        if (number === 0)
+            return '0';
+        else
+            return `${number}px`;
+    }
+    else
+        return '';
+};
 
 const mgPopoverCss = "/*!\n * @prop --mg-c-popover-color-background: Defines the background color of the popover. Default value: `--mg-b-color-light`.\n * @prop --mg-c-popover-color-text: Defines the font color of the popover. Default value: `--mg-b-color-font-dark`.\n * @prop --mg-c-popover-title-font-size: Defines the font size of the popover title. Default value: `--mg-b-font-size-h5`.\n * @prop --mg-c-popover-padding-vertical: Defines the vertical padding of the popover. Default value: `unset`, fallback to `--mg-b-size-16`.\n * @prop --mg-c-popover-padding-horizontal: Defines the horizontal padding of the popover. Default value: `unset`, fallback to `--mg-b-size-16`.\n * @prop --mg-c-popover-max-width: Defines the max-width of the popover. Default value: `--mg-b-size-floating-element-max-width`.\n * @prop --mg-c-popover-min-width: Defines the min-width of the popover. Default value: `unset`.\n */:host{--mg-c-card-spacing:var(--mg-c-popover-padding-vertical, var(--mg-b-size-16)) var(--mg-c-popover-padding-horizontal, var(--mg-b-size-16));--mg-c-card-border:none;--mg-c-card-border-radius:var(--mg-b-size-radius);--mg-c-card-color-background:var(--mg-c-popover-color-background);position:relative;display:contents}:host::slotted(*){display:inline-block}";
 
@@ -7766,7 +7811,7 @@ const MgPopover = class {
          * Sets an `id` attribute.
          * Needed by the input for accessibility `aria-decribedby`.
          */
-        this.identifier = xt('mg-popover');
+        this.identifier = Pt('mg-popover');
         /**
          * Popover placement
          */
@@ -7796,16 +7841,6 @@ const MgPopover = class {
                 this.display = false;
             }
         };
-        /**
-         * Update aria-expanded attribute on interactive element
-         * @param expanded - expanded state
-         */
-        this.updateAriaExpanded = (expanded) => {
-            const interactiveElement = this.element.querySelector(':not([slot])');
-            if (interactiveElement !== null) {
-                interactiveElement.setAttribute('aria-expanded', String(expanded));
-            }
-        };
         /**
          * Show popover
          */
@@ -7813,12 +7848,13 @@ const MgPopover = class {
             // Make the popover visible
             this.mgPopover.dataset.show = '';
             // Update aria-expanded
-            this.updateAriaExpanded(true);
+            this.interactiveElement.setAttribute('aria-expanded', 'true');
             // hide when click outside
             // setTimeout is used to prevent event to trigger after creation
             setTimeout(() => {
                 this.manageClickOutsideListeners('addEventListener');
             });
+            this.updatePopover();
         };
         /**
          * Hide popover
@@ -7827,7 +7863,7 @@ const MgPopover = class {
             // Hide the popover
             this.mgPopover.removeAttribute('data-show');
             // Update aria-expanded
-            this.updateAriaExpanded(false);
+            this.interactiveElement.setAttribute('aria-expanded', 'false');
             // Remove event listener
             this.manageClickOutsideListeners('removeEventListener');
         };
@@ -7906,63 +7942,50 @@ const MgPopover = class {
             return Array.from(new Set([...currentSidePlacements, ...sides.filter(otherSide => otherSide !== side)])).filter(isFloatingUIPlacement);
         };
         /**
-         * Set up Floating UI positioning and arrow behavior
-         * @param interactiveElement - Element that triggers the popover
-         */
-        this.setFloatingUI = (interactiveElement) => {
-            this.floatingUICleanup = autoUpdate(interactiveElement, this.mgPopover, () => {
-                computePosition(interactiveElement, this.mgPopover, {
-                    placement: this.placement,
-                    strategy: 'fixed',
-                    middleware: [
-                        offset(0),
-                        flip({
-                            fallbackPlacements: this.getClosestPlacements(this.placement),
-                        }),
-                        shift({
-                            limiter: limitShift(),
-                        }),
-                        arrow({
-                            element: this.mgPopover.querySelector('[data-floating-arrow]'),
-                        }),
-                    ],
-                }).then(({ x, y, placement, middlewareData }) => {
-                    Object.assign(this.mgPopover.style, {
-                        position: 'fixed',
-                        top: '0',
-                        left: '0',
-                        transform: `translate(${Math.round(x)}px, ${Math.round(y)}px)`,
-                    });
-                    // Update arrow style
-                    const staticSide = {
-                        top: 'bottom',
-                        right: 'left',
-                        bottom: 'top',
-                        left: 'right',
-                    }[placement.split('-')[0]];
-                    const arrowElement = this.mgPopover.querySelector('[data-floating-arrow]');
-                    const { x: arrowX, y: arrowY } = middlewareData.arrow;
-                    // https://floating-ui.com/docs/arrow
-                    // Unlike the floating element, which has both coordinates defined at all times, the arrow only has one defined.
-                    // Due to this, either x or y will be undefined, depending on the side of placement.
-                    // The above code uses `isNaN` to check for null and undefined simultaneously.
-                    // Don't remove `isNaN`, because either value can be falsy (0), causing a bug!
-                    const numberToPx = (number) => (!isNaN(number) ? `${number}px` : '');
-                    if (arrowElement !== null)
-                        Object.assign(arrowElement.style, {
-                            position: 'absolute',
-                            left: numberToPx(arrowX),
-                            top: numberToPx(arrowY),
-                            [staticSide]: '1px',
-                        });
-                    this.mgPopover.setAttribute('data-placement', placement);
-                });
+         * Update popover position
+         * @returns autoUpdate function
+         */
+        this.updatePopover = () => autoUpdate(this.interactiveElement, this.mgPopover, async () => {
+            const { x, y, placement, middlewareData } = await computePosition(this.interactiveElement, this.mgPopover, {
+                placement: this.placement,
+                strategy: 'fixed',
+                middleware: [
+                    offset(0),
+                    flip({
+                        fallbackPlacements: this.getClosestPlacements(this.placement),
+                    }),
+                    shift({
+                        limiter: limitShift(),
+                    }),
+                    arrow({
+                        element: this.arrowElement,
+                    }),
+                ],
             });
-        };
+            Object.assign(this.mgPopover.style, {
+                transform: getTransformation(x, y),
+            });
+            // Arrow positioning
+            if (this.arrowElement !== null) {
+                const { x: arrowX, y: arrowY } = middlewareData.arrow;
+                const staticSide = {
+                    top: 'bottom',
+                    right: 'left',
+                    bottom: 'top',
+                    left: 'right',
+                }[placement.split('-')[0]];
+                Object.assign(this.arrowElement.style, {
+                    left: numberToPx(arrowX),
+                    top: numberToPx(arrowY),
+                    [staticSide]: '1px',
+                });
+                this.mgPopover.setAttribute('data-placement', placement);
+            }
+        });
     }
     validateIdentifier(newValue) {
-        if (!Ot(newValue)) {
-            throw new Error(`<mg-popover> prop "identifier" value is invalid. Passed value: ${zt(newValue)}.`);
+        if (!Ut(newValue)) {
+            throw new Error(`<mg-popover> prop "identifier" value is invalid. Passed value: ${Gt(newValue)}.`);
         }
         // use renderPopoverContent to update popover-content id
         this.renderPopoverContent();
@@ -7996,14 +8019,14 @@ const MgPopover = class {
      * update popper position after props change on component did update hook to benefit from render ended
      */
     componentDidUpdate() {
-        this.floatingUICleanup();
+        this.updatePopover();
     }
     /**
      * Check if component props are well configured on init
      */
     componentWillLoad() {
         // Get windows to attach events
-        this.windows = Rt(window);
+        this.windows = Bt(window);
         // render mg-popover-content slot
         this.renderPopoverContent();
         this.validateCloseButton(this.closeButton);
@@ -8017,26 +8040,21 @@ const MgPopover = class {
     componentDidLoad() {
         // Get popover content
         this.mgPopover = this.element.querySelector(`#${this.identifier}`);
+        // Get arrow element
+        this.arrowElement = this.mgPopover.querySelector('[data-floating-arrow]');
         // Get interactive element (first element without slot attribute)
-        const interactiveElement = this.element.querySelector(':not([slot])');
+        this.interactiveElement = this.element.querySelector(':not([slot])');
         // Add aria attributes
-        interactiveElement.setAttribute('aria-controls', this.identifier);
-        interactiveElement.setAttribute('aria-expanded', `${this.display}`);
-        // Initial styles configuration
-        Object.assign(this.mgPopover.style, {
-            position: 'fixed',
-        });
-        // Create Floating UI instance
-        this.setFloatingUI(interactiveElement);
+        this.interactiveElement.setAttribute('aria-controls', this.identifier);
+        this.interactiveElement.setAttribute('aria-expanded', `${this.display}`);
         // Add resize observer
-        [interactiveElement, this.mgPopoverContent].forEach(element => {
+        [this.interactiveElement, this.mgPopoverContent].forEach(element => {
             new ResizeObserver(() => {
-                this.floatingUICleanup();
-                this.setFloatingUI(interactiveElement);
+                this.updatePopover();
             }).observe(element);
         });
         // Add events to toggle display
-        interactiveElement.addEventListener('click', () => {
+        this.interactiveElement.addEventListener('click', () => {
             if (!this.disabled)
                 this.display = !this.display;
         });
@@ -8051,7 +8069,7 @@ const MgPopover = class {
             if (!this.disabled && e.code === 'Escape') {
                 this.display = false;
                 this.componentClose.emit();
-                interactiveElement.focus();
+                this.interactiveElement.focus();
             }
         });
         this.handleDisplay(this.display);
@@ -8060,15 +8078,16 @@ const MgPopover = class {
      * Cleanup when component is disconnected
      */
     disconnectedCallback() {
+        var _a;
         // Cleanup Floating UI instance
-        this.floatingUICleanup();
+        (_a = this.updatePopover) === null || _a === void 0 ? void 0 : _a.call(this);
     }
     /**
      * Render
      * @returns HTML Element
      */
     render() {
-        return (h(Host, { key: 'a2c883c6f1458bfc76d77d944afe99210d0ecdb3' }, h("slot", { key: 'c3d2e25f47c5761be6594cb6cd487e4960e5d30b' }), h("slot", { key: '93bb53d3eac2c2b966eacb00b772faa403b5a86c', name: "content" })));
+        return (h(Host, { key: '26244db5e6a35b731b5220c06b77ad1f14378245' }, h("slot", { key: '92ca05ac9637cf9634d86b177393fd6d0e6c6796' }), h("slot", { key: 'bdc8f8a8b4f2c891e473cdac5a305c3f1ab615b0', name: "content" })));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -8081,7 +8100,7 @@ const MgPopover = class {
 };
 MgPopover.style = mgPopoverCss;
 
-const mgPopoverContentCss = ":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-placement^=left-start]),:host([data-placement^=left-end]),:host([data-placement^=right-start]),:host([data-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-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-8) !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}:host([data-placement^=top][data-arrow-hide]){padding-bottom:0}:host([data-placement^=bottom][data-arrow-hide]){padding-top:0}:host([data-placement$=end][data-arrow-hide]),:host([data-placement^=left][data-arrow-hide]){padding-right:0}:host([data-placement$=start][data-arrow-hide]),:host([data-placement^=right][data-arrow-hide]){padding-left:0}::slotted([slot=arrow]){position:absolute;width:calc(var(--mg-b-size-24) + 2*var(--mg-c-card-border-radius) + 2*var(--mg-b-size-8));height:calc(var(--mg-b-size-24) + 2*var(--mg-c-card-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-placement^=top]) ::slotted([slot=arrow]),:host([data-placement^=bottom]) ::slotted([slot=arrow]){height:var(--mg-b-size-8)}:host([data-placement^=top]) ::slotted([slot=arrow])::before,:host([data-placement^=bottom]) ::slotted([slot=arrow])::before{left:calc(var(--mg-c-card-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-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-placement^=top]) ::slotted([slot=arrow])::before{border-top:var(--mg-b-size-8) solid var(--mg-c-popover-color-background)}:host([data-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-placement^=bottom]) ::slotted([slot=arrow])::before{border-bottom:var(--mg-b-size-8) solid var(--mg-c-popover-color-background)}:host([data-placement^=left]) ::slotted([slot=arrow]),:host([data-placement^=right]) ::slotted([slot=arrow]){width:var(--mg-b-size-8)}:host([data-placement^=left]) ::slotted([slot=arrow])::before,:host([data-placement^=right]) ::slotted([slot=arrow])::before{top:calc(var(--mg-c-card-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-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-placement^=left]) ::slotted([slot=arrow])::before{border-left:var(--mg-b-size-8) solid var(--mg-c-popover-color-background)}:host([data-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-placement^=right]) ::slotted([slot=arrow])::before{border-right:var(--mg-b-size-8) solid var(--mg-c-popover-color-background)}:host([data-placement^=left-start]) ::slotted([slot=arrow]),:host([data-placement^=left-end]) ::slotted([slot=arrow]),:host([data-placement^=right-start]) ::slotted([slot=arrow]),:host([data-placement^=right-end]) ::slotted([slot=arrow]){height:calc(var(--mg-b-size-24) + 2*var(--mg-c-card-border-radius))}:host([data-placement^=left-start]) ::slotted([slot=arrow])::before,:host([data-placement^=left-end]) ::slotted([slot=arrow])::before,:host([data-placement^=right-start]) ::slotted([slot=arrow])::before,:host([data-placement^=right-end]) ::slotted([slot=arrow])::before{top:var(--mg-c-card-border-radius)}";
+const mgPopoverContentCss = ":host{position:fixed;z-index:2000;top:0;left:0;display:none;padding:var(--mg-b-size-8);color:var(--mg-c-popover-color-text)}:host([data-show]){display:block}:host([data-placement^=left-start]),:host([data-placement^=left-end]),:host([data-placement^=right-start]),:host([data-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-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-8) !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}:host([data-placement^=top][data-arrow-hide]){padding-bottom:0}:host([data-placement^=bottom][data-arrow-hide]){padding-top:0}:host([data-placement$=end][data-arrow-hide]),:host([data-placement^=left][data-arrow-hide]){padding-right:0}:host([data-placement$=start][data-arrow-hide]),:host([data-placement^=right][data-arrow-hide]){padding-left:0}::slotted([slot=arrow]){position:absolute;width:calc(var(--mg-b-size-24) + 2*var(--mg-c-card-border-radius) + 2*var(--mg-b-size-8));height:calc(var(--mg-b-size-24) + 2*var(--mg-c-card-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-placement^=top]) ::slotted([slot=arrow]),:host([data-placement^=bottom]) ::slotted([slot=arrow]){height:var(--mg-b-size-8)}:host([data-placement^=top]) ::slotted([slot=arrow])::before,:host([data-placement^=bottom]) ::slotted([slot=arrow])::before{left:calc(var(--mg-c-card-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-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-placement^=top]) ::slotted([slot=arrow])::before{border-top:var(--mg-b-size-8) solid var(--mg-c-popover-color-background)}:host([data-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-placement^=bottom]) ::slotted([slot=arrow])::before{border-bottom:var(--mg-b-size-8) solid var(--mg-c-popover-color-background)}:host([data-placement^=left]) ::slotted([slot=arrow]),:host([data-placement^=right]) ::slotted([slot=arrow]){width:var(--mg-b-size-8)}:host([data-placement^=left]) ::slotted([slot=arrow])::before,:host([data-placement^=right]) ::slotted([slot=arrow])::before{top:calc(var(--mg-c-card-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-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-placement^=left]) ::slotted([slot=arrow])::before{border-left:var(--mg-b-size-8) solid var(--mg-c-popover-color-background)}:host([data-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-placement^=right]) ::slotted([slot=arrow])::before{border-right:var(--mg-b-size-8) solid var(--mg-c-popover-color-background)}:host([data-placement^=left-start]) ::slotted([slot=arrow]),:host([data-placement^=left-end]) ::slotted([slot=arrow]),:host([data-placement^=right-start]) ::slotted([slot=arrow]),:host([data-placement^=right-end]) ::slotted([slot=arrow]){height:calc(var(--mg-b-size-24) + 2*var(--mg-c-card-border-radius))}:host([data-placement^=left-start]) ::slotted([slot=arrow])::before,:host([data-placement^=left-end]) ::slotted([slot=arrow])::before,:host([data-placement^=right-start]) ::slotted([slot=arrow])::before,:host([data-placement^=right-end]) ::slotted([slot=arrow])::before{top:var(--mg-c-card-border-radius)}";
 
 const MgPopoverContent = class {
     constructor(hostRef) {
@@ -8094,7 +8113,7 @@ const MgPopoverContent = class {
         /**
          * Component classes
          */
-        this.classCollection = new kt(['mg-c-popover-content']);
+        this.classCollection = new Zt(['mg-c-popover-content']);
         /**
          * Handle action for close button
          */
@@ -8118,7 +8137,7 @@ const MgPopoverContent = class {
     componentDidLoad() {
         const headingTags = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];
         const slottedTitleElement = this.element.querySelector('[slot="title"]');
-        if (slottedTitleElement && !Tt(slottedTitleElement, headingTags)) {
+        if (slottedTitleElement && !qt(slottedTitleElement, headingTags)) {
             throw new Error(`<mg-popover> Slotted title must be a heading: ${headingTags.join(', ')}.`);
         }
     }
@@ -8127,7 +8146,7 @@ const MgPopoverContent = class {
      * @returns HTML Element
      */
     render() {
-        return (h(Host, { key: '44aa95d34a4c4beeb5c6d1a59e7e7df999393e52' }, h("mg-card", { key: '483195ec364eaaf78df768993706129cb0ce268e', class: this.classCollection.join() }, this.closeButton && (h("mg-button", { key: '4e2b4f7b563c591120ba208e74c501b0bee7497b', "is-icon": true, variant: "flat", label: this.messages.general.close, onClick: this.handleCloseButton }, h("mg-icon", { key: '58a678df3947e4dbfb718c588ccdc97e611915b9', icon: "cross" }))), h("div", { key: 'e7a9debe373ea8947cde108732f635f39b5305a6', class: "mg-c-popover-content__title" }, h("slot", { key: '15fb949256a5f31e8776cdbd7465f46a73db4876', name: "title" })), h("slot", { key: 'ee914630e089763ec3a059cdd6b4c3eba0c2cfa0', name: "content" })), h("slot", { key: '9c25549d1543a77b3cc459caf8bd8df0b279a036', name: "arrow" })));
+        return (h(Host, { key: '8d2dd7d21518de744c18f0280b7b418f3a76acca' }, h("mg-card", { key: '8beab7c9fb692c1983515709a1ee888dc7e5157a', class: this.classCollection.join() }, this.closeButton && (h("mg-button", { key: 'e636569be26b0c741e0b03e806787d91b47ded5c', "is-icon": true, variant: "flat", label: this.messages.general.close, onClick: this.handleCloseButton }, h("mg-icon", { key: '3edc717cbe542494d892566c182883e20b1ca4cb', icon: "cross" }))), h("div", { key: 'd18525218972d92b6932984edb50844658e12970', class: "mg-c-popover-content__title" }, h("slot", { key: '2cceb41fd4ebb00b889e71cab211431e5894d04c', name: "title" })), h("slot", { key: 'a6615d9d7c85b32fb63d3d89db02fae2f8d5c1b2', name: "content" })), h("slot", { key: '0ff4bf72de19a3d56aafb64391cfc276d70e2f18', name: "arrow" })));
     }
     get element() { return getElement(this); }
 };
@@ -8152,7 +8171,7 @@ const MgSkipLinks = class {
         };
     }
     validateLinks(links) {
-        if (links === undefined || links.length === 0 || links.some(link => !Le(link.href) || !link.href.startsWith('#') || !Le(link.label))) {
+        if (links === undefined || links.length === 0 || links.some(link => !De(link.href) || !link.href.startsWith('#') || !De(link.label))) {
             throw new 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.`);
         }
     }
@@ -8171,7 +8190,7 @@ const MgSkipLinks = class {
      * @returns HTML Element
      */
     render() {
-        return (h("nav", { key: '4c0d14ec373d8e987c876ed89923e754af312bfb', class: "mg-c-skip-links", role: "navigation", "aria-label": this.messages.skipLinks.navLabel }, h("ul", { key: '52117cbae84014f7e59fbcebc6489d73f28dd68d', class: "mg-c-skip-links__list", role: "list" }, this.links.map(link => (h("li", { key: link.href }, h("a", { class: "mg-c-skip-links__link", href: link.href, onClick: this.handleLinkCLick }, link.label)))))));
+        return (h("nav", { key: '0b4e4d6b9481a88faae78602b07c4f5e851da517', class: "mg-c-skip-links", role: "navigation", "aria-label": this.messages.skipLinks.navLabel }, h("ul", { key: 'aaa15193eb2c9e1d9ee3b2e2a7d8d0fd37836ed7', class: "mg-c-skip-links__list", role: "list" }, this.links.map(link => (h("li", { key: link.href }, h("a", { class: "mg-c-skip-links__link", href: link.href, onClick: this.handleLinkCLick }, link.label)))))));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -8258,11 +8277,11 @@ const MgTable = class {
         /**
          * Class collection
          */
-        this.classCollection = new kt([this.componentClass]);
+        this.classCollection = new Zt([this.componentClass]);
     }
     watchSize(newValue, oldValue) {
         if (!sizes$1.includes(newValue)) {
-            throw new Error(`<mg-table> prop "size" must be one of: ${sizes$1.join(', ')}. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-table> prop "size" must be one of: ${sizes$1.join(', ')}. Passed value: ${Gt(newValue)}.`);
         }
         else {
             if (oldValue !== undefined) {
@@ -8281,7 +8300,7 @@ const MgTable = class {
     }
     watchColumns(newValue) {
         if (newValue !== undefined && !isValidColumnsObject(newValue)) {
-            throw new Error(`<mg-table> prop "columns" must be a ColumnsType object. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-table> prop "columns" must be a ColumnsType object. Passed value: ${Gt(newValue)}.`);
         }
     }
     /**
@@ -8410,8 +8429,8 @@ const MgTable = class {
             // Ensure caption is not visible (otherwhise the table does not have rounded corners)
             captionTable.className = 'mg-u-visually-hidden';
             // Link caption to div
-            if (!Le(captionTable.id)) {
-                captionTable.setAttribute('id', xt(`${this.componentClass}-caption`));
+            if (!De(captionTable.id)) {
+                captionTable.setAttribute('id', Pt(`${this.componentClass}-caption`));
             }
             divWrapper.setAttribute('aria-labelledby', captionTable.id);
             // Add sortable caption if neeeded
@@ -8495,7 +8514,7 @@ const MgTabs = class {
          * Identifier is used for the element ID (id is a reserved prop in Stencil.js)
          * If not set, it will be created.
          */
-        this.identifier = xt('mg-tabs');
+        this.identifier = Pt('mg-tabs');
         /**
          * Define tabs size
          */
@@ -8507,7 +8526,7 @@ const MgTabs = class {
         /**
          * Component classes
          */
-        this.classCollection = new kt(['mg-c-tabs']);
+        this.classCollection = new Zt(['mg-c-tabs']);
         /**
          * Validate that new tab status can be `Status.ACTIVE`
          * @param tab - tab item
@@ -8560,18 +8579,18 @@ const MgTabs = class {
          */
         this.handleKeydown = (event) => {
             const parent = event.target.parentElement;
-            if (['ArrowRight', 'ArrowLeft'].includes(event.key)) {
+            if ([Keys.ARROWLEFT, Keys.ARROWRIGHT].includes(event.key)) {
                 this.tabFocus = Number(event.target.dataset.index);
                 parent.querySelector(`[data-index="${this.tabFocus}"]`).setAttribute('tabindex', '-1');
                 // Move right
-                if (event.key === 'ArrowRight') {
+                if (event.key === Keys.ARROWRIGHT) {
                     this.tabFocus++;
                     // If we're at the end, go to the start
                     if (this.tabFocus > this.tabs.length)
                         this.tabFocus = this.startIndex;
                     // Move left
                 }
-                else if (event.key === 'ArrowLeft') {
+                else if (event.key === Keys.ARROWLEFT) {
                     this.tabFocus--;
                     // If we're at the start, move to the end
                     if (this.tabFocus < this.startIndex)
@@ -8588,7 +8607,7 @@ const MgTabs = class {
                     parentButtonElement.focus();
                 }
             }
-            else if (event.key === 'Tab') {
+            else if (event.key === Keys.TAB) {
                 this.resetFocus();
             }
         };
@@ -8605,7 +8624,7 @@ const MgTabs = class {
          */
         this.resetFocus = () => {
             // update asynchronously tabindex to prevent get focus on new tabindex at then end of event process
-            Mt(() => {
+            Xt(() => {
                 this.tabFocus = undefined;
                 Array.from(this.element.shadowRoot.querySelectorAll('[data-index]')).forEach((tab, index) => {
                     tab.setAttribute('tabindex', this.activeTab - this.startIndex !== index ? '-1' : '0');
@@ -8622,30 +8641,30 @@ const MgTabs = class {
         };
     }
     watchIdentifier(newValue) {
-        if (!Ot(newValue)) {
-            console.error(`<mg-tabs> prop "identifier" value is invalid. Passed value: ${zt(newValue)}.`);
+        if (!Ut(newValue)) {
+            console.error(`<mg-tabs> prop "identifier" value is invalid. Passed value: ${Gt(newValue)}.`);
         }
     }
     validateLabel(newValue) {
-        if (!Le(newValue)) {
-            throw new Error(`<mg-tabs> prop "label" is required and must be a string. Passed value: ${zt(newValue)}.`);
+        if (!De(newValue)) {
+            throw new Error(`<mg-tabs> prop "label" is required and must be a string. Passed value: ${Gt(newValue)}.`);
         }
     }
     validateSize(newValue) {
         if (!sizes.includes(newValue)) {
-            throw new Error(`<mg-tabs> prop "size" must be one of: ${sizes.join(', ')}. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-tabs> prop "size" must be one of: ${sizes.join(', ')}. Passed value: ${Gt(newValue)}.`);
         }
         this.classCollection.add(`mg-c-tabs--size-${this.size}`);
     }
     validateItems(newValue) {
         // String array
-        if (At(newValue))
+        if (Dt(newValue))
             this.tabs = newValue.map(item => ({ label: item, status: Status.VISIBLE }));
         // Object array
         else if (Array.isArray(newValue) && newValue.length > 0 && newValue.every(isTabItem))
             this.tabs = newValue;
         else
-            throw new Error(`<mg-tabs> prop "items" is required and all items must be the same type: TabItem. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-tabs> prop "items" is required and all items must be the same type: TabItem. Passed value: ${Gt(newValue)}.`);
     }
     validateActiveTab(newValue) {
         // when `active-tab` is undefined we set default value by searching an item with `Status.ACTIVE` or we use the `startIndex` has fallback value
@@ -8670,7 +8689,7 @@ const MgTabs = class {
             this.activeTabChange.emit(newValue);
         }
         else {
-            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: ${zt(newValue)}.`);
+            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: ${Gt(newValue)}.`);
         }
     }
     /*************
@@ -8705,7 +8724,7 @@ const MgTabs = class {
      * @returns HTML Element
      */
     render() {
-        return (h("div", { key: 'e4b89ce00f76cc556f72acbfd4b08ef90fd50a9c', class: this.classCollection.join() }, h("header", { key: 'c9c3434335e28103c1128f4bef926602e182cf14', role: "tablist", "aria-label": this.label, class: "mg-c-tabs__header" }, this.tabs.map((tab, index) => (h("button", { key: tab.label, role: "tab", id: this.getElementId(this.identifier, index), class: {
+        return (h("div", { key: '558c5ba517bef98ba711dd8992f901768d6770de', class: this.classCollection.join() }, h("header", { key: '0d36d49d51bbbb78bbf68c05e47271349fc58b96', role: "tablist", "aria-label": this.label, class: "mg-c-tabs__header" }, this.tabs.map((tab, index) => (h("button", { key: tab.label, role: "tab", id: this.getElementId(this.identifier, index), class: {
                 [`${this.buttonTabBaseClass}`]: true,
                 [`${this.buttonTabBaseClass}--horizontal`]: true,
                 [`${this.getNavigationButtonClass(Status.ACTIVE)}`]: this.tabHasStatus(tab, Status.ACTIVE),
@@ -8755,11 +8774,11 @@ const MgTag = class {
         /**
          * Component classes
          */
-        this.classCollection = new kt(['mg-c-tag']);
+        this.classCollection = new Zt(['mg-c-tag']);
     }
     validateVariant(newValue, oldValue) {
         if (!variants.includes(newValue)) {
-            throw new Error(`<mg-tag> prop "variant" must be one of: ${variants.join(', ')}. Passed value: ${zt(newValue)}.`);
+            throw new Error(`<mg-tag> prop "variant" must be one of: ${variants.join(', ')}. Passed value: ${Gt(newValue)}.`);
         }
         else {
             if (oldValue !== undefined) {
@@ -8792,7 +8811,7 @@ const MgTag = class {
      * @param textContent - html element textContent property
      */
     validateTextContent(textContent) {
-        if (!Le(textContent))
+        if (!De(textContent))
             throw new Error('<mg-tag> slot must contain a text content.');
     }
     /*************
@@ -8845,7 +8864,7 @@ const MgTooltip = class {
          * Sets an `id` attribute.
          * Needed by the input for accessibility `aria-decribedby`.
          */
-        this.identifier = xt('mg-tooltip');
+        this.identifier = Pt('mg-tooltip');
         /**
          * Tooltip placement
          */
@@ -8865,12 +8884,13 @@ const MgTooltip = class {
             // Make the tooltip visible
             this.mgTooltipContent.dataset.show = '';
             // hide when click outside on nextTick to prevent event to trigger after creation
-            Mt(() => {
+            Xt(() => {
                 this.windows.forEach((localWindow) => {
                     localWindow.addEventListener('click', this.handleClickOutside, false);
                     localWindow.addEventListener('keydown', this.handlePressEscape, false);
                 });
             });
+            this.updateTooltip();
         };
         /**
          * Hide tooltip
@@ -8908,8 +8928,9 @@ const MgTooltip = class {
          * @param condition - additionnal condition to apply display prop newValue
          */
         this.setDisplay = (newValue, condition = true) => {
-            if (!this.disabled && condition)
+            if (!this.disabled && condition && this.display !== newValue) {
                 this.display = newValue;
+            }
         };
         /**
          * Action for tooltip element and tooltiped element mouse listener
@@ -8967,52 +8988,43 @@ const MgTooltip = class {
             }
         };
         /**
-         * Set Floating UI instance
-         * @param strategy - Floating UI strategy to apply on instance
+         * Update tooltip position
+         * @returns autoUpdate function
          */
-        this.setFloatingUI = (strategy) => {
-            // Initial styles configuration
+        this.updateTooltip = () => autoUpdate(this.tooltipedElement, this.mgTooltipContent, async () => {
+            // Placement
+            const { x, y, placement, middlewareData } = await computePosition(this.tooltipedElement, this.mgTooltipContent, {
+                placement: this.placement,
+                strategy: this.tooltipStrategy,
+                middleware: [
+                    offset(8),
+                    flip(),
+                    shift({
+                        limiter: limitShift(),
+                    }),
+                    arrow({ element: this.arrowElement }),
+                ],
+            });
+            // Positioning
             Object.assign(this.mgTooltipContent.style, {
-                position: strategy,
-                top: '0',
-                left: '0',
-                transform: 'translate(0, 0)',
+                position: this.tooltipStrategy,
+                transform: getTransformation(x, y),
             });
-            // Create Floating UI instance with autoUpdate
-            this.floatingUICleanup = autoUpdate(this.tooltipedElement, this.mgTooltipContent, () => {
-                computePosition(this.tooltipedElement, this.mgTooltipContent, {
-                    placement: this.placement,
-                    strategy,
-                    middleware: [offset(8), flip(), shift({ limiter: limitShift() }), arrow({ element: this.mgTooltipContent.querySelector('[data-floating-arrow]') })],
-                }).then(({ x, y, placement, middlewareData }) => {
-                    Object.assign(this.mgTooltipContent.style, {
-                        transform: !isNaN(x) && !isNaN(y) ? `translate(${x}px, ${y}px)` : undefined,
-                    });
-                    // Update arrow style
-                    const { x: arrowX, y: arrowY } = middlewareData.arrow;
-                    const staticSide = {
-                        top: 'bottom',
-                        right: 'left',
-                        bottom: 'top',
-                        left: 'right',
-                    }[placement.split('-')[0]];
-                    const arrowElement = this.mgTooltipContent.querySelector('[data-floating-arrow]');
-                    // https://floating-ui.com/docs/arrow
-                    // Unlike the floating element, which has both coordinates defined at all times, the arrow only has one defined.
-                    // Due to this, either x or y will be undefined, depending on the side of placement.
-                    // The above code uses `isNaN` to check for null and undefined simultaneously.
-                    // Don’t remove `isNaN`, because either value can be falsy (0), causing a bug!
-                    const numberToPx = (number) => (!isNaN(number) ? `${number}px` : '');
-                    Object.assign(arrowElement.style, {
-                        left: numberToPx(arrowX),
-                        top: numberToPx(arrowY),
-                        [staticSide]: '-4px',
-                        position: 'absolute',
-                    });
-                    this.mgTooltipContent.setAttribute('data-placement', placement);
-                });
+            // Arrow positioning
+            const { x: arrowX, y: arrowY } = middlewareData.arrow;
+            const staticSide = {
+                top: 'bottom',
+                right: 'left',
+                bottom: 'top',
+                left: 'right',
+            }[placement.split('-')[0]];
+            Object.assign(this.arrowElement.style, {
+                left: numberToPx(arrowX),
+                top: numberToPx(arrowY),
+                [staticSide]: '-4px',
             });
-        };
+            this.mgTooltipContent.setAttribute('data-placement', placement);
+        });
         /**
          * Define selected element to become tooltip selector and init listeners
          * @param element - tooltiped element
@@ -9054,18 +9066,15 @@ const MgTooltip = class {
                 // set guard when one of mutations is for a disabled with disabled-on-click
                 if (mutationList.some((mutation) => mutation.target.disabled && mutation.target.disableOnClick)) {
                     this.guard = Guard.DISABLE_ON_CLICK;
-                }
-                // when the disabled-on-click guard is running we stop process
-                if (this.guard === Guard.DISABLE_ON_CLICK)
                     return;
+                }
                 // update button wrapper
                 this.setMgButtonWrapper(mgButton);
                 // Since Firefox doesn't trigger a "blur" event when the "disabled" attribute is added or removed from a button
                 // we have to manually unlock the guard because the "blur" handler of the tooltipedElement won't do it.
                 this.resetGuard();
                 // update Floating UI instance
-                this.floatingUICleanup();
-                this.setFloatingUI(this.element.closest('mg-popover') !== null ? 'absolute' : 'fixed');
+                this.updateTooltip();
             }).observe(mgButton, { attributes: true });
         };
         /**
@@ -9084,15 +9093,15 @@ const MgTooltip = class {
         };
     }
     watchIdentifier(newValue) {
-        if (!Ot(newValue)) {
-            throw new Error(`<mg-tooltip> prop "identifier" value is invalid. Passed value: ${zt(newValue)}.`);
+        if (!Ut(newValue)) {
+            throw new Error(`<mg-tooltip> prop "identifier" value is invalid. Passed value: ${Gt(newValue)}.`);
         }
         // use renderTooltipContent to update tooltip-content id
         this.renderTooltipContent();
     }
     watchMessage(newValue) {
-        if (!Le(newValue)) {
-            throw new Error(`<mg-tooltip> prop "message" is required and must be a string. Passed value: ${zt(newValue)}.`);
+        if (!De(newValue)) {
+            throw new Error(`<mg-tooltip> prop "message" is required and must be a string. Passed value: ${Gt(newValue)}.`);
         }
         if (this.mgTooltipContent !== undefined)
             this.mgTooltipContent.message = newValue;
@@ -9151,7 +9160,7 @@ const MgTooltip = class {
      */
     componentWillLoad() {
         // Get windows to attach events
-        this.windows = Rt(window);
+        this.windows = Bt(window);
         // Get tooltip element
         this.renderTooltipContent();
         //validate properties
@@ -9159,6 +9168,8 @@ const MgTooltip = class {
         this.watchDisabled(this.disabled);
         this.watchMessage(this.message);
         this.watchIdentifier(this.identifier);
+        // define if the tooltip is inside a popover
+        this.tooltipStrategy = this.element.closest('mg-popover') !== null ? 'absolute' : 'fixed';
     }
     /**
      * Get slotted element
@@ -9170,8 +9181,10 @@ const MgTooltip = class {
         // get slotted element wich is not the tooltip
         const slotElement = this.element.querySelector(`*:not(#${this.identifier})`);
         // Get interactive element
-        const interactiveElement = slotElement.matches(jt) ? slotElement : (_a = slotElement.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(jt);
+        const interactiveElement = slotElement.matches(Ht) ? slotElement : (_a = slotElement.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(Ht);
         this.setTooltipedElement(interactiveElement || slotElement);
+        // Set arrow element
+        this.arrowElement = this.mgTooltipContent.querySelector('[data-floating-arrow]');
         // Check if slotted element is a disabled mg-button
         // In this case we wrap the mg-button into a div to enable the tooltip
         if (isButton(slotElement)) {
@@ -9187,8 +9200,6 @@ const MgTooltip = class {
         }
         // apply a11y aria
         this.setAriaDescribedby(slotElement);
-        // set Tooltip
-        this.setFloatingUI(this.element.closest('mg-popover') !== null ? 'absolute' : 'fixed');
         // add document keyboard handler
         document.addEventListener('keydown', this.handlePressEscape);
         // check props
@@ -9198,28 +9209,26 @@ const MgTooltip = class {
      * update popper position after props change on component did update hook to benefit from render ended
      */
     componentDidUpdate() {
-        this.floatingUICleanup();
-        this.setFloatingUI(this.element.closest('mg-popover') !== null ? 'absolute' : 'fixed');
+        this.updateTooltip();
     }
     /**
      * remove listeners
      */
     disconnectedCallback() {
-        var _a;
+        var _a, _b;
         document.removeEventListener('keydown', this.handlePressEscape);
         (_a = this.windows) === null || _a === void 0 ? void 0 : _a.forEach((localWindow) => {
             localWindow.removeEventListener('click', this.handleClickOutside, false);
             localWindow.removeEventListener('keydown', this.handlePressEscape, false);
         });
-        // cleanup Floating UI
-        this.floatingUICleanup();
+        (_b = this.updateTooltip) === null || _b === void 0 ? void 0 : _b.call(this);
     }
     /**
      * Render
      * @returns HTML Element
      */
     render() {
-        return (h(Host, { key: '31d97272cfd3448abf9ed9cda62fdec0a356d422' }, h("slot", { key: '8fbf8343471f53591caacc3ff4c4b8aaf4577c4f' }), h("slot", { key: '6f4eab4c33e9ec07e0fe7ffa63de4921f4b27e0c', name: "content" })));
+        return (h(Host, { key: 'dab470c730b1541ab5be487222da8ba3643501ae' }, h("slot", { key: 'a6f5d444e3521d93cf9f39ccffcd68cfde4f8101' }), h("slot", { key: 'ba4d98f953453a710379cb4ce28f1c468a34ffc4', name: "content" })));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -9232,7 +9241,7 @@ const MgTooltip = class {
 };
 MgTooltip.style = mgTooltipCss;
 
-const mgTooltipContentCss = ":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-placement^=top])>::slotted([slot=arrow]){bottom:calc(-1*var(--mg-b-size-4))}:host([data-placement^=bottom])>::slotted([slot=arrow]){top:calc(-1*var(--mg-b-size-4))}:host([data-placement^=left])>::slotted([slot=arrow]){right:calc(-1*var(--mg-b-size-4))}:host([data-placement^=right])>::slotted([slot=arrow]){left:calc(-1*var(--mg-b-size-4))}";
+const mgTooltipContentCss = ":host{z-index:1000;top:0;left:0;display:none;width:max-content;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]){position:absolute;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-placement^=top])>::slotted([slot=arrow]){bottom:calc(-1*var(--mg-b-size-4))}:host([data-placement^=bottom])>::slotted([slot=arrow]){top:calc(-1*var(--mg-b-size-4))}:host([data-placement^=left])>::slotted([slot=arrow]){right:calc(-1*var(--mg-b-size-4))}:host([data-placement^=right])>::slotted([slot=arrow]){left:calc(-1*var(--mg-b-size-4))}";
 
 const MgTooltipContent = class {
     constructor(hostRef) {