Not affiliated with official shadcn/ui. Visit ui.shadcn.com for official docs.
React Field - Select with Default Value
A React select dropdown with defaultValue prop pre-selecting Active status option for account status management
Looking to implement shadcn/ui patterns?
Join our Discord community for help from other developers.
Smart defaults reduce friction—pre-select common choices saving users time and clicks. This React select uses shadcn/ui Select component with defaultValue equals active prop automatically selecting Active status option. Built with Select defaultValue and FieldDescription, forms start with sensible defaults users can accept or change—perfect for status selects, preferences with common values, edit forms with existing data, or anywhere logical defaults speed up form completion without forcing choices.
Current account status.
Pattern created by @haydenbleasel
Installation
Related patterns you will also like
Simple Select
Select without default value
Multiple Selects
Multiple selects with defaults
Horizontal Select
Horizontal select with default
Vertical Layout
Form fields with defaults
Switch Toggle
Toggle with default state
Checkbox
Checkbox with default checked
Questions you might have
React Field - Select in Horizontal Layout
A React select dropdown with horizontal field orientation placing FieldLabel beside SelectTrigger for compact Theme selection
React Field - Simple Textarea
A React form field with basic textarea for multi-line text input like messages with label association built with shadcn/ui components