@mgdis/mg-components 5.19.0 → 5.19.2

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 (157) hide show
  1. package/dist/cjs/loader.cjs.js +1 -1
  2. package/dist/cjs/mg-action-more_34.cjs.entry.js +84 -40
  3. package/dist/cjs/mg-action-more_34.cjs.entry.js.map +1 -1
  4. package/dist/cjs/mg-components.cjs.js +1 -1
  5. package/dist/cjs/mg-item-more.cjs.entry.js +2 -1
  6. package/dist/cjs/mg-item-more.cjs.entry.js.map +1 -1
  7. package/dist/collection/components/atoms/mg-badge/mg-badge.js +1 -1
  8. package/dist/collection/components/atoms/mg-badge/mg-badge.js.map +1 -1
  9. package/dist/collection/components/atoms/mg-button/mg-button.js +2 -1
  10. package/dist/collection/components/atoms/mg-button/mg-button.js.map +1 -1
  11. package/dist/collection/components/atoms/mg-card/mg-card.js +4 -4
  12. package/dist/collection/components/atoms/mg-card/mg-card.js.map +1 -1
  13. package/dist/collection/components/atoms/mg-icon/mg-icon.js +2 -2
  14. package/dist/collection/components/atoms/mg-icon/mg-icon.js.map +1 -1
  15. package/dist/collection/components/atoms/mg-input-title/mg-input-title.js +19 -1
  16. package/dist/collection/components/atoms/mg-input-title/mg-input-title.js.map +1 -1
  17. package/dist/collection/components/atoms/mg-input-title/test/mg-input-title.e2e.playwright.js +12 -0
  18. package/dist/collection/components/atoms/mg-input-title/test/mg-input-title.e2e.playwright.js.map +1 -0
  19. package/dist/collection/components/atoms/mg-input-title/test/mg-input-title.spec.js +1 -5
  20. package/dist/collection/components/atoms/mg-input-title/test/mg-input-title.spec.js.map +1 -1
  21. package/dist/collection/components/atoms/mg-tooltip/mg-tooltip.js +1 -1
  22. package/dist/collection/components/atoms/mg-tooltip/mg-tooltip.js.map +1 -1
  23. package/dist/collection/components/molecules/inputs/MgInput.js +3 -3
  24. package/dist/collection/components/molecules/inputs/MgInput.js.map +1 -1
  25. package/dist/collection/components/molecules/inputs/mg-input-checkbox/MgInputCheckboxList.js +4 -1
  26. package/dist/collection/components/molecules/inputs/mg-input-checkbox/MgInputCheckboxList.js.map +1 -1
  27. package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox-paginated/mg-input-checkbox-paginated.js +19 -1
  28. package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox-paginated/mg-input-checkbox-paginated.js.map +1 -1
  29. package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.conf.js.map +1 -1
  30. package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.js +6 -5
  31. package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.js.map +1 -1
  32. package/dist/collection/components/molecules/inputs/mg-input-checkbox/test/mg-input-checkbox.spec.js +5 -2
  33. package/dist/collection/components/molecules/inputs/mg-input-checkbox/test/mg-input-checkbox.spec.js.map +1 -1
  34. package/dist/collection/components/molecules/inputs/mg-input-date/mg-input-date.js +1 -1
  35. package/dist/collection/components/molecules/inputs/mg-input-date/mg-input-date.js.map +1 -1
  36. package/dist/collection/components/molecules/inputs/mg-input-numeric/mg-input-numeric.js +5 -4
  37. package/dist/collection/components/molecules/inputs/mg-input-numeric/mg-input-numeric.js.map +1 -1
  38. package/dist/collection/components/molecules/inputs/mg-input-password/mg-input-password.js +1 -1
  39. package/dist/collection/components/molecules/inputs/mg-input-password/mg-input-password.js.map +1 -1
  40. package/dist/collection/components/molecules/inputs/mg-input-select/mg-input-select.js +3 -3
  41. package/dist/collection/components/molecules/inputs/mg-input-select/mg-input-select.js.map +1 -1
  42. package/dist/collection/components/molecules/inputs/mg-input-text/mg-input-text.conf.js +3 -2
  43. package/dist/collection/components/molecules/inputs/mg-input-text/mg-input-text.conf.js.map +1 -1
  44. package/dist/collection/components/molecules/inputs/mg-input-text/mg-input-text.js +4 -10
  45. package/dist/collection/components/molecules/inputs/mg-input-text/mg-input-text.js.map +1 -1
  46. package/dist/collection/components/molecules/inputs/mg-input-text/test/mg-input-text.spec.js +1 -1
  47. package/dist/collection/components/molecules/inputs/mg-input-text/test/mg-input-text.spec.js.map +1 -1
  48. package/dist/collection/components/molecules/inputs/mg-input-textarea/mg-input-textarea.js +1 -1
  49. package/dist/collection/components/molecules/inputs/mg-input-textarea/mg-input-textarea.js.map +1 -1
  50. package/dist/collection/components/molecules/inputs/mg-input-toggle/mg-input-toggle.js +78 -2
  51. package/dist/collection/components/molecules/inputs/mg-input-toggle/mg-input-toggle.js.map +1 -1
  52. package/dist/collection/components/molecules/inputs/mg-input-toggle/test/mg-input-toggle.e2e.playwright.js +108 -0
  53. package/dist/collection/components/molecules/inputs/mg-input-toggle/test/mg-input-toggle.e2e.playwright.js.map +1 -0
  54. package/dist/collection/components/molecules/inputs/mg-input-toggle/test/mg-input-toggle.spec.js +44 -0
  55. package/dist/collection/components/molecules/inputs/mg-input-toggle/test/mg-input-toggle.spec.js.map +1 -1
  56. package/dist/collection/components/molecules/menu/mg-menu/mg-menu.js +1 -1
  57. package/dist/collection/components/molecules/menu/mg-menu/mg-menu.js.map +1 -1
  58. package/dist/collection/components/molecules/menu/mg-menu/test/{mg-menu.e2e.js → mg-menu.e2e.playwright.js} +67 -96
  59. package/dist/collection/components/molecules/menu/mg-menu/test/mg-menu.e2e.playwright.js.map +1 -0
  60. package/dist/collection/components/molecules/menu/mg-menu-item/test/mg-menu-item.e2e.playwright.js +100 -0
  61. package/dist/collection/components/molecules/menu/mg-menu-item/test/mg-menu-item.e2e.playwright.js.map +1 -0
  62. package/dist/collection/components/molecules/mg-action-more/mg-action-more.conf.js.map +1 -1
  63. package/dist/collection/components/molecules/mg-action-more/mg-action-more.js +1 -1
  64. package/dist/collection/components/molecules/mg-action-more/mg-action-more.js.map +1 -1
  65. package/dist/collection/components/molecules/mg-form/mg-form.js +2 -1
  66. package/dist/collection/components/molecules/mg-form/mg-form.js.map +1 -1
  67. package/dist/collection/components/molecules/mg-pagination/mg-pagination.js +1 -1
  68. package/dist/collection/components/molecules/mg-pagination/mg-pagination.js.map +1 -1
  69. package/dist/collection/components/molecules/mg-panel/mg-panel.js +1 -1
  70. package/dist/collection/components/molecules/mg-panel/mg-panel.js.map +1 -1
  71. package/dist/collection/utils/behaviors.utils.js +2 -1
  72. package/dist/collection/utils/behaviors.utils.js.map +1 -1
  73. package/dist/collection/utils/playwright.e2e.test.utils.js +3 -3
  74. package/dist/collection/utils/playwright.e2e.test.utils.js.map +1 -1
  75. package/dist/collection/utils/unit.test.utils.js +0 -3
  76. package/dist/collection/utils/unit.test.utils.js.map +1 -1
  77. package/dist/components/MgInput.js +3 -3
  78. package/dist/components/MgInput.js.map +1 -1
  79. package/dist/components/mg-action-more.js +1 -1
  80. package/dist/components/mg-action-more.js.map +1 -1
  81. package/dist/components/mg-badge2.js +1 -1
  82. package/dist/components/mg-badge2.js.map +1 -1
  83. package/dist/components/mg-button2.js +2 -1
  84. package/dist/components/mg-button2.js.map +1 -1
  85. package/dist/components/mg-card2.js +4 -4
  86. package/dist/components/mg-card2.js.map +1 -1
  87. package/dist/components/mg-form.js +2 -1
  88. package/dist/components/mg-form.js.map +1 -1
  89. package/dist/components/mg-icon2.js +2 -2
  90. package/dist/components/mg-icon2.js.map +1 -1
  91. package/dist/components/mg-input-checkbox-paginated2.js +9 -4
  92. package/dist/components/mg-input-checkbox-paginated2.js.map +1 -1
  93. package/dist/components/mg-input-checkbox.js +6 -5
  94. package/dist/components/mg-input-checkbox.js.map +1 -1
  95. package/dist/components/mg-input-date.js +1 -1
  96. package/dist/components/mg-input-date.js.map +1 -1
  97. package/dist/components/mg-input-numeric.js +5 -4
  98. package/dist/components/mg-input-numeric.js.map +1 -1
  99. package/dist/components/mg-input-password.js +1 -1
  100. package/dist/components/mg-input-password.js.map +1 -1
  101. package/dist/components/mg-input-select2.js +3 -3
  102. package/dist/components/mg-input-select2.js.map +1 -1
  103. package/dist/components/mg-input-text2.js +2 -2
  104. package/dist/components/mg-input-text2.js.map +1 -1
  105. package/dist/components/mg-input-textarea.js +1 -1
  106. package/dist/components/mg-input-textarea.js.map +1 -1
  107. package/dist/components/mg-input-title2.js +3 -1
  108. package/dist/components/mg-input-title2.js.map +1 -1
  109. package/dist/components/mg-input-toggle.js +41 -3
  110. package/dist/components/mg-input-toggle.js.map +1 -1
  111. package/dist/components/mg-item-more.js +2 -1
  112. package/dist/components/mg-item-more.js.map +1 -1
  113. package/dist/components/mg-menu2.js +1 -1
  114. package/dist/components/mg-menu2.js.map +1 -1
  115. package/dist/components/mg-pagination2.js +1 -1
  116. package/dist/components/mg-pagination2.js.map +1 -1
  117. package/dist/components/mg-panel.js +1 -1
  118. package/dist/components/mg-panel.js.map +1 -1
  119. package/dist/components/mg-tooltip2.js +1 -1
  120. package/dist/components/mg-tooltip2.js.map +1 -1
  121. package/dist/esm/loader.js +1 -1
  122. package/dist/esm/mg-action-more_34.entry.js +84 -40
  123. package/dist/esm/mg-action-more_34.entry.js.map +1 -1
  124. package/dist/esm/mg-components.js +1 -1
  125. package/dist/esm/mg-item-more.entry.js +2 -1
  126. package/dist/esm/mg-item-more.entry.js.map +1 -1
  127. package/dist/mg-components/mg-components.esm.js +1 -1
  128. package/dist/mg-components/mg-components.esm.js.map +1 -1
  129. package/dist/mg-components/p-01ebc95a.entry.js +2 -0
  130. package/dist/mg-components/p-01ebc95a.entry.js.map +1 -0
  131. package/dist/mg-components/p-71a5a848.entry.js +2 -0
  132. package/dist/mg-components/p-71a5a848.entry.js.map +1 -0
  133. package/dist/types/components/atoms/mg-input-title/mg-input-title.d.ts +4 -0
  134. package/dist/types/components/atoms/mg-input-title/test/mg-input-title.e2e.playwright.d.ts +1 -0
  135. package/dist/types/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox-paginated/mg-input-checkbox-paginated.d.ts +4 -0
  136. package/dist/types/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.conf.d.ts +1 -4
  137. package/dist/types/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.d.ts +2 -2
  138. package/dist/types/components/molecules/inputs/mg-input-text/mg-input-text.conf.d.ts +3 -6
  139. package/dist/types/components/molecules/inputs/mg-input-text/mg-input-text.d.ts +2 -2
  140. package/dist/types/components/molecules/inputs/mg-input-toggle/mg-input-toggle.d.ts +22 -0
  141. package/dist/types/components/molecules/inputs/mg-input-toggle/test/mg-input-toggle.e2e.playwright.d.ts +1 -0
  142. package/dist/types/components/molecules/menu/mg-menu/test/mg-menu.e2e.playwright.d.ts +1 -0
  143. package/dist/types/components/molecules/menu/mg-menu-item/test/mg-menu-item.e2e.playwright.d.ts +1 -0
  144. package/dist/types/components/molecules/mg-action-more/mg-action-more.conf.d.ts +1 -3
  145. package/dist/types/components.d.ts +26 -4
  146. package/package.json +6 -6
  147. package/dist/collection/components/atoms/mg-input-title/test/mg-input-title.e2e.js +0 -18
  148. package/dist/collection/components/atoms/mg-input-title/test/mg-input-title.e2e.js.map +0 -1
  149. package/dist/collection/components/molecules/inputs/mg-input-toggle/test/mg-input-toggle.e2e.js +0 -125
  150. package/dist/collection/components/molecules/inputs/mg-input-toggle/test/mg-input-toggle.e2e.js.map +0 -1
  151. package/dist/collection/components/molecules/menu/mg-menu/test/mg-menu.e2e.js.map +0 -1
  152. package/dist/collection/components/molecules/menu/mg-menu-item/test/mg-menu-item.e2e.js +0 -119
  153. package/dist/collection/components/molecules/menu/mg-menu-item/test/mg-menu-item.e2e.js.map +0 -1
  154. package/dist/mg-components/p-768fc594.entry.js +0 -2
  155. package/dist/mg-components/p-768fc594.entry.js.map +0 -1
  156. package/dist/mg-components/p-d2d6afec.entry.js +0 -2
  157. package/dist/mg-components/p-d2d6afec.entry.js.map +0 -1
@@ -17,7 +17,7 @@ const patchBrowser = () => {
17
17
  };
18
18
 
19
19
  patchBrowser().then(options => {
20
- return index.bootstrapLazy(JSON.parse("[[\"mg-action-more_34.cjs\",[[1,\"mg-input-checkbox\",{\"value\":[1040],\"type\":[1025],\"identifier\":[1],\"name\":[1],\"label\":[1],\"labelOnTop\":[4,\"label-on-top\"],\"labelHide\":[4,\"label-hide\"],\"inputVerticalList\":[4,\"input-vertical-list\"],\"required\":[4],\"readonly\":[4],\"displaySelectedValues\":[4,\"display-selected-values\"],\"disabled\":[4],\"tooltip\":[1],\"helpText\":[1,\"help-text\"],\"valid\":[1028],\"invalid\":[1028],\"classCollection\":[32],\"errorMessage\":[32],\"checkboxItems\":[32],\"displaySearchInput\":[32],\"searchValue\":[32],\"searchResults\":[32],\"displayError\":[64],\"setError\":[64]},null,{\"value\":[\"validateValue\"],\"type\":[\"validateType\"],\"displaySelectedValues\":[\"validateDisplaySelectedValues\"],\"required\":[\"handleValidityChange\"],\"readonly\":[\"handleValidityChange\"],\"disabled\":[\"handleValidityChange\",\"validateDisabled\"],\"checkboxItems\":[\"validateCheckboxItems\"],\"searchValue\":[\"validateSearchValue\"]}],[1,\"mg-action-more\",{\"icon\":[1040],\"button\":[16],\"items\":[16],\"displayChevron\":[4,\"display-chevron\"],\"expanded\":[32]},null,{\"icon\":[\"validateIcon\"],\"button\":[\"validateButton\"],\"items\":[\"validateItems\"],\"displayChevron\":[\"validateDisplayChevron\"]}],[1,\"mg-panel\",{\"identifier\":[1],\"panelTitle\":[1025,\"panel-title\"],\"titlePattern\":[1,\"title-pattern\"],\"titlePatternErrorMessage\":[1,\"title-pattern-error-message\"],\"titleEditable\":[1028,\"title-editable\"],\"titlePosition\":[1,\"title-position\"],\"expanded\":[1028],\"expandToggleDisplay\":[1,\"expand-toggle-display\"],\"expandToggleDisabled\":[4,\"expand-toggle-disabled\"],\"classCollection\":[32],\"isEditing\":[32],\"updatedPanelTitle\":[32]},null,{\"panelTitle\":[\"validatePanelTitle\"],\"titlePattern\":[\"validateTitlePattern\"],\"titlePatternErrorMessage\":[\"validateTitlePattern\"],\"titlePosition\":[\"validateTitlePosition\"],\"expanded\":[\"handleExpanded\"],\"expandToggleDisplay\":[\"validateExpandToggleDisplay\"]}],[1,\"mg-input-textarea\",{\"value\":[1537],\"identifier\":[1],\"name\":[1],\"label\":[1],\"labelOnTop\":[4,\"label-on-top\"],\"labelHide\":[4,\"label-hide\"],\"placeholder\":[1],\"maxlength\":[2],\"required\":[4],\"readonly\":[4],\"disabled\":[4],\"mgWidth\":[8,\"mg-width\"],\"pattern\":[1],\"patternErrorMessage\":[1,\"pattern-error-message\"],\"rows\":[2],\"tooltip\":[1],\"displayCharacterLeft\":[4,\"display-character-left\"],\"helpText\":[1,\"help-text\"],\"valid\":[1028],\"invalid\":[1028],\"resizable\":[1],\"classCollection\":[32],\"errorMessage\":[32],\"displayError\":[64],\"setError\":[64]},null,{\"value\":[\"handleValue\"],\"required\":[\"handleValidityChange\"],\"readonly\":[\"handleValidityChange\"],\"disabled\":[\"handleValidityChange\"],\"pattern\":[\"validatePattern\"],\"patternErrorMessage\":[\"validatePattern\"],\"displayCharacterLeft\":[\"validateDisplayCharacterLeft\"]}],[1,\"mg-input-date\",{\"value\":[1537],\"identifier\":[1],\"name\":[1],\"label\":[1],\"labelOnTop\":[4,\"label-on-top\"],\"labelHide\":[4,\"label-hide\"],\"required\":[4],\"readonly\":[4],\"disabled\":[4],\"tooltip\":[1],\"helpText\":[1,\"help-text\"],\"valid\":[1028],\"invalid\":[1028],\"min\":[1],\"max\":[1],\"classCollection\":[32],\"errorMessage\":[32],\"displayError\":[64],\"setError\":[64]},null,{\"value\":[\"validateValue\"],\"required\":[\"handleValidityChange\"],\"readonly\":[\"handleValidityChange\"],\"disabled\":[\"handleValidityChange\"],\"min\":[\"validateMinMax\"],\"max\":[\"validateMinMax\"]}],[1,\"mg-input-numeric\",{\"value\":[1537],\"identifier\":[1],\"name\":[1],\"label\":[1],\"labelOnTop\":[4,\"label-on-top\"],\"labelHide\":[4,\"label-hide\"],\"placeholder\":[1],\"required\":[4],\"readonly\":[4],\"disabled\":[4],\"mgWidth\":[8,\"mg-width\"],\"tooltip\":[1],\"helpText\":[1,\"help-text\"],\"type\":[1],\"currency\":[1],\"max\":[2],\"min\":[2],\"integerLength\":[2,\"integer-length\"],\"decimalLength\":[2,\"decimal-length\"],\"valid\":[1028],\"invalid\":[1028],\"classCollection\":[32],\"errorMessage\":[32],\"hasFocus\":[32],\"displayError\":[64],\"setError\":[64]},null,{\"value\":[\"validateValue\"],\"required\":[\"handleValidityChange\"],\"readonly\":[\"handleValidityChange\"],\"disabled\":[\"handleValidityChange\"],\"type\":[\"validateType\"],\"integerLength\":[\"validateIntegerLength\"],\"decimalLength\":[\"validateDecimalLength\"]}],[1,\"mg-input-password\",{\"value\":[1537],\"identifier\":[1],\"name\":[1],\"label\":[1],\"labelOnTop\":[4,\"label-on-top\"],\"labelHide\":[4,\"label-hide\"],\"placeholder\":[1],\"required\":[4],\"readonly\":[4],\"disabled\":[4],\"mgWidth\":[8,\"mg-width\"],\"tooltip\":[1],\"helpText\":[1,\"help-text\"],\"valid\":[1028],\"invalid\":[1028],\"classCollection\":[32],\"errorMessage\":[32],\"displayError\":[64],\"setError\":[64]},null,{\"value\":[\"handleValue\"],\"required\":[\"handleValidityChange\"],\"readonly\":[\"handleValidityChange\"],\"disabled\":[\"handleValidityChange\"]}],[1,\"mg-input-radio\",{\"value\":[1032],\"items\":[16],\"identifier\":[1],\"name\":[1],\"label\":[1],\"labelOnTop\":[4,\"label-on-top\"],\"labelHide\":[4,\"label-hide\"],\"inputVerticalList\":[4,\"input-vertical-list\"],\"required\":[4],\"readonly\":[4],\"disabled\":[4],\"tooltip\":[1],\"helpText\":[1,\"help-text\"],\"valid\":[1028],\"invalid\":[1028],\"classCollection\":[32],\"errorMessage\":[32],\"options\":[32],\"displayError\":[64],\"setError\":[64]},null,{\"value\":[\"handleValue\"],\"items\":[\"validateItems\"],\"required\":[\"handleValidityChange\"],\"readonly\":[\"handleValidityChange\"],\"disabled\":[\"handleValidityChange\"]}],[1,\"mg-input-toggle\",{\"value\":[1032],\"items\":[16],\"identifier\":[1],\"name\":[1],\"label\":[1],\"labelOnTop\":[4,\"label-on-top\"],\"labelHide\":[4,\"label-hide\"],\"isOnOff\":[4,\"is-on-off\"],\"isIcon\":[4,\"is-icon\"],\"readonly\":[4],\"disabled\":[4],\"tooltip\":[1],\"helpText\":[1,\"help-text\"],\"classCollection\":[32],\"options\":[32],\"checked\":[32]},null,{\"value\":[\"handleValue\"],\"items\":[\"validateItems\"],\"isOnOff\":[\"handleIsOnOff\"],\"isIcon\":[\"handleIsIcon\"],\"readonly\":[\"handleReadonly\"],\"disabled\":[\"handleDisabled\"],\"checked\":[\"handleChecked\"]}],[1,\"mg-message\",{\"identifier\":[1],\"delay\":[2],\"variant\":[1],\"closeButton\":[1028,\"close-button\"],\"hide\":[1028],\"classCollection\":[32],\"hasActions\":[32]},null,{\"delay\":[\"validateDelay\"],\"variant\":[\"validateVariant\"],\"closeButton\":[\"validateCloseButton\"],\"hide\":[\"validateHide\"]}],[1,\"mg-modal\",{\"identifier\":[1],\"dialogRole\":[1,\"dialog-role\"],\"modalTitle\":[1,\"modal-title\"],\"closeButton\":[4,\"close-button\"],\"hide\":[1028],\"hasActions\":[32],\"hasContent\":[32],\"classCollection\":[32]},[[8,\"keydown\",\"handleKeyDown\"]],{\"dialogRole\":[\"validateDialogRole\"],\"modalTitle\":[\"validateModalTitle\"],\"hide\":[\"validateHide\"]}],[1,\"mg-tabs\",{\"identifier\":[1],\"label\":[1],\"size\":[1],\"items\":[16],\"activeTab\":[1538,\"active-tab\"],\"tabs\":[32],\"classCollection\":[32]},null,{\"label\":[\"validateLabel\"],\"size\":[\"validateSize\"],\"items\":[\"validateItems\"],\"activeTab\":[\"validateActiveTab\"]}],[1,\"mg-details\",{\"toggleClosed\":[1,\"toggle-closed\"],\"toggleOpened\":[1,\"toggle-opened\"],\"hideSummary\":[4,\"hide-summary\"],\"expanded\":[1028]},null,{\"toggleClosed\":[\"validateTitles\"],\"toggleOpened\":[\"validateTitles\"],\"expanded\":[\"handleExpanded\"]}],[1,\"mg-divider\",{\"size\":[1]}],[1,\"mg-form\",{\"identifier\":[1],\"name\":[1],\"readonly\":[4],\"disabled\":[4],\"valid\":[1028],\"invalid\":[1028],\"classCollection\":[32],\"requiredMessage\":[32],\"displayError\":[64]},null,{\"readonly\":[\"handleAttributeChange\"],\"disabled\":[\"handleAttributeChange\"]}],[1,\"mg-illustrated-message\",{\"size\":[1],\"direction\":[1]}],[1,\"mg-skip-links\",{\"links\":[16]},null,{\"links\":[\"validateLinks\"]}],[1,\"mg-tag\",{\"variant\":[1],\"outline\":[4],\"soft\":[4],\"classCollection\":[32]},null,{\"variant\":[\"validateVariant\"],\"outline\":[\"validateOutline\"],\"soft\":[\"validateSoft\"]}],[2,\"mg-input-checkbox-paginated\",{\"readonly\":[4],\"disabled\":[4],\"name\":[1],\"checkboxes\":[16],\"sectionKind\":[1,\"section-kind\"],\"messages\":[16],\"titleKind\":[32],\"currentPage\":[32],\"expanded\":[32]},null,{\"checkboxes\":[\"validateCheckboxes\"],\"sectionKind\":[\"validateSectionKind\"]}],[1,\"mg-menu-item\",{\"identifier\":[1],\"href\":[1],\"status\":[1537],\"expanded\":[1028],\"size\":[32],\"navigationButtonClassList\":[32],\"direction\":[32],\"isInMainMenu\":[32],\"isItemMore\":[32],\"hasChildren\":[32],\"displayNotificationBadge\":[32]},null,{\"status\":[\"validateStatus\"],\"expanded\":[\"validateExpanded\"],\"size\":[\"validateSize\"],\"direction\":[\"validateDirection\"],\"hasChildren\":[\"validateHasChildren\"]}],[1,\"mg-pagination\",{\"identifier\":[1],\"label\":[1025],\"hideNavigationLabels\":[4,\"hide-navigation-labels\"],\"hidePageCount\":[4,\"hide-page-count\"],\"totalPages\":[2,\"total-pages\"],\"currentPage\":[1538,\"current-page\"]},null,{\"totalPages\":[\"validateTotalPages\"],\"currentPage\":[\"validateCurrentPage\"]}],[1,\"mg-input-text\",{\"value\":[1537],\"identifier\":[1],\"name\":[1],\"label\":[1],\"type\":[1],\"icon\":[1],\"labelOnTop\":[4,\"label-on-top\"],\"labelHide\":[4,\"label-hide\"],\"placeholder\":[1],\"datalistoptions\":[16],\"maxlength\":[2],\"required\":[4],\"readonly\":[4],\"disabled\":[4],\"mgWidth\":[8,\"mg-width\"],\"pattern\":[1],\"patternErrorMessage\":[1,\"pattern-error-message\"],\"tooltip\":[1],\"displayCharacterLeft\":[4,\"display-character-left\"],\"helpText\":[1,\"help-text\"],\"valid\":[1028],\"invalid\":[1028],\"classCollection\":[32],\"errorMessage\":[32],\"setFocus\":[64],\"displayError\":[64],\"setError\":[64]},null,{\"value\":[\"handleValue\"],\"icon\":[\"validateIcon\"],\"datalistoptions\":[\"validateDatalistoptions\"],\"required\":[\"handleValidityChange\"],\"readonly\":[\"handleValidityChange\"],\"disabled\":[\"handleValidityChange\"],\"pattern\":[\"validatePattern\"],\"patternErrorMessage\":[\"validatePattern\"]}],[1,\"mg-menu\",{\"label\":[1],\"direction\":[513],\"itemmore\":[16],\"size\":[1],\"isChildMenu\":[32]},null,{\"label\":[\"validateLabel\"],\"direction\":[\"validateDirection\"],\"itemmore\":[\"validateItemMore\"],\"size\":[\"validateSize\"]}],[1,\"mg-input-select\",{\"value\":[1032],\"items\":[16],\"identifier\":[1],\"name\":[1],\"label\":[1],\"labelOnTop\":[4,\"label-on-top\"],\"labelHide\":[4,\"label-hide\"],\"placeholder\":[1025],\"placeholderHide\":[4,\"placeholder-hide\"],\"placeholderDisabled\":[4,\"placeholder-disabled\"],\"required\":[4],\"readonly\":[4],\"disabled\":[4],\"mgWidth\":[520,\"mg-width\"],\"tooltip\":[1],\"helpText\":[1,\"help-text\"],\"valid\":[1028],\"invalid\":[1028],\"classCollection\":[32],\"errorMessage\":[32],\"options\":[32],\"valueExist\":[32],\"readonlyValue\":[32],\"displayError\":[64],\"setError\":[64]},null,{\"value\":[\"validateValue\"],\"items\":[\"validateItems\"],\"required\":[\"handleValidityChange\"],\"readonly\":[\"handleValidityChange\"],\"disabled\":[\"handleValidityChange\"]}],[1,\"mg-popover\",{\"identifier\":[1],\"placement\":[1],\"arrowHide\":[4,\"arrow-hide\"],\"closeButton\":[4,\"close-button\"],\"display\":[1028],\"disabled\":[4]},null,{\"identifier\":[\"validateIdentifier\"],\"arrowHide\":[\"validateArrowHide\"],\"closeButton\":[\"validateCloseButton\"],\"display\":[\"handleDisplay\"]}],[1,\"mg-badge\",{\"value\":[8],\"label\":[1],\"variant\":[1],\"outline\":[4],\"classCollection\":[32]},null,{\"value\":[\"validateValue\"],\"label\":[\"validateLabel\"],\"variant\":[\"validateVariant\"],\"outline\":[\"validateOutline\"]}],[2,\"mg-character-left\",{\"identifier\":[1],\"characters\":[1],\"maxlength\":[2]},null,{\"maxlength\":[\"validateMaxlength\"]}],[1,\"mg-popover-content\",{\"closeButton\":[4,\"close-button\"],\"classCollection\":[32]}],[1,\"mg-card\",{\"variant\":[1],\"variantStyle\":[1025,\"variant-style\"],\"classCollection\":[32]},null,{\"variant\":[\"validateVariant\"],\"variantStyle\":[\"validateVariantStyle\"]}],[1,\"mg-button\",{\"variant\":[1],\"identifier\":[1],\"label\":[1],\"type\":[1],\"fullWidth\":[4,\"full-width\"],\"form\":[1],\"disabled\":[1028],\"isIcon\":[4,\"is-icon\"],\"disableOnClick\":[4,\"disable-on-click\"],\"loading\":[32],\"classCollection\":[32]},null,{\"variant\":[\"validateVariant\"],\"fullWidth\":[\"validateFullWidth\"],\"disabled\":[\"disabledHandler\"],\"loading\":[\"loadingHandler\"]}],[1,\"mg-tooltip\",{\"identifier\":[1],\"message\":[1],\"placement\":[1],\"display\":[1028],\"disabled\":[4]},null,{\"identifier\":[\"validateIdentifier\"],\"message\":[\"validateMessage\"],\"display\":[\"handleDisplay\"],\"disabled\":[\"validateDisabled\"]}],[6,\"mg-input-title\",{\"identifier\":[1],\"required\":[4],\"isLegend\":[4,\"is-legend\"],\"tagName\":[32]},null,{\"identifier\":[\"validateIdentifier\"],\"isLegend\":[\"validateIsLegend\"]}],[1,\"mg-tooltip-content\",{\"message\":[1]}],[1,\"mg-icon\",{\"icon\":[1],\"size\":[1],\"variant\":[1],\"variantStyle\":[1025,\"variant-style\"],\"spin\":[4],\"classCollection\":[32]},null,{\"icon\":[\"validateIcon\"],\"size\":[\"validateSize\"],\"variant\":[\"validateVariant\"],\"variantStyle\":[\"validateVariantStyle\"],\"spin\":[\"handleSpin\"]}]]],[\"mg-item-more.cjs\",[[1,\"mg-item-more\",{\"icon\":[16],\"slotlabel\":[16],\"size\":[1],\"parentMenu\":[32]},null,{\"icon\":[\"validateIcon\"],\"slotlabel\":[\"validateSlotLabel\"],\"size\":[\"validateSize\"]}]]]]"), options);
20
+ return index.bootstrapLazy(JSON.parse("[[\"mg-action-more_34.cjs\",[[1,\"mg-input-checkbox\",{\"value\":[1040],\"type\":[1025],\"identifier\":[1],\"name\":[1],\"label\":[1],\"labelOnTop\":[4,\"label-on-top\"],\"labelHide\":[4,\"label-hide\"],\"inputVerticalList\":[4,\"input-vertical-list\"],\"required\":[4],\"readonly\":[4],\"displaySelectedValues\":[4,\"display-selected-values\"],\"disabled\":[4],\"tooltip\":[1],\"helpText\":[1,\"help-text\"],\"valid\":[1028],\"invalid\":[1028],\"classCollection\":[32],\"errorMessage\":[32],\"checkboxItems\":[32],\"displaySearchInput\":[32],\"searchValue\":[32],\"searchResults\":[32],\"displayError\":[64],\"setError\":[64]},null,{\"value\":[\"validateValue\"],\"type\":[\"validateType\"],\"displaySelectedValues\":[\"validateDisplaySelectedValues\"],\"required\":[\"handleValidityChange\"],\"readonly\":[\"handleValidityChange\"],\"disabled\":[\"handleValidityChange\",\"validateDisabled\"],\"checkboxItems\":[\"validateCheckboxItems\"],\"searchValue\":[\"validateSearchValue\"]}],[1,\"mg-action-more\",{\"icon\":[1040],\"button\":[16],\"items\":[16],\"displayChevron\":[4,\"display-chevron\"],\"expanded\":[32]},null,{\"icon\":[\"validateIcon\"],\"button\":[\"validateButton\"],\"items\":[\"validateItems\"],\"displayChevron\":[\"validateDisplayChevron\"]}],[1,\"mg-panel\",{\"identifier\":[1],\"panelTitle\":[1025,\"panel-title\"],\"titlePattern\":[1,\"title-pattern\"],\"titlePatternErrorMessage\":[1,\"title-pattern-error-message\"],\"titleEditable\":[1028,\"title-editable\"],\"titlePosition\":[1,\"title-position\"],\"expanded\":[1028],\"expandToggleDisplay\":[1,\"expand-toggle-display\"],\"expandToggleDisabled\":[4,\"expand-toggle-disabled\"],\"classCollection\":[32],\"isEditing\":[32],\"updatedPanelTitle\":[32]},null,{\"panelTitle\":[\"validatePanelTitle\"],\"titlePattern\":[\"validateTitlePattern\"],\"titlePatternErrorMessage\":[\"validateTitlePattern\"],\"titlePosition\":[\"validateTitlePosition\"],\"expanded\":[\"handleExpanded\"],\"expandToggleDisplay\":[\"validateExpandToggleDisplay\"]}],[1,\"mg-input-textarea\",{\"value\":[1537],\"identifier\":[1],\"name\":[1],\"label\":[1],\"labelOnTop\":[4,\"label-on-top\"],\"labelHide\":[4,\"label-hide\"],\"placeholder\":[1],\"maxlength\":[2],\"required\":[4],\"readonly\":[4],\"disabled\":[4],\"mgWidth\":[8,\"mg-width\"],\"pattern\":[1],\"patternErrorMessage\":[1,\"pattern-error-message\"],\"rows\":[2],\"tooltip\":[1],\"displayCharacterLeft\":[4,\"display-character-left\"],\"helpText\":[1,\"help-text\"],\"valid\":[1028],\"invalid\":[1028],\"resizable\":[1],\"classCollection\":[32],\"errorMessage\":[32],\"displayError\":[64],\"setError\":[64]},null,{\"value\":[\"handleValue\"],\"required\":[\"handleValidityChange\"],\"readonly\":[\"handleValidityChange\"],\"disabled\":[\"handleValidityChange\"],\"pattern\":[\"validatePattern\"],\"patternErrorMessage\":[\"validatePattern\"],\"displayCharacterLeft\":[\"validateDisplayCharacterLeft\"]}],[1,\"mg-input-date\",{\"value\":[1537],\"identifier\":[1],\"name\":[1],\"label\":[1],\"labelOnTop\":[4,\"label-on-top\"],\"labelHide\":[4,\"label-hide\"],\"required\":[4],\"readonly\":[4],\"disabled\":[4],\"tooltip\":[1],\"helpText\":[1,\"help-text\"],\"valid\":[1028],\"invalid\":[1028],\"min\":[1],\"max\":[1],\"classCollection\":[32],\"errorMessage\":[32],\"displayError\":[64],\"setError\":[64]},null,{\"value\":[\"validateValue\"],\"required\":[\"handleValidityChange\"],\"readonly\":[\"handleValidityChange\"],\"disabled\":[\"handleValidityChange\"],\"min\":[\"validateMinMax\"],\"max\":[\"validateMinMax\"]}],[1,\"mg-input-numeric\",{\"value\":[1537],\"identifier\":[1],\"name\":[1],\"label\":[1],\"labelOnTop\":[4,\"label-on-top\"],\"labelHide\":[4,\"label-hide\"],\"placeholder\":[1],\"required\":[4],\"readonly\":[4],\"disabled\":[4],\"mgWidth\":[8,\"mg-width\"],\"tooltip\":[1],\"helpText\":[1,\"help-text\"],\"type\":[1],\"currency\":[1],\"max\":[2],\"min\":[2],\"integerLength\":[2,\"integer-length\"],\"decimalLength\":[2,\"decimal-length\"],\"valid\":[1028],\"invalid\":[1028],\"classCollection\":[32],\"errorMessage\":[32],\"hasFocus\":[32],\"displayError\":[64],\"setError\":[64]},null,{\"value\":[\"validateValue\"],\"required\":[\"handleValidityChange\"],\"readonly\":[\"handleValidityChange\"],\"disabled\":[\"handleValidityChange\"],\"type\":[\"validateType\"],\"integerLength\":[\"validateIntegerLength\"],\"decimalLength\":[\"validateDecimalLength\"]}],[1,\"mg-input-password\",{\"value\":[1537],\"identifier\":[1],\"name\":[1],\"label\":[1],\"labelOnTop\":[4,\"label-on-top\"],\"labelHide\":[4,\"label-hide\"],\"placeholder\":[1],\"required\":[4],\"readonly\":[4],\"disabled\":[4],\"mgWidth\":[8,\"mg-width\"],\"tooltip\":[1],\"helpText\":[1,\"help-text\"],\"valid\":[1028],\"invalid\":[1028],\"classCollection\":[32],\"errorMessage\":[32],\"displayError\":[64],\"setError\":[64]},null,{\"value\":[\"handleValue\"],\"required\":[\"handleValidityChange\"],\"readonly\":[\"handleValidityChange\"],\"disabled\":[\"handleValidityChange\"]}],[1,\"mg-input-radio\",{\"value\":[1032],\"items\":[16],\"identifier\":[1],\"name\":[1],\"label\":[1],\"labelOnTop\":[4,\"label-on-top\"],\"labelHide\":[4,\"label-hide\"],\"inputVerticalList\":[4,\"input-vertical-list\"],\"required\":[4],\"readonly\":[4],\"disabled\":[4],\"tooltip\":[1],\"helpText\":[1,\"help-text\"],\"valid\":[1028],\"invalid\":[1028],\"classCollection\":[32],\"errorMessage\":[32],\"options\":[32],\"displayError\":[64],\"setError\":[64]},null,{\"value\":[\"handleValue\"],\"items\":[\"validateItems\"],\"required\":[\"handleValidityChange\"],\"readonly\":[\"handleValidityChange\"],\"disabled\":[\"handleValidityChange\"]}],[1,\"mg-input-toggle\",{\"value\":[1032],\"items\":[16],\"identifier\":[1],\"name\":[1],\"label\":[1],\"labelOnTop\":[4,\"label-on-top\"],\"labelHide\":[4,\"label-hide\"],\"isOnOff\":[4,\"is-on-off\"],\"isIcon\":[4,\"is-icon\"],\"readonly\":[4],\"disabled\":[4],\"tooltip\":[1],\"helpText\":[1,\"help-text\"],\"classCollection\":[32],\"options\":[32],\"errorMessage\":[32],\"valid\":[32],\"checked\":[32],\"setError\":[64]},null,{\"value\":[\"handleValue\"],\"items\":[\"validateItems\"],\"isOnOff\":[\"handleIsOnOff\"],\"isIcon\":[\"handleIsIcon\"],\"readonly\":[\"handleReadonly\"],\"disabled\":[\"handleDisabled\"],\"checked\":[\"handleChecked\"]}],[1,\"mg-message\",{\"identifier\":[1],\"delay\":[2],\"variant\":[1],\"closeButton\":[1028,\"close-button\"],\"hide\":[1028],\"classCollection\":[32],\"hasActions\":[32]},null,{\"delay\":[\"validateDelay\"],\"variant\":[\"validateVariant\"],\"closeButton\":[\"validateCloseButton\"],\"hide\":[\"validateHide\"]}],[1,\"mg-modal\",{\"identifier\":[1],\"dialogRole\":[1,\"dialog-role\"],\"modalTitle\":[1,\"modal-title\"],\"closeButton\":[4,\"close-button\"],\"hide\":[1028],\"hasActions\":[32],\"hasContent\":[32],\"classCollection\":[32]},[[8,\"keydown\",\"handleKeyDown\"]],{\"dialogRole\":[\"validateDialogRole\"],\"modalTitle\":[\"validateModalTitle\"],\"hide\":[\"validateHide\"]}],[1,\"mg-tabs\",{\"identifier\":[1],\"label\":[1],\"size\":[1],\"items\":[16],\"activeTab\":[1538,\"active-tab\"],\"tabs\":[32],\"classCollection\":[32]},null,{\"label\":[\"validateLabel\"],\"size\":[\"validateSize\"],\"items\":[\"validateItems\"],\"activeTab\":[\"validateActiveTab\"]}],[1,\"mg-details\",{\"toggleClosed\":[1,\"toggle-closed\"],\"toggleOpened\":[1,\"toggle-opened\"],\"hideSummary\":[4,\"hide-summary\"],\"expanded\":[1028]},null,{\"toggleClosed\":[\"validateTitles\"],\"toggleOpened\":[\"validateTitles\"],\"expanded\":[\"handleExpanded\"]}],[1,\"mg-divider\",{\"size\":[1]}],[1,\"mg-form\",{\"identifier\":[1],\"name\":[1],\"readonly\":[4],\"disabled\":[4],\"valid\":[1028],\"invalid\":[1028],\"classCollection\":[32],\"requiredMessage\":[32],\"displayError\":[64]},null,{\"readonly\":[\"handleAttributeChange\"],\"disabled\":[\"handleAttributeChange\"]}],[1,\"mg-illustrated-message\",{\"size\":[1],\"direction\":[1]}],[1,\"mg-skip-links\",{\"links\":[16]},null,{\"links\":[\"validateLinks\"]}],[1,\"mg-tag\",{\"variant\":[1],\"outline\":[4],\"soft\":[4],\"classCollection\":[32]},null,{\"variant\":[\"validateVariant\"],\"outline\":[\"validateOutline\"],\"soft\":[\"validateSoft\"]}],[2,\"mg-input-checkbox-paginated\",{\"readonly\":[4],\"disabled\":[4],\"name\":[1],\"invalid\":[4],\"checkboxes\":[16],\"sectionKind\":[1,\"section-kind\"],\"messages\":[16],\"titleKind\":[32],\"currentPage\":[32],\"expanded\":[32]},null,{\"checkboxes\":[\"validateCheckboxes\"],\"sectionKind\":[\"validateSectionKind\"]}],[1,\"mg-menu-item\",{\"identifier\":[1],\"href\":[1],\"status\":[1537],\"expanded\":[1028],\"size\":[32],\"navigationButtonClassList\":[32],\"direction\":[32],\"isInMainMenu\":[32],\"isItemMore\":[32],\"hasChildren\":[32],\"displayNotificationBadge\":[32]},null,{\"status\":[\"validateStatus\"],\"expanded\":[\"validateExpanded\"],\"size\":[\"validateSize\"],\"direction\":[\"validateDirection\"],\"hasChildren\":[\"validateHasChildren\"]}],[1,\"mg-pagination\",{\"identifier\":[1],\"label\":[1025],\"hideNavigationLabels\":[4,\"hide-navigation-labels\"],\"hidePageCount\":[4,\"hide-page-count\"],\"totalPages\":[2,\"total-pages\"],\"currentPage\":[1538,\"current-page\"]},null,{\"totalPages\":[\"validateTotalPages\"],\"currentPage\":[\"validateCurrentPage\"]}],[1,\"mg-input-text\",{\"value\":[1537],\"identifier\":[1],\"name\":[1],\"label\":[1],\"type\":[1],\"icon\":[1],\"labelOnTop\":[4,\"label-on-top\"],\"labelHide\":[4,\"label-hide\"],\"placeholder\":[1],\"datalistoptions\":[16],\"maxlength\":[2],\"required\":[4],\"readonly\":[4],\"disabled\":[4],\"mgWidth\":[8,\"mg-width\"],\"pattern\":[1],\"patternErrorMessage\":[1,\"pattern-error-message\"],\"tooltip\":[1],\"displayCharacterLeft\":[4,\"display-character-left\"],\"helpText\":[1,\"help-text\"],\"valid\":[1028],\"invalid\":[1028],\"classCollection\":[32],\"errorMessage\":[32],\"setFocus\":[64],\"displayError\":[64],\"setError\":[64]},null,{\"value\":[\"handleValue\"],\"icon\":[\"validateIcon\"],\"datalistoptions\":[\"validateDatalistoptions\"],\"required\":[\"handleValidityChange\"],\"readonly\":[\"handleValidityChange\"],\"disabled\":[\"handleValidityChange\"],\"pattern\":[\"validatePattern\"],\"patternErrorMessage\":[\"validatePattern\"]}],[1,\"mg-menu\",{\"label\":[1],\"direction\":[513],\"itemmore\":[16],\"size\":[1],\"isChildMenu\":[32]},null,{\"label\":[\"validateLabel\"],\"direction\":[\"validateDirection\"],\"itemmore\":[\"validateItemMore\"],\"size\":[\"validateSize\"]}],[1,\"mg-input-select\",{\"value\":[1032],\"items\":[16],\"identifier\":[1],\"name\":[1],\"label\":[1],\"labelOnTop\":[4,\"label-on-top\"],\"labelHide\":[4,\"label-hide\"],\"placeholder\":[1025],\"placeholderHide\":[4,\"placeholder-hide\"],\"placeholderDisabled\":[4,\"placeholder-disabled\"],\"required\":[4],\"readonly\":[4],\"disabled\":[4],\"mgWidth\":[520,\"mg-width\"],\"tooltip\":[1],\"helpText\":[1,\"help-text\"],\"valid\":[1028],\"invalid\":[1028],\"classCollection\":[32],\"errorMessage\":[32],\"options\":[32],\"valueExist\":[32],\"readonlyValue\":[32],\"displayError\":[64],\"setError\":[64]},null,{\"value\":[\"validateValue\"],\"items\":[\"validateItems\"],\"required\":[\"handleValidityChange\"],\"readonly\":[\"handleValidityChange\"],\"disabled\":[\"handleValidityChange\"]}],[1,\"mg-popover\",{\"identifier\":[1],\"placement\":[1],\"arrowHide\":[4,\"arrow-hide\"],\"closeButton\":[4,\"close-button\"],\"display\":[1028],\"disabled\":[4]},null,{\"identifier\":[\"validateIdentifier\"],\"arrowHide\":[\"validateArrowHide\"],\"closeButton\":[\"validateCloseButton\"],\"display\":[\"handleDisplay\"]}],[1,\"mg-badge\",{\"value\":[8],\"label\":[1],\"variant\":[1],\"outline\":[4],\"classCollection\":[32]},null,{\"value\":[\"validateValue\"],\"label\":[\"validateLabel\"],\"variant\":[\"validateVariant\"],\"outline\":[\"validateOutline\"]}],[2,\"mg-character-left\",{\"identifier\":[1],\"characters\":[1],\"maxlength\":[2]},null,{\"maxlength\":[\"validateMaxlength\"]}],[1,\"mg-popover-content\",{\"closeButton\":[4,\"close-button\"],\"classCollection\":[32]}],[1,\"mg-card\",{\"variant\":[1],\"variantStyle\":[1025,\"variant-style\"],\"classCollection\":[32]},null,{\"variant\":[\"validateVariant\"],\"variantStyle\":[\"validateVariantStyle\"]}],[1,\"mg-button\",{\"variant\":[1],\"identifier\":[1],\"label\":[1],\"type\":[1],\"fullWidth\":[4,\"full-width\"],\"form\":[1],\"disabled\":[1028],\"isIcon\":[4,\"is-icon\"],\"disableOnClick\":[4,\"disable-on-click\"],\"loading\":[32],\"classCollection\":[32]},null,{\"variant\":[\"validateVariant\"],\"fullWidth\":[\"validateFullWidth\"],\"disabled\":[\"disabledHandler\"],\"loading\":[\"loadingHandler\"]}],[1,\"mg-tooltip\",{\"identifier\":[1],\"message\":[1],\"placement\":[1],\"display\":[1028],\"disabled\":[4]},null,{\"identifier\":[\"validateIdentifier\"],\"message\":[\"validateMessage\"],\"display\":[\"handleDisplay\"],\"disabled\":[\"validateDisabled\"]}],[6,\"mg-input-title\",{\"identifier\":[1],\"required\":[4],\"readonly\":[4],\"isLegend\":[4,\"is-legend\"],\"tagName\":[32]},null,{\"identifier\":[\"validateIdentifier\"],\"isLegend\":[\"validateIsLegend\"]}],[1,\"mg-tooltip-content\",{\"message\":[1]}],[1,\"mg-icon\",{\"icon\":[1],\"size\":[1],\"variant\":[1],\"variantStyle\":[1025,\"variant-style\"],\"spin\":[4],\"classCollection\":[32]},null,{\"icon\":[\"validateIcon\"],\"size\":[\"validateSize\"],\"variant\":[\"validateVariant\"],\"variantStyle\":[\"validateVariantStyle\"],\"spin\":[\"handleSpin\"]}]]],[\"mg-item-more.cjs\",[[1,\"mg-item-more\",{\"icon\":[16],\"slotlabel\":[16],\"size\":[1],\"parentMenu\":[32]},null,{\"icon\":[\"validateIcon\"],\"slotlabel\":[\"validateSlotLabel\"],\"size\":[\"validateSize\"]}]]]]"), options);
21
21
  });
22
22
 
23
23
  exports.setNonce = index.setNonce;
@@ -70,7 +70,8 @@ class OverflowBehavior {
70
70
  const acc = { accWidth: 0, previousItem: null };
71
71
  [...this._baseChildren, this._moreElement].forEach((child) => {
72
72
  acc.accWidth += child.offsetWidth;
73
- const isPreviousItemHidden = acc.previousItem !== null && acc.previousItem.getAttribute('hidden') !== null;
73
+ const hasPreviuosItem = acc.previousItem !== null;
74
+ const isPreviousItemHidden = hasPreviuosItem && acc.previousItem.getAttribute('hidden') !== null;
74
75
  // if previous item is hidden AND is NOT more element we hidde current
75
76
  // OR if item has an overflow we hidde current
76
77
  // OR if current item is more element AND have NOT previous hidden items, current more element item is an hidden item
@@ -1 +1 @@
1
- {"file":"mg-item-more.entry.cjs.js","mappings":"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","names":["isValidString","initLocales","h","Host","Direction"],"sources":["src/utils/behaviors.utils.ts","../styles/dist/components/mg-item-more.css?tag=mg-item-more&encapsulation=shadow","src/components/molecules/mg-item-more/mg-item-more.tsx"],"sourcesContent":["/**\n * MgItemMore type guard\n * @param element - element to control type\n * @returns truthy if element is mg-item-more\n */\nconst isMgItemMore = (element: HTMLElement): element is HTMLMgItemMoreElement => element.nodeName === 'MG-ITEM-MORE';\n\nexport enum OverflowBehaviorElements {\n BASE_INDEX = 'data-overflow-base-index',\n PROXY_INDEX = 'data-overflow-proxy-index',\n}\n\nexport class OverflowBehavior {\n // variables\n private _resizeObserver: ResizeObserver;\n private _moreElement: HTMLElement;\n private _baseChildren: Element[];\n private _proxyChildren: Element[];\n\n constructor(private element: Element, private render: () => HTMLElement) {\n if (this._resizeObserver === undefined) {\n // add resize observer\n this._resizeObserver = new ResizeObserver(entries => {\n entries.forEach(entry => {\n this.run(entry.contentRect.width);\n });\n });\n this._resizeObserver.observe(this.element);\n }\n this.run();\n }\n\n /**********\n * Public *\n **********/\n\n /**\n * Disconnect ResizeObserver\n */\n public disconnect = (): void => {\n this._resizeObserver.disconnect();\n };\n\n /************\n * Internal *\n ************/\n\n /**\n * run overflow behavior\n * @param width - width of the container. Optional.\n */\n private run = (width?: number): void => {\n if (this._moreElement === undefined) {\n // set moreElement\n this._moreElement = this.render();\n\n // set children\n this._baseChildren = this.getInteractiveItems(this.element);\n if (isMgItemMore(this._moreElement)) {\n this._proxyChildren = this.getInteractiveItems(this._moreElement.shadowRoot.querySelector('mg-menu'));\n }\n\n // update children\n this._baseChildren.forEach((child, index) => {\n child.setAttribute(OverflowBehaviorElements.BASE_INDEX, `${index}`);\n // set moreElement children\n this._proxyChildren[index].setAttribute(OverflowBehaviorElements.PROXY_INDEX, `${index}`);\n });\n }\n\n if (width !== undefined) this.updateDisplayedItems(width);\n };\n\n /**\n * Get interactive children filtred by authorized nodeName ['MG-MENU-ITEM', 'MG-BUTTON']\n * @param element - element to parse\n * @returns children\n */\n private getInteractiveItems = (element: Element) =>\n (element.children?.length > 0 ? Array.from(element.children) : []).filter(element => ['MG-MENU-ITEM', 'MG-BUTTON'].includes(element.nodeName));\n\n /**\n * Update displayed items in container from a given available space\n * @param availableWidth - available width in container to display child items\n */\n private updateDisplayedItems = (availableWidth: number): void => {\n this.restoreItems();\n const acc = { accWidth: 0, previousItem: null };\n [...this._baseChildren, this._moreElement].forEach((child: HTMLMgMenuItemElement | HTMLMgItemMoreElement) => {\n acc.accWidth += child.offsetWidth;\n const isPreviousItemHidden = acc.previousItem !== null && acc.previousItem.getAttribute('hidden') !== null;\n // if previous item is hidden AND is NOT more element we hidde current\n // OR if item has an overflow we hidde current\n // OR if current item is more element AND have NOT previous hidden items, current more element item is an hidden item\n // ELSE current is a display item\n this.toggleItem(\n child,\n (isPreviousItemHidden && !this.isMoreElement(child)) || this.isOverflowElement(acc.accWidth, child, availableWidth) || (this.isMoreElement(child) && !isPreviousItemHidden),\n );\n\n // update previous item with current item\n acc.previousItem = child;\n });\n };\n\n /**\n * Utility method to know if item overflow partialy or totaly in the container\n * @param cumulateWidth - previous sibling elements cumulate width + item width\n * @param item - item HTML element\n * @param availableWidth - container available width\n * @returns truthy if element is overflow\n */\n private isOverflowElement = (cumulateWidth: number, item: HTMLElement, availableWidth: number): boolean => {\n if (item.previousElementSibling === null || this.isMoreElement(item)) return false;\n else if (!this.isMoreElement(item.nextElementSibling)) return cumulateWidth + this._moreElement.offsetWidth > availableWidth;\n else return cumulateWidth > availableWidth;\n };\n\n /**\n * Utility method to know if a given element is the 'MORE' element\n * @param element - element to match with 'MORE' element\n * @returns truthy if element is the 'MORE' element\n */\n private isMoreElement = (element: Element): boolean => element.nodeName === 'MG-ITEM-MORE';\n\n /**\n * Toggle display item element\n * @param item - item to control\n * @param isHidden - is item hidden\n */\n private toggleItem = (item: HTMLElement, isHidden: boolean): void => {\n const mgActionMenuindex = Number(item.getAttribute(OverflowBehaviorElements.BASE_INDEX));\n if (this.isMoreElement(item)) this.toggleElement(this._moreElement, isHidden);\n else if (mgActionMenuindex >= 0) {\n this.toggleElement(item, isHidden);\n this.toggleElement(this._proxyChildren[mgActionMenuindex], !isHidden);\n }\n };\n\n /**\n * Toggle element's hidde attribute\n * @param element - element to toggle\n * @param isHidden - element is hidden\n */\n private toggleElement = (element: Element, isHidden: boolean): void => {\n if (isHidden) element.setAttribute('hidden', '');\n else element.removeAttribute('hidden');\n };\n\n /**\n * Remove hidden attributes on all items\n */\n private restoreItems = (): void => {\n [...this._baseChildren, this._moreElement].forEach(item => item.removeAttribute('hidden'));\n };\n}\n",".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}}:host:not([hidden]){display:flex}/*# sourceMappingURL=mg-item-more.css.map */\n","import { Component, h, Prop, Element, Host, Watch, State } from '@stencil/core';\nimport { initLocales } from '../../../locales';\nimport { OverflowBehavior } from '../../../utils/behaviors.utils';\nimport { Direction } from '../menu/mg-menu/mg-menu.conf';\nimport type { IconType, MessageType, SizeType, SlotLabelType } from './mg-item-more.conf';\nimport { isValidString } from '../../../utils/components.utils';\n\n@Component({\n tag: 'mg-item-more',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-item-more.css',\n shadow: true,\n})\nexport class MgItemMore {\n /************\n * Internal *\n ************/\n private readonly name = 'mg-item-more';\n private messages: MessageType;\n private menuItems: HTMLMgMenuItemElement[];\n private overflowBehavior: OverflowBehavior;\n\n /**************\n * Decorators *\n **************/\n\n /**\n * Get component DOM element\n */\n @Element() element: HTMLMgItemMoreElement;\n\n /**\n * Define icon\n */\n @Prop() icon: IconType = { icon: 'ellipsis-vertical' };\n @Watch('icon')\n validateIcon(newValue: MgItemMore['icon']): void {\n if (typeof newValue !== 'object' || (typeof newValue === 'object' && typeof newValue.icon !== 'string'))\n throw new Error(`<${this.name}> prop \"icon\" must match MgItemMore['icon'] type.`);\n }\n\n /**\n * Define slot label element\n */\n @Prop() slotlabel: SlotLabelType = { display: false };\n @Watch('slotlabel')\n validateSlotLabel(newValue: MgItemMore['slotlabel']): void {\n if (typeof newValue !== 'object' || (typeof newValue === 'object' && typeof newValue.display !== 'boolean'))\n throw new Error(`<${this.name}> prop \"slotlabel\" must match MgItemMore['slotlabel'] type.`);\n else if (typeof newValue.label !== 'string') this.slotlabel.label = this.messages.moreLabel;\n }\n\n /**\n * Define component child menu size.\n */\n @Prop() size: SizeType;\n @Watch('size')\n validateSize(newValue: MgItemMore['size']): void {\n if (newValue && typeof newValue !== 'string') throw new Error(`<${this.name}> prop \"size\" must match MgItemMore['size'] type.`);\n }\n\n /**\n * Define component parent menu.\n */\n @State() parentMenu: HTMLMgMenuElement;\n\n /***********\n * Methods *\n ***********/\n\n /**\n * render mg-item-more overflow element\n * @returns mg-item-more element\n */\n private renderMgMenuItemOverflowElement = (): HTMLMgItemMoreElement => {\n // create menu items proxy element from item clones\n const moreElementMenuItem = this.element.shadowRoot.querySelector('mg-menu-item');\n this.menuItems.forEach((child: HTMLMgMenuItemElement) => {\n moreElementMenuItem.querySelector('mg-menu').appendChild(child.cloneNode(true));\n });\n\n const allMenuItem = Array.from(this.parentMenu.querySelectorAll('mg-menu-item:not([data-overflow-more])'));\n\n Array.from(moreElementMenuItem.querySelectorAll('mg-menu-item:not([data-overflow-more])')).forEach((proxy, index) => {\n // manage click on proxy to mirror it on initial element\n proxy.addEventListener('click', () => {\n // be carefull to use element.click() method instead of dispatchEvent to ensure bubbles outside shadowDom\n const navElement = allMenuItem[index].shadowRoot.querySelector('a, button');\n if (navElement instanceof HTMLButtonElement || navElement instanceof HTMLAnchorElement) navElement.click();\n });\n\n // add id suffix to prevent duplicate key. default html id is: '';\n if (isValidString(proxy.id)) proxy.id = `${proxy.id}-proxy`;\n\n // manage status change miror in proxy\n allMenuItem[index].addEventListener('status-change', (event: CustomEvent) => {\n proxy.setAttribute('status', event.detail);\n });\n });\n\n return this.element;\n };\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Disconnect overflow ResizeObserver\n */\n disconnectedCallback(): void {\n this.overflowBehavior.disconnect();\n }\n\n /**\n * Set variables and validate props\n */\n componentWillLoad(): void {\n // init variables\n this.messages = (initLocales(this.element).messages as { plusMenu: MessageType }).plusMenu;\n this.parentMenu = this.element.closest('mg-menu');\n this.menuItems = Array.from(this.parentMenu.children).filter(item => item.nodeName === 'MG-MENU-ITEM') as HTMLMgMenuItemElement[];\n\n // validate props\n this.validateIcon(this.icon);\n this.validateSlotLabel(this.slotlabel);\n this.validateSize(this.size);\n }\n\n /**\n * Add overflow behavior\n */\n componentDidLoad(): void {\n this.overflowBehavior = new OverflowBehavior(this.parentMenu, this.renderMgMenuItemOverflowElement);\n }\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <Host role=\"listitem\">\n <mg-menu-item data-overflow-more data-size={this.parentMenu.size}>\n <mg-icon icon={this.icon.icon} slot=\"image\"></mg-icon>\n <span class={{ 'mg-u-visually-hidden': !this.slotlabel.display }} slot=\"label\">\n {this.slotlabel.label}\n </span>\n <mg-menu direction={Direction.VERTICAL} label={this.messages.moreLabel} size={this.size}></mg-menu>\n </mg-menu-item>\n </Host>\n );\n }\n}\n"],"version":3}
1
+ {"file":"mg-item-more.entry.cjs.js","mappings":";;;;;;;AAAA;;;;;AAKA,MAAM,YAAY,GAAG,CAAC,OAAoB,KAAuC,OAAO,CAAC,QAAQ,KAAK,cAAc,CAAC;AAErH,IAAY,wBAGX;AAHD,WAAY,wBAAwB;EAClC,mEAAuC,CAAA;EACvC,qEAAyC,CAAA;AAC3C,CAAC,EAHW,wBAAwB,KAAxB,wBAAwB,QAGnC;MAEY,gBAAgB;EAO3B,YAAoB,OAAgB,EAAU,MAAyB;IAAnD,YAAO,GAAP,OAAO,CAAS;IAAU,WAAM,GAAN,MAAM,CAAmB;;;;;;;IAoBhE,eAAU,GAAG;MAClB,IAAI,CAAC,eAAe,CAAC,UAAU,EAAE,CAAC;KACnC,CAAC;;;;;;;;IAUM,QAAG,GAAG,CAAC,KAAc;MAC3B,IAAI,IAAI,CAAC,YAAY,KAAK,SAAS,EAAE;;QAEnC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC;;QAGlC,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAC5D,IAAI,YAAY,CAAC,IAAI,CAAC,YAAY,CAAC,EAAE;UACnC,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC,CAAC;SACvG;;QAGD,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,KAAK;UACtC,KAAK,CAAC,YAAY,CAAC,wBAAwB,CAAC,UAAU,EAAE,GAAG,KAAK,EAAE,CAAC,CAAC;;UAEpE,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,YAAY,CAAC,wBAAwB,CAAC,WAAW,EAAE,GAAG,KAAK,EAAE,CAAC,CAAC;SAC3F,CAAC,CAAC;OACJ;MAED,IAAI,KAAK,KAAK,SAAS;QAAE,IAAI,CAAC,oBAAoB,CAAC,KAAK,CAAC,CAAC;KAC3D,CAAC;;;;;;IAOM,wBAAmB,GAAG,CAAC,OAAgB,eAC7C,OAAA,CAAC,CAAA,MAAA,OAAO,CAAC,QAAQ,0CAAE,MAAM,IAAG,CAAC,GAAG,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,GAAG,EAAE,EAAE,MAAM,CAAC,OAAO,IAAI,CAAC,cAAc,EAAE,WAAW,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAA,EAAA,CAAC;;;;;IAMzI,yBAAoB,GAAG,CAAC,cAAsB;MACpD,IAAI,CAAC,YAAY,EAAE,CAAC;MACpB,MAAM,GAAG,GAAG,EAAE,QAAQ,EAAE,CAAC,EAAE,YAAY,EAAE,IAAI,EAAE,CAAC;MAChD,CAAC,GAAG,IAAI,CAAC,aAAa,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC,OAAO,CAAC,CAAC,KAAoD;QACtG,GAAG,CAAC,QAAQ,IAAI,KAAK,CAAC,WAAW,CAAC;QAClC,MAAM,eAAe,GAAG,GAAG,CAAC,YAAY,KAAK,IAAI,CAAC;QAClD,MAAM,oBAAoB,GAAG,eAAe,IAAI,GAAG,CAAC,YAAY,CAAC,YAAY,CAAC,QAAQ,CAAC,KAAK,IAAI,CAAC;;;;;QAKjG,IAAI,CAAC,UAAU,CACb,KAAK,EACL,CAAC,oBAAoB,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,KAAK,IAAI,CAAC,iBAAiB,CAAC,GAAG,CAAC,QAAQ,EAAE,KAAK,EAAE,cAAc,CAAC,KAAK,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAC5K,CAAC;;QAGF,GAAG,CAAC,YAAY,GAAG,KAAK,CAAC;OAC1B,CAAC,CAAC;KACJ,CAAC;;;;;;;;IASM,sBAAiB,GAAG,CAAC,aAAqB,EAAE,IAAiB,EAAE,cAAsB;MAC3F,IAAI,IAAI,CAAC,sBAAsB,KAAK,IAAI,IAAI,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC;QAAE,OAAO,KAAK,CAAC;WAC9E,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,kBAAkB,CAAC;QAAE,OAAO,aAAa,GAAG,IAAI,CAAC,YAAY,CAAC,WAAW,GAAG,cAAc,CAAC;;QACxH,OAAO,aAAa,GAAG,cAAc,CAAC;KAC5C,CAAC;;;;;;IAOM,kBAAa,GAAG,CAAC,OAAgB,KAAc,OAAO,CAAC,QAAQ,KAAK,cAAc,CAAC;;;;;;IAOnF,eAAU,GAAG,CAAC,IAAiB,EAAE,QAAiB;MACxD,MAAM,iBAAiB,GAAG,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,wBAAwB,CAAC,UAAU,CAAC,CAAC,CAAC;MACzF,IAAI,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC;QAAE,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAC;WACzE,IAAI,iBAAiB,IAAI,CAAC,EAAE;QAC/B,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;QACnC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,cAAc,CAAC,iBAAiB,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC;OACvE;KACF,CAAC;;;;;;IAOM,kBAAa,GAAG,CAAC,OAAgB,EAAE,QAAiB;MAC1D,IAAI,QAAQ;QAAE,OAAO,CAAC,YAAY,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC;;QAC5C,OAAO,CAAC,eAAe,CAAC,QAAQ,CAAC,CAAC;KACxC,CAAC;;;;IAKM,iBAAY,GAAG;MACrB,CAAC,GAAG,IAAI,CAAC,aAAa,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC,OAAO,CAAC,IAAI,IAAI,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC,CAAC,CAAC;KAC5F,CAAC;IAvIA,IAAI,IAAI,CAAC,eAAe,KAAK,SAAS,EAAE;;MAEtC,IAAI,CAAC,eAAe,GAAG,IAAI,cAAc,CAAC,OAAO;QAC/C,OAAO,CAAC,OAAO,CAAC,KAAK;UACnB,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;SACnC,CAAC,CAAC;OACJ,CAAC,CAAC;MACH,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;KAC5C;IACD,IAAI,CAAC,GAAG,EAAE,CAAC;GACZ;;;AC9BH,MAAM,aAAa,GAAG,udAAud;;MCYhe,UAAU;;;;;;IAIJ,SAAI,GAAG,cAAc,CAAC;;;;;;;;IAyD/B,oCAA+B,GAAG;;MAExC,MAAM,mBAAmB,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;MAClF,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,KAA4B;QAClD,mBAAmB,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC,WAAW,CAAC,KAAK,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC;OACjF,CAAC,CAAC;MAEH,MAAM,WAAW,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,gBAAgB,CAAC,wCAAwC,CAAC,CAAC,CAAC;MAE3G,KAAK,CAAC,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,wCAAwC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,KAAK;;QAE9G,KAAK,CAAC,gBAAgB,CAAC,OAAO,EAAE;;UAE9B,MAAM,UAAU,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC,UAAU,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;UAC5E,IAAI,UAAU,YAAY,iBAAiB,IAAI,UAAU,YAAY,iBAAiB;YAAE,UAAU,CAAC,KAAK,EAAE,CAAC;SAC5G,CAAC,CAAC;;QAGH,IAAIA,8BAAa,CAAC,KAAK,CAAC,EAAE,CAAC;UAAE,KAAK,CAAC,EAAE,GAAG,GAAG,KAAK,CAAC,EAAE,QAAQ,CAAC;;QAG5D,WAAW,CAAC,KAAK,CAAC,CAAC,gBAAgB,CAAC,eAAe,EAAE,CAAC,KAAkB;UACtE,KAAK,CAAC,YAAY,CAAC,QAAQ,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;SAC5C,CAAC,CAAC;OACJ,CAAC,CAAC;MAEH,OAAO,IAAI,CAAC,OAAO,CAAC;KACrB,CAAC;gBAnEuB,EAAE,IAAI,EAAE,mBAAmB,EAAE;qBAUnB,EAAE,OAAO,EAAE,KAAK,EAAE;;;;EARrD,YAAY,CAAC,QAA4B;IACvC,IAAI,OAAO,QAAQ,KAAK,QAAQ,KAAK,OAAO,QAAQ,KAAK,QAAQ,IAAI,OAAO,QAAQ,CAAC,IAAI,KAAK,QAAQ,CAAC;MACrG,MAAM,IAAI,KAAK,CAAC,IAAI,IAAI,CAAC,IAAI,mDAAmD,CAAC,CAAC;GACrF;EAOD,iBAAiB,CAAC,QAAiC;IACjD,IAAI,OAAO,QAAQ,KAAK,QAAQ,KAAK,OAAO,QAAQ,KAAK,QAAQ,IAAI,OAAO,QAAQ,CAAC,OAAO,KAAK,SAAS,CAAC;MACzG,MAAM,IAAI,KAAK,CAAC,IAAI,IAAI,CAAC,IAAI,6DAA6D,CAAC,CAAC;SACzF,IAAI,OAAO,QAAQ,CAAC,KAAK,KAAK,QAAQ;MAAE,IAAI,CAAC,SAAS,CAAC,KAAK,GAAG,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC;GAC7F;EAOD,YAAY,CAAC,QAA4B;IACvC,IAAI,QAAQ,IAAI,OAAO,QAAQ,KAAK,QAAQ;MAAE,MAAM,IAAI,KAAK,CAAC,IAAI,IAAI,CAAC,IAAI,mDAAmD,CAAC,CAAC;GACjI;;;;;;;EAmDD,oBAAoB;IAClB,IAAI,CAAC,gBAAgB,CAAC,UAAU,EAAE,CAAC;GACpC;;;;EAKD,iBAAiB;;IAEf,IAAI,CAAC,QAAQ,GAAIC,4BAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,QAAsC,CAAC,QAAQ,CAAC;IAC3F,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;IAClD,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,MAAM,CAAC,IAAI,IAAI,IAAI,CAAC,QAAQ,KAAK,cAAc,CAA4B,CAAC;;IAGlI,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC7B,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;IACvC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;GAC9B;;;;EAKD,gBAAgB;IACd,IAAI,CAAC,gBAAgB,GAAG,IAAI,gBAAgB,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,+BAA+B,CAAC,CAAC;GACrG;;;;;EAMD,MAAM;IACJ,QACEC,QAACC,UAAI,IAAC,IAAI,EAAC,UAAU,IACnBD,mEAA4C,IAAI,CAAC,UAAU,CAAC,IAAI,IAC9DA,qBAAS,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,EAAC,OAAO,GAAW,EACtDA,kBAAM,KAAK,EAAE,EAAE,sBAAsB,EAAE,CAAC,IAAI,CAAC,SAAS,CAAC,OAAO,EAAE,EAAE,IAAI,EAAC,OAAO,IAC3E,IAAI,CAAC,SAAS,CAAC,KAAK,CAChB,EACPA,qBAAS,SAAS,EAAEE,0BAAS,CAAC,QAAQ,EAAE,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,SAAS,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,GAAY,CACtF,CACV,EACP;GACH;;;;;;;;;;;;","names":["isValidString","initLocales","h","Host","Direction"],"sources":["src/utils/behaviors.utils.ts","../styles/dist/components/mg-item-more.css?tag=mg-item-more&encapsulation=shadow","src/components/molecules/mg-item-more/mg-item-more.tsx"],"sourcesContent":["/**\n * MgItemMore type guard\n * @param element - element to control type\n * @returns truthy if element is mg-item-more\n */\nconst isMgItemMore = (element: HTMLElement): element is HTMLMgItemMoreElement => element.nodeName === 'MG-ITEM-MORE';\n\nexport enum OverflowBehaviorElements {\n BASE_INDEX = 'data-overflow-base-index',\n PROXY_INDEX = 'data-overflow-proxy-index',\n}\n\nexport class OverflowBehavior {\n // variables\n private _resizeObserver: ResizeObserver;\n private _moreElement: HTMLElement;\n private _baseChildren: Element[];\n private _proxyChildren: Element[];\n\n constructor(private element: Element, private render: () => HTMLElement) {\n if (this._resizeObserver === undefined) {\n // add resize observer\n this._resizeObserver = new ResizeObserver(entries => {\n entries.forEach(entry => {\n this.run(entry.contentRect.width);\n });\n });\n this._resizeObserver.observe(this.element);\n }\n this.run();\n }\n\n /**********\n * Public *\n **********/\n\n /**\n * Disconnect ResizeObserver\n */\n public disconnect = (): void => {\n this._resizeObserver.disconnect();\n };\n\n /************\n * Internal *\n ************/\n\n /**\n * run overflow behavior\n * @param width - width of the container. Optional.\n */\n private run = (width?: number): void => {\n if (this._moreElement === undefined) {\n // set moreElement\n this._moreElement = this.render();\n\n // set children\n this._baseChildren = this.getInteractiveItems(this.element);\n if (isMgItemMore(this._moreElement)) {\n this._proxyChildren = this.getInteractiveItems(this._moreElement.shadowRoot.querySelector('mg-menu'));\n }\n\n // update children\n this._baseChildren.forEach((child, index) => {\n child.setAttribute(OverflowBehaviorElements.BASE_INDEX, `${index}`);\n // set moreElement children\n this._proxyChildren[index].setAttribute(OverflowBehaviorElements.PROXY_INDEX, `${index}`);\n });\n }\n\n if (width !== undefined) this.updateDisplayedItems(width);\n };\n\n /**\n * Get interactive children filtred by authorized nodeName ['MG-MENU-ITEM', 'MG-BUTTON']\n * @param element - element to parse\n * @returns children\n */\n private getInteractiveItems = (element: Element) =>\n (element.children?.length > 0 ? Array.from(element.children) : []).filter(element => ['MG-MENU-ITEM', 'MG-BUTTON'].includes(element.nodeName));\n\n /**\n * Update displayed items in container from a given available space\n * @param availableWidth - available width in container to display child items\n */\n private updateDisplayedItems = (availableWidth: number): void => {\n this.restoreItems();\n const acc = { accWidth: 0, previousItem: null };\n [...this._baseChildren, this._moreElement].forEach((child: HTMLMgMenuItemElement | HTMLMgItemMoreElement) => {\n acc.accWidth += child.offsetWidth;\n const hasPreviuosItem = acc.previousItem !== null;\n const isPreviousItemHidden = hasPreviuosItem && acc.previousItem.getAttribute('hidden') !== null;\n // if previous item is hidden AND is NOT more element we hidde current\n // OR if item has an overflow we hidde current\n // OR if current item is more element AND have NOT previous hidden items, current more element item is an hidden item\n // ELSE current is a display item\n this.toggleItem(\n child,\n (isPreviousItemHidden && !this.isMoreElement(child)) || this.isOverflowElement(acc.accWidth, child, availableWidth) || (this.isMoreElement(child) && !isPreviousItemHidden),\n );\n\n // update previous item with current item\n acc.previousItem = child;\n });\n };\n\n /**\n * Utility method to know if item overflow partialy or totaly in the container\n * @param cumulateWidth - previous sibling elements cumulate width + item width\n * @param item - item HTML element\n * @param availableWidth - container available width\n * @returns truthy if element is overflow\n */\n private isOverflowElement = (cumulateWidth: number, item: HTMLElement, availableWidth: number): boolean => {\n if (item.previousElementSibling === null || this.isMoreElement(item)) return false;\n else if (!this.isMoreElement(item.nextElementSibling)) return cumulateWidth + this._moreElement.offsetWidth > availableWidth;\n else return cumulateWidth > availableWidth;\n };\n\n /**\n * Utility method to know if a given element is the 'MORE' element\n * @param element - element to match with 'MORE' element\n * @returns truthy if element is the 'MORE' element\n */\n private isMoreElement = (element: Element): boolean => element.nodeName === 'MG-ITEM-MORE';\n\n /**\n * Toggle display item element\n * @param item - item to control\n * @param isHidden - is item hidden\n */\n private toggleItem = (item: HTMLElement, isHidden: boolean): void => {\n const mgActionMenuindex = Number(item.getAttribute(OverflowBehaviorElements.BASE_INDEX));\n if (this.isMoreElement(item)) this.toggleElement(this._moreElement, isHidden);\n else if (mgActionMenuindex >= 0) {\n this.toggleElement(item, isHidden);\n this.toggleElement(this._proxyChildren[mgActionMenuindex], !isHidden);\n }\n };\n\n /**\n * Toggle element's hidde attribute\n * @param element - element to toggle\n * @param isHidden - element is hidden\n */\n private toggleElement = (element: Element, isHidden: boolean): void => {\n if (isHidden) element.setAttribute('hidden', '');\n else element.removeAttribute('hidden');\n };\n\n /**\n * Remove hidden attributes on all items\n */\n private restoreItems = (): void => {\n [...this._baseChildren, this._moreElement].forEach(item => item.removeAttribute('hidden'));\n };\n}\n",".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}}:host:not([hidden]){display:flex}/*# sourceMappingURL=mg-item-more.css.map */\n","import { Component, h, Prop, Element, Host, Watch, State } from '@stencil/core';\nimport { initLocales } from '../../../locales';\nimport { OverflowBehavior } from '../../../utils/behaviors.utils';\nimport { Direction } from '../menu/mg-menu/mg-menu.conf';\nimport type { IconType, MessageType, SizeType, SlotLabelType } from './mg-item-more.conf';\nimport { isValidString } from '../../../utils/components.utils';\n\n@Component({\n tag: 'mg-item-more',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-item-more.css',\n shadow: true,\n})\nexport class MgItemMore {\n /************\n * Internal *\n ************/\n private readonly name = 'mg-item-more';\n private messages: MessageType;\n private menuItems: HTMLMgMenuItemElement[];\n private overflowBehavior: OverflowBehavior;\n\n /**************\n * Decorators *\n **************/\n\n /**\n * Get component DOM element\n */\n @Element() element: HTMLMgItemMoreElement;\n\n /**\n * Define icon\n */\n @Prop() icon: IconType = { icon: 'ellipsis-vertical' };\n @Watch('icon')\n validateIcon(newValue: MgItemMore['icon']): void {\n if (typeof newValue !== 'object' || (typeof newValue === 'object' && typeof newValue.icon !== 'string'))\n throw new Error(`<${this.name}> prop \"icon\" must match MgItemMore['icon'] type.`);\n }\n\n /**\n * Define slot label element\n */\n @Prop() slotlabel: SlotLabelType = { display: false };\n @Watch('slotlabel')\n validateSlotLabel(newValue: MgItemMore['slotlabel']): void {\n if (typeof newValue !== 'object' || (typeof newValue === 'object' && typeof newValue.display !== 'boolean'))\n throw new Error(`<${this.name}> prop \"slotlabel\" must match MgItemMore['slotlabel'] type.`);\n else if (typeof newValue.label !== 'string') this.slotlabel.label = this.messages.moreLabel;\n }\n\n /**\n * Define component child menu size.\n */\n @Prop() size: SizeType;\n @Watch('size')\n validateSize(newValue: MgItemMore['size']): void {\n if (newValue && typeof newValue !== 'string') throw new Error(`<${this.name}> prop \"size\" must match MgItemMore['size'] type.`);\n }\n\n /**\n * Define component parent menu.\n */\n @State() parentMenu: HTMLMgMenuElement;\n\n /***********\n * Methods *\n ***********/\n\n /**\n * render mg-item-more overflow element\n * @returns mg-item-more element\n */\n private renderMgMenuItemOverflowElement = (): HTMLMgItemMoreElement => {\n // create menu items proxy element from item clones\n const moreElementMenuItem = this.element.shadowRoot.querySelector('mg-menu-item');\n this.menuItems.forEach((child: HTMLMgMenuItemElement) => {\n moreElementMenuItem.querySelector('mg-menu').appendChild(child.cloneNode(true));\n });\n\n const allMenuItem = Array.from(this.parentMenu.querySelectorAll('mg-menu-item:not([data-overflow-more])'));\n\n Array.from(moreElementMenuItem.querySelectorAll('mg-menu-item:not([data-overflow-more])')).forEach((proxy, index) => {\n // manage click on proxy to mirror it on initial element\n proxy.addEventListener('click', () => {\n // be carefull to use element.click() method instead of dispatchEvent to ensure bubbles outside shadowDom\n const navElement = allMenuItem[index].shadowRoot.querySelector('a, button');\n if (navElement instanceof HTMLButtonElement || navElement instanceof HTMLAnchorElement) navElement.click();\n });\n\n // add id suffix to prevent duplicate key. default html id is: '';\n if (isValidString(proxy.id)) proxy.id = `${proxy.id}-proxy`;\n\n // manage status change miror in proxy\n allMenuItem[index].addEventListener('status-change', (event: CustomEvent) => {\n proxy.setAttribute('status', event.detail);\n });\n });\n\n return this.element;\n };\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Disconnect overflow ResizeObserver\n */\n disconnectedCallback(): void {\n this.overflowBehavior.disconnect();\n }\n\n /**\n * Set variables and validate props\n */\n componentWillLoad(): void {\n // init variables\n this.messages = (initLocales(this.element).messages as { plusMenu: MessageType }).plusMenu;\n this.parentMenu = this.element.closest('mg-menu');\n this.menuItems = Array.from(this.parentMenu.children).filter(item => item.nodeName === 'MG-MENU-ITEM') as HTMLMgMenuItemElement[];\n\n // validate props\n this.validateIcon(this.icon);\n this.validateSlotLabel(this.slotlabel);\n this.validateSize(this.size);\n }\n\n /**\n * Add overflow behavior\n */\n componentDidLoad(): void {\n this.overflowBehavior = new OverflowBehavior(this.parentMenu, this.renderMgMenuItemOverflowElement);\n }\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <Host role=\"listitem\">\n <mg-menu-item data-overflow-more data-size={this.parentMenu.size}>\n <mg-icon icon={this.icon.icon} slot=\"image\"></mg-icon>\n <span class={{ 'mg-u-visually-hidden': !this.slotlabel.display }} slot=\"label\">\n {this.slotlabel.label}\n </span>\n <mg-menu direction={Direction.VERTICAL} label={this.messages.moreLabel} size={this.size}></mg-menu>\n </mg-menu-item>\n </Host>\n );\n }\n}\n"],"version":3}
@@ -15,7 +15,7 @@ export class MgBadge {
15
15
  this.classCollection = new ClassList(['mg-c-badge']);
16
16
  }
17
17
  validateValue(newValue) {
18
- if (`${newValue}`.match(/^(\d+\+*|[?*!a-z])$/i) === null) {
18
+ if (/^(\d+\+*|[?*!a-z])$/i.exec(`${newValue}`) === null) {
19
19
  throw new Error('<mg-badge> prop "value" must be integer or ponctuation character.');
20
20
  }
21
21
  }
@@ -1 +1 @@
1
- {"version":3,"file":"mg-badge.js","sourceRoot":"","sources":["../../../../src/components/atoms/mg-badge/mg-badge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACjE,OAAO,EAAE,QAAQ,EAAoB,MAAM,iBAAiB,CAAC;AAC7D,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAM3E,MAAM,OAAO,OAAO;;IAClB;;kBAEc;IAEd,UAAU;IACO,iBAAY,GAAG,qBAAqB,CAAC;;;mBAgCjB,QAAQ,CAAC,CAAC,CAAC;;2BA0BV,IAAI,SAAS,CAAC,CAAC,YAAY,CAAC,CAAC;;EA/CnE,aAAa,CAAC,QAA0B;IACtC,IAAI,GAAG,QAAQ,EAAE,CAAC,KAAK,CAAC,sBAAsB,CAAC,KAAK,IAAI,EAAE;MACxD,MAAM,IAAI,KAAK,CAAC,mEAAmE,CAAC,CAAC;KACtF;EACH,CAAC;EAQD,aAAa,CAAC,QAA0B;IACtC,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,EAAE;MAC5B,MAAM,IAAI,KAAK,CAAC,sCAAsC,CAAC,CAAC;KACzD;EACH,CAAC;EAOD,eAAe,CAAC,QAA4B,EAAE,QAA6B;IACzE,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE;MAChC,MAAM,IAAI,KAAK,CAAC,6CAA6C,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;KACtF;SAAM;MACL,IAAI,QAAQ,KAAK,SAAS,EAAE;QAC1B,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,eAAe,QAAQ,EAAE,CAAC,CAAC;OACxD;MACD,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,eAAe,QAAQ,EAAE,CAAC,CAAC;KACrD;EACH,CAAC;EAOD,eAAe,CAAC,QAA4B;IAC1C,IAAI,QAAQ;MAAE,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;;MACrD,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;EACtD,CAAC;EAOD;;KAEG;EACH,iBAAiB;IACf,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC/B,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC/B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;EACrC,CAAC;EAED;;;KAGG;EACH,MAAM;IACJ,OAAO,CACL,YAAM,KAAK,EAAE,IAAI,CAAC,eAAe,CAAC,IAAI,EAAE;MACtC,YAAM,KAAK,EAAC,mBAAmB,IAAE,IAAI,CAAC,KAAK,CAAQ;MACnD,YAAM,KAAK,EAAC,sBAAsB,IAAE,IAAI,CAAC,KAAK,CAAQ,CACjD,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, State, Watch } from '@stencil/core';\nimport { variants, BadgeVariantType } from './mg-badge.conf';\nimport { ClassList, isValidString } from '../../../utils/components.utils';\n@Component({\n tag: 'mg-badge',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-badge.css',\n shadow: true,\n})\nexport class MgBadge {\n /************\n * Internal *\n ************/\n\n // Classes\n private readonly classOutline = `mg-c-badge--outline`;\n\n /**************\n * Decorators *\n **************/\n\n /**\n * Badge value\n */\n @Prop() value!: string | number;\n @Watch('value')\n validateValue(newValue: MgBadge['value']): void {\n if (`${newValue}`.match(/^(\\d+\\+*|[?*!a-z])$/i) === null) {\n throw new Error('<mg-badge> prop \"value\" must be integer or ponctuation character.');\n }\n }\n\n /**\n * Badge label. Include short description.\n * Required for accessibility\n */\n @Prop() label!: string;\n @Watch('label')\n validateLabel(newValue: MgBadge['label']): void {\n if (!isValidString(newValue)) {\n throw new Error('<mg-badge> prop \"label\" is required.');\n }\n }\n\n /**\n * Define button variant\n */\n @Prop() variant?: BadgeVariantType = variants[0]; // info\n @Watch('variant')\n validateVariant(newValue: MgBadge['variant'], oldValue?: MgBadge['variant']): void {\n if (!variants.includes(newValue)) {\n throw new Error(`<mg-badge> prop \"variant\" must be one of: ${variants.join(', ')}.`);\n } else {\n if (oldValue !== undefined) {\n this.classCollection.delete(`mg-c-badge--${oldValue}`);\n }\n this.classCollection.add(`mg-c-badge--${newValue}`);\n }\n }\n\n /**\n * Define if button is using outline style\n */\n @Prop() outline: boolean;\n @Watch('outline')\n validateOutline(newValue: MgBadge['outline']): void {\n if (newValue) this.classCollection.add(this.classOutline);\n else this.classCollection.delete(this.classOutline);\n }\n\n /**\n * Component classes\n */\n @State() classCollection: ClassList = new ClassList(['mg-c-badge']);\n\n /**\n * Check if props are well configured on init\n */\n componentWillLoad(): void {\n this.validateValue(this.value);\n this.validateLabel(this.label);\n this.validateVariant(this.variant);\n this.validateOutline(this.outline);\n }\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <span class={this.classCollection.join()}>\n <span class=\"mg-c-badge__value\">{this.value}</span>\n <span class=\"mg-u-visually-hidden\">{this.label}</span>\n </span>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"mg-badge.js","sourceRoot":"","sources":["../../../../src/components/atoms/mg-badge/mg-badge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACjE,OAAO,EAAE,QAAQ,EAAoB,MAAM,iBAAiB,CAAC;AAC7D,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAM3E,MAAM,OAAO,OAAO;;IAClB;;kBAEc;IAEd,UAAU;IACO,iBAAY,GAAG,qBAAqB,CAAC;;;mBAgCjB,QAAQ,CAAC,CAAC,CAAC;;2BA0BV,IAAI,SAAS,CAAC,CAAC,YAAY,CAAC,CAAC;;EA/CnE,aAAa,CAAC,QAA0B;IACtC,IAAI,sBAAsB,CAAC,IAAI,CAAC,GAAG,QAAQ,EAAE,CAAC,KAAK,IAAI,EAAE;MACvD,MAAM,IAAI,KAAK,CAAC,mEAAmE,CAAC,CAAC;KACtF;EACH,CAAC;EAQD,aAAa,CAAC,QAA0B;IACtC,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,EAAE;MAC5B,MAAM,IAAI,KAAK,CAAC,sCAAsC,CAAC,CAAC;KACzD;EACH,CAAC;EAOD,eAAe,CAAC,QAA4B,EAAE,QAA6B;IACzE,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE;MAChC,MAAM,IAAI,KAAK,CAAC,6CAA6C,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;KACtF;SAAM;MACL,IAAI,QAAQ,KAAK,SAAS,EAAE;QAC1B,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,eAAe,QAAQ,EAAE,CAAC,CAAC;OACxD;MACD,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,eAAe,QAAQ,EAAE,CAAC,CAAC;KACrD;EACH,CAAC;EAOD,eAAe,CAAC,QAA4B;IAC1C,IAAI,QAAQ;MAAE,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;;MACrD,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;EACtD,CAAC;EAOD;;KAEG;EACH,iBAAiB;IACf,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC/B,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC/B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;EACrC,CAAC;EAED;;;KAGG;EACH,MAAM;IACJ,OAAO,CACL,YAAM,KAAK,EAAE,IAAI,CAAC,eAAe,CAAC,IAAI,EAAE;MACtC,YAAM,KAAK,EAAC,mBAAmB,IAAE,IAAI,CAAC,KAAK,CAAQ;MACnD,YAAM,KAAK,EAAC,sBAAsB,IAAE,IAAI,CAAC,KAAK,CAAQ,CACjD,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, State, Watch } from '@stencil/core';\nimport { variants, BadgeVariantType } from './mg-badge.conf';\nimport { ClassList, isValidString } from '../../../utils/components.utils';\n@Component({\n tag: 'mg-badge',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-badge.css',\n shadow: true,\n})\nexport class MgBadge {\n /************\n * Internal *\n ************/\n\n // Classes\n private readonly classOutline = `mg-c-badge--outline`;\n\n /**************\n * Decorators *\n **************/\n\n /**\n * Badge value\n */\n @Prop() value!: string | number;\n @Watch('value')\n validateValue(newValue: MgBadge['value']): void {\n if (/^(\\d+\\+*|[?*!a-z])$/i.exec(`${newValue}`) === null) {\n throw new Error('<mg-badge> prop \"value\" must be integer or ponctuation character.');\n }\n }\n\n /**\n * Badge label. Include short description.\n * Required for accessibility\n */\n @Prop() label!: string;\n @Watch('label')\n validateLabel(newValue: MgBadge['label']): void {\n if (!isValidString(newValue)) {\n throw new Error('<mg-badge> prop \"label\" is required.');\n }\n }\n\n /**\n * Define button variant\n */\n @Prop() variant?: BadgeVariantType = variants[0]; // info\n @Watch('variant')\n validateVariant(newValue: MgBadge['variant'], oldValue?: MgBadge['variant']): void {\n if (!variants.includes(newValue)) {\n throw new Error(`<mg-badge> prop \"variant\" must be one of: ${variants.join(', ')}.`);\n } else {\n if (oldValue !== undefined) {\n this.classCollection.delete(`mg-c-badge--${oldValue}`);\n }\n this.classCollection.add(`mg-c-badge--${newValue}`);\n }\n }\n\n /**\n * Define if button is using outline style\n */\n @Prop() outline: boolean;\n @Watch('outline')\n validateOutline(newValue: MgBadge['outline']): void {\n if (newValue) this.classCollection.add(this.classOutline);\n else this.classCollection.delete(this.classOutline);\n }\n\n /**\n * Component classes\n */\n @State() classCollection: ClassList = new ClassList(['mg-c-badge']);\n\n /**\n * Check if props are well configured on init\n */\n componentWillLoad(): void {\n this.validateValue(this.value);\n this.validateLabel(this.label);\n this.validateVariant(this.variant);\n this.validateOutline(this.outline);\n }\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <span class={this.classCollection.join()}>\n <span class=\"mg-c-badge__value\">{this.value}</span>\n <span class=\"mg-u-visually-hidden\">{this.label}</span>\n </span>\n );\n }\n}\n"]}
@@ -128,7 +128,8 @@ export class MgButton {
128
128
  * @returns html element
129
129
  */
130
130
  render() {
131
- return (h(Host, { role: "button", tabIndex: 0, type: this.type, form: this.form, "full-width": this.fullWidth, "aria-label": this.label, "aria-disabled": this.disabled !== undefined && this.disabled.toString(), onClick: this.handleClick, onKeyup: this.handleKeyup, onKeydown: this.handleKeydown }, h("div", { class: this.classCollection.join(), id: this.identifier }, this.loading && h("mg-icon", { icon: "loader", spin: true }), h("div", { class: "mg-c-button__content" }, h("slot", null)))));
131
+ var _a;
132
+ return (h(Host, { 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 }, h("div", { class: this.classCollection.join(), id: this.identifier }, this.loading && h("mg-icon", { icon: "loader", spin: true }), h("div", { class: "mg-c-button__content" }, h("slot", null)))));
132
133
  }
133
134
  static get is() { return "mg-button"; }
134
135
  static get encapsulation() { return "shadow"; }
@@ -1 +1 @@
1
- {"version":3,"file":"mg-button.js","sourceRoot":"","sources":["../../../../src/components/atoms/mg-button/mg-button.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, h, Prop, State, Watch, Host, EventEmitter, Event } from '@stencil/core';\nimport { variants, VariantType, ButtonType } from './mg-button.conf';\nimport { ClassList, isValidString } from '../../../utils/components.utils';\n\n@Component({\n tag: 'mg-button',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-button.css',\n shadow: true,\n})\nexport class MgButton {\n /************\n * Internal *\n ************/\n\n private onClickElementFn = null;\n private readonly classDisabled = 'mg-c-button--disabled';\n private readonly classLoading = 'mg-c-button--loading';\n private readonly classFullWidth = 'mg-c-button--full-width';\n\n /**************\n * Decorators *\n **************/\n\n /**\n * Get component DOM element\n */\n @Element() element: HTMLMgButtonElement;\n\n /**\n * Define button variant\n */\n @Prop() variant: VariantType = variants[0]; // Primary\n @Watch('variant')\n validateVariant(newValue: VariantType, oldValue?: VariantType): void {\n if (!variants.includes(newValue)) {\n throw new Error(`<mg-button> prop \"variant\" must be one of: ${variants.join(', ')}`);\n } else {\n if (oldValue !== undefined) {\n this.classCollection.delete(`mg-c-button--${oldValue}`);\n }\n this.classCollection.add(`mg-c-button--${newValue}`);\n }\n }\n\n /**\n * Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n */\n @Prop() identifier: string;\n\n /**\n * aria-label\n * In case button text is not explicit enough\n */\n @Prop() label: string;\n\n /**\n * Define button type\n */\n @Prop() type: ButtonType;\n\n /**\n * Set button to full-width\n */\n @Prop() fullWidth = false;\n @Watch('fullWidth')\n validateFullWidth(newValue: MgButton['fullWidth']): void {\n if (newValue && this.isIcon) {\n throw new Error('<mg-button> prop \"fullWidth\" cannot be used with prop \"isIcon\".');\n } else if (newValue) {\n this.classCollection.add(this.classFullWidth);\n } else {\n this.classCollection.delete(this.classFullWidth);\n }\n }\n\n /**\n * Define form id to attach button with.\n * If this attribute is not set, the <button> is associated with its ancestor <form> element.\n */\n @Prop() form: string;\n\n /**\n * Disable button\n */\n @Prop({ mutable: true }) disabled: boolean;\n @Watch('disabled')\n disabledHandler(isDisabled: MgButton['disabled']): void {\n // Remove loading when enable\n // Will be set back onclick\n if (!isDisabled && this.disableOnClick) {\n this.loading = false;\n }\n // Manage if onclick\n this.element.onclick = isDisabled ? undefined : this.onClickElementFn;\n\n // apply style\n if (isDisabled) {\n this.classCollection.add(this.classDisabled);\n } else {\n this.classCollection.delete(this.classDisabled);\n }\n\n // emit value update\n this.disabledChange.emit(isDisabled);\n }\n /**\n * Define if button is round.\n * Used for icon button.\n */\n @Prop() isIcon = false;\n\n /**\n * Option to set input disable on click, in order to prevent multi-click.\n * Parent component have to remove the attribute 'disabled' when the process ends.\n */\n @Prop() disableOnClick = false;\n\n /**\n * Define if button is loading, default to false.\n * Trigger when button is clicked or key-up ['enter', 'space], then value change to true.\n * It's required to reset to false when action/promise in parent is done to stop the loading state\n */\n @State() loading = false;\n @Watch('loading')\n loadingHandler(newValue: MgButton['loading']): void {\n // we add loading style if it newvalue is true else we remove it\n if (newValue) {\n this.classCollection.add(this.classLoading);\n } else {\n this.classCollection.delete(this.classLoading);\n }\n }\n\n /**\n * Component classes\n */\n @State() classCollection: ClassList = new ClassList(['mg-c-button']);\n\n /**\n * Emmited event when disabled change\n */\n @Event({ eventName: 'disabled-change' }) disabledChange: EventEmitter<MgButton['disabled']>;\n\n /**\n * Trigger actions onClick event\n * @param event - click event\n */\n private handleClick = (event: MouseEvent): void => {\n if (this.disabled) event.stopPropagation();\n // Used to prevent multi-click.\n else if (this.disableOnClick) {\n this.loading = true;\n this.disabled = true;\n }\n };\n\n /**\n * Handle onKeydown event\n * @param event - keyboard event\n */\n private handleKeydown = (event: KeyboardEvent): void => {\n if (!this.disabled && event.key === ' ') {\n event.preventDefault();\n } else if (!this.disabled && ['Enter', 'NumpadEnter', 'Space'].includes(event.key)) {\n event.preventDefault();\n this.element.dispatchEvent(new MouseEvent('click', { bubbles: true }));\n }\n };\n\n /**\n * Handle onKeyup event\n * @param event - keyboard event\n */\n private handleKeyup = (event: KeyboardEvent): void => {\n if (!this.disabled && event.key === ' ') {\n event.preventDefault();\n this.element.dispatchEvent(new MouseEvent('click', { bubbles: true }));\n }\n };\n\n /**\n * Check if props are well configured on init\n */\n componentWillLoad(): void {\n this.validateVariant(this.variant);\n this.validateFullWidth(this.fullWidth);\n if (this.isIcon) {\n this.classCollection.add(`mg-c-button--icon`);\n if (!isValidString(this.label)) {\n throw new Error(`<mg-button> prop \"label\" is mandatory when prop \"isIcon\" is set to true.`);\n }\n }\n // Store the onclick fn\n this.onClickElementFn = this.element.onclick;\n this.disabledHandler(this.disabled);\n }\n\n /**\n * Render component\n * @returns html element\n */\n render(): HTMLElement {\n return (\n <Host\n role=\"button\"\n tabIndex={0}\n type={this.type}\n form={this.form}\n full-width={this.fullWidth}\n aria-label={this.label}\n aria-disabled={this.disabled !== undefined && this.disabled.toString()}\n onClick={this.handleClick}\n onKeyup={this.handleKeyup}\n onKeydown={this.handleKeydown}\n >\n <div class={this.classCollection.join()} id={this.identifier}>\n {this.loading && <mg-icon icon=\"loader\" spin></mg-icon>}\n <div class=\"mg-c-button__content\">\n <slot></slot>\n </div>\n </div>\n </Host>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"mg-button.js","sourceRoot":"","sources":["../../../../src/components/atoms/mg-button/mg-button.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, h, Prop, State, Watch, Host, EventEmitter, Event } from '@stencil/core';\nimport { variants, VariantType, ButtonType } from './mg-button.conf';\nimport { ClassList, isValidString } from '../../../utils/components.utils';\n\n@Component({\n tag: 'mg-button',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-button.css',\n shadow: true,\n})\nexport class MgButton {\n /************\n * Internal *\n ************/\n\n private onClickElementFn = null;\n private readonly classDisabled = 'mg-c-button--disabled';\n private readonly classLoading = 'mg-c-button--loading';\n private readonly classFullWidth = 'mg-c-button--full-width';\n\n /**************\n * Decorators *\n **************/\n\n /**\n * Get component DOM element\n */\n @Element() element: HTMLMgButtonElement;\n\n /**\n * Define button variant\n */\n @Prop() variant: VariantType = variants[0]; // Primary\n @Watch('variant')\n validateVariant(newValue: VariantType, oldValue?: VariantType): void {\n if (!variants.includes(newValue)) {\n throw new Error(`<mg-button> prop \"variant\" must be one of: ${variants.join(', ')}`);\n } else {\n if (oldValue !== undefined) {\n this.classCollection.delete(`mg-c-button--${oldValue}`);\n }\n this.classCollection.add(`mg-c-button--${newValue}`);\n }\n }\n\n /**\n * Identifier is used for the element ID (id is a reserved prop in Stencil.js)\n */\n @Prop() identifier: string;\n\n /**\n * aria-label\n * In case button text is not explicit enough\n */\n @Prop() label: string;\n\n /**\n * Define button type\n */\n @Prop() type: ButtonType;\n\n /**\n * Set button to full-width\n */\n @Prop() fullWidth = false;\n @Watch('fullWidth')\n validateFullWidth(newValue: MgButton['fullWidth']): void {\n if (newValue && this.isIcon) {\n throw new Error('<mg-button> prop \"fullWidth\" cannot be used with prop \"isIcon\".');\n } else if (newValue) {\n this.classCollection.add(this.classFullWidth);\n } else {\n this.classCollection.delete(this.classFullWidth);\n }\n }\n\n /**\n * Define form id to attach button with.\n * If this attribute is not set, the <button> is associated with its ancestor <form> element.\n */\n @Prop() form: string;\n\n /**\n * Disable button\n */\n @Prop({ mutable: true }) disabled: boolean;\n @Watch('disabled')\n disabledHandler(isDisabled: MgButton['disabled']): void {\n // Remove loading when enable\n // Will be set back onclick\n if (!isDisabled && this.disableOnClick) {\n this.loading = false;\n }\n // Manage if onclick\n this.element.onclick = isDisabled ? undefined : this.onClickElementFn;\n\n // apply style\n if (isDisabled) {\n this.classCollection.add(this.classDisabled);\n } else {\n this.classCollection.delete(this.classDisabled);\n }\n\n // emit value update\n this.disabledChange.emit(isDisabled);\n }\n /**\n * Define if button is round.\n * Used for icon button.\n */\n @Prop() isIcon = false;\n\n /**\n * Option to set input disable on click, in order to prevent multi-click.\n * Parent component have to remove the attribute 'disabled' when the process ends.\n */\n @Prop() disableOnClick = false;\n\n /**\n * Define if button is loading, default to false.\n * Trigger when button is clicked or key-up ['enter', 'space], then value change to true.\n * It's required to reset to false when action/promise in parent is done to stop the loading state\n */\n @State() loading = false;\n @Watch('loading')\n loadingHandler(newValue: MgButton['loading']): void {\n // we add loading style if it newvalue is true else we remove it\n if (newValue) {\n this.classCollection.add(this.classLoading);\n } else {\n this.classCollection.delete(this.classLoading);\n }\n }\n\n /**\n * Component classes\n */\n @State() classCollection: ClassList = new ClassList(['mg-c-button']);\n\n /**\n * Emmited event when disabled change\n */\n @Event({ eventName: 'disabled-change' }) disabledChange: EventEmitter<MgButton['disabled']>;\n\n /**\n * Trigger actions onClick event\n * @param event - click event\n */\n private handleClick = (event: MouseEvent): void => {\n if (this.disabled) event.stopPropagation();\n // Used to prevent multi-click.\n else if (this.disableOnClick) {\n this.loading = true;\n this.disabled = true;\n }\n };\n\n /**\n * Handle onKeydown event\n * @param event - keyboard event\n */\n private handleKeydown = (event: KeyboardEvent): void => {\n if (!this.disabled && event.key === ' ') {\n event.preventDefault();\n } else if (!this.disabled && ['Enter', 'NumpadEnter', 'Space'].includes(event.key)) {\n event.preventDefault();\n this.element.dispatchEvent(new MouseEvent('click', { bubbles: true }));\n }\n };\n\n /**\n * Handle onKeyup event\n * @param event - keyboard event\n */\n private handleKeyup = (event: KeyboardEvent): void => {\n if (!this.disabled && event.key === ' ') {\n event.preventDefault();\n this.element.dispatchEvent(new MouseEvent('click', { bubbles: true }));\n }\n };\n\n /**\n * Check if props are well configured on init\n */\n componentWillLoad(): void {\n this.validateVariant(this.variant);\n this.validateFullWidth(this.fullWidth);\n if (this.isIcon) {\n this.classCollection.add(`mg-c-button--icon`);\n if (!isValidString(this.label)) {\n throw new Error(`<mg-button> prop \"label\" is mandatory when prop \"isIcon\" is set to true.`);\n }\n }\n // Store the onclick fn\n this.onClickElementFn = this.element.onclick;\n this.disabledHandler(this.disabled);\n }\n\n /**\n * Render component\n * @returns html element\n */\n render(): HTMLElement {\n return (\n <Host\n role=\"button\"\n tabIndex={0}\n type={this.type}\n form={this.form}\n full-width={this.fullWidth}\n aria-label={this.label}\n aria-disabled={this.disabled?.toString()}\n onClick={this.handleClick}\n onKeyup={this.handleKeyup}\n onKeydown={this.handleKeydown}\n >\n <div class={this.classCollection.join()} id={this.identifier}>\n {this.loading && <mg-icon icon=\"loader\" spin></mg-icon>}\n <div class=\"mg-c-button__content\">\n <slot></slot>\n </div>\n </div>\n </Host>\n );\n }\n}\n"]}
@@ -23,11 +23,11 @@ export class MgCard {
23
23
  validateVariant(newValue, oldValue) {
24
24
  if (newValue && !variants.includes(newValue))
25
25
  throw new Error(`<${this.name}> prop "variant" must match VariantType type.`);
26
- if (Boolean(newValue)) {
26
+ if (newValue) {
27
27
  this.setDefaultVariantStyle();
28
28
  this.classCollection.add(`${this.classBase}--${newValue}`);
29
29
  }
30
- if (Boolean(oldValue))
30
+ if (oldValue)
31
31
  this.classCollection.delete(`${this.classBase}--${oldValue}`);
32
32
  }
33
33
  validateVariantStyle(newValue, oldValue) {
@@ -35,9 +35,9 @@ export class MgCard {
35
35
  throw new Error(`<${this.name}> prop "variantStyle" must match VariantStyleType type.`);
36
36
  else if (Boolean(newValue) && !variants.includes(this.variant))
37
37
  throw new Error(`<${this.name}> prop "variantStyle" must be paired with ${JSON.stringify(variants)} "variant" prop.`);
38
- if (Boolean(newValue))
38
+ if (newValue)
39
39
  this.classCollection.add(`${this.classBase}--${newValue}`);
40
- if (Boolean(oldValue))
40
+ if (oldValue)
41
41
  this.classCollection.delete(`${this.classBase}--${oldValue}`);
42
42
  }
43
43
  /*************
@@ -1 +1 @@
1
- {"version":3,"file":"mg-card.js","sourceRoot":"","sources":["../../../../src/components/atoms/mg-card/mg-card.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACjE,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAC5D,OAAO,EAAyB,aAAa,EAAoB,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAOlG,MAAM,OAAO,MAAM;;IACjB;;mBAEe;IAEE,SAAI,GAAG,SAAS,CAAC;IACjB,cAAS,GAAG,WAAW,CAAC;IAsCzC;;;OAGG;IACK,2BAAsB,GAAG,GAAS,EAAE;MAC1C,IAAI,IAAI,CAAC,YAAY,KAAK,SAAS;QAAE,IAAI,CAAC,YAAY,GAAG,UAAU,CAAC;IACtE,CAAC,CAAC;;;2BARoC,IAAI,SAAS,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;;EAzBrE,eAAe,CAAC,QAA2B,EAAE,QAA4B;IACvE,IAAI,QAAQ,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,QAAQ,CAAC;MAAE,MAAM,IAAI,KAAK,CAAC,IAAI,IAAI,CAAC,IAAI,+CAA+C,CAAC,CAAC;IAC5H,IAAI,OAAO,CAAC,QAAQ,CAAC,EAAE;MACrB,IAAI,CAAC,sBAAsB,EAAE,CAAC;MAC9B,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,SAAS,KAAK,QAAQ,EAAE,CAAC,CAAC;KAC5D;IACD,IAAI,OAAO,CAAC,QAAQ,CAAC;MAAE,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,GAAG,IAAI,CAAC,SAAS,KAAK,QAAQ,EAAE,CAAC,CAAC;EACvF,CAAC;EAOD,oBAAoB,CAAC,QAAgC,EAAE,QAAiC;IACtF,IAAI,QAAQ,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,QAAQ,CAAC;MAAE,MAAM,IAAI,KAAK,CAAC,IAAI,IAAI,CAAC,IAAI,yDAAyD,CAAC,CAAC;SACtI,IAAI,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC;MAC5D,MAAM,IAAI,KAAK,CAAC,IAAI,IAAI,CAAC,IAAI,6CAA6C,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,kBAAkB,CAAC,CAAC;IACxH,IAAI,OAAO,CAAC,QAAQ,CAAC;MAAE,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,SAAS,KAAK,QAAQ,EAAE,CAAC,CAAC;IAClF,IAAI,OAAO,CAAC,QAAQ,CAAC;MAAE,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,GAAG,IAAI,CAAC,SAAS,KAAK,QAAQ,EAAE,CAAC,CAAC;EACvF,CAAC;EAeD;;iBAEe;EAEf;;KAEG;EACH,iBAAiB;IACf,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnC,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;EAC/C,CAAC;EAED;;;KAGG;EACH,MAAM;;IACJ,OAAO,CACL,WAAK,KAAK,EAAE,IAAI,CAAC,eAAe,CAAC,IAAI,EAAE;MACpC,CAAA,MAAA,IAAI,CAAC,YAAY,0CAAE,UAAU,CAAC,MAAM,CAAC,KAAI,YAAM,KAAK,EAAC,gBAAgB,GAAQ;MAC9E,eAAa,CACT,CACP,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, State, Watch } from '@stencil/core';\nimport { ClassList } from '../../../utils/components.utils';\nimport { type VariantStyleType, variantStyles, type VariantType, variants } from './mg-card.conf';\n\n@Component({\n tag: 'mg-card',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-card.css',\n shadow: true,\n})\nexport class MgCard {\n /*************\n * Private *\n *************/\n\n private readonly name = 'mg-card';\n private readonly classBase = 'mg-c-card';\n\n /*************\n * Decorators *\n *************/\n\n /**\n * Define variant prop\n */\n @Prop() variant: undefined | VariantType;\n @Watch('variant')\n validateVariant(newValue: MgCard['variant'], oldValue?: MgCard['variant']) {\n if (newValue && !variants.includes(newValue)) throw new Error(`<${this.name}> prop \"variant\" must match VariantType type.`);\n if (Boolean(newValue)) {\n this.setDefaultVariantStyle();\n this.classCollection.add(`${this.classBase}--${newValue}`);\n }\n if (Boolean(oldValue)) this.classCollection.delete(`${this.classBase}--${oldValue}`);\n }\n\n /**\n * Define variantStyle prop\n */\n @Prop({ mutable: true }) variantStyle: undefined | VariantStyleType;\n @Watch('variantStyle')\n validateVariantStyle(newValue: MgCard['variantStyle'], oldValue?: MgCard['variantStyle']) {\n if (newValue && !variantStyles.includes(newValue)) throw new Error(`<${this.name}> prop \"variantStyle\" must match VariantStyleType type.`);\n else if (Boolean(newValue) && !variants.includes(this.variant))\n throw new Error(`<${this.name}> prop \"variantStyle\" must be paired with ${JSON.stringify(variants)} \"variant\" prop.`);\n if (Boolean(newValue)) this.classCollection.add(`${this.classBase}--${newValue}`);\n if (Boolean(oldValue)) this.classCollection.delete(`${this.classBase}--${oldValue}`);\n }\n\n /**\n * Component classes\n */\n @State() classCollection: ClassList = new ClassList([this.classBase]);\n\n /**\n * Methode to set default varianStyle props\n * needeed has stencil doesn't know that props is mutated when updated in prop watcher\n */\n private setDefaultVariantStyle = (): void => {\n if (this.variantStyle === undefined) this.variantStyle = 'bar-left';\n };\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Check if props are well configured on init\n */\n componentWillLoad(): void {\n this.validateVariant(this.variant);\n this.validateVariantStyle(this.variantStyle);\n }\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <div class={this.classCollection.join()}>\n {this.variantStyle?.startsWith('bar-') && <span class=\"mg-c-card__bar\"></span>}\n <slot></slot>\n </div>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"mg-card.js","sourceRoot":"","sources":["../../../../src/components/atoms/mg-card/mg-card.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACjE,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAC5D,OAAO,EAAyB,aAAa,EAAoB,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAOlG,MAAM,OAAO,MAAM;;IACjB;;mBAEe;IAEE,SAAI,GAAG,SAAS,CAAC;IACjB,cAAS,GAAG,WAAW,CAAC;IAsCzC;;;OAGG;IACK,2BAAsB,GAAG,GAAS,EAAE;MAC1C,IAAI,IAAI,CAAC,YAAY,KAAK,SAAS;QAAE,IAAI,CAAC,YAAY,GAAG,UAAU,CAAC;IACtE,CAAC,CAAC;;;2BARoC,IAAI,SAAS,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;;EAzBrE,eAAe,CAAC,QAA2B,EAAE,QAA4B;IACvE,IAAI,QAAQ,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,QAAQ,CAAC;MAAE,MAAM,IAAI,KAAK,CAAC,IAAI,IAAI,CAAC,IAAI,+CAA+C,CAAC,CAAC;IAC5H,IAAI,QAAQ,EAAE;MACZ,IAAI,CAAC,sBAAsB,EAAE,CAAC;MAC9B,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,SAAS,KAAK,QAAQ,EAAE,CAAC,CAAC;KAC5D;IACD,IAAI,QAAQ;MAAE,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,GAAG,IAAI,CAAC,SAAS,KAAK,QAAQ,EAAE,CAAC,CAAC;EAC9E,CAAC;EAOD,oBAAoB,CAAC,QAAgC,EAAE,QAAiC;IACtF,IAAI,QAAQ,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,QAAQ,CAAC;MAAE,MAAM,IAAI,KAAK,CAAC,IAAI,IAAI,CAAC,IAAI,yDAAyD,CAAC,CAAC;SACtI,IAAI,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC;MAC5D,MAAM,IAAI,KAAK,CAAC,IAAI,IAAI,CAAC,IAAI,6CAA6C,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,kBAAkB,CAAC,CAAC;IACxH,IAAI,QAAQ;MAAE,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,SAAS,KAAK,QAAQ,EAAE,CAAC,CAAC;IACzE,IAAI,QAAQ;MAAE,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,GAAG,IAAI,CAAC,SAAS,KAAK,QAAQ,EAAE,CAAC,CAAC;EAC9E,CAAC;EAeD;;iBAEe;EAEf;;KAEG;EACH,iBAAiB;IACf,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACnC,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;EAC/C,CAAC;EAED;;;KAGG;EACH,MAAM;;IACJ,OAAO,CACL,WAAK,KAAK,EAAE,IAAI,CAAC,eAAe,CAAC,IAAI,EAAE;MACpC,CAAA,MAAA,IAAI,CAAC,YAAY,0CAAE,UAAU,CAAC,MAAM,CAAC,KAAI,YAAM,KAAK,EAAC,gBAAgB,GAAQ;MAC9E,eAAa,CACT,CACP,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, State, Watch } from '@stencil/core';\nimport { ClassList } from '../../../utils/components.utils';\nimport { type VariantStyleType, variantStyles, type VariantType, variants } from './mg-card.conf';\n\n@Component({\n tag: 'mg-card',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-card.css',\n shadow: true,\n})\nexport class MgCard {\n /*************\n * Private *\n *************/\n\n private readonly name = 'mg-card';\n private readonly classBase = 'mg-c-card';\n\n /*************\n * Decorators *\n *************/\n\n /**\n * Define variant prop\n */\n @Prop() variant: undefined | VariantType;\n @Watch('variant')\n validateVariant(newValue: MgCard['variant'], oldValue?: MgCard['variant']) {\n if (newValue && !variants.includes(newValue)) throw new Error(`<${this.name}> prop \"variant\" must match VariantType type.`);\n if (newValue) {\n this.setDefaultVariantStyle();\n this.classCollection.add(`${this.classBase}--${newValue}`);\n }\n if (oldValue) this.classCollection.delete(`${this.classBase}--${oldValue}`);\n }\n\n /**\n * Define variantStyle prop\n */\n @Prop({ mutable: true }) variantStyle: undefined | VariantStyleType;\n @Watch('variantStyle')\n validateVariantStyle(newValue: MgCard['variantStyle'], oldValue?: MgCard['variantStyle']) {\n if (newValue && !variantStyles.includes(newValue)) throw new Error(`<${this.name}> prop \"variantStyle\" must match VariantStyleType type.`);\n else if (Boolean(newValue) && !variants.includes(this.variant))\n throw new Error(`<${this.name}> prop \"variantStyle\" must be paired with ${JSON.stringify(variants)} \"variant\" prop.`);\n if (newValue) this.classCollection.add(`${this.classBase}--${newValue}`);\n if (oldValue) this.classCollection.delete(`${this.classBase}--${oldValue}`);\n }\n\n /**\n * Component classes\n */\n @State() classCollection: ClassList = new ClassList([this.classBase]);\n\n /**\n * Methode to set default varianStyle props\n * needeed has stencil doesn't know that props is mutated when updated in prop watcher\n */\n private setDefaultVariantStyle = (): void => {\n if (this.variantStyle === undefined) this.variantStyle = 'bar-left';\n };\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Check if props are well configured on init\n */\n componentWillLoad(): void {\n this.validateVariant(this.variant);\n this.validateVariantStyle(this.variantStyle);\n }\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <div class={this.classCollection.join()}>\n {this.variantStyle?.startsWith('bar-') && <span class=\"mg-c-card__bar\"></span>}\n <slot></slot>\n </div>\n );\n }\n}\n"]}
@@ -51,7 +51,7 @@ export class MgIcon {
51
51
  }
52
52
  }
53
53
  validateVariant(newValue, oldValue) {
54
- if (Boolean(newValue)) {
54
+ if (newValue) {
55
55
  if (!variants.includes(newValue))
56
56
  throw new Error(`<mg-icon> prop "variant" must be one of: ${variants.join(', ')}`);
57
57
  else {
@@ -63,7 +63,7 @@ export class MgIcon {
63
63
  }
64
64
  }
65
65
  validateVariantStyle(newValue, oldValue) {
66
- if (Boolean(newValue)) {
66
+ if (newValue) {
67
67
  if (!variantStyles.includes(newValue))
68
68
  throw new Error(`<mg-icon> prop "variantStyle" must be one of: ${variantStyles.join(', ')}`);
69
69
  else {
@@ -1 +1 @@
1
- {"version":3,"file":"mg-icon.js","sourceRoot":"","sources":["../../../../src/components/atoms/mg-icon/mg-icon.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, Watch, State, Element } from '@stencil/core';\nimport { sizes, variants, IconVariantType, IconSizeType, IconVariantStyleType, variantStyles } from './mg-icon.conf';\nimport { ClassList } from '../../../utils/components.utils';\nimport iconList from '@mgdis/img/dist/icons/index.json';\nimport { icons } from '../../../assets/icons';\n\n@Component({\n tag: 'mg-icon',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-icon.css',\n shadow: true,\n})\nexport class MgIcon {\n private svg: SVGSVGElement;\n\n /**\n * Icon HTML Element\n */\n @Element() element: HTMLMgIconElement;\n\n /**\n * Icon to display.\n */\n @Prop() icon!: string;\n @Watch('icon')\n validateIcon(newValue: MgIcon['icon'], oldValue?: MgIcon['icon']): void {\n if (!iconList.includes(newValue)) throw new Error(`<mg-icon> prop \"icon\" must be one of: ${iconList.join(', ')}`);\n else {\n if (oldValue !== undefined) this.classCollection.delete(`mg-c-icon--${oldValue}`);\n this.classCollection.add(`mg-c-icon--${newValue}`);\n this.renderIcon(newValue);\n }\n }\n\n /**\n * Define icon size\n */\n @Prop() size: IconSizeType = 'regular';\n @Watch('size')\n validateSize(newValue: MgIcon['size'], oldValue?: MgIcon['size']): void {\n if (!sizes.includes(newValue)) throw new Error(`<mg-icon> prop \"size\" must be one of: ${sizes.join(', ')}`);\n else {\n if (oldValue !== undefined) this.classCollection.delete(`mg-c-icon--size-${oldValue}`);\n this.classCollection.add(`mg-c-icon--size-${newValue}`);\n }\n }\n\n /**\n * Define icon variant color\n */\n @Prop() variant: IconVariantType;\n @Watch('variant')\n validateVariant(newValue: MgIcon['variant'], oldValue?: MgIcon['variant']): void {\n if (Boolean(newValue)) {\n if (!variants.includes(newValue)) throw new Error(`<mg-icon> prop \"variant\" must be one of: ${variants.join(', ')}`);\n else {\n this.setDefaultVariantStyle();\n if (oldValue !== undefined) this.classCollection.delete(`mg-c-icon--variant-${oldValue}`);\n this.classCollection.add(`mg-c-icon--variant-${newValue}`);\n }\n }\n }\n\n /**\n * Define icon color variant style\n * Add a color to the icon based on variant color with given style\n * 'full': Used to set a circular background with variant soft color and icon variant color\n * 'background': Used to set a circular background with variant soft color\n * 'icon': Used to set a color only to the icon\n */\n @Prop({ mutable: true }) variantStyle: IconVariantStyleType;\n @Watch('variantStyle')\n validateVariantStyle(newValue: MgIcon['variantStyle'], oldValue?: MgIcon['variantStyle']): void {\n if (Boolean(newValue)) {\n if (!variantStyles.includes(newValue)) throw new Error(`<mg-icon> prop \"variantStyle\" must be one of: ${variantStyles.join(', ')}`);\n else {\n if (oldValue !== undefined) this.classCollection.delete(`mg-c-icon--variant-style-${oldValue}`);\n this.classCollection.add(`mg-c-icon--variant-style-${newValue}`);\n }\n }\n }\n\n /**\n * Make the icon spin\n */\n @Prop() spin = false;\n @Watch('spin')\n handleSpin(newValue: MgIcon['spin']): void {\n if (newValue) {\n this.classCollection.add('mg-c-icon--spin');\n } else {\n this.classCollection.delete('mg-c-icon--spin');\n }\n }\n\n /**\n * Component classes\n */\n @State() classCollection: ClassList = new ClassList(['mg-c-icon']);\n\n /**\n * Method to set default varianStyle props\n * needeed has stencil doesn't know that props is mutated when updated in prop watcher\n */\n private setDefaultVariantStyle = (): void => {\n if (this.variantStyle === undefined) this.variantStyle = 'background';\n };\n\n /**\n * Render icon in shadowroot\n * @param icon - icon to render\n */\n private renderIcon = icon => {\n this.element.shadowRoot.innerHTML = icons[icon];\n this.svg = this.element.shadowRoot.querySelector('svg');\n // update svg attributes\n this.svg.setAttribute('aria-hidden', 'true');\n this.svg.setAttribute('focusable', 'false');\n this.svg.setAttribute('class', this.classCollection.join());\n };\n\n /**\n * Check if props are well configured on init\n */\n componentWillLoad(): void {\n this.validateIcon(this.icon);\n this.validateSize(this.size);\n this.validateVariant(this.variant);\n this.validateVariantStyle(this.variantStyle);\n this.handleSpin(this.spin);\n // render icon\n this.renderIcon(this.icon);\n }\n\n /**\n * update html when component trigger changes\n */\n componentWillUpdate() {\n this.svg.setAttribute('class', this.classCollection.join());\n }\n}\n"]}
1
+ {"version":3,"file":"mg-icon.js","sourceRoot":"","sources":["../../../../src/components/atoms/mg-icon/mg-icon.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, Watch, State, Element } from '@stencil/core';\nimport { sizes, variants, IconVariantType, IconSizeType, IconVariantStyleType, variantStyles } from './mg-icon.conf';\nimport { ClassList } from '../../../utils/components.utils';\nimport iconList from '@mgdis/img/dist/icons/index.json';\nimport { icons } from '../../../assets/icons';\n\n@Component({\n tag: 'mg-icon',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-icon.css',\n shadow: true,\n})\nexport class MgIcon {\n private svg: SVGSVGElement;\n\n /**\n * Icon HTML Element\n */\n @Element() element: HTMLMgIconElement;\n\n /**\n * Icon to display.\n */\n @Prop() icon!: string;\n @Watch('icon')\n validateIcon(newValue: MgIcon['icon'], oldValue?: MgIcon['icon']): void {\n if (!iconList.includes(newValue)) throw new Error(`<mg-icon> prop \"icon\" must be one of: ${iconList.join(', ')}`);\n else {\n if (oldValue !== undefined) this.classCollection.delete(`mg-c-icon--${oldValue}`);\n this.classCollection.add(`mg-c-icon--${newValue}`);\n this.renderIcon(newValue);\n }\n }\n\n /**\n * Define icon size\n */\n @Prop() size: IconSizeType = 'regular';\n @Watch('size')\n validateSize(newValue: MgIcon['size'], oldValue?: MgIcon['size']): void {\n if (!sizes.includes(newValue)) throw new Error(`<mg-icon> prop \"size\" must be one of: ${sizes.join(', ')}`);\n else {\n if (oldValue !== undefined) this.classCollection.delete(`mg-c-icon--size-${oldValue}`);\n this.classCollection.add(`mg-c-icon--size-${newValue}`);\n }\n }\n\n /**\n * Define icon variant color\n */\n @Prop() variant: IconVariantType;\n @Watch('variant')\n validateVariant(newValue: MgIcon['variant'], oldValue?: MgIcon['variant']): void {\n if (newValue) {\n if (!variants.includes(newValue)) throw new Error(`<mg-icon> prop \"variant\" must be one of: ${variants.join(', ')}`);\n else {\n this.setDefaultVariantStyle();\n if (oldValue !== undefined) this.classCollection.delete(`mg-c-icon--variant-${oldValue}`);\n this.classCollection.add(`mg-c-icon--variant-${newValue}`);\n }\n }\n }\n\n /**\n * Define icon color variant style\n * Add a color to the icon based on variant color with given style\n * 'full': Used to set a circular background with variant soft color and icon variant color\n * 'background': Used to set a circular background with variant soft color\n * 'icon': Used to set a color only to the icon\n */\n @Prop({ mutable: true }) variantStyle: IconVariantStyleType;\n @Watch('variantStyle')\n validateVariantStyle(newValue: MgIcon['variantStyle'], oldValue?: MgIcon['variantStyle']): void {\n if (newValue) {\n if (!variantStyles.includes(newValue)) throw new Error(`<mg-icon> prop \"variantStyle\" must be one of: ${variantStyles.join(', ')}`);\n else {\n if (oldValue !== undefined) this.classCollection.delete(`mg-c-icon--variant-style-${oldValue}`);\n this.classCollection.add(`mg-c-icon--variant-style-${newValue}`);\n }\n }\n }\n\n /**\n * Make the icon spin\n */\n @Prop() spin = false;\n @Watch('spin')\n handleSpin(newValue: MgIcon['spin']): void {\n if (newValue) {\n this.classCollection.add('mg-c-icon--spin');\n } else {\n this.classCollection.delete('mg-c-icon--spin');\n }\n }\n\n /**\n * Component classes\n */\n @State() classCollection: ClassList = new ClassList(['mg-c-icon']);\n\n /**\n * Method to set default varianStyle props\n * needeed has stencil doesn't know that props is mutated when updated in prop watcher\n */\n private setDefaultVariantStyle = (): void => {\n if (this.variantStyle === undefined) this.variantStyle = 'background';\n };\n\n /**\n * Render icon in shadowroot\n * @param icon - icon to render\n */\n private renderIcon = icon => {\n this.element.shadowRoot.innerHTML = icons[icon];\n this.svg = this.element.shadowRoot.querySelector('svg');\n // update svg attributes\n this.svg.setAttribute('aria-hidden', 'true');\n this.svg.setAttribute('focusable', 'false');\n this.svg.setAttribute('class', this.classCollection.join());\n };\n\n /**\n * Check if props are well configured on init\n */\n componentWillLoad(): void {\n this.validateIcon(this.icon);\n this.validateSize(this.size);\n this.validateVariant(this.variant);\n this.validateVariantStyle(this.variantStyle);\n this.handleSpin(this.spin);\n // render icon\n this.renderIcon(this.icon);\n }\n\n /**\n * update html when component trigger changes\n */\n componentWillUpdate() {\n this.svg.setAttribute('class', this.classCollection.join());\n }\n}\n"]}
@@ -4,6 +4,7 @@ export class MgInputTitle {
4
4
  constructor() {
5
5
  this.identifier = undefined;
6
6
  this.required = undefined;
7
+ this.readonly = undefined;
7
8
  this.isLegend = false;
8
9
  this.tagName = 'label';
9
10
  }
@@ -30,7 +31,7 @@ export class MgInputTitle {
30
31
  * @returns HTML element
31
32
  */
32
33
  render() {
33
- const TagName = this.tagName;
34
+ const TagName = this.readonly ? 'span' : this.tagName;
34
35
  // \u00A0 represent a &nbsp;
35
36
  return (h(TagName, { class: "mg-c-input-title", htmlFor: this.isLegend ? undefined : this.identifier }, h("slot", null), this.required && (h("span", { class: "mg-c-input-title__required" }, "\u00A0", h("span", { class: "mg-u-is-asterisk" }, "*")))));
36
37
  }
@@ -82,6 +83,23 @@ export class MgInputTitle {
82
83
  "attribute": "required",
83
84
  "reflect": false
84
85
  },
86
+ "readonly": {
87
+ "type": "boolean",
88
+ "mutable": false,
89
+ "complexType": {
90
+ "original": "boolean",
91
+ "resolved": "boolean",
92
+ "references": {}
93
+ },
94
+ "required": false,
95
+ "optional": false,
96
+ "docs": {
97
+ "tags": [],
98
+ "text": "If input is required an asterisk is added at the end of the label"
99
+ },
100
+ "attribute": "readonly",
101
+ "reflect": false
102
+ },
85
103
  "isLegend": {
86
104
  "type": "boolean",
87
105
  "mutable": false,
@@ -1 +1 @@
1
- {"version":3,"file":"mg-input-title.js","sourceRoot":"","sources":["../../../../src/components/atoms/mg-input-title/mg-input-title.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACjE,OAAO,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAOhE,MAAM,OAAO,YAAY;;;;oBAoBJ,KAAK;mBASL,OAAO;;EAvB1B,kBAAkB,CAAC,QAAoC;IACrD,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,EAAE;MAC5B,MAAM,IAAI,KAAK,CAAC,iDAAiD,CAAC,CAAC;KACpE;EACH,CAAC;EAYD,gBAAgB,CAAC,QAAkC;IACjD,IAAI,CAAC,OAAO,GAAG,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC;EAC/C,CAAC;EAOD;;iBAEe;EAEf;;KAEG;EACH,iBAAiB;IACf,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;IACzC,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;EACvC,CAAC;EAED;;;KAGG;EACH,MAAM;IACJ,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC;IAC7B,4BAA4B;IAC5B,OAAO,CACL,EAAC,OAAO,IAAC,KAAK,EAAC,kBAAkB,EAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,UAAU;MACpF,eAAa;MACZ,IAAI,CAAC,QAAQ,IAAI,CAChB,YAAM,KAAK,EAAC,4BAA4B;;QAChC,YAAM,KAAK,EAAC,kBAAkB,QAAS,CACxC,CACR,CACO,CACX,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, State, Watch } from '@stencil/core';\nimport { isValidString } from '../../../utils/components.utils';\n\n@Component({\n tag: 'mg-input-title',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-input-title.css',\n scoped: true,\n})\nexport class MgInputTitle {\n /**\n * Label input id\n */\n @Prop() identifier!: string;\n @Watch('identifier')\n validateIdentifier(newValue: MgInputTitle['identifier']): void {\n if (!isValidString(newValue)) {\n throw new Error('<mg-input-title> prop \"identifier\" is required.');\n }\n }\n\n /**\n * If input is required an asterisk is added at the end of the label\n */\n @Prop() required: boolean;\n\n /**\n * Switch from label to fieldset sementic\n */\n @Prop() isLegend = false;\n @Watch('isLegend')\n validateIsLegend(newValue: MgInputTitle['isLegend']) {\n this.tagName = newValue ? 'legend' : 'label';\n }\n\n /**\n * Component parent tagname\n */\n @State() tagName = 'label';\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Init tag name\n */\n componentWillLoad(): void {\n this.validateIdentifier(this.identifier);\n this.validateIsLegend(this.isLegend);\n }\n\n /**\n * Render\n * @returns HTML element\n */\n render(): HTMLElement {\n const TagName = this.tagName;\n // \\u00A0 represent a &nbsp;\n return (\n <TagName class=\"mg-c-input-title\" htmlFor={this.isLegend ? undefined : this.identifier}>\n <slot></slot>\n {this.required && (\n <span class=\"mg-c-input-title__required\">\n &nbsp;<span class=\"mg-u-is-asterisk\">*</span>\n </span>\n )}\n </TagName>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"mg-input-title.js","sourceRoot":"","sources":["../../../../src/components/atoms/mg-input-title/mg-input-title.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACjE,OAAO,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAC;AAOhE,MAAM,OAAO,YAAY;;;;;oBAyBJ,KAAK;mBASL,OAAO;;EA5B1B,kBAAkB,CAAC,QAAoC;IACrD,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,EAAE;MAC5B,MAAM,IAAI,KAAK,CAAC,iDAAiD,CAAC,CAAC;KACpE;EACH,CAAC;EAiBD,gBAAgB,CAAC,QAAkC;IACjD,IAAI,CAAC,OAAO,GAAG,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC;EAC/C,CAAC;EAOD;;iBAEe;EAEf;;KAEG;EACH,iBAAiB;IACf,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;IACzC,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;EACvC,CAAC;EAED;;;KAGG;EACH,MAAM;IACJ,MAAM,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC;IACtD,4BAA4B;IAC5B,OAAO,CACL,EAAC,OAAO,IAAC,KAAK,EAAC,kBAAkB,EAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,UAAU;MACpF,eAAa;MACZ,IAAI,CAAC,QAAQ,IAAI,CAChB,YAAM,KAAK,EAAC,4BAA4B;;QAChC,YAAM,KAAK,EAAC,kBAAkB,QAAS,CACxC,CACR,CACO,CACX,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop, State, Watch } from '@stencil/core';\nimport { isValidString } from '../../../utils/components.utils';\n\n@Component({\n tag: 'mg-input-title',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-input-title.css',\n scoped: true,\n})\nexport class MgInputTitle {\n /**\n * Label input id\n */\n @Prop() identifier!: string;\n @Watch('identifier')\n validateIdentifier(newValue: MgInputTitle['identifier']): void {\n if (!isValidString(newValue)) {\n throw new Error('<mg-input-title> prop \"identifier\" is required.');\n }\n }\n\n /**\n * If input is required an asterisk is added at the end of the label\n */\n @Prop() required: boolean;\n\n /**\n * If input is required an asterisk is added at the end of the label\n */\n @Prop() readonly: boolean;\n\n /**\n * Switch from label to fieldset sementic\n */\n @Prop() isLegend = false;\n @Watch('isLegend')\n validateIsLegend(newValue: MgInputTitle['isLegend']) {\n this.tagName = newValue ? 'legend' : 'label';\n }\n\n /**\n * Component parent tagname\n */\n @State() tagName = 'label';\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Init tag name\n */\n componentWillLoad(): void {\n this.validateIdentifier(this.identifier);\n this.validateIsLegend(this.isLegend);\n }\n\n /**\n * Render\n * @returns HTML element\n */\n render(): HTMLElement {\n const TagName = this.readonly ? 'span' : this.tagName;\n // \\u00A0 represent a &nbsp;\n return (\n <TagName class=\"mg-c-input-title\" htmlFor={this.isLegend ? undefined : this.identifier}>\n <slot></slot>\n {this.required && (\n <span class=\"mg-c-input-title__required\">\n &nbsp;<span class=\"mg-u-is-asterisk\">*</span>\n </span>\n )}\n </TagName>\n );\n }\n}\n"]}
@@ -0,0 +1,12 @@
1
+ import { renderAttributes } from "../../../../utils/e2e.test.utils";
2
+ import { setPageContent, describe, testEach, expect } from "../../../../utils/playwright.e2e.test.utils";
3
+ const createHtml = args => `<mg-input-title ${renderAttributes(Object.assign(Object.assign({}, args), { identifier: 'identifier' }))}>Label</mg-input-title>`;
4
+ const TIMEOUT = 1000;
5
+ describe('mg-input-title', () => {
6
+ testEach([true, false].flatMap(isLegend => [true, false].flatMap(required => [true, false].map(readonly => ({ isLegend, required, readonly })))))('Should render %s', async (page, args) => {
7
+ await setPageContent(page, createHtml(args));
8
+ await page.locator('mg-input-title.hydrated').waitFor({ timeout: TIMEOUT });
9
+ await expect(page.locator('.e2e-screenshot')).toHaveScreenshot();
10
+ });
11
+ });
12
+ //# sourceMappingURL=mg-input-title.e2e.playwright.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"mg-input-title.e2e.playwright.js","sourceRoot":"","sources":["../../../../../src/components/atoms/mg-input-title/test/mg-input-title.e2e.playwright.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,kCAAkC,CAAC;AACpE,OAAO,EAAE,cAAc,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAY,MAAM,6CAA6C,CAAC;AAEnH,MAAM,UAAU,GAAG,IAAI,CAAC,EAAE,CAAC,mBAAmB,gBAAgB,iCAAM,IAAI,KAAE,UAAU,EAAE,YAAY,IAAG,yBAAyB,CAAC;AAE/H,MAAM,OAAO,GAAG,IAAI,CAAC;AAErB,QAAQ,CAAC,gBAAgB,EAAE,GAAG,EAAE;EAC9B,QAAQ,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAC/I,kBAAkB,EAClB,KAAK,EAAE,IAAc,EAAE,IAAI,EAAE,EAAE;IAC7B,MAAM,cAAc,CAAC,IAAI,EAAE,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC;IAE7C,MAAM,IAAI,CAAC,OAAO,CAAC,yBAAyB,CAAC,CAAC,OAAO,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,CAAC,CAAC;IAE5E,MAAM,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC,CAAC,gBAAgB,EAAE,CAAC;EACnE,CAAC,CACF,CAAC;AACJ,CAAC,CAAC,CAAC","sourcesContent":["import { renderAttributes } from '../../../../utils/e2e.test.utils';\nimport { setPageContent, describe, testEach, expect, PageType } from '../../../../utils/playwright.e2e.test.utils';\n\nconst createHtml = args => `<mg-input-title ${renderAttributes({ ...args, identifier: 'identifier' })}>Label</mg-input-title>`;\n\nconst TIMEOUT = 1000;\n\ndescribe('mg-input-title', () => {\n testEach([true, false].flatMap(isLegend => [true, false].flatMap(required => [true, false].map(readonly => ({ isLegend, required, readonly })))))(\n 'Should render %s',\n async (page: PageType, args) => {\n await setPageContent(page, createHtml(args));\n\n await page.locator('mg-input-title.hydrated').waitFor({ timeout: TIMEOUT });\n\n await expect(page.locator('.e2e-screenshot')).toHaveScreenshot();\n },\n );\n});\n"]}
@@ -6,11 +6,7 @@ const getPage = args => newSpecPage({
6
6
  template: () => h("mg-input-title", Object.assign({}, args), "mg-input-title"),
7
7
  });
8
8
  describe('mg-input-title', () => {
9
- test.each([
10
- { required: false, identifier: 'identifier' },
11
- { required: true, identifier: 'identifier' },
12
- { isLegend: true, identifier: 'identifier' },
13
- ])('Should render label with args %s', async (args) => {
9
+ test.each([true, false].flatMap(isLegend => [true, false].flatMap(required => [true, false].map(readonly => ({ isLegend, required, readonly, identifier: 'identifier' })))))('Should render label with args %s', async (args) => {
14
10
  const { root } = await getPage(args);
15
11
  expect(root).toMatchSnapshot();
16
12
  });
@@ -1 +1 @@
1
- {"version":3,"file":"mg-input-title.spec.js","sourceRoot":"","sources":["../../../../../src/components/atoms/mg-input-title/test/mg-input-title.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAClC,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEjD,MAAM,OAAO,GAAG,IAAI,CAAC,EAAE,CACrB,WAAW,CAAC;EACV,UAAU,EAAE,CAAC,YAAY,CAAC;EAC1B,QAAQ,EAAE,GAAG,EAAE,CAAC,sCAAoB,IAAI,oBAAiC;CAC1E,CAAC,CAAC;AAEL,QAAQ,CAAC,gBAAgB,EAAE,GAAG,EAAE;EAC9B,IAAI,CAAC,IAAI,CAAC;IACR,EAAE,QAAQ,EAAE,KAAK,EAAE,UAAU,EAAE,YAAY,EAAE;IAC7C,EAAE,QAAQ,EAAE,IAAI,EAAE,UAAU,EAAE,YAAY,EAAE;IAC5C,EAAE,QAAQ,EAAE,IAAI,EAAE,UAAU,EAAE,YAAY,EAAE;GAC7C,CAAC,CAAC,kCAAkC,EAAE,KAAK,EAAC,IAAI,EAAC,EAAE;IAClD,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACrC,MAAM,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,CAAC;EACjC,CAAC,CAAC,CAAC;EAEH,IAAI,CAAC,IAAI,CAAC,CAAC,EAAE,EAAE,GAAG,EAAE,SAAS,CAAC,CAAC,CAAC,kDAAkD,EAAE,KAAK,EAAC,UAAU,EAAC,EAAE;IACrG,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;IACrB,IAAI;MACF,MAAM,OAAO,CAAC,EAAE,UAAU,EAAE,CAAC,CAAC;KAC/B;IAAC,OAAO,GAAG,EAAE;MACZ,MAAM,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,SAAS,CAAC,iDAAiD,CAAC,CAAC;KAClF;EACH,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { h } from '@stencil/core';\nimport { newSpecPage } from '@stencil/core/testing';\nimport { MgInputTitle } from '../mg-input-title';\n\nconst getPage = args =>\n newSpecPage({\n components: [MgInputTitle],\n template: () => <mg-input-title {...args}>mg-input-title</mg-input-title>,\n });\n\ndescribe('mg-input-title', () => {\n test.each([\n { required: false, identifier: 'identifier' },\n { required: true, identifier: 'identifier' },\n { isLegend: true, identifier: 'identifier' },\n ])('Should render label with args %s', async args => {\n const { root } = await getPage(args);\n expect(root).toMatchSnapshot();\n });\n\n test.each(['', ' ', undefined])('Should throw error, case invalid identifier prop', async identifier => {\n expect.assertions(1);\n try {\n await getPage({ identifier });\n } catch (err) {\n expect(err.message).toContain('<mg-input-title> prop \"identifier\" is required.');\n }\n });\n});\n"]}
1
+ {"version":3,"file":"mg-input-title.spec.js","sourceRoot":"","sources":["../../../../../src/components/atoms/mg-input-title/test/mg-input-title.spec.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAClC,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEjD,MAAM,OAAO,GAAG,IAAI,CAAC,EAAE,CACrB,WAAW,CAAC;EACV,UAAU,EAAE,CAAC,YAAY,CAAC;EAC1B,QAAQ,EAAE,GAAG,EAAE,CAAC,sCAAoB,IAAI,oBAAiC;CAC1E,CAAC,CAAC;AAEL,QAAQ,CAAC,gBAAgB,EAAE,GAAG,EAAE;EAC9B,IAAI,CAAC,IAAI,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,UAAU,EAAE,YAAY,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAC1K,kCAAkC,EAClC,KAAK,EAAC,IAAI,EAAC,EAAE;IACX,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACrC,MAAM,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,CAAC;EACjC,CAAC,CACF,CAAC;EAEF,IAAI,CAAC,IAAI,CAAC,CAAC,EAAE,EAAE,GAAG,EAAE,SAAS,CAAC,CAAC,CAAC,kDAAkD,EAAE,KAAK,EAAC,UAAU,EAAC,EAAE;IACrG,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;IACrB,IAAI;MACF,MAAM,OAAO,CAAC,EAAE,UAAU,EAAE,CAAC,CAAC;KAC/B;IAAC,OAAO,GAAG,EAAE;MACZ,MAAM,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,SAAS,CAAC,iDAAiD,CAAC,CAAC;KAClF;EACH,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { h } from '@stencil/core';\nimport { newSpecPage } from '@stencil/core/testing';\nimport { MgInputTitle } from '../mg-input-title';\n\nconst getPage = args =>\n newSpecPage({\n components: [MgInputTitle],\n template: () => <mg-input-title {...args}>mg-input-title</mg-input-title>,\n });\n\ndescribe('mg-input-title', () => {\n test.each([true, false].flatMap(isLegend => [true, false].flatMap(required => [true, false].map(readonly => ({ isLegend, required, readonly, identifier: 'identifier' })))))(\n 'Should render label with args %s',\n async args => {\n const { root } = await getPage(args);\n expect(root).toMatchSnapshot();\n },\n );\n\n test.each(['', ' ', undefined])('Should throw error, case invalid identifier prop', async identifier => {\n expect.assertions(1);\n try {\n await getPage({ identifier });\n } catch (err) {\n expect(err.message).toContain('<mg-input-title> prop \"identifier\" is required.');\n }\n });\n});\n"]}
@@ -119,7 +119,7 @@ export class MgTooltip {
119
119
  */
120
120
  this.initTooltip = (slotElement, interactiveElement) => {
121
121
  // Add tabindex to slotted element if we can't find any interactive element
122
- if (!this.disabled && !Boolean(interactiveElement)) {
122
+ if (!this.disabled && !interactiveElement) {
123
123
  this.hasCustomTabIndex = true;
124
124
  slotElement.tabIndex = 0;
125
125
  // Add role on non-interactive element to work with "aria-describedby" for screen readers