Components
Loading preview...
A filter bar component that displays active filters as removable chips with a clear-all option. Ideal for e-commerce, dashboards, and search interfaces, it helps users easily manage and refine their selections.
@nextjsshop
npx shadcn@latest add https://21st.dev/r/nextjsshop/filter-chips-breadcrumbimport { Breadcrumb } from "@/components/ui/filter-chips-breadcrumb";
export default function DemoOne() {
return <Breadcrumb
filters={[
{ id: "category", name: "Category", value: "Electronics" },
{ id: "price", name: "Price", value: "$100-$200" },
{ id: "color", name: "Color", value: "Black" },
]}
/>;
}