See it all in action

Live demo shop with every component working together

FilterSidebar

Filter panel with collapsible sections

npx shadcn@latest add https://registry.rifan.xyz/r/filter-sidebar.json

Props

PropTypeDefaultDescription
sections*FilterSection[]Filter sections
selectedFilters*objectSelected filters
onFilterChange*FunctionFilter change handler

Filters

Usage

import { FilterSidebar } from '@revannasser/ecommerce-ui'

// Filter panel with collapsible sections
<FilterSidebar
  sections={...}
  selectedFilters={...}
  onFilterChange={...}
/>