Embed a Flow in a lightning web Component

Question

Is there a way in LWC, to call flow from web components. I have a task where I need to add flow into Global action traditionally its not possible with salesforce out-of-box functionality. I'm able to do it via aura component. I wanted to know if there is a way to implement it in LWC.

Answer 1

You can embed a flow in LWC using the new lightning-flow component (from Winter '23 platform release).

To embed a flow simply use the below:

 <lightning-flow flow-api-name="flow_api_name"
                            flow-input-variables={inputVariables}
                            onstatuschange={handleStatusChange}
                        >
 </lightning-flow>

Here flow_api_name is assumed to be the API name of the flow. Note this can be dynamic and you can pass this via JavaScript controller.

flow-input-variables is where you can pass in input variables from lwc to the Flow. You will need a function like below in the JavaScript controller

get inputVariables() {
    return [
        {
            name: "recordId",
            type: "String",
            value: this.recordId
        }
    ];
}

onstatuschange is how you can handle the status changes in flow including flow finish behavior.

handleStatusChange(event) {
    if (event.detail.status === "FINISHED") {
       
    }
}