@mgdis/mg-components 5.17.0 → 5.19.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (348) hide show
  1. package/dist/cjs/{mg-menu.conf-43aacf30.js → components.utils-dc9c8a53.js} +160 -7
  2. package/dist/cjs/components.utils-dc9c8a53.js.map +1 -0
  3. package/dist/cjs/index-c042e24b.js +18 -1
  4. package/dist/cjs/loader.cjs.js +1 -1
  5. package/dist/cjs/mg-action-more_34.cjs.entry.js +761 -582
  6. package/dist/cjs/mg-action-more_34.cjs.entry.js.map +1 -1
  7. package/dist/cjs/mg-components.cjs.js +1 -1
  8. package/dist/cjs/mg-item-more.cjs.entry.js +5 -5
  9. package/dist/cjs/mg-item-more.cjs.entry.js.map +1 -1
  10. package/dist/collection/components/atoms/mg-badge/mg-badge.js +9 -9
  11. package/dist/collection/components/atoms/mg-badge/mg-badge.js.map +1 -1
  12. package/dist/collection/components/atoms/mg-badge/test/mg-badge.spec.js +5 -5
  13. package/dist/collection/components/atoms/mg-badge/test/mg-badge.spec.js.map +1 -1
  14. package/dist/collection/components/atoms/mg-button/mg-button.js +12 -12
  15. package/dist/collection/components/atoms/mg-button/mg-button.js.map +1 -1
  16. package/dist/collection/components/atoms/mg-button/test/mg-button.e2e.js +4 -4
  17. package/dist/collection/components/atoms/mg-button/test/mg-button.e2e.js.map +1 -1
  18. package/dist/collection/components/atoms/mg-button/test/mg-button.spec.js +3 -3
  19. package/dist/collection/components/atoms/mg-button/test/mg-button.spec.js.map +1 -1
  20. package/dist/collection/components/atoms/mg-card/mg-card.js +9 -9
  21. package/dist/collection/components/atoms/mg-card/mg-card.js.map +1 -1
  22. package/dist/collection/components/atoms/mg-character-left/mg-character-left.js +3 -3
  23. package/dist/collection/components/atoms/mg-character-left/mg-character-left.js.map +1 -1
  24. package/dist/collection/components/atoms/mg-divider/mg-divider.js +4 -4
  25. package/dist/collection/components/atoms/mg-divider/mg-divider.js.map +1 -1
  26. package/dist/collection/components/atoms/mg-icon/mg-icon.js +13 -15
  27. package/dist/collection/components/atoms/mg-icon/mg-icon.js.map +1 -1
  28. package/dist/collection/components/atoms/mg-icon/test/mg-icon.spec.js +4 -4
  29. package/dist/collection/components/atoms/mg-icon/test/mg-icon.spec.js.map +1 -1
  30. package/dist/collection/components/atoms/mg-input-title/mg-input-title.js +5 -4
  31. package/dist/collection/components/atoms/mg-input-title/mg-input-title.js.map +1 -1
  32. package/dist/collection/components/atoms/mg-tag/mg-tag.js +9 -9
  33. package/dist/collection/components/atoms/mg-tag/mg-tag.js.map +1 -1
  34. package/dist/collection/components/atoms/mg-tag/test/mg-tag.e2e.playwright.js +23 -0
  35. package/dist/collection/components/atoms/mg-tag/test/mg-tag.e2e.playwright.js.map +1 -0
  36. package/dist/collection/components/atoms/mg-tag/test/mg-tag.spec.js +5 -5
  37. package/dist/collection/components/atoms/mg-tag/test/mg-tag.spec.js.map +1 -1
  38. package/dist/collection/components/atoms/mg-tooltip/mg-tooltip-content/mg-tooltip-content.js +2 -2
  39. package/dist/collection/components/atoms/mg-tooltip/mg-tooltip-content/mg-tooltip-content.js.map +1 -1
  40. package/dist/collection/components/atoms/mg-tooltip/mg-tooltip.js +37 -17
  41. package/dist/collection/components/atoms/mg-tooltip/mg-tooltip.js.map +1 -1
  42. package/dist/collection/components/atoms/mg-tooltip/test/mg-tooltip.e2e.js +7 -1
  43. package/dist/collection/components/atoms/mg-tooltip/test/mg-tooltip.e2e.js.map +1 -1
  44. package/dist/collection/components/atoms/mg-tooltip/test/mg-tooltip.spec.js +9 -1
  45. package/dist/collection/components/atoms/mg-tooltip/test/mg-tooltip.spec.js.map +1 -1
  46. package/dist/collection/components/molecules/inputs/MgInput.js +12 -11
  47. package/dist/collection/components/molecules/inputs/MgInput.js.map +1 -1
  48. package/dist/collection/components/molecules/inputs/mg-input-checkbox/MgInputCheckboxList.js +4 -4
  49. package/dist/collection/components/molecules/inputs/mg-input-checkbox/MgInputCheckboxList.js.map +1 -1
  50. package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox-paginated/mg-input-checkbox-paginated.js +2 -2
  51. package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox-paginated/mg-input-checkbox-paginated.js.map +1 -1
  52. package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.conf.js.map +1 -1
  53. package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.js +111 -38
  54. package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.js.map +1 -1
  55. package/dist/collection/components/molecules/inputs/mg-input-checkbox/test/mg-input-checkbox.e2e.playwright.js +21 -27
  56. package/dist/collection/components/molecules/inputs/mg-input-checkbox/test/mg-input-checkbox.e2e.playwright.js.map +1 -1
  57. package/dist/collection/components/molecules/inputs/mg-input-checkbox/test/mg-input-checkbox.spec.js +62 -6
  58. package/dist/collection/components/molecules/inputs/mg-input-checkbox/test/mg-input-checkbox.spec.js.map +1 -1
  59. package/dist/collection/components/molecules/inputs/mg-input-date/mg-input-date.js +84 -13
  60. package/dist/collection/components/molecules/inputs/mg-input-date/mg-input-date.js.map +1 -1
  61. package/dist/collection/components/molecules/inputs/mg-input-date/test/mg-input-date.spec.js +55 -0
  62. package/dist/collection/components/molecules/inputs/mg-input-date/test/mg-input-date.spec.js.map +1 -1
  63. package/dist/collection/components/molecules/inputs/mg-input-numeric/mg-input-numeric.js +115 -44
  64. package/dist/collection/components/molecules/inputs/mg-input-numeric/mg-input-numeric.js.map +1 -1
  65. package/dist/collection/components/molecules/inputs/mg-input-numeric/test/mg-input-numeric.spec.js +55 -0
  66. package/dist/collection/components/molecules/inputs/mg-input-numeric/test/mg-input-numeric.spec.js.map +1 -1
  67. package/dist/collection/components/molecules/inputs/mg-input-password/mg-input-password.js +88 -15
  68. package/dist/collection/components/molecules/inputs/mg-input-password/mg-input-password.js.map +1 -1
  69. package/dist/collection/components/molecules/inputs/mg-input-password/test/mg-input-password.spec.js +55 -0
  70. package/dist/collection/components/molecules/inputs/mg-input-password/test/mg-input-password.spec.js.map +1 -1
  71. package/dist/collection/components/molecules/inputs/mg-input-radio/mg-input-radio.js +87 -14
  72. package/dist/collection/components/molecules/inputs/mg-input-radio/mg-input-radio.js.map +1 -1
  73. package/dist/collection/components/molecules/inputs/mg-input-radio/test/mg-input-radio.e2e.js +1 -1
  74. package/dist/collection/components/molecules/inputs/mg-input-radio/test/mg-input-radio.e2e.js.map +1 -1
  75. package/dist/collection/components/molecules/inputs/mg-input-radio/test/mg-input-radio.spec.js +60 -0
  76. package/dist/collection/components/molecules/inputs/mg-input-radio/test/mg-input-radio.spec.js.map +1 -1
  77. package/dist/collection/components/molecules/inputs/mg-input-select/mg-input-select.js +87 -14
  78. package/dist/collection/components/molecules/inputs/mg-input-select/mg-input-select.js.map +1 -1
  79. package/dist/collection/components/molecules/inputs/mg-input-select/test/mg-input-select.spec.js +55 -0
  80. package/dist/collection/components/molecules/inputs/mg-input-select/test/mg-input-select.spec.js.map +1 -1
  81. package/dist/collection/components/molecules/inputs/mg-input-text/mg-input-text.conf.js +5 -0
  82. package/dist/collection/components/molecules/inputs/mg-input-text/mg-input-text.conf.js.map +1 -0
  83. package/dist/collection/components/molecules/inputs/mg-input-text/mg-input-text.js +151 -34
  84. package/dist/collection/components/molecules/inputs/mg-input-text/mg-input-text.js.map +1 -1
  85. package/dist/collection/components/molecules/inputs/mg-input-text/test/mg-input-text.e2e.playwright.js +147 -0
  86. package/dist/collection/components/molecules/inputs/mg-input-text/test/mg-input-text.e2e.playwright.js.map +1 -0
  87. package/dist/collection/components/molecules/inputs/mg-input-text/test/mg-input-text.spec.js +80 -7
  88. package/dist/collection/components/molecules/inputs/mg-input-text/test/mg-input-text.spec.js.map +1 -1
  89. package/dist/collection/components/molecules/inputs/mg-input-textarea/mg-input-textarea.js +110 -36
  90. package/dist/collection/components/molecules/inputs/mg-input-textarea/mg-input-textarea.js.map +1 -1
  91. package/dist/collection/components/molecules/inputs/mg-input-textarea/test/mg-input-textarea.spec.js +69 -6
  92. package/dist/collection/components/molecules/inputs/mg-input-textarea/test/mg-input-textarea.spec.js.map +1 -1
  93. package/dist/collection/components/molecules/inputs/mg-input-toggle/mg-input-toggle.js +9 -9
  94. package/dist/collection/components/molecules/inputs/mg-input-toggle/mg-input-toggle.js.map +1 -1
  95. package/dist/collection/components/molecules/inputs/mg-input-toggle/test/mg-input-toggle.spec.js +2 -2
  96. package/dist/collection/components/molecules/inputs/mg-input-toggle/test/mg-input-toggle.spec.js.map +1 -1
  97. package/dist/collection/components/molecules/menu/mg-menu/mg-menu.js +2 -2
  98. package/dist/collection/components/molecules/menu/mg-menu/mg-menu.js.map +1 -1
  99. package/dist/collection/components/molecules/menu/mg-menu-item/mg-menu-item.js +8 -9
  100. package/dist/collection/components/molecules/menu/mg-menu-item/mg-menu-item.js.map +1 -1
  101. package/dist/collection/components/molecules/mg-action-more/mg-action-more.js +6 -6
  102. package/dist/collection/components/molecules/mg-action-more/mg-action-more.js.map +1 -1
  103. package/dist/collection/components/molecules/mg-details/mg-details.js +5 -4
  104. package/dist/collection/components/molecules/mg-details/mg-details.js.map +1 -1
  105. package/dist/collection/components/molecules/mg-details/test/mg-details.spec.js +1 -1
  106. package/dist/collection/components/molecules/mg-details/test/mg-details.spec.js.map +1 -1
  107. package/dist/collection/components/molecules/mg-form/mg-form.js +6 -6
  108. package/dist/collection/components/molecules/mg-form/mg-form.js.map +1 -1
  109. package/dist/collection/components/molecules/mg-form/test/mg-form.spec.js +4 -4
  110. package/dist/collection/components/molecules/mg-form/test/mg-form.spec.js.map +1 -1
  111. package/dist/collection/components/molecules/mg-illustrated-message/mg-illustrated-message.js +7 -7
  112. package/dist/collection/components/molecules/mg-illustrated-message/mg-illustrated-message.js.map +1 -1
  113. package/dist/collection/components/molecules/mg-item-more/mg-item-more.js +5 -4
  114. package/dist/collection/components/molecules/mg-item-more/mg-item-more.js.map +1 -1
  115. package/dist/collection/components/molecules/mg-message/mg-message.js +8 -8
  116. package/dist/collection/components/molecules/mg-message/mg-message.js.map +1 -1
  117. package/dist/collection/components/molecules/mg-message/test/mg-message.spec.js +11 -11
  118. package/dist/collection/components/molecules/mg-message/test/mg-message.spec.js.map +1 -1
  119. package/dist/collection/components/molecules/mg-modal/mg-modal.js +8 -8
  120. package/dist/collection/components/molecules/mg-modal/mg-modal.js.map +1 -1
  121. package/dist/collection/components/molecules/mg-modal/test/mg-modal.e2e.playwright.js +7 -7
  122. package/dist/collection/components/molecules/mg-modal/test/mg-modal.e2e.playwright.js.map +1 -1
  123. package/dist/collection/components/molecules/mg-modal/test/mg-modal.firefox.e2e.playwright.js +3 -3
  124. package/dist/collection/components/molecules/mg-modal/test/mg-modal.firefox.e2e.playwright.js.map +1 -1
  125. package/dist/collection/components/molecules/mg-modal/test/mg-modal.spec.js +1 -1
  126. package/dist/collection/components/molecules/mg-modal/test/mg-modal.spec.js.map +1 -1
  127. package/dist/collection/components/molecules/mg-pagination/mg-pagination.js +3 -3
  128. package/dist/collection/components/molecules/mg-pagination/mg-pagination.js.map +1 -1
  129. package/dist/collection/components/molecules/mg-panel/mg-panel.js +17 -15
  130. package/dist/collection/components/molecules/mg-panel/mg-panel.js.map +1 -1
  131. package/dist/collection/components/molecules/mg-panel/test/mg-panel.e2e.playwright.js +3 -3
  132. package/dist/collection/components/molecules/mg-panel/test/mg-panel.e2e.playwright.js.map +1 -1
  133. package/dist/collection/components/molecules/mg-panel/test/mg-panel.spec.js +11 -21
  134. package/dist/collection/components/molecules/mg-panel/test/mg-panel.spec.js.map +1 -1
  135. package/dist/collection/components/molecules/mg-popover/mg-popover-content/mg-popover-content.js +4 -4
  136. package/dist/collection/components/molecules/mg-popover/mg-popover-content/mg-popover-content.js.map +1 -1
  137. package/dist/collection/components/molecules/mg-popover/mg-popover.js +36 -16
  138. package/dist/collection/components/molecules/mg-popover/mg-popover.js.map +1 -1
  139. package/dist/collection/components/molecules/mg-popover/test/{mg-popover.e2e.js → mg-popover.e2e.playwright.js} +54 -62
  140. package/dist/collection/components/molecules/mg-popover/test/mg-popover.e2e.playwright.js.map +1 -0
  141. package/dist/collection/components/molecules/mg-popover/test/mg-popover.spec.js +12 -0
  142. package/dist/collection/components/molecules/mg-popover/test/mg-popover.spec.js.map +1 -1
  143. package/dist/collection/components/molecules/mg-skip-links/mg-skip-links.js +5 -6
  144. package/dist/collection/components/molecules/mg-skip-links/mg-skip-links.js.map +1 -1
  145. package/dist/collection/components/molecules/mg-tabs/mg-tabs.js +34 -34
  146. package/dist/collection/components/molecules/mg-tabs/mg-tabs.js.map +1 -1
  147. package/dist/collection/components/molecules/mg-tabs/test/mg-tabs.spec.js +13 -13
  148. package/dist/collection/components/molecules/mg-tabs/test/mg-tabs.spec.js.map +1 -1
  149. package/dist/collection/locales/en/messages.json +3 -3
  150. package/dist/collection/locales/fr/messages.json +3 -3
  151. package/dist/collection/utils/components.utils.js +16 -0
  152. package/dist/collection/utils/components.utils.js.map +1 -1
  153. package/dist/collection/utils/components.utils.spec.js +22 -1
  154. package/dist/collection/utils/components.utils.spec.js.map +1 -1
  155. package/dist/collection/variables.css +1 -275
  156. package/dist/components/MgInput.js +17 -16
  157. package/dist/components/MgInput.js.map +1 -1
  158. package/dist/components/components.utils.js +17 -1
  159. package/dist/components/components.utils.js.map +1 -1
  160. package/dist/components/index2.js +6 -6
  161. package/dist/components/mg-action-more.js +5 -5
  162. package/dist/components/mg-action-more.js.map +1 -1
  163. package/dist/components/mg-badge2.js +8 -8
  164. package/dist/components/mg-badge2.js.map +1 -1
  165. package/dist/components/mg-button2.js +11 -11
  166. package/dist/components/mg-button2.js.map +1 -1
  167. package/dist/components/mg-card2.js +8 -8
  168. package/dist/components/mg-card2.js.map +1 -1
  169. package/dist/components/mg-character-left2.js +1 -1
  170. package/dist/components/mg-character-left2.js.map +1 -1
  171. package/dist/components/mg-details.js +4 -3
  172. package/dist/components/mg-details.js.map +1 -1
  173. package/dist/components/mg-divider.js +3 -3
  174. package/dist/components/mg-divider.js.map +1 -1
  175. package/dist/components/mg-form.js +4 -4
  176. package/dist/components/mg-form.js.map +1 -1
  177. package/dist/components/mg-icon2.js +12 -14
  178. package/dist/components/mg-icon2.js.map +1 -1
  179. package/dist/components/mg-illustrated-message.js +7 -7
  180. package/dist/components/mg-illustrated-message.js.map +1 -1
  181. package/dist/components/mg-input-checkbox-paginated2.js +8 -8
  182. package/dist/components/mg-input-checkbox-paginated2.js.map +1 -1
  183. package/dist/components/mg-input-checkbox.js +70 -34
  184. package/dist/components/mg-input-checkbox.js.map +1 -1
  185. package/dist/components/mg-input-date.js +45 -12
  186. package/dist/components/mg-input-date.js.map +1 -1
  187. package/dist/components/mg-input-numeric.js +76 -43
  188. package/dist/components/mg-input-numeric.js.map +1 -1
  189. package/dist/components/mg-input-password.js +49 -14
  190. package/dist/components/mg-input-password.js.map +1 -1
  191. package/dist/components/mg-input-radio.js +48 -13
  192. package/dist/components/mg-input-radio.js.map +1 -1
  193. package/dist/components/mg-input-select2.js +48 -13
  194. package/dist/components/mg-input-select2.js.map +1 -1
  195. package/dist/components/mg-input-text2.js +83 -33
  196. package/dist/components/mg-input-text2.js.map +1 -1
  197. package/dist/components/mg-input-textarea.js +69 -35
  198. package/dist/components/mg-input-textarea.js.map +1 -1
  199. package/dist/components/mg-input-title2.js +4 -3
  200. package/dist/components/mg-input-title2.js.map +1 -1
  201. package/dist/components/mg-input-toggle.js +9 -9
  202. package/dist/components/mg-input-toggle.js.map +1 -1
  203. package/dist/components/mg-item-more.js +4 -3
  204. package/dist/components/mg-item-more.js.map +1 -1
  205. package/dist/components/mg-menu-item2.js +7 -8
  206. package/dist/components/mg-menu-item2.js.map +1 -1
  207. package/dist/components/mg-menu2.js +1 -1
  208. package/dist/components/mg-menu2.js.map +1 -1
  209. package/dist/components/mg-message.js +7 -7
  210. package/dist/components/mg-message.js.map +1 -1
  211. package/dist/components/mg-modal.js +7 -7
  212. package/dist/components/mg-modal.js.map +1 -1
  213. package/dist/components/mg-pagination2.js +2 -2
  214. package/dist/components/mg-pagination2.js.map +1 -1
  215. package/dist/components/mg-panel.js +16 -15
  216. package/dist/components/mg-panel.js.map +1 -1
  217. package/dist/components/mg-popover-content2.js +4 -4
  218. package/dist/components/mg-popover-content2.js.map +1 -1
  219. package/dist/components/mg-popover2.js +33 -14
  220. package/dist/components/mg-popover2.js.map +1 -1
  221. package/dist/components/mg-skip-links.js +4 -5
  222. package/dist/components/mg-skip-links.js.map +1 -1
  223. package/dist/components/mg-tabs.js +33 -33
  224. package/dist/components/mg-tabs.js.map +1 -1
  225. package/dist/components/mg-tag.js +8 -8
  226. package/dist/components/mg-tag.js.map +1 -1
  227. package/dist/components/mg-tooltip-content2.js +1 -1
  228. package/dist/components/mg-tooltip-content2.js.map +1 -1
  229. package/dist/components/mg-tooltip2.js +34 -15
  230. package/dist/components/mg-tooltip2.js.map +1 -1
  231. package/dist/esm/{mg-menu.conf-012fc9b4.js → components.utils-0f76010d.js} +153 -8
  232. package/dist/esm/components.utils-0f76010d.js.map +1 -0
  233. package/dist/esm/index-ce01e63b.js +18 -1
  234. package/dist/esm/loader.js +1 -1
  235. package/dist/esm/mg-action-more_34.entry.js +697 -518
  236. package/dist/esm/mg-action-more_34.entry.js.map +1 -1
  237. package/dist/esm/mg-components.js +1 -1
  238. package/dist/esm/mg-item-more.entry.js +4 -4
  239. package/dist/esm/mg-item-more.entry.js.map +1 -1
  240. package/dist/mg-components/locales/en/messages.json +3 -3
  241. package/dist/mg-components/locales/fr/messages.json +3 -3
  242. package/dist/mg-components/mg-components.css +1 -1
  243. package/dist/mg-components/mg-components.esm.js +1 -1
  244. package/dist/mg-components/mg-components.esm.js.map +1 -1
  245. package/dist/mg-components/p-768fc594.entry.js +2 -0
  246. package/dist/mg-components/p-768fc594.entry.js.map +1 -0
  247. package/dist/mg-components/p-c9e2c669.js +2 -0
  248. package/dist/mg-components/p-c9e2c669.js.map +1 -0
  249. package/dist/mg-components/p-d2d6afec.entry.js +2 -0
  250. package/dist/mg-components/p-d2d6afec.entry.js.map +1 -0
  251. package/dist/mg-components/variables.css +1 -275
  252. package/dist/types/components/atoms/mg-card/mg-card.d.ts +1 -1
  253. package/dist/types/components/atoms/mg-input-title/mg-input-title.d.ts +1 -1
  254. package/dist/types/components/atoms/mg-tooltip/mg-tooltip.d.ts +4 -3
  255. package/dist/types/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox-paginated/mg-input-checkbox-paginated.d.ts +1 -1
  256. package/dist/types/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.conf.d.ts +4 -4
  257. package/dist/types/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.d.ts +22 -1
  258. package/dist/types/components/molecules/inputs/mg-input-date/mg-input-date.d.ts +17 -2
  259. package/dist/types/components/molecules/inputs/mg-input-numeric/mg-input-numeric.d.ts +35 -20
  260. package/dist/types/components/molecules/inputs/mg-input-password/mg-input-password.d.ts +16 -1
  261. package/dist/types/components/molecules/inputs/mg-input-radio/mg-input-radio.d.ts +16 -1
  262. package/dist/types/components/molecules/inputs/mg-input-select/mg-input-select.d.ts +16 -1
  263. package/dist/types/components/molecules/inputs/mg-input-text/mg-input-text.conf.d.ts +12 -0
  264. package/dist/types/components/molecules/inputs/mg-input-text/mg-input-text.d.ts +30 -6
  265. package/dist/types/components/molecules/inputs/mg-input-text/test/mg-input-text.e2e.playwright.d.ts +1 -0
  266. package/dist/types/components/molecules/inputs/mg-input-textarea/mg-input-textarea.d.ts +17 -5
  267. package/dist/types/components/molecules/mg-action-more/mg-action-more.d.ts +2 -1
  268. package/dist/types/components/molecules/mg-form/mg-form.d.ts +1 -1
  269. package/dist/types/components/molecules/mg-panel/mg-panel.d.ts +3 -3
  270. package/dist/types/components/molecules/mg-popover/mg-popover.d.ts +2 -1
  271. package/dist/types/components/molecules/mg-popover/test/mg-popover.e2e.playwright.d.ts +1 -0
  272. package/dist/types/components/molecules/mg-tabs/mg-tabs.d.ts +6 -5
  273. package/dist/types/components.d.ts +71 -13
  274. package/dist/types/utils/components.utils.d.ts +12 -0
  275. package/package.json +17 -18
  276. package/readme.md +0 -31
  277. package/dist/cjs/mg-menu.conf-43aacf30.js.map +0 -1
  278. package/dist/collection/components/atoms/mg-badge/mg-badge.css +0 -116
  279. package/dist/collection/components/atoms/mg-button/mg-button.css +0 -182
  280. package/dist/collection/components/atoms/mg-card/mg-card.css +0 -75
  281. package/dist/collection/components/atoms/mg-character-left/mg-character-left.css +0 -3
  282. package/dist/collection/components/atoms/mg-divider/mg-divider.css +0 -9
  283. package/dist/collection/components/atoms/mg-icon/mg-icon.css +0 -138
  284. package/dist/collection/components/atoms/mg-input-title/mg-input-title.css +0 -12
  285. package/dist/collection/components/atoms/mg-tag/mg-tag.css +0 -131
  286. package/dist/collection/components/atoms/mg-tag/test/mg-tag.e2e.js +0 -37
  287. package/dist/collection/components/atoms/mg-tag/test/mg-tag.e2e.js.map +0 -1
  288. package/dist/collection/components/atoms/mg-tooltip/mg-tooltip-content/mg-tooltip-content.css +0 -43
  289. package/dist/collection/components/atoms/mg-tooltip/mg-tooltip.css +0 -3
  290. package/dist/collection/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.css +0 -268
  291. package/dist/collection/components/molecules/inputs/mg-input-date/mg-input-date.css +0 -211
  292. package/dist/collection/components/molecules/inputs/mg-input-numeric/mg-input-numeric.css +0 -257
  293. package/dist/collection/components/molecules/inputs/mg-input-password/mg-input-password.css +0 -254
  294. package/dist/collection/components/molecules/inputs/mg-input-radio/mg-input-radio.css +0 -179
  295. package/dist/collection/components/molecules/inputs/mg-input-select/mg-input-select.css +0 -264
  296. package/dist/collection/components/molecules/inputs/mg-input-text/mg-input-text.css +0 -304
  297. package/dist/collection/components/molecules/inputs/mg-input-text/test/mg-input-text.e2e.js +0 -171
  298. package/dist/collection/components/molecules/inputs/mg-input-text/test/mg-input-text.e2e.js.map +0 -1
  299. package/dist/collection/components/molecules/inputs/mg-input-textarea/mg-input-textarea.css +0 -303
  300. package/dist/collection/components/molecules/inputs/mg-input-toggle/mg-input-toggle.css +0 -233
  301. package/dist/collection/components/molecules/menu/mg-menu/mg-menu.css +0 -37
  302. package/dist/collection/components/molecules/menu/mg-menu-item/mg-menu-item.css +0 -377
  303. package/dist/collection/components/molecules/mg-action-more/mg-action-more.css +0 -39
  304. package/dist/collection/components/molecules/mg-details/mg-details.css +0 -64
  305. package/dist/collection/components/molecules/mg-form/mg-form.css +0 -19
  306. package/dist/collection/components/molecules/mg-illustrated-message/mg-illustrated-message.css +0 -45
  307. package/dist/collection/components/molecules/mg-item-more/mg-item-more.css +0 -30
  308. package/dist/collection/components/molecules/mg-message/mg-message.css +0 -82
  309. package/dist/collection/components/molecules/mg-modal/mg-modal.css +0 -67
  310. package/dist/collection/components/molecules/mg-pagination/mg-pagination.css +0 -47
  311. package/dist/collection/components/molecules/mg-panel/mg-panel.css +0 -64
  312. package/dist/collection/components/molecules/mg-popover/mg-popover-content/mg-popover-content.css +0 -135
  313. package/dist/collection/components/molecules/mg-popover/mg-popover.css +0 -11
  314. package/dist/collection/components/molecules/mg-popover/test/mg-popover.e2e.js.map +0 -1
  315. package/dist/collection/components/molecules/mg-skip-links/mg-skip-links.css +0 -28
  316. package/dist/collection/components/molecules/mg-tabs/mg-tabs.css +0 -99
  317. package/dist/collection/styles/a11y.scss +0 -36
  318. package/dist/collection/styles/fonts.scss +0 -21
  319. package/dist/collection/styles/form.scss +0 -3
  320. package/dist/collection/styles/global.scss +0 -80
  321. package/dist/collection/styles/layout.scss +0 -29
  322. package/dist/collection/styles/main.scss +0 -23
  323. package/dist/collection/styles/mg-icon-animation.scss +0 -6
  324. package/dist/collection/styles/navigation-button.scss +0 -77
  325. package/dist/collection/styles/reset-mg-card-slotted-variables.scss +0 -11
  326. package/dist/collection/styles/typography.scss +0 -82
  327. package/dist/collection/styles/utilities.scss +0 -21
  328. package/dist/collection/test/typography.e2e.playwright.js +0 -12
  329. package/dist/collection/test/typography.e2e.playwright.js.map +0 -1
  330. package/dist/esm/mg-menu.conf-012fc9b4.js.map +0 -1
  331. package/dist/mg-components/p-1d7d6fa0.js +0 -2
  332. package/dist/mg-components/p-1d7d6fa0.js.map +0 -1
  333. package/dist/mg-components/p-9257e8f1.entry.js +0 -2
  334. package/dist/mg-components/p-9257e8f1.entry.js.map +0 -1
  335. package/dist/mg-components/p-caafc9cf.entry.js +0 -2
  336. package/dist/mg-components/p-caafc9cf.entry.js.map +0 -1
  337. package/dist/mg-components/styles/a11y.scss +0 -36
  338. package/dist/mg-components/styles/fonts.scss +0 -21
  339. package/dist/mg-components/styles/form.scss +0 -3
  340. package/dist/mg-components/styles/global.scss +0 -80
  341. package/dist/mg-components/styles/layout.scss +0 -29
  342. package/dist/mg-components/styles/main.scss +0 -23
  343. package/dist/mg-components/styles/mg-icon-animation.scss +0 -6
  344. package/dist/mg-components/styles/navigation-button.scss +0 -77
  345. package/dist/mg-components/styles/reset-mg-card-slotted-variables.scss +0 -11
  346. package/dist/mg-components/styles/typography.scss +0 -82
  347. package/dist/mg-components/styles/utilities.scss +0 -21
  348. /package/dist/types/{test/typography.e2e.playwright.d.ts → components/atoms/mg-tag/test/mg-tag.e2e.playwright.d.ts} +0 -0
@@ -1 +1 @@
1
- {"file":"mg-illustrated-message.js","mappings":";;;AAAA,MAAM,uBAAuB,GAAG,2qCAA2qC;;MCQ9rCA,sBAAoB;;;;;gBAaK,SAAS;qBAKE,UAAU;;;;;;;;EASzD,gBAAgB;IACd,MAAM,WAAW,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,CAAC;IACzD,MAAM,oBAAoB,GAAG,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC,uBAAuB,CAAC,CAAC;IAEpF,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,gBAAgB,CAAC,EAAE,WAAW,CAAC,EAAE;MACzE,MAAM,IAAI,KAAK,CAAC,6DAA6D,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;KACxG;SAAM,IAAI,oBAAoB,CAAC,MAAM,KAAK,CAAC,EAAE;MAC5C,MAAM,IAAI,KAAK,CAAC,2EAA2E,CAAC,CAAC;KAC9F;IAED,oBAAoB,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;GAC7D;;;;;EAMD,MAAM;IACJ,QACE,WACE,KAAK,EAAE;QACL,wBAAwB,EAAE,IAAI;QAC9B,oCAAoC,EAAE,IAAI,CAAC,SAAS,KAAK,YAAY;OACtE,IAED,WACE,KAAK,EAAE;QACL,sCAAsC,EAAE,IAAI;QAC5C,6CAA6C,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO;OACrE,IAED,YAAM,IAAI,EAAC,cAAc,GAAQ,CAC7B,EACN,WAAK,KAAK,EAAC,+BAA+B,IACxC,WAAK,KAAK,EAAC,+BAA+B,IACxC,YAAM,IAAI,EAAC,OAAO,GAAQ,CACtB,EACN,WAAK,KAAK,EAAC,iCAAiC,IAC1C,YAAM,IAAI,EAAC,SAAS,GAAQ,CACxB,CACF,CACF,EACN;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["MgIllustratedMessage"],"sources":["src/components/molecules/mg-illustrated-message/mg-illustrated-message.scss?tag=mg-illustrated-message&encapsulation=shadow","src/components/molecules/mg-illustrated-message/mg-illustrated-message.tsx"],"sourcesContent":[".mg-illustrated-message {\n display: flex;\n flex-direction: column;\n justify-content: center;\n gap: 3em 7rem;\n margin: auto;\n padding: var(--mg-illustrated-message-padding-vertical) 1.5rem;\n max-width: 47.5rem;\n box-sizing: border-box;\n text-align: center;\n\n &.mg-illustrated-message--horizontal {\n flex-direction: row;\n flex-wrap: wrap;\n align-items: center;\n max-width: unset;\n\n .mg-illustrated-message__slots,\n .mg-illustrated-message__illustration {\n max-width: 47.5rem;\n }\n }\n\n &__illustration {\n max-height: 18.4rem;\n\n ::slotted([slot='illustration']) {\n width: auto;\n height: auto;\n max-width: 100%;\n max-height: 18.4rem;\n }\n\n &.mg-illustrated-message__illustration--small {\n max-height: 6rem;\n\n ::slotted([slot='illustration']) {\n max-height: 6rem;\n }\n }\n }\n\n &__title ::slotted([slot='title']) {\n margin: 0;\n font-size: 2rem !important;\n font-family: var(--font-family) !important;\n font-weight: 400;\n }\n\n &__details ::slotted([slot='details']) {\n margin: 2rem 0 0;\n }\n}\n","import { Component, Element, h, Prop } from '@stencil/core';\nimport { isTagName } from '../../../utils/components.utils';\n\n@Component({\n tag: 'mg-illustrated-message',\n styleUrl: 'mg-illustrated-message.scss',\n shadow: true,\n})\nexport class MgIllustratedMessage {\n /**************\n * Decorators *\n **************/\n\n /**\n * Get component DOM element\n */\n @Element() element: HTMLMgIllustratedMessageElement;\n\n /**\n * Define illustration size\n */\n @Prop() size: 'regular' | 'small' = 'regular';\n\n /**\n * Define component orientation\n */\n @Prop() direction: 'vertical' | 'horizontal' = 'vertical';\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Check if component props are well configured on init\n */\n componentDidLoad(): void {\n const headingTags = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];\n const slottedIllustrations = this.element.querySelectorAll('[slot=\"illustration\"]');\n\n if (!isTagName(this.element.querySelector('[slot=\"title\"]'), headingTags)) {\n throw new Error(`<mg-illustrated-message> Slotted title must be a heading: ${headingTags.join(', ')}`);\n } else if (slottedIllustrations.length !== 1) {\n throw new Error('<mg-illustrated-message> Slotted illustration must be present and unique.');\n }\n\n slottedIllustrations[0].setAttribute('aria-hidden', 'true');\n }\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <div\n class={{\n 'mg-illustrated-message': true,\n 'mg-illustrated-message--horizontal': this.direction === 'horizontal',\n }}\n >\n <div\n class={{\n 'mg-illustrated-message__illustration': true,\n 'mg-illustrated-message__illustration--small': this.size === 'small',\n }}\n >\n <slot name=\"illustration\"></slot>\n </div>\n <div class=\"mg-illustrated-message__slots\">\n <div class=\"mg-illustrated-message__title\">\n <slot name=\"title\"></slot>\n </div>\n <div class=\"mg-illustrated-message__details\">\n <slot name=\"details\"></slot>\n </div>\n </div>\n </div>\n );\n }\n}\n"],"version":3}
1
+ {"file":"mg-illustrated-message.js","mappings":";;;AAAA,MAAM,uBAAuB,GAAG,ysCAAysC;;MCQ5tCA,sBAAoB;;;;;gBAaK,SAAS;qBAKE,UAAU;;;;;;;;EASzD,gBAAgB;IACd,MAAM,WAAW,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,CAAC;IACzD,MAAM,oBAAoB,GAAG,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC,uBAAuB,CAAC,CAAC;IAEpF,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,gBAAgB,CAAC,EAAE,WAAW,CAAC,EAAE;MACzE,MAAM,IAAI,KAAK,CAAC,6DAA6D,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;KACxG;SAAM,IAAI,oBAAoB,CAAC,MAAM,KAAK,CAAC,EAAE;MAC5C,MAAM,IAAI,KAAK,CAAC,2EAA2E,CAAC,CAAC;KAC9F;IAED,oBAAoB,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;GAC7D;;;;;EAMD,MAAM;IACJ,QACE,WACE,KAAK,EAAE;QACL,0BAA0B,EAAE,IAAI;QAChC,sCAAsC,EAAE,IAAI,CAAC,SAAS,KAAK,YAAY;OACxE,IAED,WACE,KAAK,EAAE;QACL,wCAAwC,EAAE,IAAI;QAC9C,+CAA+C,EAAE,IAAI,CAAC,IAAI,KAAK,OAAO;OACvE,IAED,YAAM,IAAI,EAAC,cAAc,GAAQ,CAC7B,EACN,WAAK,KAAK,EAAC,iCAAiC,IAC1C,WAAK,KAAK,EAAC,iCAAiC,IAC1C,YAAM,IAAI,EAAC,OAAO,GAAQ,CACtB,EACN,WAAK,KAAK,EAAC,mCAAmC,IAC5C,YAAM,IAAI,EAAC,SAAS,GAAQ,CACxB,CACF,CACF,EACN;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["MgIllustratedMessage"],"sources":["../styles/dist/components/mg-illustrated-message.css?tag=mg-illustrated-message&encapsulation=shadow","src/components/molecules/mg-illustrated-message/mg-illustrated-message.tsx"],"sourcesContent":[".mg-c-illustrated-message{display:flex;max-width:47.5rem;box-sizing:border-box;flex-direction:column;justify-content:center;padding:var(--mg-illustrated-message-padding-vertical) 1.5rem;margin:auto;gap:3em 7rem;text-align:center}.mg-c-illustrated-message__illustration{max-height:18.4rem}.mg-c-illustrated-message__illustration ::slotted([slot=illustration]){width:auto;max-width:100%;height:auto;max-height:18.4rem}.mg-c-illustrated-message__illustration.mg-c-illustrated-message__illustration--small{max-height:6rem}.mg-c-illustrated-message__illustration.mg-c-illustrated-message__illustration--small ::slotted([slot=illustration]){max-height:6rem}.mg-c-illustrated-message.mg-c-illustrated-message--horizontal{max-width:unset;flex-flow:row wrap;align-items:center}.mg-c-illustrated-message.mg-c-illustrated-message--horizontal .mg-c-illustrated-message__slots,.mg-c-illustrated-message.mg-c-illustrated-message--horizontal .mg-c-illustrated-message__illustration{max-width:47.5rem}.mg-c-illustrated-message__title ::slotted([slot=title]){margin:0;font-family:var(--font-family) !important;font-size:2rem !important;font-weight:400 !important}.mg-c-illustrated-message__details ::slotted([slot=details]){margin:2rem 0 0}/*# sourceMappingURL=mg-illustrated-message.css.map */\n","import { Component, Element, h, Prop } from '@stencil/core';\nimport { isTagName } from '../../../utils/components.utils';\n\n@Component({\n tag: 'mg-illustrated-message',\n styleUrl: '../../../../node_modules/@mgdis/styles/dist/components/mg-illustrated-message.css',\n shadow: true,\n})\nexport class MgIllustratedMessage {\n /**************\n * Decorators *\n **************/\n\n /**\n * Get component DOM element\n */\n @Element() element: HTMLMgIllustratedMessageElement;\n\n /**\n * Define illustration size\n */\n @Prop() size: 'regular' | 'small' = 'regular';\n\n /**\n * Define component orientation\n */\n @Prop() direction: 'vertical' | 'horizontal' = 'vertical';\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Check if component props are well configured on init\n */\n componentDidLoad(): void {\n const headingTags = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];\n const slottedIllustrations = this.element.querySelectorAll('[slot=\"illustration\"]');\n\n if (!isTagName(this.element.querySelector('[slot=\"title\"]'), headingTags)) {\n throw new Error(`<mg-illustrated-message> Slotted title must be a heading: ${headingTags.join(', ')}`);\n } else if (slottedIllustrations.length !== 1) {\n throw new Error('<mg-illustrated-message> Slotted illustration must be present and unique.');\n }\n\n slottedIllustrations[0].setAttribute('aria-hidden', 'true');\n }\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <div\n class={{\n 'mg-c-illustrated-message': true,\n 'mg-c-illustrated-message--horizontal': this.direction === 'horizontal',\n }}\n >\n <div\n class={{\n 'mg-c-illustrated-message__illustration': true,\n 'mg-c-illustrated-message__illustration--small': this.size === 'small',\n }}\n >\n <slot name=\"illustration\"></slot>\n </div>\n <div class=\"mg-c-illustrated-message__slots\">\n <div class=\"mg-c-illustrated-message__title\">\n <slot name=\"title\"></slot>\n </div>\n <div class=\"mg-c-illustrated-message__details\">\n <slot name=\"details\"></slot>\n </div>\n </div>\n </div>\n );\n }\n}\n"],"version":3}
@@ -36,14 +36,14 @@ var SectionTitleKind;
36
36
  const MgInputCheckboxList = (props) => (
37
37
  // eslint-disable-next-line jsx-a11y/no-redundant-roles
38
38
  h("ul", { class: {
39
- 'mg-input__input-group-container': true,
40
- 'mg-input__input-group-container--vertical': props.inputVerticalList || (props.type === 'multi' && !props.readonly),
41
- 'mg-input__input-checkbox-multi-inputs': props.type === 'multi' && !props.readonly,
39
+ 'mg-c-input__input-group-container': true,
40
+ 'mg-c-input__input-group-container--vertical': props.inputVerticalList || (props.type === 'multi' && !props.readonly),
41
+ 'mg-c-input__input-checkbox-multi-inputs': props.type === 'multi' && !props.readonly,
42
42
  }, role: "list", "aria-describedby": props.displaySearchInput ? 'search-results' : undefined, "aria-label": props.displaySearchInput ? props.messages.searchResults : undefined, "aria-live": props.displaySearchInput ? 'polite' : undefined, id: props.id }, props.checkboxes
43
43
  .filter(item => !props.readonly || item.value)
44
- .map(input => (h("li", { key: input.id, class: { 'mg-input__input-group': true, 'mg-input__input-group--disabled': props.disabled || input.disabled } },
45
- h("input", { type: "checkbox", id: input.id, name: props.name, value: input.value && input.value.toString(), checked: Boolean(input.value), required: input.required, disabled: props.readonly || props.disabled || input.disabled, indeterminate: input.value === null, onInput: input.handleInput, onBlur: input.handleBlur, onKeyDown: input.handleKeydown }),
46
- h("label", { htmlFor: input.id }, input.title))))));
44
+ .map(input => (h("li", { key: input._id, class: { 'mg-c-input__input-group': true, 'mg-c-input__input-group--disabled': props.disabled || input.disabled } },
45
+ h("input", { type: "checkbox", id: input._id, name: props.name, value: input.value && input.value.toString(), checked: Boolean(input.value), required: input.required, disabled: props.readonly || props.disabled || input.disabled, indeterminate: input.value === null, onInput: input._handleInput, onBlur: input._handleBlur, onKeyDown: input._handleKeydown }),
46
+ h("label", { htmlFor: input._id }, input.title))))));
47
47
 
48
48
  const MgInputCheckboxPaginated = /*@__PURE__*/ proxyCustomElement(class MgInputCheckboxPaginated extends HTMLElement {
49
49
  constructor() {
@@ -64,7 +64,7 @@ const MgInputCheckboxPaginated = /*@__PURE__*/ proxyCustomElement(class MgInputC
64
64
  this.massAction.emit(this.sectionKind);
65
65
  };
66
66
  /**
67
- * Toogle items button handler
67
+ * Toggle items button handler
68
68
  */
69
69
  this.handleToggleClick = () => {
70
70
  this.expanded = !this.expanded;
@@ -141,7 +141,7 @@ const MgInputCheckboxPaginated = /*@__PURE__*/ proxyCustomElement(class MgInputC
141
141
  const [checkboxItemsFromIndex, checkboxItemsToIndex] = this.getFromToIndexes();
142
142
  const itemsContainerId = `items-${this.sectionKind}-container`;
143
143
  const getText = (checkboxes) => h("em", null, `${this.messages[checkboxes.length > 1 ? 'titlePlurial' : 'title']} (${checkboxes.length})`);
144
- return (h(Host, { hidden: this.checkboxes.length < 1 }, h("div", { class: "mg-input__input-checkbox-multi-section-header" }, this.titleKind === SectionTitleKind.BUTTON ? (h("mg-button", { variant: "flat", onClick: this.handleToggleClick, "aria-controls": itemsContainerId, "aria-expanded": this.expanded.toString() }, h("mg-icon", { icon: this.expanded ? 'chevron-up' : 'chevron-down', size: "small" }), h("span", { class: "mg-input__input-checkbox-multi-text" }, getText(this.checkboxes)))) : (h("p", { class: "mg-input__input-checkbox-multi-title" }, getText(this.checkboxes))), ((this.sectionKind === SectionKind.SELECTED && this.expanded) || this.sectionKind === SectionKind.NOT_SELECTED) && (h("mg-button", { variant: "link", onClick: this.massActionHandler }, this.messages.action)), this.expanded && this.getPageCount(this.checkboxes) > 1 && (h("mg-pagination", { key: "search-pagination", totalPages: this.getPageCount(this.checkboxes), currentPage: this.currentPage > 1 ? this.currentPage : 1, "onCurrent-page-change": this.handleCurrentPageChange, hideNavigationLabels: true, hidePageCount: true, identifier: `input-checkbox-pagination-${this.sectionKind}` }))), h("div", { hidden: !this.expanded, id: itemsContainerId, class: "mg-input__input-checkbox-multi-section-content" }, h(MgInputCheckboxList, { checkboxes: this.getArrayRange(this.checkboxes, checkboxItemsFromIndex, checkboxItemsToIndex), inputVerticalList: true, type: 'multi', displaySearchInput: true, messages: this.messages, id: `items-${this.sectionKind}`, readonly: this.readonly, disabled: this.disabled, name: this.name }))));
144
+ return (h(Host, { hidden: this.checkboxes.length < 1 }, h("div", { class: "mg-c-input__input-checkbox-multi-section-header" }, this.titleKind === SectionTitleKind.BUTTON ? (h("mg-button", { variant: "flat", onClick: this.handleToggleClick, "aria-controls": itemsContainerId, "aria-expanded": this.expanded.toString() }, h("mg-icon", { icon: this.expanded ? 'chevron-up' : 'chevron-down', size: "small" }), h("span", { class: "mg-c-input__input-checkbox-multi-text" }, getText(this.checkboxes)))) : (h("p", { class: "mg-c-input__input-checkbox-multi-title" }, getText(this.checkboxes))), ((this.sectionKind === SectionKind.SELECTED && this.expanded) || this.sectionKind === SectionKind.NOT_SELECTED) && (h("mg-button", { variant: "link", onClick: this.massActionHandler }, this.messages.action)), this.expanded && this.getPageCount(this.checkboxes) > 1 && (h("mg-pagination", { key: "search-pagination", totalPages: this.getPageCount(this.checkboxes), currentPage: this.currentPage > 1 ? this.currentPage : 1, "onCurrent-page-change": this.handleCurrentPageChange, hideNavigationLabels: true, hidePageCount: true, identifier: `input-checkbox-pagination-${this.sectionKind}` }))), h("div", { hidden: !this.expanded, id: itemsContainerId, class: "mg-c-input__input-checkbox-multi-section-content" }, h(MgInputCheckboxList, { checkboxes: this.getArrayRange(this.checkboxes, checkboxItemsFromIndex, checkboxItemsToIndex), inputVerticalList: true, type: 'multi', displaySearchInput: true, messages: this.messages, id: `items-${this.sectionKind}`, readonly: this.readonly, disabled: this.disabled, name: this.name }))));
145
145
  }
146
146
  static get watchers() { return {
147
147
  "checkboxes": ["validateCheckboxes"],
@@ -1 +1 @@
1
- {"file":"mg-input-checkbox-paginated2.js","mappings":"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","names":[],"sources":["src/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.conf.ts","src/components/molecules/inputs/mg-input-checkbox/MgInputCheckboxList.tsx","src/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox-paginated/mg-input-checkbox-paginated.tsx"],"sourcesContent":["/**\n * interface CheckboxValue\n * use to match returned value\n */\nexport interface CheckboxValue {\n title: string;\n value: boolean | null;\n disabled?: boolean;\n required?: boolean;\n}\n\n/**\n * interface CheckboxItem\n * use to match checkbox attributes\n */\nexport interface CheckboxItem extends CheckboxValue {\n id: string;\n handleInput: (event: InputEvent & { target: HTMLInputElement }) => void;\n handleBlur: () => void;\n handleKeydown: (event: KeyboardEvent & { target: HTMLElement }) => void;\n}\n\n/**\n * List of all availables checkbox type\n */\nexport const checkboxTypes = ['checkbox', 'multi'] as const;\n\n/**\n * ChecboxType from checkbox types\n */\nexport type CheckboxType = (typeof checkboxTypes)[number];\n\n/**\n * Search value type\n */\nexport type SearchValueType = string;\n\n/**\n * mg-input-checkbox-paginated section kind\n */\nexport enum SectionKind {\n SELECTED = 'selected',\n NOT_SELECTED = 'not-selected',\n}\n\n/**\n * mg-input-checkbox-paginated section title kind\n */\nexport enum SectionTitleKind {\n BUTTON = 'button',\n TEXT = 'text',\n}\n\n/**\n * Base mg-input-checkbox interface\n */\nexport interface IMgInputCheckboxBase {\n readonly: boolean;\n disabled: boolean;\n name: string;\n}\n\n/**\n * mg-input-checkbox-list interface\n */\nexport interface MgInputCheckboxListProps extends IMgInputCheckboxBase {\n inputVerticalList: boolean;\n type: CheckboxType;\n displaySearchInput: boolean;\n messages: Record<string, unknown>;\n checkboxes: CheckboxItem[];\n id: string;\n}\n","import { FunctionalComponent, h, VNode } from '@stencil/core';\nimport { MgInputCheckboxListProps } from './mg-input-checkbox.conf';\n\n/**\n * Get checkboxes list template\n * @param props - MgInputCheckboxList Interface Props\n * @returns input template\n */\nexport const MgInputCheckboxList: FunctionalComponent<MgInputCheckboxListProps> = (props: MgInputCheckboxListProps): VNode[] => (\n // eslint-disable-next-line jsx-a11y/no-redundant-roles\n <ul\n class={{\n 'mg-input__input-group-container': true,\n 'mg-input__input-group-container--vertical': props.inputVerticalList || (props.type === 'multi' && !props.readonly),\n 'mg-input__input-checkbox-multi-inputs': props.type === 'multi' && !props.readonly,\n }}\n role=\"list\"\n aria-describedby={props.displaySearchInput ? 'search-results' : undefined}\n aria-label={props.displaySearchInput ? props.messages.searchResults : undefined}\n aria-live={props.displaySearchInput ? 'polite' : undefined}\n id={props.id}\n >\n {props.checkboxes\n .filter(item => !props.readonly || item.value)\n .map(input => (\n <li key={input.id} class={{ 'mg-input__input-group': true, 'mg-input__input-group--disabled': props.disabled || input.disabled }}>\n <input\n type=\"checkbox\"\n id={input.id}\n name={props.name}\n value={input.value && input.value.toString()}\n checked={Boolean(input.value)}\n required={input.required}\n disabled={props.readonly || props.disabled || input.disabled}\n indeterminate={input.value === null}\n onInput={input.handleInput}\n onBlur={input.handleBlur}\n onKeyDown={input.handleKeydown}\n />\n <label htmlFor={input.id}>{input.title}</label>\n </li>\n ))}\n </ul>\n);\n","import { Component, h, Prop, State, Event, EventEmitter, Watch, Host } from '@stencil/core';\nimport { CheckboxItem, IMgInputCheckboxBase, SectionKind, SectionTitleKind } from '../mg-input-checkbox.conf';\nimport { MgInputCheckboxList } from '../MgInputCheckboxList';\n\n/**\n * Internal component use to manage sections instances\n */\n@Component({\n tag: 'mg-input-checkbox-paginated',\n shadow: false,\n scoped: true,\n})\nexport class MgInputCheckboxPaginated implements IMgInputCheckboxBase {\n /*************\n * Constantes *\n *************/\n private readonly offset = 10;\n\n /*************\n * Decorators *\n *************/\n\n /**\n * Define if mg-input-checkbox-list is readonly\n */\n @Prop() readonly: boolean;\n\n /**\n * Define if mg-input-checkbox-list is disabled\n */\n @Prop() disabled: boolean;\n\n /**\n * Define mg-input-checkbox input name\n */\n @Prop() name: string;\n\n /**\n * Define checkboxes to paginate\n */\n @Prop() checkboxes: CheckboxItem[] = [];\n @Watch('checkboxes')\n validateCheckboxes(newValue: MgInputCheckboxPaginated['checkboxes'], oldValue: MgInputCheckboxPaginated['checkboxes']): void {\n // after each array.length update we reset pagination\n // when items fill on page, we set current page to 1\n if (this.getPageCount(newValue) === 1) this.currentPage = 1;\n // when old items page numbers match the current page AND new items page number is lower than current page, we set the new last page\n else if (this.getPageCount(oldValue) === this.currentPage && this.getPageCount(newValue) < this.currentPage) this.currentPage = this.getPageCount(newValue);\n }\n\n /**\n * Define section kind\n */\n @Prop() sectionKind: SectionKind;\n @Watch('sectionKind')\n validateSectionKind(newValue: MgInputCheckboxPaginated['sectionKind']): void {\n if (newValue === SectionKind.SELECTED) this.titleKind = SectionTitleKind.BUTTON;\n else this.titleKind = SectionTitleKind.TEXT;\n }\n\n /**\n * Define component message\n */\n @Prop() messages: Record<string, string>;\n\n /**\n * Emit 'mass-action' event\n * used to informe that select-all/unselect-all button listner is triggered\n */\n @Event({ eventName: 'mass-action' }) massAction: EventEmitter<MgInputCheckboxPaginated['sectionKind']>;\n\n /**\n * Define section title\n */\n @State() titleKind: SectionTitleKind;\n\n /**\n * Current page\n */\n @State() currentPage = 1;\n\n /**\n * Is checked items values expanded\n */\n @State() expanded = true;\n\n /***********\n * Methods *\n ***********/\n\n /**\n * Mass action handler\n */\n private massActionHandler = (): void => {\n this.massAction.emit(this.sectionKind);\n };\n\n /**\n * Toogle items button handler\n */\n private handleToggleClick = (): void => {\n this.expanded = !this.expanded;\n };\n\n /**\n * Method to get a array range\n * @param from - array start index\n * @param to - array end index\n * @returns array's range\n */\n private getArrayRange = <ItemType,>(array: ItemType[], from: number, to: number): ItemType[] => array.slice(from, to);\n\n /**\n * Get from and to index\n * @returns [from,to] index\n */\n private getFromToIndexes(): number[] {\n const isFirstPage = this.currentPage === 1;\n const checkboxItemsFromIndex = isFirstPage ? 0 : (this.currentPage - 1) * this.offset;\n const checkboxItemsToIndex = isFirstPage ? this.offset : this.currentPage * this.offset;\n return [checkboxItemsFromIndex, checkboxItemsToIndex];\n }\n\n /**\n * Method to get page count from items\n * @param items - items to count\n * @returns page count from items\n */\n private getPageCount = (item: unknown[]): number => Math.ceil(item.length / this.offset);\n\n /**\n * Handle mg-pagination current page change event\n * @param event - pagination current page change event\n */\n private handleCurrentPageChange = (event: CustomEvent): void => {\n this.currentPage = Number(event.detail);\n };\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Check if component props are well configured on init\n */\n componentWillLoad(): void {\n this.validateSectionKind(this.sectionKind);\n }\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n const [checkboxItemsFromIndex, checkboxItemsToIndex] = this.getFromToIndexes();\n const itemsContainerId = `items-${this.sectionKind}-container`;\n\n const getText = (checkboxes: CheckboxItem[]): HTMLElement => <em>{`${this.messages[checkboxes.length > 1 ? 'titlePlurial' : 'title']} (${checkboxes.length})`}</em>;\n\n return (\n <Host hidden={this.checkboxes.length < 1}>\n <div class=\"mg-input__input-checkbox-multi-section-header\">\n {this.titleKind === SectionTitleKind.BUTTON ? (\n <mg-button variant=\"flat\" onClick={this.handleToggleClick} aria-controls={itemsContainerId} aria-expanded={this.expanded.toString()}>\n <mg-icon icon={this.expanded ? 'chevron-up' : 'chevron-down'} size=\"small\"></mg-icon>\n <span class=\"mg-input__input-checkbox-multi-text\">{getText(this.checkboxes)}</span>\n </mg-button>\n ) : (\n <p class=\"mg-input__input-checkbox-multi-title\">{getText(this.checkboxes)}</p>\n )}\n {((this.sectionKind === SectionKind.SELECTED && this.expanded) || this.sectionKind === SectionKind.NOT_SELECTED) && (\n <mg-button variant=\"link\" onClick={this.massActionHandler}>\n {this.messages.action}\n </mg-button>\n )}\n {this.expanded && this.getPageCount(this.checkboxes) > 1 && (\n <mg-pagination\n key=\"search-pagination\"\n totalPages={this.getPageCount(this.checkboxes)}\n currentPage={this.currentPage > 1 ? this.currentPage : 1}\n onCurrent-page-change={this.handleCurrentPageChange}\n hideNavigationLabels={true}\n hidePageCount={true}\n identifier={`input-checkbox-pagination-${this.sectionKind}`}\n ></mg-pagination>\n )}\n </div>\n <div hidden={!this.expanded} id={itemsContainerId} class=\"mg-input__input-checkbox-multi-section-content\">\n <MgInputCheckboxList\n checkboxes={this.getArrayRange(this.checkboxes, checkboxItemsFromIndex, checkboxItemsToIndex)}\n inputVerticalList={true}\n type={'multi'}\n displaySearchInput={true}\n messages={this.messages}\n id={`items-${this.sectionKind}`}\n readonly={this.readonly}\n disabled={this.disabled}\n name={this.name}\n ></MgInputCheckboxList>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1
+ {"file":"mg-input-checkbox-paginated2.js","mappings":"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","names":[],"sources":["src/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.conf.ts","src/components/molecules/inputs/mg-input-checkbox/MgInputCheckboxList.tsx","src/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox-paginated/mg-input-checkbox-paginated.tsx"],"sourcesContent":["/**\n * interface CheckboxValue\n * use to match returned value\n */\nexport interface CheckboxValue {\n title: string;\n value: boolean | null;\n disabled?: boolean;\n required?: boolean;\n}\n\n/**\n * interface CheckboxItem\n * use to match checkbox attributes\n */\nexport interface CheckboxItem extends CheckboxValue {\n _id: string;\n _handleInput: (event: InputEvent & { target: HTMLInputElement }) => void;\n _handleBlur: () => void;\n _handleKeydown: (event: KeyboardEvent & { target: HTMLElement }) => void;\n}\n\n/**\n * List of all availables checkbox type\n */\nexport const checkboxTypes = ['checkbox', 'multi'] as const;\n\n/**\n * ChecboxType from checkbox types\n */\nexport type CheckboxType = (typeof checkboxTypes)[number];\n\n/**\n * Search value type\n */\nexport type SearchValueType = string;\n\n/**\n * mg-input-checkbox-paginated section kind\n */\nexport enum SectionKind {\n SELECTED = 'selected',\n NOT_SELECTED = 'not-selected',\n}\n\n/**\n * mg-input-checkbox-paginated section title kind\n */\nexport enum SectionTitleKind {\n BUTTON = 'button',\n TEXT = 'text',\n}\n\n/**\n * Base mg-input-checkbox interface\n */\nexport interface IMgInputCheckboxBase {\n readonly: boolean;\n disabled: boolean;\n name: string;\n}\n\n/**\n * mg-input-checkbox-list interface\n */\nexport interface MgInputCheckboxListProps extends IMgInputCheckboxBase {\n inputVerticalList: boolean;\n type: CheckboxType;\n displaySearchInput: boolean;\n messages: Record<string, unknown>;\n checkboxes: CheckboxItem[];\n id: string;\n}\n","import { FunctionalComponent, h, VNode } from '@stencil/core';\nimport { MgInputCheckboxListProps } from './mg-input-checkbox.conf';\n\n/**\n * Get checkboxes list template\n * @param props - MgInputCheckboxList Interface Props\n * @returns input template\n */\nexport const MgInputCheckboxList: FunctionalComponent<MgInputCheckboxListProps> = (props: MgInputCheckboxListProps): VNode[] => (\n // eslint-disable-next-line jsx-a11y/no-redundant-roles\n <ul\n class={{\n 'mg-c-input__input-group-container': true,\n 'mg-c-input__input-group-container--vertical': props.inputVerticalList || (props.type === 'multi' && !props.readonly),\n 'mg-c-input__input-checkbox-multi-inputs': props.type === 'multi' && !props.readonly,\n }}\n role=\"list\"\n aria-describedby={props.displaySearchInput ? 'search-results' : undefined}\n aria-label={props.displaySearchInput ? props.messages.searchResults : undefined}\n aria-live={props.displaySearchInput ? 'polite' : undefined}\n id={props.id}\n >\n {props.checkboxes\n .filter(item => !props.readonly || item.value)\n .map(input => (\n <li key={input._id} class={{ 'mg-c-input__input-group': true, 'mg-c-input__input-group--disabled': props.disabled || input.disabled }}>\n <input\n type=\"checkbox\"\n id={input._id}\n name={props.name}\n value={input.value && input.value.toString()}\n checked={Boolean(input.value)}\n required={input.required}\n disabled={props.readonly || props.disabled || input.disabled}\n indeterminate={input.value === null}\n onInput={input._handleInput}\n onBlur={input._handleBlur}\n onKeyDown={input._handleKeydown}\n />\n <label htmlFor={input._id}>{input.title}</label>\n </li>\n ))}\n </ul>\n);\n","import { Component, h, Prop, State, Event, EventEmitter, Watch, Host } from '@stencil/core';\nimport { CheckboxItem, IMgInputCheckboxBase, SectionKind, SectionTitleKind } from '../mg-input-checkbox.conf';\nimport { MgInputCheckboxList } from '../MgInputCheckboxList';\n\n/**\n * Internal component use to manage sections instances\n */\n@Component({\n tag: 'mg-input-checkbox-paginated',\n shadow: false,\n scoped: true,\n})\nexport class MgInputCheckboxPaginated implements IMgInputCheckboxBase {\n /*************\n * Constantes *\n *************/\n private readonly offset = 10;\n\n /*************\n * Decorators *\n *************/\n\n /**\n * Define if mg-input-checkbox-list is readonly\n */\n @Prop() readonly: boolean;\n\n /**\n * Define if mg-input-checkbox-list is disabled\n */\n @Prop() disabled: boolean;\n\n /**\n * Define mg-input-checkbox input name\n */\n @Prop() name: string;\n\n /**\n * Define checkboxes to paginate\n */\n @Prop() checkboxes: CheckboxItem[] = [];\n @Watch('checkboxes')\n validateCheckboxes(newValue: MgInputCheckboxPaginated['checkboxes'], oldValue: MgInputCheckboxPaginated['checkboxes']): void {\n // after each array.length update we reset pagination\n // when items fill on page, we set current page to 1\n if (this.getPageCount(newValue) === 1) this.currentPage = 1;\n // when old items page numbers match the current page AND new items page number is lower than current page, we set the new last page\n else if (this.getPageCount(oldValue) === this.currentPage && this.getPageCount(newValue) < this.currentPage) this.currentPage = this.getPageCount(newValue);\n }\n\n /**\n * Define section kind\n */\n @Prop() sectionKind: SectionKind;\n @Watch('sectionKind')\n validateSectionKind(newValue: MgInputCheckboxPaginated['sectionKind']): void {\n if (newValue === SectionKind.SELECTED) this.titleKind = SectionTitleKind.BUTTON;\n else this.titleKind = SectionTitleKind.TEXT;\n }\n\n /**\n * Define component message\n */\n @Prop() messages: Record<string, string>;\n\n /**\n * Emit 'mass-action' event\n * used to informe that select-all/unselect-all button listner is triggered\n */\n @Event({ eventName: 'mass-action' }) massAction: EventEmitter<MgInputCheckboxPaginated['sectionKind']>;\n\n /**\n * Define section title\n */\n @State() titleKind: SectionTitleKind;\n\n /**\n * Current page\n */\n @State() currentPage = 1;\n\n /**\n * Is checked items values expanded\n */\n @State() expanded = true;\n\n /***********\n * Methods *\n ***********/\n\n /**\n * Mass action handler\n */\n private massActionHandler = (): void => {\n this.massAction.emit(this.sectionKind);\n };\n\n /**\n * Toggle items button handler\n */\n private handleToggleClick = (): void => {\n this.expanded = !this.expanded;\n };\n\n /**\n * Method to get a array range\n * @param from - array start index\n * @param to - array end index\n * @returns array's range\n */\n private getArrayRange = <ItemType,>(array: ItemType[], from: number, to: number): ItemType[] => array.slice(from, to);\n\n /**\n * Get from and to index\n * @returns [from,to] index\n */\n private getFromToIndexes(): number[] {\n const isFirstPage = this.currentPage === 1;\n const checkboxItemsFromIndex = isFirstPage ? 0 : (this.currentPage - 1) * this.offset;\n const checkboxItemsToIndex = isFirstPage ? this.offset : this.currentPage * this.offset;\n return [checkboxItemsFromIndex, checkboxItemsToIndex];\n }\n\n /**\n * Method to get page count from items\n * @param items - items to count\n * @returns page count from items\n */\n private getPageCount = (item: unknown[]): number => Math.ceil(item.length / this.offset);\n\n /**\n * Handle mg-pagination current page change event\n * @param event - pagination current page change event\n */\n private handleCurrentPageChange = (event: CustomEvent): void => {\n this.currentPage = Number(event.detail);\n };\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Check if component props are well configured on init\n */\n componentWillLoad(): void {\n this.validateSectionKind(this.sectionKind);\n }\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n const [checkboxItemsFromIndex, checkboxItemsToIndex] = this.getFromToIndexes();\n const itemsContainerId = `items-${this.sectionKind}-container`;\n\n const getText = (checkboxes: CheckboxItem[]): HTMLElement => <em>{`${this.messages[checkboxes.length > 1 ? 'titlePlurial' : 'title']} (${checkboxes.length})`}</em>;\n\n return (\n <Host hidden={this.checkboxes.length < 1}>\n <div class=\"mg-c-input__input-checkbox-multi-section-header\">\n {this.titleKind === SectionTitleKind.BUTTON ? (\n <mg-button variant=\"flat\" onClick={this.handleToggleClick} aria-controls={itemsContainerId} aria-expanded={this.expanded.toString()}>\n <mg-icon icon={this.expanded ? 'chevron-up' : 'chevron-down'} size=\"small\"></mg-icon>\n <span class=\"mg-c-input__input-checkbox-multi-text\">{getText(this.checkboxes)}</span>\n </mg-button>\n ) : (\n <p class=\"mg-c-input__input-checkbox-multi-title\">{getText(this.checkboxes)}</p>\n )}\n {((this.sectionKind === SectionKind.SELECTED && this.expanded) || this.sectionKind === SectionKind.NOT_SELECTED) && (\n <mg-button variant=\"link\" onClick={this.massActionHandler}>\n {this.messages.action}\n </mg-button>\n )}\n {this.expanded && this.getPageCount(this.checkboxes) > 1 && (\n <mg-pagination\n key=\"search-pagination\"\n totalPages={this.getPageCount(this.checkboxes)}\n currentPage={this.currentPage > 1 ? this.currentPage : 1}\n onCurrent-page-change={this.handleCurrentPageChange}\n hideNavigationLabels={true}\n hidePageCount={true}\n identifier={`input-checkbox-pagination-${this.sectionKind}`}\n ></mg-pagination>\n )}\n </div>\n <div hidden={!this.expanded} id={itemsContainerId} class=\"mg-c-input__input-checkbox-multi-section-content\">\n <MgInputCheckboxList\n checkboxes={this.getArrayRange(this.checkboxes, checkboxItemsFromIndex, checkboxItemsToIndex)}\n inputVerticalList={true}\n type={'multi'}\n displaySearchInput={true}\n messages={this.messages}\n id={`items-${this.sectionKind}`}\n readonly={this.readonly}\n disabled={this.disabled}\n name={this.name}\n ></MgInputCheckboxList>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
@@ -1,6 +1,6 @@
1
1
  import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
2
2
  import { M as MgInput } from './MgInput.js';
3
- import { C as ClassList } from './components.utils.js';
3
+ import { b as cleanString, C as ClassList, i as isValidString } from './components.utils.js';
4
4
  import { i as initLocales } from './index2.js';
5
5
  import { c as checkboxTypes, S as SectionKind, M as MgInputCheckboxList, d as defineCustomElement$a } from './mg-input-checkbox-paginated2.js';
6
6
  import { d as defineCustomElement$e } from './mg-button2.js';
@@ -16,7 +16,7 @@ import { d as defineCustomElement$4 } from './mg-popover-content2.js';
16
16
  import { d as defineCustomElement$3 } from './mg-tooltip2.js';
17
17
  import { d as defineCustomElement$2 } from './mg-tooltip-content2.js';
18
18
 
19
- const mgInputCheckboxCss = ":host{display:block}.mg-input{display:flex;align-items:flex-start;min-height:var(--default-size);max-width:100%;margin-bottom:var(--mg-inputs-margin-bottom, 0);}.mg-input mg-input-title{flex-shrink:var(--mg-inputs-shrink, 1);width:var(--mg-inputs-title-width, auto);margin-top:calc((var(--default-size) - var(--font-size) * var(--line-height)) / 2);margin-right:var(--mg-inputs-title-horizontal-space, var(--mg-inputs-spacer));text-align:right}.mg-input.mg-input--label-on-top{flex-direction:column}.mg-input.mg-input--label-on-top .mg-input__input-container{width:100%}.mg-input__title{display:flex;align-items:baseline;margin-bottom:0.3rem}.mg-input__title mg-input-title{flex-shrink:1;width:auto;margin-top:0;margin-right:var(--mg-inputs-spacer);text-align:left}.mg-input__title mg-tooltip{margin-top:0}.mg-input__title mg-icon{display:inline-flex;vertical-align:text-bottom}.mg-input__input-container{min-height:var(--default-size);}.mg-input__input-container>strong{display:inline-block;margin-top:calc((var(--default-size) - var(--font-size) * var(--line-height)) / 2);min-height:var(--font-size)}.mg-input__input-container mg-tooltip{display:inline-flex;width:var(--mg-icon-regular-size);height:var(--mg-icon-regular-size);margin-left:var(--mg-inputs-spacer)}.mg-input__input-container .mg-input__help-text,.mg-input__input-container .mg-input__error{text-align:start;font-size:1.2rem}.mg-input__input{display:flex;}.mg-input__input mg-tooltip{margin-top:calc((var(--default-size) - var(--mg-icon-regular-size)) / 2)}.mg-input__input.mg-input__input--has-error .mg-input__box{border-color:hsl(var(--color-danger))}.mg-input__input+.mg-input__help-text,.mg-input__input+.mg-input__error{margin-top:0.5rem}.mg-input__input .mg-input__box:disabled,.mg-input__input-group--disabled label,.mg-input.mg-input--toggle-disabled .mg-input__input .mg-input__button-toggle,.mg-input.mg-input--checkbox-multi-disabled .mg-input__input strong{opacity:var(--mg-disabled-opacity)}.mg-input__error{display:inline-block;margin-top:0.2rem;padding:0.3rem 0.8rem;border-radius:0.3rem;background:hsl(var(--mg-inputs-error-bg-color));color:hsl(var(--color-danger))}.mg-input__input mg-icon,.mg-input__error mg-icon{display:flex}fieldset.mg-input{border:0;margin-left:0;margin-right:0;padding:0}fieldset.mg-input input[type=radio],fieldset.mg-input input[type=checkbox]{flex-shrink:0;width:var(--mg-input-check-size);height:var(--mg-input-check-size);margin-top:calc((var(--font-size) * var(--line-height) - var(--mg-input-check-size)) / 2);margin-right:0.6rem;margin-bottom:0;margin-left:0}fieldset.mg-input.mg-input--label-on-top .mg-input__input-group-container{margin-top:0.7rem}.mg-input__input-container mg-tooltip{margin-left:3rem}.mg-input__input-group-container{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;column-gap:2.3rem;row-gap:1rem;margin-top:calc((var(--default-size) - var(--font-size) * var(--line-height)) / 2)}.mg-input__input-group-container--vertical{flex-direction:column}.mg-input__input-group{display:flex;align-items:top}.sr-only{border:0 !important;clip:rect(1px, 1px, 1px, 1px) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;height:1px !important;margin:-1px !important;overflow:hidden !important;padding:0 !important;position:absolute !important;width:1px !important;white-space:nowrap !important}*:focus:not(:focus-visible){outline:none}@media (prefers-reduced-motion){.mg-a11y-animation{animation:none !important;transition:none !important}}.mg-input.mg-input--checkbox-multi .mg-input__input-checkbox-multi{display:flex;flex-wrap:wrap;gap:calc(var(--mg-inputs-spacer) * 1.2)}.mg-input.mg-input--checkbox-multi .mg-input__input-checkbox-multi--with-values.mg-input__input-checkbox-multi{gap:0.4rem}.mg-input.mg-input--checkbox-multi .mg-input__input-checkbox-multi-values-container{display:flex;flex-wrap:wrap;gap:calc(0.4rem * 1);flex-direction:row;margin:0;padding:0;list-style:none}.mg-input.mg-input--checkbox-multi .mg-input__input-checkbox-multi-value{display:inline-flex;justify-content:center;align-items:center;box-sizing:border-box;min-height:var(--default-size);min-width:var(--default-size);padding:calc((var(--default-size) - 0.2rem - var(--font-size) * var(--line-height)) / 2) 1.1rem;background-color:hsl(var(--mg-color-dark-5-hsl));border-radius:0.3rem;font-size:var(--font-size)}.mg-input.mg-input--checkbox-multi .mg-input__input-checkbox-multi-no-result{text-align:center}.mg-input.mg-input--checkbox-multi .mg-input__input-checkbox-multi-text,.mg-input.mg-input--checkbox-multi .mg-input__input-checkbox-multi-title{display:inline;margin:0;color:hsl(var(--mg-color-dark-40-hsl))}.mg-input.mg-input--checkbox-multi .mg-input__input-checkbox-multi-title{margin:0 1.1rem}.mg-input.mg-input--checkbox-multi .mg-input__input-checkbox-multi-sections{display:flex;flex-wrap:wrap;gap:calc(0.4rem * 1);flex-direction:column}.mg-input.mg-input--checkbox-multi .mg-input__input-checkbox-multi-sections-container{display:flex;flex-wrap:nowrap;gap:calc(0.4rem * 0);flex-direction:column;max-height:80vh;padding-right:1rem;overflow-y:auto}.mg-input.mg-input--checkbox-multi .mg-input__input-checkbox-multi-section-header{display:flex;flex-wrap:wrap;gap:calc(0.4rem * 2);flex-direction:row;align-items:center;min-height:var(--default-size)}.mg-input.mg-input--checkbox-multi .mg-input__input-checkbox-multi-inputs{margin:0;padding:0.4rem calc(0.4rem * 2) 0.4rem calc(0.4rem / 2)}.mg-input.mg-input--checkbox-multi:not(.mg-input--label-on-top) mg-tooltip{margin-left:var(--mg-inputs-spacer)}.mg-input.mg-input--checkbox-multi mg-popover{--mg-popover-min-width:7rem;--mg-card-padding:calc(0.4rem * 2)}.mg-input.mg-input--checkbox-multi mg-popover-content [slot=content]{display:flex;flex-wrap:wrap;gap:calc(0.4rem * 2);flex-direction:column}.mg-input.mg-input--checkbox-multi mg-popover-content [slot=content] .mg-input__input-group{margin-left:calc(0.4rem * 2)}.mg-input.mg-input--checkbox-multi mg-input-text{--mg-inputs-margin-bottom:0}";
19
+ const mgInputCheckboxCss = ":host{display:block}.mg-c-input__input mg-icon,.mg-c-input__error mg-icon{display:flex}.mg-c-input{display:flex;max-width:100%;min-height:var(--default-size);align-items:flex-start;margin-bottom:var(--mg-inputs-margin-bottom, 0)}.mg-c-input mg-input-title{width:var(--mg-inputs-title-width, auto);flex-shrink:var(--mg-inputs-shrink, 1);margin-top:calc((var(--default-size) - var(--font-size)*var(--line-height))/2);margin-right:var(--mg-inputs-title-horizontal-space, var(--mg-inputs-spacer));text-align:right}.mg-c-input__error{display:inline-block;padding:.3rem .8rem;border-radius:.3rem;margin-top:.2rem;background:hsl(var(--mg-inputs-error-bg-color));color:hsl(var(--color-danger))}.mg-c-input__input-container{min-height:var(--default-size)}.mg-c-input__input-container>strong{display:inline-block;min-height:var(--font-size);margin-top:calc((var(--default-size) - var(--font-size)*var(--line-height))/2)}.mg-c-input__input-container mg-tooltip{display:inline-flex;width:var(--mg-icon-regular-size);height:var(--mg-icon-regular-size);margin-left:var(--mg-inputs-spacer)}.mg-c-input__input-container .mg-c-input__help-text,.mg-c-input__input-container .mg-c-input__error{font-size:1.2rem;text-align:start}.mg-c-input.mg-c-input--label-on-top{flex-direction:column}.mg-c-input.mg-c-input--label-on-top .mg-c-input__input-container{width:100%}.mg-c-input__title{display:flex;align-items:baseline;margin-bottom:.3rem}.mg-c-input__title mg-input-title{width:auto;flex-shrink:1;margin-top:0;margin-right:var(--mg-inputs-spacer);text-align:left}.mg-c-input__title mg-tooltip{margin-top:0}.mg-c-input__title mg-icon{display:inline-flex;vertical-align:text-bottom}.mg-c-input__input{display:flex}.mg-c-input__input mg-tooltip{margin-top:calc((var(--default-size) - var(--mg-icon-regular-size))/2)}.mg-c-input__input.mg-c-input__input--has-error .mg-c-input__box{border-color:hsl(var(--color-danger))}.mg-c-input__input+.mg-c-input__help-text,.mg-c-input__input+.mg-c-input__error{margin-top:.5rem}.mg-c-input__input .mg-c-input__box:disabled,.mg-c-input__input-group--disabled label,.mg-c-input.mg-c-input--toggle-disabled .mg-c-input__input .mg-c-input__button-toggle,.mg-c-input.mg-c-input--checkbox-multi-disabled .mg-c-input__input strong{opacity:var(--mg-disabled-opacity)}.mg-c-input__input-group-container{display:flex;flex-wrap:wrap;padding:0;margin:0;margin-top:calc((var(--default-size) - var(--font-size)*var(--line-height))/2);column-gap:2.3rem;list-style:none;row-gap:1rem}.mg-c-input__input-group-container--vertical{flex-direction:column}fieldset.mg-c-input{padding:0;border:0;margin-right:0;margin-left:0}fieldset.mg-c-input input[type=radio],fieldset.mg-c-input input[type=checkbox]{width:var(--mg-input-check-size);height:var(--mg-input-check-size);flex-shrink:0;margin:calc((var(--font-size)*var(--line-height) - var(--mg-input-check-size))/2) .6rem 0 0}fieldset.mg-c-input.mg-c-input--label-on-top .mg-c-input__input-group-container{margin-top:.7rem}.mg-c-input__input-container mg-tooltip{margin-left:3rem}.mg-c-input__input-group{display:flex;align-items:start}.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}}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-checkbox-multi{display:flex;flex-wrap:wrap;gap:calc(var(--mg-inputs-spacer)*1.2)}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-checkbox-multi--with-values.mg-c-input__input-checkbox-multi{gap:.4rem}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-checkbox-multi-values-container{display:flex;flex-flow:row wrap;gap:calc(0.4rem * 1);padding:0;margin:0;list-style:none}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-checkbox-multi-value{display:inline-flex;min-width:var(--default-size);min-height:var(--default-size);box-sizing:border-box;align-items:center;justify-content:center;padding:calc((var(--default-size) - .2rem - var(--font-size)*var(--line-height))/2) 1.1rem;border-radius:.3rem;background-color:hsl(var(--mg-color-dark-5-hsl));font-size:var(--font-size)}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-checkbox-multi-no-result{text-align:center}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-checkbox-multi-text,.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-checkbox-multi-title{display:inline;margin:0;color:hsl(var(--mg-color-dark-40-hsl))}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-checkbox-multi-title{margin:0 1.1rem}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-checkbox-multi-sections{display:flex;flex-flow:column wrap;gap:calc(0.4rem * 1)}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-checkbox-multi-sections-container{display:flex;flex-flow:column nowrap;gap:calc(0.4rem * 0);max-height:80vh;padding-right:1rem;overflow-y:auto}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-checkbox-multi-section-header{display:flex;flex-flow:row wrap;gap:calc(0.4rem * 2);min-height:var(--default-size);align-items:center}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-checkbox-multi-inputs{padding:.4rem calc(0.4rem * 2) .4rem calc(0.4rem / 2);margin:0}.mg-c-input.mg-c-input--checkbox-multi:not(.mg-c-input--label-on-top) mg-tooltip{margin-left:var(--mg-inputs-spacer)}.mg-c-input.mg-c-input--checkbox-multi mg-popover{--mg-popover-min-width:7rem;--mg-card-padding:calc(0.4rem * 2)}.mg-c-input.mg-c-input--checkbox-multi mg-popover-content [slot=content]{display:flex;flex-flow:column wrap;gap:calc(0.4rem * 2)}.mg-c-input.mg-c-input--checkbox-multi mg-popover-content [slot=content] .mg-c-input__input-group{margin-left:calc(0.4rem * 2)}.mg-c-input.mg-c-input--checkbox-multi mg-input-text{--mg-inputs-margin-bottom:0}";
20
20
 
21
21
  /**
22
22
  * type CheckboxItem validation function
@@ -34,8 +34,9 @@ const MgInputCheckbox$1 = /*@__PURE__*/ proxyCustomElement(class MgInputCheckbox
34
34
  this.inputValid = createEvent(this, "input-valid", 7);
35
35
  // hasDisplayedError (triggered by blur event)
36
36
  this.hasDisplayedError = false;
37
+ this.mode = 'custom';
37
38
  // style
38
- this.baseClassName = 'mg-input--checkbox';
39
+ this.baseClassName = 'mg-c-input--checkbox';
39
40
  // "multi" setup
40
41
  this.multiStart = 5;
41
42
  this.searchStart = 10;
@@ -44,7 +45,7 @@ const MgInputCheckbox$1 = /*@__PURE__*/ proxyCustomElement(class MgInputCheckbox
44
45
  * @param event - input event
45
46
  */
46
47
  this.handleInput = (event) => {
47
- this.updateCheckboxItems('value', Boolean(event.target.checked), item => item.id === event.target.id);
48
+ this.updateCheckboxItems('value', Boolean(event.target.checked), item => item._id === event.target.id);
48
49
  this.updateValues();
49
50
  this.checkValidity();
50
51
  };
@@ -108,7 +109,13 @@ const MgInputCheckbox$1 = /*@__PURE__*/ proxyCustomElement(class MgInputCheckbox
108
109
  * Update values
109
110
  */
110
111
  this.updateValues = () => {
111
- this.value = this.checkboxItems.map(o => ({ value: o.value, title: o.title, disabled: o.disabled }));
112
+ this.value = this.checkboxItems.map(o => {
113
+ delete o._handleBlur;
114
+ delete o._handleInput;
115
+ delete o._handleKeydown;
116
+ delete o._id;
117
+ return o;
118
+ });
112
119
  };
113
120
  /**
114
121
  * get invalid element
@@ -122,7 +129,7 @@ const MgInputCheckbox$1 = /*@__PURE__*/ proxyCustomElement(class MgInputCheckbox
122
129
  * Method to update searchResults
123
130
  */
124
131
  this.updateSearchResults = () => {
125
- this.searchResults = this.checkboxItems.filter(item => item.title.toLocaleLowerCase().includes(this.searchValue.trim().toLocaleLowerCase()));
132
+ this.searchResults = this.checkboxItems.filter(item => cleanString(item.title).includes(cleanString(this.searchValue)));
126
133
  };
127
134
  /**
128
135
  * Methode to validate if one of inputs value is checked id required
@@ -133,10 +140,7 @@ const MgInputCheckbox$1 = /*@__PURE__*/ proxyCustomElement(class MgInputCheckbox
133
140
  * Check if input is valid
134
141
  */
135
142
  this.checkValidity = () => {
136
- this.valid = this.readonly || this.disabled || (this.getInvalidElement() === undefined && this.validateRequired());
137
- this.invalid = !this.valid;
138
- // We need to send valid event even if it is the same value
139
- this.inputValid.emit(this.valid);
143
+ this.setValidity(this.readonly || this.disabled || (this.getInvalidElement() === undefined && this.validateRequired()));
140
144
  };
141
145
  /**
142
146
  * Render button text
@@ -154,12 +158,17 @@ const MgInputCheckbox$1 = /*@__PURE__*/ proxyCustomElement(class MgInputCheckbox
154
158
  /**
155
159
  * Set input error message
156
160
  * @param displayError - dispay error condition
161
+ * @param errorMessage - errorMessage override
157
162
  */
158
- this.setErrorMessage = (displayError = true) => {
163
+ this.setErrorMessage = (displayError = true, errorMessage) => {
159
164
  // Set error message
160
165
  this.errorMessage = undefined;
161
- if (displayError && !this.valid && !this.validateRequired())
162
- this.errorMessage = this.messages.errors.required;
166
+ if (displayError && !this.valid) {
167
+ if (errorMessage !== undefined)
168
+ this.errorMessage = errorMessage;
169
+ else if (!this.validateRequired())
170
+ this.errorMessage = this.messages.errors.required;
171
+ }
163
172
  };
164
173
  /**
165
174
  * Method to get mg-popover identifier
@@ -172,7 +181,7 @@ const MgInputCheckbox$1 = /*@__PURE__*/ proxyCustomElement(class MgInputCheckbox
172
181
  */
173
182
  this.getDisplayItems = () => (this.searchValue.length > 0 ? this.searchResults : this.checkboxItems);
174
183
  this.value = undefined;
175
- this.type = checkboxTypes[0];
184
+ this.type = undefined;
176
185
  this.identifier = undefined;
177
186
  this.name = this.identifier;
178
187
  this.label = undefined;
@@ -196,16 +205,7 @@ const MgInputCheckbox$1 = /*@__PURE__*/ proxyCustomElement(class MgInputCheckbox
196
205
  }
197
206
  validateValue(newValue) {
198
207
  if (isCheckboxItems(newValue)) {
199
- this.checkboxItems = newValue.map((item, index) => ({
200
- id: `${this.identifier}_${index}`,
201
- title: item.title,
202
- value: item.value,
203
- disabled: item.disabled,
204
- required: item.required,
205
- handleInput: this.handleInput.bind(this),
206
- handleBlur: this.handleBlur.bind(this),
207
- handleKeydown: this.handleKeydown.bind(this),
208
- }));
208
+ this.checkboxItems = newValue.map((item, index) => (Object.assign(Object.assign({}, item), { _id: `${this.identifier}_${index}`, _handleInput: this.handleInput.bind(this), _handleBlur: this.handleBlur.bind(this), _handleKeydown: this.handleKeydown.bind(this) })));
209
209
  this.valueChange.emit(newValue);
210
210
  }
211
211
  else {
@@ -213,9 +213,13 @@ const MgInputCheckbox$1 = /*@__PURE__*/ proxyCustomElement(class MgInputCheckbox
213
213
  }
214
214
  }
215
215
  validateType(newValue) {
216
- if (!checkboxTypes.includes(newValue)) {
216
+ if (newValue !== undefined && !checkboxTypes.includes(newValue)) {
217
217
  throw new Error('<mg-input-checkbox> prop "type" must be a CheckboxType.');
218
218
  }
219
+ else if (newValue === undefined) {
220
+ this.mode = 'auto';
221
+ this.type = checkboxTypes[0];
222
+ }
219
223
  else {
220
224
  const className = `${this.baseClassName}-multi`;
221
225
  if (newValue === 'multi') {
@@ -247,9 +251,9 @@ const MgInputCheckbox$1 = /*@__PURE__*/ proxyCustomElement(class MgInputCheckbox
247
251
  this.classCollection.delete(className);
248
252
  }
249
253
  validateCheckboxItems(newValue) {
250
- if (newValue.length > this.multiStart)
254
+ if (this.mode === 'auto' && newValue.length > this.multiStart)
251
255
  this.type = 'multi';
252
- if (newValue.length > this.searchStart) {
256
+ if (this.mode === 'auto' || (this.type === 'multi' && newValue.length > this.searchStart)) {
253
257
  this.displaySearchInput = this.type === 'multi';
254
258
  // refresh search values
255
259
  this.updateSearchResults();
@@ -260,13 +264,44 @@ const MgInputCheckbox$1 = /*@__PURE__*/ proxyCustomElement(class MgInputCheckbox
260
264
  this.updateSearchResults();
261
265
  }
262
266
  /**
263
- * Public method to display errors
267
+ * Display input error if it exists.
264
268
  */
265
269
  async displayError() {
266
270
  this.checkValidity();
267
271
  this.setErrorMessage();
268
272
  this.hasDisplayedError = this.invalid;
269
273
  }
274
+ /**
275
+ * Set an error and display a custom error message.
276
+ * This method can be used to set the component's error state from its context by passing a boolean value to the `valid` parameter.
277
+ * It must be paired with an error message to display for the given context.
278
+ * When used to set validity to `false`, you should use this method again to reset the validity to `true`.
279
+ * @param valid - value indicating the validity
280
+ * @param errorMessage - the error message to display
281
+ */
282
+ async setError(valid, errorMessage) {
283
+ if (typeof valid !== 'boolean') {
284
+ throw new Error('<mg-input-checkbox> method "setError()" param "valid" must be a boolean');
285
+ }
286
+ else if (!isValidString(errorMessage)) {
287
+ throw new Error('<mg-input-checkbox> method "setError()" param "errorMessage" must be a string');
288
+ }
289
+ else {
290
+ this.setValidity(valid);
291
+ this.setErrorMessage(undefined, valid ? undefined : errorMessage);
292
+ this.hasDisplayedError = this.invalid;
293
+ }
294
+ }
295
+ /**
296
+ * Method to set validity values
297
+ * @param newValue - valid new value
298
+ */
299
+ setValidity(newValue) {
300
+ this.valid = newValue;
301
+ this.invalid = !this.valid;
302
+ // We need to send valid event even if it is the same value
303
+ this.inputValid.emit(this.valid);
304
+ }
270
305
  /**
271
306
  * Update ckecboxes item
272
307
  * @param key - property to update
@@ -317,9 +352,9 @@ const MgInputCheckbox$1 = /*@__PURE__*/ proxyCustomElement(class MgInputCheckbox
317
352
  */
318
353
  renderCheckboxMultiDisplaySelectedValues(selectedValuesNb) {
319
354
  if (this.displaySelectedValues) {
320
- return (selectedValuesNb > 0 && (h("ul", { role: "list", class: "mg-input__input-checkbox-multi-values-container" }, this.checkboxItems
355
+ return (selectedValuesNb > 0 && (h("ul", { role: "list", class: "mg-c-input__input-checkbox-multi-values-container" }, this.checkboxItems
321
356
  .filter(({ value }) => value)
322
- .map(({ title }) => (h("li", { class: "mg-input__input-checkbox-multi-value", key: title }, title))))));
357
+ .map(({ title }) => (h("li", { class: "mg-c-input__input-checkbox-multi-value", key: title }, title))))));
323
358
  }
324
359
  else {
325
360
  return h("strong", null, this.messages.input.checkbox[selectedValuesNb > 1 ? 'selectedValues' : 'selectedValue'].replace('{nb}', selectedValuesNb));
@@ -353,13 +388,13 @@ const MgInputCheckbox$1 = /*@__PURE__*/ proxyCustomElement(class MgInputCheckbox
353
388
  renderCheckboxMulti() {
354
389
  const selectedValuesNb = this.checkboxItems.filter(({ value }) => value).length;
355
390
  const checkboxes = this.getDisplayItems();
356
- return (h("div", { class: { 'mg-input__input-container': true, 'mg-input__input-checkbox-multi': true, 'mg-input__input-checkbox-multi--with-values': this.displaySelectedValues } }, this.renderCheckboxMultiDisplaySelectedValues(selectedValuesNb), h("mg-popover", { arrowHide: true, identifier: this.getMgPopoverIdentifier(), "onDisplay-change": this.handleMgPopoverDisplayChange, ref: (el) => {
391
+ return (h("div", { class: { 'mg-c-input__input-container': true, 'mg-c-input__input-checkbox-multi': true, 'mg-c-input__input-checkbox-multi--with-values': this.displaySelectedValues } }, this.renderCheckboxMultiDisplaySelectedValues(selectedValuesNb), h("mg-popover", { arrowHide: true, identifier: this.getMgPopoverIdentifier(), "onDisplay-change": this.handleMgPopoverDisplayChange, ref: (el) => {
357
392
  if (Boolean(el))
358
393
  this.mgPopover = el;
359
394
  } }, h("mg-button", { variant: "secondary" }, h("mg-icon", { icon: "list" }), this.renderButtonText(selectedValuesNb)), h("div", { slot: "content" }, this.displaySearchInput && [
360
395
  h("mg-input-text", { key: "input-search", identifier: `${this.identifier}-input-search`, icon: "magnifying-glass", type: "search", placeholder: this.messages.input.checkbox.label, label: this.messages.input.checkbox.label, mgWidth: "full", value: this.searchValue, labelHide: true, displayCharacterLeft: false, name: "q", "onValue-change": this.handleSearchChange, "aria-controls": "search-results items-list" }),
361
- h("p", { key: "search-results", role: "status", class: "sr-only", id: "search-results" }, `${checkboxes.length} ${this.messages.input.checkbox[checkboxes.length > 0 ? 'results' : 'result']}`),
362
- ], this.displaySearchInput ? (h("div", { class: "mg-input__input-checkbox-multi-sections-container" }, this.renderCheckboxBySection(checkboxes))) : (h(MgInputCheckboxList, { checkboxes: checkboxes, inputVerticalList: true, type: this.type, readonly: this.readonly, displaySearchInput: this.displaySearchInput, messages: this.messages.input.checkbox, id: "checkboxes-list", disabled: this.disabled, name: this.name })), this.displaySearchInput && checkboxes.length === 0 && h("p", { class: "mg-input__input-checkbox-multi-no-result" }, this.messages.input.checkbox.noResult)))));
396
+ h("p", { key: "search-results", role: "status", class: "mg-u-visually-hidden", id: "search-results" }, `${checkboxes.length} ${this.messages.input.checkbox[checkboxes.length > 0 ? 'results' : 'result']}`),
397
+ ], this.displaySearchInput ? (h("div", { class: "mg-c-input__input-checkbox-multi-sections-container" }, this.renderCheckboxBySection(checkboxes))) : (h(MgInputCheckboxList, { checkboxes: checkboxes, inputVerticalList: true, type: this.type, readonly: this.readonly, displaySearchInput: this.displaySearchInput, messages: this.messages.input.checkbox, id: "checkboxes-list", disabled: this.disabled, name: this.name })), this.displaySearchInput && checkboxes.length === 0 && h("p", { class: "mg-c-input__input-checkbox-multi-no-result" }, this.messages.input.checkbox.noResult)))));
363
398
  }
364
399
  /**
365
400
  * Render
@@ -403,7 +438,8 @@ const MgInputCheckbox$1 = /*@__PURE__*/ proxyCustomElement(class MgInputCheckbox
403
438
  "displaySearchInput": [32],
404
439
  "searchValue": [32],
405
440
  "searchResults": [32],
406
- "displayError": [64]
441
+ "displayError": [64],
442
+ "setError": [64]
407
443
  }, undefined, {
408
444
  "value": ["validateValue"],
409
445
  "type": ["validateType"],
@@ -1 +1 @@
1
- {"file":"mg-input-checkbox.js","mappings":"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","names":["MgInputCheckbox"],"sources":["src/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.scss?tag=mg-input-checkbox&encapsulation=shadow","src/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.tsx"],"sourcesContent":["@use '../styles/mg-input.scss';\n@use '../styles/mg-input-fieldset.scss';\n@use '../../../../styles/a11y.scss';\n\n$checkbox-multi-spacer: 0.4rem;\n\n@mixin flex-container($spacer-ratio: 1, $direction: row, $wrap: wrap) {\n display: flex;\n flex-wrap: $wrap;\n gap: calc(#{$checkbox-multi-spacer} * #{$spacer-ratio});\n flex-direction: $direction;\n}\n\n/**\n* checkbox multi\n*/\n.mg-input.mg-input--checkbox-multi {\n .mg-input__input-checkbox-multi {\n display: flex;\n flex-wrap: wrap;\n gap: calc(var(--mg-inputs-spacer) * 1.2);\n &--with-values.mg-input__input-checkbox-multi {\n gap: $checkbox-multi-spacer;\n }\n &-values-container {\n @include flex-container();\n margin: 0;\n padding: 0;\n list-style: none;\n }\n &-value {\n display: inline-flex;\n justify-content: center;\n align-items: center;\n box-sizing: border-box;\n min-height: var(--default-size);\n min-width: var(--default-size);\n padding: calc((var(--default-size) - 0.2rem - var(--font-size) * var(--line-height)) / 2) 1.1rem;\n background-color: hsl(var(--mg-color-dark-5-hsl));\n border-radius: 0.3rem;\n font-size: var(--font-size);\n }\n &-no-result {\n text-align: center;\n }\n &-text,\n &-title {\n display: inline;\n margin: 0;\n color: hsl(var(--mg-color-dark-40-hsl));\n }\n &-title {\n margin: 0 1.1rem;\n }\n &-sections {\n @include flex-container(1, column);\n &-container {\n @include flex-container(0, column, nowrap);\n max-height: 80vh;\n padding-right: 1rem;\n overflow-y: auto;\n }\n }\n &-section-header {\n @include flex-container(2);\n align-items: center;\n min-height: var(--default-size);\n }\n &-inputs {\n margin: 0;\n padding: $checkbox-multi-spacer calc(#{$checkbox-multi-spacer} * 2) $checkbox-multi-spacer calc(#{$checkbox-multi-spacer} / 2);\n }\n }\n\n &:not(.mg-input--label-on-top) mg-tooltip {\n margin-left: var(--mg-inputs-spacer);\n }\n mg-popover {\n --mg-popover-min-width: 7rem;\n --mg-card-padding: calc(#{$checkbox-multi-spacer} * 2);\n &-content [slot='content'] {\n @include flex-container(2, column);\n .mg-input__input-group {\n margin-left: calc(#{$checkbox-multi-spacer} * 2);\n }\n }\n }\n mg-input-text {\n --mg-inputs-margin-bottom: 0;\n }\n}\n","/* eslint-disable jsx-a11y/no-redundant-roles */\nimport { Component, Element, Event, h, Prop, EventEmitter, State, Watch, Method } from '@stencil/core';\nimport { MgInput } from '../MgInput';\nimport { ClassList } from '../../../../utils/components.utils';\nimport { initLocales } from '../../../../locales';\nimport { CheckboxItem, CheckboxType, CheckboxValue, checkboxTypes, SearchValueType, SectionKind, MgInputCheckboxListProps } from './mg-input-checkbox.conf';\nimport { MgInputCheckboxList } from './MgInputCheckboxList';\n\n/**\n * type CheckboxItem validation function\n * @param items - Checkbox item\n * @returns match item type\n */\nconst isCheckboxItems = (items: unknown): items is CheckboxItem[] =>\n Array.isArray(items) &&\n items.every(item => typeof item === 'object' && typeof item.title === 'string' && (item.value === null || typeof item.value === 'boolean') && item.value !== undefined);\n\n@Component({\n tag: 'mg-input-checkbox',\n styleUrl: 'mg-input-checkbox.scss',\n shadow: true,\n})\nexport class MgInputCheckbox implements Omit<MgInputCheckboxListProps, 'id' | 'checkboxes' | 'messages'> {\n /************\n * Internal *\n ************/\n\n // HTML selector\n private mgPopover: HTMLMgPopoverElement;\n private searchInput: HTMLInputElement;\n\n // Locales\n private messages;\n\n // hasDisplayedError (triggered by blur event)\n private hasDisplayedError = false;\n\n // style\n private readonly baseClassName = 'mg-input--checkbox';\n\n // \"multi\" setup\n private readonly multiStart = 5;\n private readonly searchStart = 10;\n\n /**************\n * Decorators *\n **************/\n\n /**\n * Get component DOM element\n */\n @Element() element: HTMLMgInputCheckboxElement;\n\n /**\n * Component value\n * If item.value is `null`, checkbox will be indeterminate by default\n */\n @Prop({ mutable: true }) value!: CheckboxValue[];\n @Watch('value')\n validateValue(newValue: MgInputCheckbox['value']): void {\n if (isCheckboxItems(newValue)) {\n this.checkboxItems = newValue.map((item, index) => ({\n id: `${this.identifier}_${index}`,\n title: item.title,\n value: item.value,\n disabled: item.disabled,\n required: item.required,\n handleInput: this.handleInput.bind(this),\n handleBlur: this.handleBlur.bind(this),\n handleKeydown: this.handleKeydown.bind(this),\n }));\n this.valueChange.emit(newValue);\n } else {\n throw new Error('<mg-input-checkbox> prop \"value\" is required and all values must be the same type, CheckboxItem.');\n }\n }\n\n /**\n * Define checkbox type\n */\n @Prop({ mutable: true }) type: CheckboxType = checkboxTypes[0];\n @Watch('type')\n validateType(newValue: MgInputCheckbox['type']): void {\n if (!checkboxTypes.includes(newValue)) {\n throw new Error('<mg-input-checkbox> prop \"type\" must be a CheckboxType.');\n } else {\n const className = `${this.baseClassName}-multi`;\n if (newValue === 'multi') {\n this.classCollection.add(className);\n this.element.dataset.mgPopoverGuard = this.getMgPopoverIdentifier();\n } else this.classCollection.delete(className);\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 * Define input name\n * If not set the value equals the identifier\n */\n @Prop() name = this.identifier;\n\n /**\n * Define input label\n */\n @Prop() label!: string;\n\n /**\n * Define if label is displayed on top\n */\n @Prop() labelOnTop: boolean;\n\n /**\n * Define if label is visible\n */\n @Prop() labelHide = false;\n\n /**\n * Define if inputs are display verticaly\n */\n @Prop() inputVerticalList = false;\n\n /**\n * Define if mg-input-checkbox is required\n */\n @Prop() required = false;\n\n /**\n * Define if mg-input-checkbox is readonly\n */\n @Prop() readonly = false;\n\n /**\n * Display selected values list in \"multi\" type\n */\n @Prop() displaySelectedValues: boolean;\n @Watch('displaySelectedValues')\n validateDisplaySelectedValues(newValue: MgInputCheckbox['displaySelectedValues']): void {\n if (newValue !== undefined && this.type !== 'multi') throw new Error('<mg-input-checkbox> prop \"displaySelectedValues\" can only be used with prop type \"multi\".');\n }\n /**\n * Define if input is disabled\n */\n @Prop() disabled = false;\n @Watch('required')\n @Watch('readonly')\n @Watch('disabled')\n handleValidityChange(newValue: boolean, _oldValue: boolean, prop: string): void {\n if (prop !== 'readonly') this.updateCheckboxItems(prop, newValue);\n this.checkValidity();\n if (this.hasDisplayedError) {\n this.hasDisplayedError = prop !== 'required';\n this.setErrorMessage(this.hasDisplayedError);\n }\n }\n\n @Watch('disabled')\n validateDisabled(newValue: MgInputCheckbox['disabled']): void {\n const className = `${this.baseClassName}-multi-disabled`;\n if (newValue && this.type === 'multi') this.classCollection.add(className);\n else this.classCollection.delete(className);\n }\n\n /**\n * Add a tooltip message next to the input\n */\n @Prop() tooltip: string;\n\n /**\n * Add a help text under the input, usually expected data format and example\n */\n @Prop() helpText: string;\n\n /**\n * Define input valid state\n */\n @Prop({ mutable: true }) valid: boolean;\n\n /**\n * Define input invalid state\n */\n @Prop({ mutable: true }) invalid: boolean;\n\n /**\n * Component classes\n */\n @State() classCollection: ClassList = new ClassList([this.baseClassName]);\n\n /**\n * Error message to display\n */\n @State() errorMessage: string;\n\n /**\n * Formated value to display in list\n */\n @State() checkboxItems: CheckboxItem[] = [];\n @Watch('checkboxItems')\n validateCheckboxItems(newValue: MgInputCheckbox['checkboxItems']): void {\n if (newValue.length > this.multiStart) this.type = 'multi';\n if (newValue.length > this.searchStart) {\n this.displaySearchInput = this.type === 'multi';\n // refresh search values\n this.updateSearchResults();\n }\n }\n\n /**\n * Display search input\n */\n @State() displaySearchInput: boolean;\n\n /**\n * Search value query\n */\n @State() searchValue: SearchValueType = '';\n @Watch('searchValue')\n validateSearchValue(): void {\n // refresh search values\n this.updateSearchResults();\n }\n\n /**\n * Search current page\n */\n @State() searchResults: CheckboxItem[] = [];\n\n /**\n * Emitted event when value change\n */\n @Event({ eventName: 'value-change' }) valueChange: EventEmitter<MgInputCheckbox['value']>;\n\n /**\n * Emited event when checking validity\n */\n @Event({ eventName: 'input-valid' }) inputValid: EventEmitter<MgInputCheckbox['valid']>;\n\n /**\n * Public method to display errors\n */\n @Method()\n async displayError(): Promise<void> {\n this.checkValidity();\n this.setErrorMessage();\n this.hasDisplayedError = this.invalid;\n }\n\n /**\n * Handle input event\n * @param event - input event\n */\n private handleInput = (event: InputEvent & { target: HTMLInputElement }): void => {\n this.updateCheckboxItems('value', Boolean(event.target.checked), item => item.id === event.target.id);\n this.updateValues();\n this.checkValidity();\n };\n\n /**\n * Keyboard handler\n * @param event - to trak \"tab\" key\n */\n private handleKeydown = (event: KeyboardEvent & { target: HTMLElement }): void => {\n // track \"Tab\" key event when popover display (is \"multi\" type selected)\n if (event.key === 'Tab' && this.mgPopover?.display) {\n // when search input and do a back tab we close the popover\n if (Boolean(this.searchInput) && event.shiftKey && this.searchInput.id === event.target.id) {\n this.mgPopover.display = false;\n return;\n }\n\n const enableInputs = Array.from(this.element.shadowRoot.querySelectorAll('input'))\n .filter(input => !Boolean(input.getAttribute('disabled')))\n .map(({ id }) => id);\n const originInputIndex = enableInputs.findIndex(id => id === event.target.id);\n\n // close popover when tab trigger focus outside its DOM\n if ((originInputIndex + 1 >= enableInputs.length && !event.shiftKey) || (originInputIndex === 0 && event.shiftKey && !Boolean(this.searchInput)))\n this.mgPopover.display = false;\n }\n };\n\n /**\n * Handle blur event\n */\n private handleBlur = (): void => {\n // Check validity\n this.checkValidity();\n this.setErrorMessage();\n };\n\n /**\n * Handle input search value-change event\n * @param event - input value-change event\n */\n private handleSearchChange = (event: CustomEvent): void => {\n this.searchValue = event.detail;\n };\n\n /**\n * popover display-change handler\n * @param event - mg-popover display-change custom event\n */\n private handleMgPopoverDisplayChange = (event: CustomEvent): void => {\n // reset search value\n if (!event.detail) {\n this.searchValue = '';\n this.checkValidity();\n }\n };\n\n /**\n * Handle select all button\n * @param event - mass action event trigger a global select/unselect on values\n */\n private handleMassAction = (event: CustomEvent): void => {\n this.updateCheckboxItems('value', event.detail !== 'selected');\n this.updateValues();\n };\n\n /**\n * Update values\n */\n private updateValues = (): void => {\n this.value = this.checkboxItems.map(o => ({ value: o.value, title: o.title, disabled: o.disabled }));\n };\n\n /**\n * Update ckecboxes item\n * @param key - property to update\n * @param newValue - value to update with\n * @param condition - condtion to applu change on item\n */\n private updateCheckboxItems(key: string, newValue: unknown, condition?: (item: CheckboxItem) => boolean): void {\n this.checkboxItems = this.checkboxItems.map(item => {\n if ((typeof condition === 'function' && condition(item)) || condition === undefined) item[key] = newValue;\n return item;\n });\n }\n\n /**\n * get invalid element\n * @returns element\n */\n private getInvalidElement = (): HTMLInputElement => {\n const items: HTMLInputElement[] = Array.from(this.element.shadowRoot.querySelectorAll('input[type=\"checkbox\"]'));\n return items.find(input => input !== null && !input.disabled && !input.checkValidity());\n };\n\n /**\n * Method to update searchResults\n */\n private updateSearchResults = (): void => {\n this.searchResults = this.checkboxItems.filter(item => item.title.toLocaleLowerCase().includes(this.searchValue.trim().toLocaleLowerCase()));\n };\n\n /**\n * Methode to validate if one of inputs value is checked id required\n * @returns truthy if condition is valid\n */\n private validateRequired = (): boolean => !this.required || this.checkboxItems.some(({ value }) => value);\n\n /**\n * Check if input is valid\n */\n private checkValidity = (): void => {\n this.valid = this.readonly || this.disabled || (this.getInvalidElement() === undefined && this.validateRequired());\n this.invalid = !this.valid;\n // We need to send valid event even if it is the same value\n this.inputValid.emit(this.valid);\n };\n\n /**\n * Render button text\n * @param selectedValuesNb - nb of selected values\n * @returns translated message\n */\n private renderButtonText = (selectedValuesNb: number): string => {\n let messageKey = 'editButton';\n if (this.disabled) messageKey = 'showButton';\n else if (selectedValuesNb < 1) messageKey = 'selectButton';\n\n return this.messages.input.checkbox[messageKey];\n };\n\n /**\n * Set input error message\n * @param displayError - dispay error condition\n */\n private setErrorMessage = (displayError = true): void => {\n // Set error message\n this.errorMessage = undefined;\n if (displayError && !this.valid && !this.validateRequired()) this.errorMessage = this.messages.errors.required;\n };\n\n /**\n * Method to get mg-popover identifier\n * @returns MgPopover identifier\n */\n private getMgPopoverIdentifier = (): string => `${this.identifier}-input-mg-popover`;\n\n /**\n * Manage items to display depending on the search state\n * @returns items to display\n */\n private getDisplayItems = (): CheckboxItem[] => (this.searchValue.length > 0 ? this.searchResults : this.checkboxItems);\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Check if component props are well configured on init\n * @returns timeout\n */\n componentWillLoad(): ReturnType<typeof setTimeout> {\n // Get locales\n this.messages = initLocales(this.element).messages;\n // Validate\n this.validateType(this.type);\n this.validateValue(this.value);\n this.validateDisabled(this.disabled);\n this.validateDisplaySelectedValues(this.displaySelectedValues);\n // Check validity when component is ready\n // return a promise to process action only in the FIRST render().\n // https://stenciljs.com/docs/component-lifecycle#componentwillload\n return setTimeout(() => {\n this.checkValidity();\n }, 0);\n }\n\n /**\n * add listeners\n */\n componentDidLoad(): void {\n this.searchInput = this.element.shadowRoot.querySelector('mg-input-text')?.shadowRoot.querySelector('input');\n this.searchInput?.addEventListener('keydown', this.handleKeydown);\n }\n\n /**\n * Render checkbox multi display values\n * @param selectedValuesNb - selected values length\n * @returns display selected values\n */\n private renderCheckboxMultiDisplaySelectedValues(selectedValuesNb: number): HTMLElement {\n if (this.displaySelectedValues) {\n return (\n selectedValuesNb > 0 && (\n <ul role=\"list\" class=\"mg-input__input-checkbox-multi-values-container\">\n {this.checkboxItems\n .filter(({ value }) => value)\n .map(({ title }) => (\n <li class=\"mg-input__input-checkbox-multi-value\" key={title}>\n {title}\n </li>\n ))}\n </ul>\n )\n );\n } else {\n return <strong>{this.messages.input.checkbox[selectedValuesNb > 1 ? 'selectedValues' : 'selectedValue'].replace('{nb}', selectedValuesNb)}</strong>;\n }\n }\n\n /**\n * Render checkboxes by section\n * @param checkboxes - checkboxes to render\n * @returns render sections of checkboxes\n */\n private renderCheckboxBySection(checkboxes: CheckboxItem[]): HTMLElement[] {\n const [checkedValues, notCheckedValues] = checkboxes.reduce(\n (acc, curr) => {\n acc[curr.value ? 0 : 1].push(curr);\n return acc;\n },\n [[], []],\n );\n\n const baseSection = {\n readonly: this.readonly,\n disabled: this.disabled,\n identifier: this.identifier,\n };\n\n const sections = [\n {\n ...baseSection,\n sectionKind: SectionKind.SELECTED,\n checkboxes: checkedValues,\n messages: this.messages.input.checkbox.sections.selected,\n },\n {\n ...baseSection,\n sectionKind: SectionKind.NOT_SELECTED,\n checkboxes: notCheckedValues,\n messages: this.messages.input.checkbox.sections.notSelected,\n },\n ];\n\n return sections.map(section => <mg-input-checkbox-paginated {...section} onMass-action={this.handleMassAction}></mg-input-checkbox-paginated>);\n }\n\n /**\n * render checkbox multi element\n * @returns html element\n */\n private renderCheckboxMulti(): HTMLElement[] {\n const selectedValuesNb = this.checkboxItems.filter(({ value }) => value).length;\n const checkboxes = this.getDisplayItems();\n\n return (\n <div class={{ 'mg-input__input-container': true, 'mg-input__input-checkbox-multi': true, 'mg-input__input-checkbox-multi--with-values': this.displaySelectedValues }}>\n {this.renderCheckboxMultiDisplaySelectedValues(selectedValuesNb)}\n <mg-popover\n arrowHide={true}\n identifier={this.getMgPopoverIdentifier()}\n onDisplay-change={this.handleMgPopoverDisplayChange}\n ref={(el: HTMLMgPopoverElement) => {\n if (Boolean(el)) this.mgPopover = el;\n }}\n >\n <mg-button variant=\"secondary\">\n <mg-icon icon=\"list\"></mg-icon>\n {this.renderButtonText(selectedValuesNb)}\n </mg-button>\n <div slot=\"content\">\n {this.displaySearchInput && [\n <mg-input-text\n key=\"input-search\"\n identifier={`${this.identifier}-input-search`}\n icon=\"magnifying-glass\"\n type=\"search\"\n placeholder={this.messages.input.checkbox.label}\n label={this.messages.input.checkbox.label}\n mgWidth=\"full\"\n value={this.searchValue}\n labelHide={true}\n displayCharacterLeft={false}\n name=\"q\"\n onValue-change={this.handleSearchChange}\n aria-controls=\"search-results items-list\"\n ></mg-input-text>,\n <p key=\"search-results\" role=\"status\" class=\"sr-only\" id=\"search-results\">\n {`${checkboxes.length} ${this.messages.input.checkbox[checkboxes.length > 0 ? 'results' : 'result']}`}\n </p>,\n ]}\n {this.displaySearchInput ? (\n <div class=\"mg-input__input-checkbox-multi-sections-container\">{this.renderCheckboxBySection(checkboxes)}</div>\n ) : (\n <MgInputCheckboxList\n checkboxes={checkboxes}\n inputVerticalList={true}\n type={this.type}\n readonly={this.readonly}\n displaySearchInput={this.displaySearchInput}\n messages={this.messages.input.checkbox}\n id=\"checkboxes-list\"\n disabled={this.disabled}\n name={this.name}\n ></MgInputCheckboxList>\n )}\n {this.displaySearchInput && checkboxes.length === 0 && <p class=\"mg-input__input-checkbox-multi-no-result\">{this.messages.input.checkbox.noResult}</p>}\n </div>\n </mg-popover>\n </div>\n );\n }\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <MgInput\n identifier={this.identifier}\n classCollection={this.classCollection}\n ariaDescribedbyIDs={[]}\n label={this.label}\n labelOnTop={this.labelOnTop}\n labelHide={this.labelHide}\n required={!this.readonly ? this.required : undefined} // required is only used display asterisk\n readonly={undefined}\n mgWidth={undefined}\n disabled={this.disabled}\n value={this.value && this.value.toString()}\n readonlyValue={undefined}\n tooltip={!this.readonly ? this.tooltip : undefined}\n helpText={!this.readonly ? this.helpText : undefined}\n errorMessage={!this.readonly ? this.errorMessage : undefined}\n isFieldset={true}\n >\n {this.type === 'checkbox' || this.readonly ? (\n <MgInputCheckboxList\n checkboxes={this.checkboxItems}\n inputVerticalList={this.inputVerticalList}\n type={this.type}\n readonly={this.readonly}\n displaySearchInput={this.displaySearchInput}\n messages={this.messages.input.checkbox}\n id=\"checkboxes-list\"\n disabled={this.disabled}\n name={this.name}\n ></MgInputCheckboxList>\n ) : (\n this.renderCheckboxMulti()\n )}\n </MgInput>\n );\n }\n}\n"],"version":3}
1
+ {"file":"mg-input-checkbox.js","mappings":"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","names":["MgInputCheckbox"],"sources":["../styles/dist/components/mg-input-checkbox.css?tag=mg-input-checkbox&encapsulation=shadow","src/components/molecules/inputs/mg-input-checkbox/mg-input-checkbox.tsx"],"sourcesContent":[":host{display:block}.mg-c-input__input mg-icon,.mg-c-input__error mg-icon{display:flex}.mg-c-input{display:flex;max-width:100%;min-height:var(--default-size);align-items:flex-start;margin-bottom:var(--mg-inputs-margin-bottom, 0)}.mg-c-input mg-input-title{width:var(--mg-inputs-title-width, auto);flex-shrink:var(--mg-inputs-shrink, 1);margin-top:calc((var(--default-size) - var(--font-size)*var(--line-height))/2);margin-right:var(--mg-inputs-title-horizontal-space, var(--mg-inputs-spacer));text-align:right}.mg-c-input__error{display:inline-block;padding:.3rem .8rem;border-radius:.3rem;margin-top:.2rem;background:hsl(var(--mg-inputs-error-bg-color));color:hsl(var(--color-danger))}.mg-c-input__input-container{min-height:var(--default-size)}.mg-c-input__input-container>strong{display:inline-block;min-height:var(--font-size);margin-top:calc((var(--default-size) - var(--font-size)*var(--line-height))/2)}.mg-c-input__input-container mg-tooltip{display:inline-flex;width:var(--mg-icon-regular-size);height:var(--mg-icon-regular-size);margin-left:var(--mg-inputs-spacer)}.mg-c-input__input-container .mg-c-input__help-text,.mg-c-input__input-container .mg-c-input__error{font-size:1.2rem;text-align:start}.mg-c-input.mg-c-input--label-on-top{flex-direction:column}.mg-c-input.mg-c-input--label-on-top .mg-c-input__input-container{width:100%}.mg-c-input__title{display:flex;align-items:baseline;margin-bottom:.3rem}.mg-c-input__title mg-input-title{width:auto;flex-shrink:1;margin-top:0;margin-right:var(--mg-inputs-spacer);text-align:left}.mg-c-input__title mg-tooltip{margin-top:0}.mg-c-input__title mg-icon{display:inline-flex;vertical-align:text-bottom}.mg-c-input__input{display:flex}.mg-c-input__input mg-tooltip{margin-top:calc((var(--default-size) - var(--mg-icon-regular-size))/2)}.mg-c-input__input.mg-c-input__input--has-error .mg-c-input__box{border-color:hsl(var(--color-danger))}.mg-c-input__input+.mg-c-input__help-text,.mg-c-input__input+.mg-c-input__error{margin-top:.5rem}.mg-c-input__input .mg-c-input__box:disabled,.mg-c-input__input-group--disabled label,.mg-c-input.mg-c-input--toggle-disabled .mg-c-input__input .mg-c-input__button-toggle,.mg-c-input.mg-c-input--checkbox-multi-disabled .mg-c-input__input strong{opacity:var(--mg-disabled-opacity)}.mg-c-input__input-group-container{display:flex;flex-wrap:wrap;padding:0;margin:0;margin-top:calc((var(--default-size) - var(--font-size)*var(--line-height))/2);column-gap:2.3rem;list-style:none;row-gap:1rem}.mg-c-input__input-group-container--vertical{flex-direction:column}fieldset.mg-c-input{padding:0;border:0;margin-right:0;margin-left:0}fieldset.mg-c-input input[type=radio],fieldset.mg-c-input input[type=checkbox]{width:var(--mg-input-check-size);height:var(--mg-input-check-size);flex-shrink:0;margin:calc((var(--font-size)*var(--line-height) - var(--mg-input-check-size))/2) .6rem 0 0}fieldset.mg-c-input.mg-c-input--label-on-top .mg-c-input__input-group-container{margin-top:.7rem}.mg-c-input__input-container mg-tooltip{margin-left:3rem}.mg-c-input__input-group{display:flex;align-items:start}.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}}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-checkbox-multi{display:flex;flex-wrap:wrap;gap:calc(var(--mg-inputs-spacer)*1.2)}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-checkbox-multi--with-values.mg-c-input__input-checkbox-multi{gap:.4rem}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-checkbox-multi-values-container{display:flex;flex-flow:row wrap;gap:calc(0.4rem * 1);padding:0;margin:0;list-style:none}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-checkbox-multi-value{display:inline-flex;min-width:var(--default-size);min-height:var(--default-size);box-sizing:border-box;align-items:center;justify-content:center;padding:calc((var(--default-size) - .2rem - var(--font-size)*var(--line-height))/2) 1.1rem;border-radius:.3rem;background-color:hsl(var(--mg-color-dark-5-hsl));font-size:var(--font-size)}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-checkbox-multi-no-result{text-align:center}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-checkbox-multi-text,.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-checkbox-multi-title{display:inline;margin:0;color:hsl(var(--mg-color-dark-40-hsl))}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-checkbox-multi-title{margin:0 1.1rem}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-checkbox-multi-sections{display:flex;flex-flow:column wrap;gap:calc(0.4rem * 1)}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-checkbox-multi-sections-container{display:flex;flex-flow:column nowrap;gap:calc(0.4rem * 0);max-height:80vh;padding-right:1rem;overflow-y:auto}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-checkbox-multi-section-header{display:flex;flex-flow:row wrap;gap:calc(0.4rem * 2);min-height:var(--default-size);align-items:center}.mg-c-input.mg-c-input--checkbox-multi .mg-c-input__input-checkbox-multi-inputs{padding:.4rem calc(0.4rem * 2) .4rem calc(0.4rem / 2);margin:0}.mg-c-input.mg-c-input--checkbox-multi:not(.mg-c-input--label-on-top) mg-tooltip{margin-left:var(--mg-inputs-spacer)}.mg-c-input.mg-c-input--checkbox-multi mg-popover{--mg-popover-min-width: 7rem;--mg-card-padding: calc(0.4rem * 2)}.mg-c-input.mg-c-input--checkbox-multi mg-popover-content [slot=content]{display:flex;flex-flow:column wrap;gap:calc(0.4rem * 2)}.mg-c-input.mg-c-input--checkbox-multi mg-popover-content [slot=content] .mg-c-input__input-group{margin-left:calc(0.4rem * 2)}.mg-c-input.mg-c-input--checkbox-multi mg-input-text{--mg-inputs-margin-bottom: 0}/*# sourceMappingURL=mg-input-checkbox.css.map */\n","/* eslint-disable jsx-a11y/no-redundant-roles */\nimport { Component, Element, Event, h, Prop, EventEmitter, State, Watch, Method } from '@stencil/core';\nimport { MgInput } from '../MgInput';\nimport { ClassList, cleanString, isValidString } from '../../../../utils/components.utils';\nimport { initLocales } from '../../../../locales';\nimport { CheckboxItem, CheckboxType, CheckboxValue, checkboxTypes, SearchValueType, SectionKind, MgInputCheckboxListProps } from './mg-input-checkbox.conf';\nimport { MgInputCheckboxList } from './MgInputCheckboxList';\n\n/**\n * type CheckboxItem validation function\n * @param items - Checkbox item\n * @returns match item type\n */\nconst isCheckboxItems = (items: unknown): items is CheckboxItem[] =>\n Array.isArray(items) &&\n items.every(item => typeof item === 'object' && typeof item.title === 'string' && (item.value === null || typeof item.value === 'boolean') && item.value !== undefined);\n\n@Component({\n tag: 'mg-input-checkbox',\n styleUrl: '../../../../../node_modules/@mgdis/styles/dist/components/mg-input-checkbox.css',\n shadow: true,\n})\nexport class MgInputCheckbox implements Omit<MgInputCheckboxListProps, 'id' | 'checkboxes' | 'messages'> {\n /************\n * Internal *\n ************/\n\n // HTML selector\n private mgPopover: HTMLMgPopoverElement;\n private searchInput: HTMLInputElement;\n\n // Locales\n private messages;\n\n // hasDisplayedError (triggered by blur event)\n private hasDisplayedError = false;\n\n private mode: 'custom' | 'auto' = 'custom';\n\n // style\n private readonly baseClassName = 'mg-c-input--checkbox';\n\n // \"multi\" setup\n private readonly multiStart = 5;\n private readonly searchStart = 10;\n\n /**************\n * Decorators *\n **************/\n\n /**\n * Get component DOM element\n */\n @Element() element: HTMLMgInputCheckboxElement;\n\n /**\n * Component value\n * If item.value is `null`, checkbox will be indeterminate by default\n */\n @Prop({ mutable: true }) value!: CheckboxValue[];\n @Watch('value')\n validateValue(newValue: MgInputCheckbox['value']): void {\n if (isCheckboxItems(newValue)) {\n this.checkboxItems = newValue.map((item, index) => ({\n ...item,\n _id: `${this.identifier}_${index}`,\n _handleInput: this.handleInput.bind(this),\n _handleBlur: this.handleBlur.bind(this),\n _handleKeydown: this.handleKeydown.bind(this),\n }));\n this.valueChange.emit(newValue);\n } else {\n throw new Error('<mg-input-checkbox> prop \"value\" is required and all values must be the same type, CheckboxItem.');\n }\n }\n\n /**\n * Define checkbox type\n * When it's undefined the type is dynamic:\n * - With 0-5 items type is 'checkbox'\n * - With 5-10 items type is 'multi'\n * When it set the type is locked to the defined value.\n * When type is dynamic OR with 'multi' type AND Over 10 items \"search\" feature is enabled\n */\n @Prop({ mutable: true }) type: CheckboxType;\n @Watch('type')\n validateType(newValue: MgInputCheckbox['type']): void {\n if (newValue !== undefined && !checkboxTypes.includes(newValue)) {\n throw new Error('<mg-input-checkbox> prop \"type\" must be a CheckboxType.');\n } else if (newValue === undefined) {\n this.mode = 'auto';\n this.type = checkboxTypes[0];\n } else {\n const className = `${this.baseClassName}-multi`;\n if (newValue === 'multi') {\n this.classCollection.add(className);\n this.element.dataset.mgPopoverGuard = this.getMgPopoverIdentifier();\n } else this.classCollection.delete(className);\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 * Define input name\n * If not set the value equals the identifier\n */\n @Prop() name = this.identifier;\n\n /**\n * Define input label\n */\n @Prop() label!: string;\n\n /**\n * Define if label is displayed on top\n */\n @Prop() labelOnTop: boolean;\n\n /**\n * Define if label is visible\n */\n @Prop() labelHide = false;\n\n /**\n * Define if inputs are display verticaly\n */\n @Prop() inputVerticalList = false;\n\n /**\n * Define if mg-input-checkbox is required\n */\n @Prop() required = false;\n\n /**\n * Define if mg-input-checkbox is readonly\n */\n @Prop() readonly = false;\n\n /**\n * Display selected values list in \"multi\" type\n */\n @Prop() displaySelectedValues: boolean;\n @Watch('displaySelectedValues')\n validateDisplaySelectedValues(newValue: MgInputCheckbox['displaySelectedValues']): void {\n if (newValue !== undefined && this.type !== 'multi') throw new Error('<mg-input-checkbox> prop \"displaySelectedValues\" can only be used with prop type \"multi\".');\n }\n /**\n * Define if input is disabled\n */\n @Prop() disabled = false;\n @Watch('required')\n @Watch('readonly')\n @Watch('disabled')\n handleValidityChange(newValue: boolean, _oldValue: boolean, prop: string): void {\n if (prop !== 'readonly') this.updateCheckboxItems(prop, newValue);\n this.checkValidity();\n if (this.hasDisplayedError) {\n this.hasDisplayedError = prop !== 'required';\n this.setErrorMessage(this.hasDisplayedError);\n }\n }\n\n @Watch('disabled')\n validateDisabled(newValue: MgInputCheckbox['disabled']): void {\n const className = `${this.baseClassName}-multi-disabled`;\n if (newValue && this.type === 'multi') this.classCollection.add(className);\n else this.classCollection.delete(className);\n }\n\n /**\n * Add a tooltip message next to the input\n */\n @Prop() tooltip: string;\n\n /**\n * Add a help text under the input, usually expected data format and example\n */\n @Prop() helpText: string;\n\n /**\n * Define input valid state\n */\n @Prop({ mutable: true }) valid: boolean;\n\n /**\n * Define input invalid state\n */\n @Prop({ mutable: true }) invalid: boolean;\n\n /**\n * Component classes\n */\n @State() classCollection: ClassList = new ClassList([this.baseClassName]);\n\n /**\n * Error message to display\n */\n @State() errorMessage: string;\n\n /**\n * Formated value to display in list\n */\n @State() checkboxItems: CheckboxItem[] = [];\n @Watch('checkboxItems')\n validateCheckboxItems(newValue: MgInputCheckbox['checkboxItems']): void {\n if (this.mode === 'auto' && newValue.length > this.multiStart) this.type = 'multi';\n if (this.mode === 'auto' || (this.type === 'multi' && newValue.length > this.searchStart)) {\n this.displaySearchInput = this.type === 'multi';\n // refresh search values\n this.updateSearchResults();\n }\n }\n\n /**\n * Display search input\n */\n @State() displaySearchInput: boolean;\n\n /**\n * Search value query\n */\n @State() searchValue: SearchValueType = '';\n @Watch('searchValue')\n validateSearchValue(): void {\n // refresh search values\n this.updateSearchResults();\n }\n\n /**\n * Search current page\n */\n @State() searchResults: CheckboxItem[] = [];\n\n /**\n * Emitted event when value change\n */\n @Event({ eventName: 'value-change' }) valueChange: EventEmitter<MgInputCheckbox['value']>;\n\n /**\n * Emited event when checking validity\n */\n @Event({ eventName: 'input-valid' }) inputValid: EventEmitter<MgInputCheckbox['valid']>;\n\n /**\n * Display input error if it exists.\n */\n @Method()\n async displayError(): Promise<void> {\n this.checkValidity();\n this.setErrorMessage();\n this.hasDisplayedError = this.invalid;\n }\n\n /**\n * Set an error and display a custom error message.\n * This method can be used to set the component's error state from its context by passing a boolean value to the `valid` parameter.\n * It must be paired with an error message to display for the given context.\n * When used to set validity to `false`, you should use this method again to reset the validity to `true`.\n * @param valid - value indicating the validity\n * @param errorMessage - the error message to display\n */\n @Method()\n async setError(valid: MgInputCheckbox['valid'], errorMessage: string): Promise<void> {\n if (typeof valid !== 'boolean') {\n throw new Error('<mg-input-checkbox> method \"setError()\" param \"valid\" must be a boolean');\n } else if (!isValidString(errorMessage)) {\n throw new Error('<mg-input-checkbox> method \"setError()\" param \"errorMessage\" must be a string');\n } else {\n this.setValidity(valid);\n this.setErrorMessage(undefined, valid ? undefined : errorMessage);\n this.hasDisplayedError = this.invalid;\n }\n }\n\n /**\n * Method to set validity values\n * @param newValue - valid new value\n */\n private setValidity(newValue: MgInputCheckbox['valid']) {\n this.valid = newValue;\n this.invalid = !this.valid;\n // We need to send valid event even if it is the same value\n this.inputValid.emit(this.valid);\n }\n\n /**\n * Handle input event\n * @param event - input event\n */\n private handleInput = (event: InputEvent & { target: HTMLInputElement }): void => {\n this.updateCheckboxItems('value', Boolean(event.target.checked), item => item._id === event.target.id);\n this.updateValues();\n this.checkValidity();\n };\n\n /**\n * Keyboard handler\n * @param event - to trak \"tab\" key\n */\n private handleKeydown = (event: KeyboardEvent & { target: HTMLElement }): void => {\n // track \"Tab\" key event when popover display (is \"multi\" type selected)\n if (event.key === 'Tab' && this.mgPopover?.display) {\n // when search input and do a back tab we close the popover\n if (Boolean(this.searchInput) && event.shiftKey && this.searchInput.id === event.target.id) {\n this.mgPopover.display = false;\n return;\n }\n\n const enableInputs = Array.from(this.element.shadowRoot.querySelectorAll('input'))\n .filter(input => !Boolean(input.getAttribute('disabled')))\n .map(({ id }) => id);\n const originInputIndex = enableInputs.findIndex(id => id === event.target.id);\n\n // close popover when tab trigger focus outside its DOM\n if ((originInputIndex + 1 >= enableInputs.length && !event.shiftKey) || (originInputIndex === 0 && event.shiftKey && !Boolean(this.searchInput)))\n this.mgPopover.display = false;\n }\n };\n\n /**\n * Handle blur event\n */\n private handleBlur = (): void => {\n // Check validity\n this.checkValidity();\n this.setErrorMessage();\n };\n\n /**\n * Handle input search value-change event\n * @param event - input value-change event\n */\n private handleSearchChange = (event: CustomEvent): void => {\n this.searchValue = event.detail;\n };\n\n /**\n * popover display-change handler\n * @param event - mg-popover display-change custom event\n */\n private handleMgPopoverDisplayChange = (event: CustomEvent): void => {\n // reset search value\n if (!event.detail) {\n this.searchValue = '';\n this.checkValidity();\n }\n };\n\n /**\n * Handle select all button\n * @param event - mass action event trigger a global select/unselect on values\n */\n private handleMassAction = (event: CustomEvent): void => {\n this.updateCheckboxItems('value', event.detail !== 'selected');\n this.updateValues();\n };\n\n /**\n * Update values\n */\n private updateValues = (): void => {\n this.value = this.checkboxItems.map(o => {\n delete o._handleBlur;\n delete o._handleInput;\n delete o._handleKeydown;\n delete o._id;\n return o;\n });\n };\n\n /**\n * Update ckecboxes item\n * @param key - property to update\n * @param newValue - value to update with\n * @param condition - condtion to applu change on item\n */\n private updateCheckboxItems(key: string, newValue: unknown, condition?: (item: CheckboxItem) => boolean): void {\n this.checkboxItems = this.checkboxItems.map(item => {\n if ((typeof condition === 'function' && condition(item)) || condition === undefined) item[key] = newValue;\n return item;\n });\n }\n\n /**\n * get invalid element\n * @returns element\n */\n private getInvalidElement = (): HTMLInputElement => {\n const items: HTMLInputElement[] = Array.from(this.element.shadowRoot.querySelectorAll('input[type=\"checkbox\"]'));\n return items.find(input => input !== null && !input.disabled && !input.checkValidity());\n };\n\n /**\n * Method to update searchResults\n */\n private updateSearchResults = (): void => {\n this.searchResults = this.checkboxItems.filter(item => cleanString(item.title).includes(cleanString(this.searchValue)));\n };\n\n /**\n * Methode to validate if one of inputs value is checked id required\n * @returns truthy if condition is valid\n */\n private validateRequired = (): boolean => !this.required || this.checkboxItems.some(({ value }) => value);\n\n /**\n * Check if input is valid\n */\n private checkValidity = (): void => {\n this.setValidity(this.readonly || this.disabled || (this.getInvalidElement() === undefined && this.validateRequired()));\n };\n\n /**\n * Render button text\n * @param selectedValuesNb - nb of selected values\n * @returns translated message\n */\n private renderButtonText = (selectedValuesNb: number): string => {\n let messageKey = 'editButton';\n if (this.disabled) messageKey = 'showButton';\n else if (selectedValuesNb < 1) messageKey = 'selectButton';\n\n return this.messages.input.checkbox[messageKey];\n };\n\n /**\n * Set input error message\n * @param displayError - dispay error condition\n * @param errorMessage - errorMessage override\n */\n private setErrorMessage = (displayError = true, errorMessage?: string): void => {\n // Set error message\n this.errorMessage = undefined;\n if (displayError && !this.valid) {\n if (errorMessage !== undefined) this.errorMessage = errorMessage;\n else if (!this.validateRequired()) this.errorMessage = this.messages.errors.required;\n }\n };\n\n /**\n * Method to get mg-popover identifier\n * @returns MgPopover identifier\n */\n private getMgPopoverIdentifier = (): string => `${this.identifier}-input-mg-popover`;\n\n /**\n * Manage items to display depending on the search state\n * @returns items to display\n */\n private getDisplayItems = (): CheckboxItem[] => (this.searchValue.length > 0 ? this.searchResults : this.checkboxItems);\n\n /*************\n * Lifecycle *\n *************/\n\n /**\n * Check if component props are well configured on init\n * @returns timeout\n */\n componentWillLoad(): ReturnType<typeof setTimeout> {\n // Get locales\n this.messages = initLocales(this.element).messages;\n // Validate\n this.validateType(this.type);\n this.validateValue(this.value);\n this.validateDisabled(this.disabled);\n this.validateDisplaySelectedValues(this.displaySelectedValues);\n // Check validity when component is ready\n // return a promise to process action only in the FIRST render().\n // https://stenciljs.com/docs/component-lifecycle#componentwillload\n return setTimeout(() => {\n this.checkValidity();\n }, 0);\n }\n\n /**\n * add listeners\n */\n componentDidLoad(): void {\n this.searchInput = this.element.shadowRoot.querySelector('mg-input-text')?.shadowRoot.querySelector('input');\n this.searchInput?.addEventListener('keydown', this.handleKeydown);\n }\n\n /**\n * Render checkbox multi display values\n * @param selectedValuesNb - selected values length\n * @returns display selected values\n */\n private renderCheckboxMultiDisplaySelectedValues(selectedValuesNb: number): HTMLElement {\n if (this.displaySelectedValues) {\n return (\n selectedValuesNb > 0 && (\n <ul role=\"list\" class=\"mg-c-input__input-checkbox-multi-values-container\">\n {this.checkboxItems\n .filter(({ value }) => value)\n .map(({ title }) => (\n <li class=\"mg-c-input__input-checkbox-multi-value\" key={title}>\n {title}\n </li>\n ))}\n </ul>\n )\n );\n } else {\n return <strong>{this.messages.input.checkbox[selectedValuesNb > 1 ? 'selectedValues' : 'selectedValue'].replace('{nb}', selectedValuesNb)}</strong>;\n }\n }\n\n /**\n * Render checkboxes by section\n * @param checkboxes - checkboxes to render\n * @returns render sections of checkboxes\n */\n private renderCheckboxBySection(checkboxes: CheckboxItem[]): HTMLElement[] {\n const [checkedValues, notCheckedValues] = checkboxes.reduce(\n (acc, curr) => {\n acc[curr.value ? 0 : 1].push(curr);\n return acc;\n },\n [[], []],\n );\n\n const baseSection = {\n readonly: this.readonly,\n disabled: this.disabled,\n identifier: this.identifier,\n };\n\n const sections = [\n {\n ...baseSection,\n sectionKind: SectionKind.SELECTED,\n checkboxes: checkedValues,\n messages: this.messages.input.checkbox.sections.selected,\n },\n {\n ...baseSection,\n sectionKind: SectionKind.NOT_SELECTED,\n checkboxes: notCheckedValues,\n messages: this.messages.input.checkbox.sections.notSelected,\n },\n ];\n\n return sections.map(section => <mg-input-checkbox-paginated {...section} onMass-action={this.handleMassAction}></mg-input-checkbox-paginated>);\n }\n\n /**\n * render checkbox multi element\n * @returns html element\n */\n private renderCheckboxMulti(): HTMLElement[] {\n const selectedValuesNb = this.checkboxItems.filter(({ value }) => value).length;\n const checkboxes = this.getDisplayItems();\n\n return (\n <div class={{ 'mg-c-input__input-container': true, 'mg-c-input__input-checkbox-multi': true, 'mg-c-input__input-checkbox-multi--with-values': this.displaySelectedValues }}>\n {this.renderCheckboxMultiDisplaySelectedValues(selectedValuesNb)}\n <mg-popover\n arrowHide={true}\n identifier={this.getMgPopoverIdentifier()}\n onDisplay-change={this.handleMgPopoverDisplayChange}\n ref={(el: HTMLMgPopoverElement) => {\n if (Boolean(el)) this.mgPopover = el;\n }}\n >\n <mg-button variant=\"secondary\">\n <mg-icon icon=\"list\"></mg-icon>\n {this.renderButtonText(selectedValuesNb)}\n </mg-button>\n <div slot=\"content\">\n {this.displaySearchInput && [\n <mg-input-text\n key=\"input-search\"\n identifier={`${this.identifier}-input-search`}\n icon=\"magnifying-glass\"\n type=\"search\"\n placeholder={this.messages.input.checkbox.label}\n label={this.messages.input.checkbox.label}\n mgWidth=\"full\"\n value={this.searchValue}\n labelHide={true}\n displayCharacterLeft={false}\n name=\"q\"\n onValue-change={this.handleSearchChange}\n aria-controls=\"search-results items-list\"\n ></mg-input-text>,\n <p key=\"search-results\" role=\"status\" class=\"mg-u-visually-hidden\" id=\"search-results\">\n {`${checkboxes.length} ${this.messages.input.checkbox[checkboxes.length > 0 ? 'results' : 'result']}`}\n </p>,\n ]}\n {this.displaySearchInput ? (\n <div class=\"mg-c-input__input-checkbox-multi-sections-container\">{this.renderCheckboxBySection(checkboxes)}</div>\n ) : (\n <MgInputCheckboxList\n checkboxes={checkboxes}\n inputVerticalList={true}\n type={this.type}\n readonly={this.readonly}\n displaySearchInput={this.displaySearchInput}\n messages={this.messages.input.checkbox}\n id=\"checkboxes-list\"\n disabled={this.disabled}\n name={this.name}\n ></MgInputCheckboxList>\n )}\n {this.displaySearchInput && checkboxes.length === 0 && <p class=\"mg-c-input__input-checkbox-multi-no-result\">{this.messages.input.checkbox.noResult}</p>}\n </div>\n </mg-popover>\n </div>\n );\n }\n\n /**\n * Render\n * @returns HTML Element\n */\n render(): HTMLElement {\n return (\n <MgInput\n identifier={this.identifier}\n classCollection={this.classCollection}\n ariaDescribedbyIDs={[]}\n label={this.label}\n labelOnTop={this.labelOnTop}\n labelHide={this.labelHide}\n required={!this.readonly ? this.required : undefined} // required is only used display asterisk\n readonly={undefined}\n mgWidth={undefined}\n disabled={this.disabled}\n value={this.value && this.value.toString()}\n readonlyValue={undefined}\n tooltip={!this.readonly ? this.tooltip : undefined}\n helpText={!this.readonly ? this.helpText : undefined}\n errorMessage={!this.readonly ? this.errorMessage : undefined}\n isFieldset={true}\n >\n {this.type === 'checkbox' || this.readonly ? (\n <MgInputCheckboxList\n checkboxes={this.checkboxItems}\n inputVerticalList={this.inputVerticalList}\n type={this.type}\n readonly={this.readonly}\n displaySearchInput={this.displaySearchInput}\n messages={this.messages.input.checkbox}\n id=\"checkboxes-list\"\n disabled={this.disabled}\n name={this.name}\n ></MgInputCheckboxList>\n ) : (\n this.renderCheckboxMulti()\n )}\n </MgInput>\n );\n }\n}\n"],"version":3}