petal_components
petal_components copied to clipboard
REQUEST: Search Multi select
Apologies if this is the wrong place to ask.
Petal components is awesome and very comprehensive. One missing bit for me is the absence of a field input for "live" search and (optionally) multi-select. This is extremely useful for cases with more options than can be managed with checkboxes.
Would this be a welcome addition? I have a specific use case for it in an upcoming personal project and will try to contribute it if I can.
Thanks!
P.S. In case anyone is looking this is a multi-select without search that could work for their use case, consider: https://fly.io/phoenix-files/liveview-multi-select/
Hi @Rio517, I do agree that a live search / multi-select input (something like the above) would be really handy! I know this has been proposed as an advanced component potentially, but we haven't got around to it yet and I also think it has a place in Petal Components for everyone to use, at the very least a basic version. Feel free to submit a PR if you get around to it, it would be a very valuable contribution!
Any updates on this? @Rio517
I have a simplified version working for myself. It isn't ready for production (even in my case). It will be late Feb/early march before I'm close to submitting something.
That said, I'd love some feedback. I'm curious about how to handle populating/filtering the list of matches. In my case, I'm using LiveView events and having the server populate the list, like in the https://fly.io/phoenix-files/liveview-multi-select/. I'm not sure that makes sense to build a reusable component for Petal Components. I imagine that the ideal scenario would be a more simplified AlpineJS/Phoenix.Component version without Phoenix.LiveComponent events. Ideally, this initial case would pave the path forward for users who need server-side search results.
For reference and inspiration, there is a project covering a multi select search component here: https://github.com/maxmarcon/live_select. Would be great to have this in petal_components.
Done https://petal.build/components/combo-box (pro members only)