@helixui/library 3.2.0-next.85 → 3.2.0-next.89

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 (30) hide show
  1. package/custom-elements.json +87 -303
  2. package/dist/components/hx-button/hx-button.d.ts +29 -49
  3. package/dist/components/hx-button/hx-button.d.ts.map +1 -1
  4. package/dist/components/hx-button/hx-button.styles.d.ts.map +1 -1
  5. package/dist/components/hx-button/index.js +1 -1
  6. package/dist/components/hx-side-nav/hx-side-nav.d.ts +4 -19
  7. package/dist/components/hx-side-nav/hx-side-nav.d.ts.map +1 -1
  8. package/dist/components/hx-text-input/hx-text-input.d.ts +13 -30
  9. package/dist/components/hx-text-input/hx-text-input.d.ts.map +1 -1
  10. package/dist/components/hx-toast/hx-toast.d.ts.map +1 -1
  11. package/dist/components/hx-toast/hx-toast.styles.d.ts.map +1 -1
  12. package/dist/components/hx-toast/index.js +1 -1
  13. package/dist/css/helix-all.css +35 -6
  14. package/dist/css/helix-core.css +28 -5
  15. package/dist/css/helix-feedback.css +7 -1
  16. package/dist/css/hx-button.css +28 -5
  17. package/dist/css/hx-toast.css +7 -1
  18. package/dist/css/index.css +1 -1
  19. package/dist/css/manifest.json +4 -1
  20. package/dist/index.js +2 -2
  21. package/dist/shared/{hx-button-kWxjKqo-.js → hx-button-D3Royxqp.js} +34 -11
  22. package/dist/shared/hx-button-D3Royxqp.js.map +1 -0
  23. package/dist/shared/hx-nav-item-C9zXD1zK.js.map +1 -1
  24. package/dist/shared/hx-text-input-ClrrmoE1.js.map +1 -1
  25. package/dist/shared/{toast-factory-Mz1GaaFF.js → toast-factory-YSznocIV.js} +38 -33
  26. package/dist/shared/toast-factory-YSznocIV.js.map +1 -0
  27. package/figma-inventory.json +126 -373
  28. package/package.json +2 -2
  29. package/dist/shared/hx-button-kWxjKqo-.js.map +0 -1
  30. package/dist/shared/toast-factory-Mz1GaaFF.js.map +0 -1
@@ -2826,21 +2826,21 @@
2826
2826
  "name": "HelixButton",
2827
2827
  "cssProperties": [
2828
2828
  {
2829
- "description": "Button background color.",
2829
+ "description": "Button background color (3.2.1 cascade — variant rules route through action.{primary,secondary,ghost,danger}.bg).",
2830
2830
  "name": "--hx-button-bg",
2831
- "default": "var(--hx-color-primary-500)"
2831
+ "default": "var(--hx-color-action-primary-bg)"
2832
2832
  },
2833
2833
  {
2834
- "description": "Hover background color override. When set, overrides the variant default hover background from outside the shadow DOM.",
2834
+ "description": "Hover background override; when set, overrides the variant default hover background from outside the shadow DOM.",
2835
2835
  "name": "--hx-button-hover-bg"
2836
2836
  },
2837
2837
  {
2838
- "description": "Button text color.",
2838
+ "description": "Button text color (variants route through text.on-{role} / text.on-{role}-strong).",
2839
2839
  "name": "--hx-button-color",
2840
- "default": "var(--hx-color-neutral-0)"
2840
+ "default": "var(--hx-color-text-on-primary)"
2841
2841
  },
2842
2842
  {
2843
- "description": "Button border color.",
2843
+ "description": "Button border color (secondary/outline variants route through action.secondary.border).",
2844
2844
  "name": "--hx-button-border-color",
2845
2845
  "default": "transparent"
2846
2846
  },
@@ -2865,187 +2865,103 @@
2865
2865
  "default": "var(--hx-focus-ring-color)"
2866
2866
  },
2867
2867
  {
2868
- "description": "Text color when inverted.",
2868
+ "description": "Text color when inverted (resolves to neutral-0).",
2869
2869
  "name": "--hx-button-inverted-color",
2870
- "default": "#ffffff"
2870
+ "default": "var(--hx-color-text-inverse)"
2871
2871
  },
2872
2872
  {
2873
- "description": "Ghost hover bg when inverted.",
2873
+ "description": "Ghost hover bg when inverted (overlay-white-30 ≈ 5:1 vs neutral-900).",
2874
2874
  "name": "--hx-button-inverted-ghost-hover-bg",
2875
- "default": "rgba(255,255,255,0.15)"
2875
+ "default": "var(--hx-color-border-on-dark-default)"
2876
2876
  },
2877
2877
  {
2878
- "description": "Focus ring color when inverted.",
2878
+ "description": "Focus ring color when inverted (overlay-white-70 = ~5:1 vs neutral-900).",
2879
2879
  "name": "--hx-button-inverted-focus-ring-color",
2880
- "default": "rgba(255,255,255,0.5)"
2881
- },
2882
- {
2883
- "description": "Opacity.",
2884
- "name": "--hx-opacity-disabled"
2885
- },
2886
- {
2887
- "description": "Spacing token.",
2888
- "name": "--hx-space-2"
2889
- },
2890
- {
2891
- "description": "Width.",
2892
- "name": "--hx-border-width-thin"
2893
- },
2894
- {
2895
- "description": "CSS custom property.",
2896
- "name": "--hx-border-radius-md"
2897
- },
2898
- {
2899
- "description": "Color.",
2900
- "name": "--hx-color-primary-500"
2901
- },
2902
- {
2903
- "description": "Color.",
2904
- "name": "--hx-color-neutral-0"
2905
- },
2906
- {
2907
- "description": "Font family.",
2908
- "name": "--hx-font-family-sans"
2909
- },
2910
- {
2911
- "description": "Font weight.",
2912
- "name": "--hx-font-weight-semibold"
2913
- },
2914
- {
2915
- "description": "Line height.",
2916
- "name": "--hx-line-height-tight"
2917
- },
2918
- {
2919
- "description": "Transition timing.",
2920
- "name": "--hx-transition-fast"
2921
- },
2922
- {
2923
- "description": "Width.",
2924
- "name": "--hx-focus-ring-width"
2925
- },
2926
- {
2927
- "description": "Color.",
2928
- "name": "--hx-focus-ring-color"
2929
- },
2930
- {
2931
- "description": "CSS custom property.",
2932
- "name": "--hx-focus-ring-offset"
2933
- },
2934
- {
2935
- "description": "CSS filter.",
2936
- "name": "--hx-filter-brightness-hover"
2937
- },
2938
- {
2939
- "description": "CSS filter.",
2940
- "name": "--hx-filter-brightness-active"
2941
- },
2942
- {
2943
- "description": "Spacing token.",
2944
- "name": "--hx-space-1"
2945
- },
2946
- {
2947
- "description": "Spacing token.",
2948
- "name": "--hx-space-3"
2949
- },
2950
- {
2951
- "description": "Font size.",
2952
- "name": "--hx-font-size-sm"
2880
+ "default": "var(--hx-color-border-on-dark-strong)"
2953
2881
  },
2954
2882
  {
2955
- "description": "Minimum touch target size.",
2956
- "name": "--hx-touch-target-min"
2883
+ "description": "Primary variant resting fill (3.2.1 semantic action layer).",
2884
+ "name": "--hx-color-action-primary-bg"
2957
2885
  },
2958
2886
  {
2959
- "description": "Spacing token.",
2960
- "name": "--hx-space-4"
2887
+ "description": "Primary variant hover fill.",
2888
+ "name": "--hx-color-action-primary-bg-hover"
2961
2889
  },
2962
2890
  {
2963
- "description": "Font size.",
2964
- "name": "--hx-font-size-md"
2891
+ "description": "Primary variant active/pressed fill.",
2892
+ "name": "--hx-color-action-primary-bg-active"
2965
2893
  },
2966
2894
  {
2967
- "description": "Size token.",
2968
- "name": "--hx-size-10"
2969
- },
2970
- {
2971
- "description": "Spacing token.",
2972
- "name": "--hx-space-6"
2973
- },
2974
- {
2975
- "description": "Font size.",
2976
- "name": "--hx-font-size-lg"
2895
+ "description": "Secondary/outline variant fg (resolves to primary-600 light, primary-400 dark).",
2896
+ "name": "--hx-color-action-secondary-fg"
2977
2897
  },
2978
2898
  {
2979
- "description": "Size token.",
2980
- "name": "--hx-size-12"
2899
+ "description": "Secondary/outline variant border.",
2900
+ "name": "--hx-color-action-secondary-border"
2981
2901
  },
2982
2902
  {
2983
- "description": "Color.",
2984
- "name": "--hx-color-primary-50"
2903
+ "description": "Secondary/outline variant hover fill.",
2904
+ "name": "--hx-color-action-secondary-bg-hover"
2985
2905
  },
2986
2906
  {
2987
- "description": "Color.",
2988
- "name": "--hx-color-neutral-100"
2907
+ "description": "Ghost variant fg.",
2908
+ "name": "--hx-color-action-ghost-fg"
2989
2909
  },
2990
2910
  {
2991
- "description": "Color.",
2992
- "name": "--hx-color-neutral-900"
2911
+ "description": "Ghost variant hover fill.",
2912
+ "name": "--hx-color-action-ghost-bg-hover"
2993
2913
  },
2994
2914
  {
2995
- "description": "Color.",
2996
- "name": "--hx-color-neutral-200"
2915
+ "description": "Danger variant resting fill.",
2916
+ "name": "--hx-color-action-danger-bg"
2997
2917
  },
2998
2918
  {
2999
- "description": "Color.",
3000
- "name": "--hx-color-error-500"
2919
+ "description": "Danger variant hover fill.",
2920
+ "name": "--hx-color-action-danger-bg-hover"
3001
2921
  },
3002
2922
  {
3003
- "description": "Color.",
3004
- "name": "--hx-color-error-600"
2923
+ "description": "Danger variant active fill.",
2924
+ "name": "--hx-color-action-danger-bg-active"
3005
2925
  },
3006
2926
  {
3007
- "description": "Color.",
3008
- "name": "--hx-color-neutral-300"
2927
+ "description": "Foreground for primary fill (resolves to neutral-900 — AA-tuned for primary-500).",
2928
+ "name": "--hx-color-text-on-primary"
3009
2929
  },
3010
2930
  {
3011
- "description": "Color.",
3012
- "name": "--hx-color-neutral-50"
3013
- },
3014
- {
3015
- "description": "Color.",
3016
- "name": "--hx-color-primary-600"
2931
+ "description": "Foreground for primary-hover fill (resolves to neutral-0 across modes).",
2932
+ "name": "--hx-color-text-on-primary-strong"
3017
2933
  },
3018
2934
  {
3019
- "description": "Animation duration.",
3020
- "name": "--hx-duration-spinner"
2935
+ "description": "Foreground for danger fill (resolves to neutral-900).",
2936
+ "name": "--hx-color-text-on-error"
3021
2937
  },
3022
2938
  {
3023
- "description": "Opacity.",
3024
- "name": "--hx-opacity-muted"
2939
+ "description": "Foreground for danger-hover fill (resolves to neutral-0 across modes).",
2940
+ "name": "--hx-color-text-on-error-strong"
3025
2941
  },
3026
2942
  {
3027
- "description": "Overlay color.",
3028
- "name": "--hx-overlay-white-50"
2943
+ "description": "Foreground for tertiary variant on surface.sunken.",
2944
+ "name": "--hx-color-text-primary"
3029
2945
  },
3030
2946
  {
3031
- "description": "Color.",
3032
- "name": "--hx-color-primary-400"
2947
+ "description": "Tertiary variant resting fill.",
2948
+ "name": "--hx-color-surface-sunken"
3033
2949
  },
3034
2950
  {
3035
- "description": "Overlay color.",
3036
- "name": "--hx-overlay-white-70"
2951
+ "description": "Tertiary variant hover fill.",
2952
+ "name": "--hx-color-surface-raised"
3037
2953
  },
3038
2954
  {
3039
- "description": "Overlay color.",
3040
- "name": "--hx-overlay-white-15"
2955
+ "description": "Inverted-tertiary resting border (overlay-white-10).",
2956
+ "name": "--hx-color-border-on-dark-subtle"
3041
2957
  },
3042
2958
  {
3043
- "description": "Overlay color.",
3044
- "name": "--hx-overlay-white-25"
2959
+ "description": "Inverted-tertiary hover border + inverted-secondary/ghost hover border (overlay-white-30).",
2960
+ "name": "--hx-color-border-on-dark-default"
3045
2961
  },
3046
2962
  {
3047
- "description": "Overlay color.",
3048
- "name": "--hx-overlay-white-20"
2963
+ "description": "Inverted focus-visible outline (overlay-white-70).",
2964
+ "name": "--hx-color-border-on-dark-strong"
3049
2965
  }
3050
2966
  ],
3051
2967
  "cssParts": [
@@ -23091,80 +23007,20 @@
23091
23007
  "default": "var(--hx-color-text-inverse)"
23092
23008
  },
23093
23009
  {
23094
- "description": "Color.",
23095
- "name": "--hx-color-neutral-900"
23096
- },
23097
- {
23098
- "description": "Color.",
23099
- "name": "--hx-color-neutral-100"
23100
- },
23101
- {
23102
- "description": "Transition timing.",
23103
- "name": "--hx-transition-normal"
23104
- },
23105
- {
23106
- "description": "Width.",
23107
- "name": "--hx-border-width-thin"
23108
- },
23109
- {
23110
- "description": "Color.",
23111
- "name": "--hx-color-neutral-700"
23112
- },
23113
- {
23114
- "description": "Spacing token.",
23115
- "name": "--hx-space-4"
23116
- },
23117
- {
23118
- "description": "Spacing token.",
23119
- "name": "--hx-space-14"
23120
- },
23121
- {
23122
- "description": "Spacing token.",
23123
- "name": "--hx-space-3"
23124
- },
23125
- {
23126
- "description": "Spacing token.",
23127
- "name": "--hx-space-2"
23128
- },
23129
- {
23130
- "description": "Spacing token.",
23131
- "name": "--hx-space-8"
23132
- },
23133
- {
23134
- "description": "CSS custom property.",
23135
- "name": "--hx-border-radius-sm"
23136
- },
23137
- {
23138
- "description": "Color.",
23139
- "name": "--hx-color-neutral-400"
23140
- },
23141
- {
23142
- "description": "Transition timing.",
23143
- "name": "--hx-transition-fast"
23144
- },
23145
- {
23146
- "description": "Overlay color.",
23147
- "name": "--hx-overlay-white-10"
23148
- },
23149
- {
23150
- "description": "Width.",
23151
- "name": "--hx-focus-ring-width"
23152
- },
23153
- {
23154
- "description": "Color.",
23155
- "name": "--hx-focus-ring-color"
23010
+ "description": "Side-nav surface fill (resolves to neutral-900 light, near-black dark).",
23011
+ "name": "--hx-color-surface-inverse"
23156
23012
  },
23157
23013
  {
23158
- "description": "Color.",
23159
- "name": "--hx-color-primary-400"
23014
+ "description": "Side-nav text color (resolves to neutral-0).",
23015
+ "name": "--hx-color-text-inverse"
23160
23016
  },
23161
23017
  {
23162
- "description": "CSS custom property.",
23163
- "name": "--hx-focus-ring-offset"
23018
+ "description": "Header/footer divider border.",
23019
+ "name": "--hx-color-border-strong"
23164
23020
  },
23165
23021
  {
23166
- "description": "Spacing token.",
23167
- "name": "--hx-space-5"
23022
+ "description": "Toggle button hover surface (overlay-white-10 primitive — semantic layer for inverted affordances).",
23023
+ "name": "--hx-color-border-on-dark-subtle"
23168
23024
  }
23169
23025
  ],
23170
23026
  "cssParts": [
@@ -29840,124 +29696,52 @@
29840
29696
  "default": "1.125rem"
29841
29697
  },
29842
29698
  {
29843
- "description": "Opacity.",
29844
- "name": "--hx-opacity-disabled"
29845
- },
29846
- {
29847
- "description": "Color.",
29848
- "name": "--hx-focus-ring-color"
29699
+ "description": "Outer border-width override (canonical hx-{tag}-* prefix; sits above --hx-input-* aliases in the cascade).",
29700
+ "name": "--hx-text-input-border-width",
29701
+ "default": "var(--hx-border-width-thin)"
29849
29702
  },
29850
29703
  {
29851
- "description": "Color.",
29852
- "name": "--hx-color-primary-400"
29704
+ "description": "Outer horizontal padding override.",
29705
+ "name": "--hx-text-input-padding-x",
29706
+ "default": "var(--hx-space-3)"
29853
29707
  },
29854
29708
  {
29855
- "description": "Width.",
29856
- "name": "--hx-focus-ring-width"
29709
+ "description": "Outer vertical padding override.",
29710
+ "name": "--hx-text-input-padding-y",
29711
+ "default": "var(--hx-space-2)"
29857
29712
  },
29858
29713
  {
29859
- "description": "CSS custom property.",
29860
- "name": "--hx-focus-ring-opacity"
29714
+ "description": "Outer font-size override.",
29715
+ "name": "--hx-text-input-font-size",
29716
+ "default": "var(--hx-font-size-md)"
29861
29717
  },
29862
29718
  {
29863
- "description": "Spacing token.",
29864
- "name": "--hx-space-1"
29719
+ "description": "Outer sm-variant font-size override (falls through to --hx-input-sm-font-size).",
29720
+ "name": "--hx-text-input-sm-font-size"
29865
29721
  },
29866
29722
  {
29867
- "description": "Font family.",
29868
- "name": "--hx-font-family-sans"
29723
+ "description": "Outer lg-variant font-size override (falls through to --hx-input-lg-font-size).",
29724
+ "name": "--hx-text-input-lg-font-size"
29869
29725
  },
29870
29726
  {
29871
- "description": "Font size.",
29872
- "name": "--hx-font-size-sm"
29727
+ "description": "Resting field surface (semantic).",
29728
+ "name": "--hx-color-surface-default"
29873
29729
  },
29874
29730
  {
29875
- "description": "Font weight.",
29876
- "name": "--hx-font-weight-medium"
29731
+ "description": "Resting input text + label color (semantic).",
29732
+ "name": "--hx-color-text-strong"
29877
29733
  },
29878
29734
  {
29879
- "description": "Color.",
29880
- "name": "--hx-color-neutral-700"
29735
+ "description": "Resting border color (semantic).",
29736
+ "name": "--hx-color-border-strong"
29881
29737
  },
29882
29738
  {
29883
- "description": "Line height.",
29884
- "name": "--hx-line-height-normal"
29885
- },
29886
- {
29887
- "description": "Color.",
29739
+ "description": "Error state text + border color (semantic).",
29888
29740
  "name": "--hx-color-error-text"
29889
29741
  },
29890
29742
  {
29891
- "description": "Font weight.",
29892
- "name": "--hx-font-weight-bold"
29893
- },
29894
- {
29895
- "description": "Width.",
29896
- "name": "--hx-border-width-thin"
29897
- },
29898
- {
29899
- "description": "Color.",
29900
- "name": "--hx-color-neutral-300"
29901
- },
29902
- {
29903
- "description": "CSS custom property.",
29904
- "name": "--hx-border-radius-md"
29905
- },
29906
- {
29907
- "description": "Color.",
29908
- "name": "--hx-color-neutral-0"
29909
- },
29910
- {
29911
- "description": "Transition timing.",
29912
- "name": "--hx-transition-fast"
29913
- },
29914
- {
29915
- "description": "Color.",
29916
- "name": "--hx-color-error-500"
29917
- },
29918
- {
29919
- "description": "Color.",
29920
- "name": "--hx-color-neutral-500"
29921
- },
29922
- {
29923
- "description": "Spacing token.",
29924
- "name": "--hx-space-3"
29925
- },
29926
- {
29927
- "description": "Spacing token.",
29928
- "name": "--hx-space-2"
29929
- },
29930
- {
29931
- "description": "Font size.",
29932
- "name": "--hx-font-size-md"
29933
- },
29934
- {
29935
- "description": "Color.",
29936
- "name": "--hx-color-neutral-800"
29937
- },
29938
- {
29939
- "description": "Size token.",
29940
- "name": "--hx-size-10"
29941
- },
29942
- {
29943
- "description": "Color.",
29944
- "name": "--hx-color-neutral-400"
29945
- },
29946
- {
29947
- "description": "Size token.",
29948
- "name": "--hx-size-8"
29949
- },
29950
- {
29951
- "description": "Spacing token.",
29952
- "name": "--hx-space-4"
29953
- },
29954
- {
29955
- "description": "Size token.",
29956
- "name": "--hx-size-12"
29957
- },
29958
- {
29959
- "description": "Font size.",
29960
- "name": "--hx-font-size-xs"
29743
+ "description": "Error border primitive fallback inside the focus-state cascade.",
29744
+ "name": "--hx-color-error-600"
29961
29745
  }
29962
29746
  ],
29963
29747
  "cssParts": [
@@ -27,60 +27,40 @@ declare const HelixButton_base: typeof HelixElement;
27
27
  * @csspart suffix - The suffix slot container span.
28
28
  * @csspart spinner - The loading spinner SVG element.
29
29
  *
30
- * @cssprop [--hx-button-bg=var(--hx-color-primary-500)] - Button background color.
31
- * @cssprop [--hx-button-hover-bg] - Hover background color override. When set, overrides the variant default hover background from outside the shadow DOM.
32
- * @cssprop [--hx-button-color=var(--hx-color-neutral-0)] - Button text color.
33
- * @cssprop [--hx-button-border-color=transparent] - Button border color.
30
+ * @cssprop [--hx-button-bg=var(--hx-color-action-primary-bg)] - Button background color (3.2.1 cascade — variant rules route through action.{primary,secondary,ghost,danger}.bg).
31
+ * @cssprop [--hx-button-hover-bg] - Hover background override; when set, overrides the variant default hover background from outside the shadow DOM.
32
+ * @cssprop [--hx-button-color=var(--hx-color-text-on-primary)] - Button text color (variants route through text.on-{role} / text.on-{role}-strong).
33
+ * @cssprop [--hx-button-border-color=transparent] - Button border color (secondary/outline variants route through action.secondary.border).
34
34
  * @cssprop [--hx-button-border-radius=var(--hx-border-radius-md)] - Button border radius.
35
35
  * @cssprop [--hx-button-font-family=var(--hx-font-family-sans)] - Button font family.
36
36
  * @cssprop [--hx-button-font-weight=var(--hx-font-weight-semibold)] - Button font weight.
37
37
  * @cssprop [--hx-button-focus-ring-color=var(--hx-focus-ring-color)] - Focus ring color.
38
38
  *
39
- * @cssprop [--hx-button-inverted-color=#ffffff] - Text color when inverted.
40
- * @cssprop [--hx-button-inverted-ghost-hover-bg=rgba(255,255,255,0.15)] - Ghost hover bg when inverted.
41
- * @cssprop [--hx-button-inverted-focus-ring-color=rgba(255,255,255,0.5)] - Focus ring color when inverted.
42
- * @cssprop [--hx-opacity-disabled] - Opacity.
43
- * @cssprop [--hx-space-2] - Spacing token.
44
- * @cssprop [--hx-border-width-thin] - Width.
45
- * @cssprop [--hx-border-radius-md] - CSS custom property.
46
- * @cssprop [--hx-color-primary-500] - Color.
47
- * @cssprop [--hx-color-neutral-0] - Color.
48
- * @cssprop [--hx-font-family-sans] - Font family.
49
- * @cssprop [--hx-font-weight-semibold] - Font weight.
50
- * @cssprop [--hx-line-height-tight] - Line height.
51
- * @cssprop [--hx-transition-fast] - Transition timing.
52
- * @cssprop [--hx-focus-ring-width] - Width.
53
- * @cssprop [--hx-focus-ring-color] - Color.
54
- * @cssprop [--hx-focus-ring-offset] - CSS custom property.
55
- * @cssprop [--hx-filter-brightness-hover] - CSS filter.
56
- * @cssprop [--hx-filter-brightness-active] - CSS filter.
57
- * @cssprop [--hx-space-1] - Spacing token.
58
- * @cssprop [--hx-space-3] - Spacing token.
59
- * @cssprop [--hx-font-size-sm] - Font size.
60
- * @cssprop [--hx-touch-target-min] - Minimum touch target size.
61
- * @cssprop [--hx-space-4] - Spacing token.
62
- * @cssprop [--hx-font-size-md] - Font size.
63
- * @cssprop [--hx-size-10] - Size token.
64
- * @cssprop [--hx-space-6] - Spacing token.
65
- * @cssprop [--hx-font-size-lg] - Font size.
66
- * @cssprop [--hx-size-12] - Size token.
67
- * @cssprop [--hx-color-primary-50] - Color.
68
- * @cssprop [--hx-color-neutral-100] - Color.
69
- * @cssprop [--hx-color-neutral-900] - Color.
70
- * @cssprop [--hx-color-neutral-200] - Color.
71
- * @cssprop [--hx-color-error-500] - Color.
72
- * @cssprop [--hx-color-error-600] - Color.
73
- * @cssprop [--hx-color-neutral-300] - Color.
74
- * @cssprop [--hx-color-neutral-50] - Color.
75
- * @cssprop [--hx-color-primary-600] - Color.
76
- * @cssprop [--hx-duration-spinner] - Animation duration.
77
- * @cssprop [--hx-opacity-muted] - Opacity.
78
- * @cssprop [--hx-overlay-white-50] - Overlay color.
79
- * @cssprop [--hx-color-primary-400] - Color.
80
- * @cssprop [--hx-overlay-white-70] - Overlay color.
81
- * @cssprop [--hx-overlay-white-15] - Overlay color.
82
- * @cssprop [--hx-overlay-white-25] - Overlay color.
83
- * @cssprop [--hx-overlay-white-20] - Overlay color.
39
+ * @cssprop [--hx-button-inverted-color=var(--hx-color-text-inverse)] - Text color when inverted (resolves to neutral-0).
40
+ * @cssprop [--hx-button-inverted-ghost-hover-bg=var(--hx-color-border-on-dark-default)] - Ghost hover bg when inverted (overlay-white-30 ≈ 5:1 vs neutral-900).
41
+ * @cssprop [--hx-button-inverted-focus-ring-color=var(--hx-color-border-on-dark-strong)] - Focus ring color when inverted (overlay-white-70 = ~5:1 vs neutral-900).
42
+ *
43
+ * @cssprop [--hx-color-action-primary-bg] - Primary variant resting fill (3.2.1 semantic action layer).
44
+ * @cssprop [--hx-color-action-primary-bg-hover] - Primary variant hover fill.
45
+ * @cssprop [--hx-color-action-primary-bg-active] - Primary variant active/pressed fill.
46
+ * @cssprop [--hx-color-action-secondary-fg] - Secondary/outline variant fg (resolves to primary-600 light, primary-400 dark).
47
+ * @cssprop [--hx-color-action-secondary-border] - Secondary/outline variant border.
48
+ * @cssprop [--hx-color-action-secondary-bg-hover] - Secondary/outline variant hover fill.
49
+ * @cssprop [--hx-color-action-ghost-fg] - Ghost variant fg.
50
+ * @cssprop [--hx-color-action-ghost-bg-hover] - Ghost variant hover fill.
51
+ * @cssprop [--hx-color-action-danger-bg] - Danger variant resting fill.
52
+ * @cssprop [--hx-color-action-danger-bg-hover] - Danger variant hover fill.
53
+ * @cssprop [--hx-color-action-danger-bg-active] - Danger variant active fill.
54
+ * @cssprop [--hx-color-text-on-primary] - Foreground for primary fill (resolves to neutral-900 — AA-tuned for primary-500).
55
+ * @cssprop [--hx-color-text-on-primary-strong] - Foreground for primary-hover fill (resolves to neutral-0 across modes).
56
+ * @cssprop [--hx-color-text-on-error] - Foreground for danger fill (resolves to neutral-900).
57
+ * @cssprop [--hx-color-text-on-error-strong] - Foreground for danger-hover fill (resolves to neutral-0 across modes).
58
+ * @cssprop [--hx-color-text-primary] - Foreground for tertiary variant on surface.sunken.
59
+ * @cssprop [--hx-color-surface-sunken] - Tertiary variant resting fill.
60
+ * @cssprop [--hx-color-surface-raised] - Tertiary variant hover fill.
61
+ * @cssprop [--hx-color-border-on-dark-subtle] - Inverted-tertiary resting border (overlay-white-10).
62
+ * @cssprop [--hx-color-border-on-dark-default] - Inverted-tertiary hover border + inverted-secondary/ghost hover border (overlay-white-30).
63
+ * @cssprop [--hx-color-border-on-dark-strong] - Inverted focus-visible outline (overlay-white-70).
84
64
  */
85
65
  export declare class HelixButton extends HelixButton_base {
86
66
  static styles: import('lit').CSSResult[];
@@ -1 +1 @@
1
- {"version":3,"file":"hx-button.d.ts","sourceRoot":"","sources":["../../../src/components/hx-button/hx-button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAC9E,OAAO,4CAA4C,CAAC;AAIpD,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAKnD,6DAA6D;AAC7D,MAAM,WAAW,mBAAmB;IAClC,aAAa,EAAE,UAAU,CAAC;CAC3B;;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4EG;AACH,qBACa,WAAY,SAAQ,gBAAgC;IAM/D,OAAgB,MAAM,4BAAuB;IAI7C,gBAAgB;IAChB,OAAgB,cAAc,UAAQ;IAItC;;;OAGG;IAEH,OAAO,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,QAAQ,GAAG,OAAO,GAAG,SAAS,CAAa;IAE3F;;;OAGG;IAEH,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAQ;IAEhC;;;OAGG;IAEH,QAAQ,UAAS;IAEjB;;;;OAIG;IAEH,OAAO,UAAS;IAEhB;;;OAGG;IAEH,IAAI,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAY;IAE/C;;;OAGG;IAEH,IAAI,EAAE,MAAM,GAAG,SAAS,CAAa;IAErC;;;OAGG;IAEH,MAAM,EAAE,MAAM,GAAG,SAAS,CAAa;IAEvC;;;OAGG;IAEH,IAAI,EAAE,MAAM,GAAG,SAAS,CAAa;IAErC;;;OAGG;IAEH,KAAK,EAAE,MAAM,GAAG,SAAS,CAAa;IAEtC;;;;OAIG;IAEH,IAAI,UAAS;IAEb;;;;OAIG;IAEH,QAAQ,UAAS;IAEjB;;;;;;;;OAQG;IAEH,eAAe,EAAE,MAAM,CAAM;IAE7B;;;;OAIG;IACH,OAAO,KAAK,eAAe,GAE1B;cAIkB,eAAe,CAAC,QAAQ,EAAE,OAAO,GAAG,IAAI;IAM3D,gBAAgB;IAChB,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,eAAe,CAO5B;IAGX,OAAO,CAAC,qBAAqB,CAAS;IAE7B,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAe3D,OAAO,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAgB/D,gBAAgB;IAChB,OAAO,CAAC,wBAAwB;IAoBhC;;;OAGG;IACH,OAAO,CAAC,YAAY;IAgCpB;;;OAGG;IACH,OAAO,CAAC,cAAc;IA6BtB;;;OAGG;IACH,OAAO,CAAC,YAAY;IAiBX,MAAM;CAyChB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,WAAW,EAAE,WAAW,CAAC;KAC1B;IACD,UAAU,mBAAmB;QAC3B,UAAU,EAAE,WAAW,CAAC;YAAE,aAAa,EAAE,UAAU,CAAA;SAAE,CAAC,CAAC;KACxD;CACF"}
1
+ {"version":3,"file":"hx-button.d.ts","sourceRoot":"","sources":["../../../src/components/hx-button/hx-button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAC9E,OAAO,4CAA4C,CAAC;AAIpD,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAKnD,6DAA6D;AAC7D,MAAM,WAAW,mBAAmB;IAClC,aAAa,EAAE,UAAU,CAAC;CAC3B;;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwDG;AACH,qBACa,WAAY,SAAQ,gBAAgC;IAM/D,OAAgB,MAAM,4BAAuB;IAI7C,gBAAgB;IAChB,OAAgB,cAAc,UAAQ;IAItC;;;OAGG;IAEH,OAAO,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,QAAQ,GAAG,OAAO,GAAG,SAAS,CAAa;IAE3F;;;OAGG;IAEH,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAQ;IAEhC;;;OAGG;IAEH,QAAQ,UAAS;IAEjB;;;;OAIG;IAEH,OAAO,UAAS;IAEhB;;;OAGG;IAEH,IAAI,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAY;IAE/C;;;OAGG;IAEH,IAAI,EAAE,MAAM,GAAG,SAAS,CAAa;IAErC;;;OAGG;IAEH,MAAM,EAAE,MAAM,GAAG,SAAS,CAAa;IAEvC;;;OAGG;IAEH,IAAI,EAAE,MAAM,GAAG,SAAS,CAAa;IAErC;;;OAGG;IAEH,KAAK,EAAE,MAAM,GAAG,SAAS,CAAa;IAEtC;;;;OAIG;IAEH,IAAI,UAAS;IAEb;;;;OAIG;IAEH,QAAQ,UAAS;IAEjB;;;;;;;;OAQG;IAEH,eAAe,EAAE,MAAM,CAAM;IAE7B;;;;OAIG;IACH,OAAO,KAAK,eAAe,GAE1B;cAIkB,eAAe,CAAC,QAAQ,EAAE,OAAO,GAAG,IAAI;IAM3D,gBAAgB;IAChB,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,eAAe,CAO5B;IAGX,OAAO,CAAC,qBAAqB,CAAS;IAE7B,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAe3D,OAAO,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAgB/D,gBAAgB;IAChB,OAAO,CAAC,wBAAwB;IAoBhC;;;OAGG;IACH,OAAO,CAAC,YAAY;IAgCpB;;;OAGG;IACH,OAAO,CAAC,cAAc;IA6BtB;;;OAGG;IACH,OAAO,CAAC,YAAY;IAiBX,MAAM;CAyChB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,WAAW,EAAE,WAAW,CAAC;KAC1B;IACD,UAAU,mBAAmB;QAC3B,UAAU,EAAE,WAAW,CAAC;YAAE,aAAa,EAAE,UAAU,CAAA;SAAE,CAAC,CAAC;KACxD;CACF"}
@@ -1 +1 @@
1
- {"version":3,"file":"hx-button.styles.d.ts","sourceRoot":"","sources":["../../../src/components/hx-button/hx-button.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,iBAAiB,yBAgV7B,CAAC"}
1
+ {"version":3,"file":"hx-button.styles.d.ts","sourceRoot":"","sources":["../../../src/components/hx-button/hx-button.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,iBAAiB,yBAuW7B,CAAC"}
@@ -1,4 +1,4 @@
1
- import { H as e } from "../../shared/hx-button-kWxjKqo-.js";
1
+ import { H as e } from "../../shared/hx-button-D3Royxqp.js";
2
2
  export {
3
3
  e as HelixButton
4
4
  };