Search & discovery
Faceted product lists: filters, sorting, results.
| Element | What it does | Requires |
|---|---|---|
filter-checkbox | Multi-choice facet: one checkbox label per facet value. | Search & discovery extension |
filter-dropdown | Single-choice facet in a popover; the trigger shows the current value, a pick closes it: the same as filter-popover, the preferred form. | Search & discovery extension |
filter-list | Single-choice facet: one radio label per facet value. | Search & discovery extension |
filter-popover | Single-choice facet in a popover; the trigger shows the current value, a pick closes it. | Search & discovery extension |
filter-price | Price range facet with two number inputs, two range handles and a progress bar. The handles move by whole units: with a bound in cents (Shopify’s {“price”:{“min”:0,“max”:179.99}}) they run from 0 to 180, a handle at its end means the facet’s own bound (the search keeps the 179.99 products when only the other handle moves) and the number inputs and labels show 179.99; a typed number never narrows the range. The host’s hide-empty and hide-if-single leave it shown: Shopify gives the price range as one value with count 0 (2.0; 1.x hid it with either). | Search & discovery extension |
filter-search | Free-text query of the block; typing or submitting sets the search query, also in a collection (data-collection). | Search & discovery extension |
filter-select | Single-choice facet in a native select; the first option is the placeholder. | Search & discovery extension |
filter-swatches | Facet as swatch buttons painted from the value’s native swatch; a click toggles the value. | Search & discovery extension |
smootify-search-discovery | Faceted product list: runs the search, renders the cards, active chips, count and pagination, and hosts the filter and sort widgets. | Search & discovery extension |
sort-dropdown | Sort options in a popover; the trigger shows the current sort (the site’s text until the visitor sorts), a pick closes it: the same as sort-popover, the preferred form. | Search & discovery extension |
sort-popover | Sort options in a popover; the trigger shows the current sort (the site’s text until the visitor sorts), a pick closes it. | Search & discovery extension |
sort-radio | Sort options as one radio label each. | Search & discovery extension |
sort-select | Sort options in a native select; the first option is the placeholder. | Search & discovery extension |