@helixui/library 3.2.0-next.91 → 3.2.0-next.94

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 (222) hide show
  1. package/custom-elements.json +1 -1
  2. package/dist/components/hx-accordion/hx-accordion-item.styles.d.ts.map +1 -1
  3. package/dist/components/hx-accordion/index.js +1 -1
  4. package/dist/components/hx-alert/index.js +1 -1
  5. package/dist/components/hx-banner/index.js +1 -1
  6. package/dist/components/hx-breadcrumb/hx-breadcrumb-item.styles.d.ts.map +1 -1
  7. package/dist/components/hx-breadcrumb/index.js +1 -1
  8. package/dist/components/hx-button/hx-button.styles.d.ts.map +1 -1
  9. package/dist/components/hx-button/index.js +1 -1
  10. package/dist/components/hx-card/hx-card.styles.d.ts.map +1 -1
  11. package/dist/components/hx-card/index.js +1 -1
  12. package/dist/components/hx-checkbox/index.js +1 -1
  13. package/dist/components/hx-clinical-status/hx-clinical-status.styles.d.ts.map +1 -1
  14. package/dist/components/hx-clinical-status/index.js +1 -1
  15. package/dist/components/hx-code-snippet/index.js +1 -1
  16. package/dist/components/hx-color-picker/hx-color-picker.styles.d.ts.map +1 -1
  17. package/dist/components/hx-color-picker/index.js +1 -1
  18. package/dist/components/hx-combobox/index.js +1 -1
  19. package/dist/components/hx-data-table/hx-data-table.styles.d.ts.map +1 -1
  20. package/dist/components/hx-data-table/index.js +1 -1
  21. package/dist/components/hx-date-picker/index.js +1 -1
  22. package/dist/components/hx-dialog/hx-dialog.styles.d.ts.map +1 -1
  23. package/dist/components/hx-dialog/index.js +1 -1
  24. package/dist/components/hx-drawer/hx-drawer.styles.d.ts.map +1 -1
  25. package/dist/components/hx-drawer/index.js +1 -1
  26. package/dist/components/hx-file-upload/index.js +1 -1
  27. package/dist/components/hx-icon-button/hx-icon-button.styles.d.ts.map +1 -1
  28. package/dist/components/hx-icon-button/index.js +1 -1
  29. package/dist/components/hx-link/index.js +1 -1
  30. package/dist/components/hx-menu/hx-menu-item.styles.d.ts.map +1 -1
  31. package/dist/components/hx-menu/index.js +1 -1
  32. package/dist/components/hx-meter/hx-meter.styles.d.ts.map +1 -1
  33. package/dist/components/hx-meter/index.js +1 -1
  34. package/dist/components/hx-nav/hx-nav.styles.d.ts.map +1 -1
  35. package/dist/components/hx-nav/index.js +1 -1
  36. package/dist/components/hx-overflow-menu/hx-overflow-menu.styles.d.ts.map +1 -1
  37. package/dist/components/hx-overflow-menu/index.js +1 -1
  38. package/dist/components/hx-pagination/hx-pagination.styles.d.ts.map +1 -1
  39. package/dist/components/hx-pagination/index.js +1 -1
  40. package/dist/components/hx-phi-field/hx-phi-field.styles.d.ts.map +1 -1
  41. package/dist/components/hx-phi-field/index.js +1 -1
  42. package/dist/components/hx-popover/hx-popover.styles.d.ts.map +1 -1
  43. package/dist/components/hx-popover/index.js +1 -1
  44. package/dist/components/hx-radio-group/index.js +1 -1
  45. package/dist/components/hx-rating/index.js +1 -1
  46. package/dist/components/hx-select/index.js +1 -1
  47. package/dist/components/hx-side-nav/index.js +1 -1
  48. package/dist/components/hx-slider/index.js +1 -1
  49. package/dist/components/hx-split-button/hx-split-button.d.ts +1 -1
  50. package/dist/components/hx-split-button/index.js +1 -1
  51. package/dist/components/hx-split-panel/hx-split-panel.styles.d.ts.map +1 -1
  52. package/dist/components/hx-split-panel/index.js +1 -1
  53. package/dist/components/hx-steps/hx-step.styles.d.ts.map +1 -1
  54. package/dist/components/hx-steps/index.js +1 -1
  55. package/dist/components/hx-switch/index.js +1 -1
  56. package/dist/components/hx-table/hx-table.styles.d.ts.map +1 -1
  57. package/dist/components/hx-table/index.js +1 -1
  58. package/dist/components/hx-tabs/index.js +1 -1
  59. package/dist/components/hx-text-input/index.js +1 -1
  60. package/dist/components/hx-textarea/index.js +1 -1
  61. package/dist/components/hx-time-picker/index.js +1 -1
  62. package/dist/components/hx-toggle-button/index.js +1 -1
  63. package/dist/components/hx-top-nav/hx-top-nav.styles.d.ts.map +1 -1
  64. package/dist/components/hx-top-nav/index.js +1 -1
  65. package/dist/components/hx-tree-view/hx-tree-item.styles.d.ts.map +1 -1
  66. package/dist/components/hx-tree-view/index.js +1 -1
  67. package/dist/css/helix-all.css +94 -149
  68. package/dist/css/helix-core.css +16 -12
  69. package/dist/css/helix-data.css +7 -14
  70. package/dist/css/helix-feedback.css +4 -5
  71. package/dist/css/helix-forms.css +42 -52
  72. package/dist/css/helix-layout.css +2 -8
  73. package/dist/css/helix-navigation.css +12 -33
  74. package/dist/css/helix-overlay.css +3 -12
  75. package/dist/css/helix-tokens.css +16 -5
  76. package/dist/css/helix-utility.css +5 -5
  77. package/dist/css/hx-alert.css +1 -1
  78. package/dist/css/hx-banner.css +2 -2
  79. package/dist/css/hx-button.css +12 -2
  80. package/dist/css/hx-card.css +1 -4
  81. package/dist/css/hx-checkbox.css +2 -2
  82. package/dist/css/hx-clinical-status.css +2 -4
  83. package/dist/css/hx-code-snippet.css +4 -4
  84. package/dist/css/hx-color-picker.css +3 -13
  85. package/dist/css/hx-combobox.css +4 -4
  86. package/dist/css/hx-data-table.css +2 -8
  87. package/dist/css/hx-date-picker.css +7 -7
  88. package/dist/css/hx-dialog.css +1 -4
  89. package/dist/css/hx-drawer.css +1 -4
  90. package/dist/css/hx-file-upload.css +1 -1
  91. package/dist/css/hx-icon-button.css +2 -5
  92. package/dist/css/hx-link.css +1 -1
  93. package/dist/css/hx-meter.css +1 -2
  94. package/dist/css/hx-nav.css +2 -8
  95. package/dist/css/hx-overflow-menu.css +2 -8
  96. package/dist/css/hx-pagination.css +2 -8
  97. package/dist/css/hx-phi-field.css +1 -4
  98. package/dist/css/hx-popover.css +1 -4
  99. package/dist/css/hx-rating.css +3 -3
  100. package/dist/css/hx-select.css +2 -2
  101. package/dist/css/hx-side-nav.css +4 -4
  102. package/dist/css/hx-slider.css +4 -4
  103. package/dist/css/hx-split-button.css +5 -5
  104. package/dist/css/hx-split-panel.css +2 -8
  105. package/dist/css/hx-switch.css +3 -3
  106. package/dist/css/hx-table.css +1 -2
  107. package/dist/css/hx-text-input.css +4 -4
  108. package/dist/css/hx-textarea.css +2 -2
  109. package/dist/css/hx-time-picker.css +3 -3
  110. package/dist/css/hx-toggle-button.css +4 -4
  111. package/dist/css/hx-top-nav.css +1 -4
  112. package/dist/css/hx-tree-view.css +1 -1
  113. package/dist/css/index.css +1 -1
  114. package/dist/css/manifest.json +27 -25
  115. package/dist/index.js +42 -42
  116. package/dist/shared/{hx-accordion-cnKg4_la.js → hx-accordion-ZVzgDzTG.js} +4 -5
  117. package/dist/shared/hx-accordion-ZVzgDzTG.js.map +1 -0
  118. package/dist/shared/{hx-alert-BZH8iHQf.js → hx-alert-C597yHpD.js} +2 -2
  119. package/dist/shared/{hx-alert-BZH8iHQf.js.map → hx-alert-C597yHpD.js.map} +1 -1
  120. package/dist/shared/{hx-banner-DT7Zn9Bo.js → hx-banner-Cxd7eFUP.js} +3 -3
  121. package/dist/shared/{hx-banner-DT7Zn9Bo.js.map → hx-banner-Cxd7eFUP.js.map} +1 -1
  122. package/dist/shared/{hx-breadcrumb-item-COeYcB2x.js → hx-breadcrumb-item-3tKppF9h.js} +2 -5
  123. package/dist/shared/{hx-breadcrumb-item-COeYcB2x.js.map → hx-breadcrumb-item-3tKppF9h.js.map} +1 -1
  124. package/dist/shared/{hx-button-ebUV8KhT.js → hx-button-D3gC-OJb.js} +13 -3
  125. package/dist/shared/hx-button-D3gC-OJb.js.map +1 -0
  126. package/dist/shared/{hx-card-CU1QnjNb.js → hx-card-qNAM2QNV.js} +6 -9
  127. package/dist/shared/hx-card-qNAM2QNV.js.map +1 -0
  128. package/dist/shared/{hx-checkbox-C46TyXhM.js → hx-checkbox-DBD-gMoz.js} +3 -3
  129. package/dist/shared/{hx-checkbox-C46TyXhM.js.map → hx-checkbox-DBD-gMoz.js.map} +1 -1
  130. package/dist/shared/{hx-clinical-status-BmSjfSEN.js → hx-clinical-status-D3XQIOqX.js} +3 -5
  131. package/dist/shared/hx-clinical-status-D3XQIOqX.js.map +1 -0
  132. package/dist/shared/{hx-code-snippet-CJ0FbQYG.js → hx-code-snippet-CJrFeyz0.js} +5 -5
  133. package/dist/shared/{hx-code-snippet-CJ0FbQYG.js.map → hx-code-snippet-CJrFeyz0.js.map} +1 -1
  134. package/dist/shared/{hx-color-picker-DiDLZyvK.js → hx-color-picker-uRc865FJ.js} +23 -33
  135. package/dist/shared/hx-color-picker-uRc865FJ.js.map +1 -0
  136. package/dist/shared/{hx-combobox-DaA5dBC4.js → hx-combobox-M1yregCS.js} +5 -5
  137. package/dist/shared/{hx-combobox-DaA5dBC4.js.map → hx-combobox-M1yregCS.js.map} +1 -1
  138. package/dist/shared/{hx-data-table-Cq3t86Ic.js → hx-data-table-CLqVqdxr.js} +3 -9
  139. package/dist/shared/hx-data-table-CLqVqdxr.js.map +1 -0
  140. package/dist/shared/{hx-date-picker-DMqRQNSB.js → hx-date-picker-BJm7Yrda.js} +8 -8
  141. package/dist/shared/{hx-date-picker-DMqRQNSB.js.map → hx-date-picker-BJm7Yrda.js.map} +1 -1
  142. package/dist/shared/{hx-dialog-eIS8tcDm.js → hx-dialog-DRN_1-Y-.js} +2 -5
  143. package/dist/shared/hx-dialog-DRN_1-Y-.js.map +1 -0
  144. package/dist/shared/{hx-drawer-DDhDz7RI.js → hx-drawer-Y1Ui2IWJ.js} +2 -5
  145. package/dist/shared/hx-drawer-Y1Ui2IWJ.js.map +1 -0
  146. package/dist/shared/{hx-file-upload-zTDbjsRw.js → hx-file-upload-B4L_Nkm-.js} +11 -11
  147. package/dist/shared/{hx-file-upload-zTDbjsRw.js.map → hx-file-upload-B4L_Nkm-.js.map} +1 -1
  148. package/dist/shared/{hx-icon-button-BmV97nqz.js → hx-icon-button-CGNdQSFM.js} +3 -6
  149. package/dist/shared/hx-icon-button-CGNdQSFM.js.map +1 -0
  150. package/dist/shared/{hx-link-DmiV-mPw.js → hx-link-9Ig2DW6L.js} +5 -5
  151. package/dist/shared/{hx-link-DmiV-mPw.js.map → hx-link-9Ig2DW6L.js.map} +1 -1
  152. package/dist/shared/{hx-menu-divider-j__TZjH2.js → hx-menu-divider-C2omnPtj.js} +2 -5
  153. package/dist/shared/hx-menu-divider-C2omnPtj.js.map +1 -0
  154. package/dist/shared/{hx-meter-Cm7k_Ro8.js → hx-meter-BPscsw5t.js} +2 -3
  155. package/dist/shared/hx-meter-BPscsw5t.js.map +1 -0
  156. package/dist/shared/{hx-nav-item-CvTxO3Sa.js → hx-nav-item-DH2tXcj1.js} +6 -6
  157. package/dist/shared/{hx-nav-item-CvTxO3Sa.js.map → hx-nav-item-DH2tXcj1.js.map} +1 -1
  158. package/dist/shared/{hx-nav-LoyEKZQC.js → hx-nav-ldFM3Fle.js} +37 -43
  159. package/dist/shared/hx-nav-ldFM3Fle.js.map +1 -0
  160. package/dist/shared/{hx-overflow-menu-BmKyAp5D.js → hx-overflow-menu-DCLsdIBy.js} +3 -9
  161. package/dist/shared/hx-overflow-menu-DCLsdIBy.js.map +1 -0
  162. package/dist/shared/{hx-pagination-Dqw5dorC.js → hx-pagination-C7y8GVyU.js} +54 -60
  163. package/dist/shared/hx-pagination-C7y8GVyU.js.map +1 -0
  164. package/dist/shared/{hx-phi-field-Bf9TdtC1.js → hx-phi-field-C19oxlrr.js} +2 -5
  165. package/dist/shared/hx-phi-field-C19oxlrr.js.map +1 -0
  166. package/dist/shared/{hx-popover-B93rTAfr.js → hx-popover-B-FP3-wW.js} +8 -11
  167. package/dist/shared/hx-popover-B-FP3-wW.js.map +1 -0
  168. package/dist/shared/{hx-radio-N8xgDd_5.js → hx-radio-dFjUAost.js} +4 -4
  169. package/dist/shared/{hx-radio-N8xgDd_5.js.map → hx-radio-dFjUAost.js.map} +1 -1
  170. package/dist/shared/{hx-rating-i2FL1WUN.js → hx-rating-CGtsejNf.js} +4 -4
  171. package/dist/shared/{hx-rating-i2FL1WUN.js.map → hx-rating-CGtsejNf.js.map} +1 -1
  172. package/dist/shared/{hx-select-vgaBo1Ai.js → hx-select-zfIRr9qM.js} +3 -3
  173. package/dist/shared/{hx-select-vgaBo1Ai.js.map → hx-select-zfIRr9qM.js.map} +1 -1
  174. package/dist/shared/{hx-slider-ydBamYhd.js → hx-slider-m0aEClH1.js} +5 -5
  175. package/dist/shared/{hx-slider-ydBamYhd.js.map → hx-slider-m0aEClH1.js.map} +1 -1
  176. package/dist/shared/{hx-split-button-BeMsmS6N.js → hx-split-button-BxDFfx4D.js} +6 -6
  177. package/dist/shared/{hx-split-button-BeMsmS6N.js.map → hx-split-button-BxDFfx4D.js.map} +1 -1
  178. package/dist/shared/{hx-split-panel-BVG1VWNT.js → hx-split-panel-B-u0Z3mm.js} +3 -9
  179. package/dist/shared/hx-split-panel-B-u0Z3mm.js.map +1 -0
  180. package/dist/shared/{hx-step-DL3PbOzm.js → hx-step-R2rjp1fT.js} +2 -5
  181. package/dist/shared/hx-step-R2rjp1fT.js.map +1 -0
  182. package/dist/shared/{hx-switch-Dougzsgp.js → hx-switch-DvAW4YY-.js} +4 -4
  183. package/dist/shared/{hx-switch-Dougzsgp.js.map → hx-switch-DvAW4YY-.js.map} +1 -1
  184. package/dist/shared/{hx-tab-panel-CbkO9VKu.js → hx-tab-panel-SWOEHuJc.js} +3 -3
  185. package/dist/shared/{hx-tab-panel-CbkO9VKu.js.map → hx-tab-panel-SWOEHuJc.js.map} +1 -1
  186. package/dist/shared/{hx-td-1zwTFLRw.js → hx-td-DnnEMIuA.js} +2 -3
  187. package/dist/shared/hx-td-DnnEMIuA.js.map +1 -0
  188. package/dist/shared/{hx-text-input-ClrrmoE1.js → hx-text-input-Bn7Gn8CI.js} +5 -5
  189. package/dist/shared/{hx-text-input-ClrrmoE1.js.map → hx-text-input-Bn7Gn8CI.js.map} +1 -1
  190. package/dist/shared/{hx-textarea-D9O4U8cb.js → hx-textarea-Jx1xnhgv.js} +7 -7
  191. package/dist/shared/{hx-textarea-D9O4U8cb.js.map → hx-textarea-Jx1xnhgv.js.map} +1 -1
  192. package/dist/shared/{hx-time-picker-m0z4nFB-.js → hx-time-picker-BoEIZwzv.js} +4 -4
  193. package/dist/shared/{hx-time-picker-m0z4nFB-.js.map → hx-time-picker-BoEIZwzv.js.map} +1 -1
  194. package/dist/shared/{hx-toggle-button-Dd8clXB4.js → hx-toggle-button-DPAIh_Xo.js} +24 -24
  195. package/dist/shared/{hx-toggle-button-Dd8clXB4.js.map → hx-toggle-button-DPAIh_Xo.js.map} +1 -1
  196. package/dist/shared/{hx-top-nav-CchPYaiV.js → hx-top-nav-DP6OFS8C.js} +11 -14
  197. package/dist/shared/hx-top-nav-DP6OFS8C.js.map +1 -0
  198. package/dist/shared/{hx-tree-item-DtMC3DTa.js → hx-tree-item-Dt0Ozqyr.js} +4 -10
  199. package/dist/shared/hx-tree-item-Dt0Ozqyr.js.map +1 -0
  200. package/figma-inventory.json +3 -3
  201. package/package.json +2 -2
  202. package/dist/shared/hx-accordion-cnKg4_la.js.map +0 -1
  203. package/dist/shared/hx-button-ebUV8KhT.js.map +0 -1
  204. package/dist/shared/hx-card-CU1QnjNb.js.map +0 -1
  205. package/dist/shared/hx-clinical-status-BmSjfSEN.js.map +0 -1
  206. package/dist/shared/hx-color-picker-DiDLZyvK.js.map +0 -1
  207. package/dist/shared/hx-data-table-Cq3t86Ic.js.map +0 -1
  208. package/dist/shared/hx-dialog-eIS8tcDm.js.map +0 -1
  209. package/dist/shared/hx-drawer-DDhDz7RI.js.map +0 -1
  210. package/dist/shared/hx-icon-button-BmV97nqz.js.map +0 -1
  211. package/dist/shared/hx-menu-divider-j__TZjH2.js.map +0 -1
  212. package/dist/shared/hx-meter-Cm7k_Ro8.js.map +0 -1
  213. package/dist/shared/hx-nav-LoyEKZQC.js.map +0 -1
  214. package/dist/shared/hx-overflow-menu-BmKyAp5D.js.map +0 -1
  215. package/dist/shared/hx-pagination-Dqw5dorC.js.map +0 -1
  216. package/dist/shared/hx-phi-field-Bf9TdtC1.js.map +0 -1
  217. package/dist/shared/hx-popover-B93rTAfr.js.map +0 -1
  218. package/dist/shared/hx-split-panel-BVG1VWNT.js.map +0 -1
  219. package/dist/shared/hx-step-DL3PbOzm.js.map +0 -1
  220. package/dist/shared/hx-td-1zwTFLRw.js.map +0 -1
  221. package/dist/shared/hx-top-nav-CchPYaiV.js.map +0 -1
  222. package/dist/shared/hx-tree-item-DtMC3DTa.js.map +0 -1
package/dist/css/helix-overlay.css CHANGED
@@ -154,10 +154,7 @@
154
154
 
155
155
  .dialog__close-btn:focus-visible {
156
156
  outline: var(--hx-focus-ring-width, 2px) solid
157
- var(
158
- --hx-dialog-close-btn-focus-ring-color,
159
- var(--hx-focus-ring-color, var(--hx-color-primary-500, #429797))
160
- );
157
+ var(--hx-dialog-close-btn-focus-ring-color, var(--hx-focus-ring-color, #0f7078));
161
158
  outline-offset: var(--hx-focus-ring-offset, 2px);
162
159
  }
163
160
 
@@ -429,10 +426,7 @@
429
426
 
430
427
  .drawer-close-button:focus-visible {
431
428
  outline: var(--hx-focus-ring-width, 2px) solid
432
- var(
433
- --hx-drawer-close-btn-focus-ring-color,
434
- var(--hx-focus-ring-color, var(--hx-color-primary-500, #429797))
435
- );
429
+ var(--hx-drawer-close-btn-focus-ring-color, var(--hx-focus-ring-color, #0f7078));
436
430
  outline-offset: var(--hx-focus-ring-offset, 2px);
437
431
  }
438
432
 
@@ -601,10 +595,7 @@
601
595
 
602
596
  [part='body']:focus-visible {
603
597
  outline: var(--hx-focus-ring-width, 2px) solid
604
- var(
605
- --hx-popover-focus-ring-color,
606
- var(--hx-focus-ring-color, var(--hx-color-primary-500, #429797))
607
- );
598
+ var(--hx-popover-focus-ring-color, var(--hx-focus-ring-color, #0f7078));
608
599
  outline-offset: var(--hx-focus-ring-offset, 2px);
609
600
  }
610
601
 
package/dist/css/helix-tokens.css CHANGED
@@ -121,15 +121,16 @@
121
121
  --hx-color-surface-info-strong: var(--hx-color-primary-600);
122
122
  --hx-color-border-default: var(--hx-color-neutral-200);
123
123
  --hx-color-border-subtle: var(--hx-color-neutral-100);
124
- --hx-color-border-strong: var(--hx-color-neutral-400);
124
+ --hx-color-border-strong: var(--hx-color-neutral-500);
125
125
  --hx-color-border-focus: var(--hx-color-primary-500);
126
126
  --hx-color-border-on-dark-strong: var(--hx-overlay-white-70);
127
127
  --hx-color-border-on-dark-default: var(--hx-overlay-white-30);
128
128
  --hx-color-border-on-dark-subtle: var(--hx-overlay-white-10);
129
- --hx-color-focus-ring: var(--hx-color-primary-400);
129
+ --hx-color-focus-ring: var(--hx-color-primary-600);
130
130
  --hx-color-selection-bg: var(--hx-color-primary-200);
131
131
  --hx-color-selection-color: var(--hx-color-neutral-900);
132
132
  --hx-color-action-primary-bg: var(--hx-color-primary-500);
133
+ --hx-color-action-primary-bg-inverted-rest: var(--hx-color-primary-500);
133
134
  --hx-color-action-primary-bg-hover: var(--hx-color-primary-600);
134
135
  --hx-color-action-primary-bg-active: var(--hx-color-primary-700);
135
136
  --hx-color-action-primary-bg-inverted-hover: var(--hx-color-primary-400);
@@ -241,7 +242,7 @@
241
242
  --hx-transition-slow: 350ms ease;
242
243
  --hx-touch-target-min: 2.75rem;
243
244
  --hx-touch-target-size: 44px;
244
- --hx-focus-ring-color: var(--hx-color-primary-400);
245
+ --hx-focus-ring-color: var(--hx-color-primary-600);
245
246
  --hx-focus-ring-width: 2px;
246
247
  --hx-focus-ring-offset: 2px;
247
248
  --hx-focus-ring-style: solid;
@@ -369,11 +370,15 @@
369
370
  --hx-color-surface-overlay: rgba(0, 0, 0, 0.85);
370
371
  --hx-color-border-default: var(--hx-color-neutral-700);
371
372
  --hx-color-border-subtle: var(--hx-color-neutral-800);
372
- --hx-color-border-strong: var(--hx-color-neutral-500);
373
+ --hx-color-border-strong: var(--hx-color-neutral-400);
373
374
  --hx-color-border-focus: var(--hx-color-primary-400);
375
+ --hx-color-border-on-dark-strong: var(--hx-overlay-black-50);
376
+ --hx-color-border-on-dark-default: var(--hx-overlay-black-30);
377
+ --hx-color-border-on-dark-subtle: var(--hx-overlay-black-10);
374
378
  --hx-color-focus-ring: var(--hx-color-primary-400);
375
379
  --hx-color-selection-bg: var(--hx-color-primary-800);
376
380
  --hx-color-selection-color: var(--hx-color-neutral-100);
381
+ --hx-color-action-primary-bg-inverted-rest: var(--hx-color-primary-600);
377
382
  --hx-color-action-secondary-fg: var(--hx-color-primary-400);
378
383
  --hx-color-action-secondary-border: var(--hx-color-primary-400);
379
384
  --hx-color-action-secondary-bg-hover: var(--hx-color-primary-900);
@@ -381,6 +386,7 @@
381
386
  --hx-color-action-ghost-bg-hover: var(--hx-color-primary-900);
382
387
  --hx-body-bg: var(--hx-color-surface-default);
383
388
  --hx-body-color: var(--hx-color-text-primary);
389
+ --hx-focus-ring-color: var(--hx-color-primary-400);
384
390
  --hx-shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.3);
385
391
  --hx-shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.4), 0 2px 4px -2px rgb(0 0 0 / 0.3);
386
392
  --hx-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.4), 0 4px 6px -4px rgb(0 0 0 / 0.3);
@@ -410,11 +416,15 @@
410
416
  --hx-color-surface-overlay: rgba(0, 0, 0, 0.85);
411
417
  --hx-color-border-default: var(--hx-color-neutral-700);
412
418
  --hx-color-border-subtle: var(--hx-color-neutral-800);
413
- --hx-color-border-strong: var(--hx-color-neutral-500);
419
+ --hx-color-border-strong: var(--hx-color-neutral-400);
414
420
  --hx-color-border-focus: var(--hx-color-primary-400);
421
+ --hx-color-border-on-dark-strong: var(--hx-overlay-black-50);
422
+ --hx-color-border-on-dark-default: var(--hx-overlay-black-30);
423
+ --hx-color-border-on-dark-subtle: var(--hx-overlay-black-10);
415
424
  --hx-color-focus-ring: var(--hx-color-primary-400);
416
425
  --hx-color-selection-bg: var(--hx-color-primary-800);
417
426
  --hx-color-selection-color: var(--hx-color-neutral-100);
427
+ --hx-color-action-primary-bg-inverted-rest: var(--hx-color-primary-600);
418
428
  --hx-color-action-secondary-fg: var(--hx-color-primary-400);
419
429
  --hx-color-action-secondary-border: var(--hx-color-primary-400);
420
430
  --hx-color-action-secondary-bg-hover: var(--hx-color-primary-900);
@@ -422,6 +432,7 @@
422
432
  --hx-color-action-ghost-bg-hover: var(--hx-color-primary-900);
423
433
  --hx-body-bg: var(--hx-color-surface-default);
424
434
  --hx-body-color: var(--hx-color-text-primary);
435
+ --hx-focus-ring-color: var(--hx-color-primary-400);
425
436
  --hx-shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.3);
426
437
  --hx-shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.4), 0 2px 4px -2px rgb(0 0 0 / 0.3);
427
438
  --hx-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.4), 0 4px 6px -4px rgb(0 0 0 / 0.3);
package/dist/css/helix-utility.css CHANGED
@@ -417,7 +417,7 @@
417
417
  outline: var(--hx-focus-ring-width, 2px) solid
418
418
  var(
419
419
  --hx-split-button-focus-ring-color,
420
- var(--hx-focus-ring-color, var(--hx-color-primary-400, #6ab1b1))
420
+ var(--hx-focus-ring-color, var(--hx-color-primary-600, #0f7078))
421
421
  );
422
422
  outline-offset: var(--hx-focus-ring-offset, 2px);
423
423
  z-index: 1;
@@ -445,7 +445,7 @@
445
445
  flex-shrink: 0;
446
446
  border: var(--hx-border-width-thin, 1px) solid var(--hx-split-button-border-color, transparent);
447
447
  border-inline-start: var(--hx-border-width-thin, 1px) solid
448
- var(--hx-split-button-divider-color, var(--hx-color-primary-400, #6ab1b1));
448
+ var(--hx-split-button-divider-color, var(--hx-color-primary-900, #0b3232));
449
449
  border-radius: 0 var(--hx-split-button-border-radius, var(--hx-border-radius-md, 0.375rem))
450
450
  var(--hx-split-button-border-radius, var(--hx-border-radius-md, 0.375rem)) 0;
451
451
  background-color: var(--hx-split-button-bg, var(--hx-color-primary-500, #429797));
@@ -462,7 +462,7 @@
462
462
  outline: var(--hx-focus-ring-width, 2px) solid
463
463
  var(
464
464
  --hx-split-button-focus-ring-color,
465
- var(--hx-focus-ring-color, var(--hx-color-primary-400, #6ab1b1))
465
+ var(--hx-focus-ring-color, var(--hx-color-primary-600, #0f7078))
466
466
  );
467
467
  outline-offset: var(--hx-focus-ring-offset, 2px);
468
468
  z-index: 1;
@@ -539,7 +539,7 @@
539
539
  --hx-split-button-bg: var(--hx-color-primary-500, #429797);
540
540
  --hx-split-button-color: var(--hx-color-text-on-primary, #ffffff);
541
541
  --hx-split-button-border-color: transparent;
542
- --hx-split-button-divider-color: var(--hx-color-primary-400, #6ab1b1);
542
+ --hx-split-button-divider-color: var(--hx-color-primary-900, #0b3232);
543
543
  }
544
544
 
545
545
  /* primary:hover — replace the universal brightness(0.9) filter (which would
@@ -626,7 +626,7 @@
626
626
  .split-button--outline .split-button__trigger {
627
627
  --hx-split-button-bg: transparent;
628
628
  --hx-split-button-color: var(--hx-color-text-primary, #0d1825);
629
- --hx-split-button-border-color: var(--hx-color-border-strong, #8e9c98);
629
+ --hx-split-button-border-color: var(--hx-color-border-strong, #66787b);
630
630
  --hx-split-button-divider-color: var(--hx-color-border-default, #d6dbd5);
631
631
  }
632
632
 
package/dist/css/hx-alert.css CHANGED
@@ -160,7 +160,7 @@
160
160
  outline: var(--hx-focus-ring-width, 2px) solid
161
161
  var(
162
162
  --hx-alert-close-btn-focus-ring-color,
163
- var(--hx-focus-ring-color, var(--hx-color-primary-400, #6ab1b1))
163
+ var(--hx-focus-ring-color, var(--hx-color-primary-600, #0f7078))
164
164
  );
165
165
  outline-offset: var(--hx-focus-ring-offset, 2px);
166
166
  opacity: 1;
package/dist/css/hx-banner.css CHANGED
@@ -98,7 +98,7 @@
98
98
  outline: var(--hx-focus-ring-width, 2px) solid
99
99
  var(
100
100
  --hx-banner-action-focus-ring-color,
101
- var(--hx-focus-ring-color, var(--hx-color-primary-400, #6ab1b1))
101
+ var(--hx-focus-ring-color, var(--hx-color-primary-600, #0f7078))
102
102
  );
103
103
  outline-offset: var(--hx-focus-ring-offset, 2px);
104
104
  border-radius: var(--hx-border-radius-sm, 0.25rem);
@@ -142,7 +142,7 @@
142
142
  outline: var(--hx-focus-ring-width, 2px) solid
143
143
  var(
144
144
  --hx-banner-close-btn-focus-ring-color,
145
- var(--hx-focus-ring-color, var(--hx-color-primary-400, #6ab1b1))
145
+ var(--hx-focus-ring-color, var(--hx-color-primary-600, #0f7078))
146
146
  );
147
147
  outline-offset: var(--hx-focus-ring-offset, 2px);
148
148
  opacity: 1;
package/dist/css/hx-button.css CHANGED
@@ -46,7 +46,7 @@
46
46
 
47
47
  .button:focus-visible {
48
48
  outline: var(--hx-focus-ring-width, 2px) solid
49
- var(--hx-button-focus-ring-color, var(--hx-focus-ring-color, #6ab1b1));
49
+ var(--hx-button-focus-ring-color, var(--hx-focus-ring-color, #0f7078));
50
50
  outline-offset: var(--hx-focus-ring-offset, 2px);
51
51
  }
52
52
 
@@ -160,7 +160,7 @@
160
160
  .button--outline {
161
161
  --hx-button-bg: transparent;
162
162
  --hx-button-color: var(--hx-color-text-primary, #0d1825);
163
- --hx-button-border-color: var(--hx-color-border-strong, #8e9c98);
163
+ --hx-button-border-color: var(--hx-color-border-strong, #66787b);
164
164
  }
165
165
 
166
166
  .button--outline:hover {
@@ -253,6 +253,16 @@
253
253
  );
254
254
  }
255
255
 
256
+ /* Primary inverted — resting bg routes through action.primary.bg-inverted-rest
257
+ so dark mode can flip the fill to primary-600. surface.inverse becomes light
258
+ (#EBEEE9) in dark mode; primary-500 on #EBEEE9 = 2.94:1 (sub-3:1 UI floor
259
+ fail for the inverted-button boundary). primary-600 on #EBEEE9 = 4.97:1
260
+ (AA pass). Light mode tracks action.primary.bg (primary-500, 5.20:1 on
261
+ dark surface.inverse). */
262
+ :host([inverted]) .button--primary {
263
+ --hx-button-bg: var(--hx-color-action-primary-bg-inverted-rest, #429797);
264
+ }
265
+
256
266
  /* Primary inverted — hover/pressed lift to action.primary.bg-inverted-hover
257
267
  (primary-400, light teal). The base :host([inverted]) .button rule binds
258
268
  color to text.inverse, which flips by mode (neutral-0 in light, neutral-900
package/dist/css/hx-card.css CHANGED
@@ -84,10 +84,7 @@
84
84
 
85
85
  .card--interactive:focus-visible {
86
86
  outline: var(--hx-focus-ring-width, 2px) solid
87
- var(
88
- --hx-card-focus-ring-color,
89
- var(--hx-focus-ring-color, var(--hx-color-primary-500, #429797))
90
- );
87
+ var(--hx-card-focus-ring-color, var(--hx-focus-ring-color, #0f7078));
91
88
  outline-offset: var(--hx-focus-ring-offset, 2px);
92
89
  }
93
90
 
package/dist/css/hx-checkbox.css CHANGED
@@ -58,7 +58,7 @@
58
58
  width: var(--hx-checkbox-size, var(--hx-size-5, 1.25rem));
59
59
  height: var(--hx-checkbox-size, var(--hx-size-5, 1.25rem));
60
60
  border: var(--hx-border-width-medium, 2px) solid
61
- var(--hx-checkbox-border-color, var(--hx-color-border-strong, #8e9c98));
61
+ var(--hx-checkbox-border-color, var(--hx-color-border-strong, #66787b));
62
62
  border-radius: var(--hx-checkbox-border-radius, var(--hx-border-radius-sm, 0.25rem));
63
63
  background-color: var(--hx-checkbox-bg, var(--hx-color-surface-default, #ffffff));
64
64
  transition:
@@ -74,7 +74,7 @@
74
74
  outline: var(--hx-checkbox-focus-ring-width, var(--hx-focus-ring-width, 2px)) solid
75
75
  var(
76
76
  --hx-checkbox-focus-ring-color,
77
- var(--hx-focus-ring-color, var(--hx-color-primary-400, #6ab1b1))
77
+ var(--hx-focus-ring-color, var(--hx-color-primary-600, #0f7078))
78
78
  );
79
79
  outline-offset: var(--hx-checkbox-focus-ring-offset, var(--hx-focus-ring-offset, 2px));
80
80
  }
package/dist/css/hx-clinical-status.css CHANGED
@@ -184,8 +184,7 @@
184
184
  }
185
185
 
186
186
  .clinical-status__dismiss-button:focus-visible {
187
- outline: var(--hx-focus-ring-width, 2px) solid
188
- var(--hx-focus-ring-color, var(--hx-color-focus, #429797));
187
+ outline: var(--hx-focus-ring-width, 2px) solid var(--hx-focus-ring-color, #0f7078);
189
188
  outline-offset: var(--hx-focus-ring-offset, 2px);
190
189
  opacity: 1;
191
190
  }
@@ -230,8 +229,7 @@
230
229
  }
231
230
 
232
231
  .clinical-status__acknowledge-button:focus-visible {
233
- outline: var(--hx-focus-ring-width, 2px) solid
234
- var(--hx-focus-ring-color, var(--hx-color-focus, #429797));
232
+ outline: var(--hx-focus-ring-width, 2px) solid var(--hx-focus-ring-color, #0f7078);
235
233
  outline-offset: var(--hx-focus-ring-offset, 2px);
236
234
  }
237
235
 
package/dist/css/hx-code-snippet.css CHANGED
@@ -78,7 +78,7 @@
78
78
  min-width: var(--hx-touch-target-min, 2.75rem);
79
79
  min-height: var(--hx-touch-target-min, 2.75rem);
80
80
  padding: var(--hx-space-1, 0.25rem) var(--hx-space-2, 0.5rem);
81
- border: var(--hx-border-width-thin, 1px) solid var(--hx-color-border-strong, #8e9c98);
81
+ border: var(--hx-border-width-thin, 1px) solid var(--hx-color-border-strong, #66787b);
82
82
  border-radius: var(--hx-border-radius-sm, 0.25rem);
83
83
  /* Copy button sits on the always-dark block snippet surface; uses inverse family for contrast on the terminal background. */
84
84
  background-color: var(--hx-color-surface-inverse, #0d1825);
@@ -104,7 +104,7 @@
104
104
 
105
105
  .code-snippet__copy-button:focus-visible {
106
106
  outline: var(--hx-focus-ring-width, 2px) solid
107
- var(--hx-focus-ring-color, var(--hx-color-primary-400, #6ab1b1));
107
+ var(--hx-focus-ring-color, var(--hx-color-primary-600, #0f7078));
108
108
  outline-offset: var(--hx-focus-ring-offset, 2px);
109
109
  }
110
110
 
@@ -123,7 +123,7 @@
123
123
  min-height: var(--hx-touch-target-min, 2.75rem);
124
124
  padding: var(--hx-space-2, 0.5rem) var(--hx-space-4, 1rem);
125
125
  border: none;
126
- border-top: var(--hx-border-width-thin, 1px) solid var(--hx-color-border-strong, #8e9c98);
126
+ border-top: var(--hx-border-width-thin, 1px) solid var(--hx-color-border-strong, #66787b);
127
127
  /* Expand button is attached to the always-dark block snippet — inverse family maintains the terminal aesthetic. */
128
128
  background-color: var(--hx-color-surface-inverse, #0d1825);
129
129
  color: var(--hx-color-text-inverse, #ffffff);
@@ -145,7 +145,7 @@
145
145
 
146
146
  .code-snippet__expand-button:focus-visible {
147
147
  outline: var(--hx-focus-ring-width, 2px) solid
148
- var(--hx-focus-ring-color, var(--hx-color-primary-400, #6ab1b1));
148
+ var(--hx-focus-ring-color, var(--hx-color-primary-600, #0f7078));
149
149
  outline-offset: var(--hx-focus-ring-offset, 2px);
150
150
  }
151
151
 
package/dist/css/hx-color-picker.css CHANGED
@@ -28,10 +28,7 @@
28
28
  }
29
29
  :is(.trigger, .gradient-grid, .slider-track, .swatch-btn, .format-btn):focus-visible {
30
30
  outline: var(--hx-focus-ring-width, 2px) solid
31
- var(
32
- --hx-color-picker-focus-ring-color,
33
- var(--hx-focus-ring-color, var(--hx-color-primary-500, #429797))
34
- );
31
+ var(--hx-color-picker-focus-ring-color, var(--hx-focus-ring-color, #0f7078));
35
32
  outline-offset: var(--hx-focus-ring-offset, 2px);
36
33
  }
37
34
  .trigger-swatch {
@@ -206,18 +203,11 @@
206
203
  outline: none;
207
204
  }
208
205
  .color-input:focus-visible {
209
- border-color: var(
210
- --hx-color-picker-focus-ring-color,
211
- var(--hx-focus-ring-color, var(--hx-color-primary-500, #429797))
212
- );
206
+ border-color: var(--hx-color-picker-focus-ring-color, var(--hx-focus-ring-color, #0f7078));
213
207
  box-shadow: 0 0 0 2px
214
208
  color-mix(
215
209
  in srgb,
216
- var(
217
- --hx-color-picker-focus-ring-color,
218
- var(--hx-focus-ring-color, var(--hx-color-primary-500, #429797))
219
- )
220
- 20%,
210
+ var(--hx-color-picker-focus-ring-color, var(--hx-focus-ring-color, #0f7078)) 20%,
221
211
  transparent
222
212
  );
223
213
  }
package/dist/css/hx-combobox.css CHANGED
@@ -34,7 +34,7 @@
34
34
  display: flex;
35
35
  align-items: center;
36
36
  border: var(--hx-border-width-thin, 1px) solid
37
- var(--hx-combobox-border-color, var(--hx-color-border-strong, #8e9c98));
37
+ var(--hx-combobox-border-color, var(--hx-color-border-strong, #66787b));
38
38
  border-radius: var(--hx-combobox-border-radius, var(--hx-border-radius-md, 0.375rem));
39
39
  background-color: var(--hx-combobox-bg, var(--hx-color-surface-default, #ffffff));
40
40
  transition:
@@ -44,14 +44,14 @@
44
44
  .field__input-wrapper:focus-within {
45
45
  border-color: var(
46
46
  --hx-combobox-focus-ring-color,
47
- var(--hx-focus-ring-color, var(--hx-color-primary-400, #6ab1b1))
47
+ var(--hx-focus-ring-color, var(--hx-color-primary-600, #0f7078))
48
48
  );
49
49
  box-shadow: 0 0 0 var(--hx-focus-ring-width, 2px)
50
50
  color-mix(
51
51
  in srgb,
52
52
  var(
53
53
  --hx-combobox-focus-ring-color,
54
- var(--hx-focus-ring-color, var(--hx-color-primary-400, #6ab1b1))
54
+ var(--hx-focus-ring-color, var(--hx-color-primary-600, #0f7078))
55
55
  )
56
56
  calc(var(--hx-focus-ring-opacity, 0.25) * 100%),
57
57
  transparent
@@ -161,7 +161,7 @@
161
161
  z-index: var(--hx-z-index-dropdown, 1000);
162
162
  background-color: var(--hx-combobox-listbox-bg, var(--hx-color-surface-default, #ffffff));
163
163
  border: var(--hx-border-width-thin, 1px) solid
164
- var(--hx-combobox-border-color, var(--hx-color-border-strong, #8e9c98));
164
+ var(--hx-combobox-border-color, var(--hx-color-border-strong, #66787b));
165
165
  border-radius: var(--hx-combobox-border-radius, var(--hx-border-radius-md, 0.375rem));
166
166
  box-shadow: var(
167
167
  --hx-combobox-listbox-shadow,
package/dist/css/hx-data-table.css CHANGED
@@ -92,10 +92,7 @@
92
92
 
93
93
  .sort-btn:focus-visible {
94
94
  outline: var(--hx-focus-ring-width, 2px) solid
95
- var(
96
- --hx-data-table-focus-ring-color,
97
- var(--hx-focus-ring-color, var(--hx-color-primary-500, #429797))
98
- );
95
+ var(--hx-data-table-focus-ring-color, var(--hx-focus-ring-color, #0f7078));
99
96
  outline-offset: var(--hx-focus-ring-offset, 2px);
100
97
  border-radius: var(--hx-border-radius-sm, 2px);
101
98
  }
@@ -197,10 +194,7 @@
197
194
  [part~='td']:focus-visible,
198
195
  [part~='th']:focus-visible {
199
196
  outline: var(--hx-focus-ring-width, 2px) solid
200
- var(
201
- --hx-data-table-focus-ring-color,
202
- var(--hx-focus-ring-color, var(--hx-color-primary-500, #429797))
203
- );
197
+ var(--hx-data-table-focus-ring-color, var(--hx-focus-ring-color, #0f7078));
204
198
  outline-offset: var(--hx-focus-ring-offset, -2px);
205
199
  border-radius: var(--hx-border-radius-sm, 2px);
206
200
  }
package/dist/css/hx-date-picker.css CHANGED
@@ -56,7 +56,7 @@
56
56
  display: flex;
57
57
  align-items: stretch;
58
58
  border: var(--hx-border-width-thin, 1px) solid
59
- var(--hx-date-picker-border-color, var(--hx-color-border-strong, #8e9c98));
59
+ var(--hx-date-picker-border-color, var(--hx-color-border-strong, #66787b));
60
60
  border-radius: var(--hx-date-picker-border-radius, var(--hx-border-radius-md, 0.375rem));
61
61
  background-color: var(--hx-date-picker-bg, var(--hx-color-surface-default, #ffffff));
62
62
  transition:
@@ -68,14 +68,14 @@
68
68
  .field__input-wrapper:focus-within {
69
69
  border-color: var(
70
70
  --hx-date-picker-focus-ring-color,
71
- var(--hx-focus-ring-color, var(--hx-color-primary-400, #6ab1b1))
71
+ var(--hx-focus-ring-color, var(--hx-color-primary-600, #0f7078))
72
72
  );
73
73
  box-shadow: 0 0 0 var(--hx-focus-ring-width, 2px)
74
74
  color-mix(
75
75
  in srgb,
76
76
  var(
77
77
  --hx-date-picker-focus-ring-color,
78
- var(--hx-focus-ring-color, var(--hx-color-primary-400, #6ab1b1))
78
+ var(--hx-focus-ring-color, var(--hx-color-primary-600, #0f7078))
79
79
  )
80
80
  calc(var(--hx-focus-ring-opacity, 0.25) * 100%),
81
81
  transparent
@@ -135,7 +135,7 @@
135
135
  padding: 0 var(--hx-space-3, 0.75rem);
136
136
  border: none;
137
137
  border-left: var(--hx-border-width-thin, 1px) solid
138
- var(--hx-date-picker-border-color, var(--hx-color-border-strong, #8e9c98));
138
+ var(--hx-date-picker-border-color, var(--hx-color-border-strong, #66787b));
139
139
  background: transparent;
140
140
  color: var(--hx-date-picker-trigger-color, var(--hx-color-text-muted, #4a5362));
141
141
  cursor: pointer;
@@ -147,13 +147,13 @@
147
147
  .field__trigger:focus-visible {
148
148
  color: var(
149
149
  --hx-date-picker-focus-ring-color,
150
- var(--hx-focus-ring-color, var(--hx-color-primary-400, #6ab1b1))
150
+ var(--hx-focus-ring-color, var(--hx-color-primary-600, #0f7078))
151
151
  );
152
152
  background-color: color-mix(
153
153
  in srgb,
154
154
  var(
155
155
  --hx-date-picker-focus-ring-color,
156
- var(--hx-focus-ring-color, var(--hx-color-primary-400, #6ab1b1))
156
+ var(--hx-focus-ring-color, var(--hx-color-primary-600, #0f7078))
157
157
  )
158
158
  8%,
159
159
  transparent
@@ -254,7 +254,7 @@
254
254
  box-shadow: 0 0 0 var(--hx-focus-ring-width, 2px)
255
255
  var(
256
256
  --hx-date-picker-focus-ring-color,
257
- var(--hx-focus-ring-color, var(--hx-color-primary-400, #6ab1b1))
257
+ var(--hx-focus-ring-color, var(--hx-color-primary-600, #0f7078))
258
258
  );
259
259
  z-index: 1;
260
260
  }
package/dist/css/hx-dialog.css CHANGED
@@ -152,10 +152,7 @@
152
152
 
153
153
  .dialog__close-btn:focus-visible {
154
154
  outline: var(--hx-focus-ring-width, 2px) solid
155
- var(
156
- --hx-dialog-close-btn-focus-ring-color,
157
- var(--hx-focus-ring-color, var(--hx-color-primary-500, #429797))
158
- );
155
+ var(--hx-dialog-close-btn-focus-ring-color, var(--hx-focus-ring-color, #0f7078));
159
156
  outline-offset: var(--hx-focus-ring-offset, 2px);
160
157
  }
161
158
 
package/dist/css/hx-drawer.css CHANGED
@@ -209,10 +209,7 @@
209
209
 
210
210
  .drawer-close-button:focus-visible {
211
211
  outline: var(--hx-focus-ring-width, 2px) solid
212
- var(
213
- --hx-drawer-close-btn-focus-ring-color,
214
- var(--hx-focus-ring-color, var(--hx-color-primary-500, #429797))
215
- );
212
+ var(--hx-drawer-close-btn-focus-ring-color, var(--hx-focus-ring-color, #0f7078));
216
213
  outline-offset: var(--hx-focus-ring-offset, 2px);
217
214
  }
218
215
 
package/dist/css/hx-file-upload.css CHANGED
@@ -42,7 +42,7 @@
42
42
  min-height: var(--hx-space-32, 8rem);
43
43
  padding: var(--hx-space-6, 1.5rem) var(--hx-space-4, 1rem);
44
44
  border: var(--hx-border-width-thin, 1px) dashed
45
- var(--hx-file-upload-dropzone-border-color, var(--hx-color-border-strong, #8e9c98));
45
+ var(--hx-file-upload-dropzone-border-color, var(--hx-color-border-strong, #66787b));
46
46
  border-radius: var(--hx-file-upload-dropzone-border-radius, var(--hx-border-radius-lg, 0.5rem));
47
47
  background-color: var(--hx-file-upload-dropzone-bg, var(--hx-color-surface-raised, #f5f8f3));
48
48
  cursor: pointer;
package/dist/css/hx-icon-button.css CHANGED
@@ -30,10 +30,7 @@
30
30
 
31
31
  .button:focus-visible {
32
32
  outline: var(--hx-focus-ring-width, 2px) solid
33
- var(
34
- --hx-icon-button-focus-ring-color,
35
- var(--hx-focus-ring-color, var(--hx-color-primary-500, #429797))
36
- );
33
+ var(--hx-icon-button-focus-ring-color, var(--hx-focus-ring-color, #0f7078));
37
34
  outline-offset: var(--hx-focus-ring-offset, 2px);
38
35
  }
39
36
 
@@ -103,7 +100,7 @@
103
100
  .button--tertiary {
104
101
  --hx-icon-button-bg: transparent;
105
102
  --hx-icon-button-color: var(--hx-color-text-strong, #202b39);
106
- --hx-icon-button-border-color: var(--hx-color-border-strong, #8e9c98);
103
+ --hx-icon-button-border-color: var(--hx-color-border-strong, #66787b);
107
104
  }
108
105
 
109
106
  .button--tertiary:hover {
package/dist/css/hx-link.css CHANGED
@@ -39,7 +39,7 @@
39
39
  outline: var(--hx-focus-ring-width, 2px) solid
40
40
  var(
41
41
  --hx-link-focus-ring-color,
42
- var(--hx-focus-ring-color, var(--hx-color-primary-400, #6ab1b1))
42
+ var(--hx-focus-ring-color, var(--hx-color-primary-600, #0f7078))
43
43
  );
44
44
  outline-offset: var(--hx-focus-ring-offset, 2px);
45
45
  border-radius: var(--hx-border-radius-sm, 0.25rem);
package/dist/css/hx-meter.css CHANGED
@@ -14,8 +14,7 @@
14
14
  }
15
15
 
16
16
  .meter:focus-visible {
17
- outline: var(--hx-focus-ring-width, 2px) solid
18
- var(--hx-focus-ring-color, var(--hx-color-primary-500, #429797));
17
+ outline: var(--hx-focus-ring-width, 2px) solid var(--hx-focus-ring-color, #0f7078);
19
18
  outline-offset: var(--hx-focus-ring-offset, 2px);
20
19
  }
21
20
 
package/dist/css/hx-nav.css CHANGED
@@ -40,10 +40,7 @@
40
40
 
41
41
  [part='toggle']:focus-visible {
42
42
  outline: var(--hx-focus-ring-width, 2px) solid
43
- var(
44
- --hx-nav-focus-ring-color,
45
- var(--hx-focus-ring-color, var(--hx-color-primary-500, #429797))
46
- );
43
+ var(--hx-nav-focus-ring-color, var(--hx-focus-ring-color, #0f7078));
47
44
  outline-offset: var(--hx-focus-ring-offset, 2px);
48
45
  }
49
46
 
@@ -96,10 +93,7 @@
96
93
 
97
94
  .nav__link:focus-visible {
98
95
  outline: var(--hx-focus-ring-width, 2px) solid
99
- var(
100
- --hx-nav-focus-ring-color,
101
- var(--hx-focus-ring-color, var(--hx-color-primary-500, #429797))
102
- );
96
+ var(--hx-nav-focus-ring-color, var(--hx-focus-ring-color, #0f7078));
103
97
  outline-offset: var(--hx-focus-ring-offset, 2px);
104
98
  }
105
99
 
package/dist/css/hx-overflow-menu.css CHANGED
@@ -30,10 +30,7 @@
30
30
 
31
31
  .trigger:focus-visible {
32
32
  outline: var(--hx-focus-ring-width, 2px) solid
33
- var(
34
- --hx-overflow-menu-focus-ring-color,
35
- var(--hx-focus-ring-color, var(--hx-color-primary-500, #429797))
36
- );
33
+ var(--hx-overflow-menu-focus-ring-color, var(--hx-focus-ring-color, #0f7078));
37
34
  outline-offset: var(--hx-focus-ring-offset, 2px);
38
35
  }
39
36
 
@@ -126,10 +123,7 @@
126
123
  ::slotted([role='menuitemcheckbox']:focus-visible),
127
124
  ::slotted([role='menuitemradio']:focus-visible) {
128
125
  outline: var(--hx-focus-ring-width, 2px) solid
129
- var(
130
- --hx-overflow-menu-focus-ring-color,
131
- var(--hx-focus-ring-color, var(--hx-color-primary-500, #429797))
132
- );
126
+ var(--hx-overflow-menu-focus-ring-color, var(--hx-focus-ring-color, #0f7078));
133
127
  outline-offset: 0;
134
128
  }
135
129
 
package/dist/css/hx-pagination.css CHANGED
@@ -60,10 +60,7 @@
60
60
 
61
61
  .button:focus-visible {
62
62
  outline: var(--hx-focus-ring-width, 2px) solid
63
- var(
64
- --hx-pagination-focus-ring-color,
65
- var(--hx-focus-ring-color, var(--hx-color-primary-500, #429797))
66
- );
63
+ var(--hx-pagination-focus-ring-color, var(--hx-focus-ring-color, #0f7078));
67
64
  outline-offset: var(--hx-focus-ring-offset, 2px);
68
65
  }
69
66
 
@@ -130,10 +127,7 @@
130
127
 
131
128
  .page-size-select:focus-visible {
132
129
  outline: var(--hx-focus-ring-width, 2px) solid
133
- var(
134
- --hx-pagination-focus-ring-color,
135
- var(--hx-focus-ring-color, var(--hx-color-primary-500, #429797))
136
- );
130
+ var(--hx-pagination-focus-ring-color, var(--hx-focus-ring-color, #0f7078));
137
131
  outline-offset: var(--hx-focus-ring-offset, 2px);
138
132
  }
139
133
 
package/dist/css/hx-phi-field.css CHANGED
@@ -58,10 +58,7 @@
58
58
 
59
59
  .phi-field__toggle:focus-visible {
60
60
  outline: var(--hx-focus-ring-width, 2px) solid
61
- var(
62
- --hx-phi-field-focus-ring-color,
63
- var(--hx-focus-ring-color, var(--hx-color-primary-500, #429797))
64
- );
61
+ var(--hx-phi-field-focus-ring-color, var(--hx-focus-ring-color, #0f7078));
65
62
  outline-offset: var(--hx-focus-ring-offset, 2px);
66
63
  }
67
64
 
package/dist/css/hx-popover.css CHANGED
@@ -40,10 +40,7 @@
40
40
 
41
41
  [part='body']:focus-visible {
42
42
  outline: var(--hx-focus-ring-width, 2px) solid
43
- var(
44
- --hx-popover-focus-ring-color,
45
- var(--hx-focus-ring-color, var(--hx-color-primary-500, #429797))
46
- );
43
+ var(--hx-popover-focus-ring-color, var(--hx-focus-ring-color, #0f7078));
47
44
  outline-offset: var(--hx-focus-ring-offset, 2px);
48
45
  }
49
46