# Multi-Open Filters block

> Ecommerce Filter Sidebar with Removable Chips and Accordion Facets

Ecommerce filter sidebar with removable active-filter chips, multi-open Accordion facets, per-section count Badges, price Slider, color swatches, and size options. ReUI Frame, Badge, Rating; shadcn Accordion, Slider, Switch. Shopping catalog refine.

- 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-7
- MCP: `get_block("filter-sidebar-7")`
- Built with: Accordion, Badge, Button, Checkbox, Frame, 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

Foldable facet groups in a muted Frame tray, Category and Price open first, a secondary Badge counting picks on any group

## Agent notes

- `SectionCount` renders a `Badge` that hides at 0, and `quickFiltersCount` adds `inStockOnly` and `onSaleOnly` into a single one
- Sections open on load come from `defaultValue` on the `Accordion`, which also takes `multiple` so several stay open
- Nothing happens on Apply filters, as its `Button` has no `onClick`; connect `categories`, `brands` and `priceRange` to your query

## When not to use

- Facet groups that must all stay visible with no folding: use [Full Facet Panel](https://web.dev.reui.io/blocks/ecommerce/filter-sidebar/filter-sidebar-4.md) (`get_block("filter-sidebar-4")`)

## Install

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

## 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.