GridToolbarAIAssistantProps

Updated on Nov 7, 2025

Represents the props interface for the GridToolbarAIAssistant component. This component provides AI-powered functionality for grid operations through natural language prompts. Users can request sorting, filtering, grouping, and highlighting through conversational input.

tsx

<Grid data={products}>
  <GridToolbar>
    <GridToolbarAIAssistant
      requestUrl="/api/ai/grid"
      promptPlaceHolder="Ask AI to sort, filter, or group your data"
      suggestionsList={[
        'Sort products by price',
        'Show only electronics',
        'Group by category'
      ]}
      onResponseSuccess={(response) => console.log('AI processed:', response)}
    />
  </GridToolbar>
</Grid>

Name	Type	Default	Description
enableSpeechToText?	boolean | SpeechToTextButtonProps		Enables the speech-to-text functionality for the input of the GridToolbarAIAssistant. jsx <GridToolbarAIAssistant enableSpeechToText={true} />
gridAIPrompt?	CustomComponent<GridAIPromptProps>		Customizes the AI prompt component. jsx <GridToolbarAIAssistant gridAIPrompt={MyCustomPromptComponent} />
icon?	string		Defines the icon rendered in the GridToolbarAIAssistant tool (see example). jsx <GridToolbarAIAssistant icon="home" />
loading?	boolean		Defines if the AI prompt is in loading mode. jsx <GridToolbarAIAssistant loading={true} />
onCloseWindow?	() => void		The method that will be called to close the column menu. jsx <GridToolbarAIAssistant onCloseWindow={() => console.log('close menu');} />
onPromptRequest?	(request: GridToolbarAIAssistantRequestData, isRetry?: boolean) => void		Called before the request is sent. jsx <GridToolbarAIAssistant onPromptRequest={(request) => console.log(request)} />
onResponseError?	(error: any) => void		Called when the response returns an error. jsx <GridToolbarAIAssistant onResponseError={(error) => console.error(error)} />
onResponseSuccess?	(response: AxiosResponse<any>, promptMessage?: string, isRetry?: boolean) => void		Called when the response is received. jsx <GridToolbarAIAssistant onResponseSuccess={(response) => console.log(response)} />
outputs?	AIPromptOutputInterface[]		Defines the outputs of the AI prompt. jsx <GridToolbarAIAssistant outputs={[{ id: 1, title: 'Output 1', responseContent: '...' }]} />
promptPlaceHolder?	string		Defines the placeholder text for the AI prompt input. jsx <GridToolbarAIAssistant promptPlaceHolder="Ask AI to filter, sort or group" />
requestOptions?	AxiosRequestConfig<any>		Defines the options for the axios request. jsx <GridToolbarAIAssistant requestOptions={{ timeout: 5000 }} />
requestUrl?	string		Defines the URL to which the request will be sent. jsx <GridToolbarAIAssistant requestUrl="https://example.com/api/ai" />
role?	string		Defines the user role for the request. Defaults to 'user'. jsx <GridToolbarAIAssistant role="admin" />
show?	boolean		Specifies if the popup will be displayed. jsx <GridToolbarAIAssistant show={true} />
streaming?	boolean		Defines if the AI prompt is in streaming mode. jsx <GridToolbarAIAssistant streaming={true} />
suggestionsList?	string[]		Defines the list of suggestions for the AI prompt. jsx <GridToolbarAIAssistant suggestionsList={['Sort by Amount', 'Group by Account Type']} />
svgIcon?	SVGIcon		Defines the SVG icon rendered in the GridToolbarAIAssistant tool (see example). jsx import { gearIcon } from '@progress/kendo-svg-icons'; <GridToolbarAIAssistant svgIcon={gearIcon} />