Custom Action - Aura / LWC Component

Aura / LWC Configuration JSON (Don't use this as it contains comments. use below clean one)

CODE

{
"icon": "utility:delete", //Any utility icon from https://www.lightningdesignsystem.com/icons/
"recordLevel": "single+multiple", //Options: single, multiple, single+multiple
"shortcut": "Ctrl + C", //Just to display shortcut
"showInToolBar": true, //display in toolbar actions or not(By default available in context menu)
"refreshOnClose": false,
"targetConfiguration": {
	"componentName":"c:TestCmp", //Fully Qualified Component Name
	"title" : "This is Test Cmp", // Title on the Popup
	"height":"60rem", //Height of modal
	"width" : "60rem", //Width of Modal
	"bodyCss" : "background-color:red", //Custom CSS
	"componentParams":{
		"records":"{!selectedRecords}" //Selected Record,
		"objectApiName" : "{!objectApiName}",
		"relatedFieldApiName":"{!relatedFieldApiName}",
		"relatedRecordId":"{!relatedRecordId}",
		"tablesView":"{!tablesView}"
	},
	"footerActions":[
		{
			"name" : "Next",
			"label" : "Next",
			"theme" : "brand-outline"
		},
		{
			"name" : "Cancel",
			"label" : "Cancel",
			"theme" : "destructive-text"
		}
	]
	
},
"targetType": "Aura/LWC Component"
}

Clean JSON.

CODE

{
"icon": "utility:delete",
"recordLevel": "single+multiple",
"shortcut": "Ctrl + C",
"showInToolBar": true,
"targetConfiguration": {
	"componentName":"c:TestCmp",
	"title" : "This is Test Cmp",
	"height":"60rem",
	"width" : "60rem",
	"bodyCss" : "background-color:red",
	"componentParams":{
		"records":"{!selectedRecords}",
		"anyAttribute" : "anyValue"
	},
	"footerActions":[
		{
			"name" : "Next",
			"label" : "Next",
			"theme" : "brand-outline"
		},
		{
			"name" : "Cancel",
			"label" : "Cancel",
			"theme" : "destructive-text"
		}
	]
	
},
"targetType": "Aura/LWC Component"
}

Refer Out of Box Extension Actions Configuring Table Extension Actions

Mass Delete
Mass Assignment
Mass Clone

Aura Component

component.cmp

CODE

 <aura:method name="handleAction" action="{!c.handleApplicationEvent}" access="global">
    <aura:attribute name="actionName" type="String" access="global" />
  </aura:method>
  <aura:attribute name="records" type="Object[]" access="global" />

componentController.js

CODE

handleApplicationEvent : function(component, event, helper) {
        let params = event.getParams();
        let eventName = params.name;
        let eventArguments= params.arguments;
        let paramName = eventArguments.actionName;
        if(eventName=='handleAction' && paramName == 'Cancel'){
              let params = {};
              let modelEvent = $A.get('e.tables:LightningModalEvent');
              params.refreshView = true; //if View need to be refreshed after action completes
              modelEvent.fire(params);
          }
	}

LWC Component

template.html

CODE

<template>
    Records:
    <br/>
    <template for:each={records} for:item="record">
        <p key={record.Id}>{record.Name}</p>
    </template>
  </template>

templateController.js

CODE

import { LightningElement,api } from 'lwc';

export default class MassCloneCmp extends LightningElement {
    @api records;
    @api 
    handleAction(actionName){
      console.log(actionName);
    }
    
    closeModal(){

        let params = {};
        params.refreshView = true; //if View need to be refreshed after action completes 
        
        // Fire the custom event
        this.dispatchEvent(new CustomEvent('closemodal', {
            detail: { 'actionName':'Next', data : params },
        }));
    }
}

templateController.js-meta.xml

CODE

 <isExposed>true</isExposed>