Components
FilterChips
Renders active filters as removable chips with an optional clear-all button.
FilterChips displays the currently applied filters as a row of removable
chips, each calling its own onRemove when dismissed, plus an optional
"Clear all" button when you pass onClearAll. It renders nothing when there are
no active chips. Feed it the chips array from a useFilters store (this is
what FilterBar shows above the add-filter control).
Example
Preview
Status: liveStatus: draft
import { FilterChips, useFilters } from '@officina/ui';
function ActiveFilters() {
const filters = useFilters({ mode: 'client', fields });
return <FilterChips chips={filters.chips} onClearAll={filters.clear} />;
}API
| Prop | Type | Default | Description |
|---|---|---|---|
| chips* | FilterChip[] | — | Active filter chips to display, each removable. |
| clearAllLabel | string | Clear all | Label for the clear-all control. |
| onClearAll | () => void | — | Called when the user clears all chips at once. |