Created by Eric Smith – February 2021

---

This Post was most recently updated on: 2/17/21

ABOUT

The fsc_flowCheckbox component is designed to be used in a Custom Property Editor.

There is an undesired behavior when using a standard lightning-input with a type of checkbox in a Custom Property Editor. If a checkbox is checked in the CPE and then it is later cleared, its cleared value is not retained when exiting the CPE. An unchecked value will only be retained in the component if the user unchecks, rechecks, and then unchecks again before exiting the CPE.

This component allows the developer to display a Checkbox in a Custom Property Editor. It avoids the issues with a CPE checkbox not being persistent unless it is unselected more than once. It also supports the ability to give a boolean attribute a default value of True.

Using Flow Checkbox

This component requires the addition of an extra string attribute to be paired with each boolean attribute that will be presented in the CPE as a checkbox. For example, if you have a checkbox (boolean) attribute called myCheckbox, you will need to add an additional attribute called cb_myCheckbox.

In your Flow Screen LWC, you will need to update both your component.js and component.js-meta.xml files to reference the additional attribute(s).

component.js

...
@api 
get myCheckbox() {
    return (this.cb_required == 'CB_TRUE') ? true : false;
}
@api cb_myCheckbox;
...

component.js-meta.xml

<targetConfig targets="lightning__FlowScreen" configurationEditor="c-component-c-p-e" category="Input">
    ...
    <property name="myCheckbox" type="Boolean" role="inputOnly"/>
    <property name="cb_myCheckbox" type="String" role="inputOnly"/>
    ...
</targetConfig>

In your Custom Property Editor, you will need to update your inputValues section to include the additional attribute(s).

componentCPE.js

@track inputValues= {
    ...
    myCheckbox: {value: null, valueDataType: null, isCollection: false, label: 'My Attribute Label'},
    cb_myCheckbox: {value: null, valueDataType: null, isCollection: false, label: ''},
    ...
}

To use the checkbox component in your CPE, embed the fsc_flowCheckbox in your CPE’s HTML.

componentCPE.html

    <c-fsc_flow-checkbox
        name="select_myCheckbox"
        label={inputValues.myCheckbox.label}
        field-level-help={inputValues.myCheckbox.helpText}
        checked={inputValues.cb_myCheckbox.value}
        oncheckboxchanged={handleCheckboxChange}
    ></c-fsc_flow-checkbox>

You will also need to add this handler to your CPE’s JavaScript file.

componentCPE.js

handleCheckboxChange(event) {
    if (event.target && event.detail) {
        let changedAttribute = event.target.name.replace(defaults.inputAttributePrefix, '');
        this.dispatchFlowValueChangeEvent(changedAttribute, event.detail.newValue, event.detail.newValueDataType);
        this.dispatchFlowValueChangeEvent('cb_'+changedAttribute, event.detail.newStringValue, 'String');
    }
}

Setting a default value of TRUE for the checkbox attribute

If you want your checkbox to default to checked, you will need to make the following modifications to the steps outlined above.

component.js

...
@api 
get myCheckbox() {
    return (this.cb_myCheckbox == 'CB_TRUE') ? true : false;
}
@api cb_myCheckbox = 'CB_TRUE';
...

componentCPE.js

@track inputValues= {
    ...
    myCheckbox: {value: null, valueDataType: null, isCollection: false, label: 'My Attribute Label'},
    cb_myCheckbox: {value: 'CB_TRUE', valueDataType: null, isCollection: false, label: ''},
    ...
}

Setting the checkbox attribute value in code

Sometimes, in your CPE, you will want to set or change the value of a checkbox attribute. Include this function in your CPE to handle setting the attribute value.

componentCPE.js

this.updateCheckboxValue('myCheckbox', false);

updateCheckboxValue(name, value) {
    this.inputValues[name].value = value;
    this.dispatchFlowValueChangeEvent(name, value, 'boolean');
    this.inputValues['cb_'+name].value = (value) ? 'CB_TRUE' : 'CB_FALSE';
    this.dispatchFlowValueChangeEvent('cb_'+name, this.inputValues['cb_'+name].value, 'String');
}

Attributes

label – Prompt to appear to the right of the checkbox

name – When following the standard template for a CPE, this will be “select_attributename”

checked – Pass in the value of input.values.cb_attributename

fieldLevelHelp – Help text for the checkbox attribute

disabled – Set to true to show the checkbox as disabled in the CPE

Installation

This component is part of the Flow Base Packs package libraries (FlowScreenComponentsBasePack Version 2.1.6 or greater).

View Source

The source code can be found as part of the Flow Screen Components Base Pack.

Mohith Shrivastava is one of our great developer evangelists at Salesforce with deep Flow know-how. He recently recorded a full hour of content on this topic as part of the weekly Developer Podcasts that Josh Birk is producing here.

A lot of of our tutorials are either aimed only at admins or out-of-date or both, so this fresh content is a great addition.

Courtesy of Akihiro Aizawa at Salesforce, this chart shows the combinations where the Scheduled Paths button will appear in Flow Builder. Note that in Spring ’21, Scheduled Paths only appears in the original Freeform mode, and not in the beta Autolayout mode.

The Digital Engagement team in Service Cloud has added a useful new action for sending SMS messages. It’s called Messaging Notification. Here’s what it looks like in Flow Builder and in Process Builder:

Currently, the input parameters are labelled quite differently between the two versions.

Configuring Flow Builder: How It Works

Set Recipient Record ID to either 1) the ID of a MessagingEndUser (this is a special record created by the messaging infrastructure) or 2) the ID of any other object that has at least one phone number field.

You can query for a MessagingEndUser record. Query for records where 1) their MessagingPlatformKey matches the phone number on a specific field of the context record field, and 2) their MessagingChannel is the same as the one specified in Messaging Channel Unique Name.

If the Recipient Record ID is set to the Id of an object other than a MesagingEndUser:

• Also provide a Recipient Phone Number
• Salesforce will create at runtime a Messaging End User out of this specified combination record Id & phone number field

If the Recipient Record ID is set to the ID of a MessagingEndUser:

Don’t specify a Recipient Phone Number because MEU’s have an associated specific phone number

---

Context Record Id is required. It is used for determining how to resolve merge fields. It’s based on the who/what context used by tasks and activities, so it needs to be something like a Contact or a Case.

ConversationBroadcast Record Id is optional, it’s used by the broadcast feature and just ties all the messages sent to that broadcast.

The field ‘Triggered Outbound Type’ is optional. Expected values are ‘Standard” and “Broadcast”. This is intended to work with the work.com broadcast feature.