Chip / Badge no longer have proper support for anchors #43369

Prerequisites

• I have searched for duplicate or closed issues
• I have validated any HTML to avoid common problems
• I have read the contributing guidelines

Describe the issue

Hey guys,

While porting my UI from Boostrap v4 to Bootstrap v6, I've noticed that we've lost support for anchors on badge, and / or the new chip elements.

The docs have no examples on how to use badges or chips with anchors.

❌ badge has no hover state when applied on an anchor (the only visual cue is the cursor hand).
❌ chip does not allow navigation / focus (?!) on an anchor element.

My understanding is that badge have turned to a decoration only element.

In my opinion, this is a mistake, there are legitimate use cases for badges where you want a supporting element to also be clickable, e.g: when used inline to describe a software version, when used under an article as anchor tags, etc.

Some of the largest CSS frameworks / libraries have this feature:

✅ Shadcn UI badge link: https://ui.shadcn.com/docs/components/base/badge#link
✅ Catalyst UI badge link (made by Tailwind's Team): https://catalyst.tailwindui.com/docs/badge#using-as-links
✅ Flowbyte UI badge link: https://flowbite.com/docs/components/badge/#badges-as-links
✅ Antdesign UI badge link: https://ant.design/components/badge#badge-demo-link
✅ Boostrap v4 badge link: https://getbootstrap.com/docs/4.6/components/badge/#links
and the list could continue...

What seems to restore the old Bootstrap v4 behavior is adding a "btn-subtle" or "btn-solid" class to the badges. I don't think this was the intended way to use for links, and if that is indeed the intended case, then perhaps a Links section to the badges components should be included as an example in the docs (I could open a PR for this if confirmed).

A real world example you can see is in my software, where Spaces are sort of a "label" (similar with those on macOS for example), and have different colors to be easily recognisable, and are clickable in order to be filtered by (this could also have been a tags section of a blog post, or whatever other use cases there may be).

I've included a reduced test case where you can see all three variants (chip, badge, badge + btn-variant).

Reduced test cases

https://codepen.io/editor/pricop/pen/01a1d522-237f-78bc-b600-898ac6d3d977

What version of Bootstrap are you using?

v6