Wishlist 5 block design & features
A shadcn/ui wishlist laid out in two columns, with a list of saved products on the left and a compact bag summary on the right. Each saved row has a square product photo, the brand, product name and variant, the current price with a note when it has dropped since the item was saved, a remove button and a Move to bag button.
Moving an item collapses its row smoothly out of the list while the same product slides into the bag summary and the item count and subtotal update. A muted notice opens above the list naming the item that moved, with an Undo button that puts it back in place. The styling is flat and light, with hairline dividers, one bordered summary panel and height animations that are switched off for reduced motion.
The block feels practical and retail focused, closer to a real account page than a showcase. It needs a handful of product photos with names, variants and prices, and the saved list, bag contents and currency are all props. Below large screens the bag summary stacks under the list.