Split control tokens (Chips, input labels, textTabBar)

[yceballost]

Create new two tokens:

• TextBrand
• TextActivated

---

• textActivated will replace → textAppBarSelected (Icon is controlActivated, text is textActivated)
• textActivated will replace usage of controlActivated in input labels and chip label
• textBrand new token to use in Avatar elements (w/ initials)
• textBrand new token to use in StackingGroup elements (+2)

Tasks

• Update inputs specs
• Update chip specs
• Update avatar specs
• Update stepper specs
• Create tokens
• Update brand libraries
  • Movistar
  • Blau
  • Telefonica
  • O2
  • O2 New
  • Vivo
  • Vivo New
  • Tu
• iOS ticket
• Android ticket
• Web ticket

Discussed in #1695

^{Originally posted by HectorSancho March 8, 2024}

Goal

Detach the control and activated control tokens and create two new tokens to better control the style in components such as chips and text fields.

Tokens proposal:

• textActivated
• borderActivated

Context

In the current definition we do not have much control over the color of these tokens, as they have dependencies with other components. It especially impacts on dark modes

Impact

Improve color definition in dark modes and be able to detach color styles from chips and other components of control tokens

Discussion Questions

is it necessary?

Additional considerations

No response

Do you have a visual proposal?

No response

[aweell]

In inputs I also changed the definition of the label text when the field has error to textError and the helperText when is over inverse to textErrorInverse

Update: Telefonica/mistica-web#1125