@ukic/web-components 3.1.0 → 3.3.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 (610) hide show
  1. package/README.md +28 -0
  2. package/dist/cjs/core.cjs.js +1 -1
  3. package/dist/cjs/{helpers-a0a128bd.js → helpers-fc4016d2.js} +36 -73
  4. package/dist/cjs/helpers-fc4016d2.js.map +1 -0
  5. package/dist/cjs/ic-accordion-group.cjs.entry.js +1 -1
  6. package/dist/cjs/ic-accordion-group.cjs.entry.js.map +1 -1
  7. package/dist/cjs/ic-accordion.cjs.entry.js +1 -1
  8. package/dist/cjs/ic-accordion.cjs.entry.js.map +1 -1
  9. package/dist/cjs/ic-alert.cjs.entry.js +63 -36
  10. package/dist/cjs/ic-alert.cjs.entry.js.map +1 -1
  11. package/dist/cjs/ic-back-to-top.cjs.entry.js +4 -4
  12. package/dist/cjs/ic-badge.cjs.entry.js +41 -17
  13. package/dist/cjs/ic-badge.cjs.entry.js.map +1 -1
  14. package/dist/cjs/ic-breadcrumb-group.cjs.entry.js +56 -76
  15. package/dist/cjs/ic-breadcrumb-group.cjs.entry.js.map +1 -1
  16. package/dist/cjs/ic-breadcrumb.cjs.entry.js +32 -51
  17. package/dist/cjs/ic-breadcrumb.cjs.entry.js.map +1 -1
  18. package/dist/cjs/ic-button_3.cjs.entry.js +135 -131
  19. package/dist/cjs/ic-button_3.cjs.entry.js.map +1 -1
  20. package/dist/cjs/ic-card-vertical.cjs.entry.js +6 -6
  21. package/dist/cjs/ic-card-vertical.cjs.entry.js.map +1 -1
  22. package/dist/cjs/ic-checkbox-group.cjs.entry.js +9 -10
  23. package/dist/cjs/ic-checkbox-group.cjs.entry.js.map +1 -1
  24. package/dist/cjs/ic-checkbox.cjs.entry.js +35 -34
  25. package/dist/cjs/ic-checkbox.cjs.entry.js.map +1 -1
  26. package/dist/cjs/ic-chip.cjs.entry.js +26 -38
  27. package/dist/cjs/ic-chip.cjs.entry.js.map +1 -1
  28. package/dist/cjs/ic-classification-banner.cjs.entry.js +2 -2
  29. package/dist/cjs/ic-data-list.cjs.entry.js +2 -2
  30. package/dist/cjs/ic-data-row.cjs.entry.js +3 -3
  31. package/dist/cjs/ic-dialog.cjs.entry.js +3 -3
  32. package/dist/cjs/ic-dialog.cjs.entry.js.map +1 -1
  33. package/dist/cjs/ic-divider.cjs.entry.js +2 -2
  34. package/dist/cjs/ic-divider.cjs.entry.js.map +1 -1
  35. package/dist/cjs/ic-empty-state.cjs.entry.js +3 -3
  36. package/dist/cjs/ic-footer-link-group.cjs.entry.js +2 -2
  37. package/dist/cjs/ic-footer-link-group.cjs.entry.js.map +1 -1
  38. package/dist/cjs/ic-footer-link.cjs.entry.js +3 -3
  39. package/dist/cjs/ic-footer.cjs.entry.js +4 -4
  40. package/dist/cjs/ic-hero.cjs.entry.js +5 -5
  41. package/dist/cjs/ic-horizontal-scroll.cjs.entry.js +6 -6
  42. package/dist/cjs/ic-input-component-container_3.cjs.entry.js +9 -9
  43. package/dist/cjs/ic-input-label_2.cjs.entry.js +8 -8
  44. package/dist/cjs/ic-link.cjs.entry.js +21 -3
  45. package/dist/cjs/ic-link.cjs.entry.js.map +1 -1
  46. package/dist/cjs/ic-menu-group.cjs.entry.js +2 -2
  47. package/dist/cjs/ic-menu-item.cjs.entry.js +5 -5
  48. package/dist/cjs/ic-menu-item.cjs.entry.js.map +1 -1
  49. package/dist/cjs/ic-navigation-button.cjs.entry.js +3 -3
  50. package/dist/cjs/ic-navigation-group.cjs.entry.js +3 -3
  51. package/dist/cjs/ic-navigation-group.cjs.entry.js.map +1 -1
  52. package/dist/cjs/ic-navigation-item.cjs.entry.js +12 -7
  53. package/dist/cjs/ic-navigation-item.cjs.entry.js.map +1 -1
  54. package/dist/cjs/ic-navigation-menu.cjs.entry.js +5 -5
  55. package/dist/cjs/ic-page-header.cjs.entry.js +7 -7
  56. package/dist/cjs/ic-pagination-item.cjs.entry.js +2 -2
  57. package/dist/cjs/ic-pagination.cjs.entry.js +5 -5
  58. package/dist/cjs/ic-popover-menu.cjs.entry.js +8 -7
  59. package/dist/cjs/ic-popover-menu.cjs.entry.js.map +1 -1
  60. package/dist/cjs/ic-radio-group.cjs.entry.js +5 -5
  61. package/dist/cjs/ic-radio-option.cjs.entry.js +6 -6
  62. package/dist/cjs/ic-radio-option.cjs.entry.js.map +1 -1
  63. package/dist/cjs/ic-search-bar.cjs.entry.js +112 -135
  64. package/dist/cjs/ic-search-bar.cjs.entry.js.map +1 -1
  65. package/dist/cjs/ic-section-container.cjs.entry.js +2 -2
  66. package/dist/cjs/ic-select.cjs.entry.js +47 -50
  67. package/dist/cjs/ic-select.cjs.entry.js.map +1 -1
  68. package/dist/cjs/ic-side-navigation.cjs.entry.js +6 -6
  69. package/dist/cjs/ic-side-navigation.cjs.entry.js.map +1 -1
  70. package/dist/cjs/ic-skeleton.cjs.entry.js +2 -2
  71. package/dist/cjs/ic-skip-link.cjs.entry.js +10 -3
  72. package/dist/cjs/ic-skip-link.cjs.entry.js.map +1 -1
  73. package/dist/cjs/ic-status-tag.cjs.entry.js +3 -3
  74. package/dist/cjs/ic-status-tag.cjs.entry.js.map +1 -1
  75. package/dist/cjs/ic-step.cjs.entry.js +15 -15
  76. package/dist/cjs/ic-step.cjs.entry.js.map +1 -1
  77. package/dist/cjs/ic-stepper.cjs.entry.js +3 -3
  78. package/dist/cjs/ic-switch.cjs.entry.js +6 -6
  79. package/dist/cjs/ic-switch.cjs.entry.js.map +1 -1
  80. package/dist/cjs/ic-tab-context.cjs.entry.js +1 -1
  81. package/dist/cjs/ic-tab-group.cjs.entry.js +3 -3
  82. package/dist/cjs/ic-tab-panel.cjs.entry.js +2 -2
  83. package/dist/cjs/ic-tab.cjs.entry.js +3 -3
  84. package/dist/cjs/ic-text-field.cjs.entry.js +32 -29
  85. package/dist/cjs/ic-text-field.cjs.entry.js.map +1 -1
  86. package/dist/cjs/ic-theme.cjs.entry.js +4 -2
  87. package/dist/cjs/ic-theme.cjs.entry.js.map +1 -1
  88. package/dist/cjs/ic-toast-region.cjs.entry.js +1 -1
  89. package/dist/cjs/ic-toast.cjs.entry.js +4 -4
  90. package/dist/cjs/ic-toggle-button-group.cjs.entry.js +3 -3
  91. package/dist/cjs/ic-toggle-button.cjs.entry.js +4 -4
  92. package/dist/cjs/ic-toggle-button.cjs.entry.js.map +1 -1
  93. package/dist/cjs/ic-top-navigation.cjs.entry.js +5 -5
  94. package/dist/cjs/ic-top-navigation.cjs.entry.js.map +1 -1
  95. package/dist/cjs/ic-typography.cjs.entry.js +4 -4
  96. package/dist/cjs/ic-typography.cjs.entry.js.map +1 -1
  97. package/dist/cjs/loader.cjs.js +1 -1
  98. package/dist/collection/components/ic-accordion/ic-accordion.css +3 -0
  99. package/dist/collection/components/ic-accordion-group/ic-accordion-group.css +1 -0
  100. package/dist/collection/components/ic-alert/ic-alert.css +3 -1
  101. package/dist/collection/components/ic-alert/ic-alert.js +85 -50
  102. package/dist/collection/components/ic-alert/ic-alert.js.map +1 -1
  103. package/dist/collection/components/ic-back-to-top/ic-back-to-top.js +3 -3
  104. package/dist/collection/components/ic-badge/ic-badge.css +1 -1
  105. package/dist/collection/components/ic-badge/ic-badge.js +39 -15
  106. package/dist/collection/components/ic-badge/ic-badge.js.map +1 -1
  107. package/dist/collection/components/ic-breadcrumb/ic-breadcrumb.js +40 -59
  108. package/dist/collection/components/ic-breadcrumb/ic-breadcrumb.js.map +1 -1
  109. package/dist/collection/components/ic-breadcrumb-group/ic-breadcrumb-group.js +65 -86
  110. package/dist/collection/components/ic-breadcrumb-group/ic-breadcrumb-group.js.map +1 -1
  111. package/dist/collection/components/ic-button/ic-button.css +123 -59
  112. package/dist/collection/components/ic-button/ic-button.js +141 -162
  113. package/dist/collection/components/ic-button/ic-button.js.map +1 -1
  114. package/dist/collection/components/ic-button/ic-button.stories.js +39 -54
  115. package/dist/collection/components/ic-card-vertical/ic-card-vertical.css +20 -4
  116. package/dist/collection/components/ic-card-vertical/ic-card-vertical.js +4 -4
  117. package/dist/collection/components/ic-checkbox/ic-checkbox.css +3 -1
  118. package/dist/collection/components/ic-checkbox/ic-checkbox.js +71 -73
  119. package/dist/collection/components/ic-checkbox/ic-checkbox.js.map +1 -1
  120. package/dist/collection/components/ic-checkbox-group/ic-checkbox-group.js +24 -25
  121. package/dist/collection/components/ic-checkbox-group/ic-checkbox-group.js.map +1 -1
  122. package/dist/collection/components/ic-chip/ic-chip.css +9 -0
  123. package/dist/collection/components/ic-chip/ic-chip.js +66 -72
  124. package/dist/collection/components/ic-chip/ic-chip.js.map +1 -1
  125. package/dist/collection/components/ic-chip/ic-chip.stories.js +2 -1
  126. package/dist/collection/components/ic-classification-banner/ic-classification-banner.js +2 -2
  127. package/dist/collection/components/ic-data-list/ic-data-list.js +2 -2
  128. package/dist/collection/components/ic-data-row/ic-data-row.js +2 -2
  129. package/dist/collection/components/ic-dialog/ic-dialog.css +2 -1
  130. package/dist/collection/components/ic-dialog/ic-dialog.js +1 -1
  131. package/dist/collection/components/ic-divider/ic-divider.css +7 -4
  132. package/dist/collection/components/ic-empty-state/ic-empty-state.js +2 -2
  133. package/dist/collection/components/ic-footer/ic-footer.js +3 -3
  134. package/dist/collection/components/ic-footer-link/ic-footer-link.js +2 -2
  135. package/dist/collection/components/ic-footer-link-group/ic-footer-link-group.css +0 -3
  136. package/dist/collection/components/ic-hero/ic-hero.js +4 -4
  137. package/dist/collection/components/ic-horizontal-scroll/ic-horizontal-scroll.js +5 -5
  138. package/dist/collection/components/ic-input-component-container/ic-input-component-container.js +3 -3
  139. package/dist/collection/components/ic-input-container/ic-input-container.js +2 -2
  140. package/dist/collection/components/ic-input-label/ic-input-label.js +4 -4
  141. package/dist/collection/components/ic-input-validation/ic-input-validation.js +3 -3
  142. package/dist/collection/components/ic-link/ic-link.js +23 -2
  143. package/dist/collection/components/ic-link/ic-link.js.map +1 -1
  144. package/dist/collection/components/ic-link/ic-link.stories.js +28 -5
  145. package/dist/collection/components/ic-loading-indicator/ic-loading-indicator.js +3 -3
  146. package/dist/collection/components/ic-menu/ic-menu.js +3 -3
  147. package/dist/collection/components/ic-menu-group/ic-menu-group.js +1 -1
  148. package/dist/collection/components/ic-menu-item/ic-menu-item.css +2 -5
  149. package/dist/collection/components/ic-menu-item/ic-menu-item.js +3 -3
  150. package/dist/collection/components/ic-menu-item/ic-menu-item.js.map +1 -1
  151. package/dist/collection/components/ic-navigation-button/ic-navigation-button.js +2 -2
  152. package/dist/collection/components/ic-navigation-group/ic-navigation-group.css +0 -4
  153. package/dist/collection/components/ic-navigation-group/ic-navigation-group.js +1 -1
  154. package/dist/collection/components/ic-navigation-item/ic-navigation-item.css +20 -1
  155. package/dist/collection/components/ic-navigation-item/ic-navigation-item.js +11 -6
  156. package/dist/collection/components/ic-navigation-item/ic-navigation-item.js.map +1 -1
  157. package/dist/collection/components/ic-navigation-menu/ic-navigation-menu.js +4 -4
  158. package/dist/collection/components/ic-page-header/ic-page-header.js +6 -6
  159. package/dist/collection/components/ic-pagination/ic-pagination.js +4 -4
  160. package/dist/collection/components/ic-pagination-item/ic-pagination-item.js +1 -1
  161. package/dist/collection/components/ic-popover-menu/ic-popover-menu.css +0 -5
  162. package/dist/collection/components/ic-popover-menu/ic-popover-menu.js +6 -5
  163. package/dist/collection/components/ic-popover-menu/ic-popover-menu.js.map +1 -1
  164. package/dist/collection/components/ic-radio-group/ic-radio-group.js +4 -4
  165. package/dist/collection/components/ic-radio-option/ic-radio-option.css +2 -1
  166. package/dist/collection/components/ic-radio-option/ic-radio-option.js +4 -4
  167. package/dist/collection/components/ic-search-bar/ic-search-bar.js +169 -192
  168. package/dist/collection/components/ic-search-bar/ic-search-bar.js.map +1 -1
  169. package/dist/collection/components/ic-section-container/ic-section-container.js +2 -2
  170. package/dist/collection/components/ic-select/ic-select.js +46 -49
  171. package/dist/collection/components/ic-select/ic-select.js.map +1 -1
  172. package/dist/collection/components/ic-side-navigation/ic-side-navigation.css +3 -2
  173. package/dist/collection/components/ic-side-navigation/ic-side-navigation.js +4 -4
  174. package/dist/collection/components/ic-side-navigation/ic-side-navigation.js.map +1 -1
  175. package/dist/collection/components/ic-skeleton/ic-skeleton.js +2 -2
  176. package/dist/collection/components/ic-skip-link/ic-skip-link.js +31 -3
  177. package/dist/collection/components/ic-skip-link/ic-skip-link.js.map +1 -1
  178. package/dist/collection/components/ic-status-tag/ic-status-tag.css +6 -0
  179. package/dist/collection/components/ic-status-tag/ic-status-tag.js +2 -2
  180. package/dist/collection/components/ic-step/ic-step.css +0 -3
  181. package/dist/collection/components/ic-step/ic-step.js +13 -13
  182. package/dist/collection/components/ic-stepper/ic-stepper.js +2 -2
  183. package/dist/collection/components/ic-switch/ic-switch.js +5 -5
  184. package/dist/collection/components/ic-switch/ic-switch.js.map +1 -1
  185. package/dist/collection/components/ic-tab/ic-tab.js +2 -2
  186. package/dist/collection/components/ic-tab-context/ic-tab-context.js +1 -1
  187. package/dist/collection/components/ic-tab-group/ic-tab-group.js +2 -2
  188. package/dist/collection/components/ic-tab-panel/ic-tab-panel.js +2 -2
  189. package/dist/collection/components/ic-text-field/ic-text-field.js +112 -95
  190. package/dist/collection/components/ic-text-field/ic-text-field.js.map +1 -1
  191. package/dist/collection/components/ic-theme/ic-theme.js +31 -3
  192. package/dist/collection/components/ic-theme/ic-theme.js.map +1 -1
  193. package/dist/collection/components/ic-toast/ic-toast.js +3 -3
  194. package/dist/collection/components/ic-toast-region/ic-toast-region.js +1 -1
  195. package/dist/collection/components/ic-toggle-button/ic-toggle-button.css +6 -8
  196. package/dist/collection/components/ic-toggle-button/ic-toggle-button.js +2 -2
  197. package/dist/collection/components/ic-toggle-button-group/ic-toggle-button-group.js +2 -2
  198. package/dist/collection/components/ic-tooltip/ic-tooltip.js +32 -2
  199. package/dist/collection/components/ic-tooltip/ic-tooltip.js.map +1 -1
  200. package/dist/collection/components/ic-top-navigation/ic-top-navigation.css +3 -1
  201. package/dist/collection/components/ic-top-navigation/ic-top-navigation.js +4 -4
  202. package/dist/collection/components/ic-top-navigation/ic-top-navigation.js.map +1 -1
  203. package/dist/collection/components/ic-typography/ic-typography.css +2 -2
  204. package/dist/collection/components/ic-typography/ic-typography.js +2 -2
  205. package/dist/collection/utils/helpers.js +35 -72
  206. package/dist/collection/utils/helpers.js.map +1 -1
  207. package/dist/collection/utils/types.js.map +1 -1
  208. package/dist/components/helpers.js +36 -73
  209. package/dist/components/helpers.js.map +1 -1
  210. package/dist/components/ic-accordion-group.js.map +1 -1
  211. package/dist/components/ic-accordion.js.map +1 -1
  212. package/dist/components/ic-alert.js +66 -37
  213. package/dist/components/ic-alert.js.map +1 -1
  214. package/dist/components/ic-back-to-top.js +3 -3
  215. package/dist/components/ic-badge.js +40 -16
  216. package/dist/components/ic-badge.js.map +1 -1
  217. package/dist/components/ic-breadcrumb-group.js +57 -78
  218. package/dist/components/ic-breadcrumb-group.js.map +1 -1
  219. package/dist/components/ic-breadcrumb2.js +32 -51
  220. package/dist/components/ic-breadcrumb2.js.map +1 -1
  221. package/dist/components/ic-button2.js +105 -126
  222. package/dist/components/ic-button2.js.map +1 -1
  223. package/dist/components/ic-card-vertical.js +5 -5
  224. package/dist/components/ic-card-vertical.js.map +1 -1
  225. package/dist/components/ic-checkbox-group.js +9 -10
  226. package/dist/components/ic-checkbox-group.js.map +1 -1
  227. package/dist/components/ic-checkbox.js +37 -36
  228. package/dist/components/ic-checkbox.js.map +1 -1
  229. package/dist/components/ic-chip.js +28 -40
  230. package/dist/components/ic-chip.js.map +1 -1
  231. package/dist/components/ic-classification-banner.js +2 -2
  232. package/dist/components/ic-data-list.js +2 -2
  233. package/dist/components/ic-data-row.js +3 -3
  234. package/dist/components/ic-dialog.js +2 -2
  235. package/dist/components/ic-dialog.js.map +1 -1
  236. package/dist/components/ic-divider2.js +2 -2
  237. package/dist/components/ic-divider2.js.map +1 -1
  238. package/dist/components/ic-empty-state.js +2 -2
  239. package/dist/components/ic-footer-link-group.js +1 -1
  240. package/dist/components/ic-footer-link-group.js.map +1 -1
  241. package/dist/components/ic-footer-link.js +2 -2
  242. package/dist/components/ic-footer.js +4 -4
  243. package/dist/components/ic-hero.js +5 -5
  244. package/dist/components/ic-horizontal-scroll2.js +6 -6
  245. package/dist/components/ic-input-component-container2.js +4 -4
  246. package/dist/components/ic-input-container2.js +2 -2
  247. package/dist/components/ic-input-label2.js +5 -5
  248. package/dist/components/ic-input-validation2.js +4 -4
  249. package/dist/components/ic-link2.js +23 -3
  250. package/dist/components/ic-link2.js.map +1 -1
  251. package/dist/components/ic-loading-indicator2.js +3 -3
  252. package/dist/components/ic-menu-group.js +1 -1
  253. package/dist/components/ic-menu-item2.js +4 -4
  254. package/dist/components/ic-menu-item2.js.map +1 -1
  255. package/dist/components/ic-menu2.js +4 -4
  256. package/dist/components/ic-navigation-button.js +2 -2
  257. package/dist/components/ic-navigation-group.js +3 -3
  258. package/dist/components/ic-navigation-group.js.map +1 -1
  259. package/dist/components/ic-navigation-item.js +12 -7
  260. package/dist/components/ic-navigation-item.js.map +1 -1
  261. package/dist/components/ic-navigation-menu2.js +5 -5
  262. package/dist/components/ic-page-header.js +6 -6
  263. package/dist/components/ic-pagination-item2.js +2 -2
  264. package/dist/components/ic-pagination.js +4 -4
  265. package/dist/components/ic-popover-menu.js +7 -6
  266. package/dist/components/ic-popover-menu.js.map +1 -1
  267. package/dist/components/ic-radio-group.js +5 -5
  268. package/dist/components/ic-radio-option.js +6 -6
  269. package/dist/components/ic-radio-option.js.map +1 -1
  270. package/dist/components/ic-search-bar.js +112 -135
  271. package/dist/components/ic-search-bar.js.map +1 -1
  272. package/dist/components/ic-section-container2.js +2 -2
  273. package/dist/components/ic-select.js +47 -50
  274. package/dist/components/ic-select.js.map +1 -1
  275. package/dist/components/ic-side-navigation.js +6 -6
  276. package/dist/components/ic-side-navigation.js.map +1 -1
  277. package/dist/components/ic-skeleton.js +2 -2
  278. package/dist/components/ic-skip-link.js +12 -4
  279. package/dist/components/ic-skip-link.js.map +1 -1
  280. package/dist/components/ic-status-tag.js +2 -2
  281. package/dist/components/ic-status-tag.js.map +1 -1
  282. package/dist/components/ic-step.js +14 -14
  283. package/dist/components/ic-step.js.map +1 -1
  284. package/dist/components/ic-stepper.js +3 -3
  285. package/dist/components/ic-switch.js +6 -6
  286. package/dist/components/ic-switch.js.map +1 -1
  287. package/dist/components/ic-tab-context.js +1 -1
  288. package/dist/components/ic-tab-group.js +2 -2
  289. package/dist/components/ic-tab-panel.js +2 -2
  290. package/dist/components/ic-tab.js +2 -2
  291. package/dist/components/ic-text-field.js +32 -29
  292. package/dist/components/ic-text-field.js.map +1 -1
  293. package/dist/components/ic-theme.js +3 -1
  294. package/dist/components/ic-theme.js.map +1 -1
  295. package/dist/components/ic-toast-region.js +1 -1
  296. package/dist/components/ic-toast.js +4 -4
  297. package/dist/components/ic-toggle-button-group.js +2 -2
  298. package/dist/components/ic-toggle-button.js +3 -3
  299. package/dist/components/ic-toggle-button.js.map +1 -1
  300. package/dist/components/ic-tooltip2.js +30 -2
  301. package/dist/components/ic-tooltip2.js.map +1 -1
  302. package/dist/components/ic-top-navigation.js +5 -5
  303. package/dist/components/ic-top-navigation.js.map +1 -1
  304. package/dist/components/ic-typography2.js +3 -3
  305. package/dist/components/ic-typography2.js.map +1 -1
  306. package/dist/core/core.css +160 -110
  307. package/dist/core/core.esm.js +1 -1
  308. package/dist/core/core.esm.js.map +1 -1
  309. package/dist/core/p-00bc353b.entry.js +2 -0
  310. package/dist/core/p-00bc353b.entry.js.map +1 -0
  311. package/dist/core/{p-45595f98.entry.js → p-0a436c47.entry.js} +2 -2
  312. package/dist/core/p-0a436c47.entry.js.map +1 -0
  313. package/dist/core/{p-a55e7988.entry.js → p-10e1e227.entry.js} +2 -2
  314. package/dist/core/p-1440847f.entry.js +2 -0
  315. package/dist/core/p-1440847f.entry.js.map +1 -0
  316. package/dist/core/{p-729745d3.entry.js → p-15b7adaf.entry.js} +2 -2
  317. package/dist/core/p-16f55230.entry.js +2 -0
  318. package/dist/core/p-16f55230.entry.js.map +1 -0
  319. package/dist/core/{p-5c349c9d.entry.js → p-1838d1e9.entry.js} +2 -2
  320. package/dist/core/p-1838d1e9.entry.js.map +1 -0
  321. package/dist/core/{p-972671ea.entry.js → p-18714198.entry.js} +2 -2
  322. package/dist/core/{p-a20a7cd3.entry.js → p-1b2690b4.entry.js} +2 -2
  323. package/dist/core/p-1b2690b4.entry.js.map +1 -0
  324. package/dist/core/{p-37df68fe.entry.js → p-1be17f22.entry.js} +2 -2
  325. package/dist/core/p-206c2a26.entry.js +2 -0
  326. package/dist/core/p-206c2a26.entry.js.map +1 -0
  327. package/dist/core/{p-17cf7b50.entry.js → p-267a19d4.entry.js} +2 -2
  328. package/dist/core/p-26dfc4db.entry.js +2 -0
  329. package/dist/core/p-26dfc4db.entry.js.map +1 -0
  330. package/dist/core/p-2c17cc67.entry.js +2 -0
  331. package/dist/core/p-2c17cc67.entry.js.map +1 -0
  332. package/dist/core/{p-8b268274.entry.js → p-2c371198.entry.js} +2 -2
  333. package/dist/core/p-2e44cf53.entry.js +2 -0
  334. package/dist/core/p-2e44cf53.entry.js.map +1 -0
  335. package/dist/core/p-42a7d0b6.entry.js +2 -0
  336. package/dist/core/{p-fa02a267.entry.js → p-4b6818d9.entry.js} +2 -2
  337. package/dist/core/p-513628ef.entry.js +2 -0
  338. package/dist/core/p-513628ef.entry.js.map +1 -0
  339. package/dist/core/{p-1ac08e6d.entry.js → p-628c32b8.entry.js} +2 -2
  340. package/dist/core/p-70a6cff1.entry.js +2 -0
  341. package/dist/core/p-70a6cff1.entry.js.map +1 -0
  342. package/dist/core/{p-8856dff4.entry.js → p-72c117b6.entry.js} +2 -2
  343. package/dist/core/p-730d2f6e.entry.js +2 -0
  344. package/dist/core/p-730d2f6e.entry.js.map +1 -0
  345. package/dist/core/{p-0d016565.entry.js → p-788c96ac.entry.js} +2 -2
  346. package/dist/core/{p-78e7a859.entry.js → p-7fb79e87.entry.js} +2 -2
  347. package/dist/core/p-8242c24f.js +2 -0
  348. package/dist/core/p-8242c24f.js.map +1 -0
  349. package/dist/core/{p-7e79bd0e.entry.js → p-83764268.entry.js} +2 -2
  350. package/dist/core/p-8b5022bc.entry.js +2 -0
  351. package/dist/core/p-8b5022bc.entry.js.map +1 -0
  352. package/dist/core/{p-f34efc17.entry.js → p-8c4f7c63.entry.js} +2 -2
  353. package/dist/core/{p-1f455336.entry.js → p-910f5f14.entry.js} +2 -2
  354. package/dist/core/{p-10cd26dc.entry.js → p-9479f272.entry.js} +2 -2
  355. package/dist/core/{p-10cd26dc.entry.js.map → p-9479f272.entry.js.map} +1 -1
  356. package/dist/core/p-9c47521d.entry.js +2 -0
  357. package/dist/core/p-9c47521d.entry.js.map +1 -0
  358. package/dist/core/{p-110486f0.entry.js → p-9ca147f3.entry.js} +2 -2
  359. package/dist/core/{p-d9aec0dd.entry.js → p-9cfc2bac.entry.js} +2 -2
  360. package/dist/core/{p-74600ed8.entry.js → p-a0161990.entry.js} +2 -2
  361. package/dist/core/p-a17499ff.entry.js +2 -0
  362. package/dist/core/p-a17499ff.entry.js.map +1 -0
  363. package/dist/core/{p-4f2a1950.entry.js → p-a4f9b5bf.entry.js} +2 -2
  364. package/dist/core/{p-c9726fbd.entry.js → p-aad10013.entry.js} +2 -2
  365. package/dist/core/p-aad10013.entry.js.map +1 -0
  366. package/dist/core/{p-44e32417.entry.js → p-b371a498.entry.js} +2 -2
  367. package/dist/core/{p-44e32417.entry.js.map → p-b371a498.entry.js.map} +1 -1
  368. package/dist/core/p-b7568944.entry.js +2 -0
  369. package/dist/core/p-b7568944.entry.js.map +1 -0
  370. package/dist/core/p-b8da5c07.entry.js +2 -0
  371. package/dist/core/p-b8da5c07.entry.js.map +1 -0
  372. package/dist/core/{p-701696aa.entry.js → p-b9459ba2.entry.js} +2 -2
  373. package/dist/core/{p-2537f33e.entry.js → p-ba600947.entry.js} +2 -2
  374. package/dist/core/p-ba600947.entry.js.map +1 -0
  375. package/dist/core/{p-50f4d151.entry.js → p-bc2ca778.entry.js} +2 -2
  376. package/dist/core/{p-69e4daec.entry.js → p-bdc72446.entry.js} +2 -2
  377. package/dist/core/p-c45023b7.entry.js +2 -0
  378. package/dist/core/p-c45023b7.entry.js.map +1 -0
  379. package/dist/core/p-c4663e1a.entry.js +2 -0
  380. package/dist/core/p-c4663e1a.entry.js.map +1 -0
  381. package/dist/core/{p-a103068b.entry.js → p-c8cf1ad5.entry.js} +2 -2
  382. package/dist/core/p-c9a4fe37.entry.js +2 -0
  383. package/dist/core/p-c9a4fe37.entry.js.map +1 -0
  384. package/dist/core/p-cdf56a5d.entry.js +2 -0
  385. package/dist/core/p-cdf56a5d.entry.js.map +1 -0
  386. package/dist/core/{p-a71055c9.entry.js → p-d45d66c0.entry.js} +2 -2
  387. package/dist/core/p-d6c50565.entry.js +2 -0
  388. package/dist/core/p-d6c50565.entry.js.map +1 -0
  389. package/dist/core/{p-85734ebf.entry.js → p-d975bf2f.entry.js} +2 -2
  390. package/dist/core/p-d975bf2f.entry.js.map +1 -0
  391. package/dist/core/p-dede4974.entry.js +2 -0
  392. package/dist/core/p-dede4974.entry.js.map +1 -0
  393. package/dist/core/{p-071f4748.entry.js → p-df88ff5b.entry.js} +2 -2
  394. package/dist/core/p-e86a6d2d.entry.js +2 -0
  395. package/dist/core/{p-20c4d90b.entry.js → p-ebab7a9e.entry.js} +2 -2
  396. package/dist/core/p-eeab3a2e.entry.js +2 -0
  397. package/dist/core/p-eeab3a2e.entry.js.map +1 -0
  398. package/dist/core/{p-264ce7a0.entry.js → p-ef36181d.entry.js} +2 -2
  399. package/dist/core/p-ef36181d.entry.js.map +1 -0
  400. package/dist/core/p-f0388d68.entry.js +2 -0
  401. package/dist/core/p-f0388d68.entry.js.map +1 -0
  402. package/dist/core/{p-2b1a331b.entry.js → p-fbf57f0a.entry.js} +2 -2
  403. package/dist/esm/core.js +1 -1
  404. package/dist/esm/{helpers-dd035d0d.js → helpers-f2ffaa7c.js} +37 -74
  405. package/dist/esm/helpers-f2ffaa7c.js.map +1 -0
  406. package/dist/esm/ic-accordion-group.entry.js +1 -1
  407. package/dist/esm/ic-accordion-group.entry.js.map +1 -1
  408. package/dist/esm/ic-accordion.entry.js +1 -1
  409. package/dist/esm/ic-accordion.entry.js.map +1 -1
  410. package/dist/esm/ic-alert.entry.js +63 -36
  411. package/dist/esm/ic-alert.entry.js.map +1 -1
  412. package/dist/esm/ic-back-to-top.entry.js +4 -4
  413. package/dist/esm/ic-badge.entry.js +41 -17
  414. package/dist/esm/ic-badge.entry.js.map +1 -1
  415. package/dist/esm/ic-breadcrumb-group.entry.js +56 -76
  416. package/dist/esm/ic-breadcrumb-group.entry.js.map +1 -1
  417. package/dist/esm/ic-breadcrumb.entry.js +32 -51
  418. package/dist/esm/ic-breadcrumb.entry.js.map +1 -1
  419. package/dist/esm/ic-button_3.entry.js +136 -132
  420. package/dist/esm/ic-button_3.entry.js.map +1 -1
  421. package/dist/esm/ic-card-vertical.entry.js +6 -6
  422. package/dist/esm/ic-card-vertical.entry.js.map +1 -1
  423. package/dist/esm/ic-checkbox-group.entry.js +9 -10
  424. package/dist/esm/ic-checkbox-group.entry.js.map +1 -1
  425. package/dist/esm/ic-checkbox.entry.js +35 -34
  426. package/dist/esm/ic-checkbox.entry.js.map +1 -1
  427. package/dist/esm/ic-chip.entry.js +26 -38
  428. package/dist/esm/ic-chip.entry.js.map +1 -1
  429. package/dist/esm/ic-classification-banner.entry.js +2 -2
  430. package/dist/esm/ic-data-list.entry.js +2 -2
  431. package/dist/esm/ic-data-row.entry.js +3 -3
  432. package/dist/esm/ic-dialog.entry.js +3 -3
  433. package/dist/esm/ic-dialog.entry.js.map +1 -1
  434. package/dist/esm/ic-divider.entry.js +2 -2
  435. package/dist/esm/ic-divider.entry.js.map +1 -1
  436. package/dist/esm/ic-empty-state.entry.js +3 -3
  437. package/dist/esm/ic-footer-link-group.entry.js +2 -2
  438. package/dist/esm/ic-footer-link-group.entry.js.map +1 -1
  439. package/dist/esm/ic-footer-link.entry.js +3 -3
  440. package/dist/esm/ic-footer.entry.js +4 -4
  441. package/dist/esm/ic-hero.entry.js +5 -5
  442. package/dist/esm/ic-horizontal-scroll.entry.js +6 -6
  443. package/dist/esm/ic-input-component-container_3.entry.js +9 -9
  444. package/dist/esm/ic-input-label_2.entry.js +8 -8
  445. package/dist/esm/ic-link.entry.js +21 -3
  446. package/dist/esm/ic-link.entry.js.map +1 -1
  447. package/dist/esm/ic-menu-group.entry.js +2 -2
  448. package/dist/esm/ic-menu-item.entry.js +5 -5
  449. package/dist/esm/ic-menu-item.entry.js.map +1 -1
  450. package/dist/esm/ic-navigation-button.entry.js +3 -3
  451. package/dist/esm/ic-navigation-group.entry.js +3 -3
  452. package/dist/esm/ic-navigation-group.entry.js.map +1 -1
  453. package/dist/esm/ic-navigation-item.entry.js +12 -7
  454. package/dist/esm/ic-navigation-item.entry.js.map +1 -1
  455. package/dist/esm/ic-navigation-menu.entry.js +5 -5
  456. package/dist/esm/ic-page-header.entry.js +7 -7
  457. package/dist/esm/ic-pagination-item.entry.js +2 -2
  458. package/dist/esm/ic-pagination.entry.js +5 -5
  459. package/dist/esm/ic-popover-menu.entry.js +8 -7
  460. package/dist/esm/ic-popover-menu.entry.js.map +1 -1
  461. package/dist/esm/ic-radio-group.entry.js +5 -5
  462. package/dist/esm/ic-radio-option.entry.js +6 -6
  463. package/dist/esm/ic-radio-option.entry.js.map +1 -1
  464. package/dist/esm/ic-search-bar.entry.js +112 -135
  465. package/dist/esm/ic-search-bar.entry.js.map +1 -1
  466. package/dist/esm/ic-section-container.entry.js +2 -2
  467. package/dist/esm/ic-select.entry.js +47 -50
  468. package/dist/esm/ic-select.entry.js.map +1 -1
  469. package/dist/esm/ic-side-navigation.entry.js +6 -6
  470. package/dist/esm/ic-side-navigation.entry.js.map +1 -1
  471. package/dist/esm/ic-skeleton.entry.js +2 -2
  472. package/dist/esm/ic-skip-link.entry.js +10 -3
  473. package/dist/esm/ic-skip-link.entry.js.map +1 -1
  474. package/dist/esm/ic-status-tag.entry.js +3 -3
  475. package/dist/esm/ic-status-tag.entry.js.map +1 -1
  476. package/dist/esm/ic-step.entry.js +15 -15
  477. package/dist/esm/ic-step.entry.js.map +1 -1
  478. package/dist/esm/ic-stepper.entry.js +3 -3
  479. package/dist/esm/ic-switch.entry.js +6 -6
  480. package/dist/esm/ic-switch.entry.js.map +1 -1
  481. package/dist/esm/ic-tab-context.entry.js +1 -1
  482. package/dist/esm/ic-tab-group.entry.js +3 -3
  483. package/dist/esm/ic-tab-panel.entry.js +2 -2
  484. package/dist/esm/ic-tab.entry.js +3 -3
  485. package/dist/esm/ic-text-field.entry.js +32 -29
  486. package/dist/esm/ic-text-field.entry.js.map +1 -1
  487. package/dist/esm/ic-theme.entry.js +4 -2
  488. package/dist/esm/ic-theme.entry.js.map +1 -1
  489. package/dist/esm/ic-toast-region.entry.js +1 -1
  490. package/dist/esm/ic-toast.entry.js +4 -4
  491. package/dist/esm/ic-toggle-button-group.entry.js +3 -3
  492. package/dist/esm/ic-toggle-button.entry.js +4 -4
  493. package/dist/esm/ic-toggle-button.entry.js.map +1 -1
  494. package/dist/esm/ic-top-navigation.entry.js +5 -5
  495. package/dist/esm/ic-top-navigation.entry.js.map +1 -1
  496. package/dist/esm/ic-typography.entry.js +4 -4
  497. package/dist/esm/ic-typography.entry.js.map +1 -1
  498. package/dist/esm/loader.js +1 -1
  499. package/dist/types/components/ic-alert/ic-alert.d.ts +17 -9
  500. package/dist/types/components/ic-badge/ic-badge.d.ts +4 -0
  501. package/dist/types/components/ic-breadcrumb/ic-breadcrumb.d.ts +4 -6
  502. package/dist/types/components/ic-breadcrumb-group/ic-breadcrumb-group.d.ts +9 -15
  503. package/dist/types/components/ic-button/ic-button.d.ts +29 -22
  504. package/dist/types/components/ic-checkbox/ic-checkbox.d.ts +14 -13
  505. package/dist/types/components/ic-checkbox-group/ic-checkbox-group.d.ts +8 -9
  506. package/dist/types/components/ic-chip/ic-chip.d.ts +13 -15
  507. package/dist/types/components/ic-link/ic-link.d.ts +2 -0
  508. package/dist/types/components/ic-search-bar/ic-search-bar.d.ts +38 -40
  509. package/dist/types/components/ic-select/ic-select.d.ts +1 -0
  510. package/dist/types/components/ic-skip-link/ic-skip-link.d.ts +5 -0
  511. package/dist/types/components/ic-text-field/ic-text-field.d.ts +37 -32
  512. package/dist/types/components/ic-theme/ic-theme.d.ts +6 -2
  513. package/dist/types/components/ic-tooltip/ic-tooltip.d.ts +3 -0
  514. package/dist/types/components.d.ts +147 -133
  515. package/dist/types/utils/helpers.d.ts +13 -9
  516. package/dist/types/utils/types.d.ts +1 -0
  517. package/hydrate/index.js +809 -832
  518. package/hydrate/index.mjs +809 -832
  519. package/package.json +3 -3
  520. package/vscode-data.json +167 -3
  521. package/dist/cjs/helpers-a0a128bd.js.map +0 -1
  522. package/dist/collection/components/ic-breadcrumb/ic-breadcrumb.types.js +0 -2
  523. package/dist/collection/components/ic-breadcrumb/ic-breadcrumb.types.js.map +0 -1
  524. package/dist/core/p-06d97789.entry.js +0 -2
  525. package/dist/core/p-06d97789.entry.js.map +0 -1
  526. package/dist/core/p-09070f61.entry.js +0 -2
  527. package/dist/core/p-0c0ac69d.entry.js +0 -2
  528. package/dist/core/p-0c0ac69d.entry.js.map +0 -1
  529. package/dist/core/p-0e96d4d8.entry.js +0 -2
  530. package/dist/core/p-0e96d4d8.entry.js.map +0 -1
  531. package/dist/core/p-116ad73d.entry.js +0 -2
  532. package/dist/core/p-116ad73d.entry.js.map +0 -1
  533. package/dist/core/p-1171a945.entry.js +0 -2
  534. package/dist/core/p-1171a945.entry.js.map +0 -1
  535. package/dist/core/p-2537f33e.entry.js.map +0 -1
  536. package/dist/core/p-264ce7a0.entry.js.map +0 -1
  537. package/dist/core/p-28656111.entry.js +0 -2
  538. package/dist/core/p-28656111.entry.js.map +0 -1
  539. package/dist/core/p-33243fff.entry.js +0 -2
  540. package/dist/core/p-33243fff.entry.js.map +0 -1
  541. package/dist/core/p-45595f98.entry.js.map +0 -1
  542. package/dist/core/p-49768069.entry.js +0 -2
  543. package/dist/core/p-49768069.entry.js.map +0 -1
  544. package/dist/core/p-4c68494c.entry.js +0 -2
  545. package/dist/core/p-4c68494c.entry.js.map +0 -1
  546. package/dist/core/p-55a37101.entry.js +0 -2
  547. package/dist/core/p-55a37101.entry.js.map +0 -1
  548. package/dist/core/p-5c349c9d.entry.js.map +0 -1
  549. package/dist/core/p-5e1fd097.entry.js +0 -2
  550. package/dist/core/p-5e1fd097.entry.js.map +0 -1
  551. package/dist/core/p-73fc198f.entry.js +0 -2
  552. package/dist/core/p-73fc198f.entry.js.map +0 -1
  553. package/dist/core/p-7eaf8da8.entry.js +0 -2
  554. package/dist/core/p-811d447b.entry.js +0 -2
  555. package/dist/core/p-811d447b.entry.js.map +0 -1
  556. package/dist/core/p-85734ebf.entry.js.map +0 -1
  557. package/dist/core/p-85b7d931.entry.js +0 -2
  558. package/dist/core/p-85b7d931.entry.js.map +0 -1
  559. package/dist/core/p-98328cb9.entry.js +0 -2
  560. package/dist/core/p-98328cb9.entry.js.map +0 -1
  561. package/dist/core/p-a20a7cd3.entry.js.map +0 -1
  562. package/dist/core/p-a22658fb.entry.js +0 -2
  563. package/dist/core/p-a22658fb.entry.js.map +0 -1
  564. package/dist/core/p-a794b724.entry.js +0 -2
  565. package/dist/core/p-a794b724.entry.js.map +0 -1
  566. package/dist/core/p-b21b4fea.entry.js +0 -2
  567. package/dist/core/p-b21b4fea.entry.js.map +0 -1
  568. package/dist/core/p-b953b22f.entry.js +0 -2
  569. package/dist/core/p-b953b22f.entry.js.map +0 -1
  570. package/dist/core/p-c9726fbd.entry.js.map +0 -1
  571. package/dist/core/p-d981598e.entry.js +0 -2
  572. package/dist/core/p-d981598e.entry.js.map +0 -1
  573. package/dist/core/p-ed8957da.js +0 -2
  574. package/dist/core/p-ed8957da.js.map +0 -1
  575. package/dist/core/p-f3315216.entry.js +0 -2
  576. package/dist/core/p-f3315216.entry.js.map +0 -1
  577. package/dist/core/p-f43f411a.entry.js +0 -2
  578. package/dist/core/p-f43f411a.entry.js.map +0 -1
  579. package/dist/core/p-ff995eb8.entry.js +0 -2
  580. package/dist/core/p-ff995eb8.entry.js.map +0 -1
  581. package/dist/esm/helpers-dd035d0d.js.map +0 -1
  582. package/dist/types/components/ic-breadcrumb/ic-breadcrumb.types.d.ts +0 -1
  583. /package/dist/core/{p-a55e7988.entry.js.map → p-10e1e227.entry.js.map} +0 -0
  584. /package/dist/core/{p-729745d3.entry.js.map → p-15b7adaf.entry.js.map} +0 -0
  585. /package/dist/core/{p-972671ea.entry.js.map → p-18714198.entry.js.map} +0 -0
  586. /package/dist/core/{p-37df68fe.entry.js.map → p-1be17f22.entry.js.map} +0 -0
  587. /package/dist/core/{p-17cf7b50.entry.js.map → p-267a19d4.entry.js.map} +0 -0
  588. /package/dist/core/{p-8b268274.entry.js.map → p-2c371198.entry.js.map} +0 -0
  589. /package/dist/core/{p-09070f61.entry.js.map → p-42a7d0b6.entry.js.map} +0 -0
  590. /package/dist/core/{p-fa02a267.entry.js.map → p-4b6818d9.entry.js.map} +0 -0
  591. /package/dist/core/{p-1ac08e6d.entry.js.map → p-628c32b8.entry.js.map} +0 -0
  592. /package/dist/core/{p-8856dff4.entry.js.map → p-72c117b6.entry.js.map} +0 -0
  593. /package/dist/core/{p-0d016565.entry.js.map → p-788c96ac.entry.js.map} +0 -0
  594. /package/dist/core/{p-78e7a859.entry.js.map → p-7fb79e87.entry.js.map} +0 -0
  595. /package/dist/core/{p-7e79bd0e.entry.js.map → p-83764268.entry.js.map} +0 -0
  596. /package/dist/core/{p-f34efc17.entry.js.map → p-8c4f7c63.entry.js.map} +0 -0
  597. /package/dist/core/{p-1f455336.entry.js.map → p-910f5f14.entry.js.map} +0 -0
  598. /package/dist/core/{p-110486f0.entry.js.map → p-9ca147f3.entry.js.map} +0 -0
  599. /package/dist/core/{p-d9aec0dd.entry.js.map → p-9cfc2bac.entry.js.map} +0 -0
  600. /package/dist/core/{p-74600ed8.entry.js.map → p-a0161990.entry.js.map} +0 -0
  601. /package/dist/core/{p-4f2a1950.entry.js.map → p-a4f9b5bf.entry.js.map} +0 -0
  602. /package/dist/core/{p-701696aa.entry.js.map → p-b9459ba2.entry.js.map} +0 -0
  603. /package/dist/core/{p-50f4d151.entry.js.map → p-bc2ca778.entry.js.map} +0 -0
  604. /package/dist/core/{p-69e4daec.entry.js.map → p-bdc72446.entry.js.map} +0 -0
  605. /package/dist/core/{p-a103068b.entry.js.map → p-c8cf1ad5.entry.js.map} +0 -0
  606. /package/dist/core/{p-a71055c9.entry.js.map → p-d45d66c0.entry.js.map} +0 -0
  607. /package/dist/core/{p-071f4748.entry.js.map → p-df88ff5b.entry.js.map} +0 -0
  608. /package/dist/core/{p-7eaf8da8.entry.js.map → p-e86a6d2d.entry.js.map} +0 -0
  609. /package/dist/core/{p-20c4d90b.entry.js.map → p-ebab7a9e.entry.js.map} +0 -0
  610. /package/dist/core/{p-2b1a331b.entry.js.map → p-fbf57f0a.entry.js.map} +0 -0
@@ -1 +0,0 @@
1
- {"version":3,"names":["icMenuItemCss","IcMenuItemStyle0","MenuItem","constructor","hostRef","this","checked","disabled","variant","handleClick","e","isPropDefined","submenuTriggerFor","triggerPopoverMenuInstance","emit","preventDefault","icToggleChecked","handleMenuItemClick","el","getMenuItemAriaLabel","ariaLabel","label","description","keyboardShortcutLabel","classList","contains","parentEl","parentElement","tagName","watchDisabledHandler","removeDisabledFalse","componentWillLoad","componentDidLoad","onComponentRequiredPropUndefined","prop","propName","handleHostClick","stopImmediatePropagation","render","MenuItemInformation","h","class","Host","role","undefined","fullWidth","onClick","href","hreflang","target","rel","referrerpolicy","isSlotUsed","name","innerHTML","Check","Chevron"],"sources":["src/components/ic-menu-item/ic-menu-item.css?tag=ic-menu-item&encapsulation=shadow","src/components/ic-menu-item/ic-menu-item.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\nli {\n list-style: none;\n padding: 0;\n}\n\n:host ::part(button) {\n color: var(--ic-popover-menu-item-check);\n --ic-typography-color: var(--ic-popover-menu-item-check);\n padding: calc(var(--ic-space-xxxs) / 2);\n display: flex;\n align-items: flex-start;\n gap: var(--ic-space-xs);\n border-radius: 0;\n min-height: 2.5rem;\n height: auto;\n}\n\n.focus-border {\n display: flex;\n align-items: flex-start;\n gap: var(--ic-space-xs);\n border-radius: var(--ic-border-radius);\n margin: calc(var(--ic-space-xxxs) / 2);\n padding: var(--ic-space-xxs);\n border: var(--ic-space-xxxs) dashed transparent;\n\n --icon-height: auto;\n}\n\n:host(.ic-menu-item-disabled) ::part(button) {\n color: var(--ic-popover-menu-item-check-disabled) !important;\n\n --ic-typography-color: var(--ic-popover-menu-item-check-disabled) !important;\n\n pointer-events: none;\n}\n\n:host(.ic-menu-item-disabled) .menu-item-label,\n:host(.ic-menu-item-disabled) .shortcut,\n:host(.ic-menu-item-disabled) .menu-item-description {\n --ic-typography-color: var(--ic-popover-menu-item-label-disabled) !important;\n}\n\n:host([variant=\"destructive\"]) ::part(button) {\n color: var(--ic-popover-menu-destructive-item-icon);\n\n --ic-typography-color: var(--ic-popover-menu-destructive-item-label);\n}\n\n:host ::part(button):hover {\n background-color: var(--ic-popover-background-hover);\n}\n\n:host ::part(button):focus-visible,\n:host ::part(button):focus {\n color: var(--ic-popover-menu-item-icon-focused);\n\n --ic-typography-color: purple;\n\n background-color: var(--ic-popover-background-focus);\n box-shadow: none;\n}\n\n:host(.ic-menu-item-disabled) ::part(button):focus-visible,\n:host(.ic-menu-item-disabled) ::part(button):focus {\n color: var(--ic-popover-menu-item-icon-disabled) !important;\n\n --ic-typography-color: orange !important;\n}\n\n:host([variant=\"destructive\"]) ::part(button):focus-visible,\n:host([variant=\"destructive\"]) ::part(button):focus {\n background-color: var(--ic-popover-destructive-background-focus);\n}\n\nic-button:focus-within .menu-item-label,\nic-button:focus-within .shortcut,\nic-button:focus-within .menu-item-description {\n --ic-typography-color: var(--ic-popover-menu-item-label-focused);\n}\n\n:host(.ic-menu-item-disabled) ic-button:focus-within .focus-border {\n border-color: var(--ic-popover-menu-border);\n}\n\n:host(.ic-menu-item-disabled) ic-button:focus-within .menu-item-label,\n:host(.ic-menu-item-disabled) ic-button:focus-within .shortcut,\n:host(.ic-menu-item-disabled) ic-button:focus-within .menu-item-description {\n --ic-typography-color: var(--ic-popover-menu-item-label-disabled) !important;\n}\n\n:host ::part(button):active {\n background-color: var(--ic-popover-background-pressed);\n color: var(--ic-popover-menu-item-label) !important;\n\n --ic-typography-color: var(--ic-popover-menu-item-label) !important;\n}\n\n:host([variant=\"destructive\"]) ::part(button):active {\n background-color: var(--ic-popover-background-pressed);\n color: var(--ic-popover-menu-destructive-item-label) !important;\n\n --ic-typography-color: var(\n --ic-popover-menu-destructive-item-label\n ) !important;\n}\n\n.menu-item-info {\n display: flex;\n flex-direction: column;\n flex: 1;\n align-items: baseline;\n white-space: pre-line;\n text-align: left;\n}\n\n.menu-labels {\n display: flex;\n align-items: baseline;\n gap: var(--ic-space-xs);\n}\n\n.menu-item-description {\n --ic-typography-color: var(--ic-popover-menu-item-description);\n}\n\n.shortcut {\n --ic-typography-color: var(--ic-popover-menu-item-shortcut);\n\n display: flex;\n flex: min-content;\n}\n\n:host([variant=\"destructive\"]) .menu-item-label {\n text-transform: uppercase;\n font-weight: 600;\n letter-spacing: 0.025em;\n}\n\nic-button:active .menu-item-label {\n --ic-typography-color: var(--ic-popover-menu-item-label);\n}\n\nic-button:active .menu-item-description {\n --ic-typography-color: var(--ic-popover-menu-item-description);\n}\n\nic-button:active .shortcut {\n --ic-typography-color: var(--ic-popover-menu-item-shortcut);\n}\n\n:host([variant=\"destructive\"]) ic-button:active .menu-item-label {\n --ic-typography-color: var(\n --ic-popover-menu-destructive-item-label\n ) !important;\n}\n\n.icon,\n.check-icon,\n.submenu-icon,\n.icon ::slotted(svg),\n.check-icon svg,\n.submenu-icon svg {\n width: var(--ic-space-lg);\n height: var(--ic-space-lg);\n}\n\n.check-icon.hide {\n visibility: hidden;\n}\n\n/** High Contrast **/\n@media (forced-colors: active) {\n :host ::part(button) {\n border: canvas;\n }\n\n :host ::part(button):focus-visible {\n outline: var(--ic-space-xxxs) solid transparent;\n }\n\n .focus-border {\n border-color: canvas;\n }\n\n :host(.ic-menu-item-disabled) ic-button:focus-within .focus-border {\n border-color: GrayText;\n }\n\n :host(.ic-menu-item-disabled) .menu-item-info,\n :host(.ic-menu-item-disabled) .menu-item-label,\n :host(.ic-menu-item-disabled) .shortcut,\n :host(.ic-menu-item-disabled) .menu-item-description,\n :host(.ic-menu-item-disabled) ic-button:focus-within .menu-item-info,\n :host(.ic-menu-item-disabled) ic-button:focus-within .menu-item-label,\n :host(.ic-menu-item-disabled) ic-button:focus-within .shortcut,\n :host(.ic-menu-item-disabled) ic-button:focus-within .menu-item-description {\n --ic-typography-color: GrayText !important;\n }\n\n :host(.ic-menu-item-disabled) ::part(button):focus-visible,\n :host(.ic-menu-item-disabled) ::part(button):focus {\n outline-color: GrayText !important;\n }\n}\n","import {\n Component,\n Element,\n Host,\n Prop,\n h,\n Event,\n EventEmitter,\n Listen,\n Watch,\n} from \"@stencil/core\";\nimport {\n isSlotUsed,\n onComponentRequiredPropUndefined,\n removeDisabledFalse,\n isPropDefined,\n} from \"../../utils/helpers\";\nimport { IcMenuItemVariants } from \"./ic-menu-item.types\";\nimport Check from \"../../assets/check-icon.svg\";\nimport Chevron from \"../../assets/chevron-icon.svg\";\n\n/**\n * @slot icon - Content will be placed to the left of the menu item label.\n */\n\n@Component({\n tag: \"ic-menu-item\",\n styleUrl: \"ic-menu-item.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class MenuItem {\n @Element() el: HTMLIcMenuItemElement;\n\n /**\n * If `true`, the menu item will be in a checked state. This is only applicable when variant is set to `toggle`.\n */\n @Prop({ mutable: true, reflect: true }) checked?: boolean = false;\n\n /**\n * The description displayed in the menu item, below the label.\n */\n @Prop() description?: string;\n\n /**\n * If `true`, the menu item will be in disabled state.\n */\n @Prop() disabled?: boolean = false;\n @Watch(\"disabled\")\n watchDisabledHandler(): void {\n removeDisabledFalse(this.disabled, this.el);\n }\n\n /**\n * The URL that the link points to. This will render the menu item as an \"a\" tag.\n */\n @Prop() href?: string;\n\n /**\n * The human language of the linked URL.\n */\n @Prop() hreflang?: string;\n\n /**\n * The label describing the keyboard shortcut for a menu item's action.\n */\n @Prop() keyboardShortcutLabel?: string;\n\n /**\n * The label to display in the menu item.\n */\n @Prop() label!: string;\n\n /**\n * How much of the referrer to send when following the link.\n */\n @Prop() referrerpolicy?: ReferrerPolicy;\n\n /**\n * The relationship of the linked URL as space-separated link types.\n */\n @Prop() rel?: string;\n\n /**\n * This references the popover menu instance that the menu item is a trigger for. If this prop is set, then the variant will always be default.\n */\n @Prop() submenuTriggerFor?: string;\n\n /**\n * The place to display the linked URL, as the name for a browsing context (a tab, window, or iframe).\n */\n @Prop() target?: string;\n\n /**\n * The variant of the menu item.\n */\n @Prop({ mutable: true, reflect: true }) variant?: IcMenuItemVariants =\n \"default\";\n\n /**\n * @internal Emitted when item loses focus.\n */\n @Event() childBlur: EventEmitter<void>;\n\n /**\n * @internal Emitted when the user clicks a menu item.\n */\n @Event() handleMenuItemClick: EventEmitter<HTMLIcMenuItemElement>;\n\n /**\n * Emitted when the user clicks a menu item that is set to the toggle variant.\n */\n @Event() icToggleChecked: EventEmitter<{\n checked: boolean;\n }>;\n\n /**\n * @internal Emitted when the user clicks a menu item that triggers a popover menu instance.\n */\n @Event() triggerPopoverMenuInstance: EventEmitter<void>;\n\n componentWillLoad(): void {\n // This ensures that trigger menu items are always set to the default variant\n if (isPropDefined(this.submenuTriggerFor) && this.variant !== \"default\") {\n this.variant = \"default\";\n }\n removeDisabledFalse(this.disabled, this.el);\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [{ prop: this.label, propName: \"label\" }],\n \"Menu Item\"\n );\n }\n\n @Listen(\"click\", { capture: true })\n handleHostClick(e: Event): void {\n if (this.disabled) {\n e.stopImmediatePropagation();\n }\n }\n\n private handleClick = (e: Event): void => {\n if (isPropDefined(this.submenuTriggerFor)) {\n this.triggerPopoverMenuInstance.emit();\n } else if (this.variant === \"toggle\") {\n e.preventDefault();\n this.checked = !this.checked;\n this.icToggleChecked.emit({\n checked: this.checked,\n });\n }\n this.handleMenuItemClick.emit(this.el);\n };\n\n private getMenuItemAriaLabel = (): string => {\n let ariaLabel = this.label;\n\n if (isPropDefined(this.description)) {\n ariaLabel = `${ariaLabel}, ${this.description}`;\n }\n\n if (isPropDefined(this.keyboardShortcutLabel)) {\n ariaLabel = `${ariaLabel}, ${this.keyboardShortcutLabel}`;\n }\n\n if (this.variant === \"destructive\") {\n ariaLabel = `${ariaLabel}, destructive`;\n }\n\n if (isPropDefined(this.submenuTriggerFor)) {\n ariaLabel = `${ariaLabel}, triggers submenu`;\n }\n\n if (this.el.classList.contains(\"ic-popover-submenu-back-button\")) {\n ariaLabel = \"Go back to parent menu\";\n }\n const parentEl = this.el.parentElement;\n\n if (\n parentEl &&\n parentEl.tagName === \"IC-MENU-GROUP\" &&\n (parentEl as HTMLIcMenuGroupElement).label\n ) {\n return `${ariaLabel}, ${\n (parentEl as HTMLIcMenuGroupElement).label\n } menu group`;\n } else {\n return ariaLabel;\n }\n };\n\n render() {\n // A sub-component to layout the menu information correctly in ic-button\n const MenuItemInformation = () => {\n return (\n <div class=\"menu-item-info\">\n <div class=\"menu-labels\">\n <ic-typography class=\"menu-item-label\">{this.label}</ic-typography>\n {this.keyboardShortcutLabel && (\n <ic-typography variant=\"caption\" class=\"shortcut\">\n {this.keyboardShortcutLabel}\n </ic-typography>\n )}\n </div>\n {this.description && (\n <ic-typography class=\"menu-item-description\" variant=\"caption\">\n {this.description}\n </ic-typography>\n )}\n </div>\n );\n };\n\n return (\n <Host\n class={{\n [\"ic-menu-item-disabled\"]: !!this.disabled,\n }}\n >\n <li\n role={this.variant === \"toggle\" ? \"menuitemcheckbox\" : \"menuitem\"}\n aria-disabled={`${this.disabled}`}\n aria-checked={\n this.variant === \"toggle\"\n ? this.checked\n ? \"true\"\n : \"false\"\n : undefined\n }\n >\n <ic-button\n fullWidth\n variant=\"tertiary\"\n onClick={this.handleClick}\n href={isPropDefined(this.href)}\n hreflang={isPropDefined(this.hreflang)}\n target={isPropDefined(this.target)}\n rel={isPropDefined(this.rel)}\n referrerpolicy={this.referrerpolicy}\n aria-disabled={`${this.disabled}`}\n aria-label={this.getMenuItemAriaLabel()}\n aria-haspopup={\n isPropDefined(this.submenuTriggerFor) ||\n this.el.classList.contains(\"ic-popover-submenu-back-button\")\n ? \"menu\"\n : false\n }\n >\n <div class=\"focus-border\">\n {isSlotUsed(this.el, \"icon\") && (\n <span class=\"icon\">\n <slot name=\"icon\"></slot>\n </span>\n )}\n <MenuItemInformation />\n {this.variant === \"toggle\" && (\n <span\n class={{\n [\"check-icon\"]: true,\n [\"hide\"]: !this.checked,\n }}\n aria-hidden=\"true\"\n innerHTML={Check}\n />\n )}\n {isPropDefined(this.submenuTriggerFor) && (\n <span\n class={{ [\"submenu-icon\"]: true }}\n aria-hidden=\"true\"\n innerHTML={Chevron}\n />\n )}\n </div>\n </ic-button>\n </li>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -1,2 +0,0 @@
1
- import{r as n,h as e,H as t,g as i}from"./p-8e4e97b4.js";import{r as a,i as o,b as r,a as c,h as d,I as s}from"./p-ed8957da.js";import{C as l}from"./p-3b185c32.js";const b='/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */\n\n/* Document\n ========================================================================== */\n\n/**\n * 1. Correct the line height in all browsers.\n * 2. Prevent adjustments of font size after orientation changes in iOS.\n */\n\nhtml {\n line-height: 1.15; /* 1 */\n -webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/* Sections\n ========================================================================== */\n\n/**\n * Remove the margin in all browsers.\n */\n\nbody {\n margin: 0;\n}\n\n/**\n * Render the `main` element consistently in IE.\n */\n\nmain {\n display: block;\n}\n\n/**\n * Correct the font size and margin on `h1` elements within `section` and\n * `article` contexts in Chrome, Firefox, and Safari.\n */\n\nh1 {\n font-size: 2em;\n margin: 0.67em 0;\n}\n\n/* Grouping content\n ========================================================================== */\n\n/**\n * 1. Add the correct box sizing in Firefox.\n * 2. Show the overflow in Edge and IE.\n */\n\nhr {\n box-sizing: content-box; /* 1 */\n height: 0; /* 1 */\n overflow: visible; /* 2 */\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd `em` font sizing in all browsers.\n */\n\npre {\n font-family: monospace, monospace; /* 1 */\n font-size: 1em; /* 2 */\n}\n\n/* Text-level semantics\n ========================================================================== */\n\n/**\n * Remove the gray background on active links in IE 10.\n */\n\na {\n background-color: transparent;\n}\n\n/**\n * 1. Remove the bottom border in Chrome 57-\n * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.\n */\n\nabbr[title] {\n border-bottom: none; /* 1 */\n text-decoration: underline; /* 2 */\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted; /* 2 */\n}\n\n/**\n * Add the correct font weight in Chrome, Edge, and Safari.\n */\n\nb,\nstrong {\n font-weight: bolder;\n}\n\n/**\n * 1. Correct the inheritance and scaling of font size in all browsers.\n * 2. Correct the odd `em` font sizing in all browsers.\n */\n\ncode,\nkbd,\nsamp {\n font-family: monospace, monospace; /* 1 */\n font-size: 1em; /* 2 */\n}\n\n/**\n * Add the correct font size in all browsers.\n */\n\nsmall {\n font-size: 80%;\n}\n\n/**\n * Prevent `sub` and `sup` elements from affecting the line height in\n * all browsers.\n */\n\nsub,\nsup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n}\n\nsub {\n bottom: -0.25em;\n}\n\nsup {\n top: -0.5em;\n}\n\n/* Embedded content\n ========================================================================== */\n\n/**\n * Remove the border on images inside links in IE 10.\n */\n\nimg {\n border-style: none;\n}\n\n/* Forms\n ========================================================================== */\n\n/**\n * 1. Change the font styles in all browsers.\n * 2. Remove the margin in Firefox and Safari.\n */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n font-family: inherit; /* 1 */\n font-size: 100%; /* 1 */\n line-height: 1.15; /* 1 */\n margin: 0; /* 2 */\n}\n\n/**\n * Show the overflow in IE.\n * 1. Show the overflow in Edge.\n */\n\nbutton,\ninput {\n /* 1 */\n overflow: visible;\n}\n\n/**\n * Remove the inheritance of text transform in Edge, Firefox, and IE.\n * 1. Remove the inheritance of text transform in Firefox.\n */\n\nbutton,\nselect {\n /* 1 */\n text-transform: none;\n}\n\n/**\n * Correct the inability to style clickable types in iOS and Safari.\n */\n\nbutton,\n[type="button"],\n[type="reset"],\n[type="submit"] {\n -webkit-appearance: button;\n}\n\n/**\n * Remove the inner border and padding in Firefox.\n */\n\nbutton::-moz-focus-inner,\n[type="button"]::-moz-focus-inner,\n[type="reset"]::-moz-focus-inner,\n[type="submit"]::-moz-focus-inner {\n border-style: none;\n padding: 0;\n}\n\n/**\n * Restore the focus styles unset by the previous rule.\n */\n\nbutton:-moz-focusring,\n[type="button"]:-moz-focusring,\n[type="reset"]:-moz-focusring,\n[type="submit"]:-moz-focusring {\n outline: 1px dotted ButtonText;\n}\n\n/**\n * Correct the padding in Firefox.\n */\n\nfieldset {\n padding: 0.35em 0.75em 0.625em;\n}\n\n/**\n * 1. Correct the text wrapping in Edge and IE.\n * 2. Correct the color inheritance from `fieldset` elements in IE.\n * 3. Remove the padding so developers are not caught out when they zero out\n * `fieldset` elements in all browsers.\n */\n\nlegend {\n box-sizing: border-box; /* 1 */\n color: inherit; /* 2 */\n display: table; /* 1 */\n max-width: 100%; /* 1 */\n padding: 0; /* 3 */\n white-space: normal; /* 1 */\n}\n\n/**\n * Add the correct vertical alignment in Chrome, Firefox, and Opera.\n */\n\nprogress {\n vertical-align: baseline;\n}\n\n/**\n * Remove the default vertical scrollbar in IE 10+.\n */\n\ntextarea {\n overflow: auto;\n}\n\n/**\n * 1. Add the correct box sizing in IE 10.\n * 2. Remove the padding in IE 10.\n */\n\n[type="checkbox"],\n[type="radio"] {\n box-sizing: border-box; /* 1 */\n padding: 0; /* 2 */\n}\n\n/**\n * Correct the cursor style of increment and decrement buttons in Chrome.\n */\n\n[type="number"]::-webkit-inner-spin-button,\n[type="number"]::-webkit-outer-spin-button {\n height: auto;\n}\n\n/**\n * 1. Correct the odd appearance in Chrome and Safari.\n * 2. Correct the outline style in Safari.\n */\n\n[type="search"] {\n -webkit-appearance: textfield; /* 1 */\n outline-offset: -2px; /* 2 */\n}\n\n/**\n * Remove the inner padding in Chrome and Safari on macOS.\n */\n\n[type="search"]::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n/**\n * 1. Correct the inability to style clickable types in iOS and Safari.\n * 2. Change font properties to `inherit` in Safari.\n */\n\n::-webkit-file-upload-button {\n -webkit-appearance: button; /* 1 */\n font: inherit; /* 2 */\n}\n\n/* Interactive\n ========================================================================== */\n\n/*\n * Add the correct display in Edge, IE 10+, and Firefox.\n */\n\ndetails {\n display: block;\n}\n\n/*\n * Add the correct display in all browsers.\n */\n\nsummary {\n display: list-item;\n}\n\n/* Misc\n ========================================================================== */\n\n/**\n * Add the correct display in IE 10+.\n */\n\ntemplate {\n display: none;\n}\n\n/**\n * Add the correct display in IE 10.\n */\n\n[hidden] {\n display: none;\n}\n\nhtml,\nbody,\ndiv,\nspan,\napplet,\nobject,\niframe,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np,\nblockquote,\npre,\na,\nabbr,\nacronym,\naddress,\nbig,\ncite,\ncode,\ndel,\ndfn,\nem,\nimg,\nins,\nkbd,\nq,\ns,\nsamp,\nsmall,\nstrike,\nstrong,\nsub,\nsup,\ntt,\nvar,\nb,\nu,\ni,\ncenter,\ndl,\ndt,\ndd,\nol,\nul,\nli,\nfieldset,\nform,\nlabel,\nlegend,\ntable,\ncaption,\ntbody,\ntfoot,\nthead,\ntr,\nth,\ntd,\narticle,\naside,\ncanvas,\ndetails,\nembed,\nfigure,\nfigcaption,\nfooter,\nheader,\nhgroup,\nmenu,\nnav,\noutput,\nruby,\nsection,\nsummary,\ntime,\nmark,\naudio,\nvideo {\n margin: 0;\n padding: 0;\n border: 0;\n font-size: 100%;\n font-style: inherit;\n vertical-align: baseline;\n}\n\n\n:host {\n display: flex;\n}\n\na {\n text-decoration: none !important;\n color: var(--ic-card-text-primary) !important;\n}\n\na:visited {\n color: var(--ic-card-link-action-dark) !important;\n}\n\nbutton {\n border: none;\n background-color: transparent;\n outline: var(--ic-hc-focus-outline);\n}\n\n.card {\n display: flex;\n flex-direction: column;\n border: var(--ic-space-1px) solid var(--ic-card-border-primary);\n border-radius: var(--ic-border-radius);\n box-sizing: border-box;\n padding: var(--ic-space-md);\n text-align: left;\n color: var(--ic-card-text-primary);\n transition: var(--ic-easing-transition-fast);\n position: relative;\n width: inherit;\n min-width: -moz-fit-content;\n min-width: fit-content;\n height: -moz-fit-content;\n height: fit-content;\n min-height: 100%;\n\n ::slotted(svg) {\n fill: var(--ic-card-icon);\n }\n &.monochrome {\n border: var(--ic-border-width) solid var(--ic-card-border-monochrome);\n }\n &.fullwidth {\n width: 100%;\n }\n &.clickable {\n &:hover {\n background-color: var(--ic-card-background-hover);\n border: var(--ic-space-1px) solid var(--ic-card-hover-border-color);\n cursor: pointer;\n }\n &.focussed,\n &:focus {\n background-color: var(--ic-card-background-hover);\n box-shadow: var(--ic-border-focus);\n outline: var(--ic-hc-focus-outline);\n border: var(--ic-space-1px) solid var(--ic-card-pressed-border-color);\n }\n &:active {\n background-color: var(--ic-card-background-pressed);\n box-shadow: var(--ic-border-focus);\n\n .card-title {\n text-decoration: none;\n }\n }\n .card-title {\n --ic-typography-color: var(--ic-card-clickable-text);\n\n color: var(--ic-card-clickable-text);\n text-decoration: underline;\n text-decoration-thickness: var(--ic-space-1px);\n }\n }\n &.disabled {\n border: var(--ic-space-1px) dashed var(--ic-card-disabled-border-color);\n\n .card-message,\n .subheading,\n .card-title {\n --ic-typography-color: var(--ic-card-disabled-text);\n }\n .card-title {\n text-decoration: underline;\n text-decoration-thickness: var(--ic-space-1px);\n text-decoration-color: var(--ic-card-disabled-text);\n color: var(--ic-card-disabled-text);\n }\n ::slotted(svg) {\n fill: var(--ic-card-icon-disabled);\n }\n }\n}\n\n.card-header {\n display: flex;\n align-items: center;\n}\n\n.icon {\n display: flex;\n align-items: center;\n padding-right: var(--ic-space-xs);\n}\n\n.card.clickable:hover .card-title,\n.card.clickable:focus .card-title,\n.card.clickable.focussed .card-title {\n display: inline-block;\n border-bottom: 0.25rem solid !important;\n margin-bottom: -0.25rem !important;\n text-decoration: none;\n}\n\n@supports (text-underline-offset: 25%) {\n .card.clickable:hover .card-title,\n .card.clickable:focus .card-title,\n .card.clickable.focussed .card-title {\n text-decoration-line: underline;\n text-decoration-thickness: 25%;\n text-underline-offset: 25%;\n border-bottom: 0 !important;\n margin-bottom: 0 !important;\n }\n}\n\n.subheading {\n margin-top: var(--ic-space-xxs);\n}\n\n.adornment {\n margin-top: var(--ic-space-xxs);\n}\n\n.card-message {\n margin-top: var(--ic-space-md);\n align-items: left;\n}\n\n.interaction-button {\n margin-left: auto;\n}\n\n.image-top {\n margin-bottom: var(--ic-space-md);\n display: flex;\n justify-content: center;\n}\n\n.image-mid {\n margin-top: var(--ic-space-md);\n display: flex;\n justify-content: center;\n}\n\n.interaction-area {\n display: flex;\n flex-grow: 1;\n gap: var(--ic-space-md);\n margin-top: var(--ic-space-md);\n align-items: flex-end;\n}\n\n.interaction-controls {\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n gap: var(--ic-space-sm);\n}\n\n.toggle-button {\n width: 2.5rem;\n height: 2.5rem;\n padding: var(--ic-space-xs);\n margin: var(--ic-space-1px) 0;\n min-width: 0;\n cursor: pointer;\n transition: var(--ic-easing-transition-fast);\n border-radius: var(--ic-border-radius);\n display: inline-flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n background: none;\n border: none;\n box-sizing: border-box;\n white-space: nowrap;\n vertical-align: middle;\n\n &:hover {\n background-color: var(--ic-card-background-hover);\n }\n &:focus {\n box-shadow: var(--ic-border-focus);\n }\n &:active:not(:focus) {\n background-color: var(--ic-card-background-pressed);\n }\n\n svg {\n pointer-events: none;\n width: 100% !important;\n height: 100% !important;\n fill: currentcolor !important;\n }\n}\n\n#ic-tooltip-expand-button {\n margin-left: auto;\n position: relative;\n}\n\n.toggle-button-closed svg {\n transform: rotate(90deg);\n}\n\n.toggle-button-expanded svg {\n transform: rotate(-90deg);\n}\n\n.expanded-content {\n margin-top: var(--ic-space-md);\n}\n\n/** High Contrast **/\n@media (forced-colors: active) {\n .card {\n ::slotted(svg) {\n fill: currentcolor;\n }\n &.disabled {\n border-color: GrayText !important;\n\n ::slotted(svg) {\n fill: GrayText !important;\n }\n .card-message,\n .subheading,\n .card-title {\n color: GrayText;\n\n --ic-typography-color: GrayText;\n }\n }\n }\n\n .toggle-button:focus,\n .toggle-button:hover {\n outline-color: Highlight;\n }\n}\n';const f=b;const h=class{constructor(e){n(this,e);this.hostMutationObserver=null;this.areaExpanded=false;this.isFocussed=false;this.monochrome=false;this.parentEl=null;this.parentIsAnchorTag=false;this.clickable=false;this.disabled=false;this.expandable=false;this.fullWidth=false;this.hreflang="";this.message="";this.theme="inherit";this.parentFocussed=()=>{this.isFocussed=true};this.parentBlurred=()=>{this.isFocussed=false};this.toggleExpanded=()=>{this.areaExpanded=!this.areaExpanded}}watchDisabledHandler(){a(this.disabled,this.el)}disconnectedCallback(){var n;if(this.parentEl&&this.parentIsAnchorTag){this.parentEl.removeEventListener("focus",this.parentFocussed);this.parentEl.removeEventListener("blur",this.parentBlurred)}(n=this.hostMutationObserver)===null||n===void 0?void 0:n.disconnect()}componentWillLoad(){var n;this.parentEl=this.el.parentElement;if(((n=this.parentEl)===null||n===void 0?void 0:n.tagName)==="A"){this.clickable=true;this.parentIsAnchorTag=true;this.parentEl.classList.add("ic-card-wrapper-link");this.parentEl.addEventListener("focus",this.parentFocussed);this.parentEl.addEventListener("blur",this.parentBlurred)}a(this.disabled,this.el)}componentDidLoad(){!o(this.el,"heading")&&r([{prop:this.heading,propName:"heading"}],"Card");this.updateTheme();this.hostMutationObserver=new MutationObserver((n=>c(n,["message","adornment","expanded-content","image-top","image-mid","icon","interaction-button","badge","interaction-controls"],this)));this.hostMutationObserver.observe(this.el,{childList:true})}handleHostClick(n){if(this.disabled){n.stopImmediatePropagation()}}brandChangeHandler(n){this.updateTheme(n.detail.mode)}async setFocus(){var n,e;const t=this.el.shadowRoot;if(t){if(t.querySelector("a")){(n=t.querySelector("a"))===null||n===void 0?void 0:n.focus()}else if(t.querySelector("button")){(e=t.querySelector("button"))===null||e===void 0?void 0:e.focus()}}}updateTheme(n=null){const e=d(this.el,n);if(e!==s.Default){this.monochrome=true;this.theme=e===s.Light?s.Dark:s.Light}}render(){const{clickable:n,disabled:i,expandable:a,fullWidth:r,heading:c,isFocussed:d,message:s,monochrome:b,href:f,hreflang:h,parentIsAnchorTag:m,referrerpolicy:p,rel:g,subheading:u,target:v,theme:y}=this;const x=m||!n?"div":f===undefined?"button":"a";const k=x=="a"&&{href:f,hrefLang:h,referrerPolicy:p,rel:g,target:v};return e(t,{key:"aeff3ef22b085acbf30dacb5d3ae0167451044b9",class:{[`ic-theme-${y}`]:y!=="inherit"}},e(x,Object.assign({key:"a451e5f53149283ee77878ccc3e699beae669f24",class:{card:true,clickable:!!n&&!i,disabled:!!i,fullwidth:!!r,focussed:d,monochrome:b},tabindex:n&&!m?0:undefined,"aria-disabled":i?"true":null,disabled:i},k),o(this.el,"image-top")&&e("div",{key:"2ec35ab8d6e1224c0a393c92a72e403e4c5fc8fc",class:"image-top"},e("slot",{key:"c859ae1e242284b586df2ce7627c316021b8ef54",name:"image-top"})),e("div",{key:"55f21501b3d95e1f5bf3a69542dab57d00379e63",class:"card-header"},o(this.el,"icon")&&e("div",{key:"f95e7224d6e8548f33a8861025a1651a3bc953a4",class:"icon"},e("slot",{key:"1102f6f88e830613365cb0bfe3e5c4481b3a207e",name:"icon"})),e("div",{key:"3122872ef284640debbf7182d36f9cd4c6032ae4",class:"card-title"},e("slot",{key:"f51213257b0ff6e195852ca006e9cba35103f210",name:"heading"},e("ic-typography",{key:"7d82fce416b7579ac23e2154ef512bd8f3181bc3",variant:"h4"},e("p",{key:"ad083279b8f012f16d67c182c37bcc6383710ba5"},c)))),o(this.el,"interaction-button")&&e("div",{key:"bb47af0b373f295cb1bcd1b72df6c325e257c2ed",class:"interaction-button"},e("slot",{key:"fd0fc056e51febf6d9abe76d7ffb0773836e52d3",name:"interaction-button"}))),(u||o(this.el,"subheading"))&&e("div",{key:"32851c6c59b9ee76aa490210f5888fe410067ca3",class:"subheading"},e("slot",{key:"5757fd2fd2618f03fee208b855384c29861cadc6",name:"subheading"},e("ic-typography",{key:"1f206ca1eaf0bcd5693abf3fc3f97303582a5deb",variant:"subtitle-small"},u))),o(this.el,"adornment")&&e("div",{key:"ceef939617ce12be984f15673e9ef4e71110234c",class:"adornment"},e("slot",{key:"127e2dfa77b74a19070e90361d26fe1358539ca2",name:"adornment"})),o(this.el,"image-mid")&&e("div",{key:"0cbc0b6a9638969db6fabcde40ad46044afc4b88",class:"image-mid"},e("slot",{key:"3e8ae6e25570ed03e7fea0ae4fdd7a779d3022b1",name:"image-mid"})),(s||o(this.el,"message"))&&e("div",{key:"9da59f1aeaa1fcf4bc2a0aa1bd50d3f86faa2af7",class:"card-message"},s&&e("ic-typography",{key:"4620229c479b782ad5ee0c8e3a7acdf6a8a70d7b",variant:"body"},s),o(this.el,"message")&&e("slot",{key:"959e101cc933319cf297d0f0ebbd46299a24cbd5",name:"message"})),(o(this.el,"interaction-controls")||a)&&e("div",{key:"c4263a3d5f8e22f31cf0e55a868dbf0f52b00692",class:"interaction-area"},e("div",{key:"bd5e1d3ff137004ff5c696f611dae1bfefd26e1a",class:"interaction-controls"},e("slot",{key:"5985495f8f12c825aafcab517d3add5f9741d460",name:"interaction-controls"})),a&&e("ic-tooltip",{key:"e3b12f780303019b7f95ce5a98d7b7194c242c9a",id:"ic-tooltip-expand-button",label:"Toggle expandable area",silent:true},e("button",{key:"9857a37a37571bd21f500527149ed8bc3806c4f4",class:{"toggle-button":true,[`toggle-button-${this.areaExpanded?"expanded":"closed"}`]:true},"aria-label":"Toggle expandable area","aria-expanded":`${this.areaExpanded}`,"aria-controls":this.areaExpanded?"expanded-content-area":null,onClick:this.toggleExpanded,innerHTML:l}))),o(this.el,"expanded-content")&&this.areaExpanded&&e("div",{key:"080d0198d37d939cfc506abc5933caac7eaa383d",class:"expanded-content",id:"expanded-content-area"},e("slot",{key:"6c9b5dd6bfa46d466034255231047b2682e19f96",name:"expanded-content"})),o(this.el,"badge")&&e("slot",{key:"1f68304dd15e605320258bf8d14d2df3b0caf344",name:"badge"})))}get el(){return i(this)}static get watchers(){return{disabled:["watchDisabledHandler"]}}};h.style=f;export{h as ic_card_vertical};
2
- //# sourceMappingURL=p-116ad73d.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["icCardVerticalCss","IcCardVerticalStyle0","CardVertical","constructor","hostRef","this","hostMutationObserver","areaExpanded","isFocussed","monochrome","parentEl","parentIsAnchorTag","clickable","disabled","expandable","fullWidth","hreflang","message","theme","parentFocussed","parentBlurred","toggleExpanded","watchDisabledHandler","removeDisabledFalse","el","disconnectedCallback","removeEventListener","_a","disconnect","componentWillLoad","parentElement","tagName","classList","add","addEventListener","componentDidLoad","isSlotUsed","onComponentRequiredPropUndefined","prop","heading","propName","updateTheme","MutationObserver","mutationList","renderDynamicChildSlots","observe","childList","handleHostClick","event","stopImmediatePropagation","brandChangeHandler","ev","detail","mode","setFocus","shadowRoot","querySelector","focus","_b","foregroundColor","getBrandFromContext","IcBrandForegroundEnum","Default","Light","Dark","render","href","referrerpolicy","rel","subheading","target","Component","undefined","attrs","hrefLang","referrerPolicy","h","Host","key","class","Object","assign","card","fullwidth","focussed","tabindex","name","variant","id","label","silent","onClick","innerHTML","chevronIcon"],"sources":["src/components/ic-card-vertical/ic-card-vertical.css?tag=ic-card-vertical&encapsulation=shadow","src/components/ic-card-vertical/ic-card-vertical.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n display: flex;\n}\n\na {\n text-decoration: none !important;\n color: var(--ic-card-text-primary) !important;\n}\n\na:visited {\n color: var(--ic-card-link-action-dark) !important;\n}\n\nbutton {\n border: none;\n background-color: transparent;\n outline: var(--ic-hc-focus-outline);\n}\n\n.card {\n display: flex;\n flex-direction: column;\n border: var(--ic-space-1px) solid var(--ic-card-border-primary);\n border-radius: var(--ic-border-radius);\n box-sizing: border-box;\n padding: var(--ic-space-md);\n text-align: left;\n color: var(--ic-card-text-primary);\n transition: var(--ic-easing-transition-fast);\n position: relative;\n width: inherit;\n min-width: fit-content;\n height: fit-content;\n min-height: 100%;\n\n ::slotted(svg) {\n fill: var(--ic-card-icon);\n }\n &.monochrome {\n border: var(--ic-border-width) solid var(--ic-card-border-monochrome);\n }\n &.fullwidth {\n width: 100%;\n }\n &.clickable {\n &:hover {\n background-color: var(--ic-card-background-hover);\n border: var(--ic-space-1px) solid var(--ic-card-hover-border-color);\n cursor: pointer;\n }\n &.focussed,\n &:focus {\n background-color: var(--ic-card-background-hover);\n box-shadow: var(--ic-border-focus);\n outline: var(--ic-hc-focus-outline);\n border: var(--ic-space-1px) solid var(--ic-card-pressed-border-color);\n }\n &:active {\n background-color: var(--ic-card-background-pressed);\n box-shadow: var(--ic-border-focus);\n\n .card-title {\n text-decoration: none;\n }\n }\n .card-title {\n --ic-typography-color: var(--ic-card-clickable-text);\n\n color: var(--ic-card-clickable-text);\n text-decoration: underline;\n text-decoration-thickness: var(--ic-space-1px);\n }\n }\n &.disabled {\n border: var(--ic-space-1px) dashed var(--ic-card-disabled-border-color);\n\n .card-message,\n .subheading,\n .card-title {\n --ic-typography-color: var(--ic-card-disabled-text);\n }\n .card-title {\n text-decoration: underline;\n text-decoration-thickness: var(--ic-space-1px);\n text-decoration-color: var(--ic-card-disabled-text);\n color: var(--ic-card-disabled-text);\n }\n ::slotted(svg) {\n fill: var(--ic-card-icon-disabled);\n }\n }\n}\n\n.card-header {\n display: flex;\n align-items: center;\n}\n\n.icon {\n display: flex;\n align-items: center;\n padding-right: var(--ic-space-xs);\n}\n\n.card.clickable:hover .card-title,\n.card.clickable:focus .card-title,\n.card.clickable.focussed .card-title {\n display: inline-block;\n border-bottom: 0.25rem solid !important;\n margin-bottom: -0.25rem !important;\n text-decoration: none;\n}\n\n@supports (text-underline-offset: 25%) {\n .card.clickable:hover .card-title,\n .card.clickable:focus .card-title,\n .card.clickable.focussed .card-title {\n text-decoration-line: underline;\n text-decoration-thickness: 25%;\n text-underline-offset: 25%;\n border-bottom: 0 !important;\n margin-bottom: 0 !important;\n }\n}\n\n.subheading {\n margin-top: var(--ic-space-xxs);\n}\n\n.adornment {\n margin-top: var(--ic-space-xxs);\n}\n\n.card-message {\n margin-top: var(--ic-space-md);\n align-items: left;\n}\n\n.interaction-button {\n margin-left: auto;\n}\n\n.image-top {\n margin-bottom: var(--ic-space-md);\n display: flex;\n justify-content: center;\n}\n\n.image-mid {\n margin-top: var(--ic-space-md);\n display: flex;\n justify-content: center;\n}\n\n.interaction-area {\n display: flex;\n flex-grow: 1;\n gap: var(--ic-space-md);\n margin-top: var(--ic-space-md);\n align-items: flex-end;\n}\n\n.interaction-controls {\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n gap: var(--ic-space-sm);\n}\n\n.toggle-button {\n width: 2.5rem;\n height: 2.5rem;\n padding: var(--ic-space-xs);\n margin: var(--ic-space-1px) 0;\n min-width: 0;\n cursor: pointer;\n transition: var(--ic-easing-transition-fast);\n border-radius: var(--ic-border-radius);\n display: inline-flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n background: none;\n border: none;\n box-sizing: border-box;\n white-space: nowrap;\n vertical-align: middle;\n\n &:hover {\n background-color: var(--ic-card-background-hover);\n }\n &:focus {\n box-shadow: var(--ic-border-focus);\n }\n &:active:not(:focus) {\n background-color: var(--ic-card-background-pressed);\n }\n\n svg {\n pointer-events: none;\n width: 100% !important;\n height: 100% !important;\n fill: currentcolor !important;\n }\n}\n\n#ic-tooltip-expand-button {\n margin-left: auto;\n position: relative;\n}\n\n.toggle-button-closed svg {\n transform: rotate(90deg);\n}\n\n.toggle-button-expanded svg {\n transform: rotate(-90deg);\n}\n\n.expanded-content {\n margin-top: var(--ic-space-md);\n}\n\n/** High Contrast **/\n@media (forced-colors: active) {\n .card {\n ::slotted(svg) {\n fill: currentcolor;\n }\n &.disabled {\n border-color: GrayText !important;\n\n ::slotted(svg) {\n fill: GrayText !important;\n }\n .card-message,\n .subheading,\n .card-title {\n color: GrayText;\n\n --ic-typography-color: GrayText;\n }\n }\n }\n\n .toggle-button:focus,\n .toggle-button:hover {\n outline-color: Highlight;\n }\n}\n","import {\n Component,\n Element,\n Listen,\n Prop,\n State,\n h,\n Method,\n Host,\n Watch,\n} from \"@stencil/core\";\nimport {\n onComponentRequiredPropUndefined,\n isSlotUsed,\n getBrandFromContext,\n removeDisabledFalse,\n renderDynamicChildSlots,\n} from \"../../utils/helpers\";\nimport {\n IcBrand,\n IcBrandForeground,\n IcBrandForegroundEnum,\n IcThemeMode,\n} from \"../../utils/types\";\nimport chevronIcon from \"../../assets/chevron-icon.svg\";\n\n/**\n * @slot heading - Content will be placed at the top of the card to the right of the icon.\n * @slot message - Content will be placed in the main body of the card.\n * @slot subheading - Content will be placed below the card heading.\n * @slot adornment - Content will be placed below the card subheading.\n * @slot image-top - Content will be placed at the top of the card above all other content.\n * @slot image-mid - Content will be placed below the card heading section.\n * @slot icon - Content will be placed to the left of the card heading.\n * @slot interaction-button - Content will be placed in the top right corner of the heading section.\n * @slot interaction-controls - Content will be placed below the card message.\n * @slot expanded-content - Content will be placed below the interaction controls but will not initially be rendered.\n * @slot badge - Badge component overlaying the top right of the card.\n */\n@Component({\n tag: \"ic-card-vertical\",\n styleUrl: \"ic-card-vertical.css\",\n shadow: true,\n})\nexport class CardVertical {\n private hostMutationObserver: MutationObserver | null = null;\n\n @Element() el: HTMLIcCardVerticalElement;\n\n @State() areaExpanded: boolean = false;\n @State() isFocussed: boolean = false;\n @State() monochrome: boolean = false;\n @State() parentEl: HTMLElement | null = null;\n @State() parentIsAnchorTag: boolean = false;\n\n /**\n * If `true`, the card will be a clickable variant, instead of static.\n */\n @Prop({ mutable: true }) clickable?: boolean = false;\n\n /**\n * If `true`, the card will be disabled if it is clickable.\n */\n @Prop() disabled?: boolean = false;\n @Watch(\"disabled\")\n watchDisabledHandler(): void {\n removeDisabledFalse(this.disabled, this.el);\n }\n\n /**\n * If `true`, the card will have an expandable area and expansion toggle button.\n */\n @Prop() expandable?: boolean = false;\n\n /**\n * If `true`, the card will fill the width of the container.\n */\n @Prop() fullWidth?: boolean = false;\n\n /**\n * The heading for the card. This is required, unless a slotted heading is used.\n */\n @Prop() heading?: string;\n\n /**\n * The URL that the clickable card link points to. If set, the clickable card will render as an \"a\" tag, otherwise it will render as a button.\n */\n @Prop() href?: string;\n\n /**\n * The human language of the linked URL.\n */\n @Prop() hreflang?: string = \"\";\n\n /**\n * The main body message of the card.\n */\n @Prop() message?: string = \"\";\n\n /**\n * How much of the referrer to send when following the link.\n */\n @Prop() referrerpolicy?: ReferrerPolicy;\n\n /**\n * The relationship of the linked URL as space-separated link types.\n */\n @Prop() rel?: string;\n\n /**\n * The subheading for the card.\n */\n @Prop() subheading?: string;\n\n /**\n * The place to display the linked URL, as the name for a browsing context (a tab, window, or iframe).\n */\n @Prop() target?: string;\n\n /**\n * Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n */\n @Prop({ mutable: true }) theme?: IcThemeMode = \"inherit\";\n\n disconnectedCallback(): void {\n if (this.parentEl && this.parentIsAnchorTag) {\n this.parentEl.removeEventListener(\"focus\", this.parentFocussed);\n this.parentEl.removeEventListener(\"blur\", this.parentBlurred);\n }\n\n this.hostMutationObserver?.disconnect();\n }\n\n componentWillLoad(): void {\n this.parentEl = this.el.parentElement;\n\n if (this.parentEl?.tagName === \"A\") {\n this.clickable = true;\n this.parentIsAnchorTag = true;\n this.parentEl.classList.add(\"ic-card-wrapper-link\");\n this.parentEl.addEventListener(\"focus\", this.parentFocussed);\n this.parentEl.addEventListener(\"blur\", this.parentBlurred);\n }\n removeDisabledFalse(this.disabled, this.el);\n }\n\n componentDidLoad(): void {\n !isSlotUsed(this.el, \"heading\") &&\n onComponentRequiredPropUndefined(\n [{ prop: this.heading, propName: \"heading\" }],\n \"Card\"\n );\n this.updateTheme();\n\n this.hostMutationObserver = new MutationObserver((mutationList) =>\n renderDynamicChildSlots(\n mutationList,\n [\n \"message\",\n \"adornment\",\n \"expanded-content\",\n \"image-top\",\n \"image-mid\",\n \"icon\",\n \"interaction-button\",\n \"badge\",\n \"interaction-controls\",\n ],\n this\n )\n );\n this.hostMutationObserver.observe(this.el, {\n childList: true,\n });\n }\n\n @Listen(\"click\", { capture: true })\n handleHostClick(event: Event): void {\n if (this.disabled) {\n event.stopImmediatePropagation();\n }\n }\n\n @Listen(\"brandChange\", { target: \"document\" })\n brandChangeHandler(ev: CustomEvent<IcBrand>): void {\n this.updateTheme(ev.detail.mode);\n }\n\n /**\n * Sets focus on the card.\n */\n @Method()\n async setFocus(): Promise<void> {\n const shadowRoot = this.el.shadowRoot;\n\n if (shadowRoot) {\n if (shadowRoot.querySelector(\"a\")) {\n shadowRoot.querySelector(\"a\")?.focus();\n } else if (shadowRoot.querySelector(\"button\")) {\n shadowRoot.querySelector(\"button\")?.focus();\n }\n }\n }\n\n private parentFocussed = (): void => {\n this.isFocussed = true;\n };\n\n private parentBlurred = (): void => {\n this.isFocussed = false;\n };\n\n private updateTheme(mode: IcBrandForeground | null = null): void {\n const foregroundColor = getBrandFromContext(this.el, mode);\n\n if (foregroundColor !== IcBrandForegroundEnum.Default) {\n this.monochrome = true;\n this.theme =\n foregroundColor === IcBrandForegroundEnum.Light\n ? IcBrandForegroundEnum.Dark\n : IcBrandForegroundEnum.Light;\n }\n }\n\n private toggleExpanded = (): void => {\n this.areaExpanded = !this.areaExpanded;\n };\n\n render() {\n const {\n clickable,\n disabled,\n expandable,\n fullWidth,\n heading,\n isFocussed,\n message,\n monochrome,\n href,\n hreflang,\n parentIsAnchorTag,\n referrerpolicy,\n rel,\n subheading,\n target,\n theme,\n } = this;\n\n const Component =\n parentIsAnchorTag || !clickable\n ? \"div\"\n : href === undefined\n ? \"button\"\n : \"a\";\n\n const attrs = Component == \"a\" && {\n href: href,\n hrefLang: hreflang,\n referrerPolicy: referrerpolicy,\n rel: rel,\n target: target,\n };\n\n return (\n <Host\n class={{\n [`ic-theme-${theme}`]: theme !== \"inherit\",\n }}\n >\n <Component\n class={{\n card: true,\n clickable: !!clickable && !disabled,\n disabled: !!disabled,\n fullwidth: !!fullWidth,\n focussed: isFocussed,\n monochrome: monochrome,\n }}\n tabindex={clickable && !parentIsAnchorTag ? 0 : undefined}\n aria-disabled={disabled ? \"true\" : null}\n disabled={disabled}\n {...attrs}\n >\n {isSlotUsed(this.el, \"image-top\") && (\n <div class=\"image-top\">\n <slot name=\"image-top\"></slot>\n </div>\n )}\n <div class=\"card-header\">\n {isSlotUsed(this.el, \"icon\") && (\n <div class=\"icon\">\n <slot name=\"icon\" />\n </div>\n )}\n <div class=\"card-title\">\n <slot name=\"heading\">\n <ic-typography variant=\"h4\">\n <p>{heading}</p>\n </ic-typography>\n </slot>\n </div>\n {isSlotUsed(this.el, \"interaction-button\") && (\n <div class=\"interaction-button\">\n <slot name=\"interaction-button\"></slot>\n </div>\n )}\n </div>\n {(subheading || isSlotUsed(this.el, \"subheading\")) && (\n <div class=\"subheading\">\n <slot name=\"subheading\">\n <ic-typography variant=\"subtitle-small\">\n {subheading}\n </ic-typography>\n </slot>\n </div>\n )}\n {isSlotUsed(this.el, \"adornment\") && (\n <div class=\"adornment\">\n <slot name=\"adornment\"></slot>\n </div>\n )}\n {isSlotUsed(this.el, \"image-mid\") && (\n <div class=\"image-mid\">\n <slot name=\"image-mid\"></slot>\n </div>\n )}\n {(message || isSlotUsed(this.el, \"message\")) && (\n <div class=\"card-message\">\n {message && (\n <ic-typography variant=\"body\">{message}</ic-typography>\n )}\n {isSlotUsed(this.el, \"message\") && <slot name=\"message\"></slot>}\n </div>\n )}\n {(isSlotUsed(this.el, \"interaction-controls\") || expandable) && (\n <div class=\"interaction-area\">\n <div class=\"interaction-controls\">\n <slot name=\"interaction-controls\"></slot>\n </div>\n {expandable && (\n <ic-tooltip\n id=\"ic-tooltip-expand-button\"\n label=\"Toggle expandable area\"\n silent\n >\n <button\n class={{\n \"toggle-button\": true,\n [`toggle-button-${\n this.areaExpanded ? \"expanded\" : \"closed\"\n }`]: true,\n }}\n aria-label=\"Toggle expandable area\"\n aria-expanded={`${this.areaExpanded}`}\n aria-controls={\n this.areaExpanded ? \"expanded-content-area\" : null\n }\n onClick={this.toggleExpanded}\n innerHTML={chevronIcon}\n ></button>\n </ic-tooltip>\n )}\n </div>\n )}\n {isSlotUsed(this.el, \"expanded-content\") && this.areaExpanded && (\n <div class=\"expanded-content\" id=\"expanded-content-area\">\n <slot name=\"expanded-content\"></slot>\n </div>\n )}\n {isSlotUsed(this.el, \"badge\") && <slot name=\"badge\"></slot>}\n </Component>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -1,2 +0,0 @@
1
- import{r as a,h as i,H as c,g as t}from"./p-8e4e97b4.js";import{c as e,g as s,d as r,b as o}from"./p-ed8957da.js";const d="@media (prefers-reduced-motion: no-preference){:host(.ic-badge-show){animation:expand var(--ic-transition-duration-slow)}:host(.ic-badge-hide){animation:shrink var(--ic-transition-duration-slow)}}:host{display:flex;height:var(--ic-space-md);min-width:var(--ic-space-md);width:-moz-fit-content;width:fit-content;border-radius:calc(2 * var(--ic-space-xxl));position:absolute}:host ic-typography{--ic-typography-color:var(--ic-badge-text)}:host(.ic-badge-neutral){background-color:var(--ic-badge-dark) !important}:host(.ic-badge-light) ic-typography{--ic-typography-color:var(--ic-badge-text-monochrome)}:host(.ic-badge-light) ::slotted(*){fill:var(--ic-badge-icon-monochrome)}:host(.ic-badge-info){background-color:var(--ic-badge-info) !important}:host(.ic-badge-light){background-color:var(--ic-badge-light) !important}:host(.ic-badge-warning){background-color:var(--ic-badge-warning) !important}:host(.ic-badge-warning) ic-typography{--ic-typography-color:var(--ic-badge-warning-text)}:host(.ic-badge-warning) ::slotted(*){fill:var(--ic-badge-warning-icon)}:host(.ic-badge-error){background-color:var(--ic-badge-error) !important}:host(.ic-badge-success){background-color:var(--ic-badge-success) !important}:host(.ic-badge-small){height:var(--ic-space-sm);min-width:var(--ic-space-sm)}:host(.ic-badge-large){height:calc(var(--ic-space-md) + var(--ic-space-xxs));min-width:calc(var(--ic-space-md) + var(--ic-space-xxs))}:host(.ic-badge-dot.ic-badge-medium){height:var(--ic-space-xs);width:var(--ic-space-xs);min-width:var(--ic-space-xs)}:host(.ic-badge-dot.ic-badge-small){height:calc(var(--ic-space-xxs) + var(--ic-space-xxxs));width:calc(var(--ic-space-xxs) + var(--ic-space-xxxs));min-width:calc(var(--ic-space-xxs) + var(--ic-space-xxxs))}:host(.ic-badge-dot.ic-badge-large){height:var(--ic-space-sm);width:var(--ic-space-sm);min-width:var(--ic-space-sm)}:host ::slotted(*){fill:var(--ic-badge-icon)}:host(.ic-badge-foreground-dark) ::slotted(*){fill:var(--ic-color-text-primary-light)}:host(.ic-badge-foreground-light) ::slotted(*){fill:white}:host(.ic-badge-foreground-dark) ic-typography{--ic-typography-color:var(--ic-color-text-primary-light)}:host(.ic-badge-foreground-light) ic-typography{--ic-typography-color:var(--ic-color-primary-text-dark)}:host(.ic-badge-text) ic-typography{align-self:center;padding:0 calc((var(--ic-space-xs) + var(--ic-space-1px)) / 2)\n var(--ic-space-1px)}:host(.ic-badge-text.ic-badge-small) ic-typography{padding:0 0.2132rem}:host(.ic-badge-text.ic-badge-large) ic-typography{padding:0 calc((var(--ic-space-sm) + var(--ic-space-1px)) / 2)\n var(--ic-space-1px)}:host(.ic-badge-icon) ::slotted(svg){width:var(--ic-space-sm);height:var(--ic-space-sm);padding:var(--ic-space-xxxs)}:host(.ic-badge-icon.ic-badge-small) ::slotted(svg){width:var(--ic-space-xs);height:var(--ic-space-xs)}:host(.ic-badge-icon.ic-badge-large) ::slotted(svg){width:calc(var(--ic-space-sm) + var(--ic-space-xxxs));height:calc(var(--ic-space-sm) + var(--ic-space-xxxs));padding:calc(var(--ic-space-xxxs) + var(--ic-space-1px))}:host(.ic-badge-far){top:calc(-1 * var(--ic-space-xs));right:calc(-1 * var(--ic-space-xs))}:host(.ic-badge-far.ic-badge-small),:host(.ic-badge-dot.ic-badge-far.ic-badge-large){top:calc(-1 * var(--ic-space-xxs));right:calc(-1 * var(--ic-space-xxs))}:host(.ic-badge-dot.ic-badge-far),:host(.ic-badge-dot.ic-badge-far.ic-badge-small){top:calc(-1 * var(--ic-space-xxxs));right:calc(-1 * var(--ic-space-xxxs))}:host(.ic-badge-near){top:calc(-1 * calc(var(--ic-space-xxs) + var(--ic-space-1px)));right:calc(-1 * calc(var(--ic-space-xxs) + var(--ic-space-1px)))}:host(.ic-badge-dot.ic-badge-near){top:calc(-1 * var(--ic-space-1px));right:calc(-1 * var(--ic-space-1px))}:host(.ic-badge-inline){position:static}:host(.ic-badge-hide){visibility:hidden !important;transition:visibility var(--ic-transition-duration-slow)}.sr-only{position:absolute;left:-9999px}.sr-only:dir(rtl){right:-9999px}@keyframes expand{from{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}@keyframes shrink{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(0)}}";const l=d;const n="IC-NAVIGATION-BUTTON";const h="IC-TOP-NAVIGATION";const g=class{constructor(i){a(this,i);this.ariaLabel=null;this.position="far";this.size="medium";this.theme="inherit";this.type="text";this.variant="neutral";this.visible=true;this.setBadgeColour=()=>{const a=this.customColor?e(this.customColor):null;if(a){const{r:i,g:c,b:t,a:e}=a;this.el.style.backgroundColor=`rgba(${i}, ${c}, ${t}, ${e})`;this.foregroundColour=s((i*299+c*587+t*114)/1e3)}};this.getLabel=()=>this.maxNumber&&Number(this.label)>this.maxNumber?`${this.maxNumber}+`:this.label;this.setAccessibleLabel=()=>{const a=this.el.parentElement;const i=this.isAccessibleLabelDefined()?this.accessibleLabel:this.label||"with badge being displayed";if(a){const{tagName:c}=a;if(c!=="IC-CARD"&&(c!=="IC-TAB"||c==="IC-TAB"&&this.parentAriaLabel)){const c=this.parentAriaLabel?`${this.parentAriaLabel} ,`:"";a.ariaLabel=this.visible?`${c} ${i}`:null}else{this.ariaLabel=`, ${i}`}}};this.setPositionInTopNavigation=()=>{var a;const i=(a=this.el.parentElement)===null||a===void 0?void 0:a.parentElement;(i===null||i===void 0?void 0:i.classList.contains("mobile-mode"))?this.position="inline":this.position="near"};this.isInTopNav=()=>{const a=this.el.parentElement;if(a){const i=a===null||a===void 0?void 0:a.parentElement;return(a===null||a===void 0?void 0:a.tagName)===n&&(i===null||i===void 0?void 0:i.tagName)===h}return false};this.isAccessibleLabelDefined=()=>r(this.accessibleLabel)&&this.accessibleLabel!==null}accessibleLabelHandler(){this.setAccessibleLabel()}customColorHandler(){this.variant==="custom"&&this.setBadgeColour()}variantHandler(){if(this.variant==="custom"){this.setBadgeColour()}}visibleHandler(){this.setAccessibleLabel()}componentWillLoad(){var a;this.variant==="custom"&&this.setBadgeColour();const i=(a=this.el.parentElement)===null||a===void 0?void 0:a.ariaLabel;if(i)this.parentAriaLabel=i;this.setAccessibleLabel()}componentDidLoad(){this.type==="text"&&o([{prop:this.label,propName:"label"}],"Badge")}componentWillRender(){this.isInTopNav()&&this.setPositionInTopNavigation()}navBarMenuOpenHandler(){this.isInTopNav()&&(this.position="inline")}navBarMenuCloseHandler(){this.isInTopNav()&&(this.position="near")}render(){const{ariaLabel:a,el:t,foregroundColour:e,getLabel:s,position:r,size:o,label:d,type:l,variant:n,visible:h,theme:g}=this;return i(c,{key:"26e06624cc8ed1a263175e7c037413ce8b69827c",class:{[`ic-badge-${r}`]:true,[`ic-badge-${o}`]:true,[`ic-badge-${n}`]:true,[`ic-badge-${l}`]:true,[`ic-badge-foreground-${e}`]:e!==null&&n==="custom",[`${h?"ic-badge-show":"ic-badge-hide"}`]:true,[`ic-theme-${g}`]:g!=="inherit"},id:t.id||null,"aria-label":a,role:"status"},l==="icon"&&i("slot",{key:"f646ef81ef5a7e7955d59f5497ed268a6a44ed87",name:"badge-icon"}),l==="text"&&d&&i("ic-typography",{key:"d8b61345c30c6efcf7111684996b2a52ed611d97",variant:o==="small"?"badge-small":"badge"},s()),l==="dot"&&i("span",{key:"a50bb809ae2088b20064f006e3917cc16c052038",class:"sr-only"},"badge"))}static get delegatesFocus(){return true}get el(){return t(this)}static get watchers(){return{accessibleLabel:["accessibleLabelHandler"],customColor:["customColorHandler"],variant:["variantHandler"],visible:["visibleHandler"]}}};g.style=l;export{g as ic_badge};
2
- //# sourceMappingURL=p-1171a945.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["icBadgeCss","IcBadgeStyle0","NAVIGATION_BUTTON","TOP_NAVIGATION","Badge","constructor","hostRef","this","ariaLabel","position","size","theme","type","variant","visible","setBadgeColour","colorRGBA","customColor","convertToRGBA","r","g","b","a","el","style","backgroundColor","foregroundColour","getBrandForegroundAppearance","getLabel","maxNumber","Number","label","setAccessibleLabel","parentEl","parentElement","defaultAriaLabel","isAccessibleLabelDefined","accessibleLabel","tagName","parentAriaLabel","ariaLabelPrefix","setPositionInTopNavigation","parentTopNavEl","_a","classList","contains","isInTopNav","grandparentEl","isPropDefined","accessibleLabelHandler","customColorHandler","variantHandler","visibleHandler","componentWillLoad","componentDidLoad","onComponentRequiredPropUndefined","prop","propName","componentWillRender","navBarMenuOpenHandler","navBarMenuCloseHandler","render","h","Host","key","class","id","role","name"],"sources":["src/components/ic-badge/ic-badge.css?tag=ic-badge&encapsulation=shadow","src/components/ic-badge/ic-badge.tsx"],"sourcesContent":["@media (prefers-reduced-motion: no-preference) {\n :host(.ic-badge-show) {\n animation: expand var(--ic-transition-duration-slow);\n }\n\n :host(.ic-badge-hide) {\n animation: shrink var(--ic-transition-duration-slow);\n }\n}\n\n:host {\n display: flex;\n height: var(--ic-space-md);\n min-width: var(--ic-space-md);\n width: fit-content;\n border-radius: calc(2 * var(--ic-space-xxl));\n position: absolute;\n}\n\n:host ic-typography {\n --ic-typography-color: var(--ic-badge-text);\n}\n\n:host(.ic-badge-neutral) {\n background-color: var(--ic-badge-dark) !important;\n}\n\n:host(.ic-badge-light) ic-typography {\n --ic-typography-color: var(--ic-badge-text-monochrome);\n}\n\n:host(.ic-badge-light) ::slotted(*) {\n fill: var(--ic-badge-icon-monochrome);\n}\n\n:host(.ic-badge-info) {\n background-color: var(--ic-badge-info) !important;\n}\n\n:host(.ic-badge-light) {\n background-color: var(--ic-badge-light) !important;\n}\n\n:host(.ic-badge-warning) {\n background-color: var(--ic-badge-warning) !important;\n}\n\n:host(.ic-badge-warning) ic-typography {\n --ic-typography-color: var(--ic-badge-warning-text);\n}\n\n:host(.ic-badge-warning) ::slotted(*) {\n fill: var(--ic-badge-warning-icon);\n}\n\n:host(.ic-badge-error) {\n background-color: var(--ic-badge-error) !important;\n}\n\n:host(.ic-badge-success) {\n background-color: var(--ic-badge-success) !important;\n}\n\n:host(.ic-badge-small) {\n height: var(--ic-space-sm);\n min-width: var(--ic-space-sm);\n}\n\n:host(.ic-badge-large) {\n height: calc(var(--ic-space-md) + var(--ic-space-xxs));\n min-width: calc(var(--ic-space-md) + var(--ic-space-xxs));\n}\n\n:host(.ic-badge-dot.ic-badge-medium) {\n height: var(--ic-space-xs);\n width: var(--ic-space-xs);\n min-width: var(--ic-space-xs);\n}\n\n:host(.ic-badge-dot.ic-badge-small) {\n height: calc(var(--ic-space-xxs) + var(--ic-space-xxxs));\n width: calc(var(--ic-space-xxs) + var(--ic-space-xxxs));\n min-width: calc(var(--ic-space-xxs) + var(--ic-space-xxxs));\n}\n\n:host(.ic-badge-dot.ic-badge-large) {\n height: var(--ic-space-sm);\n width: var(--ic-space-sm);\n min-width: var(--ic-space-sm);\n}\n\n:host ::slotted(*) {\n fill: var(--ic-badge-icon);\n}\n\n:host(.ic-badge-foreground-dark) ::slotted(*) {\n fill: var(--ic-color-text-primary-light);\n}\n\n:host(.ic-badge-foreground-light) ::slotted(*) {\n fill: white;\n}\n\n:host(.ic-badge-foreground-dark) ic-typography {\n --ic-typography-color: var(--ic-color-text-primary-light);\n}\n\n:host(.ic-badge-foreground-light) ic-typography {\n --ic-typography-color: var(--ic-color-primary-text-dark);\n}\n\n:host(.ic-badge-text) ic-typography {\n align-self: center;\n padding: 0 calc((var(--ic-space-xs) + var(--ic-space-1px)) / 2)\n var(--ic-space-1px);\n}\n\n:host(.ic-badge-text.ic-badge-small) ic-typography {\n padding: 0 0.2132rem;\n}\n\n:host(.ic-badge-text.ic-badge-large) ic-typography {\n padding: 0 calc((var(--ic-space-sm) + var(--ic-space-1px)) / 2)\n var(--ic-space-1px);\n}\n\n:host(.ic-badge-icon) ::slotted(svg) {\n width: var(--ic-space-sm);\n height: var(--ic-space-sm);\n padding: var(--ic-space-xxxs);\n}\n\n:host(.ic-badge-icon.ic-badge-small) ::slotted(svg) {\n width: var(--ic-space-xs);\n height: var(--ic-space-xs);\n}\n\n:host(.ic-badge-icon.ic-badge-large) ::slotted(svg) {\n width: calc(var(--ic-space-sm) + var(--ic-space-xxxs));\n height: calc(var(--ic-space-sm) + var(--ic-space-xxxs));\n padding: calc(var(--ic-space-xxxs) + var(--ic-space-1px));\n}\n\n:host(.ic-badge-far) {\n top: calc(-1 * var(--ic-space-xs));\n right: calc(-1 * var(--ic-space-xs));\n}\n\n:host(.ic-badge-far.ic-badge-small),\n:host(.ic-badge-dot.ic-badge-far.ic-badge-large) {\n top: calc(-1 * var(--ic-space-xxs));\n right: calc(-1 * var(--ic-space-xxs));\n}\n\n:host(.ic-badge-dot.ic-badge-far),\n:host(.ic-badge-dot.ic-badge-far.ic-badge-small) {\n top: calc(-1 * var(--ic-space-xxxs));\n right: calc(-1 * var(--ic-space-xxxs));\n}\n\n:host(.ic-badge-near) {\n top: calc(-1 * calc(var(--ic-space-xxs) + var(--ic-space-1px)));\n right: calc(-1 * calc(var(--ic-space-xxs) + var(--ic-space-1px)));\n}\n\n:host(.ic-badge-dot.ic-badge-near) {\n top: calc(-1 * var(--ic-space-1px));\n right: calc(-1 * var(--ic-space-1px));\n}\n\n:host(.ic-badge-inline) {\n position: static;\n}\n\n:host(.ic-badge-hide) {\n visibility: hidden !important;\n transition: visibility var(--ic-transition-duration-slow);\n}\n\n.sr-only {\n position: absolute;\n left: -9999px;\n}\n\n.sr-only:dir(rtl) {\n right: -9999px;\n}\n\n@keyframes expand {\n from {\n opacity: 0;\n transform: scale(0);\n }\n\n to {\n opacity: 1;\n transform: scale(1);\n }\n}\n\n@keyframes shrink {\n from {\n opacity: 1;\n transform: scale(1);\n }\n\n to {\n opacity: 0;\n transform: scale(0);\n }\n}\n","import {\n Component,\n Element,\n Host,\n Prop,\n Watch,\n h,\n Listen,\n} from \"@stencil/core\";\nimport {\n IcBadgePositions,\n IcBadgeTypes,\n IcBadgeVariants,\n} from \"./ic-badge.types\";\nimport {\n IcSizes,\n IcBrandForeground,\n IcColor,\n IcThemeMode,\n} from \"../../utils/types\";\nimport {\n convertToRGBA,\n getBrandForegroundAppearance,\n isPropDefined,\n onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\n\nconst NAVIGATION_BUTTON = \"IC-NAVIGATION-BUTTON\";\nconst TOP_NAVIGATION = \"IC-TOP-NAVIGATION\";\n\n/**\n * @slot badge-icon - Icon will be rendered inside the badge if type is set to icon.\n */\n@Component({\n tag: \"ic-badge\",\n styleUrl: \"ic-badge.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class Badge {\n private ariaLabel: string | null = null;\n private foregroundColour: IcBrandForeground;\n private parentAriaLabel: string;\n\n @Element() el: HTMLIcBadgeElement;\n\n /**\n * The accessible label of the badge component to provide context for screen reader users.\n */\n @Prop() accessibleLabel?: string;\n\n @Watch(\"accessibleLabel\")\n accessibleLabelHandler(): void {\n this.setAccessibleLabel();\n }\n\n /**\n * The custom badge colour. This will only style the badge component if variant=\"custom\".\n * Can be a hex value e.g. \"#ff0000\", RGB e.g. \"rgb(255, 0, 0)\", or RGBA e.g. \"rgba(255, 0, 0, 1)\".\n */\n @Prop() customColor?: IcColor;\n\n @Watch(\"customColor\")\n customColorHandler(): void {\n this.variant === \"custom\" && this.setBadgeColour();\n }\n\n /**\n * The maximum number shown on the badge appended with a +.\n * This will only be displayed if type=\"text\" and label is not empty.\n */\n @Prop() maxNumber?: number;\n\n /**\n * The positioning of the badge in reference to the parent element.\n */\n @Prop({ mutable: true }) position?: IcBadgePositions = \"far\";\n\n /**\n * The size of the badge to be displayed.\n */\n @Prop() size?: IcSizes = \"medium\";\n\n /**\n * The text displayed in the badge. This will only be displayed if type=\"text\".\n */\n @Prop() label?: string;\n\n /**\n * Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n */\n @Prop() theme?: IcThemeMode = \"inherit\";\n\n /**\n * The type of badge to be displayed.\n */\n @Prop() type?: IcBadgeTypes = \"text\";\n\n /**\n * The variant of the badge to be displayed.\n */\n @Prop() variant?: IcBadgeVariants = \"neutral\";\n\n @Watch(\"variant\")\n variantHandler(): void {\n if (this.variant === \"custom\") {\n this.setBadgeColour();\n }\n }\n\n /**\n * If `true`, the badge will be displayed.\n */\n @Prop() visible?: boolean = true;\n\n @Watch(\"visible\")\n visibleHandler(): void {\n this.setAccessibleLabel();\n }\n\n componentWillLoad(): void {\n this.variant === \"custom\" && this.setBadgeColour();\n\n const ariaLabel = this.el.parentElement?.ariaLabel;\n if (ariaLabel) this.parentAriaLabel = ariaLabel;\n this.setAccessibleLabel();\n }\n\n componentDidLoad(): void {\n this.type === \"text\" &&\n onComponentRequiredPropUndefined(\n [{ prop: this.label, propName: \"label\" }],\n \"Badge\"\n );\n }\n\n componentWillRender(): void {\n this.isInTopNav() && this.setPositionInTopNavigation();\n }\n\n @Listen(\"icNavigationMenuOpened\", { target: \"document\" })\n navBarMenuOpenHandler(): void {\n this.isInTopNav() && (this.position = \"inline\");\n }\n\n @Listen(\"icNavigationMenuClosed\", { target: \"document\" })\n navBarMenuCloseHandler(): void {\n this.isInTopNav() && (this.position = \"near\");\n }\n\n private setBadgeColour = () => {\n const colorRGBA = this.customColor ? convertToRGBA(this.customColor) : null;\n\n if (colorRGBA) {\n const { r, g, b, a } = colorRGBA;\n this.el.style.backgroundColor = `rgba(${r}, ${g}, ${b}, ${a})`;\n this.foregroundColour = getBrandForegroundAppearance(\n (r * 299 + g * 587 + b * 114) / 1000\n );\n }\n };\n\n private getLabel = () =>\n this.maxNumber && Number(this.label) > this.maxNumber\n ? `${this.maxNumber}+`\n : this.label;\n\n // Set aria-label on badge and / or parent element\n // Aria-describedby seems to not work, probably due to shadow DOM\n private setAccessibleLabel = () => {\n const parentEl = this.el.parentElement;\n const defaultAriaLabel = this.isAccessibleLabelDefined()\n ? this.accessibleLabel\n : this.label || \"with badge being displayed\";\n\n if (parentEl) {\n const { tagName } = parentEl;\n if (\n tagName !== \"IC-CARD\" &&\n (tagName !== \"IC-TAB\" || (tagName === \"IC-TAB\" && this.parentAriaLabel))\n ) {\n const ariaLabelPrefix = this.parentAriaLabel\n ? `${this.parentAriaLabel} ,`\n : \"\";\n parentEl.ariaLabel = this.visible\n ? `${ariaLabelPrefix} ${defaultAriaLabel}`\n : null;\n } else {\n this.ariaLabel = `, ${defaultAriaLabel}`;\n }\n }\n };\n\n private setPositionInTopNavigation = () => {\n const parentTopNavEl = this.el.parentElement?.parentElement;\n parentTopNavEl?.classList.contains(\"mobile-mode\")\n ? (this.position = \"inline\")\n : (this.position = \"near\");\n };\n\n private isInTopNav = (): boolean => {\n const parentEl = this.el.parentElement;\n if (parentEl) {\n const grandparentEl = parentEl?.parentElement;\n return (\n parentEl?.tagName === NAVIGATION_BUTTON &&\n grandparentEl?.tagName === TOP_NAVIGATION\n );\n }\n return false;\n };\n\n private isAccessibleLabelDefined = () =>\n isPropDefined(this.accessibleLabel) && this.accessibleLabel !== null;\n\n render() {\n const {\n ariaLabel,\n el,\n foregroundColour,\n getLabel,\n position,\n size,\n label,\n type,\n variant,\n visible,\n theme,\n } = this;\n\n return (\n <Host\n class={{\n [`ic-badge-${position}`]: true,\n [`ic-badge-${size}`]: true,\n [`ic-badge-${variant}`]: true,\n [`ic-badge-${type}`]: true,\n [`ic-badge-foreground-${foregroundColour}`]:\n foregroundColour !== null && variant === \"custom\",\n [`${visible ? \"ic-badge-show\" : \"ic-badge-hide\"}`]: true,\n [`ic-theme-${theme}`]: theme !== \"inherit\",\n }}\n id={el.id || null}\n aria-label={ariaLabel}\n role=\"status\"\n >\n {type === \"icon\" && <slot name=\"badge-icon\"></slot>}\n {type === \"text\" && label && (\n <ic-typography variant={size === \"small\" ? \"badge-small\" : \"badge\"}>\n {getLabel()}\n </ic-typography>\n )}\n {type === \"dot\" && <span class=\"sr-only\">badge</span>}\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -1 +0,0 @@
1
- {"version":3,"names":["icCheckboxGroupCss","IcCheckboxGroupStyle0","CheckboxGroup","constructor","hostRef","this","checkboxSelector","disabled","helperText","hideLabel","required","size","theme","validationStatus","validationText","watchDisabledHandler","removeDisabledFalse","el","labelNameHandler","newValue","oldValue","propName","Array","from","querySelectorAll","forEach","checkbox","groupLabel","name","watchThemeHandler","handleChange","ev","target","tagName","stopImmediatePropagation","componentWillLoad","componentDidLoad","onComponentRequiredPropUndefined","prop","label","selectHandler","checkedOptions","filter","checked","icChange","emit","value","map","opt","textFieldValue","_a","querySelector","selectedOption","render","describedBy","getInputDescribedByText","h","Host","key","class","id","trim","useLabelTag","hasValidationStatus","for","ariaLiveMode","status","message"],"sources":["src/components/ic-checkbox-group/ic-checkbox-group.css?tag=ic-checkbox-group&encapsulation=shadow","src/components/ic-checkbox-group/ic-checkbox-group.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n display: block;\n\n --ic-input-label-text-color: var(--ic-checkbox-group-label);\n --ic-input-label-helper-text-color: var(--ic-checkbox-group-subtitle);\n --ic-input-validation-error: var(--ic-checkbox-state-icon-error);\n --ic-input-validation-status-text-color: var(--ic-checkbox-state-text);\n}\n\n:host(.ic-checkbox-group-disabled) {\n --ic-input-label-text-color: var(--ic-checkbox-group-label-disabled);\n --ic-input-label-helper-text-color: var(\n --ic-checkbox-group-subtitle-disabled\n );\n}\n\nic-input-label.error {\n color: var(--ic-checkbox-group-label-error);\n\n --ic-typography-color: var(--ic-checkbox-group-label-error);\n --ic-input-label-helper-text-color: var(--ic-checkbox-group-subtitle-error);\n}\n\nic-input-label ic-typography {\n margin-bottom: var(--ic-space-sm);\n}\n\n:host(.ic-checkbox-group-small) ic-input-label ic-typography {\n margin-bottom: calc(var(--ic-space-sm) / 2);\n}\n\nic-input-validation {\n margin-top: var(--ic-space-sm);\n}\n\n:host(.ic-checkbox-group-small) ic-input-validation {\n margin-top: calc(var(--ic-space-sm) / 2);\n}\n\n.checkboxes-container {\n margin-bottom: calc(-1 * var(--ic-space-xxs));\n}\n\n:host(.ic-checkbox-group-small) .checkboxes-container {\n margin-bottom: calc(-1 * var(--ic-space-xxxs));\n}\n\n.screen-reader-only-text {\n position: absolute;\n left: -9999px;\n background-color: #fff;\n color: #000;\n text-transform: none;\n}\n\n.screen-reader-only-text:dir(rtl) {\n right: -9999px;\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n Listen,\n Element,\n Event,\n EventEmitter,\n Watch,\n} from \"@stencil/core\";\nimport {\n getInputDescribedByText,\n hasValidationStatus,\n onComponentRequiredPropUndefined,\n removeDisabledFalse,\n} from \"../../utils/helpers\";\nimport {\n IcInformationStatusOrEmpty,\n IcSizes,\n IcThemeMode,\n} from \"../../utils/types\";\nimport { IcChangeEventDetail } from \"./ic-checkbox-group.types\";\n\n@Component({\n tag: \"ic-checkbox-group\",\n styleUrl: \"ic-checkbox-group.css\",\n shadow: true,\n})\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nexport class CheckboxGroup {\n private checkboxSelector: string = \"ic-checkbox\";\n @Element() el: HTMLIcCheckboxGroupElement;\n\n /**\n * If `true`, the checkbox group will be set to the disabled state.\n */\n @Prop() disabled?: boolean = false;\n @Watch(\"disabled\")\n watchDisabledHandler(): void {\n removeDisabledFalse(this.disabled, this.el);\n }\n\n /**\n * The helper text that will be displayed for additional field guidance.\n */\n @Prop() helperText?: string = \"\";\n\n /**\n * If `true`, the label will be hidden and the required label value will be applied as an aria-label.\n */\n @Prop() hideLabel?: boolean = false;\n\n /**\n * The label for the checkbox group to be displayed.\n */\n @Prop() label!: string;\n\n /**\n * The name for the checkbox group to differentiate from other groups.\n */\n @Prop() name!: string;\n\n @Watch(\"label\")\n @Watch(\"name\")\n labelNameHandler(\n newValue: string,\n oldValue: string,\n propName: \"label\" | \"name\"\n ): void {\n Array.from(\n this.el.querySelectorAll<HTMLIcCheckboxElement>(this.checkboxSelector)\n ).forEach((checkbox) => {\n if (propName === \"label\") checkbox.groupLabel = newValue;\n else if (checkbox.name === oldValue) {\n // If the checkbox name has been set by the parent, then override it\n checkbox.name = newValue;\n }\n });\n }\n\n /**\n * If `true`, the checkbox group will require a value.\n */\n @Prop() required?: boolean = false;\n\n /**\n * The size of the checkboxes to be displayed. This does not affect the font size of the label.\n */\n @Prop() size?: IcSizes = \"medium\";\n\n /**\n * Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n */\n @Prop() theme?: IcThemeMode = \"inherit\";\n @Watch(\"theme\")\n watchThemeHandler(newValue: IcThemeMode): void {\n Array.from(\n this.el.querySelectorAll<HTMLIcCheckboxElement>(this.checkboxSelector)\n ).forEach((checkbox) => {\n checkbox.theme = newValue;\n });\n }\n\n /**\n * The validation status - e.g. 'error' | 'warning' | 'success'.\n */\n @Prop() validationStatus?: IcInformationStatusOrEmpty = \"\";\n\n /**\n * The text to display as the validation message.\n */\n @Prop() validationText?: string = \"\";\n\n /**\n * Emitted when a checkbox is checked.\n */\n @Event() icChange: EventEmitter<IcChangeEventDetail>;\n\n @Listen(\"icChange\")\n handleChange(ev: CustomEvent): void {\n //don't pass on the event if it has come from slotted text field\n //otherwise any icChange handler bound to the checkbox group will also run\n if ((ev.target as HTMLElement).tagName === \"IC-TEXT-FIELD\") {\n ev.stopImmediatePropagation();\n }\n }\n\n componentWillLoad(): void {\n removeDisabledFalse(this.disabled, this.el);\n this.watchThemeHandler(this.theme!);\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [\n { prop: this.label, propName: \"label\" },\n { prop: this.name, propName: \"name\" },\n ],\n \"Checkbox Group\"\n );\n }\n\n @Listen(\"icCheck\")\n selectHandler({ target }: CustomEvent): void {\n const checkedOptions = Array.from(\n this.el.querySelectorAll(\"ic-checkbox\")\n ).filter(({ checked, disabled }) => checked && !disabled);\n this.icChange.emit({\n value: checkedOptions.map(({ value }) => value),\n checkedOptions: checkedOptions.map((opt) => ({\n checkbox: opt,\n textFieldValue: opt.querySelector(\"ic-text-field\")?.value,\n })),\n selectedOption: target as HTMLIcCheckboxElement,\n });\n }\n\n render() {\n const {\n disabled,\n helperText,\n hideLabel,\n label,\n name,\n required,\n size,\n theme,\n validationStatus,\n validationText,\n } = this;\n\n const describedBy = getInputDescribedByText(\n name,\n helperText !== \"\",\n validationStatus !== \"\"\n );\n\n return (\n <Host\n class={{\n [`ic-checkbox-group-${size}`]: true,\n [`ic-checkbox-group-disabled`]: !!disabled,\n [`ic-theme-${theme}`]: theme !== \"inherit\",\n }}\n >\n {(validationStatus === \"error\" || required || hideLabel) && (\n <span\n id=\"screenReaderOnlyText\"\n class=\"screen-reader-only-text\"\n aria-hidden=\"true\"\n >\n {label} {validationStatus === \"error\" ? \"invalid data \" : null}{\" \"}\n {required ? \"required\" : null}\n </span>\n )}\n <fieldset\n id={name}\n aria-labelledby={`${\n validationStatus === \"error\" || required || hideLabel\n ? \"screenReaderOnlyText\"\n : \"\"\n } ${describedBy}`.trim()}\n disabled={disabled}\n >\n {!hideLabel && (\n <legend>\n <ic-input-label\n class={{ [`${validationStatus}`]: true }}\n label={label}\n helperText={helperText}\n required={required}\n disabled={disabled}\n useLabelTag={false}\n ></ic-input-label>\n </legend>\n )}\n <div class=\"checkboxes-container\">\n <slot></slot>\n </div>\n </fieldset>\n {hasValidationStatus(validationStatus, disabled) && (\n <ic-input-validation\n for={name}\n ariaLiveMode=\"polite\"\n status={validationStatus}\n message={validationText!}\n ></ic-input-validation>\n )}\n </Host>\n );\n }\n}\n"],"mappings":"oHAAA,MAAMA,EAAqB,2nHAC3B,MAAAC,EAAeD,E,MC6BFE,EAAa,MAN1B,WAAAC,CAAAC,G,6CAOUC,KAAAC,iBAA2B,cAM3BD,KAAAE,SAAqB,MASrBF,KAAAG,WAAsB,GAKtBH,KAAAI,UAAsB,MAiCtBJ,KAAAK,SAAqB,MAKrBL,KAAAM,KAAiB,SAKjBN,KAAAO,MAAsB,UAatBP,KAAAQ,iBAAgD,GAKhDR,KAAAS,eAA0B,E,CAzElC,oBAAAC,GACEC,EAAoBX,KAAKE,SAAUF,KAAKY,G,CAyB1C,gBAAAC,CACEC,EACAC,EACAC,GAEAC,MAAMC,KACJlB,KAAKY,GAAGO,iBAAwCnB,KAAKC,mBACrDmB,SAASC,IACT,GAAIL,IAAa,QAASK,EAASC,WAAaR,OAC3C,GAAIO,EAASE,OAASR,EAAU,CAEnCM,EAASE,KAAOT,C,KAoBtB,iBAAAU,CAAkBV,GAChBG,MAAMC,KACJlB,KAAKY,GAAGO,iBAAwCnB,KAAKC,mBACrDmB,SAASC,IACTA,EAASd,MAAQO,CAAQ,G,CAoB7B,YAAAW,CAAaC,GAGX,GAAKA,EAAGC,OAAuBC,UAAY,gBAAiB,CAC1DF,EAAGG,0B,EAIP,iBAAAC,GACEnB,EAAoBX,KAAKE,SAAUF,KAAKY,IACxCZ,KAAKwB,kBAAkBxB,KAAKO,M,CAG9B,gBAAAwB,GACEC,EACE,CACE,CAAEC,KAAMjC,KAAKkC,MAAOlB,SAAU,SAC9B,CAAEiB,KAAMjC,KAAKuB,KAAMP,SAAU,SAE/B,iB,CAKJ,aAAAmB,EAAcR,OAAEA,IACd,MAAMS,EAAiBnB,MAAMC,KAC3BlB,KAAKY,GAAGO,iBAAiB,gBACzBkB,QAAO,EAAGC,UAASpC,cAAeoC,IAAYpC,IAChDF,KAAKuC,SAASC,KAAK,CACjBC,MAAOL,EAAeM,KAAI,EAAGD,WAAYA,IACzCL,eAAgBA,EAAeM,KAAKC,I,MAAQ,OAC1CtB,SAAUsB,EACVC,gBAAgBC,EAAAF,EAAIG,cAAc,oBAAgB,MAAAD,SAAA,SAAAA,EAAEJ,MACrD,IACDM,eAAgBpB,G,CAIpB,MAAAqB,GACE,MAAM9C,SACJA,EAAQC,WACRA,EAAUC,UACVA,EAAS8B,MACTA,EAAKX,KACLA,EAAIlB,SACJA,EAAQC,KACRA,EAAIC,MACJA,EAAKC,iBACLA,EAAgBC,eAChBA,GACET,KAEJ,MAAMiD,EAAcC,EAClB3B,EACApB,IAAe,GACfK,IAAqB,IAGvB,OACE2C,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACL,CAAC,qBAAqBhD,KAAS,KAC/B,CAAC,gCAAiCJ,EAClC,CAAC,YAAYK,KAAUA,IAAU,aAGjCC,IAAqB,SAAWH,GAAYD,IAC5C+C,EAAA,QAAAE,IAAA,2CACEE,GAAG,uBACHD,MAAM,0BAAyB,cACnB,QAEXpB,EAAK,IAAG1B,IAAqB,QAAU,gBAAkB,KAAM,IAC/DH,EAAW,WAAa,MAG7B8C,EAAA,YAAAE,IAAA,2CACEE,GAAIhC,EAAI,kBACS,GACff,IAAqB,SAAWH,GAAYD,EACxC,uBACA,MACF6C,IAAcO,OAClBtD,SAAUA,IAERE,GACA+C,EAAA,UAAAE,IAAA,4CACEF,EAAA,kBAAAE,IAAA,2CACEC,MAAO,CAAE,CAAC,GAAG9C,KAAqB,MAClC0B,MAAOA,EACP/B,WAAYA,EACZE,SAAUA,EACVH,SAAUA,EACVuD,YAAa,SAInBN,EAAA,OAAAE,IAAA,2CAAKC,MAAM,wBACTH,EAAA,QAAAE,IAAA,+CAGHK,EAAoBlD,EAAkBN,IACrCiD,EAAA,uBAAAE,IAAA,2CACEM,IAAKpC,EACLqC,aAAa,SACbC,OAAQrD,EACRsD,QAASrD,I","ignoreList":[]}
@@ -1 +0,0 @@
1
- {"version":3,"names":["icDividerCss","IcDividerStyle0","Divider","constructor","hostRef","this","foregroundColor","getBrandForegroundAppearance","borderStyle","labelPlacement","monochrome","orientation","theme","weight","brandChangeHandler","ev","detail","mode","updateMonochromeState","parentEl","el","parentElement","isBottomSideNav","classList","contains","isBottomWrapper","_a","tagName","add","componentWillRender","render","label","invalidPropCombination","placement","console","error","charAt","toUpperCase","slice","getTypographyVariant","renderLabel","slotHasContent","h","class","name","isPropDefined","variant","Host","Object","assign","role"],"sources":["src/components/ic-divider/ic-divider.css?tag=ic-divider&encapsulation=scoped","src/components/ic-divider/ic-divider.tsx"],"sourcesContent":["/**\n * @prop --ic-divider-vertical-height: The height of a vertical divider. The default value is `inherit`. \n */\n/**\n * @prop --ic-divider-horizontal-width: The width of a horizontal divider. The default value is `inherit`.\n */\n/**\n * @prop --ic-divider-label-width: The max-width of the divider label. When orientation is set to `horizontal`, the default value is `max(20rem, 60%)`. When orientation is set to `vertical`, the default value is `20 rem`.\n */\n\n/* IC-DIVIDER COLORS */\n/**\n * @internal @prop --ic-divider-background\n */\n/**\n * @internal @prop --ic-divider-background-monochrome\n */\n/**\n * @internal @prop --ic-divider-label\n */\n/**\n * @internal @prop --ic-divider-label-monochrome\n */\n\n/* Horizontal Divider */\n:host(.ic-divider-horizontal) {\n display: flex;\n width: var(--ic-divider-horizontal-width, 100%);\n align-items: center;\n -moz-column-gap: var(--ic-space-xxs);\n column-gap: var(--ic-space-xxs);\n}\n\nhr {\n padding: 0;\n margin: 0;\n border: none;\n border-bottom: solid var(--ic-space-1px) var(--ic-divider-background);\n width: inherit;\n}\n\n:host(.ic-divider-horizontal)::before,\n:host(.ic-divider-horizontal)::after {\n border-left: none !important;\n}\n\n:host(.ic-divider-horizontal[label-placement=\"right\"])::before,\n:host(.ic-divider-horizontal[label-placement=\"center\"])::before,\n:host(.ic-divider-horizontal[label-placement=\"left\"])::after,\n:host(.ic-divider-horizontal[label-placement=\"center\"])::after {\n content: \"\";\n border: none;\n width: 100%;\n}\n\n/* Vertical Divider */\n:host(.ic-divider-vertical) {\n display: flex;\n flex-direction: column;\n height: var(--ic-divider-vertical-height, inherit);\n width: -moz-max-content;\n width: max-content;\n align-items: center;\n -moz-column-gap: var(--ic-space-xxs);\n column-gap: var(--ic-space-xxs);\n border: none;\n}\n\n:host(.ic-divider-vertical) div.vertical-divider {\n display: flex;\n height: inherit;\n}\n\n:host(.ic-divider-vertical[label-placement=\"bottom\"])::before,\n:host(.ic-divider-vertical[label-placement=\"center\"])::before,\n:host(.ic-divider-vertical[label-placement=\"top\"])::after,\n:host(.ic-divider-vertical[label-placement=\"center\"])::after {\n content: \"\";\n height: 100%;\n}\n\n/* Theme */\nhr,\n:host(.ic-divider-horizontal)[label-placement=\"right\"]::before,\n:host(.ic-divider-horizontal[label-placement=\"center\"])::before,\n:host(.ic-divider-horizontal[label-placement=\"left\"])::after,\n:host(.ic-divider-horizontal[label-placement=\"center\"])::after {\n border-bottom: solid var(--ic-space-1px) var(--ic-divider-background);\n}\n\n:host(.ic-divider-monochrome) hr,\n:host(.ic-divider-monochrome.ic-divider-horizontal)[label-placement=\"right\"]::before,\n:host(.ic-divider-monochrome.ic-divider-horizontal[label-placement=\"center\"])::before,\n:host(.ic-divider-monochrome.ic-divider-horizontal[label-placement=\"left\"])::after,\n:host(.ic-divider-monochrome.ic-divider-horizontal[label-placement=\"center\"])::after {\n border-bottom-color: var(--ic-divider-background-monochrome);\n}\n\n:host() div.vertical-divider,\n:host(.ic-divider-vertical[label-placement=\"bottom\"])::before,\n:host(.ic-divider-vertical[label-placement=\"center\"])::before,\n:host(.ic-divider-vertical[label-placement=\"top\"])::after,\n:host(.ic-divider-vertical[label-placement=\"center\"])::after {\n border-left: solid var(--ic-space-1px) var(--ic-divider-background);\n}\n\n:host(.ic-divider-monochrome) div.vertical-divider,\n:host(.ic-divider-monochrome.ic-divider-vertical[label-placement=\"bottom\"])::before,\n:host(.ic-divider-monochrome.ic-divider-vertical[label-placement=\"center\"])::before,\n:host(.ic-divider-monochrome.ic-divider-vertical[label-placement=\"top\"])::after,\n:host(.ic-divider-monochrome.ic-divider-vertical[label-placement=\"center\"])::after {\n border-left-color: var(--ic-divider-background-monochrome);\n}\n\n/* Divider in ic-side-navigation */\n:host(.ic-side-navigation-keyline.ic-theme-dark) {\n --ic-side-navigation-keyline: var(--ic-state-layer-lighten-20);\n}\n\n:host(.ic-side-navigation-keyline.ic-theme-light) {\n --ic-side-navigation-keyline: var(--ic-state-layer-darken-20);\n}\n\n:host(.ic-side-navigation-keyline.ic-theme-dark) hr,\n:host(.ic-side-navigation-keyline.ic-theme-dark.ic-divider-horizontal)[label-placement=\"right\"]::before,\n:host(.ic-side-navigation-keyline.ic-theme-dark.ic-divider-horizontal[label-placement=\"center\"])::before,\n:host(.ic-side-navigation-keyline.ic-theme-dark.ic-divider-horizontal[label-placement=\"left\"])::after,\n:host(.ic-side-navigation-keyline.ic-theme-dark.ic-divider-horizontal[label-placement=\"center\"])::after {\n border-bottom-color: var(--ic-side-navigation-keyline);\n}\n\n:host(.ic-side-navigation-keyline.ic-theme-dark) div.vertical-divider,\n:host(.ic-side-navigation-keyline.ic-theme-dark.ic-divider-vertical[label-placement=\"bottom\"])::before,\n:host(.ic-side-navigation-keyline.ic-theme-dark.ic-divider-vertical[label-placement=\"center\"])::before,\n:host(.ic-side-navigation-keyline.ic-theme-dark.ic-divider-vertical[label-placement=\"top\"])::after,\n:host(.ic-side-navigation-keyline.ic-theme-dark.ic-divider-vertical[label-placement=\"center\"])::after {\n border-left-color: var(--ic-side-navigation-keyline);\n}\n\n:host(.ic-side-navigation-keyline.ic-theme-light) hr,\n:host(.ic-side-navigation-keyline.ic-theme-light.ic-divider-horizontal)[label-placement=\"right\"]::before,\n:host(.ic-side-navigation-keyline.ic-theme-light.ic-divider-horizontal[label-placement=\"center\"])::before,\n:host(.ic-side-navigation-keyline.ic-theme-light.ic-divider-horizontal[label-placement=\"left\"])::after,\n:host(.ic-side-navigation-keyline.ic-theme-light.ic-divider-horizontal[label-placement=\"center\"])::after {\n border-bottom-color: var(--ic-side-navigation-keyline);\n}\n\n:host(.ic-side-navigation-keyline.ic-theme-light) div.vertical-divider,\n:host(.ic-side-navigation-keyline.ic-theme-light.ic-divider-vertical[label-placement=\"bottom\"])::before,\n:host(.ic-side-navigation-keyline.ic-theme-light.ic-divider-vertical[label-placement=\"center\"])::before,\n:host(.ic-side-navigation-keyline.ic-theme-light.ic-divider-vertical[label-placement=\"top\"])::after,\n:host(.ic-side-navigation-keyline.ic-theme-light.ic-divider-vertical[label-placement=\"center\"])::after {\n border-left-color: var(--ic-divider-background-monochrome);\n}\n\n/* Weight */\n:host(.ic-divider-very-thick) hr,\n:host(.ic-divider-very-thick[label-placement=\"right\"])::before,\n:host(.ic-divider-very-thick[label-placement=\"center\"])::before,\n:host(.ic-divider-very-thick[label-placement=\"left\"])::after,\n:host(.ic-divider-very-thick[label-placement=\"center\"])::after {\n border-bottom-width: var(--ic-space-xs);\n}\n\n:host(.ic-divider-very-thick) .vertical-divider,\n:host(.ic-divider-very-thick[label-placement=\"bottom\"])::before,\n:host(.ic-divider-very-thick[label-placement=\"center\"])::before,\n:host(.ic-divider-very-thick[label-placement=\"top\"])::after,\n:host(.ic-divider-very-thick[label-placement=\"center\"])::after {\n border-left-width: var(--ic-space-xs);\n}\n\n:host(.ic-divider-thick) hr,\n:host(.ic-divider-thick[label-placement=\"right\"])::before,\n:host(.ic-divider-thick[label-placement=\"center\"])::before,\n:host(.ic-divider-thick[label-placement=\"left\"])::after,\n:host(.ic-divider-thick[label-placement=\"center\"])::after {\n border-bottom-width: var(--ic-space-xxs);\n}\n\n:host(.ic-divider-thick) .vertical-divider,\n:host(.ic-divider-thick[label-placement=\"bottom\"])::before,\n:host(.ic-divider-thick[label-placement=\"center\"])::before,\n:host(.ic-divider-thick[label-placement=\"top\"])::after,\n:host(.ic-divider-thick[label-placement=\"center\"])::after {\n border-left-width: var(--ic-space-xxs);\n}\n\n:host(.ic-divider-medium) hr,\n:host(.ic-divider-medium[label-placement=\"right\"])::before,\n:host(.ic-divider-medium[label-placement=\"center\"])::before,\n:host(.ic-divider-medium[label-placement=\"left\"])::after,\n:host(.ic-divider-medium[label-placement=\"center\"])::after {\n border-bottom-width: var(--ic-space-xxxs);\n}\n\n:host(.ic-divider-medium) .vertical-divider,\n:host(.ic-divider-medium[label-placement=\"bottom\"])::before,\n:host(.ic-divider-medium[label-placement=\"center\"])::before,\n:host(.ic-divider-medium[label-placement=\"top\"])::after,\n:host(.ic-divider-medium[label-placement=\"center\"])::after {\n border-left-width: var(--ic-space-xxxs);\n}\n\n:host(.ic-divider-thin) hr,\n:host(.ic-divider-thin[label-placement=\"right\"])::before,\n:host(.ic-divider-thin[label-placement=\"center\"])::before,\n:host(.ic-divider-thin[label-placement=\"left\"])::after,\n:host(.ic-divider-thin[label-placement=\"center\"])::after {\n border-bottom-width: var(--ic-space-1px);\n}\n\n:host(.ic-divider-thin) .vertical-divider,\n:host(.ic-divider-thin[label-placement=\"bottom\"])::before,\n:host(.ic-divider-thin.ic-divider-vertical[label-placement=\"center\"])::before,\n:host(.ic-divider-thin[label-placement=\"top\"])::after,\n:host(.ic-divider-thin.ic-divider-vertical[label-placement=\"center\"])::after {\n border-left-width: var(--ic-space-1px);\n}\n\n/* Border styling */\n:host(.ic-divider-dashed) hr,\n:host(.ic-divider-dashed[label-placement=\"right\"])::before,\n:host(.ic-divider-dashed[label-placement=\"center\"])::before,\n:host(.ic-divider-dashed[label-placement=\"left\"])::after,\n:host(.ic-divider-dashed[label-placement=\"center\"])::after {\n border-bottom-style: dashed;\n}\n\n:host(.ic-divider-dashed) .vertical-divider,\n:host(.ic-divider-dashed[label-placement=\"bottom\"])::before,\n:host(.ic-divider-dashed[label-placement=\"center\"])::before,\n:host(.ic-divider-dashed[label-placement=\"top\"])::after,\n:host(.ic-divider-dashed[label-placement=\"center\"])::after {\n border-left-style: dashed;\n}\n\n/* Label styling */\n:host() .ic-divider-label {\n text-wrap: wrap;\n text-align: left;\n width: -moz-max-content;\n width: max-content;\n max-width: var(--ic-divider-label-width, max(20rem, 60%));\n}\n\n:host(.ic-divider-horizontal[label-placement=\"center\"]) .ic-divider-label {\n text-align: center;\n}\n\n:host(.ic-divider-vertical) .ic-divider-label {\n text-align: center;\n}\n\n:host() .ic-divider-label-container {\n width: -moz-max-content;\n width: max-content;\n max-width: var(--ic-divider-label-width, max(20rem, 60%));\n}\n\n:host(.ic-divider-vertical) .ic-divider-label {\n max-width: var(--ic-divider-label-width, 20rem);\n}\n\n:host(.ic-divider-vertical) .ic-divider-label-container {\n max-width: var(--ic-divider-label-width, 20rem);\n}\n\n:host() .ic-divider-label p {\n width: -moz-max-content;\n width: max-content;\n max-width: 100%;\n}\n\n:host() .ic-divider-label,\n:host() ::slotted(*) {\n color: var(--ic-divider-label);\n}\n\n:host(.ic-divider-monochrome) .ic-divider-label,\n:host(.ic-divider-monochrome) ::slotted(*) {\n color: var(--ic-divider-label-monochrome);\n}\n\n/* High contrast */\n@media (forced-colors: active) {\n hr,\n :host(.ic-divider-horizontal[label-placement=\"right\"])::before,\n :host(.ic-divider-horizontal[label-placement=\"center\"])::before,\n :host(.ic-divider-horizontal[label-placement=\"left\"])::after,\n :host(.ic-divider-horizontal[label-placement=\"center\"])::after {\n border-bottom-color: transparent;\n }\n\n :host() div.vertical-divider,\n :host(.ic-divider-vertical[label-placement=\"bottom\"])::before,\n :host(.ic-divider-vertical[label-placement=\"center\"])::before,\n :host(.ic-divider-vertical[label-placement=\"top\"])::after,\n :host(.ic-divider-vertical[label-placement=\"center\"])::after {\n border-left-color: transparent;\n }\n}\n","import {\n h,\n Component,\n Host,\n Listen,\n State,\n Prop,\n Element,\n} from \"@stencil/core\";\n\nimport {\n getBrandForegroundAppearance,\n isPropDefined,\n slotHasContent,\n} from \"../../utils/helpers\";\n\nimport {\n IcBrand,\n IcOrientation,\n IcBrandForeground,\n IcThemeMode,\n} from \"../../utils/types\";\n\nimport {\n IcDividerLabelPlacement,\n IcDividerStyles,\n IcDividerWeights,\n} from \"./ic-divider.types\";\n\n@Component({\n tag: \"ic-divider\",\n styleUrl: \"ic-divider.css\",\n scoped: true,\n})\nexport class Divider {\n @Element() el: HTMLIcDividerElement;\n\n @State() foregroundColor: IcBrandForeground = getBrandForegroundAppearance();\n\n /**\n * The line style of the divider.\n */\n @Prop() borderStyle?: IcDividerStyles = \"solid\";\n\n /**\n * The label for the divider. The label placement will need to be set for the label to be displayed correctly.\n */\n @Prop() label?: string;\n\n /**\n * The position the label is placed on the divider. `Left` and `right` placement is only applicable when orientation is set to `horizontal`. `Top` and `bottom` placement is only applicable when orientation is set to `vertical`. `Center` placement is applicable for both orientations.\n */\n @Prop() labelPlacement?: IcDividerLabelPlacement = \"center\";\n\n /** If `true`, the divider will be displayed in a grey colour. */\n @Prop() monochrome?: boolean = false;\n\n /**\n * The orientation of the divider.\n */\n @Prop() orientation?: IcOrientation = \"horizontal\";\n\n /**\n * Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n */\n @Prop({ mutable: true }) theme?: IcThemeMode | IcBrandForeground = \"inherit\";\n\n /**\n * The thickness of the divider.\n */\n @Prop() weight?: IcDividerWeights = \"thin\";\n\n @Listen(\"brandChange\", { target: \"document\" })\n brandChangeHandler(ev: CustomEvent<IcBrand>): void {\n this.foregroundColor = ev.detail.mode;\n }\n\n private updateMonochromeState(): void {\n const parentEl = this.el.parentElement;\n if (parentEl) {\n const isBottomSideNav = parentEl.classList.contains(\"bottom-side-nav\");\n const isBottomWrapper =\n parentEl.parentElement?.classList.contains(\"bottom-wrapper\");\n\n if (\n parentEl.tagName === \"IC-SIDE-NAVIGATION\" ||\n (isBottomSideNav && isBottomWrapper)\n ) {\n this.el.classList.add(\"ic-side-navigation-keyline\");\n if (this.foregroundColor === \"light\") {\n this.theme = \"dark\";\n } else {\n this.theme = \"light\";\n }\n }\n }\n }\n\n componentWillRender(): void {\n this.updateMonochromeState();\n }\n\n render() {\n const {\n borderStyle,\n label,\n labelPlacement,\n monochrome,\n orientation,\n weight,\n } = this;\n\n const { theme } = this;\n\n const invalidPropCombination = (\n placement: IcDividerLabelPlacement\n ): void => {\n console.error(\n `${\n placement.charAt(0).toUpperCase() + placement.slice(1)\n } label placement is not applicable for a ${orientation} ic-divider (web-components) / IcDivider (react)`\n );\n };\n\n if (\n ((labelPlacement === \"left\" || labelPlacement === \"right\") &&\n orientation === \"vertical\") ||\n ((labelPlacement === \"top\" || labelPlacement === \"bottom\") &&\n orientation === \"horizontal\")\n ) {\n invalidPropCombination(labelPlacement);\n }\n\n const getTypographyVariant = (weight: string) => {\n switch (weight) {\n case \"very-thick\":\n return \"h4\";\n case \"thick\":\n return \"subtitle-large\";\n default:\n return \"label\";\n }\n };\n\n const renderLabel = () => {\n if (slotHasContent(this.el, \"label\")) {\n return (\n <div class=\"ic-divider-label-container\">\n <slot name=\"label\"></slot>\n </div>\n );\n } else if (isPropDefined(label)) {\n return (\n <ic-typography\n class=\"ic-divider-label\"\n variant={getTypographyVariant(weight!)}\n >\n <p>{label}</p>\n </ic-typography>\n );\n }\n return null;\n };\n\n return (\n <Host\n class={{\n [`ic-theme-${theme}`]: theme !== \"inherit\",\n [`ic-divider-monochrome`]: !!monochrome,\n [`ic-divider-${orientation}`]: true,\n [`ic-divider-${weight}`]: true,\n [`ic-divider-${borderStyle}`]: true,\n }}\n {...((orientation === \"vertical\" ||\n (!!renderLabel() && !!isPropDefined(labelPlacement))) && {\n \"aria-orientation\": orientation,\n role: \"separator\",\n })}\n >\n {orientation === \"horizontal\" &&\n (!renderLabel() || !isPropDefined(labelPlacement)) && <hr />}\n {!!isPropDefined(labelPlacement) && !!renderLabel() && renderLabel()}\n {orientation === \"vertical\" &&\n (!renderLabel() || !isPropDefined(labelPlacement)) && (\n <div class=\"vertical-divider\"></div>\n )}\n </Host>\n );\n }\n}\n"],"mappings":"2GAAA,MAAMA,EAAe,8uWACrB,MAAAC,EAAeD,E,MCiCFE,EAAO,MALpB,WAAAC,CAAAC,G,UAQWC,KAAAC,gBAAqCC,IAKtCF,KAAAG,YAAgC,QAUhCH,KAAAI,eAA2C,SAG3CJ,KAAAK,WAAuB,MAKvBL,KAAAM,YAA8B,aAKbN,KAAAO,MAA0C,UAK3DP,KAAAQ,OAA4B,M,CAGpC,kBAAAC,CAAmBC,GACjBV,KAAKC,gBAAkBS,EAAGC,OAAOC,I,CAG3B,qBAAAC,G,MACN,MAAMC,EAAWd,KAAKe,GAAGC,cACzB,GAAIF,EAAU,CACZ,MAAMG,EAAkBH,EAASI,UAAUC,SAAS,mBACpD,MAAMC,GACJC,EAAAP,EAASE,iBAAa,MAAAK,SAAA,SAAAA,EAAEH,UAAUC,SAAS,kBAE7C,GACEL,EAASQ,UAAY,sBACpBL,GAAmBG,EACpB,CACApB,KAAKe,GAAGG,UAAUK,IAAI,8BACtB,GAAIvB,KAAKC,kBAAoB,QAAS,CACpCD,KAAKO,MAAQ,M,KACR,CACLP,KAAKO,MAAQ,O,IAMrB,mBAAAiB,GACExB,KAAKa,uB,CAGP,MAAAY,GACE,MAAMtB,YACJA,EAAWuB,MACXA,EAAKtB,eACLA,EAAcC,WACdA,EAAUC,YACVA,EAAWE,OACXA,GACER,KAEJ,MAAMO,MAAEA,GAAUP,KAElB,MAAM2B,EACJC,IAEAC,QAAQC,MACN,GACEF,EAAUG,OAAO,GAAGC,cAAgBJ,EAAUK,MAAM,8CACV3B,oDAC7C,EAGH,IACIF,IAAmB,QAAUA,IAAmB,UAChDE,IAAgB,aAChBF,IAAmB,OAASA,IAAmB,WAC/CE,IAAgB,aAClB,CACAqB,EAAuBvB,E,CAGzB,MAAM8B,EAAwB1B,IAC5B,OAAQA,GACN,IAAK,aACH,MAAO,KACT,IAAK,QACH,MAAO,iBACT,QACE,MAAO,Q,EAIb,MAAM2B,EAAc,KAClB,GAAIC,EAAepC,KAAKe,GAAI,SAAU,CACpC,OACEsB,EAAA,OAAKC,MAAM,8BACTD,EAAA,QAAME,KAAK,U,MAGV,GAAIC,EAAcd,GAAQ,CAC/B,OACEW,EAAA,iBACEC,MAAM,mBACNG,QAASP,EAAqB1B,IAE9B6B,EAAA,SAAIX,G,CAIV,OAAO,IAAI,EAGb,OACEW,EAACK,EAAIC,OAAAC,OAAA,CACHN,MAAO,CACL,CAAC,YAAY/B,KAAUA,IAAU,UACjC,CAAC,2BAA4BF,EAC7B,CAAC,cAAcC,KAAgB,KAC/B,CAAC,cAAcE,KAAW,KAC1B,CAAC,cAAcL,KAAgB,QAE3BG,IAAgB,cACjB6B,OAAmBK,EAAcpC,KAAqB,CACzD,mBAAoBE,EACpBuC,KAAM,cAGPvC,IAAgB,gBACb6B,MAAkBK,EAAcpC,KAAoBiC,EAAA,aACrDG,EAAcpC,MAAqB+B,KAAiBA,IACtD7B,IAAgB,cACb6B,MAAkBK,EAAcpC,KAChCiC,EAAA,OAAKC,MAAM,qB","ignoreList":[]}
@@ -1,2 +0,0 @@
1
- import{r as e,c as i,h as c,H as a,g as t}from"./p-8e4e97b4.js";import{r,j as o,b as n,k as d,d as s,l,m as b,i as h}from"./p-ed8957da.js";const m='/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host(.ic-checkbox-disabled){pointer-events:none}.container{display:flex;width:-moz-fit-content;width:fit-content;padding:var(--ic-space-xxs) 0 var(--ic-space-xxs) var(--ic-space-xxs);margin-bottom:var(--ic-space-xxs);align-items:center}:host(.ic-data-table-checkbox) .container{padding:0;margin-bottom:0}:host(.ic-checkbox-small) .container{margin-bottom:var(--ic-space-xxxs)}.checkbox{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:block;position:relative;top:0;left:0;height:var(--ic-space-lg);width:var(--ic-space-lg);background-color:var(--ic-checkbox-background-unselected);border:var(--ic-border-width) solid var(--ic-checkbox-border-unselected);border-radius:var(--ic-border-radius);outline:none;cursor:pointer;transition:var(--ic-easing-transition-fast);flex-shrink:0}:host .container svg{width:var(--ic-space-lg);height:var(--ic-space-lg)}:host(.ic-checkbox-small) .checkbox,:host(.ic-checkbox-small) .container svg{width:var(--ic-space-md);height:var(--ic-space-md)}:host(.ic-checkbox-large) .checkbox,:host(.ic-checkbox-large) .container svg{width:var(--ic-space-xl);height:var(--ic-space-xl)}.checkbox:checked{background-color:var(--ic-checkbox-background-selected);border:var(--ic-border-width) solid var(--ic-checkbox-background-selected);transition:var(--ic-easing-transition-slow)}.checkbox:checked:disabled{background-color:var(--ic-checkbox-background-selected-disabled);border:var(--ic-border-width) solid\n var(--ic-checkbox-background-selected-disabled)}.checkbox:indeterminate,.checkbox.indeterminate:checked{background-color:var(--ic-checkbox-background-indeterminate);border:0.125rem solid var(--ic-checkbox-background-indeterminate)}.checkbox:indeterminate:disabled,.checkbox.indeterminate:checked:disabled{background-color:var(--ic-checkbox-background-indeterminate-disabled);border:0.125rem solid var(--ic-checkbox-background-indeterminate-disabled)}.checkbox:checked:hover{background-color:var(--ic-checkbox-background-selected-hover)}.checkbox:indeterminate:hover,.checkbox.indeterminate:checked:hover{background-color:var(--ic-checkbox-background-indeterminate-hover);border:0.125rem solid var(--ic-checkbox-background-indeterminate-hover)}.checkbox:checked:active{background-color:var(--ic-checkbox-background-selected-pressed)}.checkbox:indeterminate:active,.checkbox.indeterminate:checked:active{background-color:var(--ic-checkbox-background-indeterminate-pressed);border:0.125rem solid var(--ic-checkbox-background-indeterminate-pressed)}.checkbox:hover{box-shadow:0 0 0 0.25rem var(--ic-checkbox-action-background-hover);border:var(--ic-border-width) solid\n var(--ic-checkbox-border-unselected-hover)}.checkbox:active{box-shadow:0 0 0 0.25rem var(--ic-checkbox-action-background-pressed);border:var(--ic-border-width) solid\n var(--ic-checkbox-border-unselected-pressed)}.checkbox:focus{box-shadow:var(--ic-border-focus)}.checkbox:disabled{border:var(--ic-border-width) dashed\n var(--ic-checkbox-border-unselected-disabled)}.checkbox-label{padding-left:var(--ic-space-sm);color:var(--ic-checkbox-text);--ic-typography-color:var(--ic-checkbox-text)}:host(.ic-checkbox-disabled) .checkbox-label{color:var(--ic-checkbox-text-disabled);--ic-typography-color:var(--ic-checkbox-text-disabled)}.checkbox-label:hover{cursor:pointer}.checkmark{position:relative;right:calc(-1 * var(--ic-space-lg));margin-left:calc(-1 * var(--ic-space-lg));fill:var(--ic-checkbox-icon-pressed);z-index:1;background-color:transparent;pointer-events:none;flex-shrink:0}:host(.ic-checkbox-small) .checkmark{margin-left:calc(-1 * var(--ic-space-md));right:calc(-1 * var(--ic-space-md))}:host(.ic-checkbox-large) .checkmark{margin-left:calc(-1 * var(--ic-space-xl));right:calc(-1 * var(--ic-space-xl))}.indeterminate-symbol{position:relative;width:0.875rem;height:var(--ic-space-xxxs);right:-1.188rem;margin-left:-0.875rem;z-index:1;background-color:var(--ic-checkbox-icon-indeterminate);pointer-events:none;flex-shrink:0}:host(.ic-checkbox-small) .indeterminate-symbol{width:0.6rem;right:-0.8rem;margin-left:-0.6rem}:host(.ic-checkbox-large) .indeterminate-symbol{width:1.25rem;right:-1.625rem;margin-left:-1.25rem}.additional-field-wrapper{margin-left:calc(var(--ic-space-md) + var(--ic-space-lg));margin-top:calc(var(--ic-space-sm) / 2)}.branch-corner{height:var(--ic-space-md);width:var(--ic-space-xl);border-radius:0 0 0 0.188rem;border-bottom:0.125rem solid var(--ic-checkbox-required-bar);border-left:0.125rem solid var(--ic-checkbox-required-bar)}.dynamic-container{display:flex;position:relative;margin:var(--ic-space-xxxs) 0 var(--ic-space-xxs) var(--ic-space-md);gap:var(--ic-space-xs)}.dynamic-text{color:var(--ic-checkbox-required-text);--ic-typography-color:var(--ic-checkbox-required-text);margin-top:calc(var(--ic-space-sm) / 2);margin-bottom:var(--ic-space-xs);border-radius:2%}@media (max-width: 576px){::slotted(ic-text-field){--input-width:100%}}@media (forced-colors: active){.checkbox{-webkit-appearance:revert;-moz-appearance:revert;appearance:revert;transition:none}.checkbox:checked{transition:none}.checkbox:focus-visible{outline:0.125rem solid highlight}.checkbox:disabled:not(:checked){-webkit-appearance:none;-moz-appearance:none;appearance:none;border-color:GrayText}.checkmark{fill:none}.indeterminate-symbol{display:none}}.checkmark:dir(rtl){right:0}.checkbox-label:dir(rtl){padding-right:var(--ic-space-sm);padding-left:0}.indeterminate-symbol:dir(rtl){right:0.288rem}.branch-corner:dir(rtl){border-radius:0 0 0.188rem 0;border-right:0.125rem solid var(--ic-action-default);border-left:none}.dynamic-container:dir(rtl){margin:var(--ic-space-xxxs) var(--ic-space-sm) var(--ic-space-xxs) 0}';const p=m;const k=class{constructor(c){e(this,c);this.icCheck=i(this,"icCheck",7);this.additionalFieldDisplay="static";this.checked=false;this.initiallyChecked=this.checked;this.disabled=false;this.dynamicText="This selection requires additional answers";this.indeterminate=false;this.displayIndeterminate=this.indeterminate;this.nativeIndeterminateBehaviour=false;this.theme="inherit";this.hideLabel=false;this.handleClick=()=>{this.checked=!this.checked;this.displayIndeterminate=this.nativeIndeterminateBehaviour?false:this.indeterminate&&this.checked;this.icCheck.emit()};this.handleFormReset=()=>{this.checked=this.initiallyChecked}}watchDisabledHandler(){r(this.disabled,this.el)}watchIndeterminateHandler(){this.displayIndeterminate=this.nativeIndeterminateBehaviour?this.indeterminate:this.indeterminate&&!!this.checked}componentWillLoad(){r(this.disabled,this.el);o(this.el,this.handleFormReset);const e=this.el.parentElement;if(e){if(!this.name)this.name=e.name;this.groupLabel=e.label}}componentDidLoad(){n([{prop:this.label,propName:"label"},{prop:this.value,propName:"value"}],"Checkbox")}componentDidRender(){if(this.additionalFieldDisplay==="static"){const e=this.el.querySelector("ic-text-field");if(!this.checked){e===null||e===void 0?void 0:e.setAttribute("disabled","")}else{e===null||e===void 0?void 0:e.removeAttribute("disabled")}}else if(this.additionalFieldContainer){this.additionalFieldContainer.style.display=!this.checked?"none":"flex"}}disconnectedCallback(){d(this.el,this.handleFormReset)}async setFocus(){var e,i;(i=(e=this.el.shadowRoot)===null||e===void 0?void 0:e.querySelector(".checkbox"))===null||i===void 0?void 0:i.focus()}render(){const{additionalFieldDisplay:e,checked:i,disabled:t,dynamicText:r,el:o,form:n,displayIndeterminate:d,groupLabel:m,label:p,name:k,size:x,value:v,theme:f}=this;const g=`ic-checkbox-${s(p)||v}-${m}`.replace(/ /g,"-");const u=o.parentElement.size;i?l(true,o,k,i&&v,t):b(o);return c(a,{key:"657eacf1576a595f2a7078cf14a07e39603ddaec",class:{"ic-checkbox-disabled":!!t,[`ic-checkbox-${x||u}`]:true,[`ic-theme-${f}`]:f!=="inherit"}},c("div",{key:"2f9ab7ae4fa7adfca5d9143821d6baae03492562",class:"container"},d&&c("div",{key:"c04e36e2ff4b15d96a6a1bf204e0ae9c57f2d3e3",class:"indeterminate-symbol"}),!d&&i&&c("svg",{key:"48b5e0da871b6cec1667c022027bf8cdea1fcc15",class:"checkmark",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg","fill-rule":"evenodd","clip-rule":"evenodd"},c("title",{key:"bf871a24d38ddeeb0b23a7cae6c65982ae69fc6a"},"checkmark icon"),c("path",{key:"ad9b4ee3132636a9a938fabc072796f2820df63f",d:"M21 6.285l-11.16 12.733-6.84-6.018 1.319-1.49 5.341 4.686 9.865-11.196 1.475 1.285z"})),c("input",{key:"262d0be4ec5ed6e7f7ac701f8b8800f1fbd91825",role:"checkbox",class:{checkbox:true,checked:!!i,indeterminate:!!d},type:"checkbox",name:k,id:g,value:v,disabled:t,checked:i,indeterminate:d,onClick:this.handleClick,form:n,"aria-label":this.hideLabel?this.label:undefined}),!this.hideLabel&&c("ic-typography",{key:"e52458082502589354a8e1b5a9b975629ddd22a8",class:"checkbox-label",variant:"body"},c("label",{key:"e7099f15c2055bffb2b4c79a2e579731bfb4f517",htmlFor:g},p))),h(o,"additional-field")&&c("div",{key:"87c419e79ece414a7ffe59f91442fd8ac7c5e570",class:"dynamic-container",ref:e=>this.additionalFieldContainer=e},e==="dynamic"&&c("div",{key:"dedde96cef590e12940cd60878d80121df0f7dd8",class:"branch-corner"}),c("div",{key:"fec451e9f5705f32fc6c0083f9b2c924940a2c18"},e==="dynamic"&&c("ic-typography",{key:"477d00ba3c2249c0cbaef7240ecdaddb59fde9fc",variant:"caption"},c("p",{key:"a95ddf7079b19b3f6adb5855a5ed334cc35b5dcc",class:"dynamic-text","aria-live":"polite"},r)),c("div",{key:"4663bb912a77f3abb675959e37b58026aaba522d",class:{"additional-field-wrapper":e==="static"}},c("slot",{key:"fe74a16f4fd159051e7a0f73893dfc77f39c45d7",name:"additional-field"})))))}static get delegatesFocus(){return true}get el(){return t(this)}static get watchers(){return{disabled:["watchDisabledHandler"],indeterminate:["watchIndeterminateHandler"]}}};k.style=p;export{k as ic_checkbox};
2
- //# sourceMappingURL=p-28656111.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["icCheckboxCss","IcCheckboxStyle0","Checkbox","constructor","hostRef","this","additionalFieldDisplay","checked","initiallyChecked","disabled","dynamicText","indeterminate","displayIndeterminate","nativeIndeterminateBehaviour","theme","hideLabel","handleClick","icCheck","emit","handleFormReset","watchDisabledHandler","removeDisabledFalse","el","watchIndeterminateHandler","componentWillLoad","addFormResetListener","checkboxGroup","parentElement","name","groupLabel","label","componentDidLoad","onComponentRequiredPropUndefined","prop","propName","value","componentDidRender","textfield","querySelector","setAttribute","removeAttribute","additionalFieldContainer","style","display","disconnectedCallback","removeFormResetListener","setFocus","_b","_a","shadowRoot","focus","render","form","size","id","isPropDefined","replace","parentElementSize","renderHiddenInput","removeHiddenInput","h","Host","key","class","viewBox","xmlns","d","role","checkbox","type","onClick","undefined","variant","htmlFor","isSlotUsed","ref"],"sources":["src/components/ic-checkbox/ic-checkbox.css?tag=ic-checkbox&encapsulation=shadow","src/components/ic-checkbox/ic-checkbox.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host(.ic-checkbox-disabled) {\n pointer-events: none;\n}\n\n.container {\n display: flex;\n width: fit-content;\n padding: var(--ic-space-xxs) 0 var(--ic-space-xxs) var(--ic-space-xxs);\n margin-bottom: var(--ic-space-xxs);\n align-items: center;\n}\n\n:host(.ic-data-table-checkbox) .container {\n padding: 0;\n margin-bottom: 0;\n}\n\n:host(.ic-checkbox-small) .container {\n margin-bottom: var(--ic-space-xxxs);\n}\n\n.checkbox {\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n display: block;\n position: relative;\n top: 0;\n left: 0;\n height: var(--ic-space-lg);\n width: var(--ic-space-lg);\n background-color: var(--ic-checkbox-background-unselected);\n border: var(--ic-border-width) solid var(--ic-checkbox-border-unselected);\n border-radius: var(--ic-border-radius);\n outline: none;\n cursor: pointer;\n transition: var(--ic-easing-transition-fast);\n flex-shrink: 0;\n}\n\n:host .container svg {\n width: var(--ic-space-lg);\n height: var(--ic-space-lg);\n}\n\n:host(.ic-checkbox-small) .checkbox,\n:host(.ic-checkbox-small) .container svg {\n width: var(--ic-space-md);\n height: var(--ic-space-md);\n}\n\n:host(.ic-checkbox-large) .checkbox,\n:host(.ic-checkbox-large) .container svg {\n width: var(--ic-space-xl);\n height: var(--ic-space-xl);\n}\n\n.checkbox:checked {\n background-color: var(--ic-checkbox-background-selected);\n border: var(--ic-border-width) solid var(--ic-checkbox-background-selected);\n transition: var(--ic-easing-transition-slow);\n}\n\n.checkbox:checked:disabled {\n background-color: var(--ic-checkbox-background-selected-disabled);\n border: var(--ic-border-width) solid\n var(--ic-checkbox-background-selected-disabled);\n}\n\n.checkbox:indeterminate,\n.checkbox.indeterminate:checked {\n background-color: var(--ic-checkbox-background-indeterminate);\n border: 0.125rem solid var(--ic-checkbox-background-indeterminate);\n}\n\n.checkbox:indeterminate:disabled,\n.checkbox.indeterminate:checked:disabled {\n background-color: var(--ic-checkbox-background-indeterminate-disabled);\n border: 0.125rem solid var(--ic-checkbox-background-indeterminate-disabled);\n}\n\n.checkbox:checked:hover {\n background-color: var(--ic-checkbox-background-selected-hover);\n}\n\n.checkbox:indeterminate:hover,\n.checkbox.indeterminate:checked:hover {\n background-color: var(--ic-checkbox-background-indeterminate-hover);\n border: 0.125rem solid var(--ic-checkbox-background-indeterminate-hover);\n}\n\n.checkbox:checked:active {\n background-color: var(--ic-checkbox-background-selected-pressed);\n}\n\n.checkbox:indeterminate:active,\n.checkbox.indeterminate:checked:active {\n background-color: var(--ic-checkbox-background-indeterminate-pressed);\n border: 0.125rem solid var(--ic-checkbox-background-indeterminate-pressed);\n}\n\n.checkbox:hover {\n box-shadow: 0 0 0 0.25rem var(--ic-checkbox-action-background-hover);\n border: var(--ic-border-width) solid\n var(--ic-checkbox-border-unselected-hover);\n}\n\n.checkbox:active {\n box-shadow: 0 0 0 0.25rem var(--ic-checkbox-action-background-pressed);\n border: var(--ic-border-width) solid\n var(--ic-checkbox-border-unselected-pressed);\n}\n\n.checkbox:focus {\n box-shadow: var(--ic-border-focus);\n}\n\n.checkbox:disabled {\n border: var(--ic-border-width) dashed\n var(--ic-checkbox-border-unselected-disabled);\n}\n\n.checkbox-label {\n padding-left: var(--ic-space-sm);\n color: var(--ic-checkbox-text);\n --ic-typography-color: var(--ic-checkbox-text);\n}\n\n:host(.ic-checkbox-disabled) .checkbox-label {\n color: var(--ic-checkbox-text-disabled);\n --ic-typography-color: var(--ic-checkbox-text-disabled);\n}\n\n.checkbox-label:hover {\n cursor: pointer;\n}\n\n.checkmark {\n position: relative;\n right: calc(-1 * var(--ic-space-lg));\n margin-left: calc(-1 * var(--ic-space-lg));\n fill: var(--ic-checkbox-icon-pressed);\n z-index: 1;\n background-color: transparent;\n pointer-events: none;\n flex-shrink: 0;\n}\n\n:host(.ic-checkbox-small) .checkmark {\n margin-left: calc(-1 * var(--ic-space-md));\n right: calc(-1 * var(--ic-space-md));\n}\n\n:host(.ic-checkbox-large) .checkmark {\n margin-left: calc(-1 * var(--ic-space-xl));\n right: calc(-1 * var(--ic-space-xl));\n}\n\n.indeterminate-symbol {\n position: relative;\n width: 0.875rem;\n height: var(--ic-space-xxxs);\n right: -1.188rem;\n margin-left: -0.875rem;\n z-index: 1;\n background-color: var(--ic-checkbox-icon-indeterminate);\n pointer-events: none;\n flex-shrink: 0;\n}\n\n:host(.ic-checkbox-small) .indeterminate-symbol {\n width: 0.6rem;\n right: -0.8rem;\n margin-left: -0.6rem;\n}\n\n:host(.ic-checkbox-large) .indeterminate-symbol {\n width: 1.25rem;\n right: -1.625rem;\n margin-left: -1.25rem;\n}\n\n.additional-field-wrapper {\n margin-left: calc(var(--ic-space-md) + var(--ic-space-lg));\n margin-top: calc(var(--ic-space-sm) / 2);\n}\n\n.branch-corner {\n height: var(--ic-space-md);\n width: var(--ic-space-xl);\n border-radius: 0 0 0 0.188rem;\n border-bottom: 0.125rem solid var(--ic-checkbox-required-bar);\n border-left: 0.125rem solid var(--ic-checkbox-required-bar);\n}\n\n.dynamic-container {\n display: flex;\n position: relative;\n margin: var(--ic-space-xxxs) 0 var(--ic-space-xxs) var(--ic-space-md);\n gap: var(--ic-space-xs);\n}\n\n.dynamic-text {\n color: var(--ic-checkbox-required-text);\n\n --ic-typography-color: var(--ic-checkbox-required-text);\n\n margin-top: calc(var(--ic-space-sm) / 2);\n margin-bottom: var(--ic-space-xs);\n border-radius: 2%;\n}\n\n@media (max-width: 576px) {\n ::slotted(ic-text-field) {\n --input-width: 100%;\n }\n}\n\n@media (forced-colors: active) {\n /* Styles here only apply to Forced Colors Mode */\n .checkbox {\n appearance: revert;\n transition: none;\n }\n\n .checkbox:checked {\n transition: none;\n }\n\n .checkbox:focus-visible {\n outline: 0.125rem solid highlight;\n }\n\n .checkbox:disabled:not(:checked) {\n appearance: none;\n border-color: GrayText;\n }\n\n .checkmark {\n fill: none;\n }\n\n .indeterminate-symbol {\n display: none;\n }\n}\n\n/* Right to left */\n.checkmark:dir(rtl) {\n right: 0;\n}\n\n.checkbox-label:dir(rtl) {\n padding-right: var(--ic-space-sm);\n padding-left: 0;\n}\n\n.indeterminate-symbol:dir(rtl) {\n right: 0.288rem;\n}\n\n.branch-corner:dir(rtl) {\n border-radius: 0 0 0.188rem 0;\n border-right: 0.125rem solid var(--ic-action-default);\n border-left: none;\n}\n\n.dynamic-container:dir(rtl) {\n margin: var(--ic-space-xxxs) var(--ic-space-sm) var(--ic-space-xxs) 0;\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n Element,\n Event,\n EventEmitter,\n State,\n Method,\n Watch,\n} from \"@stencil/core\";\nimport {\n IcAdditionalFieldTypes,\n IcSizes,\n IcThemeMode,\n} from \"../../utils/types\";\nimport {\n isSlotUsed,\n onComponentRequiredPropUndefined,\n renderHiddenInput,\n removeHiddenInput,\n addFormResetListener,\n removeFormResetListener,\n removeDisabledFalse,\n isPropDefined,\n} from \"../../utils/helpers\";\n\n/**\n * @slot additional-field - Content to be displayed alongside a checkbox.\n */\n@Component({\n tag: \"ic-checkbox\",\n styleUrl: \"ic-checkbox.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nexport class Checkbox {\n private additionalFieldContainer?: HTMLDivElement;\n\n @Element() el: HTMLIcCheckboxElement;\n\n /**\n * The style of additionalField that will be displayed if used.\n */\n @Prop({ reflect: true }) additionalFieldDisplay?: IcAdditionalFieldTypes =\n \"static\";\n\n /**\n * If `true`, the checkbox will be set to the checked state. This is only the initial state and will be updated to unchecked if the checkbox is clicked.\n */\n @Prop({ reflect: true, mutable: true }) checked?: boolean = false;\n @State() initiallyChecked = this.checked;\n\n /**\n * If `true`, the checkbox will be set to the disabled state.\n */\n @Prop() disabled?: boolean = false;\n @Watch(\"disabled\")\n watchDisabledHandler(): void {\n removeDisabledFalse(this.disabled, this.el);\n }\n\n /**\n * The text to be displayed when dynamic.\n */\n\n @Prop() dynamicText?: string = \"This selection requires additional answers\";\n\n /**\n * The <form> element to associate the checkbox with.\n */\n @Prop() form?: string;\n\n /**\n * The group label for the checkbox.\n */\n @Prop({ mutable: true }) groupLabel?: string;\n\n /**\n * If `true`, the indeterminate state will be displayed when checked.\n */\n @Prop() indeterminate?: boolean = false;\n @State() displayIndeterminate = this.indeterminate;\n\n @Watch(\"indeterminate\")\n watchIndeterminateHandler(): void {\n this.displayIndeterminate = this.nativeIndeterminateBehaviour\n ? this.indeterminate\n : this.indeterminate && !!this.checked;\n }\n\n /**\n * The label for the checkbox.\n */\n @Prop() label!: string;\n\n /**\n * The name for the checkbox. If not set when used in a checkbox group, the name will be based on the group name.\n */\n @Prop({ mutable: true }) name?: string;\n\n /**\n * If `true`, the checkbox will behave like a native checkbox where the `indeterminate` prop sets the indeterminate visual styling, independent of the `checked` state.\n */\n @Prop() nativeIndeterminateBehaviour?: boolean = false;\n\n /**\n * The size of the checkbox to be displayed. This does not affect the font size of the label. If a checkbox is contained in a checkbox group, this will override the size set on checkbox group.\n */\n @Prop() size?: IcSizes;\n\n /**\n * Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n */\n @Prop() theme?: IcThemeMode = \"inherit\";\n\n /**\n * The value for the checkbox.\n */\n @Prop() value!: string;\n\n /**\n * If `true`, the label will be hidden and the required label value will be applied as an aria-label.\n */\n @Prop() hideLabel?: boolean = false;\n\n /**\n * Emitted when a checkbox has been checked.\n */\n @Event() icCheck: EventEmitter<void>;\n\n componentWillLoad(): void {\n removeDisabledFalse(this.disabled, this.el);\n\n addFormResetListener(this.el, this.handleFormReset);\n\n const checkboxGroup = this.el.parentElement as HTMLIcCheckboxGroupElement;\n if (checkboxGroup) {\n if (!this.name) this.name = checkboxGroup.name;\n this.groupLabel = checkboxGroup.label;\n }\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [\n { prop: this.label, propName: \"label\" },\n { prop: this.value, propName: \"value\" },\n ],\n \"Checkbox\"\n );\n }\n\n componentDidRender(): void {\n if (this.additionalFieldDisplay === \"static\") {\n const textfield = this.el.querySelector(\"ic-text-field\");\n if (!this.checked) {\n textfield?.setAttribute(\"disabled\", \"\");\n } else {\n textfield?.removeAttribute(\"disabled\");\n }\n } else if (this.additionalFieldContainer) {\n this.additionalFieldContainer.style.display = !this.checked\n ? \"none\"\n : \"flex\";\n }\n }\n\n disconnectedCallback(): void {\n removeFormResetListener(this.el, this.handleFormReset);\n }\n\n /**\n * Sets focus on the checkbox.\n */\n @Method()\n async setFocus(): Promise<void> {\n this.el.shadowRoot?.querySelector<HTMLElement>(\".checkbox\")?.focus();\n }\n\n private handleClick = () => {\n this.checked = !this.checked;\n this.displayIndeterminate = this.nativeIndeterminateBehaviour\n ? false\n : this.indeterminate && this.checked;\n this.icCheck.emit();\n };\n\n private handleFormReset = (): void => {\n this.checked = this.initiallyChecked;\n };\n\n render() {\n const {\n additionalFieldDisplay,\n checked,\n disabled,\n dynamicText,\n el,\n form,\n displayIndeterminate,\n groupLabel,\n label,\n name,\n size,\n value,\n theme,\n } = this;\n\n const id = `ic-checkbox-${\n isPropDefined(label) || value\n }-${groupLabel}`.replace(/ /g, \"-\");\n\n const parentElementSize = (el.parentElement as HTMLIcCheckboxGroupElement)\n .size;\n\n checked\n ? renderHiddenInput(true, el, name!, checked && value, disabled)\n : removeHiddenInput(el);\n\n return (\n <Host\n class={{\n \"ic-checkbox-disabled\": !!disabled,\n [`ic-checkbox-${size || parentElementSize}`]: true,\n [`ic-theme-${theme}`]: theme !== \"inherit\",\n }}\n >\n <div class=\"container\">\n {displayIndeterminate && <div class=\"indeterminate-symbol\" />}\n {!displayIndeterminate && checked && (\n <svg\n class=\"checkmark\"\n viewBox=\"0 0 24 24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n >\n <title>checkmark icon</title>\n <path d=\"M21 6.285l-11.16 12.733-6.84-6.018 1.319-1.49 5.341 4.686 9.865-11.196 1.475 1.285z\" />\n </svg>\n )}\n <input\n role=\"checkbox\"\n class={{\n checkbox: true,\n checked: !!checked,\n indeterminate: !!displayIndeterminate,\n }}\n type=\"checkbox\"\n name={name}\n id={id}\n value={value}\n disabled={disabled}\n checked={checked}\n indeterminate={displayIndeterminate}\n onClick={this.handleClick}\n form={form}\n aria-label={this.hideLabel ? this.label : undefined}\n ></input>\n {!this.hideLabel && (\n <ic-typography class=\"checkbox-label\" variant=\"body\">\n <label htmlFor={id}>{label}</label>\n </ic-typography>\n )}\n </div>\n {isSlotUsed(el, \"additional-field\") && (\n <div\n class=\"dynamic-container\"\n ref={(el) => (this.additionalFieldContainer = el)}\n >\n {additionalFieldDisplay === \"dynamic\" && (\n <div class=\"branch-corner\"></div>\n )}\n <div>\n {additionalFieldDisplay === \"dynamic\" && (\n <ic-typography variant=\"caption\">\n <p class=\"dynamic-text\" aria-live=\"polite\">\n {dynamicText}\n </p>\n </ic-typography>\n )}\n <div\n class={{\n \"additional-field-wrapper\":\n additionalFieldDisplay === \"static\",\n }}\n >\n <slot name=\"additional-field\"></slot>\n </div>\n </div>\n </div>\n )}\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -1,2 +0,0 @@
1
- import{r as e,h as r,H as t,g as i}from"./p-8e4e97b4.js";import{C as s}from"./p-3b185c32.js";import{i as c,t as a,d as o}from"./p-ed8957da.js";const n=`<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M20 11H7.83L13.42 5.41L12 4L4 12L12 20L13.41 18.59L7.83 13H20V11Z" fill="currentColor"/>\n</svg>\n`;const l=':host{display:block;margin:var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0}:host .breadcrumb{display:flex;align-items:center;white-space:nowrap;gap:var(--ic-space-xs);min-height:var(--ic-space-lg)}:host .chevron{width:var(--ic-space-lg);height:var(--ic-space-lg)}:host .chevron svg,:host(.ic-breadcrumb-monochrome) .chevron svg{color:var(--ic-breadcrumb-icon-chevron)}:host(:first-child) .chevron{display:none}.back-icon svg{color:var(--ic-breadcrumb-icon)}:host(.ic-breadcrumb-monochrome) .back-icon svg{color:var(--ic-breadcrumb-icon-monochrome)}:host(.ic-breadcrumb-back){display:flex;align-items:center}:host(.ic-breadcrumb-back) .chevron{display:none}ic-link{--breadcrumb-link-display:inline-flex;--breadcrumb-link-align-items:center;--breadcrumb-link-gap:var(--ic-space-xs)}:host([aria-current="page"]){cursor:text}:host([aria-current="page"]) .current-page-container{display:flex;align-items:center;gap:var(--ic-space-xs);color:var(--ic-breadcrumb-text)}:host([aria-current="page"].ic-breadcrumb-monochrome) .current-page-container{color:var(--ic-breadcrumb-text-monochrome)}:host([aria-current="page"]) slot{pointer-events:none}:host(.collapsed-breadcrumb-wrapper){margin-right:var(--ic-space-xs) !important;display:flex;align-items:center;gap:var(--ic-space-xs)}:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb){border:none;background-color:transparent;color:var(--ic-color-hyperlink-default);text-decoration:underline;font-weight:var(--ic-font-weight-bold);cursor:pointer}:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:hover),:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:focus){outline:var(--ic-hc-focus-outline);border-bottom:0.25rem solid !important;margin-bottom:-0.25rem !important;text-decoration:none}.hide,:host(.collapsed-breadcrumb-wrapper) ::slotted(.hide){display:none}.slotted-link-container{gap:var(--ic-space-xs);display:flex}.slotted-link-container .back-icon{width:1.5rem;height:1.5rem}.slotted-link-container .link-wrapper{line-height:1.5rem}@media (forced-colors: active){.back-icon svg{color:currentcolor}}@supports (text-underline-offset: 25%){ic-link{--breadcrumb-link-display:flex}:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:hover),:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:focus){text-decoration-line:underline;text-decoration-thickness:25%;text-underline-offset:25%;border-bottom:0 !important;margin-bottom:0 !important}}';const h=l;const d=class{constructor(t){e(this,t);this.HREF_ATTR="href";this.current=false;this.monochrome=false;this.showBackIcon=false;this.theme="inherit";this.updatedSlottedLinkFocus=()=>{if(this.linkSlotContent){this.linkSlotContent.tabIndex=this.current?-1:0}if(this.slottedLinkEl){if(this.current){this.slottedLinkEl.removeAttribute(this.HREF_ATTR)}else{this.slottedLinkHref&&this.slottedLinkEl.setAttribute(this.HREF_ATTR,this.slottedLinkHref)}}};this.getSlottedLinkEl=()=>{const e=this.linkSlotContent;if(e){const r=e.hasAttribute(this.HREF_ATTR)?e:e.querySelector("[href]");return r}return null};this.renderBackIcon=()=>r("div",{class:"back-icon",innerHTML:n});this.renderDefaultBreadcrumb=(e,t,i,s)=>{const a=t!==null&&o(t)&&t!=="";if(e&&a){return r("span",{class:{"current-page-container":e}},c(this.el,"icon")&&r("slot",{name:"icon"}),t)}return r("ic-link",{theme:this.theme,monochrome:this.monochrome,href:s,class:"breadcrumb-link","aria-describedby":this.showBackIcon&&i&&i},this.showBackIcon&&this.renderBackIcon(),c(this.el,"icon")&&r("slot",{name:"icon"}),t)};this.setSlottedCurrentPageClass=()=>{const e=this.el.querySelector("ic-link");const r="current-page";if(e){e.classList.remove(r);if(this.current){const t=e.classList.contains(r);if(!t){e.classList.add("breadcrumb-link",r)}}}}}watchCurrentHandler(){this.updatedSlottedLinkFocus();this.el.ariaCurrent=this.current?"page":null}componentDidLoad(){var e,r;const t=(e=this.el.shadowRoot)===null||e===void 0?void 0:e.querySelector(".link-wrapper");if(t){const e=a(t);if(e){this.linkSlotContent=e[0]}this.slottedLinkEl=this.getSlottedLinkEl();this.slottedLinkHref=(r=this.slottedLinkEl)===null||r===void 0?void 0:r.getAttribute("href");this.updatedSlottedLinkFocus()}}componentWillRender(){this.setSlottedCurrentPageClass()}async setFocus(){var e,r;(r=(e=this.el.shadowRoot)===null||e===void 0?void 0:e.querySelector("ic-link"))===null||r===void 0?void 0:r.focus()}render(){const{current:e,href:i,pageTitle:c}=this;const a=`${c&&c.toLowerCase().replace(" ","-")}-describedby`;const n=c!==null&&o(c)&&c!=="";const l=i!==null&&o(i)&&i!=="";return r(t,{key:"ec05cf0666fe3145ec70109bdd80987666520583",class:{"ic-breadcrumb-back":!!this.showBackIcon,[`ic-theme-${this.theme}`]:this.theme!=="inherit","ic-breadcrumb-monochrome":!!this.monochrome},"aria-current":e&&"page",role:"listitem"},r("div",{key:"e3bc601db155acfd4e14102b0599416007152fb1",class:"breadcrumb"},r("span",{key:"fa88e451ad018ab3af5da63f3f9072b1a5d61856",innerHTML:s,class:"chevron","aria-hidden":"true"}),this.showBackIcon&&a&&r("span",{key:"30c614b37073b3f6f9d371c0760047924962cacc",id:a,class:"hide"},`Back to ${c}`),n&&l?this.renderDefaultBreadcrumb(!!e,c,a,i):r("div",{class:"slotted-link-container"},this.showBackIcon&&this.renderBackIcon(),r("span",{class:"link-wrapper"},r("slot",null)))))}static get delegatesFocus(){return true}get el(){return i(this)}static get watchers(){return{current:["watchCurrentHandler"]}}};d.style=h;export{d as ic_breadcrumb};
2
- //# sourceMappingURL=p-33243fff.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["icBreadcrumbCss","IcBreadcrumbStyle0","Breadcrumb","constructor","hostRef","this","HREF_ATTR","current","monochrome","showBackIcon","theme","updatedSlottedLinkFocus","linkSlotContent","tabIndex","slottedLinkEl","removeAttribute","slottedLinkHref","setAttribute","getSlottedLinkEl","link","elWithHref","hasAttribute","querySelector","renderBackIcon","h","class","innerHTML","backIcon","renderDefaultBreadcrumb","pageTitle","describedById","href","hasPageTitle","isPropDefined","isSlotUsed","el","name","setSlottedCurrentPageClass","icLink","currentPage","classList","remove","hasCurrentPageClass","contains","add","watchCurrentHandler","ariaCurrent","componentDidLoad","slottedLinkWrapper","_a","shadowRoot","slotEls","getSlotElements","_b","getAttribute","componentWillRender","setFocus","focus","render","toLowerCase","replace","hasHref","Host","key","role","chevronIcon","id"],"sources":["src/components/ic-breadcrumb/ic-breadcrumb.css?tag=ic-breadcrumb&encapsulation=shadow","src/components/ic-breadcrumb/ic-breadcrumb.tsx"],"sourcesContent":[":host {\n display: block;\n margin: var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0;\n}\n\n:host .breadcrumb {\n display: flex;\n align-items: center;\n white-space: nowrap;\n gap: var(--ic-space-xs);\n min-height: var(--ic-space-lg);\n}\n\n:host .chevron {\n width: var(--ic-space-lg);\n height: var(--ic-space-lg);\n}\n\n:host .chevron svg,\n:host(.ic-breadcrumb-monochrome) .chevron svg {\n color: var(--ic-breadcrumb-icon-chevron);\n}\n\n:host(:first-child) .chevron {\n display: none;\n}\n\n.back-icon svg {\n color: var(--ic-breadcrumb-icon);\n}\n\n:host(.ic-breadcrumb-monochrome) .back-icon svg {\n color: var(--ic-breadcrumb-icon-monochrome);\n}\n\n:host(.ic-breadcrumb-back) {\n display: flex;\n align-items: center;\n}\n\n:host(.ic-breadcrumb-back) .chevron {\n display: none;\n}\n\nic-link {\n --breadcrumb-link-display: inline-flex;\n --breadcrumb-link-align-items: center;\n --breadcrumb-link-gap: var(--ic-space-xs);\n}\n\n:host([aria-current=\"page\"]) {\n cursor: text;\n}\n\n:host([aria-current=\"page\"]) .current-page-container {\n display: flex;\n align-items: center;\n gap: var(--ic-space-xs);\n color: var(--ic-breadcrumb-text);\n}\n\n:host([aria-current=\"page\"].ic-breadcrumb-monochrome) .current-page-container {\n color: var(--ic-breadcrumb-text-monochrome);\n}\n\n:host([aria-current=\"page\"]) slot {\n pointer-events: none;\n}\n\n:host(.collapsed-breadcrumb-wrapper) {\n margin-right: var(--ic-space-xs) !important;\n display: flex;\n align-items: center;\n gap: var(--ic-space-xs);\n}\n\n:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb) {\n border: none;\n background-color: transparent;\n color: var(--ic-color-hyperlink-default);\n text-decoration: underline;\n font-weight: var(--ic-font-weight-bold);\n cursor: pointer;\n}\n\n:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:hover),\n:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:focus) {\n outline: var(--ic-hc-focus-outline);\n border-bottom: 0.25rem solid !important;\n margin-bottom: -0.25rem !important;\n text-decoration: none;\n}\n\n.hide,\n:host(.collapsed-breadcrumb-wrapper) ::slotted(.hide) {\n display: none;\n}\n\n.slotted-link-container {\n gap: var(--ic-space-xs);\n display: flex;\n}\n\n.slotted-link-container .back-icon {\n width: 1.5rem;\n height: 1.5rem;\n}\n\n.slotted-link-container .link-wrapper {\n line-height: 1.5rem;\n}\n\n@media (forced-colors: active) {\n .back-icon svg {\n color: currentcolor;\n }\n}\n\n@supports (text-underline-offset: 25%) {\n ic-link {\n --breadcrumb-link-display: flex;\n }\n\n :host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:hover),\n :host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:focus) {\n text-decoration-line: underline;\n text-decoration-thickness: 25%;\n text-underline-offset: 25%;\n border-bottom: 0 !important;\n margin-bottom: 0 !important;\n }\n}\n","import {\n Component,\n Host,\n Prop,\n h,\n Element,\n Method,\n Watch,\n} from \"@stencil/core\";\nimport { IcBreadcrumbDefault } from \"./ic-breadcrumb.types\";\n\nimport chevronIcon from \"../../assets/chevron-icon.svg\";\nimport backIcon from \"../../assets/back-icon.svg\";\nimport {\n getSlotElements,\n isPropDefined,\n isSlotUsed,\n} from \"../../utils/helpers\";\nimport { IcThemeMode } from \"../../utils/types\";\n\n/**\n * @slot icon - Content will be rendered to the left of the breadcrumb page title.\n */\n@Component({\n tag: \"ic-breadcrumb\",\n styleUrl: \"ic-breadcrumb.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class Breadcrumb {\n private HREF_ATTR = \"href\";\n private linkSlotContent: HTMLElement;\n private slottedLinkEl: HTMLElement | null;\n private slottedLinkHref: string | null | undefined;\n\n @Element() el: HTMLIcBreadcrumbElement;\n\n /**\n * If `true`, aria-current will be set on the breadcrumb.\n */\n @Prop() current?: boolean = false;\n @Watch(\"current\")\n watchCurrentHandler(): void {\n this.updatedSlottedLinkFocus();\n this.el.ariaCurrent = this.current ? \"page\" : null;\n }\n\n /**\n * The URL that the breadcrumb link points to.\n */\n @Prop() href?: string;\n\n /**\n * @internal If `true`, the breadcrumb will display as black in the light theme, and white in the dark theme.\n */\n @Prop() monochrome?: boolean = false;\n\n /**\n * The title of the breadcrumb.\n */\n @Prop() pageTitle!: string;\n\n /**\n * @internal If `true`, back icon will be displayed.\n */\n @Prop({ reflect: true }) showBackIcon?: boolean = false;\n\n /**\n * @internal Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n */\n @Prop() theme?: IcThemeMode = \"inherit\";\n\n // Prevent focus on breadcrumb if current page and contains slotted link\n private updatedSlottedLinkFocus = (): void => {\n // Sets tabindex on wrong element in unit test snapshots\n // - related to known Jest issue: https://github.com/ionic-team/stencil/issues/2830\n if (this.linkSlotContent) {\n this.linkSlotContent.tabIndex = this.current ? -1 : 0; // Prevent focus\n }\n\n if (this.slottedLinkEl) {\n if (this.current) {\n this.slottedLinkEl.removeAttribute(this.HREF_ATTR); // Prevent screen reader announcing breadcrumb as a link\n } else {\n this.slottedLinkHref &&\n this.slottedLinkEl.setAttribute(this.HREF_ATTR, this.slottedLinkHref);\n }\n }\n };\n\n private getSlottedLinkEl = (): HTMLElement | null => {\n const link = this.linkSlotContent;\n if (link) {\n const elWithHref = link.hasAttribute(this.HREF_ATTR)\n ? link\n : link.querySelector(\"[href]\");\n return elWithHref as HTMLElement;\n }\n return null;\n };\n\n componentDidLoad(): void {\n const slottedLinkWrapper =\n this.el.shadowRoot?.querySelector(\".link-wrapper\");\n\n if (slottedLinkWrapper) {\n const slotEls = getSlotElements(slottedLinkWrapper);\n if (slotEls) {\n this.linkSlotContent = slotEls[0] as HTMLElement;\n }\n this.slottedLinkEl = this.getSlottedLinkEl();\n this.slottedLinkHref = this.slottedLinkEl?.getAttribute(\"href\");\n this.updatedSlottedLinkFocus();\n }\n }\n\n componentWillRender(): void {\n this.setSlottedCurrentPageClass();\n }\n\n /**\n * Sets focus on the breadcrumb.\n */\n @Method()\n async setFocus(): Promise<void> {\n this.el.shadowRoot?.querySelector(\"ic-link\")?.focus();\n }\n\n private renderBackIcon = () => (\n <div class=\"back-icon\" innerHTML={backIcon}></div>\n );\n\n private renderDefaultBreadcrumb = (\n current: boolean,\n pageTitle: string,\n describedById: string,\n href: string | undefined\n ): IcBreadcrumbDefault => {\n const hasPageTitle =\n pageTitle !== null && isPropDefined(pageTitle) && pageTitle !== \"\";\n\n if (current && hasPageTitle) {\n return (\n <span\n class={{\n \"current-page-container\": current,\n }}\n >\n {isSlotUsed(this.el, \"icon\") && <slot name=\"icon\"></slot>}\n {pageTitle}\n </span>\n );\n }\n\n return (\n <ic-link\n theme={this.theme}\n monochrome={this.monochrome}\n href={href}\n class=\"breadcrumb-link\"\n aria-describedby={this.showBackIcon && describedById && describedById}\n >\n {this.showBackIcon && this.renderBackIcon()}\n {isSlotUsed(this.el, \"icon\") && <slot name=\"icon\"></slot>}\n {pageTitle}\n </ic-link>\n );\n };\n\n private setSlottedCurrentPageClass = () => {\n const icLink = this.el.querySelector(\"ic-link\");\n const currentPage = \"current-page\";\n if (icLink) {\n icLink.classList.remove(currentPage);\n if (this.current) {\n const hasCurrentPageClass = icLink.classList.contains(currentPage);\n if (!hasCurrentPageClass) {\n icLink.classList.add(\"breadcrumb-link\", currentPage);\n }\n }\n }\n };\n\n render() {\n const { current, href, pageTitle } = this;\n const describedById = `${\n pageTitle && pageTitle.toLowerCase().replace(\" \", \"-\")\n }-describedby`;\n\n const hasPageTitle =\n pageTitle !== null && isPropDefined(pageTitle) && pageTitle !== \"\";\n const hasHref = href !== null && isPropDefined(href) && href !== \"\";\n\n return (\n <Host\n class={{\n \"ic-breadcrumb-back\": !!this.showBackIcon,\n [`ic-theme-${this.theme}`]: this.theme !== \"inherit\",\n \"ic-breadcrumb-monochrome\": !!this.monochrome,\n }}\n aria-current={current && \"page\"}\n role=\"listitem\"\n >\n <div class=\"breadcrumb\">\n <span innerHTML={chevronIcon} class=\"chevron\" aria-hidden=\"true\" />\n {this.showBackIcon && describedById && (\n <span\n id={describedById}\n class=\"hide\"\n >{`Back to ${pageTitle}`}</span>\n )}\n {hasPageTitle && hasHref ? (\n this.renderDefaultBreadcrumb(\n !!current,\n pageTitle,\n describedById,\n href\n )\n ) : (\n <div class=\"slotted-link-container\">\n {this.showBackIcon && this.renderBackIcon()}\n <span class=\"link-wrapper\">\n <slot />\n </span>\n </div>\n )}\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -1 +0,0 @@
1
- {"version":3,"names":["icAccordionCss","IcAccordionStyle0","accordionIds","Accordion","constructor","hostRef","this","accordionId","CONTENT_VISIBILITY_PROPERTY","disabled","expanded","heading","message","size","theme","toggleExpanded","accordionClicked","emit","id","setAccordionAnimation","el","duration","property","delay","style","transitionDuration","transitionProperty","transitionDelay","setExpandedContentStyle","ev","expandedContent","propertyName","clientHeight","classList","add","height","hideExpandedContent","setProperty","animateExpandedContent","expandedContentEl","elementHeight","scrollHeight","addEventListener","e","remove","watchDisabledHandler","removeDisabledFalse","handleExpandedWatch","setFocus","_a","accordionBtnHeading","focus","componentWillLoad","disconnectedCallback","removeEventListener","componentDidLoad","render","h","Host","key","class","ref","tabindex","onClick","isSlotUsed","name","variant","innerHTML","chevronIcon","role"],"sources":["src/components/ic-accordion/ic-accordion.css?tag=ic-accordion&encapsulation=shadow","src/components/ic-accordion/ic-accordion.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n display: block;\n border-bottom: var(--ic-space-1px) solid var(--ic-accordion-divider);\n}\n\n:host .expand-chevron {\n color: var(--ic-accordion-chevron);\n}\n\n:host(.ic-accordion-disabled) .expand-chevron {\n color: var(--ic-accordion-chevron-disabled);\n}\n\n.section-button.small {\n padding: var(--ic-space-xxs) var(--ic-space-xs);\n}\n\n.section-button.large {\n padding: var(--ic-space-sm) var(--ic-space-xs);\n}\n\n:host(:first-of-type) {\n border-top: var(--ic-space-1px) solid var(--ic-accordion-divider);\n}\n\n:focus {\n outline: none;\n}\n\n.section-button {\n background-color: transparent;\n display: flex;\n align-items: center;\n width: 100%;\n padding: var(--ic-space-xs);\n font-weight: var(--ic-font-weight-bold);\n border: none;\n}\n\n.section-header {\n --ic-typography-color: var(--ic-accordion-heading-text);\n color: var(--ic-accordion-heading-text);\n text-align: left;\n flex: 1 0;\n}\n\n:host(.ic-accordion-disabled) .section-header {\n --ic-typography-color: var(--ic-accordion-heading-text-disabled);\n color: var(--ic-accordion-heading-text-disabled);\n}\n\nbutton:hover {\n background-color: var(--ic-accordion-background-hover);\n cursor: pointer;\n}\n\nbutton:active {\n background-color: var(--ic-accordion-background-pressed);\n}\n\nbutton:focus {\n box-shadow: var(--ic-border-focus);\n border-radius: var(--ic-border-radius);\n transition: var(--ic-transition-duration-fast);\n}\n\nbutton:disabled {\n pointer-events: none;\n}\n\n.icon-container {\n margin: 0 var(--ic-space-xs) 0 0;\n display: flex;\n align-items: center;\n width: var(--ic-space-lg);\n height: var(--ic-space-lg);\n color: var(--ic-accordion-icon);\n}\n\n:host(.ic-accordion-disabled) .icon-container {\n color: var(--ic-accordion-icon-disabled);\n}\n\n::slotted(svg) {\n width: var(--ic-space-md);\n height: var(--ic-space-md);\n}\n\n.expand-chevron {\n width: var(--ic-space-lg);\n height: var(--ic-space-lg);\n margin-left: calc(var(--ic-space-xl) + var(--ic-space-xs));\n transform: rotate(90deg);\n justify-self: end;\n}\n\n.content-expanded-chevron {\n transform: rotate(-90deg);\n}\n\n.expanded-content {\n --ic-typography-color: var(--ic-accordion-body-text);\n color: var(--ic-accordion-body-text);\n height: 0;\n overflow: hidden;\n display: flex;\n flex-direction: column;\n visibility: var(--ic-expanded-content-visibility, hidden);\n}\n\n.expanded-content-inner {\n padding: var(--ic-space-xs);\n}\n\n.expanded-content-opened {\n overflow: visible;\n}\n\n@media (forced-colors: active) {\n button:focus {\n border: var(--ic-border-hc) !important;\n }\n}\n","import {\n Component,\n h,\n Prop,\n Element,\n Event,\n EventEmitter,\n Host,\n Watch,\n Method,\n} from \"@stencil/core\";\nimport { isSlotUsed, removeDisabledFalse } from \"../../utils/helpers\";\nimport chevronIcon from \"../../assets/chevron-icon.svg\";\nimport { IcSizes, IcThemeMode } from \"../../utils/types\";\n\nlet accordionIds = 0;\n\n/**\n * @slot heading - Content is placed as the accordion heading.\n * @slot icon - Content is placed to the left of the heading.\n */\n\n@Component({\n tag: \"ic-accordion\",\n styleUrl: \"ic-accordion.css\",\n shadow: true,\n})\nexport class Accordion {\n private accordionId = `ic-accordion-${accordionIds++}`;\n private expandedContentEl?: HTMLDivElement;\n private accordionBtnHeading?: HTMLButtonElement;\n private CONTENT_VISIBILITY_PROPERTY = \"--ic-expanded-content-visibility\";\n\n @Element() el: HTMLIcAccordionElement;\n\n /**\n * If `true`, the accordion will be disabled.\n */\n @Prop() disabled?: boolean = false;\n @Watch(\"disabled\")\n watchDisabledHandler(): void {\n removeDisabledFalse(this.disabled, this.el);\n }\n\n /**\n * If `true`, the accordion appears expanded.\n */\n @Prop({ mutable: true }) expanded?: boolean = false;\n\n /**\n * The section header outlining section content.\n */\n @Prop() heading?: string = \"\";\n\n /**\n * The main body message of the accordion.\n */\n @Prop() message?: string = \"\";\n\n /**\n * The size of the accordion.\n */\n @Prop() size?: IcSizes = \"medium\";\n\n /**\n * Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n */\n @Prop() theme?: IcThemeMode = \"inherit\";\n\n /**\n * @internal Emitted when accordion is clicked.\n */\n @Event() accordionClicked: EventEmitter<{ id: string }>;\n\n // Every time expanded is set via toggleExpanded or accordionGroup, animate to open or close\n @Watch(\"expanded\")\n handleExpandedWatch(): void {\n this.animateExpandedContent();\n }\n\n /**\n * Sets focus on accordion heading.\n */\n @Method()\n async setFocus(): Promise<void> {\n this.accordionBtnHeading?.focus();\n }\n\n componentWillLoad(): void {\n removeDisabledFalse(this.disabled, this.el);\n }\n\n disconnectedCallback(): void {\n const expandedContentEl = this.expandedContentEl;\n if (expandedContentEl) {\n expandedContentEl.removeEventListener(\n \"transitionend\",\n (e) => this.setExpandedContentStyle(e, expandedContentEl),\n true\n );\n expandedContentEl.removeEventListener(\n \"transitionend\",\n (e) => this.hideExpandedContent(e, expandedContentEl),\n true\n );\n }\n }\n\n componentDidLoad(): void {\n // So accordion opens by default if expanded set to true\n if (this.expanded && this.expandedContentEl) {\n this.expandedContentEl.style.height = \"auto\";\n this.expandedContentEl.style.setProperty(\n this.CONTENT_VISIBILITY_PROPERTY,\n \"visible\"\n );\n }\n }\n\n private toggleExpanded = (): void => {\n this.expanded = !this.expanded;\n this.accordionClicked.emit({ id: this.accordionId });\n };\n\n // Set accordion animation\n private setAccordionAnimation = (\n el: HTMLElement,\n duration: string,\n property: string,\n delay: string\n ) => {\n el.style.transitionDuration = `${duration}ms`;\n el.style.transitionProperty = property;\n el.style.transitionDelay = delay;\n };\n\n private setExpandedContentStyle = (\n ev: TransitionEvent,\n expandedContent: HTMLDivElement\n ) => {\n if (ev.propertyName === \"height\" && expandedContent.clientHeight > 0) {\n expandedContent.classList.add(\"expanded-content-opened\");\n expandedContent.style.height = \"auto\";\n }\n };\n\n private hideExpandedContent = (\n ev: TransitionEvent,\n expandedContent: HTMLDivElement\n ) => {\n if (ev.propertyName === \"height\" && expandedContent.clientHeight === 0) {\n expandedContent.style.setProperty(\n this.CONTENT_VISIBILITY_PROPERTY,\n \"hidden\"\n );\n }\n };\n\n private animateExpandedContent = () => {\n if (this.expandedContentEl) {\n const expandedContentEl = this.expandedContentEl;\n const elementHeight = expandedContentEl.scrollHeight;\n if (elementHeight > 0 && this.expanded) {\n expandedContentEl.style.setProperty(\n this.CONTENT_VISIBILITY_PROPERTY,\n \"visible\"\n );\n expandedContentEl.style.height = `${elementHeight}px`;\n this.setAccordionAnimation(\n expandedContentEl,\n \"300\",\n \"height\",\n \"ease-out\"\n );\n\n expandedContentEl.addEventListener(\n \"transitionend\",\n (e: TransitionEvent) => {\n this.setExpandedContentStyle(e, expandedContentEl);\n }\n );\n } else if (!this.expanded) {\n const expandedContentEl = this.expandedContentEl;\n expandedContentEl.style.height = `${expandedContentEl.scrollHeight}px`;\n if (expandedContentEl.scrollHeight > 0 && !this.expanded) {\n expandedContentEl.style.height = \"0\";\n this.setAccordionAnimation(\n expandedContentEl,\n \"300\",\n \"height\",\n \"ease-in\"\n );\n expandedContentEl.classList.remove(\"expanded-content-opened\");\n }\n expandedContentEl.addEventListener(\"transitionend\", (e) => {\n this.hideExpandedContent(e, expandedContentEl);\n });\n }\n }\n };\n\n render() {\n const { size, disabled, expanded, theme } = this;\n return (\n <Host\n id={this.accordionId}\n class={{\n [\"ic-accordion-disabled\"]: !!disabled,\n [`ic-theme-${theme}`]: theme !== \"inherit\",\n }}\n aria-disabled={disabled ? \"true\" : \"false\"}\n >\n <button\n ref={(el) => (this.accordionBtnHeading = el)}\n id={`${this.accordionId}-button`}\n disabled={disabled}\n tabindex={disabled ? -1 : 0}\n class={{\n [`${size}`]: true,\n [\"section-button\"]: true,\n [\"section-button-open\"]: !!expanded && !disabled,\n }}\n aria-expanded={`${expanded}`}\n aria-controls=\"expanded-content-area\"\n onClick={this.toggleExpanded}\n >\n {isSlotUsed(this.el, \"icon\") && (\n <div class=\"icon-container\">\n <slot name=\"icon\" />\n </div>\n )}\n <ic-typography variant=\"subtitle-large\" class=\"section-header\">\n {isSlotUsed(this.el, \"heading\") ? (\n <slot name=\"heading\" />\n ) : (\n this.heading\n )}\n </ic-typography>\n <span\n class={{\n [\"expand-chevron\"]: true,\n [\"content-expanded-chevron\"]: !!expanded && !disabled,\n }}\n aria-hidden=\"true\"\n innerHTML={chevronIcon}\n />\n </button>\n <div\n class={{\n [\"expanded-content\"]: true,\n }}\n aria-labelledby={`${this.accordionId}-button`}\n role=\"region\"\n aria-hidden={`${!expanded}`}\n id=\"expanded-content-area\"\n ref={(el) => (this.expandedContentEl = el)}\n >\n <div class=\"expanded-content-inner\">\n {this.message ? (\n <ic-typography variant=\"body\">{this.message}</ic-typography>\n ) : (\n <slot />\n )}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -1,2 +0,0 @@
1
- import{r as t,c as i,h as e,H as s,g as a}from"./p-8e4e97b4.js";import{A as r,B as h,r as o,C as n,E as c,b as l,n as d,l as u}from"./p-ed8957da.js";const b=`<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">\n <path d="M15.8327 5.34199L14.6577 4.16699L9.99935 8.82533L5.34102 4.16699L4.16602 5.34199L8.82435 10.0003L4.16602 14.6587L5.34102 15.8337L9.99935 11.1753L14.6577 15.8337L15.8327 14.6587L11.1743 10.0003L15.8327 5.34199Z" fill="currentColor"/>\n</svg>\n`;const f=`<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">\n <path d="M13.1292 11.8792H12.4708L12.2375 11.6542C13.0542 10.7042 13.5458 9.47083 13.5458 8.12916C13.5458 5.13749 11.1208 2.71249 8.12916 2.71249C5.13749 2.71249 2.71249 5.13749 2.71249 8.12916C2.71249 11.1208 5.13749 13.5458 8.12916 13.5458C9.47083 13.5458 10.7042 13.0542 11.6542 12.2375L11.8792 12.4708V13.1292L16.0458 17.2875L17.2875 16.0458L13.1292 11.8792ZM8.12916 11.8792C6.05416 11.8792 4.37916 10.2042 4.37916 8.12916C4.37916 6.05416 6.05416 4.37916 8.12916 4.37916C10.2042 4.37916 11.8792 6.05416 11.8792 8.12916C11.8792 10.2042 10.2042 11.8792 8.12916 11.8792Z" fill="currentColor"/>\n</svg>`;const p='/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host(.ic-search-bar-search){display:block;--divider-height:1.5rem;--ic-input-label-helpertext-padding:var(--ic-space-xxs);--border-color:var(--ic-search-bar-outline);--input-bg-color:var(--ic-search-bar-background);--border-color-disabled:var(--ic-search-bar-outline-disabled);--menu-item-text-color:var(--ic-search-bar-dropdown-option-text);--menu-item-desc-text-color:var(--ic-search-bar-dropdown-option-description);--menu-bg-color:var(--ic-search-bar-dropdown-background);--menu-border-color:var(--ic-search-bar-dropdown-outline)}:host(.ic-search-bar-disabled){--ic-input-label-text-color:var(--ic-search-bar-label-disabled);--ic-input-label-helper-text-color:var(--ic-search-bar-subtitle-disabled)}:host(.ic-search-bar-search:hover){--border-color:var(--ic-search-bar-outline-hover)}:host(.ic-search-bar-search:active){--border-color:var(--ic-search-bar-outline-pressed)}:host(.ic-search-bar-search.ic-search-bar-small){--divider-height:1rem}:host(.ic-search-bar-full-width){width:100%}::-moz-placeholder{color:var(--ic-search-bar-placeholder-text);opacity:1}::placeholder{color:var(--ic-search-bar-placeholder-text);opacity:1}input{border:0;border-radius:var(--ic-border-radius);color:var(--ic-search-bar-filled-text);background-color:var(--input-bg-color);line-height:1.5rem;letter-spacing:0.005rem;width:100%;padding-right:var(--ic-space-xs);padding-left:var(--ic-space-xs);caret-color:var(--ic-search-bar-filled-text-cursor)}input:focus{border:0;outline:0}input:disabled::-moz-placeholder{color:var(--ic-search-bar-disabled-text)}input:disabled,input:disabled::placeholder{color:var(--ic-search-bar-disabled-text)}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.no-left-pad{padding-left:0}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration,input[type="search"]::-webkit-search-results-button,input[type="search"]::-webkit-search-results-decoration{display:none}input[type="search"].truncate-value{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.clear-button-container{align-items:center;margin-right:var(--ic-space-1px);display:none;visibility:hidden}.clear-button{border-radius:var(--ic-border-radius);transition:box-shadow var(--ic-easing-transition),\n border-radius var(--ic-easing-transition)}.clear-button:focus,.clear-button:active{background-color:var(--ic-color-focus-inner);box-shadow:inset 0 0 0 0.125rem var(--ic-color-focus-outer);border-radius:0.25rem}.clear-button-unfocused *{fill:var(--ic-search-bar-clear-button)}.clear-button:focus,.clear-button:active *{fill:var(--ic-atoms-input-clear-button-focus)}.clear-button-visible{visibility:visible;display:flex}.search-submit-button-container{display:flex;align-items:center}.search-submit-button-unfocused *{fill:var(--ic-search-bar-filled-icon)}.search-submit-button-disabled *{fill:var(--ic-search-bar-icon-disabled)}.search-submit-button-disabled .ic-tooltip-container{display:none !important}.search-submit-button:focus,.search-submit-button:active{background-color:var(--ic-color-focus-inner) !important;box-shadow:inset 0 0 0 0.125rem var(--ic-color-focus-outer) !important;border-radius:var(--ic-space-xxs)}.search-submit-button:focus,.search-submit-button:active *{fill:white}.divider{width:var(--ic-border-width);background-color:var(--ic-search-bar-dropdown-divider);height:var(--divider-height)}.menu-container{width:var(--input-width, 20rem);position:relative;top:var(--ic-space-xxxs)}.menu-container.fullwidth{width:100%}.no-results{cursor:not-allowed}.search-results-status{border:0;clip:rect(0, 0, 0, 0, 0);height:var(--ic-space-1px);margin-bottom:calc(-1 * var(--ic-space-1px));margin-right:calc(-1 * var(--ic-space-1px));overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:var(--ic-space-1px)}@media (forced-colors: active){.search-submit-button-unfocused *{fill:canvastext}.search-submit-button-disabled *{fill:GrayText}}';const m=p;let v=0;const g=class{constructor(e){t(this,e);this.icChange=i(this,"icChange",7);this.icClear=i(this,"icClear",7);this.icInput=i(this,"icInput",7);this.icOptionSelect=i(this,"icOptionSelect",7);this.icMenuChange=i(this,"icMenuChange",7);this.icClearBlur=i(this,"icClearBlur",7);this.icRetryLoad=i(this,"icRetryLoad",7);this.icSubmitSearch=i(this,"icSubmitSearch",7);this.icSubmitSearchBlur=i(this,"icSubmitSearchBlur",7);this.icSearchBarBlur=i(this,"icSearchBarBlur",7);this.icSearchBarFocus=i(this,"icSearchBarFocus",7);this.icKeydown=i(this,"icKeydown",7);this.assistiveHintEl=null;this.hasTimedOut=false;this.inputId=`ic-search-bar-input-${v++}`;this.menuCloseFromMenuChangeEvent=false;this.menuId=`${this.inputId}-menu`;this.preLoad=true;this.preventSubmit=false;this.prevNoOption=false;this.retryButtonClick=false;this.truncateValue=false;this.clearButtonFocused=false;this.open=false;this.searchSubmitFocused=false;this.showClearButton=false;this.autocapitalize="off";this.autocomplete="off";this.autocorrect="off";this.autofocus=false;this.charactersUntilSuggestion=2;this.disabled=false;this.disableAutoFiltering=false;this.debounce=0;this.emptyOptionListText="No results found";this.focusOnLoad=false;this.fullWidth=false;this.helperText="";this.hideLabel=false;this.assistiveHintText="When autocomplete results are available use the up and down arrows to choose and press enter to select";this.labelField="label";this.loading=false;this.loadingErrorLabel="Loading Error";this.loadingLabel="Loading...";this.name=this.inputId;this.placeholder="Search";this.readonly=false;this.required=false;this.searchMode="navigation";this.size="medium";this.spellcheck=false;this.theme="inherit";this.valueField="value";this.filteredOptions=[];this.options=[];this.value="";this.handleClear=t=>{var i;const e=t;const s=t;if(s.type==="click"||e.code==="Enter"||e.code==="Space"){this.value="";(i=this.inputEl)===null||i===void 0?void 0:i.setAttribute("value","");this.loading=false;clearTimeout(this.timeoutTimer);this.filteredOptions=this.options;this.el.setFocus();this.icClear.emit();t.preventDefault();this.preventSubmit=true}};this.onInput=t=>{this.value=t.target.value;this.icInput.emit({value:this.value});const i=[{[this.labelField]:this.emptyOptionListText,[this.valueField]:""}];if(this.options.length>0){this.setMenuChange(true);this.preLoad=false;if(this.disableAutoFiltering===false){const t=r(this.options,false,this.value,"anywhere",this.labelField);this.filteredOptions=t.length>0?t:i}}if(!this.showClearButton){this.handleShowClearButton(true)}this.debounceAriaLiveUpdate()};this.onInputBlur=t=>{const i=t.target.value;const e=t.relatedTarget;this.icSearchBarBlur.emit({value:i,relatedTarget:e})};this.onInputFocus=t=>{const i=t.target.value;this.icSearchBarFocus.emit({value:i});this.handleShowClearButton(true)};this.handleClearBlur=t=>{const i=t.relatedTarget;this.icClearBlur.emit({relatedTarget:i});this.clearButtonFocused=false};this.handleSubmitSearchBlur=t=>{const i=t.relatedTarget;this.icSubmitSearchBlur.emit({relatedTarget:i});this.searchSubmitFocused=false};this.handleMouseDown=t=>{t.preventDefault()};this.handleSubmitSearchFocus=()=>{this.searchSubmitFocused=true};this.handleSubmitSearch=()=>{this.highlightedValue&&(this.value=this.highlightedValue);this.highlightedValue=undefined;this.icSubmitSearch.emit({value:this.value});const t=this.el.closest("FORM");if(this.searchSubmitButton&&!!t&&!this.preventSubmit){h(t,this.searchSubmitButton)}};this.handleSubmitSearchKeyDown=t=>{if(t.key===" "){t.preventDefault();this.handleSubmitSearch()}};this.handleRetry=t=>{this.retryViaKeyPress=t.detail.keyPressed==="Enter";this.icRetryLoad.emit({value:t.detail.value});this.triggerLoading();this.retryButtonClick=true};this.triggerLoading=()=>{const t=[{[this.labelField]:this.loadingLabel,[this.valueField]:"",loading:true}];if(this.filteredOptions!==t)this.filteredOptions=t;if(this.timeout){this.timeoutTimer=window.setTimeout((()=>{this.filteredOptions=[{[this.labelField]:this.loadingErrorLabel,[this.valueField]:"",timedOut:true}]}),this.timeout)}};this.handleOptionSelect=t=>{if(t.detail.label===this.emptyOptionListText){this.el.setFocus();return}this.value=t.detail.value;this.icOptionSelect.emit({value:this.value})};this.handleMenuOptionHighlight=t=>{var i;const e=(i=t.detail.optionId)===null||i===void 0?void 0:i.replace(`${this.menuId}-`,"");e&&(this.highlightedValue=e);if(t.detail.optionId){this.ariaActiveDescendant=t.detail.optionId}else{this.ariaActiveDescendant=""}};this.handleMenuChange=t=>{this.setMenuChange(t.detail.open);if(!t.detail.open){this.menuCloseFromMenuChangeEvent=true}};this.setMenuChange=t=>{if(this.open!==t){this.open=t;this.icMenuChange.emit({open:t})}};this.handleHostFocus=()=>{if(this.options&&this.value&&!this.menuCloseFromMenuChangeEvent){this.setMenuChange(true)}this.handleTruncateValue(false);this.icSearchBarFocus.emit()};this.handleHostBlur=t=>{var i;const e=t.relatedTarget;if(this.open&&this.options&&e!==this.menu&&!this.retryViaKeyPress&&!this.retryButtonClick){this.setMenuChange(false)}if(this.retryButtonClick||this.retryViaKeyPress){(i=this.inputEl)===null||i===void 0?void 0:i.focus()}this.handleShowClearButton(false);this.menuCloseFromMenuChangeEvent=false;this.handleTruncateValue(true);this.icSearchBarBlur.emit({relatedTarget:e,value:this.value});this.retryViaKeyPress=false;this.retryButtonClick=false};this.handleShowClearButton=t=>{this.showClearButton=t};this.handleFocusClearButton=()=>{this.clearButtonFocused=true};this.handleTruncateValue=t=>{this.truncateValue=t};this.renderAssistiveHintEl=()=>{var t;const i=(t=this.el.shadowRoot)===null||t===void 0?void 0:t.querySelector(`#${this.inputId}`);if(i&&Object.keys(i).length>0&&this.hasOptionsOrFilterDisabled()){this.assistiveHintEl=document.createElement("span");this.assistiveHintEl.innerText=this.assistiveHintText||"";this.assistiveHintEl.id=`${this.inputId}-assistive-hint`;this.assistiveHintEl.style.display="none";if(i.after!==undefined){i.after(this.assistiveHintEl)}}};this.updateSearchResultAriaLive=()=>{var t;const i=(t=this.el.shadowRoot)===null||t===void 0?void 0:t.querySelector(".search-results-status");if(i){if(!this.open||this.value===""||this.value.length<this.charactersUntilSuggestion){i.innerText=""}else if(this.hasOptionsOrFilterDisabled()&&this.filteredOptions.length>0&&this.open&&!this.filteredOptions[0].loading){if(this.hadNoOptions()){i.innerText=this.emptyOptionListText}else{i.innerText=`${this.filteredOptions.length} result${this.filteredOptions.length>1?"s":""} available`}}}};this.hasOptionsOrFilterDisabled=()=>this.options.length>0||!!this.disableAutoFiltering;this.hadNoOptions=()=>this.filteredOptions.length===1&&this.filteredOptions[0][this.labelField]===this.emptyOptionListText&&this.searchMode==="navigation";this.isSubmitDisabled=()=>{const t=this.value===undefined||this.value===null||this.value==="";const i=this.value.length<this.charactersUntilSuggestion;return t||i||this.disabled||this.hadNoOptions()||this.hasTimedOut||!!this.loading};this.highlightFirstOptionAfterNoResults=()=>{if(this.prevNoOption&&this.menu&&!this.hasTimedOut){this.menu.handleSetFirstOption();this.prevNoOption=false}const t=this.filteredOptions.find((t=>t[this.labelField]===this.emptyOptionListText||t[this.labelField]===this.loadingErrorLabel||t[this.labelField]===this.loadingLabel));if(t){this.prevNoOption=true}}}watchDisabledHandler(){o(this.disabled,this.el)}debounceChanged(){this.icChange=n(this.icChange,this.debounce)}loadingHandler(t){if(t&&!this.hasTimedOut){this.preLoad=false;this.triggerLoading()}}filteredOptionsHandler(t){this.hasTimedOut=t.some((t=>t.timedOut))}watchOptionsHandler(t){if(this.disableAutoFiltering&&!this.hasTimedOut){this.loading=false;clearTimeout(this.timeoutTimer);if(t.length>0){this.filteredOptions=t}else{if(this.hadNoOptions()){return}this.setMenuChange(true);!this.preLoad&&(this.filteredOptions=[{[this.labelField]:this.emptyOptionListText,[this.valueField]:""}]);this.preLoad=true}}this.debounceAriaLiveUpdate()}watchValueHandler(t){if(this.inputEl&&this.options&&!!c(t,this.options,this.valueField,this.labelField)){this.inputEl.value=c(t,this.options,this.valueField,this.labelField)||""}else if(this.inputEl&&this.inputEl.value!==t){this.inputEl.value=t}this.icChange.emit({value:t})}connectedCallback(){this.debounceChanged()}disconnectedCallback(){if(this.assistiveHintEl){this.assistiveHintEl.remove()}}componentWillLoad(){this.watchValueHandler(this.value);o(this.disabled,this.el)}componentDidLoad(){if(this.focusOnLoad){this.el.setFocus()}if(this.hasOptionsOrFilterDisabled()){this.renderAssistiveHintEl();if(this.disableAutoFiltering){this.filteredOptions=this.options}}l([{prop:this.label,propName:"label"}],"Search Bar")}componentWillRender(){this.highlightFirstOptionAfterNoResults()}handleKeyDown(t){this.icKeydown.emit({event:t});if(this.menu&&this.open){this.menu.handleKeyboardOpen(t)}}handleKeyUp(t){if(t.key==="Enter"){if(this.preventSubmit||this.isSubmitDisabled()){return}this.handleSubmitSearch();this.setMenuChange(false)}if(t.key==="Escape"){this.setMenuChange(false)}if(this.preventSubmit){this.preventSubmit=false}}async setFocus(){var t;this.retryViaKeyPress=false;this.retryButtonClick=false;(t=this.inputEl)===null||t===void 0?void 0:t.focus()}debounceAriaLiveUpdate(){clearTimeout(this.debounceAriaLive);this.debounceAriaLive=window.setTimeout((()=>{this.updateSearchResultAriaLive()}),500)}render(){const{inputId:t,name:i,label:a,required:r,size:h,placeholder:o,helperText:n,disabled:l,value:p,readonly:m,spellcheck:v,fullWidth:g,options:w,open:y,hideLabel:x,menuId:k,ariaActiveDescendant:z,truncateValue:L,autofocus:C,autocapitalize:B,autocomplete:T,filteredOptions:H,theme:M}=this;const S=m||l;const O=d(t,n!=="",false).trim();let $;if(O!==""&&this.hasOptionsOrFilterDisabled()){$=`${O} ${this.inputId}-assistive-hint`}else if(this.hasOptionsOrFilterDisabled()){$=`${this.inputId}-assistive-hint`}else if(O!==""){$=O}else{$=undefined}const F=!!p&&this.hasOptionsOrFilterDisabled();const D=F&&y&&H.length>0;const E=D&&p.length>=this.charactersUntilSuggestion;const I=c(p,w,this.valueField,this.labelField);u(true,this.el,i,p,S);return e(s,{key:"a1e560e97f324268abb887ac3b8188acc1c6d42f",class:{["ic-search-bar-search"]:true,["ic-search-bar-full-width"]:!!g,["ic-search-bar-disabled"]:!!l,["ic-search-bar-small"]:h==="small",[`ic-theme-${M}`]:M!=="inherit"},onFocus:this.handleHostFocus,onBlur:this.handleHostBlur},e("ic-input-container",{key:"327a761189705de2cd7b4f4163f494701a34276c",readonly:m,disabled:S},!x&&e("ic-input-label",{key:"80f4bb67acb9232b36014d34f320471bedcc1ad3",for:t,label:a,helperText:n,required:r,disabled:S&&!m,readonly:m}),e("ic-input-component-container",{key:"0fb2a97aad0bd1f185ed3fc456c589dbcb7ce99d",ref:t=>this.anchorEl=t,size:h,disabled:S,readonly:m,fullWidth:g},e("input",{key:"3af78e40aa89ce0bad6693f6371015486c1cd103",id:t,name:i,ref:t=>this.inputEl=t,value:w&&!!I?I:p,class:{"no-left-pad":!!m,readonly:!!m,"truncate-value":L},placeholder:o,required:r,disabled:S,readonly:m,onInput:this.onInput,onBlur:this.onInputBlur,onFocus:this.onInputFocus,"aria-label":a,"aria-activedescendant":z,"aria-expanded":w.length>0&&E?`${D}`:undefined,"aria-owns":E?k:undefined,"aria-describedby":$,"aria-controls":E?k:undefined,"aria-haspopup":w.length>0?"listbox":undefined,"aria-autocomplete":F?"list":undefined,role:w.length>0&&E?"combobox":undefined,autocomplete:T,autocapitalize:B,autoFocus:C,spellcheck:v,inputmode:"search"}),e("div",{key:"23d4349d4b0f905bbf90bf1826a3a90559c62b9d",class:{"clear-button-container":true,"clear-button-visible":!!p&&!S&&this.showClearButton}},e("ic-button",{key:"90cd4ab4601fabfca86d92d9c6cb7d5751d43758",id:"clear-button",class:{"clear-button":true,"clear-button-unfocused":!this.clearButtonFocused},"aria-label":"Clear",innerHTML:b,onClick:this.handleClear,onMouseDown:this.handleMouseDown,size:h,onFocus:this.handleFocusClearButton,onBlur:this.handleClearBlur,onKeyDown:this.handleClear,type:"submit",variant:"icon",theme:this.clearButtonFocused?"light":"dark"}),e("div",{key:"79c1bb38267e6ebef413f7f9a6ba0ac8a28b5f12",class:"divider"})),e("div",{key:"91b16ca2d959cf2d36cbbe75eb210fd254cff723",class:{"search-submit-button-container":true,"search-submit-button-disabled":this.isSubmitDisabled()}},e("ic-button",{key:"3b2aac9b7ae9ba4e78979d5ecc64a8aa2035e23a",id:"search-submit-button","aria-label":"Search",ref:t=>this.searchSubmitButton=t,class:{["search-submit-button"]:true,["search-submit-button-small"]:h==="small",["search-submit-button-unfocused"]:!this.searchSubmitFocused,["search-submit-button-disabled"]:this.isSubmitDisabled()},disabled:this.isSubmitDisabled(),innerHTML:f,size:h,onClick:this.handleSubmitSearch,onMouseDown:this.handleMouseDown,onBlur:this.handleSubmitSearchBlur,onFocus:this.handleSubmitSearchFocus,onKeyDown:this.handleSubmitSearchKeyDown,type:"submit",variant:"icon",theme:this.searchSubmitFocused?"light":"dark"}))),e("div",{key:"548b4ee1e050efd6a8d50d7640e3cad32ac3002c",class:{"menu-container":true,fullwidth:!!g}},E&&e("ic-menu",{key:"3d495b2ee381d30984316f0143c148731b179304",class:{"no-results":this.hadNoOptions()||H.length===1&&(H[0][this.labelField]===this.loadingLabel||H[0][this.labelField]===this.loadingErrorLabel)},activationType:"manual",anchorEl:this.anchorEl,autofocusOnSelected:false,searchMode:this.searchMode,inputEl:this.inputEl,inputLabel:a,ref:t=>this.menu=t,fullWidth:g,menuId:k,open:!!E,options:H,onMenuOptionSelect:this.handleOptionSelect,onMenuStateChange:this.handleMenuChange,onMenuOptionId:this.handleMenuOptionHighlight,onRetryButtonClicked:this.handleRetry,parentEl:this.el,value:p,labelField:this.labelField,valueField:this.valueField}))),e("div",{key:"d3a4abf5d1d7ca686b696c283e86a6c84ff39f92","aria-live":"polite",role:"status",class:"search-results-status"}))}static get delegatesFocus(){return true}get el(){return a(this)}static get watchers(){return{disabled:["watchDisabledHandler"],debounce:["debounceChanged"],loading:["loadingHandler"],filteredOptions:["filteredOptionsHandler"],options:["watchOptionsHandler"],value:["watchValueHandler"]}}};g.style=m;export{g as ic_search_bar};
2
- //# sourceMappingURL=p-49768069.entry.js.map