GridSmartBoxAIAssistantProps
Represents the props for the SmartBox component. SmartBox provides a unified search interface with three modes: standard search, semantic search, and AI assistant for natural language grid operations.
The AI assistant supports three operational modes configured via aiAssistantConfig:
- Auto mode: Set
requestOptions(withurl) - SmartBox handles requests automatically - Controlled mode: Set
requestUrl- SmartBox makes requests, you control loading state - Manual mode: Don't set
requestUrlorrequestOptions- Handle requests viaonAIPromptRequest
Definition
Package:@progress/kendo-react-grid
Syntax:
// Auto mode - SmartBox handles everything automatically
<SmartBox
aiAssistantConfig={{
enabled: true,
requestOptions: {
url: '/api/ai/grid',
timeout: 5000
},
promptSuggestions: ['Sort by price', 'Filter active items']
}}
searchConfig={{ enabled: true }}
/>
// Controlled mode - SmartBox makes requests, you control loading state
<SmartBox
loading={isLoading}
aiAssistantConfig={{
enabled: true,
requestUrl: '/api/ai/grid'
}}
onAIPromptRequest={(e) => setIsLoading(true)}
onAIResponseSuccess={(e) => setIsLoading(false)}
/>
// Manual mode - fully custom request handling
<SmartBox
loading={isLoading}
aiAssistantConfig={{ enabled: true }}
onAIPromptRequest={(e) => {
setIsLoading(true);
myCustomFetch(e.requestData).then(handleResponse);
}}
/>Properties
Sets the currently active mode.
Configures the AI assistant mode settings. Can be a boolean to enable/disable or an object with detailed settings.
dir?
"ltr" | "rtl"
Sets the text direction.
'ltr'
enabled?
boolean
Specifies whether the mode is enabled.
history?
boolean | GridSmartBoxHistoryProps
Sets the settings for the history queries of all modes.
When set to true, enables history with default settings for all modes.
When set to false, disables history for all modes.
When set to an object, configures the history settings for all modes.
This shared setting overrides individual mode history settings (e.g., searchConfig.history).
Custom render function for history items.
loading?
boolean
Sets whether the SmartBox is in loading state. Use this for controlled mode to manage loading state externally.
onAICancelRequest?
() => void
Fires when an AI request is cancelled by the user. The user can cancel by clicking the stop button during loading.
onAIPromptRequest?
(event: GridSmartBoxRequestEvent) => void
Fires when an AI prompt request is initiated. Use this callback to intercept requests, modify data, or handle requests manually.
onAIResponseError?
(event: GridSmartBoxResponseErrorEvent) => void
Fires when an AI response returns an error.
Only fires in auto or controlled mode when a requestUrl is configured.
onAIResponseSuccess?
(event: GridSmartBoxResponseSuccessEvent) => void
Fires when an AI response is received successfully.
Only fires in auto or controlled mode when a requestUrl is configured.
onBlur?
() => void
Fires when the SmartBox input is blurred.
onClose?
() => void
Fires when the SmartBox popup closes.
onFocus?
() => void
Fires when the SmartBox input is focused.
onOpen?
() => void
Fires when the SmartBox popup opens.
onSearch?
(event: GridSmartBoxSearchEvent) => void
Fires when a search is performed in Search mode. The event contains the search value and filter descriptor.
onSemanticSearch?
(event: GridSmartBoxSearchEvent) => void
Fires when a search is performed in Semantic Search mode. The event contains the search value and filter descriptor.
placeholder?
string
Sets the placeholder text for the SmartBox input.
Custom render function for prompt suggestions.
ReactNode
searchConfig?
boolean | GridSmartBoxSearchProps
Configures the search mode settings. Can be a boolean to enable/disable or an object with detailed settings.
Configures the semantic search mode settings. Can be a boolean to enable/disable or an object with detailed settings.
size?
"small" | "medium" | "large"
Sets the size of the SmartBox.
'medium'
textboxProps?
TextBoxProps
Props to pass to the TextBox component.