LiveFilter.Components.SearchSelect (LiveFilter v0.1.0)
View SourceA search-enabled select component with single and multi-select support.
Features:
- In-dropdown search filtering
- Single or multi-select modes
- Configurable display of selected values
- Item count badges
- Clear all functionality
- Keyboard navigation
Summary
Functions
Renders a search-enabled select dropdown.
Functions
Renders a search-enabled select dropdown.
Options Format
Options should be a list of tuples: [{value, label}, ...]
or [{value, label, count}, ...]
Examples
<.search_select
id="status-filter"
options={[
{:pending, "Pending", 12},
{:in_progress, "In Progress", 8},
{:completed, "Completed", 45}
]}
selected={[:pending, :in_progress]}
on_change="update_status_filter"
/>
Attributes
id
(:string
) (required)options
(:list
) (required)selected
(:list
) - Defaults to[]
.on_change
(:any
) (required)multiple
(:boolean
) - Defaults totrue
.placeholder
(:string
) - Defaults to"Select..."
.display_count
(:integer
) - Defaults to3
.searchable
(:boolean
) - Defaults totrue
.clearable
(:boolean
) - Defaults totrue
.label
(:string
) - Defaults tonil
.icon
(:string
) - Defaults tonil
.class
(:string
) - Defaults tonil
.size
(:string
) - Defaults to"sm"
. Must be one of"sm"
,"md"
, or"lg"
.show_label_in_selection
(:boolean
) - Defaults tofalse
.clear_icon
(:string
) - Defaults to"hero-x-circle"
.plus_icon
(:string
) - Defaults to"hero-plus-circle"
.