# Shadcn Shopping Cart blocks

> Shopping cart interfaces with item lists, quantity controls, and order summaries.

- Type: Pro blocks (eCommerce)
- Page: https://web.dev.reui.io/blocks/ecommerce/shopping-cart
- Blocks: 7
- Installs with a ReUI Pro or Ultimate license; setup: https://web.dev.reui.io/docs/license-setup

## When to use

- A cart page where shoppers change quantities, remove lines and see the totals before paying
- A mini cart that drops from a header Cart button or slides in from the side after an add

## When not to use

- Rows of funds, coins, transactions or integrations, with no quantities or order total: use the [List blocks](https://web.dev.reui.io/blocks/application/list.md)
- A side panel over an app page for a record, a form or an assistant, with no prices: use the [Sheet blocks](https://web.dev.reui.io/blocks/application/sheet.md)
- Taking contact, shipping address and card details to place and pay for the order: use the [Checkout blocks](https://web.dev.reui.io/blocks/ecommerce/checkout.md)

## Agent notes

- Lines live in local `useState` seeded from `CART_ITEMS` or `CART_LINES` in data.tsx; read them from your cart store and write each quantity change back
- The empty state's Restore Sample Cart button reloads the demo lines through `handleRestoreCart` or `handleRestore`; point it at your catalog
- Each priced file declares its own `formatCurrency` fixed to en-US and USD; change every copy to show another currency or locale

## Third-party libraries

- Base UI v1: [API reference](https://base-ui.com/react/components), [docs](https://base-ui.com/react/overview/quick-start), [llms.txt](https://base-ui.com/llms.txt), used by 1 of 7 blocks

## Blocks

- [Save-for-Later Cart](https://web.dev.reui.io/blocks/ecommerce/shopping-cart/shopping-cart-1.md): Shopping Cart Review With Item List, Free-Shipping Progress, Promo Code, and Order Summary Sidebar. Best for save for later with a saved count, stock and arrival on each line, and payment marks under the checkout button.
- [Delivery Summary Cart](https://web.dev.reui.io/blocks/ecommerce/shopping-cart/shopping-cart-2.md): Two-Column Shopping Cart Page with Sticky Order Summary Frame and Coupon Field. Best for a summary that recaps each line by quantity, names the courier and ship-to address, and prints the total on the checkout button.
- [Data Table Cart](https://web.dev.reui.io/blocks/ecommerce/shopping-cart/shopping-cart-3.md): Data Table Shopping Cart with Column Header Rail, Quantity Steppers, and Order Summary. Best for separate unit Price and Total Price columns under a header row, with the totals block right aligned below the table.
- [Pickup Option Cart](https://web.dev.reui.io/blocks/ecommerce/shopping-cart/shopping-cart-4.md): Full-Page Shopping Cart with Per-Item Delivery or Pickup Toggle and Sticky Order Summary. Best for a delivery or store pickup switch on every line, rolled up into ready-by counts in the header and split fee rows in the summary.
- [Payment Method Cart](https://web.dev.reui.io/blocks/ecommerce/shopping-cart/shopping-cart-5.md): Two-column shopping cart with order summary, coupon field, and payment method tiles. Best for a 4 logo tile payment method choice with a caption for the chosen one, ending a rail of coupon and summary cards.
- [Cart Dropdown](https://web.dev.reui.io/blocks/ecommerce/shopping-cart/shopping-cart-6.md): Quick Cart Dropdown Menu with Per-Row Quantity Steppers and Live Subtotal. Best for a dropdown anchored under a Cart count button, its compact lines in a height capped scroll area above a subtotal footer.
- [Add-to-Cart Drawer](https://web.dev.reui.io/blocks/ecommerce/shopping-cart/shopping-cart-7.md): Mini Cart Slide-Out Sheet Drawer with Just Added Confirmation and Free Shipping Progress. Best for the first line pinned in a success tinted card with a time stamp above an Also In Your Cart group, for confirming an add.

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.