@helixui/library 3.7.0 → 3.8.0-next.145

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (394) hide show
  1. package/README.md +41 -0
  2. package/aaa-verdicts.json +2036 -0
  3. package/custom-elements.json +1657 -71
  4. package/dist/components/hx-accordion/hx-accordion-item.d.ts.map +1 -1
  5. package/dist/components/hx-accordion/hx-accordion-item.styles.d.ts.map +1 -1
  6. package/dist/components/hx-accordion/index.js +1 -1
  7. package/dist/components/hx-action-bar/hx-action-bar.d.ts +18 -0
  8. package/dist/components/hx-action-bar/hx-action-bar.d.ts.map +1 -1
  9. package/dist/components/hx-action-bar/hx-action-bar.styles.d.ts.map +1 -1
  10. package/dist/components/hx-action-bar/index.js +1 -1
  11. package/dist/components/hx-alert/hx-alert.d.ts +0 -8
  12. package/dist/components/hx-alert/hx-alert.d.ts.map +1 -1
  13. package/dist/components/hx-alert/hx-alert.styles.d.ts.map +1 -1
  14. package/dist/components/hx-alert/index.js +1 -1
  15. package/dist/components/hx-avatar/hx-avatar.d.ts +4 -1
  16. package/dist/components/hx-avatar/hx-avatar.d.ts.map +1 -1
  17. package/dist/components/hx-avatar/hx-avatar.styles.d.ts.map +1 -1
  18. package/dist/components/hx-avatar/index.js +1 -1
  19. package/dist/components/hx-badge/hx-badge.d.ts.map +1 -1
  20. package/dist/components/hx-badge/hx-badge.styles.d.ts.map +1 -1
  21. package/dist/components/hx-badge/index.js +1 -1
  22. package/dist/components/hx-banner/hx-banner.d.ts +19 -8
  23. package/dist/components/hx-banner/hx-banner.d.ts.map +1 -1
  24. package/dist/components/hx-banner/hx-banner.styles.d.ts.map +1 -1
  25. package/dist/components/hx-banner/index.js +1 -1
  26. package/dist/components/hx-breadcrumb/hx-breadcrumb-item.d.ts.map +1 -1
  27. package/dist/components/hx-breadcrumb/hx-breadcrumb-item.styles.d.ts.map +1 -1
  28. package/dist/components/hx-breadcrumb/hx-breadcrumb.d.ts +18 -0
  29. package/dist/components/hx-breadcrumb/hx-breadcrumb.d.ts.map +1 -1
  30. package/dist/components/hx-breadcrumb/index.js +1 -1
  31. package/dist/components/hx-button/hx-button.styles.d.ts.map +1 -1
  32. package/dist/components/hx-button/index.js +1 -1
  33. package/dist/components/hx-button-group/hx-button-group.d.ts +47 -0
  34. package/dist/components/hx-button-group/hx-button-group.d.ts.map +1 -1
  35. package/dist/components/hx-button-group/index.js +1 -1
  36. package/dist/components/hx-carousel/hx-carousel.d.ts.map +1 -1
  37. package/dist/components/hx-carousel/hx-carousel.styles.d.ts.map +1 -1
  38. package/dist/components/hx-carousel/index.js +1 -1
  39. package/dist/components/hx-checkbox/hx-checkbox.d.ts.map +1 -1
  40. package/dist/components/hx-checkbox/hx-checkbox.styles.d.ts.map +1 -1
  41. package/dist/components/hx-checkbox/index.js +1 -1
  42. package/dist/components/hx-checkbox-group/hx-checkbox-group.d.ts +36 -0
  43. package/dist/components/hx-checkbox-group/hx-checkbox-group.d.ts.map +1 -1
  44. package/dist/components/hx-checkbox-group/hx-checkbox-group.styles.d.ts.map +1 -1
  45. package/dist/components/hx-checkbox-group/index.js +1 -1
  46. package/dist/components/hx-clinical-status/hx-clinical-status.d.ts +26 -9
  47. package/dist/components/hx-clinical-status/hx-clinical-status.d.ts.map +1 -1
  48. package/dist/components/hx-clinical-status/hx-clinical-status.styles.d.ts.map +1 -1
  49. package/dist/components/hx-clinical-status/index.js +1 -1
  50. package/dist/components/hx-color-picker/hx-color-picker.d.ts +18 -0
  51. package/dist/components/hx-color-picker/hx-color-picker.d.ts.map +1 -1
  52. package/dist/components/hx-color-picker/hx-color-picker.styles.d.ts.map +1 -1
  53. package/dist/components/hx-color-picker/index.js +1 -1
  54. package/dist/components/hx-combobox/hx-combobox.d.ts +18 -0
  55. package/dist/components/hx-combobox/hx-combobox.d.ts.map +1 -1
  56. package/dist/components/hx-combobox/hx-combobox.styles.d.ts.map +1 -1
  57. package/dist/components/hx-combobox/index.js +1 -1
  58. package/dist/components/hx-copy-button/hx-copy-button.d.ts +18 -0
  59. package/dist/components/hx-copy-button/hx-copy-button.d.ts.map +1 -1
  60. package/dist/components/hx-copy-button/hx-copy-button.styles.d.ts.map +1 -1
  61. package/dist/components/hx-copy-button/index.js +1 -1
  62. package/dist/components/hx-date-picker/hx-date-picker.d.ts +18 -0
  63. package/dist/components/hx-date-picker/hx-date-picker.d.ts.map +1 -1
  64. package/dist/components/hx-date-picker/hx-date-picker.styles.d.ts.map +1 -1
  65. package/dist/components/hx-date-picker/index.js +1 -1
  66. package/dist/components/hx-drawer/hx-drawer.d.ts +18 -0
  67. package/dist/components/hx-drawer/hx-drawer.d.ts.map +1 -1
  68. package/dist/components/hx-drawer/hx-drawer.styles.d.ts.map +1 -1
  69. package/dist/components/hx-drawer/index.js +1 -1
  70. package/dist/components/hx-dropdown/hx-dropdown.d.ts +18 -0
  71. package/dist/components/hx-dropdown/hx-dropdown.d.ts.map +1 -1
  72. package/dist/components/hx-dropdown/hx-dropdown.styles.d.ts.map +1 -1
  73. package/dist/components/hx-dropdown/index.js +1 -1
  74. package/dist/components/hx-field/hx-field.d.ts +17 -0
  75. package/dist/components/hx-field/hx-field.d.ts.map +1 -1
  76. package/dist/components/hx-field-label/hx-field-label.d.ts +17 -0
  77. package/dist/components/hx-field-label/hx-field-label.d.ts.map +1 -1
  78. package/dist/components/hx-file-upload/hx-file-upload.d.ts +46 -0
  79. package/dist/components/hx-file-upload/hx-file-upload.d.ts.map +1 -1
  80. package/dist/components/hx-file-upload/hx-file-upload.styles.d.ts.map +1 -1
  81. package/dist/components/hx-file-upload/index.js +1 -1
  82. package/dist/components/hx-form/hx-form.d.ts +19 -0
  83. package/dist/components/hx-form/hx-form.d.ts.map +1 -1
  84. package/dist/components/hx-help-text/hx-help-text.d.ts +17 -0
  85. package/dist/components/hx-help-text/hx-help-text.d.ts.map +1 -1
  86. package/dist/components/hx-help-text/hx-help-text.styles.d.ts.map +1 -1
  87. package/dist/components/hx-help-text/index.js +1 -1
  88. package/dist/components/hx-icon/hx-icon.d.ts +108 -12
  89. package/dist/components/hx-icon/hx-icon.d.ts.map +1 -1
  90. package/dist/components/hx-icon/hx-icon.styles.d.ts.map +1 -1
  91. package/dist/components/hx-icon/index.js +1 -1
  92. package/dist/components/hx-icon-button/hx-icon-button.d.ts +18 -0
  93. package/dist/components/hx-icon-button/hx-icon-button.d.ts.map +1 -1
  94. package/dist/components/hx-link/hx-link.d.ts.map +1 -1
  95. package/dist/components/hx-link/hx-link.styles.d.ts.map +1 -1
  96. package/dist/components/hx-link/index.js +1 -1
  97. package/dist/components/hx-menu/hx-menu-item.d.ts.map +1 -1
  98. package/dist/components/hx-menu/hx-menu-item.styles.d.ts.map +1 -1
  99. package/dist/components/hx-menu/hx-menu.d.ts +18 -0
  100. package/dist/components/hx-menu/hx-menu.d.ts.map +1 -1
  101. package/dist/components/hx-menu/index.js +1 -1
  102. package/dist/components/hx-nav/hx-nav.d.ts +18 -0
  103. package/dist/components/hx-nav/hx-nav.d.ts.map +1 -1
  104. package/dist/components/hx-nav/hx-nav.styles.d.ts.map +1 -1
  105. package/dist/components/hx-nav/index.js +1 -1
  106. package/dist/components/hx-number-input/hx-number-input.d.ts +18 -0
  107. package/dist/components/hx-number-input/hx-number-input.d.ts.map +1 -1
  108. package/dist/components/hx-number-input/hx-number-input.styles.d.ts.map +1 -1
  109. package/dist/components/hx-number-input/index.js +1 -1
  110. package/dist/components/hx-overflow-menu/hx-overflow-menu.d.ts +23 -1
  111. package/dist/components/hx-overflow-menu/hx-overflow-menu.d.ts.map +1 -1
  112. package/dist/components/hx-overflow-menu/hx-overflow-menu.styles.d.ts.map +1 -1
  113. package/dist/components/hx-overflow-menu/index.js +1 -1
  114. package/dist/components/hx-phi-field/hx-phi-field.d.ts.map +1 -1
  115. package/dist/components/hx-phi-field/hx-phi-field.styles.d.ts.map +1 -1
  116. package/dist/components/hx-phi-field/index.js +1 -1
  117. package/dist/components/hx-popover/hx-popover.d.ts +18 -0
  118. package/dist/components/hx-popover/hx-popover.d.ts.map +1 -1
  119. package/dist/components/hx-popover/hx-popover.styles.d.ts.map +1 -1
  120. package/dist/components/hx-popover/index.js +1 -1
  121. package/dist/components/hx-popup/hx-popup.d.ts +18 -0
  122. package/dist/components/hx-popup/hx-popup.d.ts.map +1 -1
  123. package/dist/components/hx-popup/hx-popup.styles.d.ts.map +1 -1
  124. package/dist/components/hx-popup/index.js +1 -1
  125. package/dist/components/hx-radio-group/hx-radio-group.d.ts +18 -0
  126. package/dist/components/hx-radio-group/hx-radio-group.d.ts.map +1 -1
  127. package/dist/components/hx-radio-group/hx-radio-group.styles.d.ts.map +1 -1
  128. package/dist/components/hx-radio-group/hx-radio.styles.d.ts.map +1 -1
  129. package/dist/components/hx-radio-group/index.js +1 -1
  130. package/dist/components/hx-rating/hx-rating.d.ts +19 -0
  131. package/dist/components/hx-rating/hx-rating.d.ts.map +1 -1
  132. package/dist/components/hx-rating/hx-rating.styles.d.ts.map +1 -1
  133. package/dist/components/hx-rating/index.js +1 -1
  134. package/dist/components/hx-select/hx-select.d.ts +18 -0
  135. package/dist/components/hx-select/hx-select.d.ts.map +1 -1
  136. package/dist/components/hx-side-nav/hx-nav-item.d.ts.map +1 -1
  137. package/dist/components/hx-side-nav/hx-nav-item.styles.d.ts.map +1 -1
  138. package/dist/components/hx-side-nav/hx-side-nav.d.ts +18 -0
  139. package/dist/components/hx-side-nav/hx-side-nav.d.ts.map +1 -1
  140. package/dist/components/hx-side-nav/hx-side-nav.styles.d.ts.map +1 -1
  141. package/dist/components/hx-side-nav/index.js +1 -1
  142. package/dist/components/hx-slider/hx-slider.d.ts +47 -0
  143. package/dist/components/hx-slider/hx-slider.d.ts.map +1 -1
  144. package/dist/components/hx-slider/index.js +1 -1
  145. package/dist/components/hx-split-button/hx-split-button.d.ts +18 -0
  146. package/dist/components/hx-split-button/hx-split-button.d.ts.map +1 -1
  147. package/dist/components/hx-split-button/hx-split-button.styles.d.ts.map +1 -1
  148. package/dist/components/hx-split-button/index.js +1 -1
  149. package/dist/components/hx-stat/hx-stat.d.ts.map +1 -1
  150. package/dist/components/hx-stat/hx-stat.styles.d.ts.map +1 -1
  151. package/dist/components/hx-stat/index.js +1 -1
  152. package/dist/components/hx-steps/hx-step.d.ts.map +1 -1
  153. package/dist/components/hx-steps/hx-step.styles.d.ts.map +1 -1
  154. package/dist/components/hx-steps/index.js +1 -1
  155. package/dist/components/hx-switch/hx-switch.d.ts +18 -0
  156. package/dist/components/hx-switch/hx-switch.d.ts.map +1 -1
  157. package/dist/components/hx-switch/hx-switch.styles.d.ts.map +1 -1
  158. package/dist/components/hx-switch/index.js +1 -1
  159. package/dist/components/hx-tabs/hx-tab.styles.d.ts.map +1 -1
  160. package/dist/components/hx-tabs/hx-tabs.d.ts +18 -0
  161. package/dist/components/hx-tabs/hx-tabs.d.ts.map +1 -1
  162. package/dist/components/hx-tabs/index.js +1 -1
  163. package/dist/components/hx-tag/hx-tag.d.ts.map +1 -1
  164. package/dist/components/hx-tag/hx-tag.styles.d.ts.map +1 -1
  165. package/dist/components/hx-tag/index.js +1 -1
  166. package/dist/components/hx-text-input/hx-text-input.styles.d.ts.map +1 -1
  167. package/dist/components/hx-text-input/index.js +1 -1
  168. package/dist/components/hx-textarea/hx-textarea.d.ts +18 -0
  169. package/dist/components/hx-textarea/hx-textarea.d.ts.map +1 -1
  170. package/dist/components/hx-time-picker/hx-time-picker.d.ts +18 -0
  171. package/dist/components/hx-time-picker/hx-time-picker.d.ts.map +1 -1
  172. package/dist/components/hx-time-picker/hx-time-picker.styles.d.ts.map +1 -1
  173. package/dist/components/hx-time-picker/index.js +1 -1
  174. package/dist/components/hx-toast/hx-toast.d.ts +19 -8
  175. package/dist/components/hx-toast/hx-toast.d.ts.map +1 -1
  176. package/dist/components/hx-toast/hx-toast.styles.d.ts.map +1 -1
  177. package/dist/components/hx-toast/index.js +1 -1
  178. package/dist/components/hx-toggle-button/hx-toggle-button.d.ts +18 -0
  179. package/dist/components/hx-toggle-button/hx-toggle-button.d.ts.map +1 -1
  180. package/dist/components/hx-toggle-button/hx-toggle-button.styles.d.ts.map +1 -1
  181. package/dist/components/hx-toggle-button/index.js +1 -1
  182. package/dist/components/hx-tooltip/hx-tooltip.d.ts +18 -0
  183. package/dist/components/hx-tooltip/hx-tooltip.d.ts.map +1 -1
  184. package/dist/components/hx-tooltip/hx-tooltip.styles.d.ts.map +1 -1
  185. package/dist/components/hx-tooltip/index.js +1 -1
  186. package/dist/components/hx-top-nav/hx-top-nav.d.ts +18 -0
  187. package/dist/components/hx-top-nav/hx-top-nav.d.ts.map +1 -1
  188. package/dist/components/hx-top-nav/hx-top-nav.styles.d.ts.map +1 -1
  189. package/dist/components/hx-top-nav/index.js +1 -1
  190. package/dist/components/hx-tree-view/hx-tree-item.d.ts.map +1 -1
  191. package/dist/components/hx-tree-view/hx-tree-item.styles.d.ts.map +1 -1
  192. package/dist/components/hx-tree-view/index.js +1 -1
  193. package/dist/css/helix-all.css +355 -84
  194. package/dist/css/helix-core.css +23 -5
  195. package/dist/css/helix-feedback.css +15 -18
  196. package/dist/css/helix-forms.css +139 -27
  197. package/dist/css/helix-media.css +6 -3
  198. package/dist/css/helix-navigation.css +59 -9
  199. package/dist/css/helix-overlay.css +63 -0
  200. package/dist/css/helix-tokens.css +16 -14
  201. package/dist/css/helix-utility.css +44 -12
  202. package/dist/css/hx-action-bar.css +12 -0
  203. package/dist/css/hx-alert.css +4 -8
  204. package/dist/css/hx-avatar.css +1 -2
  205. package/dist/css/hx-badge.css +5 -0
  206. package/dist/css/hx-banner.css +4 -8
  207. package/dist/css/hx-button.css +4 -1
  208. package/dist/css/hx-carousel.css +6 -3
  209. package/dist/css/hx-checkbox-group.css +11 -0
  210. package/dist/css/hx-checkbox.css +14 -9
  211. package/dist/css/hx-clinical-status.css +4 -7
  212. package/dist/css/hx-color-picker.css +14 -1
  213. package/dist/css/hx-combobox.css +8 -0
  214. package/dist/css/hx-copy-button.css +5 -2
  215. package/dist/css/hx-date-picker.css +11 -1
  216. package/dist/css/hx-drawer.css +5 -0
  217. package/dist/css/hx-dropdown.css +18 -0
  218. package/dist/css/hx-file-upload.css +4 -0
  219. package/dist/css/hx-help-text.css +5 -0
  220. package/dist/css/hx-icon.css +7 -0
  221. package/dist/css/hx-link.css +1 -2
  222. package/dist/css/hx-nav.css +31 -2
  223. package/dist/css/hx-number-input.css +10 -11
  224. package/dist/css/hx-overflow-menu.css +5 -0
  225. package/dist/css/hx-phi-field.css +2 -3
  226. package/dist/css/hx-popover.css +13 -0
  227. package/dist/css/hx-popup.css +14 -0
  228. package/dist/css/hx-radio-group.css +10 -0
  229. package/dist/css/hx-rating.css +6 -0
  230. package/dist/css/hx-side-nav.css +10 -5
  231. package/dist/css/hx-split-button.css +27 -10
  232. package/dist/css/hx-stat.css +1 -2
  233. package/dist/css/hx-switch.css +19 -1
  234. package/dist/css/hx-tag.css +5 -0
  235. package/dist/css/hx-text-input.css +4 -1
  236. package/dist/css/hx-time-picker.css +12 -2
  237. package/dist/css/hx-toast.css +6 -0
  238. package/dist/css/hx-toggle-button.css +11 -1
  239. package/dist/css/hx-tooltip.css +13 -0
  240. package/dist/css/hx-top-nav.css +13 -2
  241. package/dist/css/index.css +1 -1
  242. package/dist/css/manifest.json +43 -12
  243. package/dist/index.js +47 -47
  244. package/dist/shared/{hx-accordion-ZVzgDzTG.js → hx-accordion-DR--Ev4t.js} +48 -54
  245. package/dist/shared/hx-accordion-DR--Ev4t.js.map +1 -0
  246. package/dist/shared/{hx-action-bar-CitgcpGv.js → hx-action-bar-BlEG4aZv.js} +41 -29
  247. package/dist/shared/hx-action-bar-BlEG4aZv.js.map +1 -0
  248. package/dist/shared/{hx-alert-Bto8-TIi.js → hx-alert-C0axS32J.js} +40 -79
  249. package/dist/shared/hx-alert-C0axS32J.js.map +1 -0
  250. package/dist/shared/{hx-avatar-C9hOmlAb.js → hx-avatar-ChAYWnK8.js} +22 -24
  251. package/dist/shared/hx-avatar-ChAYWnK8.js.map +1 -0
  252. package/dist/shared/{hx-badge-DFL35nzi.js → hx-badge-vX-1cuLA.js} +16 -11
  253. package/dist/shared/hx-badge-vX-1cuLA.js.map +1 -0
  254. package/dist/shared/{hx-banner-fpRnciIO.js → hx-banner-PbHwFNSb.js} +51 -90
  255. package/dist/shared/hx-banner-PbHwFNSb.js.map +1 -0
  256. package/dist/shared/{hx-breadcrumb-item-3tKppF9h.js → hx-breadcrumb-item-D8xYqe3s.js} +56 -43
  257. package/dist/shared/hx-breadcrumb-item-D8xYqe3s.js.map +1 -0
  258. package/dist/shared/{hx-button-rRNmD4fd.js → hx-button-DOZTZnz-.js} +18 -15
  259. package/dist/shared/hx-button-DOZTZnz-.js.map +1 -0
  260. package/dist/shared/hx-button-group-D3QUmSzl.js +248 -0
  261. package/dist/shared/hx-button-group-D3QUmSzl.js.map +1 -0
  262. package/dist/shared/{hx-carousel-item-z1Lc24op.js → hx-carousel-item-BVIKgQ4i.js} +72 -102
  263. package/dist/shared/hx-carousel-item-BVIKgQ4i.js.map +1 -0
  264. package/dist/shared/{hx-checkbox-hPlIw6Lb.js → hx-checkbox-DDSXXhps.js} +33 -30
  265. package/dist/shared/hx-checkbox-DDSXXhps.js.map +1 -0
  266. package/dist/shared/{hx-checkbox-group-D5piJLY8.js → hx-checkbox-group-C0q6HDqn.js} +101 -58
  267. package/dist/shared/hx-checkbox-group-C0q6HDqn.js.map +1 -0
  268. package/dist/shared/{hx-clinical-status-D3XQIOqX.js → hx-clinical-status-ZSVEc3Qg.js} +68 -87
  269. package/dist/shared/hx-clinical-status-ZSVEc3Qg.js.map +1 -0
  270. package/dist/shared/{hx-color-picker-DBwJzT5f.js → hx-color-picker-CYjx8i8R.js} +97 -84
  271. package/dist/shared/hx-color-picker-CYjx8i8R.js.map +1 -0
  272. package/dist/shared/{hx-combobox-NgJaLbs2.js → hx-combobox-Be-mqOv4.js} +35 -45
  273. package/dist/shared/hx-combobox-Be-mqOv4.js.map +1 -0
  274. package/dist/shared/{hx-copy-button-sUVuikyH.js → hx-copy-button-DJirFCUL.js} +18 -15
  275. package/dist/shared/hx-copy-button-DJirFCUL.js.map +1 -0
  276. package/dist/shared/{hx-date-picker-DSKDkCy1.js → hx-date-picker-CziP3Hm1.js} +80 -82
  277. package/dist/shared/hx-date-picker-CziP3Hm1.js.map +1 -0
  278. package/dist/shared/{hx-drawer-CM_upadk.js → hx-drawer-BlU2oX8-.js} +32 -36
  279. package/dist/shared/hx-drawer-BlU2oX8-.js.map +1 -0
  280. package/dist/shared/{hx-dropdown-D626S2ZG.js → hx-dropdown-DREqpIpm.js} +51 -33
  281. package/dist/shared/hx-dropdown-DREqpIpm.js.map +1 -0
  282. package/dist/shared/hx-field-label-BVRyyKeh.js.map +1 -1
  283. package/dist/shared/hx-field-zw0U1KVi.js.map +1 -1
  284. package/dist/shared/{hx-file-upload-D3rKROK5.js → hx-file-upload-CU5QGZSP.js} +137 -80
  285. package/dist/shared/hx-file-upload-CU5QGZSP.js.map +1 -0
  286. package/dist/shared/hx-form-CkChEATa.js.map +1 -1
  287. package/dist/shared/hx-help-text-CNaZ82LT.js +137 -0
  288. package/dist/shared/hx-help-text-CNaZ82LT.js.map +1 -0
  289. package/dist/shared/hx-icon-button-B2BdVdyK.js.map +1 -1
  290. package/dist/shared/hx-icon-bxz9eB9a.js +386 -0
  291. package/dist/shared/hx-icon-bxz9eB9a.js.map +1 -0
  292. package/dist/shared/{hx-link-CMnZRUtQ.js → hx-link-BURSdYLp.js} +19 -26
  293. package/dist/shared/hx-link-BURSdYLp.js.map +1 -0
  294. package/dist/shared/{hx-menu-divider-A6Guuzi_.js → hx-menu-divider-g0grbWV9.js} +19 -31
  295. package/dist/shared/hx-menu-divider-g0grbWV9.js.map +1 -0
  296. package/dist/shared/{hx-nav-ldFM3Fle.js → hx-nav-GTsAZGOx.js} +94 -85
  297. package/dist/shared/hx-nav-GTsAZGOx.js.map +1 -0
  298. package/dist/shared/{hx-nav-item-CODtUlew.js → hx-nav-item-CxE7Mp3M.js} +46 -41
  299. package/dist/shared/hx-nav-item-CxE7Mp3M.js.map +1 -0
  300. package/dist/shared/{hx-number-input-yUzFOSC1.js → hx-number-input-Bvyc9kOi.js} +59 -64
  301. package/dist/shared/hx-number-input-Bvyc9kOi.js.map +1 -0
  302. package/dist/shared/{hx-overflow-menu-DFjJAziP.js → hx-overflow-menu-LrTteeR1.js} +32 -39
  303. package/dist/shared/{hx-overflow-menu-DFjJAziP.js.map → hx-overflow-menu-LrTteeR1.js.map} +1 -1
  304. package/dist/shared/{hx-phi-field-C19oxlrr.js → hx-phi-field-sZt_rYIL.js} +46 -66
  305. package/dist/shared/hx-phi-field-sZt_rYIL.js.map +1 -0
  306. package/dist/shared/{hx-popover-BAlAFOH9.js → hx-popover-BjB0nkcq.js} +51 -38
  307. package/dist/shared/hx-popover-BjB0nkcq.js.map +1 -0
  308. package/dist/shared/{hx-popup-COUXXZ9X.js → hx-popup-BiV_2evC.js} +59 -45
  309. package/dist/shared/hx-popup-BiV_2evC.js.map +1 -0
  310. package/dist/shared/{hx-radio-CY4kQfZw.js → hx-radio-BD_c9NJy.js} +83 -70
  311. package/dist/shared/hx-radio-BD_c9NJy.js.map +1 -0
  312. package/dist/shared/{hx-rating-C3QP53k9.js → hx-rating-BGK4AxvI.js} +45 -71
  313. package/dist/shared/hx-rating-BGK4AxvI.js.map +1 -0
  314. package/dist/shared/hx-select-DahFehiZ.js.map +1 -1
  315. package/dist/shared/{hx-slider-Blmv_rwS.js → hx-slider-CkOk5BCY.js} +83 -23
  316. package/dist/shared/hx-slider-CkOk5BCY.js.map +1 -0
  317. package/dist/shared/{hx-split-button-Ddle8iVx.js → hx-split-button-Bg9FHrFK.js} +73 -65
  318. package/dist/shared/hx-split-button-Bg9FHrFK.js.map +1 -0
  319. package/dist/shared/{hx-stat-Gtw_SpK8.js → hx-stat-wKxbyep6.js} +22 -55
  320. package/dist/shared/hx-stat-wKxbyep6.js.map +1 -0
  321. package/dist/shared/{hx-step-CUzliIK_.js → hx-step-CyGQAuiB.js} +5 -25
  322. package/dist/shared/hx-step-CyGQAuiB.js.map +1 -0
  323. package/dist/shared/{hx-switch-TvKGvZJz.js → hx-switch-BCXuNxEH.js} +42 -24
  324. package/dist/shared/hx-switch-BCXuNxEH.js.map +1 -0
  325. package/dist/shared/{hx-tab-panel-DzsX8BHV.js → hx-tab-panel-BfisavKo.js} +47 -32
  326. package/dist/shared/hx-tab-panel-BfisavKo.js.map +1 -0
  327. package/dist/shared/{hx-tag-C5aCUpVi.js → hx-tag-BqO6HY6V.js} +26 -21
  328. package/dist/shared/hx-tag-BqO6HY6V.js.map +1 -0
  329. package/dist/shared/{hx-text-input-D6FlOZM-.js → hx-text-input-V5sQOpDh.js} +5 -2
  330. package/dist/shared/hx-text-input-V5sQOpDh.js.map +1 -0
  331. package/dist/shared/hx-textarea-CNG590KY.js.map +1 -1
  332. package/dist/shared/{hx-time-picker-Bo7FWzmf.js → hx-time-picker-if5Cl0Ei.js} +42 -43
  333. package/dist/shared/hx-time-picker-if5Cl0Ei.js.map +1 -0
  334. package/dist/shared/{hx-toggle-button-DSJeFlb0.js → hx-toggle-button-xNVYeA3X.js} +37 -27
  335. package/dist/shared/hx-toggle-button-xNVYeA3X.js.map +1 -0
  336. package/dist/shared/{hx-tooltip-DVqtKPCD.js → hx-tooltip-CamO-9nd.js} +24 -11
  337. package/dist/shared/hx-tooltip-CamO-9nd.js.map +1 -0
  338. package/dist/shared/{hx-top-nav-DP6OFS8C.js → hx-top-nav-vP6oDWMV.js} +42 -44
  339. package/dist/shared/hx-top-nav-vP6oDWMV.js.map +1 -0
  340. package/dist/shared/{hx-tree-item-CXyspGxI.js → hx-tree-item-D8hwKd5m.js} +54 -57
  341. package/dist/shared/hx-tree-item-D8hwKd5m.js.map +1 -0
  342. package/dist/shared/{toast-factory-Dht3pVsw.js → toast-factory-DgnbFxVs.js} +127 -153
  343. package/dist/shared/toast-factory-DgnbFxVs.js.map +1 -0
  344. package/figma-inventory.json +1166 -411
  345. package/package.json +8 -4
  346. package/dist/shared/hx-accordion-ZVzgDzTG.js.map +0 -1
  347. package/dist/shared/hx-action-bar-CitgcpGv.js.map +0 -1
  348. package/dist/shared/hx-alert-Bto8-TIi.js.map +0 -1
  349. package/dist/shared/hx-avatar-C9hOmlAb.js.map +0 -1
  350. package/dist/shared/hx-badge-DFL35nzi.js.map +0 -1
  351. package/dist/shared/hx-banner-fpRnciIO.js.map +0 -1
  352. package/dist/shared/hx-breadcrumb-item-3tKppF9h.js.map +0 -1
  353. package/dist/shared/hx-button-group-4NUBpkyC.js +0 -181
  354. package/dist/shared/hx-button-group-4NUBpkyC.js.map +0 -1
  355. package/dist/shared/hx-button-rRNmD4fd.js.map +0 -1
  356. package/dist/shared/hx-carousel-item-z1Lc24op.js.map +0 -1
  357. package/dist/shared/hx-checkbox-group-D5piJLY8.js.map +0 -1
  358. package/dist/shared/hx-checkbox-hPlIw6Lb.js.map +0 -1
  359. package/dist/shared/hx-clinical-status-D3XQIOqX.js.map +0 -1
  360. package/dist/shared/hx-color-picker-DBwJzT5f.js.map +0 -1
  361. package/dist/shared/hx-combobox-NgJaLbs2.js.map +0 -1
  362. package/dist/shared/hx-copy-button-sUVuikyH.js.map +0 -1
  363. package/dist/shared/hx-date-picker-DSKDkCy1.js.map +0 -1
  364. package/dist/shared/hx-drawer-CM_upadk.js.map +0 -1
  365. package/dist/shared/hx-dropdown-D626S2ZG.js.map +0 -1
  366. package/dist/shared/hx-file-upload-D3rKROK5.js.map +0 -1
  367. package/dist/shared/hx-help-text-Xb2Yr8x2.js +0 -156
  368. package/dist/shared/hx-help-text-Xb2Yr8x2.js.map +0 -1
  369. package/dist/shared/hx-icon-fuVm4-bk.js +0 -283
  370. package/dist/shared/hx-icon-fuVm4-bk.js.map +0 -1
  371. package/dist/shared/hx-link-CMnZRUtQ.js.map +0 -1
  372. package/dist/shared/hx-menu-divider-A6Guuzi_.js.map +0 -1
  373. package/dist/shared/hx-nav-item-CODtUlew.js.map +0 -1
  374. package/dist/shared/hx-nav-ldFM3Fle.js.map +0 -1
  375. package/dist/shared/hx-number-input-yUzFOSC1.js.map +0 -1
  376. package/dist/shared/hx-phi-field-C19oxlrr.js.map +0 -1
  377. package/dist/shared/hx-popover-BAlAFOH9.js.map +0 -1
  378. package/dist/shared/hx-popup-COUXXZ9X.js.map +0 -1
  379. package/dist/shared/hx-radio-CY4kQfZw.js.map +0 -1
  380. package/dist/shared/hx-rating-C3QP53k9.js.map +0 -1
  381. package/dist/shared/hx-slider-Blmv_rwS.js.map +0 -1
  382. package/dist/shared/hx-split-button-Ddle8iVx.js.map +0 -1
  383. package/dist/shared/hx-stat-Gtw_SpK8.js.map +0 -1
  384. package/dist/shared/hx-step-CUzliIK_.js.map +0 -1
  385. package/dist/shared/hx-switch-TvKGvZJz.js.map +0 -1
  386. package/dist/shared/hx-tab-panel-DzsX8BHV.js.map +0 -1
  387. package/dist/shared/hx-tag-C5aCUpVi.js.map +0 -1
  388. package/dist/shared/hx-text-input-D6FlOZM-.js.map +0 -1
  389. package/dist/shared/hx-time-picker-Bo7FWzmf.js.map +0 -1
  390. package/dist/shared/hx-toggle-button-DSJeFlb0.js.map +0 -1
  391. package/dist/shared/hx-tooltip-DVqtKPCD.js.map +0 -1
  392. package/dist/shared/hx-top-nav-DP6OFS8C.js.map +0 -1
  393. package/dist/shared/hx-tree-item-CXyspGxI.js.map +0 -1
  394. package/dist/shared/toast-factory-Dht3pVsw.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"hx-overflow-menu-DFjJAziP.js","sources":["../../src/components/hx-overflow-menu/hx-overflow-menu.styles.ts","../../src/components/hx-overflow-menu/hx-overflow-menu.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixOverflowMenuStyles = css`\n :host {\n display: inline-block;\n position: relative;\n }\n\n :host([disabled]) {\n pointer-events: none;\n opacity: var(--hx-opacity-disabled, 0.5);\n }\n\n /* ─── Trigger Button ─── */\n\n .trigger {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border: var(--hx-border-width-thin, 1px) solid transparent;\n border-radius: var(--hx-border-radius-md, 0.375rem);\n background-color: transparent;\n color: var(--hx-overflow-menu-button-color, var(--hx-color-text-secondary, #313e4b));\n cursor: pointer;\n transition:\n background-color var(--hx-transition-fast, 150ms ease),\n color var(--hx-transition-fast, 150ms ease);\n flex-shrink: 0;\n padding: 0;\n line-height: 1;\n }\n\n .trigger:focus-visible {\n outline: var(--hx-focus-ring-width, 2px) solid\n var(--hx-overflow-menu-focus-ring-color, var(--hx-focus-ring-color, #0f7078));\n outline-offset: var(--hx-focus-ring-offset, 2px);\n }\n\n .trigger:hover:not([disabled]) {\n background-color: var(\n --hx-overflow-menu-trigger-hover-bg,\n var(--hx-color-surface-sunken, #ebeee9)\n );\n }\n\n .trigger--open {\n background-color: var(\n --hx-overflow-menu-trigger-open-bg,\n var(--hx-color-surface-sunken, #ebeee9)\n );\n }\n\n /* ─── Size Variants ─── */\n\n .trigger--sm {\n width: var(--hx-size-8, 2rem);\n height: var(--hx-size-8, 2rem);\n min-width: var(--hx-size-touch-target, 2.75rem);\n min-height: var(--hx-size-touch-target, 2.75rem);\n font-size: var(--hx-font-size-sm, 0.875rem);\n }\n\n .trigger--md {\n width: var(--hx-size-10, 2.5rem);\n height: var(--hx-size-10, 2.5rem);\n min-width: var(--hx-size-touch-target, 2.75rem);\n min-height: var(--hx-size-touch-target, 2.75rem);\n font-size: var(--hx-font-size-md, 1rem);\n }\n\n .trigger--lg {\n width: var(--hx-size-12, 3rem);\n height: var(--hx-size-12, 3rem);\n font-size: var(--hx-font-size-lg, 1.125rem);\n }\n\n /* ─── Panel ─── */\n\n .panel {\n position: fixed;\n z-index: var(--hx-overflow-menu-panel-z-index, 1000);\n min-width: var(--hx-overflow-menu-panel-min-width, 160px);\n background: var(--hx-overflow-menu-panel-bg, var(--hx-color-surface-default, #ffffff));\n border: var(--hx-overflow-menu-panel-border, 1px solid var(--hx-color-border-default, #d6dbd5));\n border-radius: var(\n --hx-overflow-menu-panel-border-radius,\n var(--hx-border-radius-md, 0.375rem)\n );\n box-shadow: var(\n --hx-overflow-menu-panel-shadow,\n 0 4px 16px var(--hx-overlay-black-12, rgba(0, 0, 0, 0.12))\n );\n padding: var(--hx-space-1, 0.25rem) 0;\n outline: none;\n }\n\n /* ─── Slot: menu items ─── */\n\n ::slotted([role='menuitem']),\n ::slotted([role='menuitemcheckbox']),\n ::slotted([role='menuitemradio']) {\n display: block;\n width: 100%;\n padding: var(--hx-space-2, 0.5rem) var(--hx-space-3, 0.75rem);\n background: none;\n border: none;\n text-align: start;\n font-size: var(--hx-font-size-sm, 0.875rem);\n color: var(--hx-overflow-menu-item-color, var(--hx-color-text-primary, #0d1825));\n cursor: pointer;\n white-space: nowrap;\n box-sizing: border-box;\n }\n\n ::slotted([role='menuitem']:hover),\n ::slotted([role='menuitemcheckbox']:hover),\n ::slotted([role='menuitemradio']:hover) {\n background-color: var(\n --hx-overflow-menu-item-hover-bg,\n var(--hx-color-surface-raised, #f5f8f3)\n );\n }\n\n ::slotted([role='menuitem']:focus-visible),\n ::slotted([role='menuitemcheckbox']:focus-visible),\n ::slotted([role='menuitemradio']:focus-visible) {\n outline: var(--hx-focus-ring-width, 2px) solid\n var(--hx-overflow-menu-focus-ring-color, var(--hx-focus-ring-color, #0f7078));\n outline-offset: 0;\n }\n\n /* ─── Reduced Motion ─── */\n\n @media (prefers-reduced-motion: reduce) {\n .trigger {\n transition: none;\n }\n }\n\n /* ─── High Contrast Mode (forced-colors) ─── */\n\n @media (forced-colors: active) {\n .trigger {\n forced-color-adjust: none;\n background-color: ButtonFace;\n color: ButtonText;\n border: 2px solid ButtonText;\n }\n\n .trigger:focus-visible {\n outline: 3px solid Highlight;\n outline-offset: 2px;\n }\n\n .trigger[disabled] {\n color: GrayText;\n border-color: GrayText;\n opacity: 1;\n }\n\n :host([disabled]) {\n opacity: 1;\n }\n\n .panel {\n background-color: Canvas;\n border: 2px solid CanvasText;\n }\n }\n`;\n","import { html, nothing, type PropertyValues } from 'lit';\nimport '../../utilities/document-token-adoption.js';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\n\nimport { HelixElement, createIdCounter } from '../../base/index.js';\nimport { forcedColorsInteractive } from '../../styles/forced-colors.js';\nimport { helixOverflowMenuStyles } from './hx-overflow-menu.styles.js';\nimport { flattenAccName } from '../../utils/aria-flatten.js';\nimport { getMenuItemTypeaheadLabel } from '../../utils/menu-label.js';\nimport { writeMenuItemRovingTabIndex } from '../../utils/menu-roving.js';\nimport { findClosestMenuAncestor } from '../../utils/menu-tree.js';\nimport {\n installAriaIdrefMirror,\n resolveIdrefTokens,\n type AriaIdrefMirrorHandle,\n} from '../../utils/aria-idref.js';\n\nconst _nextOverflowMenuId = createIdCounter('hx-overflow-menu');\n\n/**\n * An overflow menu (kebab/meatball menu) that reveals hidden actions via a\n * floating panel. Composed from a trigger button and a slotted menu panel.\n *\n * ## Architecture Note: Host-Attribute Trigger Label Mirror (group-5b)\n *\n * The composite has TWO ARIA-bearing surfaces inside its shadow DOM: the\n * trigger button (`role` defaulted from `<button>`, with `aria-haspopup`,\n * `aria-expanded`, `aria-controls`) and the panel (`role=\"menu\"` on the\n * inner div). The host wraps both — it cannot carry either canonical role\n * itself, so role placement remains on the inner elements.\n *\n * What Group 5b adds:\n * - **Roving tabindex** on slotted menu items (only the focused item has\n * tabindex=0; arrow keys move focus and rewrite tabindex). Closing-Tab\n * path is preserved (Tab moves focus past the menu and closes it).\n * - **First-character typeahead** with 500ms timeout matching `hx-menu`.\n * - **Host-attribute label mirror**: consumer-supplied `aria-label` /\n * `aria-labelledby` on the host flow to the trigger button's\n * `aria-label` (the trigger is the announced surface of the disclosure\n * pattern; consumer override wins over the `label` property). The panel\n * continues to use `labelMenu` for its own slot label.\n *\n * @summary \"...\" or kebab icon button that reveals hidden actions.\n *\n * @tag hx-overflow-menu\n *\n * @slot - Menu items (e.g. `<button role=\"menuitem\">` or `<hx-menu-item>` elements).\n *\n * @fires {CustomEvent<{value: string}>} hx-select - Dispatched when a menu item is selected.\n * @fires {CustomEvent<void>} hx-show - Dispatched when the panel opens.\n * @fires {CustomEvent<void>} hx-hide - Dispatched when the panel closes.\n *\n * @csspart button - The trigger icon button element.\n * @csspart trigger - Alias for button — the trigger icon button element.\n * @csspart panel - The floating menu panel container.\n * @csspart menu - Alias for panel — the floating menu panel container.\n *\n * @cssprop [--hx-overflow-menu-panel-bg=var(--hx-color-neutral-0,#fff)] - Panel background color.\n * @cssprop [--hx-overflow-menu-panel-border=1px solid var(--hx-color-neutral-200,#e5e7eb)] - Panel border.\n * @cssprop [--hx-overflow-menu-panel-border-radius=var(--hx-border-radius-md)] - Panel border radius.\n * @cssprop [--hx-overflow-menu-panel-shadow=0 4px 16px rgba(0,0,0,0.12)] - Panel box shadow.\n * @cssprop [--hx-overflow-menu-panel-min-width=160px] - Minimum panel width.\n * @cssprop [--hx-overflow-menu-panel-z-index=1000] - Panel z-index.\n * @cssprop [--hx-overflow-menu-button-color=var(--hx-color-neutral-600)] - Trigger icon color.\n *\n * @example\n * ```html\n * <hx-overflow-menu>\n * <button role=\"menuitem\">Edit</button>\n * <button role=\"menuitem\">Delete</button>\n * </hx-overflow-menu>\n * ```\n * @cssprop [--hx-opacity-disabled] - Opacity.\n * @cssprop [--hx-border-width-thin] - Width.\n * @cssprop [--hx-border-radius-md] - CSS custom property.\n * @cssprop [--hx-color-neutral-600] - Color.\n * @cssprop [--hx-transition-fast] - Transition timing.\n * @cssprop [--hx-focus-ring-width] - Width.\n * @cssprop [--hx-overflow-menu-focus-ring-color] - Color.\n * @cssprop [--hx-focus-ring-color] - Color.\n * @cssprop [--hx-color-primary-500] - Color.\n * @cssprop [--hx-focus-ring-offset] - CSS custom property.\n * @cssprop [--hx-color-neutral-100] - Color.\n * @cssprop [--hx-size-8] - Size token.\n * @cssprop [--hx-size-touch-target] - Size token.\n * @cssprop [--hx-font-size-sm] - Font size.\n * @cssprop [--hx-size-10] - Size token.\n * @cssprop [--hx-font-size-md] - Font size.\n * @cssprop [--hx-size-12] - Size token.\n * @cssprop [--hx-font-size-lg] - Font size.\n * @cssprop [--hx-color-neutral-0] - Color.\n * @cssprop [--hx-color-neutral-200] - Color.\n * @cssprop [--hx-overlay-black-12] - Overlay color.\n * @cssprop [--hx-space-1] - Spacing token.\n * @cssprop [--hx-space-2] - Spacing token.\n * @cssprop [--hx-space-3] - Spacing token.\n * @cssprop [--hx-color-neutral-900] - Color.\n * @cssprop [--hx-color-neutral-50] - Color.\n */\n@customElement('hx-overflow-menu')\nexport class HelixOverflowMenu extends HelixElement {\n static override styles = [helixOverflowMenuStyles, forcedColorsInteractive];\n\n /**\n * Preferred placement of the floating panel relative to the trigger.\n * @attr placement\n */\n @property({ type: String, reflect: true })\n placement:\n | 'top'\n | 'top-start'\n | 'top-end'\n | 'bottom'\n | 'bottom-start'\n | 'bottom-end'\n | 'left'\n | 'left-start'\n | 'left-end'\n | 'right'\n | 'right-start'\n | 'right-end' = 'bottom-end';\n\n /**\n * Size of the trigger button.\n * @attr hx-size\n */\n @property({ type: String, reflect: true, attribute: 'hx-size' })\n size: 'sm' | 'md' | 'lg' = 'md';\n\n /**\n * Whether the trigger button is disabled.\n * @attr disabled\n */\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /**\n * Icon orientation: vertical (kebab ⋮) or horizontal (meatball ···).\n * @attr icon\n */\n @property({ type: String, reflect: true })\n icon: 'vertical' | 'horizontal' = 'vertical';\n\n /**\n * Accessible label for the trigger button. Used as a fallback when no\n * consumer-supplied `aria-label` / `aria-labelledby` is present on the\n * host. Consumer host attributes win in the AccName 1.2 §4.3.1 cascade.\n * @attr label\n */\n @property({ type: String, reflect: true })\n label = 'More actions';\n\n /**\n * Accessible label for the menu panel. Reflected as `label-menu`.\n * @attr label-menu\n */\n @property({ type: String, reflect: true, attribute: 'label-menu' })\n labelMenu = 'Actions';\n\n /**\n * Tracks whether the overflow menu panel is currently open and visible.\n * @internal\n */\n @state() private _open = false;\n\n /**\n * Resolved accessible name for the trigger button — written to the inner\n * button's `aria-label`. Recomputed via the host-attribute mirror on\n * every aria-* mutation. AccName 1.2 §4.3.1 precedence: host\n * `aria-labelledby` (flattened) > host `aria-label` > `label` property.\n * @internal\n */\n @state() private _resolvedTriggerLabel = '';\n\n /**\n * Index within `_getMenuItems()` of the item currently holding the\n * roving tabindex (and thus visual focus). −1 means the panel has not\n * been keyboard-focused yet (first key press lands on item 0).\n * @internal\n */\n private _rovingIndex = -1;\n\n /**\n * Accumulated character buffer for typeahead search within menu items.\n * @internal\n */\n private _typeaheadBuffer = '';\n\n /**\n * Timer handle that clears the typeahead buffer after a period of inactivity.\n * @internal\n */\n private _typeaheadTimer: ReturnType<typeof setTimeout> | null = null;\n\n /**\n * Handle for the shared host attribute / root id observer.\n * @internal\n */\n private _ariaMirror: AriaIdrefMirrorHandle | null = null;\n\n /**\n * Unique ID for the floating panel element, used to wire aria-controls on the trigger button.\n * @internal\n */\n private readonly _panelId = `${_nextOverflowMenuId()}-panel`;\n\n /** @internal */\n @query('[part~=\"button\"]') private _buttonEl!: HTMLButtonElement | null;\n\n /** @internal */\n @query('[part~=\"panel\"]') private _panelEl!: HTMLElement | null;\n\n // ─── Lifecycle ───\n\n override connectedCallback(): void {\n super.connectedCallback();\n document.addEventListener('click', this._handleDocumentClick, true);\n this.addEventListener('keydown', this._handleKeydown);\n this._syncResolvedTriggerLabel();\n this._ariaMirror = installAriaIdrefMirror(this, () => {\n this._syncResolvedTriggerLabel();\n });\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n document.removeEventListener('click', this._handleDocumentClick, true);\n this.removeEventListener('keydown', this._handleKeydown);\n if (this._typeaheadTimer !== null) {\n clearTimeout(this._typeaheadTimer);\n this._typeaheadTimer = null;\n }\n this._ariaMirror?.disconnect();\n this._ariaMirror = null;\n }\n\n override willUpdate(changedProperties: PropertyValues<this>): void {\n super.willUpdate(changedProperties);\n if (changedProperties.has('label')) {\n this._syncResolvedTriggerLabel();\n }\n }\n\n // ─── Open / Close ───\n\n /** @internal */\n private async _show(): Promise<void> {\n if (this._open || this.disabled) return;\n this._open = true;\n await this.updateComplete;\n await this._updatePosition();\n this._initRovingTabIndex();\n this._focusFirstItem();\n this.dispatchEvent(new CustomEvent<void>('hx-show', { bubbles: true, composed: true }));\n }\n\n /** @internal */\n private _hide(): void {\n if (!this._open) return;\n this._open = false;\n this._rovingIndex = -1;\n this.dispatchEvent(new CustomEvent<void>('hx-hide', { bubbles: true, composed: true }));\n }\n\n /** @internal */\n private _toggle(): void {\n if (this._open) {\n this._hide();\n } else {\n void this._show();\n }\n }\n\n // ─── Positioning (Floating UI) ───\n\n /** @internal */\n private async _updatePosition(): Promise<void> {\n const trigger = this._buttonEl as HTMLElement | null;\n const panel = this._panelEl;\n if (!trigger || !panel) return;\n\n const { computePosition, flip, shift, offset } = await import('@floating-ui/dom');\n const { x, y } = await computePosition(trigger, panel, {\n placement: this.placement,\n strategy: 'fixed',\n middleware: [offset(4), flip(), shift({ padding: 8 })],\n });\n\n Object.assign(panel.style, {\n left: `${x}px`,\n top: `${y}px`,\n });\n }\n\n // ─── Focus management ───\n\n /** @internal */\n private _focusFirstItem(): void {\n const items = this._getMenuItems();\n if (items.length === 0) return;\n this._rovingIndex = 0;\n this._applyRovingTabIndex();\n items[0]?.focus();\n }\n\n /**\n * Codex push-gate round-2 finding 3: write the roving tabindex through\n * the right surface for each item shape. Implementation moved to the\n * shared `writeMenuItemRovingTabIndex` util (round-8 finding 2) so\n * `hx-dropdown` and any future host-canonical menu shape route through\n * one source of truth instead of duplicating the host-vs-inner-element\n * branch per component.\n *\n * - `hx-menu-item` is host-canonical: on the modern path the roving\n * tabindex must land on the host (it carries the announced role +\n * IDL ARIA), and on the fallback path it must land on the inner\n * `.menu-item` (the host is forced to `tabindex=-1` so there is\n * exactly one focusable surface per item). The util's\n * `setRovingTabIndex(value)` route handles both paths internally.\n * - Plain slotted `[role=\"menuitem\"]` elements (legacy `<button>`-style\n * children) keep the direct `item.tabIndex = value` write.\n *\n * Without this routing, host-canonical items on the fallback path stay\n * at `tabindex=-1` because the host write never reaches the inner\n * focusable surface — Tab would land on a non-focusable host and arrow\n * navigation would fail to advance the announced item.\n * @internal\n */\n\n /**\n * Initialize roving tabindex on all enabled menu items: only the first\n * receives tabindex=0; the rest are tabindex=-1. Maintains the closing-\n * Tab semantics required by APG (tabbing past the menu closes it via\n * the keydown handler below).\n * @internal\n */\n private _initRovingTabIndex(): void {\n const items = this._getMenuItems();\n items.forEach((item, i) => {\n writeMenuItemRovingTabIndex(item, i === 0 ? 0 : -1);\n });\n this._rovingIndex = items.length > 0 ? 0 : -1;\n }\n\n /** @internal */\n private _applyRovingTabIndex(): void {\n const items = this._getMenuItems();\n items.forEach((item, i) => {\n writeMenuItemRovingTabIndex(item, i === this._rovingIndex ? 0 : -1);\n });\n }\n\n /** @internal */\n private _getMenuItems(): HTMLElement[] {\n const slot = this.shadowRoot?.querySelector('slot') as HTMLSlotElement | null;\n // Allow-list of host-canonical menu-item shapes — `hx-menu-item` carries\n // its `role` via `_internals.role` (AT-only, no DOM attribute), so the\n // role-attribute checks below would miss it. Restrict the wc allow-list\n // to known menu-item hosts so siblings like `hx-menu-divider`\n // (`role=\"separator\"`) and decorative `hx-text` / `hx-icon` slotted into\n // the panel are NOT treated as focus / typeahead targets — APG mandates\n // separators stay non-focusable.\n const isHostCanonicalMenuItem = (el: Element): boolean => el.localName === 'hx-menu-item';\n return (\n (slot\n ?.assignedElements({ flatten: true })\n .filter(\n (el) =>\n el instanceof HTMLElement &&\n !el.hasAttribute('disabled') &&\n !(el as HTMLButtonElement).disabled &&\n (el.getAttribute('role') === 'menuitem' ||\n el.getAttribute('role') === 'menuitemcheckbox' ||\n el.getAttribute('role') === 'menuitemradio' ||\n isHostCanonicalMenuItem(el)),\n ) as HTMLElement[]) ?? []\n );\n }\n\n // ─── Event Handlers (arrow function class fields — stable reference, no bind needed) ───\n\n /** @internal */\n private readonly _handleTriggerClick = (e: MouseEvent): void => {\n e.stopPropagation();\n this._toggle();\n };\n\n /** @internal */\n private readonly _handleDocumentClick = (e: MouseEvent): void => {\n if (!this._open) return;\n const path = e.composedPath();\n if (!path.includes(this)) {\n this._hide();\n }\n };\n\n /** @internal */\n private readonly _handleKeydown = (e: KeyboardEvent): void => {\n if (!this._open) return;\n if (e.key === 'Escape') {\n e.stopPropagation();\n this._hide();\n this._buttonEl?.focus();\n return;\n }\n if (e.key === 'Tab') {\n // APG: Tab moves focus past the menu and closes it. Do not\n // preventDefault; let focus advance naturally.\n this._hide();\n return;\n }\n if (e.key === 'ArrowDown' || e.key === 'ArrowUp' || e.key === 'Home' || e.key === 'End') {\n e.preventDefault();\n e.stopPropagation();\n const items = this._getMenuItems();\n if (items.length === 0) return;\n const focused = items.indexOf(document.activeElement as HTMLElement);\n let next: number;\n if (e.key === 'ArrowDown') {\n next = focused < 0 || focused >= items.length - 1 ? 0 : focused + 1;\n } else if (e.key === 'ArrowUp') {\n next = focused <= 0 ? items.length - 1 : focused - 1;\n } else if (e.key === 'Home') {\n next = 0;\n } else {\n next = items.length - 1;\n }\n this._rovingIndex = next;\n this._applyRovingTabIndex();\n items[next]?.focus();\n return;\n }\n // First-character typeahead — letters only, no modifier keys, ignore Space.\n if (e.key.length === 1 && e.key !== ' ' && !e.ctrlKey && !e.metaKey && !e.altKey) {\n this._handleTypeahead(e.key);\n }\n };\n\n /** @internal */\n private _handleTypeahead(char: string): void {\n if (this._typeaheadTimer !== null) {\n clearTimeout(this._typeaheadTimer);\n }\n this._typeaheadBuffer += char.toLowerCase();\n this._typeaheadTimer = setTimeout(() => {\n this._typeaheadBuffer = '';\n this._typeaheadTimer = null;\n }, 500);\n\n const items = this._getMenuItems();\n // Codex push-gate round-7 finding 3: shared submenu-aware label\n // extractor — see hx-menu / hx-dropdown for rationale.\n const match = items.findIndex((item) => {\n const text = getMenuItemTypeaheadLabel(item).toLowerCase();\n return text.startsWith(this._typeaheadBuffer);\n });\n\n if (match !== -1) {\n this._rovingIndex = match;\n this._applyRovingTabIndex();\n items[match]?.focus();\n }\n }\n\n /** @internal */\n private readonly _handleSlotClick = (e: Event): void => {\n const target = e.target as HTMLElement;\n // Group 5b round-3 (codex): bail FIRST on host-canonical `hx-menu-item`,\n // independently of what `closest()` resolves with the legacy selectors.\n // If a consumer slots a `[role=\"menuitem*\"]` descendant inside an\n // `hx-menu-item`, `closest()` would resolve to the descendant first\n // (nearest match) and the legacy localName guard would miss, double-firing\n // `hx-select` (once here, once from `_handleSlotItemSelect`). The host\n // owns its own dispatch path; descendants of the host must defer.\n if (target.closest('hx-menu-item')) return;\n const menuItem = target.closest(\n '[role=\"menuitem\"], [role=\"menuitemcheckbox\"], [role=\"menuitemradio\"]',\n ) as HTMLElement | null;\n if (!menuItem) return;\n if (menuItem.hasAttribute('disabled') || (menuItem as HTMLButtonElement).disabled) return;\n const value = menuItem.getAttribute('data-value') ?? menuItem.textContent?.trim() ?? '';\n this.dispatchEvent(\n new CustomEvent<{ value: string }>('hx-select', {\n bubbles: true,\n composed: true,\n detail: { value },\n }),\n );\n this._hide();\n };\n\n /**\n * Handle `hx-item-select` bubbling from slotted `hx-menu-item` children.\n * The host-canonical shape owns its own activation (click + Enter/Space),\n * so route its event through to the composite's `hx-select` contract and\n * close the panel. Disabled items never emit `hx-item-select`, so no\n * disabled-guard is needed here.\n * @internal\n */\n private readonly _handleSlotItemSelect = (e: Event): void => {\n const detail = (e as CustomEvent<{ item: HTMLElement; value: string }>).detail;\n const value = detail?.value ?? '';\n this.dispatchEvent(\n new CustomEvent<{ value: string }>('hx-select', {\n bubbles: true,\n composed: true,\n detail: { value },\n }),\n );\n this._hide();\n };\n\n /**\n * Bubbled `hx-item-submenu-open` from a slotted `hx-menu-item` host.\n * Codex push-gate round-9 P1: when slotted `hx-menu-item`s open / close\n * a nested submenu inside this panel (no enclosing `hx-menu`), the\n * events fly past with no handler. Match the round-4\n * `hx-menu._handleSubmenuOpen` shape so APG behaviour holds. Defer to\n * an inner `hx-menu` when present (it owns the toggle). Otherwise this\n * panel is the enclosing menu surface — call `setSubmenuOpen(true)` on\n * the dispatching item and focus its first nested child.\n * @internal\n */\n private readonly _handleSlotSubmenuOpen = (e: Event): void => {\n if (!(e instanceof CustomEvent)) return;\n const detail = (e as CustomEvent<{ item: HTMLElement }>).detail;\n const item = detail?.item;\n if (!item) return;\n if (findClosestMenuAncestor(item) !== null) return;\n queueMicrotask(() => {\n if (e.defaultPrevented) return;\n const setter = (item as HTMLElement & { setSubmenuOpen?: (v: boolean) => void })\n .setSubmenuOpen;\n if (typeof setter !== 'function') return;\n setter.call(item, true);\n const updateComplete = (item as HTMLElement & { updateComplete?: Promise<unknown> })\n .updateComplete;\n if (updateComplete) {\n void updateComplete\n .then(() => {\n const submenuSlot = (\n item as HTMLElement & { shadowRoot?: ShadowRoot | null }\n ).shadowRoot?.querySelector<HTMLSlotElement>('slot[name=\"submenu\"]');\n const nested = submenuSlot\n ?.assignedElements({ flatten: true })\n .find((el) => el.tagName.toLowerCase() === 'hx-menu') as\n | (HTMLElement & { focusFirst?: () => void })\n | undefined;\n nested?.focusFirst?.();\n })\n .catch(() => undefined);\n }\n });\n };\n\n /**\n * Bubbled `hx-item-submenu-close` from a slotted `hx-menu-item` host.\n * Codex push-gate round-9 P1: when an inner `hx-menu` (a nested\n * submenu) handles its own close, the event still bubbles through this\n * panel — defer in that case so the panel stays open. When the\n * dispatching item is top-level inside this panel (no enclosing\n * `hx-menu`), there is no parent submenu to collapse, so close the\n * composite's panel and return focus to the trigger.\n * @internal\n */\n private readonly _handleSlotSubmenuClose = (e: Event): void => {\n if (!(e instanceof CustomEvent)) return;\n const detail = (e as CustomEvent<{ item: HTMLElement }>).detail;\n const item = detail?.item;\n if (!item) return;\n if (findClosestMenuAncestor(item) !== null) return;\n if (e.defaultPrevented) return;\n this._hide();\n // CodeRabbit MUST-FIX (WCAG 2.1.1 / 2.4.3): ArrowLeft close from a\n // top-level slotted item dropped focus to <body>. Mirror the Escape\n // branch and restore focus to the trigger so keyboard continuity is\n // preserved.\n this._buttonEl?.focus();\n };\n\n /** @internal */\n private readonly _handleSlotChange = (): void => {\n if (this._open) {\n this._initRovingTabIndex();\n }\n };\n\n // ─── Host-attribute trigger label mirror ───\n\n /**\n * Resolves the trigger button's accessible name from host attributes and\n * the `label` property. AccName 1.2 §4.3.1 precedence:\n * 1. Host `aria-labelledby` (resolved IDREFs, flattened)\n * 2. Host `aria-label`\n * 3. `label` property\n * @internal\n */\n private _syncResolvedTriggerLabel(): void {\n const liveLabelledBy = this.getAttribute('aria-labelledby');\n const consumerLabelEls = resolveIdrefTokens(this, liveLabelledBy);\n\n // CodeRabbit MUST-FIX: AccName 1.2 §4.3.2 — `aria-labelledby` references\n // their target text content REGARDLESS of visibility. The previous\n // outer visibility filter dropped legitimate accessible names from\n // visually-hidden labels. `flattenAccName` already handles aria-hidden\n // subtree pruning per §4.3.10.\n const flattenedFromIdrefs = consumerLabelEls\n .map((el) => flattenAccName(el))\n .filter((t) => t.length > 0)\n .join(' ')\n .replace(/\\s+/g, ' ')\n .trim();\n\n const liveAriaLabel = this.getAttribute('aria-label');\n const hostAriaLabel = liveAriaLabel !== null ? liveAriaLabel.trim() : '';\n\n let resolved = '';\n if (flattenedFromIdrefs) {\n resolved = flattenedFromIdrefs;\n } else if (hostAriaLabel) {\n resolved = hostAriaLabel;\n } else {\n resolved = this.label;\n }\n\n this._resolvedTriggerLabel = resolved;\n }\n\n // ─── SVG Icons ───\n\n /** @internal */\n private _renderIcon() {\n if (this.icon === 'horizontal') {\n return html`\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"1em\"\n height=\"1em\"\n viewBox=\"0 0 24 24\"\n fill=\"currentColor\"\n aria-hidden=\"true\"\n >\n <circle cx=\"5\" cy=\"12\" r=\"2\" />\n <circle cx=\"12\" cy=\"12\" r=\"2\" />\n <circle cx=\"19\" cy=\"12\" r=\"2\" />\n </svg>\n `;\n }\n return html`\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"1em\"\n height=\"1em\"\n viewBox=\"0 0 24 24\"\n fill=\"currentColor\"\n aria-hidden=\"true\"\n >\n <circle cx=\"12\" cy=\"5\" r=\"2\" />\n <circle cx=\"12\" cy=\"12\" r=\"2\" />\n <circle cx=\"12\" cy=\"19\" r=\"2\" />\n </svg>\n `;\n }\n\n // ─── Render ───\n\n override render() {\n const btnClasses = {\n trigger: true,\n [`trigger--${this.size}`]: true,\n 'trigger--open': this._open,\n };\n\n return html`\n <button\n part=\"button trigger\"\n class=${classMap(btnClasses)}\n type=\"button\"\n aria-label=${this._resolvedTriggerLabel}\n aria-haspopup=\"menu\"\n aria-expanded=${String(this._open)}\n aria-controls=${this._open ? this._panelId : nothing}\n ?disabled=${this.disabled}\n @click=${this._handleTriggerClick}\n >\n ${this._renderIcon()}\n </button>\n ${this._open\n ? html`\n <div\n id=${this._panelId}\n part=\"panel menu\"\n role=\"menu\"\n aria-label=${this.labelMenu}\n class=\"panel\"\n @click=${this._handleSlotClick}\n @hx-item-select=${this._handleSlotItemSelect}\n @hx-item-submenu-open=${this._handleSlotSubmenuOpen}\n @hx-item-submenu-close=${this._handleSlotSubmenuClose}\n >\n <slot @slotchange=${this._handleSlotChange}></slot>\n </div>\n `\n : nothing}\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-overflow-menu': HelixOverflowMenu;\n }\n}\n"],"names":["helixOverflowMenuStyles","css","_nextOverflowMenuId","createIdCounter","HelixOverflowMenu","HelixElement","_a","items","focused","next","_b","target","menuItem","value","detail","item","findClosestMenuAncestor","setter","updateComplete","submenuSlot","nested","el","installAriaIdrefMirror","changedProperties","trigger","panel","computePosition","flip","shift","offset","x","y","i","writeMenuItemRovingTabIndex","slot","isHostCanonicalMenuItem","char","match","getMenuItemTypeaheadLabel","liveLabelledBy","flattenedFromIdrefs","resolveIdrefTokens","flattenAccName","t","liveAriaLabel","hostAriaLabel","resolved","html","btnClasses","classMap","nothing","forcedColorsInteractive","__decorateClass","property","state","query","customElement"],"mappings":"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"}
1
+ {"version":3,"file":"hx-overflow-menu-LrTteeR1.js","sources":["../../src/components/hx-overflow-menu/hx-overflow-menu.styles.ts","../../src/components/hx-overflow-menu/hx-overflow-menu.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixOverflowMenuStyles = css`\n :host {\n display: inline-block;\n position: relative;\n }\n\n :host([disabled]) {\n pointer-events: none;\n opacity: var(--hx-opacity-disabled, 0.5);\n }\n\n /* ─── Trigger Button ─── */\n\n .trigger {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border: var(--hx-border-width-thin, 1px) solid transparent;\n border-radius: var(--hx-border-radius-md, 0.375rem);\n background-color: transparent;\n color: var(--hx-overflow-menu-button-color, var(--hx-color-text-secondary, #313e4b));\n cursor: pointer;\n transition:\n background-color var(--hx-transition-fast, 150ms ease),\n color var(--hx-transition-fast, 150ms ease);\n flex-shrink: 0;\n padding: 0;\n line-height: 1;\n }\n\n .trigger:focus-visible {\n outline: var(--hx-focus-ring-width, 2px) solid\n var(--hx-overflow-menu-focus-ring-color, var(--hx-focus-ring-color, #0f7078));\n outline-offset: var(--hx-focus-ring-offset, 2px);\n }\n\n .trigger:hover:not([disabled]) {\n background-color: var(\n --hx-overflow-menu-trigger-hover-bg,\n var(--hx-color-surface-sunken, #ebeee9)\n );\n }\n\n .trigger--open {\n background-color: var(\n --hx-overflow-menu-trigger-open-bg,\n var(--hx-color-surface-sunken, #ebeee9)\n );\n }\n\n /* ─── Size Variants ─── */\n\n .trigger--sm {\n width: var(--hx-size-8, 2rem);\n height: var(--hx-size-8, 2rem);\n min-width: var(--hx-size-touch-target, 2.75rem);\n min-height: var(--hx-size-touch-target, 2.75rem);\n font-size: var(--hx-font-size-sm, 0.875rem);\n }\n\n .trigger--md {\n width: var(--hx-size-10, 2.5rem);\n height: var(--hx-size-10, 2.5rem);\n min-width: var(--hx-size-touch-target, 2.75rem);\n min-height: var(--hx-size-touch-target, 2.75rem);\n font-size: var(--hx-font-size-md, 1rem);\n }\n\n .trigger--lg {\n width: var(--hx-size-12, 3rem);\n height: var(--hx-size-12, 3rem);\n font-size: var(--hx-font-size-lg, 1.125rem);\n }\n\n /* ─── Panel ─── */\n\n .panel {\n position: fixed;\n z-index: var(--hx-overflow-menu-panel-z-index, 1000);\n min-width: var(--hx-overflow-menu-panel-min-width, 160px);\n background: var(--hx-overflow-menu-panel-bg, var(--hx-color-surface-default, #ffffff));\n border: var(--hx-overflow-menu-panel-border, 1px solid var(--hx-color-border-default, #d6dbd5));\n border-radius: var(\n --hx-overflow-menu-panel-border-radius,\n var(--hx-border-radius-md, 0.375rem)\n );\n box-shadow: var(\n --hx-overflow-menu-panel-shadow,\n 0 4px 16px var(--hx-overlay-black-12, rgba(0, 0, 0, 0.12))\n );\n padding: var(--hx-space-1, 0.25rem) 0;\n outline: none;\n }\n\n /* ─── Slot: menu items ─── */\n\n ::slotted([role='menuitem']),\n ::slotted([role='menuitemcheckbox']),\n ::slotted([role='menuitemradio']) {\n display: block;\n width: 100%;\n padding: var(--hx-space-2, 0.5rem) var(--hx-space-3, 0.75rem);\n background: none;\n border: none;\n text-align: start;\n font-size: var(--hx-font-size-sm, 0.875rem);\n color: var(--hx-overflow-menu-item-color, var(--hx-color-text-primary, #0d1825));\n cursor: pointer;\n white-space: nowrap;\n box-sizing: border-box;\n }\n\n ::slotted([role='menuitem']:hover),\n ::slotted([role='menuitemcheckbox']:hover),\n ::slotted([role='menuitemradio']:hover) {\n background-color: var(\n --hx-overflow-menu-item-hover-bg,\n var(--hx-color-surface-raised, #f5f8f3)\n );\n }\n\n ::slotted([role='menuitem']:focus-visible),\n ::slotted([role='menuitemcheckbox']:focus-visible),\n ::slotted([role='menuitemradio']:focus-visible) {\n outline: var(--hx-focus-ring-width, 2px) solid\n var(--hx-overflow-menu-focus-ring-color, var(--hx-focus-ring-color, #0f7078));\n outline-offset: 0;\n }\n\n /* ─── Reduced Motion ─── */\n\n @media (prefers-reduced-motion: reduce) {\n .trigger {\n transition: none;\n }\n }\n\n /* ─── High Contrast Mode (forced-colors) ─── */\n\n @media (forced-colors: active) {\n .trigger {\n forced-color-adjust: none;\n background-color: ButtonFace;\n color: ButtonText;\n border: 2px solid ButtonText;\n }\n\n .trigger:focus-visible {\n outline: 3px solid Highlight;\n outline-offset: 2px;\n }\n\n .trigger[disabled] {\n color: GrayText;\n border-color: GrayText;\n opacity: 1;\n }\n\n :host([disabled]) {\n opacity: 1;\n }\n\n .panel {\n background-color: Canvas;\n border: 2px solid CanvasText;\n }\n }\n\n /* hx-icon glyph sizing for the migrated trigger icons (1em parity). */\n .trigger__glyph {\n --hx-icon-size: 1em;\n }\n`;\n","import { html, nothing, type PropertyValues } from 'lit';\nimport '../../utilities/document-token-adoption.js';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport '../hx-icon/hx-icon.js';\n\nimport { HelixElement, createIdCounter } from '../../base/index.js';\nimport { forcedColorsInteractive } from '../../styles/forced-colors.js';\nimport { helixOverflowMenuStyles } from './hx-overflow-menu.styles.js';\nimport { flattenAccName } from '../../utils/aria-flatten.js';\nimport { getMenuItemTypeaheadLabel } from '../../utils/menu-label.js';\nimport { writeMenuItemRovingTabIndex } from '../../utils/menu-roving.js';\nimport { findClosestMenuAncestor } from '../../utils/menu-tree.js';\nimport {\n installAriaIdrefMirror,\n resolveIdrefTokens,\n type AriaIdrefMirrorHandle,\n} from '../../utils/aria-idref.js';\n\nconst _nextOverflowMenuId = createIdCounter('hx-overflow-menu');\n\n/**\n * An overflow menu (kebab/meatball menu) that reveals hidden actions via a\n * floating panel. Composed from a trigger button and a slotted menu panel.\n *\n * ## Architecture Note: Host-Attribute Trigger Label Mirror (group-5b)\n *\n * The composite has TWO ARIA-bearing surfaces inside its shadow DOM: the\n * trigger button (`role` defaulted from `<button>`, with `aria-haspopup`,\n * `aria-expanded`, `aria-controls`) and the panel (`role=\"menu\"` on the\n * inner div). The host wraps both — it cannot carry either canonical role\n * itself, so role placement remains on the inner elements.\n *\n * What Group 5b adds:\n * - **Roving tabindex** on slotted menu items (only the focused item has\n * tabindex=0; arrow keys move focus and rewrite tabindex). Closing-Tab\n * path is preserved (Tab moves focus past the menu and closes it).\n * - **First-character typeahead** with 500ms timeout matching `hx-menu`.\n * - **Host-attribute label mirror**: consumer-supplied `aria-label` /\n * `aria-labelledby` on the host flow to the trigger button's\n * `aria-label` (the trigger is the announced surface of the disclosure\n * pattern; consumer override wins over the `label` property). The panel\n * continues to use `labelMenu` for its own slot label.\n *\n * @summary \"...\" or kebab icon button that reveals hidden actions.\n *\n * @tag hx-overflow-menu\n *\n * @slot - Menu items (e.g. `<button role=\"menuitem\">` or `<hx-menu-item>` elements).\n *\n * @fires {CustomEvent<{value: string}>} hx-select - Dispatched when a menu item is selected.\n * @fires {CustomEvent<void>} hx-show - Dispatched when the panel opens.\n * @fires {CustomEvent<void>} hx-hide - Dispatched when the panel closes.\n *\n * @csspart button - The trigger icon button element.\n * @csspart trigger - Alias for button — the trigger icon button element.\n * @csspart panel - The floating menu panel container.\n * @csspart menu - Alias for panel — the floating menu panel container.\n *\n * @cssprop [--hx-overflow-menu-panel-bg=var(--hx-color-neutral-0,#fff)] - Panel background color.\n * @cssprop [--hx-overflow-menu-panel-border=1px solid var(--hx-color-neutral-200,#e5e7eb)] - Panel border.\n * @cssprop [--hx-overflow-menu-panel-border-radius=var(--hx-border-radius-md)] - Panel border radius.\n * @cssprop [--hx-overflow-menu-panel-shadow=0 4px 16px rgba(0,0,0,0.12)] - Panel box shadow.\n * @cssprop [--hx-overflow-menu-panel-min-width=160px] - Minimum panel width.\n * @cssprop [--hx-overflow-menu-panel-z-index=1000] - Panel z-index.\n * @cssprop [--hx-overflow-menu-button-color=var(--hx-color-neutral-600)] - Trigger icon color.\n *\n * @example\n * ```html\n * <hx-overflow-menu>\n * <button role=\"menuitem\">Edit</button>\n * <button role=\"menuitem\">Delete</button>\n * </hx-overflow-menu>\n * ```\n * @cssprop [--hx-opacity-disabled] - Opacity.\n * @cssprop [--hx-border-width-thin] - Width.\n * @cssprop [--hx-border-radius-md] - CSS custom property.\n * @cssprop [--hx-color-neutral-600] - Color.\n * @cssprop [--hx-transition-fast] - Transition timing.\n * @cssprop [--hx-focus-ring-width] - Width.\n * @cssprop [--hx-overflow-menu-focus-ring-color] - Color.\n * @cssprop [--hx-focus-ring-color] - Color.\n * @cssprop [--hx-color-primary-500] - Color.\n * @cssprop [--hx-focus-ring-offset] - CSS custom property.\n * @cssprop [--hx-color-neutral-100] - Color.\n * @cssprop [--hx-size-8] - Size token.\n * @cssprop [--hx-size-touch-target] - Size token.\n * @cssprop [--hx-font-size-sm] - Font size.\n * @cssprop [--hx-size-10] - Size token.\n * @cssprop [--hx-font-size-md] - Font size.\n * @cssprop [--hx-size-12] - Size token.\n * @cssprop [--hx-font-size-lg] - Font size.\n * @cssprop [--hx-color-neutral-0] - Color.\n * @cssprop [--hx-color-neutral-200] - Color.\n * @cssprop [--hx-overlay-black-12] - Overlay color.\n * @cssprop [--hx-space-1] - Spacing token.\n * @cssprop [--hx-space-2] - Spacing token.\n * @cssprop [--hx-space-3] - Spacing token.\n * @cssprop [--hx-color-neutral-900] - Color.\n * @cssprop [--hx-color-neutral-50] - Color.\n * @aaa-certified 2026-05-08\n * @aaa-criteria 1.4.6, 1.4.9, 2.1.3, 2.3.3, 2.4.12, 2.4.13, 2.5.5, 3.2.5, 3.3.6, forced-colors, apg-keyboard\n * @aaa-audit src/components/hx-overflow-menu/AAA-AUDIT.md\n * @keyboard-contract navigate=Arrow,Home,End; activate=Enter,Space; dismiss=Escape; disabled-suppresses=true\n * @aria-pattern menu\n * @aria-pattern-source https://www.w3.org/WAI/ARIA/apg/patterns/menubar/\n * @forced-colors-supported true\n * @stability stable\n * @since 3.7.0\n * @form-associated false\n * @theme-aware true\n * @brand-aware true\n * @drupal-sdc-eligible true\n * @react-wrapper-status complete\n * @figma-component-name hx-overflow-menu\n * @priority-tier P0\n * @phi-handles false\n * @clinical-context none\n */\n@customElement('hx-overflow-menu')\nexport class HelixOverflowMenu extends HelixElement {\n static override styles = [helixOverflowMenuStyles, forcedColorsInteractive];\n\n /**\n * Preferred placement of the floating panel relative to the trigger.\n * @attr placement\n */\n @property({ type: String, reflect: true })\n placement:\n | 'top'\n | 'top-start'\n | 'top-end'\n | 'bottom'\n | 'bottom-start'\n | 'bottom-end'\n | 'left'\n | 'left-start'\n | 'left-end'\n | 'right'\n | 'right-start'\n | 'right-end' = 'bottom-end';\n\n /**\n * Size of the trigger button.\n * @attr hx-size\n */\n @property({ type: String, reflect: true, attribute: 'hx-size' })\n size: 'sm' | 'md' | 'lg' = 'md';\n\n /**\n * Whether the trigger button is disabled.\n * @attr disabled\n */\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /**\n * Icon orientation: vertical (kebab ⋮) or horizontal (meatball ···).\n * @attr icon\n */\n @property({ type: String, reflect: true })\n icon: 'vertical' | 'horizontal' = 'vertical';\n\n /**\n * Accessible label for the trigger button. Used as a fallback when no\n * consumer-supplied `aria-label` / `aria-labelledby` is present on the\n * host. Consumer host attributes win in the AccName 1.2 §4.3.1 cascade.\n * @attr label\n */\n @property({ type: String, reflect: true })\n label = 'More actions';\n\n /**\n * Accessible label for the menu panel. Reflected as `label-menu`.\n * @attr label-menu\n */\n @property({ type: String, reflect: true, attribute: 'label-menu' })\n labelMenu = 'Actions';\n\n /**\n * Tracks whether the overflow menu panel is currently open and visible.\n * @internal\n */\n @state() private _open = false;\n\n /**\n * Resolved accessible name for the trigger button — written to the inner\n * button's `aria-label`. Recomputed via the host-attribute mirror on\n * every aria-* mutation. AccName 1.2 §4.3.1 precedence: host\n * `aria-labelledby` (flattened) > host `aria-label` > `label` property.\n * @internal\n */\n @state() private _resolvedTriggerLabel = '';\n\n /**\n * Index within `_getMenuItems()` of the item currently holding the\n * roving tabindex (and thus visual focus). −1 means the panel has not\n * been keyboard-focused yet (first key press lands on item 0).\n * @internal\n */\n private _rovingIndex = -1;\n\n /**\n * Accumulated character buffer for typeahead search within menu items.\n * @internal\n */\n private _typeaheadBuffer = '';\n\n /**\n * Timer handle that clears the typeahead buffer after a period of inactivity.\n * @internal\n */\n private _typeaheadTimer: ReturnType<typeof setTimeout> | null = null;\n\n /**\n * Handle for the shared host attribute / root id observer.\n * @internal\n */\n private _ariaMirror: AriaIdrefMirrorHandle | null = null;\n\n /**\n * Unique ID for the floating panel element, used to wire aria-controls on the trigger button.\n * @internal\n */\n private readonly _panelId = `${_nextOverflowMenuId()}-panel`;\n\n /** @internal */\n @query('[part~=\"button\"]') private _buttonEl!: HTMLButtonElement | null;\n\n /** @internal */\n @query('[part~=\"panel\"]') private _panelEl!: HTMLElement | null;\n\n // ─── Lifecycle ───\n\n override connectedCallback(): void {\n super.connectedCallback();\n document.addEventListener('click', this._handleDocumentClick, true);\n this.addEventListener('keydown', this._handleKeydown);\n this._syncResolvedTriggerLabel();\n this._ariaMirror = installAriaIdrefMirror(this, () => {\n this._syncResolvedTriggerLabel();\n });\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n document.removeEventListener('click', this._handleDocumentClick, true);\n this.removeEventListener('keydown', this._handleKeydown);\n if (this._typeaheadTimer !== null) {\n clearTimeout(this._typeaheadTimer);\n this._typeaheadTimer = null;\n }\n this._ariaMirror?.disconnect();\n this._ariaMirror = null;\n }\n\n override willUpdate(changedProperties: PropertyValues<this>): void {\n super.willUpdate(changedProperties);\n if (changedProperties.has('label')) {\n this._syncResolvedTriggerLabel();\n }\n }\n\n // ─── Open / Close ───\n\n /** @internal */\n private async _show(): Promise<void> {\n if (this._open || this.disabled) return;\n this._open = true;\n await this.updateComplete;\n await this._updatePosition();\n this._initRovingTabIndex();\n this._focusFirstItem();\n this.dispatchEvent(new CustomEvent<void>('hx-show', { bubbles: true, composed: true }));\n }\n\n /** @internal */\n private _hide(): void {\n if (!this._open) return;\n this._open = false;\n this._rovingIndex = -1;\n this.dispatchEvent(new CustomEvent<void>('hx-hide', { bubbles: true, composed: true }));\n }\n\n /** @internal */\n private _toggle(): void {\n if (this._open) {\n this._hide();\n } else {\n void this._show();\n }\n }\n\n // ─── Positioning (Floating UI) ───\n\n /** @internal */\n private async _updatePosition(): Promise<void> {\n const trigger = this._buttonEl as HTMLElement | null;\n const panel = this._panelEl;\n if (!trigger || !panel) return;\n\n const { computePosition, flip, shift, offset } = await import('@floating-ui/dom');\n const { x, y } = await computePosition(trigger, panel, {\n placement: this.placement,\n strategy: 'fixed',\n middleware: [offset(4), flip(), shift({ padding: 8 })],\n });\n\n Object.assign(panel.style, {\n left: `${x}px`,\n top: `${y}px`,\n });\n }\n\n // ─── Focus management ───\n\n /** @internal */\n private _focusFirstItem(): void {\n const items = this._getMenuItems();\n if (items.length === 0) return;\n this._rovingIndex = 0;\n this._applyRovingTabIndex();\n items[0]?.focus();\n }\n\n /**\n * Codex push-gate round-2 finding 3: write the roving tabindex through\n * the right surface for each item shape. Implementation moved to the\n * shared `writeMenuItemRovingTabIndex` util (round-8 finding 2) so\n * `hx-dropdown` and any future host-canonical menu shape route through\n * one source of truth instead of duplicating the host-vs-inner-element\n * branch per component.\n *\n * - `hx-menu-item` is host-canonical: on the modern path the roving\n * tabindex must land on the host (it carries the announced role +\n * IDL ARIA), and on the fallback path it must land on the inner\n * `.menu-item` (the host is forced to `tabindex=-1` so there is\n * exactly one focusable surface per item). The util's\n * `setRovingTabIndex(value)` route handles both paths internally.\n * - Plain slotted `[role=\"menuitem\"]` elements (legacy `<button>`-style\n * children) keep the direct `item.tabIndex = value` write.\n *\n * Without this routing, host-canonical items on the fallback path stay\n * at `tabindex=-1` because the host write never reaches the inner\n * focusable surface — Tab would land on a non-focusable host and arrow\n * navigation would fail to advance the announced item.\n * @internal\n */\n\n /**\n * Initialize roving tabindex on all enabled menu items: only the first\n * receives tabindex=0; the rest are tabindex=-1. Maintains the closing-\n * Tab semantics required by APG (tabbing past the menu closes it via\n * the keydown handler below).\n * @internal\n */\n private _initRovingTabIndex(): void {\n const items = this._getMenuItems();\n items.forEach((item, i) => {\n writeMenuItemRovingTabIndex(item, i === 0 ? 0 : -1);\n });\n this._rovingIndex = items.length > 0 ? 0 : -1;\n }\n\n /** @internal */\n private _applyRovingTabIndex(): void {\n const items = this._getMenuItems();\n items.forEach((item, i) => {\n writeMenuItemRovingTabIndex(item, i === this._rovingIndex ? 0 : -1);\n });\n }\n\n /** @internal */\n private _getMenuItems(): HTMLElement[] {\n const slot = this.shadowRoot?.querySelector('slot') as HTMLSlotElement | null;\n // Allow-list of host-canonical menu-item shapes — `hx-menu-item` carries\n // its `role` via `_internals.role` (AT-only, no DOM attribute), so the\n // role-attribute checks below would miss it. Restrict the wc allow-list\n // to known menu-item hosts so siblings like `hx-menu-divider`\n // (`role=\"separator\"`) and decorative `hx-text` / `hx-icon` slotted into\n // the panel are NOT treated as focus / typeahead targets — APG mandates\n // separators stay non-focusable.\n const isHostCanonicalMenuItem = (el: Element): boolean => el.localName === 'hx-menu-item';\n return (\n (slot\n ?.assignedElements({ flatten: true })\n .filter(\n (el) =>\n el instanceof HTMLElement &&\n !el.hasAttribute('disabled') &&\n !(el as HTMLButtonElement).disabled &&\n (el.getAttribute('role') === 'menuitem' ||\n el.getAttribute('role') === 'menuitemcheckbox' ||\n el.getAttribute('role') === 'menuitemradio' ||\n isHostCanonicalMenuItem(el)),\n ) as HTMLElement[]) ?? []\n );\n }\n\n // ─── Event Handlers (arrow function class fields — stable reference, no bind needed) ───\n\n /** @internal */\n private readonly _handleTriggerClick = (e: MouseEvent): void => {\n e.stopPropagation();\n this._toggle();\n };\n\n /** @internal */\n private readonly _handleDocumentClick = (e: MouseEvent): void => {\n if (!this._open) return;\n const path = e.composedPath();\n if (!path.includes(this)) {\n this._hide();\n }\n };\n\n /** @internal */\n private readonly _handleKeydown = (e: KeyboardEvent): void => {\n if (!this._open) return;\n if (e.key === 'Escape') {\n e.stopPropagation();\n this._hide();\n this._buttonEl?.focus();\n return;\n }\n if (e.key === 'Tab') {\n // APG: Tab moves focus past the menu and closes it. Do not\n // preventDefault; let focus advance naturally.\n this._hide();\n return;\n }\n if (e.key === 'ArrowDown' || e.key === 'ArrowUp' || e.key === 'Home' || e.key === 'End') {\n e.preventDefault();\n e.stopPropagation();\n const items = this._getMenuItems();\n if (items.length === 0) return;\n const focused = items.indexOf(document.activeElement as HTMLElement);\n let next: number;\n if (e.key === 'ArrowDown') {\n next = focused < 0 || focused >= items.length - 1 ? 0 : focused + 1;\n } else if (e.key === 'ArrowUp') {\n next = focused <= 0 ? items.length - 1 : focused - 1;\n } else if (e.key === 'Home') {\n next = 0;\n } else {\n next = items.length - 1;\n }\n this._rovingIndex = next;\n this._applyRovingTabIndex();\n items[next]?.focus();\n return;\n }\n // First-character typeahead — letters only, no modifier keys, ignore Space.\n if (e.key.length === 1 && e.key !== ' ' && !e.ctrlKey && !e.metaKey && !e.altKey) {\n this._handleTypeahead(e.key);\n }\n };\n\n /** @internal */\n private _handleTypeahead(char: string): void {\n if (this._typeaheadTimer !== null) {\n clearTimeout(this._typeaheadTimer);\n }\n this._typeaheadBuffer += char.toLowerCase();\n this._typeaheadTimer = setTimeout(() => {\n this._typeaheadBuffer = '';\n this._typeaheadTimer = null;\n }, 500);\n\n const items = this._getMenuItems();\n // Codex push-gate round-7 finding 3: shared submenu-aware label\n // extractor — see hx-menu / hx-dropdown for rationale.\n const match = items.findIndex((item) => {\n const text = getMenuItemTypeaheadLabel(item).toLowerCase();\n return text.startsWith(this._typeaheadBuffer);\n });\n\n if (match !== -1) {\n this._rovingIndex = match;\n this._applyRovingTabIndex();\n items[match]?.focus();\n }\n }\n\n /** @internal */\n private readonly _handleSlotClick = (e: Event): void => {\n const target = e.target as HTMLElement;\n // Group 5b round-3 (codex): bail FIRST on host-canonical `hx-menu-item`,\n // independently of what `closest()` resolves with the legacy selectors.\n // If a consumer slots a `[role=\"menuitem*\"]` descendant inside an\n // `hx-menu-item`, `closest()` would resolve to the descendant first\n // (nearest match) and the legacy localName guard would miss, double-firing\n // `hx-select` (once here, once from `_handleSlotItemSelect`). The host\n // owns its own dispatch path; descendants of the host must defer.\n if (target.closest('hx-menu-item')) return;\n const menuItem = target.closest(\n '[role=\"menuitem\"], [role=\"menuitemcheckbox\"], [role=\"menuitemradio\"]',\n ) as HTMLElement | null;\n if (!menuItem) return;\n if (menuItem.hasAttribute('disabled') || (menuItem as HTMLButtonElement).disabled) return;\n const value = menuItem.getAttribute('data-value') ?? menuItem.textContent?.trim() ?? '';\n this.dispatchEvent(\n new CustomEvent<{ value: string }>('hx-select', {\n bubbles: true,\n composed: true,\n detail: { value },\n }),\n );\n this._hide();\n };\n\n /**\n * Handle `hx-item-select` bubbling from slotted `hx-menu-item` children.\n * The host-canonical shape owns its own activation (click + Enter/Space),\n * so route its event through to the composite's `hx-select` contract and\n * close the panel. Disabled items never emit `hx-item-select`, so no\n * disabled-guard is needed here.\n * @internal\n */\n private readonly _handleSlotItemSelect = (e: Event): void => {\n const detail = (e as CustomEvent<{ item: HTMLElement; value: string }>).detail;\n const value = detail?.value ?? '';\n this.dispatchEvent(\n new CustomEvent<{ value: string }>('hx-select', {\n bubbles: true,\n composed: true,\n detail: { value },\n }),\n );\n this._hide();\n };\n\n /**\n * Bubbled `hx-item-submenu-open` from a slotted `hx-menu-item` host.\n * Codex push-gate round-9 P1: when slotted `hx-menu-item`s open / close\n * a nested submenu inside this panel (no enclosing `hx-menu`), the\n * events fly past with no handler. Match the round-4\n * `hx-menu._handleSubmenuOpen` shape so APG behaviour holds. Defer to\n * an inner `hx-menu` when present (it owns the toggle). Otherwise this\n * panel is the enclosing menu surface — call `setSubmenuOpen(true)` on\n * the dispatching item and focus its first nested child.\n * @internal\n */\n private readonly _handleSlotSubmenuOpen = (e: Event): void => {\n if (!(e instanceof CustomEvent)) return;\n const detail = (e as CustomEvent<{ item: HTMLElement }>).detail;\n const item = detail?.item;\n if (!item) return;\n if (findClosestMenuAncestor(item) !== null) return;\n queueMicrotask(() => {\n if (e.defaultPrevented) return;\n const setter = (item as HTMLElement & { setSubmenuOpen?: (v: boolean) => void })\n .setSubmenuOpen;\n if (typeof setter !== 'function') return;\n setter.call(item, true);\n const updateComplete = (item as HTMLElement & { updateComplete?: Promise<unknown> })\n .updateComplete;\n if (updateComplete) {\n void updateComplete\n .then(() => {\n const submenuSlot = (\n item as HTMLElement & { shadowRoot?: ShadowRoot | null }\n ).shadowRoot?.querySelector<HTMLSlotElement>('slot[name=\"submenu\"]');\n const nested = submenuSlot\n ?.assignedElements({ flatten: true })\n .find((el) => el.tagName.toLowerCase() === 'hx-menu') as\n | (HTMLElement & { focusFirst?: () => void })\n | undefined;\n nested?.focusFirst?.();\n })\n .catch(() => undefined);\n }\n });\n };\n\n /**\n * Bubbled `hx-item-submenu-close` from a slotted `hx-menu-item` host.\n * Codex push-gate round-9 P1: when an inner `hx-menu` (a nested\n * submenu) handles its own close, the event still bubbles through this\n * panel — defer in that case so the panel stays open. When the\n * dispatching item is top-level inside this panel (no enclosing\n * `hx-menu`), there is no parent submenu to collapse, so close the\n * composite's panel and return focus to the trigger.\n * @internal\n */\n private readonly _handleSlotSubmenuClose = (e: Event): void => {\n if (!(e instanceof CustomEvent)) return;\n const detail = (e as CustomEvent<{ item: HTMLElement }>).detail;\n const item = detail?.item;\n if (!item) return;\n if (findClosestMenuAncestor(item) !== null) return;\n if (e.defaultPrevented) return;\n this._hide();\n // CodeRabbit MUST-FIX (WCAG 2.1.1 / 2.4.3): ArrowLeft close from a\n // top-level slotted item dropped focus to <body>. Mirror the Escape\n // branch and restore focus to the trigger so keyboard continuity is\n // preserved.\n this._buttonEl?.focus();\n };\n\n /** @internal */\n private readonly _handleSlotChange = (): void => {\n if (this._open) {\n this._initRovingTabIndex();\n }\n };\n\n // ─── Host-attribute trigger label mirror ───\n\n /**\n * Resolves the trigger button's accessible name from host attributes and\n * the `label` property. AccName 1.2 §4.3.1 precedence:\n * 1. Host `aria-labelledby` (resolved IDREFs, flattened)\n * 2. Host `aria-label`\n * 3. `label` property\n * @internal\n */\n private _syncResolvedTriggerLabel(): void {\n const liveLabelledBy = this.getAttribute('aria-labelledby');\n const consumerLabelEls = resolveIdrefTokens(this, liveLabelledBy);\n\n // CodeRabbit MUST-FIX: AccName 1.2 §4.3.2 — `aria-labelledby` references\n // their target text content REGARDLESS of visibility. The previous\n // outer visibility filter dropped legitimate accessible names from\n // visually-hidden labels. `flattenAccName` already handles aria-hidden\n // subtree pruning per §4.3.10.\n const flattenedFromIdrefs = consumerLabelEls\n .map((el) => flattenAccName(el))\n .filter((t) => t.length > 0)\n .join(' ')\n .replace(/\\s+/g, ' ')\n .trim();\n\n const liveAriaLabel = this.getAttribute('aria-label');\n const hostAriaLabel = liveAriaLabel !== null ? liveAriaLabel.trim() : '';\n\n let resolved = '';\n if (flattenedFromIdrefs) {\n resolved = flattenedFromIdrefs;\n } else if (hostAriaLabel) {\n resolved = hostAriaLabel;\n } else {\n resolved = this.label;\n }\n\n this._resolvedTriggerLabel = resolved;\n }\n\n // ─── SVG Icons ───\n\n /**\n * @internal Helix's curated set provides the horizontal `ellipsis` glyph.\n * For the vertical variant we fall back to FA Free's `ellipsis-vertical`\n * since it isn't part of helix's 32-glyph vocabulary.\n */\n private _renderIcon() {\n if (this.icon === 'horizontal') {\n return html`<hx-icon\n class=\"trigger__glyph\"\n library=\"helix\"\n name=\"ellipsis\"\n aria-hidden=\"true\"\n ></hx-icon>`;\n }\n return html`<hx-icon\n class=\"trigger__glyph\"\n library=\"fa-free\"\n name=\"ellipsis-vertical\"\n aria-hidden=\"true\"\n ></hx-icon>`;\n }\n\n // ─── Render ───\n\n override render() {\n const btnClasses = {\n trigger: true,\n [`trigger--${this.size}`]: true,\n 'trigger--open': this._open,\n };\n\n return html`\n <button\n part=\"button trigger\"\n class=${classMap(btnClasses)}\n type=\"button\"\n aria-label=${this._resolvedTriggerLabel}\n aria-haspopup=\"menu\"\n aria-expanded=${String(this._open)}\n aria-controls=${this._open ? this._panelId : nothing}\n ?disabled=${this.disabled}\n @click=${this._handleTriggerClick}\n >\n ${this._renderIcon()}\n </button>\n ${this._open\n ? html`\n <div\n id=${this._panelId}\n part=\"panel menu\"\n role=\"menu\"\n aria-label=${this.labelMenu}\n class=\"panel\"\n @click=${this._handleSlotClick}\n @hx-item-select=${this._handleSlotItemSelect}\n @hx-item-submenu-open=${this._handleSlotSubmenuOpen}\n @hx-item-submenu-close=${this._handleSlotSubmenuClose}\n >\n <slot @slotchange=${this._handleSlotChange}></slot>\n </div>\n `\n : nothing}\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-overflow-menu': HelixOverflowMenu;\n }\n}\n"],"names":["helixOverflowMenuStyles","css","_nextOverflowMenuId","createIdCounter","HelixOverflowMenu","HelixElement","_a","items","focused","next","_b","target","menuItem","value","detail","item","findClosestMenuAncestor","setter","updateComplete","submenuSlot","nested","el","installAriaIdrefMirror","changedProperties","trigger","panel","computePosition","flip","shift","offset","x","y","i","writeMenuItemRovingTabIndex","slot","isHostCanonicalMenuItem","char","match","getMenuItemTypeaheadLabel","liveLabelledBy","flattenedFromIdrefs","resolveIdrefTokens","flattenAccName","t","liveAriaLabel","hostAriaLabel","resolved","html","btnClasses","classMap","nothing","forcedColorsInteractive","__decorateClass","property","state","query","customElement"],"mappings":"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"}
@@ -75,9 +75,8 @@ const b = c`
75
75
  opacity: var(--hx-opacity-50, 0.5);
76
76
  }
77
77
 
78
- .phi-field__toggle svg {
79
- width: 1em;
80
- height: 1em;
78
+ .phi-field__glyph {
79
+ --hx-icon-size: 1em;
81
80
  pointer-events: none;
82
81
  }
83
82
 
@@ -115,12 +114,12 @@ const b = c`
115
114
  }
116
115
  }
117
116
  `;
118
- var v = Object.defineProperty, g = Object.getOwnPropertyDescriptor, r = (e, t, s, o) => {
119
- for (var a = o > 1 ? void 0 : o ? g(t, s) : t, l = e.length - 1, d; l >= 0; l--)
120
- (d = e[l]) && (a = (o ? d(t, s, a) : d(a)) || a);
121
- return o && a && v(t, s, a), a;
117
+ var v = Object.defineProperty, g = Object.getOwnPropertyDescriptor, r = (e, i, s, o) => {
118
+ for (var a = o > 1 ? void 0 : o ? g(i, s) : i, l = e.length - 1, d; l >= 0; l--)
119
+ (d = e[l]) && (a = (o ? d(i, s, a) : d(a)) || a);
120
+ return o && a && v(i, s, a), a;
122
121
  };
123
- let i = class extends _ {
122
+ let t = class extends _ {
124
123
  constructor() {
125
124
  super(...arguments), this.data = "", this.fieldType = "ssn", this.fieldId = "", this.clipboardTimeout = 3e4, this.label = "", this.autoHideDelay = 60, this.disabled = !1, this._masked = !0, this._clipboardTimer = null, this._autoHideTimer = null, this._boundHandleVisibilityChange = () => {
126
125
  document.visibilityState === "hidden" && (this._masked && this._clipboardTimer === null || this._clearClipboard());
@@ -173,12 +172,12 @@ let i = class extends _ {
173
172
  }
174
173
  /** @internal Add interaction listeners to reset auto-hide timer. */
175
174
  _addAutoHideInteractionListeners() {
176
- for (const e of i._AUTO_HIDE_INTERACTION_EVENTS)
175
+ for (const e of t._AUTO_HIDE_INTERACTION_EVENTS)
177
176
  this.addEventListener(e, this._boundResetAutoHideTimer);
178
177
  }
179
178
  /** @internal Remove interaction listeners. */
180
179
  _removeAutoHideInteractionListeners() {
181
- for (const e of i._AUTO_HIDE_INTERACTION_EVENTS)
180
+ for (const e of t._AUTO_HIDE_INTERACTION_EVENTS)
182
181
  this.removeEventListener(e, this._boundResetAutoHideTimer);
183
182
  }
184
183
  /** @internal */
@@ -190,14 +189,14 @@ let i = class extends _ {
190
189
  /** @internal */
191
190
  _clearClipboard() {
192
191
  this._cancelClipboardTimer(), this._cancelAutoHideTimer(), this._masked = !0;
193
- const e = (t) => {
192
+ const e = (i) => {
194
193
  this.dispatchEvent(
195
194
  new CustomEvent("hx-phi-access", {
196
195
  bubbles: !0,
197
196
  composed: !0,
198
197
  detail: {
199
198
  fieldId: this.fieldId || this.id || "",
200
- action: t ? "clipboard-clear" : "clipboard-clear-failed",
199
+ action: i ? "clipboard-clear" : "clipboard-clear-failed",
201
200
  timestamp: (/* @__PURE__ */ new Date()).toISOString(),
202
201
  fieldType: this.fieldType
203
202
  }
@@ -209,17 +208,17 @@ let i = class extends _ {
209
208
  return;
210
209
  }
211
210
  try {
212
- const t = navigator.clipboard;
213
- if (!t) {
211
+ const i = navigator.clipboard;
212
+ if (!i) {
214
213
  e(!1);
215
214
  return;
216
215
  }
217
- const s = t.writeText;
216
+ const s = i.writeText;
218
217
  if (typeof s != "function") {
219
218
  e(!1);
220
219
  return;
221
220
  }
222
- Promise.resolve(s.call(t, "")).then(
221
+ Promise.resolve(s.call(i, "")).then(
223
222
  () => e(!0),
224
223
  () => e(!1)
225
224
  );
@@ -236,11 +235,11 @@ let i = class extends _ {
236
235
  return e ? `***${e[2]}**${e[4]}${e[5]}` : this.data.slice(0, -4).replace(/\d/g, "*") + this.data.slice(-4);
237
236
  }
238
237
  case "mrn": {
239
- const e = this.data.split(""), t = [];
238
+ const e = this.data.split(""), i = [];
240
239
  e.forEach((l, d) => {
241
- /[a-zA-Z0-9]/.test(l) && t.push(d);
240
+ /[a-zA-Z0-9]/.test(l) && i.push(d);
242
241
  });
243
- const s = Math.min(4, t.length), o = t.length - s, a = new Set(t.slice(0, o));
242
+ const s = Math.min(4, i.length), o = i.length - s, a = new Set(i.slice(0, o));
244
243
  return e.map((l, d) => a.has(d) ? "*" : l).join("");
245
244
  }
246
245
  case "dob":
@@ -280,44 +279,25 @@ let i = class extends _ {
280
279
  // ─── Render Helpers ───
281
280
  /** @internal */
282
281
  _renderEyeIcon() {
283
- return h`
284
- <svg
285
- xmlns="http://www.w3.org/2000/svg"
286
- viewBox="0 0 24 24"
287
- fill="none"
288
- stroke="currentColor"
289
- stroke-width="2"
290
- stroke-linecap="round"
291
- stroke-linejoin="round"
292
- aria-hidden="true"
293
- >
294
- <path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" />
295
- <circle cx="12" cy="12" r="3" />
296
- </svg>
297
- `;
282
+ return h`<hx-icon
283
+ class="phi-field__glyph"
284
+ library="helix"
285
+ name="eye"
286
+ aria-hidden="true"
287
+ ></hx-icon>`;
298
288
  }
299
289
  /** @internal */
300
290
  _renderEyeOffIcon() {
301
- return h`
302
- <svg
303
- xmlns="http://www.w3.org/2000/svg"
304
- viewBox="0 0 24 24"
305
- fill="none"
306
- stroke="currentColor"
307
- stroke-width="2"
308
- stroke-linecap="round"
309
- stroke-linejoin="round"
310
- aria-hidden="true"
311
- >
312
- <path d="M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94" />
313
- <path d="M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19" />
314
- <line x1="1" y1="1" x2="23" y2="23" />
315
- </svg>
316
- `;
291
+ return h`<hx-icon
292
+ class="phi-field__glyph"
293
+ library="helix"
294
+ name="eye-off"
295
+ aria-hidden="true"
296
+ ></hx-icon>`;
317
297
  }
318
298
  // ─── Render ───
319
299
  render() {
320
- const e = this.label || "Protected health information", t = `${e} is masked`, s = `${e} is revealed`, o = `Reveal ${e.toLowerCase()}`, a = `Hide ${e.toLowerCase()}`;
300
+ const e = this.label || "Protected health information", i = `${e} is masked`, s = `${e} is revealed`, o = `Reveal ${e.toLowerCase()}`, a = `Hide ${e.toLowerCase()}`;
321
301
  return h`
322
302
  <div
323
303
  part="container"
@@ -334,7 +314,7 @@ let i = class extends _ {
334
314
  >${this.data}</span
335
315
  >`}
336
316
  <span role="status" aria-live="polite" aria-atomic="true" class="phi-field__status">
337
- ${this._masked ? t : s}
317
+ ${this._masked ? i : s}
338
318
  </span>
339
319
  <button
340
320
  part="toggle"
@@ -351,8 +331,8 @@ let i = class extends _ {
351
331
  `;
352
332
  }
353
333
  };
354
- i.styles = [b, m];
355
- i._AUTO_HIDE_INTERACTION_EVENTS = [
334
+ t.styles = [b, m];
335
+ t._AUTO_HIDE_INTERACTION_EVENTS = [
356
336
  "mouseenter",
357
337
  "mousemove",
358
338
  "focusin",
@@ -361,32 +341,32 @@ i._AUTO_HIDE_INTERACTION_EVENTS = [
361
341
  ];
362
342
  r([
363
343
  n({ attribute: !1 })
364
- ], i.prototype, "data", 2);
344
+ ], t.prototype, "data", 2);
365
345
  r([
366
346
  n({ type: String, reflect: !0, attribute: "field-type" })
367
- ], i.prototype, "fieldType", 2);
347
+ ], t.prototype, "fieldType", 2);
368
348
  r([
369
349
  n({ type: String, attribute: "field-id" })
370
- ], i.prototype, "fieldId", 2);
350
+ ], t.prototype, "fieldId", 2);
371
351
  r([
372
352
  n({ type: Number, attribute: "clipboard-timeout" })
373
- ], i.prototype, "clipboardTimeout", 2);
353
+ ], t.prototype, "clipboardTimeout", 2);
374
354
  r([
375
355
  n({ type: String })
376
- ], i.prototype, "label", 2);
356
+ ], t.prototype, "label", 2);
377
357
  r([
378
358
  n({ type: Number, attribute: "auto-hide-delay" })
379
- ], i.prototype, "autoHideDelay", 2);
359
+ ], t.prototype, "autoHideDelay", 2);
380
360
  r([
381
361
  n({ type: Boolean, reflect: !0 })
382
- ], i.prototype, "disabled", 2);
362
+ ], t.prototype, "disabled", 2);
383
363
  r([
384
364
  p()
385
- ], i.prototype, "_masked", 2);
386
- i = r([
365
+ ], t.prototype, "_masked", 2);
366
+ t = r([
387
367
  f("hx-phi-field")
388
- ], i);
368
+ ], t);
389
369
  export {
390
- i as H
370
+ t as H
391
371
  };
392
- //# sourceMappingURL=hx-phi-field-C19oxlrr.js.map
372
+ //# sourceMappingURL=hx-phi-field-sZt_rYIL.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"hx-phi-field-sZt_rYIL.js","sources":["../../src/components/hx-phi-field/hx-phi-field.styles.ts","../../src/components/hx-phi-field/hx-phi-field.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixPhiFieldStyles = css`\n :host {\n display: inline-flex;\n }\n\n /* ─── Container ─── */\n\n .phi-field {\n display: inline-flex;\n align-items: center;\n gap: var(--hx-space-2, 0.5rem);\n font-family: var(--hx-phi-field-font-family, var(--hx-font-family-mono, monospace));\n }\n\n /* ─── Value ─── */\n\n .phi-field__value--masked {\n user-select: none;\n -webkit-user-select: none;\n color: var(--hx-phi-field-masked-color, var(--hx-color-text-muted, #4a5362));\n letter-spacing: var(--hx-phi-field-letter-spacing, 0.1em);\n }\n\n .phi-field__value--revealed {\n color: var(--hx-phi-field-value-color, var(--hx-color-text-primary, #0d1825));\n }\n\n /* ─── Screen Reader Status ─── */\n\n .phi-field__status {\n position: absolute;\n width: 1px;\n height: 1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border: 0;\n padding: 0;\n margin: -1px;\n }\n\n /* ─── Toggle Button ─── */\n\n .phi-field__toggle {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n background: none;\n border: none;\n padding: var(--hx-space-1, 0.25rem);\n min-width: var(--hx-touch-target-min, 2.75rem);\n min-height: var(--hx-touch-target-min, 2.75rem);\n color: var(--hx-phi-field-toggle-color, var(--hx-color-primary-500, #429797));\n cursor: pointer;\n line-height: 1;\n border-radius: var(--hx-border-radius-sm, 0.25rem);\n }\n\n .phi-field__toggle:focus-visible {\n outline: var(--hx-focus-ring-width, 2px) solid\n var(--hx-phi-field-focus-ring-color, var(--hx-focus-ring-color, #0f7078));\n outline-offset: var(--hx-focus-ring-offset, 2px);\n }\n\n .phi-field__toggle:hover {\n opacity: var(--hx-opacity-90, 0.9);\n }\n\n .phi-field__toggle:active {\n opacity: var(--hx-opacity-50, 0.5);\n }\n\n .phi-field__glyph {\n --hx-icon-size: 1em;\n pointer-events: none;\n }\n\n /* ─── Disabled State ─── */\n\n :host([disabled]) {\n opacity: var(--hx-phi-field-disabled-opacity, var(--hx-opacity-50, 0.5));\n pointer-events: none;\n cursor: not-allowed;\n }\n\n .phi-field--disabled .phi-field__toggle {\n cursor: not-allowed;\n }\n\n /* ─── Reduced Motion ─── */\n\n @media (prefers-reduced-motion: reduce) {\n .phi-field__toggle {\n transition: none;\n }\n }\n\n /* ─── Forced Colors (Windows High Contrast Mode) ─── */\n\n @media (forced-colors: active) {\n .phi-field__toggle {\n border: 1px solid ButtonText;\n forced-color-adjust: none;\n }\n\n .phi-field__toggle:focus-visible {\n outline: 2px solid Highlight;\n outline-offset: 2px;\n }\n }\n`;\n","import { html, type TemplateResult } from 'lit';\nimport { classMap } from 'lit/directives/class-map.js';\nimport '../../utilities/document-token-adoption.js';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport '../hx-icon/hx-icon.js';\nimport { HelixElement } from '../../base/index.js';\nimport { helixPhiFieldStyles } from './hx-phi-field.styles.js';\nimport { forcedColorsField } from '../../styles/forced-colors.js';\nimport { devWarn } from '../../utils/dev-warn.js';\n\n/**\n * HIPAA-compliant field component for rendering masked Protected Health Information (PHI).\n * PHI is masked by default and only rendered to the DOM when explicitly revealed. Access\n * events are fired on reveal, hide, and clipboard auto-clear for audit trail purposes.\n *\n * ## Security Model — Event Composition\n *\n * The `hx-phi-access` event is dispatched with `composed: true` so it crosses shadow DOM\n * boundaries and reaches application-level audit listeners. This is intentional — audit\n * trail events MUST reach the host application regardless of shadow DOM nesting depth.\n *\n * **PHI is never included in event details.** The `PhiAccessEventDetail` payload contains\n * only audit metadata: `fieldId`, `action`, `timestamp`, and `fieldType`. The actual PHI\n * value (the `data` property) is deliberately excluded from all dispatched events.\n *\n * ### Consumer Responsibilities\n *\n * - **Audit logging**: Listen for `hx-phi-access` at the application root to build a\n * HIPAA-compliant access audit trail. The `fieldId` and `timestamp` fields correlate\n * access events to specific data elements without exposing the data itself.\n * - **Multi-tenant isolation**: In micro-frontend architectures where multiple patient\n * contexts share a document, consumers MUST scope their `hx-phi-access` listeners to\n * the appropriate DOM subtree (e.g., listen on a container element rather than\n * `document`). Composed events from one patient context will bubble through shared\n * ancestors.\n * - **Do not extend event details with PHI**: When wrapping this component, never add\n * the raw `data` value to re-dispatched events. The separation of audit metadata from\n * PHI content is a deliberate security boundary.\n *\n * @summary HIPAA-compliant field for rendering masked Protected Health Information.\n *\n * @tag hx-phi-field\n *\n * @csspart container - The outer wrapper element.\n * @csspart value - The value display span (masked or revealed).\n * @csspart toggle - The reveal/hide toggle button.\n *\n * @fires {CustomEvent<PhiAccessEventDetail>} hx-phi-access - Fired on reveal, hide,\n * auto-hide, clipboard-clear, and clipboard-clear-failed actions. Contains audit\n * metadata only — never raw PHI. Dispatched with `composed: true` to cross shadow\n * boundaries for application-level audit listeners.\n *\n * @cssprop [--hx-phi-field-font-family=var(--hx-font-family-mono,monospace)] - Font family for the masked value.\n * @cssprop [--hx-phi-field-value-color=var(--hx-color-neutral-900,#0D1825)] - Value text color.\n * @cssprop [--hx-phi-field-masked-color=var(--hx-color-neutral-500,#66787B)] - Masked value text color.\n * @cssprop [--hx-phi-field-toggle-color=var(--hx-color-primary-500,#429797)] - Toggle button color.\n * @cssprop [--hx-phi-field-focus-ring-color=var(--hx-focus-ring-color,var(--hx-color-primary-500,#429797))] - Focus ring color.\n * @cssprop [--hx-phi-field-disabled-opacity=var(--hx-opacity-50,0.5)] - Opacity applied when the field is disabled.\n * @cssprop [--hx-space-2] - Spacing token.\n * @cssprop [--hx-font-family-mono] - Font family.\n * @cssprop [--hx-color-neutral-500] - Color.\n * @cssprop [--hx-phi-field-letter-spacing=0.1em] - CSS custom property.\n * @cssprop [--hx-color-neutral-900] - Color.\n * @cssprop [--hx-space-1] - Spacing token.\n * @cssprop [--hx-touch-target-min] - Minimum touch target size.\n * @cssprop [--hx-color-primary-500] - Color.\n * @cssprop [--hx-border-radius-sm] - CSS custom property.\n * @cssprop [--hx-focus-ring-width] - Width.\n * @cssprop [--hx-focus-ring-color] - Color.\n * @cssprop [--hx-focus-ring-offset] - CSS custom property.\n * @cssprop [--hx-opacity-90] - Opacity.\n * @cssprop [--hx-opacity-50] - Opacity.\n */\n@customElement('hx-phi-field')\nexport class HelixPhiField extends HelixElement {\n static override styles = [helixPhiFieldStyles, forcedColorsField];\n\n // ─── Public Properties ───\n\n /**\n * The Protected Health Information value to display or mask.\n * Must be set via the JavaScript property (`element.data = \"...\"`) — not as an HTML attribute.\n * Setting PHI as an HTML attribute exposes it in the DOM and browser caches (HIPAA violation).\n */\n @property({ attribute: false })\n data: string = '';\n\n /**\n * The type of PHI field. Controls the masking pattern applied.\n * @attr field-type\n */\n @property({ type: String, reflect: true, attribute: 'field-type' })\n fieldType: 'ssn' | 'mrn' | 'dob' | 'insurance' = 'ssn';\n\n /**\n * Identifier used in audit events. Falls back to the element's id attribute.\n * @attr field-id\n */\n @property({ type: String, attribute: 'field-id' })\n fieldId: string = '';\n\n /**\n * Milliseconds after clipboard write before the clipboard is automatically cleared.\n * Defaults to 30000 (30 seconds).\n * @attr clipboard-timeout\n */\n @property({ type: Number, attribute: 'clipboard-timeout' })\n clipboardTimeout: number = 30000;\n\n /**\n * Accessible label describing the PHI field. Used as a prefix in screen reader\n * announcements (e.g., \"Social Security Number is masked\").\n * @attr label\n */\n @property({ type: String })\n label: string = '';\n\n /**\n * Seconds of inactivity after reveal before PHI is automatically re-masked.\n * Prevents PHI from remaining visible indefinitely when a clinician walks away.\n * Set to 0 to disable auto-hide. Defaults to 60 seconds.\n * @attr auto-hide-delay\n */\n @property({ type: Number, attribute: 'auto-hide-delay' })\n autoHideDelay: number = 60;\n\n /**\n * When set, disables all interaction with the field and prevents reveal.\n * @attr disabled\n * @reflect\n */\n @property({ type: Boolean, reflect: true })\n disabled: boolean = false;\n\n // ─── Internal State ───\n\n /** @internal */\n @state() private _masked = true;\n\n /** @internal */\n private _clipboardTimer: ReturnType<typeof setTimeout> | null = null;\n\n /** @internal Timer ID for auto-re-mask after reveal. */\n private _autoHideTimer: ReturnType<typeof setTimeout> | null = null;\n\n // ─── Lifecycle ───\n\n /** @internal Bound reference for visibilitychange listener cleanup. */\n private readonly _boundHandleVisibilityChange = (): void => {\n if (document.visibilityState !== 'hidden') return;\n // Only clear if the field has been revealed (unmasked) or an active\n // clipboard-clear timer is running. Otherwise there's nothing to clear,\n // and emitting hx-phi-access with action: 'clipboard-clear' would pollute\n // the HIPAA audit log with events for fields that were never accessed.\n if (this._masked && this._clipboardTimer === null) return;\n this._clearClipboard();\n };\n\n /** @internal Bound reference for interaction-based auto-hide timer reset. */\n private readonly _boundResetAutoHideTimer = (): void => {\n this._resetAutoHideTimer();\n };\n\n override connectedCallback(): void {\n super.connectedCallback();\n // Enforce HIPAA compliance: prevent browser autofill on the host element\n this.setAttribute('autocomplete', 'off');\n // HIPAA: Clear clipboard immediately when tab is hidden (prevents PHI exposure\n // when setTimeout is throttled in backgrounded tabs on mobile/laptop lid close).\n document.addEventListener('visibilitychange', this._boundHandleVisibilityChange);\n // FS-029: PHI SSR/attribute exposure prevention.\n // If a developer (or server-rendered HTML) mistakenly sets PHI via the\n // `data` HTML attribute, the raw value is readable in the DOM source before\n // JavaScript initialises — a HIPAA risk on SSR pages. We recover the value\n // into the JS-only property and then immediately remove the attribute so\n // that no PHI is ever left exposed in the DOM tree or HTML source.\n if (this.hasAttribute('data')) {\n devWarn(\n 'hx-phi-field',\n 'Setting PHI via the `data` HTML attribute is not supported and exposes sensitive data in the DOM source. Use the `data` JS property (element.data = \"...\") instead.',\n );\n // Rescue the value into the private property so the component still works,\n // then strip the attribute so the raw PHI is no longer readable in the DOM.\n const rawValue = this.getAttribute('data');\n if (rawValue !== null) {\n this.data = rawValue;\n }\n this.removeAttribute('data');\n }\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this._cancelClipboardTimer();\n this._cancelAutoHideTimer();\n document.removeEventListener('visibilitychange', this._boundHandleVisibilityChange);\n }\n\n // ─── Private Helpers ───\n\n /** @internal */\n private _cancelClipboardTimer(): void {\n if (this._clipboardTimer !== null) {\n clearTimeout(this._clipboardTimer);\n this._clipboardTimer = null;\n }\n }\n\n /** @internal Cancel the auto-hide timer if running. */\n private _cancelAutoHideTimer(): void {\n if (this._autoHideTimer !== null) {\n clearTimeout(this._autoHideTimer);\n this._autoHideTimer = null;\n }\n this._removeAutoHideInteractionListeners();\n }\n\n /** @internal Start the auto-hide countdown. Resets if already running. */\n private _scheduleAutoHide(): void {\n this._cancelAutoHideTimer();\n if (this.autoHideDelay <= 0) return;\n\n this._addAutoHideInteractionListeners();\n this._autoHideTimer = setTimeout(() => {\n this._autoHideTimer = null;\n this._autoHide();\n }, this.autoHideDelay * 1000);\n }\n\n /** @internal Reset the auto-hide timer on user interaction. */\n private _resetAutoHideTimer(): void {\n if (this._autoHideTimer === null) return;\n this._scheduleAutoHide();\n }\n\n /** @internal Auto-hide PHI and dispatch audit event. */\n private _autoHide(): void {\n if (this._masked) return;\n\n this._removeAutoHideInteractionListeners();\n // Do NOT cancel the clipboard-clear timer — same reasoning as the manual\n // hide branch of `_handleToggle`. A reveal may have resulted in a copy,\n // and cancelling the scheduled clear would leave PHI on the clipboard\n // past the auto-hide ceiling.\n this._masked = true;\n\n this.dispatchEvent(\n new CustomEvent<PhiAccessEventDetail>('hx-phi-access', {\n bubbles: true,\n composed: true,\n detail: {\n fieldId: this.fieldId || this.id || '',\n action: 'auto-hide',\n timestamp: new Date().toISOString(),\n fieldType: this.fieldType,\n },\n }),\n );\n }\n\n /** @internal Interaction events that reset the auto-hide timer. */\n private static readonly _AUTO_HIDE_INTERACTION_EVENTS = [\n 'mouseenter',\n 'mousemove',\n 'focusin',\n 'keydown',\n 'pointerdown',\n ] as const;\n\n /** @internal Add interaction listeners to reset auto-hide timer. */\n private _addAutoHideInteractionListeners(): void {\n for (const event of HelixPhiField._AUTO_HIDE_INTERACTION_EVENTS) {\n this.addEventListener(event, this._boundResetAutoHideTimer);\n }\n }\n\n /** @internal Remove interaction listeners. */\n private _removeAutoHideInteractionListeners(): void {\n for (const event of HelixPhiField._AUTO_HIDE_INTERACTION_EVENTS) {\n this.removeEventListener(event, this._boundResetAutoHideTimer);\n }\n }\n\n /** @internal */\n private _scheduleClipboardClear(): void {\n this._cancelClipboardTimer();\n this._clipboardTimer = setTimeout(() => {\n this._clearClipboard();\n }, this.clipboardTimeout);\n }\n\n /** @internal */\n private _clearClipboard(): void {\n // Cancel any pending scheduled clear. When `_clearClipboard` is invoked\n // from the setTimeout callback the timer has already fired and this is a\n // no-op; when invoked from the visibilitychange pre-emption path it stops\n // the scheduled timer from firing again and dispatching a duplicate\n // clipboard-clear audit event.\n this._cancelClipboardTimer();\n // Also cancel the auto-hide timer and remove its interaction listeners.\n // `_clearClipboard` force-masks the field below, so any scheduled auto-hide\n // is now moot. Without this call the setTimeout stays pending and the\n // `mouseenter / mousemove / focusin / keydown / pointerdown` listeners\n // stay attached to the host; when the auto-hide timer later fires,\n // `_autoHide()` early-returns on `this._masked` WITHOUT removing the\n // listeners, leaking them until the next scheduleAutoHide/cancelAutoHideTimer\n // path runs. `_cancelAutoHideTimer` already closes both — one call suffices.\n this._cancelAutoHideTimer();\n this._masked = true;\n\n // `navigator.clipboard.writeText` requires transient user activation in\n // Chrome and Safari. The clipboard-clear timer fires async (activation\n // expired) and the visibilitychange pre-emption path has no activation\n // at all — both can reject silently. Dispatching an unconditional\n // clipboard-clear audit event in that case would be MISLEADING: the\n // audit trail would claim PHI was cleared while it in fact remains on\n // the clipboard. Instead we observe the writeText outcome and dispatch\n // `clipboard-clear` only on confirmed success, or `clipboard-clear-failed`\n // when the API is unavailable or the promise rejects. This gives\n // HIPAA audit consumers an accurate signal and lets them escalate\n // failures (prompt the user, flag the session, etc).\n const dispatchOutcome = (succeeded: boolean): void => {\n this.dispatchEvent(\n new CustomEvent<PhiAccessEventDetail>('hx-phi-access', {\n bubbles: true,\n composed: true,\n detail: {\n fieldId: this.fieldId || this.id || '',\n action: succeeded ? 'clipboard-clear' : 'clipboard-clear-failed',\n timestamp: new Date().toISOString(),\n fieldType: this.fieldType,\n },\n }),\n );\n };\n\n if (typeof navigator === 'undefined') {\n dispatchOutcome(false);\n return;\n }\n\n // Every remaining clipboard interaction — including the `navigator.clipboard`\n // read itself — runs inside this try. The Clipboard API's property descriptor\n // is UA-defined, so `navigator.clipboard` can legally be an accessor that\n // throws synchronously. Same for `clipboard.writeText`. Pulling the read\n // inside the try ensures any sync throw resolves to `clipboard-clear-failed`\n // instead of an uncaught error that would silently drop the HIPAA audit event.\n //\n // `navigator.clipboard` is captured exactly once and the same reference is\n // used for both the method read and the call's receiver. A shim that exposes\n // `navigator.clipboard` as a getter returning a fresh object per read (rare\n // but legal) would otherwise let us grab `writeText` from object A and invoke\n // it against object B — brand/instance checks inside a real polyfill would\n // then fail and the call would reject spuriously.\n //\n // Promise.resolve() on a non-thenable still resolves, so the then() path\n // normalizes the return value shape for us.\n try {\n const clipboard = navigator.clipboard;\n if (!clipboard) {\n dispatchOutcome(false);\n return;\n }\n const writeText = clipboard.writeText;\n if (typeof writeText !== 'function') {\n dispatchOutcome(false);\n return;\n }\n void Promise.resolve(writeText.call(clipboard, '')).then(\n () => dispatchOutcome(true),\n () => dispatchOutcome(false),\n );\n } catch {\n dispatchOutcome(false);\n }\n }\n\n /** @internal */\n private _getMaskedValue(): string {\n if (!this.data) return '';\n\n switch (this.fieldType) {\n case 'ssn': {\n // Format: xxx-xx-xxxx → ***-**-xxxx (show last 4 digits)\n // Match the separator-delimited pattern first\n const ssnMatch = this.data.match(/^(\\d{3})(-?)(\\d{2})(-?)(\\d{4})$/);\n if (ssnMatch) {\n return `***${ssnMatch[2]}**${ssnMatch[4]}${ssnMatch[5]}`;\n }\n // Fallback: mask all but last 4 chars\n return this.data.slice(0, -4).replace(/\\d/g, '*') + this.data.slice(-4);\n }\n\n case 'mrn': {\n // Mask all but last 4 alphanumeric characters, preserve separators\n const chars = this.data.split('');\n const alphanumericIndices: number[] = [];\n chars.forEach((ch, i) => {\n if (/[a-zA-Z0-9]/.test(ch)) {\n alphanumericIndices.push(i);\n }\n });\n const revealCount = Math.min(4, alphanumericIndices.length);\n const maskUntilIdx = alphanumericIndices.length - revealCount;\n const indicesToMask = new Set(alphanumericIndices.slice(0, maskUntilIdx));\n return chars.map((ch, i) => (indicesToMask.has(i) ? '*' : ch)).join('');\n }\n\n case 'dob': {\n // Replace ALL digits with *, preserve separators\n return this.data.replace(/\\d/g, '*');\n }\n\n case 'insurance': {\n // Format: xxxx-xxxx-xxxx-xxxx → ****-****-****-xxxx (show last 4 digits)\n const insMatch = this.data.match(/^(\\d{4})(-?)(\\d{4})(-?)(\\d{4})(-?)(\\d{4})$/);\n if (insMatch) {\n return `****${insMatch[2]}****${insMatch[4]}****${insMatch[6]}${insMatch[7]}`;\n }\n // Fallback: mask all but last 4 chars\n return this.data.slice(0, -4).replace(/[a-zA-Z0-9]/g, '*') + this.data.slice(-4);\n }\n\n default: {\n // Exhaustive check — fieldType is typed, but guard defensively\n const _exhaustive: never = this.fieldType;\n return _exhaustive;\n }\n }\n }\n\n // ─── Event Handlers ───\n\n /** @internal */\n private _handleToggle(): void {\n if (this.disabled) return;\n\n // Dispatch BEFORE toggling state so action reflects the upcoming state\n this.dispatchEvent(\n new CustomEvent<PhiAccessEventDetail>('hx-phi-access', {\n bubbles: true,\n composed: true,\n detail: {\n fieldId: this.fieldId || this.id || '',\n action: this._masked ? 'reveal' : 'hide',\n timestamp: new Date().toISOString(),\n fieldType: this.fieldType,\n },\n }),\n );\n\n if (this._masked) {\n // Revealing: start clipboard clear timer and auto-hide timer\n this._masked = false;\n this._scheduleClipboardClear();\n this._scheduleAutoHide();\n } else {\n // Hiding: cancel the auto-hide countdown (purpose already served — the\n // field is hidden). Do NOT cancel the clipboard-clear timer — the user\n // may have copied PHI while the field was revealed, and cancelling here\n // would strand it on the clipboard if the tab later backgrounds. The\n // timer fires naturally at `clipboardTimeout`, and the visibilitychange\n // handler will pre-empt it if the tab hides sooner.\n this._cancelAutoHideTimer();\n this._masked = true;\n }\n }\n\n /** @internal */\n private _handleCopy(e: ClipboardEvent): void {\n if (this._masked) {\n e.preventDefault();\n }\n }\n\n /** @internal */\n private _handlePaste(e: ClipboardEvent): void {\n if (this._masked) {\n e.preventDefault();\n }\n }\n\n // ─── Render Helpers ───\n\n /** @internal */\n private _renderEyeIcon(): TemplateResult {\n return html`<hx-icon\n class=\"phi-field__glyph\"\n library=\"helix\"\n name=\"eye\"\n aria-hidden=\"true\"\n ></hx-icon>`;\n }\n\n /** @internal */\n private _renderEyeOffIcon(): TemplateResult {\n return html`<hx-icon\n class=\"phi-field__glyph\"\n library=\"helix\"\n name=\"eye-off\"\n aria-hidden=\"true\"\n ></hx-icon>`;\n }\n\n // ─── Render ───\n\n override render() {\n const fieldLabel = this.label || 'Protected health information';\n const maskedLabel = `${fieldLabel} is masked`;\n const revealedLabel = `${fieldLabel} is revealed`;\n const revealActionLabel = `Reveal ${fieldLabel.toLowerCase()}`;\n const hideActionLabel = `Hide ${fieldLabel.toLowerCase()}`;\n\n return html`\n <div\n part=\"container\"\n class=${classMap({ 'phi-field': true, 'phi-field--disabled': this.disabled })}\n @copy=${this._handleCopy}\n @paste=${this._handlePaste}\n >\n ${this._masked\n ? html`<span\n part=\"value\"\n class=\"phi-field__value phi-field__value--masked\"\n aria-hidden=\"true\"\n >${this._getMaskedValue()}</span\n >`\n : html`<span part=\"value\" class=\"phi-field__value phi-field__value--revealed\"\n >${this.data}</span\n >`}\n <span role=\"status\" aria-live=\"polite\" aria-atomic=\"true\" class=\"phi-field__status\">\n ${this._masked ? maskedLabel : revealedLabel}\n </span>\n <button\n part=\"toggle\"\n class=\"phi-field__toggle\"\n type=\"button\"\n ?disabled=${this.disabled}\n aria-label=${this._masked ? revealActionLabel : hideActionLabel}\n aria-pressed=${String(!this._masked)}\n @click=${this._handleToggle}\n >\n ${this._masked ? this._renderEyeIcon() : this._renderEyeOffIcon()}\n </button>\n </div>\n `;\n }\n}\n\n/**\n * Audit metadata for PHI access events. This interface intentionally contains\n * only identifiers and action metadata — never raw PHI values. The separation\n * of audit trail data from PHI content is a deliberate HIPAA security boundary.\n *\n * **Security invariant**: No field in this interface should ever contain the\n * actual protected health information (SSN digits, MRN value, date of birth,\n * insurance number). The `fieldId` is a developer-assigned logical identifier,\n * not the PHI value itself.\n */\nexport interface PhiAccessEventDetail {\n /** Developer-assigned logical identifier for the field (NOT the PHI value). */\n fieldId: string;\n /**\n * The action that triggered the audit event.\n *\n * - `clipboard-clear`: `navigator.clipboard.writeText('')` resolved successfully\n * — the clipboard has been confirmed cleared.\n * - `clipboard-clear-failed`: the clipboard API was unavailable OR `writeText('')`\n * rejected (most commonly because the browser required transient user\n * activation that the timer or visibilitychange pre-emption path did not\n * provide). The clipboard MAY still contain PHI. HIPAA audit consumers\n * should treat this as an actionable event — prompt the user to manually\n * clear their clipboard, flag the session, or escalate per policy.\n */\n action: 'reveal' | 'hide' | 'auto-hide' | 'clipboard-clear' | 'clipboard-clear-failed';\n /** ISO 8601 timestamp of the access event. */\n timestamp: string;\n /** The category of PHI this field contains. */\n fieldType: 'ssn' | 'mrn' | 'dob' | 'insurance';\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-phi-field': HelixPhiField;\n }\n}\n"],"names":["helixPhiFieldStyles","css","HelixPhiField","HelixElement","rawValue","event","dispatchOutcome","succeeded","clipboard","writeText","ssnMatch","chars","alphanumericIndices","ch","i","revealCount","maskUntilIdx","indicesToMask","insMatch","html","fieldLabel","maskedLabel","revealedLabel","revealActionLabel","hideActionLabel","classMap","forcedColorsField","__decorateClass","property","state","customElement"],"mappings":"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"}