Button doubly faded when in both `disabled` and `loading` states

[nwhittaker]

Check existing issues

• [X] I have checked for existing issues to avoid duplicates

Actual Behavior

Enabling both disabled and loading attributes on a <calcite-button> element causes the button to appear twice as faded as it would if only one of those attributes was applied.

Expected Behavior

Button has the same amount of fading regardless if one or both attributes are enabled.

Reproduction Sample

https://developers.arcgis.com/calcite-design-system/components/button/

Reproduction Steps

1. Navigate to the documentation sample for the Button component
2. Enable the loading attribute and see button becomes faded
3. Enable the disabled attribute and see button becomes more faded
4. Disable the loading attribute and see the button becomes less faded

Reproduction Version

1.9.0

Relevant Info

Somewhat related to https://github.com/Esri/calcite-design-system/issues/7590 in that a workaround for that issue is to supply both disabled and loading attributes.

Regression?

No response

Priority impact

p4 - not time sensitive

Impact

Inconsistent UI where some buttons can look more faded than others despite being semantically the same in terms of their disabled state.

Calcite package

• [X] @esri/calcite-components
• [ ] @esri/calcite-components-react
• [ ] @esri/eslint-plugin-calcite-components

Esri team

ArcGIS Field Apps

[jcfranco]

This would take care of https://github.com/Esri/calcite-design-system/issues/6453.

[github-actions[bot]]

Installed and assigned for verification.

[geospatialem]

Verified in 1.10.0-next.7 with https://codepen.io/geospatialem/pen/zYeGaWv