Removable Badge

[rosemaryluo]

Hi, is there any plan for badge component to support this type of filter/remove filter interaction in the future? Context: Our team currently uses it in search results for CodeExchange and we are migrating to Paste & using badge component for this

[shleewhite]

Hi @rosemaryluo!

We are currently working on releasing the Filters pattern. It currently focuses on filtering in tables, but if you are interested you could contribute this as another type of filtering.

For the pills themselves, I would actually recommend using the Form Pill Group component. They have accessibility built in, so all users can understand what the pills are, be able to navigate them efficiently with a keyboard, and remove them.

Please let me know if you have any other questions!

[shleewhite]

Checking in @rosemaryluo, do you need anything else for this?

[rosemaryluo]

Oops! Forgot to circle back here--we will be using Form Pill Group. There's no Figma component for it yet, right? I just made a note for our engineers to use the Form Pill Group component. Happy to contribute to the Filters pattern as well.

[nkrantz]

Hey @rosemaryluo! The Form Pill Group doesn't have design assets yet, but the Stage 1 designs will be published to Figma in the near future as part of the work we're doing for Multi-select Combobox.

As far as the pattern goes, we're definitely interested to see how you intend to use the pills for filtering. If you could share a Figma file or more screenshots of your design, that'd be super. If you're interested in contributing this flow to the Filter pattern, I'd recommend you join the #tmp-pattern-complex_filters channel to sync with Khushboo and Yongjie who are working on the pattern.

[rosemaryluo]

Joined the slack group, here's a screenshot:

[nkrantz]

Thanks! We're looking forward to seeing the progress of this pattern in the channel. Let us know if there's anything else you need!