You are here:
CLM Lightning Web Components Overview
CLM LWCs provide a layered framework that displays, processes, passes, retrieves, and re-displays data.
Vlocity uses Salesforce's Lightning Web Component technology to create the components that work together to do all these tasks.
These components handle the data, passing it from the services to the UI, taking updates from the UI and passing them to the next service, displaying the newly changed data, and so on.
For Vlocity administrators, the Salesforce Lightning experience determines what they see when they're configuring products, creating rating modules, and developing Omniscripts.
The Lightning Web Components use a standard JSON format that works as the input to services. The Vlocity CLM services output JSON data in the same format.
You can use an Omniscript that uses Lightning Web Components (LWCs) to dynamically generate a document. This feature is available only for documents created from Microsoft Word DOCX or Microsoft PowerPoint PPTX document templates, and only outputs in Microsoft Word DOCX, Microsoft PowerPoint PPTX, and PDF are currently supported. For details, see Using the docGenerationSample/singleDocxLwc Omniscript.
You can use an Omniscript that uses LWCs to send generic documents for eSignature. For details, see Using the GenericDocuSign/sendEsignature Omniscript.
Business Value of Lightning Web Components
Lightning web components offer the following advantages:
-
Speed. Lighting Web Components let Omniscripts load faster than Angular elements because:
-
No need to load libraries
-
Native browser support
-
-
Upgradeability. When you use or extend Vlocity Lightning Web Components, you'll get the latest Vlocity enhancements automatically when you upgrade to new releases.
Support for Lightning Web Components and Angular
Vlocity supports the use of both Lightning Web Components and Angular in the same org at the same time. Here's how that works:
-
Vlocity supports the use of both Angular Omniscripts and Lightning Web Component Omniscripts. So you can keep your existing Angular Omniscripts as-is, while creating and deploying new Omniscripts using Lightning Web Components.
-
A single Omniscript cannot use a combination of Angular elements and Lightning Web Components. Each Omniscript you create must use one or the other.
Contents of a Lightning Web Component
CLM LWCs contain these parts.
javascript file (.js) | Required for all Lightning web components. If the component renders UI, the JS file specifies which HTML file to return if there's more than one. If you extend a component and create your own custom HTML file, you must modify the JS file to return your custom HTML file rather than the base Vlocity HTML file. |
|---|---|
HTML file (.html) |
Required for all LWCs that render UI. Optional for service LWCs. |
(Optional) CSS file (.css) |
Some CLM LWCs use CSS files, others don't. The ones that don't have CSS files include formatting in the HTML file. |
Configuration file (.js-meta.xml) |
Required for all LWCs. |
Extend, Modify, or Replace a Lightning Web Component
To meet your business's specific needs, you can extend the CLM LWCs.
Extend the JavaScript file. You can extend the JS of any Vlocity LWC. In your extension file, you can add to or replace any of the functions and methods in the base Vlocity JS file. When you extend a component this way, your extended component will get all the changes Vlocity makes when you upgrade CLM.
Create your own HTML and/or CSS files. Clone the LWC files, rename the cloned copy, and create your own versions of the HTML and CSS files. If you create your own HTML and CSS files, your LWCs won't uptake any changes to CLM LWC HTML and CSS files. Vlocity recommends that you review the upgraded files to see if there are any changes you want to incorporate into your components. You can use the existing Vlocity LWCs as a guide to create your own custom LWCs.
Vlocity Base and Omniscript Lightning Web Components
Vlocity has created Lightning Web Components that work with cards and Omniscripts. To learn about these components, start with these topics:
- clmOsDocxGenerateDocument Lightning Web Component
Use clmOsDocxGenerateDocument top-level Lightning Web Component (LWC) to generate and attach a Microsoft Word document and .pdf document for a given sObject. - clmOsDocxGenerateWordDocument Lightning Web Component
Use this top-level Lightning Web Component to generate and attach a Microsoft Word DOCX document or Microsoft PowerPoint PPTX document for any Salesforce object, including contracts, opportunities, quotes, and orders. This LWC contains the following components: - clmDocxPreviewDocument Lightning Web Component
Use this LWC to show thumbnails to allow Microsoft Word or Microsoft PowerPoint downloads. - clmDocumentPreviewer LWC
Use this Lightning web component to show the previewer for Microsoft Word and Microsoft PowerPoint documents. This component is referenced in the clmDocxPreviewDocument LWC parent component. This CLM Lightning Web component can be used for showing the previewer with the download buttons. If a document is already attached, the component can either query for the document or access the contentVersionId provided as input. - clmSelectableItems Lightning Web Component
Use this Lightning Web Component (LWC) to list all the Microsoft Word DOCX document templates or Microsoft PowerPoint PPTX document templates as a selectable item and fire an event when a template is selected. - clmPdfConverter Lightning Web Component
Use this Lightning Web Component to convert Microsoft Word DOCX documents and Microsoft PowerPoint PPTX documents to PDF documents, and attach them to sObjects. - clmShowThumbnail Lightning Web Component
Use this LWC to show thumbnails for Microsoft Word and Microsoft PowerPoint documents. - clmShowPdfThumbnail Lightning Web Component
Use this Lightning Web Component to show the thumbnail version for a PDF document based on the input parameters. - clmShowWordPptThumbnail Lightning Web Component
Use this LWC to show thumbnails for Microsoft Word and Microsoft PowerPoint document. - clmUtils Lightning Web Component
This Lightning Web Component is used in other Vlocity CLM Lightning Web Components. However, the clmUtils LWC is a service Lightning Web Component. Unlike other LWCs, this LWC has only a configuration and JS files.If you plan to extend any Vlocity CLM LWCs or create your own LWCs to use in Vlocity CLM Omniscripts, you can use the following utilities. - clmOsWebGenerateDocument Lightning Web Component
Use clmOsWebGenerateDocument top-level Lightning Web Component to generate and attach a Microsoft Word document and PDF document for a given sObject.

