Docs
Multi Select
Multi Select
Displays a list of options for the user to pick from—triggered by a button.
Select stack
Installation
npx nyxbui@latest add multi-selectUsage
import {
MultiSelect,
MultiSelectContent,
MultiSelectItem,
MultiSelectList,
MultiSelectTrigger,
MultiSelectValue,
} from "~/components/ui/multi-select"<MultiSelect>
<MultiSelectTrigger className="w-80">
<MultiSelectValue placeholder="Select Frameworks" />
</MultiSelectTrigger>
<MultiSelectContent>
<MultiSelectList>
<MultiSelectItem value="react">React</MultiSelectItem>
<MultiSelectItem value="vue">Vue</MultiSelectItem>
<MultiSelectItem value="angular">Angular</MultiSelectItem>
<MultiSelectItem value="svelte">Svelte</MultiSelectItem>
</MultiSelectList>>
</MultiSelectContent>
</MultiSel>Examples
With Filter
Select stack
Controllable Search
search by control or load remote data
Select stack
Input Custom (tag mode)
Allow user to select from input custom tag
Select stack
Limit Count
limit max select count by maxCount
Select stack
Limit item display length
limit max display item count with maxDisplay, or limit item display length with `maxDisplayLength
Select stack