@mgdis/mg-components 6.16.0 → 6.18.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",
@@ -592,9 +592,185 @@
         }
       ]
     },
+    {
+      "name": "mg-fieldset",
+      "description": "Attributes:\n- `disabled`: Define if inputs are disabled\n- `help-text`: Add a help text under the fieldset, usually expected data format and example\n- `identifier`: Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n- `legend`: Fieldset legend\n- `legend-border-display`: Define if legend border is visible.\n- `legend-heading`: Define legend heading, use to define legend with associated semantic\n- `legend-hide`: Define if legend is visible\n- `name`: Fieldset name\nIf not set the value equals the identifier\n- `readonly`: Define if inputs are readonly\n- `tooltip`: Add a tooltip message next to the fieldset\n\nMethods:\n- `displayError`: Display inputs error if it exists.\n- `setCustomValidity`: Component is not a candidate for constraint validation.\nYou can use this method to define the `errorMessage` and set the `valid` state to `false`.\n\n",
+      "attributes": [
+        {
+          "name": "disabled",
+          "description": "Define if inputs are disabled\n\nType: `boolean`",
+          "references": [
+            {
+              "name": "Storybook",
+              "url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/molecules-mg-fieldset--docs"
+            },
+            {
+              "name": "Sources",
+              "url": "https://gitlab.mgdis.fr/core/core-ui/core-ui/-/tree/master/packages/mg-components/src/components/molecules/mg-fieldset/mg-fieldset.tsx"
+            }
+          ]
+        },
+        {
+          "name": "help-text",
+          "description": "Add a help text under the fieldset, usually expected data format and example\n\nType: `string`",
+          "references": [
+            {
+              "name": "Storybook",
+              "url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/molecules-mg-fieldset--docs"
+            },
+            {
+              "name": "Sources",
+              "url": "https://gitlab.mgdis.fr/core/core-ui/core-ui/-/tree/master/packages/mg-components/src/components/molecules/mg-fieldset/mg-fieldset.tsx"
+            }
+          ]
+        },
+        {
+          "name": "identifier",
+          "description": "Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n\nType: `string`",
+          "references": [
+            {
+              "name": "Storybook",
+              "url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/molecules-mg-fieldset--docs"
+            },
+            {
+              "name": "Sources",
+              "url": "https://gitlab.mgdis.fr/core/core-ui/core-ui/-/tree/master/packages/mg-components/src/components/molecules/mg-fieldset/mg-fieldset.tsx"
+            }
+          ]
+        },
+        {
+          "name": "legend",
+          "description": "Fieldset legend\n\nType: `string`",
+          "references": [
+            {
+              "name": "Storybook",
+              "url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/molecules-mg-fieldset--docs"
+            },
+            {
+              "name": "Sources",
+              "url": "https://gitlab.mgdis.fr/core/core-ui/core-ui/-/tree/master/packages/mg-components/src/components/molecules/mg-fieldset/mg-fieldset.tsx"
+            }
+          ]
+        },
+        {
+          "name": "legend-border-display",
+          "description": "Define if legend border is visible.\n\nType: `boolean`",
+          "references": [
+            {
+              "name": "Storybook",
+              "url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/molecules-mg-fieldset--docs"
+            },
+            {
+              "name": "Sources",
+              "url": "https://gitlab.mgdis.fr/core/core-ui/core-ui/-/tree/master/packages/mg-components/src/components/molecules/mg-fieldset/mg-fieldset.tsx"
+            }
+          ]
+        },
+        {
+          "name": "legend-heading",
+          "description": "Define legend heading, use to define legend with associated semantic\n\nType: `\"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\"`",
+          "values": [
+            {
+              "name": "h1"
+            },
+            {
+              "name": "h2"
+            },
+            {
+              "name": "h3"
+            },
+            {
+              "name": "h4"
+            },
+            {
+              "name": "h5"
+            },
+            {
+              "name": "h6"
+            }
+          ],
+          "references": [
+            {
+              "name": "Storybook",
+              "url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/molecules-mg-fieldset--docs"
+            },
+            {
+              "name": "Sources",
+              "url": "https://gitlab.mgdis.fr/core/core-ui/core-ui/-/tree/master/packages/mg-components/src/components/molecules/mg-fieldset/mg-fieldset.tsx"
+            }
+          ]
+        },
+        {
+          "name": "legend-hide",
+          "description": "Define if legend is visible\n\nType: `boolean`",
+          "references": [
+            {
+              "name": "Storybook",
+              "url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/molecules-mg-fieldset--docs"
+            },
+            {
+              "name": "Sources",
+              "url": "https://gitlab.mgdis.fr/core/core-ui/core-ui/-/tree/master/packages/mg-components/src/components/molecules/mg-fieldset/mg-fieldset.tsx"
+            }
+          ]
+        },
+        {
+          "name": "name",
+          "description": "Fieldset name\nIf not set the value equals the identifier\n\nType: `string`",
+          "references": [
+            {
+              "name": "Storybook",
+              "url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/molecules-mg-fieldset--docs"
+            },
+            {
+              "name": "Sources",
+              "url": "https://gitlab.mgdis.fr/core/core-ui/core-ui/-/tree/master/packages/mg-components/src/components/molecules/mg-fieldset/mg-fieldset.tsx"
+            }
+          ]
+        },
+        {
+          "name": "readonly",
+          "description": "Define if inputs are readonly\n\nType: `boolean`",
+          "references": [
+            {
+              "name": "Storybook",
+              "url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/molecules-mg-fieldset--docs"
+            },
+            {
+              "name": "Sources",
+              "url": "https://gitlab.mgdis.fr/core/core-ui/core-ui/-/tree/master/packages/mg-components/src/components/molecules/mg-fieldset/mg-fieldset.tsx"
+            }
+          ]
+        },
+        {
+          "name": "tooltip",
+          "description": "Add a tooltip message next to the fieldset\n\nType: `string`",
+          "references": [
+            {
+              "name": "Storybook",
+              "url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/molecules-mg-fieldset--docs"
+            },
+            {
+              "name": "Sources",
+              "url": "https://gitlab.mgdis.fr/core/core-ui/core-ui/-/tree/master/packages/mg-components/src/components/molecules/mg-fieldset/mg-fieldset.tsx"
+            }
+          ]
+        }
+      ],
+      "references": [
+        {
+          "name": "Storybook",
+          "url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/molecules-mg-fieldset--docs"
+        },
+        {
+          "name": "Sources",
+          "url": "https://gitlab.mgdis.fr/core/core-ui/core-ui/-/tree/master/packages/mg-components/src/components/molecules/mg-fieldset/mg-fieldset.tsx"
+        }
+      ]
+    },
     {
       "name": "mg-form",
-      "description": "Attributes:\n- `aria-role`: Define `<form/>` element aria role\nsee more about aria roles use case: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles\n- `disabled`: Define if form is disabled\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- `invalid`: Define form invalid state\n- `label-on-top`: Define if slotted mg-component's label are displayed on top\n- `name`: Input name\nIf not set the value equals the identifier\n- `readonly`: Define if form is readonly\n- `required-message`: Define when required message is display.\nWhen it is unset, component use it internal logic to manage \"required message\" help text display.\nWhen you set the prop to `default`, you override the component internal logique to torce it display \"required message\" help text.\nWhen you set the prop to `hide`, it will prevent the rendering of the message in the component's DOM.\nAs **this element is an accessibility requirement in the view**,\nyou **MUST*** re-implement this message on your own and display it when your form contains required inputs.\n- `valid`: Define form valid state\n\nMethods:\n- `displayError`: Display input error if it exists.\n- `reset`: Reset form inputs values, validity and error state\n\nEvents:\n- `form-reset`: Emitted event on form reset\n- `form-submit`: Emitted event on form submit\n- `form-valid`: Emitted event on form validity check\nTells if form is valid or not\n\nSlots:\n- ``: Form content\n- `actions`: Actions content\n\n",
+      "description": "Attributes:\n- `aria-role`: Define `<form/>` element aria role\nsee more about aria roles use case: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles\n- `disabled`: Define if form is disabled\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- `invalid`: Define form invalid state\n- `label-on-top`: Define if slotted mg-component's label are displayed on top\n- `name`: Input name\nIf not set the value equals the identifier\n- `readonly`: Define if form is readonly\n- `required-message`: Define when required message is display.\nWhen it is unset, component use it internal logic to manage \"required message\" help text display.\nWhen you set the prop to `default`, you override the component internal logique to torce it display \"required message\" help text.\nWhen you set the prop to `hide`, it will prevent the rendering of the message in the component's DOM.\nAs **this element is an accessibility requirement in the view**,\nyou **MUST*** re-implement this message on your own and display it when your form contains required inputs.\n- `valid`: Define form valid state\n\nMethods:\n- `displayError`: Display inputs/fieldsets errors if it exists.\n- `reset`: Reset form inputs values, validity and error state\n\nEvents:\n- `form-reset`: Emitted event on form reset\n- `form-submit`: Emitted event on form submit\n- `form-valid`: Emitted event on form validity check\nTells if form is valid or not\n\nSlots:\n- ``: Form content\n- `actions`: Actions content\n\n",
       "attributes": [
         {
           "name": "aria-role",
@@ -1501,7 +1677,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 +1688,9 @@
             {
               "name": "info"
             },
+            {
+              "name": "neutral"
+            },
             {
               "name": "success"
             },
@@ -1632,7 +1811,7 @@
     },
     {
       "name": "mg-input",
-      "description": "Attributes:\n- `aria-describedby-i-ds`: Define aria-describedby ids to link with\n- `error-message`: Define error message to display\n- `help-text`: Define help text to display\n- `identifier`: Identifier is used for the element ID (id is a reserved prop in Stencil.js)\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- `required`: Define if input is required\n- `tooltip`: Add a tooltip message next to the input\n- `tooltip-position`: Define tooltip position\n\nSlots:\n- ``: Input content\n\n",
+      "description": "Attributes:\n- `aria-describedby-i-ds`: Define aria-describedby ids to link with\n- `error-message`: Define error message to display\n- `help-text`: Define help text to display\n- `identifier`: Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n- `inputs-on-bottom`: Display inputs after help-text and error message\n- `label`: Define input label\n- `label-border-display`: Define if label border is visible\nYou must pair this mode with `labelOnTop`and `fieldset` class\n- `label-heading`: Define label heading, use to define label with associated semantic\nYou must pair this mode with `labelOnTop`and `fieldset` class\n- `label-hide`: Define if label is visible\n- `label-on-top`: Define if label is displayed on top\n- `required`: Define if input is required\n- `tooltip`: Add a tooltip message next to the input\n- `tooltip-position`: Define tooltip position\n\nSlots:\n- ``: Input content\n\n",
       "attributes": [
         {
           "name": "aria-describedby-i-ds",
@@ -1690,6 +1869,20 @@
             }
           ]
         },
+        {
+          "name": "inputs-on-bottom",
+          "description": "Display inputs after help-text and error message\n\nType: `boolean`",
+          "references": [
+            {
+              "name": "Storybook",
+              "url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/molecules-inputs-mg-input--docs"
+            },
+            {
+              "name": "Sources",
+              "url": "https://gitlab.mgdis.fr/core/core-ui/core-ui/-/tree/master/packages/mg-components/src/components/molecules/inputs/mg-input/mg-input.tsx"
+            }
+          ]
+        },
         {
           "name": "label",
           "description": "Define input label\n\nType: `string`",
@@ -1704,6 +1897,54 @@
             }
           ]
         },
+        {
+          "name": "label-border-display",
+          "description": "Define if label border is visible\nYou must pair this mode with `labelOnTop`and `fieldset` class\n\nType: `boolean`",
+          "references": [
+            {
+              "name": "Storybook",
+              "url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/molecules-inputs-mg-input--docs"
+            },
+            {
+              "name": "Sources",
+              "url": "https://gitlab.mgdis.fr/core/core-ui/core-ui/-/tree/master/packages/mg-components/src/components/molecules/inputs/mg-input/mg-input.tsx"
+            }
+          ]
+        },
+        {
+          "name": "label-heading",
+          "description": "Define label heading, use to define label with associated semantic\nYou must pair this mode with `labelOnTop`and `fieldset` class\n\nType: `\"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\"`",
+          "values": [
+            {
+              "name": "h1"
+            },
+            {
+              "name": "h2"
+            },
+            {
+              "name": "h3"
+            },
+            {
+              "name": "h4"
+            },
+            {
+              "name": "h5"
+            },
+            {
+              "name": "h6"
+            }
+          ],
+          "references": [
+            {
+              "name": "Storybook",
+              "url": "http://core.pages.mgdis.fr/core-ui/core-ui/storybook/?path=/docs/molecules-inputs-mg-input--docs"
+            },
+            {
+              "name": "Sources",
+              "url": "https://gitlab.mgdis.fr/core/core-ui/core-ui/-/tree/master/packages/mg-components/src/components/molecules/inputs/mg-input/mg-input.tsx"
+            }
+          ]
+        },
         {
           "name": "label-hide",
           "description": "Define if label is visible\n\nType: `boolean`",
@@ -1796,7 +2037,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- `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",
@@ -2108,7 +2349,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- `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",
@@ -3388,7 +3629,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- `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",
@@ -3636,7 +3877,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",
@@ -3912,7 +4153,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- `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",
@@ -4216,7 +4457,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",
@@ -5636,7 +5877,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- `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- `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\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,\nthe left icon is hidden.\nOnly available in combination with the \"isIcon\" prop.\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",
@@ -5696,7 +5937,7 @@
         },
         {
           "name": "is-on-off",
-          "description": "Define if toggle have on/off style\n\nType: `boolean`",
+          "description": "Define if toggle have on/off style,\nthe left icon is hidden.\nOnly available in combination with the \"isIcon\" prop.\n\nType: `boolean`",
           "references": [
             {
               "name": "Storybook",
@@ -5900,7 +6141,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",
@@ -6265,7 +6506,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",
@@ -6379,7 +6620,7 @@
     },
     {
       "name": "mg-panel",
-      "description": "Attributes:\n- `expand-toggle-disabled`: Disable possibility to toggle expand\n- `expand-toggle-display`: Define expand toggle button display\n- `expanded`: Panel is opened\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- `panel-title`: Panel title\n- `shadow`: Add box-shadow style\n- `title-editable`: Define if panel title is editable\n- `title-pattern`: Panel title pattern\n- `title-pattern-error-message`: Panel title pattern error message\n- `title-position`: Define title position\n\nEvents:\n- `expanded-change`: Emmited event when expanded change\n- `title-change`: Emmited event when title change\n\nSlots:\n- ``: Panel content\n- `header-right`: Header right panel content\n\n",
+      "description": "Attributes:\n- `expand-toggle-disabled`: Disable possibility to toggle expand\n- `expand-toggle-display`: Define expand toggle button display\n- `expanded`: Panel is opened\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- `panel-title`: Panel title\n- `shadow`: Add box-shadow style\n- `title-editable`: Define if panel title is editable\n- `title-pattern`: Panel title pattern\n- `title-pattern-error-message`: Panel title pattern error message\n- `title-position`: Define title position\n\nEvents:\n- `expanded-change`: Emmited event when expanded change\n- `title-change`: Emmited event when title change\n\nSlots:\n- ``: Panel content\n- `header-right`: Header right panel content\n- `panel-title`: Panel title content (replaces panel-title prop when used)\n\n",
       "attributes": [
         {
           "name": "expand-toggle-disabled",
@@ -6792,7 +7033,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",
@@ -6822,7 +7063,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",
@@ -6894,7 +7135,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.16.0",
+  "version": "6.18.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.3",
+    "@stencil/core": "4.38.0",
     "quill": "2.0.3",
-    "@mgdis/core-ui-helpers": "1.0.4",
-    "@mgdis/img": "2.5.0",
-    "@mgdis/styles": "2.11.0"
+    "@mgdis/core-ui-helpers": "1.0.5",
+    "@mgdis/img": "2.5.2",
+    "@mgdis/styles": "2.13.0"
   },
   "devDependencies": {
-    "@playwright/test": "1.55.0",
-    "@storybook/addon-a11y": "9.1.3",
-    "@storybook/addon-docs": "9.1.3",
-    "@storybook/addon-links": "9.1.3",
-    "@storybook/html": "9.1.3",
-    "@storybook/html-vite": "9.1.3",
+    "@playwright/test": "1.56.1",
+    "@storybook/addon-a11y": "9.1.15",
+    "@storybook/addon-docs": "9.1.15",
+    "@storybook/addon-links": "9.1.15",
+    "@storybook/html": "9.1.15",
+    "@storybook/html-vite": "9.1.15",
     "@types/jest": "29.5.14",
-    "@types/node": "22.18.0",
-    "chromatic": "13.1.4",
+    "@types/node": "22.18.12",
+    "chromatic": "13.3.2",
     "eslint": "8.57.1",
-    "eslint-plugin-storybook": "9.1.3",
+    "eslint-plugin-storybook": "9.1.15",
     "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.91.0",
-    "storybook": "9.1.3",
-    "storybook-addon-tag-badges": "2.0.2",
-    "typescript": "5.9.2",
-    "vite": "7.1.4",
-    "@mgdis/linting-stencil": "1.3.9",
-    "@core-ui/jest-config": "1.0.9"
+    "react": "19.2.0",
+    "react-dom": "19.2.0",
+    "sass": "1.93.2",
+    "storybook": "9.1.15",
+    "storybook-addon-tag-badges": "2.0.4",
+    "typescript": "5.9.3",
+    "vite": "7.1.12",
+    "@core-ui/jest-config": "1.0.9",
+    "@mgdis/linting-stencil": "1.3.10"
   },
   "license": "BSD-3-Clause",
   "scripts": {

package/dist/mg-components/p-54156253.entry.js

@@ -1 +0,0 @@
-import{r as t,c as i,h as s,a as e}from"./p-JHj_9FSs.js";import{P as o,C as n,f as a,a as h,n as r,g as c,t as p,b as m,i as u,c as l,d as g}from"./p-WtiuOkLj.js";import{c as d,a as b,w as v}from"./p-CNgv8hc5.js";import{i as f}from"./p-Bab8_u8S.js";import{K as w}from"./p-yMGqY8YG.js";const _=t=>t&&"object"==typeof t&&"string"==typeof t.title&&void 0!==t.value,x=class{constructor(s){t(this,s),this.valueChange=i(this,"value-change",7),this.filterChange=i(this,"filter-change",7),this.showMore=i(this,"load-more",7),this.inputValid=i(this,"input-valid",7),this.fetchError=i(this,"fetch-error",7),this.classFocus="mg-u-is-focused",this.hasDisplayedError=!1,this.name=this.identifier,this.labelOnTop=!1,this.labelHide=!1,this.required=!1,this.readonly=!1,this.disabled=!1,this.mgWidth="full",this.tooltipPosition="input",this.options=new o([]),this.filter="",this.classCollection=new n(["mg-c-input--combobox","mg-c-input--has-icon","mg-c-input--input-append"]),this.popoverDisplay=!1,this.handleOptionClick=t=>{this.setValue(this.options.items.find((i=>a(i.value)===t.target.id))),this.popoverDisplay=!1},this.handleResetButton=t=>{t.stopPropagation(),this.reset().then((()=>{this.input.focus()}))},this.handlePopoverDisplay=t=>{this.popoverDisplay=t.detail},this.handleFilterInput=()=>{this.checkValidity(),this.hasDisplayedError&&this.setErrorMessage(),this.popoverDisplay||(this.popoverDisplay=!0),this.debounce||(this.debounce=!0,setTimeout((()=>{this.filter=this.input.value,this.debounce=!1}),250))},this.handleFilterBlur=()=>{this.popoverDisplay||(this.handlerInProgress="blur",this.displayError().finally((()=>{this.handlerInProgress=void 0})))},this.handleFilterFocus=()=>{this.isLoading||(this.option=null)},this.handleLoadMoreButton=()=>{this.loadingWrapper({name:"load-more",cursor:h.NEXT}).then((()=>{this.input.focus()}))},this.handleFilterKeydown=t=>{var i;if(this.disabled||t.ctrlKey||t.shiftKey)return;let s=!1;switch(t.key){case w.TAB:case w.ENTER:s=t.key===w.ENTER;const e=null!==(i=this.option)&&void 0!==i?i:this.options.items.find(this.isCurrentOption);this.popoverDisplay&&this.setValue(e),this.popoverDisplay=!1;break;case w.DOWN:case w.ARROWDOWN:case w.UP:case w.ARROWUP:if(s=!0,this.isLoading||!(this.page.total>0)){this.popoverDisplay=!0;break}if(Boolean(t.altKey)&&[w.DOWN,w.ARROWDOWN].includes(t.key)){this.popoverDisplay=!0;break}let o;const n=this.popoverDisplay&&_(this.option);[w.DOWN,w.ARROWDOWN].includes(t.key)?o=n?h.NEXT:h.FIRST:[w.UP,w.ARROWUP].includes(t.key)&&(o=n?h.PREVIOUS:h.LAST),this.loadingWrapper({name:"scroll",cursor:o}),this.popoverDisplay=!0;break;case w.LEFT:case w.ARROWLEFT:case w.HOME:case w.RIGHT:case w.ARROWRIGHT:case w.END:if(!_(this.option))break;let a;s=!0,this.option=null,w.HOME===t.key?a=0:w.END===t.key&&(a=this.filter.length),"number"==typeof a&&this.input.setSelectionRange(a,a);break;case w.ESC:case w.ESCAPE:s=!0,this.popoverDisplay?this.popoverDisplay=!1:(this.setValue(null),this.filter="",this.option=null);break;default:this.option=null}s&&(t.stopPropagation(),t.preventDefault())},this.scrollToIndex=t=>{requestAnimationFrame((()=>{var i;this.popoverDisplay&&(null===(i=this.element.shadowRoot.querySelector(`li:nth-of-type(${(t||0)+this.page.baseIndex})`))||void 0===i||i.scrollIntoView({block:"nearest"}))}))},this.isCurrentOption=t=>(_(this.value)?this.value.value:this.value)===t.value,this.getValueTitle=()=>this.value&&_(this.value)?this.value.title:"string"==typeof this.value?this.value:"",this.checkValidity=()=>{this.setValidity(this.readonly||this.disabled||this.input.checkValidity())},this.setErrorMessage=t=>{this.errorMessage=void 0,this.valid||void 0===t?!this.valid&&this.input.validity.valueMissing&&(this.errorMessage=this.messages.errors.required):this.errorMessage=t},this.optionsFilter=t=>""===this.filter||t.title.toLocaleLowerCase().includes(this.filter.toLocaleLowerCase()),this.loadingWrapper=t=>{let i,s;if(Boolean(this.loadingAction)||(this.loadingAction=t.name),Boolean(this.option)&&"load-more"!==this.loadingAction?s=this.page.items.findIndex((t=>t.value.toString()===this.option.value.toString())):"load-more"===this.loadingAction&&(s=this.page.items.length-this.page.baseIndex),"load-more"===t.name)this.isLoading=!0,i=this.goToNextPage;else{if(t.cursor===h.NEXT&&this.page.items.length<=this.page.total&&s+this.page.baseIndex===this.page.items.length&&s+this.page.baseIndex<this.page.total)return void this.loadMoreElement.click();i="scroll"===t.name?r:this.updatePage}return i().then((()=>{const i=this.options.items.filter(this.optionsFilter);"load-data"!==t.name&&(s=this.page.getIndexFromCursor(t.cursor,"load-more"===this.loadingAction&&s>=0?i[s]:this.option)),this.option=i[s],this.scrollToIndex(s)})).finally((()=>{requestAnimationFrame((()=>{this.isLoading=!1,this.loadingAction=void 0}))}))},this.goToNextPage=()=>(this.showMore.emit(),Boolean(this.fetchurl)?this.getOptions("string"==typeof this.page.next?this.page.next:void 0).then((t=>{if(!Boolean(t))return;const i=[...this.page.items,...t.items];this.options=new o(i,{total:t.total,next:t.next,top:i.length})})):r((()=>{if("function"==typeof this.page.next){const t=this.page.next();this.page=new g(Object.assign(Object.assign({},t),{items:[...this.page.items,...t.items]}))}}))),this.updatePage=async()=>{if(Boolean(this.fetchurl))return this.getOptions().then((t=>{Boolean(t)&&(this.options=new o(t.items,{total:t.total,next:t.next,top:t.top}))}));this.page=this.options.getPage(0,this.optionsFilter)},this.getOptions=async(t=this.fetchurl)=>{const i=("string"==typeof t?t:t.toString()).replaceAll(this.fetchmappings.request.filter,encodeURIComponent(this.filter));try{const t=await fetch(i,this.fetchoptions);if(!t.ok)return void this.fetchError.emit(new Error(`${t.status} - ${t.statusText}`));const s=await t.json(),e=c(s,this.fetchmappings.response.items).map((t=>({title:c(t,this.fetchmappings.response.itemTitle),value:void 0!==this.fetchmappings.response.itemValue?c(t,this.fetchmappings.response.itemValue):t}))),o=Number(c(s,this.fetchmappings.response.total,0));let n=c(s,this.fetchmappings.response.next);if(URL.canParse(i)&&Boolean(n)&&!URL.canParse(n)){const t=new URL(i);t.pathname.endsWith(n.split("?")[0])&&(n=new URL(n,t).toString())}return{items:e,total:o,next:n,top:e.length}}catch(t){this.fetchError.emit(t)}}}watchValue(t){this.filter=this.getValueTitle(),this.valueChange.emit(t)}watchItems(t){if(!Boolean(this.fetchurl)||Boolean(t)){if(Boolean(this.fetchurl)&&Boolean(t))throw new Error(`<mg-input-combobox> prop "items" values cannot be use with "fetchurl" prop defined. Passed value: ${p(t)}.`);if(Array.isArray(t)&&0===t.length)this.options=new o([]);else if(m(t))this.options=new o(t.map((t=>({title:t,value:t}))),{total:t.length});else{if(i=t,!Array.isArray(i)||!i.every(_))throw new Error(`<mg-input-combobox> prop "items" values must be the same type, string or Option. Passed value: ${p(t)}.`);this.options=new o(t,{total:t.length})}var i}}watchIdentifier(t){Boolean(t)&&(this.popoverId=`${t}-popover`,this.element.dataset.mgPopoverGuard=this.popoverId)}watchReadonly(t){t?this.classCollection.add(d):this.classCollection.delete(d)}watchValidityChange(t,i,s){void 0!==this.input&&(this.input[s]=t,this.checkValidity(),this.hasDisplayedError&&(this.setErrorMessage(),this.hasDisplayedError=!1))}watchDisabled(t){t?this.classCollection.add(b):this.classCollection.delete(b)}watchMgWidth(t){v.forEach((t=>{this.classCollection.delete(`mg-c-input--width-${t}`)})),void 0!==t&&this.classCollection.add(`mg-c-input--width-${this.mgWidth}`),this.classCollection=new n(this.classCollection.classes)}watchFetchUrl(t){Boolean(t)&&this.loadingWrapper({name:"load-data"})}watchFetchOptions(t){if(this.fetchurl&&t&&!u(t))throw new Error(`<mg-input-combobox> prop "fetchoptions" value must be a valid RequestInit. Passed value: ${p(t)}.`);new Request(this.fetchurl,t)}watchFetchMappings(t){if(Boolean(this.fetchurl)&&!Boolean(t))throw new Error('<mg-input-combobox> prop "fetchmappings" is required with "fetchurl" prop.');if(Boolean(t)&&!(t=>{const i=u(t)&&Object.hasOwn(t,"request")&&Object.hasOwn(t,"response");if(i){const{request:i,response:s}=t;return![i,s].some((t=>!u(t)))&&"string"==typeof i.filter&&"object"==typeof s&&"string"==typeof s.total&&"string"==typeof s.items&&"string"==typeof s.next&&"string"==typeof s.itemTitle&&("string"==typeof s.itemValue||void 0===s.itemValue)}return i})(t))throw new Error(`<mg-input-combobox> prop "fetchmappings" value must be { request: RequestMappingType, response: ResponseMappingType }. Passed value: ${p(t)}.`)}watchOptions(t){this.page=t.getPage(0,Boolean(this.filter)?this.optionsFilter:void 0)}watchFilter(t){this.loadingWrapper({name:"load-data"}),this.filterChange.emit(t)}watchPopoverDisplay(t){t?(this.classCollection.add(this.classFocus),this.input.focus()):(this.option=null,this.filter=this.getValueTitle(),this.classCollection.delete(this.classFocus),this.handlerInProgress="blur",this.displayError().finally((()=>{this.handlerInProgress=void 0})))}async setFocus(){var t;null===(t=this.input)||void 0===t||t.focus()}displayError(){return new Promise((t=>{requestAnimationFrame((()=>{this.checkValidity(),this.setErrorMessage(),this.hasDisplayedError=this.invalid,t()}))}))}async setError(t,i){if("boolean"!=typeof t)throw new Error('<mg-input-combobox> method "setError()" param "valid" must be a boolean.');if(!l(i))throw new Error('<mg-input-combobox> method "setError()" param "errorMessage" must be a string.');this.setValidity(t),this.setErrorMessage(t?void 0:i),this.hasDisplayedError=this.invalid}async reset(){if(!this.readonly)return this.setValue(null),this.option=null,this.filter="",new Promise((t=>{requestAnimationFrame((()=>{this.checkValidity(),this.errorMessage=void 0,this.hasDisplayedError=!1,t()}))}))}setValue(t){this.value=_(t)?m(this.items||this.options.items)?t.title:Object.assign({},t):""}setValidity(t){const i=this.valid;this.valid=t,this.invalid=!this.valid,(void 0===this.handlerInProgress||"blur"===this.handlerInProgress&&this.valid!==i)&&this.inputValid.emit(this.valid)}componentWillLoad(){return this.messages=f(this.element).messages,this.watchIdentifier(this.identifier),this.watchItems(this.items),Boolean(this.fetchurl)&&(this.watchFetchOptions(this.fetchoptions),this.watchFetchMappings(this.fetchmappings),this.loadingWrapper({name:"load-data"})),this.watchValue(this.value),this.watchOptions(this.options),this.watchMgWidth(this.mgWidth),this.watchReadonly(this.readonly),this.watchDisabled(this.disabled),setTimeout((()=>{this.checkValidity()}),0)}render(){var t,i,e,o,n,h;const r=`${this.identifier}-list`,c=this.getValueTitle(),p=this.value&&!this.disabled;let m,u;return(null===(t=this.page)||void 0===t?void 0:t.items.length)>0?m="list":0===(null===(i=this.page)||void 0===i?void 0:i.items.length)&&Boolean(this.filter)?m="notfound":0===(null===(e=this.page)||void 0===e?void 0:e.items.length)&&(m="notavailable"),u=Boolean(null===(o=this.option)||void 0===o?void 0:o.value)?this.option.value:"string"==typeof this.value?this.value:null===(n=this.value)||void 0===n?void 0:n.value,s("mg-input",{key:"79e5263cd3b1c0fa0b3f386a547f2bdd48a33b28",label:this.label,identifier:this.identifier,class:this.classCollection.classes.join(" "),ariaDescribedbyIDs:m&&"list"!==m?m:void 0,labelOnTop:this.labelOnTop,labelHide:this.labelHide,required:this.required,tooltip:this.tooltip,tooltipPosition:this.readonly&&void 0===this.value?"label":this.tooltipPosition,helpText:this.helpText,errorMessage:this.errorMessage},this.readonly?c&&s("b",{class:"mg-c-input__readonly-value"},c):s("mg-popover",{identifier:this.popoverId,placement:"bottom-start",display:this.popoverDisplay,"arrow-hide":!0,style:{"--mg-c-input-list-width":Boolean(null===(h=this.input)||void 0===h?void 0:h.offsetWidth)?`${this.input.offsetWidth}px`:void 0},"data-fallback-placement":"bottom-end","onDisplay-change":this.handlePopoverDisplay},s("div",{class:"mg-c-input__input-group-container"},s("mg-icon",{icon:"magnifying-glass"}),s("input",{type:"text",role:"combobox",class:"mg-c-input__box mg-c-input__box--width",value:this.filter,id:this.identifier,name:this.name,placeholder:this.placeholder,title:this.placeholder,disabled:this.disabled,required:this.required,autocomplete:"off","aria-autocomplete":"list","aria-expanded":this.popoverDisplay.toString(),"aria-controls":r,"aria-invalid":(!0===this.invalid).toString(),"aria-activedescendant":a(u),onInput:this.handleFilterInput,onBlur:this.handleFilterBlur,onFocus:this.handleFilterFocus,onKeyDown:this.handleFilterKeydown,ref:t=>{null!==t&&(this.input=t)}}),p?s("mg-button",{class:"mg-c-input__box-append mg-c-input__reset",variant:"flat","is-icon":!0,label:this.messages.general.reset,"aria-controls":this.identifier,tabindex:"-1",onClick:this.handleResetButton},s("mg-icon",{icon:"cross"})):s("mg-button",{class:"mg-c-input__box-append",variant:"flat","is-icon":!0,label:this.itemsLabel,tabindex:"-1",disabled:this.disabled},s("mg-icon",{icon:"chevron-"+(this.popoverDisplay?"up":"down")}))),s("div",{slot:"content",class:"mg-c-input__popover-container"},"list"===m&&[s("ul",{key:"list",class:"mg-c-input__input-list",role:"listbox",id:r,"aria-label":this.itemsLabel,"aria-setsize":this.page.total},this.page.items.map((t=>{var i;return s("li",{role:"option",class:{"mg-c-input__input-list-item":!0,"mg-c-input__input-list-item--focus-visible":JSON.stringify(null===(i=this.option)||void 0===i?void 0:i.value)===JSON.stringify(t.value),"mg-c-input__input-list-item--selected":this.isCurrentOption(t)},key:t.title,id:a(t.value),"aria-selected":this.isCurrentOption(t).toString(),onClick:this.handleOptionClick},t.title,this.isCurrentOption(t)&&s("mg-icon",{icon:"check"}))}))),this.isLoading&&s("mg-loader",{key:"loader",message:this.messages.input.combobox.search,class:{"mg-u-visually-hidden":Boolean(this.page.next)}}),this.page.next&&s("mg-button",{key:"load-more",variant:"flat",class:"mg-c-input__load-more",tabIndex:-1,disabled:this.isLoading,"full-width":!0,"disable-on-click":!0,onClick:this.handleLoadMoreButton,"aria-controls":r,ref:t=>{null!==t&&(this.loadMoreElement=t)}},s("mg-icon",{icon:"chevron-down"}),this.messages.input.showMore)],"notfound"===m&&s("p",{id:m,class:"mg-c-input__popover-info"},this.messages.input.combobox.notFound),"notavailable"===m&&s("p",{id:m,class:"mg-c-input__popover-info"},this.messages.input.combobox.notAvailable))))}get element(){return e(this)}static get watchers(){return{value:["watchValue"],items:["watchItems"],identifier:["watchIdentifier"],readonly:["watchReadonly","watchValidityChange"],required:["watchValidityChange"],disabled:["watchValidityChange","watchDisabled"],mgWidth:["watchMgWidth"],fetchurl:["watchFetchUrl"],fetchoptions:["watchFetchOptions"],fetchmappings:["watchFetchMappings"],options:["watchOptions"],filter:["watchFilter"],popoverDisplay:["watchPopoverDisplay"]}}};x.style=".mg-c-input__box{height:var(--mg-b-size-min-height);box-sizing:border-box;padding:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2) var(--mg-b-size-8);border-width:var(--mg-c-input-border-width);border-style:solid;border-color:var(--mg-c-input-color-border);border-radius:var(--mg-c-input-border-radius);background-color:var(--mg-b-color-light);color:var(--mg-b-color-dark);font-family:inherit;font-size:var(--mg-b-font-size);text-align:var(--mg-c-input-text-align, left)}.mg-c-input__box::placeholder{color:var(--mg-c-input-placeholder-color-text);font-style:italic}.mg-c-input__box:focus{box-shadow:0 0 var(--mg-b-size-4) var(--mg-c-input-color-box-shadow-focus)}.mg-c-input__box:disabled{opacity:var(--mg-b-opacity-element-disabled)}.mg-c-input.mg-c-input--has-error .mg-c-input__box{border-color:var(--mg-b-color-danger)}.mg-c-input.mg-c-input--is-input-group-append{--mg-c-button-border-radius-top-left:0;--mg-c-button-border-radius-bottom-left:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box{margin-right:calc(-1*var(--mg-b-size-border));border-bottom-right-radius:0;border-top-right-radius:0}.mg-c-input.mg-c-input--is-input-group-append .mg-c-input__box:focus-visible{outline-offset:-0.2rem;outline-style:solid;outline-width:.2rem}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]){--mg-c-button-border-radius-top-right:0;--mg-c-button-border-radius-bottom-right:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:not(:last-of-type)){--mg-c-button-border-right-width:0}.mg-c-input.mg-c-input--has-buttons-group-append ::slotted([slot=append-input]:last-of-type){--mg-c-button-border-radius-top-right:var(--mg-c-input-border-radius);--mg-c-button-border-radius-bottom-right:var(--mg-c-input-border-radius)}.mg-c-input.mg-c-input--is-append-input-slot-content:not(.mg-c-input--readonly) ::slotted([slot=append-input]){align-self:start;padding-top:calc((var(--mg-b-size-min-height) - var(--mg-b-size-16))/2)}.mg-c-input.mg-c-input--has-icon .mg-c-input__with-character-left>mg-icon:first-of-type,.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container>mg-icon:first-of-type{position:absolute;top:50%;left:var(--mg-b-size-8);color:var(--mg-c-input-color-icon);transform:translateY(-50%)}.mg-c-input.mg-c-input--has-icon .mg-c-input__with-character-left .mg-c-input__box,.mg-c-input.mg-c-input--has-icon .mg-c-input__input-group-container .mg-c-input__box{padding-left:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2)}.mg-c-input__popover-info{padding:var(--mg-b-size-8);margin:0;color:var(--mg-b-color-neutral-90);text-align:center}.mg-c-input__input-container{width:100%;flex:1 auto}.mg-c-input.mg-c-input--width-full .mg-c-input__box{width:100%}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left,.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left{width:max-content}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:has(textarea),.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:has(textarea){flex-grow:inherit}.mg-c-input.mg-c-input--width-2 .mg-c-input__box{width:var(--mg-b-size-48)}.mg-c-input.mg-c-input--width-2 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-48) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-4 .mg-c-input__box{width:var(--mg-b-size-72)}.mg-c-input.mg-c-input--width-4 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(var(--mg-b-size-72) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-16 .mg-c-input__box{width:calc(26*var(--mg-b-size-8))}.mg-c-input.mg-c-input--width-16 .mg-c-input__with-character-left:not(:has(textarea)) .mg-c-input__box{width:calc(calc(26 * var(--mg-b-size-8)) + var(--mg-c-character-left-message-length)*(.35ch + .3rem))}.mg-c-input.mg-c-input--width-full:not(.mg-c-input--label-on-top){justify-content:stretch}.mg-c-input.mg-c-input--is-input-group-append ::slotted([slot=append-input]),.mg-c-input.mg-c-input--is-append-input-slot-content ::slotted([slot=append-input]){width:auto}:host(.mg-c-input.mg-c-input--width-full) ::slotted(*:not(mg-input-title)){width:100%;max-width:100%}.mg-c-input__readonly-value{min-height:var(--mg-b-font-size);align-self:flex-start;margin-top:calc((var(--mg-b-size-min-height) - var(--mg-b-font-size)*var(--mg-b-line-height))/2);overflow-wrap:anywhere}.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}}a{color:inherit;text-decoration:underline}a:hover,a:focus,a:active{text-decoration:none}.mg-c-input.mg-c-input--combobox mg-popover{--mg-c-card-overflow:hidden;--mg-c-popover-padding-vertical:0;--mg-c-popover-padding-horizontal:0}.mg-c-input.mg-c-input--combobox .mg-c-input__input-group-container{position:relative}.mg-c-input.mg-c-input--combobox .mg-c-input__box{cursor:pointer}.mg-c-input.mg-c-input--combobox .mg-c-input__popover-container{display:flex;min-width:var(--mg-c-input-list-width);max-height:calc(50*var(--mg-b-size-8) - var(--mg-b-size-32));flex-direction:column;gap:var(--mg-b-size-4);overflow-y:scroll}.mg-c-input.mg-c-input--combobox .mg-c-input__load-more{padding:0 var(--mg-b-size-8) var(--mg-b-size-4)}.mg-c-input.mg-c-input--combobox .mg-c-input__input-list{padding:0;margin:0;cursor:pointer;list-style:none}.mg-c-input.mg-c-input--combobox .mg-c-input__input-list-item{display:flex;padding:var(--mg-b-size-8)}.mg-c-input.mg-c-input--combobox .mg-c-input__input-list-item:hover,.mg-c-input.mg-c-input--combobox .mg-c-input__input-list-item.mg-c-input__input-list-item--focus-visible{background-color:var(--mg-b-color-neutral-20)}.mg-c-input.mg-c-input--combobox .mg-c-input__input-list-item.mg-c-input__input-list-item--selected{font-weight:700}.mg-c-input.mg-c-input--combobox .mg-c-input__input-list-item.mg-c-input__input-list-item--selected mg-icon{margin-left:auto}.mg-c-input.mg-c-input--combobox.mg-c-input--width-2 .mg-c-input__box{width:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2 + var(--mg-b-size-24) + var(--mg-b-size-min-height) + var(--mg-b-size-4))}.mg-c-input.mg-c-input--combobox.mg-c-input--width-4 .mg-c-input__box{width:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2 + var(--mg-b-size-48) + var(--mg-b-size-min-height) + var(--mg-b-size-4))}.mg-c-input.mg-c-input--combobox.mg-c-input--width-16 .mg-c-input__box{width:calc(var(--mg-b-size-16) + var(--mg-b-size-8)*2 + calc(23 * var(--mg-b-size-8)) + var(--mg-b-size-min-height) + var(--mg-b-size-4))}.mg-c-input.mg-c-input--combobox.mg-c-input--width-full mg-popover{--mg-c-popover-max-width:var(--mg-c-input-list-width, var(--mg-c-popover-max-width))}.mg-c-input.mg-c-input--combobox.mg-c-input--width-full .mg-c-input__input-group-container{display:flex;width:100%}.mg-c-input.mg-c-input--combobox.mg-c-input--width-full .mg-c-input__box{flex:1}.mg-c-input.mg-c-input--combobox.mg-c-input--input-append .mg-c-input__box{padding-right:calc(var(--mg-b-size-min-height) + var(--mg-b-size-4))}.mg-c-input.mg-c-input--combobox.mg-c-input--input-append .mg-c-input__box-append{position:absolute;top:0;right:0}";export{x as mg_input_combobox}

package/dist/mg-components/p-Bab8_u8S.js

@@ -1 +0,0 @@
-const e=/^\d{4}-(0[1-9]|1[0-2])-(0[1-9]|[12]\d|3[01])$/,t=e=>{const t={value:"2023",pattern:"yyyy"},a={value:"12",pattern:"mm"},l={value:"24",pattern:"dd"};return r([t.value,a.value,l.value].join("-"),e,{timeZone:"UTC"}).replace(t.value,t.pattern).replace(a.value,a.pattern).replace(l.value,l.pattern)},a=(e,t,a)=>new Intl.NumberFormat(t,{style:"currency",currency:a}).format(e),l=(e,t,a=0)=>new Intl.NumberFormat(t,{minimumFractionDigits:a}).format(Number(e)),s=(e,t,a=0)=>new Intl.NumberFormat(t,{style:"percent",minimumFractionDigits:a,maximumFractionDigits:a}).format(e),n=(e,t,a,l="short",s=0)=>new Intl.NumberFormat(t,{style:"unit",unit:a,unitDisplay:l,minimumFractionDigits:s,maximumFractionDigits:s}).format(e),r=(t,a,l)=>"string"==typeof t&&""!==t&&e.test(t)?new Intl.DateTimeFormat(a,l).format(new Date(t)):"",o=(i={en:{errors:{required:"This field is required."},nbCharLeft:"{counter} characters left.",input:{showMore:"Show more",select:{placeholder:"Select a value"},checkbox:{selectedValues:"{nb} selected values",selectedValue:"{nb} selected value",editButton:"Edit",selectButton:"Select values",showButton:"Show",sections:{label:'Values grouped by: "Selected" or "Available"',badge:{label:"value(s)"},search:{label:"Enter a value",values:"{count} value(s) found",noValue:"No values found"},selected:{title:"Selected",action:"Unselect all",tooltip:"Unselect all current values",values:"{count} value(s) selected",noValue:"No value selected"},notSelected:{title:"Available",action:"Select all",tooltip:"Select all current values",values:"{count} value(s) available",noValue:"All values are selected"}}},date:{pattern:{dd:"dd",mm:"mm",yyyy:"yyyy"},helpText:{expectedFormat:"Expected format: {pattern} (ex: {date})",min:"The date must be after or equal to {min}",max:"The date must be before or equal to {max}",minMax:"The date must be between {min} and {max}"},error:{badInput:"The date is inexistent or incorrect, the expected format is {pattern} (ex: {date})"}},numeric:{helpText:{min:"The value must be greater than or equal to {min}",max:"The value must be less than or equal to {max}",minMax:"The value must be between {min} and {max}"}},password:{display:"Display password value",hide:"Hide password value"},combobox:{notFound:"No value matches your input",notAvailable:"No value available",search:"Search…"},text:{helpText:{email:"Expected format: name@example.com",emails:"Expected format: first@example.com, second@example.com",url:"Expected format: https://example.com"},errors:{typeMismatch:{email:"The value is incorrect, the expected format is name@example.com",emails:"The value is incorrect, the expected format is first@example.com, second@example.com",url:"The value is incorrect, the expected format is https://example.com"}}}},form:{required:'Fields with a <strong class="mg-u-is-asterisk">*</strong> are required',requiredSingle:'Field with a <strong class="mg-u-is-asterisk">*</strong> is required',allRequired:"All fields are required",allRequiredSingle:"The field is required"},alert:{closeButton:"Close message"},modal:{closeButton:"Close modal"},pagination:{label:"Pagination",page:"page",pages:"pages",nextLabel:"Next page",previousLabel:"Previous page",selectPage:"Select the page to display."},panel:{editLabel:"Edit section title."},skipLinks:{navLabel:"Quick access"},general:{confirm:"Confirm",cancel:"Cancel",close:"Close",next:"Next",previous:"Previous",reset:"reset"},menuItem:{badgeLabel:"Include notification(s)",openNewTab:"Open link in a new tab"},itemMore:{menuLabel:"Additional menu"},actionMore:{label:"Actions"},loader:{inProgress:"Loading in progress…"},table:{sortableCaption:"(column headers with buttons are sortable)"}},fr:{errors:{required:"Ce champ est obligatoire."},nbCharLeft:"{counter} caractères disponibles.",input:{showMore:"Afficher plus",select:{placeholder:"Sélectionnez une valeur"},checkbox:{selectedValues:"{nb} valeurs sélectionnées",selectedValue:"{nb} valeur sélectionnée",editButton:"Modifier",selectButton:"Sélectionner des valeurs",showButton:"Voir",sections:{label:'Valeurs regroupées par: "Sélectionnées" ou "Disponibles"',badge:{label:"valeur(s)"},search:{label:"Saisissez une valeur",values:"{count} résultat(s)",noValue:"Aucune valeur n'a été trouvée."},selected:{title:"Sélectionnées",action:"Tout désélectionner",tooltip:"Désélectionne toutes les valeurs de la section",values:"{count} valeur(s) sélectionnée(s)",noValue:"Aucune valeur sélectionnée"},notSelected:{title:"Disponibles",action:"Tout sélectionner",tooltip:"Sélectionne toutes les valeurs de la section",values:"{count} valeur(s) disponible(s)",noValue:"Toutes les valeurs sont sélectionnées"}}},date:{pattern:{dd:"jj",mm:"mm",yyyy:"aaaa"},helpText:{expectedFormat:"Format attendu&nbsp;: {pattern} (ex&nbsp;: {date})",min:"La date doit être postérieure ou égale au {min}",max:"La date doit être antérieure ou égale au {max}",minMax:"La date doit être comprise entre le {min} et le {max}"},error:{badInput:"La date est inexistante ou incorrecte, le format attendu est {pattern} (ex&nbsp;: {date})"}},numeric:{helpText:{min:"La valeur doit être supérieure ou égale à {min}",max:"La valeur doit être inférieure ou égale à {max}",minMax:"La valeur doit être comprise entre {min} et {max}"}},password:{display:"Afficher le mot de passe",hide:"Masquer le mot de passe"},combobox:{notFound:"Aucune valeur ne correspondont à votre saisie",notAvailable:"Aucune valeur disponible",search:"Recherche…"},text:{helpText:{email:"Format attendu&nbsp;: nom@exemple.fr",emails:"Format attendu&nbsp;: premier@exemple.fr, second@exemple.fr",url:"Format attendu&nbsp;: https://exemple.fr"},errors:{typeMismatch:{email:"La valeur est incorrecte, le format attendu est nom@exemple.fr",emails:"La valeur est incorrecte, le format attendu est premier@exemple.fr, second@exemple.fr",url:"La valeur est incorrecte, le format attendu est https://exemple.fr"}}}},form:{required:'Les champs marqués d\'un <strong class="mg-u-is-asterisk">*</strong> sont obligatoires',requiredSingle:'Le champ marqué d\'un <strong class="mg-u-is-asterisk">*</strong> est obligatoire',allRequired:"Tous les champs sont obligatoires",allRequiredSingle:"Le champ est obligatoire"},alert:{closeButton:"Fermer le message"},modal:{closeButton:"Fermer la modale"},pagination:{label:"Pagination",page:"page",pages:"pages",nextLabel:"Page suivante",previousLabel:"Page précédente",selectPage:"Sélectionner la page à afficher."},panel:{editLabel:"Modifier le titre de la section."},skipLinks:{navLabel:"Accès rapide"},general:{confirm:"Valider",cancel:"Annuler",close:"Fermer",next:"Suivant",previous:"Précédent",reset:"réinitialiser"},menuItem:{badgeLabel:"Notification(s) incluse(s)",openNewTab:"Ouvrir le lien dans un nouvel onglet"},itemMore:{menuLabel:"Menu complémentaire"},actionMore:{label:"Actions"},loader:{inProgress:"Chargement en cours…"},table:{sortableCaption:"(les en-têtes de colonnes avec des boutons peuvent être triés)"}}},e=>((e,t,a)=>{const l=e.closest("[lang]"),s=Intl.NumberFormat.supportedLocalesOf(l?.lang),n=s.length>0&&"string"==typeof s[0]?s[0]:navigator.language||a,r=n.split("-").shift();return 0===Object.keys(t).length?{locale:n,messages:{lang:a}}:{locale:n,messages:t[r]??t[a]??{lang:a}}})(e,i,"en"));var i;export{t as a,l as b,n as c,s as d,a as e,o as i,r as l}