Examples of LWC Customizations for Industries CPQ

One important component of Industries CPQ in LWC is the Cart component which displays all the items in the cart. By default, the Cart shows the Name, Product Version, Quantity, Prices and Menu actions for each product or line items.

These Cart components are developed with FlexCards and are easily customized. To show how to customize them, each component has an example with details of how and why it's customized.

Related Information

  • cpqCartFlexTable Customization Example
    The cpqCartFlexTable card is the parent component for all Industries CPQ in LWC cart components. This card renders the cart root products and their line items. In this example, a customer wants to change the styling of the product name and to add an additional input field with the product name.
  • cpqCartItemPrices Customization Example
    The cpqCartItemPrices card is responsible to render root product prices. This card has two states: show root items prices and show Line item prices. In this example, a customer doesn’t want to show the usage pricing for the product and wants to change the field value of One time total to One time charge.
  • Add Custom Fields to the CPQ Cart FlexTable
    Extend the CPQ cart to display custom fields by updating the cpqCartFlexTable FlexCard and configuring event listeners on the global header FlexCards for Opportunity, Quote, and Order.