@mgdis/mg-components 5.10.0 → 5.10.1

package/dist/components/mg-input-text2.js

@@ -27,7 +27,6 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.hasDisplayedError = false;
     /**
      * Handle input event
-     * @returns {void}
      */
     this.handleInput = () => {
       this.checkValidity();
@@ -38,26 +37,23 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     /**
      * Handle focus event
-     * @returns {void}
      */
     this.handleFocus = () => {
-      this.classList.add(this.classFocus);
-      this.classList = new ClassList(this.classList.classes);
+      this.classCollection.add(this.classFocus);
+      this.classCollection = new ClassList(this.classCollection.classes);
     };
     /**
      * Handle blur event
-     * @returns {void}
      */
     this.handleBlur = () => {
       // Manage focus
-      this.classList.delete(this.classFocus);
-      this.classList = new ClassList(this.classList.classes);
+      this.classCollection.delete(this.classFocus);
+      this.classCollection = new ClassList(this.classCollection.classes);
       // Display Error
       this.displayError();
     };
     /**
      * Check if input is valid
-     * @returns {void}
      */
     this.checkValidity = () => {
       var _a;
@@ -68,7 +64,6 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     /**
      * Set input error message
-     * @returns {void}
      */
     this.setErrorMessage = () => {
       // Set error message
@@ -84,7 +79,6 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     /**
      * Validate pattern configuration
-     * @returns {void}
      */
     this.validatePattern = () => {
       if (this.pattern !== undefined &&
@@ -96,16 +90,15 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     /**
      * Validate append slot
-     * @returns {void}
      */
     this.validateAppendSlot = () => {
       const slotAppendInput = Array.from(this.element.querySelectorAll('[slot="append-input"]'));
       if (slotAppendInput.length === 1) {
-        this.classList.add(slotAppendInput[0].nodeName === 'MG-BUTTON' ? this.classIsInputGroupAppend : 'mg-input--is-append-input-slot-content');
+        this.classCollection.add(slotAppendInput[0].nodeName === 'MG-BUTTON' ? this.classIsInputGroupAppend : 'mg-input--is-append-input-slot-content');
       }
       else if (slotAppendInput.filter(slot => slot.nodeName === 'MG-BUTTON').length > 1) {
-        this.classList.add(this.classIsInputGroupAppend);
-        this.classList.add('mg-input--has-buttons-group-append');
+        this.classCollection.add(this.classIsInputGroupAppend);
+        this.classCollection.add('mg-input--has-buttons-group-append');
       }
     };
     this.value = undefined;
@@ -129,7 +122,7 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.helpText = undefined;
     this.valid = undefined;
     this.invalid = undefined;
-    this.classList = new ClassList(['mg-input--text']);
+    this.classCollection = new ClassList(['mg-input--text']);
     this.errorMessage = undefined;
   }
   handleValue(newValue) {
@@ -137,10 +130,10 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   validateIcon(newValue) {
     if (newValue !== undefined) {
-      this.classList.add(this.classHasIcon);
+      this.classCollection.add(this.classHasIcon);
     }
     else {
-      this.classList.delete(this.classHasIcon);
+      this.classCollection.delete(this.classHasIcon);
     }
   }
   handleValidityChange(newValue, _oldValue, prop) {
@@ -155,14 +148,12 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   /**
    * Public method to play input focus
-   * @returns {Promise<void>}
    */
   async setFocus() {
     this.input.focus();
   }
   /**
    * Public method to display errors
-   * @returns {Promise<void>}
    */
   async displayError() {
     this.checkValidity();
@@ -174,7 +165,7 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
    *************/
   /**
    * Check if component props are well configured on init
-   * @returns {ReturnType<typeof setTimeout>} timeout
+   * @returns timeout
    */
   componentWillLoad() {
     // Get locales
@@ -193,10 +184,10 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   /**
    * Render
-   * @returns {HTMLElement} HTML Element
+   * @returns HTML Element
    */
   render() {
-    return (h(MgInput, { identifier: this.identifier, classList: this.classList, ariaDescribedbyIDs: [this.characterLeftId], label: this.label, labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, readonly: this.readonly, mgWidth: this.mgWidth, disabled: this.disabled, value: this.value, readonlyValue: undefined, tooltip: this.tooltip, helpText: this.helpText, errorMessage: this.errorMessage, isFieldset: false }, h("div", { class: "mg-input__with-character-left", style: {
+    return (h(MgInput, { identifier: this.identifier, classCollection: this.classCollection, ariaDescribedbyIDs: [this.characterLeftId], label: this.label, labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, readonly: this.readonly, mgWidth: this.mgWidth, disabled: this.disabled, value: this.value, readonlyValue: undefined, tooltip: this.tooltip, helpText: this.helpText, errorMessage: this.errorMessage, isFieldset: false }, h("div", { class: "mg-input__with-character-left", style: {
         '--mg-character-left-message-length': (this.displayCharacterLeft
           ? (this.maxlength - (this.value || '').length).toString().length + this.maxlength.toString().length + 1
           : 0).toString(),
@@ -236,7 +227,7 @@ const MgInputText = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     "helpText": [1, "help-text"],
     "valid": [1028],
     "invalid": [1028],
-    "classList": [32],
+    "classCollection": [32],
     "errorMessage": [32],
     "setFocus": [64],
     "displayError": [64]

package/dist/components/mg-input-textarea.js

@@ -38,23 +38,23 @@ const MgInputTextarea$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEle
      * Handle focus event
      */
     this.handleFocus = () => {
-      this.classList.add(this.classFocus);
-      this.classList = new ClassList(this.classList.classes);
+      this.classCollection.add(this.classFocus);
+      this.classCollection = new ClassList(this.classCollection.classes);
     };
     /**
      * Handle blur event
      */
     this.handleBlur = () => {
       // Manage focus
-      this.classList.delete(this.classFocus);
-      this.classList = new ClassList(this.classList.classes);
+      this.classCollection.delete(this.classFocus);
+      this.classCollection = new ClassList(this.classCollection.classes);
       // Display Error
       this.displayError();
     };
     /**
      * Get pattern validity
      * Pattern is not defined on textarea field: https://developer.mozilla.org/fr/docs/Web/HTML/Element/Textarea
-     * @returns {boolean} is pattern valid
+     * @returns is pattern valid
      */
     this.getPatternValidity = () => this.pattern === undefined || new RegExp(`^${this.pattern}$`, 'u').test(this.value);
     /**
@@ -114,7 +114,7 @@ const MgInputTextarea$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEle
     this.valid = undefined;
     this.invalid = undefined;
     this.resizable = 'none';
-    this.classList = new ClassList(['mg-input--textarea']);
+    this.classCollection = new ClassList(['mg-input--textarea']);
     this.errorMessage = undefined;
   }
   handleValue(newValue) {
@@ -133,15 +133,14 @@ const MgInputTextarea$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEle
   }
   validateDisplayCharacterLeft(newValue) {
     if (newValue) {
-      this.classList.add(this.classHasDisplayCharacterLeft);
+      this.classCollection.add(this.classHasDisplayCharacterLeft);
     }
     else {
-      this.classList.delete(this.classHasDisplayCharacterLeft);
+      this.classCollection.delete(this.classHasDisplayCharacterLeft);
     }
   }
   /**
    * Public method to display errors
-   * @returns {Promise<void>}
    */
   async displayError() {
     this.checkValidity();
@@ -153,7 +152,7 @@ const MgInputTextarea$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEle
    *************/
   /**
    * Check if component props are well configured on init
-   * @returns {ReturnType<typeof setTimeout>} timeout
+   * @returns timeout
    */
   componentWillLoad() {
     // Get locales
@@ -171,10 +170,10 @@ const MgInputTextarea$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEle
   }
   /**
    * Render
-   * @returns {HTMLElement} HTML Element
+   * @returns HTML Element
    */
   render() {
-    return (h(MgInput, { identifier: this.identifier, classList: this.classList, ariaDescribedbyIDs: [this.characterLeftId], label: this.label, labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, readonly: this.readonly, mgWidth: this.mgWidth, disabled: this.disabled, value: this.value, readonlyValue: undefined, tooltip: this.tooltip, helpText: this.helpText, errorMessage: this.errorMessage, isFieldset: false }, h("div", { class: "mg-input__with-character-left" }, h("textarea", { class: {
+    return (h(MgInput, { identifier: this.identifier, classCollection: this.classCollection, ariaDescribedbyIDs: [this.characterLeftId], label: this.label, labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, readonly: this.readonly, mgWidth: this.mgWidth, disabled: this.disabled, value: this.value, readonlyValue: undefined, tooltip: this.tooltip, helpText: this.helpText, errorMessage: this.errorMessage, isFieldset: false }, h("div", { class: "mg-input__with-character-left" }, h("textarea", { class: {
         'mg-input__box': true,
         'mg-input__box--resizable': this.resizable === 'both',
         'mg-input__box--resizable-horizontal': this.resizable === 'horizontal',
@@ -215,7 +214,7 @@ const MgInputTextarea$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEle
     "valid": [1028],
     "invalid": [1028],
     "resizable": [1],
-    "classList": [32],
+    "classCollection": [32],
     "errorMessage": [32],
     "displayError": [64]
   }]);

package/dist/components/mg-input-title2.js

@@ -24,7 +24,6 @@ const MgInputTitle = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
    *************/
   /**
    * Init tag name
-   * @returns {void}
    */
   componentWillLoad() {
     this.validateIdentifier(this.identifier);
@@ -32,7 +31,7 @@ const MgInputTitle = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
   }
   /**
    * Render
-   * @returns {HTMLElement} HTML Element
+   * @returns HTML element
    */
   render() {
     const TagName = this.tagName;

package/dist/components/mg-input-toggle.js

@@ -9,8 +9,8 @@ const mgInputToggleCss = ":host{display:block}.mg-input{display:flex;align-items
 
 /**
  * type Option validation function
- * @param {ToggleValue} option radio option
- * @returns {boolean} toggle option type is valid
+ * @param option - radio option
+ * @returns toggle option type is valid
  */
 const isOption = (option) => typeof option === 'object' && typeof option.title === 'string' && option.value !== undefined;
 const MgInputToggle$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
@@ -31,14 +31,12 @@ const MgInputToggle$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
     this.classIcon = 'mg-input--toggle-icon';
     /**
      * Change checked value
-     * @returns {void}
      */
     this.toggleChecked = () => {
       this.checked = !this.checked;
     };
     /**
      * Slots validation
-     * @returns {void}
      */
     this.validateSlots = () => {
       const slots = Array.from(this.element.children);
@@ -64,7 +62,7 @@ const MgInputToggle$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
     this.disabled = false;
     this.tooltip = undefined;
     this.helpText = undefined;
-    this.classList = new ClassList(['mg-input--toggle']);
+    this.classCollection = new ClassList(['mg-input--toggle']);
     this.options = undefined;
     this.checked = false;
   }
@@ -92,40 +90,39 @@ const MgInputToggle$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
   }
   handleIsOnOff(newValue) {
     if (newValue)
-      this.classList.add(this.classOnOff);
+      this.classCollection.add(this.classOnOff);
     else
-      this.classList.delete(this.classOnOff);
+      this.classCollection.delete(this.classOnOff);
   }
   handleIsIcon(newValue) {
     if (newValue)
-      this.classList.add(this.classIcon);
+      this.classCollection.add(this.classIcon);
     else
-      this.classList.delete(this.classIcon);
+      this.classCollection.delete(this.classIcon);
   }
   handleReadonly(newValue) {
     if (newValue)
-      this.classList.add(this.classReadonly);
+      this.classCollection.add(this.classReadonly);
     else
-      this.classList.delete(this.classReadonly);
+      this.classCollection.delete(this.classReadonly);
   }
   handleDisabled(newValue) {
     if (newValue)
-      this.classList.add(this.classDisabled);
+      this.classCollection.add(this.classDisabled);
     else
-      this.classList.delete(this.classDisabled);
+      this.classCollection.delete(this.classDisabled);
   }
   handleChecked(newValue) {
     // style
     if (newValue)
-      this.classList.add(this.classIsActive);
+      this.classCollection.add(this.classIsActive);
     else
-      this.classList.delete(this.classIsActive);
+      this.classCollection.delete(this.classIsActive);
     // update value
     this.value = this.options[newValue ? 1 : 0].value;
   }
   /**
    * set checked state
-   * @returns {void}
    */
   setChecked() {
     const optionTrueValueIndex = this.options.map(option => option.value).findIndex(value => value === true);
@@ -167,10 +164,10 @@ const MgInputToggle$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
   }
   /**
    * Render
-   * @returns {HTMLElement} HTML Element
+   * @returns HTML Element
    */
   render() {
-    return (h(MgInput, { identifier: this.identifier, classList: this.classList, ariaDescribedbyIDs: [], label: this.label, labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: undefined, readonly: undefined, mgWidth: undefined, disabled: this.disabled, value: this.value, readonlyValue: undefined, tooltip: !this.readonly && this.tooltip, helpText: this.helpText, errorMessage: undefined, isFieldset: false }, h("button", { type: "button", role: "switch", "aria-checked": this.checked.toString(), "aria-readonly": this.disabled || this.readonly, id: this.identifier, class: "mg-input__button-toggle", disabled: this.disabled || this.readonly, onClick: this.toggleChecked }, h("span", { "aria-hidden": "true", class: "mg-input__toggle-item-container" }, h("slot", { name: "item-1" })), h("span", { "aria-hidden": "true", class: "mg-input__toggle-item-container" }, h("slot", { name: "item-2" })))));
+    return (h(MgInput, { identifier: this.identifier, classCollection: this.classCollection, ariaDescribedbyIDs: [], label: this.label, labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: undefined, readonly: undefined, mgWidth: undefined, disabled: this.disabled, value: this.value, readonlyValue: undefined, tooltip: !this.readonly && this.tooltip, helpText: this.helpText, errorMessage: undefined, isFieldset: false }, h("button", { type: "button", role: "switch", "aria-checked": this.checked.toString(), "aria-readonly": this.disabled || this.readonly, id: this.identifier, class: "mg-input__button-toggle", disabled: this.disabled || this.readonly, onClick: this.toggleChecked }, h("span", { "aria-hidden": "true", class: "mg-input__toggle-item-container" }, h("slot", { name: "item-1" })), h("span", { "aria-hidden": "true", class: "mg-input__toggle-item-container" }, h("slot", { name: "item-2" })))));
   }
   get element() { return this; }
   static get watchers() { return {
@@ -197,7 +194,7 @@ const MgInputToggle$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
     "disabled": [4],
     "tooltip": [1],
     "helpText": [1, "help-text"],
-    "classList": [32],
+    "classCollection": [32],
     "options": [32],
     "checked": [32]
   }]);

package/dist/components/mg-item-more.js

@@ -11,8 +11,8 @@ import { d as defineCustomElement$2 } from './mg-popover2.js';
 
 /**
  * MgItemMore type guard
- * @param {HTMLElement} element element to control type
- * @returns {boolean} truthy if element is mg-item-more
+ * @param element - element to control type
+ * @returns truthy if element is mg-item-more
  */
 const isMgItemMore = (element) => element.nodeName === 'MG-ITEM-MORE';
 var OverflowBehaviorElements;
@@ -29,7 +29,6 @@ class OverflowBehavior {
      **********/
     /**
      * Disconnect ResizeObserver
-     * @returns {void}
      */
     this.disconnect = () => {
       this._resizeObserver.disconnect();
@@ -39,8 +38,7 @@ class OverflowBehavior {
      ************/
     /**
      * run overflow behavior
-     * @param {number} width width of the container. Optional.
-     * @returns {void}
+     * @param width - width of the container. Optional.
      */
     this.run = (width) => {
       if (this._moreElement === undefined) {
@@ -63,14 +61,13 @@ class OverflowBehavior {
     };
     /**
      * Get interactive children filtred by authorized nodeName ['MG-MENU-ITEM', 'MG-BUTTON']
-     * @param {Element} element element to parse
-     * @returns {Element[]} children
+     * @param element - element to parse
+     * @returns children
      */
     this.getInteractiveItems = (element) => { var _a; return (((_a = element.children) === null || _a === void 0 ? void 0 : _a.length) > 0 ? Array.from(element.children) : []).filter(element => ['MG-MENU-ITEM', 'MG-BUTTON'].includes(element.nodeName)); };
     /**
      * Update displayed items in container from a given available space
-     * @param {number} availableWidth available width in container to display child items
-     * @returns {void}
+     * @param availableWidth - available width in container to display child items
      */
     this.updateDisplayedItems = (availableWidth) => {
       this.restoreItems();
@@ -89,10 +86,10 @@ class OverflowBehavior {
     };
     /**
      * Utility method to know if item overflow partialy or totaly in the container
-     * @param {number} cumulateWidth previous sibling elements cumulate width + item width
-     * @param {HTMLElement} item item HTML element
-     * @param {number} availableWidth container available width
-     * @returns {boolean} truthy if element is overflow
+     * @param cumulateWidth - previous sibling elements cumulate width + item width
+     * @param item - item HTML element
+     * @param availableWidth - container available width
+     * @returns truthy if element is overflow
      */
     this.isOverflowElement = (cumulateWidth, item, availableWidth) => {
       if (item.previousElementSibling === null || this.isMoreElement(item))
@@ -104,15 +101,14 @@ class OverflowBehavior {
     };
     /**
      * Utility method to know if a given element is the 'MORE' element
-     * @param {Element} element element to match with 'MORE' element
-     * @returns {boolean} truthy if element is the 'MORE' element
+     * @param element - element to match with 'MORE' element
+     * @returns truthy if element is the 'MORE' element
      */
     this.isMoreElement = (element) => element.nodeName === 'MG-ITEM-MORE';
     /**
      * Toggle display item element
-     * @param {HTMLElement} item item to control
-     * @param {boolean} isHidden is item hidden
-     * @returns {void}
+     * @param item - item to control
+     * @param isHidden - is item hidden
      */
     this.toggleItem = (item, isHidden) => {
       const mgActionMenuindex = Number(item.getAttribute(OverflowBehaviorElements.BASE_INDEX));
@@ -125,9 +121,8 @@ class OverflowBehavior {
     };
     /**
      * Toggle element's hidde attribute
-     * @param {Element} element element to toggle
-     * @param {boolean} isHidden element is hidden
-     * @returns {void}
+     * @param element - element to toggle
+     * @param isHidden - element is hidden
      */
     this.toggleElement = (element, isHidden) => {
       if (isHidden)
@@ -137,7 +132,6 @@ class OverflowBehavior {
     };
     /**
      * Remove hidden attributes on all items
-     * @returns {void}
      */
     this.restoreItems = () => {
       [...this._baseChildren, this._moreElement].forEach(item => item.removeAttribute('hidden'));
@@ -171,7 +165,7 @@ const MgItemMore$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
      ***********/
     /**
      * render mg-item-more overflow element
-     * @returns {HTMLMgItemMoreElement} mg-item-more element
+     * @returns mg-item-more element
      */
     this.renderMgMenuItemOverflowElement = () => {
       // create menu items proxy element from item clones
@@ -220,14 +214,12 @@ const MgItemMore$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
    *************/
   /**
    * Disconnect overflow ResizeObserver
-   * @returns {void} run overflow resize obeserver disconnexion
    */
   disconnectedCallback() {
     this.overflowBehavior.disconnect();
   }
   /**
    * Set variables and validate props
-   * @returns {void}
    */
   componentWillLoad() {
     // init variables
@@ -241,14 +233,13 @@ const MgItemMore$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
   }
   /**
    * Add overflow behavior
-   * @returns {void}
    */
   componentDidLoad() {
     this.overflowBehavior = new OverflowBehavior(this.parentMenu, this.renderMgMenuItemOverflowElement);
   }
   /**
    * Render
-   * @returns {HTMLElement} HTML Element
+   * @returns HTML Element
    */
   render() {
     return (h(Host, { role: "menuitem", "aria-haspopup": "true" }, h("mg-menu-item", { "data-overflow-more": true, "data-size": this.parentMenu.size }, h("mg-icon", { icon: this.icon.icon, slot: "image" }), h("span", { class: { 'sr-only': !this.slotlabel.display }, slot: "label" }, this.slotlabel.label), h("mg-menu", { direction: Direction.VERTICAL, label: this.messages.moreLabel, size: this.size }))));

package/dist/components/mg-menu-item2.js

@@ -46,29 +46,27 @@ const MgMenuItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
      **********/
     /**
      * Toggle expanded prop value
-     * @returns {void}
      */
     this.toggleExpanded = () => {
       this.expanded = !this.expanded;
     };
     /**
      * Does an Element have given Status
-     * @param {HTMLMgMenuItemElement} mgMenuItemElement to parse
-     * @param {MgMenuItem['status']} status to check
-     * @returns {boolean} true if element with status is found
+     * @param mgMenuItemElement - to parse
+     * @param status - to check
+     * @returns true if element with status is found
      */
     this.hasStatus = (mgMenuItemElement, status) => mgMenuItemElement.status === status;
     /**
      * Is component contextual direction match the given direction
-     * @param {MgMenuItem['direction']} direction in parent menu
-     * @param {MgMenuItem['direction']} compareWith direction to compare with. Default: `this.direction`
-     * @returns {boolean} true is direction match the direction propertie
+     * @param direction - in parent menu
+     * @param compareWith - direction to compare with. Default: `this.direction`
+     * @returns true is direction match the direction propertie
      */
     this.isDirection = (direction, compareWith = this.direction) => direction === compareWith;
     /**
      * Update displayNotificationBadge
      * current component notification badge have priority over the slot badge when submenu contain badge
-     * @returns {void} update displayNotificationBadge value
      */
     this.updateDisplayNotificationBadge = () => {
       const childMenu = this.element.querySelector('mg-menu');
@@ -78,7 +76,7 @@ const MgMenuItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     /**
      * Method to control if one of component children have active status
-     * @returns {boolean} truthy if component has active child
+     * @returns truthy if component has active child
      */
     this.hasActiveChild = () => {
       var _a;
@@ -86,8 +84,7 @@ const MgMenuItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     /**
      * Validate slots
-     * @param {boolean} guard prevent action whith guard. Default: false.
-     * @returns {void}
+     * @param guard - prevent action whith guard. Default: false.
      */
     this.validateSlot = (guard = false) => {
       // slot title AND metadata validation
@@ -105,8 +102,7 @@ const MgMenuItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     /**
      * Update status
-     * @param {Status[]} guard status to exclude from process in addition to [Status.HIDDEN, Status.DISABLED] . Default: [].
-     * @returns {void}
+     * @param guard - status to exclude from process in addition to [Status.HIDDEN, Status.DISABLED] . Default: [].
      */
     this.updateStatus = (guard = []) => {
       if (![Status.HIDDEN, Status.DISABLED, ...guard].includes(this.status)) {
@@ -115,7 +111,6 @@ const MgMenuItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     /**
      * Init event-listeners
-     * @returns {void}
      */
     this.initListeners = () => {
       var _a;
@@ -131,12 +126,12 @@ const MgMenuItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     /**
      * Get mg-popover identifier
-     * @returns {MgPopover['identifier']} generated mg-popover identifier
+     * @returns generated mg-popover identifier
      */
     this.getPopoverIdentifier = () => `${this.identifier}-popover`;
     /**
      * Condition to know if component should display a mg-popover
-     * @returns {boolean} truthy if component display popover
+     * @returns truthy if component display popover
      */
     this.displayPopover = () => this.isDirection(Direction.HORIZONTAL) && this.hasChildren && this.href === undefined;
     /************
@@ -144,8 +139,7 @@ const MgMenuItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
      ************/
     /**
      * Handle interacrtive element click
-     * @param {MouseEvent} event click on element
-     * @returns {void}
+     * @param event - click on element
      */
     this.handleElementCLick = (event) => {
       if ((this.hasChildren && !this.isInMainMenu) || this.status === Status.DISABLED) {
@@ -158,15 +152,14 @@ const MgMenuItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     /**
      * Handle popover element display-change event
-     * @param {CustomEvent} event popover display event
-     * @returns {void}
+     * @param event - popover display event
      */
     this.handlePopoverDisplay = (event) => {
       this.expanded = event.detail;
     };
     /**
      * Render slot
-     * @returns {HTMLElement} HTML Element
+     * @returns HTML Element
      */
     this.renderSlot = () => h("slot", null);
     this.identifier = createID('mg-menu-item');
@@ -232,7 +225,6 @@ const MgMenuItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   /**
    * Render popover clickoutside guard for content slot
-   * @returns {void}
    */
   updatePopoverGuard() {
     if (this.displayPopover())
@@ -245,7 +237,6 @@ const MgMenuItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
    *************/
   /**
    * Validate props
-   * @returns {void}
    */
   componentWillLoad() {
     // has children items that is NOT [slot='image' | 'information' | 'label' | 'metadata'] element
@@ -261,7 +252,7 @@ const MgMenuItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   /**
    * Check if component slots configuration
-   * @returns {ReturnType<typeof setTimeout>} timeout
+   * @returns timeout
    */
   componentDidLoad() {
     // validation
@@ -300,7 +291,7 @@ const MgMenuItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   /**
    * Render ineractive element
-   * @returns {HTMLElement} HTML Element
+   * @returns HTML Element
    */
   renderInteractiveElement() {
     const TagName = this.href !== undefined ? 'a' : 'button';
@@ -312,7 +303,7 @@ const MgMenuItem = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   /**
    * Render
-   * @returns {HTMLElement} HTML Element
+   * @returns HTML Element
    */
   render() {
     const getContainerClasses = () => ({