Replies: 4 comments
-
I've been in your same boat, spent few hours searching and testing few implementations but in the end it never worked out properly. If I spent more time on it, maybe, I could've been able to solve all the issues and have a proper autocomplete. But I decided to move over and find something that was built just to create an autocomplete experience. Lucky me I remembered that |
Beta Was this translation helpful? Give feedback.
-
Did you ever figure this out? |
Beta Was this translation helpful? Give feedback.
-
I have the same problem, and have been trying to solve it using the const [open, setOpen] = React.useState(false);
<Command>
<CommandInput onFocus={() => {setOpen(true)}}/>
<Popover open={open} onOpenChange={setOpen}>
<PopoverTrigger>
</PopoverTrigger>
<PopoverContent>
<CommandGroup>
<CommandList>
{selection.map((value) => (
<CommandItem
key={value}
value={value}
onSelect={(currentValue) => {
setOpen(false);
}}
>
{value}
</CommandItem>
))}
</CommandList>
</CommandGroup>
</PopoverContent>
</Popover>
</Command> |
Beta Was this translation helpful? Give feedback.
-
As I stated previously #2808 (comment), I solved my issue with downshift-js but TBH it never felt that I was following the shadcn/ui approach 😅 Maybe you can have a look at this fancy multiselect. PS: also have a look at this great repo full of awesome components made from and for shadcn/ui. The repo is not mine, but I think we should spread it more because it's full of interesting components build from various developers. It's an Awesome List after all |
Beta Was this translation helpful? Give feedback.
-
I'm using the Command component. My goal is to use it as an Autocomplete component. However, I am facing an issue where the content below the Command component adjusts its position based on the dropdown of search results. Ideally, the search result dropdown should overlap the content below, similar to how it works in Google Search.
Here is the demo
Stackblitz
Thanks in advance 🙏
Beta Was this translation helpful? Give feedback.
All reactions