@mgdis/mg-components 6.15.0 → 6.17.0

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

@@ -3,7 +3,7 @@
   "tags": [
     {
       "name": "mg-action-more",
-      "description": "Attributes:\n- `button`: Define button properties\n- `display-chevron`: Define if chevron is display\n- `icon`: Define displayed icon\n- `items`: Define the menu-items elements\n\n",
+      "description": "Attributes:\n- `display-chevron`: Define if chevron is display\n\nProperties:\n- `button`: Define button properties\n- `icon`: Define displayed icon\n- `items`: Define the menu-items elements\n\n",
       "attributes": [
         {
           "name": "button",
@@ -1501,7 +1501,7 @@
         },
         {
           "name": "variant",
-          "description": "Define icon variant color\n\nType: `\"app\" | \"danger\" | \"info\" | \"success\" | \"warning\"`",
+          "description": "Define icon variant color\n\nType: `\"app\" | \"danger\" | \"info\" | \"neutral\" | \"success\" | \"warning\"`",
           "values": [
             {
               "name": "app"
@@ -1512,6 +1512,9 @@
             {
               "name": "info"
             },
+            {
+              "name": "neutral"
+            },
             {
               "name": "success"
             },
@@ -1650,7 +1653,7 @@
         },
         {
           "name": "error-message",
-          "description": "Define error message to display\n\nType: `string | { summary: string; details: string; }`",
+          "description": "Define error message to display\n\nType: `string`",
           "references": [
             {
               "name": "Storybook",
@@ -1796,7 +1799,7 @@
     },
     {
       "name": "mg-input-checkbox",
-      "description": "Attributes:\n- `disabled`: Define if input is disabled\n- `display-selected-values`: Display selected values list in \"multi\" type\nThis prop is only applied with prop type \"multi\" or when an \"unset\" mode render a \"multi\" type.\n- `edit-button-message`: Overwrite default \"edit\" button message\n- `help-text`: Add a help text under the input, usually expected data format and example\n- `identifier`: Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n- `input-vertical-list`: Define if inputs are display verticaly\n- `invalid`: Define input invalid state\n- `label`: Define input label\n- `label-hide`: Define if label is visible\n- `label-on-top`: Define if label is displayed on top\n- `name`: Define input name\nIf not set the value equals the identifier\n- `no-value-error-detail`: Define no value error detail\n- `readonly`: Define if mg-input-checkbox is readonly\n- `required`: Define if mg-input-checkbox is required\n- `select-button-message`: Overwrite default \"select\" button message\n- `show-button-message`: Overwrite default \"show\" button message\n- `tooltip`: Add a tooltip message next to the input\n- `tooltip-position`: Define tooltip position\n- `type`: Define checkbox type\nWhen it's undefined the type is dynamic:\n- With 0-5 items type is 'checkbox'\n- With 5-10 items type is 'multi'\nWhen it set the type is locked to the defined value.\nWhen type is dynamic OR with 'multi' type AND Over 10 items \"search\" feature is enabled\n- `valid`: Define input valid state\n- `value`: Component value\nIf item.value is `null`, checkbox will be indeterminate by default\n\nMethods:\n- `displayError`: Display input error if it exists.\n- `reset`: Reset value, validity and error state\n- `setError`: Set an error and display a custom error message.\nThis method can be used to set the component's error state from its context by passing a boolean value to the `valid` parameter.\nIt must be paired with an error message to display for the given context.\nWhen used to set validity to `false`, you should use this method again to reset the validity to `true`.\n- `setFocus`: Set focus on input.\n\nEvents:\n- `input-valid`: Emited event when checking validity\n- `value-change`: Emitted event when value change\n\n",
+      "description": "Attributes:\n- `disabled`: Define if input is disabled\n- `display-selected-values`: Display selected values list in \"multi\" type\nThis prop is only applied with prop type \"multi\" or when an \"unset\" mode render a \"multi\" type.\n- `edit-button-message`: Overwrite default \"edit\" button message\n- `help-text`: Add a help text under the input, usually expected data format and example\n- `identifier`: Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n- `input-vertical-list`: Define if inputs are display verticaly\n- `invalid`: Define input invalid state\n- `label`: Define input label\n- `label-hide`: Define if label is visible\n- `label-on-top`: Define if label is displayed on top\n- `name`: Define input name\nIf not set the value equals the identifier\n- `readonly`: Define if mg-input-checkbox is readonly\n- `required`: Define if mg-input-checkbox is required\n- `select-button-message`: Overwrite default \"select\" button message\n- `show-button-message`: Overwrite default \"show\" button message\n- `tooltip`: Add a tooltip message next to the input\n- `tooltip-position`: Define tooltip position\n- `type`: Define checkbox type\nWhen it's undefined the type is dynamic:\n- With 0-5 items type is 'checkbox'\n- With 5-10 items type is 'multi'\nWhen it set the type is locked to the defined value.\nWhen type is dynamic OR with 'multi' type AND Over 10 items \"search\" feature is enabled\n- `valid`: Define input valid state\n\nProperties:\n- `value`: Component value\nIf item.value is `null`, checkbox will be indeterminate by default\n\nMethods:\n- `displayError`: Display input error if it exists.\n- `reset`: Reset value, validity and error state\n- `setError`: Set an error and display a custom error message.\nThis method can be used to set the component's error state from its context by passing a boolean value to the `valid` parameter.\nIt must be paired with an error message to display for the given context.\nWhen used to set validity to `false`, you should use this method again to reset the validity to `true`.\n- `setFocus`: Set focus on input.\n\nEvents:\n- `input-valid`: Emited event when checking validity\n- `value-change`: Emitted event when value change\n\n",
       "attributes": [
         {
           "name": "disabled",
@@ -1952,20 +1955,6 @@
             }
           ]
         },
-        {
-          "name": "no-value-error-detail",
-          "description": "Define no value error detail\n\nType: `string`",
-          "references": [
-            {
-              "name": "Storybook",
-              "url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/molecules-inputs-mg-input-checkbox--docs"
-            },
-            {
-              "name": "Sources",
-              "url": "https://gitlab.mgdis.fr/core/core-ui/core-ui/-/tree/master/packages/mg-components/src/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.tsx"
-            }
-          ]
-        },
         {
           "name": "readonly",
           "description": "Define if mg-input-checkbox is readonly\n\nType: `boolean`",
@@ -2122,7 +2111,7 @@
     },
     {
       "name": "mg-input-combobox",
-      "description": "Attributes:\n- `disabled`: Define if input is disabled\n- `fetchmappings`: Define fetch request mappings.\nRequired with `fetchurl`\n- `fetchoptions`: Define fetch options object\nRequire `fetchurl` prop to be defined otherwith it will be ignored if defined\n- `fetchurl`: Define API url to fetch\n- `help-text`: Add a help text under the input, usually expected data format and example\n- `identifier`: Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n- `invalid`: Define input invalid state\n- `items`: Define components items\n- `items-label`: Define items label\nInclude short description. Required for accessibility.\n- `label`: Input label\n- `label-hide`: Define if label is visible\n- `label-on-top`: Define if label is displayed on top\n- `mg-width`: Define input width\n- `name`: Input name\nIf not set the value equals the identifier\n- `no-value-error-detail`: Define no value error detail\n- `placeholder`: Define input placeholder.\nIt should be a word or short phrase that demonstrates the expected type of data, not a replacement for labels or help combobox.\n- `readonly`: Define if input is readonly\n- `required`: Define if input is required\n- `tooltip`: Add a tooltip message next to the input\n- `tooltip-position`: Define tooltip position\n- `valid`: Define input valid state\n- `value`: Define component value\n\nMethods:\n- `displayError`: Display input error if it exists.\n- `reset`: Reset value, validity and error state\n- `setError`: Set an error and display a custom error message.\nThis method can be used to set the component's error state from its concombobox by passing a boolean value to the `valid` parameter.\nIt must be paired with an error message to display for the given concombobox.\nWhen used to set validity to `false`, you should use this method again to reset the validity to `true`.\n- `setFocus`: Set focus on input.\n\nEvents:\n- `fetch-error`: Emited event when fetch API throw an error\n- `filter-change`: Emited event when filter change\n- `input-valid`: Emited event when checking validity\n- `load-more`: Emited event when `load-more` is called\n- `value-change`: Emited event when value change\n\n",
+      "description": "Attributes:\n- `disabled`: Define if input is disabled\n- `fetchurl`: Define API url to fetch\n- `help-text`: Add a help text under the input, usually expected data format and example\n- `identifier`: Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n- `invalid`: Define input invalid state\n- `items-label`: Define items label\nInclude short description. Required for accessibility.\n- `label`: Input label\n- `label-hide`: Define if label is visible\n- `label-on-top`: Define if label is displayed on top\n- `mg-width`: Define input width\n- `name`: Input name\nIf not set the value equals the identifier\n- `placeholder`: Define input placeholder.\nIt should be a word or short phrase that demonstrates the expected type of data, not a replacement for labels or help combobox.\n- `readonly`: Define if input is readonly\n- `required`: Define if input is required\n- `tooltip`: Add a tooltip message next to the input\n- `tooltip-position`: Define tooltip position\n- `valid`: Define input valid state\n- `value`: Define component value\n\nProperties:\n- `fetchmappings`: Define fetch request mappings.\nRequired with `fetchurl`\n- `fetchoptions`: Define fetch options object\nRequire `fetchurl` prop to be defined otherwith it will be ignored if defined\n- `items`: Define components items\n\nMethods:\n- `displayError`: Display input error if it exists.\n- `reset`: Reset value, validity and error state\n- `setError`: Set an error and display a custom error message.\nThis method can be used to set the component's error state from its concombobox by passing a boolean value to the `valid` parameter.\nIt must be paired with an error message to display for the given concombobox.\nWhen used to set validity to `false`, you should use this method again to reset the validity to `true`.\n- `setFocus`: Set focus on input.\n\nEvents:\n- `fetch-error`: Emited event when fetch API throw an error\n- `filter-change`: Emited event when filter change\n- `input-valid`: Emited event when checking validity\n- `load-more`: Emited event when `load-more` is called\n- `value-change`: Emited event when value change\n\n",
       "attributes": [
         {
           "name": "disabled",
@@ -2334,20 +2323,6 @@
             }
           ]
         },
-        {
-          "name": "no-value-error-detail",
-          "description": "Define no value error detail\n\nType: `string`",
-          "references": [
-            {
-              "name": "Storybook",
-              "url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/molecules-inputs-mg-input-combobox--docs"
-            },
-            {
-              "name": "Sources",
-              "url": "https://gitlab.mgdis.fr/core/core-ui/core-ui/-/tree/master/packages/mg-components/src/components/molecules/inputs/mg-input-combobox/mg-input-combobox.tsx"
-            }
-          ]
-        },
         {
           "name": "placeholder",
           "description": "Define input placeholder.\nIt should be a word or short phrase that demonstrates the expected type of data, not a replacement for labels or help combobox.\n\nType: `string`",
@@ -3416,7 +3391,7 @@
     },
     {
       "name": "mg-input-radio",
-      "description": "Attributes:\n- `disabled`: Define if input is disabled\n- `help-text`: Add a help text under the input, usually expected data format and example\n- `identifier`: Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n- `input-vertical-list`: Define if inputs are display verticaly\n- `invalid`: Define input invalid state\n- `items`: Items are the possible options to select\n- `label`: Input label\n- `label-hide`: Define if label is visible\n- `label-on-top`: Define if label is displayed on top\n- `name`: Input name\nIf not set the value equals the identifier\n- `no-value-error-detail`: Define no value error detail\n- `readonly`: Define if input is readonly\n- `required`: Define if input is required\n- `tooltip`: Add a tooltip message next to the input\n- `tooltip-position`: Define tooltip position\n- `valid`: Define input valid state\n- `value`: Component value\n\nMethods:\n- `displayError`: Display input error if it exists.\n- `reset`: Reset value, validity and error state\n- `setError`: Set an error and display a custom error message.\nThis method can be used to set the component's error state from its context by passing a boolean value to the `valid` parameter.\nIt must be paired with an error message to display for the given context.\nWhen used to set validity to `false`, you should use this method again to reset the validity to `true`.\n- `setFocus`: Set focus on input.\n\nEvents:\n- `input-valid`: Emited event when checking validity\n- `value-change`: Emitted event when value change\n\n",
+      "description": "Attributes:\n- `disabled`: Define if input is disabled\n- `help-text`: Add a help text under the input, usually expected data format and example\n- `identifier`: Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n- `input-vertical-list`: Define if inputs are display verticaly\n- `invalid`: Define input invalid state\n- `label`: Input label\n- `label-hide`: Define if label is visible\n- `label-on-top`: Define if label is displayed on top\n- `name`: Input name\nIf not set the value equals the identifier\n- `readonly`: Define if input is readonly\n- `required`: Define if input is required\n- `tooltip`: Add a tooltip message next to the input\n- `tooltip-position`: Define tooltip position\n- `valid`: Define input valid state\n- `value`: Component value\n\nProperties:\n- `items`: Items are the possible options to select\n\nMethods:\n- `displayError`: Display input error if it exists.\n- `reset`: Reset value, validity and error state\n- `setError`: Set an error and display a custom error message.\nThis method can be used to set the component's error state from its context by passing a boolean value to the `valid` parameter.\nIt must be paired with an error message to display for the given context.\nWhen used to set validity to `false`, you should use this method again to reset the validity to `true`.\n- `setFocus`: Set focus on input.\n\nEvents:\n- `input-valid`: Emited event when checking validity\n- `value-change`: Emitted event when value change\n\n",
       "attributes": [
         {
           "name": "disabled",
@@ -3558,20 +3533,6 @@
             }
           ]
         },
-        {
-          "name": "no-value-error-detail",
-          "description": "Define no value error detail\n\nType: `string`",
-          "references": [
-            {
-              "name": "Storybook",
-              "url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/molecules-inputs-mg-input-radio--docs"
-            },
-            {
-              "name": "Sources",
-              "url": "https://gitlab.mgdis.fr/core/core-ui/core-ui/-/tree/master/packages/mg-components/src/components/molecules/inputs/mg-input-radio/mg-input-radio.tsx"
-            }
-          ]
-        },
         {
           "name": "readonly",
           "description": "Define if input is readonly\n\nType: `boolean`",
@@ -3678,7 +3639,7 @@
     },
     {
       "name": "mg-input-rich-text-editor",
-      "description": "Attributes:\n- `disabled`: Define if input is disabled\n- `help-text`: Add a help text under the input, usually expected data format and example\n- `identifier`: Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n- `invalid`: Define input invalid state\n- `label`: Input label\n- `label-hide`: Define if label is visible\n- `label-on-top`: Define if label is displayed on top\n- `modules`: Editor modules configuration\n- `pattern`: Define input pattern to validate\nPlease refer to the Pattern section in the input documentation for detailed information on using regular expressions in components.\n- `pattern-error-message`: Define input pattern error message\n- `placeholder`: Input placeholder.\nIt should be a word or short phrase that demonstrates the expected type of data, not a replacement for labels or help text.\n- `readonly`: Define if the editor is readonly\n- `required`: Define if input is required\n- `rows`: Define the number of visible text lines for the control\n- `tooltip`: Add a tooltip message next to the input\n- `tooltip-position`: Define tooltip position\n- `valid`: Define input valid state\n- `value`: Define the value of the editor\nCan be either HTML string or plain text\n\nMethods:\n- `displayError`: Display input error if it exists.\n- `getHTML`: Get editor content as HTML\n- `getText`: Get editor content as plain text\n- `reset`: Reset value, validity and error state\n- `setError`: Set an error and display a custom error message.\nThis method can be used to set the component's error state from its context by passing a boolean value to the `valid` parameter.\nIt must be paired with an error message to display for the given context.\nWhen used to set validity to `false`, you should use this method again to reset the validity to `true`.\n- `setFocus`: Set focus on input.\n\nEvents:\n- `input-valid`: Emited event when checking validity\n- `value-change`: Emited event when value change\n\n",
+      "description": "Attributes:\n- `disabled`: Define if input is disabled\n- `help-text`: Add a help text under the input, usually expected data format and example\n- `identifier`: Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n- `invalid`: Define input invalid state\n- `label`: Input label\n- `label-hide`: Define if label is visible\n- `label-on-top`: Define if label is displayed on top\n- `pattern`: Define input pattern to validate\nPlease refer to the Pattern section in the input documentation for detailed information on using regular expressions in components.\n- `pattern-error-message`: Define input pattern error message\n- `placeholder`: Input placeholder.\nIt should be a word or short phrase that demonstrates the expected type of data, not a replacement for labels or help text.\n- `readonly`: Define if the editor is readonly\n- `required`: Define if input is required\n- `rows`: Define the number of visible text lines for the control\n- `tooltip`: Add a tooltip message next to the input\n- `tooltip-position`: Define tooltip position\n- `valid`: Define input valid state\n- `value`: Define the value of the editor\nCan be either HTML string or plain text\n\nProperties:\n- `modules`: Editor modules configuration\n\nMethods:\n- `displayError`: Display input error if it exists.\n- `getHTML`: Get editor content as HTML\n- `getText`: Get editor content as plain text\n- `reset`: Reset value, validity and error state\n- `setError`: Set an error and display a custom error message.\nThis method can be used to set the component's error state from its context by passing a boolean value to the `valid` parameter.\nIt must be paired with an error message to display for the given context.\nWhen used to set validity to `false`, you should use this method again to reset the validity to `true`.\n- `setFocus`: Set focus on input.\n\nEvents:\n- `input-valid`: Emited event when checking validity\n- `value-change`: Emited event when value change\n\n",
       "attributes": [
         {
           "name": "disabled",
@@ -3954,7 +3915,7 @@
     },
     {
       "name": "mg-input-select",
-      "description": "Attributes:\n- `disabled`: Define if input is disabled\n- `help-text`: Add a help text under the input, usually expected data format and example\n- `identifier`: Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n- `invalid`: Define input invalid state\n- `items`: Items are the possible options to select\n- `label`: Input label\n- `label-hide`: Define if label is visible\n- `label-on-top`: Define if label is displayed on top\n- `mg-width`: Define input width\n- `name`: Input name\nIf not set the value equals the identifier\n- `no-value-error-detail`: Define no value error detail\n- `placeholder`: Input placeholder.\nIt should be a word or short phrase that demonstrates the expected type of data, not a replacement for labels or help text.\n- `placeholder-disabled`: Option to disable placeholder\n- `placeholder-hide`: Option to remove placeholder\n- `readonly`: Define if input is readonly\n- `required`: Define if input is required\n- `tooltip`: Add a tooltip message next to the input\n- `tooltip-position`: Define tooltip position\n- `valid`: Define input valid state\n- `value`: Component value\n\nMethods:\n- `displayError`: Display input error if it exists.\n- `reset`: Reset value, validity and error state\n- `setError`: Set an error and display a custom error message.\nThis method can be used to set the component's error state from its context by passing a boolean value to the `valid` parameter.\nIt must be paired with an error message to display for the given context.\nWhen used to set validity to `false`, you should use this method again to reset the validity to `true`.\n- `setFocus`: Set focus on input.\n\nEvents:\n- `input-valid`: Emited event when checking validity\n- `value-change`: Emited event when value change\n\n",
+      "description": "Attributes:\n- `disabled`: Define if input is disabled\n- `help-text`: Add a help text under the input, usually expected data format and example\n- `identifier`: Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n- `invalid`: Define input invalid state\n- `label`: Input label\n- `label-hide`: Define if label is visible\n- `label-on-top`: Define if label is displayed on top\n- `mg-width`: Define input width\n- `name`: Input name\nIf not set the value equals the identifier\n- `placeholder`: Input placeholder.\nIt should be a word or short phrase that demonstrates the expected type of data, not a replacement for labels or help text.\n- `placeholder-disabled`: Option to disable placeholder\n- `placeholder-hide`: Option to remove placeholder\n- `readonly`: Define if input is readonly\n- `required`: Define if input is required\n- `tooltip`: Add a tooltip message next to the input\n- `tooltip-position`: Define tooltip position\n- `valid`: Define input valid state\n- `value`: Component value\n\nProperties:\n- `items`: Items are the possible options to select\n\nMethods:\n- `displayError`: Display input error if it exists.\n- `reset`: Reset value, validity and error state\n- `setError`: Set an error and display a custom error message.\nThis method can be used to set the component's error state from its context by passing a boolean value to the `valid` parameter.\nIt must be paired with an error message to display for the given context.\nWhen used to set validity to `false`, you should use this method again to reset the validity to `true`.\n- `setFocus`: Set focus on input.\n\nEvents:\n- `input-valid`: Emited event when checking validity\n- `value-change`: Emited event when value change\n\n",
       "attributes": [
         {
           "name": "disabled",
@@ -4110,20 +4071,6 @@
             }
           ]
         },
-        {
-          "name": "no-value-error-detail",
-          "description": "Define no value error detail\n\nType: `string`",
-          "references": [
-            {
-              "name": "Storybook",
-              "url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/molecules-inputs-mg-input-select--docs"
-            },
-            {
-              "name": "Sources",
-              "url": "https://gitlab.mgdis.fr/core/core-ui/core-ui/-/tree/master/packages/mg-components/src/components/molecules/inputs/mg-input-select/mg-input-select.tsx"
-            }
-          ]
-        },
         {
           "name": "placeholder",
           "description": "Input placeholder.\nIt should be a word or short phrase that demonstrates the expected type of data, not a replacement for labels or help text.\n\nType: `string`",
@@ -4272,7 +4219,7 @@
     },
     {
       "name": "mg-input-text",
-      "description": "Attributes:\n- `character-left-hide`: Define if component should display character left\n- `datalistoptions`: Define datalist options\n- `disabled`: Define if input is disabled\n- `help-text`: Add a help text under the input, usually expected data format and example\n- `icon`: Input icon\n- `identifier`: Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n- `invalid`: Define input invalid state\n- `label`: Input label\n- `label-hide`: Define if label is visible\n- `label-on-top`: Define if label is displayed on top\n- `maxlength`: Input max length\n- `mg-width`: Define input width\n- `name`: Input name\nIf not set the value equals the identifier\n- `pattern`: Define input pattern to validate\nPlease refer to the Pattern section in the input documentation for detailed information on using regular expressions in components.\n- `pattern-error-message`: Define input pattern error message\n- `placeholder`: Input placeholder.\nIt should be a word or short phrase that demonstrates the expected type of data, not a replacement for labels or help text.\n- `readonly`: Define if input is readonly\n- `required`: Define if input is required\n- `tooltip`: Add a tooltip message next to the input\n- `tooltip-position`: Define tooltip position\n- `type`: Input type\n- `valid`: Define input valid state\n- `value`: Component value\n\nMethods:\n- `displayError`: Display input error if it exists.\n- `reset`: Reset value, validity and error state\n- `setError`: Set an error and display a custom error message.\nThis method can be used to set the component's error state from its context by passing a boolean value to the `valid` parameter.\nIt must be paired with an error message to display for the given context.\nWhen used to set validity to `false`, you should use this method again to reset the validity to `true`.\n- `setFocus`: Set focus on input.\n\nEvents:\n- `input-valid`: Emited event when checking validity\n- `value-change`: Emited event when value change\n\nSlots:\n- `append-input`: Content to display next to the input\n\n",
+      "description": "Attributes:\n- `character-left-hide`: Define if component should display character left\n- `disabled`: Define if input is disabled\n- `help-text`: Add a help text under the input, usually expected data format and example\n- `icon`: Input icon\n- `identifier`: Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n- `invalid`: Define input invalid state\n- `label`: Input label\n- `label-hide`: Define if label is visible\n- `label-on-top`: Define if label is displayed on top\n- `maxlength`: Input max length\n- `mg-width`: Define input width\n- `name`: Input name\nIf not set the value equals the identifier\n- `pattern`: Define input pattern to validate\nPlease refer to the Pattern section in the input documentation for detailed information on using regular expressions in components.\n- `pattern-error-message`: Define input pattern error message\n- `placeholder`: Input placeholder.\nIt should be a word or short phrase that demonstrates the expected type of data, not a replacement for labels or help text.\n- `readonly`: Define if input is readonly\n- `required`: Define if input is required\n- `tooltip`: Add a tooltip message next to the input\n- `tooltip-position`: Define tooltip position\n- `type`: Input type\n- `valid`: Define input valid state\n- `value`: Component value\n\nProperties:\n- `datalistoptions`: Define datalist options\n\nMethods:\n- `displayError`: Display input error if it exists.\n- `reset`: Reset value, validity and error state\n- `setError`: Set an error and display a custom error message.\nThis method can be used to set the component's error state from its context by passing a boolean value to the `valid` parameter.\nIt must be paired with an error message to display for the given context.\nWhen used to set validity to `false`, you should use this method again to reset the validity to `true`.\n- `setFocus`: Set focus on input.\n\nEvents:\n- `input-valid`: Emited event when checking validity\n- `value-change`: Emited event when value change\n\nSlots:\n- `append-input`: Content to display next to the input\n\n",
       "attributes": [
         {
           "name": "character-left-hide",
@@ -5692,7 +5639,7 @@
     },
     {
       "name": "mg-input-toggle",
-      "description": "Attributes:\n- `disabled`: Define if input is disabled\n- `help-text`: Add a help text under the input, usually expected data format and example\n- `identifier`: Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n- `invalid`: Define input invalid state\n- `is-icon`: Define if toggle display icon\n- `is-on-off`: Define if toggle have on/off style\n- `items`: Items are the possible options to select\n- `label`: Input label\n- `label-hide`: Define if label is visible\n- `label-on-top`: Define if label is displayed on top\n- `name`: Input name\nIf not set the value equals the identifier\n- `no-value-error-detail`: Define no value error detail\n- `readonly`: Define if input is readonly\n- `tooltip`: Add a tooltip message next to the input\n- `tooltip-position`: Define tooltip position\n- `valid`: Define input valid state\n- `value`: Component value\n\nMethods:\n- `reset`: Reset value, validity, error and visual state\n- `setError`: Set an error and display a custom error message.\nThis method can be used to set the component's error state from its context by passing a boolean value to the `valid` parameter.\nIt must be paired with an error message to display for the given context.\nWhen used to set validity to `false`, you should use this method again to reset the validity to `true`.\n- `setFocus`: Set focus on input.\n\nEvents:\n- `input-valid`: Emited event when checking validity\n- `value-change`: Emited event when value change\n\nSlots:\n- `item-1`: Left option toggle content\n- `item-2`: Right option toggle content\n\n",
+      "description": "Attributes:\n- `disabled`: Define if input is disabled\n- `help-text`: Add a help text under the input, usually expected data format and example\n- `identifier`: Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n- `is-icon`: Define if toggle display icon\n- `is-on-off`: Define if toggle have on/off style\n- `label`: Input label\n- `label-hide`: Define if label is visible\n- `label-on-top`: Define if label is displayed on top\n- `name`: Input name\nIf not set the value equals the identifier\n- `readonly`: Define if input is readonly\n- `tooltip`: Add a tooltip message next to the input\n- `tooltip-position`: Define tooltip position\n- `value`: Component value\n\nProperties:\n- `items`: Items are the possible options to select\n\nMethods:\n- `reset`: Reset value, validity, error and visual state\n- `setError`: Set an error and display a custom error message.\nThis method can be used to set the component's error state from its context by passing a boolean value to the `valid` parameter.\nIt must be paired with an error message to display for the given context.\nWhen used to set validity to `false`, you should use this method again to reset the validity to `true`.\n- `setFocus`: Set focus on input.\n\nEvents:\n- `input-valid`: Emited event when checking validity\n- `value-change`: Emited event when value change\n\nSlots:\n- `item-1`: Left option toggle content\n- `item-2`: Right option toggle content\n\n",
       "attributes": [
         {
           "name": "disabled",
@@ -5736,20 +5683,6 @@
             }
           ]
         },
-        {
-          "name": "invalid",
-          "description": "Define input invalid state\n\nType: `boolean`",
-          "references": [
-            {
-              "name": "Storybook",
-              "url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/molecules-inputs-mg-input-toggle--docs"
-            },
-            {
-              "name": "Sources",
-              "url": "https://gitlab.mgdis.fr/core/core-ui/core-ui/-/tree/master/packages/mg-components/src/components/molecules/inputs/mg-input-toggle/mg-input-toggle.tsx"
-            }
-          ]
-        },
         {
           "name": "is-icon",
           "description": "Define if toggle display icon\n\nType: `boolean`",
@@ -5848,20 +5781,6 @@
             }
           ]
         },
-        {
-          "name": "no-value-error-detail",
-          "description": "Define no value error detail\n\nType: `string`",
-          "references": [
-            {
-              "name": "Storybook",
-              "url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/molecules-inputs-mg-input-toggle--docs"
-            },
-            {
-              "name": "Sources",
-              "url": "https://gitlab.mgdis.fr/core/core-ui/core-ui/-/tree/master/packages/mg-components/src/components/molecules/inputs/mg-input-toggle/mg-input-toggle.tsx"
-            }
-          ]
-        },
         {
           "name": "readonly",
           "description": "Define if input is readonly\n\nType: `boolean`",
@@ -5912,20 +5831,6 @@
             }
           ]
         },
-        {
-          "name": "valid",
-          "description": "Define input valid state\n\nType: `boolean`",
-          "references": [
-            {
-              "name": "Storybook",
-              "url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/molecules-inputs-mg-input-toggle--docs"
-            },
-            {
-              "name": "Sources",
-              "url": "https://gitlab.mgdis.fr/core/core-ui/core-ui/-/tree/master/packages/mg-components/src/components/molecules/inputs/mg-input-toggle/mg-input-toggle.tsx"
-            }
-          ]
-        },
         {
           "name": "value",
           "description": "Component value\n\nType: `any`",
@@ -5998,7 +5903,7 @@
     },
     {
       "name": "mg-menu",
-      "description": "Attributes:\n- `direction`: Component display direction.\n- `itemmore`: Customize \"mg-item-more\" element\nUsed with direction: 'vertical' to manage overflow\n- `label`: Menu label. Include short menu description.\nRequired to define accessibility required attribute `aria-label`\n- `size`: Define mg-menu size\n\nListeners:\n- `item-loaded`\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",
@@ -6363,7 +6268,7 @@
     },
     {
       "name": "mg-pagination",
-      "description": "Attributes:\n- `current-page`: Component current page\n- `hide-navigation-labels`: Hide navigation label\n- `hide-page-count`: Hide select input\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- `label`: Panignation label. Is a short description.\nCustomize default value can be usefull to improve accessibility\n- `messages`: Define locales messages overrides\n- `total-pages`: Component total pages\n\nEvents:\n- `current-page-change`: Emmited event when current page change\n\n",
+      "description": "Attributes:\n- `current-page`: Component current page\n- `hide-navigation-labels`: Hide navigation label\n- `hide-page-count`: Hide select input\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- `label`: Panignation label. Is a short description.\nCustomize default value can be usefull to improve accessibility\n- `total-pages`: Component total pages\n\nProperties:\n- `messages`: Define locales messages overrides\n\nEvents:\n- `current-page-change`: Emmited event when current page change\n\n",
       "attributes": [
         {
           "name": "current-page",
@@ -6890,7 +6795,7 @@
     },
     {
       "name": "mg-skip-links",
-      "description": "Attributes:\n- `links`: Skip links\n\nEvents:\n- `go-to-anchor`: Emited event when link is clicked\n\n",
+      "description": "Properties:\n- `links`: Skip links\n\nEvents:\n- `go-to-anchor`: Emited event when link is clicked\n\n",
       "attributes": [
         {
           "name": "links",
@@ -6920,7 +6825,7 @@
     },
     {
       "name": "mg-table",
-      "description": "Attributes:\n- `columns`: Define column properties\n- `full-width`: Define if table fits its parent element\n- `size`: Define table size\n\nSlots:\n- ``: Table content\n\n",
+      "description": "Attributes:\n- `full-width`: Define if table fits its parent element\n- `size`: Define table size\n\nProperties:\n- `columns`: Define column properties\n\nSlots:\n- ``: Table content\n\n",
       "attributes": [
         {
           "name": "columns",
@@ -6992,7 +6897,7 @@
     },
     {
       "name": "mg-tabs",
-      "description": "Attributes:\n- `active-tab`: Active tab number\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- `items`: Tabs items\n- `label`: Tabs label. Include short tabs description.\nRequired for accessibility\n- `size`: Define tabs size\n\nEvents:\n- `active-tab-change`: Emited event when active tab change\n\nSlots:\n- `tab_content-n`: Tab content, where `n` represents the position of the tab content. It starts at 1.\n\n",
+      "description": "Attributes:\n- `active-tab`: Active tab number\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- `label`: Tabs label. Include short tabs description.\nRequired for accessibility\n- `size`: Define tabs size\n\nProperties:\n- `items`: Tabs items\n\nEvents:\n- `active-tab-change`: Emited event when active tab change\n\nSlots:\n- `tab_content-n`: Tab content, where `n` represents the position of the tab content. It starts at 1.\n\n",
       "attributes": [
         {
           "name": "active-tab",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mgdis/mg-components",
-  "version": "6.15.0",
+  "version": "6.17.0",
   "description": "MG Components",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
@@ -34,37 +34,37 @@
   },
   "dependencies": {
     "@popperjs/core": "2.11.8",
-    "@stencil/core": "4.36.2",
+    "@stencil/core": "4.38.0",
     "quill": "2.0.3",
-    "@mgdis/core-ui-helpers": "1.0.3",
-    "@mgdis/img": "2.5.0",
-    "@mgdis/styles": "2.10.0"
+    "@mgdis/core-ui-helpers": "1.0.5",
+    "@mgdis/img": "2.5.1",
+    "@mgdis/styles": "2.12.0"
   },
   "devDependencies": {
-    "@playwright/test": "1.54.1",
-    "@storybook/addon-a11y": "9.0.18",
-    "@storybook/addon-docs": "9.0.18",
-    "@storybook/addon-links": "9.0.18",
-    "@storybook/html": "9.0.18",
-    "@storybook/html-vite": "9.0.18",
+    "@playwright/test": "1.55.0",
+    "@storybook/addon-a11y": "9.1.10",
+    "@storybook/addon-docs": "9.1.10",
+    "@storybook/addon-links": "9.1.10",
+    "@storybook/html": "9.1.10",
+    "@storybook/html-vite": "9.1.10",
     "@types/jest": "29.5.14",
-    "@types/node": "22.16.5",
-    "chromatic": "13.1.2",
+    "@types/node": "22.18.8",
+    "chromatic": "13.3.0",
     "eslint": "8.57.1",
-    "eslint-plugin-storybook": "9.0.18",
+    "eslint-plugin-storybook": "9.1.10",
     "jest": "29.7.0",
     "jest-cli": "29.7.0",
     "jest-junit": "16.0.0",
     "jest-transform-stub": "2.0.0",
-    "react": "19.1.1",
-    "react-dom": "19.1.1",
-    "sass": "1.89.2",
-    "storybook": "9.0.18",
-    "storybook-addon-tag-badges": "2.0.1",
-    "typescript": "5.8.3",
-    "vite": "7.0.6",
+    "react": "19.2.0",
+    "react-dom": "19.2.0",
+    "sass": "1.93.2",
+    "storybook": "9.1.10",
+    "storybook-addon-tag-badges": "2.0.2",
+    "typescript": "5.9.3",
+    "vite": "7.1.9",
     "@core-ui/jest-config": "1.0.9",
-    "@mgdis/linting-stencil": "1.3.9"
+    "@mgdis/linting-stencil": "1.3.10"
   },
   "license": "BSD-3-Clause",
   "scripts": {

package/dist/cjs/mg-input.utils-D-ASK4ua.js

@@ -1,49 +0,0 @@
-'use strict';
-
-var index = require('./index-CpENFzEo.js');
-
-/**
- * Keyboard keys
- */
-const Keys = {
-    TAB: 'Tab',
-    ENTER: 'Enter',
-    DOWN: 'Down',
-    UP: 'Up',
-    LEFT: 'Left',
-    RIGHT: 'Right',
-    ARROWDOWN: 'ArrowDown',
-    ARROWUP: 'ArrowUp',
-    ARROWRIGHT: 'ArrowRight',
-    ARROWLEFT: 'ArrowLeft',
-    HOME: 'Home',
-    END: 'End',
-    ESC: 'Esc',
-    ESCAPE: 'Escape',
-    NUMPADENTER: 'NumpadEnter',
-    SPACE: 'Space',
-};
-
-/**
- * Define error message
- * @param message - message to display
- * @param details - message detail to display
- * @returns formated MgInput["errorMessage"]
- */
-const defineErrorMessage = (message, details) => {
-    if (index.isValidString(message) && index.isValidString(details)) {
-        return {
-            summary: message,
-            details,
-        };
-    }
-    else if (index.isValidString(message)) {
-        return message;
-    }
-    else {
-        return undefined;
-    }
-};
-
-exports.Keys = Keys;
-exports.defineErrorMessage = defineErrorMessage;

package/dist/collection/components/molecules/inputs/mg-input/mg-input.utils.js

@@ -1,21 +0,0 @@
-import { isValidString } from "@mgdis/core-ui-helpers/dist/utils";
-/**
- * Define error message
- * @param message - message to display
- * @param details - message detail to display
- * @returns formated MgInput["errorMessage"]
- */
-export const defineErrorMessage = (message, details) => {
-    if (isValidString(message) && isValidString(details)) {
-        return {
-            summary: message,
-            details,
-        };
-    }
-    else if (isValidString(message)) {
-        return message;
-    }
-    else {
-        return undefined;
-    }
-};

package/dist/components/mg-details2.js

@@ -1,99 +0,0 @@
-import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
-import { i as isValidString } from './index2.js';
-import { d as defineCustomElement$1 } from './mg-icon2.js';
-
-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.mg-c-details--empty-summary summary{gap:unset}.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:not(.mg-c-details--empty-summary) .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 = /*@__PURE__*/ proxyCustomElement(class MgDetails extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.expandedChange = createEvent(this, "expanded-change", 7);
-        /**
-         * Hide summary element
-         */
-        this.hideSummary = false;
-        /**
-         * Define if details are diplayed
-         */
-        this.expanded = false;
-        /**
-         * Handle details toggle
-         */
-        this.handleToggle = () => {
-            this.expanded = this.details.open;
-        };
-    }
-    validateTitles(newValue) {
-        if (!isValidString(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}'".`);
-        }
-    }
-    handleExpanded(newValue) {
-        this.expandedChange.emit(newValue);
-    }
-    /*************
-     * Lifecycle *
-     *************/
-    /**
-     * Check if component props are well configured on init
-     */
-    componentWillLoad() {
-        this.validateTitles(this.toggleClosed);
-        this.validateTitles(this.toggleOpened);
-        // Check if summary slot is empty
-        const summarySlot = this.element.querySelector('[slot="summary"]');
-        this.isEmptySummary = summarySlot === null || !isValidString(summarySlot.textContent);
-        // Add event listener to prevent default action on summary click
-        this.element.addEventListener('click', (event) => {
-            if (event.target.closest('[slot="summary"] mg-button, mg-button[slot="summary"]') !== null) {
-                event.preventDefault();
-            }
-        });
-    }
-    /**
-     * Render
-     * @returns HTML Element
-     */
-    render() {
-        return (h("details", { key: '4da17afd7a964a14b5b101bcfadc241be569d55a', class: { 'mg-c-details': true, 'mg-c-details--empty-summary': this.isEmptySummary }, onToggle: this.handleToggle, open: this.expanded, ref: (el) => (this.details = el) }, h("summary", { key: '515d6c4e117b547fe80a310fb90e114900f645e8' }, h("slot", { key: '0c9c0dcc47dd418e34e541d878bfc03ca137c68d', name: "summary" }), h("span", { key: 'c94f52994843b10c1161c0d85f38f8cb917ea806', class: "mg-c-details__toggle" }, h("mg-icon", { key: '9421452572af3deb03146a8dfd189369b249ba2d', icon: "chevron-up", class: { 'mg-c-details__toggle-icon': true, 'mg-c-details__toggle-icon--reverse': !this.expanded } }), h("span", { key: 'dbfb0b34da00e37f55ec07236611c2babdd6b7c5', class: { 'mg-u-visually-hidden': this.hideSummary } }, this.expanded ? this.toggleOpened : this.toggleClosed))), h("div", { key: '1b18b65a98e39a8663fa5d7e51eef5fbe2b92f76', class: "mg-c-details__details" }, h("slot", { key: '81c213594b1b67747db439624090784eaa5e6fcd', name: "details" }))));
-    }
-    get element() { return this; }
-    static get watchers() { return {
-        "toggleClosed": ["validateTitles"],
-        "toggleOpened": ["validateTitles"],
-        "expanded": ["handleExpanded"]
-    }; }
-    static get style() { return mgDetailsCss; }
-}, [257, "mg-details", {
-        "toggleClosed": [1, "toggle-closed"],
-        "toggleOpened": [1, "toggle-opened"],
-        "hideSummary": [4, "hide-summary"],
-        "expanded": [1028]
-    }, undefined, {
-        "toggleClosed": ["validateTitles"],
-        "toggleOpened": ["validateTitles"],
-        "expanded": ["handleExpanded"]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["mg-details", "mg-icon"];
-    components.forEach(tagName => { switch (tagName) {
-        case "mg-details":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, MgDetails);
-            }
-            break;
-        case "mg-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-defineCustomElement();
-
-export { MgDetails as M, defineCustomElement as d };

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

@@ -1,24 +0,0 @@
-import { i as isValidString } from './index2.js';
-
-/**
- * Define error message
- * @param message - message to display
- * @param details - message detail to display
- * @returns formated MgInput["errorMessage"]
- */
-const defineErrorMessage = (message, details) => {
-    if (isValidString(message) && isValidString(details)) {
-        return {
-            summary: message,
-            details,
-        };
-    }
-    else if (isValidString(message)) {
-        return message;
-    }
-    else {
-        return undefined;
-    }
-};
-
-export { defineErrorMessage as d };

package/dist/esm/mg-input.utils-BYI03zSi.js

@@ -1,46 +0,0 @@
-import { c as isValidString } from './index-WtiuOkLj.js';
-
-/**
- * Keyboard keys
- */
-const Keys = {
-    TAB: 'Tab',
-    ENTER: 'Enter',
-    DOWN: 'Down',
-    UP: 'Up',
-    LEFT: 'Left',
-    RIGHT: 'Right',
-    ARROWDOWN: 'ArrowDown',
-    ARROWUP: 'ArrowUp',
-    ARROWRIGHT: 'ArrowRight',
-    ARROWLEFT: 'ArrowLeft',
-    HOME: 'Home',
-    END: 'End',
-    ESC: 'Esc',
-    ESCAPE: 'Escape',
-    NUMPADENTER: 'NumpadEnter',
-    SPACE: 'Space',
-};
-
-/**
- * Define error message
- * @param message - message to display
- * @param details - message detail to display
- * @returns formated MgInput["errorMessage"]
- */
-const defineErrorMessage = (message, details) => {
-    if (isValidString(message) && isValidString(details)) {
-        return {
-            summary: message,
-            details,
-        };
-    }
-    else if (isValidString(message)) {
-        return message;
-    }
-    else {
-        return undefined;
-    }
-};
-
-export { Keys as K, defineErrorMessage as d };