@ukic/web-components 2.1.0-beta.14 → 2.1.0-beta.15

Sign up to get free protection for your applications and to get access to all the features.
Files changed (372) hide show
  1. package/dist/cjs/core.cjs.js +1 -1
  2. package/dist/cjs/{helpers-2021e212.js → helpers-d6b5880e.js} +19 -25
  3. package/dist/cjs/helpers-d6b5880e.js.map +1 -0
  4. package/dist/cjs/ic-alert.cjs.entry.js +1 -1
  5. package/dist/cjs/ic-back-to-top.cjs.entry.js +1 -1
  6. package/dist/cjs/ic-breadcrumb-group.cjs.entry.js +14 -14
  7. package/dist/cjs/ic-breadcrumb-group.cjs.entry.js.map +1 -1
  8. package/dist/cjs/ic-breadcrumb.cjs.entry.js +5 -4
  9. package/dist/cjs/ic-breadcrumb.cjs.entry.js.map +1 -1
  10. package/dist/cjs/ic-button_3.cjs.entry.js +3 -6
  11. package/dist/cjs/ic-button_3.cjs.entry.js.map +1 -1
  12. package/dist/cjs/ic-card.cjs.entry.js +1 -1
  13. package/dist/cjs/ic-checkbox-group.cjs.entry.js +1 -1
  14. package/dist/cjs/ic-checkbox.cjs.entry.js +5 -4
  15. package/dist/cjs/ic-checkbox.cjs.entry.js.map +1 -1
  16. package/dist/cjs/ic-chip.cjs.entry.js +1 -1
  17. package/dist/cjs/ic-data-row.cjs.entry.js +1 -1
  18. package/dist/cjs/ic-divider.cjs.entry.js +1 -1
  19. package/dist/cjs/ic-footer-link-group.cjs.entry.js +1 -1
  20. package/dist/cjs/ic-footer-link.cjs.entry.js +1 -1
  21. package/dist/cjs/ic-footer.cjs.entry.js +2 -2
  22. package/dist/cjs/ic-footer.cjs.entry.js.map +1 -1
  23. package/dist/cjs/ic-hero.cjs.entry.js +1 -1
  24. package/dist/cjs/ic-horizontal-scroll.cjs.entry.js +1 -1
  25. package/dist/cjs/ic-input-component-container_3.cjs.entry.js +5 -2
  26. package/dist/cjs/ic-input-component-container_3.cjs.entry.js.map +1 -1
  27. package/dist/cjs/ic-input-label_2.cjs.entry.js +1 -1
  28. package/dist/cjs/ic-link.cjs.entry.js +1 -1
  29. package/dist/cjs/ic-menu-item.cjs.entry.js +3 -2
  30. package/dist/cjs/ic-menu-item.cjs.entry.js.map +1 -1
  31. package/dist/cjs/ic-navigation-button.cjs.entry.js +1 -1
  32. package/dist/cjs/ic-navigation-group.cjs.entry.js +7 -4
  33. package/dist/cjs/ic-navigation-group.cjs.entry.js.map +1 -1
  34. package/dist/cjs/ic-navigation-item.cjs.entry.js +2 -2
  35. package/dist/cjs/ic-navigation-item.cjs.entry.js.map +1 -1
  36. package/dist/cjs/ic-navigation-menu.cjs.entry.js +1 -7
  37. package/dist/cjs/ic-navigation-menu.cjs.entry.js.map +1 -1
  38. package/dist/cjs/ic-page-header.cjs.entry.js +10 -13
  39. package/dist/cjs/ic-page-header.cjs.entry.js.map +1 -1
  40. package/dist/cjs/ic-pagination.cjs.entry.js +12 -1
  41. package/dist/cjs/ic-pagination.cjs.entry.js.map +1 -1
  42. package/dist/cjs/ic-popover-menu.cjs.entry.js +5 -4
  43. package/dist/cjs/ic-popover-menu.cjs.entry.js.map +1 -1
  44. package/dist/cjs/ic-radio-group.cjs.entry.js +1 -1
  45. package/dist/cjs/ic-radio-option.cjs.entry.js +1 -1
  46. package/dist/cjs/ic-search-bar.cjs.entry.js +1 -1
  47. package/dist/cjs/ic-select.cjs.entry.js +2 -3
  48. package/dist/cjs/ic-select.cjs.entry.js.map +1 -1
  49. package/dist/cjs/ic-side-navigation.cjs.entry.js +20 -16
  50. package/dist/cjs/ic-side-navigation.cjs.entry.js.map +1 -1
  51. package/dist/cjs/ic-status-tag.cjs.entry.js +1 -1
  52. package/dist/cjs/ic-step.cjs.entry.js +2 -2
  53. package/dist/cjs/ic-step.cjs.entry.js.map +1 -1
  54. package/dist/cjs/ic-stepper.cjs.entry.js +1 -1
  55. package/dist/cjs/ic-switch.cjs.entry.js +1 -1
  56. package/dist/cjs/ic-tab-context.cjs.entry.js +7 -5
  57. package/dist/cjs/ic-tab-context.cjs.entry.js.map +1 -1
  58. package/dist/cjs/ic-tab-group.cjs.entry.js +1 -1
  59. package/dist/cjs/ic-tab-panel.cjs.entry.js +3 -1
  60. package/dist/cjs/ic-tab-panel.cjs.entry.js.map +1 -1
  61. package/dist/cjs/ic-tab.cjs.entry.js +3 -1
  62. package/dist/cjs/ic-tab.cjs.entry.js.map +1 -1
  63. package/dist/cjs/ic-text-field.cjs.entry.js +6 -14
  64. package/dist/cjs/ic-text-field.cjs.entry.js.map +1 -1
  65. package/dist/cjs/ic-theme.cjs.entry.js +1 -1
  66. package/dist/cjs/ic-toast.cjs.entry.js +1 -1
  67. package/dist/cjs/ic-top-navigation.cjs.entry.js +1 -1
  68. package/dist/cjs/ic-typography.cjs.entry.js +95 -3
  69. package/dist/cjs/ic-typography.cjs.entry.js.map +1 -1
  70. package/dist/cjs/loader.cjs.js +1 -1
  71. package/dist/collection/components/ic-breadcrumb/ic-breadcrumb.js +4 -3
  72. package/dist/collection/components/ic-breadcrumb/ic-breadcrumb.js.map +1 -1
  73. package/dist/collection/components/ic-breadcrumb-group/ic-breadcrumb-group.js +13 -13
  74. package/dist/collection/components/ic-breadcrumb-group/ic-breadcrumb-group.js.map +1 -1
  75. package/dist/collection/components/ic-button/ic-button.js +1 -4
  76. package/dist/collection/components/ic-button/ic-button.js.map +1 -1
  77. package/dist/collection/components/ic-checkbox/ic-checkbox.js +4 -3
  78. package/dist/collection/components/ic-checkbox/ic-checkbox.js.map +1 -1
  79. package/dist/collection/components/ic-footer/ic-footer.css +2 -2
  80. package/dist/collection/components/ic-loading-indicator/ic-loading-indicator.css +1 -1
  81. package/dist/collection/components/ic-menu/ic-menu.js +4 -1
  82. package/dist/collection/components/ic-menu/ic-menu.js.map +1 -1
  83. package/dist/collection/components/ic-menu-item/ic-menu-item.js +2 -1
  84. package/dist/collection/components/ic-menu-item/ic-menu-item.js.map +1 -1
  85. package/dist/collection/components/ic-navigation-group/ic-navigation-group.js +6 -3
  86. package/dist/collection/components/ic-navigation-group/ic-navigation-group.js.map +1 -1
  87. package/dist/collection/components/ic-navigation-item/ic-navigation-item.css +13 -7
  88. package/dist/collection/components/ic-navigation-menu/ic-navigation-menu.js +0 -6
  89. package/dist/collection/components/ic-navigation-menu/ic-navigation-menu.js.map +1 -1
  90. package/dist/collection/components/ic-page-header/ic-page-header.js +9 -12
  91. package/dist/collection/components/ic-page-header/ic-page-header.js.map +1 -1
  92. package/dist/collection/components/ic-pagination/ic-pagination.js +52 -1
  93. package/dist/collection/components/ic-pagination/ic-pagination.js.map +1 -1
  94. package/dist/collection/components/ic-popover-menu/ic-popover-menu.js +4 -3
  95. package/dist/collection/components/ic-popover-menu/ic-popover-menu.js.map +1 -1
  96. package/dist/collection/components/ic-select/ic-select.js +11 -12
  97. package/dist/collection/components/ic-select/ic-select.js.map +1 -1
  98. package/dist/collection/components/ic-side-navigation/ic-side-navigation.js +19 -15
  99. package/dist/collection/components/ic-side-navigation/ic-side-navigation.js.map +1 -1
  100. package/dist/collection/components/ic-step/ic-step.css +5 -5
  101. package/dist/collection/components/ic-step/ic-step.js +1 -1
  102. package/dist/collection/components/ic-step/ic-step.js.map +1 -1
  103. package/dist/collection/components/ic-tab/ic-tab.js +3 -1
  104. package/dist/collection/components/ic-tab/ic-tab.js.map +1 -1
  105. package/dist/collection/components/ic-tab-context/ic-tab-context.js +7 -5
  106. package/dist/collection/components/ic-tab-context/ic-tab-context.js.map +1 -1
  107. package/dist/collection/components/ic-tab-panel/ic-tab-panel.js +3 -1
  108. package/dist/collection/components/ic-tab-panel/ic-tab-panel.js.map +1 -1
  109. package/dist/collection/components/ic-text-field/ic-text-field.js +5 -13
  110. package/dist/collection/components/ic-text-field/ic-text-field.js.map +1 -1
  111. package/dist/collection/components/ic-typography/ic-typography.css +39 -0
  112. package/dist/collection/components/ic-typography/ic-typography.js +120 -2
  113. package/dist/collection/components/ic-typography/ic-typography.js.map +1 -1
  114. package/dist/collection/utils/helpers.js +18 -24
  115. package/dist/collection/utils/helpers.js.map +1 -1
  116. package/dist/components/helpers.js +18 -24
  117. package/dist/components/helpers.js.map +1 -1
  118. package/dist/components/ic-breadcrumb-group.js +13 -13
  119. package/dist/components/ic-breadcrumb-group.js.map +1 -1
  120. package/dist/components/ic-breadcrumb2.js +4 -3
  121. package/dist/components/ic-breadcrumb2.js.map +1 -1
  122. package/dist/components/ic-button2.js +1 -4
  123. package/dist/components/ic-button2.js.map +1 -1
  124. package/dist/components/ic-checkbox.js +4 -3
  125. package/dist/components/ic-checkbox.js.map +1 -1
  126. package/dist/components/ic-footer.js +1 -1
  127. package/dist/components/ic-footer.js.map +1 -1
  128. package/dist/components/ic-loading-indicator2.js +1 -1
  129. package/dist/components/ic-loading-indicator2.js.map +1 -1
  130. package/dist/components/ic-menu-item2.js +2 -1
  131. package/dist/components/ic-menu-item2.js.map +1 -1
  132. package/dist/components/ic-menu2.js +4 -1
  133. package/dist/components/ic-menu2.js.map +1 -1
  134. package/dist/components/ic-navigation-group.js +6 -3
  135. package/dist/components/ic-navigation-group.js.map +1 -1
  136. package/dist/components/ic-navigation-item.js +1 -1
  137. package/dist/components/ic-navigation-item.js.map +1 -1
  138. package/dist/components/ic-navigation-menu2.js +0 -6
  139. package/dist/components/ic-navigation-menu2.js.map +1 -1
  140. package/dist/components/ic-page-header.js +9 -12
  141. package/dist/components/ic-page-header.js.map +1 -1
  142. package/dist/components/ic-pagination.js +14 -2
  143. package/dist/components/ic-pagination.js.map +1 -1
  144. package/dist/components/ic-popover-menu.js +4 -3
  145. package/dist/components/ic-popover-menu.js.map +1 -1
  146. package/dist/components/ic-select.js +1 -2
  147. package/dist/components/ic-select.js.map +1 -1
  148. package/dist/components/ic-side-navigation.js +19 -15
  149. package/dist/components/ic-side-navigation.js.map +1 -1
  150. package/dist/components/ic-step.js +2 -2
  151. package/dist/components/ic-step.js.map +1 -1
  152. package/dist/components/ic-tab-context.js +7 -5
  153. package/dist/components/ic-tab-context.js.map +1 -1
  154. package/dist/components/ic-tab-panel.js +3 -1
  155. package/dist/components/ic-tab-panel.js.map +1 -1
  156. package/dist/components/ic-tab.js +3 -1
  157. package/dist/components/ic-tab.js.map +1 -1
  158. package/dist/components/ic-text-field2.js +5 -13
  159. package/dist/components/ic-text-field2.js.map +1 -1
  160. package/dist/components/ic-typography2.js +99 -4
  161. package/dist/components/ic-typography2.js.map +1 -1
  162. package/dist/core/core.esm.js +1 -1
  163. package/dist/core/core.esm.js.map +1 -1
  164. package/dist/core/{p-0575a77f.entry.js → p-050dbce8.entry.js} +2 -2
  165. package/dist/core/p-06962e10.entry.js +2 -0
  166. package/dist/core/p-06962e10.entry.js.map +1 -0
  167. package/dist/core/{p-0a41c3cb.entry.js → p-0969a95a.entry.js} +2 -2
  168. package/dist/core/{p-56fe91ad.entry.js → p-0a11ec35.entry.js} +2 -2
  169. package/dist/core/p-0a11ec35.entry.js.map +1 -0
  170. package/dist/core/{p-b61e76e2.entry.js → p-0f153569.entry.js} +2 -2
  171. package/dist/core/{p-3fb307e6.entry.js → p-1585e5c1.entry.js} +2 -2
  172. package/dist/core/p-29ea6f88.entry.js +2 -0
  173. package/dist/core/p-29ea6f88.entry.js.map +1 -0
  174. package/dist/core/p-2e63f202.entry.js +2 -0
  175. package/dist/core/p-2e63f202.entry.js.map +1 -0
  176. package/dist/core/p-2e6ea6d3.entry.js +2 -0
  177. package/dist/core/p-2e6ea6d3.entry.js.map +1 -0
  178. package/dist/core/{p-e0f24ccd.entry.js → p-2fb97a1b.entry.js} +2 -2
  179. package/dist/core/p-2fb97a1b.entry.js.map +1 -0
  180. package/dist/core/{p-100dbcec.entry.js → p-31b4b684.entry.js} +2 -2
  181. package/dist/core/{p-e839e5dc.entry.js → p-32cc8827.entry.js} +2 -2
  182. package/dist/core/{p-3845b769.entry.js → p-3498db0b.entry.js} +2 -2
  183. package/dist/core/p-3498db0b.entry.js.map +1 -0
  184. package/dist/core/{p-d5d9923a.entry.js → p-36e0671f.entry.js} +2 -2
  185. package/dist/core/p-443052a7.entry.js +2 -0
  186. package/dist/core/p-443052a7.entry.js.map +1 -0
  187. package/dist/core/{p-6a77992e.entry.js → p-46371c05.entry.js} +2 -2
  188. package/dist/core/p-471820e6.js +2 -0
  189. package/dist/core/p-471820e6.js.map +1 -0
  190. package/dist/core/{p-9413d639.entry.js → p-4dd0eb6a.entry.js} +2 -2
  191. package/dist/core/p-50421f27.entry.js +2 -0
  192. package/dist/core/p-50421f27.entry.js.map +1 -0
  193. package/dist/core/p-559b3d17.entry.js +2 -0
  194. package/dist/core/p-559b3d17.entry.js.map +1 -0
  195. package/dist/core/{p-895bda21.entry.js → p-5a3f3f37.entry.js} +2 -2
  196. package/dist/core/p-5a3f3f37.entry.js.map +1 -0
  197. package/dist/core/{p-dc0b9e80.entry.js → p-5e896163.entry.js} +2 -2
  198. package/dist/core/{p-e41e701a.entry.js → p-68547339.entry.js} +2 -2
  199. package/dist/core/p-6f2be5bd.entry.js +2 -0
  200. package/dist/core/p-6f2be5bd.entry.js.map +1 -0
  201. package/dist/core/{p-1eb0992b.entry.js → p-70124e59.entry.js} +2 -2
  202. package/dist/core/{p-2e949135.entry.js → p-80164baa.entry.js} +2 -2
  203. package/dist/core/p-80164baa.entry.js.map +1 -0
  204. package/dist/core/{p-6b39f8b4.entry.js → p-8edd3a9b.entry.js} +2 -2
  205. package/dist/core/{p-c0813424.entry.js → p-9715ec62.entry.js} +2 -2
  206. package/dist/core/{p-cb437317.entry.js → p-983cb33c.entry.js} +2 -2
  207. package/dist/core/{p-002a63e9.entry.js → p-a18c0672.entry.js} +2 -2
  208. package/dist/core/{p-47b0ed42.entry.js → p-a8dc8196.entry.js} +2 -2
  209. package/dist/core/{p-52fd3533.entry.js → p-a9184841.entry.js} +2 -2
  210. package/dist/core/p-a9184841.entry.js.map +1 -0
  211. package/dist/core/{p-e384aaee.entry.js → p-af815dfb.entry.js} +2 -2
  212. package/dist/core/{p-8780890e.entry.js → p-b69226d2.entry.js} +2 -2
  213. package/dist/core/p-b7cf6411.entry.js +2 -0
  214. package/dist/core/p-b7cf6411.entry.js.map +1 -0
  215. package/dist/core/{p-3a67718c.entry.js → p-bffa2e1a.entry.js} +2 -2
  216. package/dist/core/p-c85476c0.entry.js +2 -0
  217. package/dist/core/p-c85476c0.entry.js.map +1 -0
  218. package/dist/core/{p-a0f4e641.entry.js → p-ca20c9c3.entry.js} +2 -2
  219. package/dist/core/{p-a33a04b2.entry.js → p-cee45622.entry.js} +2 -2
  220. package/dist/core/p-cee45622.entry.js.map +1 -0
  221. package/dist/core/{p-f3e10149.entry.js → p-d2d5132d.entry.js} +2 -2
  222. package/dist/core/{p-f3e10149.entry.js.map → p-d2d5132d.entry.js.map} +1 -1
  223. package/dist/core/{p-546b620e.entry.js → p-df1b0f17.entry.js} +2 -2
  224. package/dist/core/{p-92c4fa7f.entry.js → p-e16e817e.entry.js} +2 -2
  225. package/dist/core/p-e16e817e.entry.js.map +1 -0
  226. package/dist/core/p-e6217f40.entry.js +2 -0
  227. package/dist/core/p-e6217f40.entry.js.map +1 -0
  228. package/dist/core/{p-3dc2ff7b.entry.js → p-faeedfd1.entry.js} +2 -2
  229. package/dist/core/p-faeedfd1.entry.js.map +1 -0
  230. package/dist/core/{p-5d077cf7.entry.js → p-fb5861c6.entry.js} +2 -2
  231. package/dist/core/{p-3e5eb873.entry.js → p-fd18d7a3.entry.js} +2 -2
  232. package/dist/esm/core.js +1 -1
  233. package/dist/esm/{helpers-b2b47a7d.js → helpers-73666f14.js} +19 -25
  234. package/dist/esm/helpers-73666f14.js.map +1 -0
  235. package/dist/esm/ic-alert.entry.js +1 -1
  236. package/dist/esm/ic-back-to-top.entry.js +1 -1
  237. package/dist/esm/ic-breadcrumb-group.entry.js +14 -14
  238. package/dist/esm/ic-breadcrumb-group.entry.js.map +1 -1
  239. package/dist/esm/ic-breadcrumb.entry.js +5 -4
  240. package/dist/esm/ic-breadcrumb.entry.js.map +1 -1
  241. package/dist/esm/ic-button_3.entry.js +3 -6
  242. package/dist/esm/ic-button_3.entry.js.map +1 -1
  243. package/dist/esm/ic-card.entry.js +1 -1
  244. package/dist/esm/ic-checkbox-group.entry.js +1 -1
  245. package/dist/esm/ic-checkbox.entry.js +5 -4
  246. package/dist/esm/ic-checkbox.entry.js.map +1 -1
  247. package/dist/esm/ic-chip.entry.js +1 -1
  248. package/dist/esm/ic-data-row.entry.js +1 -1
  249. package/dist/esm/ic-divider.entry.js +1 -1
  250. package/dist/esm/ic-footer-link-group.entry.js +1 -1
  251. package/dist/esm/ic-footer-link.entry.js +1 -1
  252. package/dist/esm/ic-footer.entry.js +2 -2
  253. package/dist/esm/ic-footer.entry.js.map +1 -1
  254. package/dist/esm/ic-hero.entry.js +1 -1
  255. package/dist/esm/ic-horizontal-scroll.entry.js +1 -1
  256. package/dist/esm/ic-input-component-container_3.entry.js +5 -2
  257. package/dist/esm/ic-input-component-container_3.entry.js.map +1 -1
  258. package/dist/esm/ic-input-label_2.entry.js +1 -1
  259. package/dist/esm/ic-link.entry.js +1 -1
  260. package/dist/esm/ic-menu-item.entry.js +3 -2
  261. package/dist/esm/ic-menu-item.entry.js.map +1 -1
  262. package/dist/esm/ic-navigation-button.entry.js +1 -1
  263. package/dist/esm/ic-navigation-group.entry.js +7 -4
  264. package/dist/esm/ic-navigation-group.entry.js.map +1 -1
  265. package/dist/esm/ic-navigation-item.entry.js +2 -2
  266. package/dist/esm/ic-navigation-item.entry.js.map +1 -1
  267. package/dist/esm/ic-navigation-menu.entry.js +1 -7
  268. package/dist/esm/ic-navigation-menu.entry.js.map +1 -1
  269. package/dist/esm/ic-page-header.entry.js +10 -13
  270. package/dist/esm/ic-page-header.entry.js.map +1 -1
  271. package/dist/esm/ic-pagination.entry.js +12 -1
  272. package/dist/esm/ic-pagination.entry.js.map +1 -1
  273. package/dist/esm/ic-popover-menu.entry.js +5 -4
  274. package/dist/esm/ic-popover-menu.entry.js.map +1 -1
  275. package/dist/esm/ic-radio-group.entry.js +1 -1
  276. package/dist/esm/ic-radio-option.entry.js +1 -1
  277. package/dist/esm/ic-search-bar.entry.js +1 -1
  278. package/dist/esm/ic-select.entry.js +2 -3
  279. package/dist/esm/ic-select.entry.js.map +1 -1
  280. package/dist/esm/ic-side-navigation.entry.js +20 -16
  281. package/dist/esm/ic-side-navigation.entry.js.map +1 -1
  282. package/dist/esm/ic-status-tag.entry.js +1 -1
  283. package/dist/esm/ic-step.entry.js +2 -2
  284. package/dist/esm/ic-step.entry.js.map +1 -1
  285. package/dist/esm/ic-stepper.entry.js +1 -1
  286. package/dist/esm/ic-switch.entry.js +1 -1
  287. package/dist/esm/ic-tab-context.entry.js +7 -5
  288. package/dist/esm/ic-tab-context.entry.js.map +1 -1
  289. package/dist/esm/ic-tab-group.entry.js +1 -1
  290. package/dist/esm/ic-tab-panel.entry.js +3 -1
  291. package/dist/esm/ic-tab-panel.entry.js.map +1 -1
  292. package/dist/esm/ic-tab.entry.js +3 -1
  293. package/dist/esm/ic-tab.entry.js.map +1 -1
  294. package/dist/esm/ic-text-field.entry.js +6 -14
  295. package/dist/esm/ic-text-field.entry.js.map +1 -1
  296. package/dist/esm/ic-theme.entry.js +1 -1
  297. package/dist/esm/ic-toast.entry.js +1 -1
  298. package/dist/esm/ic-top-navigation.entry.js +1 -1
  299. package/dist/esm/ic-typography.entry.js +95 -3
  300. package/dist/esm/ic-typography.entry.js.map +1 -1
  301. package/dist/esm/loader.js +1 -1
  302. package/dist/types/components/ic-breadcrumb-group/ic-breadcrumb-group.d.ts +3 -0
  303. package/dist/types/components/ic-checkbox/ic-checkbox.d.ts +1 -0
  304. package/dist/types/components/ic-menu/ic-menu.d.ts +1 -0
  305. package/dist/types/components/ic-navigation-group/ic-navigation-group.d.ts +1 -0
  306. package/dist/types/components/ic-pagination/ic-pagination.d.ts +7 -0
  307. package/dist/types/components/ic-popover-menu/ic-popover-menu.d.ts +1 -0
  308. package/dist/types/components/ic-select/ic-select.d.ts +11 -11
  309. package/dist/types/components/ic-side-navigation/ic-side-navigation.d.ts +1 -0
  310. package/dist/types/components/ic-typography/ic-typography.d.ts +27 -0
  311. package/dist/types/components.d.ts +35 -15
  312. package/hydrate/index.js +221 -122
  313. package/package.json +3 -3
  314. package/dist/cjs/helpers-2021e212.js.map +0 -1
  315. package/dist/core/p-14835d6f.entry.js +0 -2
  316. package/dist/core/p-14835d6f.entry.js.map +0 -1
  317. package/dist/core/p-276f7ecb.entry.js +0 -2
  318. package/dist/core/p-276f7ecb.entry.js.map +0 -1
  319. package/dist/core/p-2e949135.entry.js.map +0 -1
  320. package/dist/core/p-3845b769.entry.js.map +0 -1
  321. package/dist/core/p-3c23f963.entry.js +0 -2
  322. package/dist/core/p-3c23f963.entry.js.map +0 -1
  323. package/dist/core/p-3dc2ff7b.entry.js.map +0 -1
  324. package/dist/core/p-3dea2867.js +0 -2
  325. package/dist/core/p-3dea2867.js.map +0 -1
  326. package/dist/core/p-4595f48f.entry.js +0 -2
  327. package/dist/core/p-4595f48f.entry.js.map +0 -1
  328. package/dist/core/p-4b87445b.entry.js +0 -2
  329. package/dist/core/p-4b87445b.entry.js.map +0 -1
  330. package/dist/core/p-4c8fcfe6.entry.js +0 -2
  331. package/dist/core/p-4c8fcfe6.entry.js.map +0 -1
  332. package/dist/core/p-52fd3533.entry.js.map +0 -1
  333. package/dist/core/p-56fe91ad.entry.js.map +0 -1
  334. package/dist/core/p-895bda21.entry.js.map +0 -1
  335. package/dist/core/p-92c4fa7f.entry.js.map +0 -1
  336. package/dist/core/p-a33a04b2.entry.js.map +0 -1
  337. package/dist/core/p-a5bee11f.entry.js +0 -2
  338. package/dist/core/p-a5bee11f.entry.js.map +0 -1
  339. package/dist/core/p-a7fdb9a8.entry.js +0 -2
  340. package/dist/core/p-a7fdb9a8.entry.js.map +0 -1
  341. package/dist/core/p-de891d3d.entry.js +0 -2
  342. package/dist/core/p-de891d3d.entry.js.map +0 -1
  343. package/dist/core/p-e0f24ccd.entry.js.map +0 -1
  344. package/dist/core/p-ea526b54.entry.js +0 -2
  345. package/dist/core/p-ea526b54.entry.js.map +0 -1
  346. package/dist/core/p-ec8b228c.entry.js +0 -2
  347. package/dist/core/p-ec8b228c.entry.js.map +0 -1
  348. package/dist/esm/helpers-b2b47a7d.js.map +0 -1
  349. /package/dist/core/{p-0575a77f.entry.js.map → p-050dbce8.entry.js.map} +0 -0
  350. /package/dist/core/{p-0a41c3cb.entry.js.map → p-0969a95a.entry.js.map} +0 -0
  351. /package/dist/core/{p-b61e76e2.entry.js.map → p-0f153569.entry.js.map} +0 -0
  352. /package/dist/core/{p-3fb307e6.entry.js.map → p-1585e5c1.entry.js.map} +0 -0
  353. /package/dist/core/{p-100dbcec.entry.js.map → p-31b4b684.entry.js.map} +0 -0
  354. /package/dist/core/{p-e839e5dc.entry.js.map → p-32cc8827.entry.js.map} +0 -0
  355. /package/dist/core/{p-d5d9923a.entry.js.map → p-36e0671f.entry.js.map} +0 -0
  356. /package/dist/core/{p-6a77992e.entry.js.map → p-46371c05.entry.js.map} +0 -0
  357. /package/dist/core/{p-9413d639.entry.js.map → p-4dd0eb6a.entry.js.map} +0 -0
  358. /package/dist/core/{p-dc0b9e80.entry.js.map → p-5e896163.entry.js.map} +0 -0
  359. /package/dist/core/{p-e41e701a.entry.js.map → p-68547339.entry.js.map} +0 -0
  360. /package/dist/core/{p-1eb0992b.entry.js.map → p-70124e59.entry.js.map} +0 -0
  361. /package/dist/core/{p-6b39f8b4.entry.js.map → p-8edd3a9b.entry.js.map} +0 -0
  362. /package/dist/core/{p-c0813424.entry.js.map → p-9715ec62.entry.js.map} +0 -0
  363. /package/dist/core/{p-cb437317.entry.js.map → p-983cb33c.entry.js.map} +0 -0
  364. /package/dist/core/{p-002a63e9.entry.js.map → p-a18c0672.entry.js.map} +0 -0
  365. /package/dist/core/{p-47b0ed42.entry.js.map → p-a8dc8196.entry.js.map} +0 -0
  366. /package/dist/core/{p-e384aaee.entry.js.map → p-af815dfb.entry.js.map} +0 -0
  367. /package/dist/core/{p-8780890e.entry.js.map → p-b69226d2.entry.js.map} +0 -0
  368. /package/dist/core/{p-3a67718c.entry.js.map → p-bffa2e1a.entry.js.map} +0 -0
  369. /package/dist/core/{p-a0f4e641.entry.js.map → p-ca20c9c3.entry.js.map} +0 -0
  370. /package/dist/core/{p-546b620e.entry.js.map → p-df1b0f17.entry.js.map} +0 -0
  371. /package/dist/core/{p-5d077cf7.entry.js.map → p-fb5861c6.entry.js.map} +0 -0
  372. /package/dist/core/{p-3e5eb873.entry.js.map → p-fd18d7a3.entry.js.map} +0 -0
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["src/components/ic-tab-context/ic-tab-context.tsx"],"names":["TabContext","this","newTabs","newTabPanels","linkTabs","tabs","forEach","tab","index","tabId","contextId","tabPanelId","shared","contextIdAttr","setAttribute","tabPosition","tabGroup","tabPanels","panelId","appearance","IcThemeForegroundEnum","Light","getChildren","host","querySelector","Array","from","querySelectorAll","children","filter","child","tagName","enabledTabs","getEnabledTabs","attatchEventListeners","activationType","addEventListener","event","handleKeyBoardNavAutomatic","handleKeyBoardNavManual","setControlledMode","selectedTabIndex","undefined","controlledMode","selectedTab","setInitialTab","focusedTabIndex","firstEnabledTabIndex","findIndex","configureTabs","selected","tabPanel","disabled","getIndexOfEnabledTab","allTabsIndex","keyboardSelectTab","enabledTabIndex","newIndex","focus","icTabSelect","emit","tabIndex","tabSelect","keyboardFocusTab","key","preventDefault","length","[object Object]","newValue","detail","position","stopImmediatePropagation","ev","setFocus","push","hadFocus","removeEventListener","h"],"mappings":"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","sourcesContent":["import {\n Component,\n Element,\n Event,\n EventEmitter,\n Listen,\n Prop,\n State,\n h,\n Watch,\n Method,\n} from \"@stencil/core\";\nimport {\n IcActivationTypes,\n IcThemeForegroundNoDefault,\n IcThemeForegroundEnum,\n} from \"../../utils/types\";\n\nimport {\n IcTabClickEventDetail,\n IcTabSelectEventDetail,\n} from \"../ic-tab/ic-tab.types\";\n\n@Component({\n tag: \"ic-tab-context\",\n})\nexport class TabContext {\n private controlledMode: boolean;\n private tabs: HTMLIcTabElement[];\n private enabledTabs: HTMLIcTabElement[];\n private tabPanels: HTMLIcTabPanelElement[];\n private tabGroup: HTMLIcTabGroupElement;\n private focusedTabIndex: number;\n private newTabs: HTMLIcTabElement[] = [];\n private newTabPanels: HTMLIcTabPanelElement[] = [];\n\n @Element() host: HTMLIcTabContextElement;\n\n /**\n * The unique context needed if using multiple tabs inside one another i.e. rendering another set of tabs inside a tab panel.\n */\n @Prop({ reflect: true }) contextId?: string = \"default\";\n\n /**\n * Determines whether tabs have to be manually activated (by pressing 'Enter' or 'Space') when they receive focus using keyboard navigation.\n */\n @Prop() activationType?: IcActivationTypes = \"automatic\";\n\n /**\n * The selected tab to be controlled by the user. Must be used alongside the icTabSelect event to manage tab selection.\n */\n @Prop() selectedTabIndex?: number;\n\n /**\n * The appearance of the tab context, e.g dark, or light.\n */\n @Prop() appearance?: IcThemeForegroundNoDefault = \"dark\";\n\n @State() selectedTab: number | null;\n\n @Watch(\"selectedTabIndex\")\n updateSelectedTab(newValue: number): void {\n this.selectedTab = newValue;\n }\n\n /**\n * @deprecated This event should not be used anymore. Use icTabSelect instead.\n */\n @Event({ bubbles: false }) tabSelect: EventEmitter<IcTabSelectEventDetail>;\n\n /**\n * Emitted when a user selects a tab.\n */\n @Event({ bubbles: false }) icTabSelect: EventEmitter<IcTabSelectEventDetail>;\n\n @Listen(\"tabClick\")\n tabClickHandler(event: CustomEvent<IcTabClickEventDetail>): void {\n if (\n this.selectedTabIndex === undefined &&\n event.detail.contextId === this.contextId\n ) {\n this.selectedTab = event.detail.position;\n }\n this.icTabSelect.emit({\n tabIndex: event.detail.position,\n });\n this.tabSelect.emit({\n tabIndex: event.detail.position,\n });\n event.stopImmediatePropagation();\n }\n\n @Listen(\"tabCreated\")\n @Listen(\"tabPanelCreated\")\n tabCreatedHandler(ev: CustomEvent) {\n if (this.tabs && this.tabPanels) {\n (ev.detail.setFocus ? this.newTabs : this.newTabPanels).push(ev.detail);\n if (this.newTabs.length === this.newTabPanels.length) {\n this.tabs.push(...this.newTabs);\n this.tabPanels.push(...this.newTabPanels);\n this.enabledTabs = this.getEnabledTabs();\n this.linkTabs();\n this.newTabs = [];\n this.newTabPanels = [];\n }\n }\n }\n\n /**\n * @internal Used to set tab/tab panel IDs when a tab/tab panel has been removed\n */\n @Method()\n async tabRemovedHandler(hadFocus?: boolean) {\n this.getChildren();\n this.enabledTabs = this.getEnabledTabs();\n this.linkTabs();\n if (this.tabs[this.selectedTab] && this.tabPanels[this.selectedTab]) {\n this.tabs[this.selectedTab].selected = true;\n this.tabPanels[this.selectedTab].selectedTab =\n this.tabs[this.selectedTab].tabId;\n } else {\n this.setInitialTab();\n }\n\n if (hadFocus) {\n this.tabs[this.selectedTab].setFocus();\n }\n }\n\n // Sets attributes to link tab-group, tabs and tab-panels\n private linkTabs = () => {\n this.tabs.forEach((tab, index) => {\n const tabId = `ic-tab-${index}-context-${this.contextId}`;\n const tabPanelId = `ic-tab-panel-${index}-context-${this.contextId}`;\n const shared = `ic-tab--${index}-context-${this.contextId}`;\n const contextIdAttr = \"context-id\";\n tab.setAttribute(\"id\", tabId);\n tab.tabId = shared;\n tab.tabPosition = index;\n tab.setAttribute(\"aria-controls\", tabPanelId);\n tab.setAttribute(contextIdAttr, this.contextId);\n this.tabGroup.setAttribute(contextIdAttr, this.contextId);\n this.tabPanels[index].setAttribute(\"id\", tabPanelId);\n this.tabPanels[index].panelId = shared;\n this.tabPanels[index].tabPosition = index;\n this.tabPanels[index].setAttribute(\"aria-labelledby\", tabId);\n this.tabPanels[index].setAttribute(contextIdAttr, this.contextId);\n\n if (this.appearance === IcThemeForegroundEnum.Light) {\n tab.appearance = this.appearance;\n this.tabPanels[index].appearance = this.appearance;\n }\n });\n\n if (this.appearance === IcThemeForegroundEnum.Light) {\n this.tabGroup.appearance = this.appearance;\n }\n };\n\n // Gets tabs and tabpanels with the same context ID\n // Using querySelector to selector the children in relation to the host\n private getChildren = (): void => {\n this.tabGroup = this.host.querySelector(\"ic-tab-group\");\n this.tabs = Array.from(this.tabGroup.querySelectorAll(\"ic-tab\"));\n this.tabPanels = Array.from(this.host.children).filter(\n (child) => child.tagName === \"IC-TAB-PANEL\"\n ) as HTMLIcTabPanelElement[];\n this.enabledTabs = this.getEnabledTabs();\n };\n\n // Determines how keyboard navigation is to be handled based on the activation type\n private attatchEventListeners = (): void => {\n if (this.activationType === \"automatic\") {\n this.tabGroup.addEventListener(\"keydown\", (event) => {\n this.handleKeyBoardNavAutomatic(event);\n });\n } else {\n this.tabGroup.addEventListener(\"keydown\", (event) => {\n this.handleKeyBoardNavManual(event);\n });\n }\n };\n\n // Determines whether the selected tab is being controlled within the component\n // or by the user (via selectedTabIndex and onIcTabSelect)\n private setControlledMode = (): void => {\n if (this.selectedTabIndex !== undefined) {\n this.controlledMode = true;\n this.selectedTab = this.selectedTabIndex;\n }\n };\n\n // Sets the tab that is selected on initial render\n private setInitialTab = (): void => {\n if (this.controlledMode) {\n this.selectedTab = this.selectedTabIndex;\n this.focusedTabIndex = this.selectedTabIndex;\n } else {\n const firstEnabledTabIndex = this.tabs.findIndex(\n (tab) => tab.tabId === this.enabledTabs[0].tabId\n );\n this.selectedTab = firstEnabledTabIndex;\n this.focusedTabIndex = firstEnabledTabIndex;\n }\n };\n\n // Passes the selected tab to the tab and tab panel components\n private configureTabs = () => {\n this.enabledTabs.forEach((tab) => {\n tab.selected = tab.tabPosition === this.selectedTab;\n });\n this.tabPanels.forEach((tabPanel) => {\n tabPanel.selectedTab = this.tabs[this.selectedTab].tabId;\n });\n };\n\n private getEnabledTabs = () => {\n return Array.from(this.tabs).filter((child) => !child.disabled);\n };\n\n private getIndexOfEnabledTab = (allTabsIndex: number) => {\n return this.enabledTabs.findIndex(\n (tab) => tab.tabId === this.tabs[allTabsIndex].tabId\n );\n };\n\n // Sets focus on tab and selects it\n private keyboardSelectTab = (enabledTabIndex: number) => {\n const newIndex = this.tabs.findIndex(\n (tab) => tab.tabId === this.enabledTabs[enabledTabIndex].tabId\n );\n this.enabledTabs[enabledTabIndex].focus();\n if (!this.controlledMode) {\n this.selectedTab = newIndex;\n } else {\n this.icTabSelect.emit({ tabIndex: newIndex });\n this.tabSelect.emit({ tabIndex: newIndex });\n }\n };\n\n // Sets focus on tab without selecting it (for manual activation)\n private keyboardFocusTab = (enabledTabIndex: number) => {\n const newIndex = this.tabs.findIndex(\n (tab) => tab.tabId === this.enabledTabs[enabledTabIndex].tabId\n );\n this.enabledTabs[enabledTabIndex].focus();\n this.focusedTabIndex = newIndex;\n };\n\n private handleKeyBoardNavAutomatic = (event: KeyboardEvent) => {\n const key = event.key;\n const enabledTabIndex = this.getIndexOfEnabledTab(this.selectedTab);\n let preventDefault = true;\n switch (key) {\n case \"Home\":\n this.keyboardSelectTab(0);\n break;\n case \"End\":\n this.keyboardSelectTab(this.enabledTabs.length - 1);\n break;\n case \"ArrowRight\":\n if (enabledTabIndex < this.enabledTabs.length - 1) {\n this.keyboardSelectTab(enabledTabIndex + 1);\n } else {\n this.keyboardSelectTab(0);\n }\n break;\n case \"ArrowLeft\":\n if (enabledTabIndex > 0) {\n this.keyboardSelectTab(enabledTabIndex - 1);\n } else {\n this.keyboardSelectTab(this.enabledTabs.length - 1);\n }\n break;\n default:\n preventDefault = false;\n }\n if (preventDefault) event.preventDefault();\n };\n\n private handleKeyBoardNavManual = (event: KeyboardEvent) => {\n const key = event.key;\n const enabledTabIndex = this.getIndexOfEnabledTab(this.focusedTabIndex);\n let preventDefault = true;\n switch (key) {\n case \"Home\":\n this.keyboardFocusTab(0);\n break;\n case \"End\":\n this.keyboardFocusTab(this.enabledTabs.length - 1);\n break;\n case \"ArrowRight\":\n if (enabledTabIndex < this.enabledTabs.length - 1) {\n this.keyboardFocusTab(enabledTabIndex + 1);\n } else {\n this.keyboardFocusTab(0);\n }\n break;\n case \"ArrowLeft\":\n if (enabledTabIndex > 0) {\n this.keyboardFocusTab(enabledTabIndex - 1);\n } else {\n this.keyboardFocusTab(this.enabledTabs.length - 1);\n }\n break;\n case \"Enter\":\n this.keyboardSelectTab(this.focusedTabIndex);\n break;\n case \" \":\n this.keyboardSelectTab(this.focusedTabIndex);\n break;\n default:\n preventDefault = false;\n }\n if (preventDefault) event.preventDefault();\n };\n\n componentDidLoad(): void {\n this.setControlledMode();\n this.getChildren();\n this.linkTabs();\n this.attatchEventListeners();\n this.setInitialTab();\n this.configureTabs();\n }\n\n componentWillUpdate(): void {\n this.configureTabs();\n }\n\n disconnectedCallback(): void {\n if (this.activationType === \"manual\") {\n this.tabGroup.removeEventListener(\"keydown\", (event) =>\n this.handleKeyBoardNavManual(event)\n );\n } else {\n this.tabGroup.removeEventListener(\"keydown\", (event) =>\n this.handleKeyBoardNavAutomatic(event)\n );\n }\n }\n\n render() {\n return <slot></slot>;\n }\n}\n"]}
@@ -0,0 +1,2 @@
1
+ import{r as t,c as e,h as i,H as s,g as a}from"./p-589f6dd3.js";import{a as n}from"./p-6f57b13c.js";import{J as o,m as r,d as l,a as h,r as c,h as d,e as u,i as p,K as m,n as b}from"./p-471820e6.js";const f='/*! 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}:host(.fullwidth){width:100%}::-moz-placeholder{color:var(--ic-color-tertiary-text);opacity:1}::placeholder{color:var(--ic-color-tertiary-text);opacity:1}input,textarea{border:0;border-radius:var(--ic-border-radius);background-color:var(--ic-architectural-white);line-height:1.5rem;letter-spacing:0.005rem;width:100%;padding-right:var(--ic-space-xs);padding-left:var(--ic-space-xs)}textarea{min-height:var(--ic-space-lg);resize:vertical;padding-top:0.375rem}input:focus,textarea:focus{border:0;outline:0}input:disabled,textarea:disabled{color:var(--ic-architectural-200)}input.readonly,textarea.readonly{color:var(--ic-color-primary-text)}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type="number"]{-moz-appearance:textfield}textarea.no-resize{resize:none}.maxlengthtext{color:var(--ic-color-secondary-text)}.error{color:var(--ic-status-error)}.disabled{color:var(--ic-architectural-200)}.no-left-pad{padding-left:0}::slotted([slot="icon"]){fill:var(--ic-color-tertiary-text)}.has-value ::slotted([slot="icon"]){fill:var(--ic-color-primary-text)}.charcount{margin-right:calc(-1 * var(--ic-space-xxxs))}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration,input[type="search"]::-webkit-search-results-button,input[type="search"]::-webkit-search-results-decoration{display:none}input[type="search"].truncate-value{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}@media (forced-colors: active){input.readonly,textarea.readonly{color:canvastext}.has-value ::slotted([slot="icon"]){fill:currentcolor}}';let y=0;const v=class{constructor(i){t(this,i);this.icKeydown=e(this,"icKeydown",7);this.icInput=e(this,"icInput",7);this.icBlur=e(this,"icBlur",7);this.icFocus=e(this,"icFocus",7);this.icChange=e(this,"icChange",7);this.getValidationText=e(this,"getValidationText",7);this.inheritedAttributes={};this.showLeftIcon=this.hasLeftIconSlot();this.onInput=t=>{this.value=t.target.value;this.icInput.emit({value:this.value})};this.onBlur=t=>{const e=t.target.value;this.icBlur.emit({value:e})};this.onFocus=t=>{const e=t.target.value;this.icFocus.emit({value:e})};this.isTextArea=()=>this.rows>1;this.getInlineValidationText=()=>{this.getValidationText.emit({value:this.validationText})};this.hasStatus=t=>t!==""&&!this.disabled;this.showStatusText=t=>this.hasStatus(t)&&!(t==n.Success&&this.validationInline)&&!this.validationInlineInternal;this.handleFormReset=()=>{this.value=this.initialValue};this.inputId=`ic-text-field-input-${y++}`;this.label=undefined;this.required=false;this.disabled=false;this.readonly=false;this.placeholder="";this.fullWidth=false;this.hideLabel=false;this.helperText="";this.rows=1;this.resize=false;this.small=false;this.value="";this.min=undefined;this.max=undefined;this.maxLength=0;this.validationStatus="";this.validationText="";this.validationInline=false;this.validationInlineInternal=false;this.autocapitalize="off";this.autocomplete="off";this.autocorrect="off";this.autoFocus=false;this.debounce=0;this.type="text";this.inputmode="text";this.name=this.inputId;this.spellcheck=false;this.ariaActiveDescendant=undefined;this.truncateValue=undefined;this.ariaExpanded=undefined;this.ariaOwns=undefined;this.ariaAutocomplete=undefined;this.role=undefined;this.hiddenInput=true;this.numChars=0;this.maxLengthExceeded=false;this.minValueUnattained=false;this.maxValueExceeded=false;this.initialValue=this.value}debounceChanged(){this.icChange=o(this.icChange,this.debounce)}watchValueHandler(t){if(this.inputEl&&this.inputEl.value!==t){this.inputEl.value=t}this.numChars=t.length;if(this.type==="number"){if(t&&Number(t)<Number(this.min)){this.minValueUnattained=true}else{this.minValueUnattained=false}if(Number(t)>Number(this.max)){this.maxValueExceeded=true}else{this.maxValueExceeded=false}}if(this.maxLength>0){if(t.length>this.maxLength){this.maxLengthExceeded=true}else{this.maxLengthExceeded=false}}this.icChange.emit({value:t})}async setFocus(){if(this.inputEl){this.inputEl.focus()}}handleKeyDown(t){this.icKeydown.emit({event:t});t.cancelBubble=true}hasLeftIconSlot(){const t=this.el.querySelector(`[slot="icon"]`);return t!==null}connectedCallback(){this.debounceChanged()}componentWillLoad(){this.watchValueHandler(this.value);this.inheritedAttributes=r(this.el,[...b,"title","aria-autocomplete","aria-haspopup"]);if(this.readonly){this.maxLengthExceeded=false;this.maxValueExceeded=false;this.minValueUnattained=false}l(this.el,this.handleFormReset)}componentDidLoad(){h([{prop:this.label,propName:"label"}],"Text Field");if(this.validationInlineInternal){this.getInlineValidationText()}}disconnectedCallback(){c(this.el,this.handleFormReset)}render(){const{inputId:t,name:e,label:a,required:o,small:r,placeholder:l,helperText:h,rows:c,resize:b,disabled:f,value:y,min:v,max:x,maxLength:g,numChars:w,readonly:k,maxLengthExceeded:z,minValueUnattained:I,maxValueExceeded:F,validationStatus:L,validationText:j,validationInline:T,validationInlineInternal:q,spellcheck:C,inputmode:V,fullWidth:M,truncateValue:N,hiddenInput:B}=this;const W=k?true:f;const $=f?"":l;const H=z||F||I?n.Error:L;const K=z?"Maximum length exceeded":F?`Maximum value of ${x} exceeded`:I?`Minimum value of ${v} not met`:j;const S=k?0:g;const D=z||F||I||g===0&&H===n.Error?"assertive":"polite";const E=this.showStatusText(H);const O=this.isTextArea();const _=g>0?t+"-charcount-desc":"";const J=(_+" "+d(t,h!=="",E)).trim();if(this.showLeftIcon&&!k&&W){this.showLeftIcon=false}const U=H===n.Error?"true":"false";const A=W&&!k;if(B){u(true,this.el,e,y,W)}return i(s,{class:{["fullwidth"]:M}},i("ic-input-container",{readonly:k,disabled:W},!this.hideLabel&&i("ic-input-label",{for:t,label:a,helperText:h,required:o,disabled:A,readonly:k}),i("ic-input-component-container",{small:r,validationStatus:H,multiLine:O,disabled:W,readonly:k,validationInline:T,fullWidth:M},this.showLeftIcon&&i("span",{class:{["readonly"]:k,["has-value"]:y.length>0},slot:"left-icon"},i("slot",{name:"icon"})),!O&&i("input",Object.assign({id:t,name:e,ref:t=>this.inputEl=t,type:this.type,min:v,max:x,value:y,class:{["no-left-pad"]:!this.showLeftIcon&&k,["readonly"]:k,["truncate-value"]:N},placeholder:$,required:o,disabled:W,readonly:k,onInput:this.onInput,onBlur:this.onBlur,onFocus:this.onFocus,"aria-label":a,"aria-describedby":J,"aria-invalid":U,"aria-activedescendant":this.ariaActiveDescendant,"aria-expanded":this.ariaExpanded,"aria-owns":this.ariaOwns,autocomplete:this.autocomplete,autocapitalize:this.autocapitalize,autoFocus:this.autoFocus,spellcheck:C,inputmode:V,role:this.role},this.inheritedAttributes)),O&&i("textarea",Object.assign({id:t,class:{["no-resize"]:b===false||k,["no-left-pad"]:!this.showLeftIcon&&k,["readonly"]:k},name:e,ref:t=>this.inputEl=t,value:y,rows:c,required:o,disabled:W,placeholder:$,readonly:k,onInput:this.onInput,onBlur:this.onBlur,onFocus:this.onFocus,"aria-label":a,"aria-describedby":J,"aria-invalid":U,autocapitalize:this.autocapitalize,autoFocus:this.autoFocus,spellcheck:C,inputmode:V},this.inheritedAttributes)),p(this.el,"clear-button")&&i("slot",{name:"clear-button"}),p(this.el,"search-submit-button")&&i("slot",{name:"search-submit-button"})),p(this.el,"menu")&&i("slot",{name:"menu"}),(!m(L)||!m(j)||S>0||F||I)&&!q&&i("ic-input-validation",{status:this.hasStatus(H)===false||H===n.Success&&T||q?"":H,message:E?K:"",ariaLiveMode:D,for:t,fullWidth:M},!k&&S>0&&i("div",{slot:"validation-message-adornment"},i("ic-typography",{variant:"caption",class:{["maxlengthtext"]:true,["error"]:z,["disabled"]:A}},i("span",{"aria-live":"polite",id:`${t}-charcount`,class:"charcount"},w,"/",S),i("span",{hidden:true,id:_},"Field can contain a maximum of ",S," characters."))))))}get el(){return a(this)}static get watchers(){return{debounce:["debounceChanged"],value:["watchValueHandler"]}}};v.style=f;export{v as ic_text_field};
2
+ //# sourceMappingURL=p-2e6ea6d3.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["src/components/ic-text-field/ic-text-field.css?tag=ic-text-field&encapsulation=shadow","src/components/ic-text-field/ic-text-field.tsx"],"names":["icTextFieldCss","inputIds","TextField","this","inheritedAttributes","showLeftIcon","hasLeftIconSlot","onInput","ev","value","target","icInput","emit","onBlur","icBlur","onFocus","icFocus","isTextArea","rows","getInlineValidationText","getValidationText","validationText","hasStatus","status","disabled","showStatusText","IcInformationStatus","Success","validationInline","validationInlineInternal","handleFormReset","initialValue","undefined","inputId","[object Object]","icChange","debounceEvent","debounce","newValue","inputEl","numChars","length","type","Number","min","minValueUnattained","max","maxValueExceeded","maxLength","maxLengthExceeded","focus","icKeydown","event","cancelBubble","iconEl","el","querySelector","debounceChanged","watchValueHandler","inheritAttributes","IC_INHERITED_ARIA","readonly","addFormResetListener","onComponentRequiredPropUndefined","prop","label","propName","removeFormResetListener","name","required","small","placeholder","helperText","resize","validationStatus","spellcheck","inputmode","fullWidth","truncateValue","hiddenInput","disabledMode","placeholderText","currentStatus","Error","currentValidationText","maxNumChars","messageAriaLive","multiline","hiddenCharCountDescId","describedBy","getInputDescribedByText","trim","invalid","disabledText","renderHiddenInput","h","Host","class","hideLabel","for","multiLine","slot","Object","assign","id","ref","aria-label","aria-describedby","aria-invalid","aria-activedescendant","ariaActiveDescendant","aria-expanded","ariaExpanded","aria-owns","ariaOwns","autocomplete","autocapitalize","autoFocus","role","isSlotUsed","isEmptyString","message","ariaLiveMode","variant","aria-live","hidden"],"mappings":"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","sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n /**\n * @prop --input-width: Width of the input field\n */\n display: block;\n}\n\n:host(.fullwidth) {\n width: 100%;\n}\n\n::placeholder {\n color: var(--ic-color-tertiary-text);\n opacity: 1;\n}\n\ninput,\ntextarea {\n border: 0;\n border-radius: var(--ic-border-radius);\n background-color: var(--ic-architectural-white);\n line-height: 1.5rem;\n letter-spacing: 0.005rem;\n width: 100%;\n padding-right: var(--ic-space-xs);\n padding-left: var(--ic-space-xs);\n}\n\ntextarea {\n min-height: var(--ic-space-lg);\n resize: vertical;\n padding-top: 0.375rem;\n}\n\ninput:focus,\ntextarea:focus {\n border: 0;\n outline: 0;\n}\n\ninput:disabled,\ntextarea:disabled {\n color: var(--ic-architectural-200);\n}\n\ninput.readonly,\ntextarea.readonly {\n color: var(--ic-color-primary-text);\n}\n\n/* Chrome, Safari, Edge */\ninput::-webkit-outer-spin-button,\ninput::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n}\n\n/* Firefox */\ninput[type=\"number\"] {\n -moz-appearance: textfield;\n}\n\ntextarea.no-resize {\n resize: none;\n}\n\n.maxlengthtext {\n color: var(--ic-color-secondary-text);\n}\n\n.error {\n color: var(--ic-status-error);\n}\n\n.disabled {\n color: var(--ic-architectural-200);\n}\n\n.no-left-pad {\n padding-left: 0;\n}\n\n::slotted([slot=\"icon\"]) {\n fill: var(--ic-color-tertiary-text);\n}\n\n.has-value ::slotted([slot=\"icon\"]) {\n fill: var(--ic-color-primary-text);\n}\n\n.charcount {\n margin-right: calc(-1 * var(--ic-space-xxxs));\n}\n\ninput[type=\"search\"]::-webkit-search-cancel-button,\ninput[type=\"search\"]::-webkit-search-decoration,\ninput[type=\"search\"]::-webkit-search-results-button,\ninput[type=\"search\"]::-webkit-search-results-decoration {\n display: none;\n}\n\ninput[type=\"search\"].truncate-value {\n width: 100%;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n}\n\n@media (forced-colors: active) {\n input.readonly,\n textarea.readonly {\n color: canvastext;\n }\n\n .has-value ::slotted([slot=\"icon\"]) {\n fill: currentcolor;\n }\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n Method,\n h,\n} from \"@stencil/core\";\n\nimport {\n IcAutocompleteTypes,\n IcAutocorrectStates,\n IcInformationStatusOrEmpty,\n IcValueEventDetail,\n} from \"../../interface\";\nimport { IcInformationStatus } from \"../../utils/types\";\nimport {\n inheritAttributes,\n debounceEvent,\n getInputDescribedByText,\n renderHiddenInput,\n isEmptyString,\n onComponentRequiredPropUndefined,\n addFormResetListener,\n removeFormResetListener,\n isSlotUsed,\n} from \"../../utils/helpers\";\nimport { IC_INHERITED_ARIA } from \"../../utils/constants\";\nimport {\n IcAriaAutocompleteTypes,\n IcTextFieldInputModes,\n IcTextFieldTypes,\n} from \"./ic-text-field.types\";\n\nlet inputIds = 0;\n\n/**\n * @slot icon - Content will be placed to the left of the text input.\n */\n@Component({\n tag: \"ic-text-field\",\n styleUrl: \"ic-text-field.css\",\n shadow: true,\n})\nexport class TextField {\n @Element() el: HTMLIcTextFieldElement;\n\n private inputEl: HTMLInputElement | HTMLTextAreaElement;\n private inheritedAttributes: { [k: string]: unknown } = {};\n\n /**\n * @slot clear-button - an ic-button clear component will render as an end adornment to the input.\n * @slot search-submit-button - an ic-button search submit component will render as an end adornment to the input.\n * @slot menu - an ic-menu component will appear below the input.\n */\n\n /**\n * The ID for the input.\n */\n @Prop() inputId?: string = `ic-text-field-input-${inputIds++}`;\n\n /**\n * The label for the input.\n */\n @Prop() label!: string;\n\n /**\n * If `true`, the input will require a value.\n */\n @Prop() required: boolean = false;\n /**\n * If `true`, the disabled state will be set.\n */\n @Prop() disabled: boolean = false;\n\n /**\n * If `true`, the read only state will be set.\n */\n @Prop({ reflect: true }) readonly: boolean = false;\n\n /**\n * The placeholder value to be displayed.\n */\n @Prop() placeholder: string = \"\";\n\n /**\n * Specify whether the text field fills the full width of the container.\n * If `true`, this overrides the --input-width CSS variable.\n */\n @Prop() fullWidth: boolean = false;\n\n /**\n * If `true`, the label will be hidden and the required label value will be applied as an aria-label.\n */\n @Prop() hideLabel: boolean = false;\n\n /**\n * The helper text that will be displayed for additional field guidance.\n */\n @Prop() helperText: string = \"\";\n\n /**\n * The number of rows to transform the text field into a text area with a specific height.\n */\n @Prop() rows: number = 1;\n\n /**\n * If `true`, the multiline text area will be resizeable.\n */\n @Prop() resize: boolean = false;\n\n /**\n * If `true`, the small styling will be applied to the text field.\n */\n @Prop({ reflect: true }) small: boolean = false;\n\n /**\n * The value of the text field.\n */\n @Prop({ reflect: true, mutable: true }) value: string = \"\";\n\n /**\n * The minimum number that can be accepted as a value, when `type` is `number` and `rows` is `1`. (NOTE: Ensure to include visual indication of min value in `helperText` or `label`)\n */\n @Prop() min: string | number = undefined;\n\n /**\n * The maximum number that can be accepted as a value, when `type` is `number` and `rows` is `1`. (NOTE: Ensure to include visual indication of max value in `helperText` or `label`)\n */\n @Prop() max: string | number = undefined;\n\n /**\n * The maximum number of characters that can be entered in the field.\n */\n @Prop() maxLength: number = 0;\n\n /**\n * The validation state - e.g. 'error' | 'warning' | 'success'.\n */\n @Prop() validationStatus: IcInformationStatusOrEmpty = \"\";\n\n /**\n * The validation state - e.g. 'error' | 'warning' | 'success'.\n */\n @Prop() validationText: string = \"\";\n\n /**\n * If `true`, the icon in input control will be displayed - only applies when validationStatus ='success'.\n */\n @Prop() validationInline: boolean = false;\n\n /**\n * @internal If `true`, the validation will display inline.\n */\n @Prop() validationInlineInternal: boolean = false;\n\n /**\n * The automatic capitalisation of the text value as it is entered/edited by the user.\n * Available options: \"off\", \"none\", \"on\", \"sentences\", \"words\", \"characters\".\n */\n @Prop() autocapitalize = \"off\";\n\n /**\n * The state of autocompletion the browser can apply on the text value.\n */\n @Prop() autocomplete: IcAutocompleteTypes = \"off\";\n\n /**\n * The state of autocorrection the browser can apply when the user is entering/editing the text value.\n */\n @Prop() autocorrect: IcAutocorrectStates = \"off\";\n\n /**\n * If `true`, the form control will have input focus when the page loads.\n */\n @Prop() autoFocus = false;\n\n /**\n * The amount of time, in milliseconds, to wait to trigger the `icChange` event after each keystroke.\n */\n @Prop() debounce: number = 0;\n\n private showLeftIcon: boolean = this.hasLeftIconSlot();\n\n @Watch(\"debounce\")\n private debounceChanged() {\n this.icChange = debounceEvent(this.icChange, this.debounce);\n }\n\n /**\n * The type of control to display. The default type is text.\n */\n @Prop() type: IcTextFieldTypes = \"text\";\n\n /**\n * A hint to the browser for which keyboard to display.\n * Possible values: `\"none\"`, `\"text\"`, `\"tel\"`, `\"url\"`,\n * `\"email\"`, `\"numeric\"`, `\"decimal\"`, and `\"search\"`.\n */\n @Prop() inputmode: IcTextFieldInputModes = \"text\";\n\n /**\n * The name of the control, which is submitted with the form data.\n */\n @Prop() name: string = this.inputId;\n\n /**\n * If `true`, the value of the text field will have its spelling and grammar checked.\n */\n @Prop() spellcheck: boolean = false;\n\n /**\n * @internal The active element when focus is on the ic-menu items.\n */\n @Prop() ariaActiveDescendant?: string;\n /**\n * @internal If `true`, an ellipsis will be displayed at the end of the value if the value is longer than the container.\n */\n @Prop() truncateValue?: boolean;\n\n /**\n * @internal Used to identify if the slotted menu is rendered\n */\n @Prop() ariaExpanded: string;\n\n /**\n * @internal Used to identify any related child component\n */\n @Prop() ariaOwns: string;\n\n /**\n * @internal Used to identify whether inputting any text triggers more predictions\n */\n @Prop() ariaAutocomplete: IcAriaAutocompleteTypes = undefined;\n\n /**\n * @internal Used to set the role if not default textbox;\n */\n @Prop() role: string;\n\n /**\n * @internal If `true`, the hidden form input will stop rendering for form submission.\n */\n @Prop() hiddenInput: boolean = true;\n\n @State() numChars: number = 0;\n @State() maxLengthExceeded: boolean = false;\n @State() minValueUnattained: boolean = false;\n @State() maxValueExceeded: boolean = false;\n @State() initialValue = this.value;\n\n @Watch(\"value\")\n watchValueHandler(newValue: string): void {\n if (this.inputEl && this.inputEl.value !== newValue) {\n this.inputEl.value = newValue;\n }\n\n this.numChars = newValue.length;\n\n if (this.type === \"number\") {\n if (newValue && Number(newValue) < Number(this.min)) {\n this.minValueUnattained = true;\n } else {\n this.minValueUnattained = false;\n }\n if (Number(newValue) > Number(this.max)) {\n this.maxValueExceeded = true;\n } else {\n this.maxValueExceeded = false;\n }\n }\n\n if (this.maxLength > 0) {\n if (newValue.length > this.maxLength) {\n this.maxLengthExceeded = true;\n } else {\n this.maxLengthExceeded = false;\n }\n }\n this.icChange.emit({ value: newValue });\n }\n\n /**\n * Sets focus on the native `input`.\n */\n @Method()\n async setFocus(): Promise<void> {\n if (this.inputEl) {\n this.inputEl.focus();\n }\n }\n\n //stop keydown event bubbling up to storybook\n @Listen(\"keydown\", {})\n handleKeyDown(ev: KeyboardEvent): void {\n this.icKeydown.emit({ event: ev });\n ev.cancelBubble = true;\n }\n\n /**\n * Emitted when a keydown event occurred.\n */\n @Event() icKeydown: EventEmitter<{ event: KeyboardEvent }>;\n\n /**\n * Emitted when a keyboard input occurred.\n */\n @Event() icInput: EventEmitter<IcValueEventDetail>;\n private onInput = (ev: Event) => {\n this.value = (ev.target as HTMLInputElement).value;\n this.icInput.emit({ value: this.value });\n };\n\n /**\n * Emitted when input loses focus.\n */\n @Event() icBlur: EventEmitter<IcValueEventDetail>;\n private onBlur = (ev: Event) => {\n const value = (ev.target as HTMLInputElement).value;\n this.icBlur.emit({ value: value });\n };\n\n /**\n * Emitted when input gains focus.\n */\n @Event() icFocus: EventEmitter<IcValueEventDetail>;\n private onFocus = (ev: Event) => {\n const value = (ev.target as HTMLInputElement).value;\n this.icFocus.emit({ value: value });\n };\n\n /**\n * Emitted when the value has changed.\n */\n @Event() icChange: EventEmitter<IcValueEventDetail>;\n\n private isTextArea = (): boolean => {\n return this.rows > 1;\n };\n\n /**\n * @internal Emitted when the validationInlineInternal is `true`\n */\n @Event() getValidationText: EventEmitter<IcValueEventDetail>;\n\n private getInlineValidationText = () => {\n this.getValidationText.emit({ value: this.validationText });\n };\n\n private hasLeftIconSlot(): boolean {\n const iconEl = this.el.querySelector(`[slot=\"icon\"]`);\n return iconEl !== null;\n }\n\n private hasStatus = (status: IcInformationStatusOrEmpty): boolean => {\n return status !== \"\" && !this.disabled;\n };\n\n private showStatusText = (status: IcInformationStatusOrEmpty): boolean => {\n return (\n this.hasStatus(status) &&\n !(status == IcInformationStatus.Success && this.validationInline) &&\n !this.validationInlineInternal\n );\n };\n\n private handleFormReset = (): void => {\n this.value = this.initialValue;\n };\n\n connectedCallback(): void {\n this.debounceChanged();\n }\n\n componentWillLoad(): void {\n this.watchValueHandler(this.value);\n\n this.inheritedAttributes = inheritAttributes(this.el, [\n ...IC_INHERITED_ARIA,\n \"title\",\n \"aria-autocomplete\",\n \"aria-haspopup\",\n ]);\n\n if (this.readonly) {\n this.maxLengthExceeded = false;\n this.maxValueExceeded = false;\n this.minValueUnattained = false;\n }\n\n addFormResetListener(this.el, this.handleFormReset);\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [{ prop: this.label, propName: \"label\" }],\n \"Text Field\"\n );\n if (this.validationInlineInternal) {\n this.getInlineValidationText();\n }\n }\n\n disconnectedCallback(): void {\n removeFormResetListener(this.el, this.handleFormReset);\n }\n\n render() {\n const {\n inputId,\n name,\n label,\n required,\n small,\n placeholder,\n helperText,\n rows,\n resize,\n disabled,\n value,\n min,\n max,\n maxLength,\n numChars,\n readonly,\n maxLengthExceeded,\n minValueUnattained,\n maxValueExceeded,\n validationStatus,\n validationText,\n validationInline,\n validationInlineInternal,\n spellcheck,\n inputmode,\n fullWidth,\n truncateValue,\n hiddenInput,\n } = this;\n\n const disabledMode = readonly ? true : disabled;\n\n const placeholderText = disabled ? \"\" : placeholder;\n\n const currentStatus =\n maxLengthExceeded || maxValueExceeded || minValueUnattained\n ? IcInformationStatus.Error\n : validationStatus;\n\n const currentValidationText = maxLengthExceeded\n ? \"Maximum length exceeded\"\n : maxValueExceeded\n ? `Maximum value of ${max} exceeded`\n : minValueUnattained\n ? `Minimum value of ${min} not met`\n : validationText;\n\n const maxNumChars = readonly ? 0 : maxLength;\n\n const messageAriaLive =\n maxLengthExceeded ||\n maxValueExceeded ||\n minValueUnattained ||\n (maxLength === 0 && currentStatus === IcInformationStatus.Error)\n ? \"assertive\"\n : \"polite\";\n\n const showStatusText = this.showStatusText(currentStatus);\n const multiline = this.isTextArea();\n const hiddenCharCountDescId =\n maxLength > 0 ? inputId + \"-charcount-desc\" : \"\";\n const describedBy = (\n hiddenCharCountDescId +\n \" \" +\n getInputDescribedByText(inputId, helperText !== \"\", showStatusText)\n ).trim();\n\n if (this.showLeftIcon && !readonly && disabledMode) {\n this.showLeftIcon = false;\n }\n\n const invalid =\n currentStatus === IcInformationStatus.Error ? \"true\" : \"false\";\n const disabledText = disabledMode && !readonly;\n\n if (hiddenInput) {\n renderHiddenInput(true, this.el, name, value, disabledMode);\n }\n return (\n <Host class={{ [\"fullwidth\"]: fullWidth }}>\n <ic-input-container readonly={readonly} disabled={disabledMode}>\n {!this.hideLabel && (\n <ic-input-label\n for={inputId}\n label={label}\n helperText={helperText}\n required={required}\n disabled={disabledText}\n readonly={readonly}\n ></ic-input-label>\n )}\n\n <ic-input-component-container\n small={small}\n validationStatus={currentStatus}\n multiLine={multiline}\n disabled={disabledMode}\n readonly={readonly}\n validationInline={validationInline}\n fullWidth={fullWidth}\n >\n {this.showLeftIcon && (\n <span\n class={{\n [\"readonly\"]: readonly,\n [\"has-value\"]: value.length > 0,\n }}\n slot=\"left-icon\"\n >\n <slot name=\"icon\" />\n </span>\n )}\n\n {!multiline && (\n <input\n id={inputId}\n name={name}\n ref={(el) => (this.inputEl = el as HTMLInputElement)}\n type={this.type}\n min={min}\n max={max}\n value={value}\n class={{\n [\"no-left-pad\"]: !this.showLeftIcon && readonly,\n [\"readonly\"]: readonly,\n [\"truncate-value\"]: truncateValue,\n }}\n placeholder={placeholderText}\n required={required}\n disabled={disabledMode}\n readonly={readonly}\n onInput={this.onInput}\n onBlur={this.onBlur}\n onFocus={this.onFocus}\n aria-label={label}\n aria-describedby={describedBy}\n aria-invalid={invalid}\n aria-activedescendant={this.ariaActiveDescendant}\n aria-expanded={this.ariaExpanded}\n aria-owns={this.ariaOwns}\n autocomplete={this.autocomplete}\n autocapitalize={this.autocapitalize}\n autoFocus={this.autoFocus}\n spellcheck={spellcheck}\n inputmode={inputmode}\n role={this.role}\n {...this.inheritedAttributes}\n ></input>\n )}\n {multiline && (\n <textarea\n id={inputId}\n class={{\n [\"no-resize\"]: resize === false || readonly,\n [\"no-left-pad\"]: !this.showLeftIcon && readonly,\n [\"readonly\"]: readonly,\n }}\n name={name}\n ref={(el) => (this.inputEl = el as HTMLTextAreaElement)}\n value={value}\n rows={rows}\n required={required}\n disabled={disabledMode}\n placeholder={placeholderText}\n readonly={readonly}\n onInput={this.onInput}\n onBlur={this.onBlur}\n onFocus={this.onFocus}\n aria-label={label}\n aria-describedby={describedBy}\n aria-invalid={invalid}\n autocapitalize={this.autocapitalize}\n autoFocus={this.autoFocus}\n spellcheck={spellcheck}\n inputmode={inputmode}\n {...this.inheritedAttributes}\n ></textarea>\n )}\n {isSlotUsed(this.el, \"clear-button\") && (\n <slot name=\"clear-button\"></slot>\n )}\n {isSlotUsed(this.el, \"search-submit-button\") && (\n <slot name=\"search-submit-button\"></slot>\n )}\n </ic-input-component-container>\n {isSlotUsed(this.el, \"menu\") && <slot name=\"menu\"></slot>}\n {(!isEmptyString(validationStatus) ||\n !isEmptyString(validationText) ||\n maxNumChars > 0 ||\n maxValueExceeded ||\n minValueUnattained) &&\n !validationInlineInternal && (\n <ic-input-validation\n status={\n this.hasStatus(currentStatus) === false ||\n (currentStatus === IcInformationStatus.Success &&\n validationInline) ||\n validationInlineInternal\n ? \"\"\n : currentStatus\n }\n message={showStatusText ? currentValidationText : \"\"}\n ariaLiveMode={messageAriaLive}\n for={inputId}\n fullWidth={fullWidth}\n >\n {!readonly && maxNumChars > 0 && (\n <div slot=\"validation-message-adornment\">\n <ic-typography\n variant=\"caption\"\n class={{\n [\"maxlengthtext\"]: true,\n [\"error\"]: maxLengthExceeded,\n [\"disabled\"]: disabledText,\n }}\n >\n <span\n aria-live=\"polite\"\n id={`${inputId}-charcount`}\n class=\"charcount\"\n >\n {numChars}/{maxNumChars}\n </span>\n <span hidden={true} id={hiddenCharCountDescId}>\n Field can contain a maximum of {maxNumChars} characters.\n </span>\n </ic-typography>\n </div>\n )}\n </ic-input-validation>\n )}\n </ic-input-container>\n </Host>\n );\n }\n}\n"]}
@@ -1,2 +1,2 @@
1
- import{r as t,c as e,h as i,H as o,g as s}from"./p-589f6dd3.js";import{a as n,i as a,H as r}from"./p-3dea2867.js";import{C as c}from"./p-8c7f4343.js";import{C as l}from"./p-06321d19.js";import"./p-6f57b13c.js";const u='/*! 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}li{list-style:none;padding:0}:host::part(button){color:var(--ic-color-primary-text);padding:calc(var(--ic-space-xxxs) / 2);display:flex;align-items:flex-start;gap:var(--ic-space-xs);border-radius:0;min-height:2.5rem;height:auto}.focus-border{display:flex;align-items:flex-start;gap:var(--ic-space-xs);border-radius:var(--ic-border-radius);margin:calc(var(--ic-space-xxxs) / 2);padding:var(--ic-space-xxs);border:var(--ic-space-xxxs) dashed transparent;--icon-height:auto}:host(.disabled)::part(button){color:var(--ic-architectural-200) !important;pointer-events:none}:host(.disabled) .menu-item-label,:host(.disabled) .shortcut,:host(.disabled) .menu-item-description{color:var(--ic-architectural-200) !important}:host([variant="destructive"])::part(button){color:var(--ic-action-destructive)}:host::part(button):hover{background-color:var(--ic-action-dark-bg-hover)}:host::part(button):focus-visible,:host::part(button):focus{color:var(--ic-color-white-text);background-color:var(--ic-focus-blue);box-shadow:none}:host(.disabled)::part(button):focus-visible,:host(.disabled)::part(button):focus{color:var(--ic-theme-lighten-40) !important}:host([variant="destructive"])::part(button):focus-visible,:host([variant="destructive"])::part(button):focus{background-color:var(--ic-action-destructive)}ic-button:focus-within .menu-item-label,ic-button:focus-within .shortcut,ic-button:focus-within .menu-item-description{color:var(--ic-color-white-text)}:host(.disabled) ic-button:focus-within .focus-border{border-color:var(--ic-architectural-white)}:host(.disabled) ic-button:focus-within .menu-item-label,:host(.disabled) ic-button:focus-within .shortcut,:host(.disabled) ic-button:focus-within .menu-item-description{color:var(--ic-theme-lighten-40) !important}:host::part(button):active{background-color:var(--ic-action-dark-bg-active);color:var(--ic-color-primary-text) !important}:host([variant="destructive"])::part(button):active{background-color:var(--ic-action-dark-bg-active);color:var(--ic-action-destructive) !important}.menu-item-info{display:flex;flex-direction:column;flex:1;align-items:baseline;white-space:pre-line;text-align:left}.menu-labels{display:flex;align-items:baseline;gap:var(--ic-space-xs)}.menu-item-description{color:var(--ic-color-secondary-text)}.shortcut{color:var(--ic-color-tertiary-text);display:flex;flex:min-content}:host([variant="destructive"]) .menu-item-label{text-transform:uppercase;font-weight:600;letter-spacing:0.025em}ic-button:active .menu-item-label{color:var(--ic-color-primary-text)}ic-button:active .menu-item-description{color:var(--ic-color-secondary-text)}ic-button:active .shortcut{color:var(--ic-color-tertiary-text)}:host([variant="destructive"]) ic-button:active .menu-item-label{color:var(--ic-action-destructive) !important}.icon,.check-icon,.submenu-icon,.icon ::slotted(svg),.check-icon svg,.submenu-icon svg{width:var(--ic-space-lg);height:var(--ic-space-lg)}.check-icon.hide{visibility:hidden}@media (forced-colors: active){:host::part(button){border:Canvas}:host::part(button):focus-visible{outline:var(--ic-space-xxxs) solid transparent}.focus-border{border-color:Canvas}:host(.disabled) ic-button:focus-within .focus-border{border-color:GrayText}:host(.disabled) .menu-item-info,:host(.disabled) .menu-item-label,:host(.disabled) .shortcut,:host(.disabled) .menu-item-description,:host(.disabled) ic-button:focus-within .menu-item-info,:host(.disabled) ic-button:focus-within .menu-item-label,:host(.disabled) ic-button:focus-within .shortcut,:host(.disabled) ic-button:focus-within .menu-item-description{color:GrayText !important}:host(.disabled)::part(button):focus-visible,:host(.disabled)::part(button):focus{outline-color:GrayText !important}}';const d=class{constructor(i){t(this,i);this.childBlur=e(this,"childBlur",7);this.triggerPopoverMenuInstance=e(this,"triggerPopoverMenuInstance",7);this.handleMenuItemClick=e(this,"handleMenuItemClick",7);this.handleClick=t=>{t.preventDefault();if(this.submenuTriggerFor!==undefined){this.triggerPopoverMenuInstance.emit()}else if(this.variant==="toggle"){this.toggleChecked?this.toggleChecked=false:this.toggleChecked=true}this.handleMenuItemClick.emit({label:this.label,hasSubMenu:!!this.el.submenuTriggerFor})};this.getMenuItemAriaLabel=()=>{let t=this.label;if(this.description!==undefined){t=`${t}, ${this.description}`}if(this.keyboardShortcut!==undefined){t=`${t}, ${this.keyboardShortcut}`}if(this.variant==="destructive"){t=`${t}, destructive`}if(this.submenuTriggerFor!==undefined){t=`${t}, triggers submenu`}if(this.el.classList.contains("ic-popover-submenu-back-button")){t="Go back to parent menu"}const e=r(this.el);if(e.tagName==="IC-MENU-GROUP"){return`${t}, ${e.label} menu group`}else{return t}};this.variant="default";this.label=undefined;this.description=undefined;this.disabled=false;this.href=undefined;this.target=undefined;this.rel=undefined;this.hreflang=undefined;this.referrerpolicy=undefined;this.keyboardShortcut=undefined;this.submenuTriggerFor=undefined;this.toggleChecked=false}handleHostClick(t){if(this.disabled){t.stopImmediatePropagation()}}componentWillLoad(){if(this.submenuTriggerFor!==undefined&&this.variant!=="default"){this.variant="default"}}componentDidLoad(){n([{prop:this.label,propName:"label"}],"Menu Item")}render(){const t=t=>t!==undefined?t:null;const e=()=>i("div",{class:"menu-item-info"},i("div",{class:"menu-labels"},i("ic-typography",{class:"menu-item-label"},this.label),this.keyboardShortcut&&i("ic-typography",{variant:"caption",class:"shortcut"},this.keyboardShortcut)),this.description&&i("ic-typography",{class:"menu-item-description",variant:"caption"},this.description));return i(o,{class:{["disabled"]:this.disabled}},i("li",{role:this.variant==="toggle"?"menuitemcheckbox":"menuitem","aria-disabled":`${this.disabled}`,"aria-checked":this.variant==="toggle"&&this.toggleChecked===true?true:this.variant==="toggle"&&this.toggleChecked===false?false:undefined},i("ic-button",{disableTooltip:true,fullWidth:true,variant:"tertiary",onClick:this.handleClick,href:t(this.href),hreflang:t(this.hreflang),target:t(this.target),rel:t(this.rel),referrerpolicy:this.referrerpolicy!==undefined?this.referrerpolicy:null,"aria-disabled":`${this.disabled}`,"aria-label":this.getMenuItemAriaLabel(),"aria-controls":this.submenuTriggerFor!==undefined?`ic-popover-submenu-${this.submenuTriggerFor}`:false,"aria-haspopup":this.submenuTriggerFor!==undefined||this.el.classList.contains("ic-popover-submenu-back-button")?"menu":false,"aria-owns":this.submenuTriggerFor!==undefined?`ic-popover-submenu-${this.submenuTriggerFor}`:false},i("div",{class:"focus-border"},a(this.el,"icon")&&i("span",{class:"icon"},i("slot",{name:"icon"})),i(e,null),this.variant==="toggle"&&i("span",{class:{["check-icon"]:true,["hide"]:!this.toggleChecked},"aria-hidden":"true",innerHTML:c}),this.submenuTriggerFor!==undefined&&i("span",{class:{["submenu-icon"]:true},"aria-hidden":"true",innerHTML:l})))))}static get delegatesFocus(){return true}get el(){return s(this)}};d.style=u;export{d as ic_menu_item};
2
- //# sourceMappingURL=p-e0f24ccd.entry.js.map
1
+ import{r as t,c as e,h as i,H as o,g as s}from"./p-589f6dd3.js";import{a as n,i as a,H as r}from"./p-471820e6.js";import{C as c}from"./p-8c7f4343.js";import{C as l}from"./p-06321d19.js";import"./p-6f57b13c.js";const u='/*! 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}li{list-style:none;padding:0}:host::part(button){color:var(--ic-color-primary-text);padding:calc(var(--ic-space-xxxs) / 2);display:flex;align-items:flex-start;gap:var(--ic-space-xs);border-radius:0;min-height:2.5rem;height:auto}.focus-border{display:flex;align-items:flex-start;gap:var(--ic-space-xs);border-radius:var(--ic-border-radius);margin:calc(var(--ic-space-xxxs) / 2);padding:var(--ic-space-xxs);border:var(--ic-space-xxxs) dashed transparent;--icon-height:auto}:host(.disabled)::part(button){color:var(--ic-architectural-200) !important;pointer-events:none}:host(.disabled) .menu-item-label,:host(.disabled) .shortcut,:host(.disabled) .menu-item-description{color:var(--ic-architectural-200) !important}:host([variant="destructive"])::part(button){color:var(--ic-action-destructive)}:host::part(button):hover{background-color:var(--ic-action-dark-bg-hover)}:host::part(button):focus-visible,:host::part(button):focus{color:var(--ic-color-white-text);background-color:var(--ic-focus-blue);box-shadow:none}:host(.disabled)::part(button):focus-visible,:host(.disabled)::part(button):focus{color:var(--ic-theme-lighten-40) !important}:host([variant="destructive"])::part(button):focus-visible,:host([variant="destructive"])::part(button):focus{background-color:var(--ic-action-destructive)}ic-button:focus-within .menu-item-label,ic-button:focus-within .shortcut,ic-button:focus-within .menu-item-description{color:var(--ic-color-white-text)}:host(.disabled) ic-button:focus-within .focus-border{border-color:var(--ic-architectural-white)}:host(.disabled) ic-button:focus-within .menu-item-label,:host(.disabled) ic-button:focus-within .shortcut,:host(.disabled) ic-button:focus-within .menu-item-description{color:var(--ic-theme-lighten-40) !important}:host::part(button):active{background-color:var(--ic-action-dark-bg-active);color:var(--ic-color-primary-text) !important}:host([variant="destructive"])::part(button):active{background-color:var(--ic-action-dark-bg-active);color:var(--ic-action-destructive) !important}.menu-item-info{display:flex;flex-direction:column;flex:1;align-items:baseline;white-space:pre-line;text-align:left}.menu-labels{display:flex;align-items:baseline;gap:var(--ic-space-xs)}.menu-item-description{color:var(--ic-color-secondary-text)}.shortcut{color:var(--ic-color-tertiary-text);display:flex;flex:min-content}:host([variant="destructive"]) .menu-item-label{text-transform:uppercase;font-weight:600;letter-spacing:0.025em}ic-button:active .menu-item-label{color:var(--ic-color-primary-text)}ic-button:active .menu-item-description{color:var(--ic-color-secondary-text)}ic-button:active .shortcut{color:var(--ic-color-tertiary-text)}:host([variant="destructive"]) ic-button:active .menu-item-label{color:var(--ic-action-destructive) !important}.icon,.check-icon,.submenu-icon,.icon ::slotted(svg),.check-icon svg,.submenu-icon svg{width:var(--ic-space-lg);height:var(--ic-space-lg)}.check-icon.hide{visibility:hidden}@media (forced-colors: active){:host::part(button){border:Canvas}:host::part(button):focus-visible{outline:var(--ic-space-xxxs) solid transparent}.focus-border{border-color:Canvas}:host(.disabled) ic-button:focus-within .focus-border{border-color:GrayText}:host(.disabled) .menu-item-info,:host(.disabled) .menu-item-label,:host(.disabled) .shortcut,:host(.disabled) .menu-item-description,:host(.disabled) ic-button:focus-within .menu-item-info,:host(.disabled) ic-button:focus-within .menu-item-label,:host(.disabled) ic-button:focus-within .shortcut,:host(.disabled) ic-button:focus-within .menu-item-description{color:GrayText !important}:host(.disabled)::part(button):focus-visible,:host(.disabled)::part(button):focus{outline-color:GrayText !important}}';const d=class{constructor(i){t(this,i);this.childBlur=e(this,"childBlur",7);this.triggerPopoverMenuInstance=e(this,"triggerPopoverMenuInstance",7);this.handleMenuItemClick=e(this,"handleMenuItemClick",7);this.handleClick=t=>{t.preventDefault();if(this.submenuTriggerFor!==undefined){this.triggerPopoverMenuInstance.emit()}else if(this.variant==="toggle"){this.toggleChecked?this.toggleChecked=false:this.toggleChecked=true}this.handleMenuItemClick.emit({label:this.label,hasSubMenu:!!this.el.submenuTriggerFor})};this.getMenuItemAriaLabel=()=>{let t=this.label;if(this.description!==undefined){t=`${t}, ${this.description}`}if(this.keyboardShortcut!==undefined){t=`${t}, ${this.keyboardShortcut}`}if(this.variant==="destructive"){t=`${t}, destructive`}if(this.submenuTriggerFor!==undefined){t=`${t}, triggers submenu`}if(this.el.classList.contains("ic-popover-submenu-back-button")){t="Go back to parent menu"}const e=r(this.el);if(e.tagName==="IC-MENU-GROUP"&&e.label){return`${t}, ${e.label} menu group`}else{return t}};this.variant="default";this.label=undefined;this.description=undefined;this.disabled=false;this.href=undefined;this.target=undefined;this.rel=undefined;this.hreflang=undefined;this.referrerpolicy=undefined;this.keyboardShortcut=undefined;this.submenuTriggerFor=undefined;this.toggleChecked=false}handleHostClick(t){if(this.disabled){t.stopImmediatePropagation()}}componentWillLoad(){if(this.submenuTriggerFor!==undefined&&this.variant!=="default"){this.variant="default"}}componentDidLoad(){n([{prop:this.label,propName:"label"}],"Menu Item")}render(){const t=t=>t!==undefined?t:null;const e=()=>i("div",{class:"menu-item-info"},i("div",{class:"menu-labels"},i("ic-typography",{class:"menu-item-label"},this.label),this.keyboardShortcut&&i("ic-typography",{variant:"caption",class:"shortcut"},this.keyboardShortcut)),this.description&&i("ic-typography",{class:"menu-item-description",variant:"caption"},this.description));return i(o,{class:{["disabled"]:this.disabled}},i("li",{role:this.variant==="toggle"?"menuitemcheckbox":"menuitem","aria-disabled":`${this.disabled}`,"aria-checked":this.variant==="toggle"&&this.toggleChecked===true?true:this.variant==="toggle"&&this.toggleChecked===false?false:undefined},i("ic-button",{disableTooltip:true,fullWidth:true,variant:"tertiary",onClick:this.handleClick,href:t(this.href),hreflang:t(this.hreflang),target:t(this.target),rel:t(this.rel),referrerpolicy:this.referrerpolicy!==undefined?this.referrerpolicy:null,"aria-disabled":`${this.disabled}`,"aria-label":this.getMenuItemAriaLabel(),"aria-controls":this.submenuTriggerFor!==undefined?`ic-popover-submenu-${this.submenuTriggerFor}`:false,"aria-haspopup":this.submenuTriggerFor!==undefined||this.el.classList.contains("ic-popover-submenu-back-button")?"menu":false,"aria-owns":this.submenuTriggerFor!==undefined?`ic-popover-submenu-${this.submenuTriggerFor}`:false},i("div",{class:"focus-border"},a(this.el,"icon")&&i("span",{class:"icon"},i("slot",{name:"icon"})),i(e,null),this.variant==="toggle"&&i("span",{class:{["check-icon"]:true,["hide"]:!this.toggleChecked},"aria-hidden":"true",innerHTML:c}),this.submenuTriggerFor!==undefined&&i("span",{class:{["submenu-icon"]:true},"aria-hidden":"true",innerHTML:l})))))}static get delegatesFocus(){return true}get el(){return s(this)}};d.style=u;export{d as ic_menu_item};
2
+ //# sourceMappingURL=p-2fb97a1b.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["src/components/ic-menu-item/ic-menu-item.css?tag=ic-menu-item&encapsulation=shadow","src/components/ic-menu-item/ic-menu-item.tsx"],"names":["icMenuItemCss","MenuItem","this","handleClick","e","preventDefault","submenuTriggerFor","undefined","triggerPopoverMenuInstance","emit","variant","toggleChecked","handleMenuItemClick","label","hasSubMenu","el","getMenuItemAriaLabel","ariaLabel","description","keyboardShortcut","classList","contains","parentEl","getParentElement","tagName","[object Object]","disabled","stopImmediatePropagation","onComponentRequiredPropUndefined","prop","propName","isPropDefined","MenuItemInformation","h","class","Host","role","aria-disabled","aria-checked","disableTooltip","fullWidth","onClick","href","hreflang","target","rel","referrerpolicy","aria-label","aria-controls","aria-haspopup","aria-owns","isSlotUsed","name","aria-hidden","innerHTML","Check","Chevron"],"mappings":"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","sourcesContent":["@import \"../../global/normalize.css\";\n\nli {\n list-style: none;\n padding: 0;\n}\n\n:host::part(button) {\n color: var(--ic-color-primary-text);\n padding: calc(var(--ic-space-xxxs) / 2);\n display: flex;\n align-items: flex-start;\n gap: var(--ic-space-xs);\n border-radius: 0;\n min-height: 2.5rem;\n height: auto;\n}\n\n.focus-border {\n display: flex;\n align-items: flex-start;\n gap: var(--ic-space-xs);\n border-radius: var(--ic-border-radius);\n margin: calc(var(--ic-space-xxxs) / 2);\n padding: var(--ic-space-xxs);\n border: var(--ic-space-xxxs) dashed transparent;\n\n --icon-height: auto;\n}\n\n:host(.disabled)::part(button) {\n color: var(--ic-architectural-200) !important;\n pointer-events: none;\n}\n\n:host(.disabled) .menu-item-label,\n:host(.disabled) .shortcut,\n:host(.disabled) .menu-item-description {\n color: var(--ic-architectural-200) !important;\n}\n\n:host([variant=\"destructive\"])::part(button) {\n color: var(--ic-action-destructive);\n}\n\n:host::part(button):hover {\n background-color: var(--ic-action-dark-bg-hover);\n}\n\n:host::part(button):focus-visible,\n:host::part(button):focus {\n color: var(--ic-color-white-text);\n background-color: var(--ic-focus-blue);\n box-shadow: none;\n}\n\n:host(.disabled)::part(button):focus-visible,\n:host(.disabled)::part(button):focus {\n color: var(--ic-theme-lighten-40) !important;\n}\n\n:host([variant=\"destructive\"])::part(button):focus-visible,\n:host([variant=\"destructive\"])::part(button):focus {\n background-color: var(--ic-action-destructive);\n}\n\nic-button:focus-within .menu-item-label,\nic-button:focus-within .shortcut,\nic-button:focus-within .menu-item-description {\n color: var(--ic-color-white-text);\n}\n\n:host(.disabled) ic-button:focus-within .focus-border {\n border-color: var(--ic-architectural-white);\n}\n\n:host(.disabled) ic-button:focus-within .menu-item-label,\n:host(.disabled) ic-button:focus-within .shortcut,\n:host(.disabled) ic-button:focus-within .menu-item-description {\n color: var(--ic-theme-lighten-40) !important;\n}\n\n:host::part(button):active {\n background-color: var(--ic-action-dark-bg-active);\n color: var(--ic-color-primary-text) !important;\n}\n\n:host([variant=\"destructive\"])::part(button):active {\n background-color: var(--ic-action-dark-bg-active);\n color: var(--ic-action-destructive) !important;\n}\n\n.menu-item-info {\n display: flex;\n flex-direction: column;\n flex: 1;\n align-items: baseline;\n white-space: pre-line;\n text-align: left;\n}\n\n.menu-labels {\n display: flex;\n align-items: baseline;\n gap: var(--ic-space-xs);\n}\n\n.menu-item-description {\n color: var(--ic-color-secondary-text);\n}\n\n.shortcut {\n color: var(--ic-color-tertiary-text);\n display: flex;\n flex: min-content;\n}\n\n:host([variant=\"destructive\"]) .menu-item-label {\n text-transform: uppercase;\n font-weight: 600;\n letter-spacing: 0.025em;\n}\n\nic-button:active .menu-item-label {\n color: var(--ic-color-primary-text);\n}\n\nic-button:active .menu-item-description {\n color: var(--ic-color-secondary-text);\n}\n\nic-button:active .shortcut {\n color: var(--ic-color-tertiary-text);\n}\n\n:host([variant=\"destructive\"]) ic-button:active .menu-item-label {\n color: var(--ic-action-destructive) !important;\n}\n\n.icon,\n.check-icon,\n.submenu-icon,\n.icon ::slotted(svg),\n.check-icon svg,\n.submenu-icon svg {\n width: var(--ic-space-lg);\n height: var(--ic-space-lg);\n}\n\n.check-icon.hide {\n visibility: hidden;\n}\n\n/** High Contrast **/\n@media (forced-colors: active) {\n :host::part(button) {\n border: Canvas;\n }\n\n :host::part(button):focus-visible {\n outline: var(--ic-space-xxxs) solid transparent;\n }\n\n .focus-border {\n border-color: Canvas;\n }\n\n :host(.disabled) ic-button:focus-within .focus-border {\n border-color: GrayText;\n }\n\n :host(.disabled) .menu-item-info,\n :host(.disabled) .menu-item-label,\n :host(.disabled) .shortcut,\n :host(.disabled) .menu-item-description,\n :host(.disabled) ic-button:focus-within .menu-item-info,\n :host(.disabled) ic-button:focus-within .menu-item-label,\n :host(.disabled) ic-button:focus-within .shortcut,\n :host(.disabled) ic-button:focus-within .menu-item-description {\n color: GrayText !important;\n }\n\n :host(.disabled)::part(button):focus-visible,\n :host(.disabled)::part(button):focus {\n outline-color: GrayText !important;\n }\n}\n","import {\n Component,\n Element,\n Host,\n Prop,\n h,\n State,\n Event,\n EventEmitter,\n Listen,\n} from \"@stencil/core\";\nimport {\n getParentElement,\n isSlotUsed,\n onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\nimport { IcMenuItemVariants } from \"./ic-menu-item.types\";\nimport Check from \"../../assets/check-icon.svg\";\nimport Chevron from \"../../assets/chevron-icon.svg\";\n\n/**\n * @slot icon - Content will be placed to the left of the menu item label.\n */\n\n@Component({\n tag: \"ic-menu-item\",\n styleUrl: \"ic-menu-item.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class MenuItem {\n @Element() el: HTMLIcMenuItemElement;\n\n /**\n * The variant of the menu item.\n */\n @Prop({ mutable: true, reflect: true }) variant: IcMenuItemVariants =\n \"default\";\n /**\n * The label to display in the menu item.\n */\n @Prop() label!: string;\n /**\n * The description displayed in the menu item, below the label.\n */\n @Prop() description?: string;\n /**\n * If `true`, the menu item will be in disabled state.\n */\n @Prop() disabled?: boolean = false;\n /**\n * The URL that the link points to. This will render the menu item as an \"a\" tag.\n */\n @Prop() href?: string;\n /**\n * The place to display the linked URL, as the name for a browsing context (a tab, window, or iframe).\n */\n @Prop() target?: string;\n /**\n * The relationship of the linked URL as space-separated link types.\n */\n @Prop() rel?: string;\n /**\n * The human language of the linked URL.\n */\n @Prop() hreflang?: string;\n /**\n * How much of the referrer to send when following the link.\n */\n @Prop() referrerpolicy?: ReferrerPolicy;\n /**\n * The label describing the keyboard shortcut for a menu item's action.\n */\n @Prop() keyboardShortcut?: string;\n /**\n * This references the popover menu instance that the menu item is a trigger for. If this prop is set, then the variant will always be default.\n */\n @Prop() submenuTriggerFor?: string;\n /**\n * @internal Emitted when item loses focus.\n */\n @Event() childBlur: EventEmitter<void>;\n /**\n * @internal Emitted when the user clicks a menu item that triggers a popover menu instance.\n */\n @Event() triggerPopoverMenuInstance: EventEmitter<void>;\n /**\n * @internal Emitted when the user clicks a menu item.\n */\n @Event() handleMenuItemClick: EventEmitter<{\n label: string;\n hasSubMenu: boolean;\n }>;\n\n @State() toggleChecked: boolean = false;\n\n @Listen(\"click\", { capture: true })\n handleHostClick(e: Event): void {\n if (this.disabled) {\n e.stopImmediatePropagation();\n }\n }\n\n private handleClick = (e: Event): void => {\n e.preventDefault();\n if (this.submenuTriggerFor !== undefined) {\n this.triggerPopoverMenuInstance.emit();\n } else if (this.variant === \"toggle\") {\n this.toggleChecked\n ? (this.toggleChecked = false)\n : (this.toggleChecked = true);\n }\n this.handleMenuItemClick.emit({\n label: this.label,\n hasSubMenu: !!this.el.submenuTriggerFor,\n });\n };\n\n componentWillLoad(): void {\n // This ensures that trigger menu items are always set to the default variant\n if (this.submenuTriggerFor !== undefined && this.variant !== \"default\") {\n this.variant = \"default\";\n }\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [{ prop: this.label, propName: \"label\" }],\n \"Menu Item\"\n );\n }\n\n private getMenuItemAriaLabel = (): string => {\n let ariaLabel = this.label;\n\n if (this.description !== undefined) {\n ariaLabel = `${ariaLabel}, ${this.description}`;\n }\n\n if (this.keyboardShortcut !== undefined) {\n ariaLabel = `${ariaLabel}, ${this.keyboardShortcut}`;\n }\n\n if (this.variant === \"destructive\") {\n ariaLabel = `${ariaLabel}, destructive`;\n }\n\n if (this.submenuTriggerFor !== undefined) {\n ariaLabel = `${ariaLabel}, triggers submenu`;\n }\n\n if (this.el.classList.contains(\"ic-popover-submenu-back-button\")) {\n ariaLabel = \"Go back to parent menu\";\n }\n const parentEl = getParentElement(this.el);\n\n if (\n parentEl.tagName === \"IC-MENU-GROUP\" &&\n (parentEl as HTMLIcMenuGroupElement).label\n ) {\n return `${ariaLabel}, ${\n (parentEl as HTMLIcMenuGroupElement).label\n } menu group`;\n } else {\n return ariaLabel;\n }\n };\n\n render() {\n // A helper function that checks if a prop has been defined\n const isPropDefined = (prop: string) => {\n return prop !== undefined ? prop : null;\n };\n\n // A sub-component to layout the menu information correctly in ic-button\n const MenuItemInformation = () => {\n return (\n <div class=\"menu-item-info\">\n <div class=\"menu-labels\">\n <ic-typography class=\"menu-item-label\">{this.label}</ic-typography>\n {this.keyboardShortcut && (\n <ic-typography variant=\"caption\" class=\"shortcut\">\n {this.keyboardShortcut}\n </ic-typography>\n )}\n </div>\n {this.description && (\n <ic-typography class=\"menu-item-description\" variant=\"caption\">\n {this.description}\n </ic-typography>\n )}\n </div>\n );\n };\n\n return (\n <Host\n class={{\n [\"disabled\"]: this.disabled,\n }}\n >\n <li\n role={this.variant === \"toggle\" ? \"menuitemcheckbox\" : \"menuitem\"}\n aria-disabled={`${this.disabled}`}\n aria-checked={\n this.variant === \"toggle\" && this.toggleChecked === true\n ? true\n : this.variant === \"toggle\" && this.toggleChecked === false\n ? false\n : undefined\n }\n >\n <ic-button\n disableTooltip\n fullWidth\n variant=\"tertiary\"\n onClick={this.handleClick}\n href={isPropDefined(this.href)}\n hreflang={isPropDefined(this.hreflang)}\n target={isPropDefined(this.target)}\n rel={isPropDefined(this.rel)}\n referrerpolicy={\n this.referrerpolicy !== undefined ? this.referrerpolicy : null\n }\n aria-disabled={`${this.disabled}`}\n aria-label={this.getMenuItemAriaLabel()}\n aria-controls={\n this.submenuTriggerFor !== undefined\n ? `ic-popover-submenu-${this.submenuTriggerFor}`\n : false\n }\n aria-haspopup={\n this.submenuTriggerFor !== undefined ||\n this.el.classList.contains(\"ic-popover-submenu-back-button\")\n ? \"menu\"\n : false\n }\n aria-owns={\n this.submenuTriggerFor !== undefined\n ? `ic-popover-submenu-${this.submenuTriggerFor}`\n : false\n }\n >\n <div class=\"focus-border\">\n {isSlotUsed(this.el, \"icon\") && (\n <span class=\"icon\">\n <slot name=\"icon\"></slot>\n </span>\n )}\n <MenuItemInformation />\n {this.variant === \"toggle\" && (\n <span\n class={{\n [\"check-icon\"]: true,\n [\"hide\"]: !this.toggleChecked,\n }}\n aria-hidden=\"true\"\n innerHTML={Check}\n />\n )}\n {this.submenuTriggerFor !== undefined && (\n <span\n class={{ [\"submenu-icon\"]: true }}\n aria-hidden=\"true\"\n innerHTML={Chevron}\n />\n )}\n </div>\n </ic-button>\n </li>\n </Host>\n );\n }\n}\n"]}
@@ -1,2 +1,2 @@
1
- import{r as t,h as i,H as a,g as s}from"./p-589f6dd3.js";import{a as r,N as e,O as l,P as o,Q as n,L as c}from"./p-3dea2867.js";import{a as p}from"./p-6f57b13c.js";const d="ic-input-label{margin-bottom:var(--ic-space-xs)}ic-input-label.with-helper{margin-bottom:var(--ic-space-xxxs)}ic-input-label.disabled{color:var(--ic-color-tertiary-text)}ic-input-label.readonly{color:var(--ic-color-tertiary-text)}ic-input-label .helpertext{margin-top:var(--ic-space-xxxs)}ic-input-label .helpertext-normal{color:var(--ic-color-secondary-text)}ic-input-label .helpertext-readonly{color:var(--ic-color-tertiary-text)}ic-input-label .readonly-label{color:var(--ic-color-secondary-text)}ic-input-label .error-label{color:var(--ic-status-error)}ic-input-label .dark{color:var(--ic-architectural-white)}";const h=class{constructor(i){t(this,i);this.for=undefined;this.required=false;this.helperText="";this.label=undefined;this.disabled=false;this.readonly=false;this.error=false;this.dark=false}componentDidLoad(){r([{prop:this.label,propName:"label"}],"Input Label")}render(){const{disabled:t,readonly:s,label:r,required:l,helperText:o,error:n,dark:c}=this;const p=l?r+" *":r;const d=s?`${p}`:i("label",{htmlFor:this.for},p);const h=e(this.for);return i(a,{class:{["disabled"]:t,["readonly"]:s,["with-helper"]:o!==""}},i("ic-typography",{variant:"label",class:{["readonly-label"]:s,["error-label"]:n&&!(s||t),["dark"]:c}},d),o!==""&&i("ic-typography",{variant:"caption",class:{["helpertext"]:true,["helpertext-normal"]:!t&&!s,["helpertext-readonly"]:s}},i("span",{id:h},o)))}};h.style=d;const u="ic-input-validation{width:var(--input-width, 20rem);margin-top:var(--ic-space-xs);display:flex}ic-input-validation.fullwidth{width:100%}ic-input-validation.error{color:var(--ic-status-error)}ic-input-validation.success{color:var(--ic-status-success)}ic-input-validation span.status-icon{padding-right:var(--ic-space-xxs)}ic-input-validation span.status-icon>svg{height:1.25rem;width:1.25rem}ic-input-validation span.icon-success>svg{fill:var(--ic-status-success)}ic-input-validation span.icon-error>svg{fill:var(--ic-status-error)}ic-input-validation span.icon-warning>svg{fill:var(--ic-status-warning-mid)}ic-input-validation .statustext{flex-grow:1}";const v={[p.Warning]:o,[p.Error]:n,[p.Success]:c};const m=class{constructor(i){t(this,i);this.message=undefined;this.for=undefined;this.status="";this.fullWidth=false;this.ariaLiveMode="polite"}componentDidLoad(){r([{prop:this.message,propName:"message"}],"Input Validation")}render(){const t=this.status!==""?v[this.status]:"";const s=l(this.for);return i(a,{class:{[this.status]:this.status!=="",["fullwidth"]:this.fullWidth}},t!==""&&i("span",{class:{["status-icon"]:true,[`icon-${this.status}`]:true},innerHTML:t}),i("ic-typography",{variant:"caption",class:"statustext"},i("span",{"aria-live":this.ariaLiveMode,id:s},this.message)),i("slot",{name:"validation-message-adornment"}))}get el(){return s(this)}};m.style=u;export{h as ic_input_label,m as ic_input_validation};
2
- //# sourceMappingURL=p-100dbcec.entry.js.map
1
+ import{r as t,h as i,H as a,g as s}from"./p-589f6dd3.js";import{a as r,N as e,O as l,P as o,Q as n,L as c}from"./p-471820e6.js";import{a as p}from"./p-6f57b13c.js";const d="ic-input-label{margin-bottom:var(--ic-space-xs)}ic-input-label.with-helper{margin-bottom:var(--ic-space-xxxs)}ic-input-label.disabled{color:var(--ic-color-tertiary-text)}ic-input-label.readonly{color:var(--ic-color-tertiary-text)}ic-input-label .helpertext{margin-top:var(--ic-space-xxxs)}ic-input-label .helpertext-normal{color:var(--ic-color-secondary-text)}ic-input-label .helpertext-readonly{color:var(--ic-color-tertiary-text)}ic-input-label .readonly-label{color:var(--ic-color-secondary-text)}ic-input-label .error-label{color:var(--ic-status-error)}ic-input-label .dark{color:var(--ic-architectural-white)}";const h=class{constructor(i){t(this,i);this.for=undefined;this.required=false;this.helperText="";this.label=undefined;this.disabled=false;this.readonly=false;this.error=false;this.dark=false}componentDidLoad(){r([{prop:this.label,propName:"label"}],"Input Label")}render(){const{disabled:t,readonly:s,label:r,required:l,helperText:o,error:n,dark:c}=this;const p=l?r+" *":r;const d=s?`${p}`:i("label",{htmlFor:this.for},p);const h=e(this.for);return i(a,{class:{["disabled"]:t,["readonly"]:s,["with-helper"]:o!==""}},i("ic-typography",{variant:"label",class:{["readonly-label"]:s,["error-label"]:n&&!(s||t),["dark"]:c}},d),o!==""&&i("ic-typography",{variant:"caption",class:{["helpertext"]:true,["helpertext-normal"]:!t&&!s,["helpertext-readonly"]:s}},i("span",{id:h},o)))}};h.style=d;const u="ic-input-validation{width:var(--input-width, 20rem);margin-top:var(--ic-space-xs);display:flex}ic-input-validation.fullwidth{width:100%}ic-input-validation.error{color:var(--ic-status-error)}ic-input-validation.success{color:var(--ic-status-success)}ic-input-validation span.status-icon{padding-right:var(--ic-space-xxs)}ic-input-validation span.status-icon>svg{height:1.25rem;width:1.25rem}ic-input-validation span.icon-success>svg{fill:var(--ic-status-success)}ic-input-validation span.icon-error>svg{fill:var(--ic-status-error)}ic-input-validation span.icon-warning>svg{fill:var(--ic-status-warning-mid)}ic-input-validation .statustext{flex-grow:1}";const v={[p.Warning]:o,[p.Error]:n,[p.Success]:c};const m=class{constructor(i){t(this,i);this.message=undefined;this.for=undefined;this.status="";this.fullWidth=false;this.ariaLiveMode="polite"}componentDidLoad(){r([{prop:this.message,propName:"message"}],"Input Validation")}render(){const t=this.status!==""?v[this.status]:"";const s=l(this.for);return i(a,{class:{[this.status]:this.status!=="",["fullwidth"]:this.fullWidth}},t!==""&&i("span",{class:{["status-icon"]:true,[`icon-${this.status}`]:true},innerHTML:t}),i("ic-typography",{variant:"caption",class:"statustext"},i("span",{"aria-live":this.ariaLiveMode,id:s},this.message)),i("slot",{name:"validation-message-adornment"}))}get el(){return s(this)}};m.style=u;export{h as ic_input_label,m as ic_input_validation};
2
+ //# sourceMappingURL=p-31b4b684.entry.js.map
@@ -1,2 +1,2 @@
1
- import{r as i,c as e,h as t,H as c,g as s}from"./p-589f6dd3.js";import{d as a,a as o,r,e as n,h as l}from"./p-3dea2867.js";import"./p-6f57b13c.js";const h='/*! 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:inline-block}input{overflow:hidden;-webkit-appearance:none;-moz-appearance:none;appearance:none}.ic-switch-container{display:flex;flex-wrap:wrap;align-items:center;gap:var(--ic-space-xxs);cursor:pointer}.ic-switch-label{margin-left:var(--ic-space-xxs);margin-bottom:var(--ic-space-sm)}.ic-switch-label-small{margin-bottom:0.625rem}.ic-switch-toggle{display:flex;align-items:center;justify-content:space-around;width:4rem;height:var(--ic-space-xl);position:relative;border-radius:100vw;background-color:var(--ic-architectural-200);border:var(--ic-space-1px) solid var(--ic-architectural-700);box-sizing:border-box;transition:var(--ic-transition-duration-fast)}.ic-switch-line-break{flex:1 0 100%}.ic-switch-checked-status{padding-left:var(--ic-space-xxs)}.ic-switch-toggle::before{content:"";width:1.333rem;height:1.333rem;border-radius:50%;position:absolute;z-index:2;top:50%;left:0.333rem;transform:translate(0, -50%);background-color:var(--ic-architectural-700);transition:var(--ic-transition-duration-slow)}.ic-switch-icon{display:inline-block;vertical-align:middle;width:0.625rem;height:0.625rem}.ic-switch-icon-circle,.ic-switch-icon-line{stroke-width:1}.ic-switch-icon-circle{stroke:var(--ic-architectural-700)}.ic-switch-icon-line{stroke:var(--ic-architectural-white)}@media (prefers-reduced-motion: reduce){.ic-switch-toggle::before{transition-duration:0ms}}.ic-switch-input:checked+.ic-switch-toggle{background-color:var(--ic-action-default);border:none}.ic-switch-input:checked+.ic-switch-toggle::before{transform:translate(var(--ic-space-xl), -50%);background-color:var(--ic-architectural-white)}.ic-switch-input:not([disabled])+.ic-switch-toggle:hover::before{box-shadow:0 0 0 0.75rem var(--ic-action-dark-bg-hover)}.ic-switch-input:not([disabled])+.ic-switch-toggle:active::before{box-shadow:0 0 0 0.75rem var(--ic-action-dark-bg-active)}.ic-switch-input:not([disabled]):checked+.ic-switch-toggle:hover::before{box-shadow:0 0 0 0.75rem var(--ic-action-default-bg-hover)}.ic-switch-input:not([disabled]):checked+.ic-switch-toggle:active::before{box-shadow:0 0 0 0.75rem var(--ic-action-default-bg-active)}.ic-switch-input:focus:not([disabled])+.ic-switch-toggle,.ic-switch-input:focus-visible:not([disabled])+.ic-switch-toggle{box-shadow:0 0 0 var(--ic-space-1px) var(--ic-architectural-white),\n 0 0 0 0.188rem var(--ic-action-default),\n 0 0 0 0.5rem var(--ic-action-default-active-alpha)}.ic-switch-disabled{cursor:default}.ic-switch-disabled .ic-switch-icon-circle{stroke:var(--ic-architectural-300)}.ic-switch-disabled .ic-switch-icon-line{stroke:var(--ic-action-default-bg-active)}.ic-switch-input:disabled+.ic-switch-toggle{background-color:var(--ic-architectural-80);border:var(--ic-space-1px) dashed var(--ic-architectural-300)}.ic-switch-input:disabled~.ic-switch-checked-status{color:var(--ic-architectural-300)}.ic-switch-input:disabled+.ic-switch-toggle::before{background-color:var(--ic-architectural-300)}.ic-switch-input:disabled:checked+.ic-switch-toggle{background-color:var(--ic-status-info-background);border:var(--ic-space-1px) dashed #98c9f5}.ic-switch-input:disabled:checked+.ic-switch-toggle::before{background-color:var(--ic-architectural-white)}.ic-switch-small{gap:var(--ic-space-xxxs)}.ic-switch-small .ic-switch-checked-status{padding-left:0.375rem}.ic-switch-small .ic-switch-toggle{width:var(--ic-space-xxl);height:var(--ic-space-lg)}.ic-switch-small .ic-switch-toggle::before{width:var(--ic-space-md);height:var(--ic-space-md);left:var(--ic-space-xxs)}.ic-switch-small .ic-switch-input:checked+.ic-switch-toggle::before{transform:translate(var(--ic-space-lg), -50%)}::slotted(*){margin-left:var(--ic-space-sm)}::slotted(svg){fill:currentcolor}@media (forced-colors: active){.ic-switch-toggle::before,.ic-switch-input:checked+.ic-switch-toggle{border:var(--ic-hc-border)}.ic-switch-input:checked+.ic-switch-toggle::before{transform:translate(calc(var(--ic-space-xl) - 0.125rem), -50%)}.ic-switch-input:disabled+.ic-switch-toggle,.ic-switch-input:disabled:checked+.ic-switch-toggle,.ic-switch-input:disabled+.ic-switch-toggle::before{border-color:GrayText}.ic-switch-input:disabled~.ic-switch-checked-status{color:GrayText}.ic-switch-disabled .ic-switch-icon-circle,.ic-switch-disabled .ic-switch-icon-line{stroke:GrayText}}';let d=0;const b=class{constructor(t){i(this,t);this.icChange=e(this,"icChange",7);this.icFocus=e(this,"icFocus",7);this.icBlur=e(this,"icBlur",7);this.inputId=`ic-switch-input-${d++}`;this.handleChange=()=>{this.checkedState=!this.checkedState;this.icChange.emit({checked:this.checkedState,value:this.value})};this.onFocus=()=>{this.icFocus.emit()};this.onBlur=()=>{this.icBlur.emit()};this.handleFormReset=()=>{this.checkedState=this.initiallyChecked};this.label=undefined;this.hideLabel=false;this.helperText="";this.checked=false;this.small=false;this.disabled=false;this.name=this.inputId;this.showState=false;this.value="on";this.checkedState=false;this.initiallyChecked=this.checked}async setFocus(){if(this.el.shadowRoot.querySelector("input")){this.el.shadowRoot.querySelector("input").focus()}}componentWillLoad(){this.checkedState=this.checked;a(this.el,this.handleFormReset)}componentDidLoad(){o([{prop:this.label,propName:"label"}],"Switch")}disconnectedCallback(){r(this.el,this.handleFormReset)}render(){const{label:i,checkedState:e,small:s,disabled:a,name:o,showState:r,value:h,hideLabel:d,helperText:b,inputId:p}=this;n(true,this.el,o,e?h:"",a);const u=l(p,b!=="",false);return t(c,null,t("label",{class:{["ic-switch-container"]:true,["ic-switch-disabled"]:a,["ic-switch-small"]:s},htmlFor:p},!d&&t("ic-input-label",{for:p,label:i,helperText:b,readonly:true,disabled:a,class:{["ic-switch-label"]:true,["ic-switch-label-small"]:s}}),!d&&t("span",{class:"ic-switch-line-break"}),t("input",{checked:e,disabled:a,"aria-label":i,"aria-checked":e?"true":"false","aria-describedby":u,role:"switch",class:"ic-switch-input",type:"checkbox",name:"toggle",id:p,onFocus:this.onFocus,onBlur:this.onBlur,onChange:this.handleChange}),t("span",{class:"ic-switch-toggle"},t("svg",{class:"ic-switch-icon","aria-hidden":"true",focusable:"false",viewBox:"0 0 10 10",xmlns:"http://www.w3.org/2000/svg"},t("line",{class:"ic-switch-icon-line",x1:"9",y1:s?"2":"1",x2:"9",y2:s?"8":"9"})),t("svg",{class:"ic-switch-icon","aria-hidden":"true",focusable:"false",viewBox:"0 0 10 10",xmlns:"http://www.w3.org/2000/svg"},t("circle",{class:"ic-switch-icon-circle",fill:"none",cx:"5",cy:"5",r:s?"3.335":"4.445"}))),t("slot",{name:"right-adornment"}),r&&t("ic-typography",{"aria-hidden":"true",variant:"label",class:"ic-switch-checked-status"},e?"On":"Off")))}static get delegatesFocus(){return true}get el(){return s(this)}};b.style=h;export{b as ic_switch};
2
- //# sourceMappingURL=p-e839e5dc.entry.js.map
1
+ import{r as i,c as e,h as t,H as c,g as s}from"./p-589f6dd3.js";import{d as a,a as o,r,e as n,h as l}from"./p-471820e6.js";import"./p-6f57b13c.js";const h='/*! 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:inline-block}input{overflow:hidden;-webkit-appearance:none;-moz-appearance:none;appearance:none}.ic-switch-container{display:flex;flex-wrap:wrap;align-items:center;gap:var(--ic-space-xxs);cursor:pointer}.ic-switch-label{margin-left:var(--ic-space-xxs);margin-bottom:var(--ic-space-sm)}.ic-switch-label-small{margin-bottom:0.625rem}.ic-switch-toggle{display:flex;align-items:center;justify-content:space-around;width:4rem;height:var(--ic-space-xl);position:relative;border-radius:100vw;background-color:var(--ic-architectural-200);border:var(--ic-space-1px) solid var(--ic-architectural-700);box-sizing:border-box;transition:var(--ic-transition-duration-fast)}.ic-switch-line-break{flex:1 0 100%}.ic-switch-checked-status{padding-left:var(--ic-space-xxs)}.ic-switch-toggle::before{content:"";width:1.333rem;height:1.333rem;border-radius:50%;position:absolute;z-index:2;top:50%;left:0.333rem;transform:translate(0, -50%);background-color:var(--ic-architectural-700);transition:var(--ic-transition-duration-slow)}.ic-switch-icon{display:inline-block;vertical-align:middle;width:0.625rem;height:0.625rem}.ic-switch-icon-circle,.ic-switch-icon-line{stroke-width:1}.ic-switch-icon-circle{stroke:var(--ic-architectural-700)}.ic-switch-icon-line{stroke:var(--ic-architectural-white)}@media (prefers-reduced-motion: reduce){.ic-switch-toggle::before{transition-duration:0ms}}.ic-switch-input:checked+.ic-switch-toggle{background-color:var(--ic-action-default);border:none}.ic-switch-input:checked+.ic-switch-toggle::before{transform:translate(var(--ic-space-xl), -50%);background-color:var(--ic-architectural-white)}.ic-switch-input:not([disabled])+.ic-switch-toggle:hover::before{box-shadow:0 0 0 0.75rem var(--ic-action-dark-bg-hover)}.ic-switch-input:not([disabled])+.ic-switch-toggle:active::before{box-shadow:0 0 0 0.75rem var(--ic-action-dark-bg-active)}.ic-switch-input:not([disabled]):checked+.ic-switch-toggle:hover::before{box-shadow:0 0 0 0.75rem var(--ic-action-default-bg-hover)}.ic-switch-input:not([disabled]):checked+.ic-switch-toggle:active::before{box-shadow:0 0 0 0.75rem var(--ic-action-default-bg-active)}.ic-switch-input:focus:not([disabled])+.ic-switch-toggle,.ic-switch-input:focus-visible:not([disabled])+.ic-switch-toggle{box-shadow:0 0 0 var(--ic-space-1px) var(--ic-architectural-white),\n 0 0 0 0.188rem var(--ic-action-default),\n 0 0 0 0.5rem var(--ic-action-default-active-alpha)}.ic-switch-disabled{cursor:default}.ic-switch-disabled .ic-switch-icon-circle{stroke:var(--ic-architectural-300)}.ic-switch-disabled .ic-switch-icon-line{stroke:var(--ic-action-default-bg-active)}.ic-switch-input:disabled+.ic-switch-toggle{background-color:var(--ic-architectural-80);border:var(--ic-space-1px) dashed var(--ic-architectural-300)}.ic-switch-input:disabled~.ic-switch-checked-status{color:var(--ic-architectural-300)}.ic-switch-input:disabled+.ic-switch-toggle::before{background-color:var(--ic-architectural-300)}.ic-switch-input:disabled:checked+.ic-switch-toggle{background-color:var(--ic-status-info-background);border:var(--ic-space-1px) dashed #98c9f5}.ic-switch-input:disabled:checked+.ic-switch-toggle::before{background-color:var(--ic-architectural-white)}.ic-switch-small{gap:var(--ic-space-xxxs)}.ic-switch-small .ic-switch-checked-status{padding-left:0.375rem}.ic-switch-small .ic-switch-toggle{width:var(--ic-space-xxl);height:var(--ic-space-lg)}.ic-switch-small .ic-switch-toggle::before{width:var(--ic-space-md);height:var(--ic-space-md);left:var(--ic-space-xxs)}.ic-switch-small .ic-switch-input:checked+.ic-switch-toggle::before{transform:translate(var(--ic-space-lg), -50%)}::slotted(*){margin-left:var(--ic-space-sm)}::slotted(svg){fill:currentcolor}@media (forced-colors: active){.ic-switch-toggle::before,.ic-switch-input:checked+.ic-switch-toggle{border:var(--ic-hc-border)}.ic-switch-input:checked+.ic-switch-toggle::before{transform:translate(calc(var(--ic-space-xl) - 0.125rem), -50%)}.ic-switch-input:disabled+.ic-switch-toggle,.ic-switch-input:disabled:checked+.ic-switch-toggle,.ic-switch-input:disabled+.ic-switch-toggle::before{border-color:GrayText}.ic-switch-input:disabled~.ic-switch-checked-status{color:GrayText}.ic-switch-disabled .ic-switch-icon-circle,.ic-switch-disabled .ic-switch-icon-line{stroke:GrayText}}';let d=0;const b=class{constructor(t){i(this,t);this.icChange=e(this,"icChange",7);this.icFocus=e(this,"icFocus",7);this.icBlur=e(this,"icBlur",7);this.inputId=`ic-switch-input-${d++}`;this.handleChange=()=>{this.checkedState=!this.checkedState;this.icChange.emit({checked:this.checkedState,value:this.value})};this.onFocus=()=>{this.icFocus.emit()};this.onBlur=()=>{this.icBlur.emit()};this.handleFormReset=()=>{this.checkedState=this.initiallyChecked};this.label=undefined;this.hideLabel=false;this.helperText="";this.checked=false;this.small=false;this.disabled=false;this.name=this.inputId;this.showState=false;this.value="on";this.checkedState=false;this.initiallyChecked=this.checked}async setFocus(){if(this.el.shadowRoot.querySelector("input")){this.el.shadowRoot.querySelector("input").focus()}}componentWillLoad(){this.checkedState=this.checked;a(this.el,this.handleFormReset)}componentDidLoad(){o([{prop:this.label,propName:"label"}],"Switch")}disconnectedCallback(){r(this.el,this.handleFormReset)}render(){const{label:i,checkedState:e,small:s,disabled:a,name:o,showState:r,value:h,hideLabel:d,helperText:b,inputId:p}=this;n(true,this.el,o,e?h:"",a);const u=l(p,b!=="",false);return t(c,null,t("label",{class:{["ic-switch-container"]:true,["ic-switch-disabled"]:a,["ic-switch-small"]:s},htmlFor:p},!d&&t("ic-input-label",{for:p,label:i,helperText:b,readonly:true,disabled:a,class:{["ic-switch-label"]:true,["ic-switch-label-small"]:s}}),!d&&t("span",{class:"ic-switch-line-break"}),t("input",{checked:e,disabled:a,"aria-label":i,"aria-checked":e?"true":"false","aria-describedby":u,role:"switch",class:"ic-switch-input",type:"checkbox",name:"toggle",id:p,onFocus:this.onFocus,onBlur:this.onBlur,onChange:this.handleChange}),t("span",{class:"ic-switch-toggle"},t("svg",{class:"ic-switch-icon","aria-hidden":"true",focusable:"false",viewBox:"0 0 10 10",xmlns:"http://www.w3.org/2000/svg"},t("line",{class:"ic-switch-icon-line",x1:"9",y1:s?"2":"1",x2:"9",y2:s?"8":"9"})),t("svg",{class:"ic-switch-icon","aria-hidden":"true",focusable:"false",viewBox:"0 0 10 10",xmlns:"http://www.w3.org/2000/svg"},t("circle",{class:"ic-switch-icon-circle",fill:"none",cx:"5",cy:"5",r:s?"3.335":"4.445"}))),t("slot",{name:"right-adornment"}),r&&t("ic-typography",{"aria-hidden":"true",variant:"label",class:"ic-switch-checked-status"},e?"On":"Off")))}static get delegatesFocus(){return true}get el(){return s(this)}};b.style=h;export{b as ic_switch};
2
+ //# sourceMappingURL=p-32cc8827.entry.js.map
@@ -1,2 +1,2 @@
1
- import{r as e,c as i,h as t,H as a,g as o}from"./p-589f6dd3.js";import{d as c,a as r,r as n,e as s,f as d,i as l}from"./p-3dea2867.js";import"./p-6f57b13c.js";const h='/*! 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(.disabled){color:var(--ic-architectural-200);pointer-events:none}.container{display:flex;width:-moz-fit-content;width:fit-content;padding:var(--ic-space-xxs) 0 var(--ic-space-xxs) var(--ic-space-xxs);margin-bottom:var(--ic-space-xxs);align-items:center}:host(.small) .container{margin-bottom:var(--ic-space-xxxs)}.checkbox{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:block;position:relative;top:0;left:0;height:var(--ic-space-lg);width:var(--ic-space-lg);background-color:transparent;border:var(--ic-space-1px) solid var(--ic-architectural-300);border-radius:var(--ic-border-radius);outline:none;cursor:pointer;transition:var(--ic-easing-transition-fast);flex-shrink:0}.checkbox:checked{background-color:var(--ic-action-default);border:var(--ic-space-1px) solid var(--ic-action-default);transition:var(--ic-easing-transition-slow)}.checkbox:checked:disabled{background-color:var(--ic-architectural-200)}.checkbox:indeterminate,.checkbox.indeterminate:checked{background-color:transparent;border:0.125rem solid var(--ic-action-default)}.checkbox:checked:hover{background-color:var(--ic-action-default-hover)}.checkbox:indeterminate:hover,.checkbox.indeterminate:checked:hover{background-color:var(--ic-action-default-bg-hover);border:0.125rem solid var(--ic-action-default-hover)}.checkbox:checked:active{background-color:var(--ic-action-default-active)}.checkbox:indeterminate:active,.checkbox.indeterminate:checked:active{background-color:var(--ic-action-default-bg-active);border:0.125rem solid var(--ic-action-default-active)}.checkbox:hover{background-color:var(--ic-action-default-bg-hover);box-shadow:0 0 0 0.25rem var(--ic-action-default-bg-hover);border:var(--ic-space-1px) solid var(--ic-action-default-hover)}.checkbox:active{background-color:var(--ic-action-default-bg-active);box-shadow:0 0 0 0.25rem var(--ic-action-default-bg-active);border:var(--ic-space-1px) solid var(--ic-action-default-active)}.checkbox:focus{box-shadow:var(--ic-border-focus)}.checkbox:disabled{border:var(--ic-space-1px) dashed var(--ic-architectural-200)}.checkbox-label{padding-left:var(--ic-space-sm)}.checkbox-label:hover{cursor:pointer}.checkmark{position:relative;right:calc(-1 * var(--ic-space-lg));margin-left:calc(-1 * var(--ic-space-lg));fill:white;z-index:1;background-color:transparent;pointer-events:none;flex-shrink:0}.indeterminate-symbol{position:relative;width:0.875rem;height:var(--ic-space-xxxs);right:-1.188rem;margin-left:-0.875rem;z-index:1;background-color:var(--ic-action-default);pointer-events:none;flex-shrink:0}.container:hover .indeterminate-symbol{background-color:var(--ic-action-default-hover)}.container:active .indeterminate-symbol{background-color:var(--ic-action-default-active)}.additional-field-wrapper{margin-left:calc(var(--ic-space-md) + var(--ic-space-lg));margin-top:calc(var(--ic-space-sm) / 2)}.branch-corner{color:var(--ic-action-default);height:var(--ic-space-md);width:var(--ic-space-xl);border-radius:0 0 0 0.188rem;border-bottom:0.125rem solid var(--ic-action-default);border-left:0.125rem solid var(--ic-action-default)}.dynamic-container{display:flex;position:relative;margin:var(--ic-space-xxxs) 0 var(--ic-space-xxs) var(--ic-space-md);gap:var(--ic-space-xs)}.dynamic-text{color:var(--ic-action-default);margin-top:calc(var(--ic-space-sm) / 2);margin-bottom:var(--ic-space-xs);border-radius:2%}@media (max-width: 576px){::slotted(ic-text-field){--input-width:100%}}@media (forced-colors: active){.checkbox{-webkit-appearance:revert;-moz-appearance:revert;appearance:revert;transition:none}.checkbox:checked{transition:none}.checkbox:focus-visible{outline:0.125rem solid highlight}.checkbox:disabled:not(:checked){-webkit-appearance:none;-moz-appearance:none;appearance:none;border-color:GrayText}.checkmark{fill:none}.indeterminate-symbol{display:none}}';const b=class{constructor(t){e(this,t);this.checkboxChecked=i(this,"checkboxChecked",7);this.icCheck=i(this,"icCheck",7);this.handleClick=()=>{this.checked=!this.checked;this.icCheck.emit();this.checkboxChecked.emit()};this.handleFormReset=()=>{this.checked=this.initiallyChecked};this.checked=false;this.disabled=false;this.label=undefined;this.value=undefined;this.name=undefined;this.groupLabel=undefined;this.dynamicText="This selection requires additional answers";this.additionalFieldDisplay="static";this.indeterminate=false;this.small=false;this.initiallyChecked=this.checked}async setFocus(){const e=this.host.shadowRoot.querySelector(".checkbox");if(e){e.focus()}}componentDidRender(){if(this.additionalFieldDisplay==="static"){const e=this.host.querySelector("ic-text-field");if(!this.checked){e&&e.setAttribute("disabled","")}else{e&&e.removeAttribute("disabled")}}else{if(!this.checked){this.additionalFieldContainer.style.display="none"}else{this.additionalFieldContainer.style.display="flex"}}}componentWillLoad(){var e;c(this.host,this.handleFormReset);(e=this.host.querySelector("ic-text-field"))===null||e===void 0?void 0:e.addEventListener("icChange",(e=>e.stopImmediatePropagation()))}componentDidLoad(){r([{prop:this.label,propName:"label"},{prop:this.value,propName:"value"}],"Checkbox")}disconnectedCallback(){var e;n(this.host,this.handleFormReset);(e=this.host.querySelector("ic-text-field"))===null||e===void 0?void 0:e.removeEventListener("icChange",(e=>e.stopImmediatePropagation()))}render(){let e=`ic-checkbox-${this.label!==undefined?this.label:this.value}-${this.groupLabel}`;e=e.replace(/ /g,"-");this.checked?s(true,this.host,this.name,this.checked&&this.value,this.disabled):d(this.host);return t(a,{class:{["disabled"]:this.disabled,["small"]:this.small}},t("div",{class:"container"},this.checked&&!this.indeterminate&&t("svg",{class:"checkmark",width:"1.5rem",height:"1.5rem",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg","fill-rule":"evenodd","clip-rule":"evenodd"},t("title",null,"checkmark icon"),t("path",{d:"M21 6.285l-11.16 12.733-6.84-6.018 1.319-1.49 5.341 4.686 9.865-11.196 1.475 1.285z"})),this.checked&&this.indeterminate&&t("div",{class:"indeterminate-symbol"}),t("input",{role:"checkbox",class:{["checkbox"]:true,["checked"]:this.checked,["indeterminate"]:this.indeterminate},type:"checkbox",name:this.name,id:e,value:this.value,disabled:this.disabled?true:null,checked:this.checked,indeterminate:this.indeterminate,onClick:this.handleClick}),t("ic-typography",{class:"checkbox-label",variant:"body"},t("label",{htmlFor:e},this.label))),l(this.host,"additional-field")&&t("div",{class:"dynamic-container",ref:e=>this.additionalFieldContainer=e},this.additionalFieldDisplay==="dynamic"&&t("div",{class:"branch-corner"}),t("div",null,this.additionalFieldDisplay==="dynamic"&&t("ic-typography",{variant:"caption"},t("p",{class:"dynamic-text","aria-live":"polite"},this.dynamicText)),t("div",{class:{"additional-field-wrapper":this.additionalFieldDisplay==="static"}},t("slot",{name:"additional-field"})))))}static get delegatesFocus(){return true}get host(){return o(this)}};b.style=h;export{b as ic_checkbox};
2
- //# sourceMappingURL=p-3845b769.entry.js.map
1
+ import{r as e,c as i,h as t,H as a,g as o}from"./p-589f6dd3.js";import{d as c,a as r,r as n,e as s,f as d,i as l}from"./p-471820e6.js";import"./p-6f57b13c.js";const h='/*! 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(.disabled){color:var(--ic-architectural-200);pointer-events:none}.container{display:flex;width:-moz-fit-content;width:fit-content;padding:var(--ic-space-xxs) 0 var(--ic-space-xxs) var(--ic-space-xxs);margin-bottom:var(--ic-space-xxs);align-items:center}:host(.small) .container{margin-bottom:var(--ic-space-xxxs)}.checkbox{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:block;position:relative;top:0;left:0;height:var(--ic-space-lg);width:var(--ic-space-lg);background-color:transparent;border:var(--ic-space-1px) solid var(--ic-architectural-300);border-radius:var(--ic-border-radius);outline:none;cursor:pointer;transition:var(--ic-easing-transition-fast);flex-shrink:0}.checkbox:checked{background-color:var(--ic-action-default);border:var(--ic-space-1px) solid var(--ic-action-default);transition:var(--ic-easing-transition-slow)}.checkbox:checked:disabled{background-color:var(--ic-architectural-200)}.checkbox:indeterminate,.checkbox.indeterminate:checked{background-color:transparent;border:0.125rem solid var(--ic-action-default)}.checkbox:checked:hover{background-color:var(--ic-action-default-hover)}.checkbox:indeterminate:hover,.checkbox.indeterminate:checked:hover{background-color:var(--ic-action-default-bg-hover);border:0.125rem solid var(--ic-action-default-hover)}.checkbox:checked:active{background-color:var(--ic-action-default-active)}.checkbox:indeterminate:active,.checkbox.indeterminate:checked:active{background-color:var(--ic-action-default-bg-active);border:0.125rem solid var(--ic-action-default-active)}.checkbox:hover{background-color:var(--ic-action-default-bg-hover);box-shadow:0 0 0 0.25rem var(--ic-action-default-bg-hover);border:var(--ic-space-1px) solid var(--ic-action-default-hover)}.checkbox:active{background-color:var(--ic-action-default-bg-active);box-shadow:0 0 0 0.25rem var(--ic-action-default-bg-active);border:var(--ic-space-1px) solid var(--ic-action-default-active)}.checkbox:focus{box-shadow:var(--ic-border-focus)}.checkbox:disabled{border:var(--ic-space-1px) dashed var(--ic-architectural-200)}.checkbox-label{padding-left:var(--ic-space-sm)}.checkbox-label:hover{cursor:pointer}.checkmark{position:relative;right:calc(-1 * var(--ic-space-lg));margin-left:calc(-1 * var(--ic-space-lg));fill:white;z-index:1;background-color:transparent;pointer-events:none;flex-shrink:0}.indeterminate-symbol{position:relative;width:0.875rem;height:var(--ic-space-xxxs);right:-1.188rem;margin-left:-0.875rem;z-index:1;background-color:var(--ic-action-default);pointer-events:none;flex-shrink:0}.container:hover .indeterminate-symbol{background-color:var(--ic-action-default-hover)}.container:active .indeterminate-symbol{background-color:var(--ic-action-default-active)}.additional-field-wrapper{margin-left:calc(var(--ic-space-md) + var(--ic-space-lg));margin-top:calc(var(--ic-space-sm) / 2)}.branch-corner{color:var(--ic-action-default);height:var(--ic-space-md);width:var(--ic-space-xl);border-radius:0 0 0 0.188rem;border-bottom:0.125rem solid var(--ic-action-default);border-left:0.125rem solid var(--ic-action-default)}.dynamic-container{display:flex;position:relative;margin:var(--ic-space-xxxs) 0 var(--ic-space-xxs) var(--ic-space-md);gap:var(--ic-space-xs)}.dynamic-text{color:var(--ic-action-default);margin-top:calc(var(--ic-space-sm) / 2);margin-bottom:var(--ic-space-xs);border-radius:2%}@media (max-width: 576px){::slotted(ic-text-field){--input-width:100%}}@media (forced-colors: active){.checkbox{-webkit-appearance:revert;-moz-appearance:revert;appearance:revert;transition:none}.checkbox:checked{transition:none}.checkbox:focus-visible{outline:0.125rem solid highlight}.checkbox:disabled:not(:checked){-webkit-appearance:none;-moz-appearance:none;appearance:none;border-color:GrayText}.checkmark{fill:none}.indeterminate-symbol{display:none}}';const b=class{constructor(t){e(this,t);this.checkboxChecked=i(this,"checkboxChecked",7);this.icCheck=i(this,"icCheck",7);this.handleClick=()=>{this.checked=!this.checked;this.icCheck.emit();this.checkboxChecked.emit()};this.handleFormReset=()=>{this.checked=this.initiallyChecked};this.IC_TEXT_FIELD="ic-text-field";this.checked=false;this.disabled=false;this.label=undefined;this.value=undefined;this.name=undefined;this.groupLabel=undefined;this.dynamicText="This selection requires additional answers";this.additionalFieldDisplay="static";this.indeterminate=false;this.small=false;this.initiallyChecked=this.checked}async setFocus(){const e=this.host.shadowRoot.querySelector(".checkbox");if(e){e.focus()}}componentDidRender(){if(this.additionalFieldDisplay==="static"){const e=this.host.querySelector(this.IC_TEXT_FIELD);if(!this.checked){e&&e.setAttribute("disabled","")}else{e&&e.removeAttribute("disabled")}}else{if(!this.checked){this.additionalFieldContainer.style.display="none"}else{this.additionalFieldContainer.style.display="flex"}}}componentWillLoad(){var e;c(this.host,this.handleFormReset);(e=this.host.querySelector(this.IC_TEXT_FIELD))===null||e===void 0?void 0:e.addEventListener("icChange",(e=>e.stopImmediatePropagation()))}componentDidLoad(){r([{prop:this.label,propName:"label"},{prop:this.value,propName:"value"}],"Checkbox")}disconnectedCallback(){var e;n(this.host,this.handleFormReset);(e=this.host.querySelector(this.IC_TEXT_FIELD))===null||e===void 0?void 0:e.removeEventListener("icChange",(e=>e.stopImmediatePropagation()))}render(){let e=`ic-checkbox-${this.label!==undefined?this.label:this.value}-${this.groupLabel}`;e=e.replace(/ /g,"-");this.checked?s(true,this.host,this.name,this.checked&&this.value,this.disabled):d(this.host);return t(a,{class:{["disabled"]:this.disabled,["small"]:this.small}},t("div",{class:"container"},this.checked&&!this.indeterminate&&t("svg",{class:"checkmark",width:"1.5rem",height:"1.5rem",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg","fill-rule":"evenodd","clip-rule":"evenodd"},t("title",null,"checkmark icon"),t("path",{d:"M21 6.285l-11.16 12.733-6.84-6.018 1.319-1.49 5.341 4.686 9.865-11.196 1.475 1.285z"})),this.checked&&this.indeterminate&&t("div",{class:"indeterminate-symbol"}),t("input",{role:"checkbox",class:{["checkbox"]:true,["checked"]:this.checked,["indeterminate"]:this.indeterminate},type:"checkbox",name:this.name,id:e,value:this.value,disabled:this.disabled?true:null,checked:this.checked,indeterminate:this.indeterminate,onClick:this.handleClick}),t("ic-typography",{class:"checkbox-label",variant:"body"},t("label",{htmlFor:e},this.label))),l(this.host,"additional-field")&&t("div",{class:"dynamic-container",ref:e=>this.additionalFieldContainer=e},this.additionalFieldDisplay==="dynamic"&&t("div",{class:"branch-corner"}),t("div",null,this.additionalFieldDisplay==="dynamic"&&t("ic-typography",{variant:"caption"},t("p",{class:"dynamic-text","aria-live":"polite"},this.dynamicText)),t("div",{class:{"additional-field-wrapper":this.additionalFieldDisplay==="static"}},t("slot",{name:"additional-field"})))))}static get delegatesFocus(){return true}get host(){return o(this)}};b.style=h;export{b as ic_checkbox};
2
+ //# sourceMappingURL=p-3498db0b.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["src/components/ic-checkbox/ic-checkbox.css?tag=ic-checkbox&encapsulation=shadow","src/components/ic-checkbox/ic-checkbox.tsx"],"names":["icCheckboxCss","Checkbox","this","handleClick","checked","icCheck","emit","checkboxChecked","handleFormReset","initiallyChecked","IC_TEXT_FIELD","[object Object]","checkboxEl","host","shadowRoot","querySelector","focus","additionalFieldDisplay","textfield","setAttribute","removeAttribute","additionalFieldContainer","style","display","addFormResetListener","_a","addEventListener","e","stopImmediatePropagation","onComponentRequiredPropUndefined","prop","label","propName","value","removeFormResetListener","removeEventListener","id","undefined","groupLabel","replace","renderHiddenInput","name","disabled","removeHiddenInput","h","Host","class","small","indeterminate","width","height","viewBox","xmlns","fill-rule","clip-rule","d","role","type","onClick","variant","htmlFor","isSlotUsed","ref","el","aria-live","dynamicText","additional-field-wrapper"],"mappings":"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","sourcesContent":["@import \"../../global/normalize.css\";\n\n:host(.disabled) {\n color: var(--ic-architectural-200);\n pointer-events: none;\n}\n\n.container {\n display: flex;\n width: fit-content;\n padding: var(--ic-space-xxs) 0 var(--ic-space-xxs) var(--ic-space-xxs);\n margin-bottom: var(--ic-space-xxs);\n align-items: center;\n}\n\n:host(.small) .container {\n margin-bottom: var(--ic-space-xxxs);\n}\n\n.checkbox {\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n display: block;\n position: relative;\n top: 0;\n left: 0;\n height: var(--ic-space-lg);\n width: var(--ic-space-lg);\n background-color: transparent;\n border: var(--ic-space-1px) solid var(--ic-architectural-300);\n border-radius: var(--ic-border-radius);\n outline: none;\n cursor: pointer;\n transition: var(--ic-easing-transition-fast);\n flex-shrink: 0;\n}\n\n.checkbox:checked {\n background-color: var(--ic-action-default);\n border: var(--ic-space-1px) solid var(--ic-action-default);\n transition: var(--ic-easing-transition-slow);\n}\n\n.checkbox:checked:disabled {\n background-color: var(--ic-architectural-200);\n}\n\n.checkbox:indeterminate,\n.checkbox.indeterminate:checked {\n background-color: transparent;\n border: 0.125rem solid var(--ic-action-default);\n}\n\n.checkbox:checked:hover {\n background-color: var(--ic-action-default-hover);\n}\n\n.checkbox:indeterminate:hover,\n.checkbox.indeterminate:checked:hover {\n background-color: var(--ic-action-default-bg-hover);\n border: 0.125rem solid var(--ic-action-default-hover);\n}\n\n.checkbox:checked:active {\n background-color: var(--ic-action-default-active);\n}\n\n.checkbox:indeterminate:active,\n.checkbox.indeterminate:checked:active {\n background-color: var(--ic-action-default-bg-active);\n border: 0.125rem solid var(--ic-action-default-active);\n}\n\n.checkbox:hover {\n background-color: var(--ic-action-default-bg-hover);\n box-shadow: 0 0 0 0.25rem var(--ic-action-default-bg-hover);\n border: var(--ic-space-1px) solid var(--ic-action-default-hover);\n}\n\n.checkbox:active {\n background-color: var(--ic-action-default-bg-active);\n box-shadow: 0 0 0 0.25rem var(--ic-action-default-bg-active);\n border: var(--ic-space-1px) solid var(--ic-action-default-active);\n}\n\n.checkbox:focus {\n box-shadow: var(--ic-border-focus);\n}\n\n.checkbox:disabled {\n border: var(--ic-space-1px) dashed var(--ic-architectural-200);\n}\n\n.checkbox-label {\n padding-left: var(--ic-space-sm);\n}\n\n.checkbox-label:hover {\n cursor: pointer;\n}\n\n.checkmark {\n position: relative;\n right: calc(-1 * var(--ic-space-lg));\n margin-left: calc(-1 * var(--ic-space-lg));\n fill: white;\n z-index: 1;\n background-color: transparent;\n pointer-events: none;\n flex-shrink: 0;\n}\n\n.indeterminate-symbol {\n position: relative;\n width: 0.875rem;\n height: var(--ic-space-xxxs);\n right: -1.188rem;\n margin-left: -0.875rem;\n z-index: 1;\n background-color: var(--ic-action-default);\n pointer-events: none;\n flex-shrink: 0;\n}\n\n.container:hover .indeterminate-symbol {\n background-color: var(--ic-action-default-hover);\n}\n\n.container:active .indeterminate-symbol {\n background-color: var(--ic-action-default-active);\n}\n\n.additional-field-wrapper {\n margin-left: calc(var(--ic-space-md) + var(--ic-space-lg));\n margin-top: calc(var(--ic-space-sm) / 2);\n}\n\n.branch-corner {\n color: var(--ic-action-default);\n height: var(--ic-space-md);\n width: var(--ic-space-xl);\n border-radius: 0 0 0 0.188rem;\n border-bottom: 0.125rem solid var(--ic-action-default);\n border-left: 0.125rem solid var(--ic-action-default);\n}\n\n.dynamic-container {\n display: flex;\n position: relative;\n margin: var(--ic-space-xxxs) 0 var(--ic-space-xxs) var(--ic-space-md);\n gap: var(--ic-space-xs);\n}\n\n.dynamic-text {\n color: var(--ic-action-default);\n margin-top: calc(var(--ic-space-sm) / 2);\n margin-bottom: var(--ic-space-xs);\n border-radius: 2%;\n}\n\n@media (max-width: 576px) {\n ::slotted(ic-text-field) {\n --input-width: 100%;\n }\n}\n\n@media (forced-colors: active) {\n /* Styles here only apply to Forced Colors Mode */\n .checkbox {\n appearance: revert;\n transition: none;\n }\n\n .checkbox:checked {\n transition: none;\n }\n\n .checkbox:focus-visible {\n outline: 0.125rem solid highlight;\n }\n\n .checkbox:disabled:not(:checked) {\n appearance: none;\n border-color: GrayText;\n }\n\n .checkmark {\n fill: none;\n }\n\n .indeterminate-symbol {\n display: none;\n }\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n Element,\n Event,\n EventEmitter,\n State,\n Method,\n} from \"@stencil/core\";\nimport { IcAdditionalFieldTypes } from \"../../utils/types\";\nimport {\n isSlotUsed,\n onComponentRequiredPropUndefined,\n renderHiddenInput,\n removeHiddenInput,\n addFormResetListener,\n removeFormResetListener,\n} from \"../../utils/helpers\";\n\n@Component({\n tag: \"ic-checkbox\",\n styleUrl: \"ic-checkbox.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nexport class Checkbox {\n /**\n * If `true`, the checkbox will be set to the checked state.\n */\n @Prop({ reflect: true, mutable: true }) checked?: boolean = false;\n /**\n * If `true`, the checkbox will be set to the disabled state.\n */\n @Prop() disabled?: boolean = false;\n /**\n * The label for the checkbox.\n */\n @Prop() label!: string;\n /**\n * The value for the checkbox.\n */\n @Prop() value!: string;\n /**\n * The name for the checkbox. If not set when used in a checkbox group, the name will be based on the group name.\n */\n @Prop() name: string;\n /**\n * The group label for the checkbox.\n */\n @Prop() groupLabel: string;\n /**\n * The text to be displayed when dynamic.\n */\n @Prop() dynamicText: string = \"This selection requires additional answers\";\n /**\n * The style of additionalField that will be displayed if used.\n */\n @Prop({ reflect: true }) additionalFieldDisplay: IcAdditionalFieldTypes =\n \"static\";\n /**\n * If `true`, the indeterminate state will be displayed when checked.\n */\n @Prop() indeterminate: boolean = false;\n\n /**\n * If true, the small styling will be applied to the checkbox.\n */\n @Prop() small?: boolean = false;\n\n @State() initiallyChecked = this.checked;\n\n @Element() host: HTMLIcCheckboxElement;\n\n /**\n * @deprecated This event should not be used anymore. Use icCheck instead.\n */\n @Event() checkboxChecked: EventEmitter<void>;\n\n /**\n * Emitted when a checkbox has been checked.\n */\n @Event() icCheck: EventEmitter<void>;\n\n private additionalFieldContainer: HTMLDivElement;\n\n private handleClick = () => {\n this.checked = !this.checked;\n this.icCheck.emit();\n this.checkboxChecked.emit();\n };\n\n private handleFormReset = (): void => {\n this.checked = this.initiallyChecked;\n };\n\n /**\n * Sets focus on the checkbox.\n */\n @Method()\n async setFocus(): Promise<void> {\n const checkboxEl: HTMLElement =\n this.host.shadowRoot.querySelector(\".checkbox\");\n if (checkboxEl) {\n checkboxEl.focus();\n }\n }\n\n private IC_TEXT_FIELD: string = \"ic-text-field\";\n\n componentDidRender(): void {\n if (this.additionalFieldDisplay === \"static\") {\n const textfield = this.host.querySelector(this.IC_TEXT_FIELD);\n if (!this.checked) {\n textfield && textfield.setAttribute(\"disabled\", \"\");\n } else {\n textfield && textfield.removeAttribute(\"disabled\");\n }\n } else {\n if (!this.checked) {\n this.additionalFieldContainer.style.display = \"none\";\n } else {\n this.additionalFieldContainer.style.display = \"flex\";\n }\n }\n }\n\n componentWillLoad(): void {\n addFormResetListener(this.host, this.handleFormReset);\n this.host\n .querySelector(this.IC_TEXT_FIELD)\n ?.addEventListener(\"icChange\", (e) => e.stopImmediatePropagation());\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [\n { prop: this.label, propName: \"label\" },\n { prop: this.value, propName: \"value\" },\n ],\n \"Checkbox\"\n );\n }\n\n disconnectedCallback(): void {\n removeFormResetListener(this.host, this.handleFormReset);\n this.host\n .querySelector(this.IC_TEXT_FIELD)\n ?.removeEventListener(\"icChange\", (e) => e.stopImmediatePropagation());\n }\n\n render() {\n let id = `ic-checkbox-${\n this.label !== undefined ? this.label : this.value\n }-${this.groupLabel}`;\n\n id = id.replace(/ /g, \"-\");\n\n this.checked\n ? renderHiddenInput(\n true,\n this.host,\n this.name,\n this.checked && this.value,\n this.disabled\n )\n : removeHiddenInput(this.host);\n\n return (\n <Host class={{ [\"disabled\"]: this.disabled, [\"small\"]: this.small }}>\n <div class=\"container\">\n {this.checked && !this.indeterminate && (\n <svg\n class=\"checkmark\"\n width=\"1.5rem\"\n height=\"1.5rem\"\n viewBox=\"0 0 24 24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n >\n <title>checkmark icon</title>\n <path d=\"M21 6.285l-11.16 12.733-6.84-6.018 1.319-1.49 5.341 4.686 9.865-11.196 1.475 1.285z\" />\n </svg>\n )}\n {this.checked && this.indeterminate && (\n <div class=\"indeterminate-symbol\" />\n )}\n <input\n role=\"checkbox\"\n class={{\n [\"checkbox\"]: true,\n [\"checked\"]: this.checked,\n [\"indeterminate\"]: this.indeterminate,\n }}\n type=\"checkbox\"\n name={this.name}\n id={id}\n value={this.value}\n disabled={this.disabled ? true : null}\n checked={this.checked}\n indeterminate={this.indeterminate}\n onClick={this.handleClick}\n ></input>\n <ic-typography class=\"checkbox-label\" variant=\"body\">\n <label htmlFor={id}>{this.label}</label>\n </ic-typography>\n </div>\n {isSlotUsed(this.host, \"additional-field\") && (\n <div\n class=\"dynamic-container\"\n ref={(el) => (this.additionalFieldContainer = el)}\n >\n {this.additionalFieldDisplay === \"dynamic\" && (\n <div class=\"branch-corner\"></div>\n )}\n <div>\n {this.additionalFieldDisplay === \"dynamic\" && (\n <ic-typography variant=\"caption\">\n <p class=\"dynamic-text\" aria-live=\"polite\">\n {this.dynamicText}\n </p>\n </ic-typography>\n )}\n <div\n class={{\n \"additional-field-wrapper\":\n this.additionalFieldDisplay === \"static\",\n }}\n >\n <slot name=\"additional-field\"></slot>\n </div>\n </div>\n </div>\n )}\n </Host>\n );\n }\n}\n"]}
@@ -1,2 +1,2 @@
1
- import{r as t,c as i,h as e,H as a,g as n}from"./p-589f6dd3.js";import{I as s}from"./p-6f57b13c.js";import{G as o,D as r,g as l,k as c,o as h,i as d,c as p,a as m}from"./p-3dea2867.js";const u='/*! 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;color:var(--ic-theme-text);width:100%;position:relative}:host .top-navigation{background-color:var(--ic-theme-primary);height:-moz-max-content;height:max-content}:host(.fullwidth-searchbar) slot[name="search"]::slotted(form){width:100%}:host .title-link{display:inline-flex;align-items:center;text-decoration:none;padding:var(--ic-space-xxs);transition:var(--ic-easing-transition-fast)}:host .title-link,:host .title-link:visited,:host .title-link:active,:host .title-link ::slotted(a),:host .title-link:visited ::slotted(a),:host .title-link:active ::slotted(a){color:var(--ic-theme-text);text-decoration:none;outline:none}:host .title-link:hover:not(:focus){background-color:var(--ic-theme-hover)}:host .title-link:active:not(:focus){background-color:var(--ic-theme-active)}:host .title-link:hover{border-radius:var(--ic-border-radius)}:host .title-link:focus,:host .title-link:focus-within{border-radius:var(--ic-border-radius);box-shadow:var(--ic-border-focus);outline:var(--ic-hc-focus-outline)}:host .title-link ic-typography{font-weight:600}:host .nav-panel-container{border-top:var(--ic-keyline-lighten);padding:0 var(--ic-space-lg);margin-left:calc(-1 * var(--section-container-margin));margin-right:calc(-1 * var(--section-container-margin));display:flex}:host(.dark) .nav-panel-container{border-top:var(--ic-keyline-darken)}.top-panel-container{display:flex;padding-top:0.5rem;padding-bottom:0.5rem}.navigation-tabs{margin-top:calc(-1 * var(--ic-space-1px))}.app-details-container{display:flex;align-items:center;flex:1 1 auto;margin-right:var(--ic-space-md)}.app-icon-container{display:flex;padding-right:var(--ic-space-xs)}.icon-buttons-container{display:flex;margin-left:var(--ic-space-md)}.icon-buttons-container ::slotted(nav){display:flex}.title-wrap{overflow-wrap:break-word;word-wrap:break-word;-ms-word-break:break-all;word-break:break-word;-webkit-hyphens:auto;hyphens:auto}:host .app-status{border-radius:var(--ic-space-md);background-color:var(--ic-architectural-white);color:var(--ic-color-primary-text);padding:var(--ic-space-xxs) var(--ic-space-lg);margin-left:var(--ic-space-md);flex:1 1 0;max-width:-moz-fit-content;max-width:fit-content}:host(.dark) .app-status{background-color:var(--ic-theme-text);color:var(--ic-color-white-text)}:host .app-version{border-radius:var(--ic-space-md);background-color:var(--ic-theme-active);padding:var(--ic-space-xxs) var(--ic-space-sm);margin-left:var(--ic-space-xs);flex:1 1 0;max-width:-moz-fit-content;max-width:fit-content}slot[name="app-icon"]::slotted(svg){fill:var(--ic-theme-text);width:2em;height:2em}slot[name="toggle-icon"] svg{fill:var(--ic-theme-text)}.search-menu-container{justify-content:right;display:flex;align-items:center}.menu-button-container{margin-left:var(--ic-space-md)}.menu-button-container .navigation-landmark-button-text{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}.search-actions-container{display:flex}.menu-buttons-slot{display:flex;flex-direction:column}.navigation-landmark-text{position:absolute;width:var(--ic-space-1px);height:var(--ic-space-1px);padding:0;margin:calc(-1 * var(--ic-space-1px));overflow:hidden}.navigation-item-list{display:flex;list-style:none;height:2.75rem}.navigation-item-list::-webkit-scrollbar{display:none}:host ic-section-container{padding-bottom:0 !important;padding-top:0 !important}@media screen and (min-width: 993px){.app-details-container{margin-right:var(--ic-space-lg)}}@media screen and (max-width: 1200px){:host .nav-panel-container{padding:0 var(--ic-space-md)}}@media screen and (max-width: 992px){:host .nav-panel-container,:host .app-status,:host .app-version{display:none}:host .title-link{margin-right:var(--ic-space-xs)}.search-menu-container{max-width:10rem}.search-bar-container{display:flex;justify-content:center;align-items:center;border-top:var(--ic-keyline-darken);height:4rem;padding-left:var(--ic-space-md);padding-right:var(--ic-space-md);margin-left:calc(-1 * var(--section-container-margin));margin-right:calc(-1 * var(--section-container-margin))}}@media screen and (max-width: 576px){:host .title-link{margin-right:var(--ic-space-xxxs);word-break:break-word;-webkit-hyphens:none;hyphens:none}.top-panel-container{min-height:2.5rem}.searchbox-inline{display:none}.search-bar-container{margin-top:0;height:3.5rem;padding-left:var(--ic-space-xs);padding-right:var(--ic-space-xs)}.menu-button-container{margin-left:var(--ic-space-sm)}slot[name="app-icon"]::slotted(svg){width:1.5em;height:1.5em}slot[name="toggle-icon"] svg{width:1.5em;height:1.5em}}@media (forced-colors: active){:host .top-navigation{border-bottom:var(--ic-hc-border)}.app-status,.app-version{border:var(--ic-hc-border)}slot[name="app-icon"]::slotted(svg){fill:currentcolor}}';const g=class{constructor(e){t(this,e);this.icNavigationMenuOpened=i(this,"icNavigationMenuOpened",7);this.icNavigationMenuClosed=i(this,"icNavigationMenuClosed",7);this.hasAppIcon=false;this.hasNavigation=false;this.hasIconButtons=false;this.hasSearchSlotContent=false;this.searchBar=null;this.initialiseSearchBar=()=>{if(this.hasSearchSlotContent){const t=o(this.el,"search");if(t&&t.tagName==="IC-SEARCH-BAR"){this.searchBar=t}else if(t&&t.tagName==="FORM"){this.searchBar=t.querySelector("ic-search-bar")}if(this.searchBar!==null){this.searchBar.hideLabel=true}}};this.emitTopNavResized=t=>{const i=new CustomEvent("topNavResized",{detail:{size:t}});this.el.dispatchEvent(i)};this.menuButtonClick=()=>{this.showNavMenu(true)};this.searchButtonMouseDownHandler=()=>{this.searchButtonClick=true};this.searchButtonClickHandler=()=>{this.toggleSearchBar();this.searchButtonClick=false};this.resizeObserver=null;this.resizeObserverCallback=t=>{if(t!==this.deviceSize){this.deviceSize=t;if(t>r.L){this.showNavMenu(false);if(this.mobileSearchBarVisible){this.toggleSearchBar()}}this.emitTopNavResized(t);if(document.activeElement!==null&&document.activeElement!==undefined&&document.activeElement.tagName==="IC-SEARCH-BAR"){this.searchBar.setAttribute("hidden","true");this.searchBar.removeAttribute("hidden");setTimeout((()=>{this.searchBar.focus()}),100)}}};this.runResizeObserver=()=>{this.resizeObserver=new ResizeObserver((()=>{const t=l();this.resizeObserverCallback(t)}));this.resizeObserver.observe(this.el)};this.appTitle=undefined;this.href="/";this.version="";this.status="";this.contentAligned="full-width";this.inline=false;this.menuOpen=false;this.deviceSize=r.XL;this.mobileSearchBarVisible=false;this.navMenuVisible=false;this.searchValue="";this.mobileSearchHiddenOnBlur=false;this.searchButtonClick=false;this.foregroundColor=c();this.hasFullWidthSearchBar=false}watchPropHandler(t,i){h(i,t,this.initialiseSearchBar)}navBarMenuCloseHandler(){this.showNavMenu(false);const t=this.el.shadowRoot.querySelector("#menu-button");t.focus()}searchInputBlurHandler(t){if(t.detail!==null){if(this.mobileSearchBarVisible&&!this.searchButtonClick){this.toggleSearchBar()}this.searchValue=t.detail.value}}searchValueChangeHandler(t){this.searchValue=t.detail.value}themeChangeHandler(t){const i=t.detail;this.foregroundColor=i.mode}toggleSearchBar(){this.mobileSearchBarVisible=!this.mobileSearchBarVisible;if(this.searchBar!==null){if(this.mobileSearchBarVisible){this.mobileSearchButtonEl.updateAriaLabel("Hide search");this.hasFullWidthSearchBar=true;this.searchBar.fullWidth=true;setTimeout((()=>{this.searchBar.focus()}),100)}else{this.mobileSearchButtonEl.updateAriaLabel("Show search");this.hasFullWidthSearchBar=false;this.searchBar.fullWidth=false}}}showNavMenu(t){this.navMenuVisible=t;if(t){this.icNavigationMenuOpened.emit();document.body.style.height="100%";document.body.style.overflow="hidden"}else{this.icNavigationMenuClosed.emit();document.body.style.height="auto";document.body.style.overflow="auto"}}componentWillLoad(){this.hasAppIcon=d(this.el,"app-icon");this.hasNavigation=d(this.el,"navigation");this.hasIconButtons=d(this.el,"buttons");this.hasSearchSlotContent=d(this.el,"search");this.deviceSize=l();this.initialiseSearchBar()}componentWillRender(){this.hasNavigation=d(this.el,"navigation");this.hasSearchSlotContent=d(this.el,"search");this.hasIconButtons=d(this.el,"buttons");this.hasAppIcon=d(this.el,"app-icon")}componentDidLoad(){p(this.runResizeObserver);!d(this.el,"app-title")&&m([{prop:this.appTitle,propName:"app-title"}],"Top Navigation")}disconnectedCallback(){if(this.resizeObserver!==null){this.resizeObserver.disconnect()}}render(){const t=this.hasNavigation||this.hasIconButtons||this.status!==""||this.version!=="";const i=this.deviceSize<=r.S?"default":"large";let n="h3";const o=this.appTitle!==""&&this.appTitle!==undefined;if(this.deviceSize<=r.L){n="h4";if(this.deviceSize<=r.S){n="subtitle-small"}}const l=this.mobileSearchBarVisible?"Hide search":"Show search";const c=this.deviceSize<=r.S?"small":"default";const h=d(this.el,"app-title")?"div":"a";const p=h=="a"&&{href:this.href};return e(a,{class:{["fullwidth-searchbar"]:this.hasFullWidthSearchBar,[s.Dark]:this.foregroundColor===s.Dark}},e("div",{class:"top-navigation"},e("ic-section-container",{aligned:this.contentAligned,"full-height":true},e("header",{role:"banner"},e("div",{class:"top-panel-container"},e("div",{class:"app-details-container"},(o||d(this.el,"app-title"))&&e(h,Object.assign({class:"title-link"},p),this.hasAppIcon&&e("div",{class:"app-icon-container","aria-hidden":"true"},e("slot",{name:"app-icon"})),e("ic-typography",{variant:n},e("h1",{class:"title-wrap"},d(this.el,"app-title")?e("slot",{name:"app-title"}):this.appTitle))),this.status!==""&&e("div",{class:"app-status"},e("ic-typography",{"aria-label":"app tag",variant:"label-uppercase",class:"app-status-text"},this.status)),this.version!==""&&e("div",{class:"app-version"},e("ic-typography",{variant:"label",class:"app-version-text","aria-label":"app version"},this.version))),(this.hasSearchSlotContent||t)&&e("div",{class:"search-menu-container"},e("div",{class:"search-actions-container"},this.deviceSize>r.L&&e("slot",{name:"search"}),this.hasSearchSlotContent&&this.deviceSize<=r.L&&e("ic-button",{id:"search-toggle-button",ref:t=>this.mobileSearchButtonEl=t,onMouseDown:this.searchButtonMouseDownHandler,variant:"icon",size:i,"aria-label":l,appearance:this.foregroundColor,onClick:this.searchButtonClickHandler},e("slot",{name:"toggle-icon",slot:"icon"},e("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"#ffffff"},e("path",{d:"M0 0h24v24H0V0z",fill:"none"}),e("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"})))),this.hasIconButtons&&this.deviceSize>r.L&&e("div",{class:"icon-buttons-container"},e("slot",{name:"buttons"})),t&&this.deviceSize<=r.L&&e("div",{class:"menu-button-container"},e("span",{id:"navigation-landmark-button-text",class:"navigation-landmark-button-text","aria-hidden":"true"},"Main navigation button"),e("nav",{"aria-labelledby":"navigation-landmark-button-text","aria-hidden":this.navMenuVisible?"true":"false"},e("ic-button",{id:"menu-button",appearance:this.foregroundColor,variant:"secondary","aria-expanded":this.menuOpen?"true":"false","aria-haspopup":"true","aria-label":`Open ${this.hasNavigation?"navigation":"app"} menu`,size:c,onClick:this.menuButtonClick},"Menu",e("svg",{xmlns:"http://www.w3.org/2000/svg",height:"24px",viewBox:"0 0 24 24",width:"24px",fill:"#ffffff",slot:"icon"},e("path",{d:"M0 0h24v24H0V0z",fill:"none"}),e("path",{d:"M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"})))))))),this.mobileSearchBarVisible&&e("div",{class:"search-bar-container"},e("slot",{name:"search"})),this.hasNavigation&&this.deviceSize>r.L&&e("div",{class:"navigation-tabs"},e("span",{id:"navigation-landmark-text",class:"navigation-landmark-text","aria-hidden":"true"},"Main navigation"),e("nav",{"aria-labelledby":"navigation-landmark-text",class:"nav-panel-container"},e("ic-horizontal-scroll",{appearance:this.foregroundColor},e("ul",{class:"navigation-item-list",tabindex:"-1"},e("slot",{name:"navigation"})))))))),this.navMenuVisible&&e("ic-navigation-menu",{version:this.version,status:this.status,class:{["inline"]:this.inline}},e("div",{class:"menu-buttons-slot",slot:"buttons"},e("slot",{name:"buttons"})),e("ul",{slot:"navigation"},e("slot",{name:"navigation"}))))}get el(){return n(this)}static get watchers(){return{appTitle:["watchPropHandler"]}}};g.style=u;export{g as ic_top_navigation};
2
- //# sourceMappingURL=p-d5d9923a.entry.js.map
1
+ import{r as t,c as i,h as e,H as a,g as n}from"./p-589f6dd3.js";import{I as s}from"./p-6f57b13c.js";import{G as o,D as r,g as l,k as c,o as h,i as d,c as p,a as m}from"./p-471820e6.js";const u='/*! 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;color:var(--ic-theme-text);width:100%;position:relative}:host .top-navigation{background-color:var(--ic-theme-primary);height:-moz-max-content;height:max-content}:host(.fullwidth-searchbar) slot[name="search"]::slotted(form){width:100%}:host .title-link{display:inline-flex;align-items:center;text-decoration:none;padding:var(--ic-space-xxs);transition:var(--ic-easing-transition-fast)}:host .title-link,:host .title-link:visited,:host .title-link:active,:host .title-link ::slotted(a),:host .title-link:visited ::slotted(a),:host .title-link:active ::slotted(a){color:var(--ic-theme-text);text-decoration:none;outline:none}:host .title-link:hover:not(:focus){background-color:var(--ic-theme-hover)}:host .title-link:active:not(:focus){background-color:var(--ic-theme-active)}:host .title-link:hover{border-radius:var(--ic-border-radius)}:host .title-link:focus,:host .title-link:focus-within{border-radius:var(--ic-border-radius);box-shadow:var(--ic-border-focus);outline:var(--ic-hc-focus-outline)}:host .title-link ic-typography{font-weight:600}:host .nav-panel-container{border-top:var(--ic-keyline-lighten);padding:0 var(--ic-space-lg);margin-left:calc(-1 * var(--section-container-margin));margin-right:calc(-1 * var(--section-container-margin));display:flex}:host(.dark) .nav-panel-container{border-top:var(--ic-keyline-darken)}.top-panel-container{display:flex;padding-top:0.5rem;padding-bottom:0.5rem}.navigation-tabs{margin-top:calc(-1 * var(--ic-space-1px))}.app-details-container{display:flex;align-items:center;flex:1 1 auto;margin-right:var(--ic-space-md)}.app-icon-container{display:flex;padding-right:var(--ic-space-xs)}.icon-buttons-container{display:flex;margin-left:var(--ic-space-md)}.icon-buttons-container ::slotted(nav){display:flex}.title-wrap{overflow-wrap:break-word;word-wrap:break-word;-ms-word-break:break-all;word-break:break-word;-webkit-hyphens:auto;hyphens:auto}:host .app-status{border-radius:var(--ic-space-md);background-color:var(--ic-architectural-white);color:var(--ic-color-primary-text);padding:var(--ic-space-xxs) var(--ic-space-lg);margin-left:var(--ic-space-md);flex:1 1 0;max-width:-moz-fit-content;max-width:fit-content}:host(.dark) .app-status{background-color:var(--ic-theme-text);color:var(--ic-color-white-text)}:host .app-version{border-radius:var(--ic-space-md);background-color:var(--ic-theme-active);padding:var(--ic-space-xxs) var(--ic-space-sm);margin-left:var(--ic-space-xs);flex:1 1 0;max-width:-moz-fit-content;max-width:fit-content}slot[name="app-icon"]::slotted(svg){fill:var(--ic-theme-text);width:2em;height:2em}slot[name="toggle-icon"] svg{fill:var(--ic-theme-text)}.search-menu-container{justify-content:right;display:flex;align-items:center}.menu-button-container{margin-left:var(--ic-space-md)}.menu-button-container .navigation-landmark-button-text{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}.search-actions-container{display:flex}.menu-buttons-slot{display:flex;flex-direction:column}.navigation-landmark-text{position:absolute;width:var(--ic-space-1px);height:var(--ic-space-1px);padding:0;margin:calc(-1 * var(--ic-space-1px));overflow:hidden}.navigation-item-list{display:flex;list-style:none;height:2.75rem}.navigation-item-list::-webkit-scrollbar{display:none}:host ic-section-container{padding-bottom:0 !important;padding-top:0 !important}@media screen and (min-width: 993px){.app-details-container{margin-right:var(--ic-space-lg)}}@media screen and (max-width: 1200px){:host .nav-panel-container{padding:0 var(--ic-space-md)}}@media screen and (max-width: 992px){:host .nav-panel-container,:host .app-status,:host .app-version{display:none}:host .title-link{margin-right:var(--ic-space-xs)}.search-menu-container{max-width:10rem}.search-bar-container{display:flex;justify-content:center;align-items:center;border-top:var(--ic-keyline-darken);height:4rem;padding-left:var(--ic-space-md);padding-right:var(--ic-space-md);margin-left:calc(-1 * var(--section-container-margin));margin-right:calc(-1 * var(--section-container-margin))}}@media screen and (max-width: 576px){:host .title-link{margin-right:var(--ic-space-xxxs);word-break:break-word;-webkit-hyphens:none;hyphens:none}.top-panel-container{min-height:2.5rem}.searchbox-inline{display:none}.search-bar-container{margin-top:0;height:3.5rem;padding-left:var(--ic-space-xs);padding-right:var(--ic-space-xs)}.menu-button-container{margin-left:var(--ic-space-sm)}slot[name="app-icon"]::slotted(svg){width:1.5em;height:1.5em}slot[name="toggle-icon"] svg{width:1.5em;height:1.5em}}@media (forced-colors: active){:host .top-navigation{border-bottom:var(--ic-hc-border)}.app-status,.app-version{border:var(--ic-hc-border)}slot[name="app-icon"]::slotted(svg){fill:currentcolor}}';const g=class{constructor(e){t(this,e);this.icNavigationMenuOpened=i(this,"icNavigationMenuOpened",7);this.icNavigationMenuClosed=i(this,"icNavigationMenuClosed",7);this.hasAppIcon=false;this.hasNavigation=false;this.hasIconButtons=false;this.hasSearchSlotContent=false;this.searchBar=null;this.initialiseSearchBar=()=>{if(this.hasSearchSlotContent){const t=o(this.el,"search");if(t&&t.tagName==="IC-SEARCH-BAR"){this.searchBar=t}else if(t&&t.tagName==="FORM"){this.searchBar=t.querySelector("ic-search-bar")}if(this.searchBar!==null){this.searchBar.hideLabel=true}}};this.emitTopNavResized=t=>{const i=new CustomEvent("topNavResized",{detail:{size:t}});this.el.dispatchEvent(i)};this.menuButtonClick=()=>{this.showNavMenu(true)};this.searchButtonMouseDownHandler=()=>{this.searchButtonClick=true};this.searchButtonClickHandler=()=>{this.toggleSearchBar();this.searchButtonClick=false};this.resizeObserver=null;this.resizeObserverCallback=t=>{if(t!==this.deviceSize){this.deviceSize=t;if(t>r.L){this.showNavMenu(false);if(this.mobileSearchBarVisible){this.toggleSearchBar()}}this.emitTopNavResized(t);if(document.activeElement!==null&&document.activeElement!==undefined&&document.activeElement.tagName==="IC-SEARCH-BAR"){this.searchBar.setAttribute("hidden","true");this.searchBar.removeAttribute("hidden");setTimeout((()=>{this.searchBar.focus()}),100)}}};this.runResizeObserver=()=>{this.resizeObserver=new ResizeObserver((()=>{const t=l();this.resizeObserverCallback(t)}));this.resizeObserver.observe(this.el)};this.appTitle=undefined;this.href="/";this.version="";this.status="";this.contentAligned="full-width";this.inline=false;this.menuOpen=false;this.deviceSize=r.XL;this.mobileSearchBarVisible=false;this.navMenuVisible=false;this.searchValue="";this.mobileSearchHiddenOnBlur=false;this.searchButtonClick=false;this.foregroundColor=c();this.hasFullWidthSearchBar=false}watchPropHandler(t,i){h(i,t,this.initialiseSearchBar)}navBarMenuCloseHandler(){this.showNavMenu(false);const t=this.el.shadowRoot.querySelector("#menu-button");t.focus()}searchInputBlurHandler(t){if(t.detail!==null){if(this.mobileSearchBarVisible&&!this.searchButtonClick){this.toggleSearchBar()}this.searchValue=t.detail.value}}searchValueChangeHandler(t){this.searchValue=t.detail.value}themeChangeHandler(t){const i=t.detail;this.foregroundColor=i.mode}toggleSearchBar(){this.mobileSearchBarVisible=!this.mobileSearchBarVisible;if(this.searchBar!==null){if(this.mobileSearchBarVisible){this.mobileSearchButtonEl.updateAriaLabel("Hide search");this.hasFullWidthSearchBar=true;this.searchBar.fullWidth=true;setTimeout((()=>{this.searchBar.focus()}),100)}else{this.mobileSearchButtonEl.updateAriaLabel("Show search");this.hasFullWidthSearchBar=false;this.searchBar.fullWidth=false}}}showNavMenu(t){this.navMenuVisible=t;if(t){this.icNavigationMenuOpened.emit();document.body.style.height="100%";document.body.style.overflow="hidden"}else{this.icNavigationMenuClosed.emit();document.body.style.height="auto";document.body.style.overflow="auto"}}componentWillLoad(){this.hasAppIcon=d(this.el,"app-icon");this.hasNavigation=d(this.el,"navigation");this.hasIconButtons=d(this.el,"buttons");this.hasSearchSlotContent=d(this.el,"search");this.deviceSize=l();this.initialiseSearchBar()}componentWillRender(){this.hasNavigation=d(this.el,"navigation");this.hasSearchSlotContent=d(this.el,"search");this.hasIconButtons=d(this.el,"buttons");this.hasAppIcon=d(this.el,"app-icon")}componentDidLoad(){p(this.runResizeObserver);!d(this.el,"app-title")&&m([{prop:this.appTitle,propName:"app-title"}],"Top Navigation")}disconnectedCallback(){if(this.resizeObserver!==null){this.resizeObserver.disconnect()}}render(){const t=this.hasNavigation||this.hasIconButtons||this.status!==""||this.version!=="";const i=this.deviceSize<=r.S?"default":"large";let n="h3";const o=this.appTitle!==""&&this.appTitle!==undefined;if(this.deviceSize<=r.L){n="h4";if(this.deviceSize<=r.S){n="subtitle-small"}}const l=this.mobileSearchBarVisible?"Hide search":"Show search";const c=this.deviceSize<=r.S?"small":"default";const h=d(this.el,"app-title")?"div":"a";const p=h=="a"&&{href:this.href};return e(a,{class:{["fullwidth-searchbar"]:this.hasFullWidthSearchBar,[s.Dark]:this.foregroundColor===s.Dark}},e("div",{class:"top-navigation"},e("ic-section-container",{aligned:this.contentAligned,"full-height":true},e("header",{role:"banner"},e("div",{class:"top-panel-container"},e("div",{class:"app-details-container"},(o||d(this.el,"app-title"))&&e(h,Object.assign({class:"title-link"},p),this.hasAppIcon&&e("div",{class:"app-icon-container","aria-hidden":"true"},e("slot",{name:"app-icon"})),e("ic-typography",{variant:n},e("h1",{class:"title-wrap"},d(this.el,"app-title")?e("slot",{name:"app-title"}):this.appTitle))),this.status!==""&&e("div",{class:"app-status"},e("ic-typography",{"aria-label":"app tag",variant:"label-uppercase",class:"app-status-text"},this.status)),this.version!==""&&e("div",{class:"app-version"},e("ic-typography",{variant:"label",class:"app-version-text","aria-label":"app version"},this.version))),(this.hasSearchSlotContent||t)&&e("div",{class:"search-menu-container"},e("div",{class:"search-actions-container"},this.deviceSize>r.L&&e("slot",{name:"search"}),this.hasSearchSlotContent&&this.deviceSize<=r.L&&e("ic-button",{id:"search-toggle-button",ref:t=>this.mobileSearchButtonEl=t,onMouseDown:this.searchButtonMouseDownHandler,variant:"icon",size:i,"aria-label":l,appearance:this.foregroundColor,onClick:this.searchButtonClickHandler},e("slot",{name:"toggle-icon",slot:"icon"},e("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"#ffffff"},e("path",{d:"M0 0h24v24H0V0z",fill:"none"}),e("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"})))),this.hasIconButtons&&this.deviceSize>r.L&&e("div",{class:"icon-buttons-container"},e("slot",{name:"buttons"})),t&&this.deviceSize<=r.L&&e("div",{class:"menu-button-container"},e("span",{id:"navigation-landmark-button-text",class:"navigation-landmark-button-text","aria-hidden":"true"},"Main navigation button"),e("nav",{"aria-labelledby":"navigation-landmark-button-text","aria-hidden":this.navMenuVisible?"true":"false"},e("ic-button",{id:"menu-button",appearance:this.foregroundColor,variant:"secondary","aria-expanded":this.menuOpen?"true":"false","aria-haspopup":"true","aria-label":`Open ${this.hasNavigation?"navigation":"app"} menu`,size:c,onClick:this.menuButtonClick},"Menu",e("svg",{xmlns:"http://www.w3.org/2000/svg",height:"24px",viewBox:"0 0 24 24",width:"24px",fill:"#ffffff",slot:"icon"},e("path",{d:"M0 0h24v24H0V0z",fill:"none"}),e("path",{d:"M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"})))))))),this.mobileSearchBarVisible&&e("div",{class:"search-bar-container"},e("slot",{name:"search"})),this.hasNavigation&&this.deviceSize>r.L&&e("div",{class:"navigation-tabs"},e("span",{id:"navigation-landmark-text",class:"navigation-landmark-text","aria-hidden":"true"},"Main navigation"),e("nav",{"aria-labelledby":"navigation-landmark-text",class:"nav-panel-container"},e("ic-horizontal-scroll",{appearance:this.foregroundColor},e("ul",{class:"navigation-item-list",tabindex:"-1"},e("slot",{name:"navigation"})))))))),this.navMenuVisible&&e("ic-navigation-menu",{version:this.version,status:this.status,class:{["inline"]:this.inline}},e("div",{class:"menu-buttons-slot",slot:"buttons"},e("slot",{name:"buttons"})),e("ul",{slot:"navigation"},e("slot",{name:"navigation"}))))}get el(){return n(this)}static get watchers(){return{appTitle:["watchPropHandler"]}}};g.style=u;export{g as ic_top_navigation};
2
+ //# sourceMappingURL=p-36e0671f.entry.js.map
@@ -0,0 +1,2 @@
1
+ import{r as t,h as e,H as s,g as i}from"./p-589f6dd3.js";import{C as a}from"./p-8c7f4343.js";const c=`<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M7.99935 4.32666L13.0193 13H2.97935L7.99935 4.32666ZM7.99935 1.66666L0.666016 14.3333H15.3327L7.99935 1.66666ZM8.66602 11H7.33268V12.3333H8.66602V11ZM8.66602 6.99999H7.33268V9.66666H8.66602V6.99999Z" fill="currentColor"/>\n</svg>`;const r=":host{display:flex;flex:auto}.step{display:flex;flex:1 1 0}.step-icon{display:flex;justify-content:center}.step-title,.step-subtitle,.step-status,.next-step{white-space:pre-line}.visually-hidden{position:absolute;left:-625rem;top:auto;width:1px;height:1px;overflow:hidden}:host(.compact){-moz-column-gap:var(--ic-space-sm);column-gap:var(--ic-space-sm);--compact-step-inner-color:var(--ic-status-info);--compact-step-circular-line-width:var(--ic-space-xxs)}:host(.compact) .step{-moz-column-gap:var(--ic-space-sm);column-gap:var(--ic-space-sm)}:host(.compact) .step:not(.current){display:none;opacity:0;visibility:hidden}.compact-step-progress-indicator{margin:var(--ic-space-xs) 0 0}:host(.compact) .step-title-area{display:flex;flex-direction:column;width:14.25rem}.info-line{display:flex;-moz-column-gap:var(--ic-space-xs);column-gap:var(--ic-space-xs)}.step-status{display:flex;color:var(--ic-color-secondary-text);-moz-column-gap:var(--ic-space-xxxs);column-gap:var(--ic-space-xxxs)}.compact-step-completed .step-status{color:var(--ic-status-success)}.compact-step-disabled :is(.step-title,.step-status){color:var(--ic-color-tertiary-text)}.step-num{color:var(--ic-color-secondary-text);white-space:nowrap}:host(.compact) .step-icon{margin:var(--ic-space-xxxs)}:host(.compact) .step-icon svg{width:var(--ic-space-md);height:var(--ic-space-md)}:host(.default) .step{flex-direction:column}:host(.default.last-step){flex-grow:initial}.step-top{display:flex;width:100%;align-items:center;align-self:flex-start;height:2.5rem}:host(.default) .step-icon{border-radius:50%}.step-icon-inner{width:var(--ic-space-xl);height:var(--ic-space-xl);display:flex;justify-content:center;align-items:center;border-radius:50%}:host(.default) .current{color:var(--ic-status-info)}:host(.default) .step-title-area{margin:var(--ic-space-xs) 0;padding-right:var(--ic-space-xs);width:100%}:host(.default) .step-title,.step-subtitle{width:-moz-fit-content;width:fit-content}.step-subtitle{color:var(--ic-color-tertiary-text)}.current .step-subtitle{color:var(--ic-color-primary-text)}:host(.default) .completed{color:var(--ic-status-success)}.active .step-icon-inner{box-shadow:inset var(--ic-architectural-200) 0 0 0 0.125rem}.current .step-icon-inner{background-color:var(--ic-status-info);color:white}.disabled{color:var(--ic-architectural-200)}.disabled .step-icon-inner{border:var(--ic-space-1px) dashed var(--ic-architectural-200);width:calc(var(--ic-space-xl) - var(--ic-space-xxxs));height:calc(var(--ic-space-xl) - var(--ic-space-xxxs))}.disabled .step-title-area{color:var(--ic-color-tertiary-text)}.completed .step-icon-inner{background:var(--ic-status-success);box-shadow:inset var(--ic-status-success) 0 0 0 var(--ic-space-xxxs);border-radius:100%}:host(.default) .current .step-icon{border:var(--ic-space-xxxs) solid var(--ic-status-info);padding:var(--ic-space-xxxs);margin:0 calc(-1 * var(--ic-space-xxxs));}.step-connect{height:var(--ic-space-xxxs);background-color:var(--ic-architectural-200);margin:0 var(--ic-space-xs);border-radius:var(--ic-space-xxs);width:100%}.aligned-full-width.step-connect{min-width:6.25rem;width:100%}.disabled .step-connect{height:0;background-color:rgb(0 0 0 / 0%);border-top:0.125rem dashed var(--ic-architectural-200);border-radius:0}.completed .step-connect{background-color:var(--ic-status-success)}.step-connect-inner{width:70%;display:flex;flex:auto;height:var(--ic-space-xxxs);border-radius:var(--ic-space-xxs);background-color:var(--ic-status-info)}.step-icon-inner .check-icon{padding-top:var(--ic-space-xxs)}.step-icon-inner .check-icon svg{width:var(--ic-space-md);height:auto}.step-icon-inner .check-icon>svg>path{fill:var(--ic-color-white-text)}@media (forced-colors: active){.compact-step-disabled :is(.step-title,.step-status){color:GrayText}.step-connect:not(.disabled .step-connect){border:var(--ic-hc-border)}.active .step-icon-inner,.completed .step-icon-inner,.current .step-icon-inner{forced-color-adjust:none;box-shadow:inset canvastext 0 0 0 0.125rem;background-color:transparent;color:canvastext}:host(.default) .current .step-icon{padding:0;border:none}.disabled,.disabled .step-title-area{color:GrayText}.step-connect-inner,.completed .step-connect{background-color:canvastext}.step-icon-inner .check-icon>svg>path{fill:canvastext}}";const n=class{constructor(e){t(this,e);this.variant=undefined;this.stepTitle=undefined;this.stepSubtitle=undefined;this.stepStatus=undefined;this.stepType="active";this.current=false;this.compactStepStyling=undefined;this.stepNum=undefined;this.lastStep=undefined;this.lastStepNum=undefined;this.nextStepTitle=undefined;this.progress=undefined}stepTypeChangeHandler(){if(this.variant==="compact"&&this.stepType==="current"){this.current=true}else{this.current=false}}render(){let t="";if(this.stepType==="completed"){t=". Completed step"}else if(this.stepType==="disabled"){t=". Non-required step"}else if(this.stepStatus==="required"){t=". Required step"}else if(this.stepStatus==="optional"){t=". Optional step"}let i;if(this.stepStatus){i=this.stepStatus[0].toUpperCase()+this.stepStatus.slice(1)}let r;if(this.stepType==="disabled"||this.compactStepStyling==="disabled"){r="Not required"}else if(this.compactStepStyling==="completed"){r="Completed"}let n;if(this.stepType==="completed"||this.compactStepStyling==="completed"){n=e("span",{class:"check-icon step-icon","aria-hidden":"true",innerHTML:a})}else if(this.stepType==="disabled"||this.compactStepStyling==="disabled"){n=e("span",{class:"warning-icon step-icon","aria-hidden":"true",innerHTML:c})}const o=e("div",{class:{["step"]:true,["current"]:this.current,[`compact-step-${this.compactStepStyling}`]:!!this.compactStepStyling}},e("ic-loading-indicator",{class:{"compact-step-progress-indicator":true,"not-required":this.stepType==="disabled"||this.compactStepStyling==="disabled"},"aria-hidden":"true",size:"small","inner-label":this.stepNum,progress:this.progress}),e("div",{class:"step-title-area"},e("ic-typography",{variant:"h4",class:"step-title"},this.stepTitle),e("div",{class:"info-line"},e("ic-typography",{variant:"caption",class:"step-num"},`${this.stepNum} of ${this.lastStepNum}`,e("span",{class:"visually-hidden"}," steps")),(this.stepSubtitle||this.stepType==="completed"||this.stepType==="disabled"||this.variant==="compact"&&!!this.compactStepStyling&&this.compactStepStyling!=="active"||!!this.stepStatus)&&e("div",{class:"step-status"},n!==undefined&&n,(this.stepSubtitle||r)&&e("ic-typography",{variant:"caption"},this.stepSubtitle!==null&&this.stepSubtitle!==undefined?this.stepSubtitle:this.stepType==="disabled"||this.variant==="compact"&&this.compactStepStyling==="disabled"||this.stepType==="completed"||this.variant==="compact"&&this.compactStepStyling==="completed"?r:this.stepStatus&&i))),this.lastStep?e("ic-typography",{variant:"subtitle-small",class:"next-step"},"Last step"):this.nextStepTitle!==undefined&&e("ic-typography",{variant:"subtitle-small",class:"next-step"},"Next",e("span",{class:"visually-hidden"}," step is"),":"," ",this.nextStepTitle)));let l;if(this.stepType!=="completed"){l=e("ic-typography",{variant:"subtitle-small"},e("span",{class:"step-icon-inner","aria-hidden":"true"},this.stepNum))}else{l=e("div",{class:"step-icon-inner","aria-hidden":"true"},e("span",{class:"check-icon",innerHTML:a}))}const p=this.stepType==="current"&&e("div",{class:"step-connect-inner"});const d=!this.lastStep&&e("div",{class:{["step-connect"]:true,["aligned-full-width"]:this.el.parentElement.classList.contains("default")&&!this.el.parentElement.classList.contains("aligned-left")}},p);const h=e("div",{class:{["step"]:true,[`${this.stepType}`]:true}},e("div",{class:"step-top"},e("div",{class:"step-icon"},l),d),(this.stepTitle||this.stepSubtitle||this.stepStatus)&&e("div",{class:"step-title-area"},this.stepTitle&&e("ic-typography",{variant:"subtitle-large",class:"step-title"},this.stepTitle),this.stepTitle&&(this.stepSubtitle||this.stepStatus)&&e("ic-typography",{variant:"caption",class:"step-subtitle"},this.stepSubtitle!==null&&this.stepSubtitle!==undefined?this.stepSubtitle:i)));return e(s,{role:"listitem","aria-label":`Step ${this.stepNum}${t}`,"aria-current":(this.current||this.stepType==="current")&&"step",class:{["aligned-full-width"]:this.el.parentElement.classList.contains("default")&&!this.el.parentElement.classList.contains("aligned-left"),[`${this.variant}`]:true}},this.variant==="compact"?o:h)}get el(){return i(this)}static get watchers(){return{stepType:["stepTypeChangeHandler"]}}};n.style=r;export{n as ic_step};
2
+ //# sourceMappingURL=p-443052a7.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["src/components/ic-step/ic-step.css?tag=ic-step&encapsulation=shadow","src/components/ic-step/ic-step.tsx"],"names":["icStepCss","Step","[object Object]","this","variant","stepType","current","ariaLabel","stepStatus","toUpperCase","slice","compactStepStyling","statusIcon","h","class","aria-hidden","innerHTML","checkIcon","warningIcon","compactStep","compact-step-progress-indicator","not-required","size","inner-label","stepNum","progress","stepTitle","lastStepNum","stepSubtitle","undefined","lastStep","nextStepTitle","icon","partialBar","finalStep","el","parentElement","classList","contains","defaultStep","Host","role","aria-label","aria-current"],"mappings":"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","sourcesContent":["/* SHARED STYLING */\n:host {\n display: flex;\n flex: auto;\n}\n\n.step {\n display: flex;\n flex: 1 1 0;\n}\n\n.step-icon {\n display: flex;\n justify-content: center;\n}\n\n.step-title,\n.step-subtitle,\n.step-status,\n.next-step {\n white-space: pre-line;\n}\n\n.visually-hidden {\n position: absolute;\n left: -625rem;\n top: auto;\n width: 1px;\n height: 1px;\n overflow: hidden;\n}\n\n/* COMPACT STEP STYLING */\n:host(.compact) {\n column-gap: var(--ic-space-sm);\n\n --compact-step-inner-color: var(--ic-status-info);\n --compact-step-circular-line-width: var(--ic-space-xxs);\n}\n\n:host(.compact) .step {\n column-gap: var(--ic-space-sm);\n}\n\n:host(.compact) .step:not(.current) {\n display: none;\n opacity: 0;\n visibility: hidden;\n}\n\n.compact-step-progress-indicator {\n margin: var(--ic-space-xs) 0 0;\n}\n\n:host(.compact) .step-title-area {\n display: flex;\n flex-direction: column;\n width: 14.25rem;\n}\n\n.info-line {\n display: flex;\n column-gap: var(--ic-space-xs);\n}\n\n.step-status {\n display: flex;\n color: var(--ic-color-secondary-text);\n column-gap: var(--ic-space-xxxs);\n}\n\n.compact-step-completed .step-status {\n color: var(--ic-status-success);\n}\n\n.compact-step-disabled :is(.step-title, .step-status) {\n color: var(--ic-color-tertiary-text);\n}\n\n.step-num {\n color: var(--ic-color-secondary-text);\n white-space: nowrap;\n}\n\n:host(.compact) .step-icon {\n margin: var(--ic-space-xxxs);\n}\n\n:host(.compact) .step-icon svg {\n width: var(--ic-space-md);\n height: var(--ic-space-md);\n}\n\n/* DEFAULT STEP STYLING */\n:host(.default) .step {\n flex-direction: column;\n}\n\n:host(.default.last-step) {\n flex-grow: initial;\n}\n\n.step-top {\n display: flex;\n width: 100%;\n align-items: center;\n align-self: flex-start;\n height: 2.5rem;\n}\n\n:host(.default) .step-icon {\n border-radius: 50%;\n}\n\n.step-icon-inner {\n width: var(--ic-space-xl);\n height: var(--ic-space-xl);\n display: flex;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n}\n\n:host(.default) .current {\n color: var(--ic-status-info);\n}\n\n:host(.default) .step-title-area {\n margin: var(--ic-space-xs) 0;\n padding-right: var(--ic-space-xs);\n width: 100%;\n}\n\n:host(.default) .step-title,\n.step-subtitle {\n width: fit-content;\n}\n\n.step-subtitle {\n color: var(--ic-color-tertiary-text);\n}\n\n.current .step-subtitle {\n color: var(--ic-color-primary-text);\n}\n\n:host(.default) .completed {\n color: var(--ic-status-success);\n}\n\n.active .step-icon-inner {\n box-shadow: inset var(--ic-architectural-200) 0 0 0 0.125rem;\n}\n\n.current .step-icon-inner {\n background-color: var(--ic-status-info);\n color: white;\n}\n\n.disabled {\n color: var(--ic-architectural-200);\n}\n\n.disabled .step-icon-inner {\n border: var(--ic-space-1px) dashed var(--ic-architectural-200);\n width: calc(var(--ic-space-xl) - var(--ic-space-xxxs));\n height: calc(var(--ic-space-xl) - var(--ic-space-xxxs));\n}\n\n.disabled .step-title-area {\n color: var(--ic-color-tertiary-text);\n}\n\n.completed .step-icon-inner {\n background: var(--ic-status-success);\n box-shadow: inset var(--ic-status-success) 0 0 0 var(--ic-space-xxxs);\n border-radius: 100%;\n}\n\n:host(.default) .current .step-icon {\n border: var(--ic-space-xxxs) solid var(--ic-status-info);\n padding: var(--ic-space-xxxs);\n margin: 0 calc(-1 * var(--ic-space-xxxs));\n\n /* compensating for the circle being bigger than other steps */\n}\n\n.step-connect {\n height: var(--ic-space-xxxs);\n background-color: var(--ic-architectural-200);\n margin: 0 var(--ic-space-xs);\n border-radius: var(--ic-space-xxs);\n width: 100%;\n}\n\n.aligned-full-width.step-connect {\n min-width: 6.25rem;\n width: 100%;\n}\n\n.disabled .step-connect {\n height: 0;\n background-color: rgb(0 0 0 / 0%);\n border-top: 0.125rem dashed var(--ic-architectural-200);\n border-radius: 0;\n}\n\n.completed .step-connect {\n background-color: var(--ic-status-success);\n}\n\n.step-connect-inner {\n width: 70%;\n display: flex;\n flex: auto;\n height: var(--ic-space-xxxs);\n border-radius: var(--ic-space-xxs);\n background-color: var(--ic-status-info);\n}\n\n.step-icon-inner .check-icon {\n padding-top: var(--ic-space-xxs);\n}\n\n.step-icon-inner .check-icon svg {\n width: var(--ic-space-md);\n height: auto;\n}\n\n.step-icon-inner .check-icon > svg > path {\n fill: var(--ic-color-white-text);\n}\n\n/** High Contrast **/\n@media (forced-colors: active) {\n /* COMPACT STEP */\n .compact-step-disabled :is(.step-title, .step-status) {\n color: GrayText;\n }\n\n /* DEFAULT STEP */\n .step-connect:not(.disabled .step-connect) {\n border: var(--ic-hc-border);\n }\n\n .active .step-icon-inner,\n .completed .step-icon-inner,\n .current .step-icon-inner {\n forced-color-adjust: none;\n box-shadow: inset canvastext 0 0 0 0.125rem;\n background-color: transparent;\n color: canvastext;\n }\n\n :host(.default) .current .step-icon {\n padding: 0;\n border: none;\n }\n\n .disabled,\n .disabled .step-title-area {\n color: GrayText;\n }\n\n .step-connect-inner,\n .completed .step-connect {\n background-color: canvastext;\n }\n\n .step-icon-inner .check-icon > svg > path {\n fill: canvastext;\n }\n}\n","import { Component, Host, h, Prop, Element, Watch } from \"@stencil/core\";\nimport checkIcon from \"../../assets/check-icon.svg\";\nimport warningIcon from \"../../assets/warning-icon-outline.svg\";\nimport { IcStepVariants, IcStepStatuses, IcStepTypes } from \"./ic-step.types\";\n\n@Component({\n tag: \"ic-step\",\n styleUrl: \"ic-step.css\",\n shadow: true,\n})\nexport class Step {\n @Element() el: HTMLIcStepElement;\n /**\n * @internal The variant of the step. This is managed by ic-stepper.\n */\n @Prop() variant!: IcStepVariants;\n\n /**\n * The title of the step within the stepper.\n */\n @Prop() stepTitle?: string;\n\n /**\n * Additional information about the step. Use this prop to override the default step status messaging displayed when selecting a step type or step status.\n */\n @Prop() stepSubtitle?: string;\n\n /**\n * The status of the step. Use this prop to display a status message on the step if it is required or optional.\n */\n @Prop() stepStatus?: IcStepStatuses;\n\n /**\n * The state of the step within the stepper.\n */\n @Prop() stepType?: IcStepTypes = \"active\";\n\n /**\n * @internal If `true`, and a compact stepper is being used, the current step will be the only step in view.\n */\n @Prop({ mutable: true }) current?: boolean = false;\n\n /**\n * @internal If a compact stepper is being used, this sets the styling of the step.\n */\n @Prop() compactStepStyling?: IcStepTypes;\n\n /**\n * @internal The step number, managed by ic-stepper.\n */\n @Prop() stepNum?: number;\n\n /**\n * @internal If `true`, the step will be marked as being the last one in the series. This is managed by ic-stepper.\n */\n @Prop() lastStep!: boolean;\n\n /**\n * @internal The step number of the final step. This is managed by ic-stepper.\n */\n @Prop() lastStepNum?: number;\n\n /**\n * @internal The name of the next step. This is managed by ic-stepper.\n */\n @Prop() nextStepTitle?: string;\n\n /**\n * @internal The progress of the next step, calculated by dividing the current step number by the total number of steps. This is managed by ic-stepper.\n */\n @Prop() progress?: number;\n\n @Watch(\"stepType\")\n stepTypeChangeHandler(): void {\n if (this.variant === \"compact\" && this.stepType === \"current\") {\n this.current = true;\n } else {\n this.current = false;\n }\n }\n\n render() {\n // ARIA LABEL\n let ariaLabel = \"\";\n\n if (this.stepType === \"completed\") {\n ariaLabel = \". Completed step\";\n } else if (this.stepType === \"disabled\") {\n ariaLabel = \". Non-required step\";\n } else if (this.stepStatus === \"required\") {\n ariaLabel = \". Required step\";\n } else if (this.stepStatus === \"optional\") {\n ariaLabel = \". Optional step\";\n }\n\n // STEP STATUS\n let stepStatus;\n if (this.stepStatus) {\n stepStatus = this.stepStatus[0].toUpperCase() + this.stepStatus.slice(1);\n }\n\n // STEP TYPE\n let stepType;\n if (\n this.stepType === \"disabled\" ||\n this.compactStepStyling === \"disabled\"\n ) {\n stepType = \"Not required\";\n } else if (this.compactStepStyling === \"completed\") {\n stepType = \"Completed\";\n }\n\n // STATUS ICON FOR COMPACT STEP\n let statusIcon;\n if (\n this.stepType === \"completed\" ||\n this.compactStepStyling === \"completed\"\n ) {\n statusIcon = (\n <span\n class=\"check-icon step-icon\"\n aria-hidden=\"true\"\n innerHTML={checkIcon}\n ></span>\n );\n } else if (\n this.stepType === \"disabled\" ||\n this.compactStepStyling === \"disabled\"\n ) {\n statusIcon = (\n <span\n class=\"warning-icon step-icon\"\n aria-hidden=\"true\"\n innerHTML={warningIcon}\n ></span>\n );\n }\n\n // COMPACT STEP COMPONENT\n const compactStep = (\n <div\n class={{\n [\"step\"]: true,\n [\"current\"]: this.current,\n [`compact-step-${this.compactStepStyling}`]:\n !!this.compactStepStyling,\n }}\n >\n <ic-loading-indicator\n class={{\n \"compact-step-progress-indicator\": true,\n \"not-required\":\n this.stepType === \"disabled\" ||\n this.compactStepStyling === \"disabled\",\n }}\n aria-hidden=\"true\"\n size=\"small\"\n inner-label={this.stepNum}\n progress={this.progress}\n ></ic-loading-indicator>\n <div class=\"step-title-area\">\n <ic-typography variant=\"h4\" class=\"step-title\">\n {this.stepTitle}\n </ic-typography>\n <div class=\"info-line\">\n <ic-typography variant=\"caption\" class=\"step-num\">\n {`${this.stepNum} of ${this.lastStepNum}`}\n <span class=\"visually-hidden\"> steps</span>\n </ic-typography>\n {(this.stepSubtitle ||\n this.stepType === \"completed\" ||\n this.stepType === \"disabled\" ||\n (this.variant === \"compact\" &&\n !!this.compactStepStyling &&\n this.compactStepStyling !== \"active\") ||\n !!this.stepStatus) && (\n <div class=\"step-status\">\n {statusIcon !== undefined && statusIcon}\n {(this.stepSubtitle || stepType) && (\n <ic-typography variant=\"caption\">\n {this.stepSubtitle !== null &&\n this.stepSubtitle !== undefined\n ? this.stepSubtitle\n : this.stepType === \"disabled\" ||\n (this.variant === \"compact\" &&\n this.compactStepStyling === \"disabled\") ||\n this.stepType === \"completed\" ||\n (this.variant === \"compact\" &&\n this.compactStepStyling === \"completed\")\n ? stepType\n : this.stepStatus && stepStatus}\n </ic-typography>\n )}\n </div>\n )}\n </div>\n {this.lastStep ? (\n <ic-typography variant=\"subtitle-small\" class=\"next-step\">\n Last step\n </ic-typography>\n ) : (\n this.nextStepTitle !== undefined && (\n <ic-typography variant=\"subtitle-small\" class=\"next-step\">\n Next<span class=\"visually-hidden\"> step is</span>:{\" \"}\n {this.nextStepTitle}\n </ic-typography>\n )\n )}\n </div>\n </div>\n );\n\n // ICON FOR DEFAULT STEP\n let icon;\n if (this.stepType !== \"completed\") {\n icon = (\n <ic-typography variant=\"subtitle-small\">\n <span class=\"step-icon-inner\" aria-hidden=\"true\">\n {this.stepNum}\n </span>\n </ic-typography>\n );\n } else {\n icon = (\n <div class=\"step-icon-inner\" aria-hidden=\"true\">\n <span class=\"check-icon\" innerHTML={checkIcon}></span>\n </div>\n );\n }\n\n // STEP CONNECT FOR DEFAULT STEP\n const partialBar = this.stepType === \"current\" && (\n <div class=\"step-connect-inner\"></div>\n );\n\n const finalStep = !this.lastStep && (\n <div\n class={{\n [\"step-connect\"]: true,\n [\"aligned-full-width\"]:\n this.el.parentElement.classList.contains(\"default\") &&\n !this.el.parentElement.classList.contains(\"aligned-left\"),\n }}\n >\n {partialBar}\n </div>\n );\n\n // DEFAULT STEP COMPONENT\n const defaultStep = (\n <div\n class={{\n [\"step\"]: true,\n [`${this.stepType}`]: true,\n }}\n >\n <div class=\"step-top\">\n <div class=\"step-icon\">{icon}</div>\n {finalStep}\n </div>\n {(this.stepTitle || this.stepSubtitle || this.stepStatus) && (\n <div class=\"step-title-area\">\n {this.stepTitle && (\n <ic-typography variant=\"subtitle-large\" class=\"step-title\">\n {this.stepTitle}\n </ic-typography>\n )}\n {this.stepTitle && (this.stepSubtitle || this.stepStatus) && (\n <ic-typography variant=\"caption\" class=\"step-subtitle\">\n {this.stepSubtitle !== null && this.stepSubtitle !== undefined\n ? this.stepSubtitle\n : stepStatus}\n </ic-typography>\n )}\n </div>\n )}\n </div>\n );\n\n return (\n <Host\n role=\"listitem\"\n aria-label={`Step ${this.stepNum}${ariaLabel}`}\n aria-current={(this.current || this.stepType === \"current\") && \"step\"}\n class={{\n [\"aligned-full-width\"]:\n this.el.parentElement.classList.contains(\"default\") &&\n !this.el.parentElement.classList.contains(\"aligned-left\"),\n [`${this.variant}`]: true,\n }}\n >\n {this.variant === \"compact\" ? compactStep : defaultStep}\n </Host>\n );\n }\n}\n"]}