@mgdis/mg-components 5.10.0 → 5.10.1

package/dist/components/mg-menu2.js

@@ -19,9 +19,8 @@ const MgMenu = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
      *************/
     /**
      * Close matching menu-item
-     * @param {HTMLElement} item menu-item to close
-     * @param {boolean} condition addionnal condition
-     * @returns {void}
+     * @param item - menu-item to close
+     * @param condition - addionnal condition
      */
     this.closeMenuItem = (item, condition) => {
       if (!this.isChildMenu && condition) {
@@ -30,19 +29,18 @@ const MgMenu = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     /**
      * get mg-item-more element
-     * @returns {HTMLMgItemMoreElement} mg-item-more element
+     * @returns mg-item-more element
      */
     this.getItemMore = () => this.element.querySelector('mg-item-more');
     /**
-     * get mg-item-more >>> mg-menu-item element
-     * @returns {HTMLMgMenuItemElement} mg-item-more >>> mg-menu-item element
+     * get mg-item-more child mg-menu-item element
+     * @returns mg-menu-item element
      */
     this.getItemMoreMenuItem = () => { var _a, _b; return (_b = (_a = this.getItemMore()) === null || _a === void 0 ? void 0 : _a.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('mg-menu-item'); };
     /**
      * Set item listend
-     * @param {HTMLMgMenuItemElement} item mg-menu-item element
-     * @param {MgMenu['focusedMenuItem']} index number
-     * @returns {void}
+     * @param item - mg-menu-item element
+     * @param index - number
      */
     this.setItemListener = (item, index) => {
       ['click', 'focus'].forEach(trigger => {
@@ -57,7 +55,6 @@ const MgMenu = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     /**
      * Store menu-items on component init and add listeners
-     * @returns {void}
      */
     this.initMenuItemsListeners = () => {
       // add listeners on menu item and edit index
@@ -67,14 +64,12 @@ const MgMenu = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     /**
      * Handle item-loaded event on mg-item-more element
-     * @returns {void}
      */
     this.handleItemLoaded = () => {
       this.setItemListener(this.getItemMoreMenuItem(), this.menuItems.length);
     };
     /**
      * render mg-item-more
-     * @returns {void}
      */
     this.renderMgItemMore = () => {
       // /!\ externalise item tag name to get a string type and bypass type checking when value is used in next createElement
@@ -116,7 +111,6 @@ const MgMenu = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
    *************/
   /**
    * Validate props
-   * @returns {void}
    */
   componentWillLoad() {
     this.validateDirection(this.direction);
@@ -126,7 +120,7 @@ const MgMenu = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   /**
    * Check if component slots configuration
-   * @returns {ReturnType<typeof setTimeout>} timeout
+   * @returns timeout
    */
   componentDidLoad() {
     // update props and states after componentDidLoad hook
@@ -156,14 +150,13 @@ const MgMenu = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   /**
    * Add listeners to items
-   * @returns {void}
    */
   componentDidRender() {
     this.initMenuItemsListeners();
   }
   /**
    * Render
-   * @returns {HTMLElement} HTML Element
+   * @returns HTML Element
    */
   render() {
     return (h(Host, { role: this.isChildMenu ? 'menu' : 'menubar', "aria-label": this.label }, h("slot", null)));

package/dist/components/mg-message.js

@@ -33,22 +33,19 @@ const MgMessage$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.isHovered = false;
     /**
      * Set timer
-     * @returns {void}
      */
     this.setTimer = () => {
       this.storedTimer = setTimeout(() => (this.hide = true), this.delay * 1000);
     };
     /**
      * Clear timer
-     * @returns {void}
      */
     this.clearTimer = () => {
       clearTimeout(this.storedTimer);
     };
     /**
      * Event to add on element
-     * @param {MouseEvent | FocusEvent} event  event
-     * @returns {void}
+     * @param event - event
      */
     this.timerEvents = (event) => {
       this.clearTimer();
@@ -71,7 +68,7 @@ const MgMessage$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     /**
      * Get icon corresponding to variant
-     * @returns {MgIcon['icon'] | undefined} icon
+     * @returns icon
      */
     this.getIcon = () => {
       switch (this.variant) {
@@ -90,7 +87,7 @@ const MgMessage$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.variant = variants[0];
     this.closeButton = false;
     this.hide = false;
-    this.classList = new ClassList(['mg-message']);
+    this.classCollection = new ClassList(['mg-message']);
     this.hasActions = false;
   }
   validateDelay(newValue) {
@@ -104,9 +101,9 @@ const MgMessage$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     }
     else {
       if (oldValue !== undefined) {
-        this.classList.delete(`mg-message--${oldValue}`);
+        this.classCollection.delete(`mg-message--${oldValue}`);
       }
-      this.classList.add(`mg-message--${newValue}`);
+      this.classCollection.add(`mg-message--${newValue}`);
     }
   }
   validateCloseButton(newValue) {
@@ -118,7 +115,7 @@ const MgMessage$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   validateHide(newValue) {
     if (newValue) {
       this.componentHide.emit();
-      this.classList.add(this.classHide);
+      this.classCollection.add(this.classHide);
       // Remove event Listener
       ['focusin', 'mouseenter'].forEach(event => {
         this.element.removeEventListener(event, this.timerEvents);
@@ -128,7 +125,7 @@ const MgMessage$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     }
     else {
       this.componentShow.emit();
-      this.classList.delete(this.classHide);
+      this.classCollection.delete(this.classHide);
       // If delay is set
       if (this.delay > 1) {
         // Start timer
@@ -155,7 +152,7 @@ const MgMessage$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.hasActions = this.element.querySelector('[slot="actions"]') !== null;
     this.validateCloseButton(this.closeButton);
     if (this.closeButton) {
-      this.classList.add('mg-message--close-button');
+      this.classCollection.add('mg-message--close-button');
       this.closeButtonId = `${this.identifier}-close-button`;
     }
     this.validateDelay(this.delay);
@@ -163,10 +160,10 @@ const MgMessage$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   /**
    * Render
-   * @returns {HTMLElement} HTML Element
+   * @returns HTML Element
    */
   render() {
-    return (h("div", { id: this.identifier, class: this.classList.join(), role: this.variant === 'info' ? 'status' : 'alert' }, h("mg-card", { variant: this.variant, "variant-style": "bar-left" }, h("span", { class: "mg-message__icon" }, h("mg-icon", { icon: this.getIcon() })), h("div", { class: "mg-message__content" }, h("span", { class: "mg-message__content-slot" }, h("slot", null)), this.hasActions && h("span", { class: "mg-message__content-separator" }), this.hasActions && (h("span", { class: "mg-message__content-actions-slot" }, h("slot", { name: "actions" })))), this.closeButton && (h("span", { class: "mg-message__close-button" }, h("mg-button", { identifier: this.closeButtonId, "is-icon": true, variant: "flat", label: this.messages.message.closeButton, onClick: this.handleClose }, h("mg-icon", { icon: "cross" })))))));
+    return (h("div", { id: this.identifier, class: this.classCollection.join(), role: this.variant === 'info' ? 'status' : 'alert' }, h("mg-card", { variant: this.variant, "variant-style": "bar-left" }, h("span", { class: "mg-message__icon" }, h("mg-icon", { icon: this.getIcon() })), h("div", { class: "mg-message__content" }, h("span", { class: "mg-message__content-slot" }, h("slot", null)), this.hasActions && h("span", { class: "mg-message__content-separator" }), this.hasActions && (h("span", { class: "mg-message__content-actions-slot" }, h("slot", { name: "actions" })))), this.closeButton && (h("span", { class: "mg-message__close-button" }, h("mg-button", { identifier: this.closeButtonId, "is-icon": true, variant: "flat", label: this.messages.message.closeButton, onClick: this.handleClose }, h("mg-icon", { icon: "cross" })))))));
   }
   get element() { return this; }
   static get watchers() { return {
@@ -182,7 +179,7 @@ const MgMessage$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     "variant": [1],
     "closeButton": [1028, "close-button"],
     "hide": [1028],
-    "classList": [32],
+    "classCollection": [32],
     "hasActions": [32]
   }]);
 function defineCustomElement$1() {

package/dist/components/mg-modal.js

@@ -55,7 +55,6 @@ const MgModal$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
      *************/
     /**
      * Handle close button
-     * @returns {void}
      */
     this.handleClose = () => {
       this.hide = true;
@@ -66,7 +65,7 @@ const MgModal$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.hide = false;
     this.hasActions = false;
     this.hasContent = false;
-    this.classList = new ClassList(['mg-modal']);
+    this.classCollection = new ClassList(['mg-modal']);
   }
   validateModalTitle(newValue) {
     if (typeof newValue !== 'string' || newValue.trim() === '') {
@@ -76,19 +75,18 @@ const MgModal$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   validateHide(newValue) {
     if (newValue) {
       this.componentHide.emit();
-      this.classList.add(this.classHide);
+      this.classCollection.add(this.classHide);
       document.body.style.overflow = this.bodyOverflow;
     }
     else {
       this.componentShow.emit();
-      this.classList.delete(this.classHide);
+      this.classCollection.delete(this.classHide);
       document.body.style.overflow = 'hidden';
     }
   }
   /**
    * Handle 'escape' key down
-   * @param {KeyboardEvent} event keydown event
-   * @returns {void}
+   * @param event - keydown event
    */
   handleKeyDown(event) {
     // we can use 'Escape button" when this not a blocking modal, induced by closeButton value.
@@ -101,7 +99,6 @@ const MgModal$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
    *************/
   /**
    * Check if component props are well configured on init
-   * @returns {void}
    */
   componentWillLoad() {
     // Store body overflow
@@ -120,7 +117,6 @@ const MgModal$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   /**
    * Add observer on component to set focus when displayed
-   * @returns {void}
    */
   componentDidLoad() {
     new MutationObserver(mutationList => {
@@ -135,10 +131,10 @@ const MgModal$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   /**
    * Render
-   * @returns {HTMLElement} HTML Element
+   * @returns HTML Element
    */
   render() {
-    return (h("div", { role: "alertdialog", id: this.identifier, class: this.classList.join(), tabindex: "-1", "aria-labelledby": this.titleId, "aria-modal": "true", "aria-hidden": this.hide }, h("mg-card", null, h("div", { class: "mg-modal__dialog" }, h("header", { class: "mg-modal__header" }, this.closeButton && (h("span", { class: "mg-modal__close-button" }, h("mg-button", { identifier: this.closeButtonId, "is-icon": true, variant: "flat", label: this.messages.modal.closeButton, onClick: this.handleClose }, h("mg-icon", { icon: "cross" })))), h("h1", { class: "mg-modal__title", id: this.titleId }, this.modalTitle)), this.hasContent && (h("article", { class: "mg-modal__content" }, h("slot", { name: "content" }))), this.hasActions && (h("footer", { class: "mg-modal__footer" }, h("slot", { name: "actions" })))))));
+    return (h("div", { role: "alertdialog", id: this.identifier, class: this.classCollection.join(), tabindex: "-1", "aria-labelledby": this.titleId, "aria-modal": "true", "aria-hidden": this.hide }, h("mg-card", null, h("div", { class: "mg-modal__dialog" }, h("header", { class: "mg-modal__header" }, this.closeButton && (h("span", { class: "mg-modal__close-button" }, h("mg-button", { identifier: this.closeButtonId, "is-icon": true, variant: "flat", label: this.messages.modal.closeButton, onClick: this.handleClose }, h("mg-icon", { icon: "cross" })))), h("h1", { class: "mg-modal__title", id: this.titleId }, this.modalTitle)), this.hasContent && (h("article", { class: "mg-modal__content" }, h("slot", { name: "content" }))), this.hasActions && (h("footer", { class: "mg-modal__footer" }, h("slot", { name: "actions" })))))));
   }
   get element() { return this; }
   static get watchers() { return {
@@ -153,7 +149,7 @@ const MgModal$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     "hide": [1028],
     "hasActions": [32],
     "hasContent": [32],
-    "classList": [32]
+    "classCollection": [32]
   }, [[8, "keydown", "handleKeyDown"]]]);
 function defineCustomElement$1() {
   if (typeof customElements === "undefined") {

package/dist/components/mg-pagination.js

@@ -18,6 +18,7 @@ const mgPaginationCss = ".sr-only{border:0 !important;clip:rect(1px, 1px, 1px, 1
 /**
  * Range generator
  *
+ * ```
  * start by get the range length, add "+ 1" to include last value, ex: Math.ceil((3 + 1 - 1) / 1) => 3
  * then with Array(Math.ceil...) we get the final array with empty values, ex: Array(Math.ceil(2 + 1 - 1) / 1)) => [empty, empty, empty]
  * then with Array(Math.ceil...).keys() we get the Array Iterator from empty values
@@ -25,14 +26,15 @@ const mgPaginationCss = ".sr-only{border:0 !important;clip:rect(1px, 1px, 1px, 1
  * ex: Array.from(Array(Math.ceil((2 + 1 - 1) / 1) || 1).keys()) => [0, 1, 2]
  * finaly we map values from "start" range and apply the "step" coefficiant,
  * ex: Array.from(Array(Math.ceil((2 + 1 - 1) / 1) || 1).keys()).map(x => 1 + x * 1) => [1, 2, 3]
+ * ```
  *
  * range(1, 1) = [1]
  * range(1, 5) = [1, 2, 3, 4, 5]
  * range(10, 20, 2) = [10, 12, 14, 16, 18, 20]
- * @param {number} start start range
- * @param {number} end start end
- * @param {number} step step size
- * @returns {number[]} range numbers
+ * @param start - start range
+ * @param end - start end
+ * @param step - step size
+ * @returns range numbers
  */
 const range = (start, end, step = 1) => Array.from(Array(Math.ceil((end + 1 - start) / step)).keys()).map(x => start + x * step);
 const MgPagination$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
@@ -43,8 +45,7 @@ const MgPagination$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElemen
     this.currentPageChange = createEvent(this, "current-page-change", 7);
     /**
      * Change current page from target
-     * @param {number} target target page
-     * @returns {void}
+     * @param target - target page
      */
     this.goToPage = (target) => {
       this.currentPage = target;
@@ -54,8 +55,7 @@ const MgPagination$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElemen
      ************/
     /**
      * select handler
-     * @param {InputEvent} event value change event
-     * @returns {void}
+     * @param event - value change event
      */
     this.handleSelect = (event) => {
       const to = Number(event.target.value);
@@ -63,9 +63,8 @@ const MgPagination$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElemen
     };
     /**
      * Go to 'previous/next' page button handler
-     * @param {string} action navigation action
-     * @param {boolean} disabled button disable state
-     * @returns {void}
+     * @param action - navigation action
+     * @param disabled - button disable state
      */
     this.handleGoToPage = (action, disabled) => {
       !disabled && this.goToPage(action === NavigationAction.NEXT ? this.currentPage + 1 : this.currentPage - 1);
@@ -95,7 +94,6 @@ const MgPagination$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElemen
    *************/
   /**
    * Check if props are well configured on init
-   * @returns {void}
    */
   componentWillLoad() {
     // Get locales
@@ -110,7 +108,7 @@ const MgPagination$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElemen
   }
   /**
    * Render
-   * @returns {HTMLElement} HTML Element
+   * @returns HTML Element
    */
   render() {
     const navigationActionButton = (disabled, action) => (h("mg-button", { identifier: `${this.identifier}-button-${action}`, label: this.messages.pagination[`${action}Page`],

package/dist/components/mg-panel.js

@@ -23,7 +23,6 @@ const MgPanel$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
      ************/
     /**
      * Toggle is editing state
-     * @returns {void}
      */
     this.toggleIsEditing = () => {
       this.isEditing = !this.isEditing;
@@ -33,7 +32,6 @@ const MgPanel$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
      ************/
     /**
      * Collapse button click handler
-     * @returns {void}
      */
     this.handleCollapseButton = () => {
       if (!this.expandToggleDisabled) {
@@ -42,22 +40,19 @@ const MgPanel$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     /**
      * Edit button click handler
-     * @returns {void}
      */
     this.handleEditButton = () => {
       this.toggleIsEditing();
     };
     /**
      * Update title handler
-     * @param {CustomEvent<string>} event input value change event
-     * @returns {void}
+     * @param event - input value change event
      */
     this.handleUpdateTitle = (event) => {
       this.updatedPanelTitle = event.detail;
     };
     /**
      * Cancel edition button handler
-     * @returns {void}
      */
     this.handleCancelEditButton = () => {
       this.updatedPanelTitle = undefined;
@@ -65,7 +60,6 @@ const MgPanel$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     /**
      * Validate edition button handler
-     * @returns {void}
      */
     this.handleValidateEditButton = () => {
       if (this.editInputElement.valid) {
@@ -76,8 +70,7 @@ const MgPanel$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     /**
      * Header left conditional render
-     * @typedef {HTMLElement} HTMLMgButtonElement
-     * @returns {HTMLMgButtonElement | HTMLElement | HTMLElement[]} header left element
+     * @returns header left element
      */
     this.headerLeft = () => {
       const collapseButton = () => (h("mg-button", { onClick: this.handleCollapseButton, variant: "flat", identifier: `${this.identifier}-collapse-button`, "aria-expanded": this.expanded !== undefined && this.expanded.toString(), "aria-controls": `${this.identifier}-content`, disabled: this.expandToggleDisabled }, h("span", { class: "mg-panel__collapse-button-content" }, h("mg-icon", { icon: this.expanded ? 'chevron-up' : 'chevron-down' }), !this.isEditing && this.panelTitle)));
@@ -102,7 +95,7 @@ const MgPanel$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.expanded = false;
     this.expandToggleDisabled = undefined;
     this.titleEditable = false;
-    this.classList = new ClassList(['mg-panel']);
+    this.classCollection = new ClassList(['mg-panel']);
     this.isEditing = false;
     this.updatedPanelTitle = undefined;
   }
@@ -128,7 +121,6 @@ const MgPanel$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
    *************/
   /**
    * Check if props are well configured on init
-   * @returns {void}
    */
   componentWillLoad() {
     // Get locales
@@ -139,7 +131,6 @@ const MgPanel$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   /**
    * Edit DOM after render
-   * @returns {void}
    */
   componentDidRender() {
     // when we are editing we get focus on edition input
@@ -149,10 +140,10 @@ const MgPanel$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   /**
    * Render component
-   * @returns {HTMLElement} html element
+   * @returns html element
    */
   render() {
-    return (h("section", { class: this.classList.join(), id: this.identifier }, h("mg-card", null, h("header", { class: "mg-panel__header", id: `${this.identifier}-header` }, h("div", { class: `mg-panel__header-left ${this.isEditing ? 'mg-panel__header-left--full' : ''}` }, this.headerLeft()), h("div", { class: "mg-panel__header-right" }, h("slot", { name: "header-right" }))), h("article", { class: "mg-panel__content", id: `${this.identifier}-content`, "aria-labelledby": `${this.identifier}-header`, hidden: !this.expanded }, h("slot", null)))));
+    return (h("section", { class: this.classCollection.join(), id: this.identifier }, h("mg-card", null, h("header", { class: "mg-panel__header", id: `${this.identifier}-header` }, h("div", { class: `mg-panel__header-left ${this.isEditing ? 'mg-panel__header-left--full' : ''}` }, this.headerLeft()), h("div", { class: "mg-panel__header-right" }, h("slot", { name: "header-right" }))), h("article", { class: "mg-panel__content", id: `${this.identifier}-content`, "aria-labelledby": `${this.identifier}-header`, hidden: !this.expanded }, h("slot", null)))));
   }
   get element() { return this; }
   static get watchers() { return {
@@ -169,7 +160,7 @@ const MgPanel$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     "expanded": [1028],
     "expandToggleDisabled": [4, "expand-toggle-disabled"],
     "titleEditable": [4, "title-editable"],
-    "classList": [32],
+    "classCollection": [32],
     "isEditing": [32],
     "updatedPanelTitle": [32]
   }]);

package/dist/components/mg-popover2.js

@@ -19,8 +19,7 @@ const MgPopover = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.classArrowHide = `mg-popover--arrow-hide`;
     /**
      * Check if clicked outside of component
-     * @param {MouseEvent} event mouse event
-     * @returns {void}
+     * @param event - mouse event
      */
     this.clickOutside = (event) => {
       var _a;
@@ -32,7 +31,6 @@ const MgPopover = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     /**
      * Show popover
-     * @returns {void}
      */
     this.show = () => {
       // Make the popover visible
@@ -51,7 +49,6 @@ const MgPopover = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     /**
      * Hide popover
-     * @returns {void}
      */
     this.hide = () => {
       // Hide the popover
@@ -65,7 +62,6 @@ const MgPopover = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
     /**
      * Handle action for close button
-     * @returns {void}
      */
     this.handleCloseButton = () => {
       this.display = false;
@@ -76,13 +72,13 @@ const MgPopover = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.closeButton = false;
     this.display = false;
     this.disabled = false;
-    this.classList = new ClassList(['mg-popover']);
+    this.classCollection = new ClassList(['mg-popover']);
   }
   validateArrowHide(newValue) {
     if (newValue)
-      this.classList.add(this.classArrowHide);
+      this.classCollection.add(this.classArrowHide);
     else
-      this.classList.delete(this.classArrowHide);
+      this.classCollection.delete(this.classArrowHide);
   }
   handleDisplay(newValue) {
     if (newValue) {
@@ -98,7 +94,6 @@ const MgPopover = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
    *************/
   /**
    * Check if component props are well configured on init
-   * @returns {void} timeout
    */
   componentWillLoad() {
     // Get windows to attach events
@@ -109,7 +104,6 @@ const MgPopover = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   /**
    * Check if component props are well configured on init
-   * @returns {void}
    */
   componentDidLoad() {
     const headingTags = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];
@@ -166,10 +160,10 @@ const MgPopover = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   }
   /**
    * Render
-   * @returns {HTMLElement} HTML Element
+   * @returns HTML Element
    */
   render() {
-    return (h(Host, null, h("slot", null), h("div", { id: this.identifier, class: this.classList.join() }, h("mg-card", null, this.closeButton && (h("mg-button", { identifier: this.closeButtonId, "is-icon": true, variant: "flat", label: this.messages.general.close, onClick: this.handleCloseButton }, h("mg-icon", { icon: "cross" }))), h("div", { class: "mg-popover__title" }, h("slot", { name: "title" })), h("slot", { name: "content" })), !this.arrowHide && h("div", { class: "mg-popover__arrow", "data-popper-arrow": true }))));
+    return (h(Host, null, h("slot", null), h("div", { id: this.identifier, class: this.classCollection.join() }, h("mg-card", null, this.closeButton && (h("mg-button", { identifier: this.closeButtonId, "is-icon": true, variant: "flat", label: this.messages.general.close, onClick: this.handleCloseButton }, h("mg-icon", { icon: "cross" }))), h("div", { class: "mg-popover__title" }, h("slot", { name: "title" })), h("slot", { name: "content" })), !this.arrowHide && h("div", { class: "mg-popover__arrow", "data-popper-arrow": true }))));
   }
   get element() { return this; }
   static get watchers() { return {
@@ -184,7 +178,7 @@ const MgPopover = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     "closeButton": [4, "close-button"],
     "display": [1028],
     "disabled": [4],
-    "classList": [32]
+    "classCollection": [32]
   }]);
 function defineCustomElement() {
   if (typeof customElements === "undefined") {

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

@@ -14,8 +14,7 @@ const MgSkipLinks$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
      **********/
     /**
      * Handle link click and emit go-to-anchor event
-     * @param {MouseEvent} event mouse event
-     * @returns {void}
+     * @param event - mouse event
      */
     this.handleLinkCLick = (event) => {
       event.currentTarget.blur();
@@ -35,7 +34,6 @@ const MgSkipLinks$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
    *************/
   /**
    * Check if props are well configured on init
-   * @returns {void}
    */
   componentWillLoad() {
     this.validateLinks(this.links);
@@ -43,7 +41,7 @@ const MgSkipLinks$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
   }
   /**
    * Render
-   * @returns {HTMLElement} HTML Element
+   * @returns HTML Element
    */
   render() {
     return (h("nav", { class: "mg-skip-links", role: "navigation", "aria-label": this.messages.skipLinks.navLabel }, h("ul", { class: "mg-skip-links__list", role: "list" }, this.links.map(link => (h("li", { key: link.href }, h("a", { class: "mg-skip-links__link", href: link.href, onClick: this.handleLinkCLick }, link.label)))))));