Slide-Over Cart Drawer
A basket panel with the dialog mechanics usually missing: focus trap, focus return, Escape to close and a background scroll lock.
All blocksCommerce
Cart & Checkout
9 blocks in this category, each rendered live below. Open any of them for the full source and a copy button.
A block is one finished section of a page — a pricing table, a hero, a footer.
Editable Cart Lines
Quantity steppers and remove-with-undo, with every total derived rather than stored so the basket can never disagree with itself.
Checkout Address & Payment
The full autocomplete token set that lets a browser fill eight fields in one tap, plus address labels that follow the selected country.
Order Summary With Promo
Subtotal, discount, delivery and tax all derived from the lines, with the free-delivery nudge driven by the same threshold as the charge.
Express Payment Row
The wallet buttons above the form, and what they do to it: the address a wallet returns is shown and stays editable, and the row disappears entirely when no wallet is actually available.
Gift Options Form
The gifting step, placed in the cart where it is a choice rather than at checkout where it is friction.
Gift Card Purchase
The only checkout where the buyer is not the recipient - live preview, a send date with a stated timezone, and the confirm-the-address field that prevents the expensive typo.
Guest Checkout
Guest as the default and the whole form, with a real autocomplete token on every field and the account offer moved to the end, where it costs one checkbox.
Discount Offer Modal
The offer popup with four rules applied: triggered by intent, a decline button of equal weight, a dismissal that is remembered, and the terms on its face.