This topic describes the Digital Commerce Lightning Web Components, which are intended for use on the Salesforce platform and follow the same standards as Salesforce's Lightning Web Components.
Digital Commerce Lightning Web Components supplement Vlocity Lightning Web Components by incorporating calls to the set of Digital Commerce cacheable APIs. Digital Commerce APIs are RESTful Web APIs that are designed to enable client applications such as consumer-facing web and mobile apps to shop for products and services. Vlocity Communications API Caching is optimized for consumer shopping use cases where the user is often anonymous until well into the check-out process. OmniStudio Vlocity Lightning Web Components
Vlocity Lightning Web Components are custom components and widgets built on Web Component standards that work with all modern browsers and can be distributed with any JavaScript library or framework. Web components allow you to create new custom, reusable, encapsulated HTML tags to use in your web pages or applications.
The Digital Commerce Web Components developer reference has two versions:
| Component | Description |
|---|---|
| DCAppliedPromotionList | Render all the applied promotions. |
| DCAssetAttributes | Lists all asset attributes. |
| DCAssetDetails | Renders each asset. |
| DCAssetItemDetails | Displays asset details for each asset. |
| DCAssetsList | Displays all assets. |
| DCBaseComponent | A base class that is extended by other lightning web components |
| dcBaseMixin | <>A wrapper for DCBaseComponent that help implement your custom UI and leverage the Digital Commerce SDKExtends OmniScript Base Mixin (omniscriptBaseMixin)Enables a custom Salesforce URL for logged-in users by specifying the value of the salesforceCustomDomainUrl variableProvides methods to get an SDK instance, update custom URLs, load a CSS into custom LWCs, update OmniScript data, and other capabilitiesSupports the getTranslatedLabels translation method and its parameters: language and labels</> |
| DCCatalog | Render the specified catalog list. |
| DCCheckOut | Supports the checkout workflow, including payment and submitting the order |
| DCCheckoutPayment | Supports payment features |
| DCChildCatalogs | Render the specified catalog child list. |
| DCCustomAuthentication | Reference implementation for sign-in or sign-up using redirect mechanism. |
| DCFilter | Render offer prices in the offer list. |
| DCGlobalHeader | Renders a global header available across all components except checkout. |
| DCMediaViewer | Render a media carousel that cycles through media resources. |
| DCMyAccount | Renders user account. |
| DCOfferAddons | Supports add-on offers and displays the child bundle options |
| DCOfferAttributeConfig | Render attribute values and allow users to choose a predefined set of options. |
| DCOfferColorConfig | Render color options for an offer. |
| DCOfferConfig | Retrieve the selected offer details using the getOffer() API. The offer can also be configured in this component. |
| DCOfferConfigDetails | Render configuration details for an offer. |
| DCOfferConfigurations | Render non-configurable offer attributes. |
| DCOfferGridView | Render offers in a grid. |
| DCOfferGroup | Render offers in a group. |
| DCOfferGroupSections | Render the first child bundle options (optional). |
| DCOfferGroupSelection | Segment offer groups |
| DCOfferInputConfig | Supports custom input |
| DCOfferListViewAttribute | Render offer attributes in an offer list. |
| DCOfferListViewImage | Render offer images in an offer list. |
| DCOfferListViewPrice | Render offer prices in an offer list. |
| DCOfferPaymentConfig | Render payment options for an offer. |
| DCOffersList | Retrieve the offers for the specified catalog-code using the getOffers() API. DCOffersList is a base class which is extended by all lightning web components. |
| DCOffersListView | Render offers in a list view. |
| DCProgressIndicator | Render a progress icon or a progress bar. |
| DCPromotionList | Render all available promotions. |
| DCReviewOrder | Render all the order details so that the user can review them before submitting the order. |
| DCSampleApp | Container class where all components are rendered conditionally. |
| DCShoppingCart | Render the offers that are being added to the cart. The cart may be updated before checkout. |
| DCShoppingcartNestedOffer | Render child bundles of the offer that is being added to the cart. |
| DCShoppingCartOfferDetails | Render details of the offers that are being added to cart. |
| DCSignIn | Supports sign up and sign in |
| DCTotalBar | Render total cart prices. |
| DCUpdateBillingAddress | Supports updates to billing and shipping addresses |