Patterns · Data

FilterBar

@nexub/patterns

Search + filter toolbar pattern for data-heavy list or table views.

Import

import { FilterBar } from '@nexub/patterns';

Prop	Type	Default	Required	Description
searchPlaceholder	string	'Search…'	—	Placeholder text for the search input.
searchValue	string	—	—	Controlled search value.
onSearch	(value: string) => void	—	—	Callback when search value changes.
filters	React.ReactNode	—	—	Filter controls rendered to the right of search.
actions	React.ReactNode	—	—	Action buttons (e.g. "Export") rendered on the far right.