# Department Facet Filter block

> Faceted ecommerce filter sidebar with department pills, price slider, and removable filter chips

Filter sidebar with department pills, category/material/brand facets, price slider, color swatches, size buttons, star rating, removable chips, and stock/sale toggles. shadcn Checkbox, Slider, Switch; ReUI Rating. For catalog and search results.

- Type: Pro block
- Category: [Filter Sidebar](https://web.dev.reui.io/blocks/ecommerce/filter-sidebar.md)
- Page: https://web.dev.reui.io/blocks/ecommerce/filter-sidebar/filter-sidebar-3
- MCP: `get_block("filter-sidebar-3")`
- Built with: Button, Card, Checkbox, Label, Radio Group, Rating, Separator, Slider, Switch
- Installs with a ReUI Pro or Ultimate license; setup: https://web.dev.reui.io/docs/license-setup

## Best for

Department pills, material checkboxes, star rating radios and stock and sale switches, all 9 sections open in a plain Card

## Agent notes

- Sample data is `DEPARTMENTS`, `CATEGORIES`, `MATERIALS`, `BRANDS`, `COLORS`, `SIZES` and `RATINGS`, with fixed facet `count` numbers
- `inStockOnly` starts true yet has no removable chip, so only its Switch or `handleClearAll` turns it off
- The Apply filters `Button` has no `onClick`; `department`, `rating`, `inStockOnly` and `onSaleOnly` change nothing outside the sidebar

## When not to use

- A documentation or settings navigation list of links with sub-menus: use [Sidebar](https://web.dev.reui.io/components/sidebar.md) (`get_component("sidebar")`)

## Install

```bash
npx shadcn@latest add @reui/filter-sidebar-3
```

## About Filter Sidebar blocks

### When to use

- A shop listing facet panel: category and brand counts, a price range, color swatches and size buttons
- Apparel catalogs narrowed further by department, material, star rating, stock or sale status
- Long facet lists folded into accordion sections, or moved into a side Sheet behind a Filters button

### When not to use

- A navigation sidebar of page links and a user menu around every screen of a product: use the [App Shell blocks](https://web.dev.reui.io/blocks/application/app-shell.md)
- A chip row of field, operator and value rules over results you already render: use [Filters](https://web.dev.reui.io/components/filters.md) (`get_component("filters")`)
- A back office records table that staff narrow by column, status or search: use the [Filtering blocks](https://web.dev.reui.io/blocks/data-grid/filtering.md)

### Agent notes

- Replace `CATEGORIES`, `BRANDS`, `COLORS`, `SIZES` and `PRICE_MAX` with your catalog; each facet `count` is a fixed number that never recounts
- `FilterSidebar` takes no props and the Apply filters `Button` has no `onClick`; lift its `useState` facets out to query your products
- Each block opens with demo picks such as `outerwear`, `northline`, `black` and a 40 to 180 `priceRange` already set; start them empty

Every ReUI item has a twin like this one; the index is https://web.dev.reui.io/llms.txt. Agents with the ReUI MCP (https://web.dev.reui.io/docs/mcp) get the same guidance from the getters named above.