Combobox
A searchable select dropdown component with keyboard navigation. Supports both form builder mode (with Rails form objects) and standalone usage. Features include filtering options by typing, keyboard navigation, and custom option rendering.
Preview & Code
_combobox.html.erb
███
████████ █████████ █████████
█████ ████ ████ ████████
███ █████████ ██████ █████ ██ ███ ██
███ ██████ ██████████████████████ █████ ██ ██████████ █████████
██████ ██████████
████████ █
█ ██████ ███████ ████████ ██████ █████ ████████████ ██████ ████████ ██
█ ██████ █████████ ██████ █████ ████████████ ██████ ████████ ██
combobox_controller.js
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ █████████ █████████ ██████████ █████████ ██████████ ████████
██████ ██████ █ █
█████ █ █████ ████████ ████████ █████ ██
█████████ ███████
██████████████ ██████
█
combobox_component.rb
█ ██████████████████████ ████
█████ █████████████████ █ ███████████████████
███████████ ██████ ███████████ ██████ ███████ ██████ █████████████
███████████████ ██████████ ██████████ ██████
███ ███████████
█████ ████
██████████ ████
█████ ████
combobox_component.html.erb
████ █████████████ ████████ ███ █████████████████ ███ ███ ████████████████████ ████████████████ ███
██ ██ ███████████████ ██
██████ ████████ ████████ ██████████ ██████████ █████████████ ████
███ ██████ ██
██ ██ █████████ ██
█████ ███████████████████ ████████████████
██ ███ ██
████████
██ ███ ██
combobox_controller.js
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ █████████ █████████ ██████████ █████████ ██████████ ████████
██████ ██████ █ █
█████ █ █████ ████████ ████████ █████ ██
█████████ ███████
██████████████ ██████
█
Changelog
- Initial release with form builder and standalone modes
- Real-time search filtering
- Keyboard navigation (arrow keys, enter, escape)
- Support for option descriptions
- Automatic error detection from Rails form objects
- Dark mode support
Get Full Access
Unlock the source code for this component and all others. One-time payment for lifetime access.
Get Access Now