@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.
- package/custom-elements.json +87 -303
- package/dist/components/hx-button/hx-button.d.ts +29 -49
- package/dist/components/hx-button/hx-button.d.ts.map +1 -1
- package/dist/components/hx-button/hx-button.styles.d.ts.map +1 -1
- package/dist/components/hx-button/index.js +1 -1
- package/dist/components/hx-side-nav/hx-side-nav.d.ts +4 -19
- package/dist/components/hx-side-nav/hx-side-nav.d.ts.map +1 -1
- package/dist/components/hx-text-input/hx-text-input.d.ts +13 -30
- package/dist/components/hx-text-input/hx-text-input.d.ts.map +1 -1
- package/dist/components/hx-toast/hx-toast.d.ts.map +1 -1
- package/dist/components/hx-toast/hx-toast.styles.d.ts.map +1 -1
- package/dist/components/hx-toast/index.js +1 -1
- package/dist/css/helix-all.css +35 -6
- package/dist/css/helix-core.css +28 -5
- package/dist/css/helix-feedback.css +7 -1
- package/dist/css/hx-button.css +28 -5
- package/dist/css/hx-toast.css +7 -1
- package/dist/css/index.css +1 -1
- package/dist/css/manifest.json +4 -1
- package/dist/index.js +2 -2
- package/dist/shared/{hx-button-kWxjKqo-.js → hx-button-D3Royxqp.js} +34 -11
- package/dist/shared/hx-button-D3Royxqp.js.map +1 -0
- package/dist/shared/hx-nav-item-C9zXD1zK.js.map +1 -1
- package/dist/shared/hx-text-input-ClrrmoE1.js.map +1 -1
- package/dist/shared/{toast-factory-Mz1GaaFF.js → toast-factory-YSznocIV.js} +38 -33
- package/dist/shared/toast-factory-YSznocIV.js.map +1 -0
- package/figma-inventory.json +126 -373
- package/package.json +2 -2
- package/dist/shared/hx-button-kWxjKqo-.js.map +0 -1
- package/dist/shared/toast-factory-Mz1GaaFF.js.map +0 -1
package/figma-inventory.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"schemaVersion": "1.0.0",
|
|
3
|
-
"generatedAt": "2026-04-
|
|
3
|
+
"generatedAt": "2026-04-25T22:33:58.197Z",
|
|
4
4
|
"sourceCem": "custom-elements.json",
|
|
5
5
|
"helixVersion": "3.2.0",
|
|
6
6
|
"tokensVersion": "3.2.0",
|
|
@@ -2690,36 +2690,36 @@
|
|
|
2690
2690
|
],
|
|
2691
2691
|
"cssProperties": [
|
|
2692
2692
|
{
|
|
2693
|
-
"description": "Button background color.",
|
|
2693
|
+
"description": "Button background color (3.2.1 cascade — variant rules route through action.{primary,secondary,ghost,danger}.bg).",
|
|
2694
2694
|
"name": "--hx-button-bg",
|
|
2695
|
-
"default": "var(--hx-color-primary-
|
|
2695
|
+
"default": "var(--hx-color-action-primary-bg)",
|
|
2696
2696
|
"figmaBinding": {
|
|
2697
2697
|
"target": "Fill",
|
|
2698
2698
|
"layerSelector": "root",
|
|
2699
|
-
"semanticToken": "color/primary",
|
|
2700
|
-
"fallbackPrimitive":
|
|
2699
|
+
"semanticToken": "color/action/primary/bg",
|
|
2700
|
+
"fallbackPrimitive": null,
|
|
2701
2701
|
"literalFallback": null
|
|
2702
2702
|
}
|
|
2703
2703
|
},
|
|
2704
2704
|
{
|
|
2705
|
-
"description": "Hover background
|
|
2705
|
+
"description": "Hover background override; when set, overrides the variant default hover background from outside the shadow DOM.",
|
|
2706
2706
|
"name": "--hx-button-hover-bg",
|
|
2707
2707
|
"figmaBinding": null
|
|
2708
2708
|
},
|
|
2709
2709
|
{
|
|
2710
|
-
"description": "Button text color.",
|
|
2710
|
+
"description": "Button text color (variants route through text.on-{role} / text.on-{role}-strong).",
|
|
2711
2711
|
"name": "--hx-button-color",
|
|
2712
|
-
"default": "var(--hx-color-
|
|
2712
|
+
"default": "var(--hx-color-text-on-primary)",
|
|
2713
2713
|
"figmaBinding": {
|
|
2714
2714
|
"target": "Fill",
|
|
2715
2715
|
"layerSelector": "root",
|
|
2716
|
-
"semanticToken": "color/
|
|
2717
|
-
"fallbackPrimitive":
|
|
2716
|
+
"semanticToken": "color/text/on/primary",
|
|
2717
|
+
"fallbackPrimitive": null,
|
|
2718
2718
|
"literalFallback": null
|
|
2719
2719
|
}
|
|
2720
2720
|
},
|
|
2721
2721
|
{
|
|
2722
|
-
"description": "Button border color.",
|
|
2722
|
+
"description": "Button border color (secondary/outline variants route through action.secondary.border).",
|
|
2723
2723
|
"name": "--hx-button-border-color",
|
|
2724
2724
|
"default": "transparent",
|
|
2725
2725
|
"figmaBinding": {
|
|
@@ -2779,249 +2779,144 @@
|
|
|
2779
2779
|
}
|
|
2780
2780
|
},
|
|
2781
2781
|
{
|
|
2782
|
-
"description": "Text color when inverted.",
|
|
2782
|
+
"description": "Text color when inverted (resolves to neutral-0).",
|
|
2783
2783
|
"name": "--hx-button-inverted-color",
|
|
2784
|
-
"default": "
|
|
2784
|
+
"default": "var(--hx-color-text-inverse)",
|
|
2785
2785
|
"figmaBinding": {
|
|
2786
2786
|
"target": "Fill",
|
|
2787
2787
|
"layerSelector": "root",
|
|
2788
|
-
"semanticToken":
|
|
2788
|
+
"semanticToken": "color/text/inverse",
|
|
2789
2789
|
"fallbackPrimitive": null,
|
|
2790
|
-
"literalFallback":
|
|
2790
|
+
"literalFallback": null
|
|
2791
2791
|
}
|
|
2792
2792
|
},
|
|
2793
2793
|
{
|
|
2794
|
-
"description": "Ghost hover bg when inverted.",
|
|
2794
|
+
"description": "Ghost hover bg when inverted (overlay-white-30 ≈ 5:1 vs neutral-900).",
|
|
2795
2795
|
"name": "--hx-button-inverted-ghost-hover-bg",
|
|
2796
|
-
"default": "
|
|
2796
|
+
"default": "var(--hx-color-border-on-dark-default)",
|
|
2797
2797
|
"figmaBinding": {
|
|
2798
2798
|
"target": "Fill",
|
|
2799
2799
|
"layerSelector": "root",
|
|
2800
|
-
"semanticToken":
|
|
2800
|
+
"semanticToken": "color/border/on/dark/default",
|
|
2801
2801
|
"fallbackPrimitive": null,
|
|
2802
|
-
"literalFallback":
|
|
2802
|
+
"literalFallback": null
|
|
2803
2803
|
}
|
|
2804
2804
|
},
|
|
2805
2805
|
{
|
|
2806
|
-
"description": "Focus ring color when inverted.",
|
|
2806
|
+
"description": "Focus ring color when inverted (overlay-white-70 = ~5:1 vs neutral-900).",
|
|
2807
2807
|
"name": "--hx-button-inverted-focus-ring-color",
|
|
2808
|
-
"default": "
|
|
2808
|
+
"default": "var(--hx-color-border-on-dark-strong)",
|
|
2809
2809
|
"figmaBinding": {
|
|
2810
2810
|
"target": "Fill",
|
|
2811
2811
|
"layerSelector": "root",
|
|
2812
|
-
"semanticToken":
|
|
2812
|
+
"semanticToken": "color/border/on/dark/strong",
|
|
2813
2813
|
"fallbackPrimitive": null,
|
|
2814
|
-
"literalFallback":
|
|
2814
|
+
"literalFallback": null
|
|
2815
2815
|
}
|
|
2816
2816
|
},
|
|
2817
2817
|
{
|
|
2818
|
-
"description": "
|
|
2819
|
-
"name": "--hx-
|
|
2820
|
-
"figmaBinding": null
|
|
2821
|
-
},
|
|
2822
|
-
{
|
|
2823
|
-
"description": "Spacing token.",
|
|
2824
|
-
"name": "--hx-space-2",
|
|
2825
|
-
"figmaBinding": null
|
|
2826
|
-
},
|
|
2827
|
-
{
|
|
2828
|
-
"description": "Width.",
|
|
2829
|
-
"name": "--hx-border-width-thin",
|
|
2830
|
-
"figmaBinding": null
|
|
2831
|
-
},
|
|
2832
|
-
{
|
|
2833
|
-
"description": "CSS custom property.",
|
|
2834
|
-
"name": "--hx-border-radius-md",
|
|
2835
|
-
"figmaBinding": null
|
|
2836
|
-
},
|
|
2837
|
-
{
|
|
2838
|
-
"description": "Color.",
|
|
2839
|
-
"name": "--hx-color-primary-500",
|
|
2840
|
-
"figmaBinding": null
|
|
2841
|
-
},
|
|
2842
|
-
{
|
|
2843
|
-
"description": "Color.",
|
|
2844
|
-
"name": "--hx-color-neutral-0",
|
|
2845
|
-
"figmaBinding": null
|
|
2846
|
-
},
|
|
2847
|
-
{
|
|
2848
|
-
"description": "Font family.",
|
|
2849
|
-
"name": "--hx-font-family-sans",
|
|
2850
|
-
"figmaBinding": null
|
|
2851
|
-
},
|
|
2852
|
-
{
|
|
2853
|
-
"description": "Font weight.",
|
|
2854
|
-
"name": "--hx-font-weight-semibold",
|
|
2855
|
-
"figmaBinding": null
|
|
2856
|
-
},
|
|
2857
|
-
{
|
|
2858
|
-
"description": "Line height.",
|
|
2859
|
-
"name": "--hx-line-height-tight",
|
|
2860
|
-
"figmaBinding": null
|
|
2861
|
-
},
|
|
2862
|
-
{
|
|
2863
|
-
"description": "Transition timing.",
|
|
2864
|
-
"name": "--hx-transition-fast",
|
|
2865
|
-
"figmaBinding": null
|
|
2866
|
-
},
|
|
2867
|
-
{
|
|
2868
|
-
"description": "Width.",
|
|
2869
|
-
"name": "--hx-focus-ring-width",
|
|
2870
|
-
"figmaBinding": null
|
|
2871
|
-
},
|
|
2872
|
-
{
|
|
2873
|
-
"description": "Color.",
|
|
2874
|
-
"name": "--hx-focus-ring-color",
|
|
2875
|
-
"figmaBinding": null
|
|
2876
|
-
},
|
|
2877
|
-
{
|
|
2878
|
-
"description": "CSS custom property.",
|
|
2879
|
-
"name": "--hx-focus-ring-offset",
|
|
2880
|
-
"figmaBinding": null
|
|
2881
|
-
},
|
|
2882
|
-
{
|
|
2883
|
-
"description": "CSS filter.",
|
|
2884
|
-
"name": "--hx-filter-brightness-hover",
|
|
2885
|
-
"figmaBinding": null
|
|
2886
|
-
},
|
|
2887
|
-
{
|
|
2888
|
-
"description": "CSS filter.",
|
|
2889
|
-
"name": "--hx-filter-brightness-active",
|
|
2890
|
-
"figmaBinding": null
|
|
2891
|
-
},
|
|
2892
|
-
{
|
|
2893
|
-
"description": "Spacing token.",
|
|
2894
|
-
"name": "--hx-space-1",
|
|
2895
|
-
"figmaBinding": null
|
|
2896
|
-
},
|
|
2897
|
-
{
|
|
2898
|
-
"description": "Spacing token.",
|
|
2899
|
-
"name": "--hx-space-3",
|
|
2900
|
-
"figmaBinding": null
|
|
2901
|
-
},
|
|
2902
|
-
{
|
|
2903
|
-
"description": "Font size.",
|
|
2904
|
-
"name": "--hx-font-size-sm",
|
|
2905
|
-
"figmaBinding": null
|
|
2906
|
-
},
|
|
2907
|
-
{
|
|
2908
|
-
"description": "Minimum touch target size.",
|
|
2909
|
-
"name": "--hx-touch-target-min",
|
|
2910
|
-
"figmaBinding": null
|
|
2911
|
-
},
|
|
2912
|
-
{
|
|
2913
|
-
"description": "Spacing token.",
|
|
2914
|
-
"name": "--hx-space-4",
|
|
2915
|
-
"figmaBinding": null
|
|
2916
|
-
},
|
|
2917
|
-
{
|
|
2918
|
-
"description": "Font size.",
|
|
2919
|
-
"name": "--hx-font-size-md",
|
|
2920
|
-
"figmaBinding": null
|
|
2921
|
-
},
|
|
2922
|
-
{
|
|
2923
|
-
"description": "Size token.",
|
|
2924
|
-
"name": "--hx-size-10",
|
|
2818
|
+
"description": "Primary variant resting fill (3.2.1 semantic action layer).",
|
|
2819
|
+
"name": "--hx-color-action-primary-bg",
|
|
2925
2820
|
"figmaBinding": null
|
|
2926
2821
|
},
|
|
2927
2822
|
{
|
|
2928
|
-
"description": "
|
|
2929
|
-
"name": "--hx-
|
|
2823
|
+
"description": "Primary variant hover fill.",
|
|
2824
|
+
"name": "--hx-color-action-primary-bg-hover",
|
|
2930
2825
|
"figmaBinding": null
|
|
2931
2826
|
},
|
|
2932
2827
|
{
|
|
2933
|
-
"description": "
|
|
2934
|
-
"name": "--hx-
|
|
2828
|
+
"description": "Primary variant active/pressed fill.",
|
|
2829
|
+
"name": "--hx-color-action-primary-bg-active",
|
|
2935
2830
|
"figmaBinding": null
|
|
2936
2831
|
},
|
|
2937
2832
|
{
|
|
2938
|
-
"description": "
|
|
2939
|
-
"name": "--hx-
|
|
2833
|
+
"description": "Secondary/outline variant fg (resolves to primary-600 light, primary-400 dark).",
|
|
2834
|
+
"name": "--hx-color-action-secondary-fg",
|
|
2940
2835
|
"figmaBinding": null
|
|
2941
2836
|
},
|
|
2942
2837
|
{
|
|
2943
|
-
"description": "
|
|
2944
|
-
"name": "--hx-color-
|
|
2838
|
+
"description": "Secondary/outline variant border.",
|
|
2839
|
+
"name": "--hx-color-action-secondary-border",
|
|
2945
2840
|
"figmaBinding": null
|
|
2946
2841
|
},
|
|
2947
2842
|
{
|
|
2948
|
-
"description": "
|
|
2949
|
-
"name": "--hx-color-
|
|
2843
|
+
"description": "Secondary/outline variant hover fill.",
|
|
2844
|
+
"name": "--hx-color-action-secondary-bg-hover",
|
|
2950
2845
|
"figmaBinding": null
|
|
2951
2846
|
},
|
|
2952
2847
|
{
|
|
2953
|
-
"description": "
|
|
2954
|
-
"name": "--hx-color-
|
|
2848
|
+
"description": "Ghost variant fg.",
|
|
2849
|
+
"name": "--hx-color-action-ghost-fg",
|
|
2955
2850
|
"figmaBinding": null
|
|
2956
2851
|
},
|
|
2957
2852
|
{
|
|
2958
|
-
"description": "
|
|
2959
|
-
"name": "--hx-color-
|
|
2853
|
+
"description": "Ghost variant hover fill.",
|
|
2854
|
+
"name": "--hx-color-action-ghost-bg-hover",
|
|
2960
2855
|
"figmaBinding": null
|
|
2961
2856
|
},
|
|
2962
2857
|
{
|
|
2963
|
-
"description": "
|
|
2964
|
-
"name": "--hx-color-
|
|
2858
|
+
"description": "Danger variant resting fill.",
|
|
2859
|
+
"name": "--hx-color-action-danger-bg",
|
|
2965
2860
|
"figmaBinding": null
|
|
2966
2861
|
},
|
|
2967
2862
|
{
|
|
2968
|
-
"description": "
|
|
2969
|
-
"name": "--hx-color-
|
|
2863
|
+
"description": "Danger variant hover fill.",
|
|
2864
|
+
"name": "--hx-color-action-danger-bg-hover",
|
|
2970
2865
|
"figmaBinding": null
|
|
2971
2866
|
},
|
|
2972
2867
|
{
|
|
2973
|
-
"description": "
|
|
2974
|
-
"name": "--hx-color-
|
|
2868
|
+
"description": "Danger variant active fill.",
|
|
2869
|
+
"name": "--hx-color-action-danger-bg-active",
|
|
2975
2870
|
"figmaBinding": null
|
|
2976
2871
|
},
|
|
2977
2872
|
{
|
|
2978
|
-
"description": "
|
|
2979
|
-
"name": "--hx-color-
|
|
2873
|
+
"description": "Foreground for primary fill (resolves to neutral-900 — AA-tuned for primary-500).",
|
|
2874
|
+
"name": "--hx-color-text-on-primary",
|
|
2980
2875
|
"figmaBinding": null
|
|
2981
2876
|
},
|
|
2982
2877
|
{
|
|
2983
|
-
"description": "
|
|
2984
|
-
"name": "--hx-color-primary-
|
|
2878
|
+
"description": "Foreground for primary-hover fill (resolves to neutral-0 across modes).",
|
|
2879
|
+
"name": "--hx-color-text-on-primary-strong",
|
|
2985
2880
|
"figmaBinding": null
|
|
2986
2881
|
},
|
|
2987
2882
|
{
|
|
2988
|
-
"description": "
|
|
2989
|
-
"name": "--hx-
|
|
2883
|
+
"description": "Foreground for danger fill (resolves to neutral-900).",
|
|
2884
|
+
"name": "--hx-color-text-on-error",
|
|
2990
2885
|
"figmaBinding": null
|
|
2991
2886
|
},
|
|
2992
2887
|
{
|
|
2993
|
-
"description": "
|
|
2994
|
-
"name": "--hx-
|
|
2888
|
+
"description": "Foreground for danger-hover fill (resolves to neutral-0 across modes).",
|
|
2889
|
+
"name": "--hx-color-text-on-error-strong",
|
|
2995
2890
|
"figmaBinding": null
|
|
2996
2891
|
},
|
|
2997
2892
|
{
|
|
2998
|
-
"description": "
|
|
2999
|
-
"name": "--hx-
|
|
2893
|
+
"description": "Foreground for tertiary variant on surface.sunken.",
|
|
2894
|
+
"name": "--hx-color-text-primary",
|
|
3000
2895
|
"figmaBinding": null
|
|
3001
2896
|
},
|
|
3002
2897
|
{
|
|
3003
|
-
"description": "
|
|
3004
|
-
"name": "--hx-color-
|
|
2898
|
+
"description": "Tertiary variant resting fill.",
|
|
2899
|
+
"name": "--hx-color-surface-sunken",
|
|
3005
2900
|
"figmaBinding": null
|
|
3006
2901
|
},
|
|
3007
2902
|
{
|
|
3008
|
-
"description": "
|
|
3009
|
-
"name": "--hx-
|
|
2903
|
+
"description": "Tertiary variant hover fill.",
|
|
2904
|
+
"name": "--hx-color-surface-raised",
|
|
3010
2905
|
"figmaBinding": null
|
|
3011
2906
|
},
|
|
3012
2907
|
{
|
|
3013
|
-
"description": "
|
|
3014
|
-
"name": "--hx-
|
|
2908
|
+
"description": "Inverted-tertiary resting border (overlay-white-10).",
|
|
2909
|
+
"name": "--hx-color-border-on-dark-subtle",
|
|
3015
2910
|
"figmaBinding": null
|
|
3016
2911
|
},
|
|
3017
2912
|
{
|
|
3018
|
-
"description": "
|
|
3019
|
-
"name": "--hx-
|
|
2913
|
+
"description": "Inverted-tertiary hover border + inverted-secondary/ghost hover border (overlay-white-30).",
|
|
2914
|
+
"name": "--hx-color-border-on-dark-default",
|
|
3020
2915
|
"figmaBinding": null
|
|
3021
2916
|
},
|
|
3022
2917
|
{
|
|
3023
|
-
"description": "
|
|
3024
|
-
"name": "--hx-
|
|
2918
|
+
"description": "Inverted focus-visible outline (overlay-white-70).",
|
|
2919
|
+
"name": "--hx-color-border-on-dark-strong",
|
|
3025
2920
|
"figmaBinding": null
|
|
3026
2921
|
}
|
|
3027
2922
|
],
|
|
@@ -17732,98 +17627,23 @@
|
|
|
17732
17627
|
}
|
|
17733
17628
|
},
|
|
17734
17629
|
{
|
|
17735
|
-
"description": "
|
|
17736
|
-
"name": "--hx-color-
|
|
17737
|
-
"figmaBinding": null
|
|
17738
|
-
},
|
|
17739
|
-
{
|
|
17740
|
-
"description": "Color.",
|
|
17741
|
-
"name": "--hx-color-neutral-100",
|
|
17742
|
-
"figmaBinding": null
|
|
17743
|
-
},
|
|
17744
|
-
{
|
|
17745
|
-
"description": "Transition timing.",
|
|
17746
|
-
"name": "--hx-transition-normal",
|
|
17747
|
-
"figmaBinding": null
|
|
17748
|
-
},
|
|
17749
|
-
{
|
|
17750
|
-
"description": "Width.",
|
|
17751
|
-
"name": "--hx-border-width-thin",
|
|
17752
|
-
"figmaBinding": null
|
|
17753
|
-
},
|
|
17754
|
-
{
|
|
17755
|
-
"description": "Color.",
|
|
17756
|
-
"name": "--hx-color-neutral-700",
|
|
17757
|
-
"figmaBinding": null
|
|
17758
|
-
},
|
|
17759
|
-
{
|
|
17760
|
-
"description": "Spacing token.",
|
|
17761
|
-
"name": "--hx-space-4",
|
|
17762
|
-
"figmaBinding": null
|
|
17763
|
-
},
|
|
17764
|
-
{
|
|
17765
|
-
"description": "Spacing token.",
|
|
17766
|
-
"name": "--hx-space-14",
|
|
17767
|
-
"figmaBinding": null
|
|
17768
|
-
},
|
|
17769
|
-
{
|
|
17770
|
-
"description": "Spacing token.",
|
|
17771
|
-
"name": "--hx-space-3",
|
|
17772
|
-
"figmaBinding": null
|
|
17773
|
-
},
|
|
17774
|
-
{
|
|
17775
|
-
"description": "Spacing token.",
|
|
17776
|
-
"name": "--hx-space-2",
|
|
17777
|
-
"figmaBinding": null
|
|
17778
|
-
},
|
|
17779
|
-
{
|
|
17780
|
-
"description": "Spacing token.",
|
|
17781
|
-
"name": "--hx-space-8",
|
|
17782
|
-
"figmaBinding": null
|
|
17783
|
-
},
|
|
17784
|
-
{
|
|
17785
|
-
"description": "CSS custom property.",
|
|
17786
|
-
"name": "--hx-border-radius-sm",
|
|
17787
|
-
"figmaBinding": null
|
|
17788
|
-
},
|
|
17789
|
-
{
|
|
17790
|
-
"description": "Color.",
|
|
17791
|
-
"name": "--hx-color-neutral-400",
|
|
17792
|
-
"figmaBinding": null
|
|
17793
|
-
},
|
|
17794
|
-
{
|
|
17795
|
-
"description": "Transition timing.",
|
|
17796
|
-
"name": "--hx-transition-fast",
|
|
17797
|
-
"figmaBinding": null
|
|
17798
|
-
},
|
|
17799
|
-
{
|
|
17800
|
-
"description": "Overlay color.",
|
|
17801
|
-
"name": "--hx-overlay-white-10",
|
|
17802
|
-
"figmaBinding": null
|
|
17803
|
-
},
|
|
17804
|
-
{
|
|
17805
|
-
"description": "Width.",
|
|
17806
|
-
"name": "--hx-focus-ring-width",
|
|
17807
|
-
"figmaBinding": null
|
|
17808
|
-
},
|
|
17809
|
-
{
|
|
17810
|
-
"description": "Color.",
|
|
17811
|
-
"name": "--hx-focus-ring-color",
|
|
17630
|
+
"description": "Side-nav surface fill (resolves to neutral-900 light, near-black dark).",
|
|
17631
|
+
"name": "--hx-color-surface-inverse",
|
|
17812
17632
|
"figmaBinding": null
|
|
17813
17633
|
},
|
|
17814
17634
|
{
|
|
17815
|
-
"description": "
|
|
17816
|
-
"name": "--hx-color-
|
|
17635
|
+
"description": "Side-nav text color (resolves to neutral-0).",
|
|
17636
|
+
"name": "--hx-color-text-inverse",
|
|
17817
17637
|
"figmaBinding": null
|
|
17818
17638
|
},
|
|
17819
17639
|
{
|
|
17820
|
-
"description": "
|
|
17821
|
-
"name": "--hx-
|
|
17640
|
+
"description": "Header/footer divider border.",
|
|
17641
|
+
"name": "--hx-color-border-strong",
|
|
17822
17642
|
"figmaBinding": null
|
|
17823
17643
|
},
|
|
17824
17644
|
{
|
|
17825
|
-
"description": "
|
|
17826
|
-
"name": "--hx-
|
|
17645
|
+
"description": "Toggle button hover surface (overlay-white-10 primitive — semantic layer for inverted affordances).",
|
|
17646
|
+
"name": "--hx-color-border-on-dark-subtle",
|
|
17827
17647
|
"figmaBinding": null
|
|
17828
17648
|
}
|
|
17829
17649
|
],
|
|
@@ -23522,153 +23342,86 @@
|
|
|
23522
23342
|
}
|
|
23523
23343
|
},
|
|
23524
23344
|
{
|
|
23525
|
-
"description": "
|
|
23526
|
-
"name": "--hx-
|
|
23527
|
-
"
|
|
23528
|
-
|
|
23529
|
-
|
|
23530
|
-
|
|
23531
|
-
|
|
23532
|
-
|
|
23533
|
-
|
|
23534
|
-
|
|
23535
|
-
"description": "Color.",
|
|
23536
|
-
"name": "--hx-color-primary-400",
|
|
23537
|
-
"figmaBinding": null
|
|
23345
|
+
"description": "Outer border-width override (canonical hx-{tag}-* prefix; sits above --hx-input-* aliases in the cascade).",
|
|
23346
|
+
"name": "--hx-text-input-border-width",
|
|
23347
|
+
"default": "var(--hx-border-width-thin)",
|
|
23348
|
+
"figmaBinding": {
|
|
23349
|
+
"target": "Stroke",
|
|
23350
|
+
"layerSelector": "root",
|
|
23351
|
+
"semanticToken": "border/width/thin",
|
|
23352
|
+
"fallbackPrimitive": null,
|
|
23353
|
+
"literalFallback": null
|
|
23354
|
+
}
|
|
23538
23355
|
},
|
|
23539
23356
|
{
|
|
23540
|
-
"description": "
|
|
23541
|
-
"name": "--hx-
|
|
23542
|
-
"
|
|
23357
|
+
"description": "Outer horizontal padding override.",
|
|
23358
|
+
"name": "--hx-text-input-padding-x",
|
|
23359
|
+
"default": "var(--hx-space-3)",
|
|
23360
|
+
"figmaBinding": {
|
|
23361
|
+
"target": "Padding",
|
|
23362
|
+
"layerSelector": "root",
|
|
23363
|
+
"semanticToken": "space",
|
|
23364
|
+
"fallbackPrimitive": "space/3",
|
|
23365
|
+
"literalFallback": null
|
|
23366
|
+
}
|
|
23543
23367
|
},
|
|
23544
23368
|
{
|
|
23545
|
-
"description": "
|
|
23546
|
-
"name": "--hx-
|
|
23547
|
-
"
|
|
23369
|
+
"description": "Outer vertical padding override.",
|
|
23370
|
+
"name": "--hx-text-input-padding-y",
|
|
23371
|
+
"default": "var(--hx-space-2)",
|
|
23372
|
+
"figmaBinding": {
|
|
23373
|
+
"target": "Padding",
|
|
23374
|
+
"layerSelector": "root",
|
|
23375
|
+
"semanticToken": "space",
|
|
23376
|
+
"fallbackPrimitive": "space/2",
|
|
23377
|
+
"literalFallback": null
|
|
23378
|
+
}
|
|
23548
23379
|
},
|
|
23549
23380
|
{
|
|
23550
|
-
"description": "
|
|
23551
|
-
"name": "--hx-
|
|
23552
|
-
"
|
|
23381
|
+
"description": "Outer font-size override.",
|
|
23382
|
+
"name": "--hx-text-input-font-size",
|
|
23383
|
+
"default": "var(--hx-font-size-md)",
|
|
23384
|
+
"figmaBinding": {
|
|
23385
|
+
"target": "FontSize",
|
|
23386
|
+
"layerSelector": "root",
|
|
23387
|
+
"semanticToken": null,
|
|
23388
|
+
"fallbackPrimitive": "font-size/md",
|
|
23389
|
+
"literalFallback": null
|
|
23390
|
+
}
|
|
23553
23391
|
},
|
|
23554
23392
|
{
|
|
23555
|
-
"description": "
|
|
23556
|
-
"name": "--hx-font-
|
|
23393
|
+
"description": "Outer sm-variant font-size override (falls through to --hx-input-sm-font-size).",
|
|
23394
|
+
"name": "--hx-text-input-sm-font-size",
|
|
23557
23395
|
"figmaBinding": null
|
|
23558
23396
|
},
|
|
23559
23397
|
{
|
|
23560
|
-
"description": "
|
|
23561
|
-
"name": "--hx-font-size
|
|
23398
|
+
"description": "Outer lg-variant font-size override (falls through to --hx-input-lg-font-size).",
|
|
23399
|
+
"name": "--hx-text-input-lg-font-size",
|
|
23562
23400
|
"figmaBinding": null
|
|
23563
23401
|
},
|
|
23564
23402
|
{
|
|
23565
|
-
"description": "
|
|
23566
|
-
"name": "--hx-
|
|
23403
|
+
"description": "Resting field surface (semantic).",
|
|
23404
|
+
"name": "--hx-color-surface-default",
|
|
23567
23405
|
"figmaBinding": null
|
|
23568
23406
|
},
|
|
23569
23407
|
{
|
|
23570
|
-
"description": "
|
|
23571
|
-
"name": "--hx-color-
|
|
23408
|
+
"description": "Resting input text + label color (semantic).",
|
|
23409
|
+
"name": "--hx-color-text-strong",
|
|
23572
23410
|
"figmaBinding": null
|
|
23573
23411
|
},
|
|
23574
23412
|
{
|
|
23575
|
-
"description": "
|
|
23576
|
-
"name": "--hx-
|
|
23413
|
+
"description": "Resting border color (semantic).",
|
|
23414
|
+
"name": "--hx-color-border-strong",
|
|
23577
23415
|
"figmaBinding": null
|
|
23578
23416
|
},
|
|
23579
23417
|
{
|
|
23580
|
-
"description": "
|
|
23418
|
+
"description": "Error state text + border color (semantic).",
|
|
23581
23419
|
"name": "--hx-color-error-text",
|
|
23582
23420
|
"figmaBinding": null
|
|
23583
23421
|
},
|
|
23584
23422
|
{
|
|
23585
|
-
"description": "
|
|
23586
|
-
"name": "--hx-
|
|
23587
|
-
"figmaBinding": null
|
|
23588
|
-
},
|
|
23589
|
-
{
|
|
23590
|
-
"description": "Width.",
|
|
23591
|
-
"name": "--hx-border-width-thin",
|
|
23592
|
-
"figmaBinding": null
|
|
23593
|
-
},
|
|
23594
|
-
{
|
|
23595
|
-
"description": "Color.",
|
|
23596
|
-
"name": "--hx-color-neutral-300",
|
|
23597
|
-
"figmaBinding": null
|
|
23598
|
-
},
|
|
23599
|
-
{
|
|
23600
|
-
"description": "CSS custom property.",
|
|
23601
|
-
"name": "--hx-border-radius-md",
|
|
23602
|
-
"figmaBinding": null
|
|
23603
|
-
},
|
|
23604
|
-
{
|
|
23605
|
-
"description": "Color.",
|
|
23606
|
-
"name": "--hx-color-neutral-0",
|
|
23607
|
-
"figmaBinding": null
|
|
23608
|
-
},
|
|
23609
|
-
{
|
|
23610
|
-
"description": "Transition timing.",
|
|
23611
|
-
"name": "--hx-transition-fast",
|
|
23612
|
-
"figmaBinding": null
|
|
23613
|
-
},
|
|
23614
|
-
{
|
|
23615
|
-
"description": "Color.",
|
|
23616
|
-
"name": "--hx-color-error-500",
|
|
23617
|
-
"figmaBinding": null
|
|
23618
|
-
},
|
|
23619
|
-
{
|
|
23620
|
-
"description": "Color.",
|
|
23621
|
-
"name": "--hx-color-neutral-500",
|
|
23622
|
-
"figmaBinding": null
|
|
23623
|
-
},
|
|
23624
|
-
{
|
|
23625
|
-
"description": "Spacing token.",
|
|
23626
|
-
"name": "--hx-space-3",
|
|
23627
|
-
"figmaBinding": null
|
|
23628
|
-
},
|
|
23629
|
-
{
|
|
23630
|
-
"description": "Spacing token.",
|
|
23631
|
-
"name": "--hx-space-2",
|
|
23632
|
-
"figmaBinding": null
|
|
23633
|
-
},
|
|
23634
|
-
{
|
|
23635
|
-
"description": "Font size.",
|
|
23636
|
-
"name": "--hx-font-size-md",
|
|
23637
|
-
"figmaBinding": null
|
|
23638
|
-
},
|
|
23639
|
-
{
|
|
23640
|
-
"description": "Color.",
|
|
23641
|
-
"name": "--hx-color-neutral-800",
|
|
23642
|
-
"figmaBinding": null
|
|
23643
|
-
},
|
|
23644
|
-
{
|
|
23645
|
-
"description": "Size token.",
|
|
23646
|
-
"name": "--hx-size-10",
|
|
23647
|
-
"figmaBinding": null
|
|
23648
|
-
},
|
|
23649
|
-
{
|
|
23650
|
-
"description": "Color.",
|
|
23651
|
-
"name": "--hx-color-neutral-400",
|
|
23652
|
-
"figmaBinding": null
|
|
23653
|
-
},
|
|
23654
|
-
{
|
|
23655
|
-
"description": "Size token.",
|
|
23656
|
-
"name": "--hx-size-8",
|
|
23657
|
-
"figmaBinding": null
|
|
23658
|
-
},
|
|
23659
|
-
{
|
|
23660
|
-
"description": "Spacing token.",
|
|
23661
|
-
"name": "--hx-space-4",
|
|
23662
|
-
"figmaBinding": null
|
|
23663
|
-
},
|
|
23664
|
-
{
|
|
23665
|
-
"description": "Size token.",
|
|
23666
|
-
"name": "--hx-size-12",
|
|
23667
|
-
"figmaBinding": null
|
|
23668
|
-
},
|
|
23669
|
-
{
|
|
23670
|
-
"description": "Font size.",
|
|
23671
|
-
"name": "--hx-font-size-xs",
|
|
23423
|
+
"description": "Error border primitive fallback inside the focus-state cascade.",
|
|
23424
|
+
"name": "--hx-color-error-600",
|
|
23672
23425
|
"figmaBinding": null
|
|
23673
23426
|
}
|
|
23674
23427
|
],
|