Extra badge variant

[jtalen]

Provide a general summary of the feature here

A badge is really handy for communicating status or counts. There are a few variants but we are missing a neutral (white variant).

🤔 Expected Behavior?

In our case we are using the badge in tree list. Per item we are showing the amount of items that are in this collection. This shouldn't get extra attention. But when a tree list item is selected or is in a hover state the background of the badge gives the proper contrast.

😯 Current Behavior

If we had used the primary subtle variant this would have pretty much the same color as the active or hover state of the tree list item. So contrast would be bit of an issue there

💁 Possible Solution

Provide an inverted or neutral variant of the badge

🔦 Context

See screenshots. This pattern is being used in several functionalities now

💻 Examples

No response

👤 Your name

Jeremy Talen

🧢 Your Product/Team

Magister

Tasks

Beta Give feedback

No tasks being tracked yet.

[DanielleRameau]

@jtalen we don't think it should be part of the badge component itself but can (maybe) an option in the tree view component once we start building it. I'll add this issue to the tree view component (#1100 )

[jtalen]

We are using those numbers also in other list components

So maybe we can re-use that new specific part as a sub-component or something