filters UiFilter[] [] Name filters Description The filters to offer; type boolean rating color range
Type UiFilter[] Default [] activeFilters Record < string , unknown > {} Name activeFilters Description Applied values by filter key for switch, rating and range filters; list options carry selected
Type Record < string , unknown > Default {} sortOptions UiSort[] [] Name sortOptions Description The sort orders in the sort select.
Type UiSort[] Default [] activeSorting string 'default' Name activeSorting Description The value
Type string Default 'default' totalResults number 0 Name totalResults Description Number of products matching the filters; the load-more button shows while fewer are loaded.
Type number Default 0 title string '' Name title Description Shown as the page heading.
Type string Default '' description string '' Name description Description Shown under the page heading.
Type string Default '' products Product[] [] Name products Description The products loaded so far, shown as cards.
Type Product[] Default [] currency string 'EUR' Name currency Description ISO 4217 code the price filter shows its range in.
Type string Default 'EUR' locale string — Name locale Description BCP 47 locale the prices are formatted in; the ConfigProvider's when left out.
Type string Default — resultsLabel ( ( count : number ) => string ) ` ${ count } ${ count === 1 ? 'result' : 'results' } ` Name resultsLabel Description Builds the results count above the grid from totalResults
Type ( count : number ) : string Default ` ${ count } ${ count === 1 ? 'result' : 'results' } ` filtersLabel string 'Filters' Name filtersLabel Description Shown on the button that opens the filter sheet on small screens, and as the sidebar's screen-reader heading.
Type string Default 'Filters' sheetTitle string 'Filters' Name sheetTitle Description Shown as the filter sheet's heading.
Type string Default 'Filters' sortPlaceholder string 'Sort by' Name sortPlaceholder Description Shown in the sort select while no option is selected.
Type string Default 'Sort by' resetLabel string 'Reset' Name resetLabel Description Shown on the filter sheet's buttons that clear every filter and the sorting.
Type string Default 'Reset' showResultsLabel ( ( count : number ) => string ) `Show Results ( ${ count } )` Name showResultsLabel Description Builds the label of the button that closes the filter sheet from totalResults
Type ( count : number ) : string Default `Show Results ( ${ count } )` removeLabel ( ( label : string ) => string ) `Remove ${ label } ` Name removeLabel Description Builds the screen-reader name of an active filter's remove button from the option's label.
Type ( label : string ) : string Default `Remove ${ label } ` activeFiltersLabel string 'Active filters' Name activeFiltersLabel Description Names the list of active filters for screen readers.
Type string Default 'Active filters' clearAllLabel string 'Clear all' Name clearAllLabel Description Shown on the link next to the active filters and on the empty state's button; both clear every filter.
Type string Default 'Clear all' emptyTitle string 'No products match these filters' Name emptyTitle Description Shown as the heading when no product matches the filters.
Type string Default 'No products match these filters' emptyText string 'Remove a filter or clear them all to see more.' Name emptyText Description Shown under the heading when no product matches the filters.
Type string Default 'Remove a filter or clear them all to see more.' loadMoreLabel string 'Load more' Name loadMoreLabel Description Shown on the button under the grid that loads more products.
Type string Default 'Load more' swatchColors Record < string , string > { ... DEFAULT_SWATCH_COLORS } Name swatchColors Description Swatch colour per colour-filter value, keyed lowercase.
Type Record < string , string > Default { ... DEFAULT_SWATCH_COLORS } class ClassValue — Name class Description Classes added to the part's own element, after its recipe classes.
Type null | string | false | Record < string , any > | ClassValue[] Default —