QuoteTemplatesListTable Container

The QuoteTemplatesListTable container displays all quote templates in a paginated table with search, filter, and action capabilities.

Version: 1.0.0

Configuration

The QuoteTemplatesListTable container provides the following configuration options:

Parameter	Type	Req?	Description
pageSize	number	No	Sets the number of items displayed per page for pagination. Controls how many quote template items appear in each page view. Use to optimize display for different screen sizes or match user preferences.
showItemRange	boolean	No	Shows item range indicator when true.
showPageSizePicker	boolean	No	Shows page size selector when true.
showPagination	boolean	No	Shows pagination controls when true.
onViewQuoteTemplate	function	No	Callback when viewing a template. Receives template ID, name, and status.
onGenerateQuoteFromTemplate	function	No	Callback when generating quote from template. Receives template and quote IDs.
onPageSizeChange	function	No	Callback when page size changes.
onPageChange	function	No	Callback when page changes.

Slots

This container exposes the following slots for customization:

Slot	Type	Required	Description
Name	SlotProps	No	Customize template name cell.
State	SlotProps	No	Customize state cell (active/inactive).
Status	SlotProps	No	Customize status cell.
ValidUntil	SlotProps	No	Customize valid until date cell.
MinQuoteTotal	SlotProps	No	Customize minimum quote total cell.
OrdersPlaced	SlotProps	No	Customize orders placed count cell.
LastOrdered	SlotProps	No	Customize last ordered date cell.
Actions	function	No	Customize actions cell (view, generate quote buttons).
EmptyTemplates	SlotProps	No	Customize empty state message when no templates exist.
ItemRange	SlotProps	No	Customize item range display (for example ‘1-10 of 50’).
PageSizePicker	function	No	Customize page size selector.
Pagination	function	No	Customize pagination controls.

Usage

The following example demonstrates how to use the QuoteTemplatesListTable container:

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

await provider.render(QuoteTemplatesListTable, {
  pageSize: 0,
  showItemRange: true,
  showPageSizePicker: true,
  slots: {
    // Add custom slot implementations here
  }
})(block);