@ukic/web-components 2.1.0-beta.1 → 2.1.0-beta.2

Sign up to get free protection for your applications and to get access to all the features.
Files changed (379) hide show
  1. package/dist/cjs/core.cjs.js +1 -1
  2. package/dist/cjs/ic-alert.cjs.entry.js.map +1 -1
  3. package/dist/cjs/ic-back-to-top.cjs.entry.js +18 -8
  4. package/dist/cjs/ic-back-to-top.cjs.entry.js.map +1 -1
  5. package/dist/cjs/ic-breadcrumb-group.cjs.entry.js.map +1 -1
  6. package/dist/cjs/ic-breadcrumb.cjs.entry.js +1 -1
  7. package/dist/cjs/ic-breadcrumb.cjs.entry.js.map +1 -1
  8. package/dist/cjs/ic-button_3.cjs.entry.js +4 -2
  9. package/dist/cjs/ic-button_3.cjs.entry.js.map +1 -1
  10. package/dist/cjs/ic-card.cjs.entry.js.map +1 -1
  11. package/dist/cjs/ic-checkbox-group.cjs.entry.js.map +1 -1
  12. package/dist/cjs/ic-checkbox.cjs.entry.js.map +1 -1
  13. package/dist/cjs/ic-classification-banner.cjs.entry.js.map +1 -1
  14. package/dist/cjs/ic-data-entity.cjs.entry.js.map +1 -1
  15. package/dist/cjs/ic-data-row.cjs.entry.js.map +1 -1
  16. package/dist/cjs/ic-footer-link-group.cjs.entry.js.map +1 -1
  17. package/dist/cjs/ic-footer-link.cjs.entry.js +1 -1
  18. package/dist/cjs/ic-footer-link.cjs.entry.js.map +1 -1
  19. package/dist/cjs/ic-footer.cjs.entry.js.map +1 -1
  20. package/dist/cjs/ic-hero.cjs.entry.js.map +1 -1
  21. package/dist/cjs/ic-input-component-container_3.cjs.entry.js +4 -3
  22. package/dist/cjs/ic-input-component-container_3.cjs.entry.js.map +1 -1
  23. package/dist/cjs/ic-input-label_2.cjs.entry.js.map +1 -1
  24. package/dist/cjs/ic-link.cjs.entry.js.map +1 -1
  25. package/dist/cjs/ic-navigation-button.cjs.entry.js.map +1 -1
  26. package/dist/cjs/ic-navigation-group.cjs.entry.js.map +1 -1
  27. package/dist/cjs/ic-navigation-item.cjs.entry.js.map +1 -1
  28. package/dist/cjs/ic-navigation-menu.cjs.entry.js.map +1 -1
  29. package/dist/cjs/ic-page-header.cjs.entry.js.map +1 -1
  30. package/dist/cjs/ic-radio-group.cjs.entry.js.map +1 -1
  31. package/dist/cjs/ic-radio-option.cjs.entry.js +0 -1
  32. package/dist/cjs/ic-radio-option.cjs.entry.js.map +1 -1
  33. package/dist/cjs/ic-search-bar.cjs.entry.js +16 -2
  34. package/dist/cjs/ic-search-bar.cjs.entry.js.map +1 -1
  35. package/dist/cjs/ic-section-container.cjs.entry.js.map +1 -1
  36. package/dist/cjs/ic-select.cjs.entry.js +1 -6
  37. package/dist/cjs/ic-select.cjs.entry.js.map +1 -1
  38. package/dist/cjs/ic-side-navigation.cjs.entry.js +8 -4
  39. package/dist/cjs/ic-side-navigation.cjs.entry.js.map +1 -1
  40. package/dist/cjs/ic-skeleton.cjs.entry.js +1 -1
  41. package/dist/cjs/ic-skeleton.cjs.entry.js.map +1 -1
  42. package/dist/cjs/ic-status-tag.cjs.entry.js.map +1 -1
  43. package/dist/cjs/ic-step.cjs.entry.js.map +1 -1
  44. package/dist/cjs/ic-stepper.cjs.entry.js.map +1 -1
  45. package/dist/cjs/ic-switch.cjs.entry.js +1 -1
  46. package/dist/cjs/ic-switch.cjs.entry.js.map +1 -1
  47. package/dist/cjs/ic-tab-context.cjs.entry.js.map +1 -1
  48. package/dist/cjs/ic-tab-group.cjs.entry.js.map +1 -1
  49. package/dist/cjs/ic-tab-panel.cjs.entry.js.map +1 -1
  50. package/dist/cjs/ic-tab.cjs.entry.js.map +1 -1
  51. package/dist/cjs/ic-text-field.cjs.entry.js.map +1 -1
  52. package/dist/cjs/ic-theme.cjs.entry.js.map +1 -1
  53. package/dist/cjs/ic-top-navigation.cjs.entry.js.map +1 -1
  54. package/dist/cjs/ic-typography.cjs.entry.js.map +1 -1
  55. package/dist/cjs/loader.cjs.js +1 -1
  56. package/dist/collection/components/ic-alert/ic-alert.js +7 -7
  57. package/dist/collection/components/ic-alert/ic-alert.js.map +1 -1
  58. package/dist/collection/components/ic-back-to-top/ic-back-to-top.css +1 -1
  59. package/dist/collection/components/ic-back-to-top/ic-back-to-top.js +17 -7
  60. package/dist/collection/components/ic-back-to-top/ic-back-to-top.js.map +1 -1
  61. package/dist/collection/components/ic-breadcrumb/ic-breadcrumb.css +1 -1
  62. package/dist/collection/components/ic-breadcrumb/ic-breadcrumb.js +4 -4
  63. package/dist/collection/components/ic-breadcrumb/ic-breadcrumb.js.map +1 -1
  64. package/dist/collection/components/ic-breadcrumb-group/ic-breadcrumb-group.js +2 -2
  65. package/dist/collection/components/ic-breadcrumb-group/ic-breadcrumb-group.js.map +1 -1
  66. package/dist/collection/components/ic-button/ic-button.js +11 -11
  67. package/dist/collection/components/ic-button/ic-button.js.map +1 -1
  68. package/dist/collection/components/ic-card/ic-card.js +8 -8
  69. package/dist/collection/components/ic-card/ic-card.js.map +1 -1
  70. package/dist/collection/components/ic-checkbox/ic-checkbox.js +9 -9
  71. package/dist/collection/components/ic-checkbox/ic-checkbox.js.map +1 -1
  72. package/dist/collection/components/ic-checkbox-group/ic-checkbox-group.js +9 -9
  73. package/dist/collection/components/ic-checkbox-group/ic-checkbox-group.js.map +1 -1
  74. package/dist/collection/components/ic-classification-banner/ic-classification-banner.js +5 -5
  75. package/dist/collection/components/ic-classification-banner/ic-classification-banner.js.map +1 -1
  76. package/dist/collection/components/ic-data-entity/ic-data-entity.js +2 -2
  77. package/dist/collection/components/ic-data-entity/ic-data-entity.js.map +1 -1
  78. package/dist/collection/components/ic-data-row/ic-data-row.js +3 -3
  79. package/dist/collection/components/ic-data-row/ic-data-row.js.map +1 -1
  80. package/dist/collection/components/ic-footer/ic-footer.js +10 -10
  81. package/dist/collection/components/ic-footer/ic-footer.js.map +1 -1
  82. package/dist/collection/components/ic-footer-link/ic-footer-link.css +7 -1
  83. package/dist/collection/components/ic-footer-link-group/ic-footer-link-group.js +1 -1
  84. package/dist/collection/components/ic-footer-link-group/ic-footer-link-group.js.map +1 -1
  85. package/dist/collection/components/ic-hero/ic-hero.js +9 -9
  86. package/dist/collection/components/ic-hero/ic-hero.js.map +1 -1
  87. package/dist/collection/components/ic-input-component-container/ic-input-component-container.js +8 -8
  88. package/dist/collection/components/ic-input-component-container/ic-input-component-container.js.map +1 -1
  89. package/dist/collection/components/ic-input-container/ic-input-container.js +2 -2
  90. package/dist/collection/components/ic-input-container/ic-input-container.js.map +1 -1
  91. package/dist/collection/components/ic-input-label/ic-input-label.js +8 -8
  92. package/dist/collection/components/ic-input-label/ic-input-label.js.map +1 -1
  93. package/dist/collection/components/ic-input-validation/ic-input-validation.js +5 -5
  94. package/dist/collection/components/ic-input-validation/ic-input-validation.js.map +1 -1
  95. package/dist/collection/components/ic-link/ic-link.js +6 -6
  96. package/dist/collection/components/ic-link/ic-link.js.map +1 -1
  97. package/dist/collection/components/ic-loading-indicator/ic-loading-indicator.js +6 -4
  98. package/dist/collection/components/ic-loading-indicator/ic-loading-indicator.js.map +1 -1
  99. package/dist/collection/components/ic-menu/ic-menu.css +1 -1
  100. package/dist/collection/components/ic-menu/ic-menu.js +13 -12
  101. package/dist/collection/components/ic-menu/ic-menu.js.map +1 -1
  102. package/dist/collection/components/ic-navigation-button/ic-navigation-button.js +4 -4
  103. package/dist/collection/components/ic-navigation-button/ic-navigation-button.js.map +1 -1
  104. package/dist/collection/components/ic-navigation-group/ic-navigation-group.js +2 -2
  105. package/dist/collection/components/ic-navigation-group/ic-navigation-group.js.map +1 -1
  106. package/dist/collection/components/ic-navigation-item/ic-navigation-item.js +6 -6
  107. package/dist/collection/components/ic-navigation-item/ic-navigation-item.js.map +1 -1
  108. package/dist/collection/components/ic-navigation-menu/ic-navigation-menu.js +2 -2
  109. package/dist/collection/components/ic-navigation-menu/ic-navigation-menu.js.map +1 -1
  110. package/dist/collection/components/ic-page-header/ic-page-header.css +1 -0
  111. package/dist/collection/components/ic-page-header/ic-page-header.js +8 -8
  112. package/dist/collection/components/ic-page-header/ic-page-header.js.map +1 -1
  113. package/dist/collection/components/ic-radio-group/ic-radio-group.js +9 -9
  114. package/dist/collection/components/ic-radio-group/ic-radio-group.js.map +1 -1
  115. package/dist/collection/components/ic-radio-option/ic-radio-option.js +8 -23
  116. package/dist/collection/components/ic-radio-option/ic-radio-option.js.map +1 -1
  117. package/dist/collection/components/ic-search-bar/ic-search-bar.js +40 -25
  118. package/dist/collection/components/ic-search-bar/ic-search-bar.js.map +1 -1
  119. package/dist/collection/components/ic-section-container/ic-section-container.js +2 -2
  120. package/dist/collection/components/ic-section-container/ic-section-container.js.map +1 -1
  121. package/dist/collection/components/ic-select/ic-select.js +19 -24
  122. package/dist/collection/components/ic-select/ic-select.js.map +1 -1
  123. package/dist/collection/components/ic-side-navigation/ic-side-navigation.css +5 -13
  124. package/dist/collection/components/ic-side-navigation/ic-side-navigation.js +19 -15
  125. package/dist/collection/components/ic-side-navigation/ic-side-navigation.js.map +1 -1
  126. package/dist/collection/components/ic-skeleton/ic-skeleton.css +1 -1
  127. package/dist/collection/components/ic-skeleton/ic-skeleton.js +2 -2
  128. package/dist/collection/components/ic-skeleton/ic-skeleton.js.map +1 -1
  129. package/dist/collection/components/ic-status-tag/ic-status-tag.js +1 -1
  130. package/dist/collection/components/ic-status-tag/ic-status-tag.js.map +1 -1
  131. package/dist/collection/components/ic-step/ic-step.js +5 -5
  132. package/dist/collection/components/ic-step/ic-step.js.map +1 -1
  133. package/dist/collection/components/ic-stepper/ic-stepper.js +1 -1
  134. package/dist/collection/components/ic-stepper/ic-stepper.js.map +1 -1
  135. package/dist/collection/components/ic-switch/ic-switch.css +1 -1
  136. package/dist/collection/components/ic-switch/ic-switch.js +7 -7
  137. package/dist/collection/components/ic-switch/ic-switch.js.map +1 -1
  138. package/dist/collection/components/ic-tab/ic-tab.js +5 -5
  139. package/dist/collection/components/ic-tab/ic-tab.js.map +1 -1
  140. package/dist/collection/components/ic-tab-context/ic-tab-context.js +3 -3
  141. package/dist/collection/components/ic-tab-context/ic-tab-context.js.map +1 -1
  142. package/dist/collection/components/ic-tab-group/ic-tab-group.js +4 -4
  143. package/dist/collection/components/ic-tab-group/ic-tab-group.js.map +1 -1
  144. package/dist/collection/components/ic-tab-panel/ic-tab-panel.js +2 -2
  145. package/dist/collection/components/ic-tab-panel/ic-tab-panel.js.map +1 -1
  146. package/dist/collection/components/ic-text-field/ic-text-field.js +26 -26
  147. package/dist/collection/components/ic-text-field/ic-text-field.js.map +1 -1
  148. package/dist/collection/components/ic-theme/ic-theme.js +1 -1
  149. package/dist/collection/components/ic-theme/ic-theme.js.map +1 -1
  150. package/dist/collection/components/ic-top-navigation/ic-top-navigation.js +6 -6
  151. package/dist/collection/components/ic-top-navigation/ic-top-navigation.js.map +1 -1
  152. package/dist/collection/components/ic-typography/ic-typography.js +1 -1
  153. package/dist/collection/components/ic-typography/ic-typography.js.map +1 -1
  154. package/dist/collection/testspec.setup.js.map +1 -1
  155. package/dist/components/ic-alert.js.map +1 -1
  156. package/dist/components/ic-back-to-top.js +18 -8
  157. package/dist/components/ic-back-to-top.js.map +1 -1
  158. package/dist/components/ic-breadcrumb-group.js.map +1 -1
  159. package/dist/components/ic-breadcrumb2.js +1 -1
  160. package/dist/components/ic-breadcrumb2.js.map +1 -1
  161. package/dist/components/ic-button2.js +1 -1
  162. package/dist/components/ic-button2.js.map +1 -1
  163. package/dist/components/ic-card.js.map +1 -1
  164. package/dist/components/ic-checkbox-group.js.map +1 -1
  165. package/dist/components/ic-checkbox.js.map +1 -1
  166. package/dist/components/ic-classification-banner.js.map +1 -1
  167. package/dist/components/ic-data-entity.js.map +1 -1
  168. package/dist/components/ic-data-row.js.map +1 -1
  169. package/dist/components/ic-footer-link-group.js.map +1 -1
  170. package/dist/components/ic-footer-link.js +1 -1
  171. package/dist/components/ic-footer-link.js.map +1 -1
  172. package/dist/components/ic-footer.js.map +1 -1
  173. package/dist/components/ic-hero.js.map +1 -1
  174. package/dist/components/ic-input-component-container2.js.map +1 -1
  175. package/dist/components/ic-input-container2.js.map +1 -1
  176. package/dist/components/ic-input-label2.js.map +1 -1
  177. package/dist/components/ic-input-validation2.js.map +1 -1
  178. package/dist/components/ic-link2.js.map +1 -1
  179. package/dist/components/ic-loading-indicator2.js +3 -1
  180. package/dist/components/ic-loading-indicator2.js.map +1 -1
  181. package/dist/components/ic-menu2.js +4 -3
  182. package/dist/components/ic-menu2.js.map +1 -1
  183. package/dist/components/ic-navigation-button.js.map +1 -1
  184. package/dist/components/ic-navigation-group.js.map +1 -1
  185. package/dist/components/ic-navigation-item.js.map +1 -1
  186. package/dist/components/ic-navigation-menu2.js.map +1 -1
  187. package/dist/components/ic-page-header.js.map +1 -1
  188. package/dist/components/ic-radio-group.js.map +1 -1
  189. package/dist/components/ic-radio-option.js +0 -1
  190. package/dist/components/ic-radio-option.js.map +1 -1
  191. package/dist/components/ic-search-bar.js +17 -2
  192. package/dist/components/ic-search-bar.js.map +1 -1
  193. package/dist/components/ic-section-container2.js.map +1 -1
  194. package/dist/components/ic-select.js +1 -6
  195. package/dist/components/ic-select.js.map +1 -1
  196. package/dist/components/ic-side-navigation.js +8 -4
  197. package/dist/components/ic-side-navigation.js.map +1 -1
  198. package/dist/components/ic-skeleton.js +1 -1
  199. package/dist/components/ic-skeleton.js.map +1 -1
  200. package/dist/components/ic-status-tag.js.map +1 -1
  201. package/dist/components/ic-step.js.map +1 -1
  202. package/dist/components/ic-stepper.js.map +1 -1
  203. package/dist/components/ic-switch.js +1 -1
  204. package/dist/components/ic-switch.js.map +1 -1
  205. package/dist/components/ic-tab-context.js.map +1 -1
  206. package/dist/components/ic-tab-group.js.map +1 -1
  207. package/dist/components/ic-tab-panel.js.map +1 -1
  208. package/dist/components/ic-tab.js.map +1 -1
  209. package/dist/components/ic-text-field2.js.map +1 -1
  210. package/dist/components/ic-theme.js.map +1 -1
  211. package/dist/components/ic-top-navigation.js.map +1 -1
  212. package/dist/components/ic-typography2.js.map +1 -1
  213. package/dist/core/core.esm.js +1 -1
  214. package/dist/core/core.esm.js.map +1 -1
  215. package/dist/core/p-001651fc.entry.js +2 -0
  216. package/dist/core/p-001651fc.entry.js.map +1 -0
  217. package/dist/core/p-0118400b.entry.js.map +1 -1
  218. package/dist/core/p-07cd789d.entry.js.map +1 -1
  219. package/dist/core/p-0b125f26.entry.js.map +1 -1
  220. package/dist/core/p-10da19d2.entry.js.map +1 -1
  221. package/dist/core/p-272c7abd.entry.js.map +1 -1
  222. package/dist/core/p-2b5c9143.entry.js +2 -0
  223. package/dist/core/p-2b5c9143.entry.js.map +1 -0
  224. package/dist/core/{p-33a45ace.entry.js → p-2e9f3011.entry.js} +2 -2
  225. package/dist/core/p-2e9f3011.entry.js.map +1 -0
  226. package/dist/core/p-2f114521.entry.js.map +1 -1
  227. package/dist/core/p-347ec49e.entry.js.map +1 -1
  228. package/dist/core/p-39ae284e.entry.js.map +1 -1
  229. package/dist/core/{p-e590f1d2.entry.js → p-4c72f3a9.entry.js} +2 -2
  230. package/dist/core/{p-e590f1d2.entry.js.map → p-4c72f3a9.entry.js.map} +1 -1
  231. package/dist/core/p-558552f8.entry.js.map +1 -1
  232. package/dist/core/{p-ae81dffa.entry.js → p-5831bb8e.entry.js} +2 -2
  233. package/dist/core/p-5831bb8e.entry.js.map +1 -0
  234. package/dist/core/p-5e261268.entry.js.map +1 -1
  235. package/dist/core/p-60ffb73e.entry.js.map +1 -1
  236. package/dist/core/p-69650186.entry.js.map +1 -1
  237. package/dist/core/p-6b34d98f.entry.js.map +1 -1
  238. package/dist/core/p-6be5e06b.entry.js.map +1 -1
  239. package/dist/core/p-6d0eaaeb.entry.js.map +1 -1
  240. package/dist/core/p-6f6bd657.entry.js.map +1 -1
  241. package/dist/core/{p-1337db5e.entry.js → p-6fba90ee.entry.js} +2 -2
  242. package/dist/core/p-6fba90ee.entry.js.map +1 -0
  243. package/dist/core/p-7093d214.entry.js.map +1 -1
  244. package/dist/core/p-7577c6a3.entry.js.map +1 -1
  245. package/dist/core/p-7b39977f.entry.js.map +1 -1
  246. package/dist/core/{p-8ddeb574.entry.js → p-7f04e382.entry.js} +2 -2
  247. package/dist/core/{p-8ddeb574.entry.js.map → p-7f04e382.entry.js.map} +1 -1
  248. package/dist/core/p-7f632414.entry.js.map +1 -1
  249. package/dist/core/{p-b5a988c0.entry.js → p-88b15005.entry.js} +2 -2
  250. package/dist/core/p-88b15005.entry.js.map +1 -0
  251. package/dist/core/p-898607d0.entry.js.map +1 -1
  252. package/dist/core/p-9cd04875.entry.js.map +1 -1
  253. package/dist/core/{p-02799e26.entry.js → p-a2d3e955.entry.js} +2 -2
  254. package/dist/core/{p-02799e26.entry.js.map → p-a2d3e955.entry.js.map} +1 -1
  255. package/dist/core/p-ac43322e.entry.js.map +1 -1
  256. package/dist/core/p-b3dec76d.entry.js.map +1 -1
  257. package/dist/core/p-c4d3c18c.entry.js.map +1 -1
  258. package/dist/core/p-c6dd4f47.entry.js.map +1 -1
  259. package/dist/core/p-cadb531f.entry.js.map +1 -1
  260. package/dist/core/p-cc83692e.entry.js.map +1 -1
  261. package/dist/core/{p-1721bcf3.entry.js → p-cf5e8a55.entry.js} +2 -2
  262. package/dist/core/p-cf5e8a55.entry.js.map +1 -0
  263. package/dist/core/p-dd3c3e3c.entry.js.map +1 -1
  264. package/dist/core/{p-df5caf13.entry.js → p-e4551421.entry.js} +2 -2
  265. package/dist/core/{p-df5caf13.entry.js.map → p-e4551421.entry.js.map} +1 -1
  266. package/dist/core/p-e93e9aa3.entry.js.map +1 -1
  267. package/dist/core/p-ecfb2e6b.entry.js.map +1 -1
  268. package/dist/esm/core.js +1 -1
  269. package/dist/esm/ic-alert.entry.js.map +1 -1
  270. package/dist/esm/ic-back-to-top.entry.js +18 -8
  271. package/dist/esm/ic-back-to-top.entry.js.map +1 -1
  272. package/dist/esm/ic-breadcrumb-group.entry.js.map +1 -1
  273. package/dist/esm/ic-breadcrumb.entry.js +1 -1
  274. package/dist/esm/ic-breadcrumb.entry.js.map +1 -1
  275. package/dist/esm/ic-button_3.entry.js +4 -2
  276. package/dist/esm/ic-button_3.entry.js.map +1 -1
  277. package/dist/esm/ic-card.entry.js.map +1 -1
  278. package/dist/esm/ic-checkbox-group.entry.js.map +1 -1
  279. package/dist/esm/ic-checkbox.entry.js.map +1 -1
  280. package/dist/esm/ic-classification-banner.entry.js.map +1 -1
  281. package/dist/esm/ic-data-entity.entry.js.map +1 -1
  282. package/dist/esm/ic-data-row.entry.js.map +1 -1
  283. package/dist/esm/ic-footer-link-group.entry.js.map +1 -1
  284. package/dist/esm/ic-footer-link.entry.js +1 -1
  285. package/dist/esm/ic-footer-link.entry.js.map +1 -1
  286. package/dist/esm/ic-footer.entry.js.map +1 -1
  287. package/dist/esm/ic-hero.entry.js.map +1 -1
  288. package/dist/esm/ic-input-component-container_3.entry.js +4 -3
  289. package/dist/esm/ic-input-component-container_3.entry.js.map +1 -1
  290. package/dist/esm/ic-input-label_2.entry.js.map +1 -1
  291. package/dist/esm/ic-link.entry.js.map +1 -1
  292. package/dist/esm/ic-navigation-button.entry.js.map +1 -1
  293. package/dist/esm/ic-navigation-group.entry.js.map +1 -1
  294. package/dist/esm/ic-navigation-item.entry.js.map +1 -1
  295. package/dist/esm/ic-navigation-menu.entry.js.map +1 -1
  296. package/dist/esm/ic-page-header.entry.js.map +1 -1
  297. package/dist/esm/ic-radio-group.entry.js.map +1 -1
  298. package/dist/esm/ic-radio-option.entry.js +0 -1
  299. package/dist/esm/ic-radio-option.entry.js.map +1 -1
  300. package/dist/esm/ic-search-bar.entry.js +16 -2
  301. package/dist/esm/ic-search-bar.entry.js.map +1 -1
  302. package/dist/esm/ic-section-container.entry.js.map +1 -1
  303. package/dist/esm/ic-select.entry.js +1 -6
  304. package/dist/esm/ic-select.entry.js.map +1 -1
  305. package/dist/esm/ic-side-navigation.entry.js +8 -4
  306. package/dist/esm/ic-side-navigation.entry.js.map +1 -1
  307. package/dist/esm/ic-skeleton.entry.js +1 -1
  308. package/dist/esm/ic-skeleton.entry.js.map +1 -1
  309. package/dist/esm/ic-status-tag.entry.js.map +1 -1
  310. package/dist/esm/ic-step.entry.js.map +1 -1
  311. package/dist/esm/ic-stepper.entry.js.map +1 -1
  312. package/dist/esm/ic-switch.entry.js +1 -1
  313. package/dist/esm/ic-switch.entry.js.map +1 -1
  314. package/dist/esm/ic-tab-context.entry.js.map +1 -1
  315. package/dist/esm/ic-tab-group.entry.js.map +1 -1
  316. package/dist/esm/ic-tab-panel.entry.js.map +1 -1
  317. package/dist/esm/ic-tab.entry.js.map +1 -1
  318. package/dist/esm/ic-text-field.entry.js.map +1 -1
  319. package/dist/esm/ic-theme.entry.js.map +1 -1
  320. package/dist/esm/ic-top-navigation.entry.js.map +1 -1
  321. package/dist/esm/ic-typography.entry.js.map +1 -1
  322. package/dist/esm/loader.js +1 -1
  323. package/dist/types/components/ic-alert/ic-alert.d.ts +7 -7
  324. package/dist/types/components/ic-back-to-top/ic-back-to-top.d.ts +1 -0
  325. package/dist/types/components/ic-breadcrumb/ic-breadcrumb.d.ts +5 -5
  326. package/dist/types/components/ic-breadcrumb-group/ic-breadcrumb-group.d.ts +2 -2
  327. package/dist/types/components/ic-button/ic-button.d.ts +10 -10
  328. package/dist/types/components/ic-card/ic-card.d.ts +8 -8
  329. package/dist/types/components/ic-checkbox/ic-checkbox.d.ts +9 -9
  330. package/dist/types/components/ic-checkbox-group/ic-checkbox-group.d.ts +9 -9
  331. package/dist/types/components/ic-classification-banner/ic-classification-banner.d.ts +5 -5
  332. package/dist/types/components/ic-data-entity/ic-data-entity.d.ts +2 -2
  333. package/dist/types/components/ic-data-row/ic-data-row.d.ts +3 -3
  334. package/dist/types/components/ic-footer/ic-footer.d.ts +10 -10
  335. package/dist/types/components/ic-footer-link-group/ic-footer-link-group.d.ts +1 -1
  336. package/dist/types/components/ic-hero/ic-hero.d.ts +9 -9
  337. package/dist/types/components/ic-input-component-container/ic-input-component-container.d.ts +8 -8
  338. package/dist/types/components/ic-input-container/ic-input-container.d.ts +2 -2
  339. package/dist/types/components/ic-input-label/ic-input-label.d.ts +8 -8
  340. package/dist/types/components/ic-input-validation/ic-input-validation.d.ts +5 -5
  341. package/dist/types/components/ic-link/ic-link.d.ts +6 -6
  342. package/dist/types/components/ic-loading-indicator/ic-loading-indicator.d.ts +3 -3
  343. package/dist/types/components/ic-menu/ic-menu.d.ts +10 -10
  344. package/dist/types/components/ic-navigation-button/ic-navigation-button.d.ts +5 -5
  345. package/dist/types/components/ic-navigation-group/ic-navigation-group.d.ts +2 -2
  346. package/dist/types/components/ic-navigation-item/ic-navigation-item.d.ts +6 -6
  347. package/dist/types/components/ic-navigation-menu/ic-navigation-menu.d.ts +2 -2
  348. package/dist/types/components/ic-page-header/ic-page-header.d.ts +10 -8
  349. package/dist/types/components/ic-radio-group/ic-radio-group.d.ts +10 -10
  350. package/dist/types/components/ic-radio-option/ic-radio-option.d.ts +10 -12
  351. package/dist/types/components/ic-search-bar/ic-search-bar.d.ts +26 -23
  352. package/dist/types/components/ic-section-container/ic-section-container.d.ts +2 -2
  353. package/dist/types/components/ic-select/ic-select.d.ts +18 -18
  354. package/dist/types/components/ic-side-navigation/ic-side-navigation.d.ts +12 -12
  355. package/dist/types/components/ic-skeleton/ic-skeleton.d.ts +2 -2
  356. package/dist/types/components/ic-status-tag/ic-status-tag.d.ts +1 -1
  357. package/dist/types/components/ic-step/ic-step.d.ts +5 -5
  358. package/dist/types/components/ic-stepper/ic-stepper.d.ts +1 -1
  359. package/dist/types/components/ic-switch/ic-switch.d.ts +7 -7
  360. package/dist/types/components/ic-tab/ic-tab.d.ts +5 -5
  361. package/dist/types/components/ic-tab-context/ic-tab-context.d.ts +3 -3
  362. package/dist/types/components/ic-tab-group/ic-tab-group.d.ts +4 -4
  363. package/dist/types/components/ic-tab-panel/ic-tab-panel.d.ts +2 -2
  364. package/dist/types/components/ic-text-field/ic-text-field.d.ts +30 -30
  365. package/dist/types/components/ic-theme/ic-theme.d.ts +1 -1
  366. package/dist/types/components/ic-top-navigation/ic-top-navigation.d.ts +6 -6
  367. package/dist/types/components/ic-typography/ic-typography.d.ts +1 -1
  368. package/dist/types/components.d.ts +503 -507
  369. package/hydrate/index.js +65 -39
  370. package/package.json +3 -3
  371. package/dist/core/p-1337db5e.entry.js.map +0 -1
  372. package/dist/core/p-1721bcf3.entry.js.map +0 -1
  373. package/dist/core/p-33a45ace.entry.js.map +0 -1
  374. package/dist/core/p-7b11e1dc.entry.js +0 -2
  375. package/dist/core/p-7b11e1dc.entry.js.map +0 -1
  376. package/dist/core/p-ae81dffa.entry.js.map +0 -1
  377. package/dist/core/p-b5a988c0.entry.js.map +0 -1
  378. package/dist/core/p-e106305b.entry.js +0 -2
  379. package/dist/core/p-e106305b.entry.js.map +0 -1
@@ -62,7 +62,7 @@ export class Theme {
62
62
  "optional": true,
63
63
  "docs": {
64
64
  "tags": [],
65
- "text": "The theme colour. Can be a hex value eg \"#ff0000\" or RGB eg \"rgb(255, 0, 0)\""
65
+ "text": "The theme colour. Can be a hex value e.g. \"#ff0000\", RGB e.g. \"rgb(255, 0, 0)\", or RGBA e.g. \"rgba(255, 0, 0, 1)\"."
66
66
  },
67
67
  "attribute": "color",
68
68
  "reflect": false,
@@ -1 +1 @@
1
- {"version":3,"file":"ic-theme.js","sourceRoot":"","sources":["../../../src/components/ic-theme/ic-theme.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,IAAI,EACJ,KAAK,EAEL,CAAC,EACD,KAAK,EACL,IAAI,GACL,MAAM,eAAe,CAAC;AAGvB,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,YAAY,GACb,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,uBAAuB,EAAE,MAAM,qBAAqB,CAAC;AAC9D,OAAO,EACL,0BAA0B,EAC1B,0BAA0B,GAC3B,MAAM,uBAAuB,CAAC;AAM/B,MAAM,OAAO,KAAK;;IAgBR,4BAAuB,GAAG,GAAS,EAAE;MAC3C,IACE,uBAAuB,EAAE,GAAG,0BAA0B;QACtD,uBAAuB,EAAE,GAAG,0BAA0B,EACtD;QACA,OAAO,CAAC,IAAI,CACV,2TAA2T,CAC5T,CAAC;OACH;IACH,CAAC,CAAC;IAEM,kBAAa,GAAG,GAAG,EAAE;MAC3B,IAAI,IAAI,CAAC,KAAK,KAAK,IAAI,EAAE;QACvB,IAAI,SAAS,GAAG,IAAI,CAAC;QACrB,MAAM,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;QACzC,IAAI,SAAS,KAAK,GAAG,EAAE;UACrB,SAAS,GAAG,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;SACnC;aAAM,IAAI,SAAS,CAAC,WAAW,EAAE,KAAK,GAAG,EAAE;UAC1C,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;SACtC;QACD,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC;OAC9B;IACH,CAAC,CAAC;IAEM,iBAAY,GAAG,CAAC,SAAsB,EAAE,EAAE;MAChD,IAAI,SAAS,KAAK,IAAI,EAAE;QACtB,MAAM,IAAI,GAAG,QAAQ,CAAC,eAAe,CAAC;QACtC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,sBAAsB,EAAE,SAAS,CAAC,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC;QACvE,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,sBAAsB,EAAE,SAAS,CAAC,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC;QACvE,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,sBAAsB,EAAE,SAAS,CAAC,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC;QACvE,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,sBAAsB,EAAE,SAAS,CAAC,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC;QAEvE,IAAI,CAAC,uBAAuB,EAAE,CAAC;QAE/B,MAAM,eAAe,GAAG,uBAAuB,EAAE,CAAC;QAClD,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,eAAe,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAAC;OACtE;IACH,CAAC,CAAC;iBAjDuB,IAAI;;EAG7B,qBAAqB;IACnB,IAAI,CAAC,aAAa,EAAE,CAAC;EACvB,CAAC;EA8CD,iBAAiB;IACf,IAAI,CAAC,aAAa,EAAE,CAAC;EACvB,CAAC;EAED,MAAM;IACJ,OAAO,EAAC,IAAI,OAAQ,CAAC;EACvB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {\n Component,\n Host,\n Event,\n EventEmitter,\n h,\n Watch,\n Prop,\n} from \"@stencil/core\";\n\nimport { IcColorRGBA, IcTheme } from \"../../utils/types\";\nimport {\n getThemeForegroundColor,\n hexToRgba,\n rgbaStrToObj,\n} from \"../../utils/helpers\";\nimport { getThemeColorBrightness } from \"../../utils/helpers\";\nimport {\n BLACK_MIN_COLOR_BRIGHTNESS,\n WHITE_MAX_COLOR_BRIGHTNESS,\n} from \"../../utils/constants\";\n\n@Component({\n tag: \"ic-theme\",\n shadow: true,\n})\nexport class Theme {\n /**\n * The theme colour. Can be a hex value eg \"#ff0000\" or RGB eg \"rgb(255, 0, 0)\"\n */\n @Prop() color?: string = null;\n\n @Watch(\"color\")\n watchColorPropHandler(): void {\n this.setThemeColor();\n }\n\n /**\n * Emitted when the theme is changed.\n */\n @Event() icThemeChange: EventEmitter<IcTheme>;\n\n private checkThemeColorContrast = (): void => {\n if (\n getThemeColorBrightness() < BLACK_MIN_COLOR_BRIGHTNESS &&\n getThemeColorBrightness() > WHITE_MAX_COLOR_BRIGHTNESS\n ) {\n console.warn(\n `The theme colour does not provide enough contrast with either of the ICDS black or white foreground colours. Consider choosing a colour with a different brightness to achieve sufficient colour contrast for good visibility. See https://www.w3.org/TR/AERT/#color-contrast for more information about colour contrast.`\n );\n }\n };\n\n private setThemeColor = () => {\n if (this.color !== null) {\n let colorRGBA = null;\n const firstChar = this.color.slice(0, 1);\n if (firstChar === \"#\") {\n colorRGBA = hexToRgba(this.color);\n } else if (firstChar.toLowerCase() === \"r\") {\n colorRGBA = rgbaStrToObj(this.color);\n }\n this.setThemeRGBA(colorRGBA);\n }\n };\n\n private setThemeRGBA = (colorRGBA: IcColorRGBA) => {\n if (colorRGBA !== null) {\n const root = document.documentElement;\n root.style.setProperty(\"--ic-theme-primary-r\", colorRGBA.r.toString());\n root.style.setProperty(\"--ic-theme-primary-g\", colorRGBA.g.toString());\n root.style.setProperty(\"--ic-theme-primary-b\", colorRGBA.b.toString());\n root.style.setProperty(\"--ic-theme-primary-a\", colorRGBA.a.toString());\n\n this.checkThemeColorContrast();\n\n const foregroundColor = getThemeForegroundColor();\n this.icThemeChange.emit({ mode: foregroundColor, color: colorRGBA });\n }\n };\n\n componentWillLoad(): void {\n this.setThemeColor();\n }\n\n render() {\n return <Host></Host>;\n }\n}\n"]}
1
+ {"version":3,"file":"ic-theme.js","sourceRoot":"","sources":["../../../src/components/ic-theme/ic-theme.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,IAAI,EACJ,KAAK,EAEL,CAAC,EACD,KAAK,EACL,IAAI,GACL,MAAM,eAAe,CAAC;AAGvB,OAAO,EACL,uBAAuB,EACvB,SAAS,EACT,YAAY,GACb,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,uBAAuB,EAAE,MAAM,qBAAqB,CAAC;AAC9D,OAAO,EACL,0BAA0B,EAC1B,0BAA0B,GAC3B,MAAM,uBAAuB,CAAC;AAM/B,MAAM,OAAO,KAAK;;IAgBR,4BAAuB,GAAG,GAAS,EAAE;MAC3C,IACE,uBAAuB,EAAE,GAAG,0BAA0B;QACtD,uBAAuB,EAAE,GAAG,0BAA0B,EACtD;QACA,OAAO,CAAC,IAAI,CACV,2TAA2T,CAC5T,CAAC;OACH;IACH,CAAC,CAAC;IAEM,kBAAa,GAAG,GAAG,EAAE;MAC3B,IAAI,IAAI,CAAC,KAAK,KAAK,IAAI,EAAE;QACvB,IAAI,SAAS,GAAG,IAAI,CAAC;QACrB,MAAM,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;QACzC,IAAI,SAAS,KAAK,GAAG,EAAE;UACrB,SAAS,GAAG,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;SACnC;aAAM,IAAI,SAAS,CAAC,WAAW,EAAE,KAAK,GAAG,EAAE;UAC1C,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;SACtC;QACD,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC;OAC9B;IACH,CAAC,CAAC;IAEM,iBAAY,GAAG,CAAC,SAAsB,EAAE,EAAE;MAChD,IAAI,SAAS,KAAK,IAAI,EAAE;QACtB,MAAM,IAAI,GAAG,QAAQ,CAAC,eAAe,CAAC;QACtC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,sBAAsB,EAAE,SAAS,CAAC,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC;QACvE,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,sBAAsB,EAAE,SAAS,CAAC,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC;QACvE,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,sBAAsB,EAAE,SAAS,CAAC,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC;QACvE,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,sBAAsB,EAAE,SAAS,CAAC,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC;QAEvE,IAAI,CAAC,uBAAuB,EAAE,CAAC;QAE/B,MAAM,eAAe,GAAG,uBAAuB,EAAE,CAAC;QAClD,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,eAAe,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAAC;OACtE;IACH,CAAC,CAAC;iBAjDuB,IAAI;;EAG7B,qBAAqB;IACnB,IAAI,CAAC,aAAa,EAAE,CAAC;EACvB,CAAC;EA8CD,iBAAiB;IACf,IAAI,CAAC,aAAa,EAAE,CAAC;EACvB,CAAC;EAED,MAAM;IACJ,OAAO,EAAC,IAAI,OAAQ,CAAC;EACvB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {\n Component,\n Host,\n Event,\n EventEmitter,\n h,\n Watch,\n Prop,\n} from \"@stencil/core\";\n\nimport { IcColorRGBA, IcTheme } from \"../../utils/types\";\nimport {\n getThemeForegroundColor,\n hexToRgba,\n rgbaStrToObj,\n} from \"../../utils/helpers\";\nimport { getThemeColorBrightness } from \"../../utils/helpers\";\nimport {\n BLACK_MIN_COLOR_BRIGHTNESS,\n WHITE_MAX_COLOR_BRIGHTNESS,\n} from \"../../utils/constants\";\n\n@Component({\n tag: \"ic-theme\",\n shadow: true,\n})\nexport class Theme {\n /**\n * The theme colour. 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() color?: string = null;\n\n @Watch(\"color\")\n watchColorPropHandler(): void {\n this.setThemeColor();\n }\n\n /**\n * Emitted when the theme is changed.\n */\n @Event() icThemeChange: EventEmitter<IcTheme>;\n\n private checkThemeColorContrast = (): void => {\n if (\n getThemeColorBrightness() < BLACK_MIN_COLOR_BRIGHTNESS &&\n getThemeColorBrightness() > WHITE_MAX_COLOR_BRIGHTNESS\n ) {\n console.warn(\n `The theme colour does not provide enough contrast with either of the ICDS black or white foreground colours. Consider choosing a colour with a different brightness to achieve sufficient colour contrast for good visibility. See https://www.w3.org/TR/AERT/#color-contrast for more information about colour contrast.`\n );\n }\n };\n\n private setThemeColor = () => {\n if (this.color !== null) {\n let colorRGBA = null;\n const firstChar = this.color.slice(0, 1);\n if (firstChar === \"#\") {\n colorRGBA = hexToRgba(this.color);\n } else if (firstChar.toLowerCase() === \"r\") {\n colorRGBA = rgbaStrToObj(this.color);\n }\n this.setThemeRGBA(colorRGBA);\n }\n };\n\n private setThemeRGBA = (colorRGBA: IcColorRGBA) => {\n if (colorRGBA !== null) {\n const root = document.documentElement;\n root.style.setProperty(\"--ic-theme-primary-r\", colorRGBA.r.toString());\n root.style.setProperty(\"--ic-theme-primary-g\", colorRGBA.g.toString());\n root.style.setProperty(\"--ic-theme-primary-b\", colorRGBA.b.toString());\n root.style.setProperty(\"--ic-theme-primary-a\", colorRGBA.a.toString());\n\n this.checkThemeColorContrast();\n\n const foregroundColor = getThemeForegroundColor();\n this.icThemeChange.emit({ mode: foregroundColor, color: colorRGBA });\n }\n };\n\n componentWillLoad(): void {\n this.setThemeColor();\n }\n\n render() {\n return <Host></Host>;\n }\n}\n"]}
@@ -219,7 +219,7 @@ export class TopNavigation {
219
219
  "optional": false,
220
220
  "docs": {
221
221
  "tags": [],
222
- "text": "Title to display"
222
+ "text": "The app title to be displayed."
223
223
  },
224
224
  "attribute": "app-title",
225
225
  "reflect": false
@@ -236,7 +236,7 @@ export class TopNavigation {
236
236
  "optional": false,
237
237
  "docs": {
238
238
  "tags": [],
239
- "text": "The url to navigate to when title is clicked"
239
+ "text": "The URL to navigate to when the app title is clicked."
240
240
  },
241
241
  "attribute": "href",
242
242
  "reflect": false,
@@ -254,7 +254,7 @@ export class TopNavigation {
254
254
  "optional": false,
255
255
  "docs": {
256
256
  "tags": [],
257
- "text": "Version info to display"
257
+ "text": "The version info to be displayed."
258
258
  },
259
259
  "attribute": "version",
260
260
  "reflect": false,
@@ -272,7 +272,7 @@ export class TopNavigation {
272
272
  "optional": false,
273
273
  "docs": {
274
274
  "tags": [],
275
- "text": "Status info to display"
275
+ "text": "The status info to be displayed."
276
276
  },
277
277
  "attribute": "status",
278
278
  "reflect": false,
@@ -295,7 +295,7 @@ export class TopNavigation {
295
295
  "optional": false,
296
296
  "docs": {
297
297
  "tags": [],
298
- "text": "The alignment of the top nav content"
298
+ "text": "The alignment of the top navigation content."
299
299
  },
300
300
  "attribute": "content-aligned",
301
301
  "reflect": false,
@@ -313,7 +313,7 @@ export class TopNavigation {
313
313
  "optional": false,
314
314
  "docs": {
315
315
  "tags": [],
316
- "text": "If true, the flyout navigation menu on small devices will be contained by the parent element"
316
+ "text": "If `true`, the flyout navigation menu on small devices will be contained by the parent element."
317
317
  },
318
318
  "attribute": "inline",
319
319
  "reflect": false,
@@ -1 +1 @@
1
- {"version":3,"file":"ic-top-navigation.js","sourceRoot":"","sources":["../../../src/components/ic-top-navigation/ic-top-navigation.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Element,\n Host,\n Prop,\n h,\n State,\n Listen,\n Event,\n EventEmitter,\n Watch,\n} from \"@stencil/core\";\n\nimport {\n IcTypographyVariants,\n IcAlignment,\n IcThemeForeground,\n IcThemeForegroundEnum,\n IcTheme,\n} from \"../../utils/types\";\nimport {\n checkResizeObserver,\n DEVICE_SIZES,\n getCurrentDeviceSize,\n getThemeForegroundColor,\n getSlot,\n onComponentPropUndefinedChange,\n onComponentRequiredPropUndefined,\n isSlotUsed,\n} from \"../../utils/helpers\";\n\n/**\n * @slot app-icon - Content will be rendered to left of app title.\n * @slot search - Content will be rendered in search area to left of buttons.\n * @slot toggle-icon - Icon to be displayed on the button to toggle search slot content on smaller devices\n * @slot navigation - Content will be rendered in navigation panel.\n * @slot buttons - Content will be rendered to right of search bar.\n */\n@Component({\n tag: \"ic-top-navigation\",\n styleUrl: \"ic-top-navigation.css\",\n shadow: true,\n})\nexport class TopNavigation {\n @Element() el: HTMLIcTopNavigationElement;\n\n /**\n * Title to display\n */\n @Prop() appTitle!: string;\n\n /**\n * The url to navigate to when title is clicked\n */\n @Prop() href: string = \"/\";\n\n /**\n * Version info to display\n */\n @Prop() version: string = \"\";\n\n /**\n * Status info to display\n */\n @Prop() status: string = \"\";\n\n /**\n * The alignment of the top nav content\n */\n @Prop() contentAligned: IcAlignment = \"full-width\";\n\n /**\n * If true, the flyout navigation menu on small devices will be contained by the parent element\n */\n @Prop() inline: boolean = false;\n\n @State() menuOpen: boolean = false;\n @State() deviceSize: number = DEVICE_SIZES.XL;\n @State() mobileSearchBarVisible: boolean = false;\n @State() navMenuVisible: boolean = false;\n @State() searchValue: string = \"\";\n @State() mobileSearchHiddenOnBlur: boolean = false;\n @State() searchButtonClick: boolean = false;\n @State() foregroundColor: IcThemeForeground = getThemeForegroundColor();\n @State() hasFullWidthSearchBar: boolean = false;\n\n @Watch(\"appTitle\")\n watchPropHandler(newValue: string, oldValue: string): void {\n //added for gatsby rehydration issue where prop is initially undefined but then changes to actual value\n //this watch can be removed once gatbsy hydration issue is resolved\n onComponentPropUndefinedChange(\n oldValue,\n newValue,\n this.initialiseSearchBar\n );\n }\n\n /**\n * @internal - Emitted when the menu is opened.\n */\n @Event() icNavigationMenuOpened: EventEmitter<void>;\n\n /**\n * @internal - Emitted when the menu is closed.\n */\n @Event() icNavigationMenuClosed: EventEmitter<void>;\n\n private hasAppIcon: boolean = false;\n private hasNavigation: boolean = false;\n private hasIconButtons: boolean = false;\n private hasSearchSlotContent: boolean = false;\n private searchBar: HTMLIcSearchBarElement = null;\n private mobileSearchButtonEl: HTMLIcButtonElement;\n\n @Listen(\"icNavigationMenuClose\", {})\n navBarMenuCloseHandler(): void {\n this.showNavMenu(false);\n const menuBtn = this.el.shadowRoot.querySelector(\n \"#menu-button\"\n ) as HTMLIcButtonElement;\n menuBtn.setFocus();\n }\n\n @Listen(\"icSearchBarBlur\", {})\n searchInputBlurHandler(ev: CustomEvent): void {\n if (ev.detail !== null) {\n if (this.mobileSearchBarVisible && !this.searchButtonClick) {\n //don't hide if blur was triggered by click on search button - let the click handler toggle the state\n this.toggleSearchBar();\n }\n this.searchValue = ev.detail.value;\n }\n }\n\n @Listen(\"icChange\", {})\n searchValueChangeHandler(ev: CustomEvent): void {\n this.searchValue = ev.detail.value;\n }\n\n @Listen(\"icThemeChange\", { target: \"document\" })\n themeChangeHandler(ev: CustomEvent): void {\n const theme: IcTheme = ev.detail;\n this.foregroundColor = theme.mode;\n }\n\n private initialiseSearchBar = () => {\n if (this.hasSearchSlotContent) {\n const slot = getSlot(this.el, \"search\");\n if (slot && slot.tagName === \"IC-SEARCH-BAR\") {\n this.searchBar = slot as HTMLIcSearchBarElement;\n } else if (slot && slot.tagName === \"FORM\") {\n this.searchBar = slot.querySelector(\n \"ic-search-bar\"\n ) as HTMLIcSearchBarElement;\n }\n\n if (this.searchBar !== null) {\n this.searchBar.hideLabel = true;\n }\n }\n };\n\n private toggleSearchBar(): void {\n this.mobileSearchBarVisible = !this.mobileSearchBarVisible;\n\n if (this.searchBar !== null) {\n if (this.mobileSearchBarVisible) {\n this.mobileSearchButtonEl.updateAriaLabel(\"Hide search\");\n this.hasFullWidthSearchBar = true;\n this.searchBar.fullWidth = true;\n setTimeout(() => {\n this.searchBar.setFocus();\n }, 100);\n } else {\n this.mobileSearchButtonEl.updateAriaLabel(\"Show search\");\n this.hasFullWidthSearchBar = false;\n this.searchBar.fullWidth = false;\n }\n }\n }\n\n private emitTopNavResized = (size: number): void => {\n const event = new CustomEvent(\"topNavResized\", { detail: { size: size } });\n this.el.dispatchEvent(event);\n };\n\n private menuButtonClick = () => {\n this.showNavMenu(true);\n };\n\n private showNavMenu(show: boolean): void {\n this.navMenuVisible = show;\n if (show) {\n this.icNavigationMenuOpened.emit();\n } else {\n this.icNavigationMenuClosed.emit();\n }\n }\n\n private searchButtonMouseDownHandler = () => {\n this.searchButtonClick = true;\n };\n\n private searchButtonClickHandler = () => {\n this.toggleSearchBar();\n this.searchButtonClick = false;\n };\n\n private resizeObserver: ResizeObserver = null;\n\n private resizeObserverCallback = (currSize: number) => {\n if (currSize !== this.deviceSize) {\n this.deviceSize = currSize;\n if (currSize > DEVICE_SIZES.L) {\n this.showNavMenu(false);\n if (this.mobileSearchBarVisible) {\n this.toggleSearchBar();\n }\n }\n this.emitTopNavResized(currSize);\n if (\n document.activeElement !== null &&\n document.activeElement !== undefined &&\n document.activeElement.tagName === \"IC-SEARCH-BAR\"\n ) {\n this.searchBar.setAttribute(\"hidden\", \"true\");\n //remove attribute again as this trigger a redraw & applies css\n this.searchBar.removeAttribute(\"hidden\");\n setTimeout(() => {\n this.searchBar.setFocus();\n }, 100);\n }\n }\n };\n\n private runResizeObserver = () => {\n this.resizeObserver = new ResizeObserver(() => {\n const currSize = getCurrentDeviceSize();\n this.resizeObserverCallback(currSize);\n });\n\n this.resizeObserver.observe(this.el);\n };\n\n componentWillLoad(): void {\n this.hasAppIcon = isSlotUsed(this.el, \"app-icon\");\n this.hasNavigation = isSlotUsed(this.el, \"navigation\");\n this.hasIconButtons = isSlotUsed(this.el, \"buttons\");\n this.hasSearchSlotContent = isSlotUsed(this.el, \"search\");\n this.deviceSize = getCurrentDeviceSize();\n this.initialiseSearchBar();\n }\n\n componentWillRender(): void {\n this.hasNavigation = isSlotUsed(this.el, \"navigation\");\n this.hasSearchSlotContent = isSlotUsed(this.el, \"search\");\n this.hasIconButtons = isSlotUsed(this.el, \"buttons\");\n this.hasAppIcon = isSlotUsed(this.el, \"app-icon\");\n }\n\n componentDidLoad(): void {\n checkResizeObserver(this.runResizeObserver);\n\n onComponentRequiredPropUndefined(\n [{ prop: this.appTitle, propName: \"app-title\" }],\n \"Top Navigation\"\n );\n }\n\n disconnectedCallback(): void {\n if (this.resizeObserver !== null) {\n this.resizeObserver.disconnect();\n }\n }\n\n render() {\n const hasMenuContent =\n this.hasNavigation ||\n this.hasIconButtons ||\n this.status !== \"\" ||\n this.version !== \"\";\n\n const searchButtonSize =\n this.deviceSize <= DEVICE_SIZES.S ? \"default\" : \"large\";\n\n let appTitleVariant: IcTypographyVariants = \"h3\";\n\n const hasTitle = this.appTitle !== \"\" && this.appTitle !== undefined;\n\n if (this.deviceSize <= DEVICE_SIZES.L) {\n appTitleVariant = \"h4\";\n if (this.deviceSize <= DEVICE_SIZES.S) {\n appTitleVariant = \"subtitle-small\";\n }\n }\n\n const mobileSearchButtonTitle = this.mobileSearchBarVisible\n ? \"Hide search\"\n : \"Show search\";\n const menuSize = this.deviceSize <= DEVICE_SIZES.S ? \"small\" : \"default\";\n\n return (\n <Host\n class={{\n [\"fullwidth-searchbar\"]: this.hasFullWidthSearchBar,\n [IcThemeForegroundEnum.Dark]:\n this.foregroundColor === IcThemeForegroundEnum.Dark,\n }}\n >\n <div class=\"top-navigation\">\n <ic-section-container aligned=\"full-width\" full-height>\n <header role=\"banner\">\n <div class=\"top-panel-container\">\n <div class=\"app-details-container\">\n {hasTitle && (\n <a class=\"title-link\" href={this.href}>\n {this.hasAppIcon && (\n <div class=\"app-icon-container\" aria-hidden=\"true\">\n <slot name=\"app-icon\" />\n </div>\n )}\n <ic-typography variant={appTitleVariant}>\n <h1>{this.appTitle}</h1>\n </ic-typography>\n </a>\n )}\n {this.status !== \"\" && (\n <div class=\"app-status\">\n <ic-typography\n aria-label=\"app tag\"\n variant=\"label-uppercase\"\n class=\"app-status-text\"\n >\n {this.status}\n </ic-typography>\n </div>\n )}\n {this.version !== \"\" && (\n <div class=\"app-version\">\n <ic-typography\n variant=\"label\"\n class=\"app-version-text\"\n aria-label=\"app version\"\n >\n {this.version}\n </ic-typography>\n </div>\n )}\n </div>\n\n {(this.hasSearchSlotContent || hasMenuContent) && (\n <div class=\"search-menu-container\">\n <div class=\"search-actions-container\">\n {this.deviceSize > DEVICE_SIZES.L && (\n <slot name=\"search\"></slot>\n )}\n\n {this.hasSearchSlotContent &&\n this.deviceSize <= DEVICE_SIZES.L && (\n <ic-button\n id=\"search-toggle-button\"\n ref={(el) => (this.mobileSearchButtonEl = el)}\n onMouseDown={this.searchButtonMouseDownHandler}\n variant=\"icon\"\n size={searchButtonSize}\n aria-label={mobileSearchButtonTitle}\n appearance={this.foregroundColor}\n onClick={this.searchButtonClickHandler}\n >\n <slot name=\"toggle-icon\" slot=\"icon\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n fill=\"#ffffff\"\n >\n <path d=\"M0 0h24v24H0V0z\" fill=\"none\" />\n <path d=\"M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z\" />\n </svg>\n </slot>\n </ic-button>\n )}\n\n {this.hasIconButtons && this.deviceSize > DEVICE_SIZES.L && (\n <div class=\"icon-buttons-container\">\n <slot name=\"buttons\"></slot>\n </div>\n )}\n {hasMenuContent && this.deviceSize <= DEVICE_SIZES.L && (\n <div class=\"menu-button-container\">\n <nav\n aria-labelledby=\"navigation-landmark-text\"\n aria-hidden={\n !this.hasNavigation || this.navMenuVisible\n ? \"true\"\n : \"false\"\n }\n >\n <ic-button\n id=\"menu-button\"\n appearance={this.foregroundColor}\n variant=\"secondary\"\n aria-expanded={this.menuOpen ? \"true\" : \"false\"}\n aria-haspopup=\"true\"\n aria-label={`Open ${\n this.hasNavigation ? \"navigation\" : \"app\"\n } menu`}\n size={menuSize}\n onClick={this.menuButtonClick}\n >\n Menu\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n fill=\"#ffffff\"\n slot=\"icon\"\n >\n <path d=\"M0 0h24v24H0V0z\" fill=\"none\" />\n <path d=\"M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z\" />\n </svg>\n </ic-button>\n </nav>\n </div>\n )}\n </div>\n </div>\n )}\n </div>\n\n {this.mobileSearchBarVisible && (\n <div class=\"search-bar-container\">\n <slot name=\"search\"></slot>\n </div>\n )}\n\n {this.hasNavigation && this.deviceSize > DEVICE_SIZES.L && (\n <div class=\"navigation-tabs\">\n <span\n id=\"navigation-landmark-text\"\n class=\"navigation-landmark-text\"\n aria-hidden=\"true\"\n >\n Main navigation\n </span>\n <nav\n aria-labelledby=\"navigation-landmark-text\"\n class=\"nav-panel-container\"\n >\n <ul class=\"navigation-item-list\">\n <slot name=\"navigation\"></slot>\n </ul>\n </nav>\n </div>\n )}\n </header>\n </ic-section-container>\n </div>\n {this.navMenuVisible && (\n <ic-navigation-menu\n version={this.version}\n status={this.status}\n class={{\n [\"inline\"]: this.inline,\n }}\n >\n <div class=\"menu-buttons-slot\" slot=\"buttons\">\n <slot name=\"buttons\"></slot>\n </div>\n <ul slot=\"navigation\">\n <slot name=\"navigation\"></slot>\n </ul>\n </ic-navigation-menu>\n )}\n </Host>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"ic-top-navigation.js","sourceRoot":"","sources":["../../../src/components/ic-top-navigation/ic-top-navigation.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Element,\n Host,\n Prop,\n h,\n State,\n Listen,\n Event,\n EventEmitter,\n Watch,\n} from \"@stencil/core\";\n\nimport {\n IcTypographyVariants,\n IcAlignment,\n IcThemeForeground,\n IcThemeForegroundEnum,\n IcTheme,\n} from \"../../utils/types\";\nimport {\n checkResizeObserver,\n DEVICE_SIZES,\n getCurrentDeviceSize,\n getThemeForegroundColor,\n getSlot,\n onComponentPropUndefinedChange,\n onComponentRequiredPropUndefined,\n isSlotUsed,\n} from \"../../utils/helpers\";\n\n/**\n * @slot app-icon - Content will be rendered to left of app title.\n * @slot search - Content will be rendered in search area to left of buttons.\n * @slot toggle-icon - Icon to be displayed on the button to toggle search slot content on smaller devices\n * @slot navigation - Content will be rendered in navigation panel.\n * @slot buttons - Content will be rendered to right of search bar.\n */\n@Component({\n tag: \"ic-top-navigation\",\n styleUrl: \"ic-top-navigation.css\",\n shadow: true,\n})\nexport class TopNavigation {\n @Element() el: HTMLIcTopNavigationElement;\n\n /**\n * The app title to be displayed.\n */\n @Prop() appTitle!: string;\n\n /**\n * The URL to navigate to when the app title is clicked.\n */\n @Prop() href: string = \"/\";\n\n /**\n * The version info to be displayed.\n */\n @Prop() version: string = \"\";\n\n /**\n * The status info to be displayed.\n */\n @Prop() status: string = \"\";\n\n /**\n * The alignment of the top navigation content.\n */\n @Prop() contentAligned: IcAlignment = \"full-width\";\n\n /**\n * If `true`, the flyout navigation menu on small devices will be contained by the parent element.\n */\n @Prop() inline: boolean = false;\n\n @State() menuOpen: boolean = false;\n @State() deviceSize: number = DEVICE_SIZES.XL;\n @State() mobileSearchBarVisible: boolean = false;\n @State() navMenuVisible: boolean = false;\n @State() searchValue: string = \"\";\n @State() mobileSearchHiddenOnBlur: boolean = false;\n @State() searchButtonClick: boolean = false;\n @State() foregroundColor: IcThemeForeground = getThemeForegroundColor();\n @State() hasFullWidthSearchBar: boolean = false;\n\n @Watch(\"appTitle\")\n watchPropHandler(newValue: string, oldValue: string): void {\n //added for gatsby rehydration issue where prop is initially undefined but then changes to actual value\n //this watch can be removed once gatbsy hydration issue is resolved\n onComponentPropUndefinedChange(\n oldValue,\n newValue,\n this.initialiseSearchBar\n );\n }\n\n /**\n * @internal - Emitted when the menu is opened.\n */\n @Event() icNavigationMenuOpened: EventEmitter<void>;\n\n /**\n * @internal - Emitted when the menu is closed.\n */\n @Event() icNavigationMenuClosed: EventEmitter<void>;\n\n private hasAppIcon: boolean = false;\n private hasNavigation: boolean = false;\n private hasIconButtons: boolean = false;\n private hasSearchSlotContent: boolean = false;\n private searchBar: HTMLIcSearchBarElement = null;\n private mobileSearchButtonEl: HTMLIcButtonElement;\n\n @Listen(\"icNavigationMenuClose\", {})\n navBarMenuCloseHandler(): void {\n this.showNavMenu(false);\n const menuBtn = this.el.shadowRoot.querySelector(\n \"#menu-button\"\n ) as HTMLIcButtonElement;\n menuBtn.setFocus();\n }\n\n @Listen(\"icSearchBarBlur\", {})\n searchInputBlurHandler(ev: CustomEvent): void {\n if (ev.detail !== null) {\n if (this.mobileSearchBarVisible && !this.searchButtonClick) {\n //don't hide if blur was triggered by click on search button - let the click handler toggle the state\n this.toggleSearchBar();\n }\n this.searchValue = ev.detail.value;\n }\n }\n\n @Listen(\"icChange\", {})\n searchValueChangeHandler(ev: CustomEvent): void {\n this.searchValue = ev.detail.value;\n }\n\n @Listen(\"icThemeChange\", { target: \"document\" })\n themeChangeHandler(ev: CustomEvent): void {\n const theme: IcTheme = ev.detail;\n this.foregroundColor = theme.mode;\n }\n\n private initialiseSearchBar = () => {\n if (this.hasSearchSlotContent) {\n const slot = getSlot(this.el, \"search\");\n if (slot && slot.tagName === \"IC-SEARCH-BAR\") {\n this.searchBar = slot as HTMLIcSearchBarElement;\n } else if (slot && slot.tagName === \"FORM\") {\n this.searchBar = slot.querySelector(\n \"ic-search-bar\"\n ) as HTMLIcSearchBarElement;\n }\n\n if (this.searchBar !== null) {\n this.searchBar.hideLabel = true;\n }\n }\n };\n\n private toggleSearchBar(): void {\n this.mobileSearchBarVisible = !this.mobileSearchBarVisible;\n\n if (this.searchBar !== null) {\n if (this.mobileSearchBarVisible) {\n this.mobileSearchButtonEl.updateAriaLabel(\"Hide search\");\n this.hasFullWidthSearchBar = true;\n this.searchBar.fullWidth = true;\n setTimeout(() => {\n this.searchBar.setFocus();\n }, 100);\n } else {\n this.mobileSearchButtonEl.updateAriaLabel(\"Show search\");\n this.hasFullWidthSearchBar = false;\n this.searchBar.fullWidth = false;\n }\n }\n }\n\n private emitTopNavResized = (size: number): void => {\n const event = new CustomEvent(\"topNavResized\", { detail: { size: size } });\n this.el.dispatchEvent(event);\n };\n\n private menuButtonClick = () => {\n this.showNavMenu(true);\n };\n\n private showNavMenu(show: boolean): void {\n this.navMenuVisible = show;\n if (show) {\n this.icNavigationMenuOpened.emit();\n } else {\n this.icNavigationMenuClosed.emit();\n }\n }\n\n private searchButtonMouseDownHandler = () => {\n this.searchButtonClick = true;\n };\n\n private searchButtonClickHandler = () => {\n this.toggleSearchBar();\n this.searchButtonClick = false;\n };\n\n private resizeObserver: ResizeObserver = null;\n\n private resizeObserverCallback = (currSize: number) => {\n if (currSize !== this.deviceSize) {\n this.deviceSize = currSize;\n if (currSize > DEVICE_SIZES.L) {\n this.showNavMenu(false);\n if (this.mobileSearchBarVisible) {\n this.toggleSearchBar();\n }\n }\n this.emitTopNavResized(currSize);\n if (\n document.activeElement !== null &&\n document.activeElement !== undefined &&\n document.activeElement.tagName === \"IC-SEARCH-BAR\"\n ) {\n this.searchBar.setAttribute(\"hidden\", \"true\");\n //remove attribute again as this trigger a redraw & applies css\n this.searchBar.removeAttribute(\"hidden\");\n setTimeout(() => {\n this.searchBar.setFocus();\n }, 100);\n }\n }\n };\n\n private runResizeObserver = () => {\n this.resizeObserver = new ResizeObserver(() => {\n const currSize = getCurrentDeviceSize();\n this.resizeObserverCallback(currSize);\n });\n\n this.resizeObserver.observe(this.el);\n };\n\n componentWillLoad(): void {\n this.hasAppIcon = isSlotUsed(this.el, \"app-icon\");\n this.hasNavigation = isSlotUsed(this.el, \"navigation\");\n this.hasIconButtons = isSlotUsed(this.el, \"buttons\");\n this.hasSearchSlotContent = isSlotUsed(this.el, \"search\");\n this.deviceSize = getCurrentDeviceSize();\n this.initialiseSearchBar();\n }\n\n componentWillRender(): void {\n this.hasNavigation = isSlotUsed(this.el, \"navigation\");\n this.hasSearchSlotContent = isSlotUsed(this.el, \"search\");\n this.hasIconButtons = isSlotUsed(this.el, \"buttons\");\n this.hasAppIcon = isSlotUsed(this.el, \"app-icon\");\n }\n\n componentDidLoad(): void {\n checkResizeObserver(this.runResizeObserver);\n\n onComponentRequiredPropUndefined(\n [{ prop: this.appTitle, propName: \"app-title\" }],\n \"Top Navigation\"\n );\n }\n\n disconnectedCallback(): void {\n if (this.resizeObserver !== null) {\n this.resizeObserver.disconnect();\n }\n }\n\n render() {\n const hasMenuContent =\n this.hasNavigation ||\n this.hasIconButtons ||\n this.status !== \"\" ||\n this.version !== \"\";\n\n const searchButtonSize =\n this.deviceSize <= DEVICE_SIZES.S ? \"default\" : \"large\";\n\n let appTitleVariant: IcTypographyVariants = \"h3\";\n\n const hasTitle = this.appTitle !== \"\" && this.appTitle !== undefined;\n\n if (this.deviceSize <= DEVICE_SIZES.L) {\n appTitleVariant = \"h4\";\n if (this.deviceSize <= DEVICE_SIZES.S) {\n appTitleVariant = \"subtitle-small\";\n }\n }\n\n const mobileSearchButtonTitle = this.mobileSearchBarVisible\n ? \"Hide search\"\n : \"Show search\";\n const menuSize = this.deviceSize <= DEVICE_SIZES.S ? \"small\" : \"default\";\n\n return (\n <Host\n class={{\n [\"fullwidth-searchbar\"]: this.hasFullWidthSearchBar,\n [IcThemeForegroundEnum.Dark]:\n this.foregroundColor === IcThemeForegroundEnum.Dark,\n }}\n >\n <div class=\"top-navigation\">\n <ic-section-container aligned=\"full-width\" full-height>\n <header role=\"banner\">\n <div class=\"top-panel-container\">\n <div class=\"app-details-container\">\n {hasTitle && (\n <a class=\"title-link\" href={this.href}>\n {this.hasAppIcon && (\n <div class=\"app-icon-container\" aria-hidden=\"true\">\n <slot name=\"app-icon\" />\n </div>\n )}\n <ic-typography variant={appTitleVariant}>\n <h1>{this.appTitle}</h1>\n </ic-typography>\n </a>\n )}\n {this.status !== \"\" && (\n <div class=\"app-status\">\n <ic-typography\n aria-label=\"app tag\"\n variant=\"label-uppercase\"\n class=\"app-status-text\"\n >\n {this.status}\n </ic-typography>\n </div>\n )}\n {this.version !== \"\" && (\n <div class=\"app-version\">\n <ic-typography\n variant=\"label\"\n class=\"app-version-text\"\n aria-label=\"app version\"\n >\n {this.version}\n </ic-typography>\n </div>\n )}\n </div>\n\n {(this.hasSearchSlotContent || hasMenuContent) && (\n <div class=\"search-menu-container\">\n <div class=\"search-actions-container\">\n {this.deviceSize > DEVICE_SIZES.L && (\n <slot name=\"search\"></slot>\n )}\n\n {this.hasSearchSlotContent &&\n this.deviceSize <= DEVICE_SIZES.L && (\n <ic-button\n id=\"search-toggle-button\"\n ref={(el) => (this.mobileSearchButtonEl = el)}\n onMouseDown={this.searchButtonMouseDownHandler}\n variant=\"icon\"\n size={searchButtonSize}\n aria-label={mobileSearchButtonTitle}\n appearance={this.foregroundColor}\n onClick={this.searchButtonClickHandler}\n >\n <slot name=\"toggle-icon\" slot=\"icon\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n fill=\"#ffffff\"\n >\n <path d=\"M0 0h24v24H0V0z\" fill=\"none\" />\n <path d=\"M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z\" />\n </svg>\n </slot>\n </ic-button>\n )}\n\n {this.hasIconButtons && this.deviceSize > DEVICE_SIZES.L && (\n <div class=\"icon-buttons-container\">\n <slot name=\"buttons\"></slot>\n </div>\n )}\n {hasMenuContent && this.deviceSize <= DEVICE_SIZES.L && (\n <div class=\"menu-button-container\">\n <nav\n aria-labelledby=\"navigation-landmark-text\"\n aria-hidden={\n !this.hasNavigation || this.navMenuVisible\n ? \"true\"\n : \"false\"\n }\n >\n <ic-button\n id=\"menu-button\"\n appearance={this.foregroundColor}\n variant=\"secondary\"\n aria-expanded={this.menuOpen ? \"true\" : \"false\"}\n aria-haspopup=\"true\"\n aria-label={`Open ${\n this.hasNavigation ? \"navigation\" : \"app\"\n } menu`}\n size={menuSize}\n onClick={this.menuButtonClick}\n >\n Menu\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24px\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n fill=\"#ffffff\"\n slot=\"icon\"\n >\n <path d=\"M0 0h24v24H0V0z\" fill=\"none\" />\n <path d=\"M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z\" />\n </svg>\n </ic-button>\n </nav>\n </div>\n )}\n </div>\n </div>\n )}\n </div>\n\n {this.mobileSearchBarVisible && (\n <div class=\"search-bar-container\">\n <slot name=\"search\"></slot>\n </div>\n )}\n\n {this.hasNavigation && this.deviceSize > DEVICE_SIZES.L && (\n <div class=\"navigation-tabs\">\n <span\n id=\"navigation-landmark-text\"\n class=\"navigation-landmark-text\"\n aria-hidden=\"true\"\n >\n Main navigation\n </span>\n <nav\n aria-labelledby=\"navigation-landmark-text\"\n class=\"nav-panel-container\"\n >\n <ul class=\"navigation-item-list\">\n <slot name=\"navigation\"></slot>\n </ul>\n </nav>\n </div>\n )}\n </header>\n </ic-section-container>\n </div>\n {this.navMenuVisible && (\n <ic-navigation-menu\n version={this.version}\n status={this.status}\n class={{\n [\"inline\"]: this.inline,\n }}\n >\n <div class=\"menu-buttons-slot\" slot=\"buttons\">\n <slot name=\"buttons\"></slot>\n </div>\n <ul slot=\"navigation\">\n <slot name=\"navigation\"></slot>\n </ul>\n </ic-navigation-menu>\n )}\n </Host>\n );\n }\n}\n"]}
@@ -60,7 +60,7 @@ export class Typography {
60
60
  "optional": true,
61
61
  "docs": {
62
62
  "tags": [],
63
- "text": "Adds appropriate margins to the top and bottom of the typography."
63
+ "text": "If `true`, appropriate top and bottom margins will be applied to the typography."
64
64
  },
65
65
  "attribute": "apply-vertical-margins",
66
66
  "reflect": false,
@@ -1 +1 @@
1
- {"version":3,"file":"ic-typography.js","sourceRoot":"","sources":["../../../src/components/ic-typography/ic-typography.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AASlE,MAAM,OAAO,UAAU;;mBAMoB,MAAM;gCAKN,KAAK;;EAE9C,MAAM;IACJ,MAAM,EAAE,OAAO,EAAE,oBAAoB,EAAE,GAAG,IAAI,CAAC;IAE/C,OAAO,CACL,EAAC,IAAI,IACH,KAAK,EAAE;QACL,CAAC,iBAAiB,OAAO,EAAE,CAAC,EAAE,IAAI;QAClC,CAAC,kCAAkC,OAAO,EAAE,CAAC,EAAE,oBAAoB;OACpE;MAED,eAAQ,CACH,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h, Element, Host } from \"@stencil/core\";\n\nimport { IcTypographyVariants } from \"../../utils/types\";\n\n@Component({\n styleUrl: \"ic-typography.css\",\n tag: \"ic-typography\",\n shadow: true,\n})\nexport class Typography {\n @Element() el: HTMLIcTypographyElement;\n\n /**\n * The ICDS typography style to use.\n */\n @Prop() variant?: IcTypographyVariants = \"body\";\n\n /**\n * Adds appropriate margins to the top and bottom of the typography.\n */\n @Prop() applyVerticalMargins?: boolean = false;\n\n render() {\n const { variant, applyVerticalMargins } = this;\n\n return (\n <Host\n class={{\n [`ic-typography-${variant}`]: true,\n [`ic-typography-vertical-margins-${variant}`]: applyVerticalMargins,\n }}\n >\n <slot />\n </Host>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"ic-typography.js","sourceRoot":"","sources":["../../../src/components/ic-typography/ic-typography.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AASlE,MAAM,OAAO,UAAU;;mBAMoB,MAAM;gCAKN,KAAK;;EAE9C,MAAM;IACJ,MAAM,EAAE,OAAO,EAAE,oBAAoB,EAAE,GAAG,IAAI,CAAC;IAE/C,OAAO,CACL,EAAC,IAAI,IACH,KAAK,EAAE;QACL,CAAC,iBAAiB,OAAO,EAAE,CAAC,EAAE,IAAI;QAClC,CAAC,kCAAkC,OAAO,EAAE,CAAC,EAAE,oBAAoB;OACpE;MAED,eAAQ,CACH,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h, Element, Host } from \"@stencil/core\";\n\nimport { IcTypographyVariants } from \"../../utils/types\";\n\n@Component({\n styleUrl: \"ic-typography.css\",\n tag: \"ic-typography\",\n shadow: true,\n})\nexport class Typography {\n @Element() el: HTMLIcTypographyElement;\n\n /**\n * The ICDS typography style to use.\n */\n @Prop() variant?: IcTypographyVariants = \"body\";\n\n /**\n * If `true`, appropriate top and bottom margins will be applied to the typography.\n */\n @Prop() applyVerticalMargins?: boolean = false;\n\n render() {\n const { variant, applyVerticalMargins } = this;\n\n return (\n <Host\n class={{\n [`ic-typography-${variant}`]: true,\n [`ic-typography-vertical-margins-${variant}`]: applyVerticalMargins,\n }}\n >\n <slot />\n </Host>\n );\n }\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"testspec.setup.js","sourceRoot":"","sources":["../src/testspec.setup.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,OAAO,MAAM,iBAAiB,CAAC;AAE3C,+CAA+C;AAC/C,OAAO,EAAE,YAAY,IAAI,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAE/D,MAAM,CAAC,cAAc,CAAC,YAAY,EAAE,IAAI,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC;AACxD,MAAM,CAAC,cAAc,CAAC,YAAY,EAAE,GAAG,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC,CAAC;AACzD,MAAM,CAAC,cAAc,CAAC,YAAY,EAAE,GAAG,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC,CAAC;AACzD,MAAM,CAAC,cAAc,CAAC,YAAY,EAAE,GAAG,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC,CAAC;AACzD,MAAM,CAAC,cAAc,CAAC,YAAY,EAAE,IAAI,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC;AAE3D,qDAAqD;AACrD,MAAM,kBAAkB,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;AACrC,kBAAkB,CAAC,eAAe,CAAC;EACjC,OAAO,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC;EACxC,SAAS,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC;EAC1C,UAAU,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC;CAC5C,CAAC,CAAC;AACH,MAAM,CAAC,cAAc,CAAC,MAAM,EAAE,gBAAgB,EAAE;EAC9C,KAAK,EAAE,kBAAkB;CAC1B,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,cAAc,GAAG,KAAK,EAAE,EAAU,EAAiB,EAAE;EAChE,MAAM,IAAI,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,UAAU,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;AAC9C,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,IAAY,EAAE,EAAE;EAC7C,MAAM,WAAW,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC,OAAO,EAAE,EAAE;IACtC,OAAO,OAAO,KAAK,IAAI,CAAC;EAC1B,CAAC,CAAC,CAAC;EAEH,MAAM,CAAC,cAAc,CAAC,OAAO,EAAE,mBAAmB,EAAE;IAClD,KAAK,EAAE,WAAW;GACnB,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,mBAAmB,GAAG,KAAK,IAAmB,EAAE;EAC3D,qDAAqD;EACrD,MAAM,cAAc,CAAC,GAAG,CAAC,CAAC;AAC5B,CAAC,CAAC","sourcesContent":["import * as helpers from \"./utils/helpers\";\n\n//common setup to be used across all spec tests\nimport { DEVICE_SIZES as device_sizes } from \"./utils/helpers\";\n\nObject.defineProperty(device_sizes, \"XS\", { value: 0 });\nObject.defineProperty(device_sizes, \"S\", { value: 576 });\nObject.defineProperty(device_sizes, \"M\", { value: 768 });\nObject.defineProperty(device_sizes, \"L\", { value: 992 });\nObject.defineProperty(device_sizes, \"XL\", { value: 1200 });\n\n// ResizeObserver isn't available in test environment\nconst mockResizeObserver = jest.fn();\nmockResizeObserver.mockReturnValue({\n observe: jest.fn().mockReturnValue(null),\n unobserve: jest.fn().mockReturnValue(null),\n disconnect: jest.fn().mockReturnValue(null),\n});\nObject.defineProperty(global, \"ResizeObserver\", {\n value: mockResizeObserver,\n});\n\nexport const waitForTimeout = async (ms: number): Promise<void> => {\n await new Promise((r) => setTimeout(r, ms));\n};\n\nexport const mockDeviceSize = (size: number) => {\n const matchesFunc = jest.fn((devSize) => {\n return devSize === size;\n });\n\n Object.defineProperty(helpers, \"deviceSizeMatches\", {\n value: matchesFunc,\n });\n};\n\nexport const waitForNavGroupLoad = async (): Promise<void> => {\n //delay to account for 50ms delay in componentdidload\n await waitForTimeout(100);\n};\n"]}
1
+ {"version":3,"file":"testspec.setup.js","sourceRoot":"","sources":["../src/testspec.setup.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,OAAO,MAAM,iBAAiB,CAAC;AAE3C,+CAA+C;AAC/C,OAAO,EAAE,YAAY,IAAI,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAE/D,MAAM,CAAC,cAAc,CAAC,YAAY,EAAE,IAAI,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC;AACxD,MAAM,CAAC,cAAc,CAAC,YAAY,EAAE,GAAG,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC,CAAC;AACzD,MAAM,CAAC,cAAc,CAAC,YAAY,EAAE,GAAG,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC,CAAC;AACzD,MAAM,CAAC,cAAc,CAAC,YAAY,EAAE,GAAG,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC,CAAC;AACzD,MAAM,CAAC,cAAc,CAAC,YAAY,EAAE,IAAI,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC;AAE3D,qDAAqD;AACrD,MAAM,kBAAkB,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;AACrC,kBAAkB,CAAC,eAAe,CAAC;EACjC,OAAO,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC;EACxC,SAAS,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC;EAC1C,UAAU,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC;CAC5C,CAAC,CAAC;AACH,MAAM,CAAC,cAAc,CAAC,MAAM,EAAE,gBAAgB,EAAE;EAC9C,KAAK,EAAE,kBAAkB;CAC1B,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,cAAc,GAAG,KAAK,EAAE,EAAU,EAAiB,EAAE;EAChE,MAAM,IAAI,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,UAAU,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;AAC9C,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,IAAY,EAAQ,EAAE;EACnD,MAAM,WAAW,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC,OAAO,EAAE,EAAE;IACtC,OAAO,OAAO,KAAK,IAAI,CAAC;EAC1B,CAAC,CAAC,CAAC;EAEH,MAAM,CAAC,cAAc,CAAC,OAAO,EAAE,mBAAmB,EAAE;IAClD,KAAK,EAAE,WAAW;GACnB,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,mBAAmB,GAAG,KAAK,IAAmB,EAAE;EAC3D,qDAAqD;EACrD,MAAM,cAAc,CAAC,GAAG,CAAC,CAAC;AAC5B,CAAC,CAAC","sourcesContent":["import * as helpers from \"./utils/helpers\";\n\n//common setup to be used across all spec tests\nimport { DEVICE_SIZES as device_sizes } from \"./utils/helpers\";\n\nObject.defineProperty(device_sizes, \"XS\", { value: 0 });\nObject.defineProperty(device_sizes, \"S\", { value: 576 });\nObject.defineProperty(device_sizes, \"M\", { value: 768 });\nObject.defineProperty(device_sizes, \"L\", { value: 992 });\nObject.defineProperty(device_sizes, \"XL\", { value: 1200 });\n\n// ResizeObserver isn't available in test environment\nconst mockResizeObserver = jest.fn();\nmockResizeObserver.mockReturnValue({\n observe: jest.fn().mockReturnValue(null),\n unobserve: jest.fn().mockReturnValue(null),\n disconnect: jest.fn().mockReturnValue(null),\n});\nObject.defineProperty(global, \"ResizeObserver\", {\n value: mockResizeObserver,\n});\n\nexport const waitForTimeout = async (ms: number): Promise<void> => {\n await new Promise((r) => setTimeout(r, ms));\n};\n\nexport const mockDeviceSize = (size: number): void => {\n const matchesFunc = jest.fn((devSize) => {\n return devSize === size;\n });\n\n Object.defineProperty(helpers, \"deviceSizeMatches\", {\n value: matchesFunc,\n });\n};\n\nexport const waitForNavGroupLoad = async (): Promise<void> => {\n //delay to account for 50ms delay in componentdidload\n await waitForTimeout(100);\n};\n"]}
@@ -1 +1 @@
1
- {"file":"ic-alert.js","mappings":"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","names":[],"sources":["./src/components/ic-alert/ic-alert.css?tag=ic-alert&encapsulation=shadow","./src/components/ic-alert/ic-alert.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host {\n display: block;\n}\n\n.container {\n min-height: 56px;\n border-radius: var(--ic-border-radius);\n position: relative;\n display: flex;\n align-items: center;\n}\n\n.container-neutral {\n background-color: var(--ic-architectural-40);\n}\n\n.container-info {\n background-color: var(--ic-status-info-background);\n}\n\n.container-warning {\n background-color: var(--ic-status-warning-background);\n}\n\n.container-error {\n background-color: var(--ic-status-error-background);\n}\n\n.container-success {\n background-color: var(--ic-status-success-background);\n}\n\n.alert-icon-container {\n height: 100%;\n display: flex;\n align-items: center;\n}\n\n.divider {\n height: 100%;\n width: var(--ic-space-xs);\n border-radius: var(--ic-space-xxxs) 0 0 var(--ic-space-xxxs);\n position: absolute;\n}\n\n.divider-neutral {\n background-color: var(--ic-architectural-500);\n}\n\n.divider-info {\n background-color: var(--ic-status-info);\n}\n\n.divider-warning {\n background-color: var(--ic-status-warning-mid);\n}\n\n.divider-error {\n background-color: var(--ic-status-error);\n}\n\n.divider-success {\n background-color: var(--ic-status-success);\n}\n\n.alert-icon {\n height: var(--ic-space-lg);\n width: 22px;\n margin-left: 18px;\n}\n\n.icon-neutral > svg {\n fill: var(--ic-architectural-500);\n}\n\n:host([variant=\"info\"]) .alert-icon svg {\n fill: var(--ic-status-info);\n}\n\n:host([variant=\"warning\"]) .alert-icon svg {\n fill: var(--ic-status-warning-mid);\n}\n\n:host([variant=\"error\"]) .alert-icon svg {\n fill: var(--ic-status-error);\n}\n\n:host([variant=\"success\"]) .alert-icon svg {\n fill: var(--ic-status-success);\n}\n\n.alert-content {\n display: flex;\n align-items: center;\n margin-left: 10px;\n width: 100%;\n}\n\n.alert-message {\n display: flex;\n align-items: center;\n padding: var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0;\n flex: 1;\n}\n\n.alert-message-title-above {\n display: inline;\n font-size: 0;\n}\n\n.alert-title {\n margin-right: var(--ic-space-xs);\n}\n\n.alert-title-above {\n white-space: normal;\n}\n\n.alert-action-container {\n margin-right: var(--ic-space-xs);\n display: flex;\n align-items: center;\n}\n\n.dismiss-icon {\n margin-right: var(--ic-space-xxxs);\n margin-left: -6px;\n padding: 6px;\n border: none;\n border-radius: 50%;\n background-color: inherit;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.dismiss-icon svg {\n width: 18px;\n height: 18px;\n}\n\n.dismiss-icon:hover {\n cursor: pointer;\n}\n\n@media (max-width: 628px) {\n .alert-content {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n }\n\n .alert-message {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n font-size: 1px;\n }\n\n .alert-title {\n white-space: normal;\n }\n\n .alert-action-container {\n margin-bottom: 14px;\n }\n}\n\n@media (forced-colors: active) {\n .container {\n border: var(--ic-hc-border);\n }\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n Host,\n State,\n Listen,\n Prop,\n h,\n} from \"@stencil/core\";\nimport neutralIcon from \"../../assets/neutral-icon.svg\";\nimport infoIcon from \"../../assets/info-icon.svg\";\nimport warningIcon from \"../../assets/warning-icon.svg\";\nimport errorIcon from \"../../assets/error-icon.svg\";\nimport successIcon from \"../../assets/success-icon.svg\";\nimport closeIcon from \"../../assets/close-icon.svg\";\nimport { IcAlertVariants } from \"./ic-alert.types\";\nimport { isSlotUsed } from \"../../utils/helpers\";\nimport { IcThemeForegroundEnum } from \"../../utils/types\";\n\nconst icon = {\n neutral: neutralIcon,\n info: infoIcon,\n warning: warningIcon,\n error: errorIcon,\n success: successIcon,\n};\n\n/**\n * @slot message - Content is placed to the right of the title.\n * @slot action - Content is placed to the left of the message.\n */\n@Component({\n tag: \"ic-alert\",\n styleUrl: \"ic-alert.css\",\n shadow: true,\n})\nexport class Alert {\n @Element() el: HTMLIcAlertElement;\n\n /**\n * Set which variant of the alert will be rendered\n */\n @Prop() variant?: IcAlertVariants = \"neutral\";\n /**\n * Optional title to display at the start of the alert\n */\n @Prop() heading?: string = \"\";\n /**\n * Main body message of the alert\n */\n @Prop() message?: string;\n /**\n * Set whether the title and message appear inline or above and below\n */\n @Prop() titleAbove?: boolean = false;\n /**\n * Set whether the alert has a close icon at the end to dismiss it\n */\n @Prop() dismissible?: boolean = false;\n /**\n * Set whether the alert has the 'alert' aria role and will be announced to screen readers\n */\n @Prop() announced?: boolean = true;\n\n @State() visible: boolean = true;\n\n @State() alertTitleWrap: boolean = false;\n\n @Listen(\"dismiss\", { capture: true })\n handleClick(): void {\n this.visible = !this.visible;\n }\n /**\n * Is emitted when the user dismisses the alert.\n */\n @Event() dismiss: EventEmitter<void>;\n\n private dismissAction = (): void => {\n this.dismiss.emit();\n };\n\n private alertTitleShouldWrap() {\n const titleHeight =\n this.el.shadowRoot.querySelector(\".alert-title\")?.clientHeight;\n if (titleHeight > 24) this.alertTitleWrap = true;\n }\n\n componentDidLoad(): void {\n this.alertTitleShouldWrap();\n }\n\n render() {\n const {\n variant,\n heading,\n message,\n titleAbove,\n dismissible,\n announced,\n visible,\n } = this;\n\n return (\n visible && (\n <Host\n role={announced && \"alert\"}\n class={{\n [IcThemeForegroundEnum.Dark]: true,\n }}\n >\n <div\n class={{\n [\"container\"]: true,\n [`container-${variant}`]: true,\n }}\n >\n <div class=\"alert-icon-container\">\n <div\n class={{\n [\"divider\"]: true,\n [`divider-${variant}`]: true,\n }}\n ></div>\n <span\n class={{\n [\"alert-icon\"]: true,\n [\"svg-container\"]: true,\n [`icon-${variant}`]: true,\n }}\n innerHTML={icon[variant]}\n ></span>\n </div>\n <div class=\"alert-content\">\n <div\n class={{\n [\"alert-message\"]: true,\n [\"alert-message-title-above\"]:\n titleAbove || this.alertTitleWrap,\n }}\n >\n {heading && (\n <ic-typography\n class={{\n [\"alert-title\"]: true,\n [\"alert-title-above\"]: titleAbove || this.alertTitleWrap,\n }}\n variant=\"subtitle-large\"\n >\n <p>{heading}</p>\n </ic-typography>\n )}\n <slot name=\"message\">\n <ic-typography variant=\"body\">{message}</ic-typography>\n </slot>\n </div>\n {isSlotUsed(this.el, \"action\") && (\n <div class=\"alert-action-container\">\n <slot name=\"action\" />\n </div>\n )}\n </div>\n <div class=\"dismiss-icon-container\">\n {dismissible && (\n <ic-button\n class={{\n [\"svg-container\"]: true,\n [\"dismiss-icon\"]: true,\n }}\n innerHTML={closeIcon}\n onClick={this.dismissAction}\n variant=\"icon\"\n appearance={IcThemeForegroundEnum.Dark}\n title=\"dismiss\"\n ></ic-button>\n )}\n </div>\n </div>\n </Host>\n )\n );\n }\n}\n"],"version":3}
1
+ {"file":"ic-alert.js","mappings":"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","names":[],"sources":["./src/components/ic-alert/ic-alert.css?tag=ic-alert&encapsulation=shadow","./src/components/ic-alert/ic-alert.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host {\n display: block;\n}\n\n.container {\n min-height: 56px;\n border-radius: var(--ic-border-radius);\n position: relative;\n display: flex;\n align-items: center;\n}\n\n.container-neutral {\n background-color: var(--ic-architectural-40);\n}\n\n.container-info {\n background-color: var(--ic-status-info-background);\n}\n\n.container-warning {\n background-color: var(--ic-status-warning-background);\n}\n\n.container-error {\n background-color: var(--ic-status-error-background);\n}\n\n.container-success {\n background-color: var(--ic-status-success-background);\n}\n\n.alert-icon-container {\n height: 100%;\n display: flex;\n align-items: center;\n}\n\n.divider {\n height: 100%;\n width: var(--ic-space-xs);\n border-radius: var(--ic-space-xxxs) 0 0 var(--ic-space-xxxs);\n position: absolute;\n}\n\n.divider-neutral {\n background-color: var(--ic-architectural-500);\n}\n\n.divider-info {\n background-color: var(--ic-status-info);\n}\n\n.divider-warning {\n background-color: var(--ic-status-warning-mid);\n}\n\n.divider-error {\n background-color: var(--ic-status-error);\n}\n\n.divider-success {\n background-color: var(--ic-status-success);\n}\n\n.alert-icon {\n height: var(--ic-space-lg);\n width: 22px;\n margin-left: 18px;\n}\n\n.icon-neutral > svg {\n fill: var(--ic-architectural-500);\n}\n\n:host([variant=\"info\"]) .alert-icon svg {\n fill: var(--ic-status-info);\n}\n\n:host([variant=\"warning\"]) .alert-icon svg {\n fill: var(--ic-status-warning-mid);\n}\n\n:host([variant=\"error\"]) .alert-icon svg {\n fill: var(--ic-status-error);\n}\n\n:host([variant=\"success\"]) .alert-icon svg {\n fill: var(--ic-status-success);\n}\n\n.alert-content {\n display: flex;\n align-items: center;\n margin-left: 10px;\n width: 100%;\n}\n\n.alert-message {\n display: flex;\n align-items: center;\n padding: var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0;\n flex: 1;\n}\n\n.alert-message-title-above {\n display: inline;\n font-size: 0;\n}\n\n.alert-title {\n margin-right: var(--ic-space-xs);\n}\n\n.alert-title-above {\n white-space: normal;\n}\n\n.alert-action-container {\n margin-right: var(--ic-space-xs);\n display: flex;\n align-items: center;\n}\n\n.dismiss-icon {\n margin-right: var(--ic-space-xxxs);\n margin-left: -6px;\n padding: 6px;\n border: none;\n border-radius: 50%;\n background-color: inherit;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.dismiss-icon svg {\n width: 18px;\n height: 18px;\n}\n\n.dismiss-icon:hover {\n cursor: pointer;\n}\n\n@media (max-width: 628px) {\n .alert-content {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n }\n\n .alert-message {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n font-size: 1px;\n }\n\n .alert-title {\n white-space: normal;\n }\n\n .alert-action-container {\n margin-bottom: 14px;\n }\n}\n\n@media (forced-colors: active) {\n .container {\n border: var(--ic-hc-border);\n }\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n Host,\n State,\n Listen,\n Prop,\n h,\n} from \"@stencil/core\";\nimport neutralIcon from \"../../assets/neutral-icon.svg\";\nimport infoIcon from \"../../assets/info-icon.svg\";\nimport warningIcon from \"../../assets/warning-icon.svg\";\nimport errorIcon from \"../../assets/error-icon.svg\";\nimport successIcon from \"../../assets/success-icon.svg\";\nimport closeIcon from \"../../assets/close-icon.svg\";\nimport { IcAlertVariants } from \"./ic-alert.types\";\nimport { isSlotUsed } from \"../../utils/helpers\";\nimport { IcThemeForegroundEnum } from \"../../utils/types\";\n\nconst icon = {\n neutral: neutralIcon,\n info: infoIcon,\n warning: warningIcon,\n error: errorIcon,\n success: successIcon,\n};\n\n/**\n * @slot message - Content is placed to the right of the title.\n * @slot action - Content is placed to the right of the message.\n */\n@Component({\n tag: \"ic-alert\",\n styleUrl: \"ic-alert.css\",\n shadow: true,\n})\nexport class Alert {\n @Element() el: HTMLIcAlertElement;\n\n /**\n * The variant of the alert which will be rendered.\n */\n @Prop() variant?: IcAlertVariants = \"neutral\";\n /**\n * The optional title to display at the start of the alert.\n */\n @Prop() heading?: string = \"\";\n /**\n * The main body message of the alert.\n */\n @Prop() message?: string;\n /**\n * If `true`, the title and message will appear inline instead of above and below.\n */\n @Prop() titleAbove?: boolean = false;\n /**\n * If `true`, the alert will have a close icon at the end to dismiss it.\n */\n @Prop() dismissible?: boolean = false;\n /**\n * If `true`, the alert will have the 'alert' ARIA role and will be announced to screen readers.\n */\n @Prop() announced?: boolean = true;\n\n @State() visible: boolean = true;\n\n @State() alertTitleWrap: boolean = false;\n\n @Listen(\"dismiss\", { capture: true })\n handleClick(): void {\n this.visible = !this.visible;\n }\n /**\n * Is emitted when the user dismisses the alert.\n */\n @Event() dismiss: EventEmitter<void>;\n\n private dismissAction = (): void => {\n this.dismiss.emit();\n };\n\n private alertTitleShouldWrap() {\n const titleHeight =\n this.el.shadowRoot.querySelector(\".alert-title\")?.clientHeight;\n if (titleHeight > 24) this.alertTitleWrap = true;\n }\n\n componentDidLoad(): void {\n this.alertTitleShouldWrap();\n }\n\n render() {\n const {\n variant,\n heading,\n message,\n titleAbove,\n dismissible,\n announced,\n visible,\n } = this;\n\n return (\n visible && (\n <Host\n role={announced && \"alert\"}\n class={{\n [IcThemeForegroundEnum.Dark]: true,\n }}\n >\n <div\n class={{\n [\"container\"]: true,\n [`container-${variant}`]: true,\n }}\n >\n <div class=\"alert-icon-container\">\n <div\n class={{\n [\"divider\"]: true,\n [`divider-${variant}`]: true,\n }}\n ></div>\n <span\n class={{\n [\"alert-icon\"]: true,\n [\"svg-container\"]: true,\n [`icon-${variant}`]: true,\n }}\n innerHTML={icon[variant]}\n ></span>\n </div>\n <div class=\"alert-content\">\n <div\n class={{\n [\"alert-message\"]: true,\n [\"alert-message-title-above\"]:\n titleAbove || this.alertTitleWrap,\n }}\n >\n {heading && (\n <ic-typography\n class={{\n [\"alert-title\"]: true,\n [\"alert-title-above\"]: titleAbove || this.alertTitleWrap,\n }}\n variant=\"subtitle-large\"\n >\n <p>{heading}</p>\n </ic-typography>\n )}\n <slot name=\"message\">\n <ic-typography variant=\"body\">{message}</ic-typography>\n </slot>\n </div>\n {isSlotUsed(this.el, \"action\") && (\n <div class=\"alert-action-container\">\n <slot name=\"action\" />\n </div>\n )}\n </div>\n <div class=\"dismiss-icon-container\">\n {dismissible && (\n <ic-button\n class={{\n [\"svg-container\"]: true,\n [\"dismiss-icon\"]: true,\n }}\n innerHTML={closeIcon}\n onClick={this.dismissAction}\n variant=\"icon\"\n appearance={IcThemeForegroundEnum.Dark}\n title=\"dismiss\"\n ></ic-button>\n )}\n </div>\n </div>\n </Host>\n )\n );\n }\n}\n"],"version":3}
@@ -6,7 +6,7 @@ const ArrowUpward = `<svg xmlns="http://www.w3.org/2000/svg" height="16px" viewB
6
6
  <path d="M0 8L1.41 9.41L7 3.83V16H9V3.83L14.58 9.42L16 8L8 0L0 8Z"/>
7
7
  </svg>`;
8
8
 
9
- const icBackToTopCss = "/*! 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{display:block;position:absolute;right:0}button{position:fixed;right:var(--ic-space-md);bottom:var(--ic-space-md);height:40px;align-items:center;padding:var(--ic-space-xs) var(--ic-space-md) var(--ic-space-xs)\n var(--ic-space-sm);margin:0;gap:var(--ic-space-xs);display:flex;background-color:var(--ic-architectural-white);border:1px solid var(--ic-action-default);outline-width:inherit;box-sizing:border-box;box-shadow:var(--ic-elevation-overlay);border-radius:80px;text-decoration:none;visibility:hidden;opacity:0;transition:visibility 0s linear var(--ic-transition-duration-slow),\n opacity var(--ic-transition-duration-slow);cursor:pointer;z-index:var(--ic-z-index-overlay)}button:hover{text-decoration:none;background-color:var(--ic-action-default-bg-hover-no-alpha);border:1px solid var(--ic-action-default-hover)}button:active{text-decoration:none;background-color:var(--ic-action-default-bg-active-no-alpha);border:1px solid var(--ic-action-default-active)}button:focus{box-shadow:var(--ic-border-focus)}.ic-back-to-top-link.show{visibility:visible;opacity:1;transition:visibility 0s linear 0s,\n opacity var(--ic-transition-duration-slow),\n box-shadow var(--ic-easing-transition-fast)}.ic-back-to-top-link.by-footer{position:relative;right:var(--ic-space-md);bottom:56px}.ic-back-to-top-link.offset-banner{margin-bottom:var(--ic-space-lg)}.ic-back-to-top-icon{fill:var(--ic-action-default);padding-left:var(--ic-space-xxs);padding-top:var(--ic-space-xxxs)}.ic-back-to-top-link span{color:var(--ic-action-default)}.ic-back-to-top-link:hover .ic-back-to-top-icon{fill:var(--ic-action-default-hover)}.ic-back-to-top-link:hover span{color:var(--ic-action-default-hover)}@media (forced-colors: active){.ic-back-to-top-icon{fill:currentColor}}";
9
+ const icBackToTopCss = "/*! 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{display:block;position:absolute;right:0}button{position:fixed;right:var(--ic-space-md);bottom:var(--ic-space-md);height:40px;align-items:center;padding:var(--ic-space-xs) var(--ic-space-md) var(--ic-space-xs)\n var(--ic-space-sm);margin:0;gap:var(--ic-space-xs);display:flex;background-color:var(--ic-architectural-white);border:1px solid var(--ic-action-default);outline-width:inherit;box-sizing:border-box;box-shadow:var(--ic-elevation-overlay);border-radius:80px;text-decoration:none;visibility:hidden;opacity:0;transition:visibility 0s linear var(--ic-transition-duration-slow),\n opacity var(--ic-transition-duration-slow);cursor:pointer;z-index:var(--ic-z-index-overlay)}button:hover{text-decoration:none;background-color:var(--ic-action-default-bg-hover-no-alpha);border:1px solid var(--ic-action-default-hover)}button:active{text-decoration:none;background-color:var(--ic-action-default-bg-active-no-alpha);border:1px solid var(--ic-action-default-active)}button:focus{box-shadow:var(--ic-border-focus)}.ic-back-to-top-link.show{visibility:visible;opacity:1;transition:visibility 0s linear 0s,\n opacity var(--ic-transition-duration-slow),\n box-shadow var(--ic-easing-transition-fast)}.ic-back-to-top-link.by-footer{position:relative;right:var(--ic-space-md);bottom:56px}.ic-back-to-top-link.offset-banner{margin-bottom:var(--ic-space-lg)}.ic-back-to-top-icon{fill:var(--ic-action-default);padding-left:var(--ic-space-xxs);padding-top:var(--ic-space-xxxs)}.ic-back-to-top-link span{color:var(--ic-action-default)}.ic-back-to-top-link:hover .ic-back-to-top-icon{fill:var(--ic-action-default-hover)}.ic-back-to-top-link:hover span{color:var(--ic-action-default-hover)}@media (forced-colors: active){.ic-back-to-top-icon{fill:currentcolor}}";
10
10
 
11
11
  const backToTopLabel = "Back to top";
12
12
  const BackToTop = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
@@ -19,7 +19,13 @@ const BackToTop = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
19
19
  this.targetElVisible = visible;
20
20
  };
21
21
  this.setFooterVisible = (visible) => {
22
- this.footerVisible = visible;
22
+ this.checkForClassificationBanner();
23
+ if (typeof window !== "undefined" && window.scrollY === 0) {
24
+ this.footerVisible = false;
25
+ }
26
+ else {
27
+ this.footerVisible = visible;
28
+ }
23
29
  };
24
30
  this.targetElObserverCallback = (entries) => {
25
31
  this.setTargetElVisible(entries[0].isIntersecting);
@@ -80,6 +86,11 @@ const BackToTop = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
80
86
  this.targetEl.scrollIntoView();
81
87
  }
82
88
  };
89
+ this.checkForClassificationBanner = () => {
90
+ //adjust position for classification banner at bottom
91
+ const banners = document.querySelectorAll("ic-classification-banner:not([inline='true'])");
92
+ this.bannerOffset = banners.length > 0;
93
+ };
83
94
  this.target = undefined;
84
95
  this.bannerOffset = false;
85
96
  this.targetElVisible = true;
@@ -93,13 +104,12 @@ const BackToTop = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
93
104
  }
94
105
  componentWillLoad() {
95
106
  this.createTopObserver(this.target);
96
- //adjust position for classification banner at bottom
97
- const banners = document.querySelectorAll("ic-classification-banner:not([inline='true'])");
98
- if (banners.length) {
99
- this.bannerOffset = true;
100
- }
107
+ this.checkForClassificationBanner();
101
108
  //observer for when footer scrolls into view
102
- const footers = document.querySelectorAll("footer");
109
+ let footers = document.querySelectorAll("ic-footer");
110
+ if (footers.length === 0) {
111
+ footers = document.querySelectorAll("footer");
112
+ }
103
113
  if (footers.length) {
104
114
  const footerEl = footers[footers.length - 1];
105
115
  const threshold = this.bannerOffset ? 0.15 : 0;
@@ -1 +1 @@
1
- {"file":"ic-back-to-top.js","mappings":"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","names":[],"sources":["./src/components/ic-back-to-top/ic-back-to-top.css?tag=ic-back-to-top&encapsulation=shadow","./src/components/ic-back-to-top/ic-back-to-top.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host {\n display: block;\n position: absolute;\n right: 0;\n}\n\nbutton {\n position: fixed;\n right: var(--ic-space-md);\n bottom: var(--ic-space-md);\n height: 40px;\n align-items: center;\n padding: var(--ic-space-xs) var(--ic-space-md) var(--ic-space-xs)\n var(--ic-space-sm);\n margin: 0;\n gap: var(--ic-space-xs);\n display: flex;\n background-color: var(--ic-architectural-white);\n border: 1px solid var(--ic-action-default);\n outline-width: inherit;\n box-sizing: border-box;\n box-shadow: var(--ic-elevation-overlay);\n border-radius: 80px;\n text-decoration: none;\n visibility: hidden;\n opacity: 0;\n transition: visibility 0s linear var(--ic-transition-duration-slow),\n opacity var(--ic-transition-duration-slow);\n cursor: pointer;\n z-index: var(--ic-z-index-overlay);\n}\n\nbutton:hover {\n text-decoration: none;\n background-color: var(--ic-action-default-bg-hover-no-alpha);\n border: 1px solid var(--ic-action-default-hover);\n}\n\nbutton:active {\n text-decoration: none;\n background-color: var(--ic-action-default-bg-active-no-alpha);\n border: 1px solid var(--ic-action-default-active);\n}\n\nbutton:focus {\n box-shadow: var(--ic-border-focus);\n}\n\n.ic-back-to-top-link.show {\n visibility: visible;\n opacity: 1;\n transition: visibility 0s linear 0s,\n opacity var(--ic-transition-duration-slow),\n box-shadow var(--ic-easing-transition-fast);\n}\n\n.ic-back-to-top-link.by-footer {\n position: relative;\n right: var(--ic-space-md);\n bottom: 56px;\n}\n\n.ic-back-to-top-link.offset-banner {\n margin-bottom: var(--ic-space-lg);\n}\n\n.ic-back-to-top-icon {\n fill: var(--ic-action-default);\n padding-left: var(--ic-space-xxs);\n padding-top: var(--ic-space-xxxs);\n}\n\n.ic-back-to-top-link span {\n color: var(--ic-action-default);\n}\n\n.ic-back-to-top-link:hover .ic-back-to-top-icon {\n fill: var(--ic-action-default-hover);\n}\n\n.ic-back-to-top-link:hover span {\n color: var(--ic-action-default-hover);\n}\n\n@media (forced-colors: active) {\n .ic-back-to-top-icon {\n fill: currentColor;\n }\n}\n","import { Component, h, Element, Prop, State, Watch } from \"@stencil/core\";\nimport ArrowUpward from \"./assets/ArrowUpward.svg\";\nimport {\n onComponentPropUndefinedChange,\n onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\n\nconst backToTopLabel = \"Back to top\";\n\n@Component({\n tag: \"ic-back-to-top\",\n styleUrl: \"ic-back-to-top.css\",\n shadow: true,\n})\nexport class BackToTop {\n @Element() el: HTMLIcBackToTopElement;\n\n /**\n * The ID of the element to jump back to when the link is clicked.\n */\n @Prop() target!: string;\n\n @State() bannerOffset: boolean = false;\n\n @State() targetElVisible: boolean = true;\n\n @State() footerVisible: boolean = false;\n\n @Watch(\"target\")\n watchPropHandler(newValue: string, oldValue: string): void {\n //added for gatsby rehydration issue where prop is initially undefined but then changes to actual value\n onComponentPropUndefinedChange(oldValue, newValue, () => {\n this.createTopObserver(newValue);\n });\n }\n private topObserver: IntersectionObserver = null;\n private targetEl: Element;\n private isTargetElNull: boolean;\n\n private setTargetElVisible = (visible: boolean) => {\n this.targetElVisible = visible;\n };\n\n private setFooterVisible = (visible: boolean) => {\n this.footerVisible = visible;\n };\n\n private targetElObserverCallback = (entries: IntersectionObserverEntry[]) => {\n this.setTargetElVisible(entries[0].isIntersecting);\n };\n\n private footerObserverCallback = (entries: IntersectionObserverEntry[]) => {\n this.setFooterVisible(entries[0].isIntersecting);\n };\n\n private findTargetEl = (target: string): Element => {\n let targetElement: Element = null;\n if (target === null || target === undefined) {\n console.log(\n \"Error: No target ID specified for back to top component - defaulting to top of page\"\n );\n } else {\n targetElement = document.querySelector(\n target.indexOf(\"#\") === 0 ? target : \"#\" + target\n );\n if (targetElement === null) {\n console.log(\n `Error: Back to top target element '${target}' not found - defaulting to top of page`\n );\n }\n }\n return targetElement;\n };\n\n private createTopObserver = (target: string) => {\n this.targetEl = this.findTargetEl(target);\n let objParent: HTMLElement;\n\n //remove old element & observer\n if (this.topObserver !== null) {\n const observedEl = document.querySelector(\"#ic-back-to-top-target\");\n if (observedEl !== null) {\n this.topObserver.unobserve(observedEl);\n observedEl.remove();\n }\n }\n\n if (this.targetEl === null) {\n objParent = document.body;\n this.targetEl = objParent.firstElementChild;\n this.isTargetElNull = true;\n } else {\n objParent = this.targetEl.parentNode as HTMLElement;\n this.isTargetElNull = false;\n }\n\n //insert a new 0px height element before specified target that can be used to determine when page is scrolled\n const objBackToTopTargetEl = document.createElement(\"div\");\n objBackToTopTargetEl.setAttribute(\"id\", \"ic-back-to-top-target\");\n objParent.insertBefore(objBackToTopTargetEl, this.targetEl);\n\n // resize observer needs to factor in any top margin on the target el\n const marginTop = getComputedStyle(this.targetEl).marginTop;\n this.topObserver = new IntersectionObserver(this.targetElObserverCallback, {\n threshold: [0],\n rootMargin: `${marginTop} 0px 0px 0px`,\n });\n this.topObserver.observe(objBackToTopTargetEl);\n };\n\n private handleClick = () => {\n if (this.isTargetElNull) {\n window.scrollTo(0, 0);\n } else {\n this.targetEl.scrollIntoView();\n }\n };\n\n componentWillLoad(): void {\n this.createTopObserver(this.target);\n\n //adjust position for classification banner at bottom\n const banners = document.querySelectorAll(\n \"ic-classification-banner:not([inline='true'])\"\n );\n if (banners.length) {\n this.bannerOffset = true;\n }\n\n //observer for when footer scrolls into view\n const footers = document.querySelectorAll(\"footer\");\n if (footers.length) {\n const footerEl = footers[footers.length - 1];\n const threshold = this.bannerOffset ? 0.15 : 0;\n const footerObserver = new IntersectionObserver(\n this.footerObserverCallback,\n { threshold: [threshold] }\n );\n footerObserver.observe(footerEl);\n }\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [{ prop: this.target, propName: \"target\" }],\n \"Back to Top\"\n );\n }\n\n render() {\n const { bannerOffset, targetElVisible, footerVisible } = this;\n return (\n <button\n class={{\n [\"ic-back-to-top-link\"]: true,\n [\"offset-banner\"]: bannerOffset,\n [\"show\"]: !targetElVisible,\n [\"by-footer\"]: footerVisible,\n }}\n aria-label={backToTopLabel}\n onClick={this.handleClick}\n >\n <span class=\"ic-back-to-top-icon\" innerHTML={ArrowUpward} />\n\n <ic-typography variant=\"subtitle-small\">\n <span>{backToTopLabel}</span>\n </ic-typography>\n </button>\n );\n }\n}\n"],"version":3}
1
+ {"file":"ic-back-to-top.js","mappings":"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","names":[],"sources":["./src/components/ic-back-to-top/ic-back-to-top.css?tag=ic-back-to-top&encapsulation=shadow","./src/components/ic-back-to-top/ic-back-to-top.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host {\n display: block;\n position: absolute;\n right: 0;\n}\n\nbutton {\n position: fixed;\n right: var(--ic-space-md);\n bottom: var(--ic-space-md);\n height: 40px;\n align-items: center;\n padding: var(--ic-space-xs) var(--ic-space-md) var(--ic-space-xs)\n var(--ic-space-sm);\n margin: 0;\n gap: var(--ic-space-xs);\n display: flex;\n background-color: var(--ic-architectural-white);\n border: 1px solid var(--ic-action-default);\n outline-width: inherit;\n box-sizing: border-box;\n box-shadow: var(--ic-elevation-overlay);\n border-radius: 80px;\n text-decoration: none;\n visibility: hidden;\n opacity: 0;\n transition: visibility 0s linear var(--ic-transition-duration-slow),\n opacity var(--ic-transition-duration-slow);\n cursor: pointer;\n z-index: var(--ic-z-index-overlay);\n}\n\nbutton:hover {\n text-decoration: none;\n background-color: var(--ic-action-default-bg-hover-no-alpha);\n border: 1px solid var(--ic-action-default-hover);\n}\n\nbutton:active {\n text-decoration: none;\n background-color: var(--ic-action-default-bg-active-no-alpha);\n border: 1px solid var(--ic-action-default-active);\n}\n\nbutton:focus {\n box-shadow: var(--ic-border-focus);\n}\n\n.ic-back-to-top-link.show {\n visibility: visible;\n opacity: 1;\n transition: visibility 0s linear 0s,\n opacity var(--ic-transition-duration-slow),\n box-shadow var(--ic-easing-transition-fast);\n}\n\n.ic-back-to-top-link.by-footer {\n position: relative;\n right: var(--ic-space-md);\n bottom: 56px;\n}\n\n.ic-back-to-top-link.offset-banner {\n margin-bottom: var(--ic-space-lg);\n}\n\n.ic-back-to-top-icon {\n fill: var(--ic-action-default);\n padding-left: var(--ic-space-xxs);\n padding-top: var(--ic-space-xxxs);\n}\n\n.ic-back-to-top-link span {\n color: var(--ic-action-default);\n}\n\n.ic-back-to-top-link:hover .ic-back-to-top-icon {\n fill: var(--ic-action-default-hover);\n}\n\n.ic-back-to-top-link:hover span {\n color: var(--ic-action-default-hover);\n}\n\n@media (forced-colors: active) {\n .ic-back-to-top-icon {\n fill: currentcolor;\n }\n}\n","import { Component, h, Element, Prop, State, Watch } from \"@stencil/core\";\nimport ArrowUpward from \"./assets/ArrowUpward.svg\";\nimport {\n onComponentPropUndefinedChange,\n onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\n\nconst backToTopLabel = \"Back to top\";\n\n@Component({\n tag: \"ic-back-to-top\",\n styleUrl: \"ic-back-to-top.css\",\n shadow: true,\n})\nexport class BackToTop {\n @Element() el: HTMLIcBackToTopElement;\n\n /**\n * The ID of the element to jump back to when the link is clicked.\n */\n @Prop() target!: string;\n\n @State() bannerOffset: boolean = false;\n\n @State() targetElVisible: boolean = true;\n\n @State() footerVisible: boolean = false;\n\n @Watch(\"target\")\n watchPropHandler(newValue: string, oldValue: string): void {\n //added for gatsby rehydration issue where prop is initially undefined but then changes to actual value\n onComponentPropUndefinedChange(oldValue, newValue, () => {\n this.createTopObserver(newValue);\n });\n }\n private topObserver: IntersectionObserver = null;\n private targetEl: Element;\n private isTargetElNull: boolean;\n\n private setTargetElVisible = (visible: boolean) => {\n this.targetElVisible = visible;\n };\n\n private setFooterVisible = (visible: boolean) => {\n this.checkForClassificationBanner();\n if (typeof window !== \"undefined\" && window.scrollY === 0) {\n this.footerVisible = false;\n } else {\n this.footerVisible = visible;\n }\n };\n\n private targetElObserverCallback = (entries: IntersectionObserverEntry[]) => {\n this.setTargetElVisible(entries[0].isIntersecting);\n };\n\n private footerObserverCallback = (entries: IntersectionObserverEntry[]) => {\n this.setFooterVisible(entries[0].isIntersecting);\n };\n\n private findTargetEl = (target: string): Element => {\n let targetElement: Element = null;\n if (target === null || target === undefined) {\n console.log(\n \"Error: No target ID specified for back to top component - defaulting to top of page\"\n );\n } else {\n targetElement = document.querySelector(\n target.indexOf(\"#\") === 0 ? target : \"#\" + target\n );\n if (targetElement === null) {\n console.log(\n `Error: Back to top target element '${target}' not found - defaulting to top of page`\n );\n }\n }\n return targetElement;\n };\n\n private createTopObserver = (target: string) => {\n this.targetEl = this.findTargetEl(target);\n let objParent: HTMLElement;\n\n //remove old element & observer\n if (this.topObserver !== null) {\n const observedEl = document.querySelector(\"#ic-back-to-top-target\");\n if (observedEl !== null) {\n this.topObserver.unobserve(observedEl);\n observedEl.remove();\n }\n }\n\n if (this.targetEl === null) {\n objParent = document.body;\n this.targetEl = objParent.firstElementChild;\n this.isTargetElNull = true;\n } else {\n objParent = this.targetEl.parentNode as HTMLElement;\n this.isTargetElNull = false;\n }\n\n //insert a new 0px height element before specified target that can be used to determine when page is scrolled\n const objBackToTopTargetEl = document.createElement(\"div\");\n objBackToTopTargetEl.setAttribute(\"id\", \"ic-back-to-top-target\");\n objParent.insertBefore(objBackToTopTargetEl, this.targetEl);\n\n // resize observer needs to factor in any top margin on the target el\n const marginTop = getComputedStyle(this.targetEl).marginTop;\n this.topObserver = new IntersectionObserver(this.targetElObserverCallback, {\n threshold: [0],\n rootMargin: `${marginTop} 0px 0px 0px`,\n });\n this.topObserver.observe(objBackToTopTargetEl);\n };\n\n private handleClick = () => {\n if (this.isTargetElNull) {\n window.scrollTo(0, 0);\n } else {\n this.targetEl.scrollIntoView();\n }\n };\n\n private checkForClassificationBanner = () => {\n //adjust position for classification banner at bottom\n const banners = document.querySelectorAll(\n \"ic-classification-banner:not([inline='true'])\"\n );\n this.bannerOffset = banners.length > 0;\n };\n\n componentWillLoad(): void {\n this.createTopObserver(this.target);\n this.checkForClassificationBanner();\n\n //observer for when footer scrolls into view\n let footers = document.querySelectorAll(\n \"ic-footer\"\n ) as NodeListOf<HTMLElement>;\n if (footers.length === 0) {\n footers = document.querySelectorAll(\"footer\");\n }\n\n if (footers.length) {\n const footerEl = footers[footers.length - 1];\n const threshold = this.bannerOffset ? 0.15 : 0;\n const footerObserver = new IntersectionObserver(\n this.footerObserverCallback,\n { threshold: [threshold] }\n );\n footerObserver.observe(footerEl);\n }\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [{ prop: this.target, propName: \"target\" }],\n \"Back to Top\"\n );\n }\n\n render() {\n const { bannerOffset, targetElVisible, footerVisible } = this;\n return (\n <button\n class={{\n [\"ic-back-to-top-link\"]: true,\n [\"offset-banner\"]: bannerOffset,\n [\"show\"]: !targetElVisible,\n [\"by-footer\"]: footerVisible,\n }}\n aria-label={backToTopLabel}\n onClick={this.handleClick}\n >\n <span class=\"ic-back-to-top-icon\" innerHTML={ArrowUpward} />\n\n <ic-typography variant=\"subtitle-small\">\n <span>{backToTopLabel}</span>\n </ic-typography>\n </button>\n );\n }\n}\n"],"version":3}
@@ -1 +1 @@
1
- {"file":"ic-breadcrumb-group.js","mappings":"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","names":[],"sources":["./src/components/ic-breadcrumb-group/ic-breadcrumb-group.css?tag=ic-breadcrumb-group&encapsulation=shadow","./src/components/ic-breadcrumb-group/ic-breadcrumb-group.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n:host ol {\n display: flex;\n list-style-type: none;\n align-items: center;\n flex-wrap: wrap;\n padding: 0;\n margin: 0;\n}\n\n:host(.back) ol ::slotted(ic-breadcrumb) {\n display: none;\n}\n\n:host(.back) ol ::slotted(ic-breadcrumb.show) {\n display: flex;\n}\n\n:host(.collapsed) ol ::slotted(ic-breadcrumb.hide) {\n display: none;\n opacity: 0;\n visibility: hidden;\n}\n\n:host(.collapsed) ol ::slotted(ic-breadcrumb.visuallyhidden) {\n display: block;\n opacity: 0;\n transition: all var(--ic-easing-transition-slow);\n}\n\n:host(.collapsed) ol ::slotted(ic-breadcrumb.fade) {\n opacity: 1;\n}\n","import { Component, Host, h, Element, Prop, State } from \"@stencil/core\";\nimport {\n checkResizeObserver,\n DEVICE_SIZES,\n getCurrentDeviceSize,\n} from \"../../utils/helpers\";\n\n@Component({\n tag: \"ic-breadcrumb-group\",\n styleUrl: \"ic-breadcrumb-group.css\",\n shadow: true,\n})\n\n// Added ResizeObserver to find out width of breadcrumbs and parents. Use side navigation long title for ref.\nexport class BreadcrumbGroup {\n @Element() el: HTMLIcBreadcrumbGroupElement;\n /**\n * If true, display the parent page and back icon as breadcrumb\n */\n @Prop() backBreadcrumbOnly: boolean = false;\n /**\n * If true, all breadcrumbs between the first and last breadcrumb will be collapsed\n */\n @Prop() collapsed: boolean = false;\n\n @State() deviceSize: number = DEVICE_SIZES.XL;\n @State() expandedBreadcrumbs: boolean = false;\n\n private breadcrumbs: HTMLIcBreadcrumbElement[];\n private breadcrumb: HTMLIcBreadcrumbElement;\n private collapsedBreadcrumbs: HTMLIcBreadcrumbElement[];\n private ADD_CLASS_DELAY = 50;\n private collapsedBreadcrumbWrapper: HTMLIcBreadcrumbElement;\n\n private setBackBreadcrumb = () => {\n if (this.backBreadcrumbOnly) {\n this.setBackBreadcrumbAttr();\n }\n };\n\n private setBackBreadcrumbAttr = () => {\n const lastParentBreadcrumb = this.getLastParentBreadcrumb();\n if (lastParentBreadcrumb) {\n lastParentBreadcrumb.classList.add(\"show\");\n lastParentBreadcrumb.setAttribute(\"show-back-icon\", \"true\");\n }\n };\n\n private getLastParentBreadcrumb = (): HTMLIcBreadcrumbElement | null => {\n const allBreadcrumbs = Array.from(\n this.el.querySelectorAll(\"ic-breadcrumb\")\n );\n\n if (allBreadcrumbs.length === 1) {\n return null;\n }\n\n this.breadcrumbs = allBreadcrumbs.filter(\n (breadcrumb) => !breadcrumb.getAttribute(\"current\")\n );\n this.breadcrumb = this.breadcrumbs[this.breadcrumbs.length - 1];\n\n return this.breadcrumb;\n };\n\n private setDefaultBreadcrumbs = () => {\n const allBreadcrumbs = Array.from(\n this.el.querySelectorAll(\"ic-breadcrumb\")\n );\n allBreadcrumbs.forEach((breadcrumb) => {\n breadcrumb.setAttribute(\"show-back-icon\", \"false\");\n });\n };\n\n private setCollapsed = () => {\n if (this.collapsed) {\n const allBreadcrumbs = Array.from(\n this.el.querySelectorAll(\"ic-breadcrumb\")\n );\n this.collapsedBreadcrumbs = allBreadcrumbs\n .splice(1, allBreadcrumbs.length - 2)\n .filter(\n (breadcrumb) =>\n !breadcrumb.classList.contains(\"collapsed-breadcrumb-wrapper\")\n );\n\n this.collapsedBreadcrumbs.forEach((breadcrumb) =>\n breadcrumb.classList.add(\"hide\")\n );\n\n const firstBreadcrumb = allBreadcrumbs[0];\n\n if (firstBreadcrumb) {\n firstBreadcrumb.insertAdjacentElement(\n \"afterend\",\n this.collapsedBreadcrumbWrapper\n );\n }\n }\n };\n\n private renderCollapsedBreadcrumb = () => {\n this.collapsedBreadcrumbWrapper = document.createElement(\"ic-breadcrumb\");\n this.collapsedBreadcrumbWrapper.classList.add(\n \"collapsed-breadcrumb-wrapper\"\n );\n const collapsedBreadcrumbEl = document.createElement(\"button\");\n\n const ariaLabel = document.createElement(\"span\");\n ariaLabel.id = \"collapsed-button-label\";\n ariaLabel.innerText = \"Collapsed breadcrumbs\";\n ariaLabel.className = \"hide\";\n collapsedBreadcrumbEl.setAttribute(\n \"aria-labelledby\",\n \"collapsed-button-label\"\n );\n\n const ariaDescribed = document.createElement(\"span\");\n ariaDescribed.id = \"collapsed-button-described\";\n ariaDescribed.innerText = \"Select to view collapsed breadcrumbs\";\n ariaDescribed.className = \"hide\";\n collapsedBreadcrumbEl.setAttribute(\n \"aria-describedby\",\n \"collapsed-button-described\"\n );\n\n collapsedBreadcrumbEl.id = \"collapsed-ellipsis\";\n collapsedBreadcrumbEl.innerText = \"...\";\n collapsedBreadcrumbEl.classList.add(\"collapsed-breadcrumb\");\n collapsedBreadcrumbEl.addEventListener(\"click\", () => {\n this.handleHiddenCollapsedBreadcrumbs(this.collapsedBreadcrumbWrapper);\n });\n\n this.collapsedBreadcrumbWrapper.append(ariaDescribed);\n this.collapsedBreadcrumbWrapper.append(ariaLabel);\n this.collapsedBreadcrumbWrapper.append(collapsedBreadcrumbEl);\n\n return this.collapsedBreadcrumbWrapper;\n };\n\n private handleHiddenCollapsedBreadcrumbs = (\n collapsedBreadcrumbWrapper: HTMLIcBreadcrumbElement\n ) => {\n collapsedBreadcrumbWrapper.remove();\n this.collapsedBreadcrumbs.forEach((breadcrumb) => {\n breadcrumb.classList.add(\"visuallyhidden\");\n breadcrumb.classList.remove(\"hide\");\n setTimeout(() => {\n breadcrumb.classList.add(\"fade\");\n }, this.ADD_CLASS_DELAY);\n\n this.removeVisuallyHiddenClass(breadcrumb);\n });\n this.expandedBreadcrumbs = true;\n };\n\n private removeVisuallyHiddenClass = (breadcrumb: HTMLIcBreadcrumbElement) => {\n breadcrumb.addEventListener(\"transitionend\", (e) => {\n if (e.propertyName === \"opacity\") {\n breadcrumb.classList.remove(\"visuallyhidden\");\n }\n });\n };\n\n private setLastParentCollapsedBackBreadcrumb = () => {\n const lastParentBreadcrumb = this.getLastParentBreadcrumb();\n this.setBackBreadcrumbAttr();\n lastParentBreadcrumb.classList.remove(\"hide\");\n };\n\n private revertLastParentCollapsedBreadcrumb = () => {\n const lastParentBreadcrumb = this.getLastParentBreadcrumb();\n lastParentBreadcrumb.setAttribute(\"show-back-icon\", \"false\");\n };\n\n private resizeObserver: ResizeObserver = null;\n\n private resizeObserverCallback = (currSize: number) => {\n if (currSize !== this.deviceSize) {\n this.deviceSize = currSize;\n\n if (this.deviceSize <= DEVICE_SIZES.S) {\n this.el.setAttribute(\"back-breadcrumb-only\", \"true\");\n if (this.collapsed) {\n this.setLastParentCollapsedBackBreadcrumb();\n } else {\n this.setBackBreadcrumb();\n }\n } else {\n this.el.setAttribute(\"back-breadcrumb-only\", \"false\");\n if (this.collapsed && this.breadcrumbs && this.breadcrumbs.length > 2) {\n this.revertLastParentCollapsedBreadcrumb();\n if (this.expandedBreadcrumbs) {\n this.setDefaultBreadcrumbs();\n } else {\n this.setCollapsed();\n }\n } else {\n this.setDefaultBreadcrumbs();\n }\n }\n }\n };\n\n private runResizeObserver = () => {\n this.resizeObserver = new ResizeObserver(() => {\n const currSize = getCurrentDeviceSize();\n this.resizeObserverCallback(currSize);\n });\n\n this.resizeObserver.observe(this.el);\n };\n\n componentWillLoad(): void {\n const allBreadcrumbs = Array.from(\n this.el.querySelectorAll(\"ic-breadcrumb\")\n );\n\n if (this.backBreadcrumbOnly) {\n this.setBackBreadcrumb();\n } else {\n checkResizeObserver(this.runResizeObserver);\n }\n\n if (this.collapsed) {\n this.collapsedBreadcrumbWrapper = this.renderCollapsedBreadcrumb();\n\n if (allBreadcrumbs.length > 2) {\n if (getCurrentDeviceSize() === DEVICE_SIZES.S) {\n this.setLastParentCollapsedBackBreadcrumb();\n } else {\n this.setCollapsed();\n }\n }\n }\n }\n\n render() {\n return (\n <Host\n class={{\n back: this.backBreadcrumbOnly,\n collapsed: this.collapsed,\n }}\n >\n <nav aria-label=\"breadcrumbs\">\n <ol>\n <slot />\n </ol>\n </nav>\n </Host>\n );\n }\n}\n"],"version":3}
1
+ {"file":"ic-breadcrumb-group.js","mappings":"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","names":[],"sources":["./src/components/ic-breadcrumb-group/ic-breadcrumb-group.css?tag=ic-breadcrumb-group&encapsulation=shadow","./src/components/ic-breadcrumb-group/ic-breadcrumb-group.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n:host ol {\n display: flex;\n list-style-type: none;\n align-items: center;\n flex-wrap: wrap;\n padding: 0;\n margin: 0;\n}\n\n:host(.back) ol ::slotted(ic-breadcrumb) {\n display: none;\n}\n\n:host(.back) ol ::slotted(ic-breadcrumb.show) {\n display: flex;\n}\n\n:host(.collapsed) ol ::slotted(ic-breadcrumb.hide) {\n display: none;\n opacity: 0;\n visibility: hidden;\n}\n\n:host(.collapsed) ol ::slotted(ic-breadcrumb.visuallyhidden) {\n display: block;\n opacity: 0;\n transition: all var(--ic-easing-transition-slow);\n}\n\n:host(.collapsed) ol ::slotted(ic-breadcrumb.fade) {\n opacity: 1;\n}\n","import { Component, Host, h, Element, Prop, State } from \"@stencil/core\";\nimport {\n checkResizeObserver,\n DEVICE_SIZES,\n getCurrentDeviceSize,\n} from \"../../utils/helpers\";\n\n@Component({\n tag: \"ic-breadcrumb-group\",\n styleUrl: \"ic-breadcrumb-group.css\",\n shadow: true,\n})\n\n// Added ResizeObserver to find out width of breadcrumbs and parents. Use side navigation long title for ref.\nexport class BreadcrumbGroup {\n @Element() el: HTMLIcBreadcrumbGroupElement;\n /**\n * If `true`, display only a single breadcrumb for the parent page with a back icon.\n */\n @Prop() backBreadcrumbOnly: boolean = false;\n /**\n * If `true`, all breadcrumbs between the first and last breadcrumb will be collapsed.\n */\n @Prop() collapsed: boolean = false;\n\n @State() deviceSize: number = DEVICE_SIZES.XL;\n @State() expandedBreadcrumbs: boolean = false;\n\n private breadcrumbs: HTMLIcBreadcrumbElement[];\n private breadcrumb: HTMLIcBreadcrumbElement;\n private collapsedBreadcrumbs: HTMLIcBreadcrumbElement[];\n private ADD_CLASS_DELAY = 50;\n private collapsedBreadcrumbWrapper: HTMLIcBreadcrumbElement;\n\n private setBackBreadcrumb = () => {\n if (this.backBreadcrumbOnly) {\n this.setBackBreadcrumbAttr();\n }\n };\n\n private setBackBreadcrumbAttr = () => {\n const lastParentBreadcrumb = this.getLastParentBreadcrumb();\n if (lastParentBreadcrumb) {\n lastParentBreadcrumb.classList.add(\"show\");\n lastParentBreadcrumb.setAttribute(\"show-back-icon\", \"true\");\n }\n };\n\n private getLastParentBreadcrumb = (): HTMLIcBreadcrumbElement | null => {\n const allBreadcrumbs = Array.from(\n this.el.querySelectorAll(\"ic-breadcrumb\")\n );\n\n if (allBreadcrumbs.length === 1) {\n return null;\n }\n\n this.breadcrumbs = allBreadcrumbs.filter(\n (breadcrumb) => !breadcrumb.getAttribute(\"current\")\n );\n this.breadcrumb = this.breadcrumbs[this.breadcrumbs.length - 1];\n\n return this.breadcrumb;\n };\n\n private setDefaultBreadcrumbs = () => {\n const allBreadcrumbs = Array.from(\n this.el.querySelectorAll(\"ic-breadcrumb\")\n );\n allBreadcrumbs.forEach((breadcrumb) => {\n breadcrumb.setAttribute(\"show-back-icon\", \"false\");\n });\n };\n\n private setCollapsed = () => {\n if (this.collapsed) {\n const allBreadcrumbs = Array.from(\n this.el.querySelectorAll(\"ic-breadcrumb\")\n );\n this.collapsedBreadcrumbs = allBreadcrumbs\n .splice(1, allBreadcrumbs.length - 2)\n .filter(\n (breadcrumb) =>\n !breadcrumb.classList.contains(\"collapsed-breadcrumb-wrapper\")\n );\n\n this.collapsedBreadcrumbs.forEach((breadcrumb) =>\n breadcrumb.classList.add(\"hide\")\n );\n\n const firstBreadcrumb = allBreadcrumbs[0];\n\n if (firstBreadcrumb) {\n firstBreadcrumb.insertAdjacentElement(\n \"afterend\",\n this.collapsedBreadcrumbWrapper\n );\n }\n }\n };\n\n private renderCollapsedBreadcrumb = () => {\n this.collapsedBreadcrumbWrapper = document.createElement(\"ic-breadcrumb\");\n this.collapsedBreadcrumbWrapper.classList.add(\n \"collapsed-breadcrumb-wrapper\"\n );\n const collapsedBreadcrumbEl = document.createElement(\"button\");\n\n const ariaLabel = document.createElement(\"span\");\n ariaLabel.id = \"collapsed-button-label\";\n ariaLabel.innerText = \"Collapsed breadcrumbs\";\n ariaLabel.className = \"hide\";\n collapsedBreadcrumbEl.setAttribute(\n \"aria-labelledby\",\n \"collapsed-button-label\"\n );\n\n const ariaDescribed = document.createElement(\"span\");\n ariaDescribed.id = \"collapsed-button-described\";\n ariaDescribed.innerText = \"Select to view collapsed breadcrumbs\";\n ariaDescribed.className = \"hide\";\n collapsedBreadcrumbEl.setAttribute(\n \"aria-describedby\",\n \"collapsed-button-described\"\n );\n\n collapsedBreadcrumbEl.id = \"collapsed-ellipsis\";\n collapsedBreadcrumbEl.innerText = \"...\";\n collapsedBreadcrumbEl.classList.add(\"collapsed-breadcrumb\");\n collapsedBreadcrumbEl.addEventListener(\"click\", () => {\n this.handleHiddenCollapsedBreadcrumbs(this.collapsedBreadcrumbWrapper);\n });\n\n this.collapsedBreadcrumbWrapper.append(ariaDescribed);\n this.collapsedBreadcrumbWrapper.append(ariaLabel);\n this.collapsedBreadcrumbWrapper.append(collapsedBreadcrumbEl);\n\n return this.collapsedBreadcrumbWrapper;\n };\n\n private handleHiddenCollapsedBreadcrumbs = (\n collapsedBreadcrumbWrapper: HTMLIcBreadcrumbElement\n ) => {\n collapsedBreadcrumbWrapper.remove();\n this.collapsedBreadcrumbs.forEach((breadcrumb) => {\n breadcrumb.classList.add(\"visuallyhidden\");\n breadcrumb.classList.remove(\"hide\");\n setTimeout(() => {\n breadcrumb.classList.add(\"fade\");\n }, this.ADD_CLASS_DELAY);\n\n this.removeVisuallyHiddenClass(breadcrumb);\n });\n this.expandedBreadcrumbs = true;\n };\n\n private removeVisuallyHiddenClass = (breadcrumb: HTMLIcBreadcrumbElement) => {\n breadcrumb.addEventListener(\"transitionend\", (e) => {\n if (e.propertyName === \"opacity\") {\n breadcrumb.classList.remove(\"visuallyhidden\");\n }\n });\n };\n\n private setLastParentCollapsedBackBreadcrumb = () => {\n const lastParentBreadcrumb = this.getLastParentBreadcrumb();\n this.setBackBreadcrumbAttr();\n lastParentBreadcrumb.classList.remove(\"hide\");\n };\n\n private revertLastParentCollapsedBreadcrumb = () => {\n const lastParentBreadcrumb = this.getLastParentBreadcrumb();\n lastParentBreadcrumb.setAttribute(\"show-back-icon\", \"false\");\n };\n\n private resizeObserver: ResizeObserver = null;\n\n private resizeObserverCallback = (currSize: number) => {\n if (currSize !== this.deviceSize) {\n this.deviceSize = currSize;\n\n if (this.deviceSize <= DEVICE_SIZES.S) {\n this.el.setAttribute(\"back-breadcrumb-only\", \"true\");\n if (this.collapsed) {\n this.setLastParentCollapsedBackBreadcrumb();\n } else {\n this.setBackBreadcrumb();\n }\n } else {\n this.el.setAttribute(\"back-breadcrumb-only\", \"false\");\n if (this.collapsed && this.breadcrumbs && this.breadcrumbs.length > 2) {\n this.revertLastParentCollapsedBreadcrumb();\n if (this.expandedBreadcrumbs) {\n this.setDefaultBreadcrumbs();\n } else {\n this.setCollapsed();\n }\n } else {\n this.setDefaultBreadcrumbs();\n }\n }\n }\n };\n\n private runResizeObserver = () => {\n this.resizeObserver = new ResizeObserver(() => {\n const currSize = getCurrentDeviceSize();\n this.resizeObserverCallback(currSize);\n });\n\n this.resizeObserver.observe(this.el);\n };\n\n componentWillLoad(): void {\n const allBreadcrumbs = Array.from(\n this.el.querySelectorAll(\"ic-breadcrumb\")\n );\n\n if (this.backBreadcrumbOnly) {\n this.setBackBreadcrumb();\n } else {\n checkResizeObserver(this.runResizeObserver);\n }\n\n if (this.collapsed) {\n this.collapsedBreadcrumbWrapper = this.renderCollapsedBreadcrumb();\n\n if (allBreadcrumbs.length > 2) {\n if (getCurrentDeviceSize() === DEVICE_SIZES.S) {\n this.setLastParentCollapsedBackBreadcrumb();\n } else {\n this.setCollapsed();\n }\n }\n }\n }\n\n render() {\n return (\n <Host\n class={{\n back: this.backBreadcrumbOnly,\n collapsed: this.collapsed,\n }}\n >\n <nav aria-label=\"breadcrumbs\">\n <ol>\n <slot />\n </ol>\n </nav>\n </Host>\n );\n }\n}\n"],"version":3}
@@ -8,7 +8,7 @@ const backIcon = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xm
8
8
  </svg>
9
9
  `;
10
10
 
11
- const icBreadcrumbCss = ":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{color:var(--ic-architectural-400)}:host(:first-child) .chevron{display:none}.back-icon svg{color:var(--ic-hyperlink)}:host(.back){display:flex;align-items:center}:host(.back) .chevron{display:none}ic-link{--breadcrumb-link-display:flex;--breadcrumb-link-align-items:center;--breadcrumb-link-gap:var(--ic-space-xs)}:host([aria-current=\"page\"]) .current-page-container{display:flex;align-items:center;gap:var(--ic-space-xs)}: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-hyperlink);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);text-decoration-line:underline;text-decoration-thickness:25%;text-underline-offset:25%}.hide,:host(.collapsed-breadcrumb-wrapper) ::slotted(.hide){display:none}@media (forced-colors: active){.back-icon svg{color:currentColor}}";
11
+ const icBreadcrumbCss = ":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{color:var(--ic-architectural-400)}:host(:first-child) .chevron{display:none}.back-icon svg{color:var(--ic-hyperlink)}:host(.back){display:flex;align-items:center}:host(.back) .chevron{display:none}ic-link{--breadcrumb-link-display:flex;--breadcrumb-link-align-items:center;--breadcrumb-link-gap:var(--ic-space-xs)}:host([aria-current=\"page\"]) .current-page-container{display:flex;align-items:center;gap:var(--ic-space-xs)}: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-hyperlink);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);text-decoration-line:underline;text-decoration-thickness:25%;text-underline-offset:25%}.hide,:host(.collapsed-breadcrumb-wrapper) ::slotted(.hide){display:none}@media (forced-colors: active){.back-icon svg{color:currentcolor}}";
12
12
 
13
13
  const Breadcrumb = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
14
14
  constructor() {
@@ -1 +1 @@
1
- {"file":"ic-breadcrumb2.js","mappings":";;;;;;;;;;AAAA,MAAM,eAAe,GAAG,48CAA48C;;MCYv9C,UAAU;;;;;IAwBb,4BAAuB,GAAG,CAChC,OAAgB,EAChB,SAAiB,EACjB,aAAqB,EACrB,IAAY;MAEZ,MAAM,YAAY,GAChB,SAAS,KAAK,IAAI,IAAI,SAAS,KAAK,SAAS,IAAI,SAAS,KAAK,EAAE,CAAC;MAEpE,IAAI,OAAO,IAAI,YAAY,EAAE;QAC3B,QACE,YACE,KAAK,EAAE;YACL,wBAAwB,EAAE,OAAO;WAClC,IAEA,UAAU,CAAC,IAAI,CAAC,EAAE,EAAE,MAAM,CAAC,IAAI,YAAM,IAAI,EAAC,MAAM,GAAQ,EACxD,SAAS,CACL,EACP;OACH;MAED,QACE,eACE,IAAI,EAAE,IAAI,EACV,KAAK,EAAC,iBAAiB,sBACL,IAAI,CAAC,YAAY,IAAI,aAAa,IAAI,aAAa,IAEpE,IAAI,CAAC,YAAY,KAChB,WAAK,KAAK,EAAC,WAAW,EAAC,SAAS,EAAE,QAAQ,GAAQ,CACnD,EACA,UAAU,CAAC,IAAI,CAAC,EAAE,EAAE,MAAM,CAAC,IAAI,YAAM,IAAI,EAAC,MAAM,GAAQ,EACxD,SAAS,CACF,EACV;KACH,CAAC;IAEM,+BAA0B,GAAG;MACnC,MAAM,MAAM,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC;MAChD,IAAI,MAAM,EAAE;QACV,MAAM,CAAC,SAAS,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC;QACxC,IAAI,IAAI,CAAC,OAAO,EAAE;UAChB,MAAM,mBAAmB,GAAG,MAAM,CAAC,SAAS,CAAC,QAAQ,CAAC,cAAc,CAAC,CAAC;UACtE,IAAI,CAAC,mBAAmB,EAAE;YACxB,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,iBAAiB,EAAE,cAAc,CAAC,CAAC;WACzD;SACF;OACF;KACF,CAAC;;;mBAvD0B,KAAK;wBAKgB,KAAK;;EAoDtD,mBAAmB;IACjB,IAAI,CAAC,0BAA0B,EAAE,CAAC;GACnC;EAED,MAAM;IACJ,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;IAC1C,MAAM,aAAa,GAAG,GACpB,SAAS,IAAI,SAAS,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,GAAG,EAAE,GAAG,CACvD,cAAc,CAAC;IAEf,MAAM,YAAY,GAChB,SAAS,KAAK,IAAI,IAAI,SAAS,KAAK,SAAS,IAAI,SAAS,KAAK,EAAE,CAAC;IACpE,MAAM,OAAO,GAAG,IAAI,KAAK,IAAI,IAAI,IAAI,KAAK,SAAS,IAAI,IAAI,KAAK,EAAE,CAAC;IAEnE,QACE,EAAC,IAAI,IACH,KAAK,EAAE;QACL,IAAI,EAAE,IAAI,CAAC,YAAY;OACxB,kBACa,OAAO,IAAI,MAAM,EAC/B,IAAI,EAAC,UAAU,IAEf,WAAK,KAAK,EAAC,YAAY,IACrB,YAAM,SAAS,EAAE,WAAW,EAAE,KAAK,EAAC,SAAS,iBAAa,MAAM,GAAG,EAClE,IAAI,CAAC,YAAY,IAAI,aAAa,KACjC,YACE,EAAE,EAAE,aAAa,EACjB,KAAK,EAAC,MAAM,IACZ,WAAW,SAAS,EAAE,CAAQ,CACjC,EACA,YAAY,IAAI,OAAO,IACtB,IAAI,CAAC,uBAAuB,CAC1B,OAAO,EACP,SAAS,EACT,aAAa,EACb,IAAI,CACL,KAED,eAAQ,CACT,CACG,CACD,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"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 color: var(--ic-architectural-400);\n}\n\n:host(:first-child) .chevron {\n display: none;\n}\n\n.back-icon svg {\n color: var(--ic-hyperlink);\n}\n\n:host(.back) {\n display: flex;\n align-items: center;\n}\n\n:host(.back) .chevron {\n display: none;\n}\n\nic-link {\n --breadcrumb-link-display: flex;\n --breadcrumb-link-align-items: center;\n --breadcrumb-link-gap: var(--ic-space-xs);\n}\n\n:host([aria-current=\"page\"]) .current-page-container {\n display: flex;\n align-items: center;\n gap: var(--ic-space-xs);\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-hyperlink);\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 text-decoration-line: underline;\n text-decoration-thickness: 25%;\n text-underline-offset: 25%;\n}\n\n.hide,\n:host(.collapsed-breadcrumb-wrapper) ::slotted(.hide) {\n display: none;\n}\n\n@media (forced-colors: active) {\n .back-icon svg {\n color: currentColor;\n }\n}\n","import { Component, Host, Prop, h, Element } 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 { isSlotUsed } from \"../../utils/helpers\";\n\n@Component({\n tag: \"ic-breadcrumb\",\n styleUrl: \"ic-breadcrumb.css\",\n shadow: true,\n})\nexport class Breadcrumb {\n /**\n * @slot icon - Content will be rendered to the left of the breadcrumb page title\n */\n\n @Element() el: HTMLIcBreadcrumbElement;\n /**\n * Set breadcrumb title\n */\n @Prop() pageTitle!: string;\n /**\n * Set breadcrumb location\n */\n @Prop() href?: string;\n /**\n * If true, aria-current will be set on the breadcrumb\n */\n @Prop() current?: boolean = false;\n\n /**\n * @internal If true, display back icon\n */\n @Prop({ reflect: true }) showBackIcon: boolean = false;\n\n private renderDefaultBreadcrumb = (\n current: boolean,\n pageTitle: string,\n describedById: string,\n href: string\n ): IcBreadcrumbDefault => {\n const hasPageTitle =\n pageTitle !== null && pageTitle !== undefined && 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 href={href}\n class=\"breadcrumb-link\"\n aria-describedby={this.showBackIcon && describedById && describedById}\n >\n {this.showBackIcon && (\n <div class=\"back-icon\" innerHTML={backIcon}></div>\n )}\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 if (icLink) {\n icLink.classList.remove(\"current-page\");\n if (this.current) {\n const hasCurrentPageClass = icLink.classList.contains(\"current-page\");\n if (!hasCurrentPageClass) {\n icLink.classList.add(\"breadcrumb-link\", \"current-page\");\n }\n }\n }\n };\n\n componentWillRender(): void {\n this.setSlottedCurrentPageClass();\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 && pageTitle !== undefined && pageTitle !== \"\";\n const hasHref = href !== null && href !== undefined && href !== \"\";\n\n return (\n <Host\n class={{\n back: this.showBackIcon,\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 <slot />\n )}\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1
+ {"file":"ic-breadcrumb2.js","mappings":";;;;;;;;;;AAAA,MAAM,eAAe,GAAG,48CAA48C;;MCYv9C,UAAU;;;;;IAwBb,4BAAuB,GAAG,CAChC,OAAgB,EAChB,SAAiB,EACjB,aAAqB,EACrB,IAAY;MAEZ,MAAM,YAAY,GAChB,SAAS,KAAK,IAAI,IAAI,SAAS,KAAK,SAAS,IAAI,SAAS,KAAK,EAAE,CAAC;MAEpE,IAAI,OAAO,IAAI,YAAY,EAAE;QAC3B,QACE,YACE,KAAK,EAAE;YACL,wBAAwB,EAAE,OAAO;WAClC,IAEA,UAAU,CAAC,IAAI,CAAC,EAAE,EAAE,MAAM,CAAC,IAAI,YAAM,IAAI,EAAC,MAAM,GAAQ,EACxD,SAAS,CACL,EACP;OACH;MAED,QACE,eACE,IAAI,EAAE,IAAI,EACV,KAAK,EAAC,iBAAiB,sBACL,IAAI,CAAC,YAAY,IAAI,aAAa,IAAI,aAAa,IAEpE,IAAI,CAAC,YAAY,KAChB,WAAK,KAAK,EAAC,WAAW,EAAC,SAAS,EAAE,QAAQ,GAAQ,CACnD,EACA,UAAU,CAAC,IAAI,CAAC,EAAE,EAAE,MAAM,CAAC,IAAI,YAAM,IAAI,EAAC,MAAM,GAAQ,EACxD,SAAS,CACF,EACV;KACH,CAAC;IAEM,+BAA0B,GAAG;MACnC,MAAM,MAAM,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC;MAChD,IAAI,MAAM,EAAE;QACV,MAAM,CAAC,SAAS,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC;QACxC,IAAI,IAAI,CAAC,OAAO,EAAE;UAChB,MAAM,mBAAmB,GAAG,MAAM,CAAC,SAAS,CAAC,QAAQ,CAAC,cAAc,CAAC,CAAC;UACtE,IAAI,CAAC,mBAAmB,EAAE;YACxB,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,iBAAiB,EAAE,cAAc,CAAC,CAAC;WACzD;SACF;OACF;KACF,CAAC;;;mBAvD0B,KAAK;wBAKgB,KAAK;;EAoDtD,mBAAmB;IACjB,IAAI,CAAC,0BAA0B,EAAE,CAAC;GACnC;EAED,MAAM;IACJ,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;IAC1C,MAAM,aAAa,GAAG,GACpB,SAAS,IAAI,SAAS,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,GAAG,EAAE,GAAG,CACvD,cAAc,CAAC;IAEf,MAAM,YAAY,GAChB,SAAS,KAAK,IAAI,IAAI,SAAS,KAAK,SAAS,IAAI,SAAS,KAAK,EAAE,CAAC;IACpE,MAAM,OAAO,GAAG,IAAI,KAAK,IAAI,IAAI,IAAI,KAAK,SAAS,IAAI,IAAI,KAAK,EAAE,CAAC;IAEnE,QACE,EAAC,IAAI,IACH,KAAK,EAAE;QACL,IAAI,EAAE,IAAI,CAAC,YAAY;OACxB,kBACa,OAAO,IAAI,MAAM,EAC/B,IAAI,EAAC,UAAU,IAEf,WAAK,KAAK,EAAC,YAAY,IACrB,YAAM,SAAS,EAAE,WAAW,EAAE,KAAK,EAAC,SAAS,iBAAa,MAAM,GAAG,EAClE,IAAI,CAAC,YAAY,IAAI,aAAa,KACjC,YACE,EAAE,EAAE,aAAa,EACjB,KAAK,EAAC,MAAM,IACZ,WAAW,SAAS,EAAE,CAAQ,CACjC,EACA,YAAY,IAAI,OAAO,IACtB,IAAI,CAAC,uBAAuB,CAC1B,OAAO,EACP,SAAS,EACT,aAAa,EACb,IAAI,CACL,KAED,eAAQ,CACT,CACG,CACD,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"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 color: var(--ic-architectural-400);\n}\n\n:host(:first-child) .chevron {\n display: none;\n}\n\n.back-icon svg {\n color: var(--ic-hyperlink);\n}\n\n:host(.back) {\n display: flex;\n align-items: center;\n}\n\n:host(.back) .chevron {\n display: none;\n}\n\nic-link {\n --breadcrumb-link-display: flex;\n --breadcrumb-link-align-items: center;\n --breadcrumb-link-gap: var(--ic-space-xs);\n}\n\n:host([aria-current=\"page\"]) .current-page-container {\n display: flex;\n align-items: center;\n gap: var(--ic-space-xs);\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-hyperlink);\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 text-decoration-line: underline;\n text-decoration-thickness: 25%;\n text-underline-offset: 25%;\n}\n\n.hide,\n:host(.collapsed-breadcrumb-wrapper) ::slotted(.hide) {\n display: none;\n}\n\n@media (forced-colors: active) {\n .back-icon svg {\n color: currentcolor;\n }\n}\n","import { Component, Host, Prop, h, Element } 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 { isSlotUsed } from \"../../utils/helpers\";\n\n@Component({\n tag: \"ic-breadcrumb\",\n styleUrl: \"ic-breadcrumb.css\",\n shadow: true,\n})\nexport class Breadcrumb {\n /**\n * @slot icon - Content will be rendered to the left of the breadcrumb page title.\n */\n\n @Element() el: HTMLIcBreadcrumbElement;\n /**\n * The title of the breadcrumb.\n */\n @Prop() pageTitle!: string;\n /**\n * The URL that the breadcrumb link points to.\n */\n @Prop() href?: string;\n /**\n * If `true`, aria-current will be set on the breadcrumb.\n */\n @Prop() current?: boolean = false;\n\n /**\n * @internal If `true`, back icon will be displayed.\n */\n @Prop({ reflect: true }) showBackIcon: boolean = false;\n\n private renderDefaultBreadcrumb = (\n current: boolean,\n pageTitle: string,\n describedById: string,\n href: string\n ): IcBreadcrumbDefault => {\n const hasPageTitle =\n pageTitle !== null && pageTitle !== undefined && 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 href={href}\n class=\"breadcrumb-link\"\n aria-describedby={this.showBackIcon && describedById && describedById}\n >\n {this.showBackIcon && (\n <div class=\"back-icon\" innerHTML={backIcon}></div>\n )}\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 if (icLink) {\n icLink.classList.remove(\"current-page\");\n if (this.current) {\n const hasCurrentPageClass = icLink.classList.contains(\"current-page\");\n if (!hasCurrentPageClass) {\n icLink.classList.add(\"breadcrumb-link\", \"current-page\");\n }\n }\n }\n };\n\n componentWillRender(): void {\n this.setSlottedCurrentPageClass();\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 && pageTitle !== undefined && pageTitle !== \"\";\n const hasHref = href !== null && href !== undefined && href !== \"\";\n\n return (\n <Host\n class={{\n back: this.showBackIcon,\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 <slot />\n )}\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
@@ -82,7 +82,7 @@ const Button = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
82
82
  }
83
83
  }
84
84
  /**
85
- * @internal Updates tooltip/aria-label text - needed as can't watch an aria attribute change.
85
+ * @internal Updates tooltip/aria-label text - needed as can't watch an ARIA attribute change.
86
86
  */
87
87
  async updateAriaLabel(newValue) {
88
88
  if (this.hasTooltip) {