New to KendoReact? Start a free 30-day trial

GridToolbarAIAssistant

Component

Definition

Package:@progress/kendo-react-grid

Properties Interface:GridToolbarAIAssistantProps

Properties

enableSpeechToText?

boolean | SpeechToTextButtonProps

Enables the speech-to-text functionality for the input of the GridToolbarAIAssistant.

Example:

jsx

<GridToolbarAIAssistant enableSpeechToText={true} />

gridAIPrompt?

CustomComponent<GridAIPromptProps>

Customizes the AI prompt component.

Example:

jsx

<GridToolbarAIAssistant gridAIPrompt={MyCustomPromptComponent} />

httpClient?

GridAIHttpClient

Optional custom HTTP client for the AI assistant. When not provided, the component uses the built-in fetch-based transport.

Example:

tsx

import axios from 'axios';
import { createAxiosAIClient } from '@progress/kendo-react-grid';

<GridToolbarAIAssistant httpClient={createAxiosAIClient(axios)} />

icon?

string

Defines the icon rendered in the GridToolbarAIAssistant tool (see example).

Example:

jsx

<GridToolbarAIAssistant icon="home" />

loading?

boolean

Defines if the AI prompt is in loading mode.

Example:

jsx

<GridToolbarAIAssistant loading={true} />

onCloseWindow?

() => void

The method that will be called to close the column menu.

Example:

jsx

<GridToolbarAIAssistant onCloseWindow={() => console.log('close menu');} />

onPromptRequest?

(request: GridAIRequestData, isRetry: boolean) => void

Called before the request is sent.

Parameters:requestGridAIRequestDataisRetry?boolean

Example:

jsx

<GridToolbarAIAssistant onPromptRequest={(request) => console.log(request)} />

onResponseError?

(error: any) => void

Called when the response returns an error.

Parameters:errorany

Example:

jsx

<GridToolbarAIAssistant onResponseError={(error) => console.error(error)} />

onResponseSuccess?

(response: GridAIResponse<any>, promptMessage: string, isRetry: boolean) => void

Called when the response is received.

Parameters:responseGridAIResponse<any>promptMessage?stringisRetry?boolean

Example:

jsx

<GridToolbarAIAssistant onResponseSuccess={(response) => console.log(response)} />

outputs?

AIPromptOutputInterface[]

Defines the outputs of the AI prompt.

Example:

jsx

<GridToolbarAIAssistant outputs={[{ id: 1, title: 'Output 1', responseContent: '...' }]} />

promptPlaceHolder?

string

Defines the placeholder text for the AI prompt input.

Example:

jsx

<GridToolbarAIAssistant promptPlaceHolder="Ask AI to filter, sort or group" />

requestOptions?

GridAIRequestConfig

Defines the options for the HTTP request. Accepts both the new GridAIRequestConfig and the legacy AxiosRequestConfig.

Example:

jsx

<GridToolbarAIAssistant requestOptions={{ timeout: 5000 }} />

requestUrl?

string

Defines the URL to which the request will be sent.

Example:

jsx

<GridToolbarAIAssistant requestUrl="https://example.com/api/ai" />

role?

string

Defines the user role for the request. Defaults to 'user'.

Example:

jsx

<GridToolbarAIAssistant role="admin" />

show?

boolean

Specifies if the popup will be displayed.

Example:

jsx

<GridToolbarAIAssistant show={true} />

streaming?

boolean

Defines if the AI prompt is in streaming mode.

Example:

jsx

<GridToolbarAIAssistant streaming={true} />

suggestionsList?

string[]

Defines the list of suggestions for the AI prompt.

Example:

jsx

<GridToolbarAIAssistant suggestionsList={['Sort by Amount', 'Group by Account Type']} />

svgIcon?

SVGIcon

Defines the SVG icon rendered in the GridToolbarAIAssistant tool (see example).

Example:

jsx

import { gearIcon } from '@progress/kendo-svg-icons';

<GridToolbarAIAssistant svgIcon={gearIcon} />

References

ref

GridToolbarAIAssistantHandle

Represents the handle interface for the GridToolbarAIAssistant component.