From 3164406a75e6b9762e95d17f94215d9b69f816db Mon Sep 17 00:00:00 2001 From: Taylor Jones Date: Fri, 9 Oct 2026 14:23:05 -0500 Subject: [PATCH 1/4] deprecate contrast for TextInput and Textarea Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com> Copilot-Session: dcc70c7e-b01a-4abf-b3c3-f5251562a733 --- .changeset/deprecate-input-contrast.md | 5 +++++ .../react/src/TextInput/TextInput.docs.json | 3 ++- .../react/src/TextInput/TextInput.test.tsx | 18 ++++++++++++++++++ packages/react/src/Textarea/Textarea.docs.json | 3 ++- packages/react/src/Textarea/Textarea.test.tsx | 18 ++++++++++++++++++ packages/react/src/Textarea/Textarea.tsx | 2 +- .../internal/components/TextInputWrapper.tsx | 3 +++ 7 files changed, 49 insertions(+), 3 deletions(-) create mode 100644 .changeset/deprecate-input-contrast.md diff --git a/.changeset/deprecate-input-contrast.md b/.changeset/deprecate-input-contrast.md new file mode 100644 index 00000000000..47c8db30e0d --- /dev/null +++ b/.changeset/deprecate-input-contrast.md @@ -0,0 +1,5 @@ +--- +'@primer/react': minor +--- + +TextInput and Textarea: Deprecate the `contrast` prop. Omit it to use the default background. diff --git a/packages/react/src/TextInput/TextInput.docs.json b/packages/react/src/TextInput/TextInput.docs.json index ff68d969c31..af10bba0d6e 100644 --- a/packages/react/src/TextInput/TextInput.docs.json +++ b/packages/react/src/TextInput/TextInput.docs.json @@ -82,7 +82,8 @@ "name": "contrast", "type": "boolean", "defaultValue": "false", - "description": "Changes background color to a higher contrast color" + "deprecated": true, + "description": "Deprecated. Omit this prop to use the default background." }, { "name": "size", diff --git a/packages/react/src/TextInput/TextInput.test.tsx b/packages/react/src/TextInput/TextInput.test.tsx index 41b7054e43d..0cbe72bfec3 100644 --- a/packages/react/src/TextInput/TextInput.test.tsx +++ b/packages/react/src/TextInput/TextInput.test.tsx @@ -52,6 +52,24 @@ describe('TextInput', () => { expect(render().container).toMatchSnapshot() }) + it.each([ + {label: 'true', props: {contrast: true}}, + {label: 'false', props: {contrast: false}}, + {label: 'omitted', props: {}}, + ])('preserves deprecated contrast behavior when $label', ({props}) => { + const {container} = render() + const input = screen.getByRole('textbox') + + if (props.contrast) { + expect(container.firstElementChild).toHaveAttribute('data-contrast', 'true') + } else { + expect(container.firstElementChild).not.toHaveAttribute('data-contrast') + } + + expect(input).not.toHaveAttribute('contrast') + expect(input).toBeEnabled() + }) + it('renders monospace', () => { expect(render().container).toMatchSnapshot() }) diff --git a/packages/react/src/Textarea/Textarea.docs.json b/packages/react/src/Textarea/Textarea.docs.json index 11afa62f593..3ef30d34ab2 100644 --- a/packages/react/src/Textarea/Textarea.docs.json +++ b/packages/react/src/Textarea/Textarea.docs.json @@ -82,7 +82,8 @@ "name": "contrast", "type": "boolean", "defaultValue": "false", - "description": "Changes background color to a higher contrast color" + "deprecated": true, + "description": "Deprecated. Omit this prop to use the default background." }, { "name": "validationStatus", diff --git a/packages/react/src/Textarea/Textarea.test.tsx b/packages/react/src/Textarea/Textarea.test.tsx index b39980df561..c626bc9ec2b 100644 --- a/packages/react/src/Textarea/Textarea.test.tsx +++ b/packages/react/src/Textarea/Textarea.test.tsx @@ -37,6 +37,24 @@ describe('Textarea', () => { expect(screen.getByRole('textbox')).toBeInTheDocument() }) + it.each([ + {label: 'true', props: {contrast: true}}, + {label: 'false', props: {contrast: false}}, + {label: 'omitted', props: {}}, + ])('preserves deprecated contrast behavior when $label', ({props}) => { + const {container} = render(