/** * @license *------------------------------------------------------------------------------------------- * Copyright © 2026 Progress Software Corporation. All rights reserved. * Licensed under commercial license. See LICENSE.md in the package root for more information *------------------------------------------------------------------------------------------- */ import { CompositeFilterDescriptor } from '@progress/kendo-data-query'; import { SpeechToTextButtonProps } from '@progress/kendo-react-buttons'; import { GridToolbarAIAssistantRequestData } from '../../../index.js'; import { GridSmartBoxAIAssistantSearchProps, GridSmartBoxSearchProps } from './SearchTypes'; import { TextBoxProps } from '@progress/kendo-react-inputs'; import { GridSmartBoxHistoryProps } from './utilTypes'; import { GridAIRequestConfig, GridAIHttpClient } from '../../../hooks/useGridAIRequest.js'; /** * Represents the available modes for the SmartBox component. * * - `search` - Standard text search mode with filtering capabilities * - `semanticSearch` - AI-powered semantic search mode * - `aiAssistant` - AI assistant mode for natural language grid operations */ export type SmartBoxMode = 'search' | 'semanticSearch' | 'aiAssistant'; /** * Represents a history item stored in the SmartBox history. */ export interface HistoryItem { /** * The text content of the history item. */ text: string; /** * The timestamp when the history item was created. */ timestamp: Date; /** * Optional format string for displaying the timestamp. */ format?: string; } /** * Represents the event data passed when an AI prompt request is initiated. */ export interface GridSmartBoxRequestEvent { /** * The request data containing prompt message, columns, and request options. */ requestData: GridToolbarAIAssistantRequestData; } /** * Base interface for search events containing filter descriptor and search value. */ interface GridSmartBoxSearchBaseEvent extends CompositeFilterDescriptor { /** * The search value entered by the user. */ searchValue: string; } /** * Represents the event data passed when a search is performed. */ export interface GridSmartBoxSearchEvent extends GridSmartBoxSearchBaseEvent { /** * Returns whether the default action has been prevented. * * @returns `true` if the default action was prevented, otherwise `false`. */ isDefaultPrevented: () => boolean; /** * Prevents the default search action from being executed. * Use this to handle the search manually. */ preventDefault: () => void; } /** * Represents the event data passed when an AI response is received successfully. */ export interface GridSmartBoxResponseSuccessEvent { /** * The response data from the AI service. */ response: any; } /** * Represents the event data passed when an AI response returns an error. */ export interface GridSmartBoxResponseErrorEvent { /** * The error object or message from the failed AI request. */ error: any; } /** * Configuration options for the semantic search mode. */ export interface GridSmartBoxSemanticSearchConfigProps { /** * Enables or disables the semantic search mode. */ enabled?: boolean; /** * Sets the placeholder text for the semantic search input. */ placeholder?: string; /** * Sets the debounce delay in milliseconds before triggering a semantic search. * * @default 500 */ delay?: number; /** * Configures the semantic search history settings. * Can be a boolean to enable/disable or an object with detailed settings. */ history?: boolean | GridSmartBoxHistoryProps; } /** * Configuration options for the AI assistant mode. * * The AI assistant supports three operational modes: * - **Auto mode**: Set `requestOptions` (with `url` property) - SmartBox handles the request automatically * - **Controlled mode**: Set `requestUrl` without `requestOptions` - SmartBox makes requests but you control loading state * - **Manual mode**: Don't set `requestUrl` or `requestOptions` - Handle requests yourself via `onAIPromptRequest` */ export interface GridSmartBoxAIAssistantConfigProps { /** * Enables or disables the AI assistant mode. */ enabled?: boolean; /** * Sets the placeholder text for the AI assistant input. */ placeholder?: string; /** * Defines the URL to which the AI request will be sent. * When set without `requestOptions`, enables controlled mode. * * @example * ```tsx * // Controlled mode * * ``` */ requestUrl?: string; /** * Defines the options for the HTTP request. * Accepts both `GridAIRequestConfig` (recommended) and `AxiosRequestConfig` (legacy). * * @remarks * `GridAIRequestConfig` is recommended — no external dependency. * * @example * ```tsx * // Auto mode - SmartBox handles everything * * ``` */ requestOptions?: GridAIRequestConfig; /** * Optional custom HTTP client for the AI assistant. * When provided, overrides the built-in fetch-based transport. */ httpClient?: GridAIHttpClient; /** * List of suggested prompts to display in the popup. * * @example * ```tsx * * ``` */ promptSuggestions?: string[]; /** * Enables the speech-to-text functionality. * Can be a boolean to enable/disable or an object with SpeechToTextButton props. */ speechToTextButton?: boolean | SpeechToTextButtonProps; /** * Configures the AI assistant history settings. * Can be a boolean to enable/disable or an object with detailed settings. */ history?: boolean | GridSmartBoxHistoryProps; } /** * 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` (with `url`) - SmartBox handles requests automatically * - **Controlled mode**: Set `requestUrl` - SmartBox makes requests, you control loading state * - **Manual mode**: Don't set `requestUrl` or `requestOptions` - Handle requests via `onAIPromptRequest` * * @example * ```tsx * // Auto mode - SmartBox handles everything automatically * * * // Controlled mode - SmartBox makes requests, you control loading state * setIsLoading(true)} * onAIResponseSuccess={(e) => setIsLoading(false)} * /> * * // Manual mode - fully custom request handling * { * setIsLoading(true); * myCustomFetch(e.requestData).then(handleResponse); * }} * /> * ``` */ export interface GridSmartBoxAIAssistantProps extends Omit { /** * Configures the search mode settings. * Can be a boolean to enable/disable or an object with detailed settings. * * @example * ```tsx * * ``` */ searchConfig?: boolean | GridSmartBoxSearchProps; /** * Configures the semantic search mode settings. * Can be a boolean to enable/disable or an object with detailed settings. * * @example * ```tsx * * ``` */ semanticSearchConfig?: boolean | GridSmartBoxSemanticSearchConfigProps; /** * Configures the AI assistant mode settings. * Can be a boolean to enable/disable or an object with detailed settings. * * @example * ```tsx * * ``` */ aiAssistantConfig?: boolean | GridSmartBoxAIAssistantConfigProps; /** * Sets the currently active mode. * * @example * ```tsx * * ``` */ activeMode?: SmartBoxMode; /** * Sets the text direction. * * @default 'ltr' */ dir?: 'ltr' | 'rtl'; /** * Sets the size of the SmartBox. * * @default 'medium' * * @example * ```tsx * * ``` */ size?: 'small' | 'medium' | 'large'; /** * Sets whether the SmartBox is in loading state. * Use this for controlled mode to manage loading state externally. * * @example * ```tsx * setIsLoading(true)} /> * ``` */ loading?: boolean; /** * Custom render function for prompt suggestions. * * @example * ```tsx * ( *
  • {suggestion}
  • * )} * /> * ``` */ promptSuggestionRender?: (suggestion: string, onClick: () => void) => React.ReactNode; /** * Custom render function for history items. * * @example * ```tsx * ( *
  • * {item.text} - {item.timestamp.toLocaleString()} *
  • * )} * /> * ``` */ historyItemRender?: (item: HistoryItem, onClick: () => void) => React.ReactNode; /** * Props to pass to the TextBox component. */ textboxProps?: TextBoxProps; /** * Fires when the SmartBox popup opens. * * @example * ```tsx * console.log('Popup opened')} /> * ``` */ onOpen?: () => void; /** * Fires when the SmartBox popup closes. * * @example * ```tsx * console.log('Popup closed')} /> * ``` */ onClose?: () => void; /** * Fires when the SmartBox input is focused. */ onFocus?: () => void; /** * Fires when the SmartBox input is blurred. */ onBlur?: () => void; /** * Fires when a search is performed in Search mode. * The event contains the search value and filter descriptor. * * @example * ```tsx * { * console.log('Search value:', event.searchValue); * // Prevent default filtering if needed * event.preventDefault(); * }} * /> * ``` */ onSearch?: (event: GridSmartBoxSearchEvent) => void; /** * Fires when a search is performed in Semantic Search mode. * The event contains the search value and filter descriptor. * * @example * ```tsx * { * console.log('Semantic search:', event.searchValue); * }} * /> * ``` */ onSemanticSearch?: (event: GridSmartBoxSearchEvent) => void; /** * Fires when an AI prompt request is initiated. * Use this callback to intercept requests, modify data, or handle requests manually. * * @example * ```tsx * // Controlled mode - intercept and modify request * { * console.log('Prompt:', event.requestData.promptMessage); * setLoading(true); * }} * /> * * // Manual mode - handle request yourself * { * fetch('/api/ai', { * method: 'POST', * body: JSON.stringify(event.requestData) * }).then(handleResponse); * }} * /> * ``` */ onAIPromptRequest?: (event: GridSmartBoxRequestEvent) => void; /** * Fires when an AI response is received successfully. * Only fires in auto or controlled mode when a `requestUrl` is configured. * * @example * ```tsx * { * console.log('AI response:', event.response); * setLoading(false); * }} * /> * ``` */ onAIResponseSuccess?: (event: GridSmartBoxResponseSuccessEvent) => void; /** * Fires when an AI response returns an error. * Only fires in auto or controlled mode when a `requestUrl` is configured. * * @example * ```tsx * { * console.error('AI error:', event.error); * setLoading(false); * }} * /> * ``` */ onAIResponseError?: (event: GridSmartBoxResponseErrorEvent) => void; /** * Fires when an AI request is cancelled by the user. * The user can cancel by clicking the stop button during loading. * * @example * ```tsx * { * console.log('Request cancelled'); * setLoading(false); * }} * /> * ``` */ onAICancelRequest?: () => void; } export {};