Shadcn.io is not affiliated with official shadcn/ui
Clear/Reset Button
A React combobox with clear button using X icon enabling one-click selection reset with stopPropagation preventing trigger toggle on clear with shadcn/ui
Mistakes happen—provide undo. This React combobox features clear button with X icon from Lucide React enabling selection reset using stopPropagation preventing popover toggle when clearing. Built with shadcn/ui Command and Popover showing X button only when value exists with hover states and preventDefault ensuring clean interaction. The clear pattern provides explicit reset action—perfect for filters, optional fields, theme selectors, preference settings, or anywhere selections should be easily reversible without reopening combobox or remembering default values reducing user frustration through obvious reset mechanism.
Clear/Reset Button preview
Installation
Related Components
With Footer Actions
Management actions in combobox footer
Standard Combobox
Basic combobox without clear button
Create New Option Inline
Dynamic item creation
Multi-select Combobox
Multiple selection combobox
With Quick Filters
Badge-based filtering
Outline Button
Button variants
FAQ
Was this page helpful?
Sign in to leave feedback.
Keyboard Shortcuts Displayed
A React combobox displaying keyboard shortcuts using kbd element with monospace font and muted styling showing command hotkeys alongside labels with shadcn/ui
Multiple Groups with Labels
A React combobox with multiple CommandGroup sections using heading labels to organize items by category like Frontend and Backend technologies with shadcn/ui