[Bug]: Icon color in ghost button is filled in wrong color when high contrast mode + dark theme

[s-onuma]

Package

carbon-components, carbon-components-react

Browser

Chrome

Package version

carbon-components v10.53.0, carbon-components-react v7.53.0

React version

v16.14.0

Description

In high contrast mode with dark theme (e.g. carbon-theme--g90), a ghost button with hasIconOnly is not filled in the correct color.

Expected: Ghost button icon should be filled in the text color.

Actual: Ghost button icon is filled in black while tertiary button is correctly filled in the text color.

It's because ghost button is overwritten by fill: ButtonText.

https://github.com/carbon-design-system/carbon/issues/10199 is relevant (or duplicate).

Reproduction/example

https://codesandbox.io/s/tearsheet-example-forked-hlzepj

Steps to reproduce

1. Enable high contrast mode in your OS. I take macOS Monterey for example. Open System Preference and tick "Increase contrast" in Accessibility > Display.

2. Open the codesandbox example and set Gray 90 for the theme.

Code of Conduct

• [X] I agree to follow this project's Code of Conduct
• [X] I checked the current issues for duplicate problems