Widgets CurrentRefinements

Description

The CurrentRefinements widget displays the list of currently applied filters.

It allows the user to selectively remove them.

Props

transformItems
type: function 

Function to modify the items being displayed, e.g. for filtering or sorting them. Takes an items as parameter and expects it back in return.

Example usage

import React from 'react'; import { InstantSearch, CurrentRefinements, RefinementList } from 'react-instantsearch-dom'; const App = () => ( <InstantSearch appId="latency" apiKey="6be0576ff61c053d5f9a3225e2a90f76" indexName="instant_search" > <CurrentRefinements /> <RefinementList attribute="brand" defaultRefinement={['Colors']} /> </InstantSearch> );

CSS classes

.ais-CurrentRefinements {}

the root div of the widget

.ais-CurrentRefinements--noRefinement {}

the root div of the widget when there is no refinement

.ais-CurrentRefinements-list {}

the list of all refined items

.ais-CurrentRefinements-list--noRefinement {}

the list of all refined items when there is no refinement

.ais-CurrentRefinements-item {}

the refined list item

.ais-CurrentRefinements-button {}

the button of each refined list item

.ais-CurrentRefinements-label {}

the refined list label

.ais-CurrentRefinements-category {}

the category of each item

.ais-CurrentRefinements-categoryLabel {}

the label of each catgory

.ais-CurrentRefinements-delete {}

the delete button of each label

Translation keys

clearFilter

the remove filter button label