@progress/kendo-react-conversational-ui/README.md

React Chat component allows the user to participate in chat sessions with users or chat bots. KendoReact Conversational UI components

[![KendoReact NPM Banner](https://raw.githubusercontent.com/telerik/kendo-react/master/images/kendoreact-github-banner.png)](https://www.telerik.com/kendo-react-ui/components/free?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui&utm_content=banner)

# KendoReact Conversational UI Library for React

> **Important**
>
> -   This package is а part of [KendoReact](https://www.telerik.com/kendo-react-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui)—an enterprise-grade UI library with 120+ free and premium components.
> -   To use this package, you must install a license key file, whether you are on a paid license or a 30-day free trial. To receive a license key, either [purchase a license](https://www.telerik.com/kendo-react-ui/pricing) or start a [free trial](https://www.telerik.com/download-login-v2-kendo-react-ui).
> -   It provides premium KendoReact components and features. You will need to install a license key when adding the package to your project. For more information, please refer to the [KendoReact My License page](https://www.telerik.com/kendo-react-ui/components/my-license/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui).
> -   To receive a license key, you need to either [purchase a license](https://www.telerik.com/kendo-react-ui/pricing?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui) or register for a [free trial](https://www.telerik.com/try/kendo-react-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui). Doing so indicates that you [accept the KendoReact License Agreement](https://www.telerik.com/purchase/license-agreement/progress-kendoreact?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui).
> -   The 30-day free trial gives you access to all KendoReact components and their full functionality. Additionally, for the period of your trial, you can use our legendary technical support provided directly by the KendoReact dev team!
>
> [Start using KendoReact](https://www.telerik.com/try/kendo-react-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui) and speed up your development process!
>
> If you're looking for free React components, check out [Get Started with KendoReact Free](https://www.telerik.com/kendo-react-ui/components/free).

The KendoReact Conversational UI library provides a set of React components—such as Chat, AIPrompt, and InlineAIPrompt—that enable you to build modern conversational experiences, including chat interfaces, AI-powered prompts, and seamless user interactions with both humans and bots.

How to start:

```sh
npm i @progress/kendo-react-conversational-ui
```

What's in this package:

-   [React Conversational UI Components Library Features](#react-conversational-ui-components-library-features)
-   [React AIPrompt Component (premium)](#react-aiprompt-component)
-   [React Chat Component (premium)](#react-chat-component)
-   [React InlineAIPrompt Component (premium)](#react-inlineaiprompt-component)

Additional information:

-   [Support Options](#support-options)
-   [Resources](#resources)
-   [KendoReact Conversational UI API](https://www.telerik.com/kendo-react-ui/components/conversationalui/api)

## React Conversational UI Components Library Features

Among the many features which the KendoReact Conversational UI components deliver are:

-   **Accessibility support**—The Conversational UI components are compliant with WAI-ARIA and Section 508.
-   **Keyboard navigation**—All components provide comprehensive keyboard navigation support.
-   **Globalization**—The Conversational UI components come with globalization features that allow you to create applications that can be used all over the world.
-   [**Theme support**](https://www.telerik.com/kendo-react-ui/components/styling/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui)—The KendoReact Conversational UI components, as well as all 120+ components in the KendoReact suite, are styled in three polished themes (Bootstrap, Material, and Default) and can be further customized to match your specific design guidelines.

## React AIPrompt Component

> This is a KendoReact **premium component** and requires a commercial license or an active trial license.

[The KendoReact AIPrompt component](https://www.telerik.com/kendo-react-ui/components/conversationalui/ai-prompt?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui) enables you to add AI-driven prompt capabilities to your applications. It is designed to facilitate user interactions with AI models, allowing for dynamic suggestions, completions, or contextual assistance. The component can be integrated with various AI services and customized to fit your application's needs, supporting features like streaming responses, custom views, and prompt commands.

Key features include:

-   [**Suggestions**](https://www.telerik.com/kendo-react-ui/components/conversationalui/ai-prompt/suggestions/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui)—Create custom prompt suggestions to guide user interactions.
-   [**Streaming responses**](https://www.telerik.com/kendo-react-ui/components/conversationalui/ai-prompt/streaming/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui)—Display AI responses progressively as they are generated in real-time.
-   [**Custom commands**](https://www.telerik.com/kendo-react-ui/components/conversationalui/ai-prompt/commands/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui)—Define custom prompt commands for specialized AI interactions.
-   [**Customization options**](https://www.telerik.com/kendo-react-ui/components/conversationalui/ai-prompt/customization/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui)—Customize component appearance and behavior to match your application needs.
-   [**Events support**](https://www.telerik.com/kendo-react-ui/components/conversationalui/ai-prompt/events/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui)—Handle various user interactions and AI response events.

## React Chat Component

> This is a KendoReact **premium component** and requires a commercial license or an active trial license.

[The KendoReact Chat component](https://www.telerik.com/kendo-react-ui/components/conversationalui/chat?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui) allows users to engage in real-time conversations with other users, chatbots or AI models.

The KendoReact Chat component provides a flexible conversational interface that helps boost user engagement in web applications. It enables seamless real-time communication and supports advanced features, such as AI-powered conversation mode, speech-to-text button, attachments, predefined quick actions for the user. The Chat component is ideal for implementing customer support chatbots, live help desks, virtual assistants for booking or scheduling, interactive FAQ systems, and more.

Key features include:

-   [**Data binding**](https://www.telerik.com/kendo-react-ui/components/conversationalui/chat/data-binding/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui)—Bind the message list to streaming data from remote services and automated responses.
-   [**AI Service Integration**](https://www.telerik.com/kendo-react-ui/components/conversationalui/chat/integrations/ai-llm/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui)—Use the Chat component with AI models.
-   [**Message Toolbar & ContextMenu**](https://www.telerik.com/kendo-react-ui/components/conversationalui/chat/messages/tools/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui)—Add message tools and context menu options to make users' experience more interactive.
-   [**Message Customization & Templates**](https://www.telerik.com/kendo-react-ui/components/conversationalui/chat/customization/message-templates/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui)—Customize the message bubbles and other Chat features like header, message box, timestamp, suggestions, timestamp, etc.
-   [**Suggestions and quick message actions**](https://www.telerik.com/kendo-react-ui/components/conversationalui/chat/quick-actions/suggestions/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui)—Display suggested and quick actions buttons for faster interaction and communication.

## React InlineAIPrompt Component

> This is a KendoReact **premium component** and requires a commercial license or an active trial license.

[The KendoReact InlineAIPrompt component](https://www.telerik.com/kendo-react-ui/components/conversationalui/inline-ai-prompt?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui) allows you to embed AI prompts seamlessly within chat messages or conversational flows. This enables users to interact with AI suggestions or actions directly in the context of their ongoing conversation, enhancing the user experience and streamlining workflows. The component can be integrated within existing chat interfaces to provide contextual AI assistance.

Key features include:

-   [**Commands**](https://www.telerik.com/kendo-react-ui/components/conversationalui/inline-ai-prompt/commands/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui)—Create custom commands and output actions for specialized AI interactions.
-   [**Customization**](https://www.telerik.com/kendo-react-ui/components/conversationalui/inline-ai-prompt/customization/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui)—Customize components to fit your application's specific requirements.
-   **Streaming support**—Real-time AI response streaming for immediate feedback.

## Using for Free vs Commercial License

The following table outlines the key resources available with KendoReact and KendoReact Free.

|                                  | [KendoReact Free](https://www.telerik.com/kendo-react-ui/components/free)                                                                                                                                | [KendoReact](https://www.telerik.com/kendo-react-ui)                                                                                                                                                     |
| -------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| React components                 | 50+                                                                                                                                                                                                      | 120+                                                                                                                                                                                                     |
| Four professional themes         | <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z" stroke="white" stroke-width="2"/></svg> | <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z" stroke="white" stroke-width="2"/></svg> |
| Four Figma UI Kits               | <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z" stroke="white" stroke-width="2"/></svg> | <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z" stroke="white" stroke-width="2"/></svg> |
| Page Templates & Building Blocks | 1 template                                                                                                                                                                                               | <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z" stroke="white" stroke-width="2"/></svg> |
| ThemeBuilder                     | Free\*                                                                                                                                                                                                   | Ultimate                                                                                                                                                                                                 |
| Source code                      | No                                                                                                                                                                                                       | <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z" stroke="white" stroke-width="2"/></svg> |
| Visual Studio Code extension     | 1 starter template                                                                                                                                                                                       | Full functionality                                                                                                                                                                                       |
| Legendary customer support       | No                                                                                                                                                                                                       | <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z" stroke="white" stroke-width="2"/></svg> |
| AI coding assistant              | No                                                                                                                                                                                                       | <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M20.285 2l-11.285 11.567-5.286-5.011-3.714 3.716 9 8.728 15-15.285z" stroke="white" stroke-width="2"/></svg> |

## Support Options

For any issues you might encounter while working with the KendoReact Chat, use any of the available support channels:

-   Industry-leading technical support&mdash;KendoReact paid license holders and users with an active (free) trial license can take advantage of our outstanding customer support. To submit a ticket, use [the dedicated KendoReact support system](https://www.telerik.com/account/support-center/contact-us/technical-support?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-chat).
-   Product forums&mdash;The [KendoReact forums](https://www.telerik.com/forums/kendo-ui-react?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-chat) are part of the free support you can get from the community and from the KendoReact team.
-   Feedback portal&mdash;The [KendoReact feedback portal](https://feedback.telerik.com/kendo-react-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-chat) is where you can request and vote for new features to be added.

## Resources

-   [Getting Started with KendoReact](https://www.telerik.com/kendo-react-ui/components/getting-started/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui)
-   [Get Started with KendoReact Free](https://www.telerik.com/kendo-react-ui/components/free)
-   [Get Started with KendoReact Conversational UI](https://www.telerik.com/kendo-react-ui/components/conversationalui/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui)
-   [API Reference of the KendoReact Conversational UI](https://www.telerik.com/kendo-react-ui/components/conversationalui/api/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui)
-   [KendoReact Roadmap](https://www.telerik.com/support/whats-new/kendo-react-ui/roadmap?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui)
-   [Blogs](https://www.telerik.com/blogs/tag/kendoreact?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui)
-   [Demos, documentation, and component reference](https://www.telerik.com/kendo-react-ui/components/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui)
-   [KendoReact pricing and licensing](https://www.telerik.com/kendo-react-ui/pricing?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui)
-   [Changelog](https://www.telerik.com/kendo-react-ui/components/changelogs/ui-for-react/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-conversational-ui)

High-level component overview pages

-   [React Conversational UI](https://www.telerik.com/kendo-react-ui/conversationalui)

_Copyright © 2025 Progress Software Corporation and/or its subsidiaries or affiliates. All Rights Reserved._

_Progress, Telerik, and certain product names used herein are trademarks or registered trademarks of Progress Software Corporation and/or one of its subsidiaries or affiliates in the U.S. and/or other countries._