Skip to main content

FilterRule

Define a filter predicate that will return a boolean for each item. If multiple filters are active, all filters must match for an item to be returned.

filterRule({
id: string;
filterFn: (item: FItem, value: FValue, meta?: FinderMeta) => boolean;
options?: FilterOption<FValue>[] | ((items: FItem[], meta?: FinderMeta) => FilterOption<FValue>[]);
multiple?: boolean;
boolean?: boolean;
required?: boolean;
defaultValue?: FValue | FValue[];
label?: string;
hidden?: boolean;
debounceMilliseconds?: number;
})

PropDescriptionDefaultRequired
idEvery filter rule must have a unique string id.
filterFnA predicate that returns a boolean. Note that it receives the Meta mixin, which can contain instance-wide arbitrary data.
optionsEither an array of form options [{label: 'Thing', value: 'thing'}], or an option generator function that returns options. (items, meta) => [{label: 'Thing', value: 'thing'}].
multipleIf this filter has a single value or an array of values.false
requiredWhether this filter must always have a value. If the rule provides options, the first option will be selected by default.false
booleanIf this filter has a true/false value. Useful for checkboxes!false
defaultValueIf the filter has a preset value.
labelOptional label for your client to display.
hiddenOptional display value for your client to display.false
debounceMillisecondsIf you want to debounce value changes, enter a time in milliseconds.
tip

Don't know the exact option list in advance? Option generator functions are extremely useful!

filterRule({
...
options: (items) => {
const allCategories = items.map((item) => item.category);
const uniqueCategories = new Set(allCategories);
return uniqueCategories.map((category) => {
return {
label: capitalize(category),
value: category
}
})
}
}

If a rule uses an option generator function, Finder will hydrate the rule with a stable options array before emitting it to the client. Options will be recalculated whenever items or context are changed.