Disable the KendoReact Chat Context Menu

Updated on Aug 28, 2026

Environment

Product Version	16.0.0
Product	Progress® KendoReact Conversational UI

Description

I want to disable the context menu when users right-click messages in the KendoReact Chat.

This KB also answers the following questions:

• How can I disable the context menu in the KendoReact Chat?
• How do I prevent the Chat context menu from opening on right-click?
• How do I prevent the browser and Chat context menus from opening when users right-click?

Solution

Handle onContextMenuCapture on a wrapper around the Chat. To disable only the Chat context menu and keep the browser's native menu available, call stopPropagation without calling preventDefault.

The following snippet prevents the Chat context menu while allowing the browser context menu:

tsx

import * as React from 'react';
import { Chat } from '@progress/kendo-react-conversational-ui';

const preventChatContextMenu = (event: React.MouseEvent<HTMLDivElement>) => {
    event.stopPropagation();
};

const App = () => (
    <div onContextMenuCapture={preventChatContextMenu}>
        {/* Use your application's message collection here. */}
        <Chat messages={messages} authorId={1} />
    </div>
);

If you also want to disable the browser context menu, call preventDefault in the same capture handler:

tsx

const preventAllContextMenus = (event: React.MouseEvent<HTMLDivElement>) => {
    event.preventDefault();
    event.stopPropagation();
};

Both approaches apply to all right-clicks inside the wrapper, including the input area.

See Also

• Message Tools
• Chat API Reference