10up / block-components

A collection of components built to be used in the block editor
https://www.npmjs.com/package/@10up/block-components
265 stars 39 forks source link

Add: `TermPicker` Component #81

Closed fabiankaegy closed 3 months ago

fabiankaegy commented 2 years ago

A common pattern that I'm coming across again and again is that we need to override the core UI for a term picker. By default core allows you to choose multiple categories / tags and that is the same for custom post types. However there are many cases where we need to be able to add a term which should be displayed in a radio control so you can only select one item.

This currently is rather cumbersome and not very straightforward. I'd love for us to come up with a nicer developer experience that leads to a better UX across all projects.

xavortm commented 2 years ago

I was browsing for some solutions and found this -https://github.com/WordPress/gutenberg/blob/trunk/packages/editor/src/components/post-taxonomies/hierarchical-term-selector.js which we can technically copy-paste, add a filter on top, and replace the checkboxes to the radio.

I saw this existing project that does that but with an old codebase: https://github.com/5ally/my-term-selector

Is this close to the idea here?

fabiankaegy commented 2 years ago

@xavortm yes that is exactly what I was thinking. We want the same functionality as the core hierarchical-term-selector just as radio controls

xavortm commented 2 years ago

Awesome ^^ I will look into this ticket then 👍 Assigning to myself for now and if there is no update I will comment again here

xavortm commented 2 years ago

Maybe that took more than expected but I got to it in the end :D I have opened a draft PR where I am working on a proof of concept that we can tweak later (mainly on how to render visually child categories).