QuoteSummaryList Container

The QuoteSummaryList container displays quote metadata including quote ID, status, dates, buyer information, and shipping details.

Version: 1.0.0-beta1

Configuration

The QuoteSummaryList container provides the following configuration options:

Parameter	Type	Req?	Description
hideHeading	boolean	No	Controls hiding of heading
hideFooter	boolean	No	Controls hiding of footer
routeProduct	(item: NegotiableQuoteItemModel) => string	No	Callback function for route product
showMaxItems	boolean	No	Controls visibility of max items
attributesToHide	SwitchableAttributes[]	No	Configuration for attributes to hide
quoteId	string }>	Yes	Unique identifier for quote
Footer	SlotProps<{ item: NegotiableQuoteItemModel }>	No	Configuration for footer
Thumbnail	SlotProps<{ item: NegotiableQuoteItemModel	No	Configuration for thumbnail
defaultImageProps	ImageProps	Yes	Configuration for default image props
ProductAttributes	SlotProps<{ item: NegotiableQuoteItemModel }>	No	Configuration for product attributes
QuoteSummaryFooter	SlotProps<{ displayMaxItems: boolean	No	Configuration for quote summary footer
QuoteItem	SlotProps	No	Configuration for quote item
ItemTitle	SlotProps<{ item: NegotiableQuoteItemModel }>	No	Configuration for item title
ItemPrice	SlotProps<{ item: NegotiableQuoteItemModel }>	No	Configuration for item price
ItemTotal	SlotProps<{ item: NegotiableQuoteItemModel }>	No	Configuration for item total
ItemSku	SlotProps<{ item: NegotiableQuoteItemModel }>	No	Configuration for item sku
accordion	boolean	No	Configuration for accordion
variant	'primary' | 'secondary'	No	Configuration for variant
showDiscount	boolean	No	Controls visibility of discount
showSavings	boolean	No	Controls visibility of savings

Slots

This container exposes the following slots for customization:

Slot	Type	Required	Description
slots	\{ Heading?: SlotProps<\{ count: number	No	Custom slot for rendering slots

Usage

The following example demonstrates how to use the QuoteSummaryList container:

import { render as provider } from '@dropins/storefront-quote-management/render.js';
import { QuoteSummaryList } from '@dropins/storefront-quote-management/containers/QuoteSummaryList.js';

await provider.render(QuoteSummaryList, {
  quoteId: "abc-123",
  defaultImageProps: defaultImageProps,
  hideHeading: true,
  slots: {
    // Add custom slot implementations here
  }
})(block);