Image: Account for disabled state

[randybascue]

Description

Problem

There are situations where an image is interactive but disabled, or nested within an element that is disabled. This is not currently accounted for within the system.

Solution

Add a disabled treatment for images to further reinforce its state that desaturates and reduces its opacity.

Specifications

Opacity = 0.32 or 32%
Adjustment layer = Desaturation
We can add a token for the opacity called opacity.interactive.disabled?

Acceptance criteria

A disabled state treatment is available in production that desaturates the image and reduces its opacity.

Notes

This was discussed in a previous issue.

Screenshots

Figma link

No response

Engineering pre-requisites

• Successful design review with Design System Team.
• Supports dark mode.
• Supports responsive design.
• Tokens have been provided (or already exist).
• Successful accessibility review with Core A11Y Team.
• Successful frontend review with eBayUI Team.

[agliga]

Probably will add either a token for this, or an image-disabled class in util.