Glide dropdown — examples

1. Single select (native <select> upgrade)

value: null

2. Multi select with tags + clear button + fuzzy search

value: []

2b. Multi select as checkboxes (checkboxSelection())

Same tag-based multi-select, just with checkbox indicators instead of relying on row highlight alone — no groups needed.

3. Groups (optgroups) with checkboxes + group-select

4. Creatable tags

Type text that doesn't match anything, then press Enter to create it.

4b. Search disabled (searchable: false)

No search box — click to browse, or start typing a letter to jump to a match (native-<select>-style typeahead).

5a. Custom rendering — badges, safe against XSS by default

The third entry's label is a literal <img onerror=...> string — it renders as inert text, not markup.

5b. Custom rendering — profile selector with avatars

Avatars are generated inline (SVG data URIs) so this demo has no network dependency — swap in real image URLs the same way.

6. Async loading + infinite scroll + error handling

Type "fail" to simulate a rejected request and see the error event. Debounced 350ms, pages of 40, loads more near the bottom.

7. Virtual scrolling stress test — 20,000 options

8. Width constraint (className / --glide-max-width)

9. API & events playground

Event log


    

    

      
getState() / getValue()

      

    

  


  
Presentation modes & themes

  
One selection engine, five presentations. These examples use light, dark, and variable-only custom themes.

  

    

      
Chips · Light

      
Direct, always-visible choices: click once to select and again to deselect.

      
    

    

      
Single-select chips · Light

      
Only one chip is selected at a time; click the selected chip again to clear it.

      
    

    

      
Always open · Dark

      
Uses the built-in dark theme and hides selected chips for a cleaner persistent checkbox list.

      
    

    

      
Accordion · Ocean

      
Uses a custom CSS-variable Ocean theme. The panel stays open after a selection.

      
    

    

      
Popup grid · Sunset

      
Uses a custom CSS-variable Sunset theme for a wide, anchored filter panel.