Search Faceted Sidebar
Multi-faceted filtering side panel for a product catalog with counts by category, brands, price ranges and ratings.
About this block
What it's for
- Multi-faceted filtering side panel for a product catalog with counts by category, brands, price ranges and ratings.
- Document search sidebar with filters by file type, author, topic tags and modification dates.
- Search navigation in a travel marketplace filtering by destinations, price range, amenities and reviews.
Includes
- Facet counts
- Multi select
- Clear all
- Clear facet
- Facet search
- Range slider filter
- Collapsible facet groups
- Active filter badges
Works with
- Radix UI primitives (the registry variant it ships in)
- React 19, Next.js App Router and Tailwind CSS 4, installed with the shadcn CLI
- Your theme tokens, in light and dark mode
Install
Included with Agentic UI Kit (one-time license). Install needs your license key: see pricing · connect your project.
Agentic UI CLI
agentic-ui add search-faceted-sidebarInstalls through shadcn and adapts the component to your design tokens.
shadcn CLI
npx shadcn@4.17.0 add @agentic-ui/search-faceted-sidebarUsed in
A standalone component: drop it into any screen.
- Type
- Block
- Variants
- Radix UI
- Themes
- Light and dark
- Widths
- Preview it at desktop, tablet and mobile widths above.
- npm packages
lucide-react- Registry dependencies
lib-primitives- Files
3 files
- components/agentic-ui/search-faceted-sidebar/search-faceted-sidebar.tsx
- components/agentic-ui/search-faceted-sidebar/filter-state.ts
- components/agentic-ui/search-faceted-sidebar/types.ts
Related components
Search Autocomplete
Global search in a SaaS with suggestions grouped by dashboards, documents, people and commands.
Details and live previewSearch Recently Viewed
«recently viewed» panel on a SaaS home to return to opened documents, dashboards or people.
Details and live previewSearch Results Highlight
Results list of a documentation search engine with the term highlighted in title, summary and body snippet.
Details and live previewSearch Saved Views
Saved views bar in an issue or project tracker to switch between active tasks and backlog.
Details and live preview