The icons of buttons on disabled button bar don't look disabled

[blaky]

Current behaviour

The button icons look enabled on disabled buttons when they are used on a ButtonBar. It is the same for Button and ButtonMinor

Current look:

Expected behaviour

The button icons look disabled on disabled buttons when they are used on a ButtonBar. They should look just like a disabled button with an icon.

Expected look:

CodeSandbox or Storybook URL

https://codesandbox.io/s/romantic-franklin-mw2lkt?file=/src/App.js:0-1536

JIRA Ticket (Sage Only)

No response

Suggested Solution

No response

Carbon Version

12.0.0

Design Tokens Version

4.0.0

What browsers are you seeing the problem on?

Firefox, Chrome, Safari, Microsoft Edge, Other

What Operating System are you seeing the problem on?

MacOS, Windows, Linux, Android, iOS, Other

Anything else we should know?

The hover state of the disabled buttons are also faulty, the cursor changes to the disabled icon, but the background color and the font color is like the button wouldn't be disabled. This is not a recent regression, it happens with 119 and 118 too.

Confidentiality

• [X] I confirm there is no confidential or commercially sensitive information included.

[nicktitchmarsh]

E-6198