@mgdis/mg-components 6.2.0 → 6.4.0

package/dist/types/components.d.ts

@@ -8,7 +8,7 @@ import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
 import { MgActionMoreButtonType, MgActionMoreDividerType, MgActionMoreIconType, MgActionMoreItemType } from "./components/molecules/mg-action-more/mg-action-more.conf";
 import { VariantStyleType, VariantType } from "./components/molecules/mg-alert/mg-alert.conf";
 import { BadgeVariantType } from "./components/atoms/mg-badge/mg-badge.conf";
-import { ButtonType, VariantType as VariantType1 } from "./components/atoms/mg-button/mg-button.conf";
+import { ButtonType, SizeType, VariantType as VariantType1 } from "./components/atoms/mg-button/mg-button.conf";
 import { AriaRoleType, RequiredMessageStatusType } from "./components/molecules/mg-form/mg-form.conf";
 import { IconSizeType, IconType, IconVariantStyleType, IconVariantType } from "./components/atoms/mg-icon/mg-icon.conf";
 import { IllustratedMessageSizeType } from "./components/molecules/mg-illustrated-message/mg-illustrated-message.conf";
@@ -20,7 +20,7 @@ import { SelectOption } from "./components/molecules/inputs/mg-input-select/mg-i
 import { OptionType, TextType } from "./components/molecules/inputs/mg-input-text/mg-input-text.conf";
 import { IconType as IconType1 } from "./components";
 import { ToggleValue } from "./components/molecules/inputs/mg-input-toggle/mg-input-toggle.conf";
-import { IconType as IconType2, SizeType, SlotLabelType } from "./components/molecules/internals/mg-item-more/mg-item-more.conf";
+import { IconType as IconType2, SizeType as SizeType1, SlotLabelType } from "./components/molecules/internals/mg-item-more/mg-item-more.conf";
 import { DirectionType, ItemMoreType, MenuSizeType } from "./components/molecules/menu/mg-menu/mg-menu.conf";
 import { MgMenuStatusType, TargetType } from "./components/molecules/menu/mg-menu-item/mg-menu-item.conf";
 import { VariantStyleType as VariantStyleType1, VariantType as VariantType2 } from "./components/molecules/mg-message/mg-message.conf";
@@ -29,12 +29,12 @@ import { ExpandToggleDisplayType, TitlePositionType } from "./components/molecul
 import { Placement } from "@popperjs/core";
 import { AriaRoleType as AriaRoleType1 } from "./components/molecules/mg-progress/mg-progress.conf";
 import { SkipLink } from "./components/molecules/mg-skip-links/mg-skip-links.conf";
-import { SizeType as SizeType1, TabItem } from "./components/molecules/mg-tabs/mg-tabs.conf";
+import { SizeType as SizeType2, TabItem } from "./components/molecules/mg-tabs/mg-tabs.conf";
 import { TagVariantType } from "./components/atoms/mg-tag/mg-tag.conf";
 export { MgActionMoreButtonType, MgActionMoreDividerType, MgActionMoreIconType, MgActionMoreItemType } from "./components/molecules/mg-action-more/mg-action-more.conf";
 export { VariantStyleType, VariantType } from "./components/molecules/mg-alert/mg-alert.conf";
 export { BadgeVariantType } from "./components/atoms/mg-badge/mg-badge.conf";
-export { ButtonType, VariantType as VariantType1 } from "./components/atoms/mg-button/mg-button.conf";
+export { ButtonType, SizeType, VariantType as VariantType1 } from "./components/atoms/mg-button/mg-button.conf";
 export { AriaRoleType, RequiredMessageStatusType } from "./components/molecules/mg-form/mg-form.conf";
 export { IconSizeType, IconType, IconVariantStyleType, IconVariantType } from "./components/atoms/mg-icon/mg-icon.conf";
 export { IllustratedMessageSizeType } from "./components/molecules/mg-illustrated-message/mg-illustrated-message.conf";
@@ -46,7 +46,7 @@ export { SelectOption } from "./components/molecules/inputs/mg-input-select/mg-i
 export { OptionType, TextType } from "./components/molecules/inputs/mg-input-text/mg-input-text.conf";
 export { IconType as IconType1 } from "./components";
 export { ToggleValue } from "./components/molecules/inputs/mg-input-toggle/mg-input-toggle.conf";
-export { IconType as IconType2, SizeType, SlotLabelType } from "./components/molecules/internals/mg-item-more/mg-item-more.conf";
+export { IconType as IconType2, SizeType as SizeType1, SlotLabelType } from "./components/molecules/internals/mg-item-more/mg-item-more.conf";
 export { DirectionType, ItemMoreType, MenuSizeType } from "./components/molecules/menu/mg-menu/mg-menu.conf";
 export { MgMenuStatusType, TargetType } from "./components/molecules/menu/mg-menu-item/mg-menu-item.conf";
 export { VariantStyleType as VariantStyleType1, VariantType as VariantType2 } from "./components/molecules/mg-message/mg-message.conf";
@@ -55,7 +55,7 @@ export { ExpandToggleDisplayType, TitlePositionType } from "./components/molecul
 export { Placement } from "@popperjs/core";
 export { AriaRoleType as AriaRoleType1 } from "./components/molecules/mg-progress/mg-progress.conf";
 export { SkipLink } from "./components/molecules/mg-skip-links/mg-skip-links.conf";
-export { SizeType as SizeType1, TabItem } from "./components/molecules/mg-tabs/mg-tabs.conf";
+export { SizeType as SizeType2, TabItem } from "./components/molecules/mg-tabs/mg-tabs.conf";
 export { TagVariantType } from "./components/atoms/mg-tag/mg-tag.conf";
 export namespace Components {
     interface MgActionMore {
@@ -133,6 +133,10 @@ export namespace Components {
           * aria-label In case button text is not explicit enough
          */
         "label"?: string;
+        /**
+          * Define button size
+         */
+        "size": SizeType;
         /**
           * Define button type
          */
@@ -1193,7 +1197,7 @@ export namespace Components {
         /**
           * Define component child menu size.
          */
-        "size"?: SizeType;
+        "size"?: SizeType1;
         /**
           * Define slot label element
          */
@@ -1425,7 +1429,7 @@ export namespace Components {
         /**
           * Define tabs size
          */
-        "size": SizeType1;
+        "size": SizeType2;
     }
     interface MgTag {
         /**
@@ -1568,6 +1572,7 @@ declare global {
     interface HTMLMgAlertElementEventMap {
         "component-show": void;
         "component-hide": void;
+        "component-close": void;
     }
     interface HTMLMgAlertElement extends Components.MgAlert, HTMLStencilElement {
         addEventListener<K extends keyof HTMLMgAlertElementEventMap>(type: K, listener: (this: HTMLMgAlertElement, ev: MgAlertCustomEvent<HTMLMgAlertElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -1884,7 +1889,6 @@ declare global {
         new (): HTMLMgMenuElement;
     };
     interface HTMLMgMenuItemElementEventMap {
-        "status-change": HTMLMgMenuItemElement['status'];
         "item-loaded": void;
         "item-updated": void;
     }
@@ -1911,6 +1915,7 @@ declare global {
     interface HTMLMgModalElementEventMap {
         "component-show": void;
         "component-hide": void;
+        "component-close": void;
     }
     interface HTMLMgModalElement extends Components.MgModal, HTMLStencilElement {
         addEventListener<K extends keyof HTMLMgModalElementEventMap>(type: K, listener: (this: HTMLMgModalElement, ev: MgModalCustomEvent<HTMLMgModalElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -1963,6 +1968,7 @@ declare global {
     };
     interface HTMLMgPopoverElementEventMap {
         "display-change": HTMLMgPopoverElement['display'];
+        "component-close": void;
     }
     interface HTMLMgPopoverElement extends Components.MgPopover, HTMLStencilElement {
         addEventListener<K extends keyof HTMLMgPopoverElementEventMap>(type: K, listener: (this: HTMLMgPopoverElement, ev: MgPopoverCustomEvent<HTMLMgPopoverElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -2119,6 +2125,10 @@ declare namespace LocalJSX {
           * Add a delay to hide/close message when it passed Value is defined in seconds and must greater than 2 seconds
          */
         "delay"?: number;
+        /**
+          * Emmited event when alert is closed
+         */
+        "onComponent-close"?: (event: MgAlertCustomEvent<void>) => void;
         /**
           * Emited event when alert is hidden
          */
@@ -2183,6 +2193,10 @@ declare namespace LocalJSX {
           * Emmited event when disabled change
          */
         "onDisabled-change"?: (event: MgButtonCustomEvent<HTMLMgButtonElement['disabled']>) => void;
+        /**
+          * Define button size
+         */
+        "size"?: SizeType;
         /**
           * Define button type
          */
@@ -3197,7 +3211,7 @@ declare namespace LocalJSX {
         /**
           * Define component child menu size.
          */
-        "size"?: SizeType;
+        "size"?: SizeType1;
         /**
           * Define slot label element
          */
@@ -3252,10 +3266,6 @@ declare namespace LocalJSX {
           * Emited event when item is updated
          */
         "onItem-updated"?: (event: MgMenuItemCustomEvent<void>) => void;
-        /**
-          * Emited event when status change
-         */
-        "onStatus-change"?: (event: MgMenuItemCustomEvent<HTMLMgMenuItemElement['status']>) => void;
         /**
           * Define menu-item status.
          */
@@ -3292,6 +3302,10 @@ declare namespace LocalJSX {
           * Displayed modal title
          */
         "modalTitle": string;
+        /**
+          * Emmited event when modal is closed
+         */
+        "onComponent-close"?: (event: MgModalCustomEvent<void>) => void;
         /**
           * Emmited event when modal is hidden
          */
@@ -3402,6 +3416,10 @@ declare namespace LocalJSX {
           * Sets an `id` attribute. Needed by the input for accessibility `aria-decribedby`.
          */
         "identifier"?: string;
+        /**
+          * Emmited event when popover is closed
+         */
+        "onComponent-close"?: (event: MgPopoverCustomEvent<void>) => void;
         /**
           * Emited event when display value change
          */
@@ -3477,7 +3495,7 @@ declare namespace LocalJSX {
         /**
           * Define tabs size
          */
-        "size"?: SizeType1;
+        "size"?: SizeType2;
     }
     interface MgTag {
         /**

package/dist/types/utils/behaviors.utils.d.ts

@@ -1,15 +1,13 @@
-export declare const OverflowBehaviorElements: {
-    BASE_INDEX: string;
-    PROXY_INDEX: string;
-};
+/**
+ *
+ */
 export declare class OverflowBehavior {
-    private element;
-    private render;
+    private parentElement;
+    private itemMoreElement;
+    private itemMoreContainerElement;
     private _resizeObserver;
-    private _moreElement;
-    private _baseChildren;
-    private _proxyChildren;
-    constructor(element: Element, render: () => HTMLElement);
+    private _availableWidth;
+    constructor(parentElement: HTMLElement, itemMoreElement: HTMLElement, itemMoreContainerElement: HTMLElement);
     /**********
      * Public *
      **********/
@@ -21,49 +19,22 @@ export declare class OverflowBehavior {
      * Internal *
      ************/
     /**
-     * run overflow behavior
-     * @param width - width of the container. Optional.
-     */
-    private run;
-    /**
-     * Get interactive children filtred by authorized nodeName ['MG-MENU-ITEM', 'MG-BUTTON']
-     * @param element - element to parse
-     * @returns children
-     */
-    private getInteractiveItems;
-    /**
-     * Update displayed items in container from a given available space
-     * @param availableWidth - available width in container to display child items
+     * Utility method to know if element is HTMLMgItemMoreElement
+     * @param element - element to match with 'MORE' element
+     * @returns truthy if element is the 'MORE' element
      */
-    private updateDisplayedItems;
+    private isMoreElement;
     /**
      * Utility method to know if item overflow partialy or totaly in the container
      * @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
      */
     private isOverflowElement;
     /**
-     * Utility method to know if a given element is the 'MORE' element
-     * @param element - element to match with 'MORE' element
-     * @returns truthy if element is the 'MORE' element
-     */
-    private isMoreElement;
-    /**
-     * Toggle display item element
-     * @param item - item to control
-     * @param isHidden - is item hidden
+     * Toogle item from isHidden condition
+     * @param item - item to update
+     * @param isHidden - item is hidden
      */
     private toggleItem;
-    /**
-     * Toggle element's hide attribute
-     * @param element - element to toggle
-     * @param isHidden - element is hidden
-     */
-    private toggleElement;
-    /**
-     * Remove hidden attributes on all items
-     */
-    private restoreItems;
 }

package/ide/intellij/web-types.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://json.schemastore.org/web-types",
   "name": "@mgdis/mg-components",
-  "version": "6.2.0",
+  "version": "6.4.0",
   "description-markup": "markdown",
   "contributions": {
     "html": {
@@ -69,7 +69,7 @@
         },
         {
           "name": "mg-alert",
-          "description": "Attributes:\n- `delay`: Add a delay to hide/close message when it passed\nValue is defined in seconds and must greater than 2 seconds\n- `variant`: Define variant\n- `variant-style`: Define variant style\n\nEvents:\n- `component-hide`: Emited event when alert is hidden\n- `component-show`: Emited event when alert is diplayed\n\nSlots:\n- ``: Alert content\n- `actions`: Actions content\n\n",
+          "description": "Attributes:\n- `delay`: Add a delay to hide/close message when it passed\nValue is defined in seconds and must greater than 2 seconds\n- `variant`: Define variant\n- `variant-style`: Define variant style\n\nEvents:\n- `component-close`: Emmited event when alert is closed\n- `component-hide`: Emited event when alert is hidden\n- `component-show`: Emited event when alert is diplayed\n\nSlots:\n- ``: Alert content\n- `actions`: Actions content\n\n",
           "doc-url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/molecules-mg-alert--docs",
           "attributes": [
             {
@@ -131,6 +131,10 @@
               }
             ],
             "events": [
+              {
+                "name": "component-close",
+                "description": "Emmited event when alert is closed"
+              },
               {
                 "name": "component-hide",
                 "description": "Emited event when alert is hidden"
@@ -249,7 +253,7 @@
         },
         {
           "name": "mg-button",
-          "description": "Attributes:\n- `disable-on-click`: Option to set input disable on click, in order to prevent multi-click.\nParent component have to remove the attribute 'disabled' when the process ends.\n- `disabled`: Disable button\n- `form`: Define form id to attach button with.\nIf this attribute is not set, the `<button>` is associated with its ancestor `<form>` element.\n- `full-width`: Set button to full-width\n- `is-icon`: Define if button is round.\nUsed for icon button.\n- `label`: aria-label\nIn case button text is not explicit enough\n- `type`: Define button type\n- `variant`: Define button variant\n\nEvents:\n- `disabled-change`: Emmited event when disabled change\n\nSlots:\n- ``: Button content\n\n",
+          "description": "Attributes:\n- `disable-on-click`: Option to set input disable on click, in order to prevent multi-click.\nParent component have to remove the attribute 'disabled' when the process ends.\n- `disabled`: Disable button\n- `form`: Define form id to attach button with.\nIf this attribute is not set, the `<button>` is associated with its ancestor `<form>` element.\n- `full-width`: Set button to full-width\n- `is-icon`: Define if button is round.\nUsed for icon button.\n- `label`: aria-label\nIn case button text is not explicit enough\n- `size`: Define button size\n- `type`: Define button type\n- `variant`: Define button variant\n\nEvents:\n- `disabled-change`: Emmited event when disabled change\n\nSlots:\n- ``: Button content\n\n",
           "doc-url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/atoms-mg-button--docs",
           "attributes": [
             {
@@ -309,6 +313,16 @@
                 "required": false
               }
             },
+            {
+              "name": "size",
+              "description": "Define button size\n\nType: `\"large\" | \"medium\"`",
+              "doc-url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/atoms-mg-button--docs",
+              "value": {
+                "type": "\"large\" | \"medium\"",
+                "default": "sizes[0]",
+                "required": false
+              }
+            },
             {
               "name": "type",
               "description": "Define button type\n\nType: `\"button\" | \"reset\" | \"submit\"`",
@@ -388,6 +402,16 @@
                   "required": false
                 }
               },
+              {
+                "name": "size",
+                "description": "Define button size\n\nType: `\"large\" | \"medium\"`",
+                "doc-url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/atoms-mg-button--docs",
+                "value": {
+                  "type": "\"large\" | \"medium\"",
+                  "default": "sizes[0]",
+                  "required": false
+                }
+              },
               {
                 "name": "type",
                 "description": "Define button type\n\nType: `\"button\" | \"reset\" | \"submit\"`",
@@ -4863,7 +4887,7 @@
         },
         {
           "name": "mg-menu",
-          "description": "Attributes:\n- `direction`: Component display direction.\n- `label`: Menu label. Include short menu description.\nRequired to define accessibility required attribute `aria-label`\n- `size`: Define mg-menu size\n\nProperties:\n- `itemmore`: Customize \"mg-item-more\" element\nUsed with direction: 'vertical' to manage overflow\n\nSlots:\n- ``: Menu content\n\n",
+          "description": "Attributes:\n- `direction`: Component display direction.\n- `label`: Menu label. Include short menu description.\nRequired to define accessibility required attribute `aria-label`\n- `size`: Define mg-menu size\n\nProperties:\n- `itemmore`: Customize \"mg-item-more\" element\nUsed with direction: 'vertical' to manage overflow\n\nListeners:\n- `item-loaded`\n\nSlots:\n- ``: Menu content\n\n",
           "doc-url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/molecules-menu-mg-menu--docs",
           "attributes": [
             {
@@ -4950,7 +4974,7 @@
         },
         {
           "name": "mg-menu-item",
-          "description": "Attributes:\n- `expanded`: Define menu-item content expanded.\n- `href`: Define menu-item href\nwhen defined menu-item contain an anchor instead of button\n- `identifier`: Identifier is used to control mg-popover\n- `status`: Define menu-item status.\n- `target`: Define target type\n\nEvents:\n- `item-loaded`: Emited event when item is loaded\n- `item-updated`: Emited event when item is updated\n- `status-change`: Emited event when status change\n\nSlots:\n- ``: Menu item content\n- `image`: Menu item image content\n- `information`: Menu item information content\n- `label`: Menu item label content\n- `metadata`: Menu item metadata content\n\n",
+          "description": "Attributes:\n- `expanded`: Define menu-item content expanded.\n- `href`: Define menu-item href\nwhen defined menu-item contain an anchor instead of button\n- `identifier`: Identifier is used to control mg-popover\n- `status`: Define menu-item status.\n- `target`: Define target type\n\nEvents:\n- `item-loaded`: Emited event when item is loaded\n- `item-updated`: Emited event when item is updated\n\nSlots:\n- ``: Menu item content\n- `image`: Menu item image content\n- `information`: Menu item information content\n- `label`: Menu item label content\n- `metadata`: Menu item metadata content\n\n",
           "doc-url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/molecules-menu-mg-menu-item--docs",
           "attributes": [
             {
@@ -5061,10 +5085,6 @@
               {
                 "name": "item-updated",
                 "description": "Emited event when item is updated"
-              },
-              {
-                "name": "status-change",
-                "description": "Emited event when status change"
               }
             ]
           },
@@ -5147,7 +5167,7 @@
         },
         {
           "name": "mg-modal",
-          "description": "Attributes:\n- `close-button`: Define if modal has a cross button\n- `dialog-role`: Modal dialog role.\n- `identifier`: Identifier is used for the element ID (id is a reserved prop in Stencil.js)\nIf not set, it will be created.\n- `modal-title`: Displayed modal title\n- `open`: Define if modal is open\n\nEvents:\n- `component-hide`: Emmited event when modal is hidden\n- `component-show`: Emmited event when modal is diplayed\n\nSlots:\n- ``: Modal content\n- `actions`: Actions content\n\n",
+          "description": "Attributes:\n- `close-button`: Define if modal has a cross button\n- `dialog-role`: Modal dialog role.\n- `identifier`: Identifier is used for the element ID (id is a reserved prop in Stencil.js)\nIf not set, it will be created.\n- `modal-title`: Displayed modal title\n- `open`: Define if modal is open\n\nEvents:\n- `component-close`: Emmited event when modal is closed\n- `component-hide`: Emmited event when modal is hidden\n- `component-show`: Emmited event when modal is diplayed\n\nSlots:\n- ``: Modal content\n- `actions`: Actions content\n\n",
           "doc-url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/molecules-mg-modal--docs",
           "attributes": [
             {
@@ -5253,6 +5273,10 @@
               }
             ],
             "events": [
+              {
+                "name": "component-close",
+                "description": "Emmited event when modal is closed"
+              },
               {
                 "name": "component-hide",
                 "description": "Emmited event when modal is hidden"
@@ -5625,7 +5649,7 @@
         },
         {
           "name": "mg-popover",
-          "description": "Attributes:\n- `arrow-hide`: Hide popover arrow\n- `close-button`: Define if popover has a cross button\n- `disabled`: Disable popover\n- `display`: Display popover\n- `identifier`: Sets an `id` attribute.\nNeeded by the input for accessibility `aria-decribedby`.\n- `placement`: Popover placement\n\nEvents:\n- `display-change`: Emited event when display value change\n\nSlots:\n- ``: Element that will display the popover\n- `content`: popover content\n\n",
+          "description": "Attributes:\n- `arrow-hide`: Hide popover arrow\n- `close-button`: Define if popover has a cross button\n- `disabled`: Disable popover\n- `display`: Display popover\n- `identifier`: Sets an `id` attribute.\nNeeded by the input for accessibility `aria-decribedby`.\n- `placement`: Popover placement\n\nEvents:\n- `component-close`: Emmited event when popover is closed\n- `display-change`: Emited event when display value change\n\nSlots:\n- ``: Element that will display the popover\n- `content`: popover content\n\n",
           "doc-url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/molecules-mg-popover--docs",
           "attributes": [
             {
@@ -5753,6 +5777,10 @@
               }
             ],
             "events": [
+              {
+                "name": "component-close",
+                "description": "Emmited event when popover is closed"
+              },
               {
                 "name": "display-change",
                 "description": "Emited event when display value change"

package/ide/vscode/html-custom-data.json

@@ -75,7 +75,7 @@
     },
     {
       "name": "mg-alert",
-      "description": "Attributes:\n- `delay`: Add a delay to hide/close message when it passed\nValue is defined in seconds and must greater than 2 seconds\n- `variant`: Define variant\n- `variant-style`: Define variant style\n\nEvents:\n- `component-hide`: Emited event when alert is hidden\n- `component-show`: Emited event when alert is diplayed\n\nSlots:\n- ``: Alert content\n- `actions`: Actions content\n\n",
+      "description": "Attributes:\n- `delay`: Add a delay to hide/close message when it passed\nValue is defined in seconds and must greater than 2 seconds\n- `variant`: Define variant\n- `variant-style`: Define variant style\n\nEvents:\n- `component-close`: Emmited event when alert is closed\n- `component-hide`: Emited event when alert is hidden\n- `component-show`: Emited event when alert is diplayed\n\nSlots:\n- ``: Alert content\n- `actions`: Actions content\n\n",
       "attributes": [
         {
           "name": "delay",
@@ -250,7 +250,7 @@
     },
     {
       "name": "mg-button",
-      "description": "Attributes:\n- `disable-on-click`: Option to set input disable on click, in order to prevent multi-click.\nParent component have to remove the attribute 'disabled' when the process ends.\n- `disabled`: Disable button\n- `form`: Define form id to attach button with.\nIf this attribute is not set, the `<button>` is associated with its ancestor `<form>` element.\n- `full-width`: Set button to full-width\n- `is-icon`: Define if button is round.\nUsed for icon button.\n- `label`: aria-label\nIn case button text is not explicit enough\n- `type`: Define button type\n- `variant`: Define button variant\n\nEvents:\n- `disabled-change`: Emmited event when disabled change\n\nSlots:\n- ``: Button content\n\n",
+      "description": "Attributes:\n- `disable-on-click`: Option to set input disable on click, in order to prevent multi-click.\nParent component have to remove the attribute 'disabled' when the process ends.\n- `disabled`: Disable button\n- `form`: Define form id to attach button with.\nIf this attribute is not set, the `<button>` is associated with its ancestor `<form>` element.\n- `full-width`: Set button to full-width\n- `is-icon`: Define if button is round.\nUsed for icon button.\n- `label`: aria-label\nIn case button text is not explicit enough\n- `size`: Define button size\n- `type`: Define button type\n- `variant`: Define button variant\n\nEvents:\n- `disabled-change`: Emmited event when disabled change\n\nSlots:\n- ``: Button content\n\n",
       "attributes": [
         {
           "name": "disable-on-click",
@@ -336,6 +336,28 @@
             }
           ]
         },
+        {
+          "name": "size",
+          "description": "Define button size\n\nType: `\"large\" | \"medium\"`",
+          "values": [
+            {
+              "name": "large"
+            },
+            {
+              "name": "medium"
+            }
+          ],
+          "references": [
+            {
+              "name": "Storybook",
+              "url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/atoms-mg-button--docs"
+            },
+            {
+              "name": "Sources",
+              "url": "https://gitlab.mgdis.fr/core/core-ui/core-ui/-/tree/master/packages/mg-components/src/components/atoms/mg-button/mg-button.tsx"
+            }
+          ]
+        },
         {
           "name": "type",
           "description": "Define button type\n\nType: `\"button\" | \"reset\" | \"submit\"`",
@@ -5149,7 +5171,7 @@
     },
     {
       "name": "mg-menu",
-      "description": "Attributes:\n- `direction`: Component display direction.\n- `label`: Menu label. Include short menu description.\nRequired to define accessibility required attribute `aria-label`\n- `size`: Define mg-menu size\n\nProperties:\n- `itemmore`: Customize \"mg-item-more\" element\nUsed with direction: 'vertical' to manage overflow\n\nSlots:\n- ``: Menu content\n\n",
+      "description": "Attributes:\n- `direction`: Component display direction.\n- `label`: Menu label. Include short menu description.\nRequired to define accessibility required attribute `aria-label`\n- `size`: Define mg-menu size\n\nProperties:\n- `itemmore`: Customize \"mg-item-more\" element\nUsed with direction: 'vertical' to manage overflow\n\nListeners:\n- `item-loaded`\n\nSlots:\n- ``: Menu content\n\n",
       "attributes": [
         {
           "name": "direction",
@@ -5240,7 +5262,7 @@
     },
     {
       "name": "mg-menu-item",
-      "description": "Attributes:\n- `expanded`: Define menu-item content expanded.\n- `href`: Define menu-item href\nwhen defined menu-item contain an anchor instead of button\n- `identifier`: Identifier is used to control mg-popover\n- `status`: Define menu-item status.\n- `target`: Define target type\n\nEvents:\n- `item-loaded`: Emited event when item is loaded\n- `item-updated`: Emited event when item is updated\n- `status-change`: Emited event when status change\n\nSlots:\n- ``: Menu item content\n- `image`: Menu item image content\n- `information`: Menu item information content\n- `label`: Menu item label content\n- `metadata`: Menu item metadata content\n\n",
+      "description": "Attributes:\n- `expanded`: Define menu-item content expanded.\n- `href`: Define menu-item href\nwhen defined menu-item contain an anchor instead of button\n- `identifier`: Identifier is used to control mg-popover\n- `status`: Define menu-item status.\n- `target`: Define target type\n\nEvents:\n- `item-loaded`: Emited event when item is loaded\n- `item-updated`: Emited event when item is updated\n\nSlots:\n- ``: Menu item content\n- `image`: Menu item image content\n- `information`: Menu item information content\n- `label`: Menu item label content\n- `metadata`: Menu item metadata content\n\n",
       "attributes": [
         {
           "name": "expanded",
@@ -5420,7 +5442,7 @@
     },
     {
       "name": "mg-modal",
-      "description": "Attributes:\n- `close-button`: Define if modal has a cross button\n- `dialog-role`: Modal dialog role.\n- `identifier`: Identifier is used for the element ID (id is a reserved prop in Stencil.js)\nIf not set, it will be created.\n- `modal-title`: Displayed modal title\n- `open`: Define if modal is open\n\nEvents:\n- `component-hide`: Emmited event when modal is hidden\n- `component-show`: Emmited event when modal is diplayed\n\nSlots:\n- ``: Modal content\n- `actions`: Actions content\n\n",
+      "description": "Attributes:\n- `close-button`: Define if modal has a cross button\n- `dialog-role`: Modal dialog role.\n- `identifier`: Identifier is used for the element ID (id is a reserved prop in Stencil.js)\nIf not set, it will be created.\n- `modal-title`: Displayed modal title\n- `open`: Define if modal is open\n\nEvents:\n- `component-close`: Emmited event when modal is closed\n- `component-hide`: Emmited event when modal is hidden\n- `component-show`: Emmited event when modal is diplayed\n\nSlots:\n- ``: Modal content\n- `actions`: Actions content\n\n",
       "attributes": [
         {
           "name": "close-button",
@@ -5772,7 +5794,7 @@
     },
     {
       "name": "mg-popover",
-      "description": "Attributes:\n- `arrow-hide`: Hide popover arrow\n- `close-button`: Define if popover has a cross button\n- `disabled`: Disable popover\n- `display`: Display popover\n- `identifier`: Sets an `id` attribute.\nNeeded by the input for accessibility `aria-decribedby`.\n- `placement`: Popover placement\n\nEvents:\n- `display-change`: Emited event when display value change\n\nSlots:\n- ``: Element that will display the popover\n- `content`: popover content\n\n",
+      "description": "Attributes:\n- `arrow-hide`: Hide popover arrow\n- `close-button`: Define if popover has a cross button\n- `disabled`: Disable popover\n- `display`: Display popover\n- `identifier`: Sets an `id` attribute.\nNeeded by the input for accessibility `aria-decribedby`.\n- `placement`: Popover placement\n\nEvents:\n- `component-close`: Emmited event when popover is closed\n- `display-change`: Emited event when display value change\n\nSlots:\n- ``: Element that will display the popover\n- `content`: popover content\n\n",
       "attributes": [
         {
           "name": "arrow-hide",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mgdis/mg-components",
-  "version": "6.2.0",
+  "version": "6.4.0",
   "description": "MG Components",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
@@ -34,56 +34,46 @@
   },
   "dependencies": {
     "@popperjs/core": "2.11.8",
-    "@stencil/core": "4.22.2",
-    "@mgdis/img": "2.1.1",
-    "@mgdis/stencil-helpers": "2.2.0",
-    "@mgdis/styles": "2.1.0"
+    "@stencil/core": "4.23.2",
+    "@mgdis/img": "2.1.2",
+    "@mgdis/styles": "2.2.1",
+    "@mgdis/stencil-helpers": "2.2.2"
   },
   "devDependencies": {
-    "@playwright/test": "1.48.2",
-    "@storybook/addon-a11y": "8.4.4",
-    "@storybook/addon-actions": "8.4.4",
-    "@storybook/addon-essentials": "8.4.4",
-    "@storybook/addon-interactions": "8.4.4",
-    "@storybook/addon-links": "8.4.4",
-    "@storybook/blocks": "8.4.4",
-    "@storybook/html": "8.4.4",
-    "@storybook/html-vite": "8.4.4",
-    "@storybook/manager-api": "8.4.4",
-    "@storybook/testing-library": "0.2.2",
+    "@playwright/test": "1.49.1",
+    "@storybook/addon-a11y": "8.5.0",
+    "@storybook/addon-actions": "8.5.0",
+    "@storybook/addon-essentials": "8.5.0",
+    "@storybook/addon-interactions": "8.5.0",
+    "@storybook/addon-links": "8.5.0",
+    "@storybook/blocks": "8.5.0",
+    "@storybook/html": "8.5.0",
+    "@storybook/html-vite": "8.5.0",
+    "@storybook/manager-api": "8.5.0",
+    "@storybook/theming": "8.5.0",
     "@types/jest": "29.5.14",
-    "@types/node": "20.17.6",
-    "chromatic": "11.18.1",
+    "@types/node": "22.10.7",
+    "chromatic": "11.25.0",
     "eslint": "8.57.1",
-    "eslint-plugin-storybook": "0.11.0",
+    "eslint-plugin-storybook": "0.11.2",
     "jest": "29.7.0",
     "jest-cli": "29.7.0",
     "jest-junit": "16.0.0",
     "jest-transform-stub": "2.0.0",
-    "prettier": "3.3.3",
-    "puppeteer": "23.8.0",
-    "sass": "1.81.0",
-    "storybook": "8.4.4",
-    "ts-node": "10.9.2",
-    "typescript": "5.6.3",
-    "vite": "5.4.11",
-    "@core-ui/eslint-config-stencil": "1.2.2",
-    "@core-ui/jest-config": "1.0.8",
-    "@core-ui/tsconfig": "1.0.4",
-    "@mgdis/linting-stencil": "1.3.2",
-    "@mgdis/playwright-helpers": "1.0.10"
+    "react": "18.3.1",
+    "sass": "1.83.4",
+    "storybook": "8.5.0",
+    "typescript": "5.7.3",
+    "vite": "6.0.9",
+    "@core-ui/jest-config": "1.0.9",
+    "@mgdis/linting-stencil": "1.3.3",
+    "@mgdis/playwright-helpers": "1.0.11"
   },
   "license": "BSD-3-Clause",
   "scripts": {
     "prebuild": "node ./bin/build-icons",
     "build": "pnpm prebuild && stencil build --docs",
     "start": "pnpm prebuild && stencil build --dev --watch --serve",
-    "lint": "pnpm lint:es && pnpm lint:prettier",
-    "lint:fix": "pnpm lint:es:fix && pnpm lint:prettier:fix",
-    "lint:es": "eslint 'src/**/*.{ts,tsx}'",
-    "lint:es:fix": "eslint 'src/**/*.{ts,tsx}' --fix",
-    "lint:prettier": "prettier --check '**/*.{ts,tsx,html,mdx,json}'",
-    "lint:prettier:fix": "prettier --write '**/*.{ts,tsx,html,mdx,json}'",
     "test": "TZ=UTC stencil test --spec --e2e",
     "test:unit": "TZ=UTC stencil test --spec --collectCoverage",
     "test:e2e": "pnpm --package=@pnpm/@playwright/test dlx playwright test",