Configure a Component for Quick Actions

To use a Lightning web component as a quick action, define the component’s metadata.

There are two types of LWC quick actions: screen quick actions and headless quick actions.

A screen quick action displays a component in a modal window. See Create Screen Quick Actions.
A headless quick action executes custom code you provide in an @api invoke() method. See Create Headless Quick Actions.

You can use a Lightning web component as a quick action on record pages only. You can’t use a Lightning web component as a global quick action.

A component’s project folder must include a componentName.js-meta.xml configuration file that defines the metadata values for the component. To use a component as a quick action, configure the file with these steps.

In targets, add lightning__RecordAction as a target to designate the Lightning web component as a quick action on a record page.
Add a targetConfig and set targets to lightning__RecordAction.
Set actionType to ScreenAction or Action to choose the quick action type. If you don’t specify actionType, the quick action defaults to a screen action.

This configuration file defines a screen action.

This configuration file defines a headless action.

You can't change the action type after you've defined it in your Lightning web component. For example, a component's action type can't be changed from Action to ScreenAction or vice versa.

See the complete list of XML Configuration File Elements.

In Salesforce Setup, create object-specific actions via the Object Manager page. Then add the action to the Salesforce Mobile and Lightning Experience Actions section of your page layout. See Quick Actions in Salesforce Help.

Using a Lightning web component as a quick action isn’t supported in the Salesforce mobile app.

See Also