Product List 38 block design & features
A collection page with a sidebar of availability, price range, color, size and product type filters, a sticky toolbar with the product count and sort menu, removable filter tokens, a product grid and pagination.
Filters and sorting now drive the grid. Matching cards slide to their new positions with position-only layout animations, cards that no longer match fade and shrink away, and new ones fade in with a short capped stagger. The count rolls to the new total, filter tokens animate in and out, and facet counts come from the product data. Price changes are debounced so dragging the slider stays smooth. An empty state offers to clear everything.
Built with shadcn/ui Accordion, Checkbox, Slider, Select, Sheet and Pagination, with react-hook-form holding the filter state. On phones the filters open in a sheet and a toggle switches between one and two columns. With reduced motion cards crossfade in place.