Combobox
Um componente de lista suspensa com busca e navegação por teclado. Suporta tanto o modo form builder (com objetos de formulário Rails) quanto uso independente. Inclui filtragem de opções ao digitar, navegação por teclado e renderização personalizada de opções.
Pré-visualização e Código
_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
Obter Acesso Completo
Desbloqueie o código-fonte deste componente e de todos os outros. Pagamento único para acesso vitalício.
Obter Acesso Agora