shadcn.io is not affiliated with official shadcn/ui
Combobox examples · Standard
With Default Selected Value Combobox for React
A combobox that starts with English already selected.
Framework
UI library
A language picker that opens on a value. English is selected from the first render, so the button shows it and the list marks it. Use it for settings with a sensible default, or to show a value that was saved earlier.
Preview
Installation
Sign in to get your install command
Free with an account. It carries your token, so the CLI installs everything in one go.
FAQ
Can it be changed afterwards?
Yes. The default is only the starting point. Picking another language replaces it.
Which languages are in the list?
English, Spanish, French, German and Italian. The search box says Search language..., and No language found. shows when nothing matches.
How is English marked when the list opens?
ComboboxItem shows its check on the selected row, so English has it until another language is picked.
Related
- Simple Single Select ComboboxA single-select combobox that opens from
- Disabled State ComboboxA disabled combobox that shows its
- With Item Count in Trigger ComboboxA multi-select combobox that sums up the
- Multiple Groups with Labels ComboboxA combobox with Frontend and Backend
- With Item Icons ComboboxA combobox with an icon beside each
- Full Width Variant ComboboxA combobox whose button and list stretch