bug(matSuffix): Hue/opacity of matSuffix does not match guidelines on material.io when field is disabled

[j-turner28]

trafficstars

Is this a regression?

• [ ] Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

The component guidelines on material.io show that when a text field is disabled, the suffix should appear grayed out (either via different color hue or opacity). The Angular Material implementation of this is not correct as the suffix does not change no matter which state the field is in.

Reproduction

StackBlitz example of issue

Expected Behavior

Any text, icons, etc. displayed in matSuffix should appeared grayed out or faded when the form field or input is disabled

Actual Behavior

The Angular Material implementation of this is not correct as the suffix does not change no matter which state the field is in.

Environment

• Angular: 14.1.0
• CDK/Material: 14.1.0
• Browser(s): Chrome
• Operating System (e.g. Windows, macOS, Ubuntu): macOS