refactor: ui experience adjusts and shadcn aligns #9
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Thanks for the great component, saved me a lot of time!
While testing the component in a more complex form context I saw somethings that could be improved.
I see that some changes may be too personal, so I will discribe them here so you can decide better what really matters to you:
Fixed selectables filtering. It is currently comparing objects, it works for static objects like in the component example, but when using states the object comparison gets buggy.
Adjusted the Input minimun height to match shadcn Input component
Add maximun height + overflow to selected options box. So that with large lists of selected options it has a better presentation
Moved the selectables box all inside ternary and changed margin top by translate (just like shadcn does for the Select component). In the current way, with margin top it produces align errors, look:
Moved the z-index property to selectables parent box (and increased it to the same value shadcn uses in Select component). For me it was not working with z-index on the child, look:
Add maximun height to CommandGroup box, so large lists of options have a better presentation
Removed unused "value" prop in CommandItem onSelect() function
That's all. Let me know if made any stupidity.
Thanks again.