Order Summary

This component provide a summary of the items in the cart, including the total price, related shipping tax, and discounts.

Use this component to provide a summary of the items in the cart, including the total price, related shipping tax, and discounts.

Import

Import the component from @faststore/ui


_10import { OrderSummary } from '@faststore/ui'

To apply the styles of this component in your FastStore project, import the following into your stylesheet:


_10@import '@faststore/ui/src/components/molecules/OrderSummary/styles.scss';

Follow the instructions in the Importing FastStore UI component styles tutorial.

Example

Code

Name	Type	Description	Default
testId	`string`	ID to find this component in testing tools (e.g.: cypress, testing-library, and jest).	`fs-order-summary`
subtotalLabel	`string`	Label for the subtotal value of the order. Will only show if subtotalValue is provided.
subtotalValue	`string`	Subtotal value of the order. If provided, subtotal label and value will be shown.
discountLabel	`string`	Label for the discount value for the order. Will only show if discountValue is provided.	`Discount`
discountValue	`string`	Discount value for the order. If provided, discount label and value will be shown.
totalLabel	`string`	Label for the total value of the order.	`Total`
totalValue	`string`	Total value of the order.

Local token	Default value/Global token linked
`--fs-order-summary-padding`	`var(--fs-spacing-3)`
`--fs-order-summary-margin-bottom`	`var(--fs-spacing-2)`

`--fs-order-summary-discount-text-color`	`var(--fs-color-success-text)`

`--fs-order-summary-total-text-size`	`var(--fs-text-size-3)`
`--fs-order-summary-total-text-font-weight`	`var(--fs-text-weight-bold)`

data-fs-order-summary

data-fs-order-summary-subtotal

data-fs-order-summary-subtotal-label

data-fs-order-summary-subtotal-value

data-fs-order-summary-discount

data-fs-order-summary-discount-label

data-fs-order-summary-discount-value

data-fs-order-summary-total

data-fs-order-summary-total-label

data-fs-order-summary-total-value