DataFilter

A rich interface to create data filters. Filters are represented as a set of operations on individual fields of the data records. Each operation is represented by a Chip.

Basic DataFilter

Add a filter
[]
<DataFilter options={options} value={value} onChange={setValue} />

Custom Operators

You can define your own operators.

Add a filter
[]
operators: [ { operator: 'oneOf', label: 'is one of', defaultValue: [], InputComponent: SelectInput, }, ],

Different Sizes

The DataFilter component supports different sizes through the size property.

Add a filter
Add a filter
<DataFilter {...props} size="small" /> <DataFilter {...props} size="medium" />

Introduction
Basic Usage