How to use LWC Component as quick action in salesforce - Salesforce Globe For You

 How to use LWC Component as quick action in salesforce.  - Salesforce Globe For You 

LWC Component can be used in quick action by modifying the following attributes of it's meta file as below

<targets>

  <target>lightning__RecordAction</target>

</targets>

<targetConfigs>

  <targetConfig targets="lightning__RecordAction">

    <actionType>ScreenAction</actionType>

  </targetConfig>

</targetConfigs>

Example:

lwcCompForQuickAction.html

<template>

    <lightning-quick-action-panel title="Quick Action Title">

        Welcome to LWC Component Quick Action

        <div slot="footer">

          Footer

        </div>

      </lightning-quick-action-panel>

</template>

lwcCompForQuickAction.js

import { LightningElement,api } from 'lwc';

export default class LwcCompForQuickAction extends LightningElement {

}

lwcCompForQuickAction.js-meta.xml

<?xml version="1.0" encoding="UTF-8"?>

<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">

    <apiVersion>52.0</apiVersion>

   <isExposed>true</isExposed>

   <targets>

       <target>lightning__RecordAction</target>

   </targets>

    <targetConfigs>

   <targetConfig targets="lightning__RecordAction">

     <actionType>ScreenAction</actionType>

   </targetConfig>

 </targetConfigs>

</LightningComponentBundle>

Output: