Interactive highlighting for non-control and non-action elements

Overview

We need to address inconsistent implementations of interactive highlighting for UI elements that aren't standard controls or actions. These are elements where we want to draw attention to something in the UI based on user interaction, but our existing design tokens don't adequately cover them.

Problem

While we have established design tokens and guidelines for controls and actions, we lack consistent patterns for highlighting related or contextual elements that respond to user interaction:

• Often triggered by hover or focus states, but not limited to these
• Currently implemented inconsistently across features
• No specific semantic tokens exist for these interactive relationships

Examples

• Pipeline graph connections and related nodes
• Linked files and comments when navigating between them
• Design management drag and drop zones
• Todo's
• Interactive table rows

✅ Discussion points for refinement

• What are all the interaction patterns we need to account for?
• Do we need a new category of tokens for these interactive relationships?
• How should these highlighting patterns differ from standard hover/focus states?

✅ Next Steps

• Collect more examples from across the product
• Consider relationship to existing token structure

Solution

Documented in !4478 (merged)