# Priority Wishlist block

> Priority-Grouped Wishlist with Stock Status and Savings Summary

Saved-items page grouping products into Must Have, Save For Later, Maybe buckets with per-item stock status, price savings, a total, and lock-on-add cart actions. ReUI Badge; shadcn Button, Empty, Item, Tooltip. Wishlist, favorites, saved items.

- Type: Pro block
- Category: [Wishlist](https://web.dev.reui.io/blocks/ecommerce/wishlist.md)
- Page: https://web.dev.reui.io/blocks/ecommerce/wishlist/wishlist-5
- MCP: `get_block("wishlist-5")`
- Built with: Badge, Button, Empty, Item, Tooltip
- Installs with a ReUI Pro or Ultimate license; setup: https://web.dev.reui.io/docs/license-setup

## Best for

Must Have, Save For Later and Maybe sections, a button that cycles an item to the next priority and a total that skips unavailable items

## Agent notes

- `WISHLIST_ITEMS` entries carry `priority` and `stock`; `WISHLIST_GROUPS` sets the section order and a group with no items is not rendered
- `handleAddToCart` only adds the id to `addedToCart`; no cart request is made
- Unavailable rows show Notify Me as a plain `Badge` with no handler, so wire your own restock alert

## When not to use

- A task queue grouped by stage into collapsible rows, with nothing to buy: use [Roadmap by Stage](https://web.dev.reui.io/blocks/data-grid/grouping/data-grid-grouping-1.md) (`get_block("data-grid-grouping-1")`)
- Several saved items to select and clear or add to cart in a single step: use [Bulk Action Wishlist](https://web.dev.reui.io/blocks/ecommerce/wishlist/wishlist-1.md) (`get_block("wishlist-1")`)

## Install

```bash
npx shadcn@latest add @reui/wishlist-5
```

## About Wishlist blocks

### When to use

- A saved items page in a shopper account, with prices, savings and add to cart on each product
- Price drop, back in stock and low stock badges that flag which saved products to buy now
- Named collections or priority groups that sort saved products by occasion, recipient or intent to buy

### When not to use

- A dashboard side panel of metrics, transactions or integrations, with nothing to buy: use the [List blocks](https://web.dev.reui.io/blocks/application/list.md)
- A lone price drop or low stock label on a product tile you already render: use [Badge](https://web.dev.reui.io/components/badge.md) (`get_component("badge")`)
- A back office table of records narrowed by field, operator and value chips: use the [Filtering blocks](https://web.dev.reui.io/blocks/data-grid/filtering.md)

### Agent notes

- Every root seeds `useState` with the demo constants in components/data.tsx and saves nothing; load and persist the list through your own wishlist API
- Every Share control is a stub, a button with no `onClick` or the no-op `handleShare`; wire it to your share link or clipboard flow
- Each page.tsx adds a `min-h-svh` wrapper and each root sets its own max width and `h1`; drop the wrapper and keep one `h1` in your storefront layout

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.
