KB-300 · EMPTY/NO/MATCHES
No Matches Empty State
Nothing matched — said as a diagnosis rather than a shrug. Every active filter is listed with the number of rows that would come back if it alone were dropped, so the reader can see which one is doing the damage and remove exactly that one. The usual empty result leaves you to guess; this hands over the arithmetic.
Install
One command — the source lands in your repo. Or copy it from the Code tab.
$ pnpm dlx shadcn@latest add @kinetiq/empty-no-matches
Props
- art
- React.ReactNode
- default —
- Optional illustration seated above the copy; decorative.
- filters
- ActiveFilter[]
- default —
- Each active filter with what would return without it.
- onDrop / onClearAll
- (id) => void · () => void
- default —
- Removing one filter, or all of them.
| Prop | Type | Default | Description |
|---|---|---|---|
| art | React.ReactNode | — | Optional illustration seated above the copy; decorative. |
| filters | ActiveFilter[] | — | Each active filter with what would return without it. |
| onDrop / onClearAll | (id) => void · () => void | — | Removing one filter, or all of them. |