feat(ChatButton): add,utilize chat button tokens for quick action button

[tw15egan]

Closes #15920

Adds in 6 new ChatButton specific tokens, and styles to apply these tokens

Note: these will only style the isQuickAction variant. Normal button tokens can be used to style the different kinds of ChatButton.

Changelog

New

• New Tokens:
  • $chat-button
  • $chat-button-hover
  • $chat-button-text-hover
  • $chat-button-selected
  • $chat-button-active
  • $chat-button-text-selected
• Styles to ensure these tokens are applied correctly

Changed

• Replaced generic tokens with ChatButton specific tokens

Testing / Reviewing

To test, replace the normal styles import in ./storybook/styles.scss with the following:

@use '../index.scss' as styles with (
  $theme: (
    chat-button: crimson,
    chat-button-hover: coral,
    chat-button-text-hover: rebeccapurple,
    chat-button-active: chartreuse,
    chat-button-selected: darkorange,
    chat-button-text-selected: limegreen,
  )
);

:root {
  @include styles.theme();
}

and ensure that only the quick action ChatButton variant has its token values changed. Ensure all states are styled properly

[netlify]

✅ Deploy Preview for v11-carbon-react ready!

Name	Link
🔨 Latest commit	e61a733
🔍 Latest deploy log	https://app.netlify.com/sites/v11-carbon-react/deploys/65eb80adb38cf20008d3dce3
😎 Deploy Preview	https://deploy-preview-15923--v11-carbon-react.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[aagonzales]

On the selected ones, the text shouldn't change color on hover (top one). It should stay "$chat-button-text-selected:

[tw15egan]

@aagonzales fixed 👍

[carbon-automation]

Hey there! v11.53.0 was just released that references this issue/PR.