Skip to Content

filter-bar

ui

A horizontal bar of toggleable filter chips with optional counts and a clear button.

Use cases

  • Category filtering for news articles
  • Event type filtering
  • Tag-based content filtering
  • Search result refinement

Features

  • Single or multiple selection modes
  • Optional 'All' chip
  • Clear button when filters active
  • Optional item counts
  • Controlled and uncontrolled modes

Preview

Interactive preview with light/dark mode toggle. Switch to Code tab to view the full source.

AllWeatherNewsEventsSports

Installation

npx shadcn@latest add https://registry.mukoko.com/api/v1/ui/filter-bar

Dependencies

lucide-reactbadgebutton

API

Fetch this component's metadata and source code from the registry API.

GET/api/v1/ui/filter-bar

Source

components/ui/filter-bar.tsx