Badge: New emphasis, themes and overflow truncation features

[LimeWub]

JIRA: https://atomlearningltd.atlassian.net/browse/DS-406 and subsequently https://atomlearningltd.atlassian.net/browse/DS-401

Description

1. Adds new variants that allow a new emphasis style: subtle (default) and bold (new)
2. Adds new theme variants that allow for non-semantic colours to the badges (new, currently the purple one)
3. Implements similar logic to ColorScheme for all colours including semantic.
4. Adds new overflow truncation features: wrap (default - better performance - breaking change potentially) and ellipsis Will need to cautiously update core due to the wrap default.
5. Additionally the component now exposes Badge.Icon and Badge.Text for more flexibility when using.

Screenshots

[mikebeat]

great job!! :)

I don't always read the code so can you guys always share with me when you create new design tokens? so that I can start documenting them and use them in Figma too, possibly reusing in other components (referring to '$backgroundBold' etc)

On the emphasis example, can you make the text say Subtle and Bold. That would be easier to read for non-devs.

[D7Torres]

Think about centralising the list of colours, but it's good to go :D
Great job

[LimeWub]

I believe I've addressed all comments which makes sense to me to address here :)