Web Components · Cart & Checkout
<mmm-cart-slider>
Slide-out cart drawer with line-items, upsells, and checkout entry.
What it is
The right-side cart drawer triggered bycart:open. Renders line-items, totals, an optional upsell row, and a checkout button.
When to use
- Every storefront — global cart surface
- Quick-edit cart from any page
- Upsell surface (add-on suggestions)
Attributes
AttributeTypeDefaultDescription
data-sidestringrightleft or right.data-upsellbooleantrueShow the upsell row when applicable.idstring—Unique element identifier.classstring—Custom CSS class list.hiddenbooleanfalseHide the element without removing it from the DOM.Examples
Default
Renders globally — opens on cart events.
<mmm-cart-slider></mmm-cart-slider>Left-side drawer
Slides in from the left.
<mmm-cart-slider data-side="left"></mmm-cart-slider>