Add CSS variable to contrast TextInput (#6270)

langermank · web-flow · commit b2a44c3e6974 · 2025-07-02T16:30:57.000Z
diff --git a/.changeset/itchy-rice-rescue.md b/.changeset/itchy-rice-rescue.md
@@ -0,0 +1,5 @@
+---
+"@primer/react": patch
+---
+
+Add CSS variable to `contrast` `TextInput`
diff --git a/packages/react/src/internal/components/TextInputWrapper.module.css b/packages/react/src/internal/components/TextInputWrapper.module.css
@@ -44,7 +44,9 @@
   }
 
   &:where([data-contrast]) {
-    background-color: var(--bgColor-inset);
+    /* this variable is available behind a feature flag in gh/gh */
+    /* stylelint-disable-next-line primer/colors */
+    background-color: var(--control-bgColor-contrast, var(--bgColor-inset));
   }
 
   &:where([data-disabled]) {

-Original file line number
+Diff line change
@@ @@ -0,0 +1,5 @@ @@
 +---
 +"@primer/react": patch
 +---
++
 +Add CSS variable to `contrast` `TextInput`
Original file line number	Diff line number	Diff line change
`@@ -44,7 +44,9 @@`
`44`	`44`	`}`
`45`	`45`
`46`	`46`	`&:where([data-contrast]) {`
`47`		`- background-color: var(--bgColor-inset);`
	`47`	`+ /* this variable is available behind a feature flag in gh/gh */`
	`48`	`+ /* stylelint-disable-next-line primer/colors */`
	`49`	`+ background-color: var(--control-bgColor-contrast, var(--bgColor-inset));`
`48`	`50`	`}`
`49`	`51`
`50`	`52`	`&:where([data-disabled]) {`