@mgdis/mg-components 5.28.1 → 5.29.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (106) hide show
  1. package/dist/cjs/{index-ce4f7698.js → index-8a3adbd1.js} +40 -8
  2. package/dist/cjs/index-8a3adbd1.js.map +1 -0
  3. package/dist/cjs/{index-d8721674.js → index-e1a25816.js} +48 -47
  4. package/dist/cjs/index-e1a25816.js.map +1 -0
  5. package/dist/cjs/loader.cjs.js +2 -2
  6. package/dist/cjs/mg-action-more_36.cjs.entry.js +112 -103
  7. package/dist/cjs/mg-action-more_36.cjs.entry.js.map +1 -1
  8. package/dist/cjs/mg-components.cjs.js +3 -3
  9. package/dist/cjs/mg-components.cjs.js.map +1 -1
  10. package/dist/cjs/mg-loader.cjs.entry.js +3 -3
  11. package/dist/collection/collection-manifest.json +2 -2
  12. package/dist/collection/components/atoms/mg-button/mg-button.js +2 -2
  13. package/dist/collection/components/atoms/mg-button/mg-button.js.map +1 -1
  14. package/dist/collection/components/molecules/inputs/mg-input-checkbox/MgInputCheckboxList.js +1 -3
  15. package/dist/collection/components/molecules/inputs/mg-input-checkbox/MgInputCheckboxList.js.map +1 -1
  16. package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.js +2 -3
  17. package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.js.map +1 -1
  18. package/dist/collection/components/molecules/inputs/mg-input-date/mg-input-date.js +1 -1
  19. package/dist/collection/components/molecules/inputs/mg-input-numeric/mg-input-numeric.js +1 -1
  20. package/dist/collection/components/molecules/inputs/mg-input-password/mg-input-password.js +1 -1
  21. package/dist/collection/components/molecules/inputs/mg-input-radio/mg-input-radio.js +18 -7
  22. package/dist/collection/components/molecules/inputs/mg-input-radio/mg-input-radio.js.map +1 -1
  23. package/dist/collection/components/molecules/inputs/mg-input-select/mg-input-select.js +3 -3
  24. package/dist/collection/components/molecules/inputs/mg-input-select/mg-input-select.js.map +1 -1
  25. package/dist/collection/components/molecules/inputs/mg-input-text/mg-input-text.js +1 -1
  26. package/dist/collection/components/molecules/inputs/mg-input-textarea/mg-input-textarea.js +1 -1
  27. package/dist/collection/components/molecules/mg-skip-links/mg-skip-links.js +1 -2
  28. package/dist/collection/components/molecules/mg-skip-links/mg-skip-links.js.map +1 -1
  29. package/dist/components/index.es.js +41 -40
  30. package/dist/components/index.es.js.map +1 -1
  31. package/dist/components/index2.js +2 -2
  32. package/dist/components/mg-action-more.js +2 -2
  33. package/dist/components/mg-badge2.js +3 -3
  34. package/dist/components/mg-button2.js +5 -5
  35. package/dist/components/mg-button2.js.map +1 -1
  36. package/dist/components/mg-card2.js +2 -2
  37. package/dist/components/mg-details.js +2 -2
  38. package/dist/components/mg-form.js +3 -3
  39. package/dist/components/mg-icon2.js +2 -2
  40. package/dist/components/mg-illustrated-message.js +2 -2
  41. package/dist/components/mg-input-checkbox-paginated2.js +1 -3
  42. package/dist/components/mg-input-checkbox-paginated2.js.map +1 -1
  43. package/dist/components/mg-input-checkbox.js +5 -5
  44. package/dist/components/mg-input-checkbox.js.map +1 -1
  45. package/dist/components/mg-input-date.js +11 -11
  46. package/dist/components/mg-input-numeric.js +5 -5
  47. package/dist/components/mg-input-password.js +3 -3
  48. package/dist/components/mg-input-radio.js +21 -9
  49. package/dist/components/mg-input-radio.js.map +1 -1
  50. package/dist/components/mg-input-select2.js +8 -8
  51. package/dist/components/mg-input-select2.js.map +1 -1
  52. package/dist/components/mg-input-text2.js +6 -6
  53. package/dist/components/mg-input-textarea.js +6 -6
  54. package/dist/components/mg-input-title2.js +2 -2
  55. package/dist/components/mg-input-toggle.js +4 -4
  56. package/dist/components/mg-input2.js +3 -3
  57. package/dist/components/mg-item-more2.js +3 -3
  58. package/dist/components/mg-loader.js +2 -2
  59. package/dist/components/mg-menu-item2.js +5 -5
  60. package/dist/components/mg-message.js +3 -3
  61. package/dist/components/mg-modal.js +6 -6
  62. package/dist/components/mg-pagination2.js +2 -2
  63. package/dist/components/mg-panel.js +4 -4
  64. package/dist/components/mg-popover-content2.js +3 -3
  65. package/dist/components/mg-popover2.js +3 -3
  66. package/dist/components/mg-skip-links.js +3 -3
  67. package/dist/components/mg-skip-links.js.map +1 -1
  68. package/dist/components/mg-tabs.js +6 -6
  69. package/dist/components/mg-tag.js +3 -3
  70. package/dist/components/mg-tooltip2.js +6 -6
  71. package/dist/esm/{index-9ed65b6d.js → index-0df3b137.js} +40 -8
  72. package/dist/esm/index-0df3b137.js.map +1 -0
  73. package/dist/esm/{index-817d7645.js → index-eed80cc2.js} +43 -42
  74. package/dist/esm/index-eed80cc2.js.map +1 -0
  75. package/dist/esm/loader.js +3 -3
  76. package/dist/esm/mg-action-more_36.entry.js +112 -103
  77. package/dist/esm/mg-action-more_36.entry.js.map +1 -1
  78. package/dist/esm/mg-components.js +4 -4
  79. package/dist/esm/mg-components.js.map +1 -1
  80. package/dist/esm/mg-loader.entry.js +3 -3
  81. package/dist/mg-components/mg-components.esm.js +1 -1
  82. package/dist/mg-components/mg-components.esm.js.map +1 -1
  83. package/dist/mg-components/{p-ef541188.entry.js → p-88f6c2f9.entry.js} +2 -2
  84. package/dist/mg-components/p-88f6c2f9.entry.js.map +1 -0
  85. package/dist/mg-components/{p-c4207303.entry.js → p-e5db08c5.entry.js} +2 -2
  86. package/dist/mg-components/p-efce3d8c.js +2 -0
  87. package/dist/mg-components/p-efce3d8c.js.map +1 -0
  88. package/dist/mg-components/p-f95b4418.js +3 -0
  89. package/dist/mg-components/p-f95b4418.js.map +1 -0
  90. package/dist/types/components/atoms/mg-button/mg-button.d.ts +1 -1
  91. package/dist/types/components/molecules/inputs/mg-input-radio/mg-input-radio.d.ts +5 -1
  92. package/dist/types/components/molecules/inputs/mg-input-select/mg-input-select.d.ts +1 -1
  93. package/dist/types/components.d.ts +10 -10
  94. package/ide/intellij/web-types.json +4 -4
  95. package/ide/vscode/html-custom-data.json +3 -3
  96. package/package.json +25 -26
  97. package/dist/cjs/index-ce4f7698.js.map +0 -1
  98. package/dist/cjs/index-d8721674.js.map +0 -1
  99. package/dist/esm/index-817d7645.js.map +0 -1
  100. package/dist/esm/index-9ed65b6d.js.map +0 -1
  101. package/dist/mg-components/p-06a9d801.js +0 -3
  102. package/dist/mg-components/p-06a9d801.js.map +0 -1
  103. package/dist/mg-components/p-eb6ec303.js +0 -2
  104. package/dist/mg-components/p-eb6ec303.js.map +0 -1
  105. package/dist/mg-components/p-ef541188.entry.js.map +0 -1
  106. /package/dist/mg-components/{p-c4207303.entry.js.map → p-e5db08c5.entry.js.map} +0 -0
@@ -2,8 +2,8 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const index = require('./index-ce4f7698.js');
6
- const index$1 = require('./index-d8721674.js');
5
+ const index = require('./index-8a3adbd1.js');
6
+ const index$1 = require('./index-e1a25816.js');
7
7
 
8
8
  /**
9
9
  * Available menu-item positions
@@ -79,7 +79,7 @@ const MgActionMore = class {
79
79
  ************/
80
80
  this.name = 'mg-action-more';
81
81
  this.classBase = 'mg-c-action-more';
82
- this.mgPopoverIdentifier = index$1.Ce(this.name);
82
+ this.mgPopoverIdentifier = index$1.ze(this.name);
83
83
  /************
84
84
  * Methods *
85
85
  ***********/
@@ -203,7 +203,7 @@ const MgBadge = class {
203
203
  this.label = undefined;
204
204
  this.variant = variants$5[0];
205
205
  this.outline = undefined;
206
- this.classCollection = new index$1.He(['mg-c-badge']);
206
+ this.classCollection = new index$1.Ie(['mg-c-badge']);
207
207
  }
208
208
  validateValue(newValue) {
209
209
  if (/^(\d+\+*|[?*!a-z])$/i.exec(`${newValue}`) === null) {
@@ -211,7 +211,7 @@ const MgBadge = class {
211
211
  }
212
212
  }
213
213
  validateLabel(newValue) {
214
- if (!index$1.Ie(newValue)) {
214
+ if (!index$1.Ze(newValue)) {
215
215
  throw new Error('<mg-badge> prop "label" is required.');
216
216
  }
217
217
  }
@@ -322,7 +322,7 @@ const MgButton = class {
322
322
  this.isIcon = false;
323
323
  this.disableOnClick = false;
324
324
  this.loading = false;
325
- this.classCollection = new index$1.He(['mg-c-button']);
325
+ this.classCollection = new index$1.Ie(['mg-c-button']);
326
326
  }
327
327
  validateVariant(newValue, oldValue) {
328
328
  if (!variants$4.includes(newValue)) {
@@ -381,7 +381,7 @@ const MgButton = class {
381
381
  this.validateFullWidth(this.fullWidth);
382
382
  if (this.isIcon) {
383
383
  this.classCollection.add(`mg-c-button--icon`);
384
- if (!index$1.Ie(this.label)) {
384
+ if (!index$1.Ze(this.label)) {
385
385
  throw new Error(`<mg-button> prop "label" is mandatory when prop "isIcon" is set to true.`);
386
386
  }
387
387
  }
@@ -393,7 +393,7 @@ const MgButton = class {
393
393
  * Add listners
394
394
  */
395
395
  componentDidLoad() {
396
- index$1.Ge(() => {
396
+ index$1.Ye(() => {
397
397
  var _a;
398
398
  const closestForm = this.element.closest('form') || ((_a = this.element.closest('mg-form')) === null || _a === void 0 ? void 0 : _a.shadowRoot.querySelector('form'));
399
399
  // submit buttons should trigger form submition;
@@ -410,7 +410,7 @@ const MgButton = class {
410
410
  */
411
411
  render() {
412
412
  var _a;
413
- return (index.h(index.Host, { key: '8aa45a51510eccbb021e452d540c77844f3f4792', role: "button", tabIndex: 0, type: this.type, form: this.form, "full-width": this.fullWidth, "aria-label": this.label, "aria-disabled": (_a = this.disabled) === null || _a === void 0 ? void 0 : _a.toString(), onClick: this.handleClick, onKeyup: this.handleKeyup, onKeydown: this.handleKeydown }, index.h("div", { key: '9743ead1b9fd1f70ef0690087806a1767c5825b0', class: this.classCollection.join(), id: this.identifier }, this.loading && index.h("mg-icon", { key: '543718fe45ad3e1901c4ef0c39b98705aa9fd64e', icon: "loader", spin: true }), index.h("div", { key: '21bc8c1a14f93db8b2373864a18da5c651e1ac4d', class: "mg-c-button__content" }, index.h("slot", { key: 'd16d710b4cb94ec1b7e3dfee2d4a70ee059528b4' })))));
413
+ return (index.h(index.Host, { key: '1b54d5a3ae7656215f0f60dcebf13caed4afe09e', role: "button", tabIndex: 0, type: this.type, form: this.form, "full-width": this.fullWidth, "aria-label": this.label, "aria-disabled": (_a = this.disabled) === null || _a === void 0 ? void 0 : _a.toString(), onClick: this.handleClick, onKeyup: this.handleKeyup, onKeydown: this.handleKeydown }, index.h("div", { key: 'ee66e5b1d78d7344634e736b39e29640de8c5755', class: this.classCollection.join(), id: this.identifier }, this.loading && index.h("mg-icon", { key: '6da3bfa9accafda3cf1d960d229bf3d75abc9250', icon: "loader", spin: true }), index.h("div", { key: '9ab6e8910210543fc7c0745d63f0e260003aa000', class: "mg-c-button__content" }, index.h("slot", { key: '44ba371bb96f86632f084610cdffb0b0fafa3980' })))));
414
414
  }
415
415
  get element() { return index.getElement(this); }
416
416
  static get watchers() { return {
@@ -452,7 +452,7 @@ const MgCard = class {
452
452
  };
453
453
  this.variant = undefined;
454
454
  this.variantStyle = undefined;
455
- this.classCollection = new index$1.He([this.classBase]);
455
+ this.classCollection = new index$1.Ie([this.classBase]);
456
456
  }
457
457
  validateVariant(newValue, oldValue) {
458
458
  if (newValue && !variants$3.includes(newValue))
@@ -557,7 +557,7 @@ const MgDetails = class {
557
557
  this.expanded = false;
558
558
  }
559
559
  validateTitles(newValue) {
560
- if (!index$1.Ie(newValue)) {
560
+ if (!index$1.Ze(newValue)) {
561
561
  throw new Error('<mg-details> prop "toggleClosed" and "toggleOpened" must be defined.');
562
562
  }
563
563
  }
@@ -715,7 +715,7 @@ const MgForm = class {
715
715
  }
716
716
  });
717
717
  };
718
- this.identifier = index$1.Ce('mg-form');
718
+ this.identifier = index$1.ze('mg-form');
719
719
  this.name = this.identifier;
720
720
  this.readonly = false;
721
721
  this.requiredMessage = undefined;
@@ -724,7 +724,7 @@ const MgForm = class {
724
724
  this.disabled = false;
725
725
  this.valid = undefined;
726
726
  this.invalid = undefined;
727
- this.classCollection = new index$1.He(['mg-c-form']);
727
+ this.classCollection = new index$1.Ie(['mg-c-form']);
728
728
  this.requiredMessageText = undefined;
729
729
  }
730
730
  validateRequiredMessage(newValue) {
@@ -865,7 +865,7 @@ const MgIcon = class {
865
865
  this.variant = undefined;
866
866
  this.variantStyle = undefined;
867
867
  this.spin = false;
868
- this.classCollection = new index$1.He(['mg-c-icon']);
868
+ this.classCollection = new index$1.Ie(['mg-c-icon']);
869
869
  }
870
870
  validateIcon(newValue, oldValue) {
871
871
  if (!Object.keys(icons).includes(newValue))
@@ -964,7 +964,7 @@ const MgIllustratedMessage = class {
964
964
  componentDidLoad() {
965
965
  const headingTags = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];
966
966
  const slottedIllustrations = this.element.querySelectorAll('[slot="illustration"]');
967
- if (!index$1.Be(this.element.querySelector('[slot="title"]'), headingTags)) {
967
+ if (!index$1.Xe(this.element.querySelector('[slot="title"]'), headingTags)) {
968
968
  throw new Error(`<mg-illustrated-message> Slotted title must be a heading: ${headingTags.join(', ')}`);
969
969
  }
970
970
  else if (slottedIllustrations.length !== 1) {
@@ -1065,7 +1065,7 @@ const MgInput = class {
1065
1065
  this.isVerticalList = false;
1066
1066
  }
1067
1067
  watchIdentifier(newValue) {
1068
- if (!index$1.Ie(newValue)) {
1068
+ if (!index$1.Ze(newValue)) {
1069
1069
  throw new Error('<mg-input> prop "identifier" is required.');
1070
1070
  }
1071
1071
  else {
@@ -1150,7 +1150,7 @@ const MgInput = class {
1150
1150
  */
1151
1151
  // eslint-disable-next-line @stencil-community/no-unused-watch
1152
1152
  watchLabel() {
1153
- if (!index$1.Ie(this.label)) {
1153
+ if (!index$1.Ze(this.label)) {
1154
1154
  throw new Error('<mg-input> prop "label" is required.');
1155
1155
  }
1156
1156
  else {
@@ -1305,9 +1305,7 @@ var SelectValuesButtonKey;
1305
1305
  * @param props - MgInputCheckboxList Interface Props
1306
1306
  * @returns input template
1307
1307
  */
1308
- const MgInputCheckboxList = (props) => (
1309
- // eslint-disable-next-line jsx-a11y/no-redundant-roles
1310
- index.h("ul", { class: "mg-c-input__input-group-container", role: "list", "aria-describedby": props.displaySearchInput ? 'search-results' : undefined, "aria-label": props.displaySearchInput ? props.messages.searchResults : undefined, "aria-live": props.displaySearchInput ? 'polite' : undefined, id: props.id }, props.checkboxes.map(input => {
1308
+ const MgInputCheckboxList = (props) => (index.h("ul", { class: "mg-c-input__input-group-container", role: "list", "aria-describedby": props.displaySearchInput ? 'search-results' : undefined, "aria-label": props.displaySearchInput ? props.messages.searchResults : undefined, "aria-live": props.displaySearchInput ? 'polite' : undefined, id: props.id }, props.checkboxes.map(input => {
1311
1309
  var _a, _b;
1312
1310
  return (index.h("li", { key: input._id, class: { 'mg-c-input__input-group': true, 'mg-c-input__input-group--disabled': props.disabled || input.disabled } },
1313
1311
  index.h("input", { type: "checkbox", id: input._id, name: props.name, value: (_a = input.value) === null || _a === void 0 ? void 0 : _a.toString(), checked: Boolean(input.value), required: input.required, "aria-invalid": ((_b = props.invalid) === null || _b === void 0 ? void 0 : _b.toString()) || 'false', disabled: props.disabled || input.disabled, indeterminate: input.value === null, onInput: input._handleInput, onBlur: input._handleBlur, onKeyDown: input._handleKeydown }),
@@ -1464,7 +1462,7 @@ const MgInputCheckbox = class {
1464
1462
  * Method to update searchResults
1465
1463
  */
1466
1464
  this.updateSearchResults = () => {
1467
- this.searchResults = this.checkboxItems.filter(item => index$1.qe(item.title).includes(index$1.qe(this.searchValue)));
1465
+ this.searchResults = this.checkboxItems.filter(item => index$1.Je(item.title).includes(index$1.Je(this.searchValue)));
1468
1466
  };
1469
1467
  /**
1470
1468
  * Method to validate if one of inputs value is checked id required
@@ -1538,7 +1536,7 @@ const MgInputCheckbox = class {
1538
1536
  this.helpText = undefined;
1539
1537
  this.valid = undefined;
1540
1538
  this.invalid = undefined;
1541
- this.classCollection = new index$1.He([this.baseClassName, classFieldset]);
1539
+ this.classCollection = new index$1.Ie([this.baseClassName, classFieldset]);
1542
1540
  this.errorMessage = undefined;
1543
1541
  this.checkboxItems = [];
1544
1542
  this.displaySearchInput = undefined;
@@ -1646,7 +1644,7 @@ const MgInputCheckbox = class {
1646
1644
  if (typeof valid !== 'boolean') {
1647
1645
  throw new Error('<mg-input-checkbox> method "setError()" param "valid" must be a boolean');
1648
1646
  }
1649
- else if (!index$1.Ie(errorMessage)) {
1647
+ else if (!index$1.Ze(errorMessage)) {
1650
1648
  throw new Error('<mg-input-checkbox> method "setError()" param "errorMessage" must be a string');
1651
1649
  }
1652
1650
  else {
@@ -1759,7 +1757,7 @@ const MgInputCheckbox = class {
1759
1757
  * @returns HTML Element
1760
1758
  */
1761
1759
  render() {
1762
- return (index.h("mg-input", { key: '619a108d13b49c7b74dded7afa759202aa909abb', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: !this.readonly ? this.required : undefined, readonlyValue: this.value.filter(({ value }) => value).map(({ title }) => title), tooltip: !this.readonly ? this.tooltip : undefined, tooltipPosition: this.tooltipPosition, helpText: !this.readonly ? this.helpText : undefined, errorMessage: !this.readonly ? this.errorMessage : undefined }, this.type === 'checkbox' || this.readonly ? (index.h(MgInputCheckboxList, { checkboxes: this.checkboxItems, displaySearchInput: this.displaySearchInput, messages: this.messages.input.checkbox, id: "checkboxes-list", disabled: this.disabled, name: this.name, invalid: this.invalid })) : (this.renderCheckboxMulti())));
1760
+ return (index.h("mg-input", { key: 'c0b23390de51d9be03440d1afbb0a058af4b8207', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: !this.readonly ? this.required : undefined, readonlyValue: this.value.filter(({ value }) => value).map(({ title }) => title), tooltip: !this.readonly ? this.tooltip : undefined, tooltipPosition: this.tooltipPosition, helpText: !this.readonly ? this.helpText : undefined, errorMessage: !this.readonly ? this.errorMessage : undefined }, this.type === 'checkbox' || this.readonly ? (index.h(MgInputCheckboxList, { checkboxes: this.checkboxItems, displaySearchInput: this.displaySearchInput, messages: this.messages.input.checkbox, id: "checkboxes-list", disabled: this.disabled, name: this.name, invalid: this.invalid })) : (this.renderCheckboxMulti())));
1763
1761
  }
1764
1762
  get element() { return index.getElement(this); }
1765
1763
  static get watchers() { return {
@@ -1909,7 +1907,7 @@ const MgInputDate = class {
1909
1907
  * @param value - value to test
1910
1908
  * @returns truthy when value match the pattern
1911
1909
  */
1912
- this.isValidPattern = (value) => index$1.Ie(value) && index$1.he.test(value);
1910
+ this.isValidPattern = (value) => index$1.Ze(value) && index$1.We.test(value);
1913
1911
  /**
1914
1912
  * Format help text to display
1915
1913
  * @param helpText - help text format
@@ -1917,10 +1915,10 @@ const MgInputDate = class {
1917
1915
  */
1918
1916
  this.formatHelpText = (helpText) => {
1919
1917
  const defaultHelpTextVariable = '{defaultHelpText}';
1920
- let text = index$1.Ie(helpText) ? helpText : this.messages.input.date.helpText;
1918
+ let text = index$1.Ze(helpText) ? helpText : this.messages.input.date.helpText;
1921
1919
  if (text.includes(defaultHelpTextVariable))
1922
1920
  text = text.replace(defaultHelpTextVariable, this.formatHelpText(this.messages.input.date.helpText));
1923
- return text.replace('{pattern}', this.renderPattern()).replace('{date}', index$1.ye(index$1.Ze(new Date('2023-12-24')), this.systemLocale));
1921
+ return text.replace('{pattern}', this.renderPattern()).replace('{date}', index$1.He(index$1.lt(new Date('2023-12-24')), this.systemLocale));
1924
1922
  };
1925
1923
  /**
1926
1924
  * Handle input event
@@ -2012,8 +2010,8 @@ const MgInputDate = class {
2012
2010
  // min, max & minMax
2013
2011
  else if ([InputError$1.MIN, InputError$1.MAX, InputError$1.MINMAX].includes(inputError)) {
2014
2012
  this.errorMessage = this.messages.errors.date[inputError]
2015
- .replace('{min}', index$1.ye(this.min, this.systemLocale))
2016
- .replace('{max}', index$1.ye(this.max, this.systemLocale));
2013
+ .replace('{min}', index$1.He(this.min, this.systemLocale))
2014
+ .replace('{max}', index$1.He(this.max, this.systemLocale));
2017
2015
  }
2018
2016
  // wrong date format
2019
2017
  // element.validity.badInput is default error message
@@ -2027,7 +2025,7 @@ const MgInputDate = class {
2027
2025
  * @returns translated html pattern
2028
2026
  */
2029
2027
  this.renderPattern = () => {
2030
- let patternLocal = index$1.Qe(this.systemLocale);
2028
+ let patternLocal = index$1.nt(this.systemLocale);
2031
2029
  for (const key in this.messages.input.date.pattern) {
2032
2030
  patternLocal = patternLocal.replace(key, this.messages.input.date.pattern[key]);
2033
2031
  }
@@ -2049,7 +2047,7 @@ const MgInputDate = class {
2049
2047
  this.helpText = undefined;
2050
2048
  this.valid = undefined;
2051
2049
  this.invalid = undefined;
2052
- this.classCollection = new index$1.He(['mg-c-input--date']);
2050
+ this.classCollection = new index$1.Ie(['mg-c-input--date']);
2053
2051
  this.errorMessage = undefined;
2054
2052
  }
2055
2053
  validateValue(newValue) {
@@ -2057,7 +2055,7 @@ const MgInputDate = class {
2057
2055
  if (newValue === '')
2058
2056
  newValue = null;
2059
2057
  // check value validity
2060
- if (newValue && !index$1.Ie(newValue)) {
2058
+ if (newValue && !index$1.Ze(newValue)) {
2061
2059
  throw new Error("<mg-input-date> props 'value' must be a valid string");
2062
2060
  }
2063
2061
  else if (!newValue || (newValue && this.isValidPattern(newValue))) {
@@ -2114,7 +2112,7 @@ const MgInputDate = class {
2114
2112
  if (typeof valid !== 'boolean') {
2115
2113
  throw new Error('<mg-input-date> method "setError()" param "valid" must be a boolean');
2116
2114
  }
2117
- else if (!index$1.Ie(errorMessage)) {
2115
+ else if (!index$1.Ze(errorMessage)) {
2118
2116
  throw new Error('<mg-input-date> method "setError()" param "errorMessage" must be a string');
2119
2117
  }
2120
2118
  else {
@@ -2168,7 +2166,7 @@ const MgInputDate = class {
2168
2166
  * @returns HTML Element
2169
2167
  */
2170
2168
  render() {
2171
- return (index.h("mg-input", { key: 'f38d79cb71311149b4d15885b65cd8f025dde15d', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, readonlyValue: index$1.ye(this.value, this.locale), tooltip: this.tooltip, tooltipPosition: this.tooltipPosition, helpText: this.formatHelpText(this.helpText), errorMessage: this.errorMessage }, index.h("input", { key: '67bf6f0ad58ee1a506ffd0d3d41d5954db68465c', type: "date", class: "mg-c-input__box", min: this.min, max: this.max, value: this.value, id: this.identifier, name: this.name, disabled: this.disabled, required: this.required, "aria-invalid": (this.invalid === true).toString(), onInput: this.handleInput, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown, ref: (el) => {
2169
+ return (index.h("mg-input", { key: 'f38d79cb71311149b4d15885b65cd8f025dde15d', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, readonlyValue: index$1.He(this.value, this.locale), tooltip: this.tooltip, tooltipPosition: this.tooltipPosition, helpText: this.formatHelpText(this.helpText), errorMessage: this.errorMessage }, index.h("input", { key: '67bf6f0ad58ee1a506ffd0d3d41d5954db68465c', type: "date", class: "mg-c-input__box", min: this.min, max: this.max, value: this.value, id: this.identifier, name: this.name, disabled: this.disabled, required: this.required, "aria-invalid": (this.invalid === true).toString(), onInput: this.handleInput, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown, ref: (el) => {
2172
2170
  if (el !== null)
2173
2171
  this.input = el;
2174
2172
  } })));
@@ -2299,9 +2297,9 @@ const MgInputNumeric = class {
2299
2297
  this.formatValue = (value) => {
2300
2298
  switch (this.format) {
2301
2299
  case 'number':
2302
- return index$1.Ye(value, this.locale, this.type === 'decimal' ? this.decimalLength : undefined);
2300
+ return index$1.at(value, this.locale, this.type === 'decimal' ? this.decimalLength : undefined);
2303
2301
  case 'currency':
2304
- return index$1.Je(value, this.locale, this.currency);
2302
+ return index$1.it(value, this.locale, this.currency);
2305
2303
  case 'none':
2306
2304
  return value.toString();
2307
2305
  }
@@ -2338,7 +2336,7 @@ const MgInputNumeric = class {
2338
2336
  this.decimalLength = 2;
2339
2337
  this.valid = undefined;
2340
2338
  this.invalid = undefined;
2341
- this.classCollection = new index$1.He(['mg-c-input--numeric']);
2339
+ this.classCollection = new index$1.Ie(['mg-c-input--numeric']);
2342
2340
  this.errorMessage = undefined;
2343
2341
  this.hasFocus = undefined;
2344
2342
  }
@@ -2434,7 +2432,7 @@ const MgInputNumeric = class {
2434
2432
  if (typeof valid !== 'boolean') {
2435
2433
  throw new Error('<mg-input-numeric> method "setError()" param "valid" must be a boolean');
2436
2434
  }
2437
- else if (!index$1.Ie(errorMessage)) {
2435
+ else if (!index$1.Ze(errorMessage)) {
2438
2436
  throw new Error('<mg-input-numeric> method "setError()" param "errorMessage" must be a string');
2439
2437
  }
2440
2438
  else {
@@ -2627,7 +2625,7 @@ const MgInputPassword = class {
2627
2625
  this.helpText = undefined;
2628
2626
  this.valid = undefined;
2629
2627
  this.invalid = undefined;
2630
- this.classCollection = new index$1.He(['mg-c-input--password']);
2628
+ this.classCollection = new index$1.Ie(['mg-c-input--password']);
2631
2629
  this.errorMessage = undefined;
2632
2630
  this.displayPassword = false;
2633
2631
  }
@@ -2685,7 +2683,7 @@ const MgInputPassword = class {
2685
2683
  if (typeof valid !== 'boolean') {
2686
2684
  throw new Error('<mg-input-password> method "setError()" param "valid" must be a boolean');
2687
2685
  }
2688
- else if (!index$1.Ie(errorMessage)) {
2686
+ else if (!index$1.Ze(errorMessage)) {
2689
2687
  throw new Error('<mg-input-password> method "setError()" param "errorMessage" must be a string');
2690
2688
  }
2691
2689
  else {
@@ -2832,11 +2830,22 @@ const MgInputRadio = class {
2832
2830
  this.helpText = undefined;
2833
2831
  this.valid = undefined;
2834
2832
  this.invalid = undefined;
2835
- this.classCollection = new index$1.He(['mg-c-input--radio', classFieldset]);
2833
+ this.classCollection = new index$1.Ie(['mg-c-input--radio', classFieldset]);
2836
2834
  this.errorMessage = undefined;
2837
2835
  this.options = undefined;
2836
+ this.readonlyValue = undefined;
2838
2837
  }
2839
- handleValue(newValue) {
2838
+ watchValue(newValue) {
2839
+ var _a;
2840
+ if (index$1.Ge(this.items) && typeof newValue === 'string') {
2841
+ this.readonlyValue = newValue;
2842
+ }
2843
+ else if (this.items.every(isOption$2)) {
2844
+ this.readonlyValue = (_a = this.items.find(item => item.value === newValue)) === null || _a === void 0 ? void 0 : _a.title;
2845
+ }
2846
+ else {
2847
+ this.readonlyValue = null;
2848
+ }
2840
2849
  this.valueChange.emit(newValue);
2841
2850
  }
2842
2851
  validateItems(newValue) {
@@ -2845,7 +2854,7 @@ const MgInputRadio = class {
2845
2854
  throw new Error('<mg-input-radio> prop "items" require at least 2 items.');
2846
2855
  }
2847
2856
  // String array
2848
- else if (index$1.Pe(newValue)) {
2857
+ else if (index$1.Ge(newValue)) {
2849
2858
  this.options = newValue.map(item => ({ title: item, value: item, disabled: this.disabled }));
2850
2859
  }
2851
2860
  // Object array
@@ -2904,7 +2913,7 @@ const MgInputRadio = class {
2904
2913
  if (typeof valid !== 'boolean') {
2905
2914
  throw new Error('<mg-input-radio> method "setError()" param "valid" must be a boolean');
2906
2915
  }
2907
- else if (!index$1.Ie(errorMessage)) {
2916
+ else if (!index$1.Ze(errorMessage)) {
2908
2917
  throw new Error('<mg-input-radio> method "setError()" param "errorMessage" must be a string');
2909
2918
  }
2910
2919
  else {
@@ -2940,6 +2949,7 @@ const MgInputRadio = class {
2940
2949
  this.watchInputVerticalList(this.inputVerticalList);
2941
2950
  this.watchReadonly(this.readonly);
2942
2951
  this.watchDisabled(this.disabled);
2952
+ this.watchValue(this.value);
2943
2953
  // Check validity when component is ready
2944
2954
  // return a promise to process action only in the FIRST render().
2945
2955
  // https://stenciljs.com/docs/component-lifecycle#componentwillload
@@ -2952,15 +2962,14 @@ const MgInputRadio = class {
2952
2962
  * @returns HTML Element
2953
2963
  */
2954
2964
  render() {
2955
- var _a;
2956
- return (index.h("mg-input", { key: 'a987bc86a4bf97aead796cd7c91110cc0e3c90df', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, readonlyValue: (_a = this.value) === null || _a === void 0 ? void 0 : _a.toString(), tooltip: this.tooltip, tooltipPosition: this.tooltipPosition, helpText: this.helpText, errorMessage: this.errorMessage }, index.h("ul", { key: 'e5e249a744ecb1f09cdbe7f9ec9d8f44b8b20ece', class: "mg-c-input__input-group-container", role: "list" }, this.options.map((input, index$1) => (index.h("li", { key: input.title, class: { 'mg-c-input__input-group': true, 'mg-c-input__input-group--disabled': this.disabled || input.disabled } }, index.h("input", { type: "radio", id: this.identifier + '_' + index$1, name: this.identifier, value: index$1, checked: JSON.stringify(this.value) === JSON.stringify(this.options[index$1].value), disabled: this.disabled || input.disabled, required: this.required, onBlur: this.handleBlur, onInput: this.handleInput, ref: (el) => {
2965
+ return (index.h("mg-input", { key: '5c091907a3ac41d272fe2486de715f3a0bd59565', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, readonlyValue: this.readonlyValue, tooltip: this.tooltip, tooltipPosition: this.tooltipPosition, helpText: this.helpText, errorMessage: this.errorMessage }, index.h("ul", { key: 'bae1b7f3b6310dcd22448928117e77763c158070', class: "mg-c-input__input-group-container", role: "list" }, this.options.map((input, index$1) => (index.h("li", { key: input.title, class: { 'mg-c-input__input-group': true, 'mg-c-input__input-group--disabled': this.disabled || input.disabled } }, index.h("input", { type: "radio", id: this.identifier + '_' + index$1, name: this.identifier, value: index$1, checked: JSON.stringify(this.value) === JSON.stringify(this.options[index$1].value), disabled: this.disabled || input.disabled, required: this.required, onBlur: this.handleBlur, onInput: this.handleInput, ref: (el) => {
2957
2966
  if (el !== null)
2958
2967
  this.inputs[index$1] = el;
2959
2968
  } }), index.h("label", { htmlFor: this.identifier + '_' + index$1 }, input.title)))))));
2960
2969
  }
2961
2970
  get element() { return index.getElement(this); }
2962
2971
  static get watchers() { return {
2963
- "value": ["handleValue"],
2972
+ "value": ["watchValue"],
2964
2973
  "items": ["validateItems"],
2965
2974
  "inputVerticalList": ["watchInputVerticalList"],
2966
2975
  "readonly": ["watchReadonly", "handleValidityChange"],
@@ -3051,7 +3060,7 @@ const MgInputSelect = class {
3051
3060
  if (this.input.value === '') {
3052
3061
  this.setValue(null);
3053
3062
  }
3054
- else if (index$1.Pe(this.items) && this.items.includes(this.input.value)) {
3063
+ else if (index$1.Ge(this.items) && this.items.includes(this.input.value)) {
3055
3064
  this.setValue(this.input.value);
3056
3065
  }
3057
3066
  else if (allItemsAreOptions(this.items) && typeof this.input.value === 'string' && this.items.some(this.isInputValue)) {
@@ -3125,7 +3134,7 @@ const MgInputSelect = class {
3125
3134
  this.helpText = undefined;
3126
3135
  this.valid = undefined;
3127
3136
  this.invalid = undefined;
3128
- this.classCollection = new index$1.He(['mg-c-input--select']);
3137
+ this.classCollection = new index$1.Ie(['mg-c-input--select']);
3129
3138
  this.errorMessage = undefined;
3130
3139
  this.options = undefined;
3131
3140
  this.valueExist = undefined;
@@ -3133,7 +3142,7 @@ const MgInputSelect = class {
3133
3142
  }
3134
3143
  validateValue(newValue) {
3135
3144
  var _a, _b;
3136
- if (index$1.Pe(this.items) && typeof newValue === 'string') {
3145
+ if (index$1.Ge(this.items) && typeof newValue === 'string') {
3137
3146
  this.readonlyValue = ((_a = this.input) === null || _a === void 0 ? void 0 : _a.value) ? this.input.value : newValue;
3138
3147
  }
3139
3148
  else if (allItemsAreOptions(this.items)) {
@@ -3150,7 +3159,7 @@ const MgInputSelect = class {
3150
3159
  this.options = [];
3151
3160
  }
3152
3161
  // String array
3153
- else if (index$1.Pe(newValue)) {
3162
+ else if (index$1.Ge(newValue)) {
3154
3163
  if (typeof this.value === 'string')
3155
3164
  this.valueExist = newValue.includes(this.value);
3156
3165
  this.options = newValue.map(item => ({ title: item, value: item }));
@@ -3222,7 +3231,7 @@ const MgInputSelect = class {
3222
3231
  if (typeof valid !== 'boolean') {
3223
3232
  throw new Error('<mg-input-select> method "setError()" param "valid" must be a boolean');
3224
3233
  }
3225
- else if (!index$1.Ie(errorMessage)) {
3234
+ else if (!index$1.Ze(errorMessage)) {
3226
3235
  throw new Error('<mg-input-select> method "setError()" param "errorMessage" must be a string');
3227
3236
  }
3228
3237
  else {
@@ -3275,11 +3284,11 @@ const MgInputSelect = class {
3275
3284
  * @returns HTML Element
3276
3285
  */
3277
3286
  render() {
3278
- return (index.h("mg-input", { key: 'b6e431b881062928dfff44b35b40e2c16a8c56fc', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, readonlyValue: this.readonlyValue, tooltip: this.tooltip, tooltipPosition: this.tooltipPosition, helpText: this.helpText, errorMessage: this.errorMessage }, index.h("select", { key: '964162aae800e85cf9801c67c264736061fd80c6', class: "mg-c-input__box", id: this.identifier, name: this.name, title: this.placeholder, disabled: this.disabled, required: this.required, "aria-invalid": (this.invalid === true).toString(), onInput: this.handleInput, onBlur: this.handleBlur, ref: (el) => {
3287
+ return (index.h("mg-input", { key: 'a5826f3afc824d081a9bef4237a1d0dbd440a2f3', label: this.label, identifier: this.identifier, class: this.classCollection.join(), ariaDescribedbyIDs: [], labelOnTop: this.labelOnTop, labelHide: this.labelHide, required: this.required, readonlyValue: this.readonlyValue, tooltip: this.tooltip, tooltipPosition: this.tooltipPosition, helpText: this.helpText, errorMessage: this.errorMessage }, index.h("select", { key: '709c0a75f1a644b306dcc37207369d0e3a9463e4', class: "mg-c-input__box", id: this.identifier, name: this.name, title: this.placeholder, disabled: this.disabled, required: this.required, "aria-invalid": (this.invalid === true).toString(), onInput: this.handleInput, onBlur: this.handleBlur, ref: (el) => {
3279
3288
  if (el !== null)
3280
3289
  this.input = el;
3281
3290
  } }, (!this.placeholderHide || !this.valueExist) && ( // In case passed value does not match any option we display the placeholder
3282
- index.h("option", { key: '9c24f8983858810541a0a626a5705ac9d05e26e0', value: "", disabled: this.placeholderDisabled && this.valueExist }, this.placeholder)), this.options.map(option => isOptGroup(option) ? (index.h("optgroup", { label: option.group, key: option.group }, option.options.map(this.renderOption))) : (isOption$1(option) && this.renderOption(option))))));
3291
+ index.h("option", { key: '9e5f8961c712a4bee4ffd1656ae89a78ced5181b', value: "", disabled: this.placeholderDisabled && this.valueExist }, this.placeholder)), this.options.map(option => isOptGroup(option) ? (index.h("optgroup", { label: option.group, key: option.group }, option.options.map(this.renderOption))) : (isOption$1(option) && this.renderOption(option))))));
3283
3292
  }
3284
3293
  get element() { return index.getElement(this); }
3285
3294
  static get watchers() { return {
@@ -3334,7 +3343,7 @@ const MgInputText = class {
3334
3343
  */
3335
3344
  this.handleFocus = () => {
3336
3345
  this.classCollection.add(this.classFocus);
3337
- this.classCollection = new index$1.He(this.classCollection.classes);
3346
+ this.classCollection = new index$1.Ie(this.classCollection.classes);
3338
3347
  };
3339
3348
  /**
3340
3349
  * Handle blur event
@@ -3342,7 +3351,7 @@ const MgInputText = class {
3342
3351
  this.handleBlur = () => {
3343
3352
  // Manage focus
3344
3353
  this.classCollection.delete(this.classFocus);
3345
- this.classCollection = new index$1.He(this.classCollection.classes);
3354
+ this.classCollection = new index$1.Ie(this.classCollection.classes);
3346
3355
  // Display Error
3347
3356
  this.handlerInProgress = Handler.BLUR;
3348
3357
  this.displayError().finally(() => {
@@ -3417,7 +3426,7 @@ const MgInputText = class {
3417
3426
  this.helpText = undefined;
3418
3427
  this.valid = undefined;
3419
3428
  this.invalid = undefined;
3420
- this.classCollection = new index$1.He(['mg-c-input--text']);
3429
+ this.classCollection = new index$1.Ie(['mg-c-input--text']);
3421
3430
  this.errorMessage = undefined;
3422
3431
  }
3423
3432
  handleValue(newValue) {
@@ -3468,7 +3477,7 @@ const MgInputText = class {
3468
3477
  this.classCollection.add(`mg-c-input--width-${this.mgWidth}`);
3469
3478
  }
3470
3479
  validatePattern(newValue) {
3471
- if (newValue !== undefined && !(index$1.Ie(this.pattern) && index$1.Ie(this.patternErrorMessage))) {
3480
+ if (newValue !== undefined && !(index$1.Ze(this.pattern) && index$1.Ze(this.patternErrorMessage))) {
3472
3481
  throw new Error('<mg-input-text> props "pattern" and "patternErrorMessage" must be non-empty string and paired.');
3473
3482
  }
3474
3483
  }
@@ -3498,7 +3507,7 @@ const MgInputText = class {
3498
3507
  if (typeof valid !== 'boolean') {
3499
3508
  throw new Error('<mg-input-text> method "setError()" param "valid" must be a boolean');
3500
3509
  }
3501
- else if (!index$1.Ie(errorMessage)) {
3510
+ else if (!index$1.Ze(errorMessage)) {
3502
3511
  throw new Error('<mg-input-text> method "setError()" param "errorMessage" must be a string');
3503
3512
  }
3504
3513
  else {
@@ -3607,7 +3616,7 @@ const MgInputTextarea = class {
3607
3616
  */
3608
3617
  this.handleFocus = () => {
3609
3618
  this.classCollection.add(this.classFocus);
3610
- this.classCollection = new index$1.He(this.classCollection.classes);
3619
+ this.classCollection = new index$1.Ie(this.classCollection.classes);
3611
3620
  };
3612
3621
  /**
3613
3622
  * Handle blur event
@@ -3615,7 +3624,7 @@ const MgInputTextarea = class {
3615
3624
  this.handleBlur = () => {
3616
3625
  // Manage focus
3617
3626
  this.classCollection.delete(this.classFocus);
3618
- this.classCollection = new index$1.He(this.classCollection.classes);
3627
+ this.classCollection = new index$1.Ie(this.classCollection.classes);
3619
3628
  // Display Error
3620
3629
  this.handlerInProgress = Handler.BLUR;
3621
3630
  this.displayError().finally(() => {
@@ -3678,7 +3687,7 @@ const MgInputTextarea = class {
3678
3687
  this.valid = undefined;
3679
3688
  this.invalid = undefined;
3680
3689
  this.resizable = 'none';
3681
- this.classCollection = new index$1.He(['mg-c-input--textarea']);
3690
+ this.classCollection = new index$1.Ie(['mg-c-input--textarea']);
3682
3691
  this.errorMessage = undefined;
3683
3692
  }
3684
3693
  handleValue(newValue) {
@@ -3717,7 +3726,7 @@ const MgInputTextarea = class {
3717
3726
  this.classCollection.add(`mg-c-input--width-${this.mgWidth}`);
3718
3727
  }
3719
3728
  validatePattern(newValue) {
3720
- if (newValue !== undefined && !(index$1.Ie(this.pattern) && index$1.Ie(this.patternErrorMessage))) {
3729
+ if (newValue !== undefined && !(index$1.Ze(this.pattern) && index$1.Ze(this.patternErrorMessage))) {
3721
3730
  throw new Error('<mg-input-textarea> props "pattern" and "patternErrorMessage" must be non-empty string and paired.');
3722
3731
  }
3723
3732
  }
@@ -3749,7 +3758,7 @@ const MgInputTextarea = class {
3749
3758
  if (typeof valid !== 'boolean') {
3750
3759
  throw new Error('<mg-input-textarea> method "setError()" param "valid" must be a boolean');
3751
3760
  }
3752
- else if (!index$1.Ie(errorMessage)) {
3761
+ else if (!index$1.Ze(errorMessage)) {
3753
3762
  throw new Error('<mg-input-textarea> method "setError()" param "errorMessage" must be a string');
3754
3763
  }
3755
3764
  else {
@@ -3838,7 +3847,7 @@ const MgInputTitle = class {
3838
3847
  this.tagName = 'label';
3839
3848
  }
3840
3849
  validateIdentifier(newValue) {
3841
- if (!index$1.Ie(newValue)) {
3850
+ if (!index$1.Ze(newValue)) {
3842
3851
  throw new Error('<mg-input-title> prop "identifier" is required.');
3843
3852
  }
3844
3853
  }
@@ -3952,7 +3961,7 @@ const MgInputToggle = class {
3952
3961
  this.tooltip = undefined;
3953
3962
  this.tooltipPosition = 'input';
3954
3963
  this.helpText = undefined;
3955
- this.classCollection = new index$1.He(['mg-c-input--toggle']);
3964
+ this.classCollection = new index$1.Ie(['mg-c-input--toggle']);
3956
3965
  this.options = undefined;
3957
3966
  this.errorMessage = undefined;
3958
3967
  this.valid = undefined;
@@ -3969,7 +3978,7 @@ const MgInputToggle = class {
3969
3978
  throw new Error('<mg-input-toggle> prop "items" require 2 items.');
3970
3979
  }
3971
3980
  // String array
3972
- else if (index$1.Pe(newValue)) {
3981
+ else if (index$1.Ge(newValue)) {
3973
3982
  this.options = newValue.map(item => ({ title: item, value: item }));
3974
3983
  }
3975
3984
  // Object array
@@ -4025,7 +4034,7 @@ const MgInputToggle = class {
4025
4034
  if (typeof valid !== 'boolean') {
4026
4035
  throw new Error('<mg-input-toggle> method "setError()" param "valid" must be a boolean');
4027
4036
  }
4028
- else if (!index$1.Ie(errorMessage)) {
4037
+ else if (!index$1.Ze(errorMessage)) {
4029
4038
  throw new Error('<mg-input-toggle> method "setError()" param "errorMessage" must be a string');
4030
4039
  }
4031
4040
  else {
@@ -4256,7 +4265,7 @@ const MgItemMore = class {
4256
4265
  if (!proxy)
4257
4266
  return;
4258
4267
  // remove proxy id to prevent duplicate key. default html id is: '';
4259
- if (index$1.Ie(proxy.id))
4268
+ if (index$1.Ze(proxy.id))
4260
4269
  proxy.id = '';
4261
4270
  const proxyClickHandler = () => {
4262
4271
  this.parentMenu
@@ -4300,7 +4309,7 @@ const MgItemMore = class {
4300
4309
  // create item-more menu items element from main menu-items clones
4301
4310
  this.moreElementMenuItem.querySelector('mg-menu').appendChild(child.cloneNode(true));
4302
4311
  // we need to get all `mg-menu-item` linked to the cloned one to set mirror process
4303
- index$1.Ge(() => {
4312
+ index$1.Ye(() => {
4304
4313
  if (child.querySelector('mg-menu')) {
4305
4314
  child.querySelectorAll('mg-menu-item').forEach(this.setProxyElement);
4306
4315
  }
@@ -4626,7 +4635,7 @@ const MgMenuItem = class {
4626
4635
  throw new Error(`<${this.name}> slot "label" is required.`);
4627
4636
  ['label', 'metadata'].forEach(slot => {
4628
4637
  Array.from(this.element.querySelectorAll(`[slot="${slot}"]`)).forEach(element => {
4629
- if (!index$1.Ie(element.textContent))
4638
+ if (!index$1.Ze(element.textContent))
4630
4639
  throw new Error(`<${this.name}> slot "${slot}" must have text content.`);
4631
4640
  if ((guard && element.getAttribute('title') === null) || !guard)
4632
4641
  element.setAttribute('title', element.textContent);
@@ -4695,13 +4704,13 @@ const MgMenuItem = class {
4695
4704
  * @returns HTML Element
4696
4705
  */
4697
4706
  this.renderSlot = () => index.h("slot", null);
4698
- this.identifier = index$1.Ce('mg-menu-item');
4707
+ this.identifier = index$1.ze('mg-menu-item');
4699
4708
  this.href = undefined;
4700
4709
  this.target = undefined;
4701
4710
  this.status = Status$1.VISIBLE;
4702
4711
  this.expanded = false;
4703
4712
  this.size = 'regular';
4704
- this.navigationButtonClassList = new index$1.He([this.navigationButton]);
4713
+ this.navigationButtonClassList = new index$1.Ie([this.navigationButton]);
4705
4714
  this.direction = undefined;
4706
4715
  this.isInMainMenu = undefined;
4707
4716
  this.isItemMore = undefined;
@@ -4848,7 +4857,7 @@ const MgMenuItem = class {
4848
4857
  * Emit event when component is updated
4849
4858
  */
4850
4859
  componentShouldUpdate() {
4851
- return index$1.Ge(() => {
4860
+ return index$1.Ye(() => {
4852
4861
  this.itemUpdated.emit();
4853
4862
  });
4854
4863
  }
@@ -4955,13 +4964,13 @@ const MgMessage = class {
4955
4964
  return 'exclamation-circle';
4956
4965
  }
4957
4966
  };
4958
- this.identifier = index$1.Ce('mg-message');
4967
+ this.identifier = index$1.ze('mg-message');
4959
4968
  this.delay = undefined;
4960
4969
  this.variant = variants$1[0];
4961
4970
  this.closeButton = false;
4962
4971
  this.hide = false;
4963
4972
  this.noAriaRole = undefined;
4964
- this.classCollection = new index$1.He(['mg-c-message']);
4973
+ this.classCollection = new index$1.Ie(['mg-c-message']);
4965
4974
  this.hasActions = false;
4966
4975
  }
4967
4976
  validateDelay(newValue) {
@@ -5104,12 +5113,12 @@ const MgModal = class {
5104
5113
  */
5105
5114
  this.setFocus = () => {
5106
5115
  // Get all focusable elements
5107
- const slottedFocusableElements = Array.from(this.element.querySelectorAll(index$1.We));
5116
+ const slottedFocusableElements = Array.from(this.element.querySelectorAll(index$1.Ke));
5108
5117
  // If close button is enabled or at least one of the slotted element is focusable
5109
5118
  if (this.closeButton || slottedFocusableElements.length > 0) {
5110
5119
  // Check if slotted focusable elements have shadowDom with focusable elements
5111
5120
  this.modalFocusableElements = slottedFocusableElements.reduce((acc, focusableElement) => {
5112
- acc.push(focusableElement.shadowRoot !== null ? focusableElement.shadowRoot.querySelector(index$1.We) || focusableElement : focusableElement);
5121
+ acc.push(focusableElement.shadowRoot !== null ? focusableElement.shadowRoot.querySelector(index$1.Ke) || focusableElement : focusableElement);
5113
5122
  return acc;
5114
5123
  }, []);
5115
5124
  // When close button is enabled it's the first focusable element.
@@ -5131,21 +5140,21 @@ const MgModal = class {
5131
5140
  this.handleClose = () => {
5132
5141
  this.hide = true;
5133
5142
  };
5134
- this.identifier = index$1.Ce('mg-modal');
5143
+ this.identifier = index$1.ze('mg-modal');
5135
5144
  this.dialogRole = dialogRoles[0];
5136
5145
  this.modalTitle = undefined;
5137
5146
  this.closeButton = false;
5138
5147
  this.hide = undefined;
5139
5148
  this.hasActions = false;
5140
5149
  this.hasContent = false;
5141
- this.classCollection = new index$1.He(['mg-c-modal']);
5150
+ this.classCollection = new index$1.Ie(['mg-c-modal']);
5142
5151
  }
5143
5152
  validateDialogRole(newValue) {
5144
5153
  if (!dialogRoles.includes(newValue))
5145
5154
  throw new Error(`<mg-modal> prop "dialogRole" must be one of: ${dialogRoles.join(', ')}.`);
5146
5155
  }
5147
5156
  validateModalTitle(newValue) {
5148
- if (!index$1.Ie(newValue)) {
5157
+ if (!index$1.Ze(newValue)) {
5149
5158
  throw new Error('<mg-modal> prop "modalTitle" is required.');
5150
5159
  }
5151
5160
  }
@@ -5292,7 +5301,7 @@ const MgPagination = class {
5292
5301
  this.handleGoToPage = (action, disabled) => {
5293
5302
  !disabled && this.goToPage(action === NavigationAction.NEXT ? this.currentPage + 1 : this.currentPage - 1);
5294
5303
  };
5295
- this.identifier = index$1.Ce('mg-pagination');
5304
+ this.identifier = index$1.ze('mg-pagination');
5296
5305
  this.label = undefined;
5297
5306
  this.hideNavigationLabels = undefined;
5298
5307
  this.hidePageCount = undefined;
@@ -5457,7 +5466,7 @@ const MgPanel = class {
5457
5466
  ];
5458
5467
  return this.titlePosition === 'right' ? children.reverse() : children;
5459
5468
  };
5460
- this.identifier = index$1.Ce('mg-panel');
5469
+ this.identifier = index$1.ze('mg-panel');
5461
5470
  this.panelTitle = undefined;
5462
5471
  this.titlePattern = undefined;
5463
5472
  this.titlePatternErrorMessage = undefined;
@@ -5466,12 +5475,12 @@ const MgPanel = class {
5466
5475
  this.expanded = false;
5467
5476
  this.expandToggleDisplay = expandToggleDisplays[0];
5468
5477
  this.expandToggleDisabled = undefined;
5469
- this.classCollection = new index$1.He(['mg-c-panel']);
5478
+ this.classCollection = new index$1.Ie(['mg-c-panel']);
5470
5479
  this.isEditing = false;
5471
5480
  this.updatedPanelTitle = undefined;
5472
5481
  }
5473
5482
  validatePanelTitle(newValue) {
5474
- if (!index$1.Ie(newValue))
5483
+ if (!index$1.Ze(newValue))
5475
5484
  throw new Error('<mg-panel> prop "panelTitle" is required.');
5476
5485
  this.titleChange.emit(newValue);
5477
5486
  }
@@ -7422,7 +7431,7 @@ const MgPopover = class {
7422
7431
  mgPopoverContent.setAttribute('id', this.identifier);
7423
7432
  }
7424
7433
  };
7425
- this.identifier = index$1.Ce('mg-popover');
7434
+ this.identifier = index$1.ze('mg-popover');
7426
7435
  this.placement = 'bottom';
7427
7436
  this.arrowHide = false;
7428
7437
  this.closeButton = false;
@@ -7465,7 +7474,7 @@ const MgPopover = class {
7465
7474
  */
7466
7475
  componentWillLoad() {
7467
7476
  // Get windows to attach events
7468
- this.windows = index$1.ze(window);
7477
+ this.windows = index$1.Qe(window);
7469
7478
  // render mg-popover-content slot
7470
7479
  this.renderPopoverContent();
7471
7480
  this.validateCloseButton(this.closeButton);
@@ -7557,7 +7566,7 @@ const MgPopoverContent = class {
7557
7566
  this.hideContent.emit();
7558
7567
  };
7559
7568
  this.closeButton = false;
7560
- this.classCollection = new index$1.He(['mg-c-popover-content']);
7569
+ this.classCollection = new index$1.Ie(['mg-c-popover-content']);
7561
7570
  }
7562
7571
  /*************
7563
7572
  * Lifecycle *
@@ -7575,7 +7584,7 @@ const MgPopoverContent = class {
7575
7584
  componentDidLoad() {
7576
7585
  const headingTags = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];
7577
7586
  const slottedTitleElement = this.element.querySelector('[slot="title"]');
7578
- if (slottedTitleElement && !index$1.Be(slottedTitleElement, headingTags)) {
7587
+ if (slottedTitleElement && !index$1.Xe(slottedTitleElement, headingTags)) {
7579
7588
  throw new Error(`<mg-popover> Slotted title must be a heading: ${headingTags.join(', ')}`);
7580
7589
  }
7581
7590
  }
@@ -7611,7 +7620,7 @@ const MgSkipLinks = class {
7611
7620
  this.links = undefined;
7612
7621
  }
7613
7622
  validateLinks(links) {
7614
- if (links === undefined || links.length === 0 || links.some(link => !index$1.Ie(link.href) || !link.href.startsWith('#') || !index$1.Ie(link.label))) {
7623
+ if (links === undefined || links.length === 0 || links.some(link => !index$1.Ze(link.href) || !link.href.startsWith('#') || !index$1.Ze(link.label))) {
7615
7624
  throw new Error(`<mg-skip-links> prop "links": Cannot be empty and each link must contains an href starting with a "#" and a non empty label attributes.`);
7616
7625
  }
7617
7626
  }
@@ -7630,7 +7639,7 @@ const MgSkipLinks = class {
7630
7639
  * @returns HTML Element
7631
7640
  */
7632
7641
  render() {
7633
- return (index.h("nav", { key: '2dac1b6dab0eb2634b803240325822ea3c8bae63', class: "mg-c-skip-links", role: "navigation", "aria-label": this.messages.skipLinks.navLabel }, index.h("ul", { key: 'e050de2426d080ede6a2b983ec0f9452b0e0f43b', class: "mg-c-skip-links__list", role: "list" }, this.links.map(link => (index.h("li", { key: link.href }, index.h("a", { class: "mg-c-skip-links__link", href: link.href, onClick: this.handleLinkCLick }, link.label)))))));
7642
+ return (index.h("nav", { key: 'e5a7020edfe2e491af48785f3d9fa9bede770ae5', class: "mg-c-skip-links", role: "navigation", "aria-label": this.messages.skipLinks.navLabel }, index.h("ul", { key: 'da692631900bb61269803e93718d0dacdb6a5e8a', class: "mg-c-skip-links__list", role: "list" }, this.links.map(link => (index.h("li", { key: link.href }, index.h("a", { class: "mg-c-skip-links__link", href: link.href, onClick: this.handleLinkCLick }, link.label)))))));
7634
7643
  }
7635
7644
  get element() { return index.getElement(this); }
7636
7645
  static get watchers() { return {
@@ -7763,7 +7772,7 @@ const MgTabs = class {
7763
7772
  */
7764
7773
  this.resetFocus = () => {
7765
7774
  // update asynchronously tabindex to prevent get focus on new tabindex at then end of event process
7766
- index$1.Ge(() => {
7775
+ index$1.Ye(() => {
7767
7776
  this.tabFocus = undefined;
7768
7777
  Array.from(this.element.shadowRoot.querySelectorAll('[data-index]')).forEach((tab, index) => {
7769
7778
  tab.setAttribute('tabindex', this.activeTab - this.startIndex !== index ? '-1' : '0');
@@ -7778,16 +7787,16 @@ const MgTabs = class {
7778
7787
  if (slots.length !== this.tabs.length)
7779
7788
  throw new Error('<mg-tabs> Must have slots counts equal to tabs count.');
7780
7789
  };
7781
- this.identifier = index$1.Ce('mg-tabs');
7790
+ this.identifier = index$1.ze('mg-tabs');
7782
7791
  this.label = undefined;
7783
7792
  this.size = 'regular';
7784
7793
  this.items = undefined;
7785
7794
  this.activeTab = undefined;
7786
7795
  this.tabs = [];
7787
- this.classCollection = new index$1.He(['mg-c-tabs']);
7796
+ this.classCollection = new index$1.Ie(['mg-c-tabs']);
7788
7797
  }
7789
7798
  validateLabel(newValue) {
7790
- if (!index$1.Ie(newValue)) {
7799
+ if (!index$1.Ze(newValue)) {
7791
7800
  throw new Error('<mg-tabs> prop "label" is required.');
7792
7801
  }
7793
7802
  }
@@ -7799,7 +7808,7 @@ const MgTabs = class {
7799
7808
  }
7800
7809
  validateItems(newValue) {
7801
7810
  // String array
7802
- if (index$1.Pe(newValue))
7811
+ if (index$1.Ge(newValue))
7803
7812
  this.tabs = newValue.map(item => ({ label: item, status: Status.VISIBLE }));
7804
7813
  // Object array
7805
7814
  else if (Array.isArray(newValue) && newValue.length > 0 && newValue.every(isTabItem))
@@ -7899,7 +7908,7 @@ const MgTag = class {
7899
7908
  this.variant = variants[0];
7900
7909
  this.outline = undefined;
7901
7910
  this.soft = undefined;
7902
- this.classCollection = new index$1.He(['mg-c-tag']);
7911
+ this.classCollection = new index$1.Ie(['mg-c-tag']);
7903
7912
  }
7904
7913
  validateVariant(newValue, oldValue) {
7905
7914
  if (!variants.includes(newValue)) {
@@ -7936,7 +7945,7 @@ const MgTag = class {
7936
7945
  * @param textContent - html element textContent property
7937
7946
  */
7938
7947
  validateTextContent(textContent) {
7939
- if (!index$1.Ie(textContent))
7948
+ if (!index$1.Ze(textContent))
7940
7949
  throw new Error('<mg-tag> slot must contain a text content.');
7941
7950
  }
7942
7951
  /*************
@@ -7996,7 +8005,7 @@ const MgTooltip = class {
7996
8005
  // Enable the event listeners
7997
8006
  this.popper.setOptions(options => (Object.assign(Object.assign({}, options), { modifiers: [...options.modifiers, { name: 'eventListeners', enabled: true }] })));
7998
8007
  // hide when click outside on nextTick to prevent event to trigger after creation
7999
- index$1.Ge(() => {
8008
+ index$1.Ye(() => {
8000
8009
  this.windows.forEach((localWindow) => {
8001
8010
  localWindow.addEventListener('click', this.handleClickOutside, false);
8002
8011
  localWindow.addEventListener('keydown', this.handlePressEscape, false);
@@ -8186,7 +8195,7 @@ const MgTooltip = class {
8186
8195
  element.setAttribute('aria-describedby', `${[...new Set([...ariaDescribedby.split(' '), this.identifier])].join(' ')}`);
8187
8196
  }
8188
8197
  };
8189
- this.identifier = index$1.Ce('mg-tooltip');
8198
+ this.identifier = index$1.ze('mg-tooltip');
8190
8199
  this.message = undefined;
8191
8200
  this.placement = 'bottom';
8192
8201
  this.display = false;
@@ -8197,7 +8206,7 @@ const MgTooltip = class {
8197
8206
  this.renderTooltipContent();
8198
8207
  }
8199
8208
  watchMessage(newValue) {
8200
- if (!index$1.Ie(newValue)) {
8209
+ if (!index$1.Ze(newValue)) {
8201
8210
  throw new Error('<mg-tooltip> prop "message" is required.');
8202
8211
  }
8203
8212
  this.mgTooltipContent.message = newValue;
@@ -8252,7 +8261,7 @@ const MgTooltip = class {
8252
8261
  */
8253
8262
  componentWillLoad() {
8254
8263
  // Get windows to attach events
8255
- this.windows = index$1.ze(window);
8264
+ this.windows = index$1.Qe(window);
8256
8265
  // Get tooltip element
8257
8266
  this.renderTooltipContent();
8258
8267
  //validate properties
@@ -8270,7 +8279,7 @@ const MgTooltip = class {
8270
8279
  // get slotted element wich is not the tooltip
8271
8280
  const slotElement = this.element.querySelector(`*:not(#${this.identifier})`);
8272
8281
  // Get interactive element
8273
- const interactiveElement = slotElement.matches(index$1.We) ? slotElement : (_a = slotElement.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(index$1.We);
8282
+ const interactiveElement = slotElement.matches(index$1.Ke) ? slotElement : (_a = slotElement.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(index$1.Ke);
8274
8283
  this.setTooltipedElement(interactiveElement || slotElement);
8275
8284
  // Check if slotted element is a disabled mg-button
8276
8285
  // In this case we wrap the mg-button into a div to enable the tooltip