Component: Cart Summary

Available from: Release 106

Purpose: Display a summary of charges based on what's in the basket, including subtotal, total, and tax and discounts when applicable.

The Cart Summary component is often used with the Cart Items component to show a cohesive basket view. These components can be used on a standalone cart page, or along with the Modular Checkout in place of the Single Product Basket.

The Tax and Promo code line items are only visible in certain situations. 

Promo codes

When a whole-basket promo code is applied, the promo code line will appear with the total promo code discount. 

When a specific offer or add-on promo code is applied, the promo code line will not appear. Instead, a label will be displayed next to subtotal to show the amount the customer saved.

More information on promo codes can be found here: How to configure Promo Codes v2 

Tax

The tax line item behaves differently in different situations. 

No billing country set yet

This case could happen if you are using the Cart Summary component on a standalone Cart page.

The tax line item only displays if the lmo_country cookie is the same as one of the countries set in Setting > Localisation > "Preview tax on the order during checkout if your customer is in one of the countries below". 

The tax line label is driven by the "Label for tax amount when applicable" prop below. 

If the tax can be calculated with just the country field, the tax amount will be displayed. If not, for example if state or province is required, then the amount will not be displayed and text will be displayed based on the prop "Message to display when tax is not calculated yet". The Total field will also be appended by text set from the "Message on total when tax is not calculated yet". 

Billing country set

This case could happen if you are using the Cart Summary component on a Checkout page. 

The tax line item will only display if the country selected in the Address Fields subcomponent or Country subcomponent is the same as a country set in Settings > Localisation > "Preview tax on the order during checkout if your customer is in one of the countries below". 

The tax line label is driven by the "Label for tax amount when applicable" prop below. 

If the tax line is visible, the amount will be calculated once the postal code field in the Address Fields subcomponent or the Postal Code subcomponent is populated. 

If the tax cannot be calculated yet, text will be displayed based on the prop "Message to display when tax is not calculated yet". The Total field will also be appended by text set from the "Message on total when tax is not calculated yet". 

Read more about tax settings here: How to configure tax behaviour

Props

Prop Label	Type	Default Value	Notes
Label for the subtotal row	string	Subtotal
Label for the promo code discount when applicable	string	Promo code	See Promo code section above.
Label for tax amount when applicable	string	Tax	See Tax section above.
Message to display when tax is not calculated yet	string	Will be calculated on the next step	See Tax section above.
Label for the total row	string	Total
Message on total when tax is not calculated yet	string	+ tax	See Tax section above.