FilterBar
A search box + a "+ Filter" menu that adds active filter fields one at a time, each rendering as its own Select/Combobox — the search-and-filter piece of the Tables UI pattern (composed from Input, DropdownMenu, Select, Combobox, and Button), not a standalone atom.
<template>
<FilterBar v-model="activeFilters" v-model:search="search" :fields="filterFields" />
</template>Props
| Name | Type | Default |
|---|---|---|
| fields | FilterFieldDef[] | — |
| searchPlaceholder | string | — |
| modelValue | Record<string, string[]> | {} |
| search | string | "" |
Slots
| Name | Description |
|---|---|
| trailing | Right-aligned content next to the search/filter row — e.g. a result count. |