skills.rest
cchrisv
cchrisvCOMMUNITY
Explore all skills by this author →
GitHub

implementing-ui-bundle-agentforce-conversation-client

Install and configure the AgentforceConversationClient wrapper to embed Salesforce chat widgets.

Updated Apr 19, 2026
Search Tags:#integration#react#styling#salesforce#agentforce#embedding#conversation-client
One-click install
npx skills add https://github.com/cchrisv/professorFlowVisualPicker --skill implementing-ui-bundle-agentforce-conversation-client
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: implementing-ui-bundle-agentforce-conversation-client
Source: https://github.com/cchrisv/professorFlowVisualPicker/tree/main/.agents/skills/implementing-ui-bundle-agentforce-conversation-client
Command: npx skills add https://github.com/cchrisv/professorFlowVisualPicker --skill implementing-ui-bundle-agentforce-conversation-client

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Embeds and governs the use of the official AgentforceConversationClient wrapper to integrate Salesforce chat capabilities without building a custom widget, ensuring safe, compliant usage across apps.

Core Features & Use Cases

  • Ensures you import the canonical AgentforceConversationClient package and render it in existing app components.
  • Guides you through validating agent IDs (18-character IDs starting with 0Xx) and providing a real agentId for new deployments.
  • Enforces theming and sizing through the styleTokens prop, while always avoiding CSS-based styling or inline style attributes.
  • Use cases include embedding the chat on Flow screens or pages, updating agent-related props (inline vs floating, width, height, header, and labeling) without rewriting implementation.

Quick Start

Import the canonical AgentforceConversationClient and render it with a valid 18-character agentId in your app.

Frequently Asked Questions about implementing-ui-bundle-agentforce-conversation-client

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I embed a Salesforce Agentforce chat widget in a React app?▼

You embed a Salesforce Agentforce chat widget by importing the canonical AgentforceConversationClient wrapper and rendering it inside your existing app components with a valid agentId prop.

What is the correct format for an Agentforce agentId?▼

An Agentforce agentId is a real 18-character ID starting with 0Xx. Providing a valid agentId is required to successfully render and connect the Salesforce chat widget.

Can I style the Agentforce conversation client using CSS or inline styles?▼

No, you cannot use CSS or inline styles for the Agentforce conversation client. You must apply theming and sizing configurations exclusively through the styleTokens prop.

How do I update an existing Agentforce chat widget configuration?▼

You update an existing Agentforce chat widget by modifying agent-related props such as inline vs floating, width, height, and labeling in-place on the rendered component, avoiding edits to the underlying implementation.

Does the Agentforce conversation client require building custom components?▼

No, the Agentforce conversation client does not require building custom components. You use the official AgentforceConversationClient wrapper to embed Salesforce chat capabilities directly into existing apps.

Related Skills

Explore More Software Engineering Skills→
padjeipadjei

experience-ui-bundle-agentforce-client-generate

Manage Agentforce Conversation Client configuration within Salesforce UI Bundle projects.

Community
Advanced
acquiaacquia
16

canvas-component-utils

Render formatted HTML and responsive images from Drupal Canvas component props.

Official
Basic
forcedotcomforcedotcom
803

implementing-ui-bundle-agentforce-conversation-client

Embeds AgentforceConversationClient React component in Salesforce UI bundle apps with styleTokens validation.

Official
Intermediate
forcedotcomforcedotcom
803

embedded-agent

Integrate Salesforce Agentforce chat into React applications with configurable rendering.

Official
Advanced