About this block

Mini Cart Drawer renders a static open drawer panel as a right aligned card: two items with thumbnail placeholders, a progress bar showing $63 of $75 toward free shipping, and the note “A wax tin gets you there, but only if you need wax. Paying $18 to save $7 is not a saving.” Below the meter: subtotal, a primary checkout button and a ghost view cart button. The close affordance is an X icon top right. The panel is rendered open as a blueprint, not triggered by state.

Items are one array. The anti upsell note on the shipping meter is the move that earns the drawer its honesty.

When to use

Reach for this block as the slide over cart preview wired to the store navbar cart icon. The free shipping threshold and the product named in the top up note must match the store configuration or the arithmetic misrepresents the offer.

A natural flow around it on an Ecommerce Pro page:

Before

• Store navbar

After

• Checkout

What you can display

One strong use is the two item open drawer with the honest shipping meter. Other mini cart configurations:

• Empty state. The drawer open with no items, a short line and a link back to the store hero.
• Threshold met. The meter full, the free shipping confirmed, no further suggestion.
• Single item. One item in the drawer before the subtotal, the meter shown only if the gap is real.

Tip: the shipping top up note works because it names a specific product and runs the arithmetic out loud; a generic “add more to qualify” does the opposite.