Headless, URL-synced filter state for React
Declare your filters once as a plain object. Get a typed params object for fetching, ready-to-render filter state, and nuqs-backed URL sync — bring your own UI.
npm i @mbsatimov/use-filters nuqs| Order | Customer | Status | Amount |
|---|---|---|---|
| #3259 | SG Shafi Goldwassershafi.goldwasser@example.com | refunded | $3,163 |
| #3258 | DR Dennis Ritchiedennis.ritchie@example.com | pending | $3,026 |
| #3257 | FA Frances Allenfrances.allen@example.com | paid | $2,889 |
| #3255 | AB Anita Borganita.borg@example.com | pending | $2,615 |
| #3256 | KT Ken Thompsonken.thompson@example.com | paid | $2,752 |
| #3254 | TB Tim Berners-Leetim.berners.lee@example.com | failed | $2,478 |
| #3253 | RP Radia Perlmanradia.perlman@example.com | paid | $2,341 |
| #3252 | LT Linus Torvaldslinus.torvalds@example.com | refunded | $2,204 |
| #3251 | MH Margaret Hamiltonmargaret.hamilton@example.com | pending | $2,067 |
| #3250 | DK Donald Knuthdonald.knuth@example.com | paid | $1,930 |
1–10 of 60
Page 1 of 6
URL is the source of truth
Refreshes, back/forward, bookmarks, and shared links just work — and your query cache stays in sync for free.
Fully typed
Declare filters once; get a params object typed per config, or validated against your API type.
Zero UI, zero runtime deps
Ships the hook and types only. Render your own controls against your own design system.