@progress/kendo-react-grid 14.0.0-develop.1 → 14.0.0-develop.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/columnMenu/GridColumnMenuFilter.mjs +2 -2
- package/components/noRecords/GridNoRecordsContainer.mjs +1 -1
- package/constants/index.mjs +2 -2
- package/dist/cdn/js/kendo-react-grid.js +1 -1
- package/hooks/index.d.ts +8 -0
- package/hooks/useGridAIRequest.d.ts +150 -0
- package/hooks/useGridAIRequest.js +8 -0
- package/hooks/useGridAIRequest.mjs +93 -0
- package/index.d.mts +3 -1
- package/index.d.ts +3 -1
- package/index.js +1 -1
- package/index.mjs +56 -50
- package/messages/index.d.ts +75 -0
- package/messages/index.js +2 -2
- package/messages/index.mjs +108 -78
- package/package-metadata.js +1 -1
- package/package-metadata.mjs +1 -1
- package/package.json +19 -19
- package/toolbar-tools/GridToolbarAIAssistant.d.ts +2 -34
- package/toolbar-tools/GridToolbarAIAssistant.js +2 -2
- package/toolbar-tools/GridToolbarAIAssistant.mjs +167 -164
- package/toolbar-tools/GridToolbarFilter.mjs +5 -5
- package/toolbar-tools/smartbox/SegmentedControl.d.ts +13 -0
- package/toolbar-tools/smartbox/SegmentedControl.js +8 -0
- package/toolbar-tools/smartbox/SegmentedControl.mjs +109 -0
- package/toolbar-tools/smartbox/SmartBox.d.ts +20 -0
- package/toolbar-tools/smartbox/SmartBox.js +8 -0
- package/toolbar-tools/smartbox/SmartBox.mjs +380 -0
- package/toolbar-tools/smartbox/defaultConfigs.d.ts +30 -0
- package/toolbar-tools/smartbox/defaultConfigs.js +8 -0
- package/toolbar-tools/smartbox/defaultConfigs.mjs +36 -0
- package/toolbar-tools/smartbox/hooks/index.d.ts +17 -0
- package/toolbar-tools/smartbox/hooks/useDebounce.d.ts +11 -0
- package/toolbar-tools/smartbox/hooks/useDebounce.js +9 -0
- package/toolbar-tools/smartbox/hooks/useDebounce.mjs +21 -0
- package/toolbar-tools/smartbox/hooks/useSmartBoxGridState.d.ts +245 -0
- package/toolbar-tools/smartbox/hooks/useSmartBoxGridState.js +9 -0
- package/toolbar-tools/smartbox/hooks/useSmartBoxGridState.mjs +54 -0
- package/toolbar-tools/smartbox/hooks/useSmartBoxHistory.d.ts +80 -0
- package/toolbar-tools/smartbox/hooks/useSmartBoxHistory.js +9 -0
- package/toolbar-tools/smartbox/hooks/useSmartBoxHistory.mjs +66 -0
- package/toolbar-tools/smartbox/hooks/useSmartBoxInput.d.ts +96 -0
- package/toolbar-tools/smartbox/hooks/useSmartBoxLabels.d.ts +93 -0
- package/toolbar-tools/smartbox/hooks/useSmartBoxLabels.js +9 -0
- package/toolbar-tools/smartbox/hooks/useSmartBoxLabels.mjs +61 -0
- package/toolbar-tools/smartbox/hooks/useSmartBoxListData.d.ts +163 -0
- package/toolbar-tools/smartbox/hooks/useSmartBoxListData.js +9 -0
- package/toolbar-tools/smartbox/hooks/useSmartBoxListData.mjs +102 -0
- package/toolbar-tools/smartbox/hooks/useSmartBoxModes.d.ts +115 -0
- package/toolbar-tools/smartbox/hooks/useSmartBoxModes.js +9 -0
- package/toolbar-tools/smartbox/hooks/useSmartBoxModes.mjs +65 -0
- package/toolbar-tools/smartbox/hooks/useSmartBoxPopup.d.ts +56 -0
- package/toolbar-tools/smartbox/hooks/useSmartBoxPopup.js +9 -0
- package/toolbar-tools/smartbox/hooks/useSmartBoxPopup.mjs +25 -0
- package/toolbar-tools/smartbox/hooks/useSmartBoxSearch.d.ts +82 -0
- package/toolbar-tools/smartbox/hooks/useSmartBoxSearch.js +9 -0
- package/toolbar-tools/smartbox/hooks/useSmartBoxSearch.mjs +67 -0
- package/toolbar-tools/smartbox/hooks/useSmartBoxSegmentedControl.d.ts +70 -0
- package/toolbar-tools/smartbox/hooks/useSmartBoxSegmentedControl.js +9 -0
- package/toolbar-tools/smartbox/hooks/useSmartBoxSegmentedControl.mjs +57 -0
- package/toolbar-tools/smartbox/index.d.ts +10 -0
- package/toolbar-tools/smartbox/interfaces/SearchTypes.d.ts +45 -0
- package/toolbar-tools/smartbox/interfaces/SegmentedControlTypes.d.ts +66 -0
- package/toolbar-tools/smartbox/interfaces/SmartBoxTypes.d.ts +461 -0
- package/toolbar-tools/smartbox/interfaces/index.d.ts +11 -0
- package/toolbar-tools/smartbox/interfaces/utilTypes.d.ts +25 -0
- package/toolbar-tools/smartbox/listItemRenders.d.ts +165 -0
- package/toolbar-tools/smartbox/listItemRenders.js +8 -0
- package/toolbar-tools/smartbox/listItemRenders.mjs +68 -0
- package/toolbar-tools/smartbox/utils.d.ts +14 -0
- package/toolbar-tools/smartbox/utils.js +8 -0
- package/toolbar-tools/smartbox/utils.mjs +14 -0
|
@@ -0,0 +1,461 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
import { CompositeFilterDescriptor } from '@progress/kendo-data-query';
|
|
9
|
+
import { SpeechToTextButtonProps } from '@progress/kendo-react-buttons';
|
|
10
|
+
import { GridToolbarAIAssistantRequestData } from '../../../index.js';
|
|
11
|
+
import { GridSmartBoxAIAssistantSearchProps, GridSmartBoxSearchProps } from './SearchTypes.js';
|
|
12
|
+
import { TextBoxProps } from '@progress/kendo-react-inputs';
|
|
13
|
+
import { GridSmartBoxHistoryProps } from './utilTypes.js';
|
|
14
|
+
import { AxiosRequestConfig } from 'axios';
|
|
15
|
+
/**
|
|
16
|
+
* Represents the available modes for the SmartBox component.
|
|
17
|
+
*
|
|
18
|
+
* - `search` - Standard text search mode with filtering capabilities
|
|
19
|
+
* - `semanticSearch` - AI-powered semantic search mode
|
|
20
|
+
* - `aiAssistant` - AI assistant mode for natural language grid operations
|
|
21
|
+
*/
|
|
22
|
+
export type SmartBoxMode = 'search' | 'semanticSearch' | 'aiAssistant';
|
|
23
|
+
/**
|
|
24
|
+
* Represents a history item stored in the SmartBox history.
|
|
25
|
+
*/
|
|
26
|
+
export interface HistoryItem {
|
|
27
|
+
/**
|
|
28
|
+
* The text content of the history item.
|
|
29
|
+
*/
|
|
30
|
+
text: string;
|
|
31
|
+
/**
|
|
32
|
+
* The timestamp when the history item was created.
|
|
33
|
+
*/
|
|
34
|
+
timestamp: Date;
|
|
35
|
+
/**
|
|
36
|
+
* Optional format string for displaying the timestamp.
|
|
37
|
+
*/
|
|
38
|
+
format?: string;
|
|
39
|
+
}
|
|
40
|
+
/**
|
|
41
|
+
* Represents the event data passed when an AI prompt request is initiated.
|
|
42
|
+
*/
|
|
43
|
+
export interface GridSmartBoxRequestEvent {
|
|
44
|
+
/**
|
|
45
|
+
* The request data containing prompt message, columns, and request options.
|
|
46
|
+
*/
|
|
47
|
+
requestData: GridToolbarAIAssistantRequestData;
|
|
48
|
+
}
|
|
49
|
+
/**
|
|
50
|
+
* Base interface for search events containing filter descriptor and search value.
|
|
51
|
+
*/
|
|
52
|
+
interface GridSmartBoxSearchBaseEvent extends CompositeFilterDescriptor {
|
|
53
|
+
/**
|
|
54
|
+
* The search value entered by the user.
|
|
55
|
+
*/
|
|
56
|
+
searchValue: string;
|
|
57
|
+
}
|
|
58
|
+
/**
|
|
59
|
+
* Represents the event data passed when a search is performed.
|
|
60
|
+
*/
|
|
61
|
+
export interface GridSmartBoxSearchEvent extends GridSmartBoxSearchBaseEvent {
|
|
62
|
+
/**
|
|
63
|
+
* Returns whether the default action has been prevented.
|
|
64
|
+
*
|
|
65
|
+
* @returns `true` if the default action was prevented, otherwise `false`.
|
|
66
|
+
*/
|
|
67
|
+
isDefaultPrevented: () => boolean;
|
|
68
|
+
/**
|
|
69
|
+
* Prevents the default search action from being executed.
|
|
70
|
+
* Use this to handle the search manually.
|
|
71
|
+
*/
|
|
72
|
+
preventDefault: () => void;
|
|
73
|
+
}
|
|
74
|
+
/**
|
|
75
|
+
* Represents the event data passed when an AI response is received successfully.
|
|
76
|
+
*/
|
|
77
|
+
export interface GridSmartBoxResponseSuccessEvent {
|
|
78
|
+
/**
|
|
79
|
+
* The response data from the AI service.
|
|
80
|
+
*/
|
|
81
|
+
response: any;
|
|
82
|
+
}
|
|
83
|
+
/**
|
|
84
|
+
* Represents the event data passed when an AI response returns an error.
|
|
85
|
+
*/
|
|
86
|
+
export interface GridSmartBoxResponseErrorEvent {
|
|
87
|
+
/**
|
|
88
|
+
* The error object or message from the failed AI request.
|
|
89
|
+
*/
|
|
90
|
+
error: any;
|
|
91
|
+
}
|
|
92
|
+
/**
|
|
93
|
+
* Configuration options for the semantic search mode.
|
|
94
|
+
*/
|
|
95
|
+
export interface GridSmartBoxSemanticSearchConfigProps {
|
|
96
|
+
/**
|
|
97
|
+
* Enables or disables the semantic search mode.
|
|
98
|
+
*/
|
|
99
|
+
enabled?: boolean;
|
|
100
|
+
/**
|
|
101
|
+
* Sets the placeholder text for the semantic search input.
|
|
102
|
+
*/
|
|
103
|
+
placeholder?: string;
|
|
104
|
+
/**
|
|
105
|
+
* Sets the debounce delay in milliseconds before triggering a semantic search.
|
|
106
|
+
*
|
|
107
|
+
* @default 500
|
|
108
|
+
*/
|
|
109
|
+
delay?: number;
|
|
110
|
+
/**
|
|
111
|
+
* Configures the semantic search history settings.
|
|
112
|
+
* Can be a boolean to enable/disable or an object with detailed settings.
|
|
113
|
+
*/
|
|
114
|
+
history?: boolean | GridSmartBoxHistoryProps;
|
|
115
|
+
}
|
|
116
|
+
/**
|
|
117
|
+
* Configuration options for the AI assistant mode.
|
|
118
|
+
*
|
|
119
|
+
* The AI assistant supports three operational modes:
|
|
120
|
+
* - **Auto mode**: Set `requestOptions` (with `url` property) - SmartBox handles the request automatically
|
|
121
|
+
* - **Controlled mode**: Set `requestUrl` without `requestOptions` - SmartBox makes requests but you control loading state
|
|
122
|
+
* - **Manual mode**: Don't set `requestUrl` or `requestOptions` - Handle requests yourself via `onAIPromptRequest`
|
|
123
|
+
*/
|
|
124
|
+
export interface GridSmartBoxAIAssistantConfigProps {
|
|
125
|
+
/**
|
|
126
|
+
* Enables or disables the AI assistant mode.
|
|
127
|
+
*/
|
|
128
|
+
enabled?: boolean;
|
|
129
|
+
/**
|
|
130
|
+
* Sets the placeholder text for the AI assistant input.
|
|
131
|
+
*/
|
|
132
|
+
placeholder?: string;
|
|
133
|
+
/**
|
|
134
|
+
* Defines the URL to which the AI request will be sent.
|
|
135
|
+
* When set without `requestOptions`, enables controlled mode.
|
|
136
|
+
*
|
|
137
|
+
* @example
|
|
138
|
+
* ```tsx
|
|
139
|
+
* // Controlled mode
|
|
140
|
+
* <SmartBox aiAssistantConfig={{ requestUrl: 'https://api.example.com/ai/grid' }} />
|
|
141
|
+
* ```
|
|
142
|
+
*/
|
|
143
|
+
requestUrl?: string;
|
|
144
|
+
/**
|
|
145
|
+
* Defines the options for the axios request.
|
|
146
|
+
* When set (with `url` property), enables auto mode where SmartBox handles requests automatically.
|
|
147
|
+
*
|
|
148
|
+
* @example
|
|
149
|
+
* ```tsx
|
|
150
|
+
* // Auto mode - SmartBox handles everything
|
|
151
|
+
* <SmartBox aiAssistantConfig={{
|
|
152
|
+
* requestOptions: {
|
|
153
|
+
* url: 'https://api.example.com/ai/grid',
|
|
154
|
+
* timeout: 5000,
|
|
155
|
+
* headers: { 'Authorization': 'Bearer token' }
|
|
156
|
+
* }
|
|
157
|
+
* }} />
|
|
158
|
+
* ```
|
|
159
|
+
*/
|
|
160
|
+
requestOptions?: AxiosRequestConfig;
|
|
161
|
+
/**
|
|
162
|
+
* List of suggested prompts to display in the popup.
|
|
163
|
+
*
|
|
164
|
+
* @example
|
|
165
|
+
* ```tsx
|
|
166
|
+
* <SmartBox aiAssistantConfig={{
|
|
167
|
+
* promptSuggestions: ['Sort by price', 'Filter active items', 'Group by category']
|
|
168
|
+
* }} />
|
|
169
|
+
* ```
|
|
170
|
+
*/
|
|
171
|
+
promptSuggestions?: string[];
|
|
172
|
+
/**
|
|
173
|
+
* Enables the speech-to-text functionality.
|
|
174
|
+
* Can be a boolean to enable/disable or an object with SpeechToTextButton props.
|
|
175
|
+
*/
|
|
176
|
+
speechToTextButton?: boolean | SpeechToTextButtonProps;
|
|
177
|
+
/**
|
|
178
|
+
* Configures the AI assistant history settings.
|
|
179
|
+
* Can be a boolean to enable/disable or an object with detailed settings.
|
|
180
|
+
*/
|
|
181
|
+
history?: boolean | GridSmartBoxHistoryProps;
|
|
182
|
+
}
|
|
183
|
+
/**
|
|
184
|
+
* Represents the props for the SmartBox component.
|
|
185
|
+
* SmartBox provides a unified search interface with three modes: standard search,
|
|
186
|
+
* semantic search, and AI assistant for natural language grid operations.
|
|
187
|
+
*
|
|
188
|
+
* The AI assistant supports three operational modes configured via `aiAssistantConfig`:
|
|
189
|
+
* - **Auto mode**: Set `requestOptions` (with `url`) - SmartBox handles requests automatically
|
|
190
|
+
* - **Controlled mode**: Set `requestUrl` - SmartBox makes requests, you control loading state
|
|
191
|
+
* - **Manual mode**: Don't set `requestUrl` or `requestOptions` - Handle requests via `onAIPromptRequest`
|
|
192
|
+
*
|
|
193
|
+
* @example
|
|
194
|
+
* ```tsx
|
|
195
|
+
* // Auto mode - SmartBox handles everything automatically
|
|
196
|
+
* <SmartBox
|
|
197
|
+
* aiAssistantConfig={{
|
|
198
|
+
* enabled: true,
|
|
199
|
+
* requestOptions: {
|
|
200
|
+
* url: '/api/ai/grid',
|
|
201
|
+
* timeout: 5000
|
|
202
|
+
* },
|
|
203
|
+
* promptSuggestions: ['Sort by price', 'Filter active items']
|
|
204
|
+
* }}
|
|
205
|
+
* searchConfig={{ enabled: true }}
|
|
206
|
+
* />
|
|
207
|
+
*
|
|
208
|
+
* // Controlled mode - SmartBox makes requests, you control loading state
|
|
209
|
+
* <SmartBox
|
|
210
|
+
* loading={isLoading}
|
|
211
|
+
* aiAssistantConfig={{
|
|
212
|
+
* enabled: true,
|
|
213
|
+
* requestUrl: '/api/ai/grid'
|
|
214
|
+
* }}
|
|
215
|
+
* onAIPromptRequest={(e) => setIsLoading(true)}
|
|
216
|
+
* onAIResponseSuccess={(e) => setIsLoading(false)}
|
|
217
|
+
* />
|
|
218
|
+
*
|
|
219
|
+
* // Manual mode - fully custom request handling
|
|
220
|
+
* <SmartBox
|
|
221
|
+
* loading={isLoading}
|
|
222
|
+
* aiAssistantConfig={{ enabled: true }}
|
|
223
|
+
* onAIPromptRequest={(e) => {
|
|
224
|
+
* setIsLoading(true);
|
|
225
|
+
* myCustomFetch(e.requestData).then(handleResponse);
|
|
226
|
+
* }}
|
|
227
|
+
* />
|
|
228
|
+
* ```
|
|
229
|
+
*/
|
|
230
|
+
export interface GridSmartBoxAIAssistantProps extends Omit<GridSmartBoxAIAssistantSearchProps, 'delay'> {
|
|
231
|
+
/**
|
|
232
|
+
* Configures the search mode settings.
|
|
233
|
+
* Can be a boolean to enable/disable or an object with detailed settings.
|
|
234
|
+
*
|
|
235
|
+
* @example
|
|
236
|
+
* ```tsx
|
|
237
|
+
* <SmartBox searchConfig={{ enabled: true, fields: ['name', 'description'], delay: 300 }} />
|
|
238
|
+
* ```
|
|
239
|
+
*/
|
|
240
|
+
searchConfig?: boolean | GridSmartBoxSearchProps;
|
|
241
|
+
/**
|
|
242
|
+
* Configures the semantic search mode settings.
|
|
243
|
+
* Can be a boolean to enable/disable or an object with detailed settings.
|
|
244
|
+
*
|
|
245
|
+
* @example
|
|
246
|
+
* ```tsx
|
|
247
|
+
* <SmartBox semanticSearchConfig={{ enabled: true, placeholder: 'Search with AI...' }} />
|
|
248
|
+
* ```
|
|
249
|
+
*/
|
|
250
|
+
semanticSearchConfig?: boolean | GridSmartBoxSemanticSearchConfigProps;
|
|
251
|
+
/**
|
|
252
|
+
* Configures the AI assistant mode settings.
|
|
253
|
+
* Can be a boolean to enable/disable or an object with detailed settings.
|
|
254
|
+
*
|
|
255
|
+
* @example
|
|
256
|
+
* ```tsx
|
|
257
|
+
* <SmartBox aiAssistantConfig={{
|
|
258
|
+
* enabled: true,
|
|
259
|
+
* requestUrl: '/api/ai/grid',
|
|
260
|
+
* promptSuggestions: ['Sort by price', 'Filter active items']
|
|
261
|
+
* }} />
|
|
262
|
+
* ```
|
|
263
|
+
*/
|
|
264
|
+
aiAssistantConfig?: boolean | GridSmartBoxAIAssistantConfigProps;
|
|
265
|
+
/**
|
|
266
|
+
* Sets the currently active mode.
|
|
267
|
+
*
|
|
268
|
+
* @example
|
|
269
|
+
* ```tsx
|
|
270
|
+
* <SmartBox activeMode="aiAssistant" />
|
|
271
|
+
* ```
|
|
272
|
+
*/
|
|
273
|
+
activeMode?: SmartBoxMode;
|
|
274
|
+
/**
|
|
275
|
+
* Sets the text direction.
|
|
276
|
+
*
|
|
277
|
+
* @default 'ltr'
|
|
278
|
+
*/
|
|
279
|
+
dir?: 'ltr' | 'rtl';
|
|
280
|
+
/**
|
|
281
|
+
* Sets the size of the SmartBox.
|
|
282
|
+
*
|
|
283
|
+
* @default 'medium'
|
|
284
|
+
*
|
|
285
|
+
* @example
|
|
286
|
+
* ```tsx
|
|
287
|
+
* <SmartBox size="large" />
|
|
288
|
+
* ```
|
|
289
|
+
*/
|
|
290
|
+
size?: 'small' | 'medium' | 'large';
|
|
291
|
+
/**
|
|
292
|
+
* Sets whether the SmartBox is in loading state.
|
|
293
|
+
* Use this for controlled mode to manage loading state externally.
|
|
294
|
+
*
|
|
295
|
+
* @example
|
|
296
|
+
* ```tsx
|
|
297
|
+
* <SmartBox loading={isLoading} onAIPromptRequest={() => setIsLoading(true)} />
|
|
298
|
+
* ```
|
|
299
|
+
*/
|
|
300
|
+
loading?: boolean;
|
|
301
|
+
/**
|
|
302
|
+
* Custom render function for prompt suggestions.
|
|
303
|
+
*
|
|
304
|
+
* @example
|
|
305
|
+
* ```tsx
|
|
306
|
+
* <SmartBox
|
|
307
|
+
* promptSuggestionRender={(suggestion, onClick) => (
|
|
308
|
+
* <li className="custom-suggestion" onClick={onClick}>{suggestion}</li>
|
|
309
|
+
* )}
|
|
310
|
+
* />
|
|
311
|
+
* ```
|
|
312
|
+
*/
|
|
313
|
+
promptSuggestionRender?: (suggestion: string, onClick: () => void) => React.ReactNode;
|
|
314
|
+
/**
|
|
315
|
+
* Custom render function for history items.
|
|
316
|
+
*
|
|
317
|
+
* @example
|
|
318
|
+
* ```tsx
|
|
319
|
+
* <SmartBox
|
|
320
|
+
* historyItemRender={(item, onClick) => (
|
|
321
|
+
* <li className="custom-history" onClick={onClick}>
|
|
322
|
+
* {item.text} - {item.timestamp.toLocaleString()}
|
|
323
|
+
* </li>
|
|
324
|
+
* )}
|
|
325
|
+
* />
|
|
326
|
+
* ```
|
|
327
|
+
*/
|
|
328
|
+
historyItemRender?: (item: HistoryItem, onClick: () => void) => React.ReactNode;
|
|
329
|
+
/**
|
|
330
|
+
* Props to pass to the TextBox component.
|
|
331
|
+
*/
|
|
332
|
+
textboxProps?: TextBoxProps;
|
|
333
|
+
/**
|
|
334
|
+
* Fires when the SmartBox popup opens.
|
|
335
|
+
*
|
|
336
|
+
* @example
|
|
337
|
+
* ```tsx
|
|
338
|
+
* <SmartBox onOpen={() => console.log('Popup opened')} />
|
|
339
|
+
* ```
|
|
340
|
+
*/
|
|
341
|
+
onOpen?: () => void;
|
|
342
|
+
/**
|
|
343
|
+
* Fires when the SmartBox popup closes.
|
|
344
|
+
*
|
|
345
|
+
* @example
|
|
346
|
+
* ```tsx
|
|
347
|
+
* <SmartBox onClose={() => console.log('Popup closed')} />
|
|
348
|
+
* ```
|
|
349
|
+
*/
|
|
350
|
+
onClose?: () => void;
|
|
351
|
+
/**
|
|
352
|
+
* Fires when the SmartBox input is focused.
|
|
353
|
+
*/
|
|
354
|
+
onFocus?: () => void;
|
|
355
|
+
/**
|
|
356
|
+
* Fires when the SmartBox input is blurred.
|
|
357
|
+
*/
|
|
358
|
+
onBlur?: () => void;
|
|
359
|
+
/**
|
|
360
|
+
* Fires when a search is performed in Search mode.
|
|
361
|
+
* The event contains the search value and filter descriptor.
|
|
362
|
+
*
|
|
363
|
+
* @example
|
|
364
|
+
* ```tsx
|
|
365
|
+
* <SmartBox
|
|
366
|
+
* onSearch={(event) => {
|
|
367
|
+
* console.log('Search value:', event.searchValue);
|
|
368
|
+
* // Prevent default filtering if needed
|
|
369
|
+
* event.preventDefault();
|
|
370
|
+
* }}
|
|
371
|
+
* />
|
|
372
|
+
* ```
|
|
373
|
+
*/
|
|
374
|
+
onSearch?: (event: GridSmartBoxSearchEvent) => void;
|
|
375
|
+
/**
|
|
376
|
+
* Fires when a search is performed in Semantic Search mode.
|
|
377
|
+
* The event contains the search value and filter descriptor.
|
|
378
|
+
*
|
|
379
|
+
* @example
|
|
380
|
+
* ```tsx
|
|
381
|
+
* <SmartBox
|
|
382
|
+
* onSemanticSearch={(event) => {
|
|
383
|
+
* console.log('Semantic search:', event.searchValue);
|
|
384
|
+
* }}
|
|
385
|
+
* />
|
|
386
|
+
* ```
|
|
387
|
+
*/
|
|
388
|
+
onSemanticSearch?: (event: GridSmartBoxSearchEvent) => void;
|
|
389
|
+
/**
|
|
390
|
+
* Fires when an AI prompt request is initiated.
|
|
391
|
+
* Use this callback to intercept requests, modify data, or handle requests manually.
|
|
392
|
+
*
|
|
393
|
+
* @example
|
|
394
|
+
* ```tsx
|
|
395
|
+
* // Controlled mode - intercept and modify request
|
|
396
|
+
* <SmartBox
|
|
397
|
+
* onAIPromptRequest={(event) => {
|
|
398
|
+
* console.log('Prompt:', event.requestData.promptMessage);
|
|
399
|
+
* setLoading(true);
|
|
400
|
+
* }}
|
|
401
|
+
* />
|
|
402
|
+
*
|
|
403
|
+
* // Manual mode - handle request yourself
|
|
404
|
+
* <SmartBox
|
|
405
|
+
* onAIPromptRequest={(event) => {
|
|
406
|
+
* fetch('/api/ai', {
|
|
407
|
+
* method: 'POST',
|
|
408
|
+
* body: JSON.stringify(event.requestData)
|
|
409
|
+
* }).then(handleResponse);
|
|
410
|
+
* }}
|
|
411
|
+
* />
|
|
412
|
+
* ```
|
|
413
|
+
*/
|
|
414
|
+
onAIPromptRequest?: (event: GridSmartBoxRequestEvent) => void;
|
|
415
|
+
/**
|
|
416
|
+
* Fires when an AI response is received successfully.
|
|
417
|
+
* Only fires in auto or controlled mode when a `requestUrl` is configured.
|
|
418
|
+
*
|
|
419
|
+
* @example
|
|
420
|
+
* ```tsx
|
|
421
|
+
* <SmartBox
|
|
422
|
+
* onAIResponseSuccess={(event) => {
|
|
423
|
+
* console.log('AI response:', event.response);
|
|
424
|
+
* setLoading(false);
|
|
425
|
+
* }}
|
|
426
|
+
* />
|
|
427
|
+
* ```
|
|
428
|
+
*/
|
|
429
|
+
onAIResponseSuccess?: (event: GridSmartBoxResponseSuccessEvent) => void;
|
|
430
|
+
/**
|
|
431
|
+
* Fires when an AI response returns an error.
|
|
432
|
+
* Only fires in auto or controlled mode when a `requestUrl` is configured.
|
|
433
|
+
*
|
|
434
|
+
* @example
|
|
435
|
+
* ```tsx
|
|
436
|
+
* <SmartBox
|
|
437
|
+
* onAIResponseError={(event) => {
|
|
438
|
+
* console.error('AI error:', event.error);
|
|
439
|
+
* setLoading(false);
|
|
440
|
+
* }}
|
|
441
|
+
* />
|
|
442
|
+
* ```
|
|
443
|
+
*/
|
|
444
|
+
onAIResponseError?: (event: GridSmartBoxResponseErrorEvent) => void;
|
|
445
|
+
/**
|
|
446
|
+
* Fires when an AI request is cancelled by the user.
|
|
447
|
+
* The user can cancel by clicking the stop button during loading.
|
|
448
|
+
*
|
|
449
|
+
* @example
|
|
450
|
+
* ```tsx
|
|
451
|
+
* <SmartBox
|
|
452
|
+
* onAICancelRequest={() => {
|
|
453
|
+
* console.log('Request cancelled');
|
|
454
|
+
* setLoading(false);
|
|
455
|
+
* }}
|
|
456
|
+
* />
|
|
457
|
+
* ```
|
|
458
|
+
*/
|
|
459
|
+
onAICancelRequest?: () => void;
|
|
460
|
+
}
|
|
461
|
+
export {};
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
export * from './SegmentedControlTypes.js';
|
|
9
|
+
export * from './SearchTypes.js';
|
|
10
|
+
export * from './SmartBoxTypes.js';
|
|
11
|
+
export * from './utilTypes.js';
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
/**
|
|
9
|
+
* @hidden
|
|
10
|
+
*/
|
|
11
|
+
export type BooleanOrConfig<T = {}> = boolean | T;
|
|
12
|
+
/**
|
|
13
|
+
* Configuration options for the SmartBox history feature.
|
|
14
|
+
*/
|
|
15
|
+
export interface GridSmartBoxHistoryProps {
|
|
16
|
+
/**
|
|
17
|
+
* Sets the maximum number of history items to store.
|
|
18
|
+
*/
|
|
19
|
+
size: number;
|
|
20
|
+
/**
|
|
21
|
+
* Sets the format string for displaying timestamps in history items.
|
|
22
|
+
* Uses Intl date format patterns (e.g., 'HH:mm', 'dd/MM/yyyy HH:mm').
|
|
23
|
+
*/
|
|
24
|
+
timestampFormat: string;
|
|
25
|
+
}
|
|
@@ -0,0 +1,165 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
import { ListItemProps, ListGroupItemProps } from '@progress/kendo-react-dropdowns';
|
|
9
|
+
import { SmartBoxMode, HistoryItem } from './interfaces/index.js';
|
|
10
|
+
import * as React from 'react';
|
|
11
|
+
/**
|
|
12
|
+
* Represents the configuration options for creating a custom list item render function.
|
|
13
|
+
* This interface is used to customize how items are rendered in the SmartBox dropdown list.
|
|
14
|
+
*
|
|
15
|
+
* @hidden
|
|
16
|
+
*/
|
|
17
|
+
interface CreateListItemRenderProps {
|
|
18
|
+
/**
|
|
19
|
+
* Specifies a custom render function for history items.
|
|
20
|
+
* When provided, this function will be used to render items that are marked as history items
|
|
21
|
+
* (items with `isHistoryItem: true` in their data).
|
|
22
|
+
*
|
|
23
|
+
* @param item - The history item containing text content and timestamp information.
|
|
24
|
+
* @param onClick - Callback function to handle click events on the history item.
|
|
25
|
+
* Invoke this to select the history item and populate the search input.
|
|
26
|
+
* @returns A React node representing the custom rendered history item.
|
|
27
|
+
*
|
|
28
|
+
* @example
|
|
29
|
+
* ```tsx
|
|
30
|
+
* historyItemRender={(item, onClick) => (
|
|
31
|
+
* <li className="custom-history-item" onClick={onClick}>
|
|
32
|
+
* <span>{item.text}</span>
|
|
33
|
+
* <span className="timestamp">{item.timestamp.toLocaleString()}</span>
|
|
34
|
+
* </li>
|
|
35
|
+
* )}
|
|
36
|
+
* ```
|
|
37
|
+
*/
|
|
38
|
+
historyItemRender?: (item: HistoryItem, onClick: () => void) => React.ReactNode;
|
|
39
|
+
/**
|
|
40
|
+
* Specifies a custom render function for prompt suggestions.
|
|
41
|
+
* When provided, this function will be used to render items that are not history items
|
|
42
|
+
* (e.g., AI prompt suggestions in the dropdown list).
|
|
43
|
+
*
|
|
44
|
+
* @param text - The text content of the prompt suggestion.
|
|
45
|
+
* @param onClick - Callback function to handle click events on the prompt suggestion.
|
|
46
|
+
* Invoke this to select the suggestion and populate the search input.
|
|
47
|
+
* @returns A React node representing the custom rendered prompt suggestion.
|
|
48
|
+
*
|
|
49
|
+
* @example
|
|
50
|
+
* ```tsx
|
|
51
|
+
* promptSuggestionRender={(text, onClick) => (
|
|
52
|
+
* <li className="custom-suggestion" onClick={onClick}>
|
|
53
|
+
* <span className="suggestion-icon">💡</span>
|
|
54
|
+
* <span>{text}</span>
|
|
55
|
+
* </li>
|
|
56
|
+
* )}
|
|
57
|
+
* ```
|
|
58
|
+
*/
|
|
59
|
+
promptSuggestionRender?: (text: string, onClick: () => void) => React.ReactNode;
|
|
60
|
+
/**
|
|
61
|
+
* Specifies the callback function to handle click events on list items.
|
|
62
|
+
* This function is called internally when a user clicks on any list item,
|
|
63
|
+
* populating the search input with the selected item's text.
|
|
64
|
+
*
|
|
65
|
+
* @param text - The text content of the clicked list item.
|
|
66
|
+
*/
|
|
67
|
+
handleListItemClick: (text: string) => void;
|
|
68
|
+
}
|
|
69
|
+
/**
|
|
70
|
+
* Creates a custom list item render function for the SmartBox dropdown.
|
|
71
|
+
* This factory function returns a render function that handles both history items
|
|
72
|
+
* and prompt suggestions with support for custom rendering.
|
|
73
|
+
*
|
|
74
|
+
* @param props - The configuration options for creating the list item render function.
|
|
75
|
+
* @returns A render function compatible with KendoReact ComboBox/DropDownList itemRender prop.
|
|
76
|
+
*
|
|
77
|
+
* @example
|
|
78
|
+
* ```tsx
|
|
79
|
+
* const itemRender = createListItemRender({
|
|
80
|
+
* historyItemRender: (item, onClick) => (
|
|
81
|
+
* <li onClick={onClick}>{item.text}</li>
|
|
82
|
+
* ),
|
|
83
|
+
* handleListItemClick: (text) => console.log('Selected:', text)
|
|
84
|
+
* });
|
|
85
|
+
* ```
|
|
86
|
+
*
|
|
87
|
+
* @hidden
|
|
88
|
+
*/
|
|
89
|
+
export declare function createListItemRender({ historyItemRender, promptSuggestionRender, handleListItemClick }: CreateListItemRenderProps): (li: React.ReactElement<any>, itemProps: ListItemProps) => string | number | bigint | boolean | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | React.ReactElement<any, string | React.JSXElementConstructor<any>> | null | undefined;
|
|
90
|
+
/**
|
|
91
|
+
* Renders a list item for search mode selection in the SmartBox.
|
|
92
|
+
* Displays a check icon for the currently selected mode and shows
|
|
93
|
+
* both the mode name and description.
|
|
94
|
+
*
|
|
95
|
+
* @param li - The React element representing the list item container.
|
|
96
|
+
* @param itemProps - The props for the list item including the data item.
|
|
97
|
+
* @returns A cloned React element with the customized content.
|
|
98
|
+
*
|
|
99
|
+
* @example
|
|
100
|
+
* ```tsx
|
|
101
|
+
* <ComboBox itemRender={searchModeItemRender} />
|
|
102
|
+
* ```
|
|
103
|
+
* @hidden
|
|
104
|
+
*/
|
|
105
|
+
export declare function searchModeItemRender(li: React.ReactElement<any>, itemProps: ListItemProps): React.ReactElement<any, string | React.JSXElementConstructor<any>>;
|
|
106
|
+
/**
|
|
107
|
+
* Renders a group header item in the SmartBox dropdown list.
|
|
108
|
+
* Displays an optional SVG icon followed by the group name.
|
|
109
|
+
* Used for visually separating different categories of items (e.g., history vs suggestions).
|
|
110
|
+
*
|
|
111
|
+
* @param li - The React element representing the group header container.
|
|
112
|
+
* @param groupProps - The props for the group item including group name and optional icon.
|
|
113
|
+
* @returns A cloned React element with the customized group header content.
|
|
114
|
+
*
|
|
115
|
+
* @example
|
|
116
|
+
* ```tsx
|
|
117
|
+
* <ComboBox groupHeaderItemRender={listGroupHeaderRender} />
|
|
118
|
+
* ```
|
|
119
|
+
* @hidden
|
|
120
|
+
*/
|
|
121
|
+
export declare function listGroupHeaderRender(li: React.ReactElement<HTMLLIElement>, groupProps: ListGroupItemProps): React.ReactElement<HTMLLIElement, string | React.JSXElementConstructor<any>>;
|
|
122
|
+
/**
|
|
123
|
+
* Represents the props for the NoDataRender component.
|
|
124
|
+
* This component displays a message when there are no items to show in the SmartBox dropdown,
|
|
125
|
+
* such as when there is no search history or no matching results.
|
|
126
|
+
*
|
|
127
|
+
* @hidden
|
|
128
|
+
*/
|
|
129
|
+
interface NoDataRenderProps {
|
|
130
|
+
/**
|
|
131
|
+
* Specifies the currently selected SmartBox mode.
|
|
132
|
+
* Used to determine the appropriate "no data" message to display based on the active context.
|
|
133
|
+
*
|
|
134
|
+
* The available options are:
|
|
135
|
+
* - `'aiAssistant'` - Displays "No previous prompts" message for AI assistant mode.
|
|
136
|
+
* - `'search'` - Displays "No previous searches" message for standard search mode.
|
|
137
|
+
* - `'semanticSearch'` - Displays "No previous searches" message for semantic search mode.
|
|
138
|
+
* - `null` - Defaults to displaying "No previous searches" message.
|
|
139
|
+
*
|
|
140
|
+
* @example
|
|
141
|
+
* ```tsx
|
|
142
|
+
* <NoDataRender selectedView="aiAssistant" />
|
|
143
|
+
* ```
|
|
144
|
+
*/
|
|
145
|
+
readonly selectedView: SmartBoxMode | null;
|
|
146
|
+
}
|
|
147
|
+
/**
|
|
148
|
+
* Renders a "no data" message when the SmartBox dropdown has no items to display.
|
|
149
|
+
* Shows an icon and localized message based on the currently selected SmartBox mode.
|
|
150
|
+
*
|
|
151
|
+
* @param props - The component props.
|
|
152
|
+
* @returns A React element displaying the appropriate "no data" message.
|
|
153
|
+
*
|
|
154
|
+
* @example
|
|
155
|
+
* ```tsx
|
|
156
|
+
* <NoDataRender selectedView="aiAssistant" />
|
|
157
|
+
* // Displays: "No previous prompts"
|
|
158
|
+
*
|
|
159
|
+
* <NoDataRender selectedView="search" />
|
|
160
|
+
* // Displays: "No previous searches"
|
|
161
|
+
* ```
|
|
162
|
+
* @hidden
|
|
163
|
+
*/
|
|
164
|
+
export declare function NoDataRender({ selectedView }: NoDataRenderProps): React.JSX.Element;
|
|
165
|
+
export {};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react"),c=require("@progress/kendo-react-common"),i=require("@progress/kendo-svg-icons"),p=require("@progress/kendo-react-intl"),o=require("../../messages/index.js");function d(t){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const n in t)if(n!=="default"){const s=Object.getOwnPropertyDescriptor(t,n);Object.defineProperty(a,n,s.get?s:{enumerable:!0,get:()=>t[n]})}}return a.default=t,Object.freeze(a)}const e=d(u);function g({historyItemRender:t,promptSuggestionRender:a,handleListItemClick:n}){return(s,l)=>{const r=l.dataItem;return r.isHistoryItem&&t?t({text:r.text,timestamp:r.timestamp},()=>n(r.text)):!r.isHistoryItem&&a?a(r.text,()=>n(r.text)):e.cloneElement(s,{...s.props,title:r.text,onMouseDown:m=>m.preventDefault()},e.createElement(e.Fragment,null,e.createElement("span",{className:"k-list-item-text"},r.text),r.description&&e.createElement("span",{className:"k-list-item-description"},r.description)))}}function x(t,a){const n=a.dataItem;return e.cloneElement(t,{...t.props,onMouseDown:s=>s.preventDefault()},e.createElement(e.Fragment,null,n.selected&&e.createElement("span",{className:"k-list-item-icon-wrapper"},e.createElement(c.IconWrap,{className:"k-list-item-icon k-smart-box-check-icon",icon:i.checkIcon})),e.createElement("span",{className:"k-list-item-text"},n.text),e.createElement("span",{className:"k-list-item-description"},n.description)))}function f(t,a){const n=a.groupItem,s=n==null?void 0:n.groupSvgIcon;return e.cloneElement(t,t.props,e.createElement(e.Fragment,null,s&&e.createElement("span",{className:"k-list-item-icon-wrapper"},e.createElement(c.IconWrap,{className:"k-list-item-icon",icon:s})),e.createElement("span",{className:"k-list-item-text"},a.group)))}function k({selectedView:t}){const a=p.useLocalization();return e.createElement("span",{className:"k-no-data k-smart-box-no-data"},e.createElement(c.IconWrap,{icon:i.fileClockOutlineIcon,size:"xxxlarge"}),e.createElement("span",null,t==="aiAssistant"?a.toLanguageString(o.smartBoxNoPreviousPrompts,o.messages[o.smartBoxNoPreviousPrompts]):a.toLanguageString(o.smartBoxNoPreviousSearches,o.messages[o.smartBoxNoPreviousSearches])))}exports.NoDataRender=k;exports.createListItemRender=g;exports.listGroupHeaderRender=f;exports.searchModeItemRender=x;
|