You are here:
Custom Lightning Types in the Salesforce Mobile App
Show rich, interactive UI in Agentforce conversations on the Salesforce mobile app by using custom Lightning types (CLTs) with Lightning web component (LWC) overrides.
When users interact with Agentforce in the Salesforce mobile app, agent responses are typically plain text. Custom Lightning types upgrade those responses by rendering structured, interactive widgets directly in the chat conversation. Instead of reading text descriptions, users can view styled data cards, tap buttons, pick dates, or interact with custom UI components.
How Custom Lightning Types Work on Mobile
In the Salesforce mobile app, CLTs render LWC components inside a WebView. You build your
custom editor or renderer component as a standard LWC, then configure the
lightningMobileGenAi channel in your LightningTypeBundle metadata so the
mobile app knows which component to show.
This approach enables you to reuse existing desktop LWC components on mobile. If you
configure both the lightningDesktopGenAi and
lightningMobileGenAi channels, the same component can serve both desktop
and mobile . You can also configure them independently to provide channel-specific
experiences.
LWC Form Factor Requirement
LWC components used as CLT overrides on mobile must include the Small form
factor in the component's js-meta.xml file. Without this declaration, the
component doesn't render on mobile. Include both Small and
Large to support desktop and mobile with the same component.
<supportedFormFactors>
<supportedFormFactor type="Small"/>
<supportedFormFactor type="Large"/>
</supportedFormFactors>Configure Custom Lightning Types for Mobile
You can configure CLTs for the Salesforce mobile app through Setup or through metadata deployment. In Setup, open your custom Lightning type, select the UI Configuration tab, and select Agentforce (Mobile) from the Channel dropdown. From there, configure your editor or renderer override with a custom LWC component.
Alternatively, add a lightningMobileGenAi folder to your
LightningTypeBundle and include an editor.json or
renderer.json file.
+--lightningTypes
+--myType
+--schema.json
+--lightningDesktopGenAi
+--renderer.json
+--lightningMobileGenAi
+--renderer.jsonDeploy the bundle by using Salesforce CLI or Metadata API. For detailed steps on creating and configuring custom Lightning types through Setup and metadata, see Lightning Types and Lightning Types Developer Guide.
Availability by Agent Type
| Employee Agents | Service Agents | |
|---|---|---|
| CLT enablement | Enabled by default | Requires enableLightningTypes feature flag |
| LWC overrides (Salesforce mobile app) | Requires enableHybridComponent feature flag |
Not yet available |
| Where agents run | Salesforce mobile app and third-party apps | Third-party apps |
Limitations
- Only top-level component overrides are supported on mobile. Property-level overrides of LWC components aren't supported for renderer or editor.
- Collection renderer overrides aren't supported on mobile.
- Native component overrides (
AFMobileCustom/) are available only in third-party apps that use the Agentforce Mobile SDK. They aren't supported in the Salesforce mobile app. See Agentforce Mobile SDK Developer Guide.
