Vlocity Cards for CPQ

Industries Cart is Industries Communications' shopping-cart UI, developed using the Vlocity Cards Framework.

You can modify the appearance and behavior of the cart to customize it according to your specific business requirements. The Vlocity Cards Framework provides configurable cards, layouts, and templates, which are UI building blocks included out-of-the-box with the Salesforce Industries Communications managed package.

Layouts can call omnichannel web APIs to retrieve data. Templates and cards display that data. The cards-based CPQ user interface uses the HybridCPQ Visualforce page, not the typical Console Cards page.

You can use Assets Visualforce pages to render assets on the Account record detail pages. You can use the Review Order Cart read-only Visualforce page to render a read-only review cart on the Order record detail pages. Cards, templates, and layouts control these areas as well.

​Salesforce Industries Communications, Media, and Energy uses the following Cards, Layouts, and Templates.

Name	Element	Description	Related To	Data Source
comp-assets-base-grid (layout)	layout	Provides structure for the cards-based Assets and Review Cart Visualforce pages.	comp-assets-base-grid (template)	None
comp-assets-base-grid (template)	template	Provides space for the cards-based Assets and Review Cart Visualforce pages.	comp-assets-base-grid (layout)	n/a
comp-assets-contract-layout	layout	Provides structure for assets that are listed by contract on the cards-based Assets and Review Cart Visualforce pages.	comp-assets-contract (template) comp-assets-product-item (card)	Dual getAssetsByContract
comp-assets-contract-load (template)	template	Groups assets by contract IDs.	n/a	n/a
comp-assets-contract (card)	card	Renders the date picker and other items in the header portion of the space that displays the assets in the cards-based Assets and Review Cart Visualforce pages, when assets are grouped by contract.	comp-assets-products (template) comp-assets-contract-layout comp-assets-no-contract (card) comp-assets-no-contract-layout
comp-assets-contract (template)	template	Provides space for assets that are listed by contract on the cards-based Assets and Review Cart Visualforce pages.	comp-assets-contract-layout	n/a
comp-assets-header-card (template)	template	Renders the banner at the top of the cards-based Assets and Review Cart Visualforce pages.	comp-assets-header (card) comp-assets-header (layout)	n/a
comp-assets-header (card)	card	With the comp-assets-header-card template, renders the banner at the top of the cards-based Assets and Review Cart Visualforce pages.	comp-assets-header-card (template) comp-assets-header (layout)	None
comp-assets-header (layout)	layout	Provides the structure for the banner at the top of the cards-based Assets and Review Cart Visualforce pages.		Dual getAccounts
	template	Provides the space for the banner in the cards-based Assets and Review Cart Visualforce pages.	comp-assets-header (layout) comp-assets-header (card)	n/a
comp-assets-info-panel (layout)	layout	Provides the structure for the info panel in the cards-based Assets and Review Cart Visualforce pages.	comp-assets-info-panel (template)	None
comp-assets-info-panel (template)	template	Renders the info panel in the cards-based Assets and Review Cart Visualforce pages.	comp-assets-info-panel (layout)	n/a
comp-assets-load (template)	template	Renders the space for assets that are not grouped by contract in the cards-based Assets and Review Cart Visualforce pages.	comp-assets-products (layout) comp-assets-contract (card) comp-assets-no-contract (card) comp-assets-no-contract-layout	n/a
comp-assets-no-contract-layout	layout	Provides structure for assets that are not associated with contracts on the cards-based Assets and Review Cart Visualforce pages.	comp-assets-no-contract (template) comp-assets-product-item (card)	Dual getAssetsByAccount
comp-assets-no-contract (card)	card	Renders the date picker and other items in the header portion of the space that displays the assets in the cards-based Assets and Review Cart Visualforce pages, when assets are not grouped by contract.	comp-assets-load (template)	Sample
comp-assets-no-contract (template)	template	Provides space for assets that are not associated with contracts on the cards-based Assets and Review Cart Visualforce pages.	comp-assets-no-contract-layout	n/a
comp-assets-product-children (layout)	layout	Provides the structure for each child product item on the cards-based Assets and Review Cart Visualforce pages.	comp-assets-product-children (template) comp-assets-product-item-child (card)	Parent
comp-assets-product-children (template)	template	Provides the space for each child product item on the cards-based Assets and Review Cart Visualforce pages.	comp-assets-product-children (layout)	n/a
comp-assets-product-item-child (card)	card	Renders each child product on the cards-based Assets and Review Cart Visualforce pages.	comp-assets-product-item (template) comp-assets-product-children (layout)	None
comp-assets-product-item-child (template)	template	Displays the details of the child element in an asset bundle in the cards-based Assets and Review Cart Visualforce pages.	comp-assets-product-children (layout)	n/a
comp-assets-product-item (card)	card	Renders the space for products listed by contracts on the cards-based Assets and Review Cart Visualforce pages.	comp-assets-product-item (template) cpq-card-blank (template) comp-assets-contract-layout	None
comp-assets-product-item (template)	template	Provides the space for products listed by contracts on the cards-based Assets and Review Cart Visualforce pages.	comp-assets-product-item (card) comp-assets-product-item-child (card)	n/a
comp-assets-products (layout)	layout	Provides the structure for the space for assets that are not grouped by contract in the cards-based Assets and Review Cart Visualforce pages.	comp-assets-products (template) comp-assets-contract (card) comp-assets-no-contract (card) comp-assets-no-contract-layout	None
comp-assets-products (layout)	template	Renders the header portion of the space that displays the assets in the cards-based Assets and Review Cart Visualforce pages.	comp-assets-contract (card) comp-assets-no-contract (card) comp-assets-no-contract-layout	n/a
comp-assets-promotions-card	card	Renders the products on the Promotions tab on the cards-based Assets and Review Cart Visualforce pages.	comp-assets-promotions (layout) comp-assets-promotions (template) cpq-card-blank (template)	None
comp-assets-promotions (layout)	layout	Provides the structure for the Promotions tab on the cards-based Assets and Review Cart Visualforce pages.	comp-assets-promotions (template) comp-assets-promotions-card	Dual getAppliedPromotionsByAccount
comp-assets-promotions (template)	template	Provides the space for the Promotions tab on the cards-based Assets and Review Cart Visualforce pages.	comp-assets-promotions (layout) comp-assets-promotions-card	n/a
comp-cart-review-base-grid (layout)	layout	Provides the structure for the Review Cart Visualforce page.	comp-cart-review-base-grid (template)	None
comp-cart-review-base-grid (template)	template	Provides the space for the Review Cart Visualforce page.	comp-cart-review-base-grid (layout)	n/a
comp-cart-review (layout)	layout	Provides the structure for the main panel of the Review Cart Visualforce page.	comp-cart-review (template) comp-assets-product-item (card)	Dual getCartsItems
comp-cart-review (template)	template	Provides the space for the main panel of the Review Cart Visualforce page.	comp-cart-review (layout)	n/a
cpq-base-grid (layout)	layout	Provides the underlying structure for the CPQ interface.	cpq-base-grid (template)	None
cpq-base-grid (template)	template	Provides a three-column cart interface with the total bar along the bottom of the page.	cpq-base-grid (layout)	n/a
cpq-base-header-card (template)	template	Provides the text and buttons and their format for the cart header.	cpq-header (card)	n/a
cpq-base-header-payment-choice (layout)	layout	Calls the getListsOfValues API to provide the user payment choices in Industries Cart.	cpq-base-header-payment-choice (template)	Dual getListsOfValues
cpq-base-header-payment-choice (template)	template	Renders the Payment Choice drop-down list in Industries Cart.	cpq-base-header-payment-choice (layout)	n/a
cpq-base-header-pricelist (layout)	layout	Renders the picklist that displays the price lists in the upper left corner of Industries Cart.	cpq-base-header-pricelist (template)	Dual getPriceLists
cpq-base-header-pricelist (template)	template	Calls changePricelist to assign the price list the agent selects.	cpq-base-header-pricelist (layout)	changePricelist
cpq-base-header (template)	template	Provides the structure for the cart header.	cpq-header (layout) cpq-header (card)	n/a
cpq-base-theme-variables	template	Contains CSS variables used in other templates.		n/a
cpq-base-variables	template	Contains CSS variables used in other templates and themes.	cpq-base-theme-variables	n/a
cpq-card-blank (template)	template	Empty template to create a custom view.	cpq-cart-applied-promotions-card and cpq-cart-promotions (card) cpq-product-cart-item (card) comp-assets-product-item (card) comp-assets-promotions-card	n/a
cpq-card-mixin (template)	template	Displays the bundle hierarchy in Industries Cart.	comp-assets-product-item-child (card) comp-assets-product-item-child (template) cpq-product-cart-item-child (card) cpq-product-cart-item-child (layout) cpq-product-cart-item-child (template) cpq-product-cart-item (template)	n/a
cpq-cart-item-detail (card)	card	Renders the information in the Line Item Details dialog box.	cpq-cart-item-detail (layout) cpq-product-cart-item (template)	None
cpq-cart-item-detail (layout)	layout	Provides the interface for the Line Item Details dialog box.	cpq-cart-item-details (template) cpq-cart-item-detail (card)	getCartsItems or cpq-cart-item-details card
cpq-cart-item-details (template)	template	Provides the structure for the cards in the Line Items Details dialog box.	cpq-cart-item-lookup (layout) cpq-cart-item-detail (card)	n/a
cpq-cart-item-lookup (layout)	layout	Provides the Cart Item Lookup Field dialog box.	cpq-cart-item-lookup (template)	getAvailableSites
cpq-cart-item-lookup (template)	template	Provides the structure for the Cart Item Lookup Field dialog box.	cpq-cart-item-lookup (layout)	n/a
cpq-cart-promotions (card)	card	Renders each individual applied promotion in the cart.	cpq-cart-promotions (layout) cpq-card-blank (template)	None
cpq-cart-promotions (layout)	layout	Renders the list of applied promotions in the cart.	cpq-cart-promotions (template) cpq-cart-promotions (card)	Dual getPromotionsAppliedToCart
cpq-cart-promotions (template)	template	Retrieves the list of applied promotions in the cart.	cpq-cart-promotions (layout)	n/a
cpq-config-attr-custom-action-template1 and cpq-config-attr-custom-action-template2	template	Created to support custom actions in the Industries Cart information panel. Adds functionality with a lookup field for a phone number.	none	n/a
cpq-header (card)	card	Displays the cart header content.	cpq-base-header-card (template) cpq-header (layout)	getCarts
cpq-header (layout)	layout	Provides the header for the cart.	cpq-base-header (template) cpq-header (card)	None
cpq-input-custom-template-sample	template	Sample template to show how to provide a custom template for a field in the Industries Cart information panel.	none	n/a
cpq-left-sidebar (layout)	layout	Displays the sidebar that contains the Product list and Promotions list.	cpq-left-sidebar (template)	None
cpq-left-sidebar (template)	template	Provides structure for the Product list and Promotions list in Industries Cart.	cpq-left-sidebar (layout)	n/a
cpq-mixin	template	Generates padding styles for the product name in a hierarchy in Industries Cart.	All templates	n/a
cpq-product-card-config-card	card	Contains the editable fields that the user can update on the product configuration panel.	cpq-product-cart-config (template) cpq-product-cart-config (layout)	None
cpq-product-cart-config (layout)	layout	Renders the configuration panel in the cart.	cpq-product-cart-config (template)	None
cpq-product-cart-config (template)	template	Provides the structure for the configuration panel in the cart.	cpq-product-cart-config (layout)	n/a
cpq-product-cart-item-cell-detail (flyout)	flyout	Displays the Price Details dialog box.	cpq-product-cart-item-cell-detail (template)	None
cpq-product-cart-item-cell-detail (template)	template	Provides structure for the Price Details dialog box.		n/a
cpq-product-cart-item-cell-payment-choice (template)	template	Renders the Payment Choice drop-down list for a single line item in Industries Cart.	cpq-product-cart-item-cell-payment-choice (template)	n/a
cpq-product-cart-item-cell-pricing (flyout)	flyout	Displays the Apply Discount dialog box	cpq-product-cart-item-cell-pricing (template)	None
cpq-product-cart-item-cell-pricing (template)	template	Provides structure for the Apply Discount dialog box.	cpq-product-cart-item-cell-pricing (flyout)	n/a
cpq-product-cart-item-child (card)	card	Renders each child-level line item in Industries Cart.	cpq-product-cart-item-child (template)	None
cpq-product-cart-item-child (layout)	layout	Displays child-level product information in Industries Cart.	cpq-product-cart-item-child (template) cpq-cart-item-child-products card	Parent
cpq-product-cart-item-child (template)	template	Provides the structure for the child-level product information in Industries Cart.	cpq-product-cart-item-child (layout)	n/a
OBSOLETE cpq-product-cart-item-delete
cpq-product-cart-item (card)	card	Displays each line item in a cart.	cpq-product-cart (layout) cpq-product-cart-item (template)	None
cpq-product-cart-item (template)	template	Provides the structure for the Line Item Details dialog box.	cpq-cart-item-detail (card)	n/a
cpq-product-cart-item (template)	template	Provides the structure for each line item in the cart. Display the root level product information in the cart.	cpq-product-cart-item (card)	n/a
cpq-product-cart (layout)	layout	Provides the structure for the product cart.	cpq-product-cart (template) cpq-product-cart-item (card)	getCartsItems
cpq-product-cart (template)	template	Provides the structure for the cart.	cpq-product-cart (layout)	n/a
cpq-product-config-custom-action	layout	Renders custom actions in the CPQ user interface.	cpq-product-config-custom-action (template)	Custom
cpq-product-config-custom-action (template)	template	Provides a very basic structure on which you can base custom actions.	cpq-product-config-custom-action layout	n/a
cpq-product-details (card)	card	Displays the details for one product in the Product Details dialog box.	cpq-product-item-more (layout) cpq-product-item-details (template)	None
cpq-product-filters (layout)	layout	Renders the filterable attributes list panel, including the Reset and Apply buttons.	cpq-product-filters (template)	getCartsAttributes
cpq-product-filters (template)	template	Renders the filterable attributes list panel, including the Reset and Apply buttons.	cpq-product-filters (layout)	n/a
cpq-product-item-details (template)	template	Provides the structure for each product in the Product Details dialog box.	cpq-product-details (card)	n/a
cpq-product-item-more (layout)	layout flyout	Renders the Product Details dialog box.	cpq-product-item-more (template) cpq-product-details (card)	getCartsProducts
cpq-product-item-more (template)	template	Provides the base structure for the Product Details dialog box.	cpq-product-item-more (layout)	n/a
cpq-product-item (card)	card	Displays each product in the product list in the cart.	cpq-product-list (layout) cpq-product-item (template) cpq-product-item-more (template) flyout	None
cpq-product-item (template)	template	Provides the structure for each product in the product list in the cart.	cpq-product-item (card)	n/a
cpq-product-list (layout)	layout	Renders the product list in the cart, including the search box and filter.	cpq-product-list (template) cpq-product-item (card)	getCartsProducts
cpq-product-list (template)	template	Provides the structure for the product list in the cart.	cpq-product-list (layout)	n/a
cpq-promotion-item (card)	card	Renders each individual promotion line item in Industries Cart.	cpq-promotions-list (layout) cpq-promotion-item (template)	None
cpq-promotion-item (template)	template	Provides the structure for an individual promotion line item in Industries Cart.	cpq-promotion-item (card)	n/a
cpq-promotions-list (layout)	layout	Renders the Promotions list in Industries Cart.	cpq-promotions-list (template) cpq-promotion-item (card)	Dual getCartsPromotions
cpq-promotions-list (template)	template	Provides the structure for the Promotions list in Industries Cart.	cpq-promotions-list (layout)	n/a
cpq-slds-prompt (layout)	layout	Provides the container for the template to customize prompts in Industries Cart	cpq-slds-prompt (template)	n/a
cpq-slds-prompt (template)	template	Enables customizing prompts in Industries Cart.	cpq-slds-prompt (layout)	n/a
cpq-theme-variables	template	Contains CSS variables used in other templates.	all CPQ templates	n/a
cpq-total-bar-card	card	Renders the total bar in the cart.	cpq-total-card (template) cpq-total-bar (layout)	None
cpq-total-bar (layout)	layout	Renders the total bar in the cart.	cpq-total-bar (template) cpq-total-bar-card	getCarts
cpq-total-bar (template)	template	Provides the structure for the total bar in the cart.	cpq-total-bar (layout)	n/a
cpq-total-card (template)	template	Provides the text and buttons, as well as their styling, for the total bar in the cart	cpq-total-bar-card	n/a

All layouts are listed on the Vlocity Cards tab. If you experience errors while importing Omnistudio Data Mappers associated with Vlocity cards while the OmniStudio Standard Runtime setting is turned on, the issue is likely because of naming conflicts. To resolve this issue, uniquely rename the DRs to ensure they don't conflict with any existing elements.

1. cpq-base-grid layout and cpq-base-grid template

2. cpq-base-header-pricelist layout and cpq-base-header-pricelist template

3. cpq-base-header template and cpq-header layout

4. cpq-base-header layout, cpq-base-header-card template, and cpq-header card

5. cpq-product-list layout and cpq-product-list template

6. cpq-product-item card and cpq-product-item template

7. cpq-product-cart layout and cpq-product-cart template

8. cpq-product-cart-item template and cpq-product-cart-item card

9. cpq-total-bar layout, cpq-total-bar template, cpq-total-bar-card card, and cpq-total-card template

1. cpq-product-cart-config layout and cpq-product-cart-config template

2. Click to look up a specific object, such as a service account or location.

1. Click for product details. Opens the Product Details dialog box, which uses the cpq-product-details card, cpq-product-item-more layout, and cpq-product-item-details template.

2. Click to display or hide the Products or Promotions list.

3. Click for line item details for the root item. Opens the Line Item Details dialog box.

4. Click to open the configuration panel.

5. Products and Promotions lists, cpq-left-sidebar template and cpq-left-sidebar layout

6. Child line items in Industries Cart, cpq-product-cart-item-child layout, cpq-product-cart-item-child template, and cpq-product-cart-item-child card

1. cpq-promotions-list layout and cpq-promotions-list template

2. cpq-cart-promotions and cpq-cart-promotions template

3. cpq-promotion-item template and cpq-promotion-item card

4. cpq-cart-promotions card

1. cpq-product-item-more layout and cpq-product-item-more template

2. cpq-product-details card and cpq-product-item-details template

1. cpq-cart-item-detail layout and cpq-cart-item-details template

2. cpq-cart-item-detail card and cpq-product-cart-item template

• cpq-cart-item-lookup layout and cpq-cart-item-lookup template

• cpq-product-filters layout and cpq-product-filters template

• cpq-product-filters layout and cpq-product-filters template

1. comp-assets-header

2. comp-assets-products

3. comp-assets-contract

4. comp-assets-product-item

5. comp-assets-product-item-child

6. comp-assets-product-children

7. comp-assets-base-grid

8. comp-assets-contract

9. comp-assets-header

• comp-assets-base-grid (template)
  The comp-assets-base-grid template provides a space for the Assets and Review Cart cards-based Visualforce pages.
• comp-assets-contract (template)
  The comp-assets-contract template provides the space for assets that are listed by contract on the cards-based Assets and Review Cart Visualforce pages.
• comp-assets-contract-layout
  The comp-assets-contract layout provides the structure for assets that are listed by contract on the cards-based Assets and Review Cart Visualforce pages.
• comp-assets-contract-load (template)
  The comp-assets-contract-load template groups assets by contract IDs.
• comp-assets-header (card)
  The comp-assets-header card, with the comp-assets-header-card template, renders the banner at the top of the cards-based Assets and Review Cart Visualforce pages.
• comp-assets-header (layout)
  The comp-assets-header layout provides the structure for the top of the cards-based Assets and Review Cart Visualforce pages.
• comp-assets-header-card (template)
  The comp-assets-header-card template renders the top of the cards-based Assets and Review Cart Visualforce pages.
• comp-assets-info-panel (layout)
  The comp-assets-info-panel layout provides the structure for the info panel in the cards-based Assets and Review Cart Visualforce pages.
• comp-assets-info-panel (template)
  The comp-assets-info-panel template renders the information panel in the cards-based Assets and Review Cart Visualforce pages.
• comp-assets-load (template)
  The comp-assets-load template renders the space for assets that are not grouped by contract in the cards-based Assets and Review Cart Visualforce pages.
• comp-assets-no-contract (card)
  The comp-assets-no-contract card renders the date picker and other items in the header portion of the space that displays the assets on the cards-based Assets and Review Cart Visualforce pages, when the assets are not grouped by contract.
• comp-assets-no-contract-layout
  The comp-assets-no-contract-layout provides structure for assets that aren't associated with contracts on the cards-based Assets and Review Cart Visualforce pages.
• comp-assets-base-grid (layout)
  The comp-assets-base-grid layout provides the underlying structure for the Assets and Review Cart cards-based Visualforce pages.
• comp-assets-product-children (template)
  The comp-assets-product-children template provides the space for each child product item on the cards-based Assets and Review Cart Visualforce pages.
• comp-assets-product-item (card)
  The comp-assets-product-item card renders the space for products listed by contracts on the cards-based Assets and Review Cart Visualforce pages.
• comp-assets-product-item (template)
  The comp-assets-product-item template provides the space for products listed by contracts on the cards-based Assets and Review Cart Visualforce pages.
• comp-assets-product-item-child (card)
  The comp-assets-product-item-child card renders each child product on the cards-based Assets and Review Cart Visualforce pages.
• comp-assets-product-item-child (template)
  The comp-assets-product-item-child template displays the details of the child element in an asset bundle in the cards-based Assets and Review Cart Visualforce pages.
• comp-assets-products (layout)
  The comp-assets-products layout provides the structure for the space for assets that are in the cards-based Assets and Review Cart Visualforce pages.
• comp-assets-products (template)
  The comp-assets-products template renders the product assets.
• comp-assets-promotions (layout)
  The comp-assets-promotions layout provides the structure for the Promotions tab on the cards-based Assets and Review Cart Visualforce pages.
• comp-assets-promotions (template)
  The comp-assets-promotions template provides the space for the Promotions tab on the cards-based Assets and Review Cart Visualforce pages.
• comp-assets-promotions-card
  The comp-assets-promotions-card Renders the products on the Promotions tab on the cards-based Assets and Review Cart Visualforce pages.
• comp-cart-review (layout)
  The comp-cart-review layout provides the structure for the main panel of the Review Cart Visualforce page.
• comp-cart-review (template)
  The comp-cart-review template provides the space for the main panel of the Review Cart Visualforce page.
• comp-assets-no-contract (template)
  The comp-assets-no-contract template provides space for assets that are not associated with contracts on the cards-based Assets and Review Cart Visualforce pages.
• comp-cart-review-base-grid (layout)
  The comp-cart-review-base-grid layout provides the structure for the Review Cart Visualforce page.
• comp-cart-review-base-grid (template)
  The comp-cart-review-base-grid template provides the space for the Review Cart Visualforce page.
• cpq-base-grid (layout)
  The cpq-base-grid layout provides the underlying structure for the CPQ interface. The template provides a three-column interface with the header bar at the top of the page and a total bar at the bottom of the page.
• cpq-base-grid (template)
  The cpq-base-grid template provides a three-column cart interface with the header bar at the top of the page and the total bar at the bottom of the page.
• cpq-base-header (template)
  The cpq-base-header template provides the structure of the cart header.
• cpq-base-header-card (template)
  The cpq-base-header-card template provides the structure for the cart header.
• cpq-base-header-payment-choice (layout)
  The cpq-base-header-payment-choice layout calls the getListsOfValues API to provide the user payment choices in Industries Cart.
• cpq-base-header-pricelist (layout)
  The cpq-base-header-pricelist layout renders the picklist that displays the price lists in the upper left corner of Industries Cart.
• cpq-base-header-pricelist (template)
  The cpq-base-header-pricelist template calls changePricelist to assign the price list the agent selects.
• cpq-base-theme-variables (template)
  The cpq-base-theme variables template contains CSS variables that are used in other templates.
• cpq-base-variables (template)
  The cpq-base-variables template contains CSS variables used in other templates and themes.
• cpq-card-blank (template)
  The cpq-card-blank template is an empty template. You can use cpq-card-blank to create a custom view in the cpq-product-cart-item card state.
• cpq-card-mixin (template)
  The cpq-card-mixin template displays the bundle hierarchy in Industries Cart.
• cpq-cart-item-detail (card)
  The cpq-cart-item-detail card renders the information in the Line Item Details dialog box. Each card contains the information for one product, or line item, in the cart. Use the line item details to modify the attributes of any item inline.
• cpq-cart-item-detail (layout)
  The cpq-cart-item detail layout provides the interface for the Line Item Details dialog box.
• comp-assets-contract (card)
  The comp-assets-contract card renders the date picker and other items in the header portion of the space that displays the assets on the cards-based Assets and Review Cart Visualforce pages, when the assets are grouped by contract.
• cpq-cart-item-details (template)
  The cpq-cart-items-details template provides the structure for the cards in the Line Items Details dialog box.
• cpq-cart-item-lookup (layout)
  The cpq-cart-item-lookup layout renders the Cart Item Lookup Field dialog box.
• cpq-cart-item-lookup (template)
  The cpq-cart-item-lookup template provides the structure and user interface elements for the Cart Item Lookup Field dialog box.
• cpq-cart-promotions (card)
  The cpq-cart-promotions card renders each individual applied promotion in the cart.
• cpq-cart-promotions (layout)
  The cpq-cart-promotions layout renders the list of applied promotions in the cart.
• cpq-cart-promotions (template)
  The cpq-cart-promotions template retrieves the list of applied promotions in the cart.
• cpq-config-attr-custom-action-template1 and cpq-config-attr-custom-action-template2
  The cpq-config-attr-custom-action-template1 and cpq-config-attr-custom-action-template 2 templates support custom actions in the Industries Cart information panel. Specifically, these templates add a lookup field for a phone number.
• cpq-header (card)
  The cpq-header-card displays the content of the cart header. This card has three states.
• cpq-header (layout)
  The cpq-header layout provides the header for the cart.
• cpq-base-header-payment-choice (template)
  The cpq-base-header-payment-choice template renders the Payment Choice drop-down list in Industries Cart.
• cpq-input-custom-template-sample
  The cpq-input-custom-template-sample template is an example of a custom template for a field.
• cpq-left-sidebar (layout)
  The cpq-left-sidebar layout displays the Products list and Promotions list in Industries Cart.
• cpq-left-sidebar (template)
  The cpq-left-sidebar template is a wrapper for the cpq-product-list and cpq-promotions-list cards and layouts.
• cpq-product-addon (layout)
  The cpq-product-addon layout provides the information necessary when a product includes additional items.
• cpq-product-addon-item (card)
  The cpq-product-addon-item displays the information necessary when a product includes additional items, including the line items, child products, promotions, and grouping items.
• cpq-product-addon-item-separate-section (template)
  The cpq-product-addon-item-separate-section template provides the structure for the line items in a cart when some products include additional items.
• cpq-product-cart (layout)
  The cpq-product-cart layout renders the cart, including any relevant error messages.
• cpq-product-cart (template)
  The cpq-product-cart template provides the structure for the cart.
• cpq-product-cart-config (layout)
  The cpq-product-cart-config layout renders the configuration panel in the cart, including only the close and Save buttons.
• cpq-product-cart-config (template)
  The cpq-product-cart-config template provides the structure for the configuration panel in the cart.
• cpq-product-cart-item (card)
  The cpq-product-cart-item card displays each line item in a cart.
• cpq-product-cart-item (template)
  The cpq-product-cart-item template provides the structure for the Line Item Details dialog box.
• cpq-product-cart-item-cell-detail (flyout)
  The cpq-product-cart-item-cell-detail flyout displays the Price Details dialog box.
• cpq-product-cart-item-cell-detail (template)
  The cpq-product-cart-item-cell-detail template provides the structure for the Price Details dialog box.
• cpq-product-cart-item-cell-payment-choice (template)
  The cpq-product-cart-item-cell-payment-choice template renders the Payment Choice drop-down list for a single line item in Industries Cart.
• cpq-product-cart-item-cell-pricing (flyout)
  The cpq-product-cart-item-cell-pricing flyout displays the Apply Adjustment dialog box.
• cpq-product-cart-item-cell-pricing (template)
  The cpq-product-cart-item-cell-pricing template provides the structure for the Apply Adjustment dialog box.
• cpq-product-cart-item-child (card)
  The cpq-product-cart-item-child card displays each child-level product line item in Industries Cart.
• cpq-product-cart-item-child (layout)
  The cpq-product-cart-item-child layout displays child-level product information in Industries Cart.
• cpq-product-cart-item-child (template)
  The cpq-product-cart-item-child template provides the structure for the child-level product information in the cart.
• cpq-product-config-custom-action (layout)
  The cpq-product-config-custom-action layout can render custom actions in the CPQ user interface. You can use the cpq-product-config-custom-action layout when you must customize the default look and feel of a field, or when you must add your own custom implementation. You can also use this layout when an attribute requires an external data source to populate it. For example, for a telephone reservation, you can call out to an external system.
• cpq-product-config-custom-action (template)
  The cpq-product-config-custom-action template is associated with the cpq-product-config-custom-action layout. It provides a very basic structure on which you can base custom actions.
• cpq-product-details (card)
  The cpq-product-details card displays the details for one product in the Product Details dialog box.
• cpq-product-filters (layout)
  The cpq-product-filters layout renders the filterable attributes list panel, including the Reset and Apply buttons.
• cpq-product-filters (template)
  The cpq-product-filters template provides the structure for the filterable attributes list panel, including the Reset and Apply buttons.
• cpq-product-item (card)
  The cpq-product-item card displays each product in the product list the cart.
• cpq-product-item (template)
  The cpq-product-item template provides the structure for each product in the product list in the cart.
• cpq-product-item-details (template)
  The cpq-product-item-details template provides the structure for each product in the Product Details dialog box.
• cpq-product-item-more (layout)
  The cpq-product-item-more layout renders the Product Details dialog box.
• cpq-product-item-more (template)
  The cpq-product-item-more template provides the base structure for the Product Details dialog box.
• cpq-product-list (layout)
  The cpq-product-list layout renders the product list in the cart.
• cpq-product-list (template)
  The cpq-product-list template provides the structure for the product list in the cart.
• cpq-promotion-item (card)
  The cpq-promotion-item card renders each individual promotion line item in Industries Cart.
• cpq-promotion-item (template)
  The cpq-promotion-item template provides the structure for an individual promotion line item in Industries Cart.
• cpq-promotions-list (layout)
  The cpq-promotions-list layout renders the Promotions list in Industries Cart.
• cpq-promotions-list (template)
  The cpq-promotions-list template provides the structure for the Promotions list in Industries Cart.
• cpq-slds-prompt (layout)
  The cpq-slds-prompt layout contains the cpq-slds-prompt template, which can be customized to create prompts in Industries Cart.
• cpq-slds-prompt (template)
  The cpq-slds-prompt template enables you to customize prompts in Industries Cart.
• cpq-theme-variables (template)
  The cpq-theme-variables template contains variables used in other templates.
• cpq-total-bar (layout)
  The cpq-total-bar layout renders the total bar in the cart.
• cpq-total-bar (template)
  The cpq-total-bar template provides the structure for the total bar in the cart.
• cpq-total-bar-card
  The cpq-total-bar-card card renders the total bar in the cart.
• cpq-total-card (template)
  The cpq-total-card template provides the text and buttons, as well as their styling, for the total bar in the cart.