Text filter
The TextFilter
component provides a filter text input and allows you to filter
and render a list of data based on the entered filter text.
Props
Property | Required | Type | Default | Description |
---|---|---|---|---|
data | true | array | [] | array of the data to filter. |
emptyState | false | node | Node to render when there is no results due to filtering. If not provided renderFilteredData will be called with empty data. | |
filter | true | function | (data, filterText) => data | filter function takes in the data and the current filter text, applies transformations, and returns the filtered data. |
filterPlaceholderText | false | string | 'Filter...' | Text to show where user input is accepted |
renderFilteredData | true | function | () => null | callback to render the result of filtering on the data. |
Imports
Import React components (including CSS):
import {TextFilter} from 'pivotal-ui/react/text-filter';
Import CSS only:
import 'pivotal-ui/css/text-filter';