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

package/figma-inventory.json

@@ -1,6 +1,6 @@
 {
   "schemaVersion": "1.0.0",
-  "generatedAt": "2026-04-25T21:18:39.950Z",
+  "generatedAt": "2026-04-26T01:48:15.557Z",
   "sourceCem": "custom-elements.json",
   "helixVersion": "3.2.0",
   "tokensVersion": "3.2.0",
@@ -2690,36 +2690,41 @@
       ],
       "cssProperties": [
         {
-          "description": "Button background color.",
+          "description": "Button background color (3.2.1 cascade — variant rules route through action.{primary,secondary,ghost,danger}.bg).",
           "name": "--hx-button-bg",
-          "default": "var(--hx-color-primary-500)",
+          "default": "var(--hx-color-action-primary-bg)",
           "figmaBinding": {
             "target": "Fill",
             "layerSelector": "root",
-            "semanticToken": "color/primary",
-            "fallbackPrimitive": "color/primary/500",
+            "semanticToken": "color/action/primary/bg",
+            "fallbackPrimitive": null,
             "literalFallback": null
           }
         },
         {
-          "description": "Hover background color override. When set, overrides the variant default hover background from outside the shadow DOM.",
+          "description": "Hover background override (primary and danger variants only). Other variants (secondary/outline, ghost) keep their hover fills routed through their semantic action.* tokens and do not consume this hook. Under [inverted] for primary/danger, hover and active share a paint (combined :hover, :active rule), so this override applies to both states unless --hx-button-active-bg also takes precedence.",
           "name": "--hx-button-hover-bg",
           "figmaBinding": null
         },
         {
-          "description": "Button text color.",
+          "description": "Pressed/active background override (primary and danger variants only, including their inverted modes). Takes precedence over --hx-button-hover-bg in the fallback chain. Standard-mode primary/danger default to action.{primary,danger}.bg-active (with filter:none) for AA-pinned pressed contrast. Inverted-mode primary/danger reuse action.{primary,danger}.bg-inverted-hover (combined :hover, :active rule); setting --hx-button-active-bg under [inverted] therefore overrides the lifted hover fill as well as the pressed fill — the two share a paint in inverted mode. Other variants do not consume this hook.",
+          "name": "--hx-button-active-bg",
+          "figmaBinding": null
+        },
+        {
+          "description": "Button text color (variants route through text.on-{role} / text.on-{role}-strong).",
           "name": "--hx-button-color",
-          "default": "var(--hx-color-neutral-0)",
+          "default": "var(--hx-color-text-on-primary)",
           "figmaBinding": {
             "target": "Fill",
             "layerSelector": "root",
-            "semanticToken": "color/neutral",
-            "fallbackPrimitive": "color/neutral/0",
+            "semanticToken": "color/text/on/primary",
+            "fallbackPrimitive": null,
             "literalFallback": null
           }
         },
         {
-          "description": "Button border color.",
+          "description": "Button border color (secondary/outline variants route through action.secondary.border).",
           "name": "--hx-button-border-color",
           "default": "transparent",
           "figmaBinding": {
@@ -2779,249 +2784,178 @@
           }
         },
         {
-          "description": "Text color when inverted.",
+          "description": "Text color when inverted (resolves to neutral-0).",
           "name": "--hx-button-inverted-color",
-          "default": "#ffffff",
+          "default": "var(--hx-color-text-inverse)",
           "figmaBinding": {
             "target": "Fill",
             "layerSelector": "root",
-            "semanticToken": null,
+            "semanticToken": "color/text/inverse",
             "fallbackPrimitive": null,
-            "literalFallback": "#ffffff"
+            "literalFallback": null
           }
         },
         {
-          "description": "Ghost hover bg when inverted.",
-          "name": "--hx-button-inverted-ghost-hover-bg",
-          "default": "rgba(255,255,255,0.15)",
+          "description": "Foreground override for inverted primary hover and pressed (combined :hover, :active rule). Defaults to text.on-primary (neutral-900, no dark-mode flip) so dark text rides the lifted primary-400 fill — text.inverse on light teal collapses to ~2.4:1 in light mode.",
+          "name": "--hx-button-inverted-primary-interactive-color",
+          "default": "var(--hx-color-text-on-primary)",
           "figmaBinding": {
             "target": "Fill",
             "layerSelector": "root",
-            "semanticToken": null,
+            "semanticToken": "color/text/on/primary",
             "fallbackPrimitive": null,
-            "literalFallback": "rgba(255,255,255,0.15)"
+            "literalFallback": null
           }
         },
         {
-          "description": "Focus ring color when inverted.",
-          "name": "--hx-button-inverted-focus-ring-color",
-          "default": "rgba(255,255,255,0.5)",
+          "description": "Foreground override for inverted danger hover and pressed (combined :hover, :active rule). Defaults to text.on-error (neutral-900); same rationale as the primary override.",
+          "name": "--hx-button-inverted-danger-interactive-color",
+          "default": "var(--hx-color-text-on-error)",
           "figmaBinding": {
             "target": "Fill",
             "layerSelector": "root",
-            "semanticToken": null,
+            "semanticToken": "color/text/on/error",
             "fallbackPrimitive": null,
-            "literalFallback": "rgba(255,255,255,0.5)"
+            "literalFallback": null
           }
         },
         {
-          "description": "Opacity.",
-          "name": "--hx-opacity-disabled",
-          "figmaBinding": null
-        },
-        {
-          "description": "Spacing token.",
-          "name": "--hx-space-2",
-          "figmaBinding": null
-        },
-        {
-          "description": "Width.",
-          "name": "--hx-border-width-thin",
-          "figmaBinding": null
-        },
-        {
-          "description": "CSS custom property.",
-          "name": "--hx-border-radius-md",
-          "figmaBinding": null
-        },
-        {
-          "description": "Color.",
-          "name": "--hx-color-primary-500",
-          "figmaBinding": null
-        },
-        {
-          "description": "Color.",
-          "name": "--hx-color-neutral-0",
-          "figmaBinding": null
-        },
-        {
-          "description": "Font family.",
-          "name": "--hx-font-family-sans",
-          "figmaBinding": null
-        },
-        {
-          "description": "Font weight.",
-          "name": "--hx-font-weight-semibold",
-          "figmaBinding": null
-        },
-        {
-          "description": "Line height.",
-          "name": "--hx-line-height-tight",
-          "figmaBinding": null
-        },
-        {
-          "description": "Transition timing.",
-          "name": "--hx-transition-fast",
-          "figmaBinding": null
-        },
-        {
-          "description": "Width.",
-          "name": "--hx-focus-ring-width",
-          "figmaBinding": null
-        },
-        {
-          "description": "Color.",
-          "name": "--hx-focus-ring-color",
-          "figmaBinding": null
-        },
-        {
-          "description": "CSS custom property.",
-          "name": "--hx-focus-ring-offset",
-          "figmaBinding": null
-        },
-        {
-          "description": "CSS filter.",
-          "name": "--hx-filter-brightness-hover",
-          "figmaBinding": null
-        },
-        {
-          "description": "CSS filter.",
-          "name": "--hx-filter-brightness-active",
-          "figmaBinding": null
-        },
-        {
-          "description": "Spacing token.",
-          "name": "--hx-space-1",
-          "figmaBinding": null
-        },
-        {
-          "description": "Spacing token.",
-          "name": "--hx-space-3",
-          "figmaBinding": null
-        },
-        {
-          "description": "Font size.",
-          "name": "--hx-font-size-sm",
-          "figmaBinding": null
+          "description": "Ghost hover bg when inverted (overlay-white-30 ≈ 5:1 vs neutral-900).",
+          "name": "--hx-button-inverted-ghost-hover-bg",
+          "default": "var(--hx-color-border-on-dark-default)",
+          "figmaBinding": {
+            "target": "Fill",
+            "layerSelector": "root",
+            "semanticToken": "color/border/on/dark/default",
+            "fallbackPrimitive": null,
+            "literalFallback": null
+          }
         },
         {
-          "description": "Minimum touch target size.",
-          "name": "--hx-touch-target-min",
-          "figmaBinding": null
+          "description": "Focus ring color when inverted (overlay-white-70 = ~5:1 vs neutral-900).",
+          "name": "--hx-button-inverted-focus-ring-color",
+          "default": "var(--hx-color-border-on-dark-strong)",
+          "figmaBinding": {
+            "target": "Fill",
+            "layerSelector": "root",
+            "semanticToken": "color/border/on/dark/strong",
+            "fallbackPrimitive": null,
+            "literalFallback": null
+          }
         },
         {
-          "description": "Spacing token.",
-          "name": "--hx-space-4",
+          "description": "Primary variant resting fill (3.2.1 semantic action layer).",
+          "name": "--hx-color-action-primary-bg",
           "figmaBinding": null
         },
         {
-          "description": "Font size.",
-          "name": "--hx-font-size-md",
+          "description": "Primary variant hover fill.",
+          "name": "--hx-color-action-primary-bg-hover",
           "figmaBinding": null
         },
         {
-          "description": "Size token.",
-          "name": "--hx-size-10",
+          "description": "Primary variant active/pressed fill.",
+          "name": "--hx-color-action-primary-bg-active",
           "figmaBinding": null
         },
         {
-          "description": "Spacing token.",
-          "name": "--hx-space-6",
+          "description": "Secondary/outline variant fg (resolves to primary-600 light, primary-400 dark). Consumed only by .button--secondary; the actual border/surface paint for outline currently routes through --hx-color-border-strong / --hx-color-surface-raised in styles, with this token reserved for the foreground.",
+          "name": "--hx-color-action-secondary-fg",
           "figmaBinding": null
         },
         {
-          "description": "Font size.",
-          "name": "--hx-font-size-lg",
+          "description": "Secondary/outline variant border (3.2.1 semantic; outline still routes through --hx-color-border-strong by default).",
+          "name": "--hx-color-action-secondary-border",
           "figmaBinding": null
         },
         {
-          "description": "Size token.",
-          "name": "--hx-size-12",
+          "description": "Secondary/outline variant hover fill (3.2.1 semantic; outline still routes through --hx-color-surface-raised by default).",
+          "name": "--hx-color-action-secondary-bg-hover",
           "figmaBinding": null
         },
         {
-          "description": "Color.",
-          "name": "--hx-color-primary-50",
+          "description": "Ghost variant fg.",
+          "name": "--hx-color-action-ghost-fg",
           "figmaBinding": null
         },
         {
-          "description": "Color.",
-          "name": "--hx-color-neutral-100",
+          "description": "Ghost variant hover fill.",
+          "name": "--hx-color-action-ghost-bg-hover",
           "figmaBinding": null
         },
         {
-          "description": "Color.",
-          "name": "--hx-color-neutral-900",
+          "description": "Danger variant resting fill.",
+          "name": "--hx-color-action-danger-bg",
           "figmaBinding": null
         },
         {
-          "description": "Color.",
-          "name": "--hx-color-neutral-200",
+          "description": "Danger variant hover fill.",
+          "name": "--hx-color-action-danger-bg-hover",
           "figmaBinding": null
         },
         {
-          "description": "Color.",
-          "name": "--hx-color-error-500",
+          "description": "Danger variant active fill.",
+          "name": "--hx-color-action-danger-bg-active",
           "figmaBinding": null
         },
         {
-          "description": "Color.",
-          "name": "--hx-color-error-600",
+          "description": "Primary variant hover/pressed fill on dark/inverted surface (resolves to primary-400, 7.27:1 on neutral-900).",
+          "name": "--hx-color-action-primary-bg-inverted-hover",
           "figmaBinding": null
         },
         {
-          "description": "Color.",
-          "name": "--hx-color-neutral-300",
+          "description": "Danger variant hover/pressed fill on dark/inverted surface (resolves to error-400, 6.58:1 on neutral-900).",
+          "name": "--hx-color-action-danger-bg-inverted-hover",
           "figmaBinding": null
         },
         {
-          "description": "Color.",
-          "name": "--hx-color-neutral-50",
+          "description": "Foreground for primary fill (resolves to neutral-900 — AA-tuned for primary-500).",
+          "name": "--hx-color-text-on-primary",
           "figmaBinding": null
         },
         {
-          "description": "Color.",
-          "name": "--hx-color-primary-600",
+          "description": "Foreground for primary-hover fill (resolves to neutral-0 across modes).",
+          "name": "--hx-color-text-on-primary-strong",
           "figmaBinding": null
         },
         {
-          "description": "Animation duration.",
-          "name": "--hx-duration-spinner",
+          "description": "Foreground for danger fill (resolves to neutral-900).",
+          "name": "--hx-color-text-on-error",
           "figmaBinding": null
         },
         {
-          "description": "Opacity.",
-          "name": "--hx-opacity-muted",
+          "description": "Foreground for danger-hover fill (resolves to neutral-0 across modes).",
+          "name": "--hx-color-text-on-error-strong",
           "figmaBinding": null
         },
         {
-          "description": "Overlay color.",
-          "name": "--hx-overlay-white-50",
+          "description": "Foreground for tertiary variant on surface.sunken.",
+          "name": "--hx-color-text-primary",
           "figmaBinding": null
         },
         {
-          "description": "Color.",
-          "name": "--hx-color-primary-400",
+          "description": "Tertiary variant resting fill.",
+          "name": "--hx-color-surface-sunken",
           "figmaBinding": null
         },
         {
-          "description": "Overlay color.",
-          "name": "--hx-overlay-white-70",
+          "description": "Tertiary variant hover fill.",
+          "name": "--hx-color-surface-raised",
           "figmaBinding": null
         },
         {
-          "description": "Overlay color.",
-          "name": "--hx-overlay-white-15",
+          "description": "Inverted-tertiary resting border (overlay-white-10).",
+          "name": "--hx-color-border-on-dark-subtle",
           "figmaBinding": null
         },
         {
-          "description": "Overlay color.",
-          "name": "--hx-overlay-white-25",
+          "description": "Inverted-tertiary hover border + inverted-secondary/ghost hover border (overlay-white-30).",
+          "name": "--hx-color-border-on-dark-default",
           "figmaBinding": null
         },
         {
-          "description": "Overlay color.",
-          "name": "--hx-overlay-white-20",
+          "description": "Inverted focus-visible outline (overlay-white-70).",
+          "name": "--hx-color-border-on-dark-strong",
           "figmaBinding": null
         }
       ],
@@ -17732,98 +17666,23 @@
           }
         },
         {
-          "description": "Color.",
-          "name": "--hx-color-neutral-900",
-          "figmaBinding": null
-        },
-        {
-          "description": "Color.",
-          "name": "--hx-color-neutral-100",
-          "figmaBinding": null
-        },
-        {
-          "description": "Transition timing.",
-          "name": "--hx-transition-normal",
-          "figmaBinding": null
-        },
-        {
-          "description": "Width.",
-          "name": "--hx-border-width-thin",
-          "figmaBinding": null
-        },
-        {
-          "description": "Color.",
-          "name": "--hx-color-neutral-700",
-          "figmaBinding": null
-        },
-        {
-          "description": "Spacing token.",
-          "name": "--hx-space-4",
-          "figmaBinding": null
-        },
-        {
-          "description": "Spacing token.",
-          "name": "--hx-space-14",
-          "figmaBinding": null
-        },
-        {
-          "description": "Spacing token.",
-          "name": "--hx-space-3",
-          "figmaBinding": null
-        },
-        {
-          "description": "Spacing token.",
-          "name": "--hx-space-2",
-          "figmaBinding": null
-        },
-        {
-          "description": "Spacing token.",
-          "name": "--hx-space-8",
-          "figmaBinding": null
-        },
-        {
-          "description": "CSS custom property.",
-          "name": "--hx-border-radius-sm",
-          "figmaBinding": null
-        },
-        {
-          "description": "Color.",
-          "name": "--hx-color-neutral-400",
-          "figmaBinding": null
-        },
-        {
-          "description": "Transition timing.",
-          "name": "--hx-transition-fast",
-          "figmaBinding": null
-        },
-        {
-          "description": "Overlay color.",
-          "name": "--hx-overlay-white-10",
-          "figmaBinding": null
-        },
-        {
-          "description": "Width.",
-          "name": "--hx-focus-ring-width",
-          "figmaBinding": null
-        },
-        {
-          "description": "Color.",
-          "name": "--hx-focus-ring-color",
+          "description": "Side-nav surface fill (resolves to neutral-900 light, near-black dark).",
+          "name": "--hx-color-surface-inverse",
           "figmaBinding": null
         },
         {
-          "description": "Color.",
-          "name": "--hx-color-primary-400",
+          "description": "Side-nav text color (resolves to neutral-0).",
+          "name": "--hx-color-text-inverse",
           "figmaBinding": null
         },
         {
-          "description": "CSS custom property.",
-          "name": "--hx-focus-ring-offset",
+          "description": "Header/footer divider border.",
+          "name": "--hx-color-border-strong",
           "figmaBinding": null
         },
         {
-          "description": "Spacing token.",
-          "name": "--hx-space-5",
+          "description": "Toggle button hover surface (overlay-white-10 primitive — semantic layer for inverted affordances).",
+          "name": "--hx-color-border-on-dark-subtle",
           "figmaBinding": null
         }
       ],
@@ -23522,153 +23381,86 @@
           }
         },
         {
-          "description": "Opacity.",
-          "name": "--hx-opacity-disabled",
-          "figmaBinding": null
-        },
-        {
-          "description": "Color.",
-          "name": "--hx-focus-ring-color",
-          "figmaBinding": null
-        },
-        {
-          "description": "Color.",
-          "name": "--hx-color-primary-400",
-          "figmaBinding": null
+          "description": "Outer border-width override (canonical hx-{tag}-* prefix; sits above --hx-input-* aliases in the cascade).",
+          "name": "--hx-text-input-border-width",
+          "default": "var(--hx-border-width-thin)",
+          "figmaBinding": {
+            "target": "Stroke",
+            "layerSelector": "root",
+            "semanticToken": "border/width/thin",
+            "fallbackPrimitive": null,
+            "literalFallback": null
+          }
         },
         {
-          "description": "Width.",
-          "name": "--hx-focus-ring-width",
-          "figmaBinding": null
+          "description": "Outer horizontal padding override.",
+          "name": "--hx-text-input-padding-x",
+          "default": "var(--hx-space-3)",
+          "figmaBinding": {
+            "target": "Padding",
+            "layerSelector": "root",
+            "semanticToken": "space",
+            "fallbackPrimitive": "space/3",
+            "literalFallback": null
+          }
         },
         {
-          "description": "CSS custom property.",
-          "name": "--hx-focus-ring-opacity",
-          "figmaBinding": null
+          "description": "Outer vertical padding override.",
+          "name": "--hx-text-input-padding-y",
+          "default": "var(--hx-space-2)",
+          "figmaBinding": {
+            "target": "Padding",
+            "layerSelector": "root",
+            "semanticToken": "space",
+            "fallbackPrimitive": "space/2",
+            "literalFallback": null
+          }
         },
         {
-          "description": "Spacing token.",
-          "name": "--hx-space-1",
-          "figmaBinding": null
+          "description": "Outer font-size override.",
+          "name": "--hx-text-input-font-size",
+          "default": "var(--hx-font-size-md)",
+          "figmaBinding": {
+            "target": "FontSize",
+            "layerSelector": "root",
+            "semanticToken": null,
+            "fallbackPrimitive": "font-size/md",
+            "literalFallback": null
+          }
         },
         {
-          "description": "Font family.",
-          "name": "--hx-font-family-sans",
+          "description": "Outer sm-variant font-size override (falls through to --hx-input-sm-font-size).",
+          "name": "--hx-text-input-sm-font-size",
           "figmaBinding": null
         },
         {
-          "description": "Font size.",
-          "name": "--hx-font-size-sm",
+          "description": "Outer lg-variant font-size override (falls through to --hx-input-lg-font-size).",
+          "name": "--hx-text-input-lg-font-size",
           "figmaBinding": null
         },
         {
-          "description": "Font weight.",
-          "name": "--hx-font-weight-medium",
+          "description": "Resting field surface (semantic).",
+          "name": "--hx-color-surface-default",
           "figmaBinding": null
         },
         {
-          "description": "Color.",
-          "name": "--hx-color-neutral-700",
+          "description": "Resting input text + label color (semantic).",
+          "name": "--hx-color-text-strong",
           "figmaBinding": null
         },
         {
-          "description": "Line height.",
-          "name": "--hx-line-height-normal",
+          "description": "Resting border color (semantic).",
+          "name": "--hx-color-border-strong",
           "figmaBinding": null
         },
         {
-          "description": "Color.",
+          "description": "Error state text + border color (semantic).",
           "name": "--hx-color-error-text",
           "figmaBinding": null
         },
         {
-          "description": "Font weight.",
-          "name": "--hx-font-weight-bold",
-          "figmaBinding": null
-        },
-        {
-          "description": "Width.",
-          "name": "--hx-border-width-thin",
-          "figmaBinding": null
-        },
-        {
-          "description": "Color.",
-          "name": "--hx-color-neutral-300",
-          "figmaBinding": null
-        },
-        {
-          "description": "CSS custom property.",
-          "name": "--hx-border-radius-md",
-          "figmaBinding": null
-        },
-        {
-          "description": "Color.",
-          "name": "--hx-color-neutral-0",
-          "figmaBinding": null
-        },
-        {
-          "description": "Transition timing.",
-          "name": "--hx-transition-fast",
-          "figmaBinding": null
-        },
-        {
-          "description": "Color.",
-          "name": "--hx-color-error-500",
-          "figmaBinding": null
-        },
-        {
-          "description": "Color.",
-          "name": "--hx-color-neutral-500",
-          "figmaBinding": null
-        },
-        {
-          "description": "Spacing token.",
-          "name": "--hx-space-3",
-          "figmaBinding": null
-        },
-        {
-          "description": "Spacing token.",
-          "name": "--hx-space-2",
-          "figmaBinding": null
-        },
-        {
-          "description": "Font size.",
-          "name": "--hx-font-size-md",
-          "figmaBinding": null
-        },
-        {
-          "description": "Color.",
-          "name": "--hx-color-neutral-800",
-          "figmaBinding": null
-        },
-        {
-          "description": "Size token.",
-          "name": "--hx-size-10",
-          "figmaBinding": null
-        },
-        {
-          "description": "Color.",
-          "name": "--hx-color-neutral-400",
-          "figmaBinding": null
-        },
-        {
-          "description": "Size token.",
-          "name": "--hx-size-8",
-          "figmaBinding": null
-        },
-        {
-          "description": "Spacing token.",
-          "name": "--hx-space-4",
-          "figmaBinding": null
-        },
-        {
-          "description": "Size token.",
-          "name": "--hx-size-12",
-          "figmaBinding": null
-        },
-        {
-          "description": "Font size.",
-          "name": "--hx-font-size-xs",
+          "description": "Error border primitive fallback inside the invalid-state cascade.",
+          "name": "--hx-color-error-600",
           "figmaBinding": null
         }
       ],