Filter
Filters represent criteria that users can choose to narrow down a Collection. They can include single or multiple selection.
Required props
label
Filter label
type
string
default
null
Optional props
value
Filter value
type
string
string[]
default
null
setValue
Callback to set the filter value
type
React.Dispatch<React.SetStateAction<string>>
React.Dispatch<React.SetStateAction<string[]>>
default
null
defaultValue
Filter default value
type
string
string[]
default
null
searchValue
Whether the filter is searchable
type
string
default
null
setSearchValue
Callback to set the filter search value
type
React.Dispatch<React.SetStateAction<string>>
default
null
defaultSearchValue
Whether the filter is searchable by default
type
string
default
null
messages
Filter messages
type
{ apply: string; clear: string; }
default
null
Related components
Tab
Tabs are used to create up to five views inside a page. Use for related content that is not comparable, when a unified view is not necessary.
Search
Search is a text input that users can type to narrow down a Collection. Use Filters if values can be classified in predefined options.
Button
Buttons with labels represent the most important actions that users frequently trigger. They can vary in prominence and can include an icon.