Categories
lwc Salesforce Vlocity

Using Custom LWC inside Vlocity Omniscript

Create a custom Radio Group inside vlocity Omniscript

NEVER GIVE UP

Problem- Due to omniscript limitations, it happens you need to use custom LWC to achieve the requirements.

Solution:- 

  • Get the custom LWC from the salesforce Lightning web components (in our example we are using radio group)
  • <template>
        <lightning-radio-group name="radioGroup"
                              label="Radio Group"
                              options={options}
                              value={value}
                              type="radio"></lightning-radio-group>
    </template>
    
  • Omniscript Designer > Inputs > drag “Custom LWC” inside step
  • Map the custom LWC (radio group in our case ), under “Lightning Web Component Name

  • For passing any custom data, lets say coming from dataraptor, and use it in custom LWC

  • In Custom LWC, .meta.xml file make 2 changes
    • <isExposed>true</isExposed>
    • <runtimeNamespace>vlocity_ins</runtimeNamespace>

runtimeNamespace is dependent on the vlocity vertical you are using say Communucation use vlocity_cmt (namespace) or vlocity_ins(for insurance)

  • Inside your custom lwc .js file use the below lines of code to create omnscript wrapper
import { OmniscriptBaseMixin } from "vlocity_ins/omniscriptBaseMixin";

export default class customLWCRadioGroup extends OmniscriptBaseMixin(
  LightningElement
) {
//your lwc code here for radio group as shown above
}
  • Deploy your changes to your sandbox for custom lwc, activate the omnscript,  Enable LWC(on script configuration), perview the LWC

 

Leave a Reply

Your email address will not be published. Required fields are marked *